@charset "utf-8";

/*
------------------------------------------------------------
C O M M O N
------------------------------------------------------------
*/

/* position */
.abs {position: absolute;}
.rel {position: relative;}

.abs.hac {left: 50%; transform: translate(-50%);}
.abs.lt {left: -1px; top: -1px; z-index: 1; border-radius: 0;}
.abs.rt {right: -1px; top :-1px; z-index: 1; border-radius: 0;}
.abs.lb {left: -1px; bottom: -1px; z-index: 1; border-radius: 0;}
.abs.rb  {right: -1px; bottom: -1px; z-index: 1; border-radius: 0;}

.t0 {top: 0;}
.r0 {right: 0;}
.b0 {bottom: 0;}
.l0 {left: 0;}

/* border-radius */
.br{border-radius: 999px;}
.br_5 {border-radius: 5px;}
.br_10 {border-radius: 10px;}
.br_15 {border-radius: 15px;}
.br_20 {border-radius: 20px;}
.br_25 {border-radius: 25px;}
.br_30 {border-radius: 30px;}
.br_35 {border-radius: 35px;}
.br_40 {border-radius: 40px;}

.br_t {border-top-left-radius: 999px; border-top-right-radius: 999px;}
.br_b  {border-bottom-left-radius: 999px; border-bottom-right-radius: 999px; height: 50%;}
.br_l {border-top-left-radius: 999px; border-bottom-left-radius: 999px;}
.br_r {border-top-right-radius: 999px; border-bottom-right-radius: 999px;}

.br_l_0 {border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important;}
.br_l_5 {border-top-left-radius: 5px; border-bottom-left-radius: 5px;}
.br_l_10 {border-top-left-radius: 10px; border-bottom-left-radius: 10px;}
.br_l_20 {border-top-left-radius: 20px; border-bottom-left-radius: 20px;}
.br_l_30 {border-top-left-radius: 30px; border-bottom-left-radius: 30px;}

.br_r_0 {border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important;}
.br_r_5 {border-top-right-radius: 5px; border-bottom-right-radius: 5px;}
.br_r_10 {border-top-right-radius: 10px; border-bottom-right-radius: 10px;}
.br_r_20 {border-top-right-radius: 20px; border-bottom-right-radius: 20px;}
.br_r_30 {border-top-right-radius: 30px; border-bottom-right-radius: 30px;}

.br_t_0 {border-top-left-radius: 0 !important; border-top-right-radius: 0 !important;}
.br_t_5 {border-top-left-radius: 5px !important; border-top-right-radius: 5px !important;}
.br_t_10 {border-top-left-radius: 10px; border-top-right-radius: 10px;}
.br_t_20 {border-top-left-radius: 20px; border-top-right-radius: 20px;}
.br_t_30 {border-top-left-radius: 30px; border-top-right-radius: 30px;}

.br_b_0 {border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important;}
.br_b_5 {border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;}
.br_b_10 {border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
.br_b_20 {border-bottom-left-radius: 20px; border-bottom-right-radius: 20px;}
.br_b_30 {border-bottom-left-radius: 30px; border-bottom-right-radius: 30px;}

.br_tl_0 {border-top-left-radius: 0 !important;}
.br_tl_10 {border-top-left-radius: 10px;}
.br_tr_10 {border-top-right-radius: 10px;}
.br_bl_10 {border-bottom-left-radius: 10px;}
.br_br_10 {border-bottom-right-radius: 10px;}


/* opacity */
.op1 {opacity: .1;}
.op2 {opacity: .2;}
.op3 {opacity: .3;}
.op4 {opacity: .4;}
.op5 {opacity: .5;}
.op6 {opacity: .6;}
.op7 {opacity: .7;}
.op8 {opacity: .8;}
.op9 {opacity: .9;}

/* text-align */
.tal {text-align: left !important;}
.tac {text-align: center !important;}
.tar {text-align: right !important;}

/* background */
.bg {}

/* border */
.bd {}

/* width */
.w_1 {width: 1px !important;}
.w_5 {width: 5px !important;}
.w_10 {width: 10px !important;}
.w_15 {width: 15px !important;}
.w_20 {width: 20px !important;}
.w_25 {width: 25px !important;}
.w_30 {width: 30px !important;}
.w_35 {width: 35px !important;}
.w_40 {width: 40px !important;}
.w_45 {width: 45px !important;}
.w_50 {width: 50px !important;}
.w_55 {width: 55px !important;}
.w_60 {width: 60px !important;}
.w_65 {width: 65px !important;}
.w_70 {width: 70px !important;}
.w_75 {width: 75px !important;}
.w_80 {width: 80px !important;}
.w_85 {width: 85px !important;}
.w_90 {width: 90px !important;}
.w_95 {width: 95px !important;}
.w_100 {width: 100px !important;}
.w_110 {width: 110px !important;}
.w_120 {width: 120px !important;}
.w_130 {width: 130px !important;}
.w_140 {width: 140px !important;}
.w_150 {width: 150px !important;}
.w_160 {width: 160px !important;}
.w_170 {width: 170px !important;}
.w_180 {width: 180px !important;}
.w_190 {width: 190px !important;}
.w_200 {width: 200px !important;}
.w_250 {width: 250px !important;}
.w_300 {width: 300px !important;}
.w_350 {width: 350px !important;}
.w_400 {width: 400px !important;}
.w_450 {width: 450px !important;}
.w_500 {width: 500px !important;}
.w_550 {width: 550px !important;}
.w_600 {width: 600px !important;}
.w_650 {width: 650px !important;}
.w_700 {width: 700px !important;}
.w_750 {width: 750px !important;}
.w_800 {width: 800px !important;}
.w_850 {width: 850px !important;}
.w_900 {width: 900px !important;}
.w_950 {width: 950px !important;}
.w_1000 {width: 1000px !important;}

.w10 {width: 10% !important;}
.w20 {width: 20% !important;}
.w30 {width: 30% !important;}
.w40 {width: 40% !important;}
.w50 {width: 50% !important;}
.w60 {width: 60% !important;}
.w70 {width: 70% !important;}
.w80 {width: 80% !important;}
.w90 {width: 90% !important;}
.w100 {width: 100% !important;}
.w110 {width: 110% !important;}
.w120 {width: 120% !important;}
.w130 {width: 130% !important;}
.w140 {width: 140% !important;}
.w150 {width: 150% !important;}

.w_1_2 {width: 50% !important;}
.w_1_3 {width: 33% !important;}
.w_2_3 {width: 66% !important;}

/* height */
.h_1 {height: 1px !important;}
.h_5 {height: 5px !important;}
.h_10 {height: 10px !important;}
.h_15 {height: 15px !important;}
.h_20 {height: 20px !important;}
.h_25 {height: 25px !important;}
.h_30 {height: 30px !important;}
.h_35 {height: 35px !important;}
.h_40 {height: 40px !important;}
.h_45 {height: 45px !important;}
.h_50 {height: 50px !important;}
.h_55 {height: 55px !important;}
.h_60 {height: 60px !important;}
.h_65 {height: 65px !important;}
.h_70 {height: 70px !important;}
.h_75 {height: 75px !important;}
.h_80 {height: 80px !important;}
.h_85 {height: 85px !important;}
.h_90 {height: 90px !important;}
.h_95 {height: 95px !important;}
.h_100 {height: 100px !important;}
.h_110 {height: 110px !important;}
.h_120 {height: 120px !important;}
.h_130 {height: 130px !important;}
.h_140 {height: 140px !important;}
.h_150 {height: 150px !important;}
.h_160 {height: 160px !important;}
.h_170 {height: 170px !important;}
.h_180 {height: 180px !important;}
.h_190 {height: 190px !important;}
.h_200 {height: 200px !important;}
.h_250 {height: 250px !important;}
.h_300 {height: 300px !important;}
.h_350 {height: 350px !important;}
.h_400 {height: 400px !important;}
.h_450 {height: 450px !important;}
.h_500 {height: 500px !important;}

.h_a {height: available !important;}
.h10 {height: 10% !important;}
.h20 {height: 20% !important;}
.h30 {height: 30% !important;}
.h40 {height: 40% !important;}
.h50 {height: 50% !important;}
.h60 {height: 60% !important;}
.h70 {height: 70% !important;}
.h80 {height: 80% !important;}
.h90 {height: 90% !important;}
.h100 {height: 100% !important;}

.mh_5 {min-height: 5px !important;}
.mh_10 {min-height: 10px !important;}
.mh_15 {min-height: 15px !important;}
.mh_20 {min-height: 20px !important;}
.mh_25 {min-height: 25px !important;}
.mh_30 {min-height: 30px !important;}
.mh_35 {min-height: 35px !important;}
.mh_40 {min-height: 40px !important;}
.mh_45 {min-height: 45px !important;}
.mh_50 {min-height: 50px !important;}
.mh_55 {min-height: 55px !important;}
.mh_60 {min-height: 60px !important;}
.mh_65 {min-height: 65px !important;}
.mh_70 {min-height: 70px !important;}
.mh_75 {min-height: 75px !important;}
.mh_80 {min-height: 80px !important;}
.mh_85 {min-height: 85px !important;}
.mh_90 {min-height: 90px !important;}
.mh_95 {min-height: 95px !important;}
.mh_100 {min-height: 100px !important;}

.mh10 {min-height: 10% !important;}
.mh20 {min-height: 20% !important;}
.mh30 {min-height: 30% !important;}
.mh40 {min-height: 40% !important;}
.mh50 {min-height: 50% !important;}
.mh60 {min-height: 60% !important;}
.mh70 {min-height: 70% !important;}
.mh80 {min-height: 80% !important;}
.mh90 {min-height: 90% !important;}

/* margin-top */
.mt_0 {margin-top: 0 !important;}
.mt_2 {margin-top: 2px !important;}
.mt_5 {margin-top: 5px !important;}
.mt_10 {margin-top: 10px !important;}
.mt_15 {margin-top: 15px !important;}
.mt_20 {margin-top: 20px !important;}
.mt_25 {margin-top: 25px !important;}
.mt_30 {margin-top: 30px !important;}
.mt_35 {margin-top: 35px !important;}
.mt_40 {margin-top: 40px !important;}
.mt_45 {margin-top: 45px !important;}
.mt_50 {margin-top: 50px !important;}
.mt_60 {margin-top: 60px !important;}
.mt_70 {margin-top: 70px !important;}
.mt_80 {margin-top: 80px !important;}
.mt_90 {margin-top: 90px !important;}
.mt_100 {margin-top: 100px !important;}
.mt_120 {margin-top: 120px !important;}
.mt_140 {margin-top: 140px !important;}
.mt_160 {margin-top: 160px !important;}
.mt_180 {margin-top: 180px !important;}
.mt_200 {margin-top: 200px !important;}

/* margin-bottom */
.mb_0 {margin-bottom: 0 !important;}
.mb_2 {margin-bottom: 2px !important;}
.mb_5 {margin-bottom: 5px !important;}
.mb_10 {margin-bottom: 10px !important;}
.mb_15 {margin-bottom: 15px !important;}
.mb_20 {margin-bottom: 20px !important;}
.mb_25 {margin-bottom: 25px !important;}
.mb_30 {margin-bottom: 30px !important;}
.mb_35 {margin-bottom: 35px !important;}
.mb_40 {margin-bottom: 40px !important;}

/* margin-top, margin-bottom */
.mtb_10 {margin-top: 10px !important; margin-bottom: 10px !important;}
.mtb_15 {margin-top: 15px !important; margin-bottom: 15px !important;}
.mtb_20 {margin-top: 20px !important; margin-bottom: 20px !important;}
.mtb_40 {margin-top: 40px !important; margin-bottom: 40px !important;}

/* margin-left */
.ml_0 {margin-left: 0 !important;}
.ml_5 {margin-left: 5px !important;}
.ml_10 {margin-left: 10px !important;}
.ml_15 {margin-left: 15px !important;}
.ml_20 {margin-left: 20px !important;}
.ml_25 {margin-left: 25px !important;}
.ml_30 {margin-left: 30px !important;}
.ml_35 {margin-left: 35px !important;}
.ml_40 {margin-left: 40px !important;}
.ml_45 {margin-left: 45px !important;}
.ml_50 {margin-left: 50px !important;}

/* margin-right */
.mr_0 {margin-right: 0 !important;}
.mr_5 {margin-right: 5px !important;}
.mr_10 {margin-right: 10px !important;}
.mr_15 {margin-right: 15px !important;}
.mr_20 {margin-right: 20px !important;}
.mr_25 {margin-right: 25px !important;}
.mr_30 {margin-right: 30px !important;}
.mr_35 {margin-right: 35px !important;}
.mr_40 {margin-right: 40px !important;}

/* padding */
.pd_0 {padding: 0 !important;}
.pd_5 {padding: 5px !important;}
.pd_10 {padding: 10px !important;}
.pd_15 {padding: 15px !important;}
.pd_20 {padding: 20px !important;}
.pd_25 {padding: 25px !important;}
.pd_30 {padding: 30px !important;}
.pd_35 {padding: 35px !important;}
.pd_40 {padding: 40px !important;}

.pd_t_0 {padding-top: 0 !important;}
.pd_t_10 {padding-top: 10px !important;}
.pd_b_10 {padding-bottom: 10px !important;}

.pl_10 {padding-left: 10px !important;}
.pl_20 {padding-left: 20px !important;}

.pdt_0 {padding-top: 0 !important;}
.pdr_0 {padding-right: 0 !important;}
.pdb_0 {padding-bottom: 0 !important;}
.pdl_0 {padding-left: 0 !important;}

.pdb50 {padding-bottom: 50% !important;}



/* anchor */
body.sub .anc {background: #ffffff;}
body .anc>.anchor {position: absolute; top: -120px;}
body.home .anc>.container {text-align: center; color: #fff;}

body .content>div>.anchor,
body .content>div>div>.anchor,
body .content>div>div>div>.anchor {position: absolute; top: -150px;}

/* motion */
.mtn {opacity: 0; transition: 1s; top: 50px  !important; scale: 1.04;}
.mtn.active {opacity: 1; top: 0 !important; scale: 1;}

/* motion home ? */
.mtn.mo {scale: 1; top: 50px;}
.mtn.mo.pic {scale: 1; top: 0;}
.mtn.mo .icon {scale: 1; background-color: #ffffff; color: #037CA6;}
.mtn.tr15 {transition-delay: 0s;}
.mtn.tr25 {transition-delay: .2s;}
.mtn.tbr_35 {transition-delay: .4s;}
.mtn.tr45 {transition-delay: .6s;}
.mtn.tr55 {transition-delay: .8s;}

.mtn.tr16 {transition-delay: 0s;}
.mtn.tr26 {transition-delay: .2s;}
.mtn.tr36 {transition-delay: .4s;}
.mtn.tr46 {transition-delay: .6s;}
.mtn.tr56 {transition-delay: .8s;}
.mtn.tr66 {transition-delay: 1s;}

.mtn.tr13 {transition-delay: 0s;}
.mtn.tbr_23 {transition-delay: .3s;}
.mtn.tr33 {transition-delay: .6s;}

/* show */
.shw {opacity: 0 !important; transition: 1s; top: 10px !important;}
.shw.active {opacity: 1 !important; top: 0 !important;}


.arrow_r {display: flex; align-items: center; justify-content: center;}

/* btn */
.btns {display: flex; align-items: flex-end; justify-content: flex-start; gap: 20px;}
.btns.fdr {flex-direction: row;}
.btns.fdc {flex-direction: column;}
.btn {cursor: pointer; position: relative; text-align: center;}





/*
------------------------------------------------------------
S T R U C T U R E
------------------------------------------------------------
*/

/* -------------------- #Hd -------------------- */
#Hd {}
#Hd>.bg {}
#Hd>.container {}
#Hd>.container>.bg {}

    /* ---------- #Hot ---------- */
    #Hot {}
    #Hot>.bg {}
    #Hot>.container {height: 20px;}
    #Hot>.container>.bg {}

    /* ---------- #Gnb ---------- */
    #Gnb {}
    #Gnb>.bg {}
    #Gnb>.container {}
    #Gnb>.container>.bg {}

/* ---------- #Vsl ---------- */
#Vsl {position: fixed; top: 0;z-index: 0;}
#Vsl>.bg {}
#Vsl>.container {}
#Vsl>.container>.bg {}

/* -------------------- #Wrap -------------------- */
#Wrap {display: flex; align-items: flex-start; justify-content: center; flex-wrap: wrap;}
#Wrap>.bg {}
#Wrap>.container {}
#Wrap>.container>.bg {}

    /* ---------- #Anc0 ---------- */
    #Anc0 {}
    #Anc0>.bg {}
    #Anc0>.container {}
    #Anc0>.container>.bg {}

/* -------------------- #Ft -------------------- */
#Ft {}
#Ft>.bg {}
#Ft>.container {}
#Ft>.container>.bg {}

    /* ---------- #Map ---------- */
    #Map {}
    #Map>.bg {}
    #Map>.container {}
    #Map>.container>.bg {}

    /* ---------- #Info ---------- */
    #Info {}
    #Info>.bg {}
    #Info>.container {}
    #Info>.container>.bg {}





/*
------------------------------------------------------------
N A V I G A T I O N
------------------------------------------------------------
*/

/* ---------- #NavMain ---------- */
#NavMain {}
#NavMain>.bg {}
#NavMain>.container {min-height: 96px;}
#NavMain>.container>.bg {}


#NavMain>.container ul>li.bm>a {font-size: 1.6rem; margin-top: 5px;}
#NavMain>.container ul>li>a>img {vertical-align: bottom;}
#NavMain>.container ul>li.bm>a>img {width: 150px;}
#NavMain>.container .brand>.flex {justify-content: left;}

@media (max-width: 640px) {
    #NavMain>.container ul>li.bm>a>img {width: 100px;}
}

#NavMain>.container ul li.mm {margin: 0 15px;}
#NavMain>.container ul li.mm>a {font-size: 1.8rem;}


#NavMain>.container ul li.am {margin: 0 10px;}
#NavMain>.container ul li.am>a {font-size: 1.3rem;}


/* -------------------- #NavSub -------------------- */
#NavSub {}
#NavSub>.bg {}
#NavSub>.container {}
#NavSub>.container>.bg {}

/* -------------------- #NavMbl -------------------- */
#NavMbl {display: none;
    position: fixed; top: 96px; z-index: 100; overflow-y: scroll; height: 100%; padding-bottom: 30%; background-color: #ffffff;}
#NavMbl>.bg {background-color: #ffffff; }
#NavMbl>.container {padding: 0 3%;}
#NavMbl>.container>.bg {}
#NavMbl>.container>.menu {width: 100%;}

#NavMbl>.container ul li.mm {margin: 10px 5px;}
#NavMbl>.container ul li.mm>a {font-size: 1.8rem; font-weight: 300; color: #2B2B2B;}

#NavMbl> .container ul li.mm ul {margin: 5px 0 0 20px;}
#NavMbl> .container ul li.mm ul li.sm {margin: 7px 0; font-size: 1.3rem; font-weight: 400;}
#NavMbl> .container ul li.mm ul li.sm>a {color: #919398;}
#NavMbl> .container ul li.mm ul li.sm>a:hover {color: #000000;}
#NavMbl> .container ul li.mm ul li.sm.focus>a {color: #000000;}

/* -------------------- #NavLeft -------------------- */
#NavLeft {}
#NavLeft>.bg {}
#NavLeft>.container {}
#NavLeft>.container>.bg {}


/* common .mm>span */
body.HdStatus #Gnb>.bg {background: transparent;}
body .container .mm>a {display: block; position: relative;font-size: 18px; font-weight: 500; color: #ffffff; z-index: 8;}
body .container .mm>a:hover {color: #eeeeee;}
body .container .mm.focus>a {color: #eeeeee;}
/* common .mm>.under */
body .container .mm>.under {position: absolute; width: 100%; height: 35px; border-bottom: solid 2px transparent; left: 0;}
body .container .mm.focus>.under {border-bottom-color: transparent;}
body.HdStatus .container .mm.m1.focus>.under {border-bottom-color: #0387B4;}
body.HdStatus .container .mm.m2.focus>.under {border-bottom-color: #00A7E0;}
body.HdStatus .container .mm.m3.focus>.under {border-bottom-color: #8CC051;}
body.HdStatus .container .mm.m4.focus>.under {border-bottom-color: #F6BB43;}
body.HdStatus .container .mm.m5.focus>.under {border-bottom-color: #C28E40;}
body.HdStatus .container .mm.m6.focus>.under {border-bottom-color: #919398;}
/* common .HdStatus .mm>a */
body.HdStatus #Gnb>.bg {background: #ffffff; border-bottom: 1px solid #C7C7C7;}
body.HdStatus .container .mm>a {color: #919398;}
body.HdStatus .container .mm>a:hover {color: #000000;}
body.HdStatus .container .mm.focus>a {color: #000000;}

#NavMain>.container>.menu {}
#NavMain>.container>.menu .mm {margin: 0 29px;}

#NavMain>.container>.auth .mm>a {position: relative;font-size: 18px; font-weight: 500; color: #ffffff; z-index: 8;}
#NavMain>.container>.auth .mm>a:hover {color: #eeeeee;}
#NavMain>.container>.auth .mm.focus>a {color: #eeeeee;}
body.HdStatus #NavMain>.container>.auth .mm>a {color: #919398;}
body.HdStatus #NavMain>.container>.auth .mm>a:hover {color: #000000;}
body.HdStatus #NavMain>.container>.auth .mm.focus>a {color: #000000;}

#NavMain>.container>.auth .mm {margin: 0 10px;}
#NavMain>.container>.auth .mm .btn_mbl img {width: 18px;}
#NavMain>.container>.auth .mm .srch img {width: 18px;}
#NavMain>.container>.auth .btn_mbl {display: none;}
@media (max-width:1280px){
    #NavMain>.container>.menu {display: none;}
    #NavMain>.container>.auth .btn_mbl {display: inline-block !important;}
}






#NavMain>.container .mm:first-child {margin-left: 0;}
#NavMain>.container .mm:last-child {margin-right: 0;}


body.HdStatus .container .sm>a {color: #919398;}
body.HdStatus .container .sm>a:hover {color: #000000;}
body.HdStatus .container .sm.focus>a {color: #000000;}

body.HdStatus .container .cm>a {color: #919398;}
body.HdStatus .container .cm>a:hover {color: #000000;}
body.HdStatus .container .cm.focus>a {color: #000000;}


/* home submenu */
body #NavMain>.container>.menu .submenu {display: none; position: fixed; top: 60px; width: fit-content; padding: 50px 0 20px; margin: 0; z-index: 6; left: 50%;transform: translate(-50%);}
body #NavMain>.container>.menu .submenu>.bg {background: transparent; border: 0;}

body.HdStatus #NavMain>.container>.menu .submenu {}
body.HdStatus #NavMain>.container>.menu .submenu>.bg {
    top: 20px;
    background: #ffffff;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    z-index: 0;
}

#NavMain>.container>.menu .submenu .sm {margin: 7px 0; z-index: 7; }
#NavMain>.container>.menu .submenu .sm>a {font-size: 1.6rem; color: #000; font-weight: 600; line-height: 2.4rem; }
#NavMain>.container>.menu .submenu .sm>a>.icon {display: inline-block; margin-right: 5px; background-color: #40ACD0; color: #ffffff; padding: 2px 7px; border-radius: 5px; font-size: 1.6rem;font-weight: 600; line-height: 100%;}

#Gnb .submenu ul ul {list-style: none; display: flex; flex-direction: column; align-items: flex-start; margin-top: 10px;}
#NavMain>.container>.menu .submenu .cm {margin: 7px 0; z-index: 7;}
#NavMain>.container>.menu .submenu .cm>a {font-size: 1.5rem; color: #4F4F4F; font-weight: 400; line-height: 1.8rem;}

/* home submenu flex */
body.HdStatus #NavMain>.container>.menu .submenu>.container>.flex {justify-content: center;}
body.HdStatus #NavMain>.container>.menu .submenu>.container>.flex>.item {margin: 0 17px; width: 12%; border: 0 solid #eee;}
body.HdStatus #NavMain>.container>.menu .m2 .submenu>.container>.flex>.item {width: unset; min-width: 13%;}
body.HdStatus #NavMain>.container>.menu .m4 .submenu>.container>.flex>.item {width: 10%;}
body.HdStatus #NavMain>.container>.menu .m5 .submenu>.container>.flex>.item {width: unset; min-width: 13%;}
body.HdStatus #NavMain>.container>.menu .m6 .submenu>.container>.flex>.item {width: unset; min-width: 11%;}


#Gnb .submenu ul {list-style: none; display: flex; flex-direction: row; align-items: flex-start; justify-content: space-evenly;}
#NavMain>.container>.menu .submenu>ul>.mm {margin: 5px 20px;}
#NavMain>.container>.menu .submenu>ul>.mm>span {color: #000000; font-size: 16px;}

.nav ul {list-style: none; margin-bottom: 0; padding-left: 0;}
.nav ul>li {display: block;}



/*
------------------------------------------------------------
C O M M O N
------------------------------------------------------------
._bg
._bd

:: display
.grd
.flx
.item
.bx

p

*/



.container.fullWidth {width: 1920px;}
.container.fitWidth {width: 1320px; margin: 0 auto;}
.section>.container.fullWidth>#CONT {}
.container.pdng {padding: 0;}

@media (max-width:1920px){
    /*.container.fullWidth {width: 1920px; position: absolute; left: 50%; transform: translate(-50%);}*/
    .container.fullWidth {width: 100%;}
}

/* ---------- Z - I N D E X ---------- */
.zi_0 {z-index: 0 !important;}
.zi_1 {z-index: 1 !important;}
.zi_2 {z-index: 2 !important;}


.section>.bg {}
.sub .section.anc>.bg {background: #fff;}
.container>.bg {}

/* ---------- C O N T E N T ---------- */
.content {display: block; font-size: 1.6rem; color: #2B2B2B; background: #FFFFFF; line-height: 160%;}
body.sub .content {padding: 80px 0;}


/* ---------- B A C K G R O U N D ---------- */
.content ._bg {}
.content ._bg.bgc {} /* sub */
.content ._bg.bgc_w {background-color: white !important;}
.content ._bg.bgc_b {background-color: black !important;}
.content ._bg.bgc_g {background-color: gray !important;}
.content ._bg.bgc_g0 {background-color: #F5F5F5 !important;}
.content ._bg.bgc_g1 {background-color: #e6e6e6 !important;}
.content ._bg.bgc_g2 {background-color: #cccccc !important;}
.content ._bg.bgc_g3 {background-color: #b3b3b3 !important;}
.content ._bg.bgc_g4 {background-color: #999999 !important;}
.content ._bg.bgc_g5 {background-color: #808080 !important;}
.content ._bg.bgc_g6 {background-color: #666666 !important;}
.content ._bg.bgc_g7 {background-color: #4d4d4d !important;}
.content ._bg.bgc_g8 {background-color: #333333 !important;}
.content ._bg.bgc_g9 {background-color: #1a1a1a !important;}

.content ._bg.bgi {
    width: 100%; height: auto;
    background-image: unset;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* ---------- B O R D E R ---------- */
.content ._bd {border-style: solid; border-width: 1px;}
.content ._bd.bdc {} /* sub */
.content ._bd.bdc_w {border-color: white !important;}
.content ._bd.bdc_b {border-color: black !important;}
.content ._bd.bdc_g {border-color: gray !important;}
.content ._bd.bdc_g1 {border-color: #e6e6e6 !important;}
.content ._bd.bdc_g2 {border-color: #cccccc !important;}
.content ._bd.bdc_g3 {border-color: #b3b3b3 !important;}
.content ._bd.bdc_g4 {border-color: #999999 !important;}
.content ._bd.bdc_g5 {border-color: #808080 !important;}
.content ._bd.bdc_g6 {border-color: #666666 !important;}
.content ._bd.bdc_g7 {border-color: #4d4d4d !important;}
.content ._bd.bdc_g8 {border-color: #333333 !important;}
.content ._bd.bdc_g9 {border-color: #1a1a1a !important;}


/* ========== F O N T - C O M M O N ========== */

/* ---------- F O N T - S I Z E  */
.content .fs12 {font-size: 1.2rem !important;}
.content .fs13 {font-size: 1.3rem !important;}
.content .fs14 {font-size: 1.4rem !important;}
.content .fs15 {font-size: 1.5rem !important;}
.content .fs16 {font-size: 1.6rem !important;}
.content .fs17 {font-size: 1.7rem !important;}
.content .fs18 {font-size: 1.8rem !important;}
.content .fs19 {font-size: 1.9rem !important;}
.content .fs20 {font-size: 2rem !important;}
.content .fs22 {font-size: 2.2rem !important;}
.content .fs24 {font-size: 2.4rem !important;}
.content .fs26 {font-size: 2.6rem !important;}
.content .fs28 {font-size: 2.8rem !important;}
.content .fs30 {font-size: 3rem !important;}
.content .fs36 {font-size: 3.6rem !important;}
.content .fs40 {font-size: 4rem !important;}

/* ---------- F O N T - W E I G H T  */
.content .fw3 {font-weight: 300 !important;}
.content .fw4 {font-weight: 400 !important;}
.content .fw5 {font-weight: 500 !important;}
.content .fw6 {font-weight: 600 !important;}
.content .fw7 {font-weight: 700 !important;}

/* ---------- L I N E - H E I G H T ---------- */
.content .lh100 {line-height: 100% !important;}
.content .lh110 {line-height: 110% !important;}
.content .lh120 {line-height: 120% !important;}
.content .lh130 {line-height: 130% !important;}
.content .lh140 {line-height: 140% !important;}
.content .lh150 {line-height: 150% !important;}
.content .lh160 {line-height: 160% !important;}



/* ========== G R I D - C O M M O N ========== */
.content .grd {display: grid; gap: 0; width: 100%;}

/* ---------- G R I D - T E M P L A T E - C O L U M N S */
.content .grd.gtc1 {grid-template-columns: 1fr;}
.content .grd.gtc2 {grid-template-columns: repeat(2, 1fr);}
.content .grd.gtc3 {grid-template-columns: repeat(3, 1fr);}
.content .grd.gtc4 {grid-template-columns: repeat(4, 1fr); gap: 20px 24px;}
.content .grd.gtc5 {grid-template-columns: repeat(5, 1fr);}
.content .grd.gtc6 {grid-template-columns: repeat(6, 1fr);}
.content .grd.gtc7 {grid-template-columns: repeat(7, 1fr);}
.content .grd.gtc8 {grid-template-columns: repeat(8, 1fr);}
.content .grd.gtc9 {grid-template-columns: repeat(9, 1fr);}
.content .grd.gtc10 {grid-template-columns: repeat(10, 1fr);}
.content .grd.gtc11 {grid-template-columns: repeat(11, 1fr);}
.content .grd.gtc12 {grid-template-columns: repeat(12, 1fr);}
.content .grd.gtc13 {grid-template-columns: repeat(13, 1fr);}
.content .grd.gtc14 {grid-template-columns: repeat(14, 1fr);}
.content .grd.gtc15 {grid-template-columns: repeat(15, 1fr);}
.content .grd.gtc16 {grid-template-columns: repeat(16, 1fr);}
@media ( max-width: 960px ) {
    .content .grd.gtc4 {grid-template-columns: repeat(2, 1fr) !important; gap: 20px 24px;}
}
@media ( max-width: 480px ) {

}


/* ---------- G A P ---------- */
.content .gap0, .content .gap_0 {column-gap: 0 !important; row-gap: 0 !important;}
.content .gap_1  {column-gap: 1px !important; row-gap: 1px !important;}
.content .gap_2  {column-gap: 2px !important; row-gap: 2px !important;}
.content .gap_5  {column-gap: 5px !important; row-gap: 5px !important;}
.content .gap_8  {column-gap: 8px !important; row-gap: 8px !important;}
.content .gap_10 {column-gap: 10px !important; row-gap: 10px !important;}
.content .gap_12 {column-gap: 12px !important; row-gap: 12px !important;}
.content .gap_16 {column-gap: 16px !important; row-gap: 16px !important;}
.content .gap_20 {column-gap: 20px !important; row-gap: 20px !important;}
.content .gap_24 {column-gap: 24px !important; row-gap: 24px !important;}
.content .gap_30 {column-gap: 30px !important; row-gap: 30px !important;}
.content .gap_40 {column-gap: 40px !important; row-gap: 40px !important;}
.content .gap_64 {column-gap: 64px !important; row-gap: 64px !important;}

.content .gap_0_1 {column-gap: 0 !important; row-gap: 1px !important;}
.content .gap_0_2 {column-gap: 0 !important; row-gap: 2px !important;}
.content .gap_0_5 {column-gap: 0 !important; row-gap: 5px !important;}
.content .gap_0_8 {column-gap: 0 !important; row-gap: 8px !important;}
.content .gap_0_10 {column-gap: 0 !important; row-gap: 10px !important;}
.content .gap_0_12 {column-gap: 0 !important; row-gap: 12px !important;}
.content .gap_0_16 {column-gap: 0 !important; row-gap: 16px !important;}
.content .gap_0_20 {column-gap: 0 !important; row-gap: 20px !important;}
.content .gap_0_24 {column-gap: 0 !important; row-gap: 24px !important;}
.content .gap_0_30 {column-gap: 0 !important; row-gap: 30px !important;}
.content .gap_0_40 {column-gap: 0 !important; row-gap: 40px !important;}
.content .gap_0_64 {column-gap: 0 !important; row-gap: 64px !important;}

.content .gap_1_0 {column-gap: 1px !important; row-gap: 0 !important;}
.content .gap_2_0 {column-gap: 2px !important; row-gap: 0 !important;}
.content .gap_5_0 {column-gap: 5px !important; row-gap: 0 !important;}
.content .gap_8_0 {column-gap: 8px !important; row-gap: 0 !important;}
.content .gap_10_0 {column-gap: 10px !important; row-gap: 0 !important;}
.content .gap_12_0 {column-gap: 12px !important; row-gap: 0 !important;}
.content .gap_16_0 {column-gap: 16px !important; row-gap: 0 !important;}
.content .gap_18_0 {column-gap: 18px !important; row-gap: 0 !important;}
.content .gap_20_0 {column-gap: 20px !important; row-gap: 0 !important;}
.content .gap_24_0 {column-gap: 24px !important; row-gap: 0 !important;}
.content .gap_30_0 {column-gap: 30px !important; row-gap: 0 !important;}
.content .gap_40_0 {column-gap: 40px !important; row-gap: 0 !important;}
.content .gap_64_0 {column-gap: 64px !important; row-gap: 0 !important;}

.gap_5_10 {gap: 5px 10px !important;}
.gap_10_24 {gap: 10px 24px !important;}
.gap_10_40 {gap: 10px 40px !important;}

.gap_10_8 {gap: 10px 8px !important;}
.gap_12_8 {gap: 12px 8px !important;}
.gap_20_8 {gap: 20px 8px !important;}
.gap_20_40 {gap: 20px 40px !important;}
.gap_16_24 {gap: 16px 24px !important;}
.gap_16_32 {gap: 16px 32px !important;}
.gap_16_40 {gap: 16px 40px !important;}
.gap_16_64 {gap: 16px 64px !important;}











/* ========== F L E X ========== */
.content .flx {display: flex; flex-wrap: wrap;}

/* ---------- F L E X - C O L U M N */
.content .flx.clt {flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important;}
.content .flx.clc {flex-direction: column !important; align-items: flex-start !important; justify-content: center !important;}
.content .flx.clb {flex-direction: column !important; align-items: flex-start !important; justify-content: flex-end !important;}
.content .flx.cla {flex-direction: column !important; align-items: flex-start !important; justify-content: space-around !important;}
.content .flx.clw {flex-direction: column !important; align-items: flex-start !important; justify-content: space-between !important;}
.content .flx.cle {flex-direction: column !important; align-items: flex-start !important; justify-content: space-evenly !important;}
.content .flx.cct {flex-direction: column !important; align-items: center !important; justify-content: flex-start !important;}
.content .flx.ccc {flex-direction: column !important; align-items: center !important; justify-content: center !important;}
.content .flx.ccb {flex-direction: column !important; align-items: center !important; justify-content: flex-end !important;}
.content .flx.cca {flex-direction: column !important; align-items: center !important; justify-content: space-around !important;}
.content .flx.ccw {flex-direction: column !important; align-items: center !important; justify-content: space-between !important;}
.content .flx.cce {flex-direction: column !important; align-items: center !important; justify-content: space-evenly !important;}
.content .flx.crt {flex-direction: column !important; align-items: flex-end !important; justify-content: flex-start !important;}
.content .flx.crc {flex-direction: column !important; align-items: flex-end !important; justify-content: center !important;}
.content .flx.crb {flex-direction: column !important; align-items: flex-end !important; justify-content: flex-end !important;}
.content .flx.cra {flex-direction: column !important; align-items: flex-end !important; justify-content: space-around !important;}
.content .flx.crw {flex-direction: column !important; align-items: flex-end !important; justify-content: space-between !important;}
.content .flx.cre {flex-direction: column !important; align-items: flex-end !important; justify-content: space-evenly !important;}

/* ---------- F L E X - R O W */
.content .flx.rtl {flex-direction: row !important; align-items: flex-start !important; justify-content: flex-start !important;}
.content .flx.rtc {flex-direction: row !important; align-items: flex-start !important; justify-content: center !important;}
.content .flx.rtr {flex-direction: row !important; align-items: flex-start !important; justify-content: flex-end !important;}
.content .flx.rta {flex-direction: row !important; align-items: flex-start !important; justify-content: space-around !important;}
.content .flx.rtw {flex-direction: row !important; align-items: flex-start !important; justify-content: space-between !important;}
.content .flx.rte {flex-direction: row !important; align-items: flex-start !important; justify-content: space-evenly !important;}
.content .flx.rcl {flex-direction: row !important; align-items: center !important; justify-content: flex-start !important;}
.content .flx.rcc {flex-direction: row !important; align-items: center !important; justify-content: center !important;}
.content .flx.rcr {flex-direction: row !important; align-items: center !important; justify-content: flex-end !important;}
.content .flx.rca {flex-direction: row !important; align-items: center !important; justify-content: space-around !important;}
.content .flx.rcw {flex-direction: row !important; align-items: center !important; justify-content: space-between !important;}
.content .flx.rce {flex-direction: row !important; align-items: center !important; justify-content: space-evenly !important;}
.content .flx.rbl {flex-direction: row !important; align-items: flex-end !important; justify-content: flex-start !important;}
.content .flx.rbc {flex-direction: row !important; align-items: flex-end !important; justify-content: center !important;}
.content .flx.rbr {flex-direction: row !important; align-items: flex-end !important; justify-content: flex-end !important;}
.content .flx.rba {flex-direction: row !important; align-items: flex-end !important; justify-content: space-around !important;}
.content .flx.rbw {flex-direction: row !important; align-items: flex-end !important; justify-content: space-between !important;}
.content .flx.rbe {flex-direction: row !important; align-items: flex-end !important; justify-content: space-evenly !important;}

.content .flx.fdc {flex-direction: column !important;}
.content .flx.fdr {flex-direction: row !important;}

.content .flx.nowrap {flex-wrap: unset !important;}
/* ---------- O V E R - F L O W ---------- */
.content .ovf {overflow-x: auto; padding-bottom: 10px;}

/* ---------- T A B L E ---------- */
.content .tbl {width: 100%;}
.content .tbl.bsc {border-bottom: 1px solid #7A7A7A; /*margin: 10px auto;*/}
.content .tbl .hd {background: #F5F5F5; width: 100%;}
.content .tbl .row0 {border-top: unset !important; min-height: 38px; background: #F5F5F5;}
.content .tbl .item.row0 {border-bottom: 1px solid #7A7A7A;}
.content .tbl .row1 {border-top: 0;}

/* ---------- U L > L I ---------- */
.content ul,
.content ol {}
.content ul.list_disk {list-style: disc;}
.content ul>li,
.content ol>li {}

.content .cont>ul,
.content .cont>ol {margin-left: 0;}
.content .cont>ul>li,
.content .cont>ol>li {line-height: 120%; margin-bottom: 7px;}
.content .cont>ul>li:last-child,
.content .cont>ol>li:last-child {margin-bottom: 0;}


.content ._bg ul>li,
.content ._bg ol>li {font-size: 1.4rem; line-height: 120%; margin-bottom: 7px;}

.content .item ul,
.content .item ol {margin-left: 25px;}
.content .item li {line-height: 120%; margin-bottom: 7px;}
.content .item li:last-child {margin-bottom: 0;}

.content .bx ul>li {font-size: 1.4rem;}


/* 배경 블럭내 meta_txt, li리스트 */
body .content .sect .meta_txt {font-size: 1.2rem; font-weight: 300; line-height: 160%;}
body .content .sect .meta_txt>ol,
body .content .sect .meta_txt>ul {margin-left: 25px;}
body .content .sect .meta_txt>ol>li,
body .content .sect .meta_txt>ul>li {font-size: 1.2rem; line-height: 140%; margin-top: 3px; margin-bottom: unset;}
body .content .sect .bgc .meta_txt>ol>li,
body .content .sect .bgc .meta_txt>ul>li {color: #2B2B2B !important; font-size: 1.2rem; font-weight: 300; line-height: 120%; margin-top: 10px;}

@media (max-width: 640px) {
    body .content .sect .meta_txt {font-size: 1.2rem;}

    body .content .sect .meta_txt>ol>li,
    body .content .sect .meta_txt>ul>li {font-size: 12px !important;}

    body.sub .content .sect .item div.meta_txt>ol>li {font-size: 12px !important;}

    body .content .sect .bgc .meta_txt ol>li,
    body .content .sect .bgc .meta_txt ul>li {font-size: 1.2rem !important;}
}





/* ---------- B O X ----------
div 와 다른점?
item 과 다른점?
*/
.bx {
    display: flex; align-items: center !important; justify-content: center !important;
    width: 100%; min-height: 40px; padding: 0; font-weight: 500; line-height: 140%; color: #FFFFFF;
}
.bx._bg.bgc_w,
.bx._bg.bgc_g0,
.bx._bg.bgc_g1,
.bx._bg.bgc_g2 {color: #2B2B2B;}
.bx.hdr {padding: 10px;}
.bx.bdy {padding: 10px; row-gap: 10px;}
.bx.ftr {padding: 10px;}




.bx>span {display: block; text-align: center; font-size: 1.4rem; font-weight: 400; line-height: 24px;}
.bx>p>span {display: inline-block;}
.bx.bd {border: 1px solid #919398; color: #2B2B2B;}
.bx.r {border-radius: 10px !important;} /*min-height: 80px;*/
.bx.r.r2 {border-radius: 20px !important;}

/* ---------- P ---------- */
.content p {font-size: inherit; color: inherit; text-align: left;}
.content .cont {text-align: left;}
.content .cont>p {line-height: 160%; font-size: 1.6rem; font-weight: 400; }
/* 기본 본문 */
/*.content>.sect .cont>p {margin-top: 25px; text-align: left;}*/
.content>.sect .cont>p {margin-top: 25px; text-align: left;}
.content>.sect .cont>p:first-child {margin-top: 0;}
@media (max-width: 640px) {
    .content p {font-size: 1.4rem;}
    .content .cont>p {font-size: 1.4rem;}
}


.content>.sect ._bg .cont>p {font-size: 1.4rem; line-height: 140%;}

.content .tbl p {font-size: 1.6rem; line-height: 24px;}

.content .bx>p {font-size: 1.6rem; text-align: center;}
.content .bx>p {font-size: 1.6rem; color: #2B2B2B;}


.content .smllr {display: inline-block; font-size: 1.4rem; line-height: 120%;}
@media (max-width: 640px) {
    .content .tbl p {font-size: 1.4rem; line-height: 22px;}
    .content .tbl .item>span {font-size: 1.4rem; line-height: 22px;}
}


/*
 ------------------------------
 sub common
 ------------------------------
*/
.content .bgc.bgc_g0:not(.grp) {padding: 24px;}
.content .grd>.item.bgc.bgc_g0 {border-radius: 10px;}

.content .cont li {font-size: 1.4rem; font-weight: 400; line-height: 130%; margin-top: 5px;}
.content .cont :not(.grd)>li:first-child {margin-top: 0;}

.content .tbl li {font-size: 1.6rem; font-weight: 400; line-height: 130%; margin-top: 5px;}
.content .tbl :not(.grd)>li:first-child {margin-top: 0;}
@media ( max-width: 640px ) {
    .content .tbl li {font-size: 1.4rem !important;}
    .content .ovf .tbl li {font-size: 1.4rem !important;}
}

/* background color */
.content .bgc_bsc {background-color: #868686 !important;}

.content .bgc_g01 {background-color: #E4E3E3 !important;}
.content .bgc_g02 {background-color: #D9D9D9 !important;}
.content .bgc_g03 {background-color: #C7C7C7 !important;}
.content .bgc_g04 {background-color: #7A7A7A !important;}

/* _frame_ */
.content ._frame_ .inner_line>.ttl_3 {font-size: 2.2rem; margin-bottom: 16px;}
.content ._frame_ .inner_line {padding: 30px; border: 1px solid #868686; height: 100%;}
.content ._frame_ .inner_line ul>li,
.content ._frame_ .inner_line ol>li {font-size: 1.6rem; font-weight: 400; line-height: 140%;}
@media ( max-width: 640px ) {
    .content ._frame_ .inner_line ol>li {font-size: 1.4rem;}
    .content ._frame_ .inner_line ul>li,
    .content ._frame_ .inner_line ol>li {font-size: 1.4rem; font-weight: 400; line-height: 140%;}
}






/* unit : grp : group */
.content .grp {width: 100%; padding: 0; overflow: auto; text-align: center;}

/* sngl : body */
.content .sngl {color: #ffffff; text-align: center; font-size: 1.6rem; min-height: 40px;}
.content .sngl p {text-align: left;}
@media ( max-width: 640px ) {
    .content .sngl {font-size: 1.4rem; min-height: 34px;}
}

/* hdr : header */
.content .hdr {color: #ffffff; text-align: center; font-size: 1.6rem; min-height: 40px;} /*padding: 5px 12px;*/
.content .hdr p {text-align: left;}
@media ( max-width: 640px ) {
    .content .hdr {font-size: 1.4rem; min-height: 34px;}
}

/* bdy : body */




.content .bx>span {display: block; font-size: 1.4rem; font-weight: 400; line-height: 140%;}
.content .bx.bdy>p {font-size: 1.4rem; font-weight: 400;}

/* p 본문 */


/* p 배경 블럭내 본문 */
.content .bgc .cont>p {font-size: 1.4rem; font-weight: 400; line-height: 143%; margin-top: 18px;}
.content .bgc .cont>p:first-child {margin-top: 0;}
/* p 진한배경 블럭내 본문 */
.content span {font-weight: 300; display: inline-block;}
.content .bgc>p,
.content .bgc_sub>p,
.content .bgc_sub1>p,
.content .bgc_sub2>p,
.content .bgc_sub_pri>p,
.content .bgc_sub_pri1>p,
.content .bgc_sub_light>p,
.content .bgc_sub_light1>p,
.content .bgc_sub_light2>p,
.content .bgc_sub_light3>p,
.content .bgc_sub_light4>p,
.content .bgc>span,
.content .bgc_sub>span,
.content .bgc_sub1>span,
.content .bgc_sub_pri>span {color: #FFFFFF;}

.content .bgc_w>p,
.content .bgc_g0:not(.grp)>p,
.content .bgc_g0:not(.grp)>span {color: #2B2B2B;}
.content .bgc>p,
.content .bgc_blck>p {color: #FFFFFF;}



.content .bdy {text-align: center;}

.content .grp>.sngl {font-size: 2rem; font-weight: 500;}
.content .grp>.hdr {font-size: 2rem; font-weight: 500;}
.content .grp>.bdy {color: inherit; background-color: inherit; font-size: 1.6rem; font-weight: 400;}

.content .sngl.bx {min-height: 80px;}
.content .hdr.bx {min-height: 72px;}
.content .bdy.bx {min-height: 10px;}



.content .bgc_w>p,
.content .bgc_g0>p,
.content .bgc_g0>.bdy>p{color: #2B2B2B;}

.content .bgc>p,
.content .bgc_sub>p,
.content .bgc_sub_pri>p,
.content .bgc_pri>p {color: #FFFFFF;}

/* org tree */
.content .ot .w_full {grid-column: 1/-1;}
.content .ot .bx {display: flex; align-items: center; justify-content: center;}
.content .ot .bx.r {border-radius: 10px;}
.content .ot .bx.r.r2 {border-radius: 20px;}
.content .ot .hdr.bx.r {border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important;}
.content .ot .bdy.bx.r {border-top-left-radius: 0 !important; border-top-right-radius: 0 !important;}
.content .ot .grp.r {border-radius: 10px;}

.content .ot .item {display: flex; align-items: center; justify-content: center; flex-direction: column;}
.content .ot .grp>.sngl.bx {padding: 10px 10px;}
.content .ot .hdr {padding: 10px 10px;}
.content .ot .bdy {padding: 10px 10px;}

.content .ot .bx>p,
.content .ot .bx>span {text-align: center;}

.content .ot ul {margin-left: 10px;}

.content .ot .c_ln {display: flex; align-items: flex-start; justify-content: center; position: relative;}
.content .ot .c_ln .v_ln.abs {position: absolute; top: 0; left: 50%; transform: translate(-50%);}
.content .ot .c_ln .h_ln.abs {width: 120%;}
.content .ot .c_ln .h_ln.abs.r50 {left: -50%; width: 100%;}
.content .ot .c_ln .h_ln.abs.l50 {left: 50%; width: 100%;}





















/*
------------------------------------------------------------
C O M M O N - L A Y O U T
------------------------------------------------------------
*/
br.web {display: none;}

/* ---------- I T E M ---------- */
.content .sect .item {width: 100%; max-width: 100%;}

/* ========== S E C T ========== */
.content>.sect {margin-bottom: 40px;}
.content>.sect:last-child {margin-bottom: 0;}

.content .grd {display: grid;}
.content .grd.vg2 {grid-template-columns: repeat(2, 1fr); column-gap: 24px; row-gap: 20px;}
.content .grd.vg3 {grid-template-columns: repeat(3, 1fr); column-gap: 24px; row-gap: 20px;}
.content .grd.vg4 {grid-template-columns: repeat(4, 1fr); column-gap: 24px; row-gap: 20px;}
.content .grd.vg8 {grid-template-columns: repeat(8, 1fr); column-gap: 19px; row-gap: 0;}

.content>.sect.flx.vw2 {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
    column-gap: 40px; row-gap: 10px;
}
.sect.flx.vw2>.item {width: calc(50% - 20px); align-self: stretch;}
.sect.flx.vw2>.item:last-child {}


/*.content .grd.vg2>.item {border: 1px solid #d6eed6;}
.content .grd.vg3>.item {border: 1px solid #d6eed6;}
.content .grd.vg4>.item {border: 1px solid #d6eed6;}*/

.content .sect.grd.vg2 {column-gap: 40px; row-gap: 20px;}
.content .sect.grd.vg32 {grid-template-columns: 65% 35%; column-gap: 24px; row-gap: 20px;}
.content .sect.grd.vg3 {column-gap: 24px; row-gap: 20px;}
.content .sect.grd.vg4 {column-gap: 20px; row-gap: 20px;}


.content .sect>div._bg {padding: 24px;}
.content .sect>.item>div._bg {padding: 24px;}

@media ( max-width: 1320px ) {
    #Hd .container.fullWidth,
    #Vsl .container.fullWidth,
    #Wrap .container.fullWidth {width: 100%;}
    #Hd .container.fitWidth,
    #Vsl .container.fitWidth,
    #Wrap .container.fitWidth {width: 100%; padding-left: 3%; padding-right: 3%;}
    #Hd .section>.container.fullWidth>#CONT,
    #Vsl .section>.container.fullWidth>#CONT,
    #Wrap .section>.container.fullWidth>#CONT {}
}

@media ( max-width: 1024px ) {
    .content .grd.vg2 {grid-template-columns: repeat(1, 1fr) !important; column-gap: 0; row-gap: 20px;}
    .content .grd.vg3 {grid-template-columns: repeat(2, 1fr) !important; column-gap: 20px; row-gap: 20px;}
    .content .grd.vg32 {grid-template-columns: repeat(2, 1fr) !important;  column-gap: 24px; row-gap: 20px;}
    .content .grd.vg4 {grid-template-columns: repeat(2, 1fr) !important; column-gap: 20px; row-gap: 20px;}
    .content .grd.vg8 {grid-template-columns: repeat(4, 1fr); column-gap: 19px; row-gap: 10px;}
    .content .grd {column-gap: 20px; row-gap: 20px;}

    /* 1단-> 2단시 단사이 간격 조정 */
    /*.sect.grd>.item:not(:last-child) {margin-bottom: 50px;}*/
    .content>.sect .w_2_3 {width: 100% !important; /*margin-bottom: 50px;*/}
    /*img {width: 100%;}*/
}

@media ( max-width: 960px ) {
    .content .grd.ovf {
        overflow-x: auto;
        row-gap: 0 !important;
        margin-bottom: 10px;
    }
    .content .ovf {
        overflow-x: auto !important;
        margin-bottom: 10px;
    }
    /* 복잡한 구조다. */
    /*.sect:not(.tbl)>.grd>.item:not(:first-child) {margin-top: 20px;}*/

    /* tbl */
    .content .tbl>.gtc2 {grid-template-columns: repeat(2, minmax(auto, auto)) !important;}
    .content .tbl>.gtc3 {grid-template-columns: repeat(3, minmax(auto, auto)) !important;}
    .content .tbl>.gtc4 {grid-template-columns: repeat(4, minmax(auto, auto)) !important;}
    .content .tbl>.gtc5 {grid-template-columns: repeat(5, minmax(auto, auto)) !important;}
    .content .tbl>.gtc6 {grid-template-columns: repeat(6, minmax(auto, auto)) !important;}
    .content .tbl>.gtc7 {grid-template-columns: repeat(7, minmax(auto, auto)) !important;}
    .content .tbl>.gtc8 {grid-template-columns: repeat(8, minmax(auto, auto)) !important;}
    .content .tbl>.gtc9 {grid-template-columns: repeat(9, minmax(auto, auto)) !important;}
    .content .tbl>.gtc10 {grid-template-columns: repeat(10, minmax(auto, auto)) !important;}
    .content .tbl>.gtc11 {grid-template-columns: repeat(11, minmax(auto, auto)) !important;}
    .content .tbl>.gtc12 {grid-template-columns: repeat(12, minmax(auto, auto)) !important;}
    .content .tbl>.gtc13 {grid-template-columns: repeat(13, minmax(auto, auto)) !important;}
    .content .tbl>.gtc14 {grid-template-columns: repeat(14, minmax(auto, auto)) !important;}
    .content .tbl>.gtc15 {grid-template-columns: repeat(15, minmax(auto, auto)) !important;}
    .content .tbl>.gtc16 {grid-template-columns: repeat(16, minmax(auto, auto)) !important;}

    br.mbl {display: none;}
    br.web {display: block; width: 1vw;}
}


@media ( max-width: 640px ) {
    .content>.sect.flx.vw2 {column-gap: 10px; row-gap: 40px;}
    .content>.sect.flx.vw2>.item {width: 100%;}

    .content .grd.vg2 {grid-template-columns: repeat(1, 1fr) !important; column-gap: 0; row-gap: 20px;}
    .content .grd.vg3 {grid-template-columns: repeat(1, 1fr) !important; column-gap: 0; row-gap: 20px;}
    .content .grd.vg32 {grid-template-columns: repeat(1, 1fr) !important;  column-gap: 0; row-gap: 20px;}
    .content .grd.vg4 {grid-template-columns: repeat(1, 1fr) !important; column-gap: 0; row-gap: 20px;}
    .content .grd.vg8 {grid-template-columns: repeat(3, 1fr); column-gap: 19px; row-gap: 10px;}
}






























.social_1 .anc5 .ob1 .gmtn {transition: 1s; opacity: 0; bottom: 0 !important; height: 0 !important; background: #ffffff !important;}
.social_1 .anc5 .ob1 .gmtn.gm1.active {opacity: 1; bottom: 0 !important; height: 300px !important; background: #FF9900 !important;}
.social_1 .anc5 .ob1 .gmtn.gm2.active {opacity: 1; bottom: 0 !important; height: 187px !important; background: #FFAB01 !important;}
.social_1 .anc5 .ob1 .gmtn.gm3.active {opacity: 1; bottom: 0 !important; height: 70px !important; background: #F6BB43 !important;}
.social_1 .anc5 .ob1 .gmtn.gm4.active {opacity: 1; bottom: 0 !important; height: 50px !important; background: #F6BB43 !important;}
.social_1 .anc5 .ob1 .gmtn.gm5.active {opacity: 1; bottom: 0 !important; height: 104px !important; background: #F6BB43 !important;}

.social_3 .anc2 .gmtn {transition: 1s; opacity: 0; left: 0 !important; width: 0 !important;}
.social_3 .anc2 .gmtn.active {opacity: 1; left: 0 !important; width: 53.8% !important;}

.social_4 .anc4 .graph .gmtn {transition: 1s; opacity: 0; bottom: 0 !important; height: 0 !important; background: #ffffff !important;}
.social_4 .anc4 .graph .gmtn.gm1.active {opacity: 1; bottom: 0 !important; height: 165px !important; background: #FFAB01 !important;}
.social_4 .anc4 .graph .gmtn.gm2.active {opacity: 1; bottom: 0 !important; height: 148px !important; background: #FFAB01 !important;}
.social_4 .anc4 .graph .gmtn.gm3.active {opacity: 1; bottom: 0 !important; height: 148px !important; background: #FFAB01 !important;}
.social_4 .anc4 .graph .gmtn.gm4.active {opacity: 1; bottom: 0 !important; height: 127px !important; background: #FFAB01 !important;}
.social_4 .anc4 .graph .gmtn.gm5.active {opacity: 1; bottom: 0 !important; height: 77px !important; background: #FFAB01 !important;}
.social_4 .anc4 .graph .gmtn.gm6.active {opacity: 1; bottom: 0 !important; height: 115px !important; background: #FFAB01 !important;}

.social_5 .anc1 .gmtn {transition: 1s; opacity: 0; bottom: 0 !important; height: 0 !important; background: #ffffff !important;}
.social_5 .anc1 .gmtn.gm1.active {opacity: 1; bottom: 0 !important; height: 99px !important; background: #F6BB43 !important;}
.social_5 .anc1 .gmtn.gm2.active {opacity: 1; bottom: 0 !important; height: 89px !important; background: #F6BB43 !important;}
.social_5 .anc1 .gmtn.gm3.active {opacity: 1; bottom: 0 !important; height: 132px !important; background: #F6BB43 !important;}
.social_5 .anc1 .gmtn.gm4.active {opacity: 1; bottom: 0 !important; height: 170px !important; background: #FFAB01 !important;}
.social_5 .anc1 .gmtn.gm5.active {opacity: 1; bottom: 0 !important; height: 248px !important; background: #FF9900 !important;}

.social_6 .anc2 ._if4_ .graph .bar .gmtn.item {transition: 1s; opacity: 0; left: 0 !important; width: 0 !important;}
.social_6 .anc2 ._if4_ .ig1 .graph .bar .gmtn.it1.active {opacity: 1; left: 0 !important; width: 83.2% !important;}
.social_6 .anc2 ._if4_ .ig1 .graph .bar .gmtn.it2.active {opacity: 1; left: 0 !important; width: 90% !important;}
.social_6 .anc2 ._if4_ .ig1 .graph .bar .gmtn.it3.active {opacity: 1; left: 0 !important; width: 72% !important;}

.social_6 .anc2 ._if4_ .ig2 .graph .bar .gmtn.it1.active {opacity: 1; left: 0 !important; width: 75.1% !important;}
.social_6 .anc2 ._if4_ .ig2 .graph .bar .gmtn.it2.active {opacity: 1; left: 0 !important; width: 92% !important;}
.social_6 .anc2 ._if4_ .ig2 .graph .bar .gmtn.it3.active {opacity: 1; left: 0 !important; width: 38% !important;}

.social_6 .anc2 ._if4_ .ig3 .graph .bar .gmtn.it1.active {opacity: 1; left: 0 !important; width: 12% !important;}
.social_6 .anc2 ._if4_ .ig3 .graph .bar .gmtn.it2.active {opacity: 1; left: 0 !important; width: 12% !important;}
.social_6 .anc2 ._if4_ .ig3 .graph .bar .gmtn.it3.active {opacity: 1; left: 0 !important; width: 12% !important;}





.ft {border-top: 1px solid #C7C7C7;}
#Ft {background: #F5F5F5;}
#Ft .container {padding: 80px 0 50px; color: #7A7A7A;}
#Ft>.bg {background: #fff;}
#Ft .logo {margin-bottom: 40px;}
#Ft .logo .f_logo {width: 100px;}
#Ft .logo .f_slogun {color: #7A7A7A; font-size: 1.4rem; font-weight: 500; margin-top: 7px;}

#Ft .map {margin-bottom: 40px;}
#Ft .map ul.flex {align-items: flex-start;}
#Ft .map ul.flex li.item.mm {max-width: 15%; margin:0 10px;}
#Ft .map ul.flex li.item.mm:first-child {margin-left:0;}
#Ft .map ul.flex li.item.mm:last-child {margin-right:0;}
#Ft .map ul.flex li.item.mm>span {color: #000; font-size: 1.4rem;}
#Ft .map ul.flex li.item.mm ul {display: block; margin-top: 20px;}
#Ft .map ul.flex li.item.mm ul>li.sm {display: block; margin-top: 10px;}
#Ft .map ul.flex li.item.mm ul>li.sm>a {color: #7A7A7A; font-size: 1.2rem;}

#Ft .link ul.flex {justify-content: flex-start;}
#Ft .link ul.flex .item {margin-right: 50px;}
#Ft .link ul.flex .item {font-size: 1.4rem; font-weight: 500;}
#Ft .link ul.flex .item a {color: #7A7A7A;}
@media (max-width:960px){
    #Ft .link ul.flex .item {font-size: 1.2rem; margin-top: 20px; margin-right: 20px;}
}
@media (max-width:760px){
    #Ft .map ul.flex {flex-wrap: wrap; gap: 40px 10px;}
    #Ft .map ul.flex li.item.mm {max-width: 30%; width: 30%; margin: 0;}
    #Ft .map ul.flex li.item.mm ul>li.sm {display: block; margin-top: 10px;}
}
@media (max-width:640px){
    #Ft .link ul.flex {justify-content: flex-start; flex-wrap: wrap;}
}

/*
------------------------------------------------------------
S U B - C O M M O N
------------------------------------------------------------
*/

/* ---------- sub Vsl ---------- */
body.sub #Vsl>.container>.bg,
body.sub #Hd>.container>.bg {height: auto; background-position: center top;} /*height: 605px;*/

body.overview #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg1.jpg");}
body.overview #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg1.jpg"); height: 137px; display: none;}
body.overview.mbl #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg1_m.jpg");}
body.overview.mbl #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg1_m.jpg"); height: 137px; display: none;}

body.esghighlights #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg2.jpg");}
body.esghighlights #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg2.jpg"); height: 137px; display: none;}
body.esghighlights.mbl #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg2_m.jpg");}
body.esghighlights.mbl #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg2_m.jpg"); height: 137px; display: none;}

body.environmental #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg3.jpg");}
body.environmental #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg3.jpg"); height: 137px; display: none;}
body.environmental.mbl #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg3_m.jpg");}
body.environmental.mbl #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg3_m.jpg"); height: 137px; display: none;}

body.social #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg4.jpg");}
body.social #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg4.jpg"); height: 137px; display: none;}
body.social.mbl #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg4_m.jpg");}
body.social.mbl #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg4_m.jpg"); height: 137px; display: none;}

body.governance #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg5.jpg");}
body.governance #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg5.jpg"); height: 137px; display: none;}
body.governance.mbl #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg5_m.jpg");}
body.governance.mbl #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg5_m.jpg"); height: 137px; display: none;}

body.appendix #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg6.jpg");}
body.appendix #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg6.jpg"); height: 137px; display: none;}
body.appendix.mbl #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg6_m.jpg");}
body.appendix.mbl #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg6_m.jpg"); height: 137px; display: none;}

body.search #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg6.jpg");}
body.search #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg6.jpg"); height: 137px; display: none;}
body.search.mbl #Vsl>.container>.bg {background-image: url("/static/images/sub_vsl_bg6_m.jpg");}
body.search.mbl #Hd>.container>.bg {background-image: url("/static/images/sub_vsl_bg6_m.jpg"); height: 137px; display: none;}

body.sub #Vsl>.container .context {position: absolute; bottom: 90px; color: #fff; font-weight: 200; width: 94%;}
body.sub #Vsl>.container .context>.tit {font-size: 4rem; line-height: 4.5rem;}
body.sub #Vsl>.container .context>.exp {font-size: 1.6rem; margin-top: 24px; line-height: 2.4rem; }

/* ---------- sub location ---------- */
body.sub #Gnb>.container .location {position: absolute; top: 90px; height: 49px; width: 100%; border-bottom: 2px solid #fff;}
body.sub #Gnb>.container .location>.info {position: relative; margin: 9px 0;}
body.sub.en #Gnb>.container .location>.info {margin: 14px 0;}
body.sub #Gnb>.container .location>.info a {font-size: 1.6rem; color: #fff; font-weight: 600;}
body.sub #Gnb>.container .location>.info span {font-size: 1.6rem; color: #fff; font-weight: 400;}
body.sub.en #Gnb>.container .location>.info a {font-size: 1.4rem;}
body.sub.en #Gnb>.container .location>.info span {font-size: 1.4rem;}

body.sub #Gnb>.container .location>.info ul.uk-breadcrumb {}
body.sub #Gnb>.container .location>.info ul.uk-breadcrumb li {margin: 10px; display: inline-block;}
body.sub.en #Gnb>.container .location>.info ul.uk-breadcrumb li {margin: 5px;}
body.sub #Gnb>.container .location>.info ul.uk-breadcrumb li:first-child {margin-left: 0;}
body.sub #Gnb>.container .location>.info ul.uk-breadcrumb li:last-child {margin-right: 0;}
@media ( max-width: 1320px ) {
    body.sub #Gnb>.container .location {width: 94%;}
}

/* ---------- sub anc line ---------- */
body.sub .anc:not(.anc1)>.container {border-top: 1px solid #ccc;}
body.overview .anc:not(.anc1)>.container {border-top-color: #0387B4;}
body.esghighlights .anc:not(.anc1)>.container {border-top-color: #00A7E0;}
body.environmental .anc:not(.anc1)>.container {border-top-color: #8CC051;}
body.social .anc:not(.anc1)>.container {border-top-color: #F6BB43;}
body.governance .anc:not(.anc1)>.container {border-top-color: #C28E40;}
body.appendix .anc:not(.anc1)>.container {border-top-color: #919398;}


@media ( max-width: 1024px ) {
    body.sub #Vsl>.container .context {bottom: 70px;}
}
@media ( max-width: 760px ) {
    body.sub #Vsl>.container .context {bottom: 30px;}
}

@media ( max-width: 640px ) {
    body.sub #Vsl>.container .context {bottom: 20px;}
    body.appendix_2.sub #Vsl>.container .context,
    body.appendix_3.sub #Vsl>.container .context,
    body.appendix_4.sub #Vsl>.container .context,
    body.appendix_5.sub #Vsl>.container .context {bottom: 50px;}
    body.sub #Vsl>.container .context>.tit {font-size: 2.5rem; line-height: 120%;}
    body.sub #Vsl>.container .context>.exp {font-size: 1.6rem; margin-top: 10px; line-height: 130%; }
}
/*
------------------------------------------------------------
S U B - U N I T - C O M M O N
------------------------------------------------------------
*/











/* margin-top */
.mt_-5 {margin-top: -5px !important;}
.mt_3 {margin-top: 3px !important;}
.mt_23 {margin-top: 23px !important;}
.mt_36 {margin-top: 36px !important;}
.mt_58 {margin-top: 58px !important;}
.mt_72 {margin-top: 72px !important;}
.mt_78 {margin-top: 72px !important;}
.mt_110 {margin-top: 110px !important;}

/* margin-bottom */
.mb_3 {margin-bottom: 3px !important;}
.mb_18 {margin-bottom: 18px !important;}


/* padding */
.pd_7 {padding: 7px !important;}
.pd_9 {padding: 9px !important;}
.pd_18 {padding: 18px !important;}
.pd_24 {padding: 24px !important;}
.pd_36 {padding: 36px !important;}
.pd_0_13 {padding: 0 13px !important;}
.pd_0_5 {padding: 0 5px !important;}
.pd_0_10 {padding: 0 10px !important;}
.pd_0_20 {padding: 0 20px !important;}
.pd_0_10_24 {padding: 0 10px 24px !important;}
.pd_0_24_24 {padding: 0 24px 24px !important;}
.pd_0_25 {padding: 0 25px !important;}
.pd_0_30 {padding: 0 30px !important;}
.pd_0_30_30 {padding: 0 30px 30px !important;}
.pd_5_10 {padding: 5px 10px !important;}
.pd_9_0 {padding: 9px 0 !important;}
.pd_10_0 {padding: 10px 0 !important;}
.pd_10_20 {padding: 10px 20px !important;}
.pd_12_10 {padding: 12px 10px !important;}
.pd_15_7 {padding: 15px 7px !important;}
.pd_17_19 {padding: 17px 19px !important;}
.pd_18_25 {padding: 18px 25px !important;}
.pd_18_16 {padding: 18px 16px !important;}
.pd_18_12 {padding: 18px 12px !important;}
.pd_20_0 {padding: 20px 0 !important;}
.pd_20_5 {padding: 20px 5px !important;}
.pd_20_0_10 {padding: 20px 0 10px !important;}
.pd_20_10 {padding: 20px 10px !important;}
.pd_20_24 {padding: 20px 24px !important;}
.pd_20_30 {padding: 20px 30px !important;}
.pd_20_40 {padding: 20px 40px !important;}
.pd_20_r_10 {padding: 20px 10px 20px 20px !important;}
.pd_20_l10_r0 {padding: 20px 0 20px 10px !important;}
.pd_20_r0 {padding: 20px 0 20px 20px !important;}
.pd_24_12 {padding: 24px 12px !important;}
.pd_36_15 {padding: 36px 15px !important;}
.pd_35_25 {padding: 35px 25px !important;}
.pd_24_24_10 {padding: 24px 24px 10px !important;}
.pd_38_24_24 {padding: 38px 24px 24px !important;}
.pd_24_34 {padding: 24px 34px !important;}
.pd_18_52 {padding: 18px 52px !important;}
.pd_26_68 {padding: 26px 68px !important;}
.pd_27_0 {padding: 27px 0 !important;}
.pd_32_30 {padding: 32px 30px !important;}
.pd_5_5_0 {padding: 5px 5px 0 !important;}
.pd_10_10_0 {padding: 10px 10px 0 !important;}
.pd_10_17_15 {padding: 10px 17px 15px !important;}
.pd_10_25_25 {padding: 10px 25px 25px !important;}
.pd_10_30_50 {padding: 10px 30px 50px !important;}
.pd_10_50_50 {padding: 10px 50px 50px !important;}
.pd_16_24_28 {padding: 16px 24px 28px !important;}































/*.btns .btn:not(:first-child) {margin-left: 40px;}*/
.btns .btn.btn_bgc {background: #C7C7C7; font-size: 1.5rem; font-weight: 600; color: #ffffff; line-height: 100%; border-radius: 999px; padding: 9px 30px; min-width: 170px;}
.overview .btns .btn.btn_bgc {background: #00A7E0;}
.esghighlights .btns .btn.btn_bgc {background: #0090C1;}
.environmental .btns .btn.btn_bgc {background: #8CC051;}
.social .btns .btn.btn_bgc {background: #F6BB43;}
.governance .btns .btn.btn_bgc {background: #C28E40;}
.appendix .btns .btn.btn_bgc {background: #919398;}
.btns .btn>.bullet {position: absolute; right: 10px; top:0; height: 100%; display: flex; align-items: center;}
.btns .btn.btn_bgc.btb_large {min-width: 680px;}
.btns .btn.btn_bgc.btb_medium {min-width: 420px;}
.btns .btn.btn_bgc.btb_small {min-width: 252px;}

@media (max-width: 1320px) {
    /*.btns.fdr .item:not(:first-child) {margin-left: 20px;}*/
    .btns .btn.btn_bgc {padding: 9px 30px; min-width: 170px;}
}

@media (max-width: 1024px) {
    /*.btns.fdr .item:not(:first-child) {margin-left: 20px;}*/
    .btns .btn.btn_bgc {min-width: 170px;}
    /*.btns .item:not(:first-child) {margin-top: 10px;}*/
}



@media (max-width: 640px) {
    .btns.fdr {flex-direction: column;}
    /*.btns .btn {margin-left: 0;}*/
    .btns .btn.btn_bgc {min-width: 140px; font-size: 1.4rem; padding: 10px 20px;}
    .btns .btn>.bullet {height: 100%; display: flex; align-items: center;}
    .btns .btn.btn_bgc.btb_large {min-width: unset; width: 100%; line-height: 150%;}
    .btns .btn.btn_bgc.btb_medium {min-width: unset; width: 100%;}
    .btns .btn.btn_bgc.btb_small {min-width: unset; width: 100%;}

}



/* titlebar */


/* font-size */
.fs_8 {font-size: 0.8rem !important;}
.fs_9 {font-size: 0.9rem !important;}
.fs_10 {font-size: 1rem !important;}
.fs_11 {font-size: 1.1rem !important;}
.fs_12 {font-size: 1.2rem !important;}
.fs_13 {font-size: 1.3rem !important;}
.fs_14 {font-size: 1.4rem !important;}
.fs_15 {font-size: 1.5rem !important;}
.fs_16 {font-size: 1.6rem !important;}
.fs_17 {font-size: 1.7rem !important;}
.fs_18 {font-size: 1.8rem !important;}
.fs_19 {font-size: 1.9rem !important;}
.fs_20 {font-size: 2rem !important;}
.fs_24 {font-size: 2.4rem !important;}
.fs_26 {font-size: 2.6rem !important;}
.fs_28 {font-size: 2.8rem !important;}
.fs_30 {font-size: 3rem !important;}
.fs_36 {font-size: 3.6rem !important;}
.fs_40 {font-size: 4rem !important;}
@media (max-width: 640px) {
    .fs_12 {font-size: 1rem !important;}
    .fs_16 {font-size: 1.4rem !important;}
    .fs_20 {font-size: 1.6rem !important;}
    .fs_30 {font-size: 2.2rem !important;}
    .fs_40 {font-size: 3rem !important;}
}



/* font-weight */
.fw_3 {font-weight: 300 !important;}
.fw_4 {font-weight: 400 !important;}
.fw_5 {font-weight: 500 !important;}
.fw_6 {font-weight: 600 !important;}
.fw_7 {font-weight: 700 !important;}
/* font-color */
.fc_white {color: #ffffff !important;}
.fc_black {color: #000000 !important;}

/* line-height */
.lh_20 {line-height: 20px !important;}
.lh_24 {line-height: 24px !important;}
.lh_30 {line-height: 30px !important;}
.lh_36 {line-height: 36px !important;}
.lh_40 {line-height: 40px !important;}

.lh10 {line-height: 100% !important;}
.lh11 {line-height: 110% !important;}
.lh12 {line-height: 120% !important;}
.lh13 {line-height: 130% !important;}
.lh14 {line-height: 140% !important;}
.lh15 {line-height: 150% !important;}
.lh16 {line-height: 160% !important;}

/* diagram */
.dgrm {margin-top: 70px; min-height: 200px; background: #eee;}
.dgrm1 {background: unset;}

/* border */
.bt_2 {border-top: 2px solid #868686;}




/* bg */





    /* line_color_sub */
.overview .line {border: 1px solid #00A7E0;}
.esghighlights .line {border: 1px solid #0090C1;}
.environmental .line {border: 1px solid #8CC051;}
.social .line {border: 1px solid #F6BB43;}
.governance .line {border: 1px solid #C28E40;}
.appendix .line {border: 1px solid #919398;}


/*
------------------------------------------------------------
S U B - C O M M O N
------------------------------------------------------------
*/

/* sub background primary */
.overview .bgc_sub_pri {background-color: #0090C1 !important;}
.esghighlights .bgc_sub_pri {background-color: #037BA4 !important;}
.environmental .bgc_sub_pri {background-color: #20853C !important;}
.social .bgc_sub_pri {background-color: #FE7C03 !important;}
.governance .bgc_sub_pri {background-color: #966318 !important;}
.appendix .bgc_sub_pri {background-color: #919398 !important;}

.esghighlights .bgc_sub1 {background-color: #00A7E0 !important;}
.esghighlights .bgc_sub2 {background-color: #8CC051 !important;}
.esghighlights .bgc_sub_pri1 {background-color: #70A831 !important;}
.esghighlights .bgc_sub_light {background-color: #00A7E0 !important;}
.esghighlights .bgc_sub_light1 {background-color: #dcedf3 !important;}
.esghighlights .bgc_sub_light2 {background-color: #e0ead4 !important;}
.esghighlights .bgc_sub_light4 {background-color: #5AD5FF !important;}

.environmental .bgc_light {background-color: #CCE0B4 !important;}

.social .bgc_sub_light {background-color: #fef8ec;}
.social .bgc_sub1 {background-color: #F6BB43;}
.social .bgc_sub2 {background-color: #fbdda1;}
.social .bgc_sub3 {background-color: #FFAB00;}
.social .bgc_sub4 {background-color: #FE7C03;}

.bgc_g0_gd {background: linear-gradient(to top, #ECECEC, #ffffff);}
.overview .bgc_sub_gd {background: #00A7E0;}
.esghighlights .bgc_sub_gd {background: linear-gradient(to right, #00A7E0, #007BA5);}
.environmental .bgc_sub_gd {background: #8CC051;}
.social .bgc_sub_gd {background: linear-gradient(to right, #FEAB03, #FE7C03);}
.social .bgc_sub_vgd {background: linear-gradient(to bottom, #F6BB43, #FFAB00);}
.governance .bgc_sub_gd {background: #966318;}
.appendix .bgc_sub_gd {background: #919398;}


/* ul common */


/* height */
.h_18 {height: 18px !important;}
.h_22 {height: 22px !important;}
.h_26 {height: 26px !important;}
.h_36 {height: 36px !important;}
.h_42 {height: 42px !important;}
.h_46 {height: 46px !important;}
.h_49 {height: 49px !important;}
.h_53 {height: 53px !important;}
.h_62 {height: 62px !important;}
.h_68 {height: 68px !important;}
.h_74 {height: 74px !important;}
.h_81 {height: 81px !important;}
.h_108 {height: 108px !important;}
.h_122 {height: 122px !important;}
.h_138 {height: 138px !important;}
.h_172 {height: 172px !important;}
.h_186 {height: 186px !important;}
.h_258 {height: 258px !important;}
.h_320 {height: 320px !important;}

.h48 {min-height: 48% !important;}
.h58 {min-height: 58% !important;}

.mh_18 {min-height: 18px !important;}
.mh_26 {min-height: 26px !important;}
.mh_30 {min-height: 30px !important;}
.mh_32 {min-height: 32px !important;}
.mh_36 {min-height: 36px !important;}
.mh_40 {min-height: 40px !important;}
.mh_46 {min-height: 46px !important;}
.mh_60 {min-height: 60px !important;}
.mh_80 {min-height: 80px !important;}
.mh_87 {min-height: 87px !important;}
.mh_100 {min-height: 100px !important;}
.mh_127 {min-height: 127px !important;}
.mh_136 {min-height: 136px !important;}
.mh_170 {min-height: 170px !important;}
.mh_392 {min-height: 392px !important;}
.mh_152 {min-height: 152px !important;}
.mh_282 {min-height: 282px !important;}
/*.mh_312 {min-height: 312px !important;}*/

.mh50 {min-height: 50% !important;}

/* width */
.w_160 {width: 160px !important;}
.w_181 {width: 181px !important;}
.w_220 {width: 220px !important;}
.w_530 {width: 530px !important;}

.w35 {width: 35% !important;}
.w45 {width: 45% !important;}
.w53 {width: 53% !important;}
.w76 {width: 76% !important;}




/*
----------------------------------------
U N I T
----------------------------------------
*/








.hdr.bx.r {border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important;}
.bdy.bx.r {border-top-left-radius: 0 !important; border-top-right-radius: 0 !important;}
.ftr.bx.r {border-top-left-radius: 0 !important; border-top-right-radius: 0 !important;}
.hdr.lft.bx.r {border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; border-top-left-radius: 10px !important; border-bottom-left-radius: 10px !important;}
.bdy.rght.bx.r {border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; border-top-right-radius: 10px !important; border-bottom-right-radius: 10px !important;}
.bgc.bx:not(.bgc_w, .bgc_g0) {color: #ffffff;}
.bgi {background-repeat: no-repeat; background-position: center; background-size: cover; overflow: hidden;}
.grp.r {border-radius: 10px;}



.r.ovf {padding: 0; border-radius: 10px; overflow: hidden; height: fit-content;}

.bx.r.ovf {padding: 0; overflow: hidden;}

.overview .bgc {background-color: #00A7E0 !important;}
.esghighlights .bgc {background-color: #0090C1 !important;}
.environmental .bgc {background-color: #8CC051 !important;}
.social .bgc {background-color: #F6BB43 !important;}
.governance .bgc {background-color: #C28E40 !important;}
.appendix .bgc {background-color: #919398 !important;}

.overview .bgc_pri {background-color: #0090C1 !important;}
.esghighlights .bgc_pri {background-color: #037BA4 !important;}
.environmental .bgc_pri {background-color: #20853C !important;}
.social .bgc_pri {background-color: #FE7C03 !important;}
.governance .bgc_pri {background-color: #966318 !important;}
.appendix .bgc_pri {background-color: #A0A2A9 !important;}





/* table */
.tbl .grd .item {padding: 4px 5px 4px 10px; border-top: 1px solid #7A7A7A; font-weight: 400; min-height: 34px;}
.tbl .grd .item.row1 {border-top: 0;}
sup {font-size: .5rem; line-height: 100%;}
sub {font-size: .5rem; line-height: 100%;}
.meta_txt sup, .meta_txt sub {font-size: .8rem; line-height: 100%;}


.g_r1 {grid-row: span 1;}
.g_r2 {grid-row: span 2 !important;}
.g_r3 {grid-row: span 3 !important;}
.g_r4 {grid-row: span 4;}
.g_r5 {grid-row: span 5;}
.g_r6 {grid-row: span 6;}
.g_r7 {grid-row: span 7;}
.g_r8 {grid-row: span 8;}
.g_r9 {grid-row: span 9;}
.g_r10 {grid-row: span 10;}
.g_r11 {grid-row: span 11;}
.g_r12 {grid-row: span 12;}
.g_r13 {grid-row: span 13;}
.g_r14 {grid-row: span 14;}
.g_r15 {grid-row: span 15;}
.g_r16 {grid-row: span 16;}
.g_r17 {grid-row: span 17;}
.g_r18 {grid-row: span 18;}
.g_r19 {grid-row: span 19;}
.g_r20 {grid-row: span 20;}
.g_r21 {grid-row: span 21;}
.g_r22 {grid-row: span 22;}
.g_r23 {grid-row: span 23;}
.g_r24 {grid-row: span 24;}
.g_r25 {grid-row: span 25;}
.g_r26 {grid-row: span 26;}
.g_r27 {grid-row: span 27;}
.g_r28 {grid-row: span 28;}
.g_r29 {grid-row: span 29;}
.g_r30 {grid-row: span 30;}

.g_c1 {grid-column: span 1;}
.g_c2 {grid-column: span 2;}
.g_c3 {grid-column: span 3;}
.g_c4 {grid-column: span 4;}
.g_c5 {grid-column: span 5;}
.g_c6 {grid-column: span 6;}
.g_c7 {grid-column: span 7;}
.g_c8 {grid-column: span 8;}
.g_c9 {grid-column: span 9;}
.g_c10 {grid-column: span 10;}
.g_c11 {grid-column: span 11;}
.g_c12 {grid-column: span 12;}
.g_c13 {grid-column: span 13;}
.g_c14 {grid-column: span 14;}
.g_c15 {grid-column: span 15;}
.g_c16 {grid-column: span 16;}
.g_c17 {grid-column: span 17;}
.g_c18 {grid-column: span 18;}
.g_c19 {grid-column: span 19;}
.g_c20 {grid-column: span 20;}

/* 셀내부 작은글씨 smllr */
.tbl .grd .item .smllr {display: inline-block; font-size: 1.2rem; line-height: 120%;}
/* 셀내부 bx */
.tbl .grd .item .bx p {font-size: 1.4rem; line-height: 24px;}
/* 셀내부 li */



.overview .tbl.bsc {border-top: 2px solid #00A7E0 !important;}
.esghighlights .tbl.bsc {border-top: 2px solid #0090C1 !important;}
.environmental .tbl.bsc {border-top: 2px solid #8CC051 !important;}
.social .tbl.bsc {border-top: 2px solid #F6BB43 !important;}
.governance .tbl.bsc {border-top: 2px solid #C28E40 !important;}
.appendix .tbl.bsc {border-top: 2px solid #7A7A7A !important;}

/* grid common */
.grd.bsc {border-bottom: 1px solid #C7C7C7;}
.overview .grd.bsc {border-top: 2px solid #00A7E0 !important;}
.esghighlights .grd.bsc {border-top: 2px solid #0090C1 !important;}
.environmental .grd.bsc {border-top: 2px solid #8CC051 !important;}
.social .grd.bsc {border-top: 2px solid #F6BB43 !important;}
.governance .grd.bsc {border-top: 2px solid #C28E40 !important;}
.appendix .grd.bsc {border-top: 2px solid #7A7A7A !important;}

/* border  */
.bd {border-width: 1px; border-style: solid;}
.bd_bsc {border: 1px solid #868686;}
/* border remove */
.bd_t_rm {border-top: 0 !important;}
.bd_r_rm {border-right: 0 !important;}
.bd_b_rm {border-bottom: 0 !important;}
.bd_l_rm {border-left: 0 !important;}
/* border color */
.bdc_white {border-color: #FFFFFF !important;}
.bdc_gry {border: 1px solid #E4E3E3 !important;}
.bdc_gry1 {border: 1px solid #C7C7C7 !important;}
.bdc_sub {border-color: #868686 !important;}
.bdc_sub2 {border-width: 2px !important;}

.overview .bdc {border-color: #00A7E0 !important;}
.esghighlights .bdc {border-color: #0090C1 !important;}
.environmental .bdc {border-color: #8CC051 !important;}
.social .bdc {border-color: #F6BB43 !important;}
.governance .bdc {border-color: #C28E40 !important;}
.appendix .bdc {border-color: #7A7A7A !important;}

/* border top */
.overview .bd_t_sub {border-top: 1px solid #00A7E0 !important;}
.esghighlights .bd_t_sub {border-top: 1px solid #0090C1 !important;}
.environmental .bd_t_sub {border-top: 1px solid #8CC051 !important;}
.social .bd_t_sub {border-top: 1px solid #F6BB43 !important;}
.governance .bd_t_sub {border-top: 1px solid #C28E40 !important;}
.appendix .bd_t_sub {border-top: 1px solid #7A7A7A !important;}

.bd_t_bsc {border-top: 1px solid #868686 !important;}
.bd_t_gray {border-top: 1px solid #C7C7C7 !important;}
.bd_t_sub.bd_t_sub2 {border-top-width: 2px !important;}

/* border bottom */
.overview .bd_b_sub {border-bottom: 1px solid #00A7E0 !important;}
.esghighlights .bd_b_sub {border-bottom: 1px solid #0090C1 !important;}
.environmental .bd_b_sub {border-bottom: 1px solid #8CC051 !important;}
.social .bd_b_sub {border-bottom: 1px solid #F6BB43 !important;}
.governance .bd_b_sub {border-bottom: 1px solid #C28E40 !important;}
.appendix .bd_b_sub {border-bottom: 1px solid #7A7A7A !important;}

.bd_b_gray {border-bottom: 1px solid #7A7A7A;}
.bd_b_bsc {border-bottom: 1px solid #868686 !important;}
.bd_b_sub.bd_b_sub2 {border-bottom-width: 2px !important;}

/* border dashed */
.bd_dash_gray {border: 1px dashed #868686 !important;}
.bd_t_dash_bsc {border-top: 1px dashed #868686;}
.bd_b_dash_bsc {border-bottom: 1px dashed #868686;}

.overview .bd_t_dash_sub {border-top: 1px dashed #00A7E0;}

.overview .bd_dash_sub {border: 1px dashed #00A7E0 !important;}
.esghighlights .bd_dash_sub {border: 1px dashed #0090C1 !important;}
.environmental .bd_dash_sub {border: 1px dashed #8CC051 !important;}
.social .bd_dash_sub {border: 1px dashed #F6BB43 !important;}
.governance .bd_dash_sub {border: 1px dashed #C28E40 !important;}
.appendix .bd_dash_sub {border: 1px dashed #7A7A7A !important;}

.esghighlights .bd_t_dash_sub {border-top: 1px dashed #0090C1;}
.environmental .bd_t_dash_sub {border-top: 1px dashed #8CC051;}
.social .bd_t_dash_sub {border-top: 1px dashed #F6BB43;}
.governance .bd_t_dash_sub {border-top: 1px dashed #C28E40;}
.appendix .bd_t_dash_sub {border-top: 1px dashed #7A7A7A;}

.environmental .bd_b_dash_sub {border-bottom: 1px dashed #8CC051;}



.grd .gc_12 {grid-column: 1/3;}
.grd .gc_34 {grid-column: 3/5;}

/* common title */
.ttl_1 {font-size: 4rem; font-weight: 300; line-height: 150%;}
.ttl_2 {font-size: 3rem; font-weight: 300; line-height: 120%;}
.ttl_3 {font-size: 2rem; font-weight: 500;}
.ttl_4 {font-size: 1.8rem; font-weight: 400;}

@media ( max-width: 1024px ) {
    .ttl_1 {font-size: 3.8rem;}
    .ttl_2 {font-size: 2.8rem;}
    .ttl_3 {font-size: 2rem;}
    .ttl_4 {font-size: 1.8rem;}
}
@media ( max-width: 640px ) {
    .ttl_1 {font-size: 2.6rem;}
    .ttl_2 {font-size: 2.2rem;}
    .ttl_3 {font-size: 1.6rem; font-weight: 400;}
    .ttl_4 {font-size: 1.5rem;}
}

.grs2 {grid-row: span 2;}
.gcs2 {grid-column: span 2;}

/*.content>.ttl_1 {margin-bottom: 55px;}*/
.content>.ttl_1 {margin-bottom: 2.5rem;}
/*.content .ttl_2 {margin-top: 80px; margin-bottom: 20px;}*/
.content .ttl_2 {margin-top: 3rem; margin-bottom: 1.5rem;}
.content .ttl_2.dash {background-position: center; background-image: url("/static/svg/h_dash_bg.svg"); background-repeat: repeat-x; margin-top: 60px; margin-bottom: 20px;}
.content .ttl_2.dash>p {background: #ffffff; padding-right: 2%; line-height: 100%; width: fit-content;}
/*.content .sect .ttl_2 {margin-top: 0;}*/
.content>.ttl_3 {margin-top: 60px; margin-bottom: 20px;}
.content>.ttl_3>span {font-size: 1.6rem;}
@media ( max-width: 640px ) {
    .content>.ttl_3 {margin-top: 40px; margin-bottom: 20px;}
}


.content>.ttl_4 {margin-top: 40px; margin-bottom: 20px;}
.content .ttl_4.dash {background-position: center; background-image: url("/static/svg/h_dash_bg.svg"); background-repeat: repeat-x; margin-top: 60px; margin-bottom: 20px;}
.content .ttl_4.dash.flx>p {background: #ffffff; padding-left: 3%; padding-right: 3%; line-height: 100%;}

.content .bgc .ttl_3 {margin-bottom: 15px;}
.content .bgc_g0 .ttl_3 {margin-bottom: 15px;}
.content .bgc_g0 .ttl_3 .bgc_g0 {font-weight: 500;}

.content .sect>div>.ttl_2:first-child {margin-top: 0;}

/* ttl dash  */
.content .sect .ttl_4.dash {margin-top: 0; margin-bottom: 30px;}
.content .sect .ttl_4.dash.flx>p {}

.content .tbl_ttl {margin-bottom: 10px !important;}
@media ( max-width: 640px ) {
    .content .tbl_ttl {margin-bottom: 5px !important;}
}
/* font-size */
.fs_22 {font-size: 2.2rem !important;}
/* font-color */
.fc_bsc {color: #2B2B2B !important;}
.fc_gray {color: #7A7A7A !important;}
.fc_gray1 {color: #F5F5F5 !important;}
/* font-color sub */
.overview .fc_sub {color: #00A7E0 !important;}
.esghighlights .fc_sub {color: #0090C1 !important;}
.environmental .fc_sub {color: #8CC051 !important;}
.social .fc_sub {color: #F6BB43 !important;}
.governance .fc_sub {color: #986110 !important;}
.appendix .fc_sub {color: #7A7A7A !important;}

.social .fc_sub_pri {color: #FF7A00;}
.social .fc_sub_pri1 {color: #FE0303;}

.environmental .fc_pri {color: #0A5920 !important;}
.environmental .fc_pri1 {color: #20853C !important;}

.graph .bar .item {text-align: center; padding: .5vw 0;}
.graph .bar .item p {font-size: 1.8rem; font-weight: 600; line-height: 100%; color: #ffffff; text-align: center;}
@media ( max-width: 1024px ) {
    .graph .bar .item {text-align: center; padding: 1vw 0;}
    .graph .bar .item p {text-align: center; font-size: 1.6rem;}
}
@media ( max-width: 640px ) {
    .graph .bar .item p {font-size: 1.6rem;}
}





/*.grd.g_1_13 {grid-template-columns: 43px 149px 142px 84px 136px 39px 39px 39px 39px 39px 39px 39px 39px 39px 39px 39px 39px 162px}*/







/* 확인필요 */
.content .cont>.item>.txt>p {text-align: left; font-weight: 400; line-height: 160%;}

.content .bgc.r,
.content .bgc_w.r,
.content .bgc_g0.r {border-radius: 10px;}




@media (max-width: 640px) {
    .content .bgc_g0 {} /* padding: 20px 14px; */
    .content .bgc_w p,
    .content .bgc_g0 p {font-size: 1.4rem !important; line-height: 140%;}
    .content .bgc_w li,
    .content .bgc_g0 li {font-size: 1.4rem;}
}

/* circle */
.content .crcl {margin-top: -1px; margin-left: -1px; min-width: 60px !important; min-height: 60px !important; border-radius: 50%;}
/* perpect circle */
.content .p_crcl {padding-bottom: 100%;}
.content .p_crcl>div {position: absolute; top:0; left: 0; width: 100%; height: 100%;}
.content .p_crcl>div>img {width: 40%;}

.content .p_bx {padding-bottom: 100%;}

/* shadow */
.content .shdw {box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);}
.content .shdw_r {box-shadow: 4px 0 4px rgba(0, 0, 0, 0.1);}

.content .line {background: #ffffff;}
.content .line>p {color: #2B2B2B;}


.t_20 {top: 20px;}
.r_20 {right: 20px;}
.b_20 {bottom: 20px;}
.l_20 {left: 20px;}

.t_25 {top: 25px;}
.r_10 {right: 10px;}
.l_10 {left: 10px;}
.t_-1 {top: -1px;}
.t-10 {top: -10%;}
.t_-10 {top: -10px;}
.t_-20 {top: -20px;}
.t_-30 {top: -30px;}
.t_-40 {top: -40px;}
.t-20 {top: -20%;}
.t-30 {top: -30%;}
.t-40 {top: -40%;}
.t-50 {top: -50%;}

.t_-30 {top: -30px;}

.b_-10 {bottom: -10px;}
.b_25 {bottom: 25px;}
.b_50 {bottom: 50px;}
.b_30 {bottom: 30px;}







/* line */
.v_ln {width: 1px; height: 100%; background: #868686; padding: 0;}
.h_ln {width: 100%; height: 1px; background: #868686; padding: 0;}
.v_ln.v_ln2 {width: 2px;}
.h_ln.v_ln2 {height: 2px;}
.v_ln.dash {background: url("/static/svg/v_dash_bg.svg"); background-repeat: repeat-y; background-position: center; background-size: auto;}
.h_ln.dash {background: url("/static/svg/h_dash_bg.svg"); background-repeat: repeat-x; background-position: center; background-size: auto;}
.h_ln.abs.r50 {left: -50%; width: 100%;}
.h_ln.abs.l50 {left: 50%; width: 100%;}

.lnc_g {background-color: #E4E3E3 !important;}
.overview .lnc {background-color: #00A7E0 !important;}
.esghighlights .lnc {background-color: #0090C1 !important;}
.environmental .lnc {background-color: #8CC051 !important;}
.social .lnc {background-color: #F6BB43 !important;}
.governance .lnc {background-color: #C28E40 !important;}
.appendix .lnc {background-color: #7A7A7A !important;}

.overview .h_ln.dash .ln_sub {background-image: url("/static/svg/h_dash_3_bg.svg") !important;}
.environmental .h_ln.dash .ln_sub {background-image: url("/static/svg/h_dash_3_bg.svg") !important;}

/* model srch */
.srch_frm {position: fixed; top: 0; width: 100%; height: 204px; display: none; z-index: 1101; align-items: center; justify-content: center;}
.srch_frm>.mdl_wn {position: relative; width: 1320px; height: 100%; background: #ffffff; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px;  z-index: 1102;}
.srch_frm>.mdl_wn>.btn_close {position: absolute; top: 20px; right: 20px; background: #ffffff; z-index: 1103;}
.srch_frm>.mdl_wn>.content {position: relative; padding: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: unset;}
.srch_frm>.mdl_wn>.content .srch_box {display: block; position: relative; width: 50%; height: 40px; border-bottom: 1px solid #00A7E0;}
.srch_frm>.mdl_wn>.content .srch_box input {font-size: 24px; text-align: left; width: 100%; outline: none;}
.srch_frm>.mdl_wn>.content .srch_box .srch_bttn {display: inline-block; position: absolute; right: 0;}

/* model grph */
.mdl_frm {position: fixed; width: 100%; height: 100%; display: none; z-index: 1001; align-items: center; justify-content: center;}
.mdl_frm>.mdl_wn {position: relative; width: 70%; height: 80%; z-index: 1002;}
.mdl_frm>.mdl_wn>.btn_close {position: absolute; top: 20px; right: 20px; background: #ffffff; z-index: 1003;}
.mdl_frm>.mdl_wn>.content {position: relative; background: #FFFFFF; border-radius: 10px; padding: 0; width: 100%; height: 100%; }
.mdl_frm>.mdl_wn>.content #chartTtl {position: absolute; top: 60px; width: 100%; height: 80px;} /* display: flex; flex-direction: column; align-items: center; justify-content: space-between; border: 1px solid transparent;*/
.mdl_frm>.mdl_wn>.content #chartTtl .ttl_4 {width: 100%; margin: 0 auto;}
.mdl_frm>.mdl_wn>.content #chartWrap {position: relative; width: 100%; height: 100%; padding-bottom: 50px; display: flex; justify-content: flex-end; flex-direction: column;}

.mdl_frm>.mdl_wn>.content #chartWrap .chart {position: relative;}

.mdl_frm>.mdl_wn>.content #chartWrap .chart#chart_line {width: 100%; height: 30% !important;}


.mdl_frm>.mdl_wn>.content #chartWrap .chart#chart_line .apexcharts-series-markers-wrap {z-index: 1008;}
.mdl_frm>.mdl_wn>.content #chartWrap .chart#chart_bar { height: 60% !important;}
.mdl_frm>.mdl_wn>.content #chartWrap .chart_bg {position: absolute; width: 100%; height: 50%; background-image: linear-gradient(#ffffff, #eeeeee); bottom: 97px;}

.mdl_bg {position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: #000000; opacity: .7; display: none; z-index: 1000; cursor: pointer;}
.mdl_frm>.mdl_wn>.content #chart_cat {position: absolute; width: 100%; top: 100px; display: flex; flex-wrap: wrap; row-gap: 20px; justify-content: space-between; align-items: center; flex-direction: row; padding: 0 30px;}
.mdl_frm>.mdl_wn>.content #chart_cat #category_grp {display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; column-gap: 10px; row-gap: 10px;}
.mdl_frm>.mdl_wn>.content #chart_cat #series_grp {display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; column-gap: 20px; row-gap: 10px;}
.mdl_frm>.mdl_wn>.content #chart_cat .bttn {display: flex; align-items: center; justify-content: flex-start; column-gap: 5px; color: #ffffff; line-height: 100%; width: auto; z-index: 1007; padding: 4px 15px; min-height: 24px; min-width: 60px;border-radius: 3px;}
.mdl_frm>.mdl_wn>.content #chart_cat .bttn>.chk_bx {width: 14px; height: 14px; background: url("/static/svg/c_unchkd.svg"); background-position: center; background-size: contain; background-repeat: no-repeat; z-index: 0;}
.mdl_frm>.mdl_wn>.content #chart_cat .bttn.active>.chk_bx {background: url("/static/svg/c_chkd.svg"); background-position: center; background-size: contain; background-repeat: no-repeat;z-index: 0;}
.mdl_frm>.mdl_wn>.content #chart_cat .bttn .c_bx {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: -1; border-radius: 3px;}
.mdl_frm>.mdl_wn>.content .apexcharts-legend {margin-right: 40px;}

@media (max-width: 640px) {

    .mdl_frm>.mdl_wn {position: relative; width: 90%; height: 90%; z-index: 1002;}
    .mdl_frm>.mdl_wn>.btn_close {top: 10px; right: 10px; width: 17px; height: 17px;}
    .mdl_frm>.mdl_wn>.content #chartTtl {position: absolute; top: 45px; width: 100%; height: auto;}

    .mdl_frm>.mdl_wn>.content #chart_cat {top: 70px; padding: 0 10px;}
    .mdl_frm>.mdl_wn>.content #chart_cat .bttn { padding: 3px 7px; min-height: 20px; min-width: 50px; border-radius: 3px; font-size: 1.2rem;}
    .mdl_frm>.mdl_wn>.content #chart_cat .bttn>.chk_bx {width: 10px; height: 10px;}
    .mdl_frm>.mdl_wn>.content #chart_cat #category_grp {column-gap: 7px; row-gap: 5px;}
    .mdl_frm>.mdl_wn>.content #chart_cat #series_grp { column-gap: 7px; row-gap: 5px;}

    .mdl_frm>.mdl_wn>.content #chartWrap .chart#chart_line {position: absolute !important; top: 200px !important; width: 100%; height: 30% !important;}
    .mdl_frm>.mdl_wn>.content #chartWrap .chart#chart_bar { height: 50% !important;}
    .mdl_frm>.mdl_wn>.content #chartWrap .chart_bg {bottom: 49px;}

}

.apexcharts-tooltip {
    box-shadow: none !important;
    border-radius: 0 !important;
}
.mdl_frm>.mdl_wn>.content .cstm_tltp {border: 1px solid #cccccc; background: #ffffff; padding: 10px; font-size: 12px; width: 200px;}
.mdl_frm>.mdl_wn>.content .cstm_tltp_bdy {text-align: left;}
.mdl_frm>.mdl_wn>.content .cstm_tltp_bdy .col {display: flex; align-items: center; justify-content: space-between;}
.mdl_frm>.mdl_wn>.content .cstm_tltp_bdy .col .row {}























/*
--------------------
form
--------------------
*/
.inpt::placeholder,
.inpt::-webkit-input-placeholder,
.inpt:-ms-input-placeholder {
    color: red;
    font-style: italic;
}
.inpt {position: relative; padding: 5px 8px; border: 1px solid #ccc; min-height: 36px; width: 100%; font-size: 1.4rem; font-weight: 400; color: #aaa;}

.bttn {min-width: 100px; width: 100%; min-height: 50px; padding: 10px 20px; background: #999999; color: #ffffff; font-size: 16px; cursor: pointer;}
.bttn.pri {background: #222;}