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

@media(min-width: 1500px) {
#header .title{width: 270px;}
}


@media(max-width: 1050px) {

#header .title{ left: 10%;width: 20%;}


/*------------------*/

#about .fullWide .text p{font-size: 17px;}

/*------------------*/

.sideNavi{right:-35px;width: 30px;}
.sideNavi.view{right: 4px;}
.sideNavi ul li{margin: 12px 0;}
.sideNavi ul li .dot{
	width: 17px;
	height: 17px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	-ms-border-radius:4px;
	border-radius:4px;
}
.sideNavi .title{width: 13px;}

.sideNavi .side_Instagram{width: 21px;margin-top: 0px;}
.sideNavi .pagetop{width: 28px;margin-top: 15px;}

}



@media(max-width: 960px) {

#about .fullWide .text p{font-size: 16px;}

}



@media(max-width: 880px) {


.categoryTitle{padding-bottom: 30px;}
.categoryTitle h2,
.categoryTitle.delighter h2{font-size: 32px;}


/*---------------*/


#look{margin-top: 10%;padding-top: 6%;}

#look .lookItem{margin-top: 9%;}
#look .lookItem.farst{margin-top: 12%;}

#look .credit  .itemList dl .name{font-size: 15px;}
#look .credit  .itemList dl .name span{font-size: 12px;}
#look .credit  .itemList dl .price{font-size: 14px;}
#look .credit  .itemList dl .price span{font-size: 12px;}
.itemList .otherTrigger p{ font-size: 17px;}
.itemList .otherTrigger:after{left: 80px;right: 80px;}

/*---------------*/

#products{margin-top: 10%;padding-top: 6%;}
#products .productList{margin: 12% auto 0;width: 95%;}
#products .productList .list{width: 106%;}
#products .productList .list .listIn{width: 44%;margin-right: 6%; margin-bottom: 70px;}
#products .productList .sepc .name span{ font-size: 12px;}
#products .productList .sepc .price span{font-size: 12px;}
#products .allProducts{margin-top:10%;}

/*---------------*/

#about{margin-top: 14%;padding-top: 6%;}
#about h3{font-size: 25px;margin: 10% auto;}
#about  .illust{width: 60%;}
#about .designer{padding-top: 4%;}
#about .fullWide .text{width: 85%;}
#about .fullWide .text p{text-align: left;padding: 0.3em 0;font-size: 15px;}
#about .fullWide .text p br{display: none;}
#about .fullWide .text p br.res{display: block;}

/*---------------*/

#shoplist{margin-top: 14%;padding-top: 6%;}
#shoplist .shop{margin-top: 10%;}
#shoplist .shop h4{font-size: 17px;}
#shoplist .shop p{margin-top: 0.6em;font-size: 13px;}

/*---------------*/

footer{padding-top: 20%;}
footer h3{width: 220px;}


}




@media(max-width: 768px) {



#header .mainImage{background-image: url("../../images/mainimage_sp.jpg");}
#header .title{
    top:auto;
	bottom: 15%;
    left: 0;
	right: 0;
	width: 36%;
	-webkit-transform:none;
	transform:none;
}



.scrollbar{display: none;}


/*---------------*/


.categoryTitle{width: 86%;}

/*---------------*/

#look{width: 100%; margin-top: 16%;padding-top: 7%;}
#look .lookItem{margin: 10% auto 0;padding-bottom: 4%; overflow: hidden;}
#look .lookItem.farst{margin-top: 14%;}

#look .lookItem .oneImage{display: none;}
#look .lookItem .slideImage{width: 75%;margin: 0 auto;float: none;overflow: visible;}
#look .lookItem .slideImage .pcView {display: none;}
#look .lookItem .slideImage .spView {display: block;}

#look .lookItem .credit{width: 75%;margin: 0 auto;position: relative;z-index: 100;}
#look .credit  .itemList dl .name{font-size: 15px;}
#look .credit  .itemList dl .name span{font-size: 12px;}
#look .credit  .itemList dl .price{font-size: 15px;}
#look .credit  .itemList dl .price span{font-size: 12px;}
.itemList .otherTrigger{margin-top:25px;}
.itemList .otherTrigger p{ font-size: 18px;}
.itemList .otherTrigger:after{left: 80px;right: 80px;}

/*---------------*/


#products{width: 100%; margin-top: 16%;padding-top: 7%;}
#products .productList{margin: 14% auto 0;width: 86%;}

#products .allProducts{margin-top:10%;}
#products .allProducts a{padding-top: 25%;background-image: url("../../images/allproduct_bk_sp.jpg") ;}
#products .allProducts a span{width: 35%;}


#products .allProducts a:after{background: rgba(212,205,159,0.65);}
#products .allProducts a p .off{opacity: 0;}
#products .allProducts a p .on{opacity: 1;}





/*---------------*/

#about{margin-top: 16%;padding-top: 7%;}
#about .aboutInner{width: 100%;}
#about .designer{padding-top: 3%;}

#about h3{margin: 10% auto;}
#about  .illust{padding: 5% 0;margin-bottom: 10%;}
#about  .illust img{width: 60%;}
#about .fullWide{padding: 60px 0;}

/*---------------*/

#shoplist{margin-top: 16%;padding-top:7%;width: 100%;}
#shoplist .shop{width: 85%;margin-top: 10%;}

/*---------------*/

footer{padding-top: 25%;}
footer .inner{padding-bottom:100px;}
footer h3{width: 200px;}

footer .pagetop{display: none;}


.sideNavi{display: none;}


/*-------------------------------------------------------------*/

.spBottomNavi{
	display: block;
	width: 100%;
	position: fixed;
	left: 0;
	bottom: -9vw;
	z-index: 200;
	-webkit-transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
	transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}
.spBottomNavi.view{
	bottom: -1px;
}
.spBottomNavi ul{
	width: 100%;
	font-size: 0;
}
.spBottomNavi ul li{
	width: 22.5%;
	display: inline-block;
	text-align: center;
	height: 7.5vw;
	position: relative;
	vertical-align: top;
}
.spBottomNavi ul li:last-child{
	width: 10%;
	background: #6E5E41;
}
.spBottomNavi ul li:last-child svg{
	fill:#BBB;
	width: 30%;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	margin: 0 auto;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
.spBottomNavi ul li a{
	display: block;
	width: 100%;
	height: 7.5vw;
	position: relative;
	background: #6E5E41;
	border-right: 1px solid #5D4B2A;
	box-sizing: border-box;
	
}
.spBottomNavi ul li a span{
	color: #BBBBBB;
	font-size:2.5vw;
	font-family: 'Antonio', sans-serif;
	font-weight: 200;
	line-height: 1;
	display: block;
	letter-spacing: 0.05em;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	margin: 0 auto;
	 -webkit-transform:translateY(-50%);
	 transform:translateY(-50%);
}



}




@media(max-width: 700px) {


.categoryTitle{width: 80%;}

/*---------------*/

#products .productList{width: 100%;}
#products .productList .list{width: 100%;}
#products .productList .list .listIn{width: 100%;margin-right: 0%;margin-bottom:80px;}
#products .productList .slideImage {width: 75%;margin: 0 auto;}

#products .productList .comment{width: 75%;margin: 20px auto 0;}
#products .productList .sepc{width: 75%;margin: 20px auto 0;}

#products .productList .slideImage{padding-bottom: 42px;}
.slick-dots{bottom:-35px;}


#products .allProducts{margin-top:2%;width: 80%;}
#products .allProducts a{padding-top: 28%;}
#products .allProducts a p{width: 35%;}



/*---------------*/

#shoplist .shop{text-align: center;}
#shoplist .shop ul.left{width: 100%;float: none;}
#shoplist .shop ul.right{width: 100%;float: none;}

/*---------------*/

footer{padding-top: 20%;}
footer .inner{padding-bottom:85px;}
footer .instagram{width: 26px;padding: 12% 0 10%;}
footer h3{width: 160px;}
footer .copyright{font-size: 14px;margin-top: 25px;}


/*---------------*/


.spBottomNavi ul li{height: 8.0vw;}
.spBottomNavi ul li a{height: 8.0vw;}
.spBottomNavi ul li a span{font-size:2.7vw;}


}




@media(max-width: 560px) {

#header .title{width: 40%;}



/*---------------*/

.categoryTitle{padding-bottom: 25px;}
.categoryTitle h2,
.categoryTitle.delighter h2{font-size: 28px;}

/*---------------*/

.slick-prev::after{
	border-right: 12px solid #E0DDCD;
	border-top: 12px solid transparent;
	border-bottom: 12px solid transparent;
}

.slick-next::after{
	border-left: 12px solid #E0DDCD;
	border-top: 12px solid transparent;
	border-bottom: 12px solid transparent;
}

/*---------------*/

#look{margin-top: 18%;}
#look .credit  .itemList dl .price{margin-top: 0.15em;}

/*---------------*/

#products{margin-top: 20%;}

/*---------------*/

#about{margin-top: 20%;}
#about h3{margin: 10% auto 12%;font-size: 22px;}
#about  .illust{width: 80%; margin-bottom: 12%;}
#about  .illust img{width: 60%;}
#about .fullWide{padding: 10% 0;}
#about .fullWide .text{width: 80%;}
#about .fullWide .text p{font-size: 14px;line-height: 2.0;}

/*---------------*/

#shoplist{margin-top: 20%;}
#shoplist .shop{margin-top: 50px;}
#shoplist .shop li{margin-bottom: 40px;}

/*---------------*/

footer{padding-top: 23%;}
footer .inner{padding-bottom:15vw;}
footer .instagram{width: 26px;padding: 16% 0 13%;}
footer h3{width: 150px;}
footer .copyright{font-size: 13px;margin-top: 25px;}

/*---------------*/

.spBottomNavi ul li{height: 8.4vw;}
.spBottomNavi ul li a{height: 8.4vw;}
.spBottomNavi ul li a span{font-size:3.0vw;}
.spBottomNavi ul li:last-child svg{width: 35%;}
}




@media(max-width: 460px) {

#header .title{width: 50%;}

/*---------------*/

.categoryTitle{width: 82%;}

.categoryTitle{padding-bottom: 20px;}
.categoryTitle h2,
.categoryTitle.delighter h2{font-size: 24px;}

/*---------------*/

.slick-prev::after{
	border-right: 10px solid #E0DDCD;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
}

.slick-next::after{
	border-left: 10px solid #E0DDCD;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
}

/*---------------*/

#look{margin-top: 24%;}

#look .lookItem{margin-top: 14%;}
#look .lookItem.farst{margin-top:18%;}
#look .lookItem .slideImage{width: 82%;}

#look .lookItem .credit{width: 82%;}

.itemList .otherTrigger{margin-top:10px;}
.itemList .otherTrigger p{ font-size: 16px;}
.itemList .otherTrigger:after{left: 70px;right: 60px;}
.itemList .otherTrigger span:after,
.itemList .otherTrigger span:before{width: 17px;}
#look .credit .itemList{width: 100%;}
#look .credit  .itemList dl .name{font-size: 14px;width: calc(100% - 55px);}
#look .credit  .itemList dl .name span{font-size: 11px;}
#look .credit  .itemList dl .price{font-size: 14px;margin-top: 0.15em;}
#look .credit  .itemList dl .price span{font-size: 11px;}

#look .credit .itemList dl dd{width: 75px;}
#look .credit .itemList dl dd span{font-size: 10px;}
#look .credit .itemList dl dd a{padding: 3px 0px 4px;width: 50px;font-size: 13px;}

/*---------------*/

#products{margin-top: 26%;}


#products .productList .list{width: 100%;margin-top: 18%;}
#products .productList .list .listIn{width: 100%;margin-right: 0%;margin-bottom:17%;}
#products .productList .slideImage {width: 75%;}

#products .productList .comment{width: 82%;margin-top:15px;line-height: 2.0;letter-spacing: 0.03em;}
#products .productList .sepc{width: 82%;margin: 20px auto 0;}

#products .productList .sepc .specIn{margin-top: 0px;}
#products .productList .sepc .name{ font-size: 14px;}
#products .productList .sepc .name span{ font-size: 11px;}
#products .productList .sepc .price{font-size: 14px;margin-top: 0.1em;}
#products .productList .sepc .price span{font-size: 10px;}

#products .productList .sepc .buy span{font-size: 11px;}
#products .productList .sepc .buy a{padding: 3px 0px 4px;width: 50px;font-size: 13px;}


#products .allProducts{margin-top:2%;width: 85%;}
#products .allProducts a{padding-top: 32%;}
#products .allProducts a p{width: 45%;}

/*---------------*/

#about{margin-top: 26%;}
#about h3{margin: 10% auto 12%;font-size: 17px;}
#about  .illust{width: 76%; margin-bottom: 14%;}
#about .fullWide .text p{font-size: 13px;line-height: 2.0;}

/*---------------*/

#shoplist{margin-top: 26%;}
#shoplist .shop{margin-top: 50px;}
#shoplist .shop li{margin-bottom: 40px;}

#shoplist .shop h4{font-size: 15px;}
#shoplist .shop p{font-size: 13px;}

/*---------------*/

footer{padding-top: 25%;}
footer .inner{padding-bottom:15vw;}
footer .instagram{width: 25px;padding: 20% 0 14%;}
footer h3{width: 130px;}
footer .copyright{font-size: 12px;margin-top: 15px;}

/*---------------*/

.spBottomNavi{
	bottom: -11.5vw;

}
.spBottomNavi ul li{height: 11.0vw;}
.spBottomNavi ul li a{height: 11.0vw;}
.spBottomNavi ul li a span{font-size:3.4vw;}
.spBottomNavi ul li:last-child svg{width: 35%;}


}



@media(max-width: 350px) {


/*---------------*/

.categoryTitle{width: 85%;}

.categoryTitle{padding-bottom: 15px;}
.categoryTitle h2,
.categoryTitle.delighter h2{font-size: 20px;}

/*---------------*/

.slick-prev::after{
	border-right: 8px solid #E0DDCD;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
}

.slick-next::after{
	border-left: 8px solid #E0DDCD;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
}
.slick-prev{left:-10%;}
.slick-next{right:-10%;}

/*---------------*/

#look .lookItem .slideImage{width: 85%;}

#look .lookItem .credit{width: 85%;}

.itemList .otherTrigger p{ font-size: 15px;}
.itemList .otherTrigger span:after,
.itemList .otherTrigger span:before{width: 15px;}
#look .credit .itemList{width: 100%;}
#look .credit  .itemList dl .name{font-size: 13px;}
#look .credit  .itemList dl .name span{font-size: 11px;}
#look .credit  .itemList dl .price{font-size: 13px;}
#look .credit  .itemList dl .price span{font-size: 11px;}

#look .credit .itemList dl dd{width: 70px;}
#look .credit .itemList dl dd span{font-size: 10px;}
#look .credit .itemList dl dd a{padding: 2px 0px 3px;width: 45px;font-size: 12px;}

/*---------------*/

#products .productList .slideImage {width: 80%;}

#products .productList .comment{width: 85%;font-size: 12px;}
#products .productList .sepc{width: 82%;margin: 20px auto 0;}

#products .productList .sepc .name{ font-size: 13px;}
#products .productList .sepc .name span{ font-size: 11px;}
#products .productList .sepc .price{font-size: 13px;}
#products .productList .sepc .price span{font-size: 11px;}

#products .productList .sepc .buy span{font-size: 10px;}
#products .productList .sepc .buy a{padding: 2px 0px 3px;width: 45px;font-size: 12px;}

#products .allProducts{margin-top:2%;width: 85%;}
#products .allProducts a{padding-top: 32%;}
#products .allProducts a p{width: 45%;}

/*---------------*/

#about h3{font-size: 16px;}
#about  .illust{width: 76%; margin-ottom: 14%;}
#about .fullWide .text{width:85%;}
#about .fullWide .text p{font-size: 12px;line-height: 2.0;}

/*---------------*/

#shoplist .shop{margin-top: 45px;}
#shoplist .shop li{margin-bottom: 35px;}

#shoplist .shop h4{font-size: 14px;}
#shoplist .shop p{font-size: 12px;}

/*---------------*/

footer h3{width: 120px;}
footer .copyright{font-size: 11px;margin-top: 13px;}

/*---------------*/


.spBottomNavi ul li a span{font-size:3.6vw;}






}