@charset "utf-8";

@font-face {
    font-family: 'noto';
    src: url('../fonts/notokr-regular.eot');
    src: url('../fonts/notokr-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/notokr-regular.woff2') format('woff2'),
         url('../fonts/notokr-regular.woff') format('woff'),
         url('../fonts/notokr-regular.ttf') format('truetype'),
         url('../fonts/notokr-regular.svg#notokr-regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'notoL';
    src: url('../fonts/notokr-light.eot');
    src: url('../fonts/notokr-light.eot?#iefix') format('embedded-opentype'),
         url('../fonts/notokr-light.woff2') format('woff2'),
         url('../fonts/notokr-light.woff') format('woff'),
         url('../fonts/notokr-light.ttf') format('truetype'),
         url('../fonts/notokr-light.svg#notokr-light') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'notoB';
    src: url('../fonts/notokr-medium.eot');
    src: url('../fonts/notokr-medium.eot?#iefix') format('embedded-opentype'),
         url('../fonts/notokr-medium.woff2') format('woff2'),
         url('../fonts/notokr-medium.woff') format('woff'),
         url('../fonts/notokr-medium.ttf') format('truetype'),
         url('../fonts/notokr-medium.svg#notokr-medium') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* 초기화 */
html {}
body {margin:0;padding:0;font-size:0.75em;font-family: 'noto', sans-serif; width:100%; min-width:1050px; color:#444444;
overflow:hidden; overflow-y: scroll;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family: 'noto', sans-serif }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
ul {margin:0;padding:0;list-style:none}
dl, dd{margin: 0; padding: 0;}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0;padding:0;font-family: 'noto', sans-serif; font-size:1em}
button {cursor:pointer}
textarea, select {font-family: 'noto', sans-serif ;font-size:1em}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
a:link, a:visited {color:#444444;text-decoration:none}
a:hover, a:focus, a:active {color:#444444;text-decoration:none}



/* header */
#header {width: 100%; height: 84px; background: url("../images/header_bg.jpg") top center repeat-x; position: absolute; z-index: 10000; }
#header_wrap {width: 1050px; margin: 0 auto; z-index: 1050; }
#header_wrap h1 {float: left; margin-top: 15px;}
#gnb {float: right; height: 80px;}
#gnb>li {float: left; margin-left: 110px; line-height: 80px;}
#gnb>li>a {font-size: 16px;}
#gnb>li>.subnav {position: absolute; display: none; height: 50px; padding-top: 17px; margin-left: -150px;}
#gnb>li>.subnav02 {margin-left: -288px;}
#gnb>li>.subnav>li {float: left; font-size: 15px; line-height: 1em; padding-left: 15px; margin-left: 10px; 
background: url("../images/subnav_bg.png") 0 center no-repeat;}
#gnb>li>.subnav>li:first-child {background: none;}
#gnb>li>.subnav>li.color {color:#ffe400; font-family: notoB; padding-left: 0; margin-left: 0; background: none;}
#gnb>li>.subnav>li.bgn {background: none;}
#gnb>li>.subnav>li>a {display: block; color:#fff; font-family: noto; }
#gnb>li>.subnav>li>a:hover {color:#fff; font-family: notoB;}
#gnb>li>.subnav02>li:first-child {width: 64px;}


/* mainvisual */
#mainvisual {width: 100%; height: 870px; position: relative; padding-top: 84px;}
.mainvisual {width: 100%; height: 786px; position: relative; }
.mainvisual li {width: 100%; height: 786px; position: absolute; left: 0; top: 0; opacity:0;}
.mainvisual li:first-child {opacity:1; z-index:30;}
.mainvisual li.visual01 {background: url("../images/mainvisual01.jpg") top center no-repeat;}
.mobile_mainvisual li.visual01 {background: url("../images/mainvisual01.jpg") top center no-repeat; z-index: -1;}
.mainvisual li.visual02 {background: url("../images/mainvisual02.jpg") top center no-repeat;}
.mobile_mainvisual li.visual02 {background: url("../images/mainvisual02.jpg") top center no-repeat; z-index: -1;}
.mainvisual li.visual03 {background: url("../images/mainvisual03.jpg") top center no-repeat;}
.mobile_mainvisual li.visual03 {background: url("../images/mainvisual03.jpg") top center no-repeat; z-index: -1;}

.mobile_img {position: absolute; top: 0; left: 50%; margin-left: 200px;}

.mainvisual_btn_sel li {position: absolute; left: 50%;top: 50%; margin-top: -50px; z-index:50;}
.mainvisual_btn_sel li a {display:block;}

.prev {margin-left: -630px;}
.next {margin-left:590px;}


.visual_con {color:#fff; position: absolute; top: 138px; left: 50%; margin-left: -520px;}
.visual_con h3 {font-size: 60px; color:#fff; font-family: notoL; font-weight: normal; padding-bottom: 10px;}
.visual_con h3 > span.bold {font-family: notoB;}
.visual_con span.regular {display: block; font-size: 20px; margin-bottom: 25px;}
.visual_con p {font-size: 15px; margin-bottom: 50px;}
.visual_con p span.color {color:#ffe400; font-family: notoB;}

.visual_btn {width: 210px; height: 65px; border: 1px solid #8e8e8c; background: url("../images/ie8_visaul_bottom.png") 0 0 repeat; text-align: center;
z-index:30; position: absolute;}
.visual_btn a {display: block; font-size: 15px; color:#fff; line-height: 65px;}
.visual_btn a img {margin-left: 4px; margin-top: -1px;}
.visual_btn a span.color {color:#ffe400; font-family: notoB;}

.img_wrap {}

#visual_bottom {width: 100%; position: absolute; bottom: 0; background: url("../images/ie8_visaul_bottom.png") 0 0 repeat; z-index: 100;}
#visual_bottom ul {width: 1050px; height: 210px; margin: 0 auto;}
#visual_bottom ul li {width: 333px; height: 210px; float: left; margin-left: 25px; background: url("../images/ie8_visaul_li.png") 0 0 repeat; padding-top: 25px; transition:0.5s ease}
#visual_bottom ul li:hover {background: url("../images/ie8_visaul_li_hover.png") 0 0 repeat;}
#visual_bottom ul li:first-child {margin-left: 0;}
#visual_bottom ul li span.title {font-family: notoL;color:#fff; font-size: 15px; display: block; padding: 15px;}
#visual_bottom ul li span.title b {font-weight: normal; font-family: notoB;}
#visual_bottom ul li a {float: right;}


/* footer */
#footer {width: 100%; height: 20px; background: #f6f6f6; }
.footer_wrap {width: 1050px; margin: 0 auto; text-align: center;}
.footer_con {height: 20px; line-height: 20px; font-family: noto; color:#666666; font-size: 14px;}
.footer_con span {color:#ef800d; font-family: notoB;}
.footer_div {font-size: 18px;}



/* sub */
#subvisual {width: 100%; height: 184px; border-bottom: 1px solid #dddddd; position: relative; padding-top: 84px; overflow: hidden;}
.subvisual {position: absolute; left: 50%; margin-left: -990px;}

#subcontainer {width: 100%; min-height:384px;}
.subcon {width: 1050px; margin: 0 auto; position: relative;}

.subcontab {width: 536px; margin: 0 auto; margin-top: 30px; height: 50px;}
.subcontab li {float: left; margin-left: 10px; width: 263px; height: 50px; border: 1px solid #fe8303; box-sizing:border-box; text-align: center; line-height: 50px;
background: #fff;}
.subcontab li a {display: block; font-size: 18px; font-family: notoB; color:#fe8303;}
.subcontab li:first-child {margin-left: 0;}
.subcontab li:hover {background: #fe8303; border: 0;}
.subcontab li:hover a {color:#fff;}
.subcontab li.on {background: #fe8303; border: 0;}
.subcontab li.on a {color:#fff;}

#sub_rolling {width: 1050px; height: 366px; position: relative;}
#sub_rolling_img {position: relative; height: 366px; width:1050px; overflow:hidden;}
.sub_rolling_img {position: relative; width:5000px; height: 366px;} 
.sub_rolling_img li {float: left;}

.sub_prev_btn {position: absolute; top: 50%; margin-top: -28px; left: 0; display: block; z-index: 100;}
.sub_next_btn {position: absolute; top: 50%; margin-top: -28px; right: 0; display: block; z-index: 100;}

.submap {position: absolute; top: 28px; left: 0;}
.submap iframe {border: 1px solid #dddddd;}

.notice {border: 1px solid #ccc; border-bottom: 0; color:#666666; margin:50px 0;}
.notice dt {border-bottom: 1px solid #ccc; min-height: 85px; box-sizing:border-box; ; font-size: 20px; font-family: notoL; padding: 20px 0 20px;}
.notice dt span.num {font-family: notoB; padding: 0 35px 0 30px; float: left}
.notice dt p { display: block; padding: 0 20px 0 110px; }
.notice dt span.date {font-size: 15px; float: right; padding-right: 28px;}
.notice dd {display: none; padding: 40px 30px; border-bottom: 1px solid #ccc;}
.notice dd:after {display: block; content: ''; clear: both;}
.notice dd p {font-size: 15px; font-family: notoL; line-height: 1.5em;}
.notice dd p img {padding: 0 25px 15px 0; float: left;}

.mobile_mainvisual { display: none; }






#gnb_mobile { display: none; float: right; margin: 22px 10px 0 0; background: #fff; border: 0; z-index: 1050; }
#gnb_mobile button { background: #fff; border: 0; }
.main-dropdown { position: fixed; top: 0; left: auto; right: 0; width: 220px; height: 100%; right: 0; bottom: 0; background: #fff; z-index: 10000; margin: 0; padding-top: 80px; }
.main-dropdown li { display: block; padding: 4px; }
.main-dropdown li.close-btn { position: absolute; top: 22px; right: 10px; background: none; }
.main-dropdown > li { margin-bottom: 20px; background: #fff; }
.main-dropdown li > ul { padding-left: 40px; }
.mg-auto { margin: 0 auto; }

table td { padding: 10px; }

#ttd { width:480px; height:186px; border-top:2px solid #ff9900; border-bottom:1px solid #c9c9c9; text-align:center; vertical-align: middle; }