@charset "UTF-8";
/* CSS Document */


/* ========================================
	SP
======================================== */

.sp .bgWrap{display:none;}

/* categoryTitle */
.sp .categoryTitle{
	position:relative;
	z-index:100;
}
.pc .categoryTitle .inner{display: none;}
.sp .categoryTitle .inner{
	height:100vh;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
}

.sp .categoryTitle.ca01 .inner{background-image:url(../images/category01.webp);}
.sp .categoryTitle.ca02 .inner{background-image:url(../images/category02.webp);}
.sp .categoryTitle.ca03 .inner{background-image:url(../images/category03.webp);}

.sp .panel{position:relative;}
.sp .categoryTitle{z-index:20;}
.sp .lookArea{z-index:1;}
.sp .index{z-index:1;}

.sp .categoryTitle .inner h2{width: 17em;}
.sp .categoryTitle.ca03 .inner figure{width: 50%;display: flex;justify-content: flex-end;}
.sp .categoryTitle.ca03 .inner figure img{display: block;width: 69%;}
.sp .categoryTitle.ca03 .inner .title{width: 43%;margin-right: 7%;}
.sp .categoryTitle.ca03 .inner .title h2{margin: 0 auto;}



@media(max-width:980px) {


html{font-size: 1.2vw;}


.specBox.double{width:63%;}
.u03 .col__sub .spec{width: 50%;}
.u09 .col__sub .spec{width: 50%;}
.u10 .col__sub .spec.baby{margin-top: 6em;}
.u11 .col__sub .spec{width: 60%;margin-top: 6em;}
.u12 .col__sub .spec{width: 60%;}
.u13 .col__sub .spec{width: 55%;}

/*-----*/

.footer .elementInner{width: 80%;}
.footer .allitems a{padding: 2.8em 0;}

}






@media(max-width:768px) {

.screen{display: none;}
html{font-size: 3.2vw;}


.header .title{width: 100%;top: 8%;bottom: 13%;flex-direction: column;}
.header .title .logo{width: 6.0em;margin-left: 0;}
.header .title h1{width: 14em;margin-left: 0;}
.header .title h2{width: 11.5em;}



.inView.delay{transition-delay: 0s;}

/*------*/
.bkFix{z-index: -1;}
/*------*/


.index{flex-direction: column;align-items: center;}
.index .logo{left: 2.3em;top: 2.3em;width: 5em;}
.index .indexImage{width: 58%;}
.index .indexImage h3{display: block;position: absolute;right: -4em;top: 0;width: 2em;}
.index .indexNavi{width: 58%;padding-left:0;display: block;}
.index .indexNavi h3{display: none;}
.index .indexNavi nav {margin-top: 2.5em;}
.index .indexNavi nav p{margin-top: 1.8em;}

/*------*/

.sp .categoryTitle .inner h2{width: 13em;}
.sp .categoryTitle.ca03 .inner{flex-direction: column;}
.sp .categoryTitle.ca03 .inner figure{width: 43%;justify-content: center;}
.sp .categoryTitle.ca03 .inner figure img{width: 100%;}
.sp .categoryTitle.ca03 .inner .title{width: 100%;margin-right: 0;}
.sp .categoryTitle.ca03 .inner .title h2{margin:3em auto 0;}

/*------*/

.lookArea.lookBaby{padding-bottom: 0em;padding-top: 0;}


.unit{padding-top:10vw;}
.unit.u01{margin-top: 0;}
.unit.u02{margin-top:3vw;}
.unit.u03{margin-top: 11vw;}
.unit.u04{margin-top: 11vw;}
.unit.u06{margin-top: 8vw;}
.unit.u07{padding-top:10vw;}
.unit.u08{padding-top:0;margin-top: 30vw;}
.unit.u09{margin-top: 11vw;}
.unit.u10{margin-top: 0;padding-top:5vw;}
.unit.u11{margin-top: 11vw;}
.unit.u12{margin-top: 0;padding-top: 0;}
.unit.u13{margin-top: 11vw;}


.unit .itemColumn{
	display: block;
}

/*------*/

.embla__slide{
	flex:0 0 100vw;
	margin-right:0.7vw;
}

/*------*/



.col__main{width:100%;}
.col__sub{width:100%;}

.crossfade .swiper-pagination {
	bottom: 1.8em;
	width: calc(100% - 1.6em);
}
.crossfade .swiper-pagination-bullet{
	width: 0.5em;
	height: 0.5em;
}


.u01 .col__main figure{width: 100%;margin-top: 10vw;}
.u01 .col__sub .crossfade{width: 86%;left:0;top: 0;}

.u02 .col__sub .crossfade{width: 72.5%;left: 0;top: 0;}
.u02 .col__main figure{width: 100%;margin-top: 13vw;}

.u03 .col__sub figure{width: 87%;margin-top:10vw;}
.u03 .col__sub .spec{width: 86%;margin:2.8em auto 0;}

.u05 .itemSingle{width: 67%;margin: 0 auto;}
.u05 .itemSingle figure{width: 100%;}
.u05 .itemSingle .spec{width:100%;display: block;}
.u05 .spec .gender{width: 100%;padding-top: 0;}
.u05 .spec ul{width: 100%;}
.u05 .spec li{margin-top: 0.7em;}
.u05 .spec li:first-child{margin-top: 0.8em;}
.u05 .spec li .name{width: 14em;text-decoration: none;}

.u06 .itemSingle{width: 67%;margin: 0 auto;left: 0;}
.u06 .itemSingle figure{width: 100%;}
.u06 .itemSingle .spec{width:100%;display: block;}
.u06 .spec .gender{width: 100%;padding-top: 0;}
.u06 .spec ul{width: 100%;}
.u06 .spec li{margin-top: 0.7em;}
.u06 .spec li:first-child{margin-top: 0.8em;}
.u06 .spec li .name{width: 14em;text-decoration: none;}

.bkFix .movable{padding-top: 2.3em;}

.u07 .col__main figure{display: none;}
.u07 .col__main .crossfade{width:86%;display: block;}
.u07 .col__main .crossfade figure{display: none;}
.u07 .col__sub figure{display: none;}
.u07 .spec.boy{margin-top: 1.8em;}

.u08 .col__main figure{width:100%;}
.u08 .col__main .block .inner{width: 69.6%;top: 26vw;left: 0;right: 0;margin: 0 auto;}
.u08 .col__main .block .inner .img{background: #FFF;padding: 0.4em;}
.u08 .col__main .block .inner .spec{display: none;}
.u08 .col__sub figure{width:100%;margin-left: 0;}
.u08 .spec.inSP{display: flex;width: 85%;margin: 2.8em auto 0;}
.u08 .spec.boy,.u08 .spec.boy a{color: #152f2e;}
.u08 .spec.boy .buy{background:#152f2e;}

.u09 .col__sub{position: relative; top: 0;width: 100%;}
.u09 .col__sub figure{width: 92.4%;margin: 4.5vw 0 0 7.6vw;}
.u09 .col__sub .spec{width: 85%;margin-top: 2.8em;}

.u10 .col__main{width: 93%;margin: 0 auto;}
.u10 .col__main figure{width: 100%;margin-left: 0;}
.u10 .col__sub{width: 100%;padding-left: 0;top: 0;}
.u10 .col__sub .spec{width: 85%;margin: 2.8em auto 0;}
.u10 .col__sub .spec.baby{margin-top: 1.5em;}

.u11 .col__main{width: 100%;}
.u11 .col__main figure{width: 100%;margin-left: 0;}
.u11 .col__sub{width: 100%;margin-top: 2px;}
.u11 .col__sub .subImageColumn{width:100%;margin-left:0;}
.u11 .col__sub .subImageColumn figure{width:calc(50% - 1px);}
.u11 .col__sub .spec{width: 85%;margin: 2.8em auto 0;}
.u11 .col__sub .spec.baby{margin-top: 1.0em;}
.u11 .spec .gender{padding-top: 1.02em;}

.u12 .col__main figure{width: 100%;}
.u12 .col__sub figure{width: 90%;left:0;margin-top: 5vw;}
.u12 .col__sub .spec{width: 86%;margin: 2.8em auto 0;left: 0;}

.u13 .col__main figure{width: 90%;margin:0 auto;}
.u13 .col__sub .spec{width: 85%;margin: 2.8em auto 0;}

/*------*/


.fullImage{margin-top: 24vw;}

.miniImage.m01{width: 62%;padding: 13vw 0 38vw;}
.miniImage.m02{width: 50.6%;padding: 22vw 0 28vw;}
.miniImage.m03{width: 50.6%;padding: 22vw 0 30vw;margin:0 auto;}

.columnImage{align-items: flex-start;justify-content: space-between; margin-top:16vw;}
.columnImage .left{width: 56%;}
.columnImage .right{width: 39.4%;}
.columnImage .left figure{width: 100%;margin-left: 0;}
.columnImage .right figure{width: 100%;margin-left: 0;margin-top: 4vw;}


/*------*/

.specBox{margin-top: 0em;font-size: 0.98em;}
.specBox.double{width:86%;display: block;}

.spec{display: flex;justify-content: space-between;margin-top: 2.8em;}
.spec .gender{width: 4em;font-size: 1em;padding-top: 0.3em;}
.spec ul{margin-top:0;width: calc(100% - 4em);}
.spec li{margin-top: 0.7em;}
.spec li:first-child{margin-top: 0;}
.spec li .name{width: 16em;text-decoration: none;}
.spec.narrow li .name{width: 16em;}
.spec li .price{width: 4.5em;}


/*------*/


.lastImage{
	width: 100%;
	margin-top: 38vw;
	aspect-ratio: 32 / 51;
}
.lastImage h2{width: 1.1em;top:50%;left:50%;transform:translate(-50%,-50%);}
.lastImage .lastBK{background-image:url(../images/lastimg_sp.webp);}



/*------*/

.footer .logo{left: 3em;top: 4em;width: 4.6em;}
.footer .inner{width: 100%;margin: 32vw auto 15vw;display: block;}
.footer .image{width: 100%;position: relative;}
.footer .image figure{width: 7.5em;left:0;}
.footer .image h3{
	display: block;
	position: absolute;
	top: 6vw;
	right: 9vw;
	width: 2em;
}


.footer .element{width: 100%;}
.footer .elementInner{width: 100%;}
.footer .elementInner h3{display: none;}
.footer .elementInner p{width: 72%;font-size: 1.0em;margin: 4em auto 0;}

.footer .allitems{margin: 3.5em auto 0;width: 92%;}
.footer .allitems a{padding: 3.2em 0;}


.footer .sns{width: 46%;margin-top: 4.5em;}

.footer .staff{
	position: relative;
	top: 0;
	left:0;
	font-size: 0.9em;
	transform:translateX(0);
	padding-bottom: 25vw;
}



/*NAVI----------------------------------------------*/


.mainNaviTrigrer{right: 1.5em;top: 1.5em;width: 3.5em;height: 3.5em;}


.mainNavi .naviBody{right: -100%;width: 100%;max-width:none;}
.naviBody .element{width: 87%;margin-top: 8vw;padding-bottom: 30vw;}
.naviBody .element .logo{width: 18vw;}
.naviBody .element h2{width: 32vw;left: 24vw;}

.naviBody .element .menuSet{margin-top: 10vw;}
.naviBody .element .menuSet h3{font-size:1.15em;}
.naviBody .element .menuSet ul{column-gap: 4%;margin-top:0vw;}
.naviBody .element .menuSet li{width: 48%;margin-top: 4%;}
.naviBody .element .menuSet li.null{display: none;}

.naviBody .element .column{display: block;}
.naviBody .element .column .menuSet{width: 100%;margin-top: 15vw;}
.naviBody .element .column .menuSet ul{column-gap: 4%;margin-top: 0;}
.naviBody .element .column .menuSet li{width: 48%;margin-top: 4%;}
.naviBody .element .column .menuSet.forBaby h3{margin-left: 0;}

.naviBody .element .allitems{
	margin-top: 18vw;
	width: 106%;
	position: relative;
	left: -3%;
}


}