@charset "utf-8";

/* set */
body {position:relative;font-size:16px !important;margin:0;padding:0;font-family: 'Pretendard', sans-serif;color:#222;font-weight: 300;}
input, select, button{font-family: 'Pretendard', sans-serif;}
body *{ box-sizing:border-box;}
a {color:var(--gray2);font-weight:500;}
::selection {background:var(--color2);color:var(--white);text-shadow:none;}


#skip{top:0;right:0;position:absolute;width:100%;height:15px;text-align:center}
#skip li a{display:block;left:-10000px;position:absolute;top:0;width:100%;text-align:center;z-index:0;height:1px}
#skip li a:hover, #skip li a:focus, #skip li a:active{background:#363636;position:absolute;top:0px;left:0;z-index:5;color:#fff;width:100%;height:25px;padding:5px 0 0 0}



:root {
    --color1: #034694; /*main_color*/
    --color2: #283c82;
    --color3: #1a1c35; /*title, text, line*/
    --btnbg:  url("/images/07_economy/common/btn_set.png");
    --white: #fff;
    --black: #000;
    --gray1: #f2f2f2; /*bg*/
    --gray2: #3b434e; /*bottom_bg*/
    --gray3: #ebebeb; /*line*/
    --gray4: #e2e2e2; /*scroll*/
    --gray5: #aaa;
}


/*스크롤바스타일*/
*::-webkit-scrollbar {width:5px;height:5px;} /*스크롤바 사이즈*/
*::-webkit-scrollbar-track {border-radius:5px;background:var(--gray1);} /*스크롤바 배경*/
*::-webkit-scrollbar-thumb {background:var(--gray2);border-radius: 10rem} /* 스크롤 제어박스*/



header{position:relative;z-index:2}
section{position:relative;z-index:1}
footer{position:relative;z-index:1}



/* Mobile */
header{position:relative;height: 180px;}

.gnb{position:relative;background:var(--gray1);height:40px;}
.gnb ul{padding:6px 8px;display:flex;text-align:center;}
.gnb li a{display:block;padding:5px 8px;font-weight:500;letter-spacing:-0.03em}

h1{position:absolute;top: 55px;left: 20px;}
h1 a{display:inline-block;}

.top_search{position:absolute;top: 120px;left:0;width:100%;}
.top_search form{position:relative;padding:0 20px;}
.top_search label{position:absolute;top:10px;left:35px;color:#bbb}
.top_search input[type="text"]{background:var(--white);border:solid 1px var(--gray2);border-radius:30px;padding:10px;height:43px;width:calc(100% - 50px);}
.top_search input[type="submit"]{display:inline-block;width:43px;height:43px;overflow:hidden;padding-top:43px;background:var(--btnbg) no-repeat 0 0;margin-left:5px;}

.head{}
.head button{display:block;width:16px;height:0;padding-top:15px;overflow:hidden;background:var(--btnbg) no-repeat -70px -10px;position:absolute;top:70px;right:25px;}


.menu{display: none;position: fixed;top: 0;bottom: 0;left: 0;right: 0;background:var(--white);z-index: 9;}
.menu.on{display: block;}
.menu.on h2{padding:15px 20px;font-size: 20px;background:var(--gray2);color:var(--white);position:relative;top:unset;left:unset;height:60px;}
.menu>ul>li>a{display: block;font-size: 18px;font-weight: 600;color:var(--gray5);width: 50%;padding: 15px 0 15px 15px;border-bottom: 1px solid var(--gray3);letter-spacing:-1px;}
.menu>ul>li>a.on{background:var(--color1);color:var(--white);}
.depth_box{background:var(--gray1);position: absolute;top: 60px;left: 50%;right: 0;bottom: 0;overflow-y: auto;z-index: 1;padding-top: 20px;}
.menu li li a{display: block;font-size: 16px;padding: 10px 0 10px 20px;font-weight:500;}
.menu li li a .new_win{margin-top: 5px;background-position: 0 -120px;}
.menu li li ul{border-radius: 20px;background:var(--white);padding: 10px;margin:0 10px;}
.menu li li li{padding: 0 10px;}
.menu li li li a{display: block;padding: 8px 0;font-size: 14px;color:var(--gray2);border-top: 1px dashed var(--gray3);}
.menu li li li:first-child a{border:none;}
.menu li li li ul{padding:0;margin:0}
.menu li li li li{padding:0;margin:7px 0}
.menu li li li li a{display:block;position:relative;padding:0 0 0 10px;color:#898989;font-size:14px}
.menu li li li li a:before{content:"";display:block;width:2px;height:2px;background:#898989;position:absolute;top:8px;left:0}
.menu li li li li a>.new_win{background-position:-20px -120px}
.menu button{display:block;width:43px;height:0;padding-top:45px;overflow:hidden;background: var(--btnbg) no-repeat 0 -210px;position:absolute;top:7px;right:15px;}

.head .tsitemap{display:none;}



footer{clear:both;}

.f_banner{position:relative;border-top:solid 1px var(--color3);}
.f_banner .control .btn{position:absolute;top:22px;left:100px;}
.f_banner .control .btn button{ width:15px;height:0;padding-top:15px;box-shadow: none;border-radius:0;}
.f_banner .control .btn button.prev {background-position: -0px -135px;}
.f_banner .control .btn button.next {background-position:-30px -135px;}
.f_banner .control .btn button.stop {background-position:-126px -135px;}
.f_banner .control .btn button.play {background-position:-156px -135px;}
.f_banner h2{font-size:18px;padding:20px 20px 0 20px;}
.f_banner .list{overflow:hidden;padding:20px;}
.f_banner .list:after{display:block;content:"";width:60px;height:30px;background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,1));position:absolute;top: 55px;right:0;z-index:1;}
.f_banner .list li{float:left;}
.f_banner .list li a{display:block;padding:0 15px 0 0;}

.foot_wrap{background:var(--gray2);padding:30px 20px;}
.foot_info{font-size:16px;line-height:20px;color:var(--gray3)}
.foot_info address{display:inline-block;font-style:normal;letter-spacing:-0.05em;}
.foot_info span{display:block;}
.foot_info .copy{padding:10px 0;line-height:20px;font-size:15px;letter-spacing:-0.05em;}


/*******sub********/



/* Tablet */
@media all and (min-width:768px) {

header{height:120px;}    
.top_search{width: 350px;top: 58px;left: 60%;transform:translate(-50%,0);}
    
.f_banner .list:after{width:180px;}

.foot_info span{display:inline-block;padding: 0 20px;}
.foot_info .copy{display:inline-block;padding: 0;}
    
}

/* Desktop */
@media all and (min-width:1023px) {

header{height:160px;}

.top_wrap{height:80px;}
    
.gnb{background:none;position:absolute;top:30px;right:0;}
.gnb ul{padding:0;}
.gnb li{position:relative;}
.gnb li:before{display:block;content:"";width:1px;height:10px;background:var(--gray4);position:absolute;top:5px;left:0;}
.gnb li:first-child:before{display:none;}
.gnb li a{padding:0 15px;}
.gnb li:last-child a{position:relative;padding-right:30px;}
.gnb li:last-child a:after{display:inline-block;content:"";width:16px;height:0;padding-top:15px;overflow:hidden;background:var(--btnbg) no-repeat -70px -10px;position:absolute;top:1px;right:0;}

.top_search{width:400px;top:18px;left:50%;}
    
h1{top: 20px;left: 0;}
    
.wrap{position:relative;width:1400px;margin:0 auto;}

.head{height: 80px;border-top:solid 1px var(--gray3)}
.head  button{display:none;}    

.head .wrap>button, .menu button{display: none;}

    
.menu{display: block;position: static;background: none;}
.menu h2{display: none;}
.menu>ul{font-size: 0;}
.menu>ul>li{display: inline-block;margin: 0 140px 0 30px;position: relative;}
.menu>ul>li:last-child{margin:0;}
.menu>ul>li>a{width: 100%;padding: 25px 0;background: none;border: none;font-weight: 500;color: #222;font-size: 24px;letter-spacing: -1px;font-weight: 600;}
.menu>ul>li>a.on{background:none;color:var(--color1);border-radius:0}
.menu>ul>li>a.on:after,.menu>ul>li>a:hover:after,.menu>ul>li>a:focus:after{content:"";display:block;width:30px;height:3px;background: var(--color1);margin:10px auto}
.menu>ul>li>a:hover,
.menu>ul>li>a:focus{background:none;color:var(--color1);}

.menu .depth_box{display:none;} 



.menu.on .depth_box{display:block;background: var(--color1);width: 240px;left: 50%;transform: translate(-50%, 0);}  
.menu.on .depth_box.hide{display:none;}
.depth_box{top:79px;left:0;bottom: unset;width:100%;padding: 0;border-radius: 0;z-index:100;background:none;overflow:visible}
.depth_box:before{/* display:block; *//* content:""; */width:200%;background:var(--gray1);height:90px;position:absolute;top:0;left:-20%;z-index:-1;}
.depth_boxcon{padding:20px 0;}
.menu li li{/* display:inline-block; *//* padding:0 40px 0 0; */}
.menu li li a{display:block;/* text-align:center; *//* font-size:18px; */padding:10px 20px;color: #fff;}
.menu li li a:hover,
.menu li li a:focus{/* color:var(--color1);border:solid 1px var(--color1);border-radius:15px; */ text-decoration:underline}
.menu li li ul{display:none;}

.menu .menu1 ul{/* margin-left:20px; */}
.menu .menu2 ul{/* margin-left:300px; */}
.menu .menu3 ul{/* margin-left:50px; */}
.menu .menu3 .depth_box:before{height:130px;}
.menu .menu4 ul{/* margin-left:50px; */}
.menu .menu4 li{padding-right:0px;}
.menu .menu4 .depth_box:before{height:130px;}
.menu .menu5 li{padding-right:0px;}

    
footer{clear:both;}    
footer .wrap{width:1400px;margin:0 auto;}

.footer{padding:0;height:90px;}
    

.f_banner{border-top:solid 1px var(--gray1);height:100px;padding-top:20px;}
.f_banner .control{position:absolute;top:0;left:0;width:200px;}
.f_banner .list{margin-left:180px;}
.f_banner .list li a{padding-right:50px;}
    .f_banner .list:after{top: 15px;}
    
.foot_info{font-size:18px;text-align:left;text-align:center;}
.foot_info address{letter-spacing:0;padding-right:10px;}
.foot_info span{padding:0 40px;}
.foot_info .copy{display:inline-block;font-size:18px;padding:0;}

.layer_pop{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0, 0, 0, .4);backdrop-filter:blur(4px);z-index:5}
.layer_pop>div{position:absolute;top:128px;left:50%;width:90%;transform:translate(-50%, 0)}
.layer_pop .con img,.layer_pop .con iframe{width:100%}
.layer_pop p{background:#4a4a4a;overflow:hidden}
.layer_pop p a{float:left;width:50%;padding:10px 0;color:#fff;font-size:15px;text-align:center;position:relative}
.layer_pop p a:first-child:after{content:"";display:block;position:absolute;top:0;right:0;bottom:0;width:1px;background:rgba(255, 255, 255, .2)}
.layer_pop p a:hover,.layer_pop p a:focus{background:#0089d0}
@media all and (min-width:768px) {
.layer_pop>div{top:50%;transform:translate(-50%, -50%);width:auto}
.layer_pop .con iframe{width:600px;height:400px}
.layer_pop .con img{width:auto}
}
@media all and (min-width:1023px) {
.layer_pop .con iframe{width:950px;height:530px}
}   


    
/*sub*/
    
    
}




.clear{display:block;content:"";clear:both}
.blind{position:absolute;top:-5000px;left:-5000px;}
.new_win{display:inline-block;width: 15px;height: 15px;font-size: 0;overflow:hidden;margin:0 0 0 5px;vertical-align:top;background: url("/images/01_portal/common/ico_cmd.png") no-repeat -20px -120px;}

.hide{display:none;}