@charset "utf-8";
html {font-size: 62.5%;}
body {padding:0; margin:0;/* background-color: #eae5e3;*/}
a{text-decoration: none; color: #fff;}
#HE_wrap p {padding:0;margin:0;}

#HE_wrap {
	clear: both;
	width:100%;
	max-width: 1200px;
	padding: 0;
	margin:5% auto 0;
	/*font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";*/
	/*font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";*/
	/*font-family: "Jost", sans-serif;*/
	 font-family: "Montserrat", sans-serif;
	font-style: normal;
	/*color: #252525;	
	background-color: #f9f4ea;*/
}

/*.content {
	width: 100%;
	margin:0 auto; padding: 5% 0 5%;
	background-color: #f9f4ea;
}
*/
/*.brand-header{background-color: #f9f4ea;}*/

.main {
	width: 45%;
	margin:5% auto 5%;
}

.sp {display:none;}	
.clear {clear:both;}

/*.Lead_pc {
	width: 100%;
	margin: 0 auto 6%;
	display: block;
	text-align:center;
	font-size:1.6rem;
	padding:0 ;
	line-height:2em;
}

.Lead_sp {display: none;}*/

/*h1{width: 100%; font-size: 55px; margin: 5% auto 3%; font-weight: 500; text-align: center; }
h2{margin: 10% auto 5%; padding: 5px 0; font-size: 18px; border-top: 1px solid #353535; border-bottom: 1px solid #353535; font-weight: 400; text-align: left; text-indent: 2em;}
h3{width: 100%; font-size: 28px; margin: 10% auto 7%; font-weight: 500; text-align: center; }
p.sub_txt{width: 100%; font-size: 25px; margin: 0 auto 3%; font-weight: 400; text-align: center; }
.sml{font-size: 65%;}*/

/*ITEM*/
	
.item_box{width: 80%; margin: 0 auto 10%; display:flex; flex-wrap:wrap; justify-content: space-between;}
.item1{width: 30%; margin: 0 0 5%;}


.sample1 {
	/*width: 100%;
	height: auto;*/
	overflow: hidden;
	/*margin: 10px 8px 10px 16px;*/
	position: relative;	
}
.sample1 .caption {
	font-size: 18px;
	letter-spacing: 1px;
	font-weight: 300;
	text-align:  center;
	padding-top: 110px;
	color: #fff;
	line-height: 1.8em;
}
.sample1 .mask {
	width: 100%;
	height:	 100%;
	position: absolute;
	top: 0;
	left:  0;
	opacity: 0;	/* マスクを表示しない */
	background-color: rgba(0,0,0,0.4);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition: all 0.2s ease;
}
.sample1:hover .mask {
	opacity:		1;	/* マスクを表示する */
}

@media only screen and (max-width: 750px) {
	/*body {padding:0; margin:0; background-color: #fff;}*/
	#HE_wrap {width:100%; padding: 0 0 0; margin:5% auto -11%;}
	.pc {display:none;}
	.sp {display:block;}

	.main {width: 80%; margin:5% auto 10%;}
	/*.content {width: 100%; margin:1% auto 10%;}*/


/*ITEM*/
	.item_box{width: 90%; margin: 0 auto 10%; padding: 0;}
	.item1{width: 47%; margin: 0 0 6%;}
	

	.sample1 .caption {font-size: 16px; padding-top: 50px;	}

}
