@charset "utf-8";
/* com2zoa design  KYJ 20210915 */
/* com2zoa design KJH 20221220 전반 디자인 개편 */

/* Layout */
#subpage .basics_font{font-size: 1.154em/*기준폰트 15px*/}
/*글이 많은페이지의 경우 모바일에서 해당 페이지 고유클래스 하위에 기준폰트 1.000em(13px)으로 변경*/
#sub_left {display: none}
#subpage {min-height: 300px; line-height:150%; margin:0 5px 50px; font-weight:300}
.clear_fix:after {content: ""; display: block; clear: both}
.qmu_popup{display: none}

/* Visual*/
.subvisual {position: relative}
.subvisual .visual_it
em p.vbg_txt{height:0; width:0; line-height:0; font-size:0;text-indent:-9999999px}

/*Subtop */
#subtop {position:relative; padding:30px 0; margin-bottom:20px}
#subtop h3{height:25px; width: auto; font-size:1.571em; text-align:left; font-weight:600; text-align: center}

/* Guide */
#sub_guide{z-index:500}
#sub_guide .btn_home {display: none}
#sub_guide .submn {display: none}
#sub_guide .guide_wrap {position: relative}

/*Sub_info*/
.subinfo_box{background:#505050}
.subinfo_box .sub_info{margin:0 10px; padding: 15px 0 10px}
.subinfo_box .subinfo_tit{margin-bottom: 15px; color:#fff; font-size: 18px; font-weight: 500}
.subinfo_box .subinfo_tit span{display: block; padding:22px 0 22px 42px; background:url(../images/sub/icon_info_s.gif) left center no-repeat}
.subinfo_box .info_tbwrap > li{float: left; width: 50%}
.subinfo_box .info_tb{overflow: hidden; width: 95%; height: 60px; margin:0 auto; background:#6f6f6f; color:#fff}
.subinfo_box .tb_tit{float: left; width:30%; height:60px; line-height: 60px; background:#373737; text-align: center; font-weight: 500; font-size:15px}
.subinfo_box .info_tb .tb_lst{float: left; width:70%; height: 60px}
.subinfo_box .info_tb ul{padding:13px 12px}
/* .subinfo_box .info_tb ul li{padding-left: 5px; margin-bottom: 10px; font-weight: 400}
.subinfo_box .info_tb ul li:last-child{margin-bottom:0}
.subinfo_box .info_tb ul li span{display: inline-block; font-weight: 500; width:85px}
.subinfo_box .info_tb ul li:nth-child(2) span{width:60px} */
.subinfo_box .info_tb ul li{display:flex; margin-bottom: 10px; font-weight: 400}
.subinfo_box .info_tb ul li span{display:block}
.subinfo_box .info_tb ul li span.tit{width:60px}
.subinfo_box .info_tb.time_box ul li span.tit{width:80px}
.subinfo_box .prog_btn {overflow: hidden; position: relative; width:100%; height: 50px; margin: 10px auto 0; background:#fff; transition: all .6s;} 
.subinfo_box .prog_btn a {display: block; position: relative; height: 50px; line-height: 50px; padding-left: 25px; font-size: 14px; color: #000; font-weight: 500; text-align: center; text-transform: uppercase; z-index: 12; transition: all .3s;}
.subinfo_box .prog_btn::after {content:""; display: block; width: 100%; height: 100%; position: absolute; left: -1px; top: 0; z-index: 11; margin-left: -100%; transition: all .6s;}
.subinfo_box .prog_btn:hover a {color: #fff}
.subinfo_box .prog_btn:hover::after {left:0; margin-left: 0}
.subinfo_box .prog_btn a::after{display: block; clear: both; content: ""; position: absolute; top:13px; left:50%; width: 38px; height: 24px; margin-left: -108px; background:url(../images/sub/prog_icon.png) no-repeat right center}
.subinfo_box .prog_btn:hover a::after{background:url(../images/sub/prog_icon_a.png) no-repeat right center}
.subinfo_box .prog_btn a span{padding:5px 48px 5px 0; color:#ff7459;  font-weight:600; background:url(../images/sub/btn_proinfo_view.gif) no-repeat right center; transition: all .6s;}
.subinfo_box .prog_btn:hover a span{color:#fff; background:url(../images/sub/btn_proinfo_onview.gif) no-repeat right center}
.subinfo_box .prog_btn::after{background:#ff7459}

/* Tab01 */
.tabnavi01{margin:0 0 15px}
.tabnavi01 ul{text-align: center; display:flex; /*justify-content:space-between; align-items:center*/}
.tabnavi01 ul:after {content:""; clear:both; display:block; height:0; font-size:0; line-height:0}
.tabnavi01 ul li{position: relative; width:100%}
.tabnavi01 ul li a{display: block; height:auto; margin:3px; padding-bottom:13px; line-height:140%; font-weight:400; font-size: 15px; transition: all .3s}
.tabnavi01 ul li a span {display:block; overflow:hidden; padding:12px; background:#e4e4e4; text-overflow: ellipsis; white-space: nowrap}
.tabnavi01 ul li.on a, .tabnavi01 ul li a:hover {background:url(../images/sub/bg_tabnavi_arr.png) no-repeat 50% bottom}
.tabnavi01 ul li.on a span, .tabnavi01 ul li a:hover span {background:#505050; transition:.3s; color:#fff}

/* 수동 탭의 경우 wdt 값 넣어줘야함 */
.tabnavi01 ul.tabwdt3 li {width:33.3%}
.tabnavi01 ul.tabwdt4 li {width:25%}
.tabnavi01 ul.tabwdt5 li {width:20%}

/* Tab02 , boardTab*/
.tabnavi02, .boardTab{margin:0 0 15px}
.tabnavi02 ul,.boardTab ul{padding:0 20px 10px; border-radius:3px; border:1px solid #ddd; background: #fff}
.tabnavi02 ul:after, .boardTab ul:after {content:""; clear:both; display:block; height:0; font-size:0; line-height:0}
.tabnavi02 ul li, .boardTab ul li { float: left; width: 20%; height: 13px; padding: 10px 0; font-size:1.077em;  font-weight:300}
.tabnavi02 ul li a, .boardTab ul li a {display: block; height: 21px; line-height: 21px; padding-left:15px; background: url(../images/sub/blt_tabnavi2_off.png) left 5px no-repeat ;font-size: 1.077em; color: #595959; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.tabnavi02 ul li.on a, .tabnavi02 ul li:hover a, .boardTab ul li.on a, .boardTab ul li:hover a {height: 21px; line-height: 21px; background: url(../images/sub/blt_tabnavi2_on.png) left 5px  no-repeat; color:#ff5656; font-weight: 500}

/* 프로그램 탭 */
.tabnavi01.extabstyle {border:1px solid #ccc; border-radius:5px; padding:3px 5px}
.tabnavi01.extabstyle ul li a {padding:0; margin:3px; font-size:14px}
.tabnavi01.extabstyle ul li a span {padding:7px; border-radius:10px; background:#e7e7e7}
.tabnavi01.extabstyle  ul li.on a span, .tabnavi01.extabstyle  ul li a:hover span {background:#008cd6}


/******************************서브컨텐츠 영역**************************************/
/*폰트에서 span color사용시 색지정*/
/*(span에 단독으로 스타일을 주면 모든 span 태그에 font-weight가 지정되므로 bold는 각각 지정함)_더 두껍게 할 시에는 고유클래스 아래에 지정  */
span.col_r{font-weight: 500; color:#ff1833}
span.col_g{font-weight: 500; color:#76a84e}
span.col_b{font-weight: 500; color:#2273e1}
span.col_o{font-weight: 500; color: #ff7b11}
span.col_p{font-weight: 500; color: #ae4ce6}
span.col_pk{font-weight: 500; color: #f86b96}
span.col_bb{font-weight: 600; color:#202020}
/*폰트에서 bg span color사용시 색지정*/
span.bgcol_pk{background: #ff75a2; color:#fff}
span.bgcol_g{background: #9ccc5e; color:#fff}
span.bgcol_o{background: #ff9e56; color:#fff}
span.bgcol_n{background: #4e3333; color:#fff}

/****페이지 준비중****/
.art_loading{margin-top: 90px; padding-top: 110px; background:url(../images/sub/ico_loading.gif) no-repeat center top; text-align: center}
.art_loading .loading_tit{font-size: 1.538em; font-weight: 600; color:#3f3f3f}
.art_loading .loading_tit span{color:#2885cd}
.art_loading .loading_txt{margin-top: 27px; font-size: 1.154em; font-weight: 500; color: #737373; line-height: 160%}

/****Blind****/
.blind {font-size:0; overflow:hidden; text-indent:-9999999px; height:0; width:0; line-height:0} 

/****TIT****/
h4.sub_tit4 {line-height:140%; padding:7px 0 5px 40px; margin: 5px 0; background:url(../images/sub/subtit4.gif) no-repeat left 3px; font-size: 1.286em; font-weight:600}
h5.sub_tit5 {line-height:140%; padding:0 0 0 25px; margin: 10px 0 0 15px; background:url(../images/sub/subtit5.gif) no-repeat left 2px; font-size: 1.143em; font-weight:500}

/****공통 Table****/
.comtable {width:100%; margin:10px 0 15px; border-collapse:collapse; table-layout:auto}
.comtable table{width: 100%; border-bottom:3px solid #aeaeae}
.comtable thead th { line-height:150%; padding:8px 3px; border-right:1px solid #d2d2d2; background: #aeaeae; vertical-align:middle;text-align:center; font-weight:500; color:#fff}
.comtable tbody th {line-height:150%;padding:8px 3px; border:1px solid #d2d2d2; text-align:center; font-weight:500; vertical-align:middle; color:#30302e}
.comtable tbody td {line-height:150%; background:#fff; padding:8px 3px; border:1px solid #d2d2d2; text-align:center; vertical-align:middle; color:#4d4d4d} 
.comtable .txtleft {text-align: left; padding-left: 10px}
.comtable02 table{border-bottom:2px solid #aeaeae; border-top:2px solid #aeaeae}
.comtable02 tbody th {background: #aeaeae; color:#fff}
/*Table양쪽 선 없는 타입*/
.nonbdr .comtable thead th:last-child{border-right: none}
.nonbdr .comtable tbody td.bdr_none{border-left:none}
.nonbdr .comtable tbody th {border-left: none}
.nonbdr .comtable tbody td {border-right: none}
/****공통 Common****/
/* .common_wrap{font-family:NSK} */
.common_wrap h4.com_h4{padding:5px 0 5px 35px; margin: 10px 0; background:url(../images/sub/com_h4.gif) left top no-repeat; font-size:1.286em}
.common_wrap h5.com_h5{padding:2px 0 2px 30px; margin: 10px 0; background:url(../images/sub/com_h5.gif) 6px 3px no-repeat; font-size:1.143em}
.common_wrap{font-weight: 400}
.common_wrap .comtop{margin-bottom: 15px; border:1px solid #d2d2d2; box-sizing: border-box}
.common_wrap .comtop_tit{padding: 10px; font-weight: 500; text-align: center; color:#fff; font-size:1.071em}
.common_wrap .comtop ul{padding: 15px 10px 10px 95px}
.comtop ul li{padding-left: 13px; margin-bottom: 5px; background:url(../images/sub/com_lstblt.gif) left 8px no-repeat; line-height: 130%}
.comtop ul li:last-child{margin-bottom: 0}
.combox .cmline{margin-bottom: 20px}
.cmline > .cmtit{ overflow: hidden; position:relative; margin-bottom:10px;  border: 1px solid #d2d2d2; box-sizing: border-box}
.cmline > .cmtit h5{ line-height: 140%; padding: 10px; margin: 0 0 0 70px; background: #fff; font-weight: 500; font-size:1.071em}
.cmline > .cmtit p{position: absolute; top:50%; left:0; width:70px;  height:42px; line-height: 42px;  margin-top: -21px; text-align: center; font-weight:bold; color:#fff; font-size:1.071em; font-weight: 400}
.cmline .cmtxt ol li{margin:0 0 5px 20px; line-height: 120%; text-indent: -17px}
.cmline .cmtxt ol li:last-child{margin-bottom: 0}
.cmline .cmtxt ol li>ol, .cmline .cmtxt ol.bgline{padding: 10px; margin: 10px 0; background:#f8f8f8; border: 1px solid #d2d2d2; box-sizing: border-box}
.cmline .cmtxt ul li{padding-left: 13px; background:url(../images/sub/com_lstblt.gif) left 8px no-repeat; line-height: 130%; margin-bottom: 5px}
.cmline .cmtxt > p{padding-left: 13px; background:url(../images/sub/com_lstblt.gif) left 8px no-repeat; line-height: 130%; margin-bottom: 5px}
.cmline .cmtxt > p.refertxt{padding:5px; background: #838383;  text-align: center; color:#fff}
.cmline .cmtxt > dl{margin-top: 10px; padding: 10px;  margin-bottom:10px; background:#f8f8f8; border: 1px solid #d2d2d2; box-sizing: border-box}
.cmline .cmtxt > dl dt{margin: 5px 0; font-weight: 500}
.cmline .cmtxt > dl dt.bgtit{display: inline-block; padding: 5px 10px; border-radius: 50px; background: #838383; font-weight: 400; color:#fff}
.cmline .cmtxt > dl dt:first-child{margin-top: 0}
.cmline .cmtxt > dl dd{padding-left: 13px; background:url(../images/sub/com_lstblt.gif) left 8px no-repeat; line-height: 120%; margin-bottom: 5px}
.cmline .cmtxt > dl dd:last-child{margin-bottom: 0}
.cmline .cmbtn{padding: 10px; margin: 15px 0; border: 1px solid #d2d2d2; text-align: center; line-height: 130%}
.cmline .col_bb{font-weight: 500}
.cmline .cmtxt ol li.no_indent{text-indent: 0; margin-left: 5px}
/*이력관리*/
.comhis_lst{border-radius: 5px 5px 0 0; overflow: hidden}
.comhis_lst .comhis_lstit{padding:10px; text-align:center; background:#9e9e9e; color:#fff; font-weight:500}
.comhis_lst ul{padding:10px; border:1px solid #ccc}
.comhis_lst ul li{margin-bottom:5px}
.comhis_lst ul li:last-child{margin-bottom:0}
.comhis_lst ul li a{display:block; padding:10px; background:#eeeeee; border-radius:50px; text-align:center; transition: all .3s}
.comhis_lst ul li a:hover{color:#fff}
/*텍스트 스타일*/
.common_wrap .comlst_txt{ margin:10px 0 15px; border-radius: 5px; border:1px solid #d2d2d2;box-sizing: border-box}
.common_wrap .comlst_txt ul{padding: 10px}
.common_wrap .comlst_txt ul li{padding-left: 13px; margin-bottom: 5px; background:url(../images/sub/com_lstblt.gif) left 8px no-repeat; line-height: 130%}
.common_wrap .comlst_txt ul li:last-child{margin-bottom: 0}
.common_wrap p.comlst_tit{padding: 10px; background: #65758d; border-radius: 5px 5px 0 0; text-align: center; color:#fff; line-height: 140%}

/****공통_개인정보처리방침****/
.protect .comtop ul{min-height: 65px; background:url(../images/sub/protect_img.gif) 13px 10px no-repeat}
.protect .comtop_tit{background:#44617c}
.protect .cmline .cmtit{background:#44617c}
.protect .priv_go a{ display: block; background:#525252; padding:8px 5px; margin-top: 10px; border-radius:5px; font-weight:400; text-align: center; color:#fff; transition: all .6s}
.protect .priv_go a:hover{background:#44617c}
.protect .comhis_lst ul li a:hover{background:#44617c}

/* pro tab */
.pro_tabnavi {margin-bottom:20px}
.pro_tabnavi ul {display:flex; justify-content:space-between}
.pro_tabnavi ul .pro_tab {position: relative; display:flex; flex-wrap: wrap}
.pro_tabnavi ul .pro_tab .pro_tabarea {width:173px;flex-direction:column; margin-left:11px; border-radius:10px; box-sizing: border-box}
.pro_tabnavi ul .pro_tab:first-child .pro_tabarea {margin-left:0}

.pro_tabnavi ul .pro_tab ul {display: flex; padding:0 7px 10px}
.pro_tabnavi ul .pro_tab ul li {width:50%}
.pro_tabnavi ul .pro_tab ul.btn_only li {width:100%}
.pro_tabnavi ul .pro_tab ul li a {display:block; padding:8px 5px; margin:0 3px; border-radius: 5px; font-weight:400; color:#000; background:#fff url(../images/contents/bg_prog_marr.png) no-repeat right 5px top 50% }
.pro_tabnavi ul .pro_tab ul li a span{font-size:12px; letter-spacing:-0.5px}
.pro_tab01 .pro_tabarea {background:#bd9e93}
.pro_tab02 .pro_tabarea {background:#d9bbc0}
.pro_tab03 .pro_tabarea {background:#d2c0b6}
.pro_tab04 .pro_tabarea {background:#f7eeb5}
.pro_tab05 .pro_tabarea {background:#cfee9e}

.pro_tab.on .pro_tabarea {transition:.3s}
.pro_tab01.on .pro_tabarea, .pro_tab01:hover .pro_tabarea {background:#956c5e}
.pro_tab02.on .pro_tabarea, .pro_tab02:hover .pro_tabarea {background:#c76e7d}
.pro_tab03.on .pro_tabarea, .pro_tab03:hover .pro_tabarea {background:#c59276}
.pro_tab04.on .pro_tabarea, .pro_tab04:hover .pro_tabarea {background:#5782b7}
.pro_tab05.on .pro_tabarea, .pro_tab05:hover .pro_tabarea {background:#99c05c}

.pro_tabnavi ul .pro_tab.on ul li.on a, .pro_tabnavi ul .pro_tab:hover ul li:hover a  {transition:.3s; background: url(../images/contents/bg_prog_monarr.png) no-repeat right 5px top 50% rgba(0,0,0,0.4);  color:#fff}

.pro_tabtit {text-align: center;  padding:18px; color:#000; font-size:1.385em; font-weight:500}
.pro_tabtit a {display:block; padding:37px 0; color:#000}

/* 프로그램 탭 추가 스타일 kjh 241030 */
.pro_tabnavi.pro_newtab ul .pro_tab {width:calc(100% / 4)}
.pro_tabnavi.pro_newtab ul .pro_tab .pro_tabarea {width:100%}
.pro_tabnavi.pro_newtab .pro_tab01 .pro_tabarea {background:#bae0ff}
.pro_tabnavi.pro_newtab .pro_tab02 .pro_tabarea {background:#ace5d4}
.pro_tabnavi.pro_newtab .pro_tab03 .pro_tabarea {background:#ffd7e9}
.pro_tabnavi.pro_newtab .pro_tab04 .pro_tabarea {background:#f7eeb5}
.pro_tabnavi.pro_newtab .pro_tab05 .pro_tabarea {background:#cfee9e}
.pro_tabnavi.pro_newtab .pro_tab01.on .pro_tabarea {background:#6eb2ec}
.pro_tabnavi.pro_newtab .pro_tab02.on .pro_tabarea {background:#5bd8ae}
.pro_tabnavi.pro_newtab .pro_tab03.on .pro_tabarea {background:#ff98c6}
.pro_tabnavi.pro_newtab .pro_tab04.on .pro_tabarea {background:#f1da4d}
.pro_tabnavi.pro_newtab .pro_tab05.on .pro_tabarea {background:#99c05c}
.pro_tabnavi.pro_newtab .pro_tab.on .pro_tabtit {color:#fff}
.pro_tabnavi ul .pro_tab01.on ul li.on a, .pro_tabnavi ul .pro_tab01:hover ul li:hover a  {background-color:#3671a3}
.pro_tabnavi ul .pro_tab02.on ul li.on a, .pro_tabnavi ul .pro_tab02:hover ul li:hover a  {background-color:#1b8d6b}
.pro_tabnavi ul .pro_tab03.on ul li.on a, .pro_tabnavi ul .pro_tab03:hover ul li:hover a  {background-color:#c74981}
.pro_tabnavi ul .pro_tab04.on ul li.on a, .pro_tabnavi ul .pro_tab04:hover ul li:hover a  {background-color:#c79e04}
.pro_tabnavi ul .pro_tab05.on ul li.on a, .pro_tabnavi ul .pro_tab05:hover ul li:hover a  {background-color:#53761d}

/* 프로그램 탭 2개인 경우 */
.pro_tabnavi.pro_newtab2 ul .pro_tab {width:calc(100% / 2)}
.pro_tabnavi.pro_newtab2 ul .pro_tab .pro_tabarea {display:flex; justify-content: space-between; flex-direction:inherit; align-items: center}
.pro_tabnavi.pro_newtab2 ul .pro_tab ul {width:calc(100% - 200px); padding:15px}

/* 프로그램 탭 1개인 경우*/
.pro_tabnavi.pro_newtab1 ul .pro_tab {width:100%}




/*********************************/
/********* MOBILE LAYOUT *********/
/*********************************/
@media only screen and (max-width:1024px) {
#subpage .basics_font{font-size: 1.077em/*기준폰트 14px*/}

/* Mobile Menu */
.header_top .qmu_search{right:45px}
.header_top .qmu_site{right:8px}

/* Visual*/
.subvisual .visual_wrap {position: relative;  margin: 0 auto}
.subvisual .visual_item{width:auto; height:226px; margin: 0 auto}
.subvisual .item1{background:url(../images/sub/subv_m01.jpg) no-repeat top center}
.subvisual .item2{background:url(../images/sub/subv_m02n.jpg) no-repeat top center}
.subvisual .item3{background:url(../images/sub/subv_m03n.jpg) no-repeat top center}
.slick-dots {margin-top:90px}
.visual_wrap .btn_visual {margin-top:92px}

/* Layout */
#subtop{width:100%; height:auto; padding:40px 0 0}
#subtop h3{position: relative; height: auto; font-size: 17px;  margin-top:10px; padding: 15px 0; background:#eeeeee}
#subpage {margin:10px 10px 25px}
#quick{display: none}
#footwrap{padding-bottom: 80px}

/* MB guide */
#sub_guide {position: absolute; left: 0; top: 0; width: 100%; font-size: 14px; z-index:15}
#sub_guide .guide_wrap {margin:0 10px; padding: 3px 4px 3px 40px; border-radius:0 0 6px 6px; background-color: #292f45}
#sub_guide .guide_wrap ul {border-radius:6px; border:1px solid #9497a2}
#sub_guide .btn_home {display: block; position: absolute; left: 0; top: 0}
#sub_guide .btn_home a {display: block; width: 40px; height: 40px; line-height:40px; background:url(../images/sub/bg_mb_home.gif) no-repeat 50% 50%; border-radius: 5px; text-indent:-9999999px}
#sub_guide .btn_home span{overflow:hidden; height:0; width:0; line-height:0; font-size:0; text-indent:-9999999px}
#sub_guide .navi_area{border-radius: 10px}
#sub_guide .navi_area>ul>li{float: left; width: 33.3%;  background:url(../images/sub/btn_mb_arr.gif) no-repeat right 10px top 50%; position: relative}
#sub_guide .navi_area>ul>li.nav01{border-radius: 5px 0 0 5px}
#sub_guide .navi_area>ul>li:last-child{border-radius: 0 5px 5px 0}
#sub_guide .navi_area>ul>li>a {display: block; height: 31px; line-height: 31px; padding:0 22px 0 8px; font-weight: 500; border-left: 1px solid #9497a2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#fff; font-size: 13px}
#sub_guide .navi_area>ul>li.nav01 > a{border-left: none}
#sub_guide .navi_area>ul>li.nav_home{display: none}
#sub_guide .submn {overflow: hidden; position: absolute; left: 0; top: 100%; width: 100%;  margin: 0 auto; background: #505050;border-radius: 0 0 10px 10px; z-index: 150}
#sub_guide .submn ul {padding: 0 6px; border:0}
#sub_guide .submn li {border-bottom: 1px solid rgba(255,255,255,0.5); z-index: 150}
#sub_guide .submn li:last-child{border:none}
#sub_guide .submn li a {display:block; padding: 8px 0 8px 5px; line-height: 160%; color: #fff; font-weight: 500; font-size:13px}
#sub_guide .submn li a:hover{color:#ffb330; font-weight: 600}

/* Fontsize */
.sub_tbtn {display:none}

/* Tab01 */
.tabnavi01 {margin:0 7px 10px}
/*.tabnavi01 ul li {width:50%}*/
.tabnavi01 ul li a{margin:1px 3px; font-size: 13px; padding-bottom:7px; background-size:12px auto !important}
.tabnavi01 ul li a span {padding:8px}
/* 수동 탭의 경우 wdt 값 넣어줘야함 */
.tabnavi01 ul.tabwdt3 li {width:33.3%}
.tabnavi01 ul.tabwdt4 li {width:50%}
.tabnavi01 ul.tabwdt5 li {width:50%}

/* Tab02, boardTab */
.tabnavi02, .boardTab {margin:0 10px 10px}
.tabnavi02 ul, .boardTab ul {padding:2px 15px 10px}
.tabnavi02 ul li, .boardTab ul li {width: 33.3%; padding:5px 0}
.tabnavi02 ul li a, .boardTab ul li a{font-size:13px}

/*Btn_top*/
#quickmenu.sub_quick {display:block; position: absolute; top:800px; right:10px; min-width:inherit; z-index: 100}



/* 하단퀵 250618 */
#quickmenu {position:relative; /*width:100%; height:100%;*/ font-family: 'SEBANG_Gothic'; z-index: 999}
#quickmenu a{display: block; width:39px; height:38px; background: url(../images/sub/btn_mb_top.png) no-repeat 50% 50%} 
.art_quick .btn_top{display: block}
#quickmenu .quick_wrap {position:fixed; bottom: 0; right:0; width:100%; background: #008cd6; z-index: 999}
#quickmenu .quick_wrap .quick_btns{width:calc(100% - 70px); padding: 10px; display: flex}
#quickmenu .quick_wrap .quick_btns li{position:relative; width:calc(33.3%); margin-right:10px; transition: all .3s; background:#fff; border-radius: 8px}
#quickmenu .quick_wrap .quick_btns li a{display:block; height:46px; line-height: 44px; padding-top:2px; color:#fff; box-sizing: border-box; text-align: center; background:url(../images/main/quick_icon1_25.png) no-repeat 10px 50%}
#quickmenu .quick_wrap .quick_btns li:nth-child(2) a{background:url(../images/main/quick_icon2_25.png) no-repeat 10px 50%}
#quickmenu .quick_wrap .quick_btns li:nth-child(3) a{background:url(../images/main/quick_icon3_25.png) no-repeat 5px 50%}

#quickmenu .quick_wrap .btn_top{position:absolute; top: 12px; right: 20px; background: none}
#quickmenu .quick_wrap .btn_top a{background: none}
#quickmenu .quick_wrap .btn_top span{display:inline-block; width:50px; height:46px; border-radius:10px; line-height: 58px; text-align: center; font-weight: bold; background:url(../images/sub/top_arrow.gif)no-repeat center top 10px #fff; color: #008cd6; top: 0}

#quickmenu .quick_wrap .quick_btns li a span{position:absolute; display: inline-block; top:4px; right:5px; height:38px; padding:5px 20px; line-height: 30px; font-size:1.077em;  border-radius: 8px; font-weight: 600; background: #fdcf07; box-sizing: border-box}
#quickmenu .quick_wrap .quick_btns li:nth-child(2) a span{background: #db1587}
#quickmenu .quick_wrap .quick_btns li:nth-child(3) a span{background: #008cd6}

#main_rptpro .btn_more {top: 12px; right: 0}  


/* 하단 information */
.subinfo_box .info_tbwrap > li {width:100%}
.subinfo_box .subinfo_tit {font-size:16px; text-align: center; margin-bottom:10px}
.subinfo_box .subinfo_tit span {display:inline-block; padding:5px 0 5px 32px; background-size:24px auto}
.subinfo_box .tb_tit {float:inherit; width:100%; height:30px; line-height:28px; font-size:1.077em}
.subinfo_box .info_tb {width:100%; height:auto}





/******************************서브컨텐츠 영역**************************************/
/****페이지 준비중****/
.art_loading .loading_tit{font-size: 1.231em}
.art_loading .loading_txt{margin-top: 15px; font-size:1.000em}
.art_loading .loading_txt span{display:block}	

/****TIT****/
h4.sub_tit4 {font-size:1.143em}
h5.sub_tit5 {font-size:1.071em}

/****공통 Common****/
.common_wrap .comtop ul{padding: 10px}
/*공통_개인정보처리방침*/
.protect .comtop ul{background:none}

/*MB에서 br 필요 없을때 선언*/
br.mbbr_none{display: none}
/*MB에서 필요 없을때 선언*/
.mb_none{display: none}

/* 프로그램 탭 */
.pro_tabnavi ul {display:inherit; justify-content:center; margin:0 5px}
.pro_tabnavi ul .pro_tab .pro_tabarea {width:100%; margin:0 !important}
.pro_tabtit {padding:10px; font-size:1.231em}
.pro_tabnavi ul .pro_tab {display:inherit; flex-wrap:inherit; float:left; width:49%; margin:0.5%}
.pro_tabnavi ul .pro_tab.pro_monly {width:99%}

/* 프로그램 탭 추가 241030 */
.pro_tabnavi.pro_newtab ul .pro_tab {width:calc(100% / 2 - 10px); padding:5px; margin:0}
.pro_tabnavi.pro_newtab1 ul .pro_tab {width:calc(100% / 1 - 10px)}

}

/*********************************/
/*********** PC LAYOUT ***********/
/*********************************/
@media only screen and (min-width:1025px) {
/* Layout */
#subcontainer{position: relative}
.subconwrap{position: relative}
.subconbox {width: 1200px; margin: 0 auto; background:url(../images/sub/bg_subleft.gif) repeat-y 0 0; box-sizing: border-box}
#sub_left {position: relative; display: block; float: left; margin:0 0 50px 0}
#subright { position: relative; float: right; width:910px}
.subconbox.full_wrap {background:none}
.subconbox.full_wrap #sub_left{display:none}
.subconbox.full_wrap #subright{width: 100%}
.conbg_wrap {background:url(../images/sub/bg_subcontainer.gif) repeat-x 0 0 }
.footer_wrap {width:1200px}
#footwrap .add_area {width:1200px}

/* 움직이는퀵 250618 */
#quickmenu.sub_quick {top:150px}
#quickmenu .quick_wrap::before{background: url(../images/main/bg_quick_tit_25.png)#008cd6 no-repeat right 16px top 18px}

/* Visual */
.subvisual{ position: relative}
.subvisual .visual_wrap {position: relative; width: 100%; margin: 0 auto}
.subvisual .visual_item {position: relative; width:auto; height:397px}
.subvisual .item1 {background:url(../images/sub/subv_pc01.jpg) no-repeat center top}
.subvisual .item2 {background:url(../images/sub/subv_pc02n.jpg) no-repeat center top}
.subvisual .item3 {background:url(../images/sub/subv_pc03n.jpg) no-repeat center top}
.slick-dots {margin-top:110px}
.visual_wrap .btn_visual {margin:108px 0 0 22px}

/* Subleft */
#sub_left .left_tit{width: 250px; height:85px; background:#292f45}
#sub_left .left_tit h2{padding:32px 0; font-size:1.692em; font-weight:400; color:#fff; text-align: center}
.leftmn {position: relative; width:248px; margin:0 auto; padding-bottom:48px; background:#fff; box-sizing: border-box}
.leftmn ul > li > a {position: relative; display: block; line-height: 140%; padding:15px; background:url(../images/sub/blt_submn_off.png) no-repeat right 10px top 50%; border-bottom:1px solid #d6d6d6; font-size:1.231em; font-weight:400; color: #000; transition: all .3s; ; letter-spacing: -1px}
.leftmn ul > li > a:hover, .leftmn .leftmenuover > a{background:#5579cb url(../images/sub/blt_submn_on.png) no-repeat right 10px top 50%; color:#fff}
.leftmn ul > li:last-child a{margin-bottom: 0}
.leftmn .left_bt_txt{text-align:center}
#sub_left .left_bttxt{padding: 10px 0; background:#e6e6e6; border-radius: 0 0 15px 15px; border:1px solid #e6e6e6; text-align: center}

/*MN third*/
.leftmn .third{position: relative; width: auto; padding:15px 18px; border-bottom:1px solid #d7d7d7}
.leftmn .third li { background:url(../images/sub/blt_thirdmn_off.png) no-repeat 0 7px}
.leftmn .third li a{display: block; line-height: 140%; padding:3px 0 3px 12px; border:none; font-size:14px; font-weight:300}
.leftmn .third .last_line {border-bottom: none}
.leftmn ul>li .third li a {border-bottom:none; background:none; color:#000}
.leftmn .third .leftmenuover_last {border-bottom:none}
.leftmn .third li:hover, .leftmn .third .third_on {background:url(../images/sub/blt_thirdmn_on.png) no-repeat 0 7px}
.leftmn .third li a:hover, .leftmn .third .third_on a{color:#f55c09; font-weight: 500; border:none}

/*Subtop TIT */
#subtop h3{font-size:1.692em; font-weight:400; color:#1a1a1a}

/* PC guide*/
#sub_guide {display:none}

/* subtop_btn */
.subtop_btn {display: block; position: absolute; left:0; bottom:0; margin:10px 4% 0; width:92%; height:38px;  z-index: 30}
.subtop_btn dl.font{margin:0;height:38px; background:#e6e6e6; padding-right:58px}
.subtop_btn dl.font>dt{overflow:hidden; height:0; width:0; line-height:0; font-size:0; text-indent:-9999999px}
.subtop_btn dl.font>dd{float: left; width:33.3%; text-align: center}
.subtop_btn dl.font>dd a {display:block; padding:6px 0; border-right:1px solid #fff}
.subtop_btn dl.font>dd:last-child{margin-right: 0}
.subtop_btn .btn_print {position: absolute; top:0; right:0}
.subtop_btn .btn_print a {display:block; padding:6px 16px 3px; background:#828797}

/*Sub_info*/
.subinfo_box .sub_info{width: 1200px; margin:0 auto; padding:12px 0}
.subinfo_box .subinfo_tit{float: left; width: 170px; margin-bottom: 0}
.subinfo_box .info_tbwrap{float: left;}
.subinfo_box .info_tbwrap > li{width: 328px; margin-right: 15px}
.subinfo_box .info_tb{width: 100%}
.subinfo_box .prog_btn {float: left; width:268px; height: 59px; margin:0} 
.subinfo_box .prog_btn a {height: 59px; line-height: 59px; padding-left:35px}
.subinfo_box .prog_btn a::after{top:18px; margin-left: -100px}

/* 하단영역 */
#footwrap .foot_area {width:1200px}


/******************************서브컨텐츠 영역**************************************/
/*PC에서 br 필요 없을때 선언*/
br.pcbr_none{display: none}
/*PC에서 필요 없을때 선언*/
.pc_none{display: none}
}

/*********************************/
/*********** LOWSET FIX ***********/
/*********************************/
@media only screen and (max-width:710px) {
/*모바일 아래에서 표 내용이 너무많을때 사이즈 고정후 스크롤 하기*/	
.comtable.table_scroll::before {content: "SCROLL →"; display: block; padding: 4px; font-weight: 500; text-align: right; color: #ff5b40; font-weight:bold}
/****공통 Table****/
.comtable.table_scroll{overflow-x: auto; position: relative}
.comtable.table_scroll > table {min-width:710px}
.comtable.table_scroll table tbody th{background: #fff}

/* 프로그램 탭 추가 241030 */
.pro_tabnavi.pro_newtab2 ul .pro_tab ul {padding:0 0 10px; width:calc(100% - 10px); margin:0; box-sizing: border-box}
.pro_tabnavi.pro_newtab2 ul .pro_tab .pro_tabarea {flex-wrap:wrap; flex-direction:column}
}

@media only screen and (max-width:690px) {
/*Sub_info*/
.subinfo_box .info_tbwrap > li{float: none; width: 100%; margin-top: 10px}
.subinfo_box .info_tb{width: 100%}

}

@media only screen and (max-width:350px) {
/*Sub_info*/
.subinfo_box .tb_tit{float: none; width:auto; height:30px; line-height: 30px}
.subinfo_box .info_tb{height: 90px}
.subinfo_box .info_tb .tb_lst{width:100%; height: auto}
}

/********* TABLET LAYOUT[중간사이즈 조정관련 시작] *********/
@media only screen and (min-width:1025px) and (max-width:1250px) {
#subcontainer{margin-top:-116px}
}
/********* TABLET LAYOUT[중간사이즈 조정관련 끝] *********/

/* 지역연계 상단 페이지 kjh 240306 (게시판 상단도 같이 씀) */
.local_infobox {display:flex; flex-wrap:wrap; justify-content: space-between; align-items: center; border-radius:10px; border:1px solid #c9c9c9; padding:10px; margin:15px 0 20px}
.local_infobox img {vertical-align: middle}
.local_infobox .local_infotit {width:70px; text-align: center}
.local_infobox ul {width:calc(100% - 240px); min-height:66px; font-weight:500}
.local_infobox ul li {line-height:170%; padding-left:15px; background: url(../../images/board/btop_blt.gif) no-repeat 0 5px; font-size:14px; word-break:keep-all}
.local_infobox .local_infodw {display:flex; justify-content:center; width:140px; margin-left:10px}
.local_infobox .local_infodw a {display: block; width:130px; padding:6px; text-align: center; background:#ff7965; border-radius:5px}
.local_infobox .local_infodw a .btn_iapp {display:inline-block; color:#fff; padding:11px 10px 14px 35px; background: url(../images/contents/blt_appdw_ico.png) no-repeat 0 50%; font-weight:600; font-size:15px}
.local_infobox .local_infodw a .btn_idw {display: block; padding:10px 15px; background:#fff url(../images/contents/btn_infoapp_dw.png) no-repeat right 15px top 50%; border-radius:5px; text-align: left; font-weight:500; font-size:15px}
.local_infobox .local_infodw a:hover {background:#e7564b; transition:.3s}
.local_infobox .col_red {color:#ff7965; font-weight:500}

@media only screen and (max-width: 1024px) {
.local_infobox {display:block; margin:10px 10px 15px}
.local_infobox .local_infotit {display:none}
.local_infobox ul {width:100%; box-sizing: border-box}
.local_infobox .local_infodw {width:100%; margin:10px 0 0}
.local_infobox .local_infodw a {width:100%; box-sizing: border-box}
.local_infobox .local_infodw a .btn_iapp {padding:5px 10px 5px 35px; margin-bottom:5px}
.local_infobox ul li {font-size:13px}    
}

/* tab 스타일 */
.tabnavi01.extabstyle ul {flex-wrap:wrap}
.tabnavi01.extabstyle ul li {width:calc(100%/4)}
/*.tabnavi01.extabstyle ul li a {margin-top:0}*/



@media only screen and (max-width: 1024px) {
.tabnavi01 ul {justify-content: flex-start; flex-wrap:wrap}
.tabnavi01 ul li {width:25%}

}
@media only screen and (max-width:650px) {
.tabnavi01 ul li {width:33.3%}
}

@media only screen and (max-width:520px) {
#quickmenu .quick_wrap .quick_btns li:nth-child(1) a,#quickmenu .quick_wrap .quick_btns li:nth-child(2) a,#quickmenu .quick_wrap .quick_btns li:nth-child(3) a{background-size: 50%}
#quickmenu .quick_wrap .quick_btns li a{height: 40px}
#quickmenu .quick_wrap .quick_btns li a span{height: 25px; line-height: 24px; top: 8px; padding: 2px 8px; font-size: 11px}
#quickmenu .quick_wrap .btn_top span{height: 44px; border-radius: 8px}
}

@media only screen and (max-width:404px) {
#quickmenu .quick_wrap .quick_btns{width:calc(100% - 62px); padding: 5px}
#quickmenu .quick_wrap .btn_top{top: 5px}
#quickmenu .quick_wrap .quick_btns li a span{right:2px; padding:
2px 5px}
#quickmenu .quick_wrap .quick_btns li a,#quickmenu .quick_wrap .quick_btns li:nth-child(2) a,#quickmenu .quick_wrap .quick_btns li:nth-child(3) a{background-position: 5px 50%}
}

@media only screen and (max-width:360px) {
#quickmenu .quick_wrap .quick_btns li{margin-right: 5px}
#quickmenu .quick_wrap .btn_top{right: 17px}
}