@charset "UTF-8";

/*--------------------------------
reset
--------------------------------*/
html,body,div,p,img,iframe,a,span,blockquote,q,address,cite,
pre,code,em,small,strong,b,i,
header,article,section,nav,figure,figcaption,hgroup,menu,aside,footer,time,
h1,h2,h3,h4,h5,h6,
ul,ol,li,dl,dt,dd,
table,tbody,thead,tfoot,th,tr,td,
form,fieldset,legend,label,select,input,textarea,button{
    margin: 0;
    padding: 0;
    border: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: baseline;
}
header,article,section,nav,figure,figcaption,hgroup,menu,aside,footer{
    display: block;
}
ul li{
    list-style-type: none;
}
h1,h2,h3,h4,h5,h6{
    font-weight: 500;
}
body{
    line-height: 1;
}
a{
    text-decoration: none;
}
img{
    vertical-align: middle;
}
table{
    border-collapse: collapse;
    border-spacing: 0;
}
select,option,input:not([type=checkbox]):not([type=radio]),textarea,button{
    font: inherit;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
}
blockquote::before,blockquote::after,q::before,q::after{
    content: '';
    content: none;
}
[type=submit],[type=button],[type=reset],[type=file],button{
    cursor: pointer;
}
:focus{
    outline: none;
}

body{
    margin: 0;
    font-size: 16px;
    color: #fff;
    line-height: 1.7;
    font-family: 'Noto Sans JP', sans-serif
}

body a, body button, body input, body select {
    outline: 0;
    text-decoration: none
}

body img {
    max-width: 100%
}

.section-06 {
    /*width: 45%;*/
    padding-bottom: 60px;
    background: url("../img/news_back-min.webp") no-repeat;
}
.align-items-center {
    text-align: center;
}

.section-06-title {
    font-size: 35px;
    color: #2b7bb9;
    text-align: center;
    margin-bottom: 20px;
}

.section-06-subtitle {
    font-family: 'rounded-mplus', sans-serif;
    font-size: 35px;
    color: #2d2d2d;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 50px;
    letter-spacing: 2px;
}

.twitter-guidance {
    font-family: 'rounded-mplus', sans-serif;
    margin: 0 auto;
    margin-bottom: 30px;
    color: #2d2d2d;
    font-size: 45px;
    text-align: center;
}

.fee-description {
    background: url("../img/");
    text-align: center;
}

.price-title,
.counselor-title{
    margin-bottom: 10px;
    text-align: center;
    color: #2d2d2d;
}

.base-container {
    width: 100%;
    max-width: 1230px;
    /*padding: 0 30px;*/
    margin: auto
}

.fee-container {
    width: 100%;
    max-width: 1230px;
    padding: 0 30px;
    margin: auto
}
.pc-only {
    display: inline-block;
}

.mobile-only {
    display: none;
}

.english-title {
    /*color: ;*/
}

.header-logo {
    text-align: center;
    background: url("../img/top_header-min.webp") no-repeat;
    background-size: cover;
}

.lismi-logo {
    padding: 20px;
    max-width: 240px;
}

.nav-link-menu {
    position: absolute;
    top: 0;
    display: flex;
    /* align-items: flex-end; */
    padding: 3%;
    width: 59vw;
    line-height: 1;
}

.nav-link-menu a {
    margin-right: 30px;
    height: 7vw;
    display: inline-block;
    text-align: center;
}
.nav-link-menu a img{
    height: 100%;
    object-fit: contain;
}
.nav-link-menu span {
    font-size: 1.8vw;
    font-family: 'rounded-mplus', sans-serif;
}

.section-02 {
    margin-bottom: 150px;
    background: url("../img/about_back-min.webp") no-repeat;
    /* min-height: 2420px; */
    background-size: 100%;
}

.about-separation-bar {
    margin: 150px 0;
}

.about-title {
    margin-top: 0;
    margin-bottom: 20px;
    text-align: center;
}

.section-04 {
    background-image: url("../img/environment_back-min-line.webp"), url("../img/environment_back-min-line.webp"), url("../img/environment_back-min.webp");
    background-repeat: no-repeat, no-repeat, repeat-y;
    background-position: top center, center bottom, top center;
    background-size: 100%, 100%, 100%;
    position: relative;
    text-align: center;
}

.news-title {
    margin-bottom: 30px;
    text-align: center;
    color: #2d2d2d;
    padding-top: 50px;
}

.news-detail {
    background: url("../img/news_frame-min.webp") no-repeat;
    background-position: right 50% bottom 60%;
    background-size: 400px;
    min-height: 450px;
}
.environment-wrap {
    /* position: absolute; */
    top: 50%;
    left: 50%;
    /* transform: translate(-50%, -50%); */
    padding-top: 0;
}

.youtube-movie-wrap {
    width: 45%;
    margin: 0 auto;
}

.twitter-timeline-wrap {
    width: 500px;
    margin: 0 auto;
}

#landing_wrapper .main {
    overflow: hidden
}

#landing_wrapper .main__section .content-title {
    font-size: 3.5rem;
    font-weight: normal;
    text-align: center;
    line-height: 1.5;
    color: #2d2d2d;
    letter-spacing: 2px;
    margin: 0 0 25px;
}

#landing_wrapper .main__section .section-content {
    padding-top: 100px;
}

#landing_wrapper .main__section.section-04 .section-content {
    padding-bottom: 170px;
}

#landing_wrapper .main__section .content-img {
    width: 470px;
    max-width: 100%
}

#landing_wrapper .main__section .content-img img {
    width: 100%;
    height: auto
}



#landing_wrapper .main__section .content-detail {
    /*max-width: 500px*/
}

#landing_wrapper .main__section .content-detail .content-info {
    text-align: center;
    font-size: 22px;
    color: #333;
    line-height: 2;
}

#landing_wrapper .main__section .content-detail .content-info span {
    display: inline-block;
    margin-left: -9px
}



#landing_wrapper .main__section.section-01 {
    background: url("../img/top_back-min.webp") no-repeat;
    background-size: cover;
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 0;
    background-position: center center;
    padding-top: 66.6666666667%;
}

#landing_wrapper .main__section.section-01 .section-logo {
    margin-bottom: 120px;
}
#landing_wrapper .main__section.section-01 .section-content .action-group a {
    margin: 0 8px;
}
@media screen and (max-width: 767px) {

}

#landing_wrapper .main__section.section-01 .section-logo img {
    /*height: 200px;*/
    /*width: auto*/
}

#landing_wrapper .main__section.section-01 .section-content {
    /* max-width: 36vw; */
    margin-right: auto;
    text-align: center;
    color: #333;
    padding-top: 0;
    width: 43vw;
    position: absolute;
    top: 30%;
    left: 7%;
}

#landing_wrapper .main__section.section-01 .section-content h3 {
    font-size: 46px;
    font-weight: 600;
    margin-bottom: 20px;
    line-height: 1.5
}

#landing_wrapper .main__section.section-01 .section-content h5 {
    font-size: 22px;
    margin-bottom: 40px;
    line-height: 1.5
}

#landing_wrapper .main__section.section-01 .section-content .action-group img {
    /* height: 76px; */
    /* width: auto; */
    /* margin: -2px 15px -1px 15px; */
}

#landing_wrapper .main__section.section-01 .section-content .action-group a, #landing_wrapper .main__section.section-01 .section-content .action-group span {
    display: inline-block;
    position: relative;
    overflow: hidden
}

#landing_wrapper .main__section.section-01 .section-content .action-group a.comming-soon {
    cursor: no-drop
}

#landing_wrapper .main__section.section-01 .section-content .action-group a.comming-soon:after, #landing_wrapper .main__section.section-01 .section-content .action-group span.comming-soon:after {
    content: "Coming Soon";
    display: block;
    text-align: center;
    height: 1.4rem;
    position: absolute;
    background: red;
    color: #fff;
    -webkit-transform: rotateZ(-37deg);
    -moz-transform: rotateZ(-37deg);
    -ms-transform: rotateZ(-37deg);
    -o-transform: rotateZ(-37deg);
    transform: rotateZ(-37deg);
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    font-size: 12px;
    font-weight: 600
}

#landing_wrapper .main__section.section-01 .section-content .link-to-lismi-job {
    /*background: url("../img/top_frame-min.webp") no-repeat;*/
    margin-top: 70px;
}

#landing_wrapper .main__section.section-01 .section-content .link-to-lismi-job a {
    font-size: 15px;
    color: #2fced5;
    text-decoration: underline
}

#landing_wrapper .main__section.section-02 .content-img {
    width: 632px
}

#landing_wrapper .main__section.section-03 {
    background: url("../img/howto-min.webp") no-repeat;
    /* min-height: 2900px; */
    background-size: 100%;
}

.howto-title {
    font-size: 10rem;
    color: #b48d4a;
}

#landing_wrapper .main__section.section-05 {
    padding: 60px 0;
    background: url("../img/price_back-min.webp") no-repeat;
    background-size: cover;
    color: #2d2d2d;
}

#landing_wrapper .main__section.section-05 .about-fee {
    margin: 0 auto
}

#landing_wrapper .main__section.section-05 .fee-title {
    font-weight: bolder;
    text-align: center;
    font-size: 35px;
    margin-bottom: 20px;
}

#landing_wrapper .main__section.section-05 .fee-description-back {
    padding: 180px 210px;
    font-size: 20px;
    background: url("../img/price_frame2-min.webp") no-repeat center;
    background-size: contain;
    position: relative;
}

.fee-description-content {
    font-size: 2rem;
    /* position: absolute; */
    /* top: 20%; */
    /* left: 20%; */
    line-height: 100px;
    font-family: 'rounded-mplus', sans-serif;
}
.footer__list-action {
    display: flex;
    justify-content: center;
}
#landing_wrapper .footer {
    /*background: linear-gradient(to bottom, #00c4cc, #36a8bd)*/
    background: url("../img/footer-min.webp") no-repeat;
    background-size: cover;
    font-family: 'rounded-mplus', sans-serif;
}

#landing_wrapper .footer__list-action {
    padding: 25px 0;
    border-bottom: 1px solid #fff
}

#landing_wrapper .footer__list-action .sp {
    display: none
}

#landing_wrapper .footer__list-action a {
    color: #fff;
    line-height: 1
}

#landing_wrapper .footer__list-action span {
    display: block;
    width: 2px;
    background: #fff;
    margin: 0 20px
}

#landing_wrapper .footer__inc {
    font-size: 14px;
    color: #fff;
    text-align: center;
    padding: 20px
}
.btn-box{
    position: relative;
}
.btn-box::after,
.btn::before,
.btn::after{
    margin: auto;
    content: "";
    position: absolute;
}
.btn-box::after{
    border: solid 2px #ffffff;
    border-radius: 8px;
    top: 8px;
    left: 8px;
    right: 8px;
    bottom: 8px;
    pointer-events: none;
}
.btn{
    padding: 16px 96px 16px 36px;
    display: block;
    background: linear-gradient(to right, rgb(198 180 132) 0%,rgb(161 139 106) 100%);
    box-shadow: 0 0 8px white, 0 0 8px white, 0 0 8px white;
    border-radius: 16px;
    position: relative;
    font-size: 40px;
    font-weight: bold;
    font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
    color: #ffffff;
}
.btn:hover{
    color: #ffffff;
}
.btn:active{
    background: linear-gradient(to right, rgb(198 180 132) 0%,rgb(161 139 106) 100%)!important;
}
.btn::before{
    width: 50px;
    height: 50px;
    background: #ffffff;
    border-radius: 50px;
    top: 0;
    right: 25px;
    bottom: 0;
}
.btn::after{
    height: 0;
    border: solid 14px transparent;
    border-left: solid 22px #baa380;
    top: 0;
    right: 22px;
    bottom: 0;
}
.fee-container .btn-box {
    margin: 50px 200px 0;
}
.fee-container .btn-box .btn{
    font-size: 50px
}
.fee-container .btn-box .btn::before{
    width: 60px;
    height: 60px;
}
.fee-container .btn-box .btn::after{
    border: solid 16px transparent;
    border-left: solid 26px #baa380;
    right: 22px;
    font-size: 50px
}

@media screen and (max-width: 1229px) {
    #landing_wrapper .main__section .content-title {
        font-size: 30px
    }
    #landing_wrapper .main__section .section-content {
        padding-top: 60px
    }
    #landing_wrapper .main__section .content-img {
        overflow: hidden
    }
    #landing_wrapper .main__section .content-detail {
        /* padding-left: 40px; */
    }
    #landing_wrapper .main__section .content-detail.section-02-child {
        padding-left: 0;
        padding-right: 40px
    }
    #landing_wrapper .main__section .content-detail .content-info {
        font-size: 18px
    }
    #landing_wrapper .main__section.section-01 {
        min-height: 800px
    }
    #landing_wrapper .main__section.section-01 .section-content {
        max-width: 560px;
    }
    #landing_wrapper .main__section.section-01 .section-content h3 {
        font-size: 40px
    }
    #landing_wrapper .main__section.section-01 .section-content h5 {
        font-size: 20px
    }
}
@media screen and (max-width: 767px) {
    .about-title {
        margin: 20px auto;
        width: 130px;
        color: #7096a8;
    }
    .about-separation-bar {
        margin: 35px 0;
    }
    .section-04 {
        background-image: url("../img/environment_back_sp-min-line.webp"), url("../img/environment_back_sp-min-line.webp"), url("../img/environment_back_sp-min.webp");
        background-repeat: no-repeat, no-repeat, repeat-y;
        background-position: top center, center bottom, top center;
        background-size: 100%, 100%, 100%;
        position: relative;
    }
    .news-title {
        margin: 20px auto;
        width: 90px;
        color: #2d2d2d;
        padding-top: 0;
    }
    .news-detail {
        background: url("../img/news_frame_sp-min.webp") no-repeat;
        background-position: right 50% top -20%;
        background-size: 220px;
        min-height: 230px;
    }
    .environment-wrap {
        position: static;
        top: 50%;
        left: 50%;
        transform: translate(0%, 0%);
        padding-top: 0;
    }
    .base-container {
        padding: 0 15px;
        width: inherit;
    }
    .section-06 {
        width: 100%;
        padding-bottom: 30px;
    }
    .section-06-title {
        color: #2b7bb9;
        text-align: center;
        font-size: 18px;
        margin-bottom: 5px;
    }
    .section-06-subtitle {
        font-size: 18px;
        color: #2d2d2d;
        text-align: center;
        margin-top: 10px;
    }
    .pc-only {
        display: none!important;
    }

    .mobile-only {
        display: inline-block;
    }
    .fee-container {
        padding: 0 15px;
    }
    .youtube-movie-wrap {
        width: 80%;
        margin: 0 auto;
    }
    .twitter-timeline-wrap {
        width: 80%;
        margin: 0 auto;
    }
    #landing_wrapper .main__section .content-title {
        font-size: 21px;
        padding-top: 20px;
        text-align: center;
        white-space: nowrap;
    }
    #landing_wrapper .main__section .section-content {
        padding-top: 40px;
    }
    #landing_wrapper .main__section.section-04 .section-content {
        padding-bottom: 40px;
    }
    #landing_wrapper .main__section .content-img img {
        padding-top: 30px
    }
    #landing_wrapper .main__section .content-detail {
        padding-left: 0
    }
    #landing_wrapper .main__section .content-detail .content-info {
        font-size: 16px;
        padding: 0 10px;
    }
    #landing_wrapper .main__section .base-container.d-flex {
        flex-direction: column-reverse
    }
    #landing_wrapper .main__section.section-01 .section-logo {
        margin-bottom: 20px;
        /*text-align: left;*/
        /* padding-top: 30px; */
        position: relative;
        left: -100px;
        padding-left: 0;
    }
    #landing_wrapper .main__section.section-01 {
        min-height: 450px;
        background: url("../img/top_back_sp-min.webp") no-repeat;
        background-size: auto 100%;
        background-position: right bottom;
        padding: 0;
    }

    #landing_wrapper .main__section.section-01 .section-logo img {
        height: 150px;
        width: auto
    }

    #landing_wrapper .main__section.section-01 .section-content {
        max-width: 100%;
        margin: auto;
        width: auto;
        position: static;
    }

    #landing_wrapper .main__section.section-01 .section-content h3 {
        font-size: 26px
    }

    #landing_wrapper .main__section.section-01 .section-content h5 {
        font-size: 18px;
        max-width: 430px;
        margin: auto;
        padding-bottom: 35px
    }

    #landing_wrapper .main__section.section-01 .section-content .action-group img {
        height: 43px;
        width: auto
    }
    .twitter-guidance {
        font-size: 23px;
    }
    .price-title {
        margin: 0 auto 10px;
        width: 90px;
    }
    .counselor-title{
        margin: 0 auto 10px;
        width: 160px;
    }
    .header-logo {
        background: url("../img/top_header_sp-min.webp") no-repeat;
    }
    .lismi-logo {
        max-width: 150px;
    }
    .nav-link-menu {
        width: 324px;
        position: absolute;
        top: 1%;
        left: 16px;
        right: 16px;
        display: flex;
        top: 16px;
        margin: 0 auto;
        line-height: 1;
        white-space: nowrap;
        padding: 0;
    }
    .nav-link-menu a {
        margin-right: 10px;
        height: 40px;
        text-align: center;
        color: #2d2d2d;
        font-family: monteCarlo;
        font-size: 1.3rem;
    }
    .nav-link-menu span {
        font-size: 0.5rem;
        font-family: 'rounded-mplus', sans-serif;
    }
    .section-02 {
        margin-bottom: 40px;
        background: url("../img/about_back_sp-min.webp") no-repeat;
        /* min-height: 1700px; */
        background-size: 100%;
    }
    #landing_wrapper .main__section.section-03 {
        background: url("../img/howto_sp-min.webp") no-repeat;
        /* min-height: 1853px; */
        background-size: 100%;
    }
    #landing_wrapper .main__section.section-05 {
        padding: 30px 0;
        background: url("../img/price_back_sp-min.webp") no-repeat;
        background-size: cover;
    }
    #landing_wrapper .main__section.section-03 .base-container.d-flex {
        flex-direction: column-reverse !important
    }

    .fee-description-content {
        font-size: 1.05rem;
        /* position: absolute; */
        /* top: 13%; */
        /* left: 12%; */
        line-height: 40px;
    }

    #landing_wrapper .main__section.section-05 .fee-description-back {
        padding: 60px 0;
        display: flex;
        justify-content: center;
        font-size: 20px;
        background: url("../img/price_frame2_sp-min.webp") no-repeat center;
        height: auto;
        background-size: 330px;
        position: relative;
    }
    #landing_wrapper .footer__list-action {
        padding: 20px 0;
        display: block !important;
        text-align: center
    }

    #landing_wrapper .footer__list-action .pc {
        display: none !important
    }

    #landing_wrapper .footer__list-action .sp {
        display: block
    }

    #landing_wrapper .footer__list-action a {
        font-size: 14px;
        display: inline-block !important
    }

    #landing_wrapper .footer__list-action span {
        display: inline-block !important;
        width: unset;
        margin: 0 15px;
        position: relative
    }

    #landing_wrapper .footer__list-action span:after {
        content: "";
        display: block;
        position: absolute;
        width: 1px;
        height: 1rem;
        background: #fff;
        bottom: -3px
    }

    #landing_wrapper .footer__inc {
        font-size: 12px
    }
    .mobile-store-link {
        display: flex;
        flex-flow: column;
        position: relative;
        left: -100px;
    }
    .btn {
        padding: 16px 54px 16px 16px;
        font-size: 24px;
    }
    .btn-box {
        position: absolute;
        left: 16px;
        right: 16px;
        bottom: 24px;
    }
    .btn::before {
        width: 30px;
        height: 30px;
        border-radius: 30px;
        right: 21px;
    }
    .btn::after {
        border: solid 8px transparent;
        border-left: solid 13px #baa380;
        right: 20px;
    }
    .fee-container .btn-box {
        position: relative;
    }
    .fee-container .btn-box {
        margin: 50px 0 0;
        left: 0;
    }
    .fee-container .btn-box .btn {
        padding: 16px 52px 16px 16px;
        font-size: 24px;
    }
    .fee-container .btn-box .btn::before {
        width: 30px;
        height: 30px;
        border-radius: 30px;
        right: 17px;
    }
    .fee-container .btn-box .btn::after {
        border: solid 8px transparent;
        border-left: solid 13px #baa380;
        right: 16px;
    }
}
@media screen and (min-width: 768px) and (max-width: 1229px){
    .nav-link-menu {
        padding: 4% 3%;
        width: 72vw;
    }
    #landing_wrapper .main__section.section-01 .section-content {
        width: 55vw;
        top: 210px;
        left: 2%;
    }
    #landing_wrapper .main__section.section-01 .section-logo {
        margin-bottom: 40px;
    }
    #landing_wrapper .main__section.section-04 .section-content {
        padding-bottom: 90px;
    }
    .fee-description-content {
        font-size: 1.4rem;
        /* position: absolute; */
        /* top: 16%; */
        /* left: 9%; */
        line-height: 2.5;
    }
    #landing_wrapper .main__section.section-05 .fee-description-back {
        padding: 120px 90px;
        display: flex;
        justify-content: center;
    }
    #landing_wrapper .footer__list-action {
        padding: 20px;
        display: block !important;
        text-align: center;
    }
    #landing_wrapper .footer__list-action span {
        display: inline-block !important;
        width: unset;
        margin: 0 15px;
        position: relative
    }
    #landing_wrapper .footer__list-action span:after {
        content: "";
        display: block;
        position: absolute;
        width: 1px;
        height: 1rem;
        background: #fff;
        bottom: -3px
    }
    .btn-box {
        margin: 0 16px;
    }
    .btn {
        padding: 16px 66px 16px 16px;
        font-size: 30px;
    }
    .btn::before {
        width: 40px;
        height: 40px;
        border-radius: 40px;
        right: 20px;
    }
    .btn::after {
        border: solid 11px transparent;
        border-left: solid 18px #baa380;
        right: 17px;
    }
    .fee-container .btn-box {
        margin: 50px 100px 0;
    }
    .fee-container .btn-box .btn {
        font-size: 38px;
    }
    .fee-container .btn-box .btn::before {
        width: 45px;
        height: 45px;
    }
    .fee-container .btn-box .btn::after {
        border: solid 12px transparent;
        border-left: solid 20px #baa380;
        right: 18px;
    }
}