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

/* 공통 */
:focus-visible {outline-offset:2px}
[id*=mainbody] {position:relative;width:100%;min-height:900px;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;box-sizing:border-box;overflow-x:hidden;}
[id*=mainbody]>.container {display:table-cell;vertical-align:middle;}
[id*=mainbody] .wrap1 {position:relative;max-width:1700px;width:100%;height:100%;margin:auto;box-sizing:border-box;padding-left:50px;padding-right:50px;}
[id*=mainbody] .mousewheel1.scroll1 {position:absolute;bottom:40px;right:1%;width:80px;height:80px;background:url(../../img/inc/layout_sprite.png) no-repeat -326px 0 / auto 100px;box-shadow:5px 5px 20px rgba(0,0,0,.35);border-radius:100%;z-index:100;animation:iacts_scroll 1s linear infinite;transition:all .45s ease}
[id*=mainbody] .ht1 {font-size:64px;font-weight:700;color:#000;overflow:hidden;}
[id*=mainbody] .ht1 em:before {content:"#";display:inline-block;vertical-align:middle;margin-right:20px;margin-top:-15px;}
[id*=mainbody] .ht1 em {display:block;color:inherit}
[id*=mainbody] .ht2 {font-size:48px;line-height:58px;font-weight:500;}
[id*=mainbody] .ht3 {font-size:20px;line-height:36px;font-weight:400;}
[id*=mainbody] .img1list li {display:inline-block;vertical-align:top;margin-left:30px;max-width:300px;}
[id*=mainbody] .img1list li img {border-radius:20px;}
@media screen and (max-width:1748px){
	[id*=mainbody] .wrap1 {margin-left:24px;margin-right:24px;width:calc(100% - 48px)}
	[id*=mainbody] .ht1 {font-size:58px}
	[id*=mainbody] .ht2 {font-size:43px;}
	[id*=mainbody] .ht3 {font-size:19px;line-height:32px}
}
@media screen and (max-width:1548px){	
	[id*=mainbody] .ht1 {font-size:55px}
	[id*=mainbody] .ht2 {font-size:40px;} 
}
@media screen and (max-width:1448px){	
	[id*=mainbody] .ht1 {font-size:50px}
	[id*=mainbody] .ht2 {font-size:35px;} 
}
@media screen and (max-width:1259px){
	[id*=mainbody] {min-height:auto;}
	[id*=mainbody] .wrap1 {margin-left:16px;margin-right:16px;width:calc(100% - 32px);padding-left:0;padding-right:0}
	[id*=mainbody] .ht1 {font-size:46px}
	[id*=mainbody] .ht1 em:before {margin-right:15px}
	[id*=mainbody] .ht2 {font-size:30px;} 
	[id*=mainbody] .mousewheel1.scroll1 {width:72px;height:72px;background-size:auto 90px;background-position:-293px 0}
}
@media screen and (max-width:1024px){
	[id*=mainbody] .ht1 {font-size:42px}
	[id*=mainbody] .mousewheel1.scroll1 {width:64px;height:64px;background-size:auto 80px;background-position:-261px 0}	
}
@media screen and (max-width:999px){
	[id*=mainbody] .ht1 {font-size:38px}
	[id*=mainbody] .ht1 em:before {margin-top:-10px}
	[id*=mainbody] .ht2 {font-size:28px;} 
	[id*=mainbody] .ht3 {font-size:18px;line-height:30px}
	[id*=mainbody] .mousewheel1.scroll1 {width:56px;height:56px;background-size:auto 70px;background-position:-228px 0}	
	[id*=mainbody] .img1list li {margin-left:24px;}
}
@media screen and (max-width:768px){	
	[id*=mainbody] .ht1 {font-size:36px}
	[id*=mainbody] .ht2 {font-size:26px;} 
	[id*=mainbody] .ht3 {font-size:17px;line-height:28px}
	[id*=mainbody] .img1list li {max-width:240px;}
}
@media screen and (max-width:699px){
	[id*=mainbody] .ht1 {font-size:34px}
	[id*=mainbody] .ht1 em:before {margin-right:7px;margin-top:-7px;}
	[id*=mainbody] .ht2 {font-size:24px;} 
	[id*=mainbody] .ht3 {font-size:16px;line-height:26px}
}
@media screen and (max-width:599px){
	[id*=mainbody] .ht1 {font-size:32px}
	[id*=mainbody] .ht2 {font-size:22px;} 
	[id*=mainbody] .ht3 {font-size:16px;}
	[id*=mainbody] .mousewheel1.scroll1 {bottom:20px;width:40px;height:40px;background-size:auto 50px;background-position:-163px 0}		
}
@media screen and (max-width:499px){
	[id*=mainbody] .ht1 {font-size:28px}
	[id*=mainbody] .ht2 {font-size:20px;} 
	[id*=mainbody] .ht3 {font-size:15px;line-height:26px}	
}
@media screen and (max-width:399px){
	[id*=mainbody] .ht1 {font-size:24px}
	[id*=mainbody] .ht2 {font-size:18px;} 
	[id*=mainbody] .ht3 {line-height:24px}		
}

/* mainbody1 / 인트로 */
#mainbody1 {background-image:url(../../img/main/mbody1_bg.jpg);text-align:center;padding:180px 0}
#mainbody1 .hg1 {margin-bottom:85px;}
#mainbody1 .hg1 em {display:block;color:inherit}
#mainbody1 .hg1 .h1 {font-size:46px;font-weight:500;color:#000;}
#mainbody1 .hg1 .t1 {font-size:72px;font-weight:700;color:#000;}
#mainbody1 .hg1 .t1 span {color:#eb4050}
#mainbody1 .lst li {display:inline-block;vertical-align:top;filter:drop-shadow(0 4px 10px rgba(0,0,0,.3));}
#mainbody1 .lst li a {display:block;width:220px;height:220px;font-size:18px;font-weight:600;color:#fff;line-height:22px;padding-top:32px;margin:0 25px;box-sizing:border-box;transition:all .35s ease}
#mainbody1 .lst li a:before {content:"";display:block;width:132px;height:91px;background:url(../../img/main/main_sprite.png) no-repeat;background-size:1000px auto;margin:auto auto 15px;}
#mainbody1 .lst li a:focus-visible {outline-color:#000}
#mainbody1 .lst li a span {display:block;}
#mainbody1 .lst li.n1 a {background:#7d3ecb;border-radius:40px;}
#mainbody1 .lst li.n2 a {background:#ea3b8d;border-radius:100% 30px 100% 100%;}
#mainbody1 .lst li.n3 a {background:#EC6865;border-radius:20px 70px;text-shadow:0 0 10px rgba(230,51,47,.8)}
#mainbody1 .lst li.n4 a {background:#eb4050;border-radius:100% 100% 30px 30px}
#mainbody1 .lst li.n5 a {position:relative;background:url(../../img/main/mbody1_n5_bg.png) no-repeat 50% 50% / cover}
#mainbody1 .lst li.n1 a:before {background-position:0 0}
#mainbody1 .lst li.n2 a:before {background-position:-134px 0}
#mainbody1 .lst li.n3 a:before {background-position:-268px 0}
#mainbody1 .lst li.n4 a:before {background-position:-402px 0}
#mainbody1 .lst li.n5 a:before {background-position:-536px 0}
@media screen and (min-width:1260px){
	/* 스크롤 애니메이션 */
	#mainbody1 .hg1 .h1, 	#mainbody1 .hg1 .t1 {overflow:hidden;}
	#mainbody1 .hg1 .h1 em, #mainbody1 .hg1 .t1 em, #mainbody1 .lst li {opacity:0;}
	#mainbody1 .hg1 .h1 em, #mainbody1 .hg1 .t1 em {display:block;transform:translateY(110%);transition:all .4s ease;}
	#mainbody1 .lst li {transition:all .5s ease;}
 	#mainbody1.on .hg1 .h1 em, #mainbody1.on .hg1 .t1 em {opacity:1;transform:none;} 
	#mainbody1.on .lst li {opacity:1;}
	#mainbody1.on .lst li:nth-child(1) {animation:bounce-in-top .8s .2s both;}
	#mainbody1.on .lst li:nth-child(2) {animation:bounce-in-top .85s .25s both;}
	#mainbody1.on .lst li:nth-child(3) {animation:bounce-in-top .9s .3s both;}
	#mainbody1.on .lst li:nth-child(4) {animation:bounce-in-top .95s .35s both;}
	#mainbody1.on .lst li:nth-child(5) {animation:bounce-in-top 1s .4s both;}
	#mainbody1 .lst li a:hover, #mainbody1 .lst li a:focus {transform:scale(1.2);border-radius:100%;margin:0 30px}
}
@media screen and (max-width:1399px){
	#mainbody1 .lst li a {margin:0 15px;}
}
@media screen and (max-width:1299px){
	#mainbody1 .lst li a {margin:0 10px;}
}
@media screen and (max-width:1259px){
	#mainbody1 {padding:162px 16px;display:table;width:100%;height:100%;}
	#mainbody1 .wrap1 {display:table-cell;vertical-align:middle;}
	#mainbody1 .hg1 {margin-bottom:55px}
	#mainbody1 .hg1 .h1 {font-size:41px}
	#mainbody1 .hg1 .t1 {font-size:65px}
	#mainbody1 .lst li {width:calc(33.33% - 4px)}
	#mainbody1 .lst li a {margin:5px auto}
}
@media screen and (max-width:1024px){
	#mainbody1 {padding:130px 16px}
	#mainbody1 .hg1 {margin-bottom:68px}
	#mainbody1 .hg1 .h1 {font-size:37px}
	#mainbody1 .hg1 .t1 {font-size:58px}
	#mainbody1 .lst li a {font-size:17px;margin:5px auto;padding-top:29px;width:200px;height:200px;}
	#mainbody1 .lst li a:before {width:119px;height:82px;background-size:900px auto;margin-bottom:10px}
	#mainbody1 .lst li.n2 a:before {background-position:-121px 0}
	#mainbody1 .lst li.n3 a:before {background-position:-241px 0}
	#mainbody1 .lst li.n4 a:before {background-position:-362px 0}
	#mainbody1 .lst li.n5 a:before {background-position:-482px 0}	
}
@media screen and (max-width:999px){
	#mainbody1 {padding-top:120px;padding-bottom:80px;}
	#mainbody1 .hg1 {margin-bottom:50px}
	#mainbody1 .hg1 .h1 {font-size:32px}
	#mainbody1 .hg1 .t1 {font-size:50px}		
}
@media screen and (max-width:768px){
	#mainbody1 {padding-bottom:60px;}
	#mainbody1 .hg1 {margin-bottom:45px}
	#mainbody1 .hg1 .h1 {font-size:30px}
	#mainbody1 .hg1 .t1 {font-size:43px}	
}
@media screen and (max-width:699px){
	#mainbody1 .hg1 {margin-bottom:35px}
	#mainbody1 .hg1 .h1 {font-size:28px;}
	#mainbody1 .hg1 .t1 {font-size:40px}
	#mainbody1 .lst li a {width:calc(100% - 10px);height:auto;padding:22px 10px;margin:5px}
	#mainbody1 .lst li.n1 a, #mainbody1 .lst li.n2 a, #mainbody1 .lst li.n3 a, #mainbody1 .lst li.n4 a, #mainbody1 .lst li.n5 a {border-radius:30px;}
	#mainbody1 .lst li.n5 a {background-color:#211b8f}
	#mainbody1 .lst li a:before {width:106px;height:73px;background-size:800px auto;margin-bottom:10px}
	#mainbody1 .lst li.n2 a:before {background-position:-107px 0}
	#mainbody1 .lst li.n3 a:before {background-position:-214px 0}
	#mainbody1 .lst li.n4 a:before {background-position:-322px 0}
	#mainbody1 .lst li.n5 a:before {background-position:-429px 0}	
}
@media screen and (max-width:599px){
	#mainbody1 {padding-top:100px;}
	#mainbody1 .hg1 .h1 {font-size:24px;}
	#mainbody1 .hg1 .t1 {font-size:36px}
	#mainbody1 .lst li {width:calc(50% - 4px)}
	#mainbody1 .lst li a {font-size:16px;padding-top:10px;padding-bottom:13px;margin:3px 1px;width:calc(100% - 2px);}
	#mainbody1 .lst li.n1 a, #mainbody1 .lst li.n2 a, #mainbody1 .lst li.n3 a, #mainbody1 .lst li.n4 a, #mainbody1 .lst li.n5 a {border-radius:40px;}
	#mainbody1 .lst li a:before {width:92px;height:64px;background-size:700px auto;margin-bottom:4px}
	#mainbody1 .lst li.n2 a:before {background-position:-94px 0}
	#mainbody1 .lst li.n3 a:before {background-position:-188px 0}
	#mainbody1 .lst li.n4 a:before {background-position:-281px 0}
	#mainbody1 .lst li.n5 a:before {background-position:-375px 0}	
}
@media screen and (max-width:499px){
	#mainbody1 .hg1 {margin-bottom:20px}
	#mainbody1 .hg1 .h1 {font-size:22px;}
	#mainbody1 .hg1 .t1 {font-size:30px;margin-top:3px}	
}
@media screen and (max-width:399px){
	#mainbody1 {padding-top:80px;padding-bottom:40px}
	#mainbody1 .hg1 .h1 {font-size:20px;}
	#mainbody1 .hg1 .t1 {font-size:24px;line-height:1.2}	
	#mainbody1 .lst {max-width:275px;margin:auto;}
	#mainbody1 .lst li {text-align:left;width:100%;}
	#mainbody1 .lst li a {position:relative;font-size:15px;line-height:20px;padding:17px 20px 17px 95px;border-radius:9999px;margin:4px 0;}
	#mainbody1 .lst li a span {display:inline}
	#mainbody1 .lst li a:before {position:absolute;top:50%;left:15px;width:66px;height:46px;background-size:500px auto;margin:-23px 0 0}
	#mainbody1 .lst li.n2 a:before {background-position:-67px 0}
	#mainbody1 .lst li.n3 a:before {background-position:-134px 0}
	#mainbody1 .lst li.n4 a:before {background-position:-201px 0}
	#mainbody1 .lst li.n5 a:before {background-position:-268px 0}		
}
@media screen and (max-width:349px){
	#mainbody1 {padding-top:90px;padding-bottom:30px}
	#mainbody1 .hg1 {margin-bottom:20px}
}

/* mainbody2 / 강구안 디지털 사이니지 */
#mainbody2 {padding-top:180px}
#mainbody2 .wrap1 {padding-left:950px;padding-right:0}
#mainbody2 .wrap1 .tg1 {padding-top:50px;padding-left:70px;}
#mainbody2 .wrap1 .tg1 .ht1 {margin-left:-70px;}
#mainbody2 .wrap1 .tg1 .ht2 {color:#000;margin:50px 0 60px}
#mainbody2 .wrap1 .tg1 .ht3 {color:#000;margin-bottom:50px;}
#mainbody2 .wrap1 .tg1 span {display:block;}
#mainbody2 .wrap1 .tg1 .b1.more {position:relative;display:block;width:200px;height:60px;line-height:60px;font-size:18px;color:#000;padding:0 40px;box-sizing:border-box;/* transition:all .35s ease; */z-index:1}
#mainbody2 .wrap1 .tg1 .b1.more:before, #mainbody2 .wrap1 .tg1 .b1.more:after {position:absolute;content:"";display:block;}
#mainbody2 .wrap1 .tg1 .b1.more:before {top:0;left:0;width:100%;height:100%;z-index:-1;border:2px solid #000;border-radius:9999px;box-sizing:border-box;transition:all .35s ease}
#mainbody2 .wrap1 .tg1 .b1.more:after {top:50%;right:35px;width:24px;height:11px;background:url(../../img/main/main_sprite.png) no-repeat -754px 0 / 1000px auto;margin-top:-5.5px;transition:right .4s ease}
#vod1 {position:absolute;top:0;left:0;width:850px;height:640px;}
#vod1 dt.tab {position:absolute;right:-50px;bottom:90px;}
#vod1 dt.tab:nth-of-type(2) {bottom:40px;}
#vod1 dt.tab a {display:block;width:40px;height:40px;background:url(../../img/main/main_sprite.png) no-repeat -670px 0 / 1000px auto;border-radius:100%;text-indent:-9999px;}
#vod1 dt.tab:nth-of-type(2) a {background-position:-670px -42px}
#vod1 dt.tab.on a {background-color:#EB4050;background-position:-712px 0;box-shadow:5px 5px 15px rgba(0,0,0,.15)}
#vod1 dt.tab:nth-of-type(2).on a {background-position:-712px -42px}
#vod1 dd.cont {display:none;position:relative;width:100%;height:0;padding-bottom:75.29%;overflow:hidden;background:#000;border-radius:40px;}
#vod1 dd.cont.on {display:block !important;}
#vod1 dd.cont video {position:absolute;top:0;left:0;width:100%;height:100%;}
@media screen and (min-width:1260px){
	#mainbody2 .wrap1 .tg1 .ht2, #mainbody2 .wrap1 .tg1 .ht3, #mainbody2 .wrap1 .tg1 .b1, #vod1 dt.tab, #vod1 dd.cont {opacity:0;transition:opacity .45s ease, transform .45s ease}
	#mainbody2 .wrap1 .tg1 .ht2, #mainbody2 .wrap1 .tg1 .ht3, #mainbody2 .wrap1 .tg1 .b1 {transform:translateY(50px);}
	#mainbody2 .wrap1 .tg1 .ht1 em {transform:translateY(110%);transition:all .4s ease;opacity:0;}
	#vod1 dt.tab {transition:all .25s ease}
	#vod1 dd.cont {transform:translateX(50px);}
	#mainbody2.on .wrap1 .tg1 .ht1 em {opacity:1;transform:none;}
	#mainbody2.on #vod1 dd.cont {opacity:1;/* transition-delay:.15s; */transform:none;}
	#mainbody2.on #vod1 dt.tab {opacity:1;transform:none;}
	#mainbody2.on #vod1 dt.tab:nth-of-type(1) {animation:bounce-in-fwd 1s .35s both}
	#mainbody2.on #vod1 dt.tab:nth-of-type(2) {animation:bounce-in-fwd 1s .4s both}
	#mainbody2.on .wrap1 .tg1 .ht2 {opacity:1;transition-delay:.15s;transform:none;}
	#mainbody2.on .wrap1 .tg1 .ht3 {opacity:1;transition-delay:.25s;transform:none;}
	#mainbody2.on .wrap1 .tg1 .b1 {opacity:1;transition-delay:.35s;transform:none;}
	#mainbody2.on .wrap1 .tg1 .b1:hover, #mainbody2.on .wrap1 .tg1 .b1:focus {transition-delay:0s}
	#mainbody2 .wrap1 .tg1 .b1.more:hover, #mainbody2 .wrap1 .tg1 .b1.more:focus {color:#fff;border:0;}
	#mainbody2 .wrap1 .tg1 .b1.more:hover:before, #mainbody2 .wrap1 .tg1 .b1.more:focus:before {border-color:transparent;background-color:#eb4050;box-shadow:5px 5px 15px rgba(0,0,0,.2)}
	#mainbody2 .wrap1 .tg1 .b1.more:hover:after, #mainbody2 .wrap1 .tg1 .b1.more:focus:after {right:30px;background-position:-780px 0}
}
@media screen and (max-width:1748px){
	#mainbody2 .wrap1 {padding-left:855px}
	#vod1 {width:808px;height:608px}
}
@media screen and (max-width:1548px){
	#mainbody2 .wrap1 {padding-left:785px}
	#mainbody2 .wrap1 .tg1 {padding-top:40px;padding-left:60px}
	#mainbody2 .wrap1 .tg1 .ht2 {margin-top:35px;margin-bottom:45px;}
	#mainbody2 .wrap1 .tg1 .ht3 {margin-bottom:40px}
	#mainbody2 .wrap1 .tg1 span {display:inline}
	#vod1 {width:723px;height:544px}
}
@media screen and (max-width:1448px){
	#mainbody2 .wrap1 {padding-left:730px}
	#vod1 {width:680px;height:512px;}
	#mainbody2 .wrap1 .tg1 {padding-left:40px}
	#mainbody2 .wrap1 .tg1 .ht1 {margin-left:-60px}
	#mainbody2 .wrap1 .tg1 .ht2 {line-height:1.3;word-break:keep-all}
}
@media screen and (max-width:1399px){
	#mainbody2 .wrap1 {padding-left:700px}
	#vod1 {width:638px;height:480px;}
	#mainbody2 .wrap1 .tg1 {padding-left:40px;padding-top:30px}
	#mainbody2 .wrap1 .tg1 .ht1 {margin-left:-60px}
	#mainbody2 .wrap1 .tg1 .ht2 {line-height:1.3;word-break:keep-all}
}
@media screen and (max-width:1299px){
	#mainbody2 .wrap1 {padding-left:650px}
	#vod1 {width:595px;height:448px;}
	#mainbody2 .wrap1 .tg1 {padding-top:15px}
	#mainbody2 .wrap1 .tg1 .ht2 {margin-top:20px;margin-bottom:35px}
	#mainbody2 .wrap1 .tg1 .ht3 {margin-bottom:30px}
}
@media screen and (max-width:1259px){
	#mainbody2 {display:block;padding-top:120px;padding-bottom:70px}
	#mainbody2 .wrap1 {display:block;padding-left:0}	
	#vod1 {position:relative;top:auto;left:auto;width:595px;height:448px;margin:20px auto auto;padding-left:40px}
	#mainbody2 .wrap1 .tg1 {text-align:center;padding:40px 0 0}
	#mainbody2 .wrap1 .tg1 .ht1 {margin-left:0}
	#mainbody2 .wrap1 .tg1 .ht2 {margin-top:15px;margin-bottom:25px;}
	#mainbody2 .wrap1 .tg1 .ht3 {margin-bottom:25px;word-break:keep-all}
	#mainbody2 .wrap1 .tg1 .b1.more {text-align:left;margin:auto;height:58px;line-height:58px;}
}
@media screen and (max-width:768px){
	#mainbody2 {padding-top:110px;padding-bottom:60px;}
	#vod1 {width:510px;height:384px;}
}
@media screen and (max-width:699px){
	#vod1 {max-width:510px;width:100%;height:auto;padding-left:0;margin-top:0;margin-bottom:30px;}
	#vod1 dt.tab {bottom:-50px;right:50%;z-index:1;}
	#vod1 dt.tab:nth-of-type(1) {bottom:-50px;margin-right:1px}
	#vod1 dt.tab:nth-of-type(2) {bottom:-50px;margin-right:-41px;}
	#mainbody2 .wrap1 .tg1 .b1.more {width:160px;height:55px;line-height:55px;font-size:17px;padding:0 20px}
	#mainbody2 .wrap1 .tg1 .b1.more:after {right:20px}
}
@media screen and (max-width:599px){
	#mainbody2 {padding-top:100px;padding-bottom:60px;}
	#mainbody2 .wrap1 .tg1 .b1.more {height:50px;line-height:52px;font-size:16px;}
}
@media screen and (max-width:499px){
	#mainbody2 .wrap1 .tg1 .b1.more {height:50px;line-height:50px;font-size:16px;}
}
@media screen and (max-width:399px){
	#mainbody2 {padding-top:80px;padding-bottom:40px;}
	#mainbody2 .wrap1 .tg1 .ht2 {margin-bottom:20px}
	#mainbody2 .wrap1 .tg1 .b1.more {width:140px;height:46px;line-height:46px;font-size:15px;padding:0 18px;}
	#mainbody2 .wrap1 .tg1 .b1.more:after {right:16px}
}

/* mainbody3 / 게임형 미션투어 */
#mainbody3 {background-image:url(../../img/main/mbody3_bg.jpg);min-height:auto;padding:120px 24px;}
#mainbody3 .ht1 {color:#fff;text-align:center;}
/* fcard1 */
#fcard1 {opacity:1;transition:opacity .5s;padding-top:5px;max-width:1600px;margin:auto;}
#fcard1 .datalist {perspective:600px;margin-top:30px;margin-left:auto;margin-right:auto;}
#fcard1 .datalist .item {position:relative;transform-origin:top;background:#fff;padding:60px;border-radius:30px;min-height:520px;box-sizing:border-box;box-shadow:10px 10px 50px rgba(0,0,0,.15)}
#fcard1 .datalist .item .tg1 {margin-right:700px;padding:15px 0;color:#000}
#fcard1 .datalist .item .tg1 .h1 {display:block;font-size:20px;font-weight:500;margin-bottom:30px}
#fcard1 .datalist .item .tg1 .h1 span {font-size:42px;font-weight:700;display:block;margin-top:5px}
#fcard1 .datalist .item .tg1 .st1 {display:block;font-size:20px;font-weight:700;color:#000;margin-bottom:15px}
#fcard1 .datalist .item .tg1 .t1 {margin:0 0 30px;font-size:18px;font-weight:400;line-height:30px;word-break:keep-all}
#fcard1 .datalist .item .tg1 .btns a {display:inline-block;vertical-align:top;width:200px;height:60px;line-height:56px;border:2px solid #000;border-radius:9999px;text-align:center;font-size:18px;color:#000;font-weight:500;margin-right:10px;transition:all .35s ease;box-sizing:border-box;}
#fcard1 .datalist .item .tg1 .btns a:hover, #fcard1 .datalist .item .tg1 .btns a:focus {border-color:transparent;background-color:#eb4050;color:#fff;box-shadow:5px 5px 15px rgba(0,0,0,.2)}
#fcard1 .datalist .item .tg1 .btns a:before {content:"";display:inline-block;vertical-align:middle;width:28px;height:22px;background:url(../../img/main/main_sprite.png) no-repeat;background-size:1000px auto;margin-top:-2px;margin-right:10px;}
#fcard1 .datalist .item .tg1 .btns a.apple:before {background-position:-754px -41px}
#fcard1 .datalist .item .tg1 .btns a.google:before {background-position:-784px -41px}
#fcard1 .datalist .item .tg1 .btns a.apple:hover:before, #fcard1 .datalist .item .tg1 .btns a.apple:focus:before {background-position:-754px -65px}
#fcard1 .datalist .item .tg1 .btns a.google:hover:before, #fcard1 .datalist .item .tg1 .btns a.google:focus:before {background-position:-784px -65px}
#fcard1 .datalist .item .tg1 .btns a.more {text-align:center;}
#fcard1 .datalist .item .tg1 .btns a.more:before {display:none;}
#fcard1 .datalist .item .tg1 .btns a.more:after {content:"";display:inline-block;vertical-align:middle;width:24px;height:11px;background:url(../../img/main/main_sprite.png) no-repeat -754px 0 / 1000px auto;margin-top:-5.5px;margin-left:20px;}
#fcard1 .datalist .item .tg1 .btns a.more:hover:after, #mainbody2 .wrap1 .tg1 .b1.more:focus:after {background-position:-780px 0}
#fcard1 .datalist .item .f1 {position:absolute;top:60px;right:60px;border-radius:20px;width:570px;height:400px;overflow:hidden;}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	#fcard1 .datalist {opacity:0;transition:all .6s ease}
	#mainbody3.on #fcard1 .datalist {opacity:1;transition-delay:.8s;}
	#mainbody3.on #fcard1 .datalist:nth-of-type(2) {transition-delay:.9s;}
	#mainbody3.on #fcard1 .datalist:nth-of-type(3) {opacity:1;transition-delay:1s;}
}
@media screen and (min-width:1260px){
	#mainbody3 {scroll-snap-type:none;overflow:auto;}
	#mainbody3 .ht1 em {opacity:0;transition:all .4s ease;transform:translateY(110%);}
	#fcard1 .pin-spacer {opacity:0;transition:all .4s ease}
	#mainbody3.on .ht1 em {opacity:1;transform:none;}
	#mainbody3.on #fcard1 .pin-spacer {opacity:1;transition-delay:.3s;}
	#mainbody3.on #fcard1 .pin-spacer:nth-of-type(2) {transition-delay:.35s;}
	#mainbody3.on #fcard1 .pin-spacer:nth-of-type(3) {transition-delay:.4s;}
}
@media screen and (max-width:1748px){
	#fcard1 .datalist {perspective:540px;}
	#fcard1 .datalist .item {padding-left:50px;padding-right:50px;min-height:480px;}
	#fcard1 .datalist .item .tg1 {margin-right:540px}
	#fcard1 .datalist .item .tg1 .h1 span {font-size:40px;}
	#fcard1 .datalist .item .tg1 .t1 {margin-right:50px;}
	#fcard1 .datalist .item .f1 {top:70px;right:50px;width:542px;height:380px;}
}
@media screen and (max-width:1449px){
	#fcard1 .datalist .item .f1 {width:513px;height:360px;}
	#fcard1 .datalist .item .tg1 .h1 span {font-size:36px;}
	#fcard1 .datalist .item .tg1 .t1 {font-size:17px;line-height:28px}
	#fcard1 .datalist .item .tg1 .btns a {width:180px;height:54px;line-height:50px;font-size:17px;}
}
@media screen and (max-width:1299px){
	#fcard1 .datalist {perspective:500px;}
	#fcard1 .datalist .item {padding:50px 40px 35px;}
	#fcard1 .datalist .item .f1 {right:40px}	
}
@media screen and (max-width:1259px){
	#mainbody3 {padding-left:16px;padding-right:16px;}
	#mainbody3 .ht1 {margin-bottom:40px;}
	#fcard1 .datalist {margin-top:0;perspective:none}
	#fcard1 .datalist .item {min-height:auto}
	#fcard1 .datalist .item .tg1 {margin-right:455px;padding:0}
	#fcard1 .datalist .item .tg1 .h1 {font-size:18px;margin-bottom:25px}
	#fcard1 .datalist .item .tg1 .h1 span {font-size:32px;}
	#fcard1 .datalist .item .tg1 .st1 {font-size:18px;}
	#fcard1 .datalist .item .tg1 .t1 {font-size:16px;line-height:26px}
	#fcard1 .datalist .item .tg1 .t1 br {display:none}
	#fcard1 .datalist .item .tg1 .btns a {font-size:16px;width:160px;height:50px;line-height:46px}
	#fcard1 .datalist .item .f1 {top:50%;width:456px;height:320px;margin-top:-160px;}
	#fcard1 .slick-dots {text-align:center;padding-top:25px;}
	#fcard1 .slick-dots * {display:inline-block;}
	#fcard1 .slick-dots li {margin:0 4px}
	#fcard1 .slick-dots button {position:relative;width:25px;height:25px;background:transparent;border:0;text-indent:-9999px;}
	#fcard1 .slick-dots button:before {position:absolute;top:50%;left:50%;content:"";display:block;width:14px;height:14px;border-radius:100%;background:#fff;margin:-7px;box-sizing:border-box}
	#fcard1 .slick-dots .slick-active button:before {border:2px solid #fff;background:transparent;}	
}
@media screen and (max-width:1199px){
	#mainbody3 {padding-bottom:80px}
	#fcard1 .datalist .item .tg1 {margin-right:400px;}
	#fcard1 .datalist .item .f1 {width:399px;height:280px;margin-top:-140px}
	#fcard1 .datalist .item .tg1 .t1 {margin-bottom:25px;}
}
@media screen and (max-width:1024px){
	#fcard1 .datalist .item .tg1 {margin-right:350px;}
	#fcard1 .datalist .item .tg1 .h1 {font-size:17px;margin-bottom:18px}
	#fcard1 .datalist .item .tg1 .h1 span {font-size:28px;}
	#fcard1 .datalist .item .tg1 .st1 {font-size:17px;}
	#fcard1 .datalist .item .tg1 .t1 {margin-right:35px}
	#fcard1 .datalist .item .f1 {width:342px;height:240px;margin-top:-120px;}	
}
@media screen and (max-width:999px){
	#mainbody3 .ht1 {margin-bottom:30px}
	#fcard1 .datalist .item {padding:45px 35px 35px}
	#fcard1 .datalist .item .tg1 {margin-right:260px}
	#fcard1 .datalist .item .tg1 .h1 {font-size:16px;margin-bottom:15px;}
	#fcard1 .datalist .item .tg1 .h1 span {font-size:24px}
	#fcard1 .datalist .item .tg1 .st1 {font-size:16px;}
	#fcard1 .datalist .item .tg1 .t1 {font-size:15px;margin-right:30px}
	#fcard1 .datalist .item .f1 {right:30px;width:257px;height:180px;margin-top:-90px}
}
@media screen and (max-width:899px){
	#fcard1 .datalist .item {padding:40px 30px 30px}
	#fcard1 .datalist .item .tg1 {margin-right:0;padding-top:20px;}
	#fcard1 .datalist .item .tg1 .h1 {margin-right:260px;margin-bottom:35px;}
	#fcard1 .datalist .item .tg1 .h1 span {margin-top:7px;word-break:keep-all}
	#fcard1 .datalist .item .tg1 .st1 {margin-bottom:20px;}
	#fcard1 .datalist .item .tg1 .t1 {margin-right:0;margin-bottom:20px;}
	#fcard1 .datalist .item .f1 {top:26px;right:26px;width:228px;height:160px;margin-top:0}
	#fcard1 .datalist .item .btns {text-align:center}
	#fcard1 .datalist .item .tg1 .btns a {width:160px;height:50px;line-height:46px;font-size:16px;}
}
@media screen and (max-width:768px){
	#mainbody3 {padding-top:110px;padding-bottom:60px;}
}
@media screen and (max-width:599px){
	#mainbody3 {padding-top:100px;padding-bottom:50px;}
	#mainbody3 .ht1 {margin-bottom:25px}
	#fcard1 .datalist .item {display:flex;flex-wrap:wrap-reverse;padding:30px 25px}
	#fcard1 .datalist .item .tg1 .h1 {margin-right:0;text-align:center;font-size:15px;margin-bottom:15px;}
	#fcard1 .datalist .item .tg1 .h1 span {margin-top:5px;font-size:22px;}
	#fcard1 .datalist .item .tg1 .st1 {font-size:15px;margin-bottom:10px;text-align:center}
	#fcard1 .datalist .item .tg1 .t1 {text-align:center}
	#fcard1 .datalist .item .f1 {position:relative;top:auto;right:auto;display:block;margin:auto;order:0}
}
@media screen and (max-width:499px){
	#mainbody3 {padding-top:80px;padding-bottom:40px;}
	#mainbody3 .ht1 {margin-bottom:20px}
	#fcard1 .datalist .item .tg1 .t1 {font-size:14px;line-height:24px;margin-bottom:15px;}
}
@media screen and (max-width:399px){
	#mainbody3 {padding-bottom:35px;}
	#fcard1 .datalist .item {padding:20px 15px}
	#fcard1 .datalist .item .tg1 .btns a {width:150px;height:46px;line-height:42px;font-size:15px;}
	#fcard1 .slick-dots {padding-top:15px}
	#fcard1 .slick-dots li {margin:0 2px}
}

/* mainbody4 / 스마트 사진관 */
#mainbody4 {padding-top:180px}
#mainbody4 .wrap1 {padding-left:950px;padding-right:0}
#gallery1 {position:absolute;top:0;left:0;width:890px;height:640px;overflow:hidden;}
#gallery1:after {position:absolute;top:0;right:-60px;content:"";display:block;width:100px;height:100%;background:#fff;z-index:1}
#gallery1 .datalist .swiper-slide {vertical-align:top;}
#gallery1 .datalist .swiper-slide .f1 {position:relative;display:block;width:calc(100% - 40px);height:640px;overflow:hidden;margin-right:40px;}
#gallery1 .datalist .swiper-slide .f1 .f1p1 {position:absolute;top:0;left:0;width:100%;height:100%}
#gallery1 .datalist .swiper-slide .f1 .f1p1 img {display:block;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:40px;}
#gallery1 .menu {position:absolute;bottom:44px;right:0px;z-index:2}
#gallery1 .menu button {position:relative;display:block;width:26px;height:26px;background:transparent;border:0;text-indent:-9999px;opacity:1;margin-top:4px}
#gallery1 .menu .goPage button:before {position:absolute;top:50%;left:50%;content:"";display:block;width:16px;height:16px;border-radius:100%;background:#000;box-sizing:border-box;margin:-8px;}
#gallery1 .menu .goPage button.swiper-pagination-bullet-active:before {border:4px solid #000;background:transparent;}
#gallery1 .menu button.m {background:url(../../img/main/main_sprite.png) no-repeat;background-size:1000px auto;margin-top:10px;}
#gallery1 .menu button.m.stop {background-position:-754px -13px}
#gallery1 .menu button.m.play {display:none;background-position:-782px -13px}
#mainbody4 .wrap1 .tg1 {padding-top:50px;padding-left:70px;}
#mainbody4 .wrap1 .tg1 .ht1 {margin-left:-70px;}
#mainbody4 .wrap1 .tg1 .ht2 {color:#000;margin:50px 0 60px;word-break:keep-all}
#mainbody4 .wrap1 .tg1 .ht3 {color:#000;font-weight:400;margin-bottom:50px;}
#mainbody4 .wrap1 .tg1 span {display:block;}
#mainbody4 .wrap1 .tg1 .b1.more {position:relative;display:block;width:200px;height:60px;line-height:60px;font-size:18px;color:#000;padding:0 40px;box-sizing:border-box;/* transition:all .35s ease; */z-index:1}
#mainbody4 .wrap1 .tg1 .b1.more:before, #mainbody4 .wrap1 .tg1 .b1.more:after {position:absolute;content:"";display:block;}
#mainbody4 .wrap1 .tg1 .b1.more:after {top:50%;right:35px;width:24px;height:11px;background:url(../../img/main/main_sprite.png) no-repeat -754px 0 / 1000px auto;margin-top:-5.5px;transition:right .4s ease}
#mainbody4 .wrap1 .tg1 .b1.more:before {top:0;left:0;width:100%;height:100%;z-index:-1;border:2px solid #000;border-radius:9999px;box-sizing:border-box;transition:all .35s ease}
@media screen and (min-width:1260px){
	#gallery1 .datalist, #gallery1 .menu, #mainbody4 .wrap1 .tg1 .ht2, #mainbody4 .wrap1 .tg1 .ht3, #mainbody4 .wrap1 .tg1 .b1 {opacity:0;transition:opacity .45s ease, transform .45s ease}
	#mainbody4 .wrap1 .tg1 .ht2, #mainbody4 .wrap1 .tg1 .ht3, #mainbody4 .wrap1 .tg1 .b1 {transform:translateY(50px);}
	#gallery1 .datalist {transform:translateX(50px);}
	#gallery1 .menu {transform:translateY(20px);}
	#mainbody4 .wrap1 .tg1 .ht1 em {opacity:0;transform:translateY(110%);transition:all .4s ease;}
	#mainbody4.on #gallery1 .datalist, #mainbody4.on #gallery1 .menu {opacity:1;transform:none;}
	#mainbody4.on .wrap1 .tg1 .ht1 em {opacity:1;transform:none;}
	#mainbody4.on .wrap1 .tg1 .ht2 {opacity:1;transform:none;transition-delay:.1s}
	#mainbody4.on .wrap1 .tg1 .ht3 {opacity:1;transform:none;transition-delay:.15s}
	#mainbody4.on .wrap1 .tg1 .b1 {opacity:1;transform:none;transition-delay:.2s} 
	#mainbody4.on #gallery1 .menu {transition-delay:.25s}
	#mainbody4 .wrap1 .tg1 .b1.more:hover, #mainbody4 .wrap1 .tg1 .b1.more:focus {color:#fff;border:0;}
	#mainbody4 .wrap1 .tg1 .b1.more:hover:before, #mainbody4 .wrap1 .tg1 .b1.more:focus:before {border-color:transparent;background-color:#eb4050;box-shadow:5px 5px 15px rgba(0,0,0,.2)}
	#mainbody4 .wrap1 .tg1 .b1.more:hover:after, #mainbody4 .wrap1 .tg1 .b1.more:focus:after {right:30px;background-position:-780px 0}
}
@media screen and (max-width:1748px){
	#mainbody4 .wrap1 {padding-left:855px}
	#gallery1 {width:848px;height:608px}
	#gallery1 .datalist .swiper-slide .f1 {height:608px;}
}
@media screen and (max-width:1548px){
	#mainbody4 .wrap1 {padding-left:785px}
	#mainbody4 .wrap1 .tg1 {padding-top:40px;padding-left:60px}
	#mainbody4 .wrap1 .tg1 .ht2 {margin-top:35px;margin-bottom:45px;}
	#mainbody4 .wrap1 .tg1 .ht3 {margin-bottom:40px}
	#mainbody4 .wrap1 .tg1 span {display:inline}
	#gallery1 {width:763px;height:544px}
	#gallery1 .datalist .swiper-slide .f1 {height:544px;}
}
@media screen and (max-width:1448px){
	#mainbody4 .wrap1 {padding-left:730px}
	#gallery1 {width:720px;height:512px;}
	#gallery1 .datalist .swiper-slide .f1 {height:512px;}
	#mainbody4 .wrap1 .tg1 {padding-left:40px}
	#mainbody4 .wrap1 .tg1 .ht1 {margin-left:-60px}
	#mainbody4 .wrap1 .tg1 .ht2 {line-height:1.3;word-break:keep-all}
}
@media screen and (max-width:1399px){
	#mainbody4 .wrap1 {padding-left:700px}
	#gallery1 {width:678px;height:480px;}
	#gallery1 .datalist .swiper-slide .f1 {height:480px;}
	#mainbody4 .wrap1 .tg1 {padding-left:40px;padding-top:30px}
	#mainbody4 .wrap1 .tg1 .ht1 {margin-left:-60px}
	#mainbody4 .wrap1 .tg1 .ht2 {line-height:1.3;word-break:keep-all}	
}
@media screen and (max-width:1299px){
	#mainbody4 .wrap1 {padding-left:650px}
	#gallery1 {width:595px;height:448px;}
	#gallery1 .datalist .swiper-slide .f1 {height:448px;}
	#mainbody4 .wrap1 .tg1 {padding-top:15px}
	#mainbody4 .wrap1 .tg1 .ht2 {margin-top:20px;margin-bottom:35px}
	#mainbody4 .wrap1 .tg1 .ht3 {margin-bottom:30px}
}
@media screen and (max-width:1259px){
	#mainbody4 {display:block;padding-top:120px;padding-bottom:70px}
	#mainbody4 .wrap1 {display:block;padding-left:0}	
	#gallery1 {position:relative;top:auto;left:auto;width:595px;height:448px;margin:20px auto auto;padding-left:40px}
	#gallery1 .datalist .swiper-slide .f1 {height:448px;}
	#mainbody4 .wrap1 .tg1 {text-align:center;padding:40px 0 0}
	#mainbody4 .wrap1 .tg1 .ht1 {margin-left:0}
	#mainbody4 .wrap1 .tg1 .ht2 {margin-top:15px;margin-bottom:25px;}
	#mainbody4 .wrap1 .tg1 .ht3 {margin-bottom:25px;word-break:keep-all}
	#mainbody4 .wrap1 .tg1 .b1.more {text-align:left;margin:auto;height:58px;line-height:58px;}
}
@media screen and (max-width:768px){
	#gallery1 {width:510px;height:384px;}
	#gallery1 .datalist .swiper-slide .f1 {height:384px;}
}
@media screen and (max-width:699px){
	#gallery1 {max-width:510px;width:100%;height:auto;padding-left:0;margin-top:0;}
	#gallery1 dt.tab {bottom:-50px;right:50%;z-index:1;}
	#gallery1 dt.tab:nth-of-type(1) {bottom:-50px;margin-right:0}
	#gallery1 dt.tab:nth-of-type(2) {bottom:-50px;margin-right:-40px;}
	#mainbody4 .wrap1 .tg1 .b1.more {width:160px;height:55px;line-height:55px;font-size:17px;padding:0 20px}
	#mainbody4 .wrap1 .tg1 .b1.more:after {right:20px}
}
@media screen and (max-width:599px){
	#mainbody4 {padding-top:100px;padding-bottom:60px;}
	#mainbody4 .wrap1 .tg1 .b1.more {height:50px;line-height:52px;font-size:16px;}
}
@media screen and (max-width:499px){
	#mainbody4 {padding-top:80px;padding-bottom:40px}
	#gallery1:after {display:none}
	#gallery1 .datalist .swiper-slide .f1 {margin-right:0;width:100%;height:0;padding-bottom:75.29%;}
	#gallery1 .datalist .swiper-slide .f1 .f1p1 {position:absolute;top:0;left:0;width:100%;height:100%;}
	#gallery1 .menu {position:relative;bottom:auto;right:auto;text-align:center;padding-top:15px;}
	#gallery1 .menu .goPage, #gallery1 .menu button {display:inline-block;vertical-align:top;}
	#gallery1 .menu button.m {margin-top:4px}
	#mainbody4 .wrap1 .tg1 {padding-top:25px}
	#mainbody4 .wrap1 .tg1 .b1.more {height:50px;line-height:50px;font-size:16px;}
}
@media screen and (max-width:399px){
	#mainbody4 {padding-bottom:35px;}
	#mainbody4 .wrap1 .tg1 .ht2 {margin-bottom:20px}
	#gallery1 .menu {padding-top:10px;}
	#mainbody4 .wrap1 .tg1 .b1.more {width:140px;height:46px;line-height:46px;font-size:15px;}
}

/* mainbody5 / 강구안 주변 투어 */
#mainbody5 {background-color:#fef7f5;background-attachment:fixed;overflow:hidden;}
#mainbody5 .wrap1:before {position:absolute;bottom:3%;left:50%;content:"";display:block;width:484px;height:484px;background:url(../../img/main/main_sprite.png) no-repeat -516px -404px / 1000px auto;margin-left:-354px;}
#mainbody5 .hg1 {position:absolute;top:250px;left:30px;}
#mainbody5 .hg1:before {position:absolute;top:-95px;left:-110px;content:"";display:block;width:240px;height:240px;background:url(../../img/main/main_sprite.png) no-repeat -760px -162px / 1000px auto;}
#mainbody5 .hg1 .ht1 {color:#000;}
#mainbody5 .hg1 .ht2 {color:#000;color:#000;margin-left:70px;margin-top:40px;}
#mainbody5 .hg1 .ht2 span {display:block;}
#mainbody5 .hg1 .menu {margin-top:60px;margin-left:70px;}
#mainbody5 .hg1 .menu button {width:80px;height:80px;border:0;background:#343d4c url(../../img/main/main_sprite.png) no-repeat;background-size:1000px auto;border-radius:100%;margin-right:10px;box-shadow:5px 5px 20px rgba(0,0,0,.15)}
#mainbody5 .hg1 .menu .swiper-prev {background-position:0 -93px}
#mainbody5 .hg1 .menu .swiper-stop {background-position:-164px -93px}
#mainbody5 .hg1 .menu .swiper-play {background-position:-246px -93px}
#mainbody5 .hg1 .menu .swiper-next {background-position:-82px -93px}
/* fcard2 */
#fcard2 {position:relative;width:1150px;overflow:hidden;margin-left:670px;padding-left:30px;}
#fcard2 .datalist .swiper-slide {transition:margin 1.2s;}
#fcard2 .datalist .swiper-slide.swiper-slide-prev {opacity:0}
#fcard2 .datalist .swiper-slide .box {perspective:440px;padding:180px 0 200px}
#fcard2 .datalist .swiper-slide .sbox {position:relative;z-index:5;transform:rotateY(-20deg) translate(0,0) scale(.9);transition:.7s;background:#fff;border-radius:30px;overflow:hidden;}
#fcard2 .datalist .swiper-slide.swiper-slide-active .sbox {transform:rotateY(0deg) translate(0,0);}
#fcard2 .datalist .swiper-slide.swiper-slide-active {margin-right:-280px !important;z-index:4;}
#fcard2 .datalist .swiper-slide.swiper-slide-next {z-index:3}
#fcard2 .datalist .swiper-slide.swiper-slide-next + div {z-index:2}
#fcard2 .datalist .swiper-slide.swiper-slide-next + div + div {z-index:1}
#fcard2 .datalist .swiper-slide .sbox {position:relative;width:380px;height:530px;box-shadow:10px 10px 40px rgba(0, 0, 0, 0.2);box-sizing:border-box;}
#fcard2 .datalist .swiper-slide .sbox .f1 {position:relative;display:block;width:100%;height:0;padding-bottom:68.42%;overflow:hidden;background:#e0e0e0}
#fcard2 .datalist .swiper-slide .sbox .f1 .f1p1 {position:absolute;top:0;left:0;width:100%;height:100%}
#fcard2 .datalist .swiper-slide .sbox .f1 .f1p1 img {display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
#fcard2 .datalist .swiper-slide .sbox .tg1 {position:relative;padding:40px 50px;height:51%;box-sizing:border-box;}
#fcard2 .datalist .swiper-slide .sbox .tg1 .h1 {display:block;font-size:32px;font-weight:700;color:#000;line-height:1.2;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
#fcard2 .datalist .swiper-slide .sbox .tg1 .t1 {font-size:20px;line-height:28px;color:#000;font-weight:400;word-break:keep-all;margin:20px 0}
#fcard2 .datalist .swiper-slide .sbox .tg1 .b1.more {position:absolute;bottom:45px;left:50px;display:block;width:160px;height:50px;line-height:46px;font-size:18px;border:2px solid #000;border-radius:9999px;box-sizing:border-box;background:#fff;text-align:center;color:#000;transition:all .35s ease}
#fcard2 .datalist .swiper-slide.swiper-slide-active .sbox .tg1 .b1.more {border-color:transparent;background-color:#eb4050;color:#fff;}
#fcard2 .datalist .swiper-container {transform:translateX(20%);opacity:0;transition:all 2s .8s;}
.on #fcard2 .datalist .swiper-container {transform:translateX(0);opacity:1;}
#fcard2 .swiper-pagination {bottom:12%;top:auto;left:30px;width:960px;height:4px;background:#bfbfbf;border-radius:3px}
#fcard2 .swiper-pagination.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {height:8px;background-color:#eb4050;border-radius:9999px;top:-2px;}
@media screen and (min-width:1260px){
	#mainbody5 .hg1 .ht1 em, #mainbody5 .hg1 .ht2, #fcard2 {opacity:0;transition:opacity .45s ease, transform .5s ease}
	#mainbody5 .hg1 .ht1 em {transform:translateY(110%);transition:all .4s ease;}
	#mainbody5 .hg1 .ht2 {transform:translateY(50px)}
	#fcard2 {transform:translateX(800px);transition:all .5s ease}
	#mainbody5 .hg1 .menu button {opacity:0;}
	#mainbody5 .hg1:before, 	#mainbody5 .wrap1:before {opacity:0;transition:opacity .3s ease}
	#mainbody5.on .hg1 .menu button.swiper-prev {opacity:1;animation:bounce-in-fwd .8s .4s both;}
	#mainbody5.on .hg1 .menu button.swiper-stop {opacity:1;animation:bounce-in-fwd .9s .5s both;}
	#mainbody5.on .hg1 .menu button.swiper-play {opacity:1;animation:bounce-in-fwd 1s .6s both;}
	#mainbody5.on .hg1 .menu button.swiper-next {opacity:1;animation:bounce-in-fwd 1.1s .7s both;}
	#mainbody5.on .hg1 .ht1 em {opacity:1;transform:none;}
	#mainbody5.on .hg1 .ht2 {opacity:1;transform:none;transition-delay:.05s;}
	#mainbody5.on #fcard2 {opacity:1;transform:none;transition-delay:.1s;}
	#mainbody5.on .hg1 .menu button {opacity:1;transform:none;}
	#mainbody5.on .hg1:before {opacity:1;animation:ani-rotate 9s linear  infinite both;transition-delay:.2s;}
	#mainbody5.on .wrap1:before {opacity:1;animation:ani-rotate 15s linear  infinite both;transition-delay:2s;}
}
@media screen and (max-width:1799px){
	#fcard2 {margin-left:650px;}
	#fcard2 .datalist .swiper-slide .sbox {width:361px;height:504px}
}
@media screen and (max-width:1699px){
	#fcard2 {margin-left:500px;width:1093px}
	#fcard2 .datalist .swiper-slide .sbox .tg1 {padding:40px;}
}
@media screen and (max-width:1599px){
	#fcard2 .swiper-pagination {width:768px;}
}
@media screen and (max-width:1399px){
	#fcard2 {width:1035px;margin-left:420px}
	#fcard2 .swiper-pagination {width:576px;}
	#mainbody5 .hg1 .ht2 {margin-left:60px;}
	#mainbody5 .hg1 .menu {margin-left:60px;}
	#mainbody5 .hg1 .menu button {width:72px;height:72px;background-size:900px auto;margin-right:5px;}
	#mainbody5 .hg1 .menu .swiper-prev {background-position:0 -84px}
	#mainbody5 .hg1 .menu .swiper-stop {background-position:-148px -84px}
	#mainbody5 .hg1 .menu .swiper-play {background-position:-221px -84px}
	#mainbody5 .hg1 .menu .swiper-next {background-position:-74px -84px}
}
@media screen and (max-width:1259px){
	#mainbody5 {padding-top:120px;padding-bottom:80px;}
	#mainbody5 .wrap1 {padding:0}
	#mainbody5 .hg1 {position:static;top:auto;left:auto;text-align:center;}
	#mainbody5 .wrap1:before, #mainbody5 .hg1:before {display:none;}
	#mainbody5 .hg1 .ht2 {margin-left:0;margin-top:5px}
	#mainbody5 .hg1 .ht2 span {display:inline}
	#mainbody5 .hg1 .menu {position:absolute;bottom:-27px;left:0;width:calc(100% - 80px);z-index:2;margin:0 80px 0 0;text-align:right;}
	#mainbody5 .hg1 .menu button {width:64px;height:64px;background-size:800px auto;margin-right:5px;}
	#mainbody5 .hg1 .menu .swiper-prev {background-position:0 -74px}
	#mainbody5 .hg1 .menu .swiper-stop {background-position:-131px -74px}
	#mainbody5 .hg1 .menu .swiper-play {background-position:-197px -74px}
	#mainbody5 .hg1 .menu .swiper-next {background-position:-66px -74px}
	#fcard2 {margin-left:0;width:calc(100% + 80px);}
	#fcard2 .datalist .swiper-slide .box {padding-top:50px;padding-bottom:50px}
	#fcard2 .datalist .swiper-slide .sbox .tg1 {padding-left:35px;padding-right:35px}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .h1 {font-size:30px;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .t1 {font-size:18px;line-height:26px;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .b1.more {bottom:40px}
	#fcard2 .swiper-pagination {bottom:5px;width:calc(100% - 450px);}
}
@media screen and (max-width:999px){
	#fcard2 {width:100%;}
	#fcard2 .datalist .swiper-slide .sbox {width:323px;height:451px;box-shadow:10px 10px 30px rgba(0,0,0,.1)}
	#fcard2 .datalist .swiper-slide .sbox .tg1 {padding:35px 30px;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .h1 {font-size:28px;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .t1 {font-size:17px;line-height:24px;margin:15px 0;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .b1.more {bottom:30px;left:30px;width:140px;height:45px;line-height:41px;font-size:17px;}
	#mainbody5 .hg1 .menu button {width:64px;height:64px;background-size:800px auto;margin-right:5px;}
	#mainbody5 .hg1 .menu .swiper-prev {background-position:0 -74px}
	#mainbody5 .hg1 .menu .swiper-stop {background-position:-131px -74px}
	#mainbody5 .hg1 .menu .swiper-play {background-position:-197px -74px}
	#mainbody5 .hg1 .menu .swiper-next {background-position:-66px -74px}	
}
@media screen and (max-width:768px){
	#mainbody5 {padding-top:120px;padding-bottom:50px}
	#mainbody5 .hg1 .menu {bottom:-5px}
	#mainbody5 .hg1 .menu button {width:48px;height:48px;background-size:600px auto;margin-right:2px}
	#mainbody5 .hg1 .menu .swiper-prev {background-position:0 -56px}
	#mainbody5 .hg1 .menu .swiper-stop {background-position:-98px -56px}
	#mainbody5 .hg1 .menu .swiper-play {background-position:-148px -56px}
	#mainbody5 .hg1 .menu .swiper-next {background-position:-49px -56px}	
	#fcard2 {width:850px}
	#fcard2 .datalist .swiper-slide .box {padding-bottom:60px}
	#fcard2 .swiper-pagination {bottom:17px;}
	#fcard2 .swiper-pagination.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {height:6px;top:-1px;}	
}
@media screen and (max-width:760px){
	#fcard2 {width:calc(100% + 20px);}
	#fcard2 .datalist .swiper-slide.swiper-slide-active {margin-right:-300px !important}
}
@media screen and (max-width:699px){
	#mainbody5 {padding-top:110px;}
	#mainbody5 .hg1 .ht2 {line-height:1.3;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 {padding:30px 25px;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .h1 {font-size:24px;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .t1 {font-size:16px;line-height:22px;margin:10px 0}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .b1.more {left:25px;bottom:20px;font-size:16px;width:130px;height:40px;line-height:36px;}	
	#fcard2 .swiper-pagination {display:none;}
	#mainbody5 .hg1 .menu {text-align:center;margin-right:0;width:100%;}
	#mainbody5 .hg1 .menu button {width:36px;height:36px;background-size:450px auto;margin-right:2px}
	#mainbody5 .hg1 .menu .swiper-prev {background-position:0 -42px}
	#mainbody5 .hg1 .menu .swiper-stop {background-position:-74px -42px}
	#mainbody5 .hg1 .menu .swiper-play {background-position:-111px -42px}
	#mainbody5 .hg1 .menu .swiper-next {background-position:-37px -42px}	
}
@media screen and (max-width:599px){
	#mainbody5 {padding-top:100px;padding-bottom:40px;}
	#fcard2 {padding-left:0;width:700px;margin:auto;}
	#fcard2 .datalist .swiper-slide.swiper-slide-active {margin-right:0 !important}
	#fcard2 .datalist .swiper-slide .box {padding-top:20px;padding-bottom:50px;}
	#fcard2 .datalist .swiper-slide .sbox {width:285px;height:398px;transform:none;margin:auto;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .h1 {font-size:22px;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .t1 {font-size:15px;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .b1.more {font-size:15px;}
}
@media screen and (max-width:499px){
	#fcard2 .datalist .swiper-slide .sbox {width:300px;height:auto;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 {padding:25px 20px;}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .b1.more {position:relative;bottom:auto;left:auto;display:block;margin-top:20px;font-size:14px;width:120px;}	
}
@media screen and (max-width:399px){
	#mainbody5 {padding-top:80px;padding-bottom:35px;}
	#fcard2 {width:auto;}
	#fcard2 .datalist .swiper-slide .sbox {box-shadow:none;width:280px}
	#fcard2 .datalist .swiper-slide .sbox .tg1 .h1 {font-size:20px;}
}


/* mainbody6 / 강구안 야간 투어 */
#mainbody6 {background-image:url(../../img/main/mbody6_bg.jpg);background-attachment:fixed;text-align:center;display:table;background-position:50% 0;filter:drop-shadow(5px 5px 5px rgba(0,0,0,.7));}
#mainbody6 .h2 {font-size:72px;color:#fff;letter-spacing:-.05em;font-weight:500;line-height:1.3;text-shadow:5px 5px 30px rgba(0,0,0,.8);}
#mainbody6 .h2 span {display:block;}
#mainbody6 .h2 .st2 {font-size:139%;font-weight:700;}
#mainbody6 .h2 span em {color:inherit;}
@media screen and (min-width:1260px){
	#mainbody6 .h2 span {overflow:hidden;transition:all .4s ease;}
	#mainbody6 .h2 span em {display:block;transform:translateY(110%);transition:all .4s ease;opacity:0;}
	#mainbody6.on .h2 span.st1 {height:120px}
	#mainbody6.on .h2 span.st2 {height:200px}
	#mainbody6.on .h2 span em {transform:translateY(0);opacity:1;}
}
@media screen and (max-width:1259px){
	#mainbody6 {min-height:800px;padding-top:250px;padding-bottom:250px;}
	#mainbody6>.container {}
	#mainbody6 .h2 {font-size:65px}
}
@media screen and (max-width:999px){
	#mainbody6 {display:block;background-attachment:unset;background-size:cover;}
	#mainbody6>.container {display:block;}
	#mainbody6 .h2 {font-size:60px}
	#mainbody6 .mousewheel1.scroll1 {box-shadow:0 0 20px rgba(255,255,255,.15)}
}
@media screen and (max-width:768px){
	#mainbody6 .h2 {font-size:56px}
}
@media screen and (max-width:649px){
	#mainbody6 {min-height:700px;}
	#mainbody6 .h2 {font-size:52px}
}
@media screen and (max-width:549px){
	#mainbody6 .h2 {font-size:48px}
	#mainbody6 .h2 .st2 {font-size:130%;}
}
@media screen and (max-width:549px){
	#mainbody6 {min-height:600px;}
	#mainbody6 .h2 {font-size:43px}
	#mainbody6 .h2 .st2 {font-size:125%;}
}
@media screen and (max-width:499px){
	#mainbody6 {min-height:auto}
	#mainbody6 .h2 {font-size:38px}
	#mainbody6 .h2 .st2 {font-size:115%;}	
}

/* mainbody7 / 강구안 브릿지 교량 분수 */
#mainbody7 {color:#fff;background-image:url(../../img/main/mbody7_bg.jpg);background-attachment:fixed}
#mainbody7 .wrap1 {padding-top:400px;filter:drop-shadow(5px 5px 5px rgba(0,0,0,.7));}
#mainbody7 .ht1 {color:#fff;}
#mainbody7 .ht2 {margin:70px 0 45px;}
@media screen and (min-width:1260px){
	#mainbody7 .ht1 em, #mainbody7 .ht2, #mainbody7 .ht3 {opacity:0;transform:translateY(50px);transition:opacity .4s ease, transform .5s ease}
	#mainbody7 .ht1 em {transform:translateY(110%);transition:all .4s ease}
	#mainbody7.on .ht1 em {opacity:1;transform:none;}
	#mainbody7.on .ht2 {opacity:1;transform:none;transition-delay:.1s}
	#mainbody7.on .ht3 {opacity:1;transform:none;transition-delay:.15s} 
}
@media screen and (max-width:1259px){
	#mainbody7 {display:block;background-attachment:unset;background-size:cover;}
	#mainbody7 .wrap1 {padding-top:230px;padding-bottom:180px;}
}
@media screen and (max-width:999px){
	#mainbody7 .ht2 {line-height:1.3;}
	#mainbody7 .ht3 br {display:none}
	#mainbody7 .mousewheel1.scroll1 {box-shadow:0 0 20px rgba(255,255,255,.15)}
}
@media screen and (max-width:768px){
	#mainbody7 .wrap1 {padding-top:200px;padding-bottom:130px;}
}
@media screen and (max-width:599px){
	#mainbody7 .wrap1 {padding:150px 16px 60px;margin:0;background:rgba(0,0,0,.5);width:100%}
	#mainbody7 .ht2 {margin:50px 0 35px}	
}
@media screen and (max-width:499px){
	#mainbody7 .wrap1 {padding-top:120px;padding-bottom:50px;}
}
@media screen and (max-width:399px){
	#mainbody7 .ht2 {margin:40px 0 25px}	
}

/* mainbody8 / 비치랑 문화마당 */
#mainbody8 {background-image:url(../../img/main/mbody8_bg.jpg);background-attachment:fixed;text-align:right;}
#mainbody8 .wrap1 {padding:130px 0;color:#fff;filter:drop-shadow(5px 5px 5px rgba(0,0,0,.7));}
#mainbody8 .ht1 {color:#fff;}
#mainbody8 .ht2 {margin:70px 0 45px;letter-spacing:-.05em;font-weight:500}
#mainbody8 .ht3 span {display:block;}
#mainbody8 .img1list {margin-top:40px;}
@media screen and (min-width:1260px){
	#mainbody8 .ht1 em, #mainbody8 .ht2, #mainbody8 .ht3 {opacity:0;transform:translateX(-50px);transition:opacity .4s ease, transform .5s ease}
	#mainbody8 .img1list li {opacity:0;transform:translateY(50px);transition:opacity .4s ease, transform .5s ease}
	#mainbody8 .ht1 em {transform:translateY(110%);transition:all .4s ease}
	#mainbody8.on .ht1 em {opacity:1;transform:none;}
	#mainbody8.on .ht2 {opacity:1;transform:none;transition-delay:.05s}
	#mainbody8.on .ht3 {opacity:1;transform:none;transition-delay:.1s}
	#mainbody8.on .img1list li:first-child {opacity:1;transform:none;transition-delay:.15s}
	#mainbody8.on .img1list li:last-child {opacity:1;transform:none;transition-delay:.2s}
}
@media screen and (max-width:1259px){
	#mainbody8 {display:block;background-attachment:unset;background-size:cover;}
	#mainbody8 .wrap1 {padding-top:230px;padding-bottom:180px;}
	#mainbody8 .ht2 {margin-top:60px;margin-bottom:35px;}
	#mainbody8 .ht3 {word-break:keep-all}
	#mainbody8 .ht3 br {display:none}
	#mainbody8 .ht3 span {display:inline}
}
@media screen and (max-width:999px){
	#mainbody8 .mousewheel1.scroll1 {box-shadow:0 0 20px rgba(255,255,255,.15)}
}
@media screen and (max-width:768px){
	#mainbody8 .wrap1 {padding-top:200px;padding-bottom:130px;}
	#mainbody8 .ht2 {margin-top:50px;margin-bottom:30px;}
}
@media screen and (max-width:599px){
	#mainbody8 .wrap1 {padding-top:150px;padding-bottom:60px;}
	#mainbody8 .ht2 {margin-top:40px;margin-bottom:25px;line-height:1.3}
	#mainbody8 .img1list {margin-top:30px}
	#mainbody8 .img1list li {width:calc(50% - 15px);}
	#mainbody8 .img1list li:first-child {margin-left:0}
}
@media screen and (max-width:499px){
	#mainbody8 .wrap1 {padding-top:120px;padding-bottom:50px;word-break:keep-all}
	#mainbody8 .img1list li {width:calc(50% - 9px);margin-left:12px}
}

/* mainbody9 비치랑 놀이마당 */
#mainbody9 {background-image:url(../../img/main/mbody9_bg.jpg);background-attachment:fixed}
#mainbody9 .wrap1 {padding-top:300px;color:#fff;filter:drop-shadow(5px 5px 5px rgba(0,0,0,.7));}
#mainbody9 .ht1 {color:#fff}
#mainbody9 .ht2 {margin:80px 0 30px;}
#mainbody9 .ht2 span {display:block;}
@media screen and (min-width:1260px){
	#mainbody9 .ht1 em, #mainbody9 .ht2, #mainbody9 .ht3 {opacity:0;transform:translateX(50px);transition:opacity .4s ease, transform .5s ease}
	#mainbody9 .ht1 em {transform:translateY(110%);transition:all .4s ease}
	#mainbody9.on .ht1 em {opacity:1;transform:none;}
	#mainbody9.on .ht2 {opacity:1;transform:none;transition-delay:.05s}
	#mainbody9.on .ht3 {opacity:1;transform:none;transition-delay:.1s}
}
@media screen and (max-width:1259px){
	#mainbody9 {display:block;background-attachment:unset;background-size:cover;}
	#mainbody9 .wrap1 {padding:230px 16px 180px;background:rgba(0,0,0,.5);width:100%;margin:0}
}
@media screen and (max-width:999px){
	#mainbody9 .ht2 {line-height:1.3;}
	#mainbody9 .ht3 br {display:none}
	#mainbody9 .mousewheel1.scroll1 {box-shadow:0 0 20px rgba(255,255,255,.15)}
}
@media screen and (max-width:768px){
	#mainbody9 .wrap1 {padding-top:200px;padding-bottom:130px;}
}
@media screen and (max-width:599px){
	#mainbody9 .wrap1 {padding:150px 16px 60px;}
	#mainbody9 .ht2 {margin:50px 0 35px}	
}
@media screen and (max-width:499px){
	#mainbody9 .wrap1 {padding-top:120px;padding-bottom:50px;}
}
@media screen and (max-width:399px){
	#mainbody9 .ht2 {margin:40px 0 25px}	
}



/* mainbody10 / 형형색색 빛길 - 20260128 삭제
#mainbody10 {background-image:url(../../img/main/mbody10_bg.jpg);background-attachment:fixed;text-align:center}
#mainbody10 .wrap1 {padding-top:150px;color:#fff;filter:drop-shadow(5px 5px 5px rgba(0,0,0,.7));}
#mainbody10 .ht1 {color:#fff}
#mainbody10 .ht2 {margin:75px 0 40px}
@media screen and (min-width:1260px){
	#mainbody10 .ht1 em, #mainbody10 .ht2, #mainbody10 .ht3 {opacity:0;transition:opacity .4s ease, transform .4s ease}
	#mainbody10 .ht1 em {transform:translateY(110%);transition:all .4s ease}
	#mainbody10 .ht2 {transform:translateX(-10%)}
	#mainbody10 .ht3 {transform:translateX(10%)}
	#mainbody10.on .ht1 em {opacity:1;transform:none;}
	#mainbody10.on .ht2 {opacity:1;transform:none;transition-delay:.05s}
	#mainbody10.on .ht3 {opacity:1;transform:none;transition-delay:.05s}
}
@media screen and (max-width:1259px){
	#mainbody10 {display:block;background-attachment:unset;background-size:cover;}
	#mainbody10 .wrap1 {padding:230px 0 180px;}
}
@media screen and (max-width:999px){
	#mainbody10 .ht2 {line-height:1.3;margin-top:60px;}
	#mainbody10 .ht3 br {display:none}
	#mainbody10 .mousewheel1.scroll1 {box-shadow:0 0 20px rgba(255,255,255,.15)}
}
@media screen and (max-width:768px){
	#mainbody10 .wrap1 {padding-top:200px;padding-bottom:130px;}
}
@media screen and (max-width:599px){
	#mainbody10 .wrap1 {padding:150px 0 60px}
	#mainbody10 .ht2 {margin-top:40px;margin-bottom:25px;}
}
@media screen and (max-width:499px){
	#mainbody10 .wrap1 {padding:120px 16px 50px;margin:0;background:rgba(0,0,0,.5);width:100%;word-break:keep-all}	
}
*/


/* mainbody10 / 강구안 수상 드론 */
#mainbody10 {background-image:url(../../img/main/mbody11_bg.jpg);background-attachment:fixed}
#mainbody10 .wrap1 {padding-top:150px;color:#fff;filter:drop-shadow(5px 5px 5px rgba(0,0,0,.7));}
#mainbody10 .ht1 {color:#fff}
#mainbody10 .ht2 {margin:90px 0 40px}
#mainbody10 .ht3 span {display:block;}
#mainbody10 .img1list {position:absolute;top:50%;right:0;margin-top:-60px;}
@media screen and (min-width:1260px){
	#mainbody10 .ht1 em, #mainbody10 .ht2, #mainbody10 .ht3 {opacity:0;transform:translateX(50px);transition:opacity .4s ease, transform .5s ease}
	#mainbody10 .img1list li {opacity:0;transform:translateY(50px);transition:opacity .4s ease, transform .5s ease}
	#mainbody10 .ht1 em {transform:translateY(110%);transition:all .4s ease}
	#mainbody10.on .ht1 em {opacity:1;transform:none;}
	#mainbody10.on .ht2 {opacity:1;transform:none;transition-delay:.05s}
	#mainbody10.on .ht3 {opacity:1;transform:none;transition-delay:.1s}
	#mainbody10.on .img1list li:first-child {opacity:1;transform:none;transition-delay:.15s}
	#mainbody10.on .img1list li:last-child {opacity:1;transform:none;transition-delay:.17s}
}
@media screen and (max-width:1499px){
	#mainbody10 .ht3 {margin-right:650px}
	#mainbody10 .ht3 br {display:none}
	#mainbody10 .ht3 span {display:inline}
	#mainbody10 .img1list li {margin-left:24px;}
}
@media screen and (max-width:1259px){
	#mainbody10 {display:block;background-attachment:unset;background-size:cover;}
	#mainbody10 .wrap1 {display:block;padding:230px 16px 180px;background:rgba(0,0,0,.5);width:100%;margin:0}
	#mainbody10 .ht3 {margin-right:0}
	#mainbody10 .img1list {position:relative;top:auto;right:auto;margin-top:40px;margin-left:-24px}
}
@media screen and (max-width:999px){
	#mainbody10 .ht2 {line-height:1.3;margin-top:80px;margin-bottom:30px;}
	#mainbody10 .ht3 br {display:none}
	#mainbody10 .mousewheel1.scroll1 {box-shadow:0 0 20px rgba(255,255,255,.15)}
}
@media screen and (max-width:768px){
	#mainbody10 .wrap1 {padding-top:200px;padding-bottom:130px;}
	#mainbody10 .ht2 {margin-top:70px;}
}
@media screen and (max-width:599px){
	#mainbody10 .wrap1 {padding-top:150px;padding-bottom:60px;}
	#mainbody10 .ht2 {margin:50px 0 35px}	
	#mainbody10 .img1list {margin-top:30px}
}
@media screen and (max-width:499px){
	#mainbody10 .wrap1 {padding-top:120px;padding-bottom:50px;}
	#mainbody10 .img1list {margin-left:0}
	#mainbody10 .img1list li {width:calc(50% - 9px);margin-left:12px;}
	#mainbody10 .img1list li:first-child {margin-left:0}
}
@media screen and (max-width:399px){
	#mainbody10 .ht2 {margin:40px 0 25px}	
	#mainbody10 .img1list li {width:calc(50% - 5px);margin-left:6px;}
}

/* mainbody11 / 인터랙티브 미디어아트 */
#mainbody11 {background-image:url(../../img/main/mbody12_bg.jpg);background-attachment:fixed;text-align:right}
#mainbody11 .wrap1 {padding-top:150px;color:#fff;filter:drop-shadow(5px 5px 5px rgba(0,0,0,.7));}
#mainbody11 .ht1 {color:#fff}
#mainbody11 .ht2 {margin:90px 0 40px}
#mainbody11 .ht2 span {display:block;}
#mainbody11 .ht3 {margin-bottom:40px;}
@media screen and (min-width:1260px){
	#mainbody11 .ht1 em, #mainbody11 .ht2, #mainbody11 .ht3 {opacity:0;transform:translateX(-50px);transition:opacity .4s ease, transform .45s ease}
	#mainbody11 .img1list li {opacity:0;transform:translateY(50px);transition:opacity .4s ease, transform .45s ease}
	#mainbody11 .ht1 em {transform:translateY(110%);transition:all .4s ease}
	#mainbody11.on .ht1 em {opacity:1;transform:none;}
	#mainbody11.on .ht2 {opacity:1;transform:none;transition-delay:.05s}
	#mainbody11.on .ht3 {opacity:1;transform:none;transition-delay:.1s}
	#mainbody11.on .img1list li:first-child {opacity:1;transform:none;transition-delay:.15s}
	#mainbody11.on .img1list li:nth-child(2) {opacity:1;transform:none;transition-delay:.2s}
	#mainbody11.on .img1list li:last-child {opacity:1;transform:none;transition-delay:.25s}
}
@media screen and (max-width:1259px){
	#mainbody11 {display:block;background-attachment:unset;background-size:cover;}
	#mainbody11 .wrap1 {padding-top:230px;padding-bottom:180px;}
	#mainbody11 .ht2 {margin-top:60px}
}
@media screen and (max-width:999px){
	#mainbody11 .wrap1 {background:rgba(0,0,0,.5);margin:0;padding-left:16px;padding-right:16px;width:100%;}
	#mainbody11 .ht2 {margin-top:50px;margin-bottom:35px;}
	#mainbody11 .img1list li {width:calc(33.33% - 19px);}
	#mainbody11 .img1list li:first-child {margin-left:0}
	#mainbody11 .mousewheel1.scroll1 {box-shadow:0 0 20px rgba(255,255,255,.15)}
}
@media screen and (max-width:999px){
	#mainbody11 .wrap1 {padding-top:200px;padding-bottom:130px;word-break:keep-all}
	#mainbody11 .ht2 span {display:inline}
}
@media screen and (max-width:768px){
	#mainbody11 .wrap1 {padding-top:150px;padding-bottom:60px;}
	#mainbody11 .ht2 {margin-top:40px;margin-bottom:30px;}
}
@media screen and (max-width:599px){
	#mainbody11 .wrap1 {padding-top:140px;padding-bottom:50px;}
	#mainbody11 .ht2 {margin-top:40px;margin-bottom:25px;line-height:1.3}
	#mainbody11 .img1list li {margin-left:12px;width:calc(33.33% - 11px);}
}
@media screen and (max-width:499px){
	#mainbody11 .wrap1 {padding-top:120px;}
	#mainbody11 .ht3 {margin-bottom:30px;}
	#mainbody11 .img1list li {width:calc(50% - 9px);margin-bottom:10px;}
}
@media screen and (max-width:399px){
	#mainbody11 .wrap1 {padding-top:80px;padding-bottom:25px;}
	#mainbody11 .img1list li {width:calc(50% - 5px);margin-left:6px;margin-bottom:8px;}	
}

#mainbody12 {background:#000;overflow:hidden;}
#mainbody12 .wrap1 {margin:0;max-width:none;padding:0;position:static;width:100%;height:100%;}
#mainbody12 #video1 {position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;}
#mainbody12 #video1 video {position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;width:auto;height:auto;transform:translate(-50%, -50%);object-fit:cover;}
#mainbody12 #video1 .menu .timer {position:absolute;width:88.6%;bottom:110px;left:5.7%;z-index:1}
#mainbody12 #video1 .menu .timer:after {position:absolute;top:0;left:0;content:"";display:block;width:100%;height:7px;background:rgba(255,255,255,.3);border-radius:9999px;}
#mainbody12 #video1 .menu .timer .bar1 {position:relative;display:block;width:0;height:7px;margin-bottom:17px;z-index:2;overflow:hidden;border-radius:9999px;}
#mainbody12 #video1 .menu .timer .bar1:before {position:absolute;top:0;left:0;content:"";display:block;width:100%;height:7px;background:#eb4050;}
#mainbody12 #video1 .menu .timer .t1 {display:block;color:#fff;font-size:16px;font-weight:700;line-height:1.1;font-variant-numeric:tabular-nums;letter-spacing:-.05em;}
#mainbody12 #video1 .controls .m {position:absolute;top:50%;left:50%;width:160px;height:160px;margin:-80px;border:0;background:url(../../img/main/main_sprite.png) no-repeat;background-size:1000px auto;text-indent:-9999px;border-radius:100%}
#mainbody12 #video1 .controls .m[disabled] {display:none}
#mainbody12 #video1 .controls .m.stop {background-position:-598px -93px}
#mainbody12 #video1 .controls .m.play {background-position:-840px 0;}
@media screen and (max-width:1719px){
	#mainbody12 #video1 video {height:100%;}
}
@media screen and (max-width:1529px){
	#mainbody12 #video1 video {width:100%;object-fit:contain}
	#mainbody12 #video1 .menu .timer {bottom:9%}	
}
@media screen and (max-width:1259px){
	#mainbody12 #video1 {position:relative;height:0;padding-bottom:56.25%;overflow:hidden;}
	#mainbody12 #video1 .controls .m {width:112px;height:112px;background-size:700px auto;margin:-56px}
	#mainbody12 #video1 .controls .m.stop {background-position:-419px -65px}
	#mainbody12 #video1 .controls .m.play {background-position:-588px 0;}
}
@media screen and (max-width:999px){
	#mainbody12 #video1 .controls .m {width:80px;height:80px;background-size:500px auto;margin:-40px}
	#mainbody12 #video1 .controls .m.stop {background-position:-299px -47px}
	#mainbody12 #video1 .controls .m.play {background-position:-420px 0;}
}
@media screen and (max-width:768px){
	#mainbody12 #video1 .controls .m {width:64px;height:64px;background-size:400px auto;margin:-32px}
	#mainbody12 #video1 .controls .m.stop {background-position:-239px -37px}
	#mainbody12 #video1 .controls .m.play {background-position:-336px 0;}
	#mainbody12 #video1 .menu .timer .t1 {font-size:15px}
}
@media screen and (max-width:599px){
	#mainbody12 #video1 .controls .m {width:48px;height:48px;background-size:300px auto;margin:-24px}
	#mainbody12 #video1 .controls .m.stop {background-position:-179px -28px}
	#mainbody12 #video1 .controls .m.play {background-position:-252px 0;}
	#mainbody12 #video1 .menu .timer .t1 {font-size:14px}
}



/* 애니메이션 */
@keyframes bounce-in-top {
  0% {
	transform:translateY(-70px);
	animation-timing-function:ease-in;
    opacity:0;
  }
  38% {
	transform:translateY(0);
	animation-timing-function:ease-out;
    opacity:1;
  }
  55% {
	transform:translateY(-45px);
	animation-timing-function:ease-in;
  }
  72% {
	transform:translateY(0);
	animation-timing-function:ease-out;
  }
  81% {
	transform:translateY(-28px);
	animation-timing-function:ease-in;
  }
  90% {
	transform:translateY(0);
	animation-timing-function:ease-out;
  }
  95% {
	transform:translateY(-8px);
	animation-timing-function:ease-in;
  }
  100% {
	transform:translateY(0);
	animation-timing-function:ease-out;
  }
}

@keyframes bounce-in-fwd {
  0% {
	transform:scale(0);
	animation-timing-function:ease-in;
    opacity:0;
  }
  38% {
	transform:scale(1);
	animation-timing-function:ease-out;
    opacity:1;
  }
  55% {
	transform:scale(0.85);
	animation-timing-function:ease-in;
  }
  72% {
	transform:scale(1);
	animation-timing-function:ease-out;
  }
  81% {
	transform:scale(0.9);
	animation-timing-function:ease-in;
  }
  89% {
	transform:scale(1);
	animation-timing-function:ease-out;
  }
  95% {
	transform:scale(0.95);
	animation-timing-function:ease-in;
  }
  100% {
	transform:scale(1);
	animation-timing-function:ease-out;
  }
}

@keyframes ani-rotate {
  0% {transform:rotate(0)}
  50% {transform:rotate(50deg)}
  100% {transform:rotate(90deg)}
}