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


/* =======================================================
*
* 	Template Style
*
* ======================================================= */
body {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
  color: #6A3906;
  background: #fff;
  font-feature-setting : "palt";
  text-align: justify;
	text-justify: inter-ideograph;
	-ms-text-justify: inter-ideograph;
}

.tube_text{
	width:720px;
	margin: 0 auto
}


@media screen and (max-width: 768px) {
	body {
		  font-size: 12px;
	}
}



a:link{
  color: #00C8FB;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
a:hover, a:active, a:focus {
  color: #cabcab;
  outline: none;
  text-decoration: none;
}

p {
  margin-bottom: 20px;
}

h1, h2, h3, h4, h5, h6, figure {
  font-weight: 400;
  margin: 0 0 20px 0;
}


ul, li{
		list-style-type:none;
		margin:0;
		padding:0
}





/********ブロックのアキ*********/
.block{
	margin:70px auto;
	text-align:center;
	clear:both
}

@media screen and (max-width: 768px) {
	.block{
		margin:40px auto;
		text-align:center;
		clear:both
	}
}

.block_long{
	margin:130px auto;
	text-align:center;
	clear:both;
}

@media screen and (max-width: 768px) {
	.block_long{
		margin:70px auto;
		text-align:center;
		clear:both;
	}

	.tube_text{
	width:95%;
	margin: 0 auto
}
}


.clear{
	clear:both;
}

/*********注釈*********/
.mini{
	font-size:12px;
	margin-top:10px;
	text-align:left
}






/*********素材背景*********/
.bg{
	background:url(../img/bg.jpg);
	padding:50px 0
}





/*********２段組み*********/
.twin{
	width:100%;
}


.grandprix_left{
	float:left;
	width:50%;
}

.grandprix_left img{
	width:100%
}

.grandprix_right{
	 float:left;
	 width:50%;
	 text-align:left
 }



@media screen and (max-width: 768px) {
.grandprix_left{
	float:none;
	width:100%;
}
.grandprix_right{
	float:none;
	width:100%;
 }
}


.grandprix_right img{
	width:100%;
}




/*********グランプリメイン写真*********/
.mainimg img{
	width:65% !important;
	margin:50px 0;
}


.mainimg_gra img{
	width:76% !important;
	margin:50px 0;
}

.mainimg_sec2 img{
	width:90% !important;
	margin:50px 0;
}


@media screen and (max-width: 1250px) {
	.mainimg img{
			width:100% !important;
			margin:50px 0;
		}
}

@media screen and (max-width: 768px) {
		.mainimg img{
			width:100% !important;
			margin:0px 0
		}

		.mainimg_gra img{
		width:100% !important;
		margin:0px 0
		}

		.mainimg_sec2 img{
		width:100% !important;
		margin:0px 0

		}
}




/*********コメント　リード*********/
.lead{
	color:#B89C53;
	font-size:150%;
	font-weight:900;
	padding:70px 0 0 0;
	text-align:left;
}
@media screen and (max-width: 768px) {
		.lead{
			padding:30px 0 0 0;
			font-size:130%;
	}
}




/*********コメント　テキスト*********/
.text_gra{
	color: #777777;
	padding:0 0px 0 0;
	text-align: justify;
	text-justify: inter-ideograph;
	-ms-text-justify: inter-ideograph;
	width:85%;
	line-height:1.9em;
	font-size:14px
}

.bo{
	font-weight:700;
	color:#B89C54
}

.tyuu{
	font-size:11px;
	line-height:1.5em;
	margin-top:10px
}

@media screen and (max-width: 1250px) {
.text_gra{
	color: #777777;
	padding:0 0px 0 0;
	text-align: justify;
	text-justify: inter-ideograph;
	-ms-text-justify: inter-ideograph;
	width:95%;
	line-height:1.9em;
	font-size:14px
}

}


@media screen and (max-width: 768px) {
	.text_gra{
		color:#515151;
		padding:0 0px 0 0;
		text-align:left;
		width:95%;
		line-height:1.9em;
		margin:0 auto
	}
}

/*********コメント下の写真*********/
.main_photo ul{
	margin:0;
	padding:0;
	clear:both;

}

.main_photo li{
	float:left;
	width:130px;
	font-size:12px;
	text-align:center;
	margin:10px 20px 40px 0px;
	line-height:1.4em;
	text-align:left;
	padding:0
}


@media screen and (max-width: 1250px) {

		.main_photo li{
		float:left;
		width:117px;
		font-size:12px;
		text-align:center;
		margin:10px 10px 40px 0px;
		line-height:1.4em;
		text-align:left;
		padding:0
	}
}


@media screen and (max-width: 768px) {

	ul.main_photo{
	width:100%;
	margin:0 auto 10px auto;
	padding:0;
	clear:both;
	display:inline-block

}

	.main_photo li{
		float:left;
		width:40%;
		font-size:12px;
		text-align:center;
		margin:6px 15px 0 15px;
		line-height:1em;
		text-align:left;
		padding:0
	}
}


.main_photo li img{
	margin-bottom:3px;
}


/*********データ表組とインタビュー　タイトル*********/
.title_data_interview{
	margin:0px 0 50px 0;
	display:block
}
@media screen and (max-width: 768px) {
	.title_data_interview{
	margin:0px 0 30px 0;
	display:block
}
}

/*********データ表組*********/
.data{
	float:left;
	margin:0 40px 0 0
}
.data_yoko{
	float:left;
}

.data_hyou{
	 margin-left:200px; margin-top:30px;
}


@media screen and (max-width: 1250px) {

	.koyuki img{
		width:80%;
		float:left;
	}

	.data_hyou{
	 margin-left:100px; margin-top:30px;
}

}

@media screen and (max-width: 768px) {
	.data{
	float:none;
	margin:10px auto 0 auto;
	width:95%
}

	.data_yoko{
	float:none;
	display:none
}
}

/*********インタビュー動画*********/

.soon{
	font-size:250%;
	font-weight:900
}

@media screen and (max-width: 768px) {
	.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  margin:0 auto;
  text-align:center
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
}



/***************通った期間***************/


.kikan img{
	margin-bottom:25px

}


@media screen and (max-width: 768px) {
.kikan img{
	width:120px;
	margin-bottom:30px

}
}




/***************データ5つ***************/



.data_block{
	margin:0 auto;
	text-align:center;
	clear:both;
	display:inline-block;
}

.data_block li{
	float:left;
	margin:10px;
	display:block;

}

.data_block li img{
	width:220px;
	margin:0px auto;
}



@media screen and (max-width: 768px) {

	.data_block{
		margin:0 auto;
		text-align:center;
		clear:both;
		display:inline-block;
		width:100%
	}

	ul.data_block{
		margin:0 auto;
		width:300px
	}

	.data_block li{
		float:left;
		margin:5px;
		display:block;

	}

	.data_block li img{
		width:140px;
		margin:0px auto;
	}

	.last{
		margin:0 0 0 100px;
		text-align:center;
		padding:0 0 0 25%
	}
}


/***************ビフォーアフター***************/


.b_a_block{
	margin:45px auto 0px auto;
	text-align:center;
	clear:both;
	display:inline-block;
}

.b_a_block li{
	float:left;
	margin:0 25px;
	display:block;

}

.b_a_block li img{
	width:380px;
	margin:0px auto;
}

/*********注釈*********/
.mini_box{
	font-size:12px;
	margin-top:10px auto 0 auto;
	text-align:left;
}


@media screen and (max-width: 1250px) {
.b_a_block li img{
		width:360px;
		margin:30px auto 10px auto;
		text-align:center
	}
}

@media screen and (max-width: 768px) {
	.b_a_block{
	margin:25px auto 10px auto;
	text-align:center;
	clear:both;
	display:inline-block;
}

	.b_a_block li{
		float:none;
		margin:0 0px;
		display:block;

	}

	.b_a_block li img{
		width:300px;
		margin:40px auto 0 auto;
		text-align:center
	}

	/*********注釈*********/
	.mini_box{
		font-size:12px;
		margin-top:10px auto 0 auto;
		text-align:left;
		width:95%
	}
}



.mini_center{
	font-size:12px;
	margin-top:10px auto 0 auto;
	text-align:center;
	width:95%
}
@media screen and (max-width: 768px) {
	.mini_center{
	font-size:12px;
	margin-top:10px auto 0 auto;
	text-align:left;
	width:95%;
	display:inline-block
}
}

/*********************ギャラリー***************************/
.gallary_text{
	font-size:150%;
}


.gallary_photo ul{
	margin:0;
	padding:0;
	clear:both;
	width:100%

}

.gallary_photo li img{
   max-height: auto;
	float:left;
	display:inline-block;
	width:16.66%;
	height:auto
}


@media screen and (max-width: 768px) {

	.gallary_text{
	font-size:150%;
	margin:0
}
	.gallary_photo li img{
		float:left;
		width:33.3%;

	}
}


/*********************締め***************************/

.end_text{
	font-size:150%;
	margin:60px 0 40px 0;
	display:inline-block;
}

.btn_moushikomi {
	clear:both;
	display:block;
	margin:30px auto;
	text-align:center
}
.footer_logo{
	margin:10px  0;
	width:150px;
	display:inline-block
}
.copy{
	font-size:12px !important;
}

@media screen and (max-width: 768px) {
	.end_text{
		font-size:150%;
		margin:40px 0 30px 0;
		display:inline-block
	}

	.btn_moushikomi img{
		width:95%;
	}

	.footer_logo img{
		width:100px;
		margin:0px 0 0 0;
	}

	.copy{
	font-size:10px !important;
}

}





/********ブロックのアキ*********/
.block_end{
	margin:70px auto 10px auto ;
	text-align:center;
	clear:both
}

.block_sec2{
	margin:70px auto 0px auto ;
	text-align:center;
	clear:both
}


@media screen and (max-width: 768px) {
	.block_end{
		margin:40px auto 10px auto;
		text-align:center;
		clear:both
	}
}




/*********************アンカー 画像ホバー時***************************/
a:hover img{
	opacity: 0.6;
	filter: alpha(opacity=60);
	 transition: opacity 0.3s ease-out;
}



/* 画像サイズ */
#container{ width:100%; margin:0 auto; }


#container_bg{background-color:#000000; margin:68px 0 0 0}


@media screen and (max-width: 768px) {
	#container_bg{background-color:#000000; margin:57px 0 0 0}
}

.slides{background-color:#000000}


/**************************スマホ画像サイズ**********************/
@media screen and (max-width: 768px) {
	img{ width: 100% }
}







/**************PC スマホ　表示・非表示************/
.pc{
	display:inline;
}
.sp{
	display:none;
}

@media screen and (max-width: 768px) {
	.pc{
	display:none;
	}
	.sp{
	display:inline;
	}
}




/* page-top */
#page-top {
	position: fixed;
	bottom: 10px;
	right: 10px;
	font-size: 77%;
	opacity:0.5;
}
#page-top a {
	background: #A0A0A0;
	text-decoration: none;
	color: #fff;
	width: 70px;
	padding: 20px 0;
	text-align: center;
	display: block;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;

}
#page-top a:hover {
	text-decoration: none;
	background: #999;
}


@media screen and (max-width: 768px) {

		#page-top {
		position: fixed;
		bottom: 0px;
		right: 10px;
		font-size: 77%;
		opacity:0.5;
	}
		#page-top a {
		background: #A0A0A0;
		text-decoration: none;
		color: #fff;
		width: 50px;
		padding: 10px 0;
		text-align: center;
		display: block;
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
	}

}