@import url( "http://fonts.googleapis.com/earlyaccess/notosanskr.css" );
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 100; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype'); }
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 300; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype'); }
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 400; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype'); }
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 500; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype'); }
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 700; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype'); }
@font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 900; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype'); }
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Play:wght@400;700&display=swap');
* { margin: 0; padding: 0; box-sizing: border-box }
li { list-style: none }
img { border: 0; vertical-align: middle; max-width: 100% }
body, td, p, input, button, textarea, select, a { font-family: 'Roboto', 'Noto Sans KR', sans-serif, 'Play'; font-weight: 400; font-size: 16px; color: #333; line-height: 1.6; letter-spacing: -0.5px; padding: 0; margin: 0; word-break: keep-all }
body { /*overflow-y: scroll*/ }
h1, h2, h3, h4, h5, h6, strong, b, dt, em { font-weight: 600 }
em, i { font-style: normal }
a, a:hover, a:active, a:focus { text-decoration: none }
/*common*/    
.clear:after { display: block; content: ''; clear: both }
* { margin: 0; padding: 0 }
br { font-family: initial; }
/*html, body { height: 100% }*/
img { border: 0; vertical-align: top }
a { text-decoration: none; }
a:hover { text-decoration: none; }
li { list-style: none }
h1, h2, h3, h4, h5, h6, strong, b { font-weight: 600 }
.d_container { max-width: 1400px; margin: 0 auto }
/* °øÅë */
.sub_full { width: 100%; overflow: hidden; background: #f2f2f2; padding: 40px 0; margin: 0 0 30px 0; border-top: 4px solid #75b0ce }
.inner { max-width: 1400px; margin: 0 auto; position: relative; text-align: center }
.s_inner { max-width: 1400px; margin: 0 auto; position: relative; text-align: center }
.ovf { overflow: hidden; }
.clear { clear: both }
.montserrat { font-family: 'Montserrat', sans-serif; font-weight: 900; }
.center { text-align: center !important; }
.left { text-align: left !important; }
.comm_box { background: #CCC url(../images/common/comm_box_bg.png) no-repeat top left; padding: 10px; overflow: hidden; margin: 0 0 30px 0 }
.comm_box_in { background: #fff; padding: 30px; overflow: hidden }
section { text-align: center; }
.half { width: 48%; margin: 1%; float: left }
.left { text-align: left }
.comm_table { width: 100%; margin: 30px 0; border-top: 5px solid #3a4395; border-left: 1px solid #ccc; }
.comm_table th { padding: 15px 20px; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc; text-align: center; font-weight: bold; background: #F6F6F6; position: relative; text-transform: uppercase }
.comm_table td { padding: 15px 20px; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc; text-align: center; text-transform: uppercase }
.comm_table tr:hover { background: #fafafa }
.center_table td { text-align: center !important }
.table_dot th::after { display: none }
.t_left { text-align: left; }
.s_tit { text-align: center; margin: 0 auto; padding: 0 0 30px 0; font-weight: bold; font-size: 1.8em }
.s_tit span { font-weight: bold; color: #da2128 }
.s_tit_pbox { display: inline-block; font-size: 15px; line-height: 30px; text-align: center; padding: 13px 40px; color: #fff; background-color: #1b1e6e; border-radius: 60px; -moz-border-radius: 60px; -webkit-border-radius: 60px; margin: 40px 0 20px 0; }
h4 { font-weight: 600; font-size: 1.8em; margin: 0 0 30px 0; padding: 10px 0 0 0; position: relative }
h4::before { position: absolute; content: ''; width: 50px; height: 7px; background: #3a4395; top: 0; left: 50%; transform: translateX(-50%) }
h4 span { color: #1b8d27; }
.mt30 { margin: 30px 0 0 0; }
.mb30 { margin: 0 0 30px 0; }
.mb50 { margin: 20px 0 50px 0; }
.pd30 { padding: 30px; }
.pd50 { padding: 50px 0 0 0; }
.right { text-align: right !important }
.comm_list { overflow: hidden }
.comm_list li { padding: 3px 0 3px 10px; background: url(../images/common/li_bg.png) no-repeat 0 15px; text-align: left; }
.comm_list li span { display: inline-block; width: 10%; font-weight: bold; color: #1b8d27; }
.column3 { width: 33%; }
.column4 { width: 25%; }
.column5 { width: 20%; }
.column3 dl dd { text-align: left; }
.box { border: 3px dotted #1b8d27; padding: 20px; }
.box p { font-size: 1.2em; font-weight: bold }
.strong { color: #1b8d27; }
.bold { font-weight: bold; }
.red { color: #d92127 }
.s_btn { display: inline-block; }
.s_btn a { display: block; padding: 10px 20px; background: #1b8d27; color: #fff; font-weight: bold; text-align: center }
.s_btn a:hover { background: #333; }
h5 { text-align: center; font-weight: bold; font-size: 20px; background: url(../images/common/h5_bg.png) no-repeat top center; padding: 20px 0 }
h6 { text-align: left; font-weight: bold; font-size: 20px; margin: 0 0 30px 0 }
.b_txt { font-size: 1.4em; font-family: 'WONBatang'; }
hr { border: 1px solid #CCC }
footer { width: 100%; overflow: hidden; padding: 5em 0; margin: 0 auto; background: #434344; color: #b2b2b2; text-align: left; letter-spacing: normal }
footer ul { overflow: hidden; margin: 0 0 10px 0; text-align: left }
footer ul li { display: inline-block; padding: 0 20px 0 0 }
footer ul li a { font-weight: bold; color: #fff !important; font-size: 13px }
footer address { display: flex; font-style: normal; text-align: left }
footer address dl { flex: 1; padding: 1rem; position: relative }
footer address dl::before { content: ''; position: absolute; top: 25%; right: 15%; width: 1px; height: 50%; background: #b2b2b2 }
footer address dl:last-child::before { display: none }
footer address dl dd span { font-family: 'Play', sans-serif; display: block }
footer p { font-family: 'Montserrat', sans-serif; color: #d5d5d5; font-size: 0.8em; letter-spacing: normal; text-align: center; flex: none; padding: 1rem 0 }
footer p span { color: #ef2e24; font-weight: bold }
footer p a { color: #999 }
/* ÅÇ */
.tabmenu { text-align: center; }
.tabmenu ul { display: flex; margin: 0 0 3rem 0 }
.tabmenu li { display: inline-block; flex: 1; margin: -1px }
.tabmenu li a { display: block; background: #fff; border: 1px solid #ccc; height: 60px; line-height: 60px; }
/*.tab li a:hover { background: #333 !important; color: #fff; }*/
.tab_select a { background: #3a4395!important; font-weight: bold; color: #fff; }
.hvr-sweep-to-top { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px transparent; position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; }
.hvr-sweep-to-top:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #333; -webkit-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; }
.hvr-sweep-to-top:hover, .hvr-sweep-to-top:focus, .hvr-sweep-to-top:active { color: white; }
.hvr-sweep-to-top:hover:before, .hvr-sweep-to-top:focus:before, .hvr-sweep-to-top:active:before { -webkit-transform: scaleY(1); transform: scaleY(1); }
.hvr-sweep-to-top { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px transparent; position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; }
.hvr-sweep-to-top:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #132750; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; }
.hvr-sweep-to-top:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active { color: white; }
.hvr-sweep-to-top:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before { -webkit-transform: scaleX(1); transform: scaleX(1); }
/*effect-underline*/
a.effect-underline:after { content: ''; position: absolute; left: 0; display: inline-block; height: 1em; width: 100%; border-bottom: 1px solid; margin-top: 10px; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: scale(0, 1); transform: scale(0, 1); }
a.effect-underline:hover:after { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
/*effect-box*/
a.effect-box:after, a.effect-box:before { content: ''; position: absolute; left: 0; display: inline-block; height: 1em; width: 100%; margin-top: 10px; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; }
a.effect-box:before { border-left: 1px solid; border-right: 1px solid; -webkit-transform: scale(1, 0); transform: scale(1, 0); }
a.effect-box:after { border-bottom: 1px solid; border-top: 1px solid; -webkit-transform: scale(0, 1); transform: scale(0, 1); }
a.effect-box:hover:after, a.effect-box:hover:before { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
/* effect-shine */
a.effect-shine:hover { -webkit-mask-image: linear-gradient(-75deg, rgba(0,0,0,.6) 30%, #000 50%, rgba(0,0,0,.6) 70%); -webkit-mask-size: 200%; animation: shine 2s infinite; }
 @-webkit-keyframes shine { from {
 -webkit-mask-position: 150%;
}
to { -webkit-mask-position: -50%; }
}
/* »ó´Ü ¾ð¾î */
.lang { float: right; width: 230px; height: 70px; background: #333; color: #fff; line-height: 70px }
.lang h2 { float: left; font-size: 13px; font-weight: bold; position: relative; padding: 0 2rem 0 3rem; width: 60%; box-sizing: border-box }
.lang h2::before { content: ''; position: absolute; top: 29px; left: 15px; background: url(../images/common/lang.png) no-repeat; width: 16px; height: 15px }
.lang h2::after { content: ''; position: absolute; top: 30px; right: 5px; width: 1px; height: 10px; background: #CCC }
.lang .select { float: left; width: 40%; }
.lang select { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; outline: 0; box-shadow: none; border: 0 !important; background: #333; background-image: none; }
/* Remove IE arrow */
.lang select::-ms-expand {
 display: none;
}
.lang select:focus { outline: none }
/* Custom Select */
.select { position: relative; display: flex; width: 100%; height: 70px; line-height: 70px; overflow: hidden; }
.lang select { flex: 1; padding: 1em; color: #fff; cursor: pointer; font-size: 13px; font-weight: bold }
/* Arrow */
.select::after { content: '\25BC'; position: absolute; top: -1px; right: 10px; padding: 0 1em; font-size: 10px; cursor: pointer; pointer-events: none; -webkit-transition: .25s all ease; -o-transition: .25s all ease; transition: .25s all ease; }
/* Transition */
.select:hover::after { color: #f39c12; }
/* »çÀÌÆ®¸Ê ¸ð´Þ */
.sitemap { float: right; }
.button { cursor: pointer; transition: all 0.3s ease-out; }
.button:hover { }
.overlay { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.7); transition: opacity 500ms; visibility: hidden; opacity: 0; }
.overlay:target { visibility: visible; opacity: 1; }
.popup { margin: 200px auto; padding: 4em; background: #fff url(../images/common/submenu_bg.jpg) no-repeat top right; width: 70%; position: relative; transition: all 5s ease-in-out; z-index: 9999999 }
.popup h2 { margin-top: 0; color: #333; text-align: center; padding: 0 0 2em 0; font-size: 1.5rem }
.popup .close { position: absolute; top: 20px; right: 30px; transition: all 200ms; font-size: 30px; font-weight: bold; text-decoration: none; color: #333; }
.popup .close:hover { color: #ec0078; }
.popup .content { max-height: 30%; overflow: auto; }
.sitemap_warp { overflow: hidden; display: flex }
.sitemap_warp dl { flex: 1; text-align: center }
.sitemap_warp dl dt { margin: 0 0 1rem 0; padding: 1rem 0; }
.sitemap_warp dl dt a { font-weight: bold; font-size: 1.3rem; color: #333 }
/* ¸ÞÀÎ */
.progress-tracker { position: fixed; top: 50%; right: 10px; z-index: 9; display: none !important }
.progress-tracker.hide { width: 0px; }
.progress-tracker.hide ul li .pt-description, .progress-tracker.hide.active ul li .pt-description, .progress-tracker.hide.constant ul li.active .pt-description { }
.progress-tracker ul li { width: 10px; height: 10px; position: relative; background-color: #ebe9ea; border: 1px solid #ccc; margin-bottom: 10px; list-style-type: none; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; }
.progress-tracker ul li a { width: 100%; height: 100%; display: block; }
.progress-tracker ul li .pt-description { display: none; position: absolute; top: -2px; right: 25px; padding: 3px 8px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; background-color: #e9ebea; white-space: nowrap; }
.progress-tracker ul li.active { background-color: #0b4827; border-color: #0b4827; }
.progress-tracker.constant ul li.active .pt-description { display: block }
#ptsection-one { overflow: hidden; text-align: center; position: relative }
/* ¸ÞÀÎ °øÁö»çÇ× */

.main_notice { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); background: rgba(32,35,46,0.9); color: #fff; z-index: 9; width: 100%; max-width: 1400px; height: 85px; line-height: 85px; text-align: left; font-size: 18px }
.main_notice dl dt { float: left; width: 140px; text-align: center; }
.main_notice dl dd { float: left; width: calc(100% - 140px) }
.main_notice dl dd a { color: #fff }
/* ¸ÞÀÎ Á¦Ç° */
.main_product { overflow: hidden; background: url(../images/main/product_bg.jpg) no-repeat top center; padding: 140px 0 0 0; text-align: left }
.main_product .inner { background: url(../images/main/product_bottom.png) no-repeat bottom right; padding: 0 0 140px 0 }
.main_product h2 { font-weight: bold; font-size: 70px; line-height: 1.2; text-align: left; margin: 0 0 5rem 0 }
.main_product h2 span { display: block; font-size: 24px }
.wrapper { width: 100%; margin: 0 auto }
.slideshow-items { position: relative; display: block; }
.slideshow-item { opacity: 0; position: absolute; top: 0; left: 0; list-style: none; transition: opacity .3s ease-in-out, transform .3s ease-in-out; -webkit-transition: opacity .3s ease-in-out, -webkit-transform .3s ease-in-out; -moz-transition: opacity .3s ease-in-out, -moz-transform .3s ease-in-out; -ms-transition: opacity .3s ease-in-out, -ms-transform .3s ease-in-out; width: 100% }
.slideshow-item::before { content: ''; position: absolute; bottom: 0; right: 0; width: 40%; height: 60%; background: #3a4395 }
.slideshow-item.apos-current { opacity: 1 }
.slideshow-item.apos-next { transform: translate3d(100%, 0, 0) }
.slideshow-item.apos-previous { transform: translate3d(-100%, 0, 0) }
.slideshow-item.apos-other { transform: translate3d(0, 0, 0) }
.slideshow-item .slideshow-item-html { float: left; width: 50%; position: relative }
.slideshow-item .slideshow-item-html dl { position: relative; text-align: left; padding: 0 0 0 2rem }
.slideshow-item .slideshow-item-html dl::before { content: ''; position: absolute; top: 0; left: 0; width: 5px; height: 100%; background: #3a4395 }
.slideshow-item .slideshow-item-html dl dt { font-weight: bold; font-size: 28px; margin: 0 0 1rem 0 }
.slideshow-item .slideshow-item-html dl dd { font-size: 18px }
.slideshow-item .slideshow-item-html dl dd span { display: block; width: 100px; margin: 2rem 0 }
.slideshow-item .slideshow-item-html dl dd a { display: block; }
.slideshow-item .slideshow-item-html dl dd img { box-shadow: none !important; margin: 7px 0 0 1rem !important }
.slideshow-item img { max-width: 100%; cursor: pointer; float: right; margin: -20rem 3rem 3rem 0; box-shadow: 0 0 20px rgba(0,0,0,0.5); position: relative }
.previous, .next { position: relative; width: 49%; display: inline-block; padding: 5px 1%; color: #222; text-align: center; text-decoration: none; background: #ccc }
.previous { margin-right: 2% }
.pagers { padding: 0; text-align: left; margin: 0 0 3rem 0 }
.pagers li { list-style: none; position: relative; display: inline-block; padding: 0.5rem 1.5rem; cursor: pointer; color: #808080; text-align: center; font-size: 24px }
.pagers li:last-child { margin-right: 0 }
.pagers li.apos-current { background: #3a4395; color: #fff; font-weight: bold; box-shadow: 0 0 10px rgba(0,0,0,0.5) }
/* ¸ÞÀÎ ¾ÆÀÌÄÜ */
#ptsection-three { background: url(../images/main/icon_bg.jpg) no-repeat top center; padding: 45px 0; text-align: center }
#ptsection-three h2 { font-size: 24px; font-weight: bold; text-transform: uppercase }
#ptsection-three h2 p { font-size: 20px; font-weight: 300; padding: 1rem 0 }
.main_icon { display: flex; width: 70%; margin: 0 auto; padding: 2rem 0 }
.main_icon li { flex: 1 }
.main_icon li p { font-weight: bold; font-size: 20px; padding: 1rem 0 }
/* ¸ÞÀÎ ÇÏ´Ü */
#ptsection-four { height: 675px; overflow: hidden; position: relative }
.main_map_info { position: absolute; bottom: 100px; left: 50%; transform: translateX(-50%); width: 290px; height: 304px; padding: 50px 30px; box-sizing: border-box; background: rgba(58,67,149,0.9); color: #fff; z-index: 9 }
.main_map_info h2 { font-size: 24px; margin: 0 0 2rem 0; line-height: 1.5 }
.main_map_info ul li { margin: 0 0 1rem 0 }
.main_map_info ul li a { display: block; color: #fff; position: relative; font-weight: bold; font-size: 18px }
.main_map_info ul li a img { margin: 0.5rem 1rem }
#ptsection-four input:focus { outline: none; border: none }
.main_half { float: left; width: 50%; height: 100% }
.main_half .main_in { width: 100%; max-width: 700px; padding: 30px 50px; box-sizing: border-box }
.main_online { background: #585e68; height: 62%; display: flex; align-items: center; }
.main_online h2 { color: #fff; font-size: 24px; margin: 0 0 2rem 0 }
.main_online h2 span { display: inline-block; font-size: 18px; font-weight: 100; margin: 0 0 0 3rem }
.main_online dl { background: #85878a; overflow: hidden; float: left; width: 47%; margin: 0 1rem 1rem 0; box-sizing: border-box; height: 48px; line-height: 48px }
.main_online dl dt { float: left; color: #585e68; clear: both; width: 85px; text-align: center; font-weight: 100; position: relative }
.main_online dl dt::before { content: ''; position: absolute; top: 15px; right: 0; width: 1px; height: 20px; background: #585e68 }
.main_online dl dd { float: left; width: calc(100% - 86px) }
.main_online .main_input { background: none; border: none; width: 100%; color: #fff; padding: 0 0 0 1rem; box-sizing: border-box }
.long_input { float: none !important; width: 96% !important; margin: 0 0 1rem 0 }
.main_inquiry { overflow: hidden }
.main_inquiry textarea { float: left; background: #85878a; width: 78%; margin: 0 1rem 0 0; height: 94px; border: none; box-sizing: border-box; padding: 0.5rem; color: #fff }
.main_inquiry input { float: left; background: #3f3d3d; color: #ccc; text-align: center; width: 94px; height: 94px; border: none }
.main_online p { border: 1px solid #6a6f78; clear: both; color: #dddddd; position: relative; line-height: 45px; height: 45px; padding: 0 0 0 2rem; margin: 1rem 0 0 0; width: 96% }
.main_online p::before { content: ''; position: absolute; top: 15px; left: 10px; width: 17px; height: 17px; border: 3px solid #3a4395; border-radius: 100px }
.main_online p span { float: right; width: 94px; background: #3a4395; text-align: center }
.main_online p span a { color: #CCC }
.main_catalog { background: #3a4395; height: 38%; color: #fff }
.main_catalog dl { float: left }
.main_catalog dl dt { font-size: 24px; margin: 0 0 2rem 0 }
.main_catalog dl dd { font-size: 18px; font-weight: 300; }
.main_catalog dl dd a { display: block; color: #fff; margin: 1rem 0 0 0; font-weight: bold; position: relative; width: 50% }
.main_catalog dl dd a::before { content: ''; position: absolute; top: 25%; right: 0; width: 10px; height: 14px; background: url(../images/main/btn_go.png) no-repeat }
.main_catalog p { float: right; box-shadow: 0 0 20px rgba(0,0,0,0.8) }
/* ½ºÅ©·Ñ ´Ù¿î ¾Ö´Ï¸ÞÀ̼Ç*/
.arrow { position: absolute; z-index: 998; bottom: 15%; left: 0; right: 0; margin: 0 auto; text-align: center }
.bounce { -moz-animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite; animation: bounce 2s infinite; }
 @keyframes bounce { 0%, 20%, 50%, 80%, 100% {
 transform: translateY(0);
}
 40% {
 transform: translateY(-30px);
}
 60% {
 transform: translateY(-15px);
}
}
/* ¼­ºê */
.sub_head { width: 100%; overflow: hidden; height: 300px; padding: 0; margin: 0 auto; }
.sub_head::before { }
.zoom { animation: scale 5s linear forwards; }
 @keyframes scale { 50% {
 background-size:150%;
}
 0% {
 background-size:200%;
}
}
.sub_head h2 { text-align: center; color: #fff; font-weight: bold; padding: 7rem 0 0 0; text-shadow: 1px 1px 5px #000; font-family: 'Montserrat', sans-serif; text-transform: uppercase; font-size: 18px; }
.sub_head h2 span { display: block; font-weight: bold; font-size: 36px }
.sub_head p { position: absolute; top: 0; left: 50%; margin: 0 -17%; }
.sub_contants { min-height: 800px; overflow: hidden; padding: 0 0 5rem 0 }
.sub_tit { position: relative; overflow: hidden; margin: 0 auto 50px auto; text-align: center; border-bottom: 1px solid #ccc; padding: 0 0 1em 0 }
.sub_tit h3 { font-size: 36px; font-weight: bold; padding:30px 0 0 0}
.sub_tit p { font-weight: 300; font-size: 14px; color:#666; padding:0 0 30px 0 }
/* ¼­ºê³×ºñ */
.navi_next { position: absolute; top: 50%; right: 50px; }
.navi_prev { position: absolute; top: 50%; left: 50px; }
.sub_navi { margin-top: -50px; background: #fff;}
#DB_navi39 a { text-decoration: none; display: block }
#DB_navi39 img { border: 0; vertical-align: top }
#DB_navi39 { position: relative; width: 100%; height: 50px; background: #3a4395 }
#DB_navi39 ul { /*width:1400px;*/ width: auto; margin: 0 auto }
#DB_navi39 ul li { border-right: 1px solid #7a83c3; text-indent: 15px }
#DB_navi39 ul li.m0 { width: 50px; border: none; }
#DB_navi39 ul li.m1 { width: 200px }
#DB_navi39 ul li.mm1 { width: 200px }
#DB_navi39 ul li.mm2 { width: 200px }
#DB_navi39 ul li.mm3 { width: 200px } /* 340px ÀÌ»óÁöÁ¤½Ã ¸ð¹ÙÀÏ¿¡¼­ Ʋ¾îÁü */
#DB_navi39 ul li.mm4 { width: 200px }
#DB_navi39 ul li.mm5 { }
#DB_navi39 ul li.mm6 { }
#DB_navi39 ul li.mm7 { }
#DB_navi39 ul li.mm8 { }
#DB_navi39 ul li.DB_main { float: left; position: relative; text-align: left }
#DB_navi39 ul li.DB_main a { color: #fff; line-height: 50px; background: url('../images/common/subnavi_arrow.png') no-repeat 90% 21px }/*¸Þ´º°£°Ý*/
#DB_navi39 ul li.DB_main a:hover { color: #fff !important; font-weight: bold; }
#DB_navi39 ul li.m0 a { background: #333 url('../images/common/icon_home.png') no-repeat 50%; text-indent: -9999px }
#DB_navi39 .DB_main .DB_sub { position: absolute; left: 0; top: 50px; width: 100%; display: none; background: #fff; border: 1px solid #ccc; border-width: 1px; margin-left: -1px; z-index: 999 }
#DB_navi39 .DB_main .DB_sub li { border: none; border-bottom: 1px solid #cccccc }
#DB_navi39 .DB_main .DB_sub li:last-child { border: none }
#DB_navi39 .DB_main .DB_sub li a { display: block; color: #666666; line-height: 40px; background: #fff; transition: all 0.5s }
#DB_navi39 .DB_main .DB_sub li a:hover { color: #ffffff; background: #3a4395 }
#DB_navi39 .DB_main .DB_sub li.DB_select a { color: #ffffff; background: #3a4395 }
.sticky-navigation.stuck { position: fixed; top: 130px; width: 100%; z-index: 999; left: 50%; transform: translateX(-50%); height: 10px; display: none }
#DB_navi39 ul li.DB_main a b { display: none; }
.thumbimg li { display: inline; float: left; width: 25%; }
.white { color: #fff }
.sub_bg { width: 100%; height: 160px; padding: 70px 0; margin: 0 0 50px 0 }
.big { font-size: 1.2em; }
/* ȸ»ç°³¿ä */
.bg_con { padding: 5rem 0; background: #d4dce7; min-height: 400px; position: relative; z-index: -1; }
.bg_con::before { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); background: url(../images/sub01/ceo_text.png) no-repeat; width: 100%; height: 117px; max-width:1400px }
.ceo_con dl { float: left; text-align: left; width: 50% }
.ceo_con dl dt { font-weight: bold; font-size: 2rem; margin: 0 0 2rem 0; word-break: keep-all; }
.ceo_con dl dd { font-size: 1.5rem; word-break: keep-all; }
.ceo_con p { float: right; margin: 3rem 0 0 0; position: relative; padding: 2rem; z-index: 1 }
.ceo_con p::before { content: ''; position: absolute; bottom: 0; right: 0; width: 80%; height: 100%; background: #036; z-index: -1 }
.ceo_bg { background: url(../images/sub01/ceo_bg.png) no-repeat bottom right }
.ceo_text { text-align: left; width: 50% }
.ceo_text p { font-size: 1.2rem; word-break: keep-all; }
.flex_out { display: flex; margin: 0 0 5rem 0 }
.flex_out .flex_management { flex: 1; position: relative }
.flex_out .flex_management::before { content: ''; position: absolute; top: 20px; left: 20px; width: calc(100% - 40px); height: calc(100% - 40px); border: 1px solid #ccc; box-sizing: border-box; z-index: 9 }
.flex_out .flex_management p { position: relative; overflow: hidden; display: flex; align-items: center }
.flex_out .flex_management p img { width: 100%; transition: all 0.5s }
.flex_out .flex_management p img:hover { transform: scale(1.2) }
.flex_out .flex_management p span { position: absolute; left: 50%; transform: translateX(-50%); color: #fff; text-align: center; font-weight: bold; font-size: 1.5rem; word-break: keep-all }
.recruitment { overflow: hidden; background: url(../images/sub01/recruitment.jpg) no-repeat top center; color: #fff; padding: 5rem 0 }
.recruitment p { font-weight: bold; font-size: 1.5rem; color: #fff; margin: 0 0 2rem 0 }
.recruitment dl { display: inline-block; width: 40%; margin: 1% }
.recruitment dl dt { font-weight: bold; font-size: 1.2rem; margin: 0 0 1rem 0; border-bottom: 1px solid #fff; padding: 1rem; box-sizing: border-box }
/* ȸ»ç¿¬Çõ */
.history_warp {/*background:url(../images/sub01/history_bg.jpg) no-repeat top center*/ }
.history h4 { text-align: center; font-size: 180px; letter-spacing: 5px; color: #F2F2F2; margin: 0 0 30px 0; padding-bottom: 0; font-family: 'Montserrat', sans-serif; position: relative; background: none }
.history h4::before { display: none }
.history h4 p { text-align: center; color: #000; margin: -120px 0 0 0; font-size: 24px; font-weight: bold }
.history h4 span { font-size: 45px; color: #093; font-weight: bold; letter-spacing: 0; font-family: 'Montserrat', sans-serif; font-weight: bold }
.history ul { position: relative; overflow: hidden; width: 100%; background: url(../images/sub01/history_bg.png) repeat-y top center }
.history ul li.left { background: url(../images/sub01/history_left.png) no-repeat right 5px; float: left; text-align: right !important; padding-right: 68px; }
.history ul li:first-child { margin-top: 10px; }
.history ul li.right { background: url(../images/sub01/history_right.png) no-repeat left 5px; float: right; text-align: left !important; padding-left: 68px; }
.history ul li:last-child { margin-bottom: 20px; }
.history ul li { margin: 0; margin-top: 0px; width: 50%; clear: both; vertical-align: middle; font-size: 1.1em; word-break: keep-all }
.history ul li strong { padding: 0 1rem 0 0; font-family: 'Montserrat', sans-serif; display: inline-block }
.history ul li span { color: #3a4395; font-size: 2em; display: block; font-family: 'Montserrat', sans-serif; font-weight: bold }
.history ul li img { }
.history_img { width: 90%; margin: 0 auto; }
.history_img img { width: 100%; }
.history_tab { width: 90%; margin: 20px auto; }
.history_tab ul { width: 100%; }
.history_tab ul li { width: 33%; }
.historyList { width: 90%; margin: 40px auto;     /*background: url(../images/sub01/dot_h.png) repeat-y 18% top; */ }
.historyList .year { border-top: 1px solid #ececec; position: relative; padding: 40px 0 40px 12%; }
.historyList .year:first-child { border-top: 2px solid #1b8d27; }
.historyList .year > dt { top: 20px; position: absolute; left: 0; font-size: 40px; font-weight: 500; color: #1b8d27; }
.historyList .month { position: relative; padding-left: 38px; }
.historyList .month:first-child { margin-top: 0; }
.historyList .month > dt { text-align: right; padding-right: 10px; width: 5%; line-height: 24px; font-size: 16px; position: absolute; left: 0; top: 0; font-weight: 600; }
.historyList .month > dd { line-height: 24px; font-size: 16px; }
.historyList .month > dd > p { background: url(../images/sub01/green_sq.png) no-repeat left 9px; padding-left: 20px; text-align: left; margin-left: 5%; }
.mt { margin: -5em 0 0 0 !important }
/* ¿À½Ã´Â±æ */
.map { overflow: hidden; margin: 0 0 2rem 0 }
.map p { float: left; overflow: hidden; width: 40%; margin: 0 2rem 0 0 }
.map p img { width: 100%; transition: all 0.5s }
.map p img:hover { transform: scale(1.2) }
.map .map_con { float: right; text-align: left; width: 55% }
.map .map_con dl { padding: 0 0 1rem 0; border-bottom: 1px solid #ccc; margin: 0 0 1rem 0 }
.map .map_con dl dt { font-weight: bold; font-size: 2rem }
.map .map_con dl dd { font-size: 1.2rem; color: #999 }
.map .map_con ul li { padding: 0.5rem 0 }
.map .map_con ul li span { display: inline-block; font-weight: bold; color: #039; font-size: 1.2rem; margin: 0 2rem 0 0 }
.map .map_con ul li span em { width: 30px; height: 30px; background: #039; border-radius: 100px; text-align: center; display: inline-block; padding: 5px; box-sizing: border-box; float: left; margin: 0 1rem 0 0 }
/* ¼³ºñ¼Ò°³ */

.fac_list { overflow: hidden }
.fac_list p { float: left; width: 40%; overflow: hidden }
.fac_list p img { width: 100%; transition: all 0.5s }
.fac_list p img:hover { transform: scale(1.2) }
.fac_list dl { float: left; background: #003366; color: #fff; padding: 5rem; text-align: left; width: 65%; margin: 7rem 0 0 -5%; position: relative; box-sizing: border-box; }
.fac_list dl::before { content: ''; position: absolute; top: -2rem; right: 0; width: 100px; height: 100px; background: #d4dce7 }
.fac_list dl dt { font-size: 2rem; margin: 0 0 1rem 0; border-bottom: 1px solid #ccc; display: inline-block; }
.fac_list dl dd span { display: block; font-weight: bold; color: #9CF }
.cer_list { overflow: hidden; padding: 0 0 3rem 0; border-bottom: 1px dashed #ccc; margin: 0 0 3rem 0 }
.cer_list p { float: left; width: 30%; position: relative; text-align: left; }
.cer_list p img { width: 100%; transition: all 0.5s }
.cer_list p img:hover { transform: scale(1.1) }
.cer_list p::before { content: ''; position: absolute; bottom: -30px; right: -30px; width: 50%; height: 50%; background: #036; z-index: -1 }
.cer_list .cer_list_con { float: right; width: 65% }
.cer_list .cer_list_con h2 { font-weight: bold; text-align: left; font-size: 1.5rem }
.cer_list .cer_list_con p { float: none !important; width: auto !important }
.cer_list .cer_list_con p::before { display: none !important }
/* ÀÎÀç»ó */
.recruitment_icon { display: flex; justify-content: space-between; padding: 0 0 5rem 0 }
.recruitment_icon li { flex: 1 }
.recruitment_icon li p { width: 100px; height: 100px; text-align: center; background: #1f4192; border-radius: 100px; margin: 0 auto 2rem auto }
.recruitment_icon li dl dt { font-weight: bold; font-size: 1.3rem }
.btn_down { margin: 0 0 2rem 0; display: inline-block; }
.btn_down a { text-align: center; display: block; background: #09C; color: #fff; font-weight: bold; padding: 1em 3rem; transition: all 0.5s }
.btn_down a:hover { background: #036 }
/* Æ÷Æ®Æú¸®¿À */
#portfolio { width: 100%; overflow: hidden; padding: 0; text-align: left; margin-top: 50px; }
ul.thumbs { padding: 0; overflow: hidden; }
ul.thumbs li { display: inline-block; /*height: 180px;*/ overflow: hidden; padding: 0; /*float: left;*/ position: relative; text-align: center; margin: 0 19px 20px 0; padding: 0; border: 1px solid #ccc }
ul.thumbs li:last-child { margin-right: 0; }
ul.thumbs li img { margin: 0 0 20px 0; text-align: center; width: 100%; }
ul.thumbs li p { text-align: center; padding-bottom: 5px; width: 100%; font-weight: bold; font-size: 1.3em }
ul.thumbs li a.thumbnail { display: block;	/*overflow: hidden;*/ box-sizing: border-box; transition: opacity 0.3s; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; z-index: 9; width: 100%; height: 100%; }
ul.thumbs li a.thumbnail .description { padding: 0; position: absolute; height: 0; left: 0; top: 0; width: 100%; box-sizing: inherit; opacity: 0; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; color: #fff; background-color: rgba(0, 0, 0, 0.5); font-size: 1.1em; padding: 100px 12px; line-height: 16px; box-sizing: inherit; text-align: center; font-weight: bold; }
ul.thumbs li a.thumbnail .active-arrow { width: 0; height: 0; border-left: 25px solid transparent; border-right: 25px solid transparent; border-bottom: 25px solid #8298ad; bottom: -10px; z-index: 99; position: absolute; left: 0; right: 0; margin: 0 auto; }
ul.thumbs li a.thumbnail:hover .description { height: 85%; opacity: 1; }
ul.thumbs li.content { display: none; overflow: hidden; position: relative; padding: 0; background: #8298ad; margin: 0 auto; margin-top: -33px; }
ul.thumbs li.content h3 { display: inline-block; }
ul.thumbs li.content .close { position: absolute; top: 10px; right: 10px; color: #c2c2c2; cursor: pointer; font-weight: normal; font-family: -webkit-pictograph; font-size: 50px; line-height: 35px; z-index: 999 !important; }
ul.thumbs li.content .close:hover { opacity: 0.7; }
ul.thumbs li.content .media { display: inline-block; float: none; width: 95%; padding: 20px; text-align: left; min-height: 200px; color: #fff; }
ul.thumbs li.content .media .detail { float: left; width: 50%; margin-left: 4%; }
ul.thumbs li.content .media .detail h4 { text-align: left; font-size: 30px; margin: 0 !important; background-position: top left }
ul.thumbs li.content .media p { color: #fff; text-align: left !important; background: none !important; position: relative !important; padding: 0 !important; font-size: 1em !important }
ul.thumbs li.content .media img { float: left; margin: 0 0px 0 0px; width: 40% }
.detail ul li { background: url(../images/sub04/arrow.png) no-repeat 100% 30%; padding: 0 10px 0 0; }
.detail ul li:last-child { background: none !important; }
.detail ul li span { display: block; padding: 10px; vertical-align: auto; background: #039; color: #fff; }
.portfolio-content { display: none; }
/* ÀÎÁõ¼­ */
.cer { overflow: hidden; }
.pic { display: inline-block; width: 18%; margin: 0 1% 2em 0; text-align: center; vertical-align: top }
.pic a { display: block; font-weight: bold; }
.pic img { width: 100%; margin: 0 0 1em 0; border: 1px solid #ccc }
.pic p { font-weight: bold; padding: 30px 0; font-size: 18px }
.pic span { display: block; font-size: 14px; color: #666; font-weight: normal }
.fac { margin: 0 -1rem 0 0 }
.fac .pic { width: calc(33% - 1rem); margin: 0 1rem 0 0 }
.elec .pic { width: 48% }
.nomar { margin: 0 0 15px 0 !important; }
#jquery-overlay { position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; }
#jquery-lightbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; }
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#lightbox-container-image { padding: 10px; }
#lightbox-loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none; }
#lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block; }
#lightbox-nav-btnPrev { left: 0; float: left; }
#lightbox-nav-btnNext { right: 0; float: right; }
#lightbox-container-image-data-box { font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0; }
#lightbox-container-image-data { padding: 0 10px; color: #666; }
#lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left; }
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber { display: block; clear: left; padding-bottom: 1.0em; }
#lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: 0.7em; }
.colm03 { float: left; width: 33% }
.colm03 .comm_list li { float: none !important }
.business_warp { overflow: hidden; padding: 5em 0; border-bottom: 1px solid #ccc }
.business_left { float: left; width: 30%; text-align: left }
.business_left > h4 { text-align: left; background-position: top left; font-size: 24px }
.business_left .comm_list li { float: none; width: auto }
.business_right { float: left; width: 70% }
.colm04 .pic { width: 23% }
/* °ü°è»ç */
.partner { overflow: hidden; padding: 2em 0; position: relative; margin: 0 0 5em 0 }
.partner::before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 50%; background: #fafafa; z-index: -1 }
.partner p { float: left; width: 30%; position: relative }
.partner p::before { content: ''; position: absolute; top: 2em; right: -2em; width: 100%; height: 50%; background: #9C0; z-index: -1 }
.partner p img { width: 100% }
.partner span { float: right }
.partner span a { display: block; background: #060; color: #fff; text-align: center; padding: 1em 3em; transition: all 0.5s }
.partner span a:hover { background: #9C0 }
.partner_info { float: right; width: 65%; text-align: left; font-size: 1.2em }
.partner_info dl dt { padding: 1em 0; font-weight: bold; position: relative }
.partner_info dl dt::before { content: ''; position: absolute; bottom: 10px; left: 0; width: 80px; height: 5px; background: #090 }
.partner_right p { float: right }
.partner_right p::before { left: -2em; }
.partner_right .partner_info { float: left }
/* °øÁ¤ */
.process { overflow: hidden }
.process li { display: inline-block; width: 20%; padding: 0 0 2em 0; margin: 2%; background: url(../images/sub02/process_arrow.png) no-repeat 98% 50% }
.process li img { width: 100% }
.process li p { background: #363; color: #fff; font-weight: bold; padding: 1em; position: relative }
.process li p::before { content: ''; position: absolute; width: 100px; height: 100px; background: #9C0; top: -0.5em; left: -0.5em; z-index: -1 }
.process li p span { display: block; font-family: 'Montserrat', sans-serif; }
.process2 li { width: 28% }
/* ¼³ºñ */
.fac_list { overflow: hidden; padding: 2em 0; text-align: left; margin: 0 0 5rem 0 }
.fac_img { float: left; width: 50% }
.fac_info { float: left; width: 50% }
.fac_info p { text-align: left; font-weight: bold; font-size: 1.5em; font-family: 'Montserrat', sans-serif; }
/* Á¦Ç° ¼Ò°³ */
.pro_info { overflow: hidden; padding: 2em 0; border: 1px solid #CCC; position: relative; margin: 0 0 2em 0 }
.pro_info p { float: left; width: 20%; margin: 0 5% 0 0; font-weight: bold; font-size: 1.2em; padding: 1em; background: #060; color: #fff }
.pro_info ul { float: left; width: 75% }
.pro_info ul li { float: left; margin: 0 2em 0 0 }
.technology { display: inline-block; width: 30%; margin: 1%; vertical-align: top }
.technology h2 { background: #060; font-weight: bold; color: #fff; text-align: center; padding: 0.5em; font-size: 1.5em }
.technology p { overflow: hidden }
.technology img { width: 100%; transition: all 0.5s }
.technology img:hover { transform: scale(1.2) }
/* Ä«´Ù·Î±× */
.catalog { overflow: hidden; background: url(../images/sub04/catalog_bg.png) no-repeat top right }
.catalog p { float: left; width: 50% }
.catalog dl { float: left; width: 50%; text-align: left }
.catalog dl dt { font-size: 1.2rem; margin: 0 0 2rem 0 }
.catalog dl dd { display: inline-block }
.catalog dl dd a { display: block; background: #3a4395; color: #fff; font-weight: bold; text-align: center; padding: 1rem 2rem }
/* Á¦ÀÏ À§·Î */
#back-top { position: fixed; bottom: 30px; right: 10px; z-index: 999 }
#back-top a { width: 50px; display: block; text-align: center; text-transform: uppercase; text-decoration: none; color: #bbb; /* background color transition */ -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; }
#back-top a:hover { color: #000; }
#back-top span { width: 40px; height: 40px; display: block; margin-bottom: 7px; background: #3e733eurl(../images/common/up-arrow.png)no-repeat center center;
background-size: 50%; /* rounded corners */ /* -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;  background color transition */ -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; border-radius: 100px }
#back-top a:hover span { background-color: #777; }



/*pc*/
@media all and (min-width:1024px) {
.mo { display: none }
.mo_img { display: none }
.container { position: relative; max-width: 100%; width: 100%; margin: 0 auto }
/*header*/
#header { position: fixed; left: 0; top: 0; width: 100%; z-index: 100; }
.hsec1 { height: 70px; border-bottom: 1px solid rgba(255,255,255,0.5); transition: 0.3s }
.hsec1 h1 { float: left; padding: 1em 0 }
.hsec1 h1 a { display: block }
.hsec1 h1 .over { display: none }
.lnb { float: left; width: calc(100% - 516px); padding: 0 100px }
.lnb .close { display: none }
.lnb h2 { display: none }
.mo_lang { display: none }
.lnb ul { position: relative; z-index: 9; display: flex }
.lnb ul li { position: relative; float: left; text-align: center; flex: 1 }
.lnb ul li > a { display: block; line-height: 70px; font-size: 20px; font-weight: bold; color: #fff; }
.lnb ul li > a:hover { color: #3a4395 }
.lnb ul li:hover > a { color: #3a4395 }
.lnb ul li:hover .sub { /*background: #eee*/ }
.lnb .sub { display: none; position: absolute; top: 70px; padding: 20px 0; width: 100%; height: 300px/*sub³ôÀÌ*/ }
.lnb .sub dl { }
.lnb .sub dd > a { display: block; line-height: 1.4; padding: 4px 10px; font-size: 16px; color: #333; font-weight: 400; transition: all 0.5s }
.lnb .sub dd > a:hover { color: #fff; }
.lnb_bg { display: none; position: absolute; left: 0; width: 100%; top: 0px; background: #fff; border-bottom: 1px solid #ddd; height: 250px/*sub³ôÀÌ*/; position:relative }
.lnb_bg::before{content:''; position:absolute; top:0; left:50%; transform:translateX(-50%); max-width:1400px; width:100%; height:248px; background:url(../images/common/submenu_bg.jpg) top left no-repeat}
/*½ºÅ©·Ñ½ÃÀÛ*/
.scroll_on .hsec1 { border-bottom: 1px solid #ddd }
.scroll_on .hsec1 h1 .out { display: none }
.scroll_on .hsec1 h1 .over { display: block }
.scroll_on .hsec1 { background: #fff }
.scroll_on .lnb li > a { color: #222 }
/*lnb ¿À¹ö*/
.lnb_on .hsec1 { border-bottom: 1px solid #ddd }
.lnb_on .hsec1 h1 .out { display: none }
.lnb_on .hsec1 h1 .over { display: block }
.lnb_on .hsec1 { background: #fff }
.lnb_on .lnb li > a { color: #222 }
}



/*mobile*/
@media all and (max-width:1023px) {
body, div, td, p, input, button, textarea, select, a { font-size: 16px }
.pc { display: none }
/*header*/
#header { width: 100%; clear: both }
.hsec1 {  background: #fff }
.hsec1 h1 { text-align: left; overflow: hidden; }
.hsec1 h1 img { display: inline-block; margin: 0 auto }
.hsec1 h1 .over { display: none }
.lnb { position: fixed; width: 90%; right: -90%; top: 0; z-index: 90; height: 100%; background: #fff; border-right: 1px solid #aaa; transition: .3s; overflow: auto }
.lnb.on { right: 0; transition: .3s }
.lnb h2 { float: left; padding: 1rem }
.mo_lang { clear: both }
.mo_lang a { display: block; color: #fff; padding: 1rem 0; background: #0073b9 url(../images/common/lang.png) no-repeat 20px 23px; text-align: left; text-indent: 50px; font-weight: bold }
.lnb .close { color: #fff; width: 70px; height: 70px; background:#3a4395 url('../images/common/lnb_close.png') no-repeat center; position: absolute; top: 0; right: 0 }
.lnb ul { clear: both }
.lnb li { position: relative; border-bottom: 1px solid #ddd; height: auto }
.lnb li.be { background: url('../images/lnb_arrow.png') no-repeat 95% 20px }
.lnb li.be.on { background: url('../images/lnb_arrow_on.png') no-repeat 95% 20px }
.lnb li > a { display: block; height: 60px; line-height: 60px; font-size: 18px; font-weight: bold; text-align: left; text-indent: 30px; }
.lnb li.on > a { color: #fff; background: #3a4395; pointer-events: none; cursor: default; }
.lnb .sub { display: none; background: #333; padding:0; height: auto }
.lnb dl { }
.lnb dd > a { display: block; line-height: 40px; font-size: 16x; text-align: left; text-indent: 40px; color: #fff }
.lnb dd > a:hover { color: #fff; text-decoration:none }
.body_bg.on { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: 0.6; z-index: 80 }
.hsec1 .lnb_open { position: absolute; right: 0; top: 0 }
.hsec1 .lnb_open img { vertical-align: top }
/*swiper*/
.swiper-container-horizontal>.swiper-pagination-bullets { bottom: 15px }
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 5px }
.swiper-pagination-bullet { width: 10px; height: 10px; background: #fff }
.swiper-button-next { width: 60px; height: 60px; background: url('../images/swiper_next.png') no-repeat center }
.swiper-button-prev { width: 60px; height: 60px; background: url('../images/swiper_prev.png') no-repeat center }
.pc_img { display: none !important }
/* ¸ÞÀÎ */
.inner { padding: 1em; overflow: hidden; max-width: 100% }
.s_inner { max-width: 100%; /*overflow-x:hidden*/ }
.sitemap { display: none }
.arrow { display: none }
.lang { display: none }
.msec1 .swiper-slide .bg { background: none !important; height:auto }
.msec1 .swiper-pagination { left: 50%; transform: translateX(-50%); }
.swiper-progress-bar { left: 50%; transform: translateX(-50%); }
.main_notice { position: relative; left: auto; transition: none; width: auto; bottom: auto; transform: none }
.main_notice dl dd a { display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; padding: 2rem 0; }
.main_product { padding: 100px 0; position: relative }
.main_product .inner { padding: 1rem; background: none }
.main_product::before { content: ''; background: url(../images/main/product_bottom.png) no-repeat; width: 728px; height: 117px; position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%) }
.main_product h2 { font-size: 2.4rem; text-align: center }
.pagers{text-align:center}
.pagers li { padding: 0.5rem 1rem; font-size: 1.3rem }
.slideshow-item .slideshow-item-html { float: none; width: auto }
.slideshow-item img { float: none; margin: 0 }
.slideshow-item .slideshow-item-html dl dd span { width: auto }
.slideshow-item .slideshow-item-html dl dd br { display: none }
#ptsection-three { background-size: cover }
#ptsection-three h2 p { font-size: 1rem }
.main_icon { width: auto; flex-wrap: wrap; }
.main_icon li { flex: none; width: 50% }
.main_icon li p { font-size: 1rem; }
#ptsection-four { height: auto }
.main_half { float: none; width: auto }
.main_half .main_in { padding: 1rem; overflow: hidden }
.main_catalog dl { float: none; width: auto; overflow: hidden; text-align:center }
.main_catalog dl dt{margin:0}
.main_catalog dl dd a { margin: 1rem auto }
.main_catalog p { float: none; width: auto; display: block; text-align:center; box-shadow:none }
footer { padding: 1rem 0 }
footer address { display: block }
footer address dl { border: none; padding: 0; margin: 0 0 1rem 0 }
footer p { text-align: left }
footer address, footer p { text-align: center }
footer address dl::before { display: none }
/* ¼­ºê °øÅë */
.sub_head { height: 200px }
.sub_head h2 { padding: 3rem 0 0 0 }
.sub_head h2 span { font-size: 1.5rem }
.zoom { animation: none }
#DB_navi39 ul { display: flex }
.sub_navi { height: auto }
.sub_tit h3 { font-size: 2rem }
h4 { font-size: 1.4rem }
.s_tit { font-size: 1.4rem; margin:0 }
.tabmenu li a { height: 40px; line-height: 40px }
.table_warp { overflow: scroll }
.tabmenu{margin:0}
.tabmenu ul{margin:0}
.comm_table{margin:0 0 30px 0}
/* Àλ縻 */
.ceo_con dl { float: none; width: auto }
.ceo_con dl dt { font-size: 1.5rem }
.ceo_con dl dd { font-size: 1.2rem }
.ceo_con dl dd br { display: none }
.ceo_con p { float: none; padding: 1rem }
.ceo_text { width: auto }
.ceo_text p { font-size: 1rem }
.ceo_text p br { display: none }
.flex_out { flex-direction: column; }
.flex_out .flex_management p span { font-size: 1rem }
.flex_out .flex_management p span br { display: none }
.big { font-size: 1rem }
.big br { display: none }
/* ȸ»ç¿¬Çõ */
.history h4 { font-size: 3rem }
.history h4 p { margin: 0; font-size: 1.2rem }
.history h4 p br { display: none }
.history ul { background-position: top left }
.history ul li { width: auto; font-size: 1rem }
.history ul li.right { float: none }
.history ul li.left { text-align: left !important; background: url(../images/sub01/history_right.png) no-repeat left 5px; padding: 0 0 0 68px }
.history ul li strong { padding: 0; display: block }
/* »ç¾÷Àå¾È³» */
.map p { float: none; width: auto; margin: 0 0 2rem 0 }
.map .map_con { float: none; width: auto; margin: 0 0 2rem 0 }
.map .map_con dl dt { font-size: 1.5rem }
.map .map_con dl dd { font-size: 1rem }
.root_daum_roughmap { width: 100% !important; height: 300px !important }
/* ¼³ºñ¼Ò°³ */
.fac_list{padding:0}
.fac_list p { float: none; width: auto }
.fac_list dl { float: none; width: auto; padding: 1rem; margin: 0 }
.fac_list dl::before { display: none }
.fac_list dl dt { font-size: 1.5rem }

.cer_list p { float: none; width: auto; margin: 0 0 2rem 0 }
.cer_list .cer_list_con { float: none; width: auto; overflow: scroll }
.comm_table th, .comm_table td { padding: 0.5rem; font-size: 14px; white-space: nowrap }
.fac .pic { width: auto; margin: 1rem 0 }
.pic a { pointer-events: none; cursor: default; }
.fac{margin:0}

/* Ä«´Ù·Î±× */
.catalog p { float: none; width: auto; margin: 0 0 2rem 0 }
.catalog dl { float: none; width: auto; text-align: center }
.catalog dl dt { font-size: 1rem }
/* ÀÎÀç»ó */
.recruitment { background-size: cover }
.recruitment p { font-size: 1.3rem }
.recruitment dl { display: block; width: auto }
.recruitment_icon { flex-direction: column; }

.recruitment_icon li{margin:0 0 3rem 0}
}
 @media (min-width:1024px) and (max-width:1200px) {
.lnb { padding: 0 }
.slideshow-item img { margin: -20rem 0 3rem 0 }
.main_icon { width: auto }
.main_catalog dl{width:50%}
.main_catalog dl dt{margin:0 0 1rem 0}
footer address dl::before { right: 5% }
.ceo_con p{width:50%}
.ceo_con dl dt{font-size:1.7rem}
.ceo_con dl dd{font-size:1.2rem}
.bg_con::before{background-size:550px}
.ceo_text br{display:none}
.flex_out .flex_management p span{display:block; width:100%}

.fac_list dl{padding:2rem;}
.catalog p{width: calc(50% - 2rem);margin: 0 2rem 0 0;}

}
 @media (min-width:750px) and (max-width:768px) {
.pagers { text-align: center }
.main_product::before { content: ''; background: url(../images/main/product_bottom.png) no-repeat; width: 728px; height: 117px; position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%) }
.main_half .main_in { max-width: 100% }
.main_half .main_in img { width: 100% }
.main_catalog { height: auto; overflow: hidden; padding: 0 5rem }
.main_catalog dl { float: left; width: 50%; text-align:left; }
.main_catalog dl dd a{margin:1rem 0}
.main_catalog p { float: right }

}