﻿@charset "utf-8";

.talk_link, .go_top {z-index:9999 !important}
.main #container {background:none; padding-top:0px;}
.main #header {background:none}
.main #header:after {border-bottom:1px solid rgba(255, 255, 255, 0.2);}
#header.onFix:after {border-bottom:1px solid #cdd0d2;}
.main .header_wrap .logo a:before {background: url(/content/images/main/logo_w.png) no-repeat 0 0;}
.main .header_wrap .gnb_area .gnb_nav .dth1_a, .main .header_wrap .gnb_area .gnb_side .dth1_a {color:#fff}

.main #header.on, #header.onFix {background:#fff}
.main #header.on .header_wrap .logo a:before, .main #header.onFix .header_wrap .logo a:before {background: url(/content/images/main/logo.png) no-repeat 0 0;}
.main #header.on .header_wrap .gnb_area .gnb_nav .dth1_a, .main #header.on .header_wrap .gnb_area .gnb_side .dth1_a,
.main #header.onFix .header_wrap .gnb_area .gnb_nav .dth1_a, .main #header.onFix .header_wrap .gnb_area .gnb_side .dth1_a {color:#05141f}
.main #header.on .header_wrap .gnb_area .gnb_nav .dth1_l.dth_on .dth1_a, .main #header.onFix .header_wrap .gnb_area .gnb_nav .dth1_l.dth_on .dth1_a {background:none;}

/* main kv*/
br.pc {display:block;}
br.mo {display:none;}
.key_visual {position:relative; max-width:1920px; max-height:1010px; margin:0 auto; box-sizing:border-box; touch-action:auto; overflow: hidden;}
.key_visual .slick-list {position:relative; overflow:hidden; }
.key_visual .slick-slide {float:left;}
.key_visual .slick-dots {position:relative; display:inline-block; vertical-align:middle;}
.key_visual .slick-dots li {display:inline-block;}
.key_visual .slick-dots li button {position:relative; padding:10px 12px; text-indent:-999px; overflow:hidden; font-size:0; vertical-align:middle;}
.key_visual .slick-dots li button:after {position:relative; display:block; width:11px; height:11px; border-radius:10px; background:#fff; border:1px solid #cdd0d2; content:''; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s;}
.key_visual .slick-dots li.slick-active button:after {width:57px; opacity:1; background:#05141f}

.key_visual .controlWrap {position:absolute; left:0; top:75%; z-index:1000; width:100%; text-align:center;}
.key_visual .controlWrap .play, .key_visual .controlWrap .pause {position:relative; display:inline-block; width:25px; height:25px; margin-left:5px; background:#05141f; border-radius:25px; border:1px solid rgba(255,255,255,0.4); text-indent:-999px; overflow:hidden; font-size:0; vertical-align:middle;}
.key_visual .controlWrap .play {display:none;}
.key_visual .controlWrap .play:before {position:absolute; display:block; top:6px; left:10px; width:0; height:0; border:5px transparent solid;border-right-width:0; border-left-color:#fff; content:'';}
.key_visual .controlWrap .pause:before, .key_visual .controlWrap .pause:after {position:absolute; display:block; top:7px; left:8px; width:2px; height:9px; background:#fff; content:'';}
.key_visual .controlWrap .pause:after {left:14px;}

.key_visual .slick-arrow {position:absolute; top:45%; z-index:1001; width:36px; height:72px; text-indent:-999px; font-size:0; overflow:hidden;}
.key_visual .slick-arrow.prev {left:5%;}
.key_visual .slick-arrow.next {left:auto; right:5%;}
.key_visual .slick-arrow.prev:before, .key_visual .slick-arrow.next:before {display:block; position:absolute; top:10px; width:50px; height:50px; border:2px solid #fff; content:''; transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg); -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s;}
.key_visual .slick-arrow.prev:before {left:10px; border-right-width:0; border-bottom-width:0}
.key_visual .slick-arrow.next:before {left:auto; right:10px; border-left-width:0; border-top-width:0}

.key_visual .cont {position:absolute; top:21%; z-index:3; width:100%; text-align:left; opacity:0}
.key_visual .con_bt {float: right;margin-top: -170px;margin-right:-375px;opacity: 1;}
.tak_nt{margin-left:120px; margin-top:18px; color:white; font-size:16px;}
.banner_list li {float: left;width: 33.33%;text-align: center;}
.banner_list li a.ico_1 {background-image: url('/content/images/main/main_icon_inquiry.png');}
.banner_list li a.ico_2 {background-image: url('/content/images/main/main_icon_remote.png');}
.banner_list li a.ico_3 {background-image: url('/content/images/main/main_icon_question.png');}
.banner_list li a {display: inline-block;padding-top: 132px;font-size: 18px;line-height: 22px;color: #fff;width: 208px;height: 208px;margin-right:50px;border-radius: 15px;background-color: rgba(0, 0, 0, 0.4);box-sizing: border-box;background-repeat: no-repeat;background-position: center 34px;text-decoration: none !important;}
.banner_list li a:hover{background-color:#ea2627;opacity:0.8;}



.key_visual .slick-slide.slick-active .cont {opacity:1; float:left; width:70%;}
.key_visual .cont h2 {margin-bottom:15px; font-size:52px; color:#05141f; line-height:1}
.key_visual .cont h2.white {color:#fff;}
.key_visual .cont h2.red {color:#bb162b;}
.key_visual .cont h2 img {width:auto; margin-bottom:-15px;}
.key_visual .cont .sTit {display:block; margin:130px 18% 30px; font-size:38px;  color:#05141f; line-height:1.3; text-shadow:0 0 5px #fff; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s;}
.key_visual .cont .sTit.none {text-shadow:none !important;}
.key_visual .cont .view {position:relative; display:inline-block; min-width:160px; padding:10px 35px 10px 30px; box-sizing:border-box; border:1px solid #05141f;  font-size:18px; color:#05141f;}
.key_visual .cont .view:hover,.key_visual .cont .view:focus, .key_visual .cont .view:active {background:#05141f; border:1px solid #05141f; color:#fff; text-decoration:none;}
.key_visual .cont .view i {display:block; position:absolute; top:12px; right:12px; width:6px; height:11px;}
.key_visual .cont .view i:before, .key_visual .cont .view i:after {display:block; position:absolute; top:0; right:0; width:1px; height:8px; background:#05141f; content:''; transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg); transition-duration:0.3s;}
.key_visual .cont .view i:after {top:5px; transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg);}
.key_visual .cont .view:hover i:before, .key_visual .cont .view:focus i:before, .key_visual .cont .view:active i:before, .key_visual .cont .view:hover i:after, .key_visual .cont .view:focus i:after, .key_visual .cont .view:active i:after {background:#fff;}

.key_visual .cont .sTit.white {color:#fff; text-shadow:0 0 5px #000;}
.key_visual .cont .view.white {border:1px solid #fff; color:#fff;}
.key_visual .cont .view.white:hover, .key_visual .cont .view.white:focus, .key_visual .cont .view.white:active {background:#fff; border:1px solid #fff; color:#05141f;}
.key_visual .cont .view.white i:before, .key_visual .cont .view.white i:after {background:#fff;}
.key_visual .cont .view.white:hover i:before, .key_visual .cont .view.white:focus i:before, .key_visual .cont .view.white:active i:before, .key_visual .cont .view.white:hover i:after, .key_visual .cont .view.white:focus i:after, .key_visual .cont .view.white:active i:after {background:#05141f;}
.key_visual .cont .sTit.red {color:#bb162b; text-shadow:0 0 5px #000;}
.key_visual .cont .view.red {border:1px solid #bb162b; color:#bb162b;}
.key_visual .cont .view.red:hover, .key_visual .cont .view.red:focus, .key_visual .cont .view.red:active {background:#bb162b; border:1px solid #bb162b; color:#fff;}
.key_visual .cont .view.red i:before, .key_visual .cont .view.red i:after {background:#bb162b;}
.key_visual .cont .view.red:hover i:before, .key_visual .cont .view.red:focus i:before, .key_visual .cont .view.red:active i:before, .key_visual .cont .view.red:hover i:after, .key_visual .cont .view.red:focus i:after, .key_visual .cont .view.red:active i:after {background:#fff;}
.key_visual .img {max-height:1010px; overflow:hidden; position:relative;}
.key_visual .img video {position:relative;display:block; z-index:1; width:100%; transform:translateY(-6.5%);}
.key_visual .img img {width:100%; height:auto;}
.key_visual .img img.mo {display:none}
.key_visual .img video.mo {display:none}
.key_visual .img.dim:before {display:block; position:absolute; top:0; left:0; z-index:2; width:100%; height:100%; content:''; background: -moz-linear-gradient(top,  rgba(5,20,31,0.6) 0%, rgba(255,255,255,0.6) 100%);background:-moz-linear-gradient(top, rgba(5,20,31,0.6) 0%, rgba(255,255,255,0) 50%); background:-webkit-linear-gradient(top, rgba(5,20,31,0.6) 0%,rgba(255,255,255,0) 50%); background:linear-gradient(to bottom,  rgba(5,20,31,0.6) 0%,rgba(255,255,255,0) 50%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#9905141f', endColorstr='#00ffffff',GradientType=0 );}
.bgfont{font-size:25px;}

@media all and (max-width:1024px){
.main #container {top:-60px;padding-top:0;}
.main .spr_menu, .main .spr_menu:before, .main .spr_menu:after {background:#fff;}
.main .header_wrap .logo a:before, .main #header.on .header_wrap .logo a:before {width:216px; background-size:216px auto}
.main .header_wrap .gnb_area .gnb_nav .dth1_a, .main .header_wrap .gnb_area .gnb_side .dth1_a {color:#05141f}
.main .header_wrap .view_sch span:before, .main .header_wrap .view_sch:focus span:before, .main .header_wrap .view_sch:active span:before, .main .header_wrap .view_sch:hover span:before {border-color:#fff} /* 20210107 edit */
.main .header_wrap .view_sch span:after, .main .header_wrap .view_sch:focus span:after, .main .header_wrap .view_sch:active span:after, .main .header_wrap .view_sch:hover span:after {background:#fff} /* 20210107 edit */
.main .header_wrap .view_sch span:before {border-color:#fff}
.main .header_wrap .view_sch span:after {background:#fff}
.key_visual .controlWrap {top:76%}
.key_visual .slick-arrow {top:42%; width:26px; height:52px;}
.key_visual .slick-arrow.prev:before, .key_visual .slick-arrow.next:before {top:0;}
.key_visual .img video {transform: translateY(6.5%);}
.key_visual .cont {top:30%;}
.key_visual .cont h2 {font-size:34px}
.key_visual .cont h2 img {height:45px; max-height:4.8vw}
.key_visual .cont .sTit {font-size:22px; margin:5px 8% 25px;  word-break:keep-all;}
.key_visual .cont .view {min-width:120px; padding:7px 35px 7px 30px; font-size:14px}
.key_visual .cont .view i {top:9px;}
.key_visual .slick-slide.slick-active .cont{display:flex;}
.key_visual .slick-slide.slick-active .cont .sTit{width:370px;}
.key_visual .slick-slide.slick-active .cont .bg_srh{margin-top:78px; margin-left:-43px;}
}
@media all and (max-width:767px){
br.pc {display:none;}
br.mo {display:block;}
.main .header_wrap .logo a {width:215px; padding-top:18px;}
.main .header_wrap .logo a:before {width:215px;}
.main #header.on .header_wrap .logo a:before, .main #header.onFix .header_wrap .logo a:before {width:70px; background-size:70px auto}
.key_visual .img img.pc {display:none}
.key_visual .img img.mo {display:block}
.key_visual .img video.pc {display:none}
.key_visual .img video.mo {display:block}
.key_visual .img {position:relative;}
.key_visual .img video {position:relative; left:50%; transform:translate(-50%, 0); width:300%;}
.key_visual .slick-arrow {display:none !important}
.key_visual .cont {top:24%;}
.key_visual .cont h2 {font-size:27px;}
.key_visual .cont h2 img {height:35px; max-height:none;}
.key_visual .cont .sTit {margin:3% 40px 7%; font-size:24px;}
.key_visual .cont .view {min-width:100px; padding:5px 35px 5px 30px; font-size:12px}
.key_visual .cont .view i {top:7px;}
.key_visual .slick-dots li button:after {width:7px; height:7px;}
.key_visual .slick-dots li.slick-active button:after {width:37px}
.key_visual .slick-dots li button {padding:10px 9px;}
.key_visual .controlWrap {top:85%;}
.key_visual .controlWrap .play, .key_visual .controlWrap .pause {width:22px; height:22px;}
.key_visual .controlWrap .pause:before, .key_visual .controlWrap .pause:after {top:7px; left:7px; height:7px;}
.key_visual .controlWrap .pause:after {left:12px;}
.key_visual .controlWrap .play:before {top:6px; left:9px; border:4px transparent solid; border-left-color:#fff;}
}
@media all and (max-width:540px) {
    .key_visual .slick-slide.slick-active .cont{display:block;}
    .key_visual .slick-slide.slick-active .cont .bg_srh{margin-top:0px; margin-left:40px; width:120%; height:53px; padding:12px 80px 0 40px;}
    .key_visual .slick-slide.slick-active .cont .bg_srh input{font-size:18px;}
    .key_visual .cont .sTit {margin-top: 139px !important;}
    .bgfont {font-size: 18px;}
}

@media all and (max-width:414px){
    .key_visual .cont .sTit {margin-top: 114px !important;}
}

@media all and (max-width:375px){
    .bgfont{font-size:15px;}
    .key_visual .cont .sTit {margin-top: 114px !important;}
}

@media (max-width: 320px) {
    .key_visual .cont .sTit {margin: 3% 28px 7%;}
    .key_visual .slick-slide.slick-active .cont .bg_srh{margin-top:-4px; margin-left:29px;}
}

@media all and (max-width:280px){
    .bgfont{font-size:15px;}
    .key_visual .cont .sTit {margin-top: 99px !important; margin: 3% 12px 7%;}
    .header_wrap .open_gnb {left: -8px !important;}
    .header_wrap .logo a{margin-left:-23px;}
    .header_wrap .view_sch span{left:8px !important;}
}

/* 유용한 주제 */
.section_title01{border-bottom:1px solid #dedede;}
.sectiontitle{position:relative; box-sizing:border-box; margin:0 auto; width:817px; margin-top:55px; padding-bottom:12px; word-wrap:break-word; text-align:center;}
.sectionTitle-heading {margin-bottom: 0;font-size: 32px;line-height: 1.05;font-weight: 500;letter-spacing: .008em;}
.promo {position: relative;box-sizing: border-box;margin: 0 auto;width: 980px;margin-top: 32px;padding: 0 0 50px 0;word-wrap: break-word;}
.promo .u-layout--4up {max-width: 980px;display:flex;}
.u-layout--4up .promo-item{padding-left:24px; padding-right:24px;}
.u-layout--4up .u-layoutTable-item {width: 23%;display: flow-root;border-right: 1px solid #dedede;text-decoration-color: #0070c9;cursor: pointer;}
.u-layout--4up .u-layoutTable-item:last-child {border-right: none;}
.promo-image {display: block;margin: 0 auto;}
.promo-link{text-align:center; padding-top:18px;font-size:16px;color:#0070c9;}
.section_title02{border-bottom:1px solid #dedede;}
.sectionTitle-intro {color: #333;max-width: 83.33333%;margin-left: auto;margin-right: auto;margin-top: 12px;margin-bottom: 0;font-size: 17px;line-height: 1.5294717647;font-weight: 400;letter-spacing: -0.021em;}
.promo-links{text-align:center; padding-top:18px;font-size:16px;}
.u-layout--4up .under{text-decoration-color:black;}
.u-layout--4up .u-layoutTable-items {width: 23%;display: flow-root;border-right: 1px solid #dedede;cursor: pointer;}
.as-navLink-wrapper {position: relative;box-sizing: border-box;margin: 0 auto;width: 980px;text-align: center;}
.as-navLink-wrapper.as-navLink--icon {margin-top: 24px;display: block;margin-bottom:60px;}
.as-navLink {text-decoration:none !important;}
.as-navlink-text{color:#0070c9; font-size:17px;line-height: 1.5294717647; font-weight:400;}
@media all and (max-width:1024px){
    .u-layout--4up .u-layoutTable-items:last-child{border-right:none;}
}
@media all and (max-width:768px) {
    .u-layout--4up .u-layoutTable-items{width:14%;}
}
@media all and (max-width:540px) {
    .sectiontitle {width: 538px;}
    .u-layout--4up .u-layoutTable-items{width:5.6%;}
    .as-navLink-wrapper{width:540px;}
}
@media (max-width: 540px) {
    .sectiontitle{width:413px;}
    .sectionTitle-heading{font-size:24px;}
    .sectionTitle-intro{font-size:16px;}
}
@media (max-width: 414px) {
    .as-navLink-wrapper{width:413px;}
    .u-layout--4up .u-layoutTable-items{width:5.5%;}
}
@media (max-width: 375px) {
    .sectiontitle{width:372px;}
    .sectionTitle-heading{font-size:22px;}
    .sectionTitle-intro{font-size:14px;}
    .u-layout--4up .u-layoutTable-items {width: 4.6%;}
    .key_visual .slick-slide.slick-active .cont .bg_srh {padding: 13px 80px 0px 15px;height:50px;}
    .key_visual .slick-slide.slick-active .cont .bg_srh input {font-size: 15px;}
    .key_visual .cont .sTit {font-size: 20px;}
    .promo-links{font-size:13px;}
    .as-navLink-wrapper {width: 374px;}
}
@media (max-width: 360px) {
    .u-layout--4up .u-layoutTable-items {width: 4.2%;}
    .as-navLink-wrapper {width: 358px;}
    .as-navlink-text {font-size: 15px;line-height: 1.8;}
}
@media (max-width: 320px) {
    body{margin-left:20px;}
    .sectiontitle {width: 319px;}
    .promo02{margin-left:-16px;}
    .promo03{margin-left:-9px;}
    .promo04{margin-left:-16px;}
    .u-layout--4up .u-layoutTable-items{width:3.2%;}
}


/* 궁금하신 내용 검색하기 */
input::placeholder {color:#fff;}
input::-webkit-input-placeholder {color:#fff;}
input:-ms-input-placeholder {color:#fff;} 
textarea::placeholder {color:#fff;}
textarea::-webkit-input-placeholder {color:#fff;}
textarea:-ms-input-placeholder {color:#fff;}
input:focus {outline: none;}
textarea:focus {outline: none;}
.bg_srh {position: relative;width: 41%;height: 62px;padding: 16px 80px 0 40px;box-sizing: border-box;background-color: rgba(255, 255, 255, 0.2);color: #fff;margin-left:18%;}
.bg_srh input {border: 0;width: 100%;vertical-align: middle;font-size: 20px;color: #fff;background: none;padding: 0;font-family: 'Noto Sans KR', sans-serif;}
.bg_srh button {display: block;position: absolute;right: 30px;top: 0;width: 30px;height: 100%;border: 0;font-size: 0;line-height: 0;text-indent: -9999px;background: url(/content/images/main/search.png) no-repeat center center;}

@media all and (max-width:1280px){
    .banner_list{display:none;}
    .key_visual .cont .sTit{margin-top:83px;}
    .bg_srh{width:50%;}
}
@media all and (max-width:1024px){
    .bg_srh{width:60%;padding: 16px 80px 0 20px;}
}
@media all and (max-width:768px){
    .bg_srh{width:70%;}
    .as-navLink-wrapper{width:767px;}
}
@media all and (max-width:540px){
    .as-navLink-wrapper.as-navLink--icon{margin-top:0px;}
    .as-navLink-wrapper {width: 539px;}
}
@media all and (max-width:414px){
    .as-navLink-wrapper {width: 413px;}
}
@media all and (max-width:375px){
    .as-navLink-wrapper {width: 381px;}
}
@media all and (max-width:360px){
    .as-navLink-wrapper {width: 366px;}
}
@media all and (max-width:320px){
    .as-navLink-wrapper {width: 326px;}
}

/* news, notice */
.noticebox {position:relative; max-width:1400px; margin:3.5% auto 0; padding-bottom:150px; overflow:hidden;}
.noticebox:after {display:block; clear:both; content:''}
.noticebox h2 {margin-bottom:4%; font-size:32px; font-family:kiaB; line-height:1}
.kiabox + .noticebox {margin-top:6%;}
.noticebox .news {position:relative; float:left; width:53.929%; margin-right:3%;}
.news .news_list {position:relative; }
.news .news_list .slick-list {width:100%; padding-right:19.9%; box-sizing:border-box; overflow:hidden;}
.news .news_list .slick-slide {float:left; margin-right:6px;}
.news .news_list .slick-slide .img:after {display:block; position:absolute; top:0; left:0; z-index:1; width:100%; height:100%; background:rgba(5,20,31,0.7); content:'';}
.news .news_list .slick-slide .title, .news .news_list .slick-slide .date {display:none}
.news .news_list .slick-active .img:after {display:none}
.news .news_list .slick-active .title {display:block; display:-webkit-box; font-weight:bold;text-decoration: none !important;} /* newfont */
.news .news_list .slick-active .date {display:block;}
.news .news_list .img {display:block; position:relative;}
.news .news_list .img img {width:100%; height:197px; border:1px solid #ddd; background:#e9e9e9;}
.news .news_list .date {display:block; padding:20px 0 10px; font-size:14px; color:rgba(5,20,31,0.6)}
.news .news_list .title {display:block; width:100%; height:48px; padding-right:10%; box-sizing:border-box; font-size:18px; line-height:1.3; color:#05141f; overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;} /* newfont */
.news .news_list a {display:block;}
.news .news_list a:hover {text-decoration:none}
.news .news_list a:hover .title {text-decoration:underline;}
.news .news_list .slick-dots {position:absolute; display:block; top:-40px; right:-0.6%;}
.news .news_list .slick-dots li {display:inline-block;}
.news .news_list .slick-dots li button {position:relative; padding:8px 6px; text-indent:-999px; overflow:hidden; font-size:0; vertical-align:middle;}
.news .news_list .slick-dots li button:after {position:relative; display:block; width:9px; height:9px; border-radius:10px;  background:#05141f; opacity:.4; content:''; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s;}
.news .news_list .slick-dots li.slick-active button:after {width:32px;opacity:1;}
.news .slick-arrow {position:absolute; top:27%; z-index:1001; width:45px; height:45px; text-indent:-999px; font-size:0; overflow:hidden; opacity:0;transition-duration:0.3s;}
.news:hover .slick-arrow, .slick-arrow:focus {opacity:1; }
.news .slick-arrow.prev {left:2%;background: url('/content/images/main/arrow_prev.png') no-repeat 8% 0%;width:100px;}
.news .slick-arrow.next {left:auto; right:2%;background: url('/content/images/main/arrow_next.png') no-repeat 89% 0%;width:100px;}
.news .slick-arrow.prev:before, .news .slick-arrow.next:before {display: block;position: absolute;    
    /*top:0; width:40px; height:40px; border:2px solid #fff; content:''; transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg); -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -ms-transition:all 0.3s; -o-transition:all 0.3s; box-shadow:0 0 1px 1px rgba(0, 0, 0, 0.3);-webkit-box-shadow:0 0 1px 1px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 0 1px 1px rgba(0, 0, 0, 0.3);*/
}
.news .slick-arrow.prev:before {left:10px; border-right-width:0; border-bottom-width:0}
.news .slick-arrow.next:before {left:auto; right:10px; border-left-width:0; border-top-width:0}
.noticebox .notice {position:relative; float:left; width:42.858%; padding-left:7.4%; box-sizing:border-box;}
.notice .notice_list {border:1px solid rgba(5,20,31,0.2); box-sizing:border-box;}
.notice .notice_list:after {display:block; clear:both; content:''}
.notice .notice_list li {float:left; width:50%; box-sizing:border-box;}
.notice .notice_list li:nth-child(2) {border-left:1px solid rgba(5,20,31,0.2)}
.notice .notice_list li:nth-child(3) {border-top:1px solid rgba(5,20,31,0.2)}
.notice .notice_list li:nth-child(4) {border-top:1px solid rgba(5,20,31,0.2);border-left:1px solid rgba(5,20,31,0.2)}
.notice .notice_list a {display:block; position:relative; padding:25px; box-sizing:border-box; height: 159px;}
.notice .notice_list a:hover, .notice .notice_list a:focus, .notice .notice_list a:active {background:#ea2627; text-decoration:none}
.notice .notice_list .title {display:block; width:100%; height:50px; font-size:16px; color:#05141f; line-height:1.5; overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding-top:5px;}
.notice .notice_list .date {display:block; padding-top:11.6%; font-size:14px; color:rgba(5,20,31,0.6);}
.notice .notice_list a:hover .title, .notice .notice_list a:focus .title, .notice .notice_list a:active .title,
.notice .notice_list a:hover .date, .notice .notice_list a:focus .date, .notice .notice_list a:active .date,
.notice .notice_list a:hover .ico-status5, .notice .notice_list a:focus .ico-status5, .notice .notice_list a:active .ico-status5{color:#fff;}
.notice .notice_list a:hover:before, .notice .notice_list a:focus:before, .notice .notice_list a:active:before {display:block; position:absolute; right:27px; bottom:29px; height:8px; width:8px; border:1px solid #fff; content:''; border-left-width:0; border-top-width:0; transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); -ms-transform:rotate(-45deg);}
.notice .notice_list a:hover:after, .notice .notice_list a:focus:after, .notice .notice_list a:active:after {display:block; position:absolute; right:27px; bottom:33px; width:24px; height:1px; background:#fff; content:'';}
.notice .notice_list .key{border-radius:4px; color:#fff; background:#4877f9; padding:3px 12px 5px 12px; margin-right:6px;}
.notice .notice_list .urgent{border-radius:4px; color:#fff; background:#fc5356; padding:3px 12px 5px 12px;}
.notice .notice_list .ico-status5:hover{color:#fff;}
.notice .notice_list a:hover .ico-status5, .notice .notice_list a:focus .ico-status5, .notice .notice_list a:active .ico-status5:hover{border:1px solid #fff;}
@media all and (max-width:1400px){
.noticebox {margin:10.5% 10px 0;}
}

@media all and (max-width:1225px){
.noticebox {padding-bottom:100px;}
}

@media all and (max-width:1024px){
.noticebox h2 {font-size:26px;}
.news .news_list .date {font-size:13px;}
.news .news_list .title {height:41px; font-size:16px;}
.news .slick-arrow {top:22%;}
.noticebox .notice {padding-left:3%;}
.notice .notice_list a {padding:15px; height:125px;}
.notice .notice_list .title {height:45px; font-size:14px;}
.notice .notice_list .date {padding-top:8%; font-size:13px;}
.notice .notice_list a:hover:before, .notice .notice_list a:focus:before, .notice .notice_list a:active:before {right:17px; bottom:20px; height:6px; width:6px;}
.notice .notice_list a:hover:after, .notice .notice_list a:focus:after, .notice .notice_list a:active:after {right:17px; bottom:23px; width:18px; }
}

@media all and (max-width:768px){
.notice .notice_list a { height:121px;}
}

@media all and (max-width:767px){
.noticebox {margin:15% auto 0; padding-bottom: 70px}
.noticebox h2 {font-size:20px;}
.kiabox + .noticebox {margin-top:15%;}
.noticebox .news {float:none; width:100%; margin:0; padding-left:15px;}
.news .news_list .date {font-size:12px;}
.news .news_list .title {height:38px; padding:0; font-size:14px;}
.news .news_list .slick-list {padding-right:38%;}
.news .news_list .slick-dots {top:-35px; right:20px}
.news .slick-arrow {display:none !important}
.noticebox .notice {float:none; width:100%; margin:15% 0 0 0; padding:0 15px;}
.notice .notice_list li {float:none; width:100%;}
.notice .notice_list li a {display:table; width:100%; padding:20px 15px;}
.notice .notice_list .title {display:table-cell; padding-right:20px; font-size:13px; vertical-align:middle;}
.notice .notice_list .date {display:table-cell; padding:0; font-size:12px; vertical-align:middle;}
.notice .notice_list a:hover:before, .notice .notice_list a:focus:before, .notice .notice_list a:active:before, .notice .notice_list a:hover:after, .notice .notice_list a:focus:after, .notice .notice_list a:active:after {display:none}
}

@media all and (max-width:540px) {
    .notice .notice_list .title{width:82%;}
    .ico-status5{display:none;}
    .notice .notice_list li:nth-child(2){border-left:none; border-top:1px solid rgba(5,20,31,0.2);}
    .notice .notice_list li:nth-child(4) {border-left:none;}
}

@media all and (max-width:375px) {
    .notice .notice_list li a {padding: 9px 9px;}
    .notice .notice_list .title {width: 75%;}
}



/* 20200814  button style */
.key_visual .cont .view.bgblack {border:1px solid #05141f; background:#05141f; color:#fff; animation-fill-mode: forwards;}
.key_visual .cont .view.bgblack:hover, .key_visual .cont .view.bgblack:focus, .key_visual .cont .view.bgblack:active {background:#05141f; border:1px solid #05141f; color:#fff; -webkit-animation: bgblack 0.3s forwards; -moz-animation: bgblack 0.3s forwards; -ms-animation: bgblack 0.3s forwards; -o-animation: bgblack 0.3s forwards; animation: bgblack 0.3s forwards;}
.key_visual .cont .view.bgblack i:before, .key_visual .cont .view.bgblack i:after {background:#fff; -webkit-animation:}
.key_visual .cont .view.bgblack:hover i:before, .key_visual .cont .view.bgblack:focus i:before, .key_visual .cont .view.bgblack:active i:before, .key_visual .cont .view.bgblack:hover i:after, .key_visual .cont .view.bgblack:focus i:after, .key_visual .cont .view.bgblack:active i:after {background:#fff; bgblacki 0.3s forwards; -moz-animation: bgblacki 0.3s forwards; -ms-animation: bgblacki 0.3s forwards; -o-animation: bgblacki 0.3s forwards; animation: bgblacki 0.3s forwards;}
@keyframes bgblack {50% {background:#fff; border:1px solid #fff; color:#05141f;}}
@keyframes bgblacki {50% {background:#05141f;}}

.key_visual .cont .view.bgwhite {border:1px solid #fff; background:#fff; color:#05141f; animation-fill-mode: forwards;}
.key_visual .cont .view.bgwhite:hover, .key_visual .cont .view.bgwhite:focus, .key_visual .cont .view.bgwhite:active {background:#fff; border:1px solid #fff; color:#05141f; -webkit-animation: bgwhite 0.3s forwards; -moz-animation: bgwhite 0.3s forwards; -ms-animation: bgwhite 0.3s forwards; -o-animation: bgwhite 0.3s forwards; animation: bgwhite 0.3s forwards;}
.key_visual .cont .view.bgwhite i:before, .key_visual .cont .view.bgwhite i:after {background:#05141f; -webkit-animation:}
.key_visual .cont .view.bgwhite:hover i:before, .key_visual .cont .view.bgwhite:focus i:before, .key_visual .cont .view.bgwhite:active i:before, .key_visual .cont .view.bgwhite:hover i:after, .key_visual .cont .view.bgwhite:focus i:after, .key_visual .cont .view.bgwhite:active i:after {background:#05141f; bgwhitei 0.3s forwards; -moz-animation: bgwhitei 0.3s forwards; -ms-animation: bgwhitei 0.3s forwards; -o-animation: bgwhitei 0.3s forwards; animation: bgwhitei 0.3s forwards;}
@keyframes bgwhite {50% {background:#05141f; border:1px solid #05141f; color:#fff;}}
@keyframes bgwhitei {50% {background:#05141f;}}
.key_visual .cont .view.bgred {border:1px solid #bb162b; background:#bb162b; color:#fff; animation-fill-mode: forwards;}
.key_visual .cont .view.bgred:hover, .key_visual .cont .view.bgred:focus, .key_visual .cont .view.bgred:active {background:#bb162b; border:1px solid #bb162b; color:#fff; -webkit-animation: bgred 0.3s forwards; -moz-animation: bgred 0.3s forwards; -ms-animation: bgred 0.3s forwards; -o-animation: bgred 0.3s forwards; animation: bgred 0.3s forwards;}
.key_visual .cont .view.bgred i:before, .key_visual .cont .view.bgred i:after {background:#fff; -webkit-animation:}
.key_visual .cont .view.bgred:hover i:before, .key_visual .cont .view.bgred:focus i:before, .key_visual .cont .view.bgred:active i:before, .key_visual .cont .view.bgred:hover i:after, .key_visual .cont .view.bgred:focus i:after, .key_visual .cont .view.bgred:active i:after {background:#fff; bgredi 0.3s forwards; -moz-animation: bgredi 0.3s forwards; -ms-animation: bgredi 0.3s forwards; -o-animation: bgredi 0.3s forwards; animation: bgredi 0.3s forwards;}
@keyframes bgred {50% {background:#fff; border:1px solid #fff; color:#bb162b;}}
@keyframes bgredi {50% {background:#bb162b;}}



/* 20210617 add */
.key_visual .cont .btn {display:inline-block; margin:0 5px;}
@media all and (max-width:767px){
.key_visual .cont .btn {display:block; margin:7px 0;}
}

/* 에러페이지 */
.error_page{margin-top:50px;}
.error_con{text-align:center;}
.error_con img{margin-top:100px;margin-bottom:50px;text-align:center;}
.error_con p:nth-child(2){font-size:26px; font-weight:500; margin-bottom:30px; color:#da291c;}
.error_con p:nth-child(3){font-size:15px; line-height:1.3;margin-bottom:50px;}
.error_btn{text-align:center; margin-bottom:227px;}
.error_btn a {font-size: 15px;font-weight: 400;background: #54585a;color: #fff;padding: 10px 85px 10px 85px;}

