@charset "utf-8";

[id^="layerPopup"] { /*left: 50%!important;*/ max-width:100%; }
[id^="layerPopup"]::after { content:""; display:block; position:fixed; left:0; top:0; right:0; bottom:0; /*background-color:rgba(0,0,0,.6);*/ }
[id^="layerPopup"] .layer_popup_wrap { position: relative; transform:translateX(-50%); z-index: 2; padding: 0 .5rem }
[id^="layerPopup"] .popup_con { max-width: 100%; height:auto!important }
[id^="layerPopup"] .close { color:#fff; font-size:.8rem; /*margin-top: .3rem;*/ padding:0.5rem; text-align:right; background:#444; }
[id^="layerPopup"] .close > span {margin-right: 1rem }
[id^="layerPopup"] .close span input{ margin-right:.3rem }
/*
[id^="layerPopup"] .close { position: absolute; z-index: 2; right: 0; top: -2.2rem; }
[id^="layerPopup"] .close .xi-close-thin { color:#fff; font-size: 2rem }
*/
.clip {overflow: hidden; width: 1px; height: 1px; margin:-1px; position:absolute;  clip: rect(0, 0, 0, 0);}

header nav { border-bottom:none;}
main:after,
.col2 { padding: .5rem 0 1.25rem;}
.col2:after { content: ""; display: block; clear: both;}
.col2 > *:first-child { float: left; width: 780px;}
.col2 > *:last-child { float: right; width: 382px;}
.hide { position:absolute; left:-5000%;}

/* 상단비주얼 - 이미지 */
.main_visual { padding: 0 0 6rem; background: #f5f6fa;}
.main_visual > div{ margin:0 auto; width:1180px; position: relative }
.main_visual > div:after { content: ""; display: block; clear: both;}
.main_visual .bx-controls-direction { display: none;}
.main_visual .ad_wrap { width: 100%; overflow: hidden }
.main_visual .ad { padding: 2rem 0 0; margin:0 -.5rem;}
.main_visual .ad li { float:left; padding:0 .5rem 1rem; /*line-height: 2.9rem;*/}
.main_visual .ad li.w20 { width:calc(20% - 1rem);}
.main_visual .ad li.w25 { width:calc(25% - 1rem);}
.main_visual .ad li.w33 { width:calc(33.33% - 1rem);}
.main_visual .ad li.w50 { width:calc(50% - 1rem);}
.main_visual .ad li.w100 { width:calc(100% - 1rem);}
.main_visual .ad li a { overflow:hidden; display: block; background: #fff; font-size: .9rem; text-align: center; border-bottom:2px solid; /*text-overflow:ellipsis; white-space: nowrap; overflow:hidden;*/ }
.main_visual .ad li a span { display:block; /*height:180px;*/ overflow:hidden;} /* 서브비주얼 3개일때  height:180px; 서브비주얼 4개일때 height 삭제   */
.main_visual .ad li a:hover img{ transform:scale(1.1); }
.main_visual .ad li a img { width:100%; display:block; transition:all .3s;}
.main_visual .ad li:nth-child(1) a { border-bottom-color: #21a089;}
.main_visual .ad li:nth-child(2) a { border-bottom-color: #4a75b9;}
.main_visual .ad li:nth-child(3) a { border-bottom-color: #c24ea8;}
.main_visual .ad li:nth-child(4) a { border-bottom-color: #21a089;}
.main_visual .ad li:nth-child(5) a { border-bottom-color: #4a75b9;}
.main_visual .ad li:nth-child(6) a { border-bottom-color: #c24ea8;}
.main_visual .ad li:nth-child(7) a { border-bottom-color: #21a089;}
.main_visual .ad li:nth-child(8) a { border-bottom-color: #4a75b9;}
.main_visual .ad li a em {display: block; margin: 1rem 0; font-size:0.85rem;}

.main_visual .top_visual .pc {display:block;}
.main_visual .top_visual .mob {display:none;}

.bx-controls-auto-item.show:first-child,
.bx-controls-auto-item.show,
.bx-controls-auto-item { display:inline-block;}
.bx-controls-auto-item:first-child,
.bx-controls-auto-item.hide { display:none;}

/* 2019-09-30 추가  : 상단비주얼 - 텍스트  */
.main_visual .bookmark {position: relative;}
.main_visual .bookmark ul::after {content: ''; display: block; clear: both;}
.main_visual .bookmark ul > li {float: left; width: 33.33%; }
.main_visual .bookmark ul > li > a {display: block; text-align: center; color: #fff; font-size: .85rem; padding: .75rem; }
.main_visual .bookmark ul > li:nth-child(1) {background: #32ae98;}
.main_visual .bookmark ul > li:nth-child(2) {background: #12937c;}
.main_visual .bookmark ul > li:nth-child(3) {background: #136686;}
.mobile {display: none;}


/*  자주찾는 서비스 */
.quick_link { position: relative; margin-top:-5rem; padding: 0 1.3rem 0 11rem; background: #fff;}
.quick_link h2 { position: absolute; left: 0; top:1.75rem; width: 12.5rem; text-align: center;}
.quick_link ul { display: table; width: 100%; text-align:center; height: 10rem;}
.quick_link li { display: table-cell; width:16.6%; vertical-align: middle;}
.quick_link li a { display: block;font-size: .75em; color:#555; letter-spacing: -1px;}
.quick_link li a:hover { color:#043763;}
.quick_link li a::before { content: ""; display:block; margin: 0 auto .5rem;width: 70px; height: 70px; background: url(../img/main/ico_quick_link.png) no-repeat;}
.quick_link .ico1 a:before { background-position:0 top;}
.quick_link .ico2 a:before { background-position: -80px top;}
.quick_link .ico3 a:before { background-position: -160px top;}
.quick_link .ico4 a:before { background-position: -240px top;}
.quick_link .ico5 a:before { background-position: -320px top;}
.quick_link .ico6 a:before { background-position: -400px top;}
.quick_link .ico1 a:hover:before { background-position:0 bottom;}
.quick_link .ico2 a:hover:before { background-position: -80px bottom;}
.quick_link .ico3 a:hover:before { background-position: -160px bottom;}
.quick_link .ico4 a:hover:before { background-position: -240px bottom;}
.quick_link .ico5 a:hover:before { background-position: -320px bottom;}
.quick_link .ico6 a:hover:before { background-position: -400px bottom;}
.quick_link > a { position: absolute; right:2rem; top:50%; transform: translateY(-50%);color:#888; font-size: .75rem;}
.quick_link > a:after { content: "\e90b"; display: inline-block; margin: 0 0 0 .35rem; width: 32px; height: 32px; text-align: center; line-height: 32px; background: #f5f6fa;font-family:'xeicon'; font-size: .85rem;border-radius: 100%}
.quick_link .more{display:none;}

/* News
.news { position:relative; padding:0 1.7rem .85rem; height:262px; border:1px solid #e1e6eb; box-sizing:border-box; background: #fff;}
.news .tabs > ul { border-bottom: 1px solid #e1e6eb;}
.news .tabs > ul li { float:left; padding:0 .8rem;}
.news .tabs > ul li:first-child { padding-left:0;}
.news .tabs > ul li:last-child { padding-right:0;}
.news .tabs > ul li a { display:block; position:relative; height:3.05rem; line-height:3.05rem; font-size:.8em; font-weight:bold; color:#343639;}
.news .tabs > ul li a:after { content:""; position:absolute; left:0; bottom:-1px; width:100%; height:2px; background:#21a089; transform:scaleX(0); transition:all 0.5s;}
.news .tabs > ul li.on a { color:#21a089;}
.news .tabs > ul li.on a:after,
.news .tabs > ul li a:hover:after { background:#21a089; transform:scaleX(1);}
.news .tab_con { padding: 1.75rem 0 0;}
.news .tab_con > a { float: left; width: 50%;}
.news .tab_con > a h2 {font-size: 19px; color:#333; line-height: 100%; overflow:hidden; text-overflow: ellipsis; white-space: nowrap;}
.news .tab_con > a p { padding: .8rem 0 0; font-size:.7rem; line-height:1.1rem; color:#555; letter-spacing: -1px;}
.news .tab_con > a > span {font-size: .7rem; color:#81868e; line-height: 100%; letter-spacing: -1px; position:absolute; left:1.7rem; bottom:1.8rem;}
.news .tab_con ul { float:left; width: 50%; margin-top:-6px; padding: 0 0 0 1.5rem; box-sizing: border-box;}
.news .tab_con li { position: relative;padding: 0 0 0 .45rem;}
.news .tab_con li:before { content: ""; position: absolute; left: 0; top: .75rem; width: 3px; height: 3px; background: #444; border-radius: 100%;}
.news .tab_con li a { overflow: hidden; display: block; width: 100%;line-height: 1.75rem; font-size:.75em; color:#333; letter-spacing: -1px; text-overflow: ellipsis; white-space: nowrap;}
.news .tab_con > .more { position:absolute; right:1.7rem; top:1.1rem; font-size:14px; color:#aaa; letter-spacing: -1px; width:auto; }
.news .tab_con > .more:after { content: "\e9c5"; font-size:.7rem; color:#aaa; transition:all 0.8s; transform:rotate(0deg); font-family: 'xeicon';}
.news .tab_con > .more:hover:after { transform:rotate(360deg);}
.news .tab_con .xi-new { color: #21a089; font-size: .9rem; display: inline-block; }
.news .tab_con .xi-new .sr_only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0 }
*/

/* News */
.news { position:relative; padding:0 1.7rem .85rem; height:262px; border:1px solid #e1e6eb; box-sizing:border-box; background: #fff;}
.news .tabs > ul { border-bottom: 1px solid #e1e6eb;}
.news .tabs > ul li { float:left; padding:0 .8rem;}
.news .tabs > ul li:first-child { padding-left:0;}
.news .tabs > ul li:last-child { padding-right:0;}
.news .tabs > ul li a { display:block; position:relative; height:3.05rem; line-height:3.05rem; font-size:.8em; font-weight:bold; color:#343639;}
.news .tabs > ul li a:after { content:""; position:absolute; left:0; bottom:-1px; width:100%; height:2px; background:#21a089; transform:scaleX(0); transition:all 0.5s;}
.news .tabs > ul li.on a { color:#21a089;}
.news .tabs > ul li.on a:after,
.news .tabs > ul li a:hover:after { background:#21a089; transform:scaleX(1);}
.news .tab_con { padding: 1.75rem 0 0;}
.news .tab_con > a { float: left; width: 50%;}
.news .tab_con > a h2 {font-size: 21px;color:#333;max-width: 100%;line-height: 100%;overflow:hidden;text-overflow: ellipsis;white-space: nowrap;}
.news .tab_con > a p { padding: .8rem 0 0; font-size:.7rem; line-height:1.1rem; color:#555; letter-spacing: -1px;}
.news .tab_con > a > span {font-size: .7rem; color:#81868e; line-height: 100%; letter-spacing: -1px; position:absolute; left:1.7rem; bottom:1.8rem;}
.news .tab_con ul { float:left; width: 50%; margin-top:-6px; padding: 0 0 0 1.5rem; box-sizing: border-box;}
.news .tab_con li {position: relative;padding: 0 0 0 .45rem;}
.news .tab_con li:before { content: ""; position: absolute; left: 0; top: .75rem; width: 3px; height: 3px; background: #444; border-radius: 100%;}
.news .tab_con .ellipsis {line-height: 1.75rem;font-size:.75em;color:#333;width: auto;letter-spacing: -1px;/* overflow: hidden; */display: inline-block;vertical-align:middle;overflow: hidden;text-align: left;max-width: 88%;text-overflow: ellipsis;white-space: nowrap;}
.news .tab_con .emphasis {color:#333;width: auto;letter-spacing: -1px; display: inline-block;vertical-align:middle;overflow: hidden;max-width: 93%;text-overflow: ellipsis;white-space: nowrap;}
.news .tab_con > .more { position:absolute; right:1.7rem; top:1.1rem; font-size:14px; color:#aaa; letter-spacing: -1px; width:auto; }
.news .tab_con > .more:after { content: "\e9c5"; font-size:.7rem; color:#aaa; transition:all 0.8s; transform:rotate(0deg); font-family: 'xeicon';}
.news .tab_con > .more:hover:after { transform:rotate(360deg);}
.news .tab_con .xi-new {color: #21a089;font-size: .9rem;display: inline-block;margin-left: .2rem;/* margin-top: .1rem; */}
.news .tab_con .xi-new .sr_only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0 }


/* 감염병정보탭 */
.info_box {border: 1px solid #e1e6eb; background: #fff;}
.info_box .tabs > ul { border-bottom: 1px solid #e1e6eb;}
.info_box .tabs > ul li {float: left; width: 33.3%; border-left: 1px solid #e1e6eb; box-sizing: border-box;}
.info_box .tabs > ul li:first-child { width: 33.4%; border-left: none;}
.info_box .tabs > ul li a {display: block; position: relative; height: 2.15rem; background: #f5f6fa; line-height: 2.15rem; text-align: center; font-size: .8em;}
.info_box .tabs > ul li.on a { background: #fff; color:#043763;}
.info_box .tabs > ul li.on a:before { content: ""; position: absolute; left: 0; bottom: -1px; width: 100%; height: 1px; background: #fff;}
.info_box .tabs > ul li.on a:after { content: ""; position: absolute; left: 0; top: -1px; width: 100%; height: 1px; background: #043763;}
.info_box .tabs > div { background: #fff;}
.info_box .tab_con { height: 216px; padding: 1.25rem 1.5rem; box-sizing: border-box;}
.info_box .list:after { content: ""; display: block; clear: both;}
.info_box .list li{ float: left; padding: 0 4px 4px 0;}
.info_box .list li:nth-child(7n) { padding-right: 0;}
.info_box .list a { display:block; width: 42px; height: 32px; line-height: 32px; text-align: center; font-size: 16px; color:#66768c; border:1px solid #e1e6eb; background: #f5f6fa; box-sizing: border-box;}
.info_box .list a:hover { background: #21a089; color:#fff; border-color: #21a089;}
.info_box .tag { padding: 25px 0 0;font-size: 0px;}
.info_box .tag a { display: inline-block; margin: 0 4px 5px 0;padding: 0 12px; height:28px; line-height:28px; font-size: 13px; color:#666; border: 1px solid #e1e6eb; border-radius:28px; letter-spacing: -1px;}
.info_box .tag a.more { background: #f5f6fa;}
.info_box .tag a.more:after { content:"\e914"; font-family: 'xeicon';}
.info_box .health li { float: left; width: 33.3%;}
.info_box .health li a { display: table; width: 100%; height: 4.15rem;}
.info_box .health li a span { display: table-cell; vertical-align: middle; text-align: center; color:#66768c; font-size: .75rem; line-height: 100%;}
.info_box .health li a span:before { content: ""; display: block; margin: 0 auto .35rem; width: 1.5rem; height: 1.5rem; background: url(../img/main/ico_health.png) no-repeat}
.info_box .health li.ico1 a span:before { background-position: 0 bottom;}
.info_box .health li.ico2 a span:before { background-position: -1.5rem bottom;}
.info_box .health li.ico3 a span:before { background-position: -3rem bottom;}
.info_box .health li.ico4 a span:before { background-position: -4.5rem bottom;}
.info_box .health li.ico5 a span:before { background-position: -6rem bottom;}
.info_box .health li.ico6 a span:before { background-position: -7.5rem bottom;}
.info_box .health li.ico1 a:hover span:before { background-position: 0 top;}
.info_box .health li.ico2 a:hover span:before { background-position: -1.5rem top;}
.info_box .health li.ico3 a:hover span:before { background-position: -3rem top;}
.info_box .health li.ico4 a:hover span:before { background-position: -4.5rem top;}
.info_box .health li.ico5 a:hover span:before { background-position: -6rem top;}
.info_box .health li.ico6 a:hover span:before { background-position: -7.5rem top;}
.info_box .critical:after { content: ""; display: block; clear: both;}
.info_box .critical > li { float: left; padding: 0 .25rem .3rem 0;}
.info_box .critical > li a { display: block; width: 5.2rem; height: 2.3rem; line-height: 2.3rem; text-align: center; font-size:.75rem; color:#66768c; border:1px solid #e1e6eb; border-radius: 3px; box-sizing: border-box;}
.info_box .critical > li a:hover { border-color:#21a089; color:#21a089;}
.info_box .critical > li:nth-child(3n) { padding-right: 0;}
/*.info_box .critical > li:last-child a { background: #f5f6fa;}*/
.info_box .critical > li:nth-last-child(1),
.info_box .critical > li:nth-last-child(2),
.info_box .critical > li:nth-last-child(3) { padding-bottom: 0;}

/* 슬라이드3개 */
.slide_zone:after { content: ""; display: block; clear: both;}
.slide_zone article { float:left; position:relative; margin:0 .75rem 0 0; width:383px; height:260px; overflow:hidden;}
.slide_zone article:last-child { margin:0;}
.slide_zone article img {width: 100%;min-height: 13rem;}
.slide_zone .swipe a { overflow: hidden; height: 0; display: block; padding-bottom: 68%;}
.slide_zone article h3 { position:absolute; left:0; top:0; z-index:10; width:100%; height:34px; line-height:34px; background:rgba(0,0,0,0.3); font-size:14px; color:#fff; font-weight:normal; text-indent: .7rem;}
.slide_zone article .more { position: absolute; right: 7px; top:7px; z-index: 10; font-size:0;width:20px; height:20px; border:1px solid #a7b1c1; background-color:#fff; box-sizing:border-box; text-align: center;}
.slide_zone article .more:before {}
/*.slide_zone article.nomore .bx-controls { right:7px;}*/
.slide_zone article .bx-controls { position:absolute; right:30px; top:7px; z-index:10; font-size:0; width:60px; padding:0 20px; box-sizing:border-box;}
.slide_zone article .bx-controls > * { display:inline-block;}
.slide_zone article .bx-controls a { overflow:hidden; display:inline-block; width:20px; height:20px; border:1px solid #a7b1c1; background-color:#fff; box-sizing:border-box;}
.slide_zone article .bx-pager { font-size:14px; color:#fff; position:absolute; left:-100%; top:0; width:50px; text-align:right }
.slide_zone article .slider2 .bx-pager { left:-80% }
.slide_zone article .bx-stop { font-size: 0;}
.slide_zone article .bx-start { background:#000}
.slide_zone article .bx-prev,
.slide_zone article .bx-next { position:absolute; top:0; text-align:center;}
.slide_zone article .more:before,
.slide_zone article .bx-start:before,
.slide_zone article .bx-stop:before,
.slide_zone article .bx-prev:before,
.slide_zone article .bx-next:before { font-size:17px; color:#64676c; font-family:"xeicon"}
.slide_zone article .bx-prev { left:0;}
.slide_zone article .bx-next { right:0;}
.slide_zone article .more:before{ content: "\e914";}
.slide_zone article .bx-start:before{ content: "\ea3e";}
.slide_zone article .bx-stop:before{ content: "\ea3b";}
.slide_zone article .bx-prev:before{ content:"\e93c";}
.slide_zone article .bx-next:before{ content:"\e93f";}


/* sns소식 */
.sns_box { position:relative; padding: 2.5rem 0 0; height:21.1rem; box-sizing:border-box; background:#fff;}
.sns_box:after { content: ""; position: absolute; left:11rem; top:4.75rem;  width: calc(100% - 17.5rem); height: 1px; background: linear-gradient(to right, #4a75b9, #21a089);}
.sns_box h2 { padding: 0 0 2rem;}
.sns_box .tabs { position: relative; padding: 0 0 0 11rem;}
.sns_box .tabs > ul { position: absolute; left: 0; top: 0;}
.sns_box li { padding:0 0 .6rem 0;}
.sns_box li a { display: block; width:8.9rem; height:2.15rem; line-height: 2.15rem; font-size: .7em; color:#333; border: 1px solid #e1e6eb; text-indent: .65rem;}
.sns_box li a:before { content: ""; display:inline-block; margin: 0 .5rem 0 0;width:1.55rem; height:1.55rem; background:no-repeat 0 0 / contain; vertical-align: middle;}
.sns_box li.ico1 a:before { background-image:url(../img/main/ico_sns1_on.png);}
.sns_box li.ico2 a:before { background-image:url(../img/main/ico_sns2_on.png);}
.sns_box li.ico3 a:before { background-image:url(../img/main/ico_sns3_on.png);}
.sns_box li.ico4 a:before { background-image:url(../img/main/ico_sns4_on.png);}
.sns_box li.on a { border:1px solid; border-image: linear-gradient(to right, #4a75b9, #21a089) 30%; border-color:#21a089; border-bottom-width:2px }
.sns_box li.ico1.on a:before { background-image:url(../img/main/ico_sns1_on.png);}
.sns_box li.ico2.on a:before { background-image:url(../img/main/ico_sns2_on.png);}
.sns_box li.ico3.on a:before { background-image:url(../img/main/ico_sns3_on.png);}
.sns_box li.ico4.on a:before { background-image:url(../img/main/ico_sns4_on.png);}
.sns_box .tab_con { height: 11rem; display:block; position:absolute; z-index:-1; visibility:hidden !important;}
.sns_box .tab_con.on { display:block; position:relative; z-index:10; background:#fff; visibility:visible !important;}
.sns_box .tab_con a { display: block;}
.sns_box .tab_con h3 { padding:0 0 .65rem; font-size:.85em; color:#343639; line-height:1.2rem; font-weight: normal; letter-spacing: -1.5px;}
.sns_box .tab_con span { font-size: .7em; color:#888; line-height: 100%;}
.sns_box .tab_con p { padding: 1.25rem 0 0;font-size:.75em; line-height:1.2rem;  letter-spacing: -1px; color:#888; font-weight: 100; height:100px; overflow:hidden }
.sns_box .tab_con .sns > div {  }
.sns_box .control { position: absolute; right: 0; top: 3.75rem;}
.sns_box .control a { display: inline-block; width: 2.1rem; height: 2.1rem; border:1px solid #e1e6eb; box-sizing: border-box; color:#525252; font-size: 0; text-align:center; line-height: 2rem;}
.sns_box .control a:hover { background: #0f9ca6; border-color: #0f9ca6; color:#fff;}
.sns_box .control a:first-child:before { content: "\e908"; font-family: 'xeicon'; font-size: 1rem;}
.sns_box .control a:last-child:before { content: "\e90b"; font-family: 'xeicon';font-size: 1rem;}
.sns_box .bx-controls { display: none;}
.sns_box .youtube div { overflow:hidden; width:100%;}
.sns_box .youtube div img {width:100%;}
.sns_box .youtube h3 { padding:.75rem 0 .5rem; font-size:.75rem; color:#333; line-height:1.1rem;}
.sns_box .youtube span { font-size:.65rem; color:#555; line-height:100%;}
.sns_box .bx-viewport::after{content:"";display:block;width:50px;height:100%;background:-webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);background:linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);position:absolute;right:0;top:0;}
/* 보고용css
.sns_box .tab_con.no2,
.sns_box .tab_con.no3,
.sns_box .tab_con.no4 { height:11rem;}
.sns_box .tab_con.no2 .bx-wrapper,
.sns_box .tab_con.no2 .bx-viewport,
.sns_box .tab_con.no2 .sns.no2,
.sns_box .tab_con.no3 .bx-wrapper,
.sns_box .tab_con.no3 .bx-viewport,
.sns_box .tab_con.no3 .sns.no3,
.sns_box .tab_con.no4 .bx-wrapper,
.sns_box .tab_con.no4 .bx-viewport,
.sns_box .tab_con.no4 .sns.no4 { height:11rem !important;}
.sns_box .tab_con.no2 .sns.no2 > div,
.sns_box .tab_con.no3 .sns.no3 > div,
.sns_box .tab_con.no4 .sns.no4 > div { width:200px !important;}
보고용css */

/* 본문하단광고 */
.btm_ad { padding: 2.5rem 0;background: #f5f6fa;}
.btm_ad:after { content: ""; display: block; clear: both;}
.btm_ad > div{ margin:0 auto; width:1180px;}
.btm_ad li { float: left; width: 283px;}
.btm_ad li ~ li { padding-left: 16px;}
.btm_ad li a { display: block; padding: 0 0 .9rem; background: #fff; border-bottom: 2px solid #d3d8dd; font-size: .75rem; color:#777; text-align: center; line-height: 100%;}
.btm_ad li a span { display:block; height:180px; overflow:hidden;}
.btm_ad li a span img { transition:all .3s;}
.btm_ad li a:hover span img { transform:scale(1.1);}
.btm_ad li a:hover{ border-bottom-color: #21a089;}
.btm_ad li strong { display: block; padding: .9rem 0 .35rem; font-size: 1.1em; color:#343639;}

@media screen and ( max-width:1200px){
[id^="layerPopup"] .layer_popup_wrap { padding: 0 5rem }
.col2 > *:first-child,
.col2 > *:last-child { float:none; width:inherit;}
.main_visual > div { margin: 0; width: 100%; }
.main_visual .ad { margin:0 .75rem; }
.main_visual .ad li a span { height:auto;}
main { padding: 0; font-size: 16px }
main .right,
.slide_zone { float: none; width: 100%;}
.news { height: auto; padding:.5rem 1.1rem; margin: 0 1.25rem 1.25rem; width: calc(100% - 2.5rem) }
.news .tabs > ul { border: none;}
.news .tabs > ul li a span { display: none;}
.news .tab_con { padding: .78rem 0 0 ;}
.news .tab_con > a {width:100%; float:none }
.news .tab_con > a h2 { font-size: 15px }
.news .tab_con > a span { position:static; }
.news .tab_con > a.more > span { position:absolute }
.news .tab_con ul { float: none; padding: 0;width: 100%; margin:0;}
.news .tab_con li { padding: 0; border-bottom:1px solid #eaeef3;}
.news .tab_con li:last-child { border-bottom: none;}
.news .tab_con li:before { display: none;}
.news .tab_con li a { position: relative; line-height: 2.43rem; box-sizing:border-box; padding-right:1rem; }
/*.news .tab_con li a:after { content: "\e93f"; position: absolute; right: 0; top: 50%; font-family: 'xeicon'; font-size: .8125rem;  transform: translateY(-50%); color:#b9c2cf;}*/
.news .tab_con > .more { display:block }
.news .tab_con > .more { font-size: 0; top: 1.5rem; right: 1rem; }
.news .tab_con > .more:after { font-size: 1rem;}
.slide_zone { padding: 0 .5rem; box-sizing: border-box;}
.slide_zone .btm { margin: 0 1.25rem 1.25rem; width: calc(100% - 2.5rem);}
.slide_zone .btm:after { content: ""; display: block; clear: both;}
.slide_zone article { height: auto; width:31%; margin: 0 1.15% !important;}
.slide_zone article img {width: 100%;min-height: auto;}
.slide_zone article h3 { position: static; background:#f5f6fa; color:#343639; text-indent: .5rem; width: auto; border: 1px solid #e1e6eb;}
.slide_zone article .bx-pager {color:#343639;}
.slide_zone article .more { top: 9px;}
main .right { padding: 0 1.25rem 1.875rem; box-sizing: border-box;}
.slide_zone article .bx-controls { top: -27px;}
.quick_link { margin-left: 1.25rem; margin-right: 1.25rem; padding: .5rem 0 0;}
.quick_link ul { padding: .5rem .5rem 0; box-sizing: border-box; }
.quick_link li { padding: 0 0 1rem;}
.quick_link h2 { font-size: 1em; color:#343639; left:2rem; text-align:left; }
.quick_link h2 img { display: none;}
.quick_link > a { top:1.5rem; transform: translateY(0);}
.quick_link > a:after { content: "\e913"; color:#b9c2cf; background: none;}
.info_box { margin: 0 1.25rem; width: calc(100% - 2.5rem);}
.info_box .tab_con { height: auto; padding: 1.5rem;}
.info_box .health li { width: 16.6%;}
.info_box .list li:nth-child(7n) { padding-right: 4px;}
.info_box .health li a span:before { background-size: 9rem auto;}
.info_box .critical > li:nth-child(3n) { padding-right: .3rem;}
.sns_box { margin: 0 1.25rem; padding-top:1rem; height: 22rem }
.sns_box > a { display: none;}
.sns_box .tab_con a { padding-top:1rem }
.btm_ad > div { margin: 0; width: 100%; padding: 0 .625rem; box-sizing: border-box;}
.btm_ad li { width:calc(25% - 20px); padding: 0 10px;}
.btm_ad li ~ li { padding-left: 10px;}
.btm_ad li img { width: 100%;}
.btm_ad li a span { height:auto;}
.top10.fixed { right: 6.5rem; transform: none; }
.top10 .bx:after { content: ""; display: block; clear: both;}
.top10 .bx h2 { height: 3rem; border-bottom: 1px solid #e1e6eb; line-height: 3rem; color:#043763; font-size: .875rem; text-align: center;}
.top10 .bx li a { color:#adadae; font-size: .875rem; line-height: 2.375rem;}
.top10 .bx li a:hover { color:#043763;}
.top10 .bx li span { display: inline-block; width: 1.4rem; font-style: italic;}
}
@media screen and ( max-width:1004px){
	[id^="layerPopup"] { top: 65px!important; }
	[id^="layerPopup"] { left: 50%!important; max-width:100%; }
}

@media screen and ( max-width:768px){
	[id^="layerPopup"] .layer_popup_wrap { padding: 0 .5rem }
  .main_visual .ad { display:block; padding:1.43rem 1rem 0; margin:0 }
  .main_visual .ad:after { content: ""; display: block; clear: both;}
  .main_visual .ad li { flex:none; float:left; width: calc(50% - 10px) !important; margin: 0 5px 20px; padding:0 !important;}
    .main_visual .ad li.w100 { width:calc(100% - 20px) !important;}
  .news .tabs > ul li a { font-size: .9em; }

  .info_box .list a { width:2.7rem }
  .info_box .tag a { font-size: 12px }
  .btm_ad { padding: 1.25rem 1.25rem 0; }
  .btm_ad > div { padding:0; }
  .btm_ad ul { margin:0 -5px; }
  .btm_ad li { padding:0 5px 10px !important; width: calc(50% - 10px)}
  .btm_ad li a { letter-spacing: -.5px; }
  .slide_zone article .bx-pager { display: none }

  .main_visual {padding:0 0 0.5rem;}
  .mobile {display: block;}
  .main_visual .ad li.w33 {width: calc(33.33% - 0.8rem)}

  #container {position:relative;}
  .box-area {position:relative; width:100%;}
  .box-area .col2 {position:absolute; top:0; left:0; width:calc(100% - 1.25rem);}
  .box-area .quick_link {position:absolute; top:43.2rem; left:0; width:calc(100% - 2.5rem);}
  .box-area .slide_zone {padding-top:55rem;}
  /*.main_visual .ad li a img {display:none;}*/

  /* 메인상단 서브비주얼&텍스트 영역 두줄로 표현시 */
  .main_visual .bookmark ul > li > a {min-height:40px;}
  .main_visual .ad li a em {min-height:44px; margin:0.5rem; }

}

@media screen and ( max-width:550px){
  .quick_link h2 { top: 1rem;}
  .quick_link > a { top: .5rem; right: 1rem; }
  .quick_link ul { display:block; height: auto; padding:0 0 .5rem 0;}
  .quick_link ul:after { content: ""; display: block; clear: both;}
  .quick_link li { float:left; width: 33.3%;}
  .info_box .health li { width: 33.3%;}
  .info_box .tab_con { padding: 1rem;}
  .info_box .critical > li { width:calc(33% - 0.3rem);}
  .info_box .critical > li a { width: 100%;}
  .slide_zone { padding: 0; }
  .slide_zone article { float: none; width: 100%; padding: 0 1.25rem 1.875rem; box-sizing: border-box; margin: 0 !important;}
  .slide_zone article .more { right: 1.5rem;}
  .slide_zone article .bx-controls { right: 2.5rem;}
  .slide_zone article .bx-pager { display: block }
  .sns_box { height:auto; padding:2.5rem 0 1rem;}
  .sns_box h2  { font-size:1.06rem; color:#343639; padding-bottom:1.5rem; }
  .sns_box h2 img {display:none}
  .sns_box:after { display: none;}
  .sns_box .control { top: .8rem;}
  .sns_box .tabs { padding: 0;}
  .sns_box .tabs > ul { position: static; display: flex; margin:0 0 1rem;}
  .sns_box .tab_con { height:auto;}
  .sns_box li { padding: 0; flex:1;}
  .sns_box li a { width: 100%; text-indent: 0; text-align: center; border-left-color:#fff;}
  .sns_box li:first-child a { border-left-color:#e1e6eb}
  .sns_box li.on a { position: relative; z-index: 3;}

  .main_visual .top_visual .pc {display:none;}
  .main_visual .top_visual .mob {display:block;}
}



@media screen and (max-width:400px){
	/* iPhone 6/7/8/X  375px */
	.box-area .quick_link {top:46.2rem;}
	.box-area .slide_zone {padding-top:57rem;}
}

@media screen and (max-width:354px){
	.box-area .quick_link {top:48.2rem;}
	.box-area .slide_zone {padding-top:58.5rem;}
}



@media screen and (max-width:320px){
	main { font-size:14px }
}





@media screen and (max-width:340px){
  /* 메인상단 서브비주얼&텍스트 영역 두줄로 표현시 */
  .main_visual .bookmark ul > li > a {min-height:40px;}
  .main_visual .ad li a em {min-height:60px; margin:0.5rem; }
}



/* 2020.02.19 SY,CHo SNS 추가 */
.sns_box02 {padding: 1rem 0rem 2rem 1rem; width: 100%; max-width: 1180px; box-sizing: border-box; background:#fff; overflow: hidden;}
.sns_box02 * {box-sizing: border-box;}
.sns_box02 h2 {padding: 0 0 1rem;}
.sns_float {overflow: hidden;}
.sns_float_left {float: left;width: calc(100% - 640px);line-height: 1.5;font-size: 0.75rem;color: #999;}
.sns_float_left .line01 {margin-bottom: 1rem; font-size: 1.2rem; color: #333;}
.sns_float_left .line01 span {position: relative; display: inline-block; z-index: 1;}
.sns_float_left .line01 span:before {position: absolute;bottom: 0px;/* left: -5px; */width: 100%;height: 0.7rem;background: #ffd02b;content: "";z-index: -1;}
.sns_float_right {float: left;width: 640px;overflow: hidden;}
.sns_float_right li {float: left;padding: 0 1.5rem;text-align: center;}
.sns_float_right a {display: inline-block;width: 100px;height: 100px;background: url('../img/main/ico_sns_link.png');border-radius: 50%;overflow: hidden;/* transition: .25s; *//* -webkit-transition: .25s; */}
.sns_float_right a.facebook {background-position: 0 top;}
.sns_float_right a.twitter {background-position: -110px top;}
.sns_float_right a.naverpost {background-position: -220px top;}
.sns_float_right a.youtube {background-position: -330px top;}
.sns_float_right a.facebook:hover {background-position: 0px bottom;}
.sns_float_right a.twitter:hover {background-position: -110px bottom;}
.sns_float_right a.naverpost:hover {background-position: -220px bottom;}
.sns_float_right a.youtube:hover {background-position: -330px bottom;}

@media screen and (max-width: 1024px){
	/* 2020.02.19 SY,CHo SNS 추가 */
	.sns_box02 {padding:.5rem 2.5rem 2.5rem 2.5rem;}
	.sns_float_left,
	.sns_float_right {width: 100%;}
	.sns_float_right {margin-top: 1rem;}
	.sns_float_right li {width: 25%;}
}
@media screen and (max-width: 600px){
	/* 2020.02.19 SY,CHo SNS 추가 */
	.sns_box02 {padding:.5rem 2.5rem 2.5rem 2.5rem;}
	.sns_float_right li {margin: 1rem 0; width: 50%;}
}



























/**/