@charset "utf-8";
/*
reset CSS
html5doctor.com Reset Stylesheet v1.6.1 Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
	html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
	body { line-height:1;} eader,hgroup,menu,nav,section { display:block;}
	nav ul { list-style:none;}
	blockquote, q { quotes:none;}
	blockquote:before, blockquote:after,q:before, q:after { content:''; content:none;}
	a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}

	/* change colours to suit your needs */
	ins { background-color:#ff9; color:#000; text-decoration:none;}

	/* change colours to suit your needs */
	mark { background-color:#ff9; color:#000;  font-style:italic; font-weight:bold;}
	del { text-decoration: line-through;}
	abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help;}
	table { border-collapse:collapse; border-spacing:0;}

	/* change border colour to suit your needs */
	hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}
	input, select { vertical-align:middle;}


/*--- base ---*/
* { margin:0px; padding:0px;}
html { font-size: 87.5%;}
body { font-family: "メイリオ","Meiryo",verdana,"MS Pゴシック","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"MS PGothic",Sans-Serif; line-height: 1.7; text-align: left; color:#000000; -webkit-text-size-adjust: 100%;
	width: 700vw; /*min-width: 8820px; */overflow: hidden;}

h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight: normal;} img { border:0; vertical-align:bottom;} li { list-style:none;} table { border:none; border-collapse:collapse; font-size:100%;} table caption { display:none;} td,th { text-align:left; line-height: 1.5;}
a:link,a:visited { color: #000000; text-decoration: none;}
a:active,a:hover { color: #999; text-decoration: none;}

img { max-width: 100%; height: auto;}
img[src$=".svg"] {
    width: 100%;
}
/*--- footer ---*/
footer { opacity: 0; position: fixed; height: 54px; width: 100%; bottom: 0; left: 0; padding: 20px 0; background: rgba(77,77,77,0.8); line-height: 1;box-sizing: border-box; text-align: center;
		-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		-ms-transition: all 0.2s;
		-o-transition: all 0.2s;
		transition: all 0.2s;
}
#footerLogo { width: 106px; margin: 0 auto;}
	#footerLogo li { float: left;}
	#footerLogo li img { float: left;
		-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-ms-transition: all 0.5s;
		-o-transition: all 0.5s;
		transition: all 0.5s;
	 }
			#footerLogo li.footerLogoT { width: 11px; }
			#footerLogo li.footerLogoO { width: 15px; margin: 0 1px 0 0;}
			#footerLogo li.footerLogoR { width: 12px; margin: 0 1px 0 1px;}
			#footerLogo li.footerLogoC { width: 15px; margin: 0 1px 0 0;}

/*--- slide ---*/
.slidePare { position: relative; overflow: hidden; width: 100vw; height: 100vh; /*min-width: 980px;*/ /*min-height: 570px;*/ float: left; box-sizing: border-box; background-size: cover; background-position: center center; background-repeat: no-repeat;}
.slidePareCh { position: relative; overflow: hidden; width: 100vw; /*min-width: 980px;*/ box-sizing: border-box; background-size: cover; background-position: center center; background-repeat: no-repeat;}

.dlPT01 { position: absolute; overflow: hidden; padding: 23px; background: rgba(0,0,0,0.6); box-sizing: border-box; z-index: 100; color: #FFF;}
.dlPT01.dlPT01BgN { background: rgba(255,255,255,0);}
	.dlPT01 dt { font-size: 342.8%; padding-bottom: 25px; line-height: 1.2;}
	.dlPT01 dd { font-size: 128.5%;}

#pagenation { position: fixed; width: 100vw; top: 50%; padding: 0 15px; z-index: 1000; box-sizing: border-box; margin: -24px 0 0;}
	#pagenation li { width: 30px;}
	#pagenation li a { display: block;
		-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		-ms-transition: all 0.2s;
		-o-transition: all 0.2s;
		transition: all 0.2s;
	}
	#prev { float: left; text-align: left;}
	#next,#pageTop,#animateToggle { float: right; text-align: right;}
	#pagenation li#prev:active a,#pagenation li#prev:hover a { transform: translate3d( 10px, 0, 0);}
	#pagenation li#next:active a,#pagenation li#next:hover a,#pagenation li#pageTop:active a,#pagenation li#pageTop:hover a,#pagenation li#animateToggle:active a,#pagenation li#animateToggle:hover a { transform: translate3d( -10px, 0, 0);}

	/*--- index ---*/
	#index { background-image: url(images/index_bg.jpg); background-size: cover;}
		/*#index h1 { position: absolute; top: 52.9%; left: 50%; margin: 0 0 0 -101px;}*/
		#index h1 { position: absolute; top: 51.9%; left: 50%; width: 203px; height: 28px; margin: 0 0 0 -101px;}
			#index h1 span { display: block; float: left;}
			#index h1 span img {
				-webkit-transition: all 1.5s;
				-moz-transition: all 1.5s;
				-ms-transition: all 1.5s;
				-o-transition: all 1.5s;
				transition: all 1.5s;
		   }

			#index h1 span.indexLogoT { width: 22px;}
			#index h1 span.indexLogoO { width: 29px; margin: 0 2px 0 0;}
			#index h1 span.indexLogoR { width: 22px; margin: 0 2px 0 2px;}
			#index h1 span.indexLogoC { width: 28px; margin: 0 3px 0 0;}

		#index h2 { position: absolute; top: 51.9%; left: 0; width: 100%; text-align: center; margin: -40px 0 0; font-size: 128.5%}

	/*--- wherever ---*/
	#wherever { background-image: url(images/wherever_bg.jpg);}
		#whereverCon01 { position: absolute; top: 35.7%; left: 0; right: 0; bottom: 0; margin: auto; width: 720px; color: #FFF;}
			#whereverCon01 h2 { font-size: 342.8%; padding: 0 0 45px; line-height: 1; text-align: center;}
			#whereverCon01 p { font-size: 128.5%;}

	/*--- withstand-load ---*/
	#withstand-load .slidePareCh { background-image: url(images/withstand-load_bg.jpg); background-position: bottom center;}
		#withstand-loadDL { width: 510px; bottom: 6.7%; right: 6.7%;}

	/*--- light ---*/
	#light .slidePareCh { background-image: url(images/light_bg.jpg); background-position: bottom center;}
	#lightDL { width: 580px; top: 3.6%; left: 3.6%;}
	#lightRight { position: absolute; top: 0; right: 0; height: 100vh; background: #FFF; font-size: 128.5%;}
	.lightRightTxt01 { padding: 6px 0 0 17px;}

	/*--- safety ---*/
	#safety .slidePareCh { background-image: url(images/safety_bg.jpg); background-position: bottom center;}
	#safetyDL { width: 380px; top: 3.6%; left: 53.6%;}

	/*--- specification ---*/
	.specificationCon { position: absolute; width: 780px; height: 425px; top: 0; left: 0; right: 0; bottom: 0; margin: auto;}
	.specificationConCh { position: relative; width: 780px; height: 425px;}
	/*#specificationCon { position: relative; width: 670px; top: 50%; margin: -208px auto 0;}*/
	/*#animationImgs { position: absolute; width: 38.6%; top: 7.7%; left: 7.1%; margin: 0;}*/

		/*--- dealDrawing ---*/
		#dealDrawing {}
		#animationImgs { position: absolute; width: 373px; top: 5px; left: 30px; margin: 0;
		-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-ms-transition: all 0.5s;
		-o-transition: all 0.5s;
		transition: all 0.5s;
		}
			#animationImgs li { position: absolute; top: 0; left: 0; display: none;/* opacity: 0;*/}
			#animationImgs li:first-child { display: block; opacity: 1;}
			#animationImgs img { width: 100%;}
			#dealDrawingLine { position: absolute; width: 305px; top: 5px; left: 217px; margin: 0;}
				#dealDrawingLine img { width: 100%;}
			#dealDrawingUL li { position: absolute; left: 532px; margin: 0; font-size: 128.5%;}
			#dealDrawingUL01 { top: 44px; white-space: nowrap;}
			#dealDrawingUL02 { top: 132px;}
			#dealDrawingUL03 { top: 221px;}
			#dealDrawingUL04 { top: 311px;}

		/*--- specification Tab --*/
		#specifications h2 { position: absolute;  width: 780px; height: 425px; top: -124px; left: 0; right: 0; bottom: 0; margin: auto auto auto auto; font-size: 228.5%; z-index: 1;}

		#tabNav { overflow: hidden; font-size: 142.8%; margin: 0 0 16px; position: relative; z-index: 1;}
			#tabNav li { float: left; margin-right: 8px; line-height: 1;}
				#tabNav li a { display: block; padding: 8px 16px; color: #FFF; background: #D9D9D9;}
				#tabNav li a.active { background: #000;}
				#tabNav li a:active,#tabNav li a:hover { background: #000;}

		.specificationImg { position: absolute; top: 5px; left: 0; z-index: 0;}

		.specificationTable { position: absolute; width: 365px; right: 32px; top: 62px;}
			.specificationTable table { width: 100%;}
			.specificationTable table th,.specificationTable table td { padding: 10px 12px 10px 15px; border-bottom: #C8C5C4 solid 1px; line-height: 1.2; font-weight: normal;}
			.specificationTable table td { text-align: right;}

		#specificationPare { display: none;}
			#specificationS4 { }
			#specificationL6 { display: none;}


		/*--- specification ---*/
/*		.specification    { padding: 0 0 0 34px;}
		.specificationCon { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 830px; height: 430px;}
		.specification h2 { font-size: 342.8%; line-height: 1.2; padding: 0 0 24px;}
		.specification h3 { font-size: 342.8%; line-height: 1.2; padding-bottom: 44px;}
		.specification h3.l6H { padding: 48px 0 44px;}
		.specificationImg { float: left; margin-right: 65px;}
		.specificationTable { overflow: hidden; font-size: 128.5%;}
		.table01 { width: 90%; margin: 0; box-sizing: border-box;}
			.table01 th,.table01 td { padding: 10px 12px 10px 15px; border-bottom: #C8C5C4 solid 1px; line-height: 1.2; font-weight: normal;}
			.table01 td { text-align: right;}
*/
		/*--- company info ---*/
		#conpanyInfoCon { position: relative; top: 50%; width: 700px; margin: -144px auto 0;}
		#conpanyInfoCon h4 { font-size: 228.5%; padding-bottom: 16px; line-height: 1.2;}
		#conpanyInfoCon p { font-size: 128.5%; padding-bottom: 40px;}

		#conpanyInfoCon dt { font-size: 228.5%; padding-bottom: 16px; line-height: 1.2;}
		#conpanyInfoCon dd { font-size: 128.5%;}


/*--- general ---*/
.mB24 { margin-bottom: 1.71rem !important;}

.pB1rem  { padding-bottom: 1rem !important;}

.pT16  { padding-top: 16px !important;}
.pT24  { padding-top: 24px !important;}

.ofH { overflow: hidden;}

.imgR { float: right; margin-left: 24px;}
.imgL { float: left; margin-right: 24px;}

.note { font-size: 12px !important; text-align: right; color: #AAA;}
	/*.note.col02 { color: #333;}*/

a.linkCol01:link,a.linkCol01:visited { color: #185EBD;}
a.linkCol01:active,a.linkCol01:hover { color: #185EBD; text-decoration: underline;}

.aL { text-align: left !important;}
.aC { text-align: center !important;}
.aR { text-align: right !important;}
.fwB { font-weight: bold !important;}
.clB { clear: both !important;}
.wSN { white-space: nowrap !important;}
.lSN { letter-spacing: 0 !important;}
