@charset "utf-8";
@import url("style.css");
/* * {font-family: 'NanumBarunGothic' } */
.mhid_1024 {display: block; }
.mshow_1024 {display: none;  }

/*  */
.header .content.h_newWrap .selectbox.selectLastMg .txt {height:20px; line-height:20px; border:1px solid #ddd; padding:13px 133px 13px 20px;}
.header .content.h_newWrap .selectbox.selectLastMg .txt:after { content:""; position:absolute; top:0; right:10px; width:28px; height:100%; background:url('../images/common/sel_bg_arr.png') no-repeat 50% 50%; }
.header .content.h_newWrap .selectbox {float: right;margin-top:-40px; }
.hTitles .tit {display: inline-block; padding-bottom: 12px;}
.hTitles .tit + .date {display: inline-block; margin-top: 8px; margin-left: 10px; font-size: 1rem; font-weight: normal; line-height: 1.2; letter-spacing: -0.02em; color: #666666; vertical-align: top;}
.hTitles .tit + .date .date2 {display: block; margin-top: 5px; font-size: 1.25rem; font-weight: bold; color: #333;}

/* VISUAL */
.vis-wrap {width: 100%; /*height: 510px;*/ background-color: #fff; }
.vis-wrap .slide { position:relative; z-index:10; background-repeat:no-repeat; background-position: center center; height:100%;  }
.vis-wrap .slide.vis1 {/*background-image:url('../images/main/visual.jpg');*/background-color: #eefaff;}
.vis-wrap .slide.vis2 {background-image:url('../images/main/visual2.jpg'); background-color: #97b58c;}
.vis-wrap .slide .content {max-width: 1000px; height: 100%; margin: 0 auto; }


/* mainNavi */
.mainNavi { background-color:#00b6c2; height:80px; }
.mainNavi .nav { display:table; table-layout:fixed; max-width:1000px; width:100%; margin:0 auto; *overflow:hidden; }
.mainNavi .nav > li { display:table-cell; height:80px; vertical-align:middle; text-align:center; *float:left; *width:20%; }
.mainNavi .nav > li a { display:block; position: relative; color:#fff; font-size: 1.188rem; height:100%; line-height: 80px; background:url('../images/common/gnb_arr.png') no-repeat 50% 200%; -webkit-transition: background-position 0.2s; -moz-transition: background-position 0.2s; -ms-transition: background-position 0.2s; transition: background-position 0.2s; }
.mainNavi .nav > li a:before {content: ""; position: absolute; top: 50%; left: 0; width: 1px; height: 23px; background-color: #fff; transform: translateY(-50%);}
.mainNavi .nav > li:first-child a:before {display: none; }
.header .mainNavi .nav > li a.on,
.header .mainNavi .nav > li a:hover { background-position:50% 100%; }
.mainNavi .nav .sn { display:none; }



/* MAIN CONTENT */
.mcontent {padding: 1.875rem 0; background-color: #f0f0f0; }

.mcontent .inner {margin: 0 auto; max-width: 1000px;}
.mcontent .section {}
.mcontent .section .article {float: left; width: 48%; margin-right: 3%; }
.mcontent .section .article:last-child {margin-right: 0; }
.mcontent .section .article .txt_box {position: relative; padding: 1.875rem; background-color: #fff; }
.mcontent .section .article .txt_box h4 {font-size: 1.25rem; color: #444; line-height: 1.4;}
/* .mcontent .section .article .txt_box h4 em {font-size: 1.375rem; } */
.mcontent .section .article .txt_box .label {display: block; margin-bottom: 8px; font-size: 1.063rem; font-weight: normal;}
.mcontent .section .article .txt_box .more_btn {position: absolute; right: 1.875rem; bottom: 0; color: #666; font-weight: bold;}
.mcontent .section .article .txt_box .more_btn:after {content: ""; display: inline-block; width: 20px; height: 32px; margin-left: 5px; vertical-align: -25px; background: url('../images/main/more_btn.png') no-repeat;}
.mcontent .sec1 {margin-bottom: 3%; }
.mcontent .sec1 h3 {padding: 1.25rem 0 0.625rem; font-size: 1.625rem; color: #222;}

.mcontent .sec2 {margin-bottom: 0; color: #fff; }
.mcontent .sec2 a {display: block; width: 100%; height: 100%; }
.mcontent .sec2 .guide {height: 215px; min-height: 215px; padding: 1.875rem; background: #009c92 url('../images/main/m_img3.png') no-repeat right center;}
.mcontent .sec2 .notice {height: 215px; min-height: 215px; padding: 1.875rem; background: #508fdd url('../images/main/m_img4.png') no-repeat right center;}
.mcontent .sec2 h3 {font-size: 1.625rem;}
.mcontent .sec2 p {padding: 15px 0; font-size: 1.063rem;}
.mcontent .sec2 h4 {font-size: 1.375rem; line-height: 1.875rem; }
.mcontent .sec2 h4 .stit {font-size: 1rem; }

@media all and (max-width:1204px) {
    .mhid_1024 {display: none; }
    .mshow_1024 {display: block;  }
}

@media all and (min-width: 1024px) and (max-width:1200px) {

}

/* tablet */
@media all and (min-width:768px) and (max-width:1023px) {
    html, body {font-size: 15px; }
    .hTitles .tit + .date {margin-top: 5px; margin-left: 10px; font-size: 12px; line-height: 1.4;}
    .hTitles .tit + .date .date2 {font-size: 15px; }
    .vis-wrap .slide { background-position: center -23px; }
    .vis-wrap .slide .content {max-width: 750px; margin: 0 auto;}
    .mcontent .inner {padding-left: 10px; padding-right: 10px;}
    .mcontent .section .article .txt_box {height: 8.75rem; }
    .mcontent .sec2 .guide {height: 17.5rem; min-height: 17.5rem; background-position: right bottom; }
    .mcontent .sec2 .notice {height: 17.5rem; min-height: 17.5rem; background-position: right bottom; }
}

/* mobile */
@media all and (max-width:767px) {
    html, body {font-size: 14px; }
    .hTitles .tit + .date {display: none; }
    .vis-wrap .slide.vis1 {background: none;}
    .vis-wrap .slide.vis2 {background: none;}

    /* .mcontent {padding: 30px 20px; }
    .mcontent .inner {max-width: 100%;} */
    .mcontent * { font-family: 'NanumBarunGothic', sans-serif;}
    .mcontent {padding: 1.875rem 1.25rem; }
    .mcontent .section .article {float: none; width: 100%; margin-bottom: 3%; }
    .mcontent .section .article:last-child {margin-bottom: 0;}
    .mcontent .section .article img {width: 100%; max-width: 100%;}
    .mcontent .sec1  h3 {padding: 0.7143rem 0 1.429rem; text-align: center;}
    .mcontent .sec2 .guide {margin-top: 5%;}
    .mcontent .sec2 .notice {margin-top: 5%;}
    .mcontent .section .article .txt_box .more_btn {right: 30px; bottom: 0; top: auto;}
    /* .mcontent .section .article .txt_box {height: 140px;}
    .mcontent .section .article .txt_box h4 {font-size: 22px;}
    .mcontent .section .article .txt_box .label {margin-bottom: 5px; font-size: 17px;}

    .mcontent .sec1 {margin-bottom: 3%; }
    .mcontent .sec1  h3 {padding: 10px 0 20px; font-size: 26px; text-align: center;}

    .mcontent .sec2 .guide {height: 215px; min-height: 215px; }
    .mcontent .sec2 .notice {height: 215px; min-height: 215px;}
    .mcontent .sec2 h3 {font-size: 26px;}
    .mcontent .sec2 p {padding: 15px 0; font-size: 17px;}
    .mcontent .sec2 h4 {font-size: 22px;} */
}

@media all and (max-width: 475px) {
    html, body {font-size: 12px; }
    .mcontent .section .article .txt_box {height: 9.286rem; min-height: 9.286rem;  }
    .mcontent .sec2 .guide {background-size: 35% auto; background-position: right bottom;}
    .mcontent .sec2 .notice {background-size: 35% auto; background-position: right bottom;}
}