@charset "utf-8";
 @import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
 @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

@font-face{
font-family:"Nanum Gothic";
src:url('../font/NanumGothic.eot');
src:url('../font/NanumGothic.eot?#iefix') format('embedded-opentype'),
url('../font/NanumGothic.woff') format('woff'),
url('../font/NanumGothic.ttf') format('truetype');
}

body,div,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,form,fieldset,caption,label,input,textarea,button,select,iframe,object,header,footer,nav,hgroup,section,article,aside{margin:0;padding:0;}
img,a,span,abbr,address,pre,code,del,em,strong,sub,sup{margin:0;padding:0;}

body,textarea{}
body,input,textarea,select,button,table,th,td{font-style:normal; font-variant:normal;  font-family: "Noto Sans KR","맑은 고딕","Malgun Gothic","Nanum Gothic","나눔 고딕",sans-serif;}
body{font-size:14px;color:#444; font-weight:normal;}

input,textarea,select,button {font-size:14px;vertical-align:middle;}
button {background: none repeat scroll 0 0 #FFF; border: medium none;cursor: pointer;font-size: 0; margin: 0;padding: 0;vertical-align: middle;}
legend {margin:0;padding:0;display:none;}

img{border:0 ;vertical-align:middle;}
ul,ol,li,dl,dt,dd{list-style:none;}
a{text-decoration:none;color:#444;}
/*a:hover,a:active,a:focus{color:#28689f;text-decoration:underline;}*/
table {border-collapse:separate;border-collapse: collapse;}
table caption{width:0;height:0;position:absolute;top:-99999px;left:-99999px;overflow:hidden;}
.hidden {
    overflow: hidden;
    position: absolute;
    width: 0;
    height: 0;
	top:-9999px;
	left:-9999px;
    line-height: 0;
    text-indent: -999em;
    margin: 0;
    padding: 0;
    background: none;
    line-height: 0;
    border: none;
}

.blind{width:0;height:0;position:absolute;top:-9999px;left:-9999px;overflow:hidden;}
.clear{clear:both;height:0;}
.clearfix:after{content:"";display:block;height:0;clear:both;visibility:hidden;}

/* 스킵네비게이션 */
#skipNavigation {position:absolute; left:0; top:0; width:100%; z-index:10000;}
#skipNavigation a {display:block; position:absolute; left:0; top:-10px; width:100%; height:1px; margin-bottom:-1px; background:#f2f2f2; font-size:0; text-align:center; font-weight:bold; color:#444;}
#skipNavigation a:hover, #skipNavigation a:focus, #skipNavigation a:active {position:absolute; left:0; top:0; height:20px; padding:4px; font-size:15px;}

/*margin-padding*/
.m-top0{margin-top:0px !important;}
.m-top10{margin-top:10px !important;}
.m-top20{margin-top:20px !important;}
.m-top30{margin-top:30px !important;}
.m-top40{margin-top:40px !important;}
.m-top50{margin-top:50px !important;}
.m-top60{margin-top:60px !important;}
.m-top70{margin-top:70px !important;}
.m-top80{margin-top:80px !important;}
.m-top90{margin-top:90px !important;}

.m-left0{margin-left:0 !important;}
.m-right0{margin-right:0 !important;}
.m-left5{margin-left:5px;}
.m-left10{margin-left:10px !important;}
.m-left20{margin-left:20px !important;}
.m-left25{margin-left:25px !important;}

.p-top0{padding-top:0px !important;}
.p-top10{padding-top:10px;}
.p-top20{padding-top:20px;}
.p-top30{padding-top:30px;}
.p-top40{padding-top:40px;}
.p-top50{padding-top:50px;}
.p-top60{padding-top:60px;}
.p-top70{padding-top:70px;}
.p-top80{padding-top:80px;}
.p-top90{padding-top:90px;}

.p-left0{padding-left:0px !important;}
.p-left10{padding-left:10px;}
/*/margin-padding*/

.left-area{float:left;}
.right-area{float:right;}
.center-area{float:left; margin-left:300px;}

.t-center{text-align:center !important;}
.t-left{text-align:left !important;}
.t-right{text-align:right !important;}



#wrap{ position:relative; }
.sty-col-red{ color:#dd3737; font-weight:bold; }
.sty-col-blu{ color:#2173bf; font-weight:bold; }
/*******************************지우지않는부분*******************************/




/* 디자인변경 210813 */
body {
    min-height: 100vh;
    background: url(/kccnews/images/bg.png)no-repeat;
    background-size: inherit;
}
.dummy {
    display: none;
}

.indicator {
    display: none;
}

p.control {
    display: none;
}

.news-wrap {
    
}

.logo-wrap {
    text-align: center;
    margin:20px 0;
}

.logo-wrap img {
    max-width:200px;
}

.news-wrap .list-box {
    max-width:1023px;
    background-color:#fff;
    padding:35px 20px 15px 20px;
    margin:0 auto;
    overflow: hidden;
    box-shadow: 1px 1px 26px #666;
}

.news-wrap h2 {max-width:530px; margin:45px auto;}

div.image-slide ul.slide > li {display:inline-block; width:50%; box-sizing: border-box; float:left; padding:0 15px; margin-bottom: 20px;}
div.image-slide ul.slide > li p {padding:20px 10px 30px 10px; border-bottom:1px solid #e4e4e4; font-size:20px; color: #333; width:95%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.select-news li form {
    border: 1px solid #eee;
    width: 230px;
    height: 40px;
    border-radius: 20px;
    padding: 0 15px;
    position: relative;
    margin-top: 20px;
}

.select-news li form select {
    border: none;
    margin-top: 9px;
    vertical-align: middle;
    color: #354170;
    font-weight: 700;
    font-size: 16px;
    background-color: transparent;
}

.select-news li form select option {
    color: #354170;
    font-weight: 700;
}

.select-news li form input[type="submit"] {
    width: 48px;
    height: 31px;
    background-color: #333;
    border: none;
    color: #fff;
    border-radius: 15px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}



@media screen and (max-width:1023.9px) {
    .news-wrap {padding-top:51px;}
    .news-wrap h2 {max-width:230px; margin:20px auto;}

    .dummy {
        display: block;
    }
    
    .indicator {
        display: block;
    }
    
    p.control {
        display: block;
    }

    div.image-slide .control > a.prev, div.image-slide .control > a.next {
        position: absolute;
        bottom: -50px;
        transform: translate(0, -50%);
        width: 20px;
    }

    div.image-slide .control > a.prev {
        left: 10px;
    }

    div.image-slide .control > a > img {
        position: relative;
    }

    div.image-slide .control > a.next {
        right: 10px;
    }

    div.image-slide {
        position: relative;
        margin: 50px auto;
        max-width: 800px;
    }
    
    div.image-slide .box {
        position: relative;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }
    
    div.image-slide .dummy {
        opacity: 0;
        padding-bottom: 80px;
    }
    
    div.image-slide ul.slide {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    }
    
    div.image-slide ul.slide > li {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        display: none;
    }

    div.image-slide ul.slide > li p {
        font-size:16px;
    }
    
    div.image-slide ul.slide > li:first-child {
        display: block;
    }

    div.image-slide ul.slide > li a {
        display:block;
    }
    
    div.image-slide .box img {
        width: 100%;
    }
    
    div.image-slide ul.indicator {
        position: absolute;
        left: 0;
        bottom: -28px;
        width: 100%;
        text-align: center;
    }
    
    div.image-slide ul.indicator > li {
        display: inline-block;
        vertical-align: top;
    }
    
    div.image-slide ul.indicator > li + li {
        margin-left: 4px;
    }
    
    div.image-slide ul.indicator > li > a {
        display: inline-block;
        width: 6px;
        height: 6px;
        border: 2px solid #004282;
        border-radius: 40px;
        text-indent: -9999px;
        overflow: hidden;
        transition: all 0.3s;
    }
    
    div.image-slide ul.indicator > li.on > a {
        width: 20px;
        border-color: #004282;
        background-color: #004282;
    }

    
    div.image-slide .control > a > img {
        position: relative;
    }

    .news-wrap .list-box {
        margin:30px 15px 0 15px;
    }

}

@media screen and (max-width:767px) {
    .select-news li form {position: absolute; top:10px; left:50%; transform: translateX(-50%);}
    .select-news li form select {background-color: transparent;}
    .floor1-select {
        position: absolute;
        top: 50px;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
    }

    .floor1-select {
        margin-top: 65px;
        padding: 0 20px;
    }

    .floor1-select ul li.sns-link-first {
        margin:0;
    }


}