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

/****************************** base ******************************/
#contents {
	width: 100%;
	background-color: #333f48;
}

/*fontNOTO追加171004*/
.noto{font-family: 'Noto Sans Japanese', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

/****************************** slide ******************************/
.SPslide{display:none;}
.center{text-align:center;}

.b_line{height:15px; background:#000; width:100%;}
.g_line{height:15px; background:#313131; width:100%;}
.green_line{width:100%; margin: 10px auto 0 auto; height:2px; background:#29A39A;}

.comment03{ font-size:0.8em !important; margin-top:15px; display:block;}
.c_title{color:#FFF !important;}

@media screen and (max-width: 767px){
	.PCslide{display:none;}
	.SPslide{display:inherit;}
	
.pcBr { display:none; }
.mbnone { display:none; }
#SPmain img{margin-bottom:0px; padding-bottom:0px;}
#copy{color:#FFF; width:90%; margin:0 auto 0 auto !important; font-size:1.1em !important;line-height:180%; text-shadow:0px 0px 3px #fff; position:relative; padding-bottom:30px !important;}
.indr_logo{width:190px; height:43px; float:right; padding-bottom:15px !important;}

.sec2_t,
.sec4_t{color:#00A5A7; font-size:1.7em !important; font-weight:400; text-align:center; padding-top:20px; padding-bottom:40px !important;} 

.sec3_t{color:#fff; font-size:1.7em !important; font-weight:400; text-align:center; padding-top:20px !important; padding-bottom:40px !important;}

.center{text-align:center;}



.float_box{color:#FFF;}
.left_box,
.right_box{width:90%; margin:0 auto 30px auto !important;}

.left_box_s{width:250px; margin:0 auto 0 30px !important;}

.left_box p,
.right_box p{width:90%; margin:0 auto !important;}

#contents #sectionBG03{	background: url(../../shared/images/bg_section03_m.jpg) no-repeat;
background-position:center;
background-color:#060F25;
padding:0 !important;
-moz-background-size:contain;
background-size:contain;
background-position:top;
}
.mt10{margin-top:10px !important;}
.pb40{padding-bottom:40px !important;}
.kscan{width:320px; margin:30px auto 30px auto !important; display:block; font-size:1.1em; line-height:1.8;}
.kscan02{width:320px; margin:30px auto 30px auto !important; display:block; font-size:1.1em; line-height:1.8;}
.c_title{color:#FFF !important;}

.c_logo {width:84px; height:130px; display:block; float:left; font-size:0.8em !important; text-align:center;}

.c_logo img{height:84px !important; padding-top:10px;}

.c_comment{ float:left; width:68%; font-size:0.8em !important; margin-top:20px !important; margin-left:10px !important;}

.mb_com{margin-top:20px; width:90%; margin:0 auto;}
.comment02{ font-size:0.8em !important;}
}



#contents .section .button {
	/*position:absolute;*/
	bottom:100px;
	left:0;
	right:0;
	margin:20px auto 20px auto;
	display: inline-block;
	background-color: #00adb0;
	color: #fff !important;
	letter-spacing:3px;
	font-size:125%;
	width: 300px;
	height: 54px;
	text-align: center;
	border-radius: 25px;
	text-decoration: none;
	line-height: 54px;
	outline: none;		
	box-shadow: 0 2px 4px 0px #333;
	-moz-box-shadow: 0 2px 4px 0px #333;
	-o-box-shadow: 0 2px 4px 0px #333;
	-ms-box-shadow: 0 2px 4px 0px #333;
	filter: progid:DXImageTransform.Microsoft.Shadow(color=#333333, direction=0, strength=3, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#333333, direction=90, strength=3, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#333333, direction=180, strength=3, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#333333, direction=270, strength=3, enabled=true);
}
#contents .section .button,
#contents .section .button::before,
#contents .section .button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .25s;
	transition: all .25s;
}
#contents .section .button:hover {
	background-color:#0b8f91;
}


/****************************** section ******************************/
#contents p{
	line-height:2.0;
	font-size:1.2em;
}

#contents #sectionBG01{
	background-image: url(../../shared/images/bg_section01.gif);
	background-repeat: repeat;
}
#contents #sectionBG02,
#contents #sectionBG04{
	background-image: url(../../shared/images/bg_section02.gif);
	background-repeat: repeat;
}

/*#contents #sectionBG04{	background: url(../../shared/images/bg_section04.jpg) no-repeat;}*/
#contents .section{
	/*background-size: cover !important;*/
	padding:50px 5%;
	position:relative;
}
#contents .section .contentsInner{
	margin:0px auto 124px;
	color:#fff;
}
#contents .section .textLeft{
	float:left;
	max-width:60%;
	margin-right:5%;
}
#contents .section .textRight{
	float:right;
	width:60%;
}
#contents .section .number{
	font-size:20px;
	color:#00adb0;
	letter-spacing:3px;
	line-height:1.2;
}
#contents .section h2{
	font-size:46px;
	font-weight:bold;
	margin-bottom:20px;
	letter-spacing:2px;
	line-height:1.3;
}
#contents .section .mediaLeft,
#contents .section .mediaRight{
	float:left;
	width:35%;
}
#contents .section img,
#contents .products img{
	width:100%;
	height:100%;
}


/****************************** Catalog ******************************/
#contents #catalogList {
	background-color: #dadfe4;
	padding:50px 5% 30px;
	text-align:center;
}
#contents #catalogList .products {
	display:inline-table;
	width:300px;
	margin:0 20px 20px 0;
	text-align:left;
	background-color:#FFF;
	-webkit-box-shadow: 0 0 6px 0 #888; /* Safari, Chrome用 */
	-moz-box-shadow: 0 0 6px 0 #888; /* Firefox用 */
	box-shadow: 0 0 6px 0 #888; /* CSS3 */
}
#contents #catalogList .products p{
	padding:20px 20px 0;
}
#contents #catalogList .products h3{
	font-size:20px;
	padding:15px;
	border-bottom:1px solid #ddd;
}

#contents #catalogList .products a{
	display:block;
	width:270px;
	border-bottom:1px solid #ddd;
	padding:15px;
	font-size:110%;
	text-decoration:none;
	color:#00adb0;
}
#contents #catalogList .products a span{
	display:block;
	line-height:1.4;
	background: url(../images/btn_allow_right.png) no-repeat right center;
}
#contents #catalogList .products a .pdfText{
	color:#aaa;
	font-size:0.85em;
	background:none;
}
#contents #catalogList .products a:hover{
	background-color:#f3f3f3;
}

/****************************** banner ******************************/
#contents #banArea{
	background-color:#f0f2f4;
	padding:75px 5%;
}
#contents #banArea p{
	text-align:center;
	line-height:0;
}
#contents #banArea p img{
	width:100%;
	height:100%;
}


/****************************** SP調整 ******************************/
@media screen and (max-width: 767px){
	#contents p{
		font-size:1.1em;
		line-height:1.8;
	}
	#contents .section{padding:30px 0 30px;}

	/*#contents #sectionBG01{	background: #333f48;}*/
	/*#contents #sectionBG02{	background: #455561;}*/
	/*#contents #sectionBG03{	background: #333f48;}*/
	/*#contents #sectionBG04{	background: #455661;}*/

	#contents .section .contentsInner{
		margin:0px auto 90px;
	}
	#contents .section .textLeft,
	#contents .section .textRight,
	#contents .section .mediaLeft,
	#contents .section .mediaRight{
		float:none;
	}
	#contents .section .textLeft,
	#contents .section .textRight{
		padding:0 5%;
		width:90%;
		max-width:90%;
		margin-bottom:20px;
	}
	#contents .section .mediaLeft,
	#contents .section .mediaRight{
		width:100%;
	}
	#contents .section .number{
		font-size:18px;
	}
	#contents .section h2{
		font-size:26px;
		letter-spacing:0px;
		margin-bottom:15px;
	}
	#contents .section .button {
		width:90%;
		bottom:60px;
	}
	
	#contents #catalogList .products {
		width:100%;
		margin:0 0 30px 0;
	}
	#contents #catalogList .products p{
		padding:5% 5% 0;
	}
	#contents #catalogList .products h3{
		padding:15px 5%;
	}
	#contents #catalogList .products a{
		width:90%;
		border-bottom:1px solid #ddd;
		padding:15px 5%;
	}
	#contents #banArea{
		background-color:#f0f2f4;
		padding:5%;
	}
.sp03_btn{width:90%; margin:10px auto 0px auto !important; padding-bottom:60px !important;}


}



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

#PCmain{background-color:#000; text-align:center; margin-bottom:0px; padding-bottom:0px; max-height:650px;}
#PCmain img{margin-bottom:0px; padding-bottom:0px;}

#copy{color:#FFF; width:1050px; margin:0 auto 0 auto !important; font-size:1.4em !important;line-height:180%; text-shadow:0px 0px 3px #fff; position:relative; padding-bottom:20px !important;}

.indr_logo{position: absolute; width: 280px; height: 63px; right: 0px; top: 247px;}
#contents #sectionBG03{	background: url(../../shared/images/bg_section03.jpg) no-repeat;
background-position:center;
background-color:#000;
height:920px;
padding:0 !important;
}
.sec2_t,
.sec4_t{color:#00A5A7; font-size:3.3em !important; font-weight:400; text-align:center; padding-top:50px; padding-bottom:50px !important;} 
.sec3_t{color:#fff; font-size:3.3em !important; font-weight:400; text-align:center; padding-top:50px !important; padding-bottom:50px !important;}

.float_box{width:1050px; margin:0 auto !important; color:#FFF;}
.left_box{width:460px; float:left;}
.right_box{width:460px; float:right;}

.left_box_s{width:460px; float:left; margin-top:80px;}
.mb100{margin-bottom:100px;}
.mt100{margin-top:100px !important;}

.left_box p,
.right_box p{width:350px; margin:0 auto !important;}

#contents .section .button {
	/*position:absolute;*/
	bottom:100px;
	left:0;
	right:0;
	margin:20px 20% 20px;
	display: inline-block;
	background-color: #00adb0;
	color: #fff !important;
	letter-spacing:3px;
	font-size:125%;
	width: 300px;
	height: 54px;
	text-align: center;
	border-radius: 25px;
	text-decoration: none;
	line-height: 54px;
	outline: none;		
	box-shadow: 0 2px 4px 0px #333;
	-moz-box-shadow: 0 2px 4px 0px #333;
	-o-box-shadow: 0 2px 4px 0px #333;
	-ms-box-shadow: 0 2px 4px 0px #333;
	filter: progid:DXImageTransform.Microsoft.Shadow(color=#333333, direction=0, strength=3, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#333333, direction=90, strength=3, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#333333, direction=180, strength=3, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#333333, direction=270, strength=3, enabled=true);
}
#contents .section .button,
#contents .section .button::before,
#contents .section .button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .25s;
	transition: all .25s;
}
#contents .section .button:hover {
	background-color:#0b8f91;
}

.kscan{width:300px; margin:15px auto 55px auto !important; font-size:1.2em; line-height:1.8;  display:block;}
.kscan02{width:320px; margin:15px auto 0 auto; font-size:1.2em; line-height:1.8; display:block;}






.comment02{ font-size:0.7em !important; float:right; display:block;}
.comment04{ font-size:0.8em !important;}

.comment02 img{width:253px !important; height:152px !important;}

.mbBr { display:none; }
.c_title{font-size:1.8em !important; color:#fff; letter-spacing: 1px; text-align:left !important;}
.PCnone { display:none; }
.c_logo {width:84px; height:100px; display:block; float:left; font-size:0.8em !important; text-align:center;}

.c_logo img{height:84px !important;}

.c_comment{ float:left; width:80%; font-size:0.8em !important; margin-top:20px !important; margin-left:10px !important;}
.mb_com{display:none;}
}