@import url( "http://fonts.googleapis.com/earlyaccess/notosanskr.css" );
* { margin: 0; padding: 0 }
body, td, p, input, button, textarea, select, a { font-family: 'Noto Sans Korean', 'Malgun Gothic', '맑은 고딕', dotum, '돋움', gulim, '굴림', tahoma, sans-serif; font-weight: 300; font-size: 15px; color: #333; line-height: 1.6; letter-spacing: -1px; padding: 0; margin: 0 }
body { overflow-y: scroll }
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: 1200px; 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: 1200px; margin: 0 auto; position: relative; text-align: center }
.ovf { overflow: hidden; }
.center { text-align: center; }
section { text-align: center; }
.comm_table { width: 100%; background: url(../images/common/table_top.jpg) no-repeat top left; padding: 5px 0 0 0 }
.comm_table caption{display:none}
.comm_table th { padding: 10px 20px; border-bottom: 1px solid #ccc; text-align: center; font-weight: bold; background: #ececec }
.comm_table td { padding: 10px 20px; border-bottom: 1px solid #ccc; text-align: center; }
.t_left { text-align: left; }
.s_tit { text-align: center; margin: 0 auto; padding: 0 0 30px 0 }
.s_tit p { font-weight: 300; font-size: 18px; }
.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: 100; font-size: 30px; margin: 0 0 30px 0; background: url(../images/common/h4_bg.jpg) no-repeat top center; padding: 15px 0 0 0 }
h4 span { display: block; color: #1b8d27; }
.mt30 { margin: 30px 0 0 0; }
.mb30 { margin: 0 0 30px 0; }
.mb50 { margin: 20px 0 50px 0; }
.pd30 { padding: 30px; }
.comm_list li { padding: 3px 0 3px 10px; background: url(../images/common/li_bg.jpg) no-repeat 0 10px; 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: 1px dotted #1b8d27; padding: 20px; }
.strong { color: #1b8d27; }
.bold { font-weight: bold; }
.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; }
.btn_down a { display: inline-block; background: #b39a36; color: #fff; font-weight: bold; padding: 20px 30px; }
h6 { text-align: left; font-weight: bold; font-size: 20px; margin: 0 0 30px 0 }
#header { position: relative; z-index: 990; background: #fff; border-top: 12px solid #023995; }
footer { width: 100%; overflow: hidden; padding: 3em 0; margin: 0 auto; font-size: 0.8em; border-top: 1px solid #ccc }
footer p { float: right; }
footer ul { text-align: left; margin: 0 0 20px 0 }
footer ul li { display: inline-block; margin: 0 20px 0 0 }
footer ul li a { display: block; }
footer img { float: left; margin: 0 2em 0 0 }
footer address { float: left; font-style: normal; text-align: left }
footer address span { font-weight: bold; color: #1957a9; }
/* 탭 */
.tab { text-align: center; }
.tab li { display: inline-block; }
.tab li a { display: block; background: #eaeaea; height: 40px; line-height: 40px; }
/*.tab li a:hover { background: #333 !important; color: #fff; }*/
.select a { background: #1b8d27 !important; font-weight: bold; color: #fff; }
.li4 li { width: 23%; }
.li5 li { width: 18%; display: inline-block; }
.li6 li { width: 16%; display: inline-block; }
.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: #b79a35; -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%; }
}

/* 상단메뉴 */
/*pc*/
@media all and (min-width:1024px) {
#hsec1 { padding: 0px 0px; border-bottom: 1px solid #ddd; display: none }
#hsec1 .d_container { position: relative }
#hsec1 .con1 { display: none }
#hsec1 .con2 { text-align: left }
#hsec1 .con2 .mo { display: none }
#hsec1 .con3 { position: absolute; right: 0; top: 0 }
#hsec2 { position: relative; border-bottom: 1px solid #ddd; height: 80px }
#hsec2 h1 { float: left; margin: 12px 0 0 0 }
#hsec2 p { float: right; margin: 12px 0 0 0 }
#d_lnb_bg { position: absolute; left: 0; top: 80px; width: 100%; background: #fff url(../images/common/menu_bg.jpg) no-repeat top center; height: 0; }
#d_lnb { height: 50px }
#d_lnb h2 { display: none }
#d_lnb li { position: relative; float: left; width: 15%; text-align: center; }
#d_lnb li > a { display: block; font-size: 17px; font-weight: 600; color: #333; line-height: 66px }
#d_lnb li > a:hover, #d_lnb li.on > a { color: #b79a35 }
.hvr-underline-from-center { display: block; vertical-align: bottom; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px transparent; position: relative; overflow: hidden; }
.hvr-underline-from-center:before { content: ""; position: absolute; z-index: -1; left: 50%; right: 50%; bottom: 0; background: #b79a35; height: 4px; -webkit-transition-property: left, right; transition-property: left, right; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; }
.hvr-underline-from-center:hover:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:active:before { left: 0; right: 0; }
#d_lnb li.on .sub { /*background: #fff; border-top: 3px solid #2aa737*/ }
#d_lnb li .sub { position: absolute; width: 100%; top: 66px; height: 0; overflow: hidden }
#d_lnb li .sub dl { padding: 10px 0px 10px 20px; text-align: center }
#d_lnb li .sub dd { padding: 2px 0 }
#d_lnb li .sub dd a { color: #333; font-size: 13px !important; display: block }
#d_lnb li .sub dd a:hover {/* text-decoration: underline; */ color: #fff }
#d_lnb_mask { display: none }
}
/* 메인 슬라이드 */
.text01 { font-weight: bold; letter-spacing: -1px; font-size: 30px; color: #fff }
.text01 span { display: block; text-transform: uppercase; font-weight: bold; color: #023995; font-size: 72px; letter-spacing: -3px; font-family: 'Titillium Web', sans-serif; }
.text02 { font-weight: 300; color: #333; font-size: 36px; letter-spacing: -1px; margin-top: -30px; color: #23256d; }
.text02 span { font-weight: bold; }
.responsive-slider { width: 100%; position: relative; margin: 0 auto }
.responsive-slider [data-animate] { opacity: 1; }
.responsive-slider .slides { position: relative; overflow: hidden; width: 100% }
.responsive-slider .slides ul { list-style-type: none; padding: 0; margin: 0; white-space: nowrap; font-size: 0; }
.responsive-slider .slides ul li { display: inline-block; max-width: 100%; }
.responsive-slider .slides ul li .slide-body { display: inline-block; position: relative; max-width: 100%; font-size: 14px; }
.responsive-slider .slides ul li .slide-body img { max-width: 100%; }
.responsive-slider .slides ul li .slide-body .caption { position: absolute; color: #1b8d27; /*text-shadow: 2px 2px 5px #000000; */ }
.responsive-slider .slides ul li .slide-body .caption.header { top: 11%; left: 50%; position: absolute; transform: translateX(-50%) }
.responsive-slider .slides ul li .slide-body .caption.header h2 { font-size: 60px; text-align: center; font-weight: bold }
.responsive-slider .slides ul li .slide-body .caption.header h2 i { font-size: 35px; }
.responsive-slider .slides ul li .slide-body .caption.sub { font-weight: bold; left: 0; right: 0; text-align: center; font-size: 1.5em }
.responsive-slider .slides ul li .slide-body .caption.img01 { top: 60%; left: 20%; }
.responsive-slider .slides ul li .slide-body .caption.img02 { top: 60%; left: 0; right: 0; text-align: center }
.responsive-slider .slides ul li .slide-body .caption.img03 { top: 60%; right: 20%; }
.responsive-slider .slides ul li .slide-body .caption.img-html5 img { max-width: 100%; }
.responsive-slider .slides ul li .slide-body .caption.img-css3 { top: 57%; right: 12%; width: 10%; }
.responsive-slider .slides ul li .slide-body .caption.img-css3 img { max-width: 100%; }
.responsive-slider .slides ul li .slide-body .caption.img-bootstrap { top: 48%; right: 12%; width: 11%; }
.responsive-slider .slides ul li .slide-body .caption.img-bootstrap img { max-width: 100%; }
.responsive-slider .slides ul li .slide-body .caption.img-twitter { top: 19%; right: 12%; width: 11%; }
.responsive-slider .slides ul li .slide-body .caption.img-twitter img { max-width: 100%; }
.responsive-slider .slides ul li .slide-body .caption.img-jquery { top: 66%; right: 12%; width: 33%; }
.responsive-slider .slides ul li .slide-body .caption.img-jquery img { max-width: 100%; }
.responsive-slider .slider-control { position: absolute; font-size: 50px; color: #fff; top: 40%; padding: 100px; }
.responsive-slider .slider-control.left { left: 10%; padding-left: 0; background: url(../images/main/arrow_left.png) no-repeat; }
.responsive-slider .slider-control.left:hover { text-decoration: none; background: url(../images/main/arrow_left_on.png) no-repeat; }
.responsive-slider .slider-control.right { right: 10%; padding-right: 0; background: url(../images/main/arrow_right.png) no-repeat; }
.responsive-slider .slider-control.right:hover { text-decoration: none; background: url(../images/main/arrow_right_on.png) no-repeat; }
.responsive-slider .pages { position: absolute; bottom: 0; left: 0; width: 100%; text-align: center; }
.responsive-slider .pages .page { display: inline-block; margin: 0.5em; color: transparent; width: 5px; height: 5px; border: 3px solid #fff; border-radius: 50%; opacity: 0.5; }
.responsive-slider .pages .page.active { opacity: 1; }
 @media all and (max-width:1024px) {
.responsive-slider .slides ul li .slide-body .caption.header h2 { font-size: 2em; }
.responsive-slider .slides ul li .slide-body .caption.img01, .responsive-slider .slides ul li .slide-body .caption.img02, .responsive-slider .slides ul li .slide-body .caption.img03 { width: 30%; }
.responsive-slider .slides ul li .slide-body .caption.img01 { left: 0; }
.responsive-slider .slides ul li .slide-body .caption.img02 { left: 35%; }
.responsive-slider .slides ul li .slide-body .caption.img03 { right: 0; }
.mob_height { height: 450px; }
}
/* 메인  */
.container { overflow: hidden; }
.bar { position: absolute; top: 600px; right: 15% }
.sub_bar { position: absolute; top: 200px; right: 15%; z-index: 999 }
/* 메인 비즈니스 */
.main_business { background: url(../images/main/business_bg.jpg) no-repeat top center; padding: 50px 0; overflow: hidden }
.main_business h2 { font-family: 'Titillium Web', sans-serif; font-weight: bold; text-transform: uppercase; font-size: 24px; color: #9c9c9c; letter-spacing: 5px; text-align: left; padding: 30px 0 }
.main_business_con { float: left; display: inline-block; width: 30%; margin: 0 30px 0 0; background: #fff; overflow: hidden; border: 1px solid #ccc }
.main_business_con img { width: 100%; transition: transform .5s }
.main_business_con img:hover { transform: scale(1.2); }
.main_business_con p { width: 50px; height: 50px; background: #023995; margin: -30px auto 0 auto; position: absolute; left: 50%; transform: translateX(-50%); z-index: 999 }
.main_business_con p img { width: 80%; padding: 5px }
.main_business_con dl { overflow: hidden; border-top: 1px solid #ccc; padding: 60px 20px }
.main_business_con dl dt a { font-weight: bold; font-size: 18px; color: #505c74 }
.main_business_con dl dd { font-family: 'Titillium Web', sans-serif; text-transform: uppercase; }
.nomar { margin: 0 !important; }
/* 메인공지사항*/
.main_board { overflow: hidden; background: #023995 }
.main_news { float: left; width: 60%; padding: 20px }
.main_news dt { font-family: 'Titillium Web', sans-serif; font-weight: bold; color: #fff; text-transform: uppercase; font-size: 18px; float: left }
.main_news dd a { color: #fff; }
.main_news dd span { float: right; color: #fff }
.main_catalog { float: right; width: 30% }
.main_catalog a { display: block; background: #a6996c url(../images/main/catalog.png) no-repeat 50px; color: #fff; padding: 23px }
/* 메인아이콘 */
.main_icon { background: url(../images/main/icon_bg.jpg) top center; overflow: hidden; padding: 30px 0 }
.main_icon ul li { display: inline-block; width: 24%; }
.main_icon ul li p { padding: 20px; text-align: center }
.main_icon ul li p a { font-weight: bold; color: #fff; text-align: center; }
.main_icon ul li p img { display: block; margin: 0 auto 30px auto }
/* 서브 */
.sub_head { width: 100%; overflow: hidden; height: 195px; padding: 0; margin: 0 auto; }
.sub_head h2 { text-align: center; color: #fff; font-weight: 100; font-size: 2.5em; padding: 1.5em 0 0 0; text-shadow: 1px 1px 5px #000; font-family: 'Titillium Web', sans-serif; text-transform: uppercase }
.sub_head h2 span { display: block; font-weight: bold; font-size: 18px; letter-spacing: 10px }
.sub_head p { position: absolute; top: 0; left: 50%; margin: 0 -17%; }
.sub_contants { min-height: 500px; overflow: hidden; padding: 2.5em 0 }
.sub_tit { position: relative; overflow: hidden; margin: 0 auto 50px auto; text-align: center; padding: 0 0 1em 0; border-bottom: 1px solid #666 }
.sub_tit h3 { font-size: 2.5em; font-weight: bold; margin: 20px 0; background: url(../images/common/h3_bg.png) no-repeat top center; padding: 20px 0 0 0 }
.sub_tit h3 b { font-size: 25px; }
.sub_tit p { font-weight: 300; font-size: 1em }
/* 서브네비 */
#DB_navi39 a { text-decoration: none; display: block }
#DB_navi39 img { border: 0; vertical-align: top }
#DB_navi39 { position: relative; width: 100%; height: 45px; background: #023995; }
#DB_navi39 ul { width: 1200px; margin: 0 auto }
#DB_navi39 ul li { border-right: 1px solid #0879c3; text-indent: 15px }
#DB_navi39 ul li.m0 { width: 40px; ; border-left: 1px solid #0879c3 }
#DB_navi39 ul li.m1 { width: 200px }
#DB_navi39 ul li.m2 { width: 200px }
#DB_navi39 ul li.DB_main { float: left; position: relative }
#DB_navi39 ul li.DB_main a { color: #fff; line-height: 45px; ; background: url('../images/common/subnavi_arrow.png') no-repeat 95% 17px }/*메뉴간격*/
#DB_navi39 ul li.DB_main a:hover { color: #fff !important; font-weight: bold; background-position: right -27px }
#DB_navi39 ul li.DB_main.DB_select a { background-position: right -27px }
#DB_navi39 ul li.m0 a { background: url('../images/common/icon_home.png') no-repeat 10px 11px; text-indent: -9999px }
#DB_navi39 ul li.m0.DB_select a { background-position: 13px -24px; }
#DB_navi39 .DB_main .DB_sub { position: absolute; left: 0; top: 45px; width: 100%; display: none; background: #ffffff; border: 1px solid #023995; 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 a { display: block; color: #666666; line-height: 40px; background: #ffffff }
#DB_navi39 .DB_main .DB_sub li a:hover { color: #ffffff; background: #023995 }
#DB_navi39 .DB_main .DB_sub li.DB_select a { color: #ffffff; background: #023995 }
.sticky-navigation.stuck { position: fixed; top: 0; box-shadow: 0 2px 4px rgba(0, 0, 0, .2); width: 100%; z-index: 999 }
#DB_navi39 ul li.DB_main a b { display: none; }
/* 제일 위로 */
#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; }
/* arrow icon (span tag) */
#back-top span { width: 40px; height: 40px; display: block; margin-bottom: 7px; background: #023995 url(../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; }
#back-top a:hover span { background-color: #777; }
/* 오시는길 */
.all-devices .toggle-btn-visible { position: static; visibility: visible; background: #060; color: #fff; padding: 10px 20px; margin: 20px 0 }
.all-devices .toggle-target-hidden { display: none; }
.all-devices .toggle-target-expanded { display: block; }
.panel-body { padding: 20px; border: 1px solid #006600; margin: 30px 0 0 0 }
.btn-danger a { display: block; background: #000; color: #fff }
.btn-danger:hover { background: #333; }
.division_map { width: 100%; background: url('../images/sub01/map_img3.jpg'); background-size: cover; color: #fff; padding: 65px 0; margin-bottom: 20px; }
.division_map img { margin-bottom: 10px; }
.division_map p { color: #fff; }
.btn-danger { 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; }
.btn-danger:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #75b0ce; -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; }
.btn-danger:hover, .btn-danger:focus, .btn-danger:active { color: white; }
.btn-danger:hover:before, .btn-danger:focus:before, .btn-danger:active:before { -webkit-transform: scaleX(1); transform: scaleX(1); }
.comm_dl { display: inline-block; float: left; text-align: center }
.comm_dl p { text-align: center; padding: 10px }
.comm_dl img { text-align: center; }
.comm_dl p img { width: 100%; text-align: center }
.comm_dl dl { padding: 10px; overflow: hidden }
.comm_dl dt { font-weight: bold; font-size: 20px; color: #1b8d27; margin: 0 0 20px 0; }
/* 포토*/
/* 사진 모달 */

#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; }
.pic {/*float:left;  display: inline-block; margin: 0 22px 30px 0; width:20%; text-align: center; vertical-align:top */ }
.pic img { width: 100%; display: block; }
.pic a { width: 100%; height: 100%; text-indent: -99999px; display: block; background: #036 url(../images/common/list_bg.png) no-repeat bottom right; color: #fff; font-weight: bold; border: 1px solid #ccc; line-height: 3 }
/*백그라운드*/
#dd_lightBox_overlay { position: fixed; left: 0; top: 0; background: #000000; opacity: 0.8; width: 100%; height: 100%; display: none; z-index: 9998 }
#dd_lightBox { position: fixed; left: 0; top: 0; display: none; background: url('img/lightbox-ico-loading.gif') no-repeat center center #ffffff; /*로딩*/ width: 200px; /*기본사이즈, 이후 이미지원본사이즈로 조정*/ height: 200px; padding: 10px 10px 50px 10px; /*여백패딩*/ margin-left: -5px; /*패딩값의 절반*/ margin-top: -25px; /*패딩값의 절반*/ overflow: hidden; z-index: 9999 }
#dd_lightBox #dd_img_wrap { background: #ff0000; padding: 12px; overflow: hidden }
#dd_lightBox #dd_iframe { width: 640px; height: 360px }/*유투브기본사이즈  개별사이즈는 data-size="가로x세로" */
#dd_lightBox #dd_title { position: absolute; left: 10px; bottom: 25px; font: 11px dotum; color: #777777 }
#dd_lightBox #dd_page { position: absolute; left: 10px; bottom: 10px; font: bold 11px verdana, helvetica; color: #888888 }
#dd_lightBox #dd_next { position: absolute; right: 0px; top: 50%; margin-top: -20px; background: url('../images/common/lightbox-btn-next.gif') no-repeat; width: 70px; height: 70px; cursor: pointer }
#dd_lightBox #dd_prev { position: absolute; left: 0px; top: 50%; margin-top: -20px; background: url('../images/common/lightbox-btn-prev.gif') no-repeat; width: 63px; height: 32px; cursor: pointer; z-index: 10 }
#dd_lightBox #dd_close { position: absolute; right: 10px; bottom: 10px; background: url('../images/common/lightbox-btn-close.gif') no-repeat; width: 66px; height: 22px; cursor: pointer }
/* 제품소개 */
#portfolio { width: 100%; overflow: hidden; padding: 0; text-align: left; margin-top: 50px; }
ul.thumbs { padding: 0; overflow: hidden; text-align: center; }
ul.thumbs li { display: inline-block; /*height: 180px;*/ overflow: hidden; padding: 0; /*float: left;*/ position: relative; text-align: center; margin: 0 15px 0 0; padding: 0 0 30px 0 }
ul.thumbs li:last-child { margin-right: 0; }
ul.thumbs > li { width: 20% !important; }
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-size: 20px; /*position:absolute; left:0; bottom:20px; background:#333; color:#fff; */ }
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; bottom: 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; border: 3px solid #900 }
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 #414141; bottom: 0px; z-index: 99; position: absolute; left: 0; right: 0; margin: 0 auto; }
ul.thumbs li a.thumbnail:hover .description { height: 100%; opacity: 1; }
ul.thumbs li.content { width: 96.5% !important; display: none; background: none;/* height: 300px;*/ overflow: hidden; position: relative; padding: 20px 0; background: #414141 url(../images/introduce/president_bg.png) no-repeat top right; margin: 0 auto; margin-top: -10px; }
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: 100%; text-align: left; min-height: 200px; color: #fff; }
ul.thumbs li.content .media .detail {/* position:absolute; width:210px; top:25px; right:20px */ float: left; width: 66%; margin-left: 4%; }
ul.thumbs li.content .media .detail h4 { text-align: left; font-size: 20px; background: url(../images/sub02/business_tit.png) no-repeat top left; padding: 20px 0; margin: 0 !important }
ul.thumbs li.content .media p { color: #fff; text-align: left !important; margin: 0 0 20px 0; background: none !important; position: relative !important; padding: 0 !important }
ul.thumbs li.content .media img { float: left; margin: 0 0px 0 0px; width: 27% }
.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; }
ul.thumbs li a.thumbnail .description { display: none; }
ul.thumbs li.content .media .detail_new h4 { text-align: left; font-size: 20px; background: url(../images/sub02/business_tit.png) no-repeat top left; padding: 20px 0; margin: 0 !important; }
ul.thumbs li.content .media .detail_new { margin-left: 2%; margin-top: 10px; }
.s_tit { font-weight: 100; font-size: 30px; }
.t_left { text-align: left !important; }
/* 인사말 */
.greeting { background: url(../images/sub01/greeting.jpg) no-repeat top right; height: 300px; padding: 70px; }
.greeting h2 { font-family: 'Titillium Web', sans-serif; text-transform: uppercase; color: #fff; font-size: 60px; font-weight: bold; text-align: left; line-height: 1; text-shadow: 1px 1px 3px #000 }
.greeting h2 span { display: block; font-weight: bold; font-size: 18px; padding: 20px 0 }
/* 회사개요 */
.info { background: url(../images/sub01/info_bg.jpg) no-repeat top center; overflow: hidden; padding: 50px 0 }
.info li { display: inline-block; width: 33%; padding: 40px 0 }
.info li p { color: #fff; }
.info li span { display: block; font-weight: bold; padding: 10px 0; font-size: 18px }
.list4 li { display: inline-block; width: 24%; }
.list4 li p { padding: 10px; }
.list4 li p img { width: 100%; }
.list4 li span { display: block; background: #036 url(../images/common/list_bg.png) no-repeat top right; color: #fff; padding: 10px 0; text-align: center }
/* 연혁 */
.history { background: url(../images/sub01/hisotry_bg.jpg) no-repeat top center; overflow: hidden; padding: 50px 0 }
.history h4 { font-family: 'Titillium Web', sans-serif; text-transform: uppercase; text-align: center; font-size: 50px; color: #fff; margin: 0 0 50px 0; padding-bottom: 0; font-weight: bold }
.history h4 span { font-size: 18px; font-weight: 100; color: #fff; }
.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_icon.png) no-repeat right 25px; float: left; text-align: right; padding-right: 76px; width: 44.4% }
.history ul li:first-child { margin-top: 10px; }
.history ul li.right { background: url(../images/sub01/history_icon.png) no-repeat left 25px; float: right; text-align: left; padding-left: 77px; width: 44.4% }
.history ul li:last-child { margin-bottom: 20px; }
.history ul li { margin: 0; margin-top: 0px; width: 50%; clear: both; font-size: 18px; vertical-align: middle; color: #fff }
.history ul li span { color: #d1bd6f; font-size: 40px; display: block; font-family: 'Titillium Web', sans-serif; font-weight: bold; }
.history ul li img { padding-top: 10px; }
.history_img { width: 90%; margin: 0 auto; }
.history_img img { width: 100%; }
/* 비전 */
.vision { background: #ededed url(../images/sub01/vision_bg.jpg) no-repeat bottom right; overflow: hidden; padding: 100px 0 200px 0 }
.vision dl { display: inline-block; width: 24%; background: #fff; border-top: 5px solid #023995; padding: 20px 0 0 0 }
.vision dl dt { font-weight: bold; color: #023995; font-size: 30px; line-height: 40px; padding: 0 0 30px 0; border-bottom: 1px solid #ccc; margin: 0 0 30px 0 }
.vision dl dt span { font-family: 'Titillium Web', sans-serif; display: block }
.vision dl dd { font-size: 18px; }
.vision dl dd strong { color: #b39a36; font-weight: bold; }
.vision dl dd img { width: 100%; margin: 30px 0 0 0 }
/* 경영이념 */

.philosophy { background: url(../images/sub01/philosophy_bg.jpg) no-repeat top center; overflow: hidden; padding: 100px 50px }
.philosophy h2 { font-size: 24px; font-weight: 100; padding: 50px 0 }
.philosophy h2 span { display: block; font-weight: bold; font-size: 30px }
.philosophy ul li { display: inine-block; width: 33%; float: left; }
.philosophy ul li img { width: 100%; }
.philosophy ul li p { padding: 20px; text-align: center; font-weight: bold; font-size: 20px; margin: 0 0 30px 0 }
.philosophy ul li p span { display: block; font-size: 16px; font-weight: 100 }
/* 오시는길  */
.location { background: #f7f8fa; border-bottom: 1px solid #CCC; padding: 20px 0; overflow: hidden }
.location_info { display: inline-block; width: 33%; float: left }
.location_info dt { font-weight: bold; font-family: 'Titillium Web', sans-serif; text-transform: uppercase; font-size: 20px; padding: 10px 0 }
/* 사업분야 */
.business { position: relative; }
.business p { width: 80%; position: absolute; bottom: 0; padding: 40px; background: #fff url(../images/common/table_top.jpg) top left no-repeat; left: 50%; transform: translateX(-50%); font-family: 'Titillium Web', sans-serif; color: #023995; font-weight: bold; font-size: 30px }
.business p span { display: block; font-size: 18px; color: #333; font-weight: 100 }
/* 제품소개 */
.product { display: inline-block; width: 48%; float: left; overflow: hidden; margin: 0 20px 20px 0 }
.product h5 { font-weight: bold; font-size: 20px; margin: 0 0 10px 0; padding: 10px 0;/*background:url(../images/common/table_top.jpg) no-repeat bottom left; background-size:200%*/ border-bottom: 1px solid #ccc; }
.product p { float: left; width: 40% }
.product p img { width: 100% }
.product dl { float: left; width: 60% }
.product dl dt { float: left; clear: both; font-weight: bold; padding: 5px 0; width: 20%; color: #b89738 }
.product dl dd { float: left; padding: 5px 0; width: 70%; text-align: left }
/* 설비현황 */
#gallery p { display: inline-block; width: 23.9%; margin: 0 10px 10px 0 }
/*모바일*/
@media all and (max-width:767px) {
body { font-size: 14px; }
img { max-width: 100%; }
body.lnb_on { overflow: hidden }
body.lnb_on #d_lnb_mask { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: url('../images/common/lnb_mask_bg.png'); z-index: 990; }
#hsec1 { padding: 0px 0px; border-bottom: 1px solid #ddd }
#hsec1 .d_container { position: relative }
#hsec1 .con1 { position: absolute; left: 0; top: 0; padding: 14px 10px; cursor: pointer }
#hsec1 .con2 { text-align: center; padding: 1em 0 }
#hsec1 .con2 .pc { display: none }
#hsec1 .con3 { position: absolute; right: 5px; top: 10px }
#hsec2 { }
#d_lnb { position: fixed; left: -100%; top: 0; width: 70%; height: 100%; background: #fff; z-index: 991 }
#d_lnb h1 { display: none; }
#d_lnb h2 { position: relative; text-align: center; color: #333; padding: 40px 0; border-bottom: 1px solid #ddd }
#d_lnb h2 .close { position: absolute; right: 10px; top: 10px; cursor: pointer }
#d_lnb li { border-bottom: 1px solid #ddd }
#d_lnb li.on > a { color: #fff; background: #1b8d27 }
#d_lnb li > a { display: block; padding: 10px 25px; font-size: 13px; font-weight: 600 }
#d_lnb li .sub { background: #f5f5f5; display: none; }
#d_lnb li .sub dd { border-top: 1px solid #ddd }
#d_lnb li .sub dd a { display: block; padding: 10px 35px; }
#d_lnb li .sub dd a:hover { text-decoration: underline }
.inner { width: auto; max-width: 100%; padding: 10px; }
.responsive-slider .slides ul li .slide-body img {/*height:300px;*/ }
.responsive-slider .slider-control.left, .responsive-slider .slider-control.right { display: none; }
.text01, .text02 { font-size: 30px; }
.main_business h2 { text-align: center; font-size: 14px }
.main_business_con { float: none; width: auto; margin: 0 }
.main_news { float: none; width: auto; padding: 0; }
.main_catalog { float: none; width: auto }
.main_icon ul li { width: 49%; }
.nopadding { padding: 0 !important; }
.main_news { padding: 10px; }
.main_news dt { float: none; }
.main_icon { background-size: cover; }
footer { padding: 0.5em 0; border-top: 1px solid #ccc }
footer img { margin: 0 auto; padding: 20px 0; float: none; width: 80% }
footer p { float: none; margin: 0 auto; }
footer address { float: none; text-align: center; }
footer ul { text-align: center; }
footer ul li a { font-size: 0.9em; }
.sub_bar { display: none; }
#DB_navi39 ul li.m1, #DB_navi39 ul li.m2 { width: 12%; }
.sub_head { display: none; }
.sub_tit { margin: 0 auto; }
.sub_tit h3 { font-size: 2em }
.sub_contants { padding: 0 }
.greeting { background-size: cover; height: auto; padding: 20px }
.greeting h2 { text-align: center; font-size: 2em }
.s_tit { font-size: 1.2em; }
.info li { float: left; }
.list4 li { width: auto; }
.history h4 { font-size: 2em; }
.history ul li { font-size: 1em; }
.history ul li span { font-size: 1.5em; }
.history ul li.left { padding-right: 10% }
.history ul li.right { padding-left: 10%; }
.vision { padding: 20px; }
.vision dl { width: auto; }
.vision dl dt { font-size: 1.5em; line-height: none }
.philosophy { background-size: cover; padding: 50px 20px }
.philosophy h2 { font-size: 1.2em; padding: 0 }
.philosophy h2 span { font-size: 1.5em }
.philosophy ul li { float: none; width: auto }
.location_info { float: none; width: auto; display: block; margin: 0 0 30px 0 }
.business p { width: auto; position: relative; padding: 20px }
.product { margin: 0 }
.product, .product p, .product dl { float: none; width: auto; }
#gallery p { width: 46% }
.comm_table td, tr { display: block; }
.comm_table thead tr { position: absolute; top: -9999px; left: -9999px; }
.comm_table tr { border: 1px solid #ccc; }
.comm_table tr + tr { margin-top: 1.5em; }
.comm_table td { border: none; border-bottom: 1px solid #eee; position: relative; padding-left: 50%; text-align: left; }
.comm_table td:before { content: attr(data-label); display: inline-block; line-height: 1.5; margin-left: -100%; width: 100%; white-space: nowrap; }
}