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

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* clearfix */
.clearfix:after {
    content:"";
    display:block;
    clear:both;
}

/* font */
@font-face {
	font-family: icon;
	src: url(/+J/common/fonts/icon.ttf),
		url(/+J/common/fonts/icon.woff);
}

/* html, body */
html {
	background: #fff;
	color: #4c4c4c;
	font-family: "Roboto", sans-serif;
}
body {
	/* -webkit-font-smoothing: antialiased; */
	-webkit-text-size-adjust: 100%;
}
@media screen and (min-width:768px) {
	body {
		min-width: 1024px;
	}
}

/* module */
.inner {
	width: 950px;
	margin: 0 auto;
}
.clear {
	clear: both;
}
.forsp {
	display: none;
}
.layWordBreak {
	display: inline-block;
}
.layOv {
	transition: opacity 240ms;
}
 .layOv:hover {
 	opacity: 0.8;
 }

/* header */
#header {
	width: 950px;
	margin: 0 auto;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 110px;
	background: #fff;
	min-width: 1024px;
}
#header nav {
	float: right;
}
#header ul {
	float: left;
	padding: 43px 24px 0 0;
}
#header li {
	float: left;
	background: no-repeat 0 12px;
	0: hidden
}
#header .logo {
	float: left;
	margin: 36px 0 0;
}
#header .navLanguage {
	padding: 55px 0 0 0;
}
#header .navLanguage li {
	height: 16px;
	margin: 0 0 0 8px;
	position: relative;
}
#header .navLanguage li:first-child {
	padding-right: 8px;
}
#header .navLanguage li:first-child:after {
	content: "";
	border-right: solid 1px #b3b3b3;
	height: 12px;
	position: absolute;
	top: 1px;
	right: 0;
}
#header .navLanguage a img {
	opacity: 0.4;
	transition: opacity 160ms ease-out;
}
#header .navLanguage a:hover img {
	opacity: 1;
}
/* #gnav */
#gnav a,
#gnav img {
	display: block;
}
#gnav > li:nth-child(1) {
	background-image: url("../images/gnav_top_ov.png");
}
#gnav > li:nth-child(2) {
	margin-left: 33px;
	background-image: url("../images/gnav_product_ov.png");
}
#gnav > li:nth-child(3) {
	margin-left: 33px;
	background-image: url("../images/gnav_custom-made_ov.png");
}
#gnav > li:nth-child(4) {
	margin-left: 33px;
	background-image: url("../images/gnav_catalog_ov.png");
}
#gnav > li:nth-child(5) {
	/*margin-left: 33px;
	background-image: url("../images/gnav_video_ov.png");*/
}
#gnav > li:nth-child(5) {
	margin-left: 34px;
	background-image: url("../images/gnav_company_ov.png");
}
#gnav img {
	padding: 12px 0;
	transition: opacity 160ms ease-out;
}
#gnav .current:after,
#gnav h1:after,
#gnav a:after {
	content: "";
	border-bottom: solid 2px #006cb8;
	width: 0;
	display: block;
	transition: all 160ms ease-out;
	width: 100%;
	bottom: -5px;
	position: relative;
	opacity: 0;
	/*transform: scaleX(0);*/
}
#gnav .current img,
#gnav h1 img,
#gnav a:hover img {
	opacity: 0;
}
#gnav .current:after,
#gnav h1:after {
	width: 100%;
	bottom: 0;
	opacity: 1;
	transform: scaleX(1);
}
/* footer */
#footer {
	background: #006cb8;
	color: #fff;
	color: rgba(255, 255, 255, 0.8);
	padding: 0 0 27px;
	letter-spacing: 0.04em;
	overflow: hidden;
}
#footer a {
	color: #fff;
	color: rgba(255, 255, 255, 0.8);
	text-decoration: none;
}
#footer .inner {
	position: relative;
}
#footer .logo {
	float: left;
	margin: 33px 0 0;
}
#footer .nav {
	float: right;
	vertical-align: baseline;
	width: 503px;
	margin: 39px -41px 0 0;
	font-weight: 500;
	font-size: 17px;
}
#footer .nav li {
	float: left;
	margin: 0 0.7em 1.35em 0;
}
#footer .nav > li > a {
	float: left;
}
#footer .nav li ul {
	float: left;
	margin: 3px 0 0 1.1em;
}
#footer .nav li li {
	font-size: 12px;
	margin-bottom: 0;
}
#footer .nav li + li {
	border-left: solid 1px;
	padding-left: 0.7em;
}
#footer .nav ul li + li {
	padding-left: 0.6em;
}
#footer .nav .clear {
	border-left: none;
	padding-left: 0;
}
#footer .copytight {
	position: absolute;
	font-size: 11px;
	left: 0;
	bottom: 6px;
}
#footer .nav a {
	transition: opacity 240ms ease-out;
}
#footer .nav a:hover {
	opacity: 0.62;
}
/* #content */
#content {
	position: relative;
	margin: 110px 0 0;
	overflow: hidden;
}
a,
.linkTel {
	text-decoration: none;
	color: inherit;
	outline: none;
}
a:hover {
	color: #006cb8;
}
@media screen and (min-width:768px) {
	.linkTel,
	.linkTel:hover {
		color: inherit;
		pointer-events: none;
	}
}
/* btn */
.btnLink {
	color: #fff;
	background: #797b80;
	line-height: 40px;
	text-decoration: none;
	width: 221px;
	display: inline-block;
	transition: background 240ms ease-out;
	box-sizing: border-box;
	font-size: 14px;
	padding: 0 0 0 1.2em;
}
.btnLink:hover {
	background: #006cb8;
	color: #fff;
}
.btnPrint:after {
	font-family: icon;
	content: "\e900";
	float: right;
	font-size: 1.3em;
	margin: 0 1em 0 0;
}
.btnPageTop {
	border: solid 1px #919499;
	background: #fff;
	position: absolute;
	right: 0;
	bottom: 0;
	margin: 0 30px 30px 0;
	position: fixed;
	transition: opacity 240ms;
	/* visibility: hidden; */
	overflow: hidden;
	opacity: 0;
	z-index: 1;
}
.btnPageTop:after {
	content: "";
	background: url(/+J/common/images/btn_pagetop_ov.png) no-repeat;
	background-size: contain;
	position: absolute;
	top: 0;
	left: 0;
	transform: rotateY(180deg);
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity 100ms;
}
.btnPageTop:hover:after {
	opacity: 1;
}
.btnPageTop.top {
	opacity: 0;
	pointer-events: none;
	cursor: default;
}
.btnPageTop.show {
	opacity: 1;
}
.btnPageTop.bottom {
	position: absolute;
	opacity: 1;
	pointer-events: auto;
	cursor: pointer;
}
.btnPageTop img {
	display: block;
}

/* section */
section {
	/* clear: both; */
}

@media screen and (max-width:767px) {
	body {
		font-size: 5.216vw;
		min-width: 320px;
		/* position: relative; */
	}
	img {
		width: 100%;
		height: auto;
	}
	.inner {
		width: 86.97%;
		margin: 0 auto;
	}
	.forsp {
		display: block;
	}
	.forpc {
		display: none !important;
	}
	.btnPageTop {
		position: absolute;
	}
	.btnLink {
		font-size: 0.7em;
		width: 100%;
		line-height: 2.86;
		position: relative;
		padding-left: 1.1em;
	}
	.btnPageTop {
		width: 15.65%;
		margin: 0 3.9% 4.1% 0;
		box-sizing: border-box;
	}
	/* header */
	#header {
		height: 0;
		padding-bottom: 21%;
		z-index: 5;
		min-width: 320px;
	}
	#header:after {
		content: "";
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		border-bottom: solid 1px #f2f2f2;
		z-index: 5;
	}
	#header nav {
		position: absolute;
		left: 0;
		top: 0;
		/* background: #fff; */
		width: 100%;
		padding: 21% 0 0;
		margin: 1px 0 0;
		z-index: 5;
		height: 0;
	}
	#header nav:after {
		content: "";
		position: fixed;
		top: 0;
		left: 0;
		background: rgba(255, 255, 255, 0.8);
		width: 100%;
		height: 120%;
		/* margin-top: 21%; */
		z-index: 2;
		display: none;
		opacity: 0;
	}
	#header .wrapBtn {
		background: #fff;
		padding: 8.2% 0;
		position: relative;
		z-index: 5;
		top: -99999px;
		transform: translateY(-4%);
		opacity: 0;
	}
	#header ul,
	#header .navLanguage {
		float: none;
		padding: 0 6.39%;
	}
	#header ul ul {
		padding-left: 6.9%;
		margin-top: 2.45%;
		padding-right: 0;
	}
	#header #gnav li {
		float: none;
		background: none;
		margin: 0 0 2.84%;
	}
	#gnav > li:nth-child(1) .current {
		background: url(../images/gnav_top_sp_ac.png) no-repeat;
		background-size: contain;
		display: block;
	}
	#gnav > li:nth-child(2) .current {
		background: url(../images/gnav_product_sp_ac.png) no-repeat;
		background-size: contain;
		display: block;
	}
	#gnav > li:nth-child(2) li:nth-child(1) .current {
		background-image: url(../images/gnav_noboruder_sp_ac.png);
	}
	#gnav > li:nth-child(2) li:nth-child(2) .current {
		background-image: url(../images/gnav_nobiroon_sp_ac.png);
	}
	#gnav > li:nth-child(2) li:nth-child(3) .current {
		background-image: url(../images/gnav_bridge-welder_sp_ac.png);
	}
	#gnav > li:nth-child(2) li:nth-child(4) .current {
		background-image: url(../images/gnav_fujidana_sp_ac.png);
	}
	#gnav > li:nth-child(3) h1 {
		background: url(../images/gnav_custom-made_sp_ac.png) no-repeat;
		background-size: contain;
	}
	#gnav > li:nth-child(4) h1 {
		background: url(../images/gnav_catalog_sp_ac.png) no-repeat;
		background-size: contain;
	}
	#gnav > li:nth-child(5) h1 {
		background: url(../images/gnav_company_sp_ac.png) no-repeat;
		background-size: contain;
	}
	#header .logo {
		width: 56.98%;
		display: block;
		margin: 6.6% 0 0 18%;
		position: relative;
		z-index: 6;
	}
	#header .navLanguage {
		padding-top: 9.2%;
	}
	#header .navLanguage li {
		height: auto;
		margin-left: 2.5%;
	}
	#header .navLanguage li:first-child {
		padding-right: 2.4%;
		margin-left: 0;
	}
	#header .navLanguage li:first-child:after {
		height: 0.65em;
		top: 0.04em;
	}
	#header .navLanguage a img {
		opacity: 1;
	}
	#header .navLanguage img {
		height: 0.8em;
		width: auto;
		display: block;
	}
	/* #gnav */
	.btnGnav {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		padding: 0.5em;
		margin: 4.8% 2.6% 0 0;
		z-index: 6;
	}
	.btnGnav span {
		display: inline-block;
		font-size: 0px;
	}
	.btnGnav:after {
		content: "\e901";
		font-family: icon;
		font-size: 1em;
		padding: 0.1em 0;
		display: inline-block;
		color: #797b80;
	}
	.btnCloseGnav {
		top: -99999px;
		opacity: 0;
	}
	.btnCloseGnav:after {
		content: "\e902";
		font-size: 1.2em;
		padding: 0 0.06em;
	}
	#gnav li a {
		position: relative;
	}
	#gnav li a:after {
		content: "\2c3";
		position: absolute;
		top: 0;
		right: 0;
		font-family: icon;
		width: auto;
		border: none;
		opacity: 1;
		font-size: 0.8em;
		margin: 0.2em 0 0 0;
	}
	#gnav li a:hover:after {
		display: block;
	}
	#gnav li .current:after {
		display: none;
	}
	#gnav img {
		width: auto;
		height: 1.15em;
		padding: 0;
	}
	#gnav a:hover img {
		opacity: 1;
	}
	#gnav h1 img {
		/* opacity: 1; */
	}
	#gnav h1:after, #gnav a:hover:after {
		display: none;
	}
	#header .btnOpenGnav {
		transition: opacity 160ms;
	}
	#header .btnCloseGnav {
		transition: opacity 340ms 250ms;
	}
	#header nav:after {
		transition: opacity 240ms;
	}
	#header .wrapBtn {
		transition: opacity 240ms 60ms, transform 400ms 60ms cubic-bezier(0.215, 0.610, 0.355, 1.000);
	}
	#header nav.open .btnOpenGnav {
		opacity: 0;
	}
	#header nav.open .btnCloseGnav {
		opacity: 1;
		top: 0;
	}
	#header nav.open .wrapBtn {
		top: 0;
		transform: translateY(0);
		opacity: 1;
	}
	#header nav.open:after {
		display: block;
		opacity: 1;
	}
	/* footer */
	#footer {
		padding-bottom: 0;
	}
	#footer .inner {
		padding: 7.5% 0 26.4% 0;
	}
	#footer .logo {
		position: absolute;
		bottom: 0;
		left: 27.44%;
		width: 42.73%;
		margin: 0 0 12.4%;
	}
	#footer .nav {
		float: none;
		width: auto;
		margin: 0;
		letter-spacing: 0;
		font-size: 1em;
	}
	#footer .nav > li {
		font-size: 0.8em;
		margin: 0 0% 1.7em 0;
		letter-spacing: 0.04em;
	}
	#footer .nav li ul {
		margin: 0.8em 0 0.1em 0;
		clear: both;
	}
	#footer .nav li li {
		font-size: 0.6875em;
	}
	#footer .nav li + li {
		margin-left: 0.74em;
	}
	#footer .nav li li {
		margin-right: 0;
		margin-left: 0.6em;
		padding-left: 0.9em;
	}
	#footer .nav ul li:first-child {
		padding-left: 0;
		margin-left: 0;
	}
	#footer .nav li li:last-child {
		margin-right: 0;
	}
	#footer .nav .clear {
		margin-left: 0;
	}
	#footer .copytight {
		text-align: center;
		width: 100%;
		bottom: 0;
		font-size: 0.45em;
		margin: 0 0 4.7%;
	}
	#content {
		margin-top: 21%;
	}
}

#knTrace {
	/* margin-top: -1003px; */
	/* margin-left: -8px; */
}