@charset "utf-8";

@font-face { font-family: 's-core-dream'; font-weight: 200; src: url('/css/font/scdream2.woff');  src: local(※), url('/css/font/scdream2.woff2') format('woff'); }
@font-face { font-family: 's-core-dream'; font-weight: 400; src: url('/css/font/scdream4.woff');  src: local(※), url('/css/font/scdream4.woff2') format('woff'); }
@font-face { font-family: 's-core-dream'; font-weight: 500; src: url('/css/font/scdream5.woff');  src: local(※), url('/css/font/scdream5.woff2') format('woff'); }
@font-face { font-family: 's-core-dream'; font-weight: 600; src: url('/css/font/scdream7.woff');  src: local(※), url('/css/font/scdream7.woff2') format('woff'); }
@font-face { font-family: 's-core-dream'; font-weight: 700; src: url('/css/font/scdream9.woff');  src: local(※), url('/css/font/scdream9.woff2') format('woff'); }

@font-face { font-family: 'jalnan'; font-style: normal; font-weight: 300; src: url('/css/font/JalnanOTF00.woff');  src: local(※), url('/css/font/JalnanOTF00.woff') format('woff'); }

@font-face {
    font-family: 'NanumBarunGothic';
    font-weight: 200;
    src: url(/css/font/NanumBarunGothicUltraLightSubset.eot);
    src: url(/css/font/NanumBarunGothicUltraLightSubset.eot?#iefix) format('embedded-opentype'),
    url(/css/font/NanumBarunGothicUltraLightSubset.woff2) format('woff2'),
    url(/css/font/NanumBarunGothicUltraLightSubset.woff) format('woff'),
    url(/css/font/NanumBarunGothicUltraLightSubset.ttf) format('truetype');
}
@font-face {
    font-family: 'NanumBarunGothic';
    font-weight: 300;
    src: url(/css/font/NanumBarunGothicLightSubset.eot);
    src: url(/css/font/NanumBarunGothicLightSubset.eot?#iefix) format('embedded-opentype'),
    url(/css/font/NanumBarunGothicLightSubset.woff2) format('woff2'),
    url(/css/font/NanumBarunGothicLightSubset.woff) format('woff'),
    url(/css/font/NanumBarunGothicLightSubset.ttf) format('truetype');
}
@font-face {
    font-family: 'NanumBarunGothic';
    font-weight: 400;
    src: url(/css/font/NanumBarunGothicSubset.eot);
    src: url(/css/font/NanumBarunGothicSubset.eot?#iefix) format('embedded-opentype'),
    url(/css/font/NanumBarunGothicSubset.woff2) format('woff2'),
    url(/css/font/NanumBarunGothicSubset.woff) format('woff'),
    url(/css/font/NanumBarunGothicSubset.ttf) format('truetype');
}
@font-face {
    font-family: 'NanumBarunGothic';
    font-weight: 700;
    src: url(/css/font/NanumBarunGothicBoldSubset.eot);
    src: url(/css/font/NanumBarunGothicBoldSubset.eot?#iefix) format('embedded-opentype'),
    url(/css/font/NanumBarunGothicBoldSubset.woff2) format('woff2'),
    url(/css/font/NanumBarunGothicBoldSubset.woff) format('woff'),
    url(/css/font/NanumBarunGothicBoldSubset.ttf) format('truetype');
}

/*** common ***/
.fl    { float:left !important; }
.fr    { float:right !important; }
.fn    { float:none !important; }
.cb    { clear:both !important; }
.pr    { position:relative !important}
.ac    { text-align:center !important; }
.al    { text-align:left !important; }
.ar    { text-align:right !important; }
.vt    { vertical-align:top !important; }
.vm    { vertical-align:middle !important; }
.vb    { vertical-align:bottom !important; }
.jf    { text-align:justify !important; }
.oh    { overflow:hidden !important; }
.oh_y  { overflow-y:hidden !important;}
.cp    { cursor:pointer !important; }
.di    { display:inline !important; }
.dib   { display:inline-block !important; }
.dn    { display:none !important; }
.db    { display:block !important; }
.vv    { visibility:visible !important; }
.vh    { visibility:hidden !important; }
.bn    { border:none !important; }
.bbn   { border-bottom:none !important; }
.brn   { border-right:none !important; }
.bgn   { background:none !important; }
.fb    { font-weight:bold !important; }
.BDB   { border-bottom:2px solid #d1d1d1 !important}
.zoom1 { *zoom:1 }

/* Margin */
.MN0 { margin:0 !important; }
.ML2 { margin-left:2px !important; }
.ML4 { margin-left:4px !important; }
.ML5 { margin-left:5px !important; }
.ML8 { margin-left:8px !important; }
.ML10 { margin-left:10px !important; }
.ML15 { margin-left:15px !important; }
.ML20 { margin-left:20px !important; }
.ML24 {margin-left:24px}
.ML30 { margin-left:30px; }
.ML50 { margin-left:50px !important; }
.ML57 { margin-left:57px; }
.ML80 { margin-left:80px; }
.ML120 { margin-left:120px; }
.ML200 { margin-left:200px; }
.ML213 { margin-left:213px; }
.ML293 { margin-left:293px; }
.MR5 {margin-right:5px}
.MR10 { margin-right:10px; }
.MR15 { margin-right:15px; }
.MR16 { margin-right:16px; }
.MR20 { margin-right:20px; }
.MR30 { margin-right:30px; }
.MR37 { margin-right:37px; }
.MR40 { margin-right:40px; }
.MR60 { margin-right:60px; }
.MR72 { margin-right:72px; }
.MT2 { margin-top:2px !important; }
.MT4 { margin-top:4px !important; }
.MT5 { margin-top:5px !important; }
.MT7 { margin-top:7px !important; }
.MT10 { margin-top:10px !important; }
.MT15 { margin-top:15px; }
.MT20 { margin-top:20px !important; }
.MT22 { margin-top:22px; }
.MT25 { margin-top:25px; }
.MT28 { margin-top:28px; }
.MT30 { margin-top:30px !important; }
.MT35 { margin-top:35px !important; }
.MT40 { margin-top:40px !important; }
.MT45 {margin-top:45px !important}
.MT50 { margin-top:50px; }
.MT55 { margin-top:55px; }
.MT60 { margin-top:60px !important; }
.MT65 { margin-top:65px !important; }
.MT70 { margin-top:70px; }
.MT80 { margin-top:80px !important; }
.MT120 { margin-top:120px; }
.MT267 {margin-top:267px !important}
.MB0 { margin-bottom:0 !important}
.MB5 { margin-bottom:5px; }
.MB10 { margin-bottom:10px !important; }
.MB12 {margin-bottom:12px !important}
.MB15 { margin-bottom:15px; }
.MB20 { margin-bottom:20px !important; ; }
.MB26 { margin-bottom:26px !important; ; }
.MB30 { margin-bottom:30px !important; }
.MB40 { margin-bottom:40px !important; }
.MB50 {margin-bottom:50px}
.MB55 { margin-bottom:55px; }
.MB60 { margin-bottom:60px; }
.MB70 {margin-bottom:70px !important}
.MB180 {margin-bottom:180px !important}
.MT10MB100 {margin:10px 0 100px 0;}
.minusT40 {margin-top:-40px}

/* padding_top */
.PN0 {padding:0 !important}
.PT0 {padding-top:0 !important}
.PT5 { padding-top:5px !important;}
.PT7 { padding-top:7px;}
.PT10 { padding-top:10px;}
.PT12 { padding-top:12px;}
.PT15 { padding-top:15px;}
.PT20 { padding-top:20px !important;}
.PT25 { padding-top:25px;}
.PT27 { padding-top:27px;}
.PT30 { padding-top:30px;}
.PT37 { padding-top:37px;}
.PT38 { padding-top:38px;}
.PT43 { padding-top:43px;}
.PT40 { padding-top:40px !important;}
.PT50 { padding-top:50px !important;}
.PT65 { padding-top:65px !important;}
.PT75 { padding-top:75px;}

/* padding_left */
.PL0 { padding-left:0px !important;}
.PL3 { padding-left:3px;}
.PL5 { padding-left:5px;}
.PL8 { padding-left:8px;}
.PL10 { padding-left:10px;}
.PL20 { padding-left:20px !important;}
.PL23 { padding-left:23px;}
.PL25 { padding-left:25px;}
.PL30 { padding-left:30px;}
.PL40{ padding-left:40px;}
.PL45{ padding-left:45px;}
.PL50{ padding-left:50px;}
.PL55{ padding-left:55px;}
.PL60 { padding-left:60px;}
.PL65 { padding-left:6px;}
.PL100 { padding-left:100px;}

/* padding_right */
.PR6 { padding-right:6px;}
.PR10 { padding-right:10px;}
.PR20 { padding-right:20px;}
.PR35 { padding-right:35px;}
.PR40 { padding-right:40px;}
.PR60 { padding-right:60px;}
.PR72 { padding-right:72px;}

/* padding_bottom */
.PB0 {padding-bottom:0 !important}
.PB10 { padding-bottom:10px;}
.PB13 { padding-bottom:13px;}
.PB15 { padding-bottom:15px !important}
.PB20 { padding-bottom:20px !important;}
.PB23 { padding-bottom:23px !important;}
.PB30 { padding-bottom:30px !important;}
.PB40 { padding-bottom:40px;}
.PB50 {padding-bottom:50px }
.PB65 { padding-bottom:65px;}
.PB70 { padding-bottom:70px;}
.PB110 { padding-bottom:110px;}

/* padding_all */
.PT10L5 { padding:10px 0 0 5px !important;}
.PTB10 {padding:10px 0 !important;}
.PTBL {padding:20px 0 20px 20px !important;}



::-webkit-scrollbar {width: 20px; height: 12px;  }
::-webkit-scrollbarno-button:start:decrement{display: block; width: 20px;height: 12px;
    background: rgba(46,136,204,0.3); border-radius: 5px;}
::-webkit-scrollbar-track {  background: rgba(46,136,204,0.3); border-radius: 3px;}
::-webkit-scrollbar-thumb {  background: rgb(108,173,222); border-radius:5px;}



/* Reset */
* {outline:0 !important;}
html,body,h1,h2,h3,h4,h5,h6,div,p,blockquote,pre,code,address,ul,ol,li,menu,nav,section,article,aside,
dl,dt,dd,table,thead,tbody,tfoot,label,caption,th,td,form,fieldset,legend,hr,input,button,textarea,object,figure,figcaption {margin:0;padding:0; font-family: 's-core-dream', 'NanumBarunGothic', 'Malgun Gothic', '맑은 고딕','arial','sans-serif';}
html, body{width:2160px;}
body{width:2160px; background:#fff;}
body,input,select,textarea,button {border:none;font-size:12px; font-family:'s-core-dream', sans-serif;color:#000;}
ul,ol,li{list-style:none;}
table{width:100%;border-spacing:0;border-collapse:collapse;}
img,fieldset{border:0;}
address,cite,code,em{font-style:normal;font-weight:normal;}
label,img,input,select,textarea,button{vertical-align:middle; margin: 0;
    padding: 0; -webkit-text-size-adjust: none;}
.hide,caption,legend{line-height:0;font-size:0px;overflow:hidden;}
hr{display:none;}
main,header,section,nav,footer,aside,article,figure{display:block;}
a{color:#000;text-decoration:none;}

.clear {clear:both;}
.clear:after { content:""; display:block; clear:both;}

/* ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== ==== */


#Wrap{width:2160px; height:3840px; position: relative; margin:0; padding:0; overflow:hidden;}
.main{background: url(../images/main/bg_main.jpg) no-repeat;}
.sub{background: url(../images/common/bg_sub.jpg) no-repeat;}

header{width: 2160px; height: 600px; position: relative;}
.today_area{position: absolute; top: 140px; left: 120px; width: 550px; }
.today_area .date{font-size: 90px; font-weight: 400; line-height: 1;}
.today_area .time{font-size: 200px; font-weight: 500; line-height: 1.2}
.today_area .time span{font-size: 80px;font-weight: 400}

.visual_title{margin: 400px 0px 0 360px;}

.main_gnb{width: 1488px; margin: 100px auto 0; position: relative; text-align: center;}
.main_gnb ul{text-align: center;}
.main_gnb ul li{display: inline-block; margin-bottom: 80px;}
.main_gnb li:nth-child(odd) {margin-right: 80px;}

.main_logo{position: absolute; bottom: 450px; left: 50%; transform: translateX(-50%);}

section{width: 2160px; height: 2490px; position: relative; padding: 100px 145px 75px; box-sizing: border-box;}
.sub_title{text-align: right; font-size: 100px; color: #000; font-family: 'jalnan'; margin-right: 50px;}

.container_area{ width: 100%; height: 2146px; background: #fff; border-radius: 50px; border: 15px solid #009797; padding: 50px; box-sizing: border-box; position: relative; text-align: center;}

.sub03_swiper { position: relative; width:100%; height:1900px; overflow:hidden; text-align: center; }
.sub04_swiper { position: relative; width:100%; height:1500px; overflow:hidden; text-align: center; margin-top:80px ;}
.sub04_3_swiper { position: relative; width:100%; height:1400px; overflow:hidden; text-align: center; margin-top:80px ;}


.home{position: absolute; bottom: 50px; left: -158px;}
.back{position: absolute; bottom: 50px; right: -158px;}
.colgroup{width: 1770px; height: 2010px; padding: 50px; box-sizing: border-box; overflow-y: auto; background: #fff;}


.sub_tab{display: flex; overflow: hidden;
    border-radius: 30px; border: 10px solid #009797; box-shadow: 0 8px 16px 0 rgb(35 0 104 / 16%); height: 150px; position: absolute; bottom: -80px; background: #fff; width: 1750px; box-sizing: border-box;}
.sub_tab a{flex:1; display:flex; justify-content:center; align-items:center; text-align:center; font-size:50px; color:#009797; border-style:solid; border-color:#009797; font-family: 'jalnan';}
.sub_tab a:not(:last-child){border-width:0 10px 0 0;}
.sub_tab a:last-child{border-width:0}
.sub_tab a.active{background:#009797; color:#fff; font-weight:600;}

.sub04_btn{text-align: center;}

nav.btn{width: 2160px; height: 500px; background: url(../images/common/bg_gnb.jpg) no-repeat;}
nav.btn ul{text-align: center;}
nav.btn ul li{display: inline-block; margin-right: 35px; margin-top: 20px;}
nav.btn ul li:last-child{margin-right: 0}

footer{width: 2160px; height: 250px; background: #fff; position: relative;}
footer span{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)}



/* sub03 추가*/
span.none { display: table; width:100%; margin-top: 950px; vertical-align: middle; text-align: center;
    font-size: 80px;font-weight: 600; color: #028383; }

/* sub03_detail 추가*/
.sub03_span { position: relative; width:100%; height:84px;  text-align: center; margin: -10px 0 40px 0; padding: 0;}
.size_ctrl { font-size: 60px; font-weight: 600; color: #000; text-align: center; margin-bottom: 0px; position: relative; white-space: nowrap; }
.size_ctrl span.sub_sp {position: relative; display: inline-block; font-family: 'jalnan'; z-index: 1; }
.size_ctrl span.sub_sp:before{width: 100%; height: 50px; background: #fff1be; content: ''; position: absolute; bottom: 0; z-index: -1;
    padding: 0 20px; text-align: center; left: -20px; border-radius: 30px;}

.swiper-slide:after {display:inline-block; height:100%; content:""; vertical-align:middle;}
.swiper-slide img{vertical-align:middle;}


/* sub04_1 추가 */
ul.gallery {width:1740px; height: 1850px; position: relative; overflow-y: auto; overflow-x: hidden; text-align: center; margin-top: 50px; }
ul.gallery li {width:500px; height: 500px; position: relative; float: left; margin: 50px 35px; border: 4px solid #ddf0f4; background-color: #fffff6; border-radius: 40px;}
ul.gallery li img {width:500px; height: 400px; margin: 0; padding: 0; border-radius: 40px 40px 0 0;}
ul.gallery li span { display:inline-block; width:450px; height: 100px; margin: 0 25px;
    font-size: 40px; font-weight: 700; text-align: center; line-height: 95px; color: rgb(96 100 100);
    text-overflow: ellipsis; overflow: hidden; white-space: normal; }

nav ul.pagination li { display: inline-block !important; width: 90px; height: 90px; line-height:90px; margin: 0 10px;
    font-size: 40px; font-weight: 400; background:rgb(90 197 177); border-radius: 20px;
    box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; /*#27*/}
nav ul.pagination li.active { font-size: 45px; font-weight: 600; color: #a8a8a8; background: #00AE68;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset; /*#25*/  }
nav ul.pagination li a{ color: white; }

.btn_close { position:absolute; top:-80px; left:900px;}

/* sub04_2 추가 */
.flex-parent { z-index:99999; position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 500px; }
.input-flex-container { display: flex; justify-content: space-around; align-items: center; width: 1500px; height: 100px; position: relative; z-index: 0; }

.input { width: 40px; height: 40px; background-color: #2C3E50; position: relative; border-radius: 50%; }
.input:hover { cursor: pointer; }
.input::before, .input::after { content: ""; display: block; position: absolute; z-index: -1; top: 50%; transform: translateY(-50%); background-color: #2C3E50; width: 160px; height: 8px; }
.input::before { left: calc(-6vw + 12.5px); }
.input::after { right: calc(-6vw + 12.5px); }
.input.active { background-color: #2C3E50; }
.input.active::before { background-color: #2C3E50; }
.input.active::after { background-color: #A5C9CA; }
.input.active span { font-weight: 700; }
.input.active span::before { font-size: 35px; }
.input.active span::after { font-size: 35px; }
.input.active ~ .input, .input.active ~ .input::before, .input.active ~ .input::after { background-color: #A5C9CA; }

.input span { width: 1px; height: 1px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); visibility: hidden; }
.input span::before, .input span::after {visibility: visible; position: absolute; left: 50%;}
.input span::after { content: attr(data-year); top: 25px; transform: translateX(-45%); font-size: 30px; width: 170px;}
.input span::before { content: attr(data-info); top: -65px; width: 170px; transform: translateX(-5px) rotateZ(-45deg); font-size: 30px; text-indent: -10px; }

#green_bg { position:absolute; width: 1843px; height: 300px; background-color: #E7F6F2; top: 2030px; left: 159px; }
#green_bg .arrow-next { position: relative; left: 1640px; top: 95px; width: 50px; height: 50px; border-top: 10px solid #A5C9CA; border-right: 10px solid #A5C9CA; transform: rotate(45deg); }