@charset "UTF-8";
#main{
	padding-bottom : 1em;
}

/*--------------------------------------------
SHOP
---------------------------------------------*/
#shop picture img{
	width : 100%;
	height : auto;
}
#shop .about a[href^="tel"]{
	display : block;
}
#shop .sns{
	display : flex;
	align-items : center;
}
@media screen and (max-width: 768px){
	#shop .box{
		margin-top : calc( 41 * 100vw / 768 );
	}
	#shop picture{
		width : 100%;
	}
	#shop h3{
		text-align : center;
		margin-top : calc( 40 * 100vw / 768 );
	}
	#shop h3 img{
		height : calc( 55 * 100vw / 768 );
	}
	#shop .about{
		margin-top : calc( ( 34 - 8.6 ) * 100vw / 768 );
	}
	#shop .links{
		margin-top : calc( ( 40 - 8.6 ) * 100vw / 768 );
	}
	#shop .link01{
		margin-left : auto;
		margin-right : auto;
		width : calc( 600 * 100% / 736 );
		height : calc( 80 * 100vw / 768 );
	}
	#shop .sns{
		margin-top : calc( 30 * 100vw / 768 );
		justify-content : center;
	}
	#shop .sns li + li{
		margin-left : calc( 20 * 100vw / 768 );
	}
	#shop .sns img{
		height : calc( 80 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	#shop .box{
		display : flex;
		align-items : center;
	}
	#shop picture{
		flex-shrink : 0;
	}
	#shop .about{
		line-height : 1.5;
	}
	#shop .links{
		display : flex;
		align-items : center;
	}
}
@media screen and (min-width: 769px) and (max-width:1279px){
	#shop .box{
		margin-top : calc( 32 * 100vw / 768 );
	}
	#shop picture{
		width : calc( 520 * 100% / 1080 );
		margin-right : calc( 36 * 100% / 1080 );
	}
	#shop h3 img{
		height : calc( 50 * 100vw / 768 );
		max-width : 100%;
	}
	#shop .about{
		margin-top : calc( ( 26 - 4 ) * 100vw / 768 );
	}
	#shop .links{
		margin-top : calc( ( 27 - 4 ) * 100vw / 768 );
	}
	#shop .link01{
		width : calc( 118 * 100vw / 768 );
		height : calc( 50 * 100vw / 768 );
	}
	#shop .sns{
		margin-left : calc( 20 * 100vw / 768 );
	}
	#shop .sns li + li{
		margin-left : calc( 10 * 100vw / 768 );
	}
	#shop .sns img{
		height : calc( 40 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1280px) and (max-width:1379px){
	#shop .box{
		margin-top : calc( 32 * 100vw / 1280 );
	}
	#shop picture{
		width : calc( 520 * 100% / 1080 );
		margin-right : calc( 36 * 100% / 1080 );
	}
	#shop h3 img{
		height : calc( 50 * 100vw / 1280 );
	}
	#shop .about{
		margin-top : calc( ( 26 - 4 ) * 100vw / 1280 );
	}
	#shop .links{
		margin-top : calc( ( 27 - 4 ) * 100vw / 1280 );
	}
	#shop .link01{
		width : calc( 118 * 100vw / 1280 );
		height : calc( 50 * 100vw / 1280 );
	}
	#shop .sns{
		margin-left : calc( 20 * 100vw / 1280 );
	}
	#shop .sns li + li{
		margin-left : calc( 10 * 100vw / 1280 );
	}
	#shop .sns img{
		height : calc( 40 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#shop .box{
		margin-top : 32px;
	}
	#shop picture{
		width : 520px;
		margin-right : 36px;
	}
	#shop h3 img{
		height : 50px;
	}
	#shop .about{
		margin-top : calc( 26px - 4px );
	}
	#shop .links{
		margin-top : calc( 27px - 4px );
	}
	#shop .link01{
		width : 118px;
		height : 50px;
	}
	#shop .sns{
		margin-left : 20px;
	}
	#shop .sns li + li{
		margin-left : 10px;
	}
	#shop .sns img{
		height : 40px;
	}
}


/*--------------------------------------------
CONCEPT
---------------------------------------------*/
@media screen and (max-width: 768px){
	#concept .p-big{
		margin-top : calc( ( 45 - 13.6 ) * 100vw / 768 );
	}
	#concept .text-contents03{
		margin-top : calc( ( 59 - 13.6 - 8.6 ) * 100vw / 768 );
	}
	#concept .text-contents01{
		margin-top : calc( ( 69 - 8.6 - 4.5 ) * 100vw / 768 );
	}
	#concept .text-contents02{
		margin-top : calc( ( 62 - 4.5 ) * 100vw / 768 );
	}
}
@media screen and (min-width: 769px) and (max-width:1279px){
	#concept .p-big{
		margin-top : calc( ( 43 - 8.6 ) * 100vw / 768 );
	}
	#concept .text-contents03{
		margin-top : calc( ( 32 - 8.6 - 6.4 ) * 100vw / 768 );
	}
	#concept .text-contents01{
		margin-top : calc( ( 86 - 6.4 ) * 100vw / 768 );
	}
	#concept .text-contents02{
		margin-top : calc( 72 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1280px) and (max-width:1379px){
	#concept .p-big{
		margin-top : calc( ( 43 - 8.6 ) * 100vw / 1280 );
	}
	#concept .text-contents03{
		margin-top : calc( ( 32 - 8.6 - 6.4 ) * 100vw / 1280 );
	}
	#concept .text-contents01{
		margin-top : calc( ( 86 - 6.4 ) * 100vw / 1280 );
	}
	#concept .text-contents02{
		margin-top : calc( 72 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#concept .p-big{
		margin-top : calc( 43px - 8.6px );
	}
	#concept .text-contents03{
		margin-top : calc( 32px - 8.6px - 6.4px );
	}
	#concept .text-contents01{
		margin-top : calc( 86px - 6.4px );
	}
	#concept .text-contents02{
		margin-top : 72px;
	}
}

/*--------------------------------------------
MENU
---------------------------------------------*/
@media screen and (max-width: 768px){
	#price .list-price{
		margin-top : calc( 46 * 100vw / 768 );
	}
}
@media screen and (min-width: 769px) and (max-width:1279px){
	#price .list-price{
		margin-top : calc( 45 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1280px) and (max-width:1379px){
	#price .list-price{
		margin-top : calc( 45 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#price .list-price{
		margin-top : 45px;
	}
}
.products .page-navi ul{
	display : flex;
	align-items : center;
	justify-content : center;
}
.products-list .top{
	text-align : right;
	position : relative;
}
@media screen and (max-width: 768px){
	#head-banner{
		height : 35vh;
		max-height : calc( 400 * 100vw / 768 );
		margin-bottom : 1em;
	}
	#head-banner h1{
		font-size : calc( 80 * 100vw / 768 );
		padding : 0 0 calc( 40 * 100vw / 768 ) calc( 40 * 100vw / 768 );;
	}
	.products .page-navi ul li{
		width : 10em;
		margin : 0 calc( 10 * 100vw / 768 );
	}
	.products .page-navi ul li a{
		display : block;
		text-align : center;
		white-space : nowrap;
		border-bottom : 1px solid #666;
		padding-bottom : 5px;
	}
	.products-list{
		padding-bottom : 150px;
	}
	.products-list .section-title01{
		padding-top : 5em;
	}
	.products-list ul{
		margin-bottom : 2em;
	}
	.products-list ul li p.link{
		margin-top : 10px;
	}
	.products-list ul li p.link a{
		border : 1px solid #666;
		padding : 5px 15px;
		margin-right : 1em;
	}
	.products-list .top{
		margin-top : -1em;
		padding-bottom : 3em;
	}
}
@media print,screen and (min-width: 769px){
	#head-banner{
		height : 35vh;
		max-height : 350px;
		margin-bottom : 1em;
	}
	#head-banner h1{
		font-size : 60px;
		padding : 0 0 60px 80px;
	}
	.products .page-navi{
		margin-bottom : 6em;
	}
	.products .page-navi ul li{
		width : 220px;
		margin : 0 10px;
	}
	.products .page-navi ul li a{
		display : block;
		text-align : center;
		padding : 20px ;
		border : 1px solid #ccc;
	}
	.products-list ul{
		margin-bottom : 100px;
	}
	.products-list ul li p.link a{
		border : 1px solid #666;
		padding : 5px 15px;
		margin-right : 1em;
	}
	.products-list .top{
		margin-top : -5em;
		padding-bottom : 8em;
	}
}