@charset "utf-8";

.inner { position:relative; width:1400px; margin:0 auto; box-sizing:border-box } 
#container { width:100%; overflow:hidden } 

/* header */
#header { position:relative; background:#fff; height:120px; border-bottom:1px solid #e2e2e2; z-index:148; box-sizing:border-box; box-shadow: 6px 8px 10px 2px rgba(0, 0, 0, 0.05); transition:all 1.5s ease-in-out; } 
#header.fixed { position:fixed !important; top:0px; width:100% !important; z-index: 500; box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.1); animation:fadein .5s; } 

.logo_area h1 { position:absolute; height:100%; left: calc((100% - 1400px) / 2); z-index:20; } 
.logo_area h1 a{display:flex;align-items:center;height:100%;}
.logo_area h1 img { } 

/* pc_menu */
#gnb { position:relative; } 
#gnb .inner > ul { margin:0px auto; height:120px; width:100%; display:flex; justify-content: center; } 
#gnb .inner > ul > li { transition:0.8s all cubic-bezier(.7, .1, .2, 1); } 
#gnb .inner > ul > li > a { position:relative; display:block; font-size:1.75rem; font-weight:600; padding:16px 20px; margin-top:20px; height:100px; box-sizing:border-box; text-align:center; transition-delay:.05s; } 
#gnb .inner > ul > li:hover > a,#gnb .inner > ul > li:focus > a { color:#d54529 } 
#gnb .inner > ul > li > a:before { content:''; position:absolute; left:0%; bottom:0px; display:block; width:100%; height:0px; opacity:.5; background:#d54529; transition: all .3s ease-in-out; } 
#gnb .inner > ul > li:hover > a:before,#gnb .inner > ul > li:focus > a:before { bottom:0px; width:100%; height:4px; opacity:1; } 
#gnb .gnb_dep2 { position:relative; background:#fff; height:0; text-align:left; overflow:hidden; z-index:140; } 
#gnb .gnb_dep2 > li { padding:0px 12px 18px; color:#344054; } 
#gnb .gnb_dep2 > li:first-child { margin-top:32px; } 
#gnb .gnb_dep2 > li > a { position:relative; } 
#gnb .gnb_dep2 > li > a:hover,
#gnb .gnb_dep2 > li > a:focus { color:#d54529; font-weight:600; } 
#gnb .gnb_dep2 > li > a:before { content:''; position:absolute; left:0; bottom:-4px; display:block; width:0; height:1px; opacity:0; background:#d54529; transition: all .3s ease-in-out; } 
#gnb .gnb_dep2 > li > a:hover:before,
#gnb .gnb_dep2 > li > a:focus:before { width:100%; opacity:1; } 
#gnb .inner > ul > li:last-child .gnb_dep2 { border-right:1px solid #eee; } 
#gnb .inner > ul > li:nth-child(odd) .gnb_dep2 { border-left:1px solid #eee; border-right:1px solid #eee; } 
#gnb .inner > ul > li:hover .gnb_dep2 { background:#fffcfc } 
#gnb .gnb_dep3 { margin-top:8px; margin-left: 2px; } 
#gnb .gnb_dep3 li a { position: relative; padding:6px 0px 6px 12px; font-size:1rem; } 
#gnb .gnb_dep3 li a:before { content:''; position:absolute; left:0; top:16px; display:block; width:3px; height:3px; background:#555; border-radius:50%; transition: all .3s ease-in-out; } 
#gnb .gnb_dep3 li a:hover { color:#d54529; font-weight:600; } 

/* pc_menu - on */
#gnb .gnb_dep1.on > li > a { padding-left: 24px; padding-right: 24px; } 
#gnb .gnb_dep1.on .gnb_dep2 > li { padding-left: 24px; } 
#gnb .gnb_dep1.on .gnb_dep2 > li > a { padding-right:16px; } 

#gnb .tmnBg { position:absolute; top:120px; left:0; width:100%; height:0; background: #fff; z-index:100; box-shadow: 6px 8px 10px 2px rgba(0, 0, 0, 0.1); } 

#gnb .r_unit {position:absolute; top:36px; right:calc((100% - 1400px) / 2);font-size:0;height:40px;display:flex;align-items:center;} 
#gnb .sitem_map {width:40px; height:40px; padding-top:10px; box-sizing:border-box; font-size:0;position:relative;}
/* #gnb .sitem_map::after {content:'';display:block;width:1px;height:24px;background:#d3d3d3;position:absolute;top:9px;right:-6px;} */
#gnb .sitem_map span { display:block; width:32px; height:3px; margin:0 auto 6px; background:#444; transition:all .3s ease } 
#gnb .sitem_map span:last-child { margin-bottom:0; } 
#gnb .sitem_map:hover span:first-child { animation:move-run .3s ease-in-out 0s } 
#gnb .sitem_map:hover span:nth-child(2) { animation:move-run .3s ease-in-out .1s } 
#gnb .sitem_map:hover span:last-child { animation:move-run .3s ease-in-out .2s }

#gnb .r_unit .login_btn {width:24px;height:24px;background:url('../img/ico_login.png') center;margin-left:11px;position:relative;}
#gnb .r_unit .login_btn::after {content:'';display:block;width:1px;height:24px;background:#d3d3d3;position:absolute;top:0;left:-6px;}
#gnb .r_unit .logout_btn {width:24px;height:24px;background:url('../img/ico_logout.png') center;margin-left:11px;position:relative;}
#gnb .r_unit .logout_btn::after {content:'';display:block;width:1px;height:24px;background:#d3d3d3;position:absolute;top:0;left:-7px;}


@keyframes move-run { 
	50% { left:-23px; opacity:.3 } 
	51% { left:23px } 
	100% { left:0; opacity:1 } 
 }

/* mobile_menu */
#header #mMenu { display:none; position:absolute; top:5px; right:0; width:65px; height:65px; padding-top:25px; box-sizing:border-box; } 
#header #mMenu span { display:block; width:30px; height:3px; margin:0 auto 6px; background:#444; } 
#header #mMenu span:last-child { margin-bottom:0; } 
#mGnb { display: none; position: fixed; top: 0; right: -100%; width: 100%; height: 100%; overflow-y: scroll; background: #fff; color: #111; box-shadow: -4px -1px 2px rgba(0,0,0,0.1); z-index: 160; } 
#mGnb .mgnb_top { background: #fff; border-bottom: 10px solid #D0D5DD; } 
#mGnb .mgnb_top .t_abox { display: flex; align-items: center; padding: 0px 20px; border-bottom: 1px solid #eee; height: 48px; line-height: 48px; } 
#mGnb .mgnb_top .t_abox a { position: relative; padding-right: 10px; margin-right: 10px}
#mGnb .mgnb_top .t_abox > a:before { content: ''; position: absolute; right: 0; top: 19px; width: 1px; height: 10px; background: #E2E4E9; } 
#mGnb .mgnb_top .t_abox a:last-child:before { display: none}
#mGnb .mgnb_top .t_abox .tnb_sns a { margin: 0 2px; } 
#mGnb .mgnb_top .t_box { position: relative; align-items: center; padding: 2rem 1.5rem 1.25rem; } 
#mGnb .mgnb_top .t_box .ico { margin-right: 12px; border-radius: 8px; width: 68px; height: 68px; background: #F6F8FA; } 
#mGnb .mgnb_top .t_box .ico img { width: 52px; } 
#mGnb .mgnb_top .t_box p { font-size: 1.25em; line-height: 1.5}
#mGnb .mgnb_top .t_box a { position: absolute; right: 20px; bottom: 20px; border: 1px solid #E2E4E9; padding: 4px 10px; font-size: .8em; opacity: .8}
#mGnb .mDepth1 { box-sizing: border-box; background: #fff; padding:20px;border-top: 1px solid #eee; border-bottom: 10px solid #D0D5DD; } 
#mGnb .mDepth1 > li > a { position: relative; display: block; padding: 1.15rem; font-size: 1.25rem; border-bottom: 1px solid #E2E4E9; font-weight: 700; } 
#mGnb .mDepth1 > li > a:before { content: ''; display: block; position: absolute; right: 5%; top: 50%; width: 15px; height: 8px; margin-top: -4px; background: url('/theme/basic/img/mgnb_arrow1.svg') no-repeat 0 0; opacity: .7}
#mGnb .mDepth1 > li > a.active:before { transform: rotate(-180deg)}
#mGnb .mDepth2 { display: none; overflow: hidden; border-bottom:1px solid #E2E4E9;} 
#mGnb .mDepth1 > li:last-child .mDepth2 { margin-bottom: 0; } 
#mGnb .mDepth2 > li > a { display: block; padding: .875rem 1.125rem; padding-right: 10%; font-size: 17px;  background: url('/theme/basic/img/mgnb_arrow3.svg') no-repeat 95% 50% #fafafa; font-weight:500;} 
#mGnb .mDepth2 > li > a.plus { background: url('/theme/basic/img/mgnb_arrow2.svg') no-repeat 95% 50% ; } 
#mGnb .mDepth2 > li > a.plus.active { background: url('/theme/basic/img/mgnb_arrow2-1.svg') no-repeat 95% 50%;}
#mGnb .mDepth3 { display: none; overflow: hidden;background:#F2F4F7;border-radius:12px;} 
#mGnb .mDepth3 li { float: left; width: 100%; transition: all 300ms ease-out; transform: translateY(120%); transition-delay: 0.2s; opacity: 0; } 
#mGnb .mDepth3 li a { display: block; padding: 12px 24px; padding-right: 18%; font-size: 15px;font-weight:700}
#mGnb .mDepth3 li.active { transform: translateX(0); opacity: 1; } 
#mGnb .mDepth3 li.active:nth-child(2) { transition-delay: 0.3s; } 
#mGnb .mDepth3 li.active:nth-child(3), #mGnb .mDepth3 li.active:nth-child(6) { transition-delay: 0.4s; } 
#mGnb .mDepth3 li.active:nth-child(4), #mGnb .mDepth3 li.active:nth-child(7) { transition-delay: 0.5s; } 
#mGnb .mDepth3 li.active:nth-child(5), #mGnb .mDepth3 li.active:nth-child(8) { transition-delay: 0.6s; } 
#mGnb .mDepth3 li.active:nth-child(9) { transition-delay: 0.4s; } 
#mGnb .mDepth3 li.active:nth-child(10) { transition-delay: 0.7s; } 

#mGnb .mGnbClose { display: inline-block; position: absolute; top: 0px; right: 0px; width: 48px; height: 48px; font-size: 0; background: #525866; text-align: center; padding-top: 12px; } 
#mGnb .mn_close { position: relative; display: inline-block; width: 24px; height: 24px; overflow: hidden; opacity: .8}
#mGnb .mn_close:hover:before,#mGnb .mn_close:hover:after { background: #0000c8; } 
#mGnb .mn_close:before,#mGnb .mn_close:after { content: ''; position: absolute; height: 2px; width: 100%; top: 50%; left: 0; margin-top: -1px; background: #fff; border-radius: 4px}
#mGnb .mn_close:before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } 
#mGnb .mn_close:after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } 
#dimed { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); -webkit-backdrop-filter: saturate(180%) blur(4px); backdrop-filter: saturate(180%) blur(4px); z-index: 149; } 


/* footer */
#footer { background:#3D3D3D; color:#C6C6C6; } 
.foot_top { background: #2D2D2D; padding:7px 0;} 
.foot_top .inner { align-items: center; padding: 8px 0; } 
.foot_top .ftop_l { margin: 0 -8px; } 
.foot_top .ftop_l li { margin: 0 8px; } 
.foot_top .ftop_l li:first-child a { color: #fff; } 

.foot_bottom { border-bottom: 1px solid #555; } 
.foot_bottom .inner > * { width:50%; padding: 60px 0; } 
.foot_bottom ul { margin-top: 14px; } 
.foot_bottom ul li { display: flex; align-items: baseline; margin: 6px 0; } 
.foot_bottom ul li .tit { width: 72px; font-weight: 700; } 
.foot_bottom ul li .tit + * { width:calc(100% - 72px) }
.foot_bottom .r_box {text-align:right;}

.copy {font-size: 0.875rem;margin-top: 1rem;}

.copyright { padding: 44px 0; } 

/* 서브 */
#svisualLayout{width:100%;height:268px;color:#fff; position:relative;}
#svisualLayout .svisualBg{position:absolute;width:100%;height:268px;top:0;left:0;overflow:hidden;z-index:-1;}
#svisualLayout .svisualBg:after{content:'';position:absolute; top:0; left:0;display:block; width:100%; height:268px;animation: kenburns-bottom 5s ease-out both;}
#svisualLayout .svisualBg.svisualBg_10:after{background:url('../img/subtop_bg10.png') no-repeat center center #121212;background-size:cover;}
#svisualLayout .svisualBg.svisualBg_20:after{background:url('../img/subtop_bg20.png') no-repeat center center #121212; background-size:cover;}
#svisualLayout .svisualBg.svisualBg_30:after{background:url('../img/subtop_bg30.png') no-repeat center center #121212; background-size:cover;}
#svisualLayout .svisualBg.svisualBg_40:after{background:url('../img/subtop_bg40.png') no-repeat center center #121212; background-size:cover;}
#svisualLayout .titleWrap {padding:72px 0 0px;}
#svisualLayout .titleWrap h2{position:relative;font-size:3rem;line-height:3.2rem;font-weight:600;animation:fadein 1s;}
#svisualLayout .titleWrap p{margin:16px 0;font-size:1.25rem;}
#svisualLayout .titleWrap p span{color:#008DB1;}

@keyframes kenburns-bottom {
  0% {  transform: scale(1) translateY(0);transform-origin: 50% 84%;  }
  100% { transform: scale(1.1) translateY(15px);transform-origin: bottom; }
}

#snb{height:60px;border:solid #ededed;border-width:1px 0;background:#fff;}
#snb .snb > ul > li > a{position:relative;height:60px;display: flex;align-items: center;justify-content: space-between;}
#snb .snb > ul > li > a span{margin-left:8px;width:20px;height:20px;border-radius:50%;background:url("../img/breadcrumb_ico02.png") 50% 50% no-repeat;}
#snb .snb > ul > li:not(:first-child){min-width:200px;}

#snb .snb .home p{padding:0 2rem;display:inline-block;width:24px;height:24px;font-size:0;background:url("../img/breadcrumb_ico01.png") 50% 50% no-repeat;}
#snb .snb_lev1{position:relative;}
#snb .snb_lev1 > a{padding:0 24px;font-size:.875rem;color:#000;}
#snb .snb_lev1 > a > p{min-width:60px;}
#snb .snb > ul > li{border-left:1px solid #ddd;}
#snb .snb > ul > li:last-child{border-right:1px solid #ddd;}
#snb .snb > ul > li.snb_lev1:last-child a p{color:#000;font-weight:700;}
#snb .snb_lev1 .snb_lev2{display:none;position:absolute;top:58px;left:0;width:100%;background:#fff;border:1px solid #ddd;font-size:.875rem;z-index:10;}
#snb .snb_lev1 .snb_lev2 > li > a{display:block;padding:1rem .875rem;border-bottom:1px solid #eee;font-weight:700;}
#snb .snb_lev1 .snb_lev2 > li.on > a{color:#e9554c;background:rgba(231, 109, 76, 0.2);}
#snb .snb_lev1 .snb_lev2 > li > a:hover{background:#333;color:#fff;}
#snb .snb_unit {position:absolute;top: 13px;right:0;}
#snb .snb_unit a{width:32px;height:32px;border-radius:4px;background:url("../img/breadcrumb_ico03.png") center center no-repeat ;font-size:0;vertical-align:top;border:1px solid #ddd;}

#subWrap{min-height:600px;padding-bottom:80px;}
#subWrap .sub_h2{padding:60px 0 0;text-align:center;margin-bottom:80px;}
#subWrap .sub_h2 h3 {position:relative;font-size:2.625rem;font-weight:700;}

/* 탭메뉴 */
.sub_dep3 .dep3_tab {margin-bottom:50px;display:flex;}
.sub_dep3 .dep3_tab li{border: 1px solid #ddd;border-bottom:1px solid #121212;text-align: center;font-weight: 500;color: #858585;border-radius: 7px 7px 0 0;background:#F2F4F7;}
.sub_dep3 .dep3_tab li.on {font-weight: 600;position: relative;color:#121212;border-color:#121212;background:#fff;border-bottom:1px solid transparent}
.sub_dep3 .dep3_tab li:not(.on):hover {background:#fafafa;font-weight: 600;}
.sub_dep3 .dep3_tab li a {display:block;padding: 20px 0;font-size: 1.125rem;}
.sub_dep3 .dep3_tab.col2 li {width: 50%;}
.sub_dep3 .dep3_tab.col3 li {width: calc(100% / 3);}
.sub_dep3 .dep3_tab.col4 li {width: 25%;}
.sub_dep3 .dep3_tab.col5 li {width: 20%;}

/* hidden */
#hd_login_msg, .tnb, .sns_box {display:none;}

/* 레이어 팝업  */
#pop{position:fixed;top:0;left:0;right:0;width:100%;height:100%;background:rgba(16,24,40,.85);z-index:999;animation:up .6s both;}
#pop .in_box {display:flex;flex-wrap:wrap;justify-content:center;align-items:center;height: 100%;overflow-y:auto;padding:32px;}
#pop .popup_list_wp{animation:up .8s both;animation-delay: .4s;}
#pop .popup_title {color:#fff;}
#pop .popup_sd{margin:32px auto}
#pop .popup_sd .item a{display:block;padding: 0 1rem;height:320px;width:100%;}
#pop .popup_sd .item a .pop_img{width: 100%;height: 100%;overflow:hidden;border-radius:8px}
#pop .popup_sd .pop_img img{width: 100%;height: 100%;}
#pop .popup_unit_bottom{display:flex;align-items:center;justify-content: center;margin-top:32px}
#pop .popup_unit_bottom * + *{margin-left:8px}
#pop .popup_sd .slick-list {padding:0 !important}

/* slick-nav */
#pop .popup_list_wp .slick-nav a{border-radius:50%;z-index:90;}
#pop .popup_list_wp .slick-nav a.slick-prev,
#pop .popup_list_wp .slick-nav a.slick-next{position:absolute;background-color:rgba(255,255,255,.8);width:62px;height:62px;top:50%;margin-top:-31px;}
#pop .popup_list_wp .slick-nav a.slick-prev{background-position:-400px -44px;left:-62px;}
#pop .popup_list_wp .slick-nav a.slick-next{background-position:-462px -44px;right:-62px;}
#pop .popup_list_wp .slick-nav a.slick-prev:hover,
#pop .popup_list_wp .slick-nav a.slick-next:hover{background-color:rgba(255,255,255,1);}
#pop .popup_list_wp .slick-nav-center{ display:flex;justify-content: center;width:100%;}
#pop .popup_list_wp .slick-nav-center > *{margin:0 4px}
#pop .popup_list_wp .slick-nav a.slick-stop,
#pop .popup_list_wp .slick-nav a.slick-play{width:40px;height:40px;background-color:#fff;}
#pop .popup_list_wp .slick-nav a.slick-stop{background-position:-79px -56px;}
#pop .popup_list_wp .slick-nav a.slick-play{background-position:-118px -56px;}
#pop .popup_list_wp .slick-pop-dost{order: -1;}
#pop .popup_list_wp .slick-controls.dp_none{display:none;}