@charset "utf-8";/* 공통 */

.show-default { display:block; } 
.hide-default { display:none; } 

/* skip */
#top_skip { display:block; background:#fff; position:fixed; left:0; top:0; z-index:99999999; } 
#top_skip a { position:relative; display:block; width:120px; line-height:35px; text-align:center; background:#333; color:#fff; font-size:12px; height:0; overflow:hidden; } 
#top_skip a:focus { height:35px; border:2px solid #005983; } 


/* header */
#header:after { content: ''; display: block; position: absolute; left: 0; right: 0; top: 89px; background: rgba(255,255,255,0.2); height: 1px; } 
#header.h_fixed:after,
#header.h_hover:after { background: #ddd; } 
#header .header_bg { height: 90px; transition: 0.8s ease-in-out; -webkit-transition: 0.8s ease-in-out; -moz-transition: 0.8s ease-in-out; -o-transition: 0.8s ease-in-out; } 
#header.h_fixed .header_bg,
#header.h_hover .header_bg { background: #fff; } 

.h_wrap { height: 90px; overflow:hidden; } 
#header.h_hover .h_wrap { box-shadow: 5px 5px 15px rgba(0,0,0,0.1); } 
.gsnb_bg { position:absolute; top:0; left:0; right:0; background: rgba(255,255,255,0.96); height:0; } 

.h_inner { width: auto; margin-left: 3.90625%; margin-right: 3.90625%; position: relative; } 
#logo { position: absolute; top: 0; left: 0; display: inline-block; padding-top: 29px; } 
#logo a { display:block; background: url('/image/common/logo_en.png') no-repeat; height: 27px; width: 200px; background-size: auto 100% !important; } 
#header.h_fixed #logo a,
#header.h_hover #logo a { background: url('/image/common/logo_on_en.png') no-repeat; } 

.gnb_btn { display: none; position: absolute; top: 0; right: 0; height: 90px; width: 90px; } 
.gnb_btn span { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } 
.gnb_btn span.btn02 { display: none; } 
.h_hover .gnb_btn span.btn01,
.h_fixed .gnb_btn span.btn01 { display: none; } 
.h_hover .gnb_btn span.btn02,
.h_fixed .gnb_btn span.btn02 { display: block; } 

/* gnb */
#gnb_wrap { margin: 0 auto; text-align: center; } 
.header_mask { display: none; } 
.h_open .header_mask { displaY: block; } 
#gnb_wrap .m_top { background: #166cd5; height: 90px; color: #fff; padding: 0 35px; position: relative; display: none; } 
#gnb_wrap .m_top .m_logo { padding-top: 29px; } 
#gnb_wrap .m_top .m_lang { position: absolute; right: 30px; top: 50%; transform: translateY(-50%); font-size: 16px; } 
.m_lang a { color: #fff;}

.gnb > li { display: inline-block; position:relative; padding: 0 10px; } 
.gnb > li > a { display: block; font-size: 20px; line-height: 90px; height: 90px; box-sizing: border-box; font-weight: 500; letter-spacing: -0.5px; color: #fff; border-bottom: 3px solid transparent; min-width: 140px; position: relative; z-index: 9; } 
#header.h_fixed .gnb > li > a,
#header.h_hover .gnb > li > a { color: #000; } 
.gnb > li.active > a { color: #0b4da2 !important; border-bottom: 3px solid #0b4da2; } 
.gsnb { position: absolute; left: 0; right: 0; top: 100%; height: 350px; display: none; } 
#header.h_hover .gsnb { display: block; } 
.gsnb:after { content: ''; display: block; clear: both; } 
.gsnb ul { box-sizing: border-box; padding: 35px 0 10px; position: relative; text-align: center; } 
.gsnb ul li { padding-bottom: 12px; } 
.gsnb ul li a { display: block; font-size: 16px; color: #666; } 
.gsnb ul li a:hover { color: #0b4da2; } 

.lang { position: absolute; right: 3.90625%; top:32px; z-index: 9; margin-right: 90px; } 
.lang > a { display: block; width: 25px; height: 25px; text-indent: -9999em; background: url('/image/common/lang.png') no-repeat; } 
#header.h_fixed .lang > a,
#header.h_hover .lang > a { background: url('/image/common/lang_on.png') no-repeat; } 
.lang_box { display: none; position: absolute; top: 35px; background: #fff; box-shadow: 5px 5px 10px rgb(0 0 0 / 10%); width: 60px; border-radius: 10px; text-align: center; right: -18px; padding: 10px 0; } 
.lang_box.on { display: block; } 
.lang_box li a { color: #666; font-size: 12px; font-weight: bold; display:Block; line-height: 20px; } 
.lang_box li a:hover { color: #000; } 

.gnb_plus { position: absolute; top: 0; righT: 0; z-index: 9; } 
.gnb_plus > a { displaY: block; backgrounD: #0b4da2; width: 90px; height: 90px; box-sizing: border-box; text-align: center; padding: 34px 0px; } 
.gnb_plus > a img { transition: 0.3s ease-in-out; } 
.gnb_plus.on > a img { transform: rotate(-45deg); } 
.gnb_plus_sub { backgrounD: #f7f7f7; position: absolute; top: 100%; right: 0; width: 160px; box-sizing: border-box; padding: 20px 25px; display: none; } 
.gnb_plus_sub li { position: relative; } 

.gnb_plus_sub li::before { content: ""; height: 100%; background-color: #0b4da2; width: 5px; position: absolute; top: 0; left: -27px; opacity: 0; transition: all ease .3s; } 

.gnb_plus_sub li:hover::before { opacity: 1; } 

.gnb_plus_sub li a { display: block; font-size: 14px; line-height: 30px; margin: 5px 0; } 
.gnb_plus.on .gnb_plus_sub { display: block; } 

/* gnb_plus_mo */
.gnb_plus_mo { display: none; margin-top: 155px; padding: 0 20px; text-align: center; font-size: 14px; color: #999; } 
.gnb_plus_mo a { color: #999; } 
.gnb_plus_mo span { width: 1px; height: 12px; background: #999; margin: 1px 10px; display: inline-block; } 
.gnb_plus_mo .o_form { width: 100%; padding: 5px 0; border: 1px solid #0b4da2; color: #0b4da2; display: flex; align-items: center; justify-content: center; margin-top: 15px; } 
.gnb_plus_mo .o_form img { width: 35px; height: 35px; } 
.gnb_plus_mo .o_form a { color: #0b4da2; margin-left: 15px; font-size: 16px; line-height: 1.4em; } 




/* 풀페이지 스크롤 시 헤더 변경 */
.fp-viewing-2 #header:after,
.fp-viewing-3 #header:after,
.fp-viewing-4 #header:after,
.fp-viewing-5 #header:after { background: #ddd; } 
.fp-viewing-2 #header .header_bg,
.fp-viewing-3 #header .header_bg,
.fp-viewing-4 #header .header_bg,
.fp-viewing-5 #header .header_bg { background: #fff; } 
.fp-viewing-2 #header #logo a,
.fp-viewing-3 #header #logo a,
.fp-viewing-4 #header #logo a,
.fp-viewing-5 #header #logo a { background: url('/image/common/logo_on_en.png') no-repeat; } 
.fp-viewing-2 #header .gnb > li > a,
.fp-viewing-3 #header .gnb > li > a,
.fp-viewing-4 #header .gnb > li > a,
.fp-viewing-5 #header .gnb > li > a { color: #000; } 
.fp-viewing-2 #header .lang > a,
.fp-viewing-3 #header .lang > a,
.fp-viewing-4 #header .lang > a,
.fp-viewing-5 #header .lang > a { background: url('/image/common/lang_on.png') no-repeat; } 
.fp-viewing-2 .gnb_btn span.btn01,
.fp-viewing-3 .gnb_btn span.btn01,
.fp-viewing-4 .gnb_btn span.btn01,
.fp-viewing-5 .gnb_btn span.btn01 { displaY: none; } 
.fp-viewing-2 .gnb_btn span.btn02,
.fp-viewing-3 .gnb_btn span.btn02,
.fp-viewing-4 .gnb_btn span.btn02,
.fp-viewing-5 .gnb_btn span.btn02 { displaY: block; } 


/* footer */
#footer { padding: 70px 0 80px; color: #888888; font-size: 14px; } 
.f_menu li a { color: #888888; font-size: 14px; margin-right: 20px; } 
.f_info { margin-top: 40px; } 
.f_info span { position: relative; padding-right: 20px; } 
/* .f_info span:after { content: ''; display: block; position: absolute; background: #ddd; width: 1px; height: 10px; top: 6px; right: 7px; }  */
.f_info span.none:after { displaY: none; } 
.copy { font-family: 'Exo', sans-serif; } 
#footer .right { position: absolute; right: 0; top: 0; } 
.f_logo { text-align: right; } 
.family_site { margin-top: 20px; } 
.family_site select { background-color: #ebebeb; height: 45px; width: 180px; font-family: 'Exo', sans-serif; color: #666; font-size: 13px; font-weight: bold; border-radius: 3px; } 

/* 서브비주얼 */
.sv_wrap { height: 540px; position: relative; overflow: hidden; } 
.sv { height: 540px; position: fixed; top: 0; left: 0; right: 0; } 
.sv:after { content: ''; display: block; opacity: 0; visibility: hidden; transition: 0.4s ease-in-out; background: rgba(0,0,0,0.4); position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 9; } 
.sv.on:after { opacity: 1; visibility: visible; } 
.sv.K01 { background: url('/image/common/sv_01_1.jpg') no-repeat center / cover; } 
.sv.K02 { background: url('/image/common/sv_02.jpg') no-repeat center / cover; } 
.sv.K03 { background: url('/image/common/sv_03.jpg') no-repeat center / cover; } 
.sv.K04 { background: url('/image/common/sv_04.jpg') no-repeat center / cover; } 
.sv.K05 { background: url('/image/common/sv_05.jpg') no-repeat center / cover; } 
.sv.K06 { background: url('/image/common/sv_06_1.jpg') no-repeat center / cover; } 
.sv.K07 { background: url('/image/common/privacy.png') no-repeat center / cover; } 
 .sv.K08 { background: url('/image/common/privacy.png') no-repeat center / cover; } 
 .sv.K09 { background: url('/image/common/sv0101.jpg') no-repeat center / cover; }
 .sv.K10 { background: url('/image/common/sv0101.jpg') no-repeat center / cover; } 


.sv .txt { position: absolute; top: 250px; right: 0; left: 0; z-index: 1; } 
.sv .txt .ko { font-size: 50px; line-height: 1.1; font-weight: bold; margin-bottom: 15px; color: #fff; } 
.sv .txt .eg { font-size: 14px; color: #fff; } 
.sv .txt .eg span { font-family: 'Open Sans',sans-serif; font-size: 12px; margin: 0 3px; } 

.sv .txt .txt_sub { font-size: 24px; color: #fff; margin-top: 36px; } 

/* lnb */
.lnb_wrap { position: absolute; bottom: 0; left: 0; right: 0; background-color: rgba(11, 77, 162, 0.94); height: 70px; transition: all ease .3s; } 
.lnb_wrap.isFixed { position: fixed; top: 0; left: 0; width: 100%; z-index: 10; background-color: rgba(11, 77, 162, 1); } 
.lnb_logo { position: absolute; left: 50px; top: 21px; z-index: 9; opacity: 0; transition: all 0.5s 0.1s; clip: rect(0px,0px,30px,0); } 
.lnb_wrap.isFixed .lnb_logo { opacity: 1.0; clip: rect(0px,200px,30px,0); } 
.lnb_wrap > .inner { display: flex; align-items: center; justify-content: space-between; } 

.lnb { display: flex; } 

.lnb>li>a {
    display: flex;
    align-items: center;
    justify-content: center;
    display: block;
    height: 70px;
    /* line-height: 70px; */
    font-size: 17px;
    box-sizing: border-box;
    position: relative;
    color: #ccc;
    /* text-align: center; */
    display: flex;
    align-items: center;
    justify-content: center;
}
.lnb_wrap.isFixed .lnb > li:not(:last-child) { margin-left: 50px; margin-right: 0; } 
.lnb_wrap.isFixed .lnb > li:last-child { margin-left: 30px; margin-right: 0;}
.lnb > li:not(:last-child) { margin-right: 50px; } 
.lnb > li:last-child { margin-right: 30px;}

.lnb > li.active > a { color: #fff; font-weight: 500; } 


.lnb_wrap .path { display: flex; align-items: center; height: 70px; } 


.lnb_wrap .path .path_home img { display: block; } 

.lnb_wrap .path>a:not(:first-child) { width: 40%;}
.lnb_wrap .path>a { font-size: 14px; color: #fff; line-height: 1.1; } 
.lnb_wrap .path>a:not(:last-child) { padding-right: 10px; background-image: url(/image/common/path_arrow.png); background-repeat: no-repeat; background-position: 100% center; margin-right: 10px; color: rgba(256,256,256,0.4); } 
.lsnb { display: none; } 

@media all and (max-width:1400px){
 .gnb>li>a { min-width: auto; } 
 }
@media all and (max-width:1199px) {.lnb_wrap .blue_bg { width: 3.90625%; margin-lefT: 0; left: 0; } 
 .lnb_logo { display: none; } 
 }

/* 타블렛 가로 */
@media all and (max-width:1099px) { } 


/* 타블렛 세로 */
@media all and (max-width:1023px) {
/* gnb */
.gnb_btn { display:block; } 
#gnb_wrap { position:fixed; left:20%; right: 0; top:0; bottom: 0; background:#fff; padding-left: 0; z-index: 999; text-align: left; -moz-transform: translateX(101%); -webkit-transform: translateX(101%); -o-transform: translateX(101%); -ms-transform: translateX(101%); transform: translateX(101%); -webkit-transition: 0.25s cubic-bezier(0.165,0.84,0.44,1) 0s; -moz-transition: 0.25s cubic-bezier(0.165,0.84,0.44,1) 0s; -ms-transition: 0.25s cubic-bezier(0.165,0.84,0.44,1) 0s; -o-transition: 0.25s cubic-bezier(0.165,0.84,0.44,1) 0s; transition: 0.25s cubic-bezier(0.165,0.84,0.44,1) 0s; } 
.h_open #gnb_wrap { -moz-transform: translateX(0); -webkit-transform: translateX(0); -o-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 
#gnb_wrap .m_top { display: block; } 
.gnb_scroll { position:absolute; left:0; top: 90px; right:0; bottom:0; overflow:auto; overflow-scrolling:touch; -webkit-overflow-scrolling:touch; -moz-overflow-scrolling:touch; } 
.gnb > li { display: block; border-bottom: 1px solid #ddd; padding: 0;} 
.gnb > li > a { font-size:25px; line-height: 85px; height: 85px; padding: 0 35px; color: #000; } 
.gnb > li.active > a { border-bottom: 0; } 
.gnb > li > a::after { display:block; content:''; position:absolute; width: 20px; height: 20px; right: 35px; top: 37px; left: auto; bottom: auto; opacity: 1; background: url("/image/common/gnb_bl.png") no-repeat center 0; background-size:100% auto; } 
.gnb li.active > a::after { background:url("/image/common/gnb_bl2.png") no-repeat center 0; width: 20px; } 
.gsnb { display:none; position:static; height:auto; } 
.gsnb ul { text-align: left; padding: 0; } 
.gsnb ul li { display: block; padding-bottom: 0; } 
.gsnb ul li a { font-size: 18px; line-height: 65px; padding: 0 35px; border-top: 1px solid #ddd; background: #f5f5f5; } 
 .gnb_plus > a { width: 70px; height: 70px; padding: 24px 0px; display: none; } 
.lang { display: none; } 

 
 .gnb_plus_mo { display: block; } 

/* footer */
#footer .right { position: static; margin-bottom: 20px; } 
#footer .right:after { content: ''; display: block; clear: both; } 
#footer .right .f_logo { float: left; } 
#footer .right .family_site { float: right; margin-top: -10px; } 

 .sv_wrap { height: 400px; } 
.sv { height: 400px; position: relative; } 
.sv .txt { top: 200px; } 
.sv .txt .ko { font-size: 40px; } 
.sv .txt .eg { font-size: 22px; } 

 .lnb_wrap .path { display: none; } 
 }


/* 타블렛 가로 미만 ~ 모바일 */
@media all and (max-width:767px) {

.h_wrap, #header .header_bg { height: 70px; } 
#header:after { top: 69px; } 
.gnb_btn img { height: 70px; } 
#logo { padding-top: 25px; } 
#logo a { height: 20px; } 

#gnb_wrap .m_top { height: 70px; padding: 0 25px; } 
#gnb_wrap .m_top .m_logo { padding-top: 25px; } 
#gnb_wrap .m_top .m_logo img { height: 20px; } 
.gnb_scroll { top: 70px; } 
.gnb > li > a { font-size: 20px; height: 65px; line-height: 65px; padding: 0 25px; } 
.gnb > li > a::after { top: 29px; width: 15px; right: 25px; } 
.gnb li.active > a::after { width: 15px; } 
.gsnb ul li a { font-size: 15px; line-height: 60px; padding: 0 25px; } 

.gnb_btn { width: 70px; height: 70px; } 

 .sv_wrap { height: 340px; overflow: initial; } 
.sv { height: 340px; } 
.sv .txt { top: 160px; } 
.sv .txt .ko { font-size: 35px; } 
.sv .txt .eg { font-size: 18px; } 

 /* lnb */
 .lnb_wrap .blue_bg {
   width: 15%;
   height: 70px;
   background: url(/image/common/home.png) no-repeat center right -38px;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 99;
 }
 .lnb_wrap .blue_bg a { width: 100%; height: 100%; display: block; } 
 .sv.K07 + .lnb_wrap .blue_bg { display: none; } 
 .sv.K08 + .lnb_wrap .blue_bg { display: none; } 
 .sv.K09 + .lnb_wrap .blue_bg { display: none; } 

 .lnb_wrap { bottom: initial; height: auto; z-index: 99; } 
 .lnb_wrap > .inner { display: block; } 
 .lnb { flex-direction: column; flex-wrap: wrap; } 
 .lnb > li { width: 100%; background: url(/image/common/lnb.png) no-repeat center right 10px / 12px; position: relative; display: none; padding-left: 18%; box-sizing: border-box; } 
 .lnb>li>a { text-align: left; font-size: 17px;  justify-content: flex-start;} 
 .lnb > li.active { display: block; } 
 
 .lsnb {
   width: 93%;
   text-align: left;
   position: absolute;
   top: 100%;
   left: 12%;
   z-index: 999;
 }
 .lsnb li a { display: block; width: 100%; padding: 20px 30px; font-size: 15px; background: #fff; border-bottom: solid 1px #ddd; border-left: solid 1px #ddd; border-right: solid 1px #ddd; box-sizing: border-box; } 
}

/* 모바일 상세 */
@media all and (max-width:640px) { } 

/* 모바일 가로 */
@media all and (max-width:568px) {.h_wrap, #header .header_bg { height: 60px; } 
#header:after { top: 59px; } 
.gnb_btn img { height: 60px; } 
#logo { padding-top: 21px; } 
#logo a { height: 18px; } 

#gnb_wrap .m_top { height: 60px; padding: 0 20px; } 
#gnb_wrap .m_top .m_logo { padding-top: 21px; } 
#gnb_wrap .m_top .m_logo img { height: 18px; } 
.gnb_scroll { top: 60px; } 
.gnb > li > a { font-size: 18px; height: 60px; line-height: 60px; padding: 0 20px; } 
.gnb > li > a::after { top: 27px; right: 20px; } 
.gsnb ul li a { line-height: 55px; padding: 0 20px; } 

.gnb_btn { width: 60px; height: 60px; } 

/* footer */
#footer { padding: 50px 0 60px; font-size: 12px; } 
#footer .right .f_logo img { height: 20px; } 
.family_site select { height: 40px; width: 150px; } 
.f_menu li a { font-size: 12px; margin-right: 10px; } 
.f_info {
  margin-top: 30px;
  margin-top: 30px;
  display: flex;
  flex-direction: column;
}

/* lnb */
 .sv_wrap { height: 300px; } 
.sv { height: 300px; } 
.sv .txt { top: 145px; } 
.sv .txt .ko { font-size: 32px; } 
.sv .txt .eg { font-size: 16px; } 
 }

@media all and (max-width:425px) { } 

@media all and (max-width:374px) { } 

@media all and (max-width:320px) { } 







/* 공통 */

/* PC이하 ~ 타블렛 가로 */
@media all and (max-width:1199px){
 .show-1199 { display:block; } 
.hide-1199 { display:none; } 
 }
/* 타블렛 가로 이하 */
@media all and (max-width:1023px){
 .show-1023 { display:block !important; } 
.hide-1023 { display:none !important; } 
 }
/* 타블렛 이하 ~ 모바일 */
@media all and (max-width:767px){
 .show-767 { display:block; } 
  .hide-767 { display:none; } 
 }
/* 모바일 가로 미만 */
@media all and (max-width:568px){
 .show-568 { display:block; } 
.hide-568 { display:none; } 
 }
/* 모바일 최소 */
@media all and (max-width:425px){
 .show-425 { display:block; } 
.hide-425 { display:none; } 
 }

@media all and (max-width:375px){
 .show-375 { display:block; } 
.hide-375 { display:none; } 
 }

@media all and (max-width:320px){
 .show-320 { display:block; } 
.hide-320 { display:none; } 
 }