
@charset "utf-8";
/* CSS Document */
/************フォント************/
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);





.kako{
	font-size:28px;
	font-weight:bold;
	border:3px #00b36c solid;
	color:#00b36c;
	width:580px;
	margin:0 auto;
	padding:10px;
	display:block
}

/************数値詳細************/
.detail{
	margin:120px auto;
}

@media screen and (max-width: 768px) {
.detail{
	margin:60px auto 80px auto;
}

}


.data_box{
	width:100%;
	background:#f3f4f4;
	text-align:center;
	padding-bottom:140px;
	position:relative
}




/*********コメント　リード*********/
.lead{
	color:#B89C53;
	font-size:150%;
	font-weight:600;
	padding:70px 0 0 0;
	text-align:left;
}




/*********受賞者画像*********/

.gra_main{
	margin:0 0 0 300px;
}
.text_gra{
	color: #777777;
	padding:0 0px 0 0;
	text-align: justify;
	text-justify: inter-ideograph;
	-ms-text-justify: inter-ideograph;
	width:390px;
	line-height:1.9em;
	font-size:14px;
	position:absolute;
	top:5%;
	left:20%
}

@media screen and (max-width: 1680px) {
.gra_main{
	margin:0 0 0 20%;
}
.text_gra{
	width:390px;
	top:5%;
	left:5%
}


}

@media screen and (max-width: 1250px) {
.gra_main{
	margin:0 0 0 30%;
	height:1100px

}
.gra_main img{
	width:85%;

}

.text_gra{
	width:390px;
	top:0%;
	left:2%
}
}


@media screen and (max-width: 768px) {
.gra_main{
	margin:0 0 0 0%;
	height:auto
}
.gra_main img{
	width:100%;
}

.text_gra{
		width:93%;
		line-height:1.8em;
		margin:0 auto;
		position:initial
}
.lead{
	padding:30px 0 0 0;
	font-size:130%;

}
}


@media screen and (max-width: 768px) {
	.sp_img{
		width:90%
	}

}



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

}

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

.main_photo li:last-child{
	margin-right:0;
}

.main_photo li img{
	margin-bottom:3px;
	width:120px;
	border-radius:6px
}

@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:30%;
		font-size:12px;
		text-align:center;
		margin:6px 5px 0 5px;
		line-height:1.3em;
		text-align:left;
		padding:0
}

.main_photo li img{
	margin-bottom:3px;
	width:100%;
	border-radius:6px
}
}



/*********コメント　テキスト*********/


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

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



.entry21 img{
	width:100%;
}

.setsumei{
	background:url(../img/setsumei.jpg) no-repeat;
	text-align:center;
	padding:130px 0;
	background-size:cover
}

.shop{
	margin:20px 0 ;
}


.nuno1{
	background:url(../img/nuno1.jpg) no-repeat;
	text-align:center;
	padding:130px 0;
	clear:both;
	background-size:cover
}

.nuno_gin{
	background:url(../img/nuno_gin.jpg) no-repeat;
	text-align:center;
	padding:130px 0;
	clear:both;
	background-size:cover
}

.nuno_pink{
	background:url(../img/nuno_pink.jpg) no-repeat;
	text-align:center;
	padding:110px 0 80px 0;
	clear:both;
	background-size:cover
}
@media screen and (max-width: 768px) {
.nuno_pink{
	padding:70px 0 60px 0;
}

}

.challenge{
	background:#000000;
	text-align:center;
	padding:140px 0;
}



/* =======================================================
*
* 	Template Style
*
* ======================================================= */
body {
	font-family: 'Noto Sans Japanese', sans-serif;<span class="s2"></span>;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
  background: #000;
  font-feature-setting : "palt";
  text-align: justify;
	text-justify: inter-ideograph;
	-ms-text-justify: inter-ideograph;
	color:#777777
}

.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;
	clear:both
}






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









/*********グランプリメイン写真*********/
.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

		}
}






















/*********データ表組とインタビュー　タイトル*********/
.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:30px auto 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:230px auto 0px auto;
	text-align:center;
	clear:both;
	display:inline-block;
	height:auto
}

@media screen and (max-width: 1250px) {
.b_a_block{
	margin:0px auto 0px auto;
}

}


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

}

.b_a_block li img{
	width:400px;
	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: 250px;
    margin: 280px auto 10px auto;
    text-align: center;
	}

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

}
}

@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:320px;
		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:100%
}

@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:50px 0 0 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;
	color:#806630
}

@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:0px 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;
	}

}





/*カルーセル→の設定*/


.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;
	position: absolute;
    top: 50%;
	display: block;
	width: 50px;
    height: 50px;
    padding: 0;
    margin-top: -10px\9; /*lte IE 8*/
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
	cursor: pointer;
	color: transparent;
    border: none;
    outline: none;
    background: transparent;
}



/*****SiTest対策で追加 20160829******/
.slick-slider .slick-slide{height: initial;}




/*カルーセルの設定*/
.demo{
	width:100%;
	margin:0px auto 0px auto;
	text-align:center;
	background:#000
}



/********コース紹介だけ矢印を透明にする**********/
.course .slick-prev,
.course .slick-next
{
	opacity: 0;
}


/********クリック時**********/
.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;
	position: absolute;
    top: 50%;
	display: block;

/********矢印が入るボックス幅**********/
    width: 20px;
    height: 40px;
    padding: 0;
    margin-top: -10px\9; /*lte IE 8*/
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
	text-align:center;
	cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;

}



/********通常時**********/
.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 40px;
    line-height: 1;
	opacity: .35;
    color:  #fff;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev
{
    left: 0px;
	z-index:2
}

.slick-next
{
    right:6px;
	z-index:2
}






