@charset "utf-8";
/**
 * @File Name :main.css
 * @Description :Layout[main] | Contents[main]
 * @Modification Information
 * 
 * 수정일 | 수정자 | 수정내용
 * 2023.06.05 | 김효진 | 최초 등록
 * 
 * @author 디자인팀 김효진
 * @since 2023.06.05
 *
 * @Copyright (C) IACTS.CO.KR All rights reserved.
 */

/* 공통 */
#wrap>.container{max-width:none;margin:0}


[id*='mainbody'] .hg1 [class*='h']{color:#000;line-height:1;font-family:'JalnanGothic';}
[id*='mainbody'] .hg1 h2.h1{font-size:36px;}
@media screen and (max-width:767px){
	[id*='mainbody'] .hg1 h2.h1{font-size:30px;}
}
@media screen and (max-width:540px){
	[id*='mainbody'] .hg1 h2.h1{font-size:26px;}
}

.menu .m{position:relative;display:inline-block;vertical-align:middle;width:50px;height:50px;text-align:center;background:#e9ecf0;border-radius:100%;border:0;margin:0 5px;transition:all 0.3s ease;}
.menu .m:before, .menu .m:after{content:'';display:block;position:absolute;}
.menu .m.prev:before{top:50%;right:49%;width:8px; height:8px;border:solid #000;border-width:0 2px 2px 0;transform:translateY(-50%) rotate(135deg);}
.menu .m.prev:after{top:50%;left:50%;width:20px; height:2px;background:#000;transform:translate(-50%, -50%)}
.menu .m.next:before{top:50%;left:49%;width:8px; height:8px;border:solid #000;border-width:2px 0 0 2px;transform:translateY(-50%) rotate(135deg);}
.menu .m.next:after{top:50%;left:50%;width:20px; height:2px;background:#000;transform:translate(-50%, -50%)}
.menu .m.stop:before, .menu .m.stop:after{position:static;display:inline-block;vertical-align:top;margin:4px 2px 0;}
.menu .m.stop:before{width:3px; height:13px;background:#000;}
.menu .m.stop:after{width:3px; height:13px;background:#000;}
.menu .m.play:before{top:50%;left:55%;transform:translate(-50%, -50%);width:0;height:0;border-top:10px solid transparent;border-left:10px solid #000;border-bottom:10px solid transparent;}
.menu .m.more{background:#000}
.menu .m.more:before{top:50%;left:50%;width:4px; height:15px;background:#fff;transform:translate(-50%, -50%)}
.menu .m.more:after{top:50%;left:50%;width:4px; height:15px;background:#fff;transform:translate(-50%, -50%) rotate(90deg)}
.menu .m:hover{background:#c5ccd5}


#mainbody1{position:relative;padding:100px 0 380px;border-radius:0 0 200px 0;background:#f6f8fb;}
#mainbody1:before, #mainbody1:after{position:absolute;font-weight:900;color:#eef0f3;}
#mainbody1:before{content:'SW';left:470px;top:280px;font-size:140px;}
#mainbody1:after{content:'Subscription';right:-70px;bottom:170px;font-size:215px;letter-spacing:-10px;}
@media screen and (max-width:1420px){
	#mainbody1{padding:0 0 380px;}
}
@media screen and (max-width:767px){
	#mainbody1{padding:0 0 50px}
	#mainbody1:after{display:none}
}


#reserve1{z-index:1;position:relative;padding-left:520px}

#reserve1>.hg1{position:absolute;left:0;top:24px}
#reserve1>.hg1 .t1{color:#062231;font-size:24px;font-weight:700}
#reserve1>.hg1 .t2{color:#000;font-size:24px;}
#reserve1>.hg1 .h1{font-size:58px;margin:10px 0 20px;}

#reserve1 #reserve1search{position:absolute;left:0;bottom:0;width:100%;max-width:420px;}
#reserve1 #reserve1search .form1{position:relative;}
#reserve1 #reserve1search .form1 input{max-width:400px;width:100%;height:70px;margin:0;padding:0;border-radius:20px;border:3px solid #000;box-sizing:border-box;}
#reserve1 #reserve1search .form1 button{position:absolute;right:0;top:calc(50% - 45px);padding:0;width:80px;height:80px;background:#2634a4;border:0;border-radius:100% 100% 35px 100%} 
#reserve1 #reserve1search .form1 button:before, #reserve1 #reserve1search .form1 button:after{content:'';display:block;position:absolute;}
#reserve1 #reserve1search .form1 button:before{left:50%;top:50%;transform:translate(-55%, -55%);width:15px;height:15px;border:3px solid #fff;border-radius:100%;}
#reserve1 #reserve1search .form1 button:after{right:calc(50% - 13px);bottom:calc(50% - 10px);width:10px;height:4px;background:#fff;transform:rotate(47deg);border-radius:30px;}

#reserve1 #reserve1search .keyword1{padding:20px 10px 0}
#reserve1 #reserve1search .keyword1 .h2{font-size:15px;}
#reserve1 #reserve1search .keyword1 li{display:inline-block;}
#reserve1 #reserve1search .keyword1 li a{display:block;margin:5px 5px 5px 0;padding:15px;background:#fff;border-radius:20px;color:#555;font-size:15px;}

#reserve1 #reserve1panel{position:relative;background:#fff;width:100%;height:530px;border-radius:30px;box-shadow:0 10px 20px rgba(0,0,0,.1);}
#reserve1 #reserve1panel .panel1 .lst1{display:flex;flex-wrap:wrap;}
#reserve1 #reserve1panel .panel1 .lst1 li{flex:1;}
#reserve1 #reserve1panel .panel1 .lst1 li a{position:relative;display:block;height:60px;line-height:65px;color:#000;text-align:center;font-size:18px}
#reserve1 #reserve1panel .panel1 .lst1 li.on a{background:#2634a4;border-radius:20px 20px 0 0;color:#fff;font-size:20px;font-weight:700}
#reserve1 #reserve1panel .panel1 .lst1 li.on a:before{content:'';position:absolute;right:calc(50% - 50px);top:calc(50% - 20px);width:10px;height:10px;border-radius:100%;background:#ef4d74}
#reserve1 #reserve1panel .tabs1panel{padding:40px;min-height:calc(100% - 60px);border-radius:0 0 20px 20px;border:3px solid #2634a4;box-sizing:border-box;}
#reserve1 #reserve1panel .tabs1panel>div{display:flex;flex-wrap:wrap;}
#reserve1 #reserve1panel .tabs1panel [class*='panel'] [class*="lst"]{margin-top:20px;height:330px;padding-right:10px;overflow:hidden;overflow-y:auto;box-sizing:border-box;}
#reserve1 #reserve1panel .tabs1panel [class*='panel'] .hg1 span{display:inline-block;vertical-align:middle;}
#reserve1 #reserve1panel .tabs1panel [class*='panel'] .hg1 .h1{font-size:13px;width:30px;height:30px;text-align:center;padding-top:10px;background:#eef0f3;border-radius:100%;box-sizing:border-box;}
#reserve1 #reserve1panel .tabs1panel [class*='panel'] .hg1 .h2{font-size:20px;margin-left:5px}
#reserve1 #reserve1panel .tabs1panel .panel2{width:300px;}
#reserve1 #reserve1panel .tabs1panel .panel2 li{margin-bottom:10px}
#reserve1 #reserve1panel .tabs1panel .panel2 li a{position:relative;display:block;padding:12px 65px 12px 50px;background:#f6f8fb;border-radius:30px;color:#000;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin:0 0 10px;transition:all 0.5s ease;}
#reserve1 #reserve1panel .tabs1panel .panel2 li a .ic1{position:absolute;left:20px;top:calc(50% - 9px);display:block;border:1px solid #e1e1e1;background:#fff;width:18px;height:18px;border-radius:3px;box-sizing:border-box;}
#reserve1 #reserve1panel .tabs1panel .panel2 li a .t1{position:absolute;right:20px;top:calc(50% - 12px);background:#fff;width:50px;height:24px;text-align:center;border-radius:30px;font-size:14px;line-height:24px}
#reserve1 #reserve1panel .tabs1panel .panel2 li.on a{background-color:#08146e;color:#fff;font-weight:600;}
#reserve1 #reserve1panel .tabs1panel .panel2 li.on a .ic1{border-radius:100%;background:#ef4d74;border:0}
#reserve1 #reserve1panel .tabs1panel .panel2 li.on a .ic1:before{content:'';position:absolute;left:6px;top:3px;width:3px;height:7px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);}
#reserve1 #reserve1panel .tabs1panel .panel2 li.on a .t1{background:#ef4d74;color:#fff;}

#reserve1 #reserve1panel .tabs1panel .panel3{width:650px;margin-left:auto}
#reserve1 #reserve1panel .tabs1panel .panel3 li{margin-bottom:25px}
#reserve1 #reserve1panel .tabs1panel .panel3 li a{position:relative;display:flex;flex-wrap:wrap;padding:20px;border-radius:20px;z-index:1}
#reserve1 #reserve1panel .tabs1panel .panel3 li a:before{content:'';display:block;position:absolute;left:0;right:0;top:0;bottom:0;border:1px solid #ddd;border-radius:20px;z-index:0;transition:all 0.5s ease;}
#reserve1 #reserve1panel .tabs1panel .panel3 li a .f1{display:block;width:140px;height:100px;border-radius:20px;overflow:hidden;background:#eee}
#reserve1 #reserve1panel .tabs1panel .panel3 li a .f1 img{width:100%;height:100%;object-fit: cover;}
#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1{width:calc(100% - 180px);box-sizing:border-box;padding:12px 70px 12px 0;margin-left:auto;}
#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1 .t1{display:block;color:#000;font-family:'JalnanGothic';font-weight:normal;font-size:20px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1 .t2{display:block;color:#555;}
#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1 .arrow{position:absolute;right:20px;top:calc(50% - 35px);width:70px;height:70px;background:#f6f8fb;border-radius:100%}
#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1 .arrow:before, #reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1 .arrow:after{content:'';position:absolute;}
#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1 .arrow:before{top:50%;left:48%;width:10px; height:10px;border:solid #000;border-width:2px 0 0 2px;transform:translateY(-50%) rotate(135deg);}
#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1 .arrow:after{top:50%;left:50%;width:20px; height:2px;background:#000;transform:translate(-50%, -50%)}
#reserve1 #reserve1panel .tabs1panel .panel3 li a:hover:before{border:3px solid #062231}
#reserve1 #reserve1panel .tabs1panel .panel3 li a:hover .tg1 .arrow{background:#2634a4}
#reserve1 #reserve1panel .tabs1panel .panel3 li a:hover .tg1 .arrow:before{border-color:#fff;}
#reserve1 #reserve1panel .tabs1panel .panel3 li a:hover .tg1 .arrow:after{background:#fff;}
@media screen and (max-width:1620px){
	#reserve1 #reserve1panel .tabs1panel .panel3{width:calc(100% - 320px)}
}
@media screen and (max-width:1560px){
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .f1{display:none}
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1{width:100%;}	
}
@media screen and (max-width:1420px){
	#reserve1{padding:200px 0 0 0;}
	#reserve1>.hg1{top:50px}
	#reserve1>.hg1 .t2{display:none}
	
	#reserve1 #reserve1search{left:auto;right:0;bottom:auto;top:70px;}
	#reserve1 #reserve1search .keyword1{display:none}
	
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .f1{display:block}
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1{width:calc(100% - 160px)}
}
@media screen and (max-width:999px){
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .f1{display:none}
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1{width:100%}
}
@media screen and (max-width:870px){
	#reserve1{padding:20px 0;}

	#reserve1>.hg1{position:static;text-align:center;}
	#reserve1>.hg1 .h1{font-size:48px;}
	
	#reserve1 #reserve1search{position:static;margin:0 auto 20px}	
	#reserve1 #reserve1search .form1 input{height:50px;}
	#reserve1 #reserve1search .form1 button{width:60px;height:60px;right:-5px;top:calc(50% - 35px)}
	
	#reserve1 #reserve1panel .tabs1panel{padding:20px}
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1{padding:12px 0}
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1 .arrow{display:none}
}
@media screen and (max-width:767px){

	#reserve1>.hg1 .h1{font-size:36px;}
	
	#reserve1 #reserve1panel{height:auto;}
	#reserve1 #reserve1panel .tabs1panel{min-height:100%;border:0;padding:0}
	#reserve1 #reserve1panel .panel1 .lst1 li a, #reserve1 #reserve1panel .panel1 .lst1 li.on a{font-size:16px;}
	#reserve1 #reserve1panel .panel1 .lst1 li a{line-height:55px;height:50px;}
	#reserve1 #reserve1panel .tabs1panel>div{display:block;}
	#reserve1 #reserve1panel .tabs1panel .panel2, #reserve1 #reserve1panel .tabs1panel .panel3{width:100%}
	
	#reserve1 #reserve1panel .tabs1panel [class*="panel"]>.hg1{padding:15px;background:#2634a4}
	#reserve1 #reserve1panel .tabs1panel [class*='panel'] .hg1 .h1{background:#fff;margin-top:-3px;width: 26px;height: 26px;font-size: 12px;padding-top: 8px;}
	#reserve1 #reserve1panel .tabs1panel [class*='panel'] .hg1 .h2{color:#fff;font-size:18px;}
	#reserve1 #reserve1panel .tabs1panel [class*='panel'] [class*="lst"]{margin:0;padding:10px;}
	#reserve1 #reserve1panel .tabs1panel .panel2 .lst1{display:flex;flex-wrap:wrap;gap:5px;height:120px;}
	#reserve1 #reserve1panel .tabs1panel .panel2 .lst1 li{width:calc((100% - 5px * 2) / 3);margin:0}
	#reserve1 #reserve1panel .tabs1panel .panel2 li a{border-radius:5px;padding:10px 40px 10px 10px;font-size:15px;background:#fff;border:1px solid #ddd;overflow:hidden}
	#reserve1 #reserve1panel .tabs1panel .panel2 li.on a{border:0}
	#reserve1 #reserve1panel .tabs1panel .panel2 li a .t1{right:0;top:0;bottom:0;border-radius:0 5px 5px 0;width:40px;height:auto;line-height:40px;background:#eee;font-size:13px;}
	#reserve1 #reserve1panel .tabs1panel .panel2 li a .ic1{display:none}
	#reserve1 #reserve1panel .tabs1panel .panel3 .lst2{height:205px;}
	#reserve1 #reserve1panel .tabs1panel .panel3 li{margin-bottom:10px;}
	#reserve1 #reserve1panel .tabs1panel .panel3 li a{padding:15px 20px 10px}
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1{padding:0}
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1 .t1{font-size:18px;}
	#reserve1 #reserve1panel .tabs1panel .panel3 li a .tg1 .t2{font-size:14px;}
}
@media screen and (max-width:580px){
	#reserve1 #reserve1panel .panel1 .lst1 li a, #reserve1 #reserve1panel .panel1 .lst1 li.on a{font-size:14px;}
	#reserve1 #reserve1panel .panel1 .lst1 li.on a:before{right:calc(50% - 5px);top:auto;bottom:-5px}

	#reserve1 #reserve1panel .tabs1panel .panel2 .lst1 li{width:calc((100% - 5px * 1) / 2);}
}


#mainbody2{position:relative;z-index:1;margin:-270px 0 0;}
#mainbody2>.container{display:flex;flex-wrap:wrap;}
@media screen and (max-width:767px){
	#mainbody2{margin:0}
}

#menu1{position:relative;height:460px;width:calc(100% - 970px);padding:80px 0 0;box-sizing:border-box;}
#menu1:before, #menu1:after{content:'';display:block;position:absolute;z-index:-1}
#menu1:before{left:-500px;right:-130px;top:0;bottom:0;border-radius:0 300px 300px 0;background:linear-gradient(135deg, #f1e8ec 0%, #e3edfe 100%);}
#menu1:after{right:0;bottom:0;width:392px;height:378px;background:url(../../img/main/menu1_bg1.png)}
#menu1 .hg1 .t1{color:#333;font-size:18px;margin:20px 0 40px;font-weight:400}
#menu1 li{margin-bottom:10px;}
#menu1 li a{display:block;position:relative;width:240px;height:60px;color:#fff;padding:20px 40px;border-radius:30px;background:#08146e;box-sizing:border-box;transition:all 0.5s ease;}
#menu1 li a .arrow{position:absolute;right:40px;top:calc(50% - 10px);width:20px;height:20px;opacity:0.5;transition:all 0.5s ease;}
#menu1 li a .arrow:before, #menu1 li a .arrow:after{content:'';position:absolute;}
#menu1 li a .arrow:before{top:50%;left:49%;width:8px; height:8px;border:solid #fff;border-width:2px 0 0 2px;transform:translateY(-50%) rotate(135deg);}
#menu1 li a .arrow:after{top:50%;left:50%;width:20px; height:2px;background:#fff;transform:translate(-50%, -50%)}
#menu1 li a:hover{background:#ef4d74;box-shadow:0 10px 10px rgba(0,0,0,.2);}
#menu1 li a:hover .arrow{right:35px;opacity:1}

@media screen and (max-width:1520px){
	#menu1{width:calc(100% - 700px)}
}
@media screen and (max-width:1259px){
	#menu1{width:calc(100% - 150px);height:350px;}
	#menu1:after{right:-40px;}
	#menu1 li{display:inline-block;}	
}
@media screen and (max-width:767px){
	#menu1{width:100%;height:320px;padding:65px 0 0;}
	#menu1:before{right:-20px;border-radius:0}
	#menu1 .hg1 .t1{font-size:16px;}
}
@media screen and (max-width:640px){
	#menu1:after{width:300px;height:289px;background-size:contain;}
	#menu1 ul{display:flex;flex-wrap:wrap;gap:5px;}
	#menu1 li{flex:1}
	#menu1 li a{width:100%}
}
@media screen and (max-width:480px){
	#menu1{height:auto;padding:50px 0;}
	#menu1 .hg1{text-align:center;}
	#menu1 .hg1 .t1{margin:10px 0 20px}	
	#menu1:after{display:none}
}

#menu2{width:970px;margin-left:auto;padding:100px 0 0;}
#menu2 .hg1 .h1{text-align:right;margin-right:30px}
#menu2 ul{display:flex;flex-wrap:wrap;align-items:stretch;gap:30px;margin-top:20px;}
#menu2 li{flex:1;aspect-ratio:1 / 1;}
#menu2 li a{position:relative;display:block;width:100%;height:100%;text-align:center;color:#000;font-size:17px;font-weight:700;background:#fff;border-radius:20px;border:1px solid #e0e0e0;box-sizing:border-box;transition:all 0.5s ease;}
#menu2 li a:before{content:'';display:block;width:65px;height:55px;margin:50px auto 30px;background:url(../../img/main/main_sprite2.png) no-repeat 0 0 / 287px 55px;transition:filter 0.5s ease;}
#menu2 li:nth-child(1) a:before{background-position:0 0}
#menu2 li:nth-child(2) a:before{background-position:-65px 0}
#menu2 li:nth-child(3) a:before{background-position:-130px 0}
#menu2 li:nth-child(4) a:before{background-position:-195px 0}
#menu2 li a:hover{border-color:#2634a4;background-color:#2634a4;color:#fff;border-radius:100%;box-shadow:0 10px 10px rgba(0,0,0,.2);}
#menu2 li a:hover:before{filter:brightness(0) invert(1)}
#menu2 li a .arrow{position:absolute;right:15px;top:15px;display:block;width:50px;height:50px;background:#53a7f0;border-radius:100%;transform:rotate(-45deg);opacity:0;transition:all 0.3s ease;}
#menu2 li a .arrow:before, #menu2 li a .arrow:after{content:'';position:absolute;}
#menu2 li a .arrow:before{top:50%;left:49%;width:8px; height:8px;border:solid #fff;border-width:2px 0 0 2px;transform:translateY(-50%) rotate(135deg);}
#menu2 li a .arrow:after{top:50%;left:50%;width:20px; height:2px;background:#fff;transform:translate(-50%, -50%)}
#menu2 li a:hover .arrow{opacity:1;right:10px;top:10px;}
@media screen and (max-width:1520px){
	#menu2{width:700px;padding:50px 0 0}
	#menu2 li{ flex: 1 1 calc(50% - 30px);aspect-ratio:auto;}
	#menu2 li a{padding:20px 0;}
	#menu2 li a:before{margin:0 auto 10px;}
	#menu2 li a:hover{border-radius:20px}
	#menu2 li a:hover .arrow{right:-10px;top:-10px;}
}
@media screen and (max-width:1259px){
	#menu2{width:100%;}
	#menu2 .hg1 .h1{text-align:left;}
	#menu2 ul{gap:10px;}
	#menu2 li{flex: 1}	
	#menu2 li a{padding:30px 0 20px}
}
@media screen and (max-width:670px){
	#menu2 .hg1 .h1{text-align:center;}
	#menu2 li{ flex: 1 1 calc(50% - 30px);aspect-ratio:auto;}
	#menu2 li a{font-size:15px;font-weight:500}	
}


#mainbody3>.container{padding:80px 0 0}
#mainbody3 .hg1 h2.h1{text-align:center;}
@media screen and (max-width:767px){
	#mainbody3>.container{padding:50px 0 0}
}

#tabs2{margin:40px 0;}
#tabs2 ul{display:flex;text-align:center;flex-wrap:wrap;justify-content:center;gap:10px;text-align:center;}
#tabs2 ul li a{display:block;color:#000;padding:20px 30px;border-radius:30px;background:#f6f8fb}
#tabs2 ul li a span{display:inline-block;position:relative;}
#tabs2 ul li.on a{color:#fff;background:#2634a4;}
#tabs2 ul li.on a span:before{content:'';position:absolute;right:-10px;top:calc(50% - 20px);width:10px;height:10px;border-radius:100%;background:#ef4d74}

.tabs2panel1s{display:none}
.tabs2panel1s .datalist{margin:0 -15px}
.tabs2panel1s .item{padding:20px 15px;font-size:0;box-sizing:border-box;}
.tabs2panel1s .item a{position:relative;display:block;transition:all 0.3s ease;}
.tabs2panel1s .item a .f1{width:100%;height:auto;aspect-ratio: 59 / 40;background:#eee;border-radius:20px;overflow:hidden;transition:all 0.3s ease;}
.tabs2panel1s .item a .f1 img{width:100%;height:100%;object-fit:cover;object-position:top;}
.tabs2panel1s .item a .cate{position:absolute;left:20px;top:20px;font-size:14px;color:#fff;background:#000;border-radius:30px;padding:5px 10px}
.tabs2panel1s .item a .tg1 .t1{display:block;margin:30px 0;font-size:26px;color:#000;font-weight:600;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.tabs2panel1s .item a .tg1 .t2{display:block;margin:3px 0;color:#000;font-weight:400;font-size:16px;}
.tabs2panel1s .item a .tg1 .t2:before{content:'';display:inline-block;width:5px;height:5px;vertical-align:middle;border-radius:100%;background:#000;margin-right:5px;}
.tabs2panel1s .item a:hover{margin:-20px 0 0}
.tabs2panel1s .item a:hover .f1{box-shadow:5px 5px 20px rgba(0,0,0,.3);}
.tabs2panel1s .item a .cate[data-category="체육시설"]{background-color:#d4344f}
.tabs2panel1s .item a .cate[data-category="시설대관"]{background-color:#1350ac}
.tabs2panel1s .item a .cate[data-category="교육강좌"]{background-color:#ff6c00}
.tabs2panel1s .item a .cate[data-category="체험견학"]{background-color:#4c2bad}
.tabs2panel1s .item a .cate[data-category="숙박/캠핑"]{background-color:#0b7a54}
.tabs2panel1s .menu{text-align:center;margin:30px 0 0}
.tabs2panel1s .menu .m.stop, .tabs2panel1s .menu .m.play{background:#000}
.tabs2panel1s .menu .m.stop:before, .tabs2panel1s .menu .m.stop:after{background:#fff}
.tabs2panel1s .menu .m.play:before{border-left-color:#fff;}
.tabs2panel1s .menu .progress {position:relative;display:inline-block;vertical-align:middle;width:1000px;height:3px;background:#e5e5e5;margin:-3px 70px 0 30px;}
.tabs2panel1s .menu .progress .bar {position:absolute;top:0;left:0;width:0;height:100%;background:#000;transition:width .35s ease .3s}
@media screen and (max-width:1350px){
	.tabs2panel1s .menu .progress {width:400px;}
}
@media screen and (max-width:800px){
	#tabs2 ul {gap:5px}
	#tabs2 ul li a{font-size:15px;padding:10px 20px;border-radius:5px;}
}
@media screen and (max-width:767px){
	#tabs2{margin:20px 0 10px}
	.tabs2panel1s .item a .tg1 .t1{font-size:20px;margin:20px 0 10px}
	.tabs2panel1s .menu{margin:20px 0 0}
	.tabs2panel1s .menu .progress {display:none}
}
@media screen and (max-width:650px){
	#tabs2 ul li{ flex: 1 1 calc(33.333% - 5px);}
	#tabs2 ul li.on a span:before{top:calc(50% - 25px)}
}

#mainbody4>.container{display:flex;flex-wrap:wrap;padding:120px 0 100px}
#mainbody4>.container>div{flex:0 0 50%;min-width:0}
@media screen and (max-width:1469px){
	#mainbody4>.container{display:block;padding:50px 0}
}

#culture1{position:relative;}
#culture1 .hg1{display:none;}
#culture1:before{content:'';position:absolute;right:-20px;top:calc(50% - 350px);width:700px;height:700px;border-radius:100%;box-sizing:border-box;border:60px solid #f5f8fd}
#culture1 .item{font-size:0;}
#culture1 .item a{display:flex;gap:70px;align-items:flex-start;padding:0 0 30px 0;margin-right:80px}
#culture1 .item a .f1{position:relative;border-radius:30px;box-shadow:10px 10px 20px rgba(0,0,0,.1);}
#culture1 .item a .f1 .f1p1{width:340px;height:auto;border-radius:30px;background:#f7f7f7;overflow:hidden;}
#culture1 .item a .f1 .f1p1 img{width:100%;height:100%;object-fit:cover;object-position:top;}
#culture1 .item a .f1 .ic1{position:absolute;right:-40px;bottom:140px;width:100px;height:100px;background:linear-gradient(to bottom, #ea486f 0%, #c42147 100%);border-radius:100%;opacity:0;transition:all 0.5s ease;}
#culture1 .item a .f1 .ic1:before{content:'';display:block;position:absolute;left:calc(50% - 10px);top:calc(50% - 14px);width:28px;height:28px;background:url(../../img/main/main_sprite2.png) no-repeat -260px 0 / 287px 55px;}
#culture1 .item a .tg1{padding:45px 0 0;}
#culture1 .item a .tg1 .cate{display:inline-block;font-size:14px;color:#fff;background:#000;border-radius:30px;padding:5px 15px}
#culture1 .item a .tg1 .cate[data-category='콘서트']{background:#3c61db;}
#culture1 .item a .tg1 .t1{display:block;margin:20px 0 60px;font-size:30px;font-weight:700;color:#000;word-break:keep-all;}
#culture1 .item a .tg1 .t2{position:relative;margin:0 0 5px 10px;padding-left:10px;color:#000;font-weight:400;font-size:16px;}
#culture1 .item a .tg1 .t2:before{content:'';display:block;position:absolute;left:0;top:8px;width:5px;height:5px;border-radius:100%;background:#000;}
#culture1 .item a:hover .f1 .ic1{opacity:1;}
#culture1 .menu{position:absolute;left:420px;bottom:100px;}
#culture1 .menu .m.stop, #culture1 .menu .m.play{background:#000}
#culture1 .menu .m.stop:before, #culture1 .menu .m.stop:after{background:#fff}
#culture1 .menu .m.play:before{border-left-color:#fff;}
@media screen and (max-width:1469px){
	#culture1{width:100%;}
	#culture1:before{display:none}
	#culture1 .item a{margin:0;justify-content:center}
	#culture1 .menu{position:absolute;left:45%;bottom:100px;}
}
@media screen and (max-width:1259px){
	#culture1 .item a{gap:30px}
	#culture1 .item a:hover .f1 .ic1{opacity:0;}
}
@media screen and (max-width:767px){
	#culture1 .hg1{display:block;margin-bottom:20px;}
	#culture1 .datalist{margin:0 -5px}
	#culture1 .item{padding:0 5px;box-sizing:border-box;}
	#culture1 .item a {position:relative;display:block;width:100%;padding:0;border-radius:30px;overflow:hidden}
	#culture1 .item a .f1{box-shadow:none}
	#culture1 .item a .f1 .f1p1{width:100%;aspect-ratio: 17 / 24;margin:0 auto}
	#culture1 .item a .tg1{position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,0.8);padding:20px;}
	#culture1 .item a .tg1 .t1{color:#fff;font-size:18px;margin:10px 0;height:50px;}
	#culture1 .item a .tg1 .t2{color:#f7f7f7;font-size:14px;margin:0;}
	#culture1 .item a .tg1 .t2:before{background:#f7f7f7;}
	#culture1 .menu{left:auto;right:0;bottom:auto;top:-20px}
}




#apply1{position:relative;padding:45px 0 0 50px;box-sizing:border-box;}
#apply1 .hg1 h2.h1{padding-left:20px;margin-bottom:30px}
#apply1 .datalist{margin:0 -15px;}
#apply1 .item{padding:0 15px;box-sizing:border-box;font-size:0;}
#apply1 .item a{position:relative;display:block;background:#fff;padding:50px;border-radius:20px;aspect-ratio:1 / 1;z-index:1}
#apply1 .item a:before{content:'';display:block;position:absolute;left:0;right:0;top:0;bottom:0;border:1px solid #ddd;border-radius:20px;z-index:0;transition:all 0.5s ease;}
#apply1 .item a .cate{display:inline-block;font-size:14px;color:#fff;background:#000;border-radius:30px;padding:5px 15px}
#apply1 .item a .t1{display:block;height:70px;margin:15px 0 40px;font-size:24px;font-weight:600;color:#000;word-break:keep-all;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2; -webkit-box-orient:vertical;}
#apply1 .item a .t2{position:relative;margin:0 0 5px 10px;color:#000;font-weight:400;letter-spacing:0;font-size:14px}
#apply1 .item a .t2 span{display:block;color:#000;font-weight:500;padding-left:24px;margin-bottom:5px;font-size:16px;}
#apply1 .item a .t2 span:before{content:'';display:block;position:absolute;left:0;top:3px;width:18px;height:18px;background:url(../../img/main/main_sprite2.png) no-repeat -260px -30px / 287px 55px;}
#apply1 .menu{position:absolute;right:20px;top:30px;}
#apply1 .item a:hover:before{border:3px solid #062231}
#apply1 .item a .cate[data-category='예비군 수송버스']{background:#08146e;}
#apply1 .item a .cate[data-category='보건소']{background:#2ab32d;}
@media screen and (max-width:1469px){
	#apply1{padding:0;margin:50px 0 0}
	#apply1 .hg1 h2.h1{padding:0}
	#apply1 .datalist{margin:0 -5px;}
	#apply1 .item{padding:0 5px;}
	#apply1 .item a{aspect-ratio:auto;padding:30px;}
	#apply1 .menu{right:0;top:-10px}
}
@media screen and (max-width:767px){
	#apply1 .hg1 h2.h1{margin-bottom:20px}
}
@media screen and (max-width:1000px){
	#apply1 .item a{padding:20px;}
	#apply1 .item a .t1{font-size:20px;height:55px;}
}

#mainbody5>.container{display:flex;flex-wrap:wrap;padding-bottom:150px}
@media screen and (max-width:1259px){
	#mainbody5>.container{display:block;}
}

/* 공지사항 */
#notice1 {position:relative;width:950px;margin-top:50px;}
#notice1 .datalist {margin:20px 0 0;border-top:2px solid #000;border-bottom:2px solid #000;}
#notice1 .datalist li {border-top:1px solid #d7e0e9;padding:19px 10px 17px 20px;}
#notice1 .datalist li a {position:relative;display:block;padding:5px 100px 5px 0;line-height:1.1}
#notice1 .datalist li a .t1{position:absolute;right:0;top:5px;color:#949494;font-size:15px;letter-spacing:0}
#notice1 .datalist li a .t1 .yy:after{content:'.';}
#notice1 .datalist li a .t1 .mm:after{content:'.';}
#notice1 .datalist li a .t2{position:relative;padding-left:135px;}
#notice1 .datalist li a .t2 .title{display:inline-block;vertical-align:top;font-size:18px;color:#333;max-width:calc(100% - 135px);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
#notice1 .datalist li a .t2 .part{position:absolute;left:0;top:0;display:inline-block;width:130px;height:30px;text-align:center;line-height:30px;background:#f3f6fc;border-radius:20px;font-size:14px;color:#333;font-weight:400;}
#notice1 .datalist li a:hover .t2 .title, #notice1 .datalist li a:focus .t2 .title {text-decoration:underline}
#notice1 .datalist li a .new {display:inline-block;vertical-align:top;width:27px;height:27px;text-indent:-9999px;background:#fe4009 url(../../img/main/main_sprite.png) no-repeat -60px 0;background-size:87px 28px;margin:-7px 0 0 8px;border-radius:50%;}
#notice1 .datalist li a .t3{display:none;}
@media screen and (min-width:768px){
	#notice1 .datalist li:first-child{padding:0}
	#notice1 .datalist li:first-child a{padding:25px 30px 25px 170px;box-sizing:border-box;}
	#notice1 .datalist li:first-child a .t1{left:30px;right:auto;top:calc(50% - 53px);color:#000;font-size:14px;font-weight:500;display:block;text-align:center;width:106px;height:106px;padding-top:65px;border-radius:100%;background:#fff;box-sizing:border-box;}
	#notice1 .datalist li:first-child a .t1 .mm:after{display:none}
	#notice1 .datalist li:first-child a .t1 .dd{position:absolute;left:0;right:0;top:25px;color:#000;font-weight:900;font-size:37px;}
	#notice1 .datalist li:first-child a .t2{width:100%;box-sizing:border-box;}
	#notice1 .datalist li:first-child a .t2 .title{color:#000;font-weight:600;letter-spacing:0;line-height:26px;font-size:20px;max-width:calc(100% - 140px);margin-left:5px;margin-bottom:20px;}
	#notice1 .datalist li:first-child a .t3{margin-top:10px;line-height:1.3;font-size:15px;color:#555;height:40px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2; -webkit-box-orient:vertical;}
	#notice1 .datalist li:first-child a .new{flex-shrink:0;margin-top:0;}
}
#notice1 .menu{position:absolute;right:0;top:-10px}
@media screen and (max-width:1580px){
	#notice1 {width:calc(100% - 600px);}
}
@media screen and (max-width:1259px){
	#notice1 {width:100%;margin-top:0;}
}
@media screen and (max-width:540px){
	#notice1 .datalist li{padding:0}
	#notice1 .datalist li a{padding:10px 0 45px;}
	#notice1 .datalist li a .t1{top:auto;left:0;border-top:1px dashed #ddd;bottom:10px;text-align:right;padding-top:5px;}
	#notice1 .datalist li a .t2{padding-left:105px;}
	#notice1 .datalist li a .t2 .title{font-size:16px;line-height:25px;max-width:calc(100% - 110px)}
	#notice1 .datalist li a .t2 .part{width:100px;font-size:13px;}
}


/* 팝업존 */
#ppr1 {position:relative;width:560px;margin-left:auto;}
#ppr1 .datalist{margin:0;font-size:0}
#ppr1 .datalist .item a {display:block;}
#ppr1 .datalist .item img {border-radius:20px 20px 100px 20px}
#ppr1 .menu{position:absolute;left:0;bottom:0;padding:20px 30px 0 0;height:50px;background:#fff;border-radius:0 50px 0 0;box-sizing:border-box;}
#ppr1 .menu *{display:inline-block;vertical-align:middle;}
#ppr1 .menu .h1{color:#000;font-size:20px;font-weight:800;letter-spacing:0}
#ppr1 .menu .mNum{margin:0 20px;}
#ppr1 .menu .mNum .on{color:#000;font-weight:700}
#ppr1 .menu .mNum .t1{margin:0 3px}
#ppr1 .menu .m{background:transparent;width:20px;height:20px;margin:0 5px}
@media screen and (max-width:1259px){
	#ppr1 {max-width:560px;width:100%;margin:50px auto 0;}
	#ppr1 img{width:100%}
}
@media screen and (max-width:480px){
	#ppr1{padding:40px 0 0;}
	#ppr1 .menu{display:flex;left:0;right:0;top:0;bottom:auto;height:auto;padding:0;background:#fff;border-radius:0;}
	#ppr1 .menu .mNum{margin-left:auto;}
}