@charset "utf-8";
/* CSS Document */
/*센터 레이어 팝업-s*/
#popup_layer_center{display:block;position:fixed;width:100%;height:100%;background:#000000a1;text-align:center;padding:170px 30px 0;z-index:10000000000;overflow-y:scroll}
#popup_layer_center span.popup-img{max-width:/*1200*/1365px;display:inline-block;font-size:0;background:#fff}
#popup_layer_center span.popup-img .popup-img01,
#popup_layer_center span.popup-img .popup-img02,
#popup_layer_center span.popup-img .popup-img03{display:inline-block;vertical-align:top}
#popup_layer_center span.popup-img img{max-width:600px;width:100%}
#popup_layer_center a,
#popup_layer_center label{color:white}
#popup_layer_center span{}
#popup_layer_center .popup-bottom{display:flex;justify-content:space-around;background:rgba(0,0,0,.6);text-align:left;padding:10px 0;font-size:1rem}
#popup_layer_center .popup-bottom label{width:69%;text-align:center}
#popup_layer_center .popup-bottom label input{}
#popup_layer_center .popup-bottom .popup-close{width:29%;text-align:center;border-left:1px solid #ddd}
#popup_layer_center .popup-bottom .popup-close a{display:block}
@media only screen and (max-width:1280px){
	#popup_layer_center{padding:170px 30px 100px}
	#popup_layer_center span{margin-bottom:30px}
}
@media all and (max-width:1184px){
    #popup_layer_center{padding:135px 30px 70px}
}
/*센터 레이어 팝업-e*/

.intro_container{position:relative;height:100vh;background:url("/images/intro/bg_img01.jpg") no-repeat center top -85px / 1920px}
@media only screen and (max-width:1200px){
    .intro_container{background:#ebebeb url(/images/intro/bg_img01.jpg) no-repeat center top 0 / 135%}
}

.intro_menu{position:relative;display:flex;justify-content:space-between;max-width:1074px;margin:0 auto;font-size:0;top:10%;z-index:2}
.intro_menu .garden_btn,
.intro_menu .wetland_btn{margin-top:5%}
.intro_menu .garden_btn a{height:100%;font-size:0;display:inline-block}
.intro_menu .wetland_btn a{height:100%;display:inline-block;font-size:0}
.intro_menu .garden_btn a:hover,
.intro_menu .wetland_btn a:hover{cursor:pointer;transform:scale(1.1);-o-transform:scale(1.1);-moz-transform:scale(1.1);-webkit-transform:scale(1.1);-webkit-transition:transform 500ms  ease-in-out ;-moz-transition:transform 500ms ease-in-out;-o-transition:transform 500ms ease-in-out;-ms-transition:transform 500ms ease-in-out ;transition:transform 500ms ease-in-out}
.intro_menu .garden_btn a img.mo,
.intro_menu .wetland_btn a img.mo{display:none}

@media only screen and (min-width:1921px){
    .intro_container{background:url("/images/intro/bg_img01.jpg") no-repeat center top}
    .intro_menu .garden_btn{margin-top:9%}
    .intro_menu .wetland_btn{margin-top:9%}
}
@media only screen and (max-width:1074px){
    .intro_menu .garden_btn a img,
    .intro_menu .wetland_btn a img{width:100%}
}
@media only screen and (max-width:780px){
    .intro_menu{top:auto}
    .intro_menu .garden_btn,
    .intro_menu .wetland_btn{margin:15% 0 10%}
}
@media only screen and (max-width:600px){
    .intro_menu .garden_btn a img.pc,
    .intro_menu .wetland_btn a img.pc{display:none}
    .intro_menu .garden_btn a img.mo,
    .intro_menu .wetland_btn a img.mo{display:block}
}

.intro_cont.mo{display:none}
.intro_cont{position:absolute;bottom:0;width:100%;z-index:3}
.intro_cont .intro_cont_inner{display:flex;position:relative;width:100%;max-width:1920px;margin:0 auto}
@media only screen and (min-width:1921px){
    .intro_cont{background:url("/images/intro/intro_cont_bg.png") repeat-y center top}
}
@media only screen and (max-width:1200px){
    .intro_cont .intro_cont_inner{flex-wrap:wrap}
}
@media only screen and (max-width:780px){
    .intro_cont{position:relative;padding-bottom:130px;background:url("/images/intro/btm_bg.png") no-repeat center bottom/ 100%}
}

.intro_cont .notice{position:relative;width:33.333%;background:rgba(0,0,0,.6);z-index:3}
.intro_cont .notice ul{display:block}
.intro_cont .notice ul li{width:100%;padding:34px 28px 27px;border-top:1px solid rgba(255,255,255,.3)}
.intro_cont .notice ul li a{display:block}
.intro_cont .notice ul li:first-child{border-top:none}
/*.intro_cont .notice ul li:last-child{display:none}*/
.intro_cont .notice ul li dt{color:#aef79a;font-weight:bold;font-size:19px;font-family:'SBAggro';transform:rotate(0.03deg);font-weight:300;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.intro_cont .notice ul li.garden dt span{display:inline-block;padding:0 15px 0 35px;margin-right:10px;color:#fff;font-size:18px;font-weight:normal;background-color:#448433;background-image:url(/images/intro/ico_garden.png);background-repeat:no-repeat;background-position:8px 50%;border-radius:15px;font-family:'SBAggro';transform:rotate(0.03deg);font-weight:300;height:28px;line-height:31px}
.intro_cont .notice ul li.scbay dt{color:#fbdf9b}
.intro_cont .notice ul li.scbay dt span{display:inline-block;padding:0 15px 0 35px;margin-right:10px;color:#fff;font-size:18px;background-color:#a07203;background-image:url(/images/intro/ico_scbay.png);background-repeat:no-repeat;background-position:8px 50%;border-radius:15px;font-family:'SBAggro';transform:rotate(0.03deg);font-weight:300;height:28px;line-height:31px}
.intro_cont .notice ul li.suncheon dt{color:#d2daed}
.intro_cont .notice ul li.suncheon dt span{display:inline-block;padding:2px 15px 2px 35px;margin-right:10px;color:#fff;font-size:15px;font-weight:normal;background-color:#8898bd;background-image:url(/images/intro/ico_suncheon.png);background-repeat:no-repeat;background-position:8px 50%;border-radius:15px}
.intro_cont .notice ul li dd{height:50px;margin-top:15px;color:#c7c7c7;font-size:16px;font-weight:100;line-height:24px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.intro_cont .notice ul li dd p{color:#c7c7c7}
.intro_cont .notice.mo{display:none}
@media only screen and (min-width:1921px){
    .intro_cont .notice{background:none}
    .intro_cont .notice{border-left:1px solid rgba(255,255,255,.3)}
}
@media only screen and (max-width:1200px){
    .intro_cont .notice{width:100%}
    .intro_cont .notice ul{display:flex}
    .intro_cont .notice ul li{width:50%;border-left:1px solid rgba(255,255,255,.3);border-top:none}
    .intro_cont .notice ul li:first-child{border-left:none}
}
@media only screen and (max-width:780px){
    .intro_cont .notice{height:62px}
    .intro_cont .notice ul{padding-top:10px;width:100%;max-width:490px}
    .intro_cont .notice ul li{width:100%;padding:6px 28px;border-left:none}
    .intro_cont .notice ul li dd{display:none}
}
@media only screen and (max-width:400px){
    .intro_cont .notice ul li{padding:5px 18px 6px}
    .intro_cont .notice ul li dt,
    .intro_cont .notice ul li.garden dt span,
    .intro_cont .notice ul li.scbay dt span{font-size:17px}
}

.intro_cont .youtube_wrap{width:33.333%}
.intro_cont .youtube_wrap img{width:100%;height:317px}
#comLightBox{position:fixed;left:0px;top:0px;width:100%;height:100%;background-color:#000000;opacity :0.6;filter:alpha(opacity=70);-moz-opacity:0.7;-khtml-opacity:0.7;z-index:999999;display:none}
.main_popup{position:absolute;z-index:1000000}
.main_popup .popup_bottom{position:relative;width:100%;height:40px;box-sizing:border-box}
.main_popup .popup_bottom .right{position:absolute;display:block;right:0;top:0;width:40px;height:40px;background:url(/images/intro/icon_close_pop.png) no-repeat center / 25px;text-indent:-9999px}
@media only screen and (max-width:1200px){
    .intro_cont .youtube_wrap{width:50%}
}
@media only screen and (max-width:780px){
    .intro_cont .youtube_wrap{width:100%}
    .intro_cont .youtube_wrap img{height:auto}
}

.intro_cont .info_wrap{position:relative;width:33.333%;background:#ebebeb;z-index:4}
@media only screen and (min-width:1921px){
    .intro_cont .info_wrap{background:none}
    .intro_cont .info_wrap{border-right:1px solid rgba(0,0,0,.1)}
}
@media only screen and (max-width:1200px){
    .intro_cont .info_wrap{width:50%}
}
@media only screen and (max-width:780px){
    .intro_cont .info_wrap{width:100%}
}
.intro_cont .info .weather{position:relative;display:flex;padding:22px 40px 3px;justify-content:space-between;align-items:baseline}
.intro_cont .info .weather a{display:block}
.intro_cont .info .weather .info{color:#0e0c0b;font-family:'SBAggro';transform:rotate(0.03deg);font-weight:300;font-size:20px}
.intro_cont .info .weather .info p{display:inline-block;color:inherit}
.intro_cont .info .weather .info img{margin:0 12px;vertical-align:text-bottom;display:inline-block}
.intro_cont .info .weather .info span{color:#0e0c0b;font-size:28px;font-weight:500}
.intro_cont .info .weather .dust{color:#0e0c0b;font-family:'SBAggro';transform:rotate(0.03deg);font-weight:300;font-size:18px}
.intro_cont .info .weather .dust span{color:#0e0c0b;font-weight:500}
.intro_cont .info .weather .dust_pop{position:absolute;top:-116px;right:35px;width:315px;padding:11px 14px;background:#fff;border:1px solid #8098e6;color:#4f5f77;z-index:101;display:none}
.intro_cont .info .weather .dust_pop > ul > li{padding-left:0.5em;position:relative;line-height:1.2;margin-bottom:0.5em;word-break:keep-all;font-size:14px}
.intro_cont .info .weather .dust_pop > ul > li:last-child{margin-bottom:0}
.intro_cont .info .weather .dust_pop > ul > li:before{content:"";display:block;width:2px;height:2px;left:0;top:8px;background:#555;position:absolute}
.intro_cont .info .weather > .dust:hover + .dust_pop,
.intro_cont .info .weather > .dust:focus + .dust_pop{display:block}
@media only screen and (max-width:1770px){
    .intro_cont .info .weather{padding:24px 40px 2px}
    .intro_cont .info .weather .info{font-size:17px}
    .intro_cont .info .weather .info span{font-size:24px}
    .intro_cont .info .weather .info img{margin:0 8px}
    .intro_cont .info .weather .dust{font-size:16px}
}
@media only screen and (max-width:1570px){
    .intro_cont .info .weather{padding:19px 40px 1px;align-items:center}
    .intro_cont .info .weather .dust{text-align:right}
    .intro_cont .info .weather .dust span{display:block}
}
@media only screen and (max-width:1340px){
    .intro_cont .info .weather{padding:19px 20px 1px}
}
@media only screen and (max-width:400px){
    .intro_cont .info .weather{flex-wrap:wrap}
    .intro_cont .info .weather a,
    .intro_cont .info .weather .dust{width:100%}
    .intro_cont .info .weather .info{text-align:center}
    .intro_cont .info .weather .dust{text-align:center}
    .intro_cont .info .weather .dust span{display:inline-block}
}

.intro_cont .info .intro_hour{position:relative;margin:14px 16px 22px;padding:27px 0 18px 22px;background:#fff;border-radius:5px 40px 40px}
.intro_cont .info .intro_hour:after{content:"";position:absolute;right:-6px;bottom:-9px;width:133px;height:118px;background:url("/images/intro/info_img.png") no-repeat}
.intro_cont .info .intro_hour h3{color:#0e0c0b;margin-bottom:8px;font-family:'SBAggro';transform:rotate(0.03deg);font-weight:500;font-size:20px}
.intro_cont .info .intro_hour dl{display:flex;align-items:baseline}
.intro_cont .info .intro_hour dl dt{width:65px;color:#000;font-family:'SBAggro';transform:rotate(0.03deg);font-weight:300}
.intro_cont .info .intro_hour dl dd{font-family:'SBAggro';transform:rotate(0.03deg);font-weight:300;font-size:18px}
.intro_cont .info .intro_hour dl.garden dt{padding-left:27px;background:url(/images/intro/ico_garden.png) no-repeat left 4px}
.intro_cont .info .intro_hour dl.scbay dt{padding-left:27px;background:url(/images/intro/ico_scbay02.png) no-repeat left 4px}
.intro_cont .info .intro_hour dl dt span{padding-right:3px;color:#0e0c0b;font-weight:300}
.intro_cont .info .intro_hour dl dt strong.end{letter-spacing:14.9px}
.intro_cont .info .intro_hour dl.garden dd{color:#448433}
.intro_cont .info .intro_hour dl.scbay dd{color:#a07203}
@media only screen and (max-width:1570px){
    .intro_cont .info .intro_hour:after{right:-9px;bottom:auto;top:-7px;width:74px;height:118px;background-size:100%}
}
@media only screen and (max-width:780px){
    .intro_cont .info .intro_hour{margin:14px 16px 0}
}
@media only screen and (max-width:400px){
    .intro_cont .info .intro_hour{padding:20px 5px 11px}
    .intro_cont .info .intro_hour:after{display:none}
    .intro_cont .info .intro_hour h3{font-size:17px;letter-spacing:-1px;text-align:center}
    .intro_cont .info .intro_hour dl{flex-flow:wrap}
    .intro_cont .info .intro_hour dl.scbay{margin-top:5px}
    .intro_cont .info .intro_hour dl dt{width:68px;margin:0 auto}
    .intro_cont .info .intro_hour dl dd{width:100%;text-align:center}
}
    
.intro_cont .info .charge{display:flex;padding:18px 28px 18px 36px;background:#d3d3d3}
.intro_cont .info .charge h3{height:31px;line-height:36px;color:#0e0c0b;font-family:'SBAggro';transform:rotate(0.03deg);font-weight:500;font-size:20px;margin-right:13px}
.intro_cont .info .charge .list{width:calc(100% - 105px);height:31px;line-height:31px;font-weight:bold;border-radius:15px;background:#fff;text-align:center;overflow:hidden}
.intro_cont .info .charge .list li{color:#000}
.intro_cont .info .charge .control_btn{margin-left:15px}
.intro_cont .info .charge .control_btn a{display:block;height:15px}
.intro_cont .info .charge .control_btn a .slick-prev:focus,
.intro_cont .info .charge .control_btn a .slick-next:focus{outline:3px dotted red}
.intro_cont .info .charge .control_btn a img{vertical-align:top}
.intro_cont .info .charge #down_mo a button.slick-prev, #down_mo a button.slick-next{background-repeat:no-repeat!important}
.charge.mo{display:none}
@media only screen and (min-width:781px) and (max-width:1200px){
    .intro_cont .info .charge .list li{font-size:12px}
}
@media only screen and (max-width:780px){
    .intro_cont .info .charge{display:none}
    .charge.mo{display:flex;padding:18px 8px 18px 20px;background:#d3d3d3;position:fixed;bottom:0;width:100%;z-index:3}
    .charge.mo h3{height:31px;line-height:36px;color:#0e0c0b;font-family:'SBAggro';transform:rotate(0.03deg);font-weight:500;font-size:16px;margin-right:13px}
    .charge.mo .list{width:calc(100% - 110px);height:31px;line-height:31px;font-weight:bold;border-radius:15px;background:#fff;text-align:center;overflow:hidden}
    .charge.mo .list li{color:#000;font-size:14px}
    .charge.mo .control_btn{margin-left:15px}
    .charge.mo .control_btn a{display:block;height:15px}
    .charge.mo .control_btn a img{vertical-align:top}
    .charge.mo #down_mo a button.slick-prev, #down_mo a button.slick-next{background-repeat:no-repeat!important}
}
@media only screen and (max-width:400px){
    .charge.mo{padding:18px 1px 18px 20px}
    .charge.mo h3{font-size:14px;margin-right:10px}
    .charge.mo .list{width:calc(100% - 98px)}
    .charge.mo .list li{font-size:12px}
    .charge.mo .control_btn{margin-left:5px}
}

@media only screen and (min-width:1201px) and (max-height:800px) {
    html{overflow-y:auto}
    .intro_container{height:800px}
}
@media only screen and (min-width:781px) and (max-width:1200px) and (max-height:980px) {
    html{overflow-y:auto}
    .intro_container{height:980px}
    .intro_menu{top:8%}
}