@charset "utf-8";


/*=======================================================
	 鼻があかくなりにくい秘密
=======================================================*/
.flatbase{ padding: 0; }
#contents_header{
	height: 410px;
}
#contents_header h1{
	margin: 0;
	height: 410px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background: url(../img/header.jpg) no-repeat left top;
	border: 1px solid #fff;
	-moz-box-sizing: border-box; /* Firefox */
	box-sizing: border-box;
}
main{
	padding: 0 0 20px;
	text-align: center;
}
.cont{
	margin: 20px 70px;
	padding: 40px;
	background-color: #fff;
	overflow: hidden;
	border: 1px solid #3392d1;
}
#reason{ padding: 40px 0 0; }
#reason h2{ margin: 0 0 15px; }
#reason	p{ margin: 0 0 15px; }
#result{
	margin: 0 70px 15px;
	padding: 30px 0 20px;
	background: #f9f9f9 url(../img/result_bg.jpg) no-repeat center bottom;
}
.words{
	font-size: 17px; /* ie8 */
	font-size: 1.7rem;
}
.words_arrow{
	margin: -10px 0 10px;
	display: block;
	text-align: center;
}
#cont1_ttl{
	margin-bottom: 20px;
	height: 94px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background: url(../img/cont1_ttl.png) no-repeat center center;
}
#exponent{ margin-bottom: 30px; }
.arrow{ margin: 0 0 -30px; }
.detail_cont{ padding: 15px 0 0; }
#coating_cont li{ display: inline-block; }
#coating1{
	padding-right: 35px;
}
#photo_img{ padding: 0 0 10px 35px; }
#photo_txt{ text-align: center; }
#photo_txt li{
	width: 245px;
	display: inline-block;
}
main h2 { margin-bottom: 10px; }
main h2:not(:first-child){ margin-top: 35px; }
#secret_cont h2{
	background: url(../img/secret_ttl_bg.png) no-repeat center top;
	line-height: 42px;
	text-align: center;
}
#secret_cont h2 img{ vertical-align: middle; }
#secret_cont strong{ color: #ed6a5e; }
#newelleair_cont{
	margin: 0;
	padding: 10px 0;
	background-color: #fff;
	text-align: center;
}
#newelleair_cont a {
	text-decoration: none;
	color: #fff;
	display: inline-block;
}
#newelleair_cont #end{ margin: 10px 0; }
#newelleair_cont a .products_link{
	margin: 25px auto;
	padding: 15px 45px 15px 15px;
	width: 220px;
	background: #6abce2 url(../img/btn_arrow.png) no-repeat 93% center;
	color: #fff;
	font-weight: bold;
	border-radius: 5px;
}
#newelleair_cont a .products_link:hover{
	opacity: 0.8; /*通常*/
	-ms-filter: "alpha(opacity=80)"; /*IE8*/
}
#research{
	margin: 20px 70px;
	padding: 30px 60px 30px;
	background-color: #fff;
	overflow: hidden;
	border: 1px solid #efefef;
}

#profile{ text-align: left; }
#profile h4{
	padding-top: 10px;
	font-weight: normal;
	font-size: 14px; /* ie8 */
	font-size: 1.4rem;
}
#profile h4 .kana{
	font-weight: normal;
	font-size: 11px; /* ie8 */
	font-size: 1.1rem;
}
#comment{
	margin-top: 30px;
	padding: 15px 15px;
	position: relative;
}
#comment:before{
	content: ' ';
	display: block;
	width: 50px;
	height: 50px;
	position: absolute;
	top: 0;
	left: 0;
	background: url(../img/comment.png) no-repeat left top;
}
#comment:after{
	content: ' ';
	display: block;
	width: 50px;
	height: 50px;
	position: absolute;
	bottom: 0;
	right: 0;
	background: url(../img/comment.png) no-repeat right bottom;
}
#pr{
	margin: 20px 0 0;
	padding: 20px 0 0;
	border-top: 1px dotted #ccc;
	text-align: left;
}
#pr h3{
	margin-bottom: 10px;
	font-size: 14px; /* ie8 */
	font-size: 1.4rem;
	color: #666;
}
#pr h3 span{ color: #469bd5;}
#pr h4{
	margin-bottom: 10px;
	padding: 5px 0;
	font-size: 14px; /* ie8 */
	font-size: 1.4rem;
	color: #666;
	/*border-top: 2px solid #ccc;*/
	border-bottom: 1px dotted #ccc;
	vertical-align: middle;
}
#pr h4:before{
	content: ' ';
	display: inline-block;
	margin-right: 5px;
	width: 5px;
	height: 14px;
	background-color:#469bd5;
	vertical-align: middle;
}
#pr p{
	margin: 0 0 10px;
	line-height: 1.3;
}
#pr a{
	padding-left: 30px;
	display: block;
	background: url(../img/pdf_ico.png) no-repeat left top;
	min-height: 2em;
}
.smallnote{ margin: 0 0 -15px; }


/* ===========================================
	MediaQueries
=========================================== */

/* スマホ----------------------------- */
@media screen and (max-width: 767px) {
	#contents_header{ height: auto; }
	#contents_header h1{
		margin: 0;
		padding: 0 0 58.2%;
		height: 0;
		background: url(../img/s/header.jpg) no-repeat center top;
		background-size: 100% auto;
		border: 1px solid #fff;
	}
	main{ margin-bottom: 40px; }
	.fontsize_ll{ font-size: 1.5rem; }
	#reason{ padding: 20px 0 0; }
	#reason h2{
		margin-right: 0;
		height: 40px;
		background: url(../img/s/reason_ttl.png) no-repeat center top;
		background-size: 180px auto;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#reason	#reason_step{
		margin: 0 0 15px;
		height: 280px;
		background: url(../img/s/reason.png) no-repeat center top;
		background-size: 310px auto;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#result{
		margin: 0 5px 15px;
		padding: 25px 15px 10px;
		background: #f9f9f9 url(../img/result_bg.jpg) no-repeat center bottom;
		background-size: 510px auto;
	}
	.words{
		font-size: 16px; /* ie8 */
		font-size: 1.6rem;
		font-family: serif;
	}
	#result_img{
		width: 230px;
		height: auto;
	}
	.cont{
		margin: 15px 5px;
		padding: 15px;
		background-color: #fff;
		overflow: hidden;
	}
	.arrow{ margin: 0 auto -24px; }
	.arrow img{
		width: 170px !important;
		height: auto !important;
	}
	#arrow3 img{
		width: 55px !important;
		height: auto !important;
	}
	#cont1_ttl{
		margin: 10px 0 0;
		height: 175px;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
		background: url(../img/s/cont1_ttl.png) no-repeat center top;
		background-size: 245px auto;
	}
	#secret_ttl{
		margin: 10px 0 -10px;
		height: 80px;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
		background: url(../img/s/himitsu_ttl.png) no-repeat center top;
		background-size: 260px auto;
	}
	#brand .wrap .arrow img{ 
		width: auto !important;
		height: 60px !important;
	}
	main h2 { margin-bottom: 10px; }
	main h2:not(:first-child){ margin-top: 25px; }
	#secret_cont h2{
		background: url(../img/s/secret_ttl_bg.png) no-repeat center top;
		background-size: 246px auto;
		line-height: 34px;
		text-align: center;
	}
	#secret_cont h2 img{
		width: 170px !important;
		height: auto !important;
	}

	#coating_cont li{ display: block; }
	#coating1{
		margin-bottom: -10px;
		padding: 0 0 35px;
	}
	#coating1 img{
		width: 150px !important;
		height: auto !important;
	}
	#coating2 img{
		width: 320px !important;
		height: auto !important;
	}
	#photo_txt li{
		width: 44%;
		display: inline-block;
	}
	#photo_img{ padding: 0 0 10px 10px; }
	#newelleair_cont{ margin-bottom: 10px; }
	#end{
		margin: 10px 0;
		height: 75px;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
		background: url(../img/s/end.png) no-repeat center center;
		background-size: 288px auto;
	}
	#newelleair_cont a img{
		width: 208px !important;
		height: auto !important;
	}
	#newelleair_cont a .products_link{
		width: 200px;
		background: #6abce2 url(../img/btn_arrow.png) no-repeat 93% center;
		background-size: 25px auto;
	}
	#research{
		margin: 15px 5px 10px;
		padding: 15px;
		background-color: #fff;
		overflow: hidden;
		border: 1px solid #efefef;
	}
	#profile .float_left{ float: none; }
	#profile img{
		margin: 0 auto;
		width: 80px;
		height: auto;
		display: block;
	}
	#comment{ margin-top: 20px; }
	#brand .wrap .words_arrow img{
		width: 17px;
		height: auto;
	}
	.smallnote{ margin: 0; }
}
