/*********************** layout **************************/


/* sub banner */
#subBanner {
	width: 100%;
	overflow: hidden;
	background-color: #000;
}
#subBanner .bannerWrap {
	position: relative;
	width: 1170px;
	height: 159px;
	overflow: hidden;
	margin-top: 100px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}
#subBanner .bannerWrap .txtArea {
	position: relative;
	width: 1170px;
	z-index: 2;
	margin-top: 50px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}
#subBanner .bannerWrap .txtArea:after {content:""; display:block; clear:both;}
#subBanner .bannerWrap .txtArea p {
	display: inline-block;
	font-size: 28px;
	color: #fff;
	font-weight: 600;
	border-bottom: 2px #486577 solid;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 6px;
	margin-left: 10px;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 6px;
	padding-left: 0;
}
#subBanner .bannerWrap .txtArea span {
	display: block;
	font-size: 13px;
	color: #b9b9b9;
	line-height: 1.2;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 10px;
}
#subBanner .bannerWrap .imgArea {position:absolute; right:0; top:0; z-index:1;}


/* content wrap */
#contentsWrap {
	width: 1170px;
	margin-top: 45px;
	margin-right: auto;
	margin-bottom: 45px;
	margin-left: auto;
}
#contentsWrap:after {content:""; display:block; clear:both;}


/* local menu */
#lnb {
	float: left;
	width: 185px;
	margin: 0 50px 0 0;
	overflow: hidden;
}
#lnb #title {height:49px; font-size:24px; color:#333; font-weight:600; border-bottom:1px #ddd solid;}
#lnb ul li {}
#lnb ul li a {display:block; font-size:14px; color:#333; font-weight:600; padding:10px 14px; border-bottom:1px #ddd solid; line-height:1.4;}
#lnb ul li.on > a {background:#262f3b; color:#fff;}
#lnb ul li ul {display:none; padding:12px 0 12px 10px; border-bottom:1px #ddd solid;}
#lnb ul li ul li {padding:6px 0;}
#lnb ul li ul li a {font-size:13px; color:#666; font-weight:600; line-height:1.2; padding:0 0 0 13px; border:0; background:url("../images/bg/bg_lnb_dot.gif")/*tpa=http://www.sc-hyd.com/kr/images/bg/bg_lnb_dot.gif*/ left 6px #fff no-repeat;}
#lnb ul li ul li.on a {background:url("../images/bg/bg_lnb_dot.gif")/*tpa=http://www.sc-hyd.com/kr/images/bg/bg_lnb_dot.gif*/ left 6px #fff no-repeat; color:#3e6d83;}


/* content */
#contents {
	float: left;
	width: 935px;
	overflow: hidden;
}
#contents h2 {
	font-size: 24px;
	color: #333;
	font-weight: 600;
	border-bottom: 1px #333 solid;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 15px;
	padding-left: 0;
}
#contents h2.bn {border:0;}
#location {position:relative; width:100%; height:0;}
#location:after {content:""; display:block; clear:both;}
#location ol {position:absolute; right:0; top:-40px;}
#location ol li {
	float: left;
	padding: 0 12px 0 9px;
	background-image: url(../images/common/bg_location_arrow.gif);
	background-repeat: no-repeat;
	background-position: right 4px;
}
#location ol li img {vertical-align:middle; margin:-2px 0 0 0;}
#location ol li a {font-size:13px; color:#868788;}
#location ol li a:hover {color:#868788;}
#location ol li.last {font-size:13px; color:#333; padding:0 0 0 9px; background:none;}



/* business */
#business {width:100%; overflow:hidden;}
#business .mechatronicsImg {
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}
#business .mechatronicsImg img {width:100%;}
#business .powerlimb {width:100%; overflow:hidden;}
#business .powerlimb h3 {font-size:20px; color:#447e96; font-weight:600; background:url("../images/bg/bg_powerlimb_h3.gif") left 3px no-repeat; padding:0 0 0 16px;}
#business .powerlimb .img {width:100%; margin:35px 0; text-align:center; overflow:hidden;}
#business .powerlimb .info {width:750px; margin:0 auto; overflow:hidden;}
#business .powerlimb .info ul li {float:left; width:174px; margin:0 18px 20px 0;}
#business .powerlimb .info ul li .circle01 {width:117px; height:117px; font-size:18px; color:#fff; font-weight:600; line-height:117px; text-align:center; margin:0 auto; background:url("../images/bg/bg_powerlimb_circle01.gif");}
#business .powerlimb .info ul li .circle02 {width:117px; height:117px; font-size:18px; color:#fff; font-weight:600; line-height:117px; text-align:center; margin:0 auto; background:url("../images/bg/bg_powerlimb_circle02.gif");}
#business .powerlimb .info ul li .tit {width:100%; height:67px; font-size:16px; color:#447e96; font-weight:600; text-align:center; padding:14px 0 0 0; line-height:1.2;}
#business .powerlimb .info ul li p {font-size:14px; color:#666; font-weight:600; padding:0 0 0 14px; line-height:1.4; background:url("../images/bg/bg_powerlimb_dot.gif") left 8px no-repeat;}
#business .powerlimb .info ul li p.f {color:#333;}
#business .powerlimb .info ul li.last {margin:0;}
#business .hydraulic {width:100%; overflow:hidden;}
#business .hydraulic h3 {
	clear: both;
	font-size: 18px;
	color: #333333;
	font-weight: 500;
	margin: 30px 0 20px;
	padding: 0 0 0 16px;
	background-image: url(../images/common/bg_powerlimb_h3.gif);
	background-repeat: no-repeat;
	background-position: left 3px;
}
#business .hydraulic h3.f {margin:25px 0 20px;}
#business .hydraulic h4 {
	clear: both;
	font-size: 18px;
	color: #333333;
	font-weight: 500;
	margin-top: 20px;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 0;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0px;
}
#business .hydraulic h3.f {margin:25px 0 20px;}
#business .hydraulic ul {margin:0 -32px 0 0;}
#business .hydraulic ul:after {content:""; display:block; clear:both;}
#business .hydraulic ul li {
	float: left;
	width: 304px;
	border: 1px #ccc solid;
	margin-top: 0;
	margin-right: 10px;
	margin-bottom: 20px;
	margin-left: 0;
}
#business .hydraulic ul li.last {margin:0 0 20px 0;}
#business .hydraulic ul li .info {position:relative;}
#business .hydraulic ul li .info.h80 {
	height: 20px;
	text-align: center;
}
#business .hydraulic ul li .info.h50 {height:50px;}
#business .hydraulic ul li .info.h63 {height:63px;}
#business .hydraulic ul li .info p {
	position: absolute;
	left: 8px;
	font-size: 14px;
	color: #333;
	font-weight: 600;
}
#business .hydraulic ul li .info span {
	display: block;
	font-size: 13px;
	color: #888;
	line-height: 1.3;
	letter-spacing: -0.2px;
	padding: 10px;
}
#business .hydraulic ul li .user {position:relative; background:#3e4b5d;}
#business .hydraulic ul li .user p {
	position: absolute;
	left: 8px;
	line-height: 1.3;
	font-size: 13px;
	color: #fff;
	font-weight: 600;
}
#business .hydraulic ul li .user span {
	display: block;
	line-height: 1.3;
	font-size: 13px;
	color: #fff;
	font-weight: 600;
	padding-top: 12px;
	padding-right: 0;
	padding-bottom: 12px;
	padding-left: 0px;
	text-align: center;
}



/*************************** Common *************************/
/***** img type *****/
.webImg {display:inline-block;}
.mobileImg {display:none;}

.webImg table {
	width: 100%;
}
/***** head txt *****/
.headTxt {width:100%; border-bottom:2px #333 solid; padding:14px 0; margin:0 0 25px 0; overflow:hidden; word-break:keep-all;}
.headTxt p {font-size:14px; color:#333; font-weight:600; line-height:1.4; padding:0 26px;}
.headTxt p span {font-size:14px; color:#447e96;}

.headTxt2 {width:100%; border-bottom:3px #333 solid; padding:18px 0; margin:0 0 25px 0; background:#f9f9f9; overflow:hidden; word-break:keep-all;}
.headTxt2 p {font-size:14px; color:#666; font-weight:600; line-height:1.4; padding:0 35px;}
.headTxt2 p span {
	font-size: 14px;
	color: #000066;
	line-height: 1.4;
}
.headTxt2 p strong {font-size:16px; line-height:1.4; color:#333; font-weight:600;}




/**************** media query ****************/
/*** media query 1140px ***/
@media all and (max-width:1140px){

#subBanner .bannerWrap {width:100%;}

}


/**************** media query ****************/
/*** media query 1000px ***/
@media all and (max-width:1000px){

#subBanner .bannerWrap .txtArea {width:100%;}

}





/**************** media query ****************/
/*** media query 980px ***/
@media all and (max-width:980px){

/* layout */
#contentsWrap {width:auto; margin:45px 40px 78px;}
#lnb {display:none; float:none; margin:0;}
#contents {float:none; width:auto;}
#subBanner .bannerWrap {width:auto;}

}







/**************** media query ****************/
/*** media query 840px ***/
@media all and (max-width:840px){

#business .powerlimb .info {width:690px;}
#business .powerlimb .info ul li {width:165px; margin:0 10px 20px 0;}
#business .powerlimb .info ul li p {font-size:13px;}

}




/**************** media query ****************/
/*** media query 768px ***/
@media all and (max-width:768px){

#subBanner .bannerWrap .txtArea span {display:none;}

}




/**************** media query ****************/
/*** media query 767px ***/
@media all and (max-width:767px){

/* content */

#business .powerlimb h3 {display:none;}
#business .powerlimb .img {margin:10px 0 35px 0;}
#business .powerlimb .info {width:388px;}
#business .powerlimb .info ul li {width:174px; margin:0 0 20px 0; padding:0 10px;}

}




/**************** media query ****************/
/*** media query 740px ***/
@media all and (max-width:740px){

/* content */
#service .headTxt p {padding:0 20px;}
#service .headTxt2 p {padding:0 20px;}

}





/**************** media query ****************/
/*** media query 640px ***/
@media all and (max-width:640px){

/* common */
.tNone {display:none;}
.thWide {width:20%;}
.thWideTy {width:30%;}
.tw20 {width:20%;}
.tw25 {width:25%;}
.w402 {width:90%;}


.pta li.mq540 {clear:both; padding:5px 0 0 0;}

#business .hydraulic ul li {
	float: center;
	width: 100%;
}
#business .powerlimb .img img {width:100%;}

}



/**************** media query ****************/
/*** media query 560px ***/
@media all and (max-width:560px){

#service .outline .mobileDiv img {width:100%;}

}







/**************** media query ****************/
/*** media query 540px ***/
@media all and (max-width:540px){

/* layout */
#subBanner .bannerWrap {height:85px;}
#subBanner .bannerWrap .txtArea {margin:30px 0 0 32px;}
#subBanner .bannerWrap .txtArea p {font-size:18px; margin:0 0 6px 0;}
#subBanner .bannerWrap .txtArea span {display:none;}
#subBanner .bannerWrap .imgArea img {height:85px;}

#contentsWrap {margin:24px 20px 30px;}
#location {display:none;}

#contents h2 {font-size:20px; padding:0 0 24px;}


/* business */
#business .hydraulic h3 {font-size:18px; margin:40px 0 20px;}
#business .hydraulic h3.f {margin:5px 0 20px;}
#business .hydraulic ul {
	width: 100%;
	margin: 0 auto;
}
#business .hydraulic ul li {float:none; margin:0 0 20px 0;}

/* common */
.headTxt p {font-size:12px; padding:0 10px;}
.headTxt p span {font-size:12px;}
.headTxt2 p {font-size:12px; padding:0 10px;}
.headTxt2 p span {font-size:12px;}
.headTxt2 p strong {font-size:12px;}

/* img type */
.webImg {display:none;}
.mobileImg {display:inline-block;}

/* textarea */
.tta textarea {font-size:12px; height:100px;}



}



/**************** media query ****************/
/*** media query 492px ***/
@media all and (max-width:492px){

.pta li.mq492 {clear:both; padding:5px 0 0 0;}

}



/**************** media query ****************/
/*** media query 420px ***/
@media all and (max-width:420px){

#business .powerlimb .info {width:180px;}
#business .powerlimb .info ul li .tit {height:auto; font-size:14px; margin:0 0 10px 0;}
#business .powerlimb .info ul li .circle01 {font-size:15px;}
#business .powerlimb .info ul li .circle02 {font-size:15px;}
#business .powerlimb .info ul li p {font-size:12px; background-position:left 6px;}


}




/**************** media query ****************/
/*** media query 365px ***/
@media all and (max-width:365px){

#service .outline .pointDiv .home {top:-35px;}
.emailInput {width:82px;}

}
