@charset "UTF-8";
:root {
    overflow-y:initial;   
}
html {
    scroll-behavior: smooth;

}
body {
    font-family: 'Yu Gothic Pr6N M',YuGothic,'Yu Gothic','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
}
img {
    max-width: 100%;
}
.device-sp img {
    width: auto;
    display: inline;
}
dl a, p a {
    text-decoration: none;
}
.no-touch #page_index a.btn-item[data-href]:hover dl:first-child+dl, .no-touch #page_index a.btn-item[href]:hover dl:first-child+dl {
    height: calc(100% - 230px);
    -webkit-transition: height .3s cubic-bezier(.25, .46, .45, .94);
    -moz-transition: height .3s cubic-bezier(.25, .46, .45, .94);
    -o-transition: height .3s cubic-bezier(.25, .46, .45, .94);
    -ms-transition: height .3s cubic-bezier(.25, .46, .45, .94);
    transition: height .3s cubic-bezier(.25, .46, .45, .94);
}
.fadein {
    opacity: 0;
    transform: translate(0, 30px);
    transition: all 1.5s;
}
.fadein.scrollin {
    opacity: 1 !important;
    transform: translate(0, 0) !important;
}
.icon-right2::after {
    font-family: "Hobonichi-Icons";
    content: "\e906";
    font-weight: normal;
    font-size: 1.5em;
    position: absolute;
    top: 0.4em;
    right: 0.3em;
}
section > h3 {
    content: "";
    display: block;
    background: url(../images/ttl1_bg.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
    width: 100vw;
    height: 0;
    padding-top: 21.142%;
    position: relative;
    margin-bottom: 200px;
}
section > h3 span {
    position: absolute;
    display: block;
    left: 0;
    right: 0;
    bottom: -115px;
    text-align: center;
    font-family: 'Shuei NijimiMin L', serif;
    /* font-family: A P-OTF Shuei NijimiMin StdN; */
    font-size: 54px;
    font-style: normal;
    font-weight: 400;
    line-height: 42px;
    letter-spacing: 0.5px;
    -webkit-text-stroke: 0.6px #080C4C;
    text-stroke: 0.6px #080C4C;
}
section > h3 span::after {
    content: "";
    display: block;
    background: url(../images/ttl_icon1.svg) no-repeat;
    background-size: contain;
    width: 180px;
    height: 135px;
    position: absolute;
    top: -160px;
    left: 0;
    right: 0;
    margin: 0 auto;
}
section .desc_x {
    max-width: 1200px;
    width: 92.3vw;
    margin: 0 auto;
}
section .desc_x .text p {
    font-size: 16px;
    line-height: 32px; /* 200% */
    letter-spacing: 0.8px;
    padding-top: 24px;
}
section .desc_x .text h4 {
    font-family: 'Shuei Mincho B', serif;
    /* font-family: A P-OTF Shuei Mincho Pr6N; */
    font-size: 24px;
    font-style: normal;
    /* font-weight: 600; */
    line-height: 42px; /* 175% */
    font-feature-settings: "palt";
    letter-spacing: 0.5px;
    position: relative;
    padding-bottom: 10px;
    border-bottom: 8px solid rgba(222, 247, 28, 0.80);
}
section .desc_x .text h4::before {
    content: "";
    display: block;
    background: url(../images/ttl_icon2.svg) no-repeat;
    background-size: contain;
    width: 43px;
    height: 48px;
    padding-bottom: 10px;
}
section .desc_x .ph {
    max-width: 600px;
}
/* section .desc_x .ph img {
    max-width: 100%;
} */
section#feature .desc_y {
    padding: 56px 0 96px;
}
section#feature .desc_y ul li {
    width: 240px;
}
/* section#feature .desc_y ul li img {
    max-width: 100%;
} */
section#feature .desc_y ul li dd {
    font-size: 15px;
    line-height: 27px; /* 180% */
    padding-top: 1em;
}
section#original > h3 {
    background: url(../images/ttl2_bg.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}
section#type > h3 {
    background: url(../images/ttl3_bg.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}
section#type > .desc {
    display: flex;
    justify-content: center;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0.8px;
    margin-top: -60px;
    margin-bottom: 30px;
}
section#type > .wrapper {
    max-width: 960px;
    margin: 0 auto;
}
/* section#type img {
    max-width: 100%;
} */
section#type > .wrapper dl {
    background-color: #fbfee8;
    margin-top: 8px;
    padding: 17px 50px 24px;
}
section#type > .wrapper dl dt {
    padding: 8px 0 32px;
    font-size: 15px;
    line-height: 180%;
    letter-spacing: 0.75px;
}
section#type > .wrapper dl dd a {
    border-radius: 30px;
    border: 1px solid #080C4C;
    background: #DEF71C;
    display: block;
    position: relative;
    font-family: 'Yu Gothic Pr6N D', sans-serif;
}
section#type > .info {
    max-width: 606px;
    width: 92.3vw;
    margin: 72px auto 96px;
    padding: 48px 96px;
    background-color: #f2f2f6;
    border-radius: 10px;
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 27px;
    letter-spacing: 0.75px;
    box-sizing: border-box;
    position: relative;
}
section#type > .info div p {
    position: absolute;
    top: 38px;
    right: -70px;
}
section#type > .info div div:last-of-type {
    display: flex;
    justify-content: center;
    padding-top: 24px;   
}
section#scene > h3 {
    background: url(../images/ttl4_bg.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}
section#scene > .wrapper {
    max-width: 1200px;
    margin: 0 auto;
}
#slider {
    background-color: #F0F0F0;
    padding: 90px 0 105px;
    text-align: center;
    margin-top: 130px;
}
#slider h3 span {
    /* font-family: A P-OTF Shuei Mincho Pr6N; */
    font-family: 'Shuei Mincho B', serif;
    font-size: 32px;
    font-weight: normal;
    line-height: 42px; /* 131.25% */
    letter-spacing: 0.5px;
    position: relative;
    padding-bottom: 7px;
    display: inline-block;
    margin-bottom: 30px;
    z-index: 0;
    background: linear-gradient(transparent 50%, #DEF71C 50%);
}
#slider h3::before {
    content: "";
    display: block;
    background: url(../images/ttl_icon2.svg) no-repeat;
    background-size: contain;
    width: 43px;
    height: 48px;
    padding-bottom: 10px;
    margin: 0 auto;
}
#gift {
    padding: 200px 0 85px;
}
#gift h3 {
    text-align: center;
    position: relative;
}
#gift h3 span {
    /* font-family: A P-OTF Shuei NijimiMin StdN; */
    font-family: 'Shuei NijimiMin L', serif;
    font-size: 56px;
    font-style: normal;
    font-weight: 400;
    line-height: 42px;
    letter-spacing: 0.5px;
}
#gift h3::before {
    content: "";
    display: block;
    background: url(../images/ttl_icon1.svg) no-repeat;
    background-size: contain;
    width: 180px;
    height: 135px;
    position: absolute;
    top: -160px;
    left: 0;
    right: 0;
    margin: 0 auto;
}
#gift ul {
    max-width: 960px;
    width: 92.3vw;
    margin: 0 auto;
}
#gift ul li dl dt {
    border-top: 1px solid;
    border-bottom: 1px solid;
    padding: 20px 0 20px 64px;
    position: relative;
}
#gift ul li dl dt::before {
    content: "";
    display: block;
    background: url(../images/ttl_icon2.svg) no-repeat;
    background-size: contain;
    width: 43px;
    height: 48px;
    margin: 0 auto;
    position: absolute;
    position: absolute;
    left: 0;
    right: 0;
    top: -55px;
}
#gift ul li dl dt span {
    /* font-family: A P-OTF Shuei Mincho Pr6N; */
    font-family: 'Shuei Mincho B', serif;
    font-size: 24px;
    font-style: normal;
    /* font-weight: 600; */
    line-height: 42px; /* 175% */
    letter-spacing: 0.5px;
}
#gift ul li dl dd.text {
    font-size: 16px;
    line-height: 32px; /* 200% */
    letter-spacing: 0.8px;
    padding: 32px 0 40px 64px ;
}
#gift p a {
    max-width: 370px;
    width: 92.3vw;
    margin: 0 auto;
    text-align: center;
    border-radius: 30px;
    border: 1px solid #080C4C;
    display: block;
    position: relative;
    box-sizing: border-box;
    color: #080C4C;
    font-family: 'Yu Gothic Pr6N D', sans-serif;
}
#news {
    background-color: #080C4C;
}
#news > div {
    max-width: 672px;
    width: 92.3vw;
    margin: 0 auto;
    padding: 60px 0 105px;
}
section#product {
    background-color: #F0F0F0;
}
section#product > p {
    text-align: center;
    padding-top: 50px;
    position: relative;
    z-index: 1;
}
section#product > div {
    max-width: 960px;
    background-color: #fff;
    margin: -40px auto 0;
}
section#product > div > ul {
    padding: 30px 120px 140px;
}
section#relation {
    background-color: #F0F0F0;
    width: 100vw !important;
}
section#relation .inner > p {
    text-align: center;
    padding-bottom: 20px;
}
section#relation .inner {
    max-width: 960px;
    margin: 0 auto;
}
section#relation .copyright {
    border-top: solid #080C4C 1px;
    margin-top: 55px;
    padding-top: 40px;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 21px;
    letter-spacing: 0.7px;
}
#page_index #relation ul li h6 {
    border-bottom: none !important;
    color: #080C4C;
}
.is_pc #relation a:hover h6, .is_sp #relation a.touch h6 {
    color: #080C4C !important;
}
#head_nav ul li {
    font-family: 'Yu Gothic Pr6N D', sans-serif;
}
.btn-gotop {
    display: none !important;
}
@media (min-width: 751px) {
    .is_pc #head_nav ul li a:hover, .is_sp #head_nav ul li a.touch {
        color: #DEF71C;
    }
    #page {
        padding-top: 0;
    }
    #page .device-sp {
        display: none;
    }
    #head_nav {
        height: 65px;
    }
    #head_nav ul {
        position: absolute;
        right: 0;
    }
    #head_nav ul li {
        font-size: 15px;
    }
    #page_index #yodogawa h3 img {
        width: 806px;
        height: 348px;
    }
    #page_index #desc_a .inner {
        display: block;
        padding-top: 0;
        padding-bottom: 60px;
    }
    #page_index #desc_a .inner .col {
        max-width: 960px;
        margin: 0 auto;
        display: flex;
    }
    #page_index #desc_a .inner .col:first-of-type {
        align-items: center;
        margin-top: -40px;
    }
    #page_index #desc_a .col > .desc:first-of-type {
        margin: 40px 60px 0 80px;
    }
    #page_index #desc_a .col .desc p {
        margin-bottom: 2em;
        font-size: 16px;
        letter-spacing: .05em;
        line-height: 2em;
    }
    #page_index #desc_a .ph_a {
        line-height: 0;
        margin-right: 120px;
    }
    #page_index #desc_a .ph_a img {
        width: 400px;
    }
    #page_index #desc_a .ph_b {
        margin: -60px 0 30px 220px;
    }
    #page_index #desc_a .ph_b img {
        width: 260px;
    }
    #page_index #desc_a .ph_c img {
        width: 256px;
    }
    section .desc_x {
        display: flex;
        gap: 30px;
        padding-left: 120px;
    }    
    section .desc_x .text {
        min-width: 410px;
    }
    section .desc_x.reverse {
        flex-direction: row-reverse;
        gap: 70px;
        padding-left: 0;
        padding-right: 120px;
    }
    section#feature .desc_y ul {
        display: flex;
        max-width: 832px;
        margin: 0 auto;
        justify-content: center;
        align-items: flex-start;
        gap: 56px;
    }    
    section#original h3 + .desc_x {
        padding-top: 30px;
    }
    section#original .desc_x {
        margin-bottom: 120px;
    }
    section#original .desc_x h4 {
        margin-top: -50px;
    }
    section#type > .wrapper {
        display: flex;
        gap: 40px;
    }
    section#type > .wrapper > div {
        max-width: 460px;
        width: calc((100vw - 40px)/2);
    }
    section#type > .wrapper dl dt {
        white-space: nowrap;
    }
    section#type > .wrapper dl dd a {
        padding: 12px 0 12px 20px;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        -o-transition: all .3s;
        -ms-transition: all .3s;
        transition: all .3s;
    }
    section#type > .wrapper dl dd a:hover {
        background-color: #080C4C;
        color: #DEF71C;
    }
    section#scene > .wrapper dl {
        display: flex;
        position: relative;
    }
    section#scene > .wrapper dl:last-of-type {
        flex-direction: row-reverse;
        margin-top: 225px;
    }
    section#scene > .wrapper dl dt {
        width: 460px;
        height: 460px;
        background-color: rgba(222, 247, 28, 0.5);
        padding: 80px 0 80px 60px;
        position: absolute;
        top: 40px;
        right: 0;
        box-sizing: border-box;
        z-index: -1;
        font-size: 16px;
        font-weight: 500;
        line-height: 32px; /* 200% */
        letter-spacing: 0.8px;
    }
    section#scene > .wrapper dl dd {
        max-width: 760px;
        width: 60vw;
    }
    section#scene > .wrapper dl dt h4 {
        font-family: 'Shuei Mincho B', serif;
        font-size: 32px;
        line-height: 42px; /* 131.25% */
        letter-spacing: 0.5px;
        padding-bottom: 24px;
    }
    section#scene > .wrapper dl:last-of-type dt {
        right: initial;
        top: -96px;
        left: 0;
        padding-left: 44px;
        display: flex;
        align-items: center;
    }
    #gift {
        background-image: url(../images/bg_gift.jpg);
        background-size: cover;
        background-position: center center;
    }
    #gift ul {
        display: flex;
        gap: 62px;
        padding: 130px 0 50px;
    }
    #gift ul li {
        width: calc((100% - 62px)/2);
    }    
    #gift p a {
        font-size: 16px;
        padding: 12px 20px;
        -webkit-transition: opacity .3s;
        -moz-transition: opacity .3s;
        -o-transition: opacity .3s;
        -ms-transition: aopacityll .3s;
        transition: opacity .3s;
    }
    #gift p a.icon-right2::after {
        top: 0.3em;   
    }
    #gift p a:hover {
        opacity: .4;
    }
    #page_index #relation {
        padding-bottom: 65px;
    }
    #page_index #relation ul {
        justify-content: center;
        gap: 60px;   
    }
}
@media (min-width: 751px) and (max-width: 1200px){
    /* #page_index #desc_a .col.l .ph_a {
        width: 28.571vw;
        margin-bottom: 7.0833333333vw;
    } */
}
@media (min-width: 640px) and (max-width: 820px) {
    section#type > .wrapper dl dd a {
        font-size: 12px;
        padding: 12px 0;   
        text-align: center;
    }
    section#type > .wrapper dl dd a.icon-right2::after {
        display: none;
    }
    section#scene > .wrapper dl dd{ 
        width: 50vw;
    }
}
@media screen and (max-width: 750px) {
    #page .device-pc {
        display: none;
    }
    img {
        display: inherit;
    }    
    .is_pc #head_nav ul li a:hover, .is_sp #head_nav ul li a.touch {
        color: #DEF71C;
    }
    #page {
        padding-top: 30px;
    }
    #head_nav ul {
        padding: 0 3.846vw;
    }
    #head_nav ul:before {
        width: 100vw;
        left: 0;
    }
    #head_nav ul li {
        font-size: 3.36vw;
    }
    #head_nav h1 {
        left: 2.6vw;
    }
    #page_index #desc_a .inner {
        padding: 0;
    }
    #page_index #desc_a .inner img {
        width: 100%;
    }
    #page_index #desc_a .inner h3 {
        text-align: center;
        padding: 50px 3.84vw 40px;
    }
    #page_index #desc_a .inner h3 img {
        width: 95.192vw;
    }
    #page_index #desc_a .col .desc {
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: 32px; /* 200% */
        letter-spacing: 0.48px;
        width: 92.2vw;
        margin: 0 auto;
        padding-bottom: 30px;
    }
    #page_index #desc_a .ph_b {
        width: 62.5vw;
        margin: 0 0 3.84vw auto;
    }
    #page_index #desc_a .ph_c {
        width: 62.5vw;
        margin: 0 auto 6vw 0;
    }
    #page_index #desc_a .ph_c_sp {
        width: 62.5vw;
        margin: 0 auto;
        padding: 24px 0 40px;
    }
    section > h3 {
        padding-top: 36%;
        margin-bottom: 145px;
    }
    section > h3 span {
        font-size: 7.69vw;
        font-style: normal;
        font-weight: 400;
        line-height: 125%;
        letter-spacing: 0.33px;
        bottom: -95px;
    }
    section > h3 span::after {
        width: 115px;
        height: 86px;
        top: -95px;
    }
    section .desc_x .text h4 {
        font-size: 4.8vw;
        font-style: normal;
        font-weight: normal;
        line-height: 1.65;
        letter-spacing: 0.5px;
        padding-bottom: 5px;
    }
    section .desc_x .text h4::before {
        display: none;
    }
    section .desc_x .text p {
        padding: 17px 0 30px;        
    }
    section#feature h3 span {
        bottom: -115px;
    }
    section#feature .desc_y {
        padding: 40px 0 65px;
    }
    section#feature .desc_y ul li {
        width: 58vw;
        margin: 0 auto;
    }    
    section#feature .desc_y ul li + li {
        padding-top: 30px;
    }
    section#feature .desc_y ul li dd {
        font-size: 3.6vw;
    }
    section#original .desc_x {
        margin-bottom: 50px;
    }
    section#type > .desc {
        margin-top: -6vw;
    }
    section#type > .wrapper div > p {
        line-height: 0;
    }
    section#type > .wrapper dl {
        margin-top: 0;
        padding: 16px 3.84vw 24px;
        margin-bottom: 45px;
    }
    section#type > .wrapper dl dd a {
        font-size: 15px;
        padding: 13px 4vw;
    }
    section#type > .info {
        margin: 48px auto 64px;
        padding: 72px 40px 48px;
    }
    section#type > .info div div:last-of-type {
        font-size: 3.6vw;
        padding-top: 16px;
    }
    section#type > .info div p {
        right: auto;
        left: 0;
        top: -7vw;
    }
    section#scene > h3 {
        margin-bottom: 135px;   
    }
    section#scene > .wrapper dl dd {
        width: 86.538vw;
    }
    section#scene > .wrapper dl dd p {
        width: 89.538vw;
        height: 8px;
        background-color: rgba(222, 247, 28, 0.8);
        margin-bottom: 65px;
    }
    section#scene > .wrapper dl dd h4 {
        font-family: 'Shuei Mincho B', serif;
        font-size: 6.73vw;
        line-height: 1.285;
        letter-spacing: 0.5px;
        display: flex;
        justify-content: center;   
        margin-bottom: 24px;
    }
    section#scene > .wrapper dl dd h4 span {
        position: relative;
    }
    section#scene > .wrapper dl dd h4 span::before {
        content: "";
        display: block;
        background: url(../images/ttl_icon2.svg) no-repeat;
        background-size: contain;
        width: 10.33vw;
        height: 11.53vw;
        position: absolute;
        top: -50px;
    }
    section#scene > .wrapper dl dt {
        width: 89.9vw;
        background-color: #EEF5B3;
        padding: 5.76vw;
        box-sizing: border-box;
        font-size: 3.84vw;
        font-weight: 500;
        line-height: 2;
        letter-spacing: 0.8px;
        margin: -20px 0 11.53vw auto;
    }
    section#scene > .wrapper dl:last-of-type dd {
        margin-left: auto;
        margin-right: 0;
    }
    section#scene > .wrapper dl:last-of-type dt {
        margin-left: 0;
        margin-right: auto;
    }
    #slider {
        padding: 50px 0 40px;
        text-align: center;
        margin-top: 60px;
        margin-bottom: 70px;
    }
    #slider h3 span {
        font-size: 6.49vw;
        line-height: 1.33;
        letter-spacing: 0.429px;
        margin-bottom: 40px;
    }
    #slider h3::before {
        padding-bottom: 5px;
    }
    #slider .slick-dots {
        bottom: -40px;
    }
    #slider .slick-dots li {
        margin: 0 8px;
        width: 6px;
        height: 6px;
    }
    #slider .slick-dots li.slick-active button {
        background-color: #172344;
    }
    #slider .slick-dots li button {
        color: #172344;
        opacity: 1;
        border: 1px #172344 solid;
        padding: 2px;
        border-radius: 50%;
        width: 6px;
        height: 6px;
    }
    #slider .slick-dots li button::before {
        display: none;
    }
    #slider .slick-track {
        width: 90vw;
    }
    #gift {
        background-image: url(../images/bg_gift_sp.jpg);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: top center;
        background-color: #fbfee8;
        padding: 120px 0 60px;
    }
    #gift h3 span {
        font-size: 7.69vw;
        line-height: 1.25;
        letter-spacing: 0.33px;
        -webkit-text-stroke: 0.6px #080C4C;
        text-stroke: 0.6px #080C4C;    
    }
    #gift h3::before {
        width: 115px;
        height: 86px;
        top: -90px;
    }
    #gift ul {
        padding: 100px 0 55px;
    }
    #gift ul li dl dt {
        padding: 16px 0;
        display: flex;
        justify-content: center;
    }
    #gift ul li dl dt span {
        font-size: 5.76vw;
        font-weight: 600;
        line-height: 1.75;
        letter-spacing: 0.5px;
    }
    #gift ul li dl dd.text {
        font-size: 3.84vw;
        font-weight: 500;
        line-height: 2;
        letter-spacing: 0.8px;
        padding: 24px 0;
    }
    #gift ul li + li {
        margin-top: 100px;
    }
    #gift p a {
        font-size: 3.6vw;
        padding: 13px;
    }
    section#product {
        background-color: #fff;
        color: #fff;
    }
    section#product > div > ul {
        padding: 40px 5vw 60px;
    }
    section#product > p {
        width: 38.94vw;
        margin: 0 auto;
        padding-top: 25px;
    }
    #news > div {
        padding: 30px 0 35px;
    }    
    #page_index #relation {
        padding-top: 7.21vw;
    }
    section#relation .inner > p {
        width: 38.94vw;
        margin: 0 auto;
    }
    #page_index #relation ul li {
        width: 92.3vw;
        margin-bottom: 7.93vw;
    }
    #page_index #relation ul li .ph {
        width: 100%;
        height: auto;
    }
    #page_index #relation ul li .ph img {
        width: 100%;
        height: auto;
    }
    section#relation .copyright {
        margin-top: 9.615vw;
        padding-top: 7.69vw;
        padding-bottom: 12vw;
    }
}