@charset "UTF-8";
/*--------------------------------------------
MV
---------------------------------------------*/
#mv{
	font-size : 0;
}
#mv .slick-dots{
	position : absolute;
	width : 100%;
}
#mv picture{
	width : 100%;
	overflow : hidden;
}
#mv picture > img{
	width : 100%;
	height : 100%;
	object-fit : cover;
	font-family : "object-fit: cover;";
}
@media screen and (max-width: 768px){
    body {
        padding-top: calc( 120 * 100vw / 768 );
    }
	#mv{
		height : calc( 450 * 100vw / 768 );
	}
	#mv picture{
		height : calc( 450 * 100vw / 768 );
	}
	#mv .slick-dots{
		bottom : calc( 12 * 100vw / 768 );
	}
	#main .wrap , #main .wrap-fluid{
		padding-top : calc( 150 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	#main .wrap , #main .wrap-fluid{
		padding-top : 300px;
	}
}

@media screen and (min-width: 769px) and (max-width:1279px){
	#mv{
		height : calc( 450 * 100vw / 768 );
	}
	#mv picture{
		height : calc( 450 * 100vw / 768 );
	}
	#mv .slick-dots{
		bottom : calc( 14 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1280px){
	#mv{
		height : 60vh;
	}
	#mv picture{
		height : 60vh;
	}
}
@media print,screen and (min-width: 1280px) and (max-width:1379px){
	#mv .slick-dots{
		bottom : calc( 14 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#mv .slick-dots{
		bottom : 14px;
	}
}
/*--------------------------------------------
INFORMATION
---------------------------------------------*/
#information .wrap-inner{
	color : #221815;
}
#information p , #information dt , #information dd , #information li{
	letter-spacing : .1em;
}
#information li{
	margin-bottom : 2em;
	border-bottom : 1px dotted #ccc;
	padding-bottom : 2em;
}
#information li:nth-last-of-type(1){
	border-bottom : none;
}
@media screen and (max-width: 768px){
	#information .wrap-inner{
		margin-top : calc( 26 * 100vw / 768 );
	}
	#information .sub-title01{
		margin-bottom : calc( 15 * 100vw / 768 );
	}
	#information p , #information dt , #information dd , #information li{
		font-size : calc( 24 * 100vw / 768 );
		line-height : 1.2;
	}
}
@media print,screen and (min-width: 769px){
	#information p , #information dt , #information dd , #information li{
		line-height : 1.5;
	}
}
@media screen and (min-width: 769px) and (max-width:1279px){
	#information .wrap-inner{
		margin-top : calc( 21 * 100vw / 768 );
	}
	#information .sub-title01{
		margin-bottom : calc( ( 14 - 4 ) * 100vw / 768 );
	}
	#information p , #information dt , #information dd , #information li{
		font-size : calc( 16 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1280px) and (max-width:1379px){
	#information .wrap-inner{
		margin-top : calc( 21 * 100vw / 1280 );
	}
	#information .sub-title01{
		margin-bottom : calc( ( 14 - 4 ) * 100vw / 1280 );
	}
	#information p , #information dt , #information dd , #information li{
		font-size : calc( 16 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#information .wrap-inner{
		margin-top : 21px;
	}
	#information .sub-title01{
		margin-bottom : calc( 14px - 4px );
	}
	#information p , #information dt , #information dd , #information li{
		font-size : 16px;
	}
}
/*--------------------------------------------
BLOG
---------------------------------------------*/
#blog picture{
	width : 100%;
	overflow : hidden;
}
#blog picture > img{
	width : 100%;
	height : 100%;
	object-fit : cover;
	font-family : "object-fit: cover;";
}
#blog li > a{
	display : block;
}
#blog a div div{
	display : flex;
	align-items : flex-start;
	flex-wrap : wrap;
}
#blog .author:before{
	content : "：";
}
@media screen and (max-width: 768px){
	#blog ul{
		margin-top : calc( 25 * 100vw / 768 );
	}
	#blog li + li{
		margin-top : calc( 20 * 100vw / 768 );
	}
	#blog li a{
		display : flex;
		align-items : center;
	}
	#blog picture{
		width : calc( 220 * 100% / 736 );
		flex-shrink : 0;
		height : calc( 220 * 100vw / 768 );
		margin-right : calc( 14 * 100% / 736 );
	}
	#blog .title{
		font-size : calc( 26 * 100vw / 750 );
		line-height : 1.38;
	}
	#blog time , #blog .author{
		font-size : calc( 24 * 100vw / 750 );
		line-height : 1.5;
	}
	#blog .link02{
		margin-top : calc( 41 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	#blog ul{
		display : flex;
		justify-content : center;
	}
	#blog .title{
		line-height : 1.31;
	}
	#blog time , #blog .author{
		line-height : 1.5;
	}
}
@media screen and (min-width: 769px) and (max-width:1279px){
	#blog ul{
		margin-top : calc( 14 * 100vw / 768 );
	}
	#blog li{
		width : calc( 180 * 100% / 980 );
	}
	#blog li:not(:nth-child(5n+1)){
		margin-left : calc( 20 * 100% / 980 );
	}
	#blog picture{
		height : calc( 136 * 100vw / 768 );
	}
	#blog .title{
		font-size : calc( 16 * 100vw / 768 );
		margin-top : calc( ( 12 - 2.5 ) * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1280px) and (max-width:1379px){
	#blog ul{
		margin-top : calc( 14 * 100vw / 1280 );
	}
	#blog li{
		width : calc( 180 * 100vw / 1280 );
	}
	#blog li:not(:nth-child(5n+1)){
		margin-left : calc( 20 * 100vw / 1280 );
	}
	#blog picture{
		height : calc( 180 * 100vw / 1280 );
	}
	#blog .title{
		font-size : calc( 16 * 100vw / 1280 );
		margin-top : calc( ( 12 - 2.5 ) * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#blog ul{
		margin-top : 14px;
	}
	#blog li{
		width : 180px;
	}
	#blog li:not(:nth-child(5n+1)){
		margin-left : 20px;
	}
	#blog picture{
		height : 180px;
	}
	#blog .title{
		font-size : 16px;
		margin-top : calc( 12px - 2.5px );
	}
	#blog .link02{
		margin-top : calc( 30px - 3.5px );
	}
}
/*--------------------------------------------
CONCEPT
---------------------------------------------*/
	#concept .link{
        padding-top:1em;
        text-align: center;
	}    
	#concept .link a{
        display: inline-block;
        border: 1px solid #999 ;
        padding: 10px 2em;
	}    
@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 print,screen and (min-width: 769px){
	#concept .wrap{
        padding-top:80px;
	}
}

@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;
	}
}

/*--------------------------------------------
SHOP
---------------------------------------------*/

#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 );
	}
    #shop picture img{
        width : 100%;
        height : auto;
    }  
}
@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;
	}
	#shop picture , #shop picture img {
		width : 100%;
        height: auto;
	}
}
@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;
	}
}
/*--------------------------------------------
GALLERY
---------------------------------------------*/
@media screen and (max-width: 768px){
	#gallery picutre img{
		height : calc( 400 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	#galley{
        padding-top:80px !important;
	}
@media screen and (min-width: 769px) and (max-width:1279px){
	#gallery picutre img{
		height : calc( 300 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1280px) and (max-width:1379px){
	#gallery picutre img{
		height : calc( 300 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#gallery picutre img{
		height : 300px;
	}
}
    
/*--------------------------------------------
STAFF
---------------------------------------------*/
@media screen and (max-width: 768px){
	#staff .list-staff{
		margin-top : calc( 54 * 100vw / 768 );
	}
}
@media screen and (min-width: 769px) and (max-width:1279px){
	#staff .list-staff{
		margin-top : calc( 45 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1280px) and (max-width:1379px){
	#staff .list-staff{
		margin-top : calc( 45 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#staff .list-staff{
		margin-top : 45px;
	}
}

/*--------------------------------------------
ACCESS
---------------------------------------------*/
@media screen and (max-width: 768px){
	#access .map-container{
		margin-top : calc( 30 * 100vw / 768 );
	}
	#access .map-wrap .parking{
		width : calc(100vw - calc(50 * 100vw / 768));
		margin-top : calc(10 * 100vw / 768);
		margin : auto;
	}
	#access .access-text{
		padding : calc(10 * 100vw / 768) calc(10 * 100vw / 768) calc(30 * 100vw / 768) calc(10 * 100vw / 768);
	}
}
@media print,screen and (min-width: 769px){
	#access .map-wrap{
		position : relative;
	}
	#access .map-wrap .parking{
		position : absolute;
		right : 10px;
		top : 10px;
		width : 350px;
		z-index : 20;
		max-width : 30vw;
	}
	#access .map-wrap iframe{
		z-index : 5;
	}
	#access .access-text{
		padding : 5px 30px 30px 30px;
		display : flex;
	}
	#access .access-text p{
		width : 50%;
	}
}
@media screen and (min-width: 769px) and (max-width:1279px){
	#access .map-container{
		margin-top : calc( 30 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1280px) and (max-width:1379px){
	#access .map-container{
		margin-top : calc( 30 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#access .map-container{
		margin-top : 30px;
	}
}
/*--- products ------------*/
html{
	scroll-behavior : smooth;
}
.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){
	.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){
	.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;
	}
}
@media screen and (max-width: 768px){
	#gallery .author{
		font-size : calc( 24 * 100vw / 750 );
		line-height : 1.5;
	}
}
@media print,screen and (min-width: 769px){
	#gallery .author{
		line-height : 1.5;
	}
}