@charset "utf-8";
/* @charset "euc-kr"; */

/* body position: relative */
.bnSubArea {position: relative; width: 100%; height: 200px; margin: 0 auto; background: url('../img/sbn01.jpg') center top; background-size: cover;}
.bnSubArea .sbn {width: 100%; width: 960px; height: 200px; margin: 0 auto; text-align: center;}
.bnSubArea .sbn > h2 {position: absolute; display: block; top: 30px; left: 50%; margin-left: -480px; width: 960px; height: 80px; line-height: 80px; font-size: 60px; font-weight: 300; color: #fff; text-align: center; text-shadow: 0 0 5px 0 #666;}

#subHeader {position: absolute; top: 240px; left: 50%; margin-left: -480px; width: 960px; height: 60px;}
#subHeader .subHeaderFix {width: 960px; height: 60px; z-index: 11;}

#subHeader .subMenuArea {width: 960px; height: 60px; background-color: #575e67;}
#subHeader .subMenuArea .subMenuNavi {width: 960px; height: 60px; margin: 0 auto;}
#subHeader .subMenuArea .subMenuNavi>li {float: left; background-color: #575e67;}
#subHeader .subMenuArea .subMenuNavi>li a,
#subHeader .subMenuArea .subMenuNavi>li a:hover {width: 100%; height: 60px; display: block; text-align: center; font-size: 14px; line-height: 60px; font-weight: normal; color: #fff; text-decoration: none; transition: all 0.3s;}
#subHeader .subMenuArea .subMenuNavi>li.on,
#subHeader .subMenuArea .subMenuNavi>li.on>a {color: #fff; background-color: #a79269; transition: all 0.3s;}
#subHeader .subMenuArea .subMenuNavi>li a:hover {color: #fff; background-color: #484f59; transition: all 0.3s;}
#subHeader .subMenuArea .subMenuNavi>li.on > a:hover {color: #fff; background-color: #b28122; transition: all 0.3s;}

#subHeader .subMenuArea .subMenuNavi.tap1>li {width: 480px; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tap2>li {width: 480px; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tap3>li {width: 320px; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tap4>li {width: 240px; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tap5>li {width: 192px; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tap6>li {width: 160px; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tap7>li {width: 137px; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tap7>li:first-child {width: 138px; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tap8>li {width: 120px; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tap9>li {width: calc(100% / 9); height: 60px; border-left: none;}



#subContainer {width: 960px; min-height: 600px; margin: 0 auto; padding: 60px 0 100px; background-color: #fff;}

	.subTitleArea {width: 100%; height: 60px; box-sizing: border-box; border-bottom: 1px #eee solid;}
	.subTitleArea h3 {float: left; display: block; height: 60px; font-size: 36px; font-weight: 300; color: #333; line-height: 60px;}
	.subTitleArea ul.whereIs {float: right; display: block; height: 20px; padding: 20px 0; font-size: 13px; font-weight: 300; color: #777; line-height: 20px; text-align: right;}
	.subTitleArea ul.whereIs > li {float: left; padding-right: 25px; padding-left: 5px; background: url('../img/iconWhereis.png') right center no-repeat;}
	.subTitleArea ul.whereIs > li:last-child {font-weight: 500; color: #333; padding-right: 0;}

	.cBox {position: relative; width: 960px; padding-bottom: 40px; margin-bottom: 40px; border-bottom: 1px #eeeeee dashed;}
	.cBox h4 {padding-bottom: 20px;}

	.cBox table h4 {padding: 10px 0; font-size: 18px;}

	.productCnt {width: 100%; height: 40px; line-height: 40px; text-align: left; font-size: 12px; color: #999; font-weight: 333;}