@charset "shift_jis"; 

/*********************************************************
共通設定
*********************************************************/


/*
見出し
*********************************************************/

h1{}
/*ページタイトル*/
h2{}
/*タイトル*/
h3{font-weight:600; font-size:2.2em; line-height:1.2em; margin-bottom:15px; text-align:center;}
.mainImg h3,
.secondImg h3{
	position:absolute;
	bottom: 50%;
	-webkit-transform: translateY(50%);
	-ms-transform: translateY(50%);
	transform: translateY(50%);
	width:100%;
	text-shadow: 0px 0px 10px #fff,0px 0px 10px #fff;
	margin-bottom:0;
	font-size:1.4em;
	line-height:1.2em;
	}
/*サブタイトル*/
h4{
	font-weight:600;
	font-size:2.2em;
	line-height:1.2em;
	margin-bottom:10px;
	text-align:center;
	}

/*TABLET*/
@media only screen and (min-width : 600px){
	.mainImg h3,
	.secondImg h3{font-size:1.8em; line-height:1.2em;}
	h4{ text-align:left; margin-bottom:20px;}

	
}
/*PC*/
@media only screen and (min-width : 1025px){
	h3{margin-bottom:20px;}
	.mainImg h3{font-size:2.2em; line-height:1.2em;}
}


/*
共通-コンテンツ
*********************************************************/

.contents{padding:0 0 20px;}

/*TABLET*/
@media only screen and (min-width : 600px){
	.contents{padding:40px 0;}
}
/*PC*/
@media only screen and (min-width : 1025px){
}

/*
mainImg
*********************************************************/
.mainImg{ position:relative;}

.secondImg{position:relative; padding-top:35%; max-height:300px; overflow:hidden;}
.secondImg img{
	position:absolute;
	bottom: 50%;
	right:50%;
	-webkit-transform: translate(50%,50%);
	-ms-transform: translate(50%,50%);
	transform: translate(50%,50%);
	max-width:none;
	max-height:100%;
}
/*PC*/
@media only screen and (min-width : 1025px){
.secondImg{padding-top:300px;}

}
/*
ヘッダー
*********************************************************/
#header{
	clear:both;
	float:none;
	padding:20px 0;
	padding-right:50px;
	}
.logo img{max-height:30px; margin:auto;}

/*TABLET*/
@media only screen and (min-width : 600px){
	#header{
		padding:60px 0 20px;
	}
}
/*PC*/
@media only screen and (min-width : 1025px){
	.logo img{max-height:50px;}
}

/*IE*/
@media all and (-ms-high-contrast:none){
}



/*
フッター
*********************************************************/
#footer{
	/*position: absolute; ←wrapperの一番下に表示 */
	bottom: 0;
	left:0;
	width:100%;
	clear:both;
	float:none;
	padding:0 0 20px;
	}
.f-menu{
	text-align:center;
	}
.f-menu > *{
	display:inline-block;
	margin:0 10px;
	font-size:0.9em;
	line-height:1;
	}
.f-menu a{
	text-decoration:none;
	color:#393c44;
	}
.f-menu a:hover,
.f-menu a:active{
	text-decoration:underline;
	}

/*
SMS
*********************************************************/

.sns{ text-align:center;}
.sns p a{ text-decoration:none; font-weight:bold;color:#393c44;}
.sns p a:hover,
.sns p a:active{
	color:#cc0000;
	}
.sns img{display:inline-block; vertical-align:middle; max-width:40px;}



#insta ul {
  display: flex;
  flex-wrap: wrap;
	}
#insta li {
	position:relative;
  list-style: none;
  width: 33.3333%;
	padding-top:33.3333%;
	background:#fff;
	}
#insta img {
	position:absolute;
	bottom:50%;
	right:50%;
	-webkit-transform: translate(50%, 50%);
	-ms-transform: translate(50%, 50%);
	transform: translate(50%, 50%);
	max-height:100%;
	max-width:100%;
	z-index:1;
	}
#insta li a {
  display: block;
	}

#insta li .like {
	position:absolute;
	bottom:50%;
	right:50%;
	-webkit-transform: translate(50%, 50%);
	-ms-transform: translate(50%, 50%);
	transform: translate(50%, 50%);
	max-height:100%;
	max-width:100%;
  font-size: 20px;
  color: #fff;
  opacity: 0.6;
  text-shadow: 0 0 7px #000;
	z-index:2;
	}
#insta li .like i{
	margin-right:5px;
	}
.js-FacebookResize{
    max-width: 500px; /* Facebook Page Plugin の最大幅 */
    margin: 0 auto;
	}
.js-FacebookResize > .fb-page {
    width: 100%;
	}
.js-FacebookResize > .fb-page > span,
.js-FacebookResize iframe {
    width: 100% !important;
	}



/*TABLET*/
@media only screen and (min-width : 600px){
}
/*PC*/
@media only screen and (min-width : 1025px){
	.instagram{
		float:left;
		width : 60% ;
		width : -webkit-calc(100% - 540px) ;
		width : calc(100% - 540px) ;
		}
	.facebook{
		float:right;
		width:500px;
		}
}



/*lang*/
.lang{ text-align:center;}
.lang > div{
	display:inline-block;
	border:#ccc solid 1px;
	border-radius:50px;
	-moz-border-radius:50px;
	-webkit-border-radius:50px;
	font-size:0.8em;
	line-height:1;
	width:200px;
	padding:8px;
	}
.lang > div p{
	display:inline-block;
	width:48%;
	border-right:#ccc solid 1px;
	}
.lang > div p:last-child{ border-right:none;}
.lang a{
	display:block;
	padding:5px;
	text-decoration:none;
	color:#393c44;
	}
.lang a:hover,
.lang a:active{
	color:#cc0000;
	}

/**/
.copyright{
	padding:8px 0;
	font-size:0.8em;
	line-height:1;
	text-align:center;
	}

/*TABLET*/
@media only screen and (min-width : 600px){
}
/*PC*/
@media only screen and (min-width : 1025px){
	#footer{padding:0 0 40px;}
}

/*********************************************************
index？共通？
*/

.contWrap{ position:relative;}

.contTxtL,
.contTxtR{ margin-bottom:10px;}

.contImgR img,
.contImgL img{ width:80%; margin:0 auto 20px;}


.contWrap dl{}
.contWrap dt{ font-weight:600; font-size:1.6em; line-height:1.2em; margin-bottom:10px; text-align:center;}
.contWrap dd p{ margin-bottom:10px;}
/*.contWrap dd p:last-child{ margin-bottom:0;}*/

/*TABLET*/
@media only screen and (min-width : 600px){
	.contTxtL{float:left; width:60%; margin-bottom:0;}
	.contImgR{ float:right; width:38%;}
	.contTxtR{ float:right; width:60%; margin-bottom:0;}
	.contImgL{ float:left; width:38%;}
	.contImgR img{width:auto; margin-right:0;}
	.contImgL img{width:auto; margin-left:0;}
	.contWrap dt{ text-align:left; margin-bottom:20px;}

}


/*PC*/
@media only screen and (min-width : 1025px){
	.contTxtL{
		position:absolute;
		bottom: 50%;
		left:0;
		-webkit-transform: translateY(50%);
		-ms-transform: translateY(50%);
		transform: translateY(50%);
		width : 70% ;
		width : -webkit-calc(100% - 420px) ;
		width : calc(100% - 420px) ;
		}
	.contImgR{ float:right; width:380px;}
	
	.contTxtR{
		position:absolute;
		bottom: 50%;
		left:420px;
		-webkit-transform: translateY(50%);
		-ms-transform: translateY(50%);
		transform: translateY(50%);
		width : 70% ;
		width : -webkit-calc(100% - 420px) ;
		width : calc(100% - 420px) ;
		}
	.contImgL{ float:left; width:380px;}

		/*ギャラリー*/
		.access .contTxtR{
			left:520px;
			width: 70%;
			width: -webkit-calc(100% - 520px);
			width: calc(100% - 520px);
			}
		.access .contImgL{ width:500px;}

}


/*********************************************************
contact
*/
.contactWrap{ clear:both;}
.contactWrap > p{
	float:left;
	width:25%;
	position:relative;
	background:#fff;
	padding-top:25%;
	}
.contactWrap > p i{
	position:absolute;
	bottom: 50%;
	right:50%;
	-webkit-transform: translate(50%,50%);
	-ms-transform: translate(50%,50%);
	transform: translate(50%,50%);
	color:#183153;
	font-size:3em;
	line-height:1;
	}
.contactWrap > div{
	float:right;
	width:73%;
	}
.contactTtl{ font-size:1.2em; line-height:1.2em; font-weight:600; color:#183153;}
.contactTtl a{color:#183153;}
.contactTtl a:hover,
.contactTtl a:active{color:#cc0000;}

/*PC*/
@media only screen and (min-width : 1025px){
	.contactWrap{
		width:80%;
		margin-left:auto;
		margin-right:auto;
		}
	.contactWrap > p{ width:200px; padding-top:200px;}
	.contactWrap > div{
		width:-webkit-calc(100% - 240px) ;
		width:calc(100% - 240px) ;
		}
	.contactWrap > p i{font-size:6em;line-height:1;}
	.contactTtl{ font-size:2em; line-height:1.2em;}
}


/*********************************************************
work
*/

/*カテゴリボタン*/
.cateBtn{
	text-align: center;
	}
.cateBtn li{
	display:inline-block;
	padding:0px 14px 0px 10px;
	border-right:#666 solid 1px;
	}
.cateBtn li:last-child{
	border-right:none;
	}

/*一覧*/
.productsList{ clear:both;}
.productsList li{
	position:relative;
	background:#fff;
	text-align:center;
	padding:10px;
	}
.productsList li a{
	position:relative;
	height:100%;
	display:block;
	text-decoration:none;
	color:#393c44;
	}
.listName{ font-weight:600;}
.listPhoto{}
.listPhoto img{ margin:auto;}

.productsList .listPhoto{
	max-width:300px;
	max-height:300px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	overflow:hidden;
	padding: 100% 0 0;/*正方形*/
	}
.productsList .listPhoto img{
	position:absolute;
	top:50%;
	right:50%;
	-webkit-transform: translate(50%, -50%);
	-ms-transform: translate(50%, -50%);
	transform: translate(50%, -50%);
	max-height:300px;
	max-width:100%;
	z-index:1;
	} 
.listPR{ font-size:0.8em; line-height:1.2em;}

/*詳細*/
.productsDetail{
	position:relative;
	background:#fff;
	padding:10px;
	}
.productsDetail .listName{
	text-align:center;
	font-size:1.4em;
	line-height:1.3em;
	}
.productsDetail .listPR{
	color:#cc0000;
	text-align:center;
}
.cartBtn a{
	position:relative;
	display:block;
	height:100%;
	max-width:300px;
	margin-left:auto;
	margin-right:auto;
	padding:20px 0;
	background:#3a9ed9;
	color:#ffffff;
	text-align:center;
	text-decoration:none;
	}
.cartBtn a:hover,
.cartBtn a:active{
	background:#cc0000;
	}

/*TABLET*/
@media only screen and (min-width : 600px){
	.productsList li{padding:20px;}
	.productsDetail{padding:20px;}
}
/*PC*/
@media only screen and (min-width : 1025px){
	.productsDetail{padding:40px;}

}
/*IE*/
@media all and (-ms-high-contrast:none){
}



/*********************************************************
個人情報保護方針
*/
.privacy{}

.privacy dt{font-weight:bold; background:#e1e1e1; padding:10px; margin-bottom:5px;}
.privacy dd{padding:10px; font-size:0.9em;}



/*TABLET*/
@media only screen and (min-width : 600px){
}
/*PC*/
@media only screen and (min-width : 1025px){
}
/*IE*/
@media all and (-ms-high-contrast:none){
}