@charset "UTF-8";

@media screen and (min-width: 768px) {
  .sp {
    display: none !important;
  }
}

html{
    /* font-size: 62,5%; */
}
main{
    font-family: "Zen Maru Gothic", 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', "Meiryo", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-optical-sizing: auto;
    color: #1a1a1a;
    letter-spacing: 0.06em;
    line-height: 1;
    background-color: #fff;
    scroll-behavior: smooth;
    display: block;
}
main sup{
    font-size: 60%;
}
main a{
    display: block;
}
main picture, main img{
    display: block;
    max-width: 100%;
}
/* sect01 02*/
main .fs-sect01,main .fs-sect02{
    background-repeat: no-repeat;
    background-size: cover;
    padding: 7.32064422vw 0;
}
main .fs-sect01{
    background-image: url(/-/media/com/mentholatumlip/assets/img/bg01.jpg);
}
main .fs-sect02{
    background-image: url(/-/media/com/mentholatumlip/assets/img/bg02.jpg);
}

main .fs-sect01 h2 ,main .fs-sect02 h2{
    margin: 0 auto 3.66032211vw;
    max-width: 329px;
    width: 24.0849195vw;
}

main .fs-sect01-img01{
    margin: 0 auto 2.56222548vw;
    max-width: 410px;
    width: 30.0146413vw;
}
main .fs-sect02-img02{
    margin: 0 auto 2.56222548vw;
    max-width: 620px;
    width: 45.3879941vw;
}
main .fs-sect01-prod-name, main .fs-sect02-prod-name{
    text-align: center;
    padding-bottom: 1.17130307vw;
    font-size: clamp(1rem, 1.9033675vw, 2.6rem);
}
main .fs-sect02-prod-name-small{
    display: block;
    padding-top: 1.17130307vw;
    padding-bottom: 0.585651537vw;
    font-size: clamp(1rem, 1.09809663vw, 1.5rem);
}
main .fs-sect01-prod-gram, main .fs-sect02-prod-gram{
    text-align: center;
    font-weight: 400;
    font-size: clamp(1rem, 1.09809663vw, 1.5rem);
}
main .fs-sect01-cta a ,main .fs-sect02-cta a{    
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top center;
    margin: 2.34260615vw auto 0;
    padding: 1.31771596vw 0 1.24450952vw;
    max-width: 300px;
    width: 21.9619327vw;
    height: 3.66032211vw;
    text-align: center;
    font-size: clamp(1rem, 1.17130307vw, 1.6rem);
    line-height: 0.8;
    transition: opacity 0.3s ease;
}
main .fs-sect01-cta a{
    background-image: url(/-/media/com/mentholatumlip/assets/img/cta01.png);
    color: #191877;
}
main .fs-sect02-cta a{
    background-image: url(/-/media/com/mentholatumlip/assets/img/cta02.png);
    color: #fff;
}
/* sect03 */
main .fs-sect03{
    background-image: url(/-/media/com/mentholatumlip/assets/img/bg03.png);
    background-repeat: no-repeat;
    background-size: 43.3382138vw;
    background-position: top right;
    padding: 9.51683748vw 0 7.32064422vw;
}
main .fs-sect03 h2{
    margin-bottom: 4.09956076vw;
    text-align: center;
    font-size: clamp(1rem, 2.63543192vw, 3.6rem);
    line-height: 1.35;
    font-weight: 500;
}
main .fs-sect03 h2 span{
    display: block;
    font-size: clamp(1rem, 3.5139022vw, 4.8rem);
    color: #00856b;
}
main .fs-sect03 .fs-sect03-list {
    margin: 0 auto;
    max-width: 800px;
    width: 58.5651537vw;
}
main .fs-sect03 .fs-sect03-list li{
    background-color: #e9f5f4;
    margin-bottom: 5.12445095vw;
    padding-top: 4.39238653vw;
    border-radius: 1.46412884vw;
    text-align: center;
}
main .fs-sect03 .fs-sect03-list li h3{
    margin-bottom: 2.92825769vw;
    font-size: clamp(1rem, 1.9033675vw, 2.6rem);
    color: #00856b;
    font-weight: 500;
}
main .fs-sect03 .fs-sect03-list li p{
    margin-bottom: 1.75695461vw;
    font-size: clamp(1rem, 1.46412884vw, 2rem);
    line-height: 1.25;
}
main .fs-sect03-list-01, .fs-sect03-list-02, .fs-sect03-list-03, .fs-sect03-list-04{
    position: relative;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-01 .fs-sect03-list-01-prod01{
    margin: 0 auto;
    max-width: 384px;
    width: 28.1112738vw;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-illustration{
    position: absolute;
    top: -3.66032211vw;
    left: 0;
    right: 0;
    margin: auto;
    max-width: 100px;
    width: 7.32064422vw;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-01 .fs-sect03-list-01-small{
    padding: 1.09809663vw 2.34260615vw 2.19619327vw 0;
    text-align: right;
    font-size: clamp(0.8rem, 0.951683748vw, 1.3rem);
    font-weight: 400;
}

main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul{
    display: flex;
    justify-content: center;
    padding-bottom: 4.09956076vw;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul li{
    margin: 0; 
    padding-top: 0;
    padding-left: 2.34260615vw;
    width: fit-content;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul li:nth-child(1){
    border-radius: 0;
    border-right: 1px solid #b8ded9;
    padding-left: 0;
    padding-right: 2.34260615vw;
}

main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul li .fs-sect03-list-01-prod02{
    max-width: 176px;
    width: 12.8843338vw;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-03 h3 span{
    display: block;
    padding-top: 1.17130307vw;
    font-size: clamp(1rem, 1.17130307vw, 1.6rem);
    color: #1a1a1a;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-03 .fs-sect03-list-01-prod03{
    margin: 0 auto;
    padding-bottom: 4.09956076vw;
    max-width: 176px;
    width: 12.8843338vw;
}
main .fs-sect03 .fs-sect03-list li.fs-sect03-list-04{
    margin: 0;
    padding: 0;
    background-image: url(/-/media/com/mentholatumlip/assets/img/people.png);
    background-repeat: no-repeat;
    background-size: 13.0307467vw;
    background-position: 9.80966325vw bottom ;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-04 p{
    margin-bottom: 0;
    padding: 6.0761347vw 0 6.0761347vw 26.1346999vw   ;
    text-align: left;
    font-size: clamp(1rem,1.31771596vw, 1.8rem);
    line-height: 1.7;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-04 p span{
    background-image: linear-gradient(to top, #efe42b 40%, transparent 30%);
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-04 .fs-sect03-texture{
    position: absolute;
    bottom: -2.92825769vw;
    right: -4.1727672vw;
    max-width: 170px;
    width: 12.4450952vw;
}

/* sect04 */
main .fs-sect04{
    background-image: url(/-/media/com/mentholatumlip/assets/img/bg04.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 5.5636896vw 0 6.22254758vw;
}
main .fs-sect04 h2{
    margin: 0 auto;
    max-width: 657px;
    width: 48.0966325vw;
}
main .fs-sect04-cta a{
    margin: 3.51390922vw auto 0;
    max-width: 560px;
    width: 40.9956076vw;
    transition: opacity 0.3s ease;
}

@media screen and (min-width:768px){
   main .fs-sect01-cta a:hover ,main .fs-sect02-cta a:hover,main .fs-sect04-cta a:hover{
    opacity: 0.7;
   }
}
@media screen and (max-width:767px){
    main .fs-sect01,main .fs-sect02{
    padding: 16vw 0;
}
    main .fs-sect01{
    background-image: url(/-/media/com/mentholatumlip/assets/img/bg01-sp.jpg);
}
    main .fs-sect02{
    background-image: url(/-/media/com/mentholatumlip/assets/img/bg02-sp.jpg);
}

    main .fs-sect01 h2 ,main .fs-sect02 h2{
    margin: 0 auto 10.6666667vw;
    max-width: 519px;
    width: 69.2vw;
}
    main .fs-sect01-img01{
    margin: 0 auto 8.53333333vw;
    max-width: 668px;
    width: 89.066667vw;
}
    main .fs-sect02-img02{
    margin: 0 auto 8.53333333vw;
    max-width: 590px;
    width: 78.6666667vw;
}
main .fs-sect01-prod-name, main .fs-sect02-prod-name{
    padding-bottom: 5.2vw;
    font-size: clamp(1rem, 6.13333333vw, 4.6rem);
    line-height: 1.25;
}
main .fs-sect02-prod-name-small{
    padding-top: 3.2vw;
    padding-bottom: 0;
    font-size:clamp(1rem, 4vw, 3rem);
}
main .fs-sect01-prod-gram, main .fs-sect02-prod-gram{
    font-size: clamp(1rem, 3.73333333vw, 2.8rem);
}
main .fs-sect01-cta a ,main .fs-sect02-cta a{    
    margin: 10.6666667vw auto 0;
    padding: 4.8vw 0;
    max-width: 670px;
    width: 89.3333333vw;
    height: 13.3333333vw;
    font-size: clamp(1rem, 4vw, 3rem);
    line-height: 0.8;
}
main .fs-sect01-cta a{
    background-image: url(/-/media/com/mentholatumlip/assets/img/cta01-sp.png);
}
main .fs-sect02-cta a{
    background-image: url(/-/media/com/mentholatumlip/assets/img/cta02-sp.png);
}
main .fs-sect03{
    background-image: url(/-/media/com/mentholatumlip/assets/img/bg03-sp.png);
    background-size: 73.0666667vw;
    padding: 25.3333333vw 0 16vw;
}
main .fs-sect03 h2{
    margin-bottom: 18.6666667vw;
    font-size: clamp(1rem, 6.34666667vw, 4.76rem);
}
main .fs-sect03 h2 span{
    font-size: clamp(1rem, 9.06666667vw, 6.8rem);
}
main .fs-sect03 .fs-sect03-list {
    margin: 0 auto;
    max-width: 670px;
    width: 89.3333333vw;
}
main .fs-sect03 .fs-sect03-list li{
    margin-bottom: 13.3333333vw;
    padding-top: 11.7333333vw;
    border-radius: 2.66666667vw;
}
main .fs-sect03 .fs-sect03-list li h3{
    margin-bottom: 7.4666667vw;
    font-size: clamp(1rem, 5.86666667vw, 4.4rem);
    line-height: 1.35;
}
main .fs-sect03 .fs-sect03-list li p{
    margin-bottom: 5.33333333vw;
    font-size: clamp(1rem, 4vw, 3rem);
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-01 .fs-sect03-list-01-prod01{
    margin: 0 auto;
    max-width: 503px;
    width: 67.0666667vw;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-illustration{
    top: -10.6666667vw;
    max-width: 152px;
    width: 20.2666667vw;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-01 .fs-sect03-list-01-small{
    padding: 4vw 8.53333333vw 8.53333333vw 0;
    font-size: clamp(1rem, 2.66666667vw, 2rem);
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul{
    padding-bottom: 8.53333333vw;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul li{
    padding-left: 4vw;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul li:nth-child(1){
    padding-left: 0;
    padding-right: 5.86666667vw;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul li figure{
    margin: 0 auto;
    width: fit-content;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul li .fs-sect03-list-01-prod02{
    max-width: 225px;
    width: 30vw;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-03 h3 span{
    padding-top: 2.13333333vw;
    font-size: clamp(1rem, 2.93333333vw, 2.2rem);
    letter-spacing: 0;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-03 .fs-sect03-list-01-prod03{
    padding-bottom: 8.53333333vw;
    max-width: 225px;
    width: 30vw;
}
main .fs-sect03 .fs-sect03-list li.fs-sect03-list-04{
    background-image: url(/-/media/com/mentholatumlip/assets/img/people-sp.png);
    background-size: 38vw;
    background-position: 2.13333333vw bottom ;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-04 p{
    padding: 13.7333333vw 0 13.7333333vw 40.8vw   ;
    font-size: clamp(1rem, 4vw, 3rem);
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-04 .fs-sect03-texture{
    bottom: -8.93333333vw;
    right: -5.06666667vw;
    max-width: 199px;
    width: 26.5333333vw;
}
main .fs-sect04{
    background-image: url(/-/media/com/mentholatumlip/assets/img/bg04-sp.jpg);
    padding: 14.1333333vw 0 18.6666667vw;
}
main .fs-sect04 h2{
    max-width: 516px;
    width: 68.8vw;
}
main .fs-sect04-cta a{
    margin: 13.3333333vw auto 0;
    max-width: 638px;
    width: 85.06666667vw;
}
}
@media screen and (min-width:1366px){
main .fs-sect01,main .fs-sect02{
    padding: 100px 0;
}
main .fs-sect01 h2 ,main .fs-sect02 h2{
    margin: 0 auto 50px;
}
main .fs-sect01-img01{
    margin: 0 auto 35px;
}
main .fs-sect02-img02{
    margin: 0 auto 35px;
}
main .fs-sect01-prod-name, main .fs-sect02-prod-name{
    padding-bottom: 16px;
}
main .fs-sect02-prod-name-small{
    padding-top: 16px;
    padding-bottom: 8px;
}
main .fs-sect01-cta a ,main .fs-sect02-cta a{    
    margin: 32px auto 0;
    padding: 18px 0 17px;
    height: 50px;
}
main .fs-sect03{
    padding: 130px 0 100px;
}
main .fs-sect03 h2{
    margin-bottom: 56px;
}
main .fs-sect03 .fs-sect03-list li{
    margin-bottom: 70px;
    padding-top: 60px;
    border-radius: 20px;
}
main .fs-sect03 .fs-sect03-list li h3{
    margin-bottom: 40px;
}
main .fs-sect03 .fs-sect03-list li p{
    margin-bottom: 24px;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-illustration{
    top: -50px;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-01 .fs-sect03-list-01-small{
    padding: 15px 32px 30px 0;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul{
    padding-bottom: 56px;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul li{
    padding-left: 32px;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-02 ul li:nth-child(1){
    padding-right: 32px;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-03 h3 span{
    padding-top: 16px;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-03 .fs-sect03-list-01-prod03{
    padding-bottom: 56px;
}
main .fs-sect03 .fs-sect03-list li.fs-sect03-list-04{
    background-size: 178px;
    background-position: 134px bottom ;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-04 p{
    padding: 83px 0 83px 357px;
}
main .fs-sect03 .fs-sect03-list .fs-sect03-list-04 .fs-sect03-texture{
    bottom: -40px;
    right: -57px;
}
main .fs-sect04{
    padding: 76px 0 85px;
}
main .fs-sect04-cta a{
    margin: 48px auto 0;
    width: 560px;
}
}

.fs-sect02-btn a{
    display: flex;
    align-items: center;
    color: #fff;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
@media screen and (min-width: 768px) {
    .fs-sect02-btn {
        display: flex;
        justify-content: center;
        margin-top: calc(35 / 1366 * 100vw);;
    }

    .fs-sect02-btn a {
        margin-right: calc(30 / 1366 * 100vw);
        width: calc(300 / 1366 * 100vw);
        height: calc(50 / 1366 * 100vw);
        padding-left: calc(50 / 1366 * 100vw);
        font-size: calc(16 / 1366 * 100vw);
        background-image: url(/-/media/com/mentholatumlip/assets/img/cta02.png);
        transition: opacity .3s ease;
    }
    .fs-sect02-btn a:hover {
        opacity: .7;
    }

    .fs-sect02-btn a.blue {
        padding-left: calc(70 / 1366 * 100vw);
        background-image: url(/-/media/com/mentholatumlip/assets/img/cta04.png);
    }

    .fs-sect02-btn a:last-child {
        margin-right: 0;
    }
}

@media screen and (min-width: 1366px) {
    .fs-sect02-btn{
        margin-top: 35px;
    }
    .fs-sect02-btn a {
        margin-right: 30px;
        width: 300px;
        height: 50px;
        padding-left: 50px;
        font-size: 16px;
    }
    .fs-sect02-btn a.blue {
        padding-left: 70px;
    }

    .fs-sect02-btn a:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 767px) {
    .fs-sect02-btn {
        margin-top: calc(75 / 750 * 100vw);
    }
    .fs-sect02-btn a {
        justify-content: center;
        margin-bottom: calc(60 / 750 * 100vw);
        width: calc(670 / 750 * 100vw);
        height: calc(100 / 750 * 100vw);
        font-size: calc(30 / 750 * 100vw);
        background-image: url(/-/media/com/mentholatumlip/assets/img/cta02-sp.png);
        margin-right: auto;
        margin-left: auto;
    }

    .fs-sect02-btn a.blue {
        background-image: url(/-/media/com/mentholatumlip/assets/img/cta04-sp.png);
    }

    .fs-sect02-btn a:last-child {
        margin-bottom: 0;
    }
}