@charset "utf-8";

@font-face {
    font-family: 'Jal_Onuel';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10-21@1.0/Jal_Onuel.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.main_wrap{margin-top:80px;}
.main_visual_area{width:100%; background:url("/home/yeosu/images/main/main_visual.jpg") no-repeat center; background-size:cover;}
.main_visual_area .container{padding:0 20px 40px 20px;}
.main_title{position:relative; text-align:center; background:rgba(76,91,185,0.8); margin-left:-20px; margin-right:-20px; padding:20px;}
.main_title p{color:#fff;}
.main_title .d_title{margin-bottom:10px; font-size:13px; color:#aeb9ff;}
.main_title .b_title{font-family:'Jal_Onuel'; font-size:25px; line-height:1.3; color:#fff;}
.main_title .b_title span{display:inline-block; vertical-align:bottom; color:#ffec71;}
.main_title .s_title{margin-top:10px; font-size:14px; line-height:1.4; font-weight:300;}

.alim_banner{margin:20px 0 0 0; position:relative; width:100%; box-shadow:3px 3px 10px rgba(0, 0, 0, 0.3); border-radius:15px;}
.alim_banner .alim_list li{float:left; border-radius:15px; overflow:hidden; line-height:0; text-align:center;}
.alim_banner .alim_list li a {display:inline-block;}
.alim_banner .alim_list li a img{max-width:100%; border-radius:15px;}
.alim_banner .alim_controll{position:absolute; bottom:-22px; right:-3px; background:rgba(52,52,52,02.9); border-radius:30px; padding:13px 20px;}
.alim_banner .alim_controll .num{vertical-align:middle; margin-right:15px; font-weight:300; font-size:15px; color:#fff;}
.alim_banner .alim_controll .num em{font-style:normal; display:inline-block; vertical-align:middle; margin:0 4px; color:#fff; font-weight:600; font-size:15px;}
.alim_banner .alim_controll a{display:inline-block; vertical-align:middle; color:#fff;}
.alim_banner .alim_controll a i{font-weight:300; font-size:18px; color:#fff;}
.alim_banner .alim_controll a.pause{margin:0 7px;}
.alim_banner .alim_controll a.pause i{font-weight:600; font-size:13px;}
.pager1{display:none !important;}
.alim_banner .close{display:none;}

.main_middle_area{margin:50px 0 40px 0;}
.main_notice{position:relative;}
.main_notice h2{font-size:22px; margin-bottom:15px; padding-left:10px; font-family:'Ssurround'}
.main_notice ul li{position:relative; padding:0 20px 0 25px; margin-bottom:5px;}
.main_notice ul li:before{content:''; display:block; width:4px; height:4px; border-radius:50%; background:#333; position:absolute; top:50%; margin-top:-2px; left:15px;}
.main_notice ul li a{display:block; font-weight:350; line-height:1.3; width:80%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.main_notice ul li a:hover{font-weight:500; text-decoration:underline;}
.main_notice ul li a em{width:18px; height:18px; border-radius:50%; background:#4c5bb9; color:#fff; text-align:center; line-height:18px; display:inline-block; vertical-align:middle; font-style:normal; font-size:10px; margin-right:5px; margin-top:-4px;}
.main_notice ul li .date{position:absolute; top:0; right:20px; color:#888;}
.main_notice ul li:first-child{border-bottom:1px solid #dedbe1; padding:5px 20px 25px 105px; margin-bottom:20px;}
.main_notice ul li:first-child:before{display:none;}
.main_notice ul li:first-child a{width:98%; font-size:15px; color:#000;}
.main_notice ul li .text span{display:block; margin-top:10px; color:#777; font-weight:300; line-height:1.4; font-size:13px; height:35px; overflow:hidden;}
.main_notice ul li .b_date{position:absolute; top:5px; left:10px;  border:4px solid #dedbe1; border-radius:20px 0 20px 0; padding:10px 5px 25px 5px;}
.main_notice ul li .b_date span{display:block; text-align:center; width:60px;}
.main_notice ul li .b_date .day{font-size:24px; font-weight:600; color:#000;}
.main_notice ul li .b_date .year{position:absolute; bottom:10px; }
.main_notice .btn_more{position:absolute; top:0; right:10px; }
.main_notice .btn_more i{font-size:22px;}

.main_photo{margin-top:30px; position:relative;}
.main_photo h2{font-size:22px; margin-bottom:15px; padding-left:10px; font-family:'Ssurround'}
.main_photo .photo_list li{float:left; background:#fff; border-radius:20px; overflow:hidden; margin-right:20px; border:1px solid #dedede;}
.main_photo .photo_list li a{display:block;}
.main_photo .photo_list li .thumb{min-height:200px; background-size:cover; background-position:center; background-repeat:no-repeat; }
.main_photo .photo_list li .text{padding:25px;}
.main_photo .photo_list li p{font-size:16px; font-weight:600; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; margin-bottom:10px;}
.main_photo .photo_list li span{ display:block; color:#777;}
.main_photo .photo_controll{position:absolute; top:0; right:45px;}
.main_photo .photo_controll a{display:inline-block; vertical-align:middle;}
.main_photo .photo_controll a i{font-weight:300; font-size:18px;}
.main_photo .photo_controll a.pause{margin:0 13px;}
.main_photo .photo_controll a.pause i{font-weight:600; font-size:13px;}
.main_photo .more_btn{position:absolute; top:0; right:15px;}
.main_photo .more_btn i{font-size:20px; font-weight:300;}


.main_bottom{margin-top:20px;}
.online_area{background:#f99a3e url("/home/yeosu/images/main/online_bg.jpg") no-repeat; background-position:right -20px bottom -30px; background-size:contain;  padding:25px; border-radius:15px;}
.online_area h2{font-size:30px; margin-bottom:15px; font-family:'Shiningstar'; color:#fff; font-weight:500;}
.online_area p{color:#fff; font-weight:300; line-height:1.4; margin-bottom:20px;}
.online_area a{display:inline-block; border:1px solid #fff; padding:10px 20px; color:#fff; border-radius:20px;}

.quick_area{margin-top:40px; position:relative;}
.quick_area h2{font-size:22px; margin-bottom:15px; font-family:'Ssurround'}
.quick_area h2 em{font-style:normal; position:relative; color:#f99a3e;}
.quick_area h2 em:before{content:''; display:block; width:6px; height:6px; border-radius:50%; background:#f99a3e; position:absolute; top:-8px; left:50%; transform:translateX(-50%);}
.quick_list_wrap{border:1px solid #dedede; border-radius:15px; padding:20px;}
.quick_list li{float:left; background:#fff; border-radius:20px; /*overflow:hidden;*/ text-align:center;}
.quick_list li a{display:block; padding-top:105px; position:relative;}
.quick_list li a i{display:block; width:90px; height:90px; position:absolute; top:0; left:50%; transform:translateX(-50%); background-image:url("/home/yeosu/images/main/quick_icon.png"); background-repeat:no-repeat; background-size:500%;}
.quick_list li a i.icon01{background-position:0 0;}
.quick_list li a i.icon02{background-position:-90px 0;}
.quick_list li a i.icon03{background-position:-180px 0;}
.quick_list li a i.icon04{background-position:-270px 0;}
.quick_list li a i.icon05{background-position:-360px 0;}

.quick_list li span{ display:block; color:#777; font-size:16px;}
.quick_controll{position:absolute; top:0; right:0;}
.quick_controll a{font-size:20px}
.quick_controll a.prev{margin-right:30px; position:relative;}
.quick_controll a.prev:after{content:''; display:block; width:1px; height:20px; background:#dedede; position:absolute; top:50%; transform:translateY(-50%); right:-15px;}

.main_infor{background:url("/home/yeosu/images/main/main_infor_bg.jpg") no-repeat center; background-size:cover; padding:30px 0;}
.main_infor .container > div{background:#fff;padding:20px;text-align:center;border-bottom:1px solid #e0e0e0;}
.main_infor .container > div > h2{font-size:17px; font-weight:600; line-height:1.4; position:relative;}
.main_infor .container > div > .text{margin-top:10px;}

.main_infor .container > div > .text > span{display:block; line-height:1.5;}
.main_infor .container > div > .text > strong{font-weight:600; font-size:20px; color:#0075d2;}
.main_infor .container > div > .text > a{display:inline-block; color:#fff; border:1px solid #fff; border-radius:30px; padding:8px 25px;}
.main_infor .container .infor01{background: #0e7fd9;border-radius:15px 15px 0 0;}

.main_infor .container .infor03{border-bottom:0;background:#ffffff;}
.main_infor .container .infor03 > div{margin:0 20px; margin-bottom:20px;padding-bottom:20px;border-bottom: 1px dashed rgb(15 127 216);}
.main_infor .container .infor03 > .infor03_3{border:none; margin-bottom:0; padding-bottom:0;}
.main_infor .container .infor03 > div h2{color: #333;font-size: 17px;line-height:1.5;}
/*.main_infor .container .infor03 > div h2 br{display:none;}*/
.main_infor .container .infor03 > div .text a{display:inline-block; color:#0e7fd9; border:1px solid #fff; border-radius:30px; padding:6px 20px;}
.main_infor .container .infor03 > div .text > strong{font-weight:600; font-size:20px; color:#0075d2;}

.main_infor .container .infor04.c_b{border-radius:15px 15px 0px 0px;}
.main_infor .container .infor04{border-radius:0 0 15px 15px; border-bottom:0; background:#0e7fd9;}
.main_infor .container .infor04 > div{/* margin:0 20px; */}
.main_infor .container .infor04 > .infor04_1{margin-bottom:20px; padding-bottom:20px; border-bottom:1px dashed rgba(255,255,255,0.5);}
.main_infor .container .infor04 > div h2{color:#fff; font-size:16px; line-height:1.5; margin-bottom:10px;}

.main_infor .container .infor04 > div .text a{display:inline-block; color:#fff; border:1px solid #fff; border-radius:30px; padding:6px 20px;}




@media all and (min-width:480px){
	.main_infor .container > div > h2 > br{display:none;}
}

@media all and (min-width:640px){
	
	.main_title .b_title{font-size:34px;}
	
	.main_middle_area{margin:40px 0 60px 0;}
	.main_notice h2, .main_photo h2, .quick_area h2{font-size:25px;}
	.main_notice ul li{margin-bottom:10px;}
	.main_notice ul li:first-child{padding:15px 20px 40px 120px;}
	.main_notice ul li:first-child a{font-size:16px;}
	.main_notice ul li .text span{font-size:14px; line-height:1.5; height:41px;}
	.main_notice ul li .b_date{width:90px; height:90px; padding-top:18px; text-align:center;}
	.main_notice ul li .b_date span{width:auto;}
	.main_notice ul li .b_date .day{font-size:28px;}
	.main_notice ul li .b_date .year{left:50%; transform:translateX(-50%); bottom:20px; font-size:14px;}
	
	.main_photo{margin-top:40px;}
	.main_photo .cal_nav span em{font-size:27px;}
	.main_photo .cal_nav a, .main_photo .cal_nav a i, .main_photo .cal_nav span{font-size:22px;}
	.main_photo .cal_cont .cal_list .cal_row span a{font-weight:500; font-size:15px;}
	
	.main_bottom{margin-top:30px;}
	.online_area{padding:40px; position:relative; background-position:right -50px bottom -50px;}
	.online_area:after{content:''; display:block; width:181px; height:229px; background:url(/home/yeosu/images/main/online_icon.png) no-repeat 0 0; background-size:cover; position:absolute; right:10px; bottom:-13px;}
	.online_area h2{font-size:36px;}
	.online_area a{padding:11px 25px;}
	
	.quick_area{margin-top:50px;}
	.quick_list_wrap{padding:30px 20px;}	
	
	.main_infor .container > div > .text > strong{font-size:24px;}
}

/*테블릿*/
@media all and (min-width:768px){
	
	.main_notice h2, .main_photo h2, .quick_area h2{font-size:27px;}
	
	.main_visual_area{position:relative;}
	.main_title{text-align:left; width:330px; margin:0; padding:70px 30px;}
	.main_title .d_title{font-size:16px; margin-bottom:20px;}
	.main_title .b_title{font-size:40px;}
	.main_title .s_title{font-size:16px; margin-top:30px;}
	.alim_banner{width:350px; position:absolute; top:50%; transform:translateY(-50%); right:30px; margin:0;}

	.main_visual_area .container{padding:0;}
	.main_visual_area .container:after{content:''; display:block; clear:both;}
	
	.main_notice ul li{margin-bottom:15px;}
	.main_notice ul li:first-child{margin-bottom:25px;}
	.main_notice ul li a{font-size:15px;}

		
	.main_infor .container{display:flex; flex-wrap:wrap;}
	.main_infor .container > div{width:50%; border-right:1px solid #e0e0e0; border-bottom:0;}
	.main_infor .container .infor02 > h2{padding-bottom:60px;}
	.main_infor .container .infor01 > h2{padding-top:60px;}
	.main_infor .container .infor04 > h2{padding-top:60px;}
	/*.main_infor .container > div > h2:after{content:''; display:block; width:50px; height:50px; background-image:url("/home/yeosu/images/main/infor_icon.png"); background-repeat:no-repeat; background-size:200px; position:absolute; left:50%; bottom:0; transform:translateX(-50%);}*/
	.main_infor .container .infor02 > h2:after{content:'';display:block;width:50px;height:50px;background-image:url("/home/yeosu/images/main/infor_icon.png");background-repeat:no-repeat;background-size:200px;position:absolute;left:50%;bottom:0;transform:translateX(-50%);}
	.main_infor .container .infor01 > h2:after{content:'';display:block;width:50px;height:50px;background-image:url("/home/yeosu/images/main/infor_icon.png");background-repeat:no-repeat;background-size:200px;position:absolute;left:50%;top:0;transform:translateX(-50%);}
	.main_infor .container .infor04 > h2:after{content:'';display:block;width:50px;height:50px;background-image:url("/home/yeosu/images/main/infor_icon.png");background-repeat:no-repeat;background-size:200px;position:absolute;left:50%;top:0;transform:translateX(-50%);}
	.main_infor .container .infor01 > h2:after{background-position:0 0;}
	.main_infor .container .infor02 > h2:after{background-position:-50px 0;}
	.main_infor .container .infor03 > h2:after{background-position:-100px 0;}
	.main_infor .container .infor04 > h2:after{background-position: -150px 0;}
	
	.main_infor .container .infor01{border-radius:15px 0 0 0; border-bottom:1px solid #e0e0e0;}
	.main_infor .container .infor02{border-radius:0 15px 0 0; border-right:0;}
	.main_infor .container .infor03{border-radius:0 0 0 15px;}
	.main_infor .container .infor04{border-radius:0 0 15px 0; border-right:0;}
	
}

@media all and (min-width:1024px){
	
	.main_title{width:450px; padding:100px 50px;}
	.main_title .d_title{margin-bottom:30px;}
	.main_title .b_title{font-size:50px;}
	.main_title .b_title span{font-size:60px;}
	.main_title .s_title{font-size:17px; line-height:1.6;}
	.alim_banner{width:450px;}
	.alim_banner .close{display:block; position:absolute; top:-40px; right:10px; color:#fff; text-shadow:2px 2px 3px rgba(0, 0, 0, 0.4);}
	.alim_banner .close i{color:#fff; font-size:20px; font-weight:300; margin-left:10px;}
	
	.main_middle_area{margin:60px 0;}
	.main_notice h2, .main_photo h2, .quick_area h2{font-size:31px; margin-bottom:20px;}
	.main_top{display:flex; flex-wrap:nowrap; justify-content:space-between;}
	.main_notice{width:52%;}
	.main_notice ul li a{font-size:16px;}
	.main_photo{width:46%; margin-top:0;}
	.main_photo .cal_cont .cal_list{padding:15px 20px;}
	.main_photo .cal_cont .cal_list .cal_row span a{font-size:16px;}
	
	.main_bottom{display:flex; flex-wrap:wrap; justify-content:space-between;}
	.online_area{width:52%; padding:30px 40px;}
	.online_area a{transition:0.2s;}
	.online_area a:hover{background:#fff; color:#f99a3e;}
	.quick_area{width:46%; margin-top:0;}
	
	.main_infor .container{display:flex; flex-wrap:nowrap;}
	.main_infor .container > div{width:25%; padding:30px 0;}
	.main_infor .container > div > h2{font-size:23px;}
	.main_infor .container > div > h2 > br{display:block;}
	.main_infor .container > div > .text > a{padding:11px 25px; transition:0.2s;}
	.main_infor .container > div > .text > a:hover{background:#fff; color:#0e7fd9;}
	.main_infor .container > div > .text > strong{font-size:28px;}
	.main_infor .container .infor01{border-radius:15px 0 0 15px; border-bottom:0;}
	.main_infor .container .infor02{border-radius:0 0 0 0; border-right:1px solid #e0e0e0;}
	.main_infor .container .infor03{border-radius:0 0 0 0;}
	
	.main_infor .container .infor03 > div h2{font-size:18px;}
	/*.main_infor .container .infor03 > div h2 br{display:block;}*/
	.main_infor .container .infor03 > .infor03_1{padding-bottom: 15px;}

	.main_infor .container .infor04{border-radius:0 15px 15px 0;}
	.main_infor .container .infor04.c_b{border-radius:15px 0px 0px 15px;}
	.main_infor .container .infor04 > div h2{font-size:18px;}
	.main_infor .container .infor04 > div h2 br{display:block;}
	.main_infor .container .infor04 > .infor04_1{margin-bottom:30px; padding-bottom:30px;}
}


@media all and (min-width:1200px){

	.main_title:after{top:100px;}
	.main_title .b_title{font-size:45px;}
	
	.main_notice h2, .main_photo h2, .quick_area h2{margin-bottom:30px;}
	.main_notice{width:36%}
	.main_notice ul li{margin-bottom:20px;}
	.main_notice ul li:first-child a{font-size:18px;}
	.main_photo{width:47%;}
	.main_bottom{margin-top:45px;}
	.online_area{width:38%; padding:40px 50px;}
	.online_area h2{font-size:42px;}
	.quick_list_wrap{padding:40px 10px;}
	.quick_area{width:60%;}
	
	.main_infor{padding:50px 0; margin-top:80px;}
	.main_infor .container > div{padding:45px 0;}
	.main_infor .container > div > h2{/* padding-bottom:80px; */}
	.main_infor .container > div > h2:after{width:65px; height:65px; background-size:260px;}
	.main_infor .container .infor02 > h2:after{background-position: -50px 0;}
	.main_infor .container .infor03 > h2:after{background-position:-130px 0;}
	.main_infor .container .infor04 > h2:after{background-position: -150px 0;}
	.main_infor .container > div > .text{margin-top:20px;}
	.main_infor .container .infor01 > h2{margin-top:20px}
	.main_infor .container .infor02 > h2{margin-top:20px}
	.main_infor .container .infor04 > h2{margin-top:20px}
	
}

@keyframes fadeInUp{
	0%{opacity:0; transform:translate3d(0,100%,0)}
	to{opacity:1; transform:translateZ(0)}
}

@media all and (min-width:1300px){
	
	.container{padding:0;}
	.main_cont{position:relative;}
	.main_wrap{margin-top:130px;}
	.main_title{width:500px; padding:100px 70px;}
	.main_title .d_title{font-size:18px; letter-spacing:2px;}
	.main_title .s_title{font-size:18px; line-height:1.8;}
	
	.alim_banner{width:500px; right:50px;}
	
	.main_infor{padding:70px 0;}
}


/*sns*/
.main_infor .container .infor01 > h2{color:#fff;}
.main_infor .container .infor04 > h2{color:#fff;}
.sns_main{display: flex;margin-top:20px;justify-content: space-around;}
.sns_main ul{display:flex; flex-wrap:wrap; justify-content:center;}
.sns_main ul li{margin-right:15px;}
.sns_main ul li:last-child{margin-right:0;}
.sns_main ul li a{display:block;width:40px;height:40px;border-radius:50%;border: 1px solid #ffffff;line-height:40px;text-align:center;}
.sns_main ul li a i{color: #ffffff;font-size:18px;}

.fa-kakao{width:16px; height:16px; background:url(/home/yeosu/images/common/main_sns_kakao.png) no-repeat center;}
.fa-band{width:16px; height:16px; background:url(/home/yeosu/images/common/main_sns_band.png) no-repeat center;}

@media all and (min-width:1024px){
	.sns_main ul{justify-content:flex-start;}
	.sns_main ul li.facebook:hover a{background:#55a2d4}
	.sns_main ul li.kakao:hover a{background:#3a1a1c;}
	.sns_main ul li.band:hover a{background:#6bae54;}
	.sns_main ul li.insta:hover a{background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 35%, rgba(252,176,69,1) 100%);}
	.sns_main ul li.youtube:hover a{background:#f31c1b;}
}


@media all and (min-width:1400px){
	.sns_main{margin-top:40px;}
}