@charset "utf-8";
@import url('basic.css');

body{-webkit-text-size-adjust:none;}
img {max-width:100%;}
#wrapper{position:relative; z-index:1; width:100%; overflow:hidden; margin:0 auto;}
.overlay {position:fixed; width:100%; height:100%; background:url('/mobile/images/common/bg_overlay.png') repeat 0 0; z-index:100; display:none;}

#allMenu {position:fixed; overflow-y:scroll; background:#fff; width:230px; z-index:101; height:100%; padding:7%; box-sizing:border-box; display:none; left:-230px;}
#allMenu .btn_close {position:absolute; right:7%;}
#allMenu dl {margin:30px 0;}
#allMenu dl a {display:block;}
#allMenu dt {margin-bottom:5%;}
#allMenu dt a {font-family:'NGB'; font-size:17px; color:#333;}
#allMenu dt:hover a {color:#349fd3;}
#allMenu dt.active a {color:#349fd3;}
#allMenu dd {margin-bottom:10%; display:none;}
#allMenu dd a {line-height:24px; font-size:13px; border-left:1px solid #dfdfdf; padding-left:15px;}
#allMenu dd a:hover {border-left:2px solid #349fd3; color:#349fd3;}
#allMenu dd a.active {border-left:2px solid #349fd3; color:#349fd3;}

/* Head Style */
.headWrap{width:100%; height:65px; background:url('/mobile/images/common/bg_header.gif') left bottom repeat-x; overflow:hidden; position:relative; margin:0 auto; z-index:99;}
.headWrap h1{width:110px; z-index:2; padding:4px 0px 0px 0; position:relative;z-index:99; margin:0 auto;}
.headWrap .util{position:absolute; top:20px; right:15px; z-index:99;}
.headWrap .util li{width:auto; float:left; padding-left:10px;}
.headWrap .btn_menu {position:absolute; top:23px; left:15px;}

/* Menu Style */
.menuArea{width:100%; height:60px; text-align:center; background:url(/mobile/images/common/menu_bg.gif) left bottom repeat-x; overflow:hidden; border-top:1px solid #110058; z-index:999;}
.menuArea a{width:25%; height:58px; display:block; overflow:hidden; padding-top:17px; float:left; cursor:pointer; z-index:99; background:url(/mobile/images/common/menu_gap.gif) left top repeat-y;z}
.menuArea a:first-child{z-index:99; background:none;}
.menuArea a.on{background:url(/mobile/images/common/menu_bg_on.gif) left bottom repeat-x; z-index:99; width:25% !important;}
.menuArea a img{vertical-align:top; z-index:99; width:80px;}


/* page Style */
.mainSlider {width:100%;}
.mainSlider li {text-align:center; width:100% !important;}
.mainSlider li img {width:100%;}

.mainBanner{width:100%; position:relative;}
.mainBanner a img {vertical-align:top;}
.mainWrap .quick ul {border-bottom:1px solid #dfdfdf;}
.mainWrap .quick ul li {border-top:1px solid #dfdfdf;}
.mainWrap .quick ul li img {vertical-align:top;}


/*.contentArea{width:100%; position:relative; margin:0 auto 62px; padding:0; background:#fff;z-index:1;}
.contentArea .content{padding:30px 15px; height:auto; overflow:hidden; display:block; background:none;}
.contentArea .content h3{padding-bottom:30px; width:290px; margin:0 auto;}
.contentArea .content p{text-align:justify; padding-bottom:20px;}*/
.contentArea{width:100%; position:relative; margin:0 auto; padding:0; height:100%; min-height:100%; font-size:13px; line-height:18px;}
.contentArea .content{width:92%; text-align:left; margin:20px auto; padding:0px; height:100%; min-height:100%; position:relative;}
.contentArea .content h3{padding:10px 0px; border-bottom:1px solid #ddd; margin-bottom:30px; height:25px;}
.contentArea .content h4{font-size:20px; color:#110058; padding-bottom:2px;}
.contentArea .content p{text-align:left; padding-bottom:20px;}

.contentArea .content .locationDL{display:inline-block; width:100%; padding-bottom:1px; min-height:15px; height:auto;}
.contentArea .content .locationDL dt{width:15px; height:15px; margin-right:5px; float:left;}
.contentArea .content .locationDL dd{width:90%; float:left; min-height:15px; height:auto; padding-top:0px; float:left;}

.contentArea .content .locationDL02{display:inline-block; width:100%; padding-bottom:15px;}
.contentArea .content .locationDL02 dt{width:33%; height:25px; margin-right:8px; padding-bottom:3px; float:left;}
.contentArea .content .locationDL02 dd{width:90%; float:left; padding-top:0px; margin-left:27px;}

.asBox{position:relative; width:100%; height:55px; display:inline-block; padding-bottom:20px; margin-bottom:20px; border-bottom:1px dashed #e0e0e0;}
.asBox .asicon{width:40px; height:40px; float:left;}
.asBox .astt{width:80%; margin-left:5%; float:left;}

.contentArea .content .black{color:#111; font-weight:bold;}
.contentArea .content .white{color:#fff; font-weight:bold;}
.contentArea .content .blue{color:#339fd3; font-weight:bold;}
.contentArea .content .red{color:#9e1828; font-weight:bold;}

/* Q&A */
.contentArea .content table.type01_view{width:100%;border-top:2px solid #333;}
.contentArea .content table.type01_view th, .contentArea .content table.type01_view td{border-bottom:1px solid #ddd; padding:8px 10px;}
.contentArea .content table.type01_view th{border-right:1px solid #ddd; text-align:left; background:#f5f5f5;}
.contentArea .content table.type01_view td{text-align:left;}

/* Contact Style
.contentArea .content .conTable{width:100%; margin:0 auto;}
.contentArea .content .conTable td{text-align:left; padding:3px 0px 3px 10px; vertical-align:top;}
.contentArea .content .conTable th{text-align:left; padding:3px 0px 3px 10px; vertical-align:top; background:url(/mobile/images/common/dot_red.gif) left 7px no-repeat;}
.contentArea .content .conTable input, select, textarea, label{border:1px solid #ddd; height:20px; vertical-align:top;}*/


/* Tab Style */
.companyTab{background:#b4b8c3; width:100%; height:35px; text-align:center; z-index:50; border-bottom:1px solid #110058;}
.companyTab a{width:50%; padding-top:10px; height:25px; float:left; background:none; display:block; overflow:hidden; font-size:0px; line-height:0; cursor:pointer;z-index:50;}
.companyTab a:first-child{background:none; width:50%;z-index:50;}
.companyTab a.on{background:url(/mobile/images/common/tab_bg.jpg) left bottom repeat-x; z-index:50;}
.companyTab a img{vertical-align:top;z-index:50;}

.proTab{background:#b4b8c3; width:100%; height:70px; text-align:center; z-index:50; padding-bottom:1px; border-bottom:1px solid #110058;}
.proTab a{width:50%; padding-top:10px; height:25px; float:left; background:url(/mobile/images/common/menu_gap.gif) left top repeat-y; border-bottom:1px solid #ccc; display:block; overflow:hidden; font-size:0px; line-height:0; cursor:pointer;z-index:50; margin-bottom:-1px;}
.proTab a:first-child{background:none; width:50%;z-index:50;}
.proTab a.on{background:url(/mobile/images/common/tab_bg.jpg) left bottom repeat-x; z-index:50;}
.proTab a img{vertical-align:top;z-index:50;}
.proTab .blank {width:50%; padding-top:10px; height:25px; float:left; background:url(/mobile/images/common/menu_gap.gif) left top repeat-y; border-bottom:1px solid #ccc; display:block; overflow:hidden; font-size:0px; line-height:0; z-index:50; margin-bottom:-1px;}

.asTab{background:#b4b8c3; width:100%; height:70px; text-align:center; z-index:50; border-bottom:1px solid #110058;}
.asTab a{width:50%; padding-top:10px; height:25px; float:left; background:url(/mobile/images/common/menu_gap.gif) left top repeat-y; border-bottom:1px solid #ccc; display:block; overflow:hidden; font-size:0px; line-height:0; cursor:pointer;z-index:50;}
.asTab a:first-child{background:none; width:50%;z-index:50;}
.asTab a.on{background:url(/mobile/images/common/tab_bg.jpg) left bottom repeat-x; z-index:50;}
.asTab a img{vertical-align:top;z-index:50;}


.categoryTab{width:100%; overflow:hidden; min-height:30px; padding-bottom:10px; height:auto; display:block}
.categoryTab a{width:48%; padding:5px 0px 8px; height:12px; float:left; background:#fff; text-align:center; font-size:12px; font-weight:bold; cursor:pointer; margin-right:2px; margin-bottom:2px; border:1px solid #ddd; display:block;}
.categoryTab a.on{width:48%; padding:5px 0px 8px; height:12px; float:left; background:#339fd3; text-align:center; color:#fff; font-weight:bold; font-size:12px; cursor:pointer; margin-right:2px; margin-bottom:2px; border:1px solid #339fd3; display:block;}

/* 장인정신 */
.workmanship .introduction h4 {padding-bottom:0; margin-bottom:20px; font-size:18px;}
.workmanship .introduction h4 img {max-height:22px;}
.workmanship .introduction .txtArea {position:relative; text-align:right;}
.workmanship .introduction p {position:absolute; top:0; left:0; width:50%; word-break:keep-all; text-align:left;}
.workmanship .introduction .as_info .navy {display:block; font-size:14px; color:#07638f;}
.workmanship .introduction .as_info img {display:block; padding-top:15px; vertical-align:top;}
.workmanship .introduction .as_info > img {max-height:100px;}
.workmanship .introduction .as_info .btn_regist img {max-height:30px;}
.workmanship .section {margin-top:40px; padding-bottom:20px;}
.workmanship .section .tt {display:block; margin-bottom:25px;}
.workmanship .section .tt img {max-height:48px;}
.workmanship .section > img {max-height:1160px;}

/* Smartphones (landscape) -----------*/

@media only screen
and (min-width : 480px) {
/* Styles */
.categoryTab{width:100%; overflow:hidden; min-height:30px; padding-bottom:10px; height:auto; display:block}
.categoryTab a{width:32%; padding:5px 0px 6px; height:12px; float:left; background:#fff; text-align:center; font-size:12px; font-weight:bold; cursor:pointer; margin-right:2px; margin-bottom:2px; border:1px solid #ddd; display:block;}
.categoryTab a.on{width:32%; padding:5px 0px 6px; height:12px; float:left; background:#339fd3; text-align:center; color:#fff; font-weight:bold; font-size:12px; cursor:pointer; margin-right:2px; margin-bottom:2px; border:1px solid #339fd3; display:block;}
}


/* padding guide */
.pdT120{padding-top:120px; !important}
.pdT50{padding-top:50px; !important}
.pdT30{padding-top:30px; !important}
.pdT20{padding-top:20px; !important}
.pdT10{padding-top:10px; !important}

.pdL150{padding-left:150px; !important}
.pdL120{padding-left:120px; !important}
.pdL30{padding-left:30px; !important}

.pdB10{padding-bottom:10px; !important}
.pdB20{padding-bottom:20px; !important}
.pdB30{padding-bottom:30px; !important}

.pdL40p{padding-left:40%; !important}

.pdR20{padding-right:20px; !important}


/* Foot Style */
.footWrap{width:94%; padding:10% 3%; height:auto; overflow:hidden; position:relative; background:#111; text-align:center;}
.footWrap .btn_top {display:inline-block; margin-bottom:5%;}
.footWrap .ctt {color:#fff; font-size:12px;}
.footWrap address{height:auto; position:relative; background:none; font-style:normal; font-size:12px; line-height:1.5em; margin-top:5%;}
.footWrap address span{padding-right:7px; color:#aaa;}
.footWrap .copyright{position:relative; background:none; color:#aaa; font-size:12px;}




.customer-popup {display:none; z-index:1000; background-color:#fff; position:fixed; top:0px; left:0px;  padding:20px; padding-top:55px; word-break:keep-all; border:1px solid #ddd; box-sizing:border-box;}
.customer-popup .contentAreas {margin-left:0;}
.customer-popup .close-btn {position:absolute; right:10px; top:10px; z-index:1001; cursor:pointer;}
.customer-popup .close-btn svg {width: 30px;}
.contentAreas{width:100%; margin-left:30px; position:relative; font-family:'NG'}
.customer-popup h3{font-size:18px; color:#339fd3; padding:0 0 15px 0; letter-spacing:-1px; font-family:'NGB';}
.customer-popup h3 strong{color:#07638f; font-family:'NG'}
.customer-popup h3 span{color:#07638f; font-size:14px; font-family:'NGB';}
.customer-popup h4{font-size:15px; color:#339fd3; font-weight:normal; padding-bottom:10px; background:url(/images/common/bar_blue02.gif) left top no-repeat; padding-top:15px; font-family:'NG'}
.customer-popup h5{font-size:14px; color:#222; font-weight:normal; padding-bottom:10px; background:url(/images/common/bar_black02.gif) left top no-repeat; padding-top:10px;  font-family:'NGB'}
.customer-popup .section{ position:relative; padding-bottom:20px; font-size:13px; font-weight:lighter !important; line-height:20px; height:auto;}
.customer-popup .section ul{position:relative; height:auto; display:block;}
.customer-popup .section ul li{float:left;  padding:0px 0px 5px 15px; height:auto; background:url(/images/common/bar_blue.gif) left 5px no-repeat; line-height:20px;}
.customer-popup  .cus01{background:url(/images/customer/01.gif) left top no-repeat; padding:5px 0px 0px 40px; width:70%; height:auto; padding-bottom:10px; float:left;}
.customer-popup  .cus02{background:url(/images/customer/02.gif) left top no-repeat; padding:5px 0px 0px 40px; width:70%; height:auto; padding-bottom:10px; float:left;}
.customer-popup  .cus03{background:url(/images/customer/03.gif) left top no-repeat; padding:5px 0px 0px 40px; width:70%; height:auto; padding-bottom:10px; float:left;}
.customer-popup  .cus04{background:url(/images/customer/04.gif) left top no-repeat; padding:5px 0px 0px 40px; width:70%; height:auto; padding-bottom:10px; float:left;}
.customer-popup .center{width:100%; margin:0 auto; text-align:center; padding:30px 0px;}
.customer-popup .form-check-label {font-weight:bold; color: #07638f; }