/*rest　******************************/
*{box-sizing: border-box;}
img{max-width:100%;max-height: 100%;}
a{display: block; text-decoration: none; color:var(--color-bk) !important;}
button{
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
    color:inherit;
}

body{
    line-height: 1;
}

html{
    font-size:62.5% !important;
}
a{transition: 0.5s;}
a:hover{text-decoration: none !important;}
/* a:hover{text-decoration: none; opacity: 0.8;} */
#header .header_search_wrap_ .header_search_inner_ form input.keyword_{
height:41.8px;}



/*root　******************************/

:root {
    --bg-color-wh:#F5F7F4;
    --color-bk:#3F3F3F;
    --color-blgy:#C3CCC3;
    --color-ye:#F4F093;
    --txt-m:clamp(12px,12px + 0.261437908496732vw,16px);
    

    --cont-max:1556px;
    --cont-max-s:900px;
    --unit-cont-pd-w:2.05vw;
    --cont-pd-w:calc(var(--unit-cont-pd-w) * 2);
    --cont-pd-w1:calc(var(--unit-cont-pd-w) * 3);
    --cont-pd-w2:calc(var(--unit-cont-pd-w) * 4);
    --cont-pd-w3:calc(var(--unit-cont-pd-w) * 6);
    --unit-mg:clamp(6px,2.05vw,8px);

    --mg4:calc(var(--unit-mg) / 2);
    --mg8:var(--unit-mg);
    --mg12:calc(var(--unit-mg) * 1.5);
    --mg16:calc(var(--unit-mg) * 2);
    --mg24:calc(var(--unit-mg) * 3);
    --mg32:calc(var(--unit-mg) * 4);
    --mg40:calc(var(--unit-mg) * 5);
    --mg48:calc(var(--unit-mg) * 6);
    --mg56:calc(var(--unit-mg) * 7);
    --mg64:calc(var(--unit-mg) * 8);
    --mg80:calc(var(--unit-mg) * 10);
    --mg96:calc(var(--unit-mg) * 12);
    --mg120:calc(var(--unit-mg) * 15);
    --mg136:calc(var(--unit-mg) * 17);
    --mg144:calc(var(--unit-mg) * 18);
    --mg160:calc(var(--unit-mg) * 20);
    --mg180:calc(var(--unit-mg) * 22.5);
    --mg200:calc(var(--unit-mg) * 25);
    --mg240:calc(var(--unit-mg) * 30);
    }

    .pc{
        display: none;
    }

    @media (min-width: 768px) {
        :root {
        --unit-mg:0.78vw;
        --unit-cont-pd-w:2vw;

        }
        .pc{
            display: block;
        }

        .sp{
            display: none;
        }

    }

    @media (min-width:1600px) {
        :root {
        --unit-mg:clamp(6px,0.5vw,8px);  
        }
    }

    @media (min-width: 1920px) {
    :root {
        --unit-mg:clamp(6px,0.41vw,8px);  
    }
    }

/*common　******************************/

.font-heading-en{
    font-family: "playfair-display", serif;
    font-weight: 700;
    font-style: normal;
    letter-spacing: 0.15em;
}

.font-s-en{
    font-family: "minion-pro", serif;
    font-weight: 500;
    font-style: normal;
    letter-spacing: 0.1em;
}

.font-s-jp{
    font-family: "Noto Serif JP", serif;
    font-weight: 500;
}

.l-wrapper{
    position: relative;
}

.contentWrapper {
    overflow: hidden;
    color:var(--color-bk);
    background:#fff;
    letter-spacing: 0.08em;
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: normal;
    font-style: normal;
}

.contents-inner{
    width: 100%;
    padding:0 var(--cont-pd-w);
    margin:0 auto;
}

@media (min-width: 768px) {

    .contents-inner{
    padding:0 var(--cont-pd-w2);
    }


}

@media (min-width: 1920px) {

    .contents-inner{
        padding:0;
        max-width:var(--cont-max);
    }


}


/*　mv・intro ******************************/


.mainVisual{
    width:100%;
    position: relative;
}
.mainVisual__wrapper{
    width:100%;
    text-align: center;
    margin:0 auto;
    position: relative;
    z-index:1;
}

.mainVisual__ttl{
    position: absolute;
    top:0;
    bottom:0;
    right:0;
    left:0;
    margin:auto;
    display: grid;
    place-items: center;
    z-index:2;
    width:80%;
    max-width:400px;
}

.intro{
    padding:var(--mg96) 0;
    position: relative;
    background:var(--bg-color-wh);
}

.intro__wrapper{
    width:100%;
    padding:0 var(--cont-pd-w);

}

.intro__heading{
    width:80vw;
    max-width:320px;
    margin:0 auto var(--mg32);
}


.intro__txt{
    font-size:var(--txt-m);
    letter-spacing: 0.12em;
    line-height: 1.8;
}


@media (min-width: 768px) {
.mainVisual__ttl{
    width:48.95vw;
    max-width:900px;
}

.intro{
    padding:var(--mg160) 0;
}

.intro__heading{
    margin-bottom:0;
}

.intro__wrapper{
    display:flex;
    align-items: center;
    max-width:var(--cont-max);
    gap:var(--mg64);
    margin:0 auto;
}

.intro__txt{
    line-height: 2.2;
}



}



@media (min-width: 1920px) {



.intro__wrapper{
    padding:0;
}

.intro__heading{
    max-width:420px;
}

.intro__txt{
    line-height: 2.8;
}

}

/*item common ******************************/

.item{
    padding:var(--mg80) 0;
}

.item__image a{
    position: relative;
}

.item__image span{
    display: block;
    font-size:clamp(11px,11px + 0.326797385620915vw,16px);
    position: absolute;
    top:10px;
    left:10px;
}

.item__name__wrapper{
    display: grid;
    gap:var(--mg24) 0;
}

.item__name,.item__price{
    font-size:clamp(12px,12px + 0.392156862745098vw,20px);

}

.item__name{
    display: flex;
    line-height: 1.2;
}

.item__name span{
    display: block;
    font-size:clamp(11px,11px + 0.326797385620915vw,16px);
    margin:0 8px 0 0;
}

.item__price{
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    gap:8px;
    margin-top:var(--mg12);
}

.item__price::before{
    content:"";
    display: block;
    height:1px;
    width:40px;
    background:var(--color-bk);
    margin-bottom:4px;
}

.item__name__hosoku{
    font-size:var(--txt-m);
    margin-bottom:8px;
}

@media (min-width: 768px) {

.item{
    padding:var(--mg120) 0;
}


.item__image a{
    cursor: pointer;

}

.item__image a:hover{
    filter: brightness(1.1) contrast(96%);
}

.item__image span{
    top:15px;
    left:15px;
    margin-right:12px;
}

.item__name__wrapper div{
    width:100%;
}

.item__name__wrapper div a{
    /* width: fit-content; */
    display: flex;
    justify-content: space-between;
    gap:12px;
}


.item__name span{
    margin:1px 8px 0 0;
}


.item__price{
    margin:0;
    gap:12px;
}

.item__price::before{
    width:60px;
}


}

@media (min-width: 1920px) {

.item{
    padding:var(--mg144) 0;
}

.item__image span{
    top:20px;
    left:20px;
}


.item__price::before{
    width:80px;
}

.item__name__hosoku{
    margin-bottom:16px;
}


}

/*item ******************************/
.item1__sub-image_wrapper,.item2__sub-image_wrapper{
    position: relative;
}

/*item1*/
.item1{
background:url(/img/usr/freepage/20260211_spring_collection2026/grd-bg-sp.jpg) no-repeat left top/cover;
}

.item1__main-image{
    width:80%;
    margin:0 0 var(--mg32) auto;
}

.item1__sub-image_wrapper {
    width: 90%;
    padding-bottom:17%;
    margin:0 0 var(--mg32) 5%;
}


.item__image img {
    height: auto;
}

.item1__sub-image-l {
    position: relative;
    width: 62%;
    z-index: 1;
}

.item1__sub-image-r {
    position: absolute;
    width: 50%;
    left:50%;
    bottom:0;
    z-index: 2;
}
.item1 .item__name__wrapper{
    width:90%;
    margin:0 auto;
}

/*item2*/
.item2{
    background:var(--bg-color-wh);
}
.item2__main-image{
    width:80%;
    margin:0 0 var(--mg32);
}

.item2__sub-image_wrapper{
    padding-bottom:30%;
    width:90%;
    margin:0 0 var(--mg32) auto;
    margin-right:5%;
}

.item2__sub-image-l{
    width:41%;
    position: absolute;
    bottom:0;
    left:0;
    z-index:2;
}

.item2__sub-image-r{
    width:66%;
    position: relative;
    z-index:1;
    margin:0 0 0 auto;
}

.item2__sub-image-r span{
    left:inherit;
    right:10px;
}

.item2 .item__name__wrapper{
    width:90%;
    margin:0 auto;
}

/*item3*/

.item3{
    margin-top:var(--mg80);
}

.item3__main-image{
    width:70%;
    margin:0 calc(var(--cont-pd-w) + 5%) var(--mg32) auto;
}

.item3__sub-image{
    width:60%;
    margin:0 0 var(--mg32) calc(var(--cont-pd-w) + 5%);
}

.item3__img-txt__cont{
    position: relative;
    padding:var(--mg32) 0 0;
}

.item3__img-txt__cont::before{
    content:"";
    width:50%;
    height:40%;
    display: block;
    background:var(--color-ye);
    z-index:1;
    position: absolute;
    right:0;
    top:0;
}

.item3__img-txt__cont .item__image{
    width:60%;
    margin:0 auto var(--mg32);
    position: relative;
    z-index:2;
}

.item3__img-txt__cont .item__name__wrapper{
    width:90%;
    margin:0 auto;
    padding: 0 var(--cont-pd-w);
    position: relative;
    z-index:2;
}

.item3 .item__name__wrapper div a{
    width:100%;
}

/*item4*/
.item4{
    position: relative;
}

.item4::before{
    content:"";
    display: block;
    width:100%;
    height:35vw;
    background:url(/img/usr/freepage/20260211_spring_collection2026/bg-fl-sp.jpg) no-repeat center right/cover;
    position: absolute;
    z-index: 1;
    left:0;
    top:var(--mg80);
}

.item4 .contents-inner{
    position: relative;
    z-index:2;
    padding-top:var(--mg32);
}

.item4__main-image{
    width:68%;
}

.item4__sub-image-l{
    width:50%;
    margin:-100px 0 0 auto;
}

.item4__sub-image-r{
    width:80%;
    margin:var(--mg32) auto;
}

.item4 .item__name__wrapper{
    width:90%;
    margin:0 auto;
}

@media (min-width: 768px) {

/*item1*/
.item1{
    background:url(/img/usr/freepage/20260211_spring_collection2026/grd-bg-pc.jpg) no-repeat left top/cover;
}

.item1 .contents-inner,.item2 .contents-inner{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap:var(--cont-pd-w2);
}

.item1__main-image{
    width:100%;
    margin:0;
}

.item1__sub-image_wrapper {
    width: 100%;
    margin:var(--mg64) 0 0;
}

.item1__img-txt__cont{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.item1 .item__name__wrapper{
    width: 100%;
    margin:var(--mg80) auto 0;
}

/*item2*/
.item2__main-image{
    width:100%;
    margin:0 0;
    order: 2;
}

.item2__img-txt__cont{
    order: 1;
}

.item2__sub-image_wrapper{
    padding:30% 0 0;
    width:100%;
    margin:var(--mg64) 0 0;
}

.item2__sub-image-l{
    bottom:inherit;
    top:0;
}

.item2__sub-image-r span{
    right:15px;
}

.item2 .item__name__wrapper{
    width:100%;
    margin:var(--mg80) auto 0;
}

/*item3*/
.item3{
    margin-top:0;
}
.item3__cont__wrapper{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}
.item3__main-image,.item3__sub-image{
    width:100%;
    margin:0;
}

.item3__sub-image{
    order:3;
}

.item3__img-txt__cont{
    order: 2;
    padding:0;
    display: grid;
    grid-template-rows: 1fr auto;
}


.item3__img-txt__cont::before{
    width:100%;
    height:100%;
}

.item3__img-txt__cont .item__image{
    width:56%;
    margin:0 auto;
    display: grid;
    place-items: center;
}



.item3__img-txt__cont .item__name__wrapper{
    width:100%;
    padding:0 var(--cont-pd-w);
    margin-bottom:var(--mg32);
}

.item3__img-txt__cont .item__name__wrapper div a{
    display: block;
}

.item3__img-txt__cont .item__name__wrapper .item__price{
    margin-top:var(--mg8);
}

/*item4*/
.item4{
    position: relative;
}

.item4::before{
    width:81%;
    max-width:var(--cont-max);
    height:21.51vw;
    left:0;
    right:0;
    margin:0 auto;
    top:calc(var(--mg120) + var(--mg80));
}

.item4 .contents-inner{
    width:81%;
    padding:0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap:var(--cont-pd-w2);
}

.item4__main-image{
    width:100%;
    padding:0 0 0 var(--cont-pd-w);
    margin-top:var(--mg160);
}

.item4__sub-image-l{
    width:60%;
    margin:0 var(--cont-pd-w2) 0 auto;
}

.item4__sub-image-r{
    width:88%;
    padding:0 var(--cont-pd-w2) 0 0;
    margin:var(--mg56) 0 var(--mg32);
}

.item4__img-txt__cont{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.item4 .item__name__wrapper{
    width:100%;
}

}




@media (min-width: 1920px) {
    .item2__sub-image-r span{
        right:20px;
    }

    .item2 .item__name__wrapper{
        margin:var(--mg120) auto 0;
    }

    .item3__img-txt__cont .item__name__wrapper{
    margin-bottom:var(--mg56);
    }


    .item3__img-txt__cont .item__name__wrapper .item__price{
    margin-top:var(--mg12);
    }


.item4__main-image{
    margin-top:var(--mg200);
}


}

/*lineup以降*******************************/
.lineup,.btm__banner{
    padding:var(--mg80) 0;
}
.lineup{
    background:var(--color-ye);
}

.lineup__logo{
    max-width: 160px;
    margin:0 auto var(--mg16);
}

.lineup__ttl{
    text-align: center;
    font-size:clamp(14px,14px + 0.915032679738562vw,28px);
}

.lineup__lists{
    display: flex;
    gap:var(--mg32) var(--mg16);
    flex-wrap:wrap;
    margin-top:var(--mg32);
}

.lineup__lists li{
    width:calc((100% - var(--mg16)) / 2);
}

.lineup__lists li p{
    font-size:var(--txt-m);
}

.lineup__lists li p:first-of-type{
    line-height: 1.4;
    margin:var(--mg12) 0 var(--mg8);
}

.lineup__lists li p:last-child{
    text-align: right;
}

.btm__banner__ttl{
    font-size: var(--txt-m);
    text-align: center;
    margin-top:var(--mg12);
}

.btm__banner__lists{
    margin-top:var(--mg32);
}

.btm__banner__lists li p{
    text-align: center;
    font-size: var(--txt-m);
    line-height: 1.4;
    margin-top:var(--mg16);
}

.btm__banner__lists li.neko{
    margin-top:var(--mg32);
}

@media (min-width: 768px) {

.lineup,.btm__banner{
    padding:var(--mg120) 0;
}

.lineup__logo{
    max-width: 240px;
    margin:0 auto var(--mg32);
}



.lineup__lists{
    gap:var(--mg64) var(--mg32);
    margin-top:var(--mg80);
}

.lineup__lists li{
    width:calc((100% - var(--mg96)) / 4);
}

.lineup__lists li p:first-of-type{
    margin:var(--mg24) 0 var(--mg16);
}

.btm__banner__ttl{
    margin-top:var(--mg24);
}

.btm__banner__lists{
    margin-top:var(--mg80);
    display: flex;
    justify-content: center;
    align-items: center;
    gap:var(--mg40);
}

.btm__banner__lists li p{
    margin-top:var(--mg24);
}

.btm__banner__lists li.neko{
    margin-top:0;
}

.btm__banner__lists li{
    max-width:680px;
}

.btm__banner__lists a:hover{
    opacity: 0.8;
}

.lineup__lists a:hover{
    filter: brightness(1.1) contrast(96%);
}

}

@media (min-width: 1920px) {
.lineup,.btm__banner{
    padding:var(--mg160) 0;
}

.btm__banner__lists{
    gap:var(--mg120);
}

}


/*footer ******************************/

.footer__wrapper{
    background:var(--color-blgy);
    padding:var(--mg56) 0;
}

.footer__wrapper p{
    max-width:240px;
    margin:0 auto;
}

@media (min-width: 768px) { 

    .footer__wrapper{
        padding:var(--mg96) 0;
    }

    .footer__wrapper p{
        max-width:340px;
    }
}

@media (min-width: 1920px) {
    .footer__wrapper{
        padding:var(--mg120) 0;
    }
}


/*アニメーション
--------------------------------------------------------*/

.mainVisual__wrapper img {
  opacity: 0;
}

.mainVisual__ttl {
  opacity: 0;
  transform: translateY(10px);
}
.image-anime{
    transform: translateY(10px);
    opacity: 0;
    visibility: hidden;
}