
html, body {
    height: 100%;
}
html {
    font-size: 14px;
}
body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    min-width: 600px;
    background: #FFFFFF;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 14px;
    line-height: 0.9em;
    color: rgba(0, 0, 0, 0.87);
}
img{
	padding:0;
	margin:0;
	border:0;
	display:block;
}

p {
    margin: 0 0 1em;
    line-height: 1.4285em;
}
p:first-child {
    margin-top: 0;
}
p:last-child {
    margin-bottom: 0;
}
a {
    color: #ffffff;
    text-decoration: none;
}
a:hover {
    color: #ffffff;
    text-decoration: none;
}


#content_landing {
    width: 100%;
    position: static;
    z-index: 1;
}

.container {display:initial; display:inline;}
.gnb { position: relative; z-index: 100; width: 100%; }
.logo{float:left; padding:20px 30px;}
.menu{float: left; width: 70%; position: absolute; padding-left:50%; margin-left: -17.5%; padding-top: 30px;}
.menu ul{float:left; height: 100%;}
.menu ul li{float: left; color: #ffffff; padding: 15px 0; text-align: center; font-size: 23px; list-style: none;}
.menu ul li a{text-decoration:none; color:#ffffff; margin-left: 50px}
.menu ul li a.active,
.menu ul li a:hover{text-decoration:none;color:#fcee4d;}

#scroll_gnb {margin-top: 0 !important; opacity: 0.9; animation: fadein 1s; -moz-animation : fadein 1s; -webkit-animation : fadein 1s; -o-animation: fadein 1s; background-color :#444444; text-align:center; padding-bottom:30px;}

#scroll_gnb ul.scroll_ul li a.active,
#scroll_gnb ul.scroll_ul li a:hover{text-decoration:none; color:#fcee4d;}

.menu.menu_scroll{padding-left:0;margin-left:0; float:none;}
.menu.menu_scroll ul{font-size:0; float:none;}
.menu.menu_scroll ul li{float:none;display:inline-block;}
.menu_scroll{float:left; width:100%;}
.scroll_logo {position:absolute; left:30px; top:20px;}
.scroll_intra {position:absolute; right:0px; top:20px; text-align:right; padding: 27px; margin-right:40px;}
.scroll_intra a {font-size: 1.5em;}
.scroll_intra a.active,
.scroll_intra a:hover{text-decoration:none; color:#fcee4d;}

.main_slide{width: 100%; height: 100%;}
.banner {width: 100%; height: 620px; text-align: center; background-color:#ffffff;
    border: 1px solid green;}
.wrapper{     top: 15%;
    height: 428px;
    width: 1040px;
    position: relative;
    /* margin-top: -215px; */
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 270px 270px 270px 270px;
    grid-template-columns: repeat(4, 270px);
    grid-auto-rows: 194px;
       }

.item1{-ms-grid-column: 1; grid-column: 1; }
.item2{-ms-grid-column: 2; grid-column: 2; }
.item3{-ms-grid-column: 3; grid-column: 3; }
.item4{-ms-grid-column: 4; grid-column: 4; }
.item5{padding-top:40px;  -ms-grid-column: 1; grid-column: 1; -ms-grid-row: 2; grid-row: 2;}
.item6{padding-top:40px;  -ms-grid-column: 2; grid-column: 2; -ms-grid-row: 2; grid-row: 2;}
.item7{padding-top:40px;  -ms-grid-column: 3; grid-column: 3; -ms-grid-row: 2; grid-row: 2;}
.item8{padding-top:40px;  -ms-grid-column: 4; grid-column: 4; -ms-grid-row: 2; grid-row: 2;}

.main_title{ width: 100%; height: 330px; display: block;  background-color:#b70336; text-align: center; }
.in_div{display: inline-block; height: 100%;}
.main_title_img{margin: 83px auto 9px;}
.backstretch-item {height: 1000px !important; overflow: hidden;}

.intra {float: right;  width: 20%; z-index:10000; position:absolute; right:0;}
.intra a { }
.intra img { float: right; width: 260px; height:300px; display: block;}

#news_title ul{float:left; height: 100%;}
#news_title ul > li{float: left; text-decoration:none;  padding: 27px 44px 0; text-align: center; font-size: 1.8em; list-style: none;}

#news_title ul.board_notice > li:hover > a,
#news_title ul.board_notice > li:focus > a,
#news_title ul.board_notice > li:active > a,
#news_title ul.board_notice > li.active >a{text-decoration:none; color:#fcee4d;}



#news_contents {width: 100%; height:620px; background-color:#ffffff; text-align: center;}
#news_contents .news_wrapper{ top: 13%; height: 428px; width: 1040px; position: relative;
    display: -ms-grid; display: grid;
    -ms-grid-columns: 360px 360px 360px; grid-template-columns: repeat(3, 360px); grid-auto-rows: 210px;}
#news_contents .item{width: 360px; text-align: center; vertical-align: middle; display: block;}
#news_contents .item1{-ms-grid-column: 1; grid-column: 1; }
#news_contents .item2{-ms-grid-column: 2; grid-column: 2; }
#news_contents .item3{-ms-grid-column: 3; grid-column: 3; }
#news_contents .item4{padding-top:40px;  -ms-grid-column: 1; grid-column: 1; -ms-grid-row: 2; grid-row: 2;}
#news_contents .item5{padding-top:40px;  -ms-grid-column: 2; grid-column: 2; -ms-grid-row: 2; grid-row: 2;}
#news_contents .item6{padding-top:40px;  -ms-grid-column: 3; grid-column: 3; -ms-grid-row: 2; grid-row: 2;}
#news_contents .back_black {width:320px; height:210px; background-color:#000000; opacity:0;}
#news_contents .back_black:hover{opacity:0.6; text-align:center; color:#ffffff;}
#news_contents span.over_text {display: inline-block; width: 280px; font-size: 1.3em;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    margin-top: 30%; height: 35px; padding: 3px;}


#identity_div {position: relative; top: 10%;}
.identity_img img {margin: auto !important; background-image: url('/../../images/logo.png');}
.main_title_contact{ width: 100%; height: 280px; display: block; background-image : url('/../../images/contents03_bg.png');
    background-size: 150%; background-position: 48% 0;     text-align: center;}
.contact_contents {width: 100%; height:492px; background-color:#ffffff; }
.contact_map{width: 50%; float: left;}
.contact_map .root_daum_roughmap {float:right; margin: 57px 0;}
.contact_info{width: 50%; float:right;}
.contact_info img {margin: 120px 160px;}

footer { width: 100%; height: 190px; color: white; background-color: #e5e5e5; border-top: 1px solid #eeeeee; text-align: center;}
.footer_left{ width: 100%; text-align: center;}
.footer_left > div {    vertical-align: middle;  padding-top: 64px;}
.footer_left p, .footer_left a {color: #777; margin: 5px; font-size: 1.1em; font-weight: bold; line-height:26px;}
.footer_left img {float: right; margin: 80px 113px;}
.footer_right{float: right;; width: 50%;}

#modalLayer{display:none; position:relative;}
#modalLayer .modalContent{width:1000px; height: 800px; overflow-y: scroll;  padding:20px; border:1px solid #ccc; position:fixed; left:50%; top:50%; z-index:10000; background:#fff; text-align: center;}
#modalLayer .modalContent a{position:absolute; right:0; top:0; cursor:pointer; border:none; margin-top:15px; margin-top: 35px; margin-right: 20px;}
#modalLayer h2 { margin-bottom: 50px; text-align: left; font-size: 1.8em; width: 895px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; height: 40px; padding: 8px;}
#modalLayer img {margin:auto;}
#mask {
  position:absolute;
  left:0;
  top:0;
  z-index:9000;
  background-color:#000;
  display:none;
}

.backstretch{position: absolute !important;}

#test {
    animation: fadein 2s;
    -moz-animation: fadein 2s; /* Firefox */
    -webkit-animation: fadein 2s; /* Safari and Chrome */
    -o-animation: fadein 2s; /* Opera */
}
@keyframes fadein {
    from { opacity:0;}
    to { opacity:1; }
}
@-moz-keyframes fadein { /* Firefox */
    from { opacity:0;}
    to { opacity:1;}
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from { opacity:0;}
    to { opacity:1; }
}
@-o-keyframes fadein { /* Opera */
    from { opacity:0;}
    to { opacity: 1;}
}
