/*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;}



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

:root {
scroll-behavior: smooth;
scroll-padding:100px;
--font-body:clamp(14px, calc(11.44px + 0.342vw), 18px);
--font-name:clamp(14px, calc(10.15px + 0.513vw), 20px);
--font-lead:clamp(15px, calc(10.51px + 0.598vw), 22px);
--font-heading:clamp(16px, calc(10.87px + 0.684vw), 24px);

/* Line Height */
--line-body: 1.6;
--line-heading: 1.3;

/* Spacing (Fluid) */
--space-xs: clamp(4px, calc(2.98px + 0.261vw), 8px);
--space-sm: clamp(8px, calc(5.96px + 0.523vw), 16px);
--space-md: clamp(12px, calc(8.94px + 0.784vw), 24px);
--space-lg: clamp(16px, calc(11.92px + 1.046vw), 32px);
--space-xl: clamp(24px, calc(19.92px + 1.046vw), 40px);
--space-2xl: clamp(32px, calc(23.84px + 2.092vw), 64px);
--space-3xl: clamp(40px, calc(29.8px + 2.614vw), 80px);
--space-4xl: clamp(48px, calc(35.76px + 3.137vw), 96px);
--space-5xl: clamp(64px, calc(49.73px + 3.66vw), 120px);
--space-6xl: clamp(72px, calc(53.65px + 4.706vw), 144px);
--space-7xl: clamp(80px, calc(59.61px + 5.229vw), 160px);
--space-8xl: clamp(96px, calc(71.53px + 6.275vw), 192px);
--space-9xl: clamp(120px, calc(89.41px + 7.843vw), 240px);
--color-primary-lor:#FDF6E4;
--color-primary-or:#ED9E48;
--color-primary-gy:#AFAFAF;
--color-text:#4A4A4A;
--color-base:#FDFBF5;


/* Layout */
--container-max: 1280px;
--container-max-s: 1200px;
}


.pc{
    display: none;
}

.font-en-s{
    font-family: "minion-pro", serif;
    font-weight: 600;
    font-style: normal;
    font-size: clamp(16px, calc(14.98px + 0.261vw), 20px);
    letter-spacing: 0.1em;
}


@media (min-width: 768px) {


.pc{
    display: block;
}

.sp{
    display: none;
}

}


/*common　******************************/
.l-wrapper{
    padding-bottom:var(--mg96);
}

.contentWrapper {
    overflow: hidden;
    letter-spacing: .05em;
    color:var(--color-text) !important;
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    /* background:var(--color-base); */
}


.l-container{
    /* width: min(100% - var(--space-4xl), var(--container-max)); */
    padding:0 var(--space-xl);
    margin-inline: auto;
    position: relative;
    z-index:500;
}



@media (min-width: 768px) {

.l-wrapper{
    padding-bottom:var(--mg96);
    max-width:1920px;
    background:var(--color-primary-lor);
    margin:0 auto;
}

.l-container{
    /* width: min(100% - var(--space-6xl), var(--container-max)); */
    padding:0 var(--space-4xl);
}


}

@media (min-width: 1920px) {
    .l-container{
    padding:0 var(--space-8xl);
    /* padding:0 var(--space-xl); */
}
}



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

.mainVisual{
    width:100%;
    background:var(--color-primary-lor);
    position: relative;
    border-bottom:1px solid var(--color-primary-or);
}



.mainVisual__wrapper{
    text-align: center;
    max-width:1680px;
    margin:0 auto;

    padding:0 0 var(--space-sm);
}

.mainVisual::after{
    content:"";
    width:100%;
    height:1px;
    background:var(--color-primary-or);
    position: absolute;
    left:0;
    bottom:4px;
    z-index:100;
}


.intro{
    width:100%;
    background:var(--color-primary-lor);
}

.intro::after{
    content:"";
    display: block;
    background:url(/img/usr/freepage/20260318_spring_gift/intro-deco.png) no-repeat left top/contain;
    width: clamp(80px, calc(-22.56px + 13.675vw), 240px);
    aspect-ratio: 480 / 1028;
    position: absolute;
    bottom:-120px;
    left:0;
    z-index:100;
}

.intro__main-ttl{
    text-align: center;
    width: fit-content;
    padding:var(--space-lg) var(--space-xl);
    position: relative;
    margin:0 auto;
    border-right:1px solid var(--color-primary-gy);
    border-left:1px solid var(--color-primary-gy);
    margin-bottom:var(--space-3xl);
}

.intro__main-ttl span,.intro__main-ttl::before,.intro__main-ttl::after{
    display: block;
    width:12px ;
    height:1px;
    background:var(--color-primary-gy);
    position: absolute;
}

.intro__main-ttl span{
    top:0;
}

.intro__main-ttl::before,.intro__main-ttl::after{
    content:"";
    bottom:0;
}

.intro__main-ttl::before{
    left:0;
}

.intro__main-ttl::after{
    right: 0;
}

.intro__main-ttl span:first-of-type{
    left:0;
}


.intro__main-ttl span:last-of-type{
    right:0;
    left: inherit;
}

.intro__main-ttl p:first-of-type{
font-size:clamp(22px, calc(18.43px + 0.915vw), 36px);
margin-bottom:var(--space-sm);
}

.intro__main-ttl p:last-of-type{
    font-size: clamp(13px, calc(11.08px + 0.256vw), 16px);
    letter-spacing: 0.1em;
}

.intro__theme-ttl p{
    font-size: clamp(24px, calc(21.96px + 0.523vw), 32px);
    margin:var(--space-md) 0 var(--space-xl);
}


.intro__txt{
    font-size:clamp(14px, calc(12.98px + 0.261vw), 18px);
    line-height:1.8;
    letter-spacing: 0.1em;
}

.cat-nav{
    display: grid;
    width:90%;
    margin:var(--space-xl) auto 0;
    gap:var(--space-sm);
}

.mainVisual::after{
    bottom:6px;
}


@media (min-width: 768px) {

.intro{
    padding-bottom:var(--space-5xl);
}

.intro::after{
    bottom:-140px;
}

.intro__txt{
    text-align: center;
    line-height: 2.4;
}

.cat-nav{
    max-width: var(--container-max);
    grid-template-columns: repeat(3,1fr);
    width:100%;
    margin:var(--space-3xl) auto 0;
    gap:var(--space-2xl);
}

.cat-nav a:hover{
    opacity: 0.8;
}



}

/*section ******************************/
.skewed {
    position: absolute;
    right: 0;
    left: 0;
    width:100%;
    height: 100px;
    z-index: 0;
    transform: skewY(7deg);
    transform-origin: top right;
    border-bottom:2px solid var(--color-primary-or);
}

.skewed::after{
    content:"";
    display: block;
    width:100%;
    height:1px;
    background:var(--color-primary-or);
    position: absolute;
    left:0;
    right:0;
    bottom:4px;
}


.intro{
    position: relative;
    z-index:10;
    padding-top:var(--space-6xl);
}

.intro .skewed{
    background:var(--color-primary-lor);
    bottom: -100px;
}

.item{
    position: relative;
    padding-top:calc(100px + var(--space-4xl));
    overflow: hidden;
}

.cont__inner{
    background:var(--color-primary-lor);
    margin-top:-50px;
    padding:0 0 calc(100px + var(--space-7xl));
}

.item.stole{
    z-index:1;
    padding-bottom:calc(100px + var(--space-7xl));
    background:var(--color-base);
}

.item.umbrella{
    z-index:20;
    margin-top:-100px;
}

.item.umbrella .skewed{
    top:7px;
    background:var(--color-primary-lor);
    z-index:100;
    transform: skewY(-7deg);
    border-top:2px solid var(--color-primary-or);
    border-bottom: none;
}

.item.daily{
    z-index:30;
    margin-top:-100px;
}

.item.daily .skewed{
    background:var(--color-base);
    border-top:2px solid var(--color-primary-or);
    border-bottom:none;
    z-index:200;
    top:55px;
}

.item.umbrella .skewed::after,.item.daily .skewed::after{
    bottom:inherit;
    top:-7px;
}



.item.daily .cont__inner{
    background:var(--color-base);
    padding-bottom:var(--space-8xl);
}

.item.stole::before,.item.stole::after,.item.umbrella::before,.item.daily::before,.item.daily::after{
    content:"";
    display: block;
    position: absolute;
}

.item.stole::before{
    width: clamp(150px, calc(-118.59px + 35.812vw), 569px);
    aspect-ratio: 1138 / 1696;
    background:url(/img/usr/freepage/20260318_spring_gift/stole-deco-r.jpg) no-repeat top right/contain;
    right:0;
    top:20px;
}

.item.stole::after{
    width: clamp(200px, calc(-36.54px + 31.538vw), 569px);
    aspect-ratio: 1440 / 1328;
    background:url(/img/usr/freepage/20260318_spring_gift/stole-deco-l.jpg) no-repeat bottom left/contain;
    bottom:0;
    left:0;
}

.item.umbrella::before{
    width: clamp(150px, calc(-180.77px + 44.103vw), 520px);
    aspect-ratio: 1256 / 986;
    background:url(/img/usr/freepage/20260318_spring_gift/umbrella-deco-l.jpg) no-repeat bottom left/contain;
    left:0;
    top:60px;
    z-index:300;
}

.item.daily::before{
    width: clamp(150px, calc(-85.26px + 31.368vw), 420px);
    aspect-ratio: 1034 / 888;
    background:url(/img/usr/freepage/20260318_spring_gift/dayily-deco-r.jpg) no-repeat bottom right/contain;
    right:0;
    top:60px;
    z-index:300;
}

.item.daily::after{
    width: clamp(220px, calc(-85.77px + 40.769vw), 697px);
    aspect-ratio: 1394 / 854;
    background:url(/img/usr/freepage/20260318_spring_gift/dayily-deco-l.jpg) no-repeat bottom left/contain;
    bottom:0;
    left:0;
}


@media (min-width: 768px) {

.skewed {
    height: 200px;
}

.skewed::after{
    bottom:6px;
}

.intro .skewed{
    bottom: -200px;
}

.item{
    padding-top:calc(200px + var(--space-4xl));
}

.item.stole{
    padding-bottom:calc(200px + var(--space-7xl));
    padding-top:calc(190px + var(--space-4xl));
}
.cont__inner{
    margin-top:-90px;
    padding:90px 0 calc(200px + var(--space-7xl));
}


.item.umbrella{
    margin-top:-300px;
}

.item.umbrella .skewed{
    top:9px;

}

.item.umbrella .skewed::after,.item.daily .skewed::after{
    top:-9px;
}



.item.stole::before{
    top:0;
}


.item.umbrella::before{
    top:200px;
}

.item.daily{
    margin-top:-200px;
    padding-top:calc(200px + var(--space-4xl));
}

.item.daily .skewed{
    top:200px;
}

.item.daily::before{
    top:210px;
}



}

@media (min-width: 1920px) {

.skewed {
    height: 240px;
}

.intro .skewed{
    bottom: -240px;
}

.cont__inner{
    margin-top:-50px;
    padding:var(--space-4xl) 0 calc(240px + var(--space-7xl));
}


.item.stole{
    padding-top:calc(240px + var(--space-4xl));
    padding-bottom:calc(240px + var(--space-7xl));
}



/* .item.umbrella{
    margin-top:-300px;
} */


/* .cont__inner{
    margin-top:calc(-1 * var(--space-4xl));
} */


.item.stole::before{
    top:0;
}


.item.umbrella::before{
    top:250px;
}

.item.daily{
    margin-top:-240px;
}

.item.daily .skewed{
    top:240px;
}

.item.daily::before{
    top:250px;
}


}




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


.item__ttl{
    margin-bottom:var(--space-3xl);
}

.item__ttl div{
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    margin-bottom:var(--space-md);
}

.item.stole .item__ttl div{
    height:30px;
    aspect-ratio: 610 / 137;
    background:url(/img/usr/freepage/20260318_spring_gift/ttl-stole.png) no-repeat left center/contain;
}

.item.umbrella .item__ttl{
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.item.umbrella .item__ttl div{
    height:70px;
    aspect-ratio: 1041 / 313;
    background:url(/img/usr/freepage/20260318_spring_gift/ttl-umbrella-sp.png) no-repeat right center/contain;
}

.item.daily .item__ttl div{
    height:65px;
    aspect-ratio: 1153 / 313;
    background:url(/img/usr/freepage/20260318_spring_gift/ttl-daily-sp.png) no-repeat left center/contain;
}

.item__ttl h2{
    color:var(--color-primary-or);
    font-size:var(--font-heading);
    letter-spacing: 0.1em;
    font-weight: 500;
}

.item.umbrella .item__ttl h2{
    text-align: right;
}

.item__lead-txt{
    font-size: var(--font-lead);
    letter-spacing: 0.1em;
    line-height: 1.6;
    margin-bottom:var(--space-3xl);
}

.item__main-cont{
    display: grid;
    gap:var(--space-xl);
}


.products__item{
    width:100%;
    border:2px solid var(--color-primary-or);
    background:#FFFFFF;
    position: relative;
    padding:25px 25px 0;
}

.swiper-wrapper{
    height:auto;
}

.swiper-pagination-bullet{
    border:1px solid var(--color-primary-or);
    background:transparent;
    opacity: 1;
    margin:0 5px !important;
}

.swiper-pagination-bullet-active{
    background:var(--color-primary-or);
}

.products__item::before{
    content:"";
    display: block;
    width:calc(100% - 10px);
    height: calc(100% - 10px);
    border:1px solid var(--color-primary-or);
    position: absolute;
    right:0;
    left:0;
    top:0;
    bottom:0;
    margin:auto;
}


.item__name__wrapper,.btn{
    text-align: center;
}

.item__name__wrapper{
    padding:var(--space-lg) 0;
}

.item__name{
    font-weight: 500;
    font-size: var(--font-body);
    margin-bottom:var(--space-md);
}

.item__price{
    font-size:var(--font-heading);
    font-weight: 500;
}

.btn{
    color:var(--color-primary-or) !important;
    border-top:1px solid var(--color-primary-or);
    padding:var(--space-md) 0 calc(var(--space-md) + 5px);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    font-size:var(--font-heading);
}

.btn::after{
    content:"";
    display: block;
    width: clamp(12px, calc(10.72px + 0.171vw), 14px);
    aspect-ratio: 36 / 28;
    background:url(/img/usr/freepage/20260318_spring_gift/arrow-r.png) no-repeat center center/contain;
    position: absolute;
    right:10px;
    transition: 0.2s;
		
}

.item.umbrella .item__sub-cont{
    margin-top:var(--space-2xl);
}

.item__sub-cont{
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding-bottom: 8px;
    -webkit-overflow-scrolling: touch;
}

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

.item__sub-cont li{
  flex: 0 0 auto;
  width: 75%;
}

.item__sub-cont li:first-child{
    margin:0 0 0 var(--space-xl);
}

.item__sub-cont li:last-child{
    margin:0 var(--space-xl) 0 0;
}

.item__sub-cont img{
    border:1px solid var(--color-primary-or);
}

.item__name-sub,.item__price-sub{
    text-align: center;
}

.item__name-sub{
    font-size:var(--font-body);
    font-weight: 500;
    margin:var(--space-md) 0;
}

.item__price-sub{
    font-size:var(--font-name);
}

.item__sub-cont__warpper{
    position: relative;
    z-index:500;
}



@media (min-width: 768px) {

.item__ttl{
    margin-bottom:var(--space-2xl);
}

/* .item__ttl div{
    margin-bottom:var(--space-md);
} */
.item.stole .item__ttl div,.item.umbrella .item__ttl div,.item.daily .item__ttl div{
    height:clamp(40px, calc(27.18px + 1.709vw), 60px);
}

.item.umbrella .item__ttl div{
    aspect-ratio: 1485 / 136;
    background:url(/img/usr/freepage/20260318_spring_gift/ttl-umbrella.png) no-repeat right center/contain;
}

.item.daily .item__ttl div{
    aspect-ratio: 1786 / 136;
    background:url(/img/usr/freepage/20260318_spring_gift/ttl-daily.png) no-repeat left center/contain;
}

.item__lead-txt{
    width:50%;
    line-height: 2;
    /* margin-bottom:var(--space-3xl); */
}

.item.umbrella .item__lead-txt{
    text-align: right;
    margin:0 0 var(--space-3xl) auto;
}

.item__main-cont{
    grid-template-columns: repeat(2,1fr);
    gap:var(--space-5xl);
    max-width: var(--container-max);
    margin:0 auto;
}

.products__item{
    padding:50px 50px 0;
}


.swiper-pagination-bullet{
    margin:0 8px !important;
}

.item__sub-cont__warpper{
    padding:0 var(--space-4xl);
}

.item__sub-cont{
    max-width: var(--container-max);
    justify-content: space-between;
    margin:0 auto;
    overflow-x: visible;
    padding-bottom:0;
}


.item__sub-cont li{
  flex: inherit;
  width: calc((100% - var(--space-5xl)) / 3);
}

.item__sub-cont li a:hover{
    opacity: 0.8;
}

.item__sub-cont li:first-child{
    margin:0 ;
}

.item__sub-cont li:last-child{
    margin:0;
}

.btn:hover::after{
    right:0;
}


}


/*lineup以降*******************************/
.btm__banner{
    padding:var(--space-6xl) 0;
    position: relative;
}


.btm__banner__ttl-en{
    text-align: center;
    color:var(--color-primary-or);
    margin-bottom: var(--space-md);
    font-size: clamp(24px, calc(19.92px + 1.046vw), 40px);
}

.btm__banner__ttl{
    font-size: var(--font-body);
    text-align: center;
    margin-bottom:var(--space-3xl);
}

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

.btm__banner__lists li p{
    text-align: center;
    font-size:var(--font-body);
    line-height: var(--line-heading);
    margin-top:var(--space-sm);
}

.btm__banner__lists li:last-child{
    margin-top:var(--space-xl);
}

@media (min-width: 768px) {


.btm__banner__lists{
    display: flex;
    justify-content: center;
    align-items: center;
    gap:var(--space-5xl);
}


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

.btm__banner__lists li:last-child{
    margin-top:0;
}

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

.btm__banner__lists a:hover{
    opacity: 0.8;
}

}



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


.footer__wrapper{
    background:var(--color-primary-lor);
    padding: var(--space-5xl) 0;
}

.footer__wrapper p{
    width:clamp(240px, calc(183.92px + 14.379vw), 460px);
    margin:0 auto;
}

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


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

.image-anime2{
    opacity: 0;
    scale: 1.15;
    visibility: hidden;
}



@media (min-width: 768px) { 


}