@charset "utf-8";

.inner {position:relative;width:100%;max-width:1200px;margin:0 auto}
@media screen and (max-width:1200px){
    .inner {max-width:100%;padding:0 2.056rem}
}
@media screen and (max-width:854px){
    .inner {max-width:100%;padding:0 0.9rem}
}

#wrap {position:relative;width:100%;margin:0 auto}

/* header */
#header {position:relative;width:100%;}
#header .header_inner {position:relative;}
#header .logo {float:left;position:relative;width:11.45rem;padding-top:0.55rem}
#header .logo a {display:block;position:relative;width:11.45rem;height:3.2rem;background:url(../imgs/common/logo.png) no-repeat 0 0;background-size:100% auto}
#header #gnb {float:right;position:relative;width:calc(100% - 11.45rem);text-align:right;}
#header #gnb .gnb_list {position:relative;}
#header #gnb .gnb_list .gnb_menu {display:inline-block;margin-left:-5px;}
#header #gnb .gnb_list .gnb_menu .gnb_tit {
    display:block;
    position:relative;
    padding:0 1.2rem;
    line-height:4.25rem;
    font-size:0.9rem;
    color:#222;
    font-weight:500;
}
#header #gnb .gnb_list .gnb_menu .gnb_tit:after{
    content:"";
    display:block;
    position:absolute;
    top:1.8rem;
    right:0;
    width:1px;
    height:0.75rem;
    background-color:#aaa;
}
#header #gnb .gnb_list .gnb_menu:last-child .gnb_tit:after {display:none;}
#header #gnb .gnb_list .gnb_menu:first-child .gnb_tit {padding-left:0}
#header #gnb .gnb_list .gnb_menu:last-child .gnb_tit {padding-right:0}
#header #gnb .gnb_list .gnb_menu.active .gnb_tit,
#header #gnb .gnb_list .gnb_menu .gnb_tit:hover {color:#034b9a}
#header .lnb {display:none;position:absolute;top:3.5rem;z-index:999}
#header .lnb ul {position:relative;background-color:rgba(0,73,156,0.95);width:10.5rem}
#header .lnb ul:before {
    content:"";
    display:block;
    position:absolute;
    top:-0.6rem;
    left:50%;
    width:0.7rem;
    height:0.6rem;
    transform:translateX(-50%);
    background:url(../imgs/common/lnb_arr.png) no-repeat 0 0;
    background-size:100% auto;
}
#header .lnb ul:after {display:block;content:"";clear:both;}
#header .lnb ul li {padding:0.75rem 0;border-bottom:1px solid rgba(255,255,255,0.3)}
#header .lnb ul li a {display:block;position:relative;line-height:1;color:#fff;font-size:0.8rem;text-align:center;}
#header .lnb ul li a:hover {color:#f5ff5b}
#header .lnb.lnb1 {margin-left:-3.55rem}
#header .lnb.lnb2 {margin-left:-2.05rem}
#header .lnb.lnb3 {margin-left:-2rem;}
#header .lnb.lnb4 {margin-left:-2.05rem;}
#header .lnb.lnb5 {margin-left:-1.1rem;}
#header::after {
    content:"";
    display:block;
    position:absolute;
    bottom:0;
    width:100%;
    height:0.2rem;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1777a9+0,03a8d8+100 */
    background: #1777a9; /* Old browsers */
    background: -moz-linear-gradient(-45deg,  #1777a9 0%, #03a8d8 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  #1777a9 0%,#03a8d8 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  #1777a9 0%,#03a8d8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1777a9', endColorstr='#03a8d8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */    
} 
#header .utile {
    width:100%;
    border-bottom:1px solid #ccc;
    padding:6px 0;
    font-size:0.65rem;
    color:#8b8b8b;
    text-align:right;
}
#header .utile-link {
    display:inline-block;
    font-size:0.6rem;
    color:#8b8b8b;
    line-height:1;
}
#header .utile-link + .utile-link {margin-left:1rem}
#header .utile-link i {font-size:0.75rem}
@media screen and (max-width:1129px){
    #header #gnb .gnb_list .gnb_menu .gnb_tit {padding:0 0.5rem;}
}
@media screen and (max-width:1000px){
    #header #gnb {display:none;}
    #header .utile {padding:9px 0}
    #header .utile-link {font-size:0.8rem}
    #header .utile-link i {font-size:0.9rem}
}

/* footer */
#footer {padding:2rem 0;background-color:#444444;}
#footer .footer_content {position:relative;} 
#footer .footer_content .logo {float:left;position:relative;}
#footer .footer_content .logo a {display:block;position:relative;width:11.45rem;height:3.2rem;background:url(../imgs/common/f_logo.png) no-repeat 0 0;background-size:100% auto}
#footer .footer_content .footerdiv {float:right;position:relative;width:calc(100% - 11.45rem);padding-left:2rem}
#footer .footer_content .footerdiv .tit {font-size:0.75rem;line-height:1;color:#cccccc;font-weight:400}
#footer .footer_content .footerdiv .info {margin-top:0.5rem;font-size:0.75rem;color:#ccc;line-height:1.2}
#footer .footer_content .footerdiv span {display:inline-block;position:relative;vertical-align:middle;margin-left:-5px;padding:0 0.4rem}
#footer .footer_content .footerdiv span:after {
    content:"";
    display:block;
    position:absolute;
    top:3px;
    right:0;
    width:1px;
    height:0.65rem;
    background-color:#ccc;
}
#footer .footer_content .footerdiv .info span:first-child {padding-left:0;margin-left:0}
#footer .footer_content .footerdiv .info span:last-child {padding-right:0}
#footer .footer_content .footerdiv .info span:last-child:after {display:none;}
#footer .footer_content .footerdiv address {margin-top:0.5rem;font-size:0.75rem;color:#ccc;line-height:1.2}
#footer .footer_content .footerdiv address span:first-child {padding-left:0;margin-left:0}
#footer .footer_content .footerdiv address span:last-child {padding-right:0}
#footer .footer_content .footerdiv address span:last-child:after {display:none;}
#footer .footer_content .footerdiv .copy {margin-top:0.5rem;color:#ccc;font-size:0.75rem;line-height:1.2}
@media screen and (max-width:846px){
    #footer .footer_content .logo {float:none}
    #footer .footer_content .footerdiv {float:none;width:100%;padding-left:0;margin-top:1rem}
}

/* nav */
#navigation {position:relative;background-color:rgba(70,70,70,0.80);z-index:10;margin-top:-2.25rem}
#navigation .curmb {width:100%;position:relative;}
#navigation .curmb li.c_menu {float:left;position:relative;width:10.85rem;border:1px solid rgba(255,255,255,0.30);border-width:0px 1px 0px;margin-left:-1px}
#navigation .curmb li.c_menu.fst {width:2.5rem;text-align:center;padding-left:0}
#navigation .curmb li.c_menu.fst .home_ico {display:block;width:100%;height:2.25rem;background-repeat:no-repeat;background-position:50% 50%;background-size:1.2rem 0.95rem}
#navigation .curmb li.c_menu.fst .home_ico {background-image:url(../imgs/sub/home_ico.png)}
#navigation .curmb li.c_menu .c_tit {display:block;position:relative;padding-left:0.95rem;padding-right:1.85rem;line-height:2.25rem;color:#fff;font-size:0.85rem}
#navigation .curmb li.c_menu .c_tit {width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;overflow: hidden;background-color:transparent;text-align:left;font-family: "Noto Sans KR","Nanum Gothic","Gulim", Gulim, Dotum, "돋움";}
#navigation .curmb li.c_menu .c_tit:after {
    display:block;
    content:"";
    position:absolute;
    top:0.8rem;
    right:0.8571rem;
    width:0.7rem;
    height:0.6rem;
    background-repeat:no-repeat;
    background-size:100% auto;
    background-position:50% 50%;
    background-image:url(../imgs/sub/nav_arr.png);
}
#navigation .curmb li.c_menu.c_menu_dept2 {width:15rem}
#navigation .curmb .sub_crumb {display:none;position:absolute;top:2.25rem;left:0;width:100%;background-color:#787878;z-index:3}
#navigation .curmb .sub_crumb ul {width:100%;}
#navigation .curmb .sub_crumb ul li a {display:block;padding-left:0.75rem;line-height:2rem;color:#fff;font-size:0.8rem;border-top:1px solid rgba(70,70,70,0.3);overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
#navigation .curmb .sub_crumb ul li a:hover,
#navigation .curmb .sub_crumb ul li.on a {color:#d2fc0d}
#navigation .curmb li.c_menu:hover .sub_crumb {display:block}
@media screen and (max-width:760px){
    #navigation .curmb li.c_menu.fst {display:none}
    #navigation .curmb li.c_menu {width:50%}
    #navigation .curmb li.c_menu.c_menu_dept2 {width:50%}
}


#quick._fix {position:fixed;top:initial;bottom:20rem}
#quick._move2 {position:fixed;bottom:initial;top:9.1rem}
#quick {position:absolute;width:7.3rem;bottom:36rem;right:0;text-align:right;z-index:20;transition:all 0.3s ease;box-shadow:-1px 0 8px rgba(11,3,6,0.26);}
#quick .quick_cont {padding:1.5rem 0 1.15rem;background-color:#ffda0b;background-image:url(../imgs/common/quick_bg.png);background-repeat:no-repeat;background-size:cover;background-position:50% 50%;}
#quick .quick_cont .tit {line-height:0;text-align:center;}
#quick .quick_cont .tit img {max-width:6.1rem;height:auto;}
#quick .quick_cont ul {margin-top:0.45rem}
#quick .quick_cont ul li {text-align:center;margin-bottom:0.25rem}
#quick .quick_cont ul li:last-child {margin-bottom:0}
#quick .quick_cont ul li img {max-width:5.25rem;height:auto}
#quick #top_btn {display:block}
#quick #top_btn img {max-width:100%;height:auto}
@media screen and (max-width:1602px){
    #quick {display:none;}
}

/* mobile gnb */
#mobile_gnb {
    display:none;
    position:fixed;
    top:0px;
    right:0px;
    width:100%;
    height:100%;
    margin:0;
    padding-top:0px;    
    overflow:hidden;
    overflow-y:auto;
    z-index:999;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0354cd+0,07ba9f+100 */
background: #0354cd; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #0354cd 0%, #07ba9f 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #0354cd 0%,#07ba9f 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #0354cd 0%,#07ba9f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0354cd', endColorstr='#07ba9f',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
#mobile_gnb:before,
#mobile_gnb:after {
    content:"";
    position:fixed;
    top:4rem;
    height:calc(100vh - 4rem);
}
#mobile_gnb:before {
    display:none;
    width:43%;    
    background-color:rgba(0,73,156,0.10)
}
#mobile_gnb .head {position:relative;text-align:left;line-height:4rem}
#mobile_gnb .head .tit {display:inline-block;text-align:left;color:#fff;font-weight:500;font-size:1rem;line-height:4rem;padding-left:0.5rem}
#mobile_gnb #gnb_close {
    display:block;
    position:absolute;
    top:0;
    right:0;
    font-size:2rem;
    width:4rem;
    height:4rem;
    z-index:100;
    cursor:pointer;
    background-color:transparent;
    border:0;
    line-height:2.4rem;
    color:#fff;
    padding:0;
}
#mobile_gnb {transform:translateX(100%);-webkit-transform:translateX(100%);-moz-transform:translateX(100%);-ms-transform:translateX(100%);transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1), -webkit-transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1);}
#mobile_gnb .utile {position:relative;padding:0.6364rem;background-color:#fff}
#mobile_gnb .utile ul {margin:-0.09091rem}
#mobile_gnb .utile ul li {float:left;position:relative;width:33.333333333333%;padding:0.09091rem}
#mobile_gnb .utile ul li a {display:block;background-color:#666;color:#fff;text-align:center;font-size:1rem;line-height:3.5rem}
#mobile_gnb .mgnb_list {padding:0;clear:both}
#mobile_gnb .mgnb_list .mgnb_menu:first-child {border-top:1px solid #fff}
#mobile_gnb .mgnb_list .mgnb_tit {display:block;width:43%;position:relative;padding:1rem 2rem 1rem 0.5rem;font-size:1rem;line-height:1.2;font-weight:400;color:#fff}
#mobile_gnb .mgnb_list .mgnb_tit:before,
#mobile_gnb .mgnb_list .mgnb_tit:after {
    display:block;
    content:"";
    position:absolute;
    top:50%;
    transform:translateY(-50%);
}
#mobile_gnb .mgnb_list .mgnb_tit:before{
    display:none;
    top:50%;
    left:0.4545rem;
    width:1rem;
    height:1rem;
    background:url(../imgs/common/m_gnb_dot.png) no-repeat;
    background-size:100% auto;
    transform:translateY(-58%);
}
#mobile_gnb .mgnb_list .mgnb_tit:after{
    right:0.8182rem;
    width:0.9091rem;
    height:0.8182rem;
    background:url(../imgs/common/m_gnb_arr_on2.png) no-repeat;
    background-size:100% auto;
}
#mobile_gnb .mgnb_list .mgnb_menu:after {display:block;content:"";clear:both}
#mobile_gnb .mgnb_list .mgnb_menu {width:100%;}
#mobile_gnb .mgnb_list .mgnb_menu.active .mgnb_tit {font-weight:500;background-color:#0354cd;}
#mobile_gnb .mgnb_list .mgnb_menu.active .mgnb_tit:after {
    width:0.9091rem;
    height:0.8182rem;
    background:url(../imgs/common/m_gnb_arr_on2.png) no-repeat;
    background-size:100% auto;
}
#mobile_gnb .mlnb_tit {display:block;width:100%;position:relative;padding:1rem 2rem 1rem;font-size:1rem;line-height:1.2;color:#fff}
#mobile_gnb .mlnb_tit:before {
    display:block;
    content:"";
    position:absolute;
    top:1.5rem;
    left:1rem;
    width:0.3rem;
    height:0.3rem;
    background-color:#fff;
}
#mobile_gnb .t2:after {
    display:block;
    content:"\f2c7";
    position:absolute;
    top:15px;
    font-family: "Ionicons";
    right:15px;    
    transition:all 0.3s ease;
}
#mobile_gnb .mgnb_list .mlnb ul li.active .t2:after {
    content:"\f2f4";
}
#mobile_gnb .t3:after {
    display:block;
    content:"\f2c7";
    position:absolute;
    top:15px;
    font-family: "Ionicons";
    right:15px;    
    transition:all 0.3s ease;
}
#mobile_gnb .mgnb_list .sub_lnb4 ul li.active .t3:after {
    content:"\f2f4";
}

#mobile_gnb .sub_lnb ul li a {border-bottom:1px dotted #fff}
#mobile_gnb .sub_lnb ul li:last-child a {border-bottom:0}
#mobile_gnb .sub_lnb ul li a {display:block;width:100%;position:relative;padding:1rem 2rem 1rem;background-color:#999;font-size:1rem;line-height:1.2;color:#fff}
#mobile_gnb .sub_lnb ul li a:hover,
#mobile_gnb .sub_lnb ul li.active a {font-weight:700}
#mobile_gnb .mgnb_list {position:relative;width:100%;}
#mobile_gnb .mgnb_list .mlnb {position:absolute;top:1px;left:43%;width:65%;height:100%;z-index:2;display:none;}
#mobile_gnb .mgnb_list .mlnb ul li {}
#mobile_gnb .mgnb_list .sub_lnb {display:none}
#mobile_gnb .mgnb_list .sub_lnb ul li {border-bottom:0}
#mobile_gnb .mgnb_list .mlnb ul li.active .sub_lnb {display:block}
#mobile_gnb .mgnb_list .mlnb ul li.active .mlnb_tit {font-weight:500;background-color:rgba(6,153,174,0.20)}
#mobile_gnb .sub_lnb4 {display:none;}
#mobile_gnb .sub_lnb4 ul li a {display:block;width:100%;position:relative;padding:1rem 2rem 1rem;background-color:#f1f1f1;font-size:1rem;line-height:1.2;color:#222;}
#mobile_gnb .sub_lnb ul li .sub_lnb4 ul li a {font-weight:400;}
#mobile_gnb .sub_lnb ul li .sub_lnb4 ul li.active a,
#mobile_gnb .sub_lnb ul li .sub_lnb4 ul li a:hover {font-weight:700 !important;color:#000}
#mobile_gnb .mgnb_list .sub_lnb ul li.active .sub_lnb4 {display:block;}



.mobile_open #mobile_gnb {transform:translateX(0);-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);}
.mobile_open #mobile_gnb:before {display:block;}
.menu_overlay {display:none;position:fixed;top:0;bottom:0;display:none;left:0;right:0;background-color:rgba(0,0,0,0);z-index:99}
.mobile_open .menu_overlay {display:block}
.menu_overlay button {color:#fff;display:block;font-size:40px;position:absolute;left:25.45rem;width:50px;height:50px;z-index:100;cursor:pointer;background-color:transparent;border:0;line-height: 48px;}
.menu_open {display:none;position:absolute;top:0;right:-0.9rem;width:4.25rem;height:4.25rem;z-index:5;cursor:pointer;color:#333;font-size:30px;line-height:3.857rem;}
.menu_open .menu_btn {display:inline-block;position:relative;padding:0;width:4.25rem;height:4.25rem;background:url(../imgs/common/a_menu_fixed.png) no-repeat 50% 50%;background-size:2rem auto;transition:all 0.3s ease;}
#header_wrap.fixed .menu_open .menu_btn {background:url(../imgs/common/a_menu_fixed.png) no-repeat 50% 50%;background-size:2rem auto;}
@media screen and (max-width:1000px){
    .menu_open,
	#mobile_gnb {display:block;}
    #header .header_inner {height:4.5rem}
}


.mobile_open {overflow:hidden;}



.sub_visual {position:relative;height:8.5rem;background-size:cover;background-repeat:no-repeat;background-position:50% 50%;}
.sub_visual.bg1 {background-image:url(../imgs/sub/sub_bg_01.jpg)}
.sub_visual.bg2 {background-image:url(../imgs/sub/sub_bg_02.jpg)}
.sub_visual.bg3 {background-image:url(../imgs/sub/sub_bg_03.jpg)}
.sub_visual.bg4 {background-image:url(../imgs/sub/sub_bg_04.jpg)}

#sub_content {margin-top:3.15rem;padding-bottom:3.15rem}
#sub_content .page_title {display:block;position:relative;padding-left:1rem;padding-bottom:0.7rem;margin-bottom:1.65rem;border-bottom:1px solid #aaa;font-size:1.35rem;color:#222;font-weight:500;line-height:1;}
#sub_content .page_title:before {
    content:"";
    display:block;
    position:absolute;
    top:0.2rem;
    left:0;
    width:0.35rem;
    height:1.15rem;
    background:url(../imgs/sub/tit_bg.png) no-repeat;
    background-size:100% auto;
}
@media screen and (max-width:800px){
    #sub_content {margin-top:2rem;padding-bottom:2rem}
}

.mt30 {margin-top:1.5rem}
.mt60 {margin-top:3rem}