/*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.2s;}
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 {
    --color-hgr:#EAF3EB;
    --color-bl:#99C5DE;
    --color-ye:#F1D773;
    --color-pk:#F7C7CC;
    --color-bk:#828282;

    --txt-l:clamp(12px,3.84vw,15px);
    --txt-m:clamp(12px,3.33vw,14px);

    --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-w2:calc(var(--unit-cont-pd-w) * 4);
    --unit-mg:2.05vw;

    --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);
    --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;   
        --txt-l:clamp(15px,1.04vw,20px);
        --txt-m:clamp(14px,0.93vw,18px);

        }
        .pc{
            display: block;
        }

        .sp{
            display: none;
        }

        
        
    }

    @media (min-width:1600px) {
        :root {
        --unit-mg:0.5vw;      
        /* --cont-pd-w:4vw; */
        }
    }

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

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

.font-en{
    font-family: "begum", sans-serif;
    font-weight: 400;
    letter-spacing: 0.05em;
}

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

.l-wrapper{
    position: relative;
}

.contentWrapper {
    overflow: hidden;
    letter-spacing: .05em;
    color:var(--color-bk);
    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{
    text-align: center;
}

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

.intro::before{
    content:"";
    display: block;
    width:100%;
    height:0;
    padding-top:83.70%;
    background:url(/img/usr/freepage/20260123_spring_bags/intro-bg.png) no-repeat right top/contain;
    position: absolute;
    right:0;
    top:0;
    z-index:1;
}

.intro__wrapper{
    width:100%;
    position: relative;
    z-index:10;
    padding:0 var(--cont-pd-w);
}

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

.intro__copy-en{
    font-size:clamp(14px,5.12vw,20px);
    line-height: 1.6;
    margin-bottom:var(--mg40);
}

@media (min-width: 768px) {

.mainVisual{
    z-index:100;
    padding:0 var(--cont-pd-w2);
}

.mainVisual__wrapper{
    max-width:var(--cont-max);
    margin:0 auto;
}

.intro{
    padding:calc(19.11vw + var(--mg96)) 0 var(--mg96) 0;
    margin-top:-19.11vw;
}

.intro::before{
    width:46%;
}

.intro__wrapper{
    display: flex;
    align-items: flex-end;
    justify-content:space-between ;
    flex-direction: row-reverse;
    padding:0 var(--cont-pd-w);
}

.intro__copy-en{
    font-size:clamp(20px,1.25vw,25px);
    line-height: 2;
    text-align: right;
    margin-bottom:0;
}

.intro__txt{
    line-height: 3;
}

}


@media (min-width: 1920px) {

.intro{
    padding:calc(19.11vw + var(--mg180)) 0 var(--mg180) 0;
}

}



/*item ******************************/

.item,.shoes{
    width:100%;
    position: relative;
    margin:var(--mg96) 0 0;
}

.item::before{
    display: block;
    content:"";
    width:43.58vw;
    height:87.17vw;
    position: absolute;
    left:0;
    top:calc(clamp(45px,13.33vw,52px) / 2);
    z-index:1;
    background:url(/img/usr/freepage/20260123_spring_bags/bg-bl1.jpg) no-repeat center center/cover;
    opacity: 0.7;
}

.item.item2::before{
    background:url(/img/usr/freepage/20260123_spring_bags/bg-ye1.jpg) no-repeat center center/cover;
    left:inherit;
    right:0;
}

.item.item3::before{
    background:url(/img/usr/freepage/20260123_spring_bags/bg-pk1.jpg) no-repeat center center/cover;
}


.item .contents-inner,.shoes .contents-inner{
    position: relative;
    z-index:10;
}


.item__type-num{
    display: block;
    font-size:clamp(45px,13.33vw,52px);
    text-align: right;
    opacity: 0.4;
    margin-bottom:var(--mg24);
}

.item2 .item__type-num,.shoes .item__type-num{
    text-align: left; 
}

.item__type-ttl{
    width: fit-content;
    margin:0 0 0 auto;
}

.item2 .item__type-ttl{
    margin:0;
}

.item__type-ttl p:first-child{
    font-size:clamp(10px,2.82vw,14px);
    margin-bottom:var(--mg4);
}

.item__type-ttl p:last-child{
    font-size:clamp(20px,6.66vw,26px);
}

.item__cont{
    margin:var(--mg64) 0 0;
}

.item__image{
    width:calc(100% - var(--cont-pd-w2));
    margin:0 auto;
    aspect-ratio: 1 / 1;
}

.item__txt-cont{
    border:2px solid var(--color-bl);
    padding:calc(var(--mg64) + var(--mg32)) var(--mg24) var(--mg32);
    margin-top:calc(-1 * var(--mg64));
    text-align: center;
}

.item2 .item__txt-cont{
    border:2px solid var(--color-ye);
}

.item3 .item__txt-cont{
    border:2px solid var(--color-pk);
}

.item__txt-cont p:first-child{
    width: fit-content;
    position: relative;
    margin:0 auto var(--mg24);
    line-height: 1.6;
    font-size:clamp(14px,4.61vw,18px);
    letter-spacing: 0.12em;
}

.item__txt-cont p:first-child::before,.item__txt-cont p:first-child::after{
    display: block;
    content:"";
    width:12px;
    height:10px;
    position: absolute;
}

.item__txt-cont p:first-child::after{
    background:url(/img/usr/freepage/20260123_spring_bags/mark-l-bl.png) no-repeat center center/contain;
    left:-12px;
    top: -8px;
}
.item__txt-cont p:first-child::before{
    background:url(/img/usr/freepage/20260123_spring_bags/mark-r-bl.png) no-repeat center center/contain;
    right:-12px;
    bottom:-8px;
}

.item2 .item__txt-cont p:first-child::after{
    background:url(/img/usr/freepage/20260123_spring_bags/mark-l-ye.png) no-repeat center center/contain;
}
.item2 .item__txt-cont p:first-child::before{
    background:url(/img/usr/freepage/20260123_spring_bags/mark-r-ye.png) no-repeat center center/contain;
}

.item3 .item__txt-cont p:first-child::after{
    background:url(/img/usr/freepage/20260123_spring_bags/mark-l-pk.png) no-repeat center center/contain;
}
.item3 .item__txt-cont p:first-child::before{
    background:url(/img/usr/freepage/20260123_spring_bags/mark-r-pk.png) no-repeat center center/contain;
}

.item__txt-cont p:last-child{
    font-size:var(--txt-m);
    line-height: 2;
}

.item__vari-cont__wrapper{
    position: relative;
    margin-top:var(--mg56);
}

.item__vari-cont__wrapper::before{
    content:"";
    display: block;
    width:87.43vw;
    height:38.71vw;
    background:url(/img/usr/freepage/20260123_spring_bags/bg-bl2.jpg) no-repeat center center/cover;
    position: absolute;
    right:0;
    top:calc(clamp(24px,8.20vw,36px) * 2);
    z-index:1;
    opacity: 0.7;
}

.item2 .item__vari-cont__wrapper::before{
    background:url(/img/usr/freepage/20260123_spring_bags/bg-ye2.jpg) no-repeat center center/cover;
    left:0;
    right:inherit;
    
}

.item3 .item__vari-cont__wrapper::before{
    background:url(/img/usr/freepage/20260123_spring_bags/bg-pk2.jpg) no-repeat center center/cover;
}

.item__vari-cont__inner,.item__vari-cont__ttl{
    position: relative;
    z-index:10;
}

.item__vari-cont__ttl{
    color:var(--color-bl);
    font-size:clamp(24px,8.20vw,36px);
    letter-spacing: 0.1em;
    line-height: 1.4;
    padding:0 var(--cont-pd-w);
}

.item2 .item__vari-cont__ttl{
    color:var(--color-ye);
    text-align: right;
}

.item3 .item__vari-cont__ttl{
    color:var(--color-pk);
}

.item__vari-cont__lists {
    display: flex;
    overflow-x: auto;
    padding-bottom: 8px;
    -webkit-overflow-scrolling: touch;
    margin:var(--mg32) 0;
}

/* スクロールバー非表示（任意） */
/* .item__vari-cont__lists::-webkit-scrollbar {
display: none;
} */

.item__vari-cont__lists li {
flex: 0 0 auto;
width: 70%;
}

.item__vari-cont__lists li:first-child{
    margin:0 0 0 12.5%;
}

.item__vari-cont__lists li:last-child{
    margin:0 12.5% 0 0;
}

.item__vari-cont__lists a {
    text-align: center;
}

.item__vari-cont__txt{
    padding:0 var(--cont-pd-w2);
    text-align: center;
}

.item__vari-cont__txt h3,.item__vari-cont__txt p,.shoes__item__lists li p,.shoes__item__lists li h3{
    font-size:var(--txt-l);
}

.item__vari-cont__txt h3,.shoes__item__lists li p,.shoes__item__lists li h3{
    font-weight: normal;
    line-height: 1.4;
}

.item__vari-cont__txt p{
    margin:var(--mg16) 0 var(--mg24);
}

.item__vari-cont__txt a{
    width: 90%;
    border:1px solid var(--color-bk);
    text-align: center;
    font-size:clamp(15px,5.12vw,20px);
    padding:var(--mg16) 0;
    max-width: 320px;
    margin:0 auto;
}

.item__vari-cont__name {
    font-size:var(--txt-l);
    margin-top:var(--mg8);
}




@media (min-width: 768px) {

.item::before{
    width:22.18vw;
    height:42.55vw;
    top:calc(clamp(56px,4.89vw,94px) / 2);
}

.item__cont__wrapper{
    /* border:1px solid red; */
}

.item__type-num{
    font-size:clamp(56px,4.89vw,94px);
    margin-bottom:var(--mg56);
}

/* .item__type-ttl{
    margin:0 0 0 auto;
} */

.item__type-ttl p:first-child{
    font-size:clamp(16px,1.25vw,24px);
    margin-bottom:var(--mg8);
}

.item__type-ttl p:last-child{
    font-size:clamp(26px,2.91vw,56px);
}

.item__cont{
    margin:0;
    display: flex;
    align-items: center;
}

.item2 .item__cont{
    flex-direction: row-reverse;
}

.item__image{
    width:46.27%;
    /* margin:0 auto; */
}

.item__txt-cont{
    flex-grow: 1;
    padding:var(--mg64) var(--cont-pd-w);
    margin-top:0;
}

.item__txt-cont{
    border:4px solid var(--color-bl);
}

.item2 .item__txt-cont{
    border:4px solid var(--color-ye);
}

.item3 .item__txt-cont{
    border:4px solid var(--color-pk);
}

.item1 .item__txt-cont,.item3 .item__txt-cont{
    border-left:none;
}

.item2 .item__txt-cont{
    border-right:none;
}

.item__txt-cont p:first-child{
    margin:0 auto var(--mg32);
    line-height: 1.8;
    font-size:clamp(19px,1.45vw,28px);
}

.item__txt-cont p:first-child::before,.item__txt-cont p:first-child::after{
    width:19px;
    height:17px;
}

.item__txt-cont p:first-child::after{
    left:-19px;
    top: -12px;
}
.item__txt-cont p:first-child::before{
    right:-19px;
    bottom:-12px;
}

.item__vari-cont__wrapper{
    margin-top:var(--mg80);
    padding:0 0 var(--mg64);
}

.item__vari-cont__wrapper::before{
    width:35vw;
    height:13.54vw;
    top:inherit;
    bottom:0;
}

.item__vari-cont__ttl{
    font-size:clamp(36px,3.95vw,76px);
    padding:0 var(--cont-pd-w2);
}

.item__vari-cont__inner{
    padding:0 var(--cont-pd-w2);
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-end;
    margin-top:var(--mg16);
}

.item2 .item__vari-cont__inner{
    flex-direction: row;
}

.item__vari-cont__lists {
    display: flex;
    width:64%;
    overflow:hidden;
    padding-bottom: 0;
    margin:0;

}

.item__vari-cont__txt{
    flex-grow: 1;
}

.item__vari-cont__lists li {
    flex: inherit;
    gap:var(--mg16);
    width: calc(100% / 3);
}

.item__vari-cont__lists li:first-child,.item__vari-cont__lists li:last-child{
    margin:0;
}

.item__vari-cont__txt{
    padding:0;
    text-align: left;
}

.item2 .item__vari-cont__txt{
    text-align: right;
}

.item2 .item__vari-cont__txt a{
    margin:0 0 0 auto;
}

.item__vari-cont__txt p{
    margin:var(--mg16) 0 var(--mg40);
}

.item__vari-cont__txt a{
    width: 100%;
    max-width: 280px;
    padding:var(--mg12) 0;
    margin:0;
}

.item__image a,.item__vari-cont__txt a,.item__vari-cont__lists a p{
    transition: 0.2s;
}

.item__vari-cont__txt a:hover{
    background:var(--color-bk);
    color:#fff !important;
}

.item__image a:hover,.item__vari-cont__lists a:hover p {
    opacity: 0.8;
}


}

@media (min-width: 1920px) {

.item,.shoes{
    margin:var(--mg180) 0 0;
}

.item__type-ttl p:first-child{
    margin-bottom:var(--mg16);
}

.item__txt-cont{
    padding:var(--mg96) var(--cont-pd-w);
}

.item__vari-cont__ttl,.item__vari-cont__inner{
    padding:0;
    max-width:var(--cont-max);
    margin:0 auto;
}

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



}

/*shoes ******************************/

.shoes{
    background:#F5F5F5;
    padding-bottom:var(--mg96);
}

.shoes__ttl-en{
    display: block;
    opacity: 0.4;
    font-size: clamp(24px, 8.20vw, 36px);
    letter-spacing: 0.1em;
    position: absolute;
    top:calc(-1 * (clamp(24px, 8.20vw, 36px) / 2))
}

.shoes .contents-inner{
    padding-top:calc(var(--mg40) + ((clamp(24px, 8.20vw, 36px) / 2)));
}

.shoes__txt-wrapper{
    margin-bottom:var(--mg40);
    padding:0 var(--cont-pd-w);
}

.shoes__txt-wrapper p:first-child{
    font-size: clamp(14px, 5.12vw, 20px);
    line-height: 1.6;
    margin-bottom: var(--mg24);
}

.shoes__txt-wrapper p:last-child{
    font-size: var(--txt-l);
    letter-spacing: 0.12em;
    line-height: 2;
}

.shoes__item__lists{
    padding:0 var(--cont-pd-w);
    display: grid;
    gap:var(--mg32);
}

.shoes__item__lists li a{
    display: grid;
    gap:var(--mg8);
    text-align: center;
}

@media (min-width: 768px) {

/* .shoes{
    padding-bottom:var(--mg96);
} */

.shoes__ttl-en{
    font-size: clamp(36px, 3.95vw, 76px);
    top:calc(-1 * (clamp(36px, 3.95vw, 76px) / 2))
}

.shoes .contents-inner{
    padding-top:calc(var(--mg96) + ((clamp(36px, 3.95vw, 76px) / 2)));
}

.shoes__txt-wrapper{
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    margin-bottom:var(--mg80);
    /* padding:0 var(--cont-pd-w); */
}

.shoes__txt-wrapper p:first-child{
    font-size: clamp(20px, 1.25vw, 25px);
    line-height: 2;
    margin-bottom: 0;
}

.shoes__txt-wrapper p:last-child{
    line-height: 2.4;
    display: flex;
    justify-content: flex-end;
}

.shoes__item__lists{
    padding:0;
    grid-template-columns: 1fr 1fr 1fr;
    gap:var(--mg40);
}

.shoes__item__lists li a{
    gap:var(--mg16);
    transition: 0.2s;
}

.shoes__item__lists li a h3{
    margin-top:var(--mg8);
}

.shoes__item__lists li a:hover{
    opacity: 0.8;
}


}

@media (min-width: 1920px) {
.shoes{
    padding-bottom:var(--mg180);
}
    
.shoes .contents-inner{
    padding-top:calc(var(--mg120) + ((clamp(36px, 3.95vw, 76px) / 2)));
}
}


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

.footer__wrapper{
    background:var(--color-hgr);
    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;
    }
}



/*アニメーション
--------------------------------------------------------*/
.image-anime{
    transform: translateY(10px);
    opacity: 0;
    visibility: hidden;
}

.js-ts-image{
opacity: 0;
transform:rotate(-3deg) skew(-3deg);
/* transform: translateY(10px); */
}

.js-ts-image2{
opacity: 0;
transform:rotate(3deg) skew(3deg);
/* transform: translateY(10px); */
}

.js-txt-blur {
  opacity: 0;
  filter: blur(6px);
  will-change: opacity, transform, filter;
}

.js-txt-fade {
    transform: translateY(10px);
  opacity: 0;
}