@charset "utf-8";  
.visual {position:relative; height:100vh; padding-top:250px; overflow:hidden;}
.visual .visual_list{position:absolute; top:0%; left:0%; width:100%; height:100%; z-index:-1; overflow:hidden}
.visual .visual_list:after {position:absolute; top:0%; left:0%; width:100%; height:270px; content:""; background:linear-gradient(to bottom, rgba(119,142,189,.8), rgba(119,142,189,0)); mix-blend-mode:multiply;}
.visual .visual_list>li{opacity:0;  position:absolute; top:0%; left:0%; width:100%; height:100%; background-size:cover; background-position:center center; background-repeat:no-repeat; transition:opacity ease 1s; text-indent:-5000px;}
.visual .visual_list>li:first-child{display:block;}
.visual .visual_list>li.bg1{background-image:url(/skypost/img/main/visual2025_01.jpg)}
.visual .visual_list>li.bg2{background-image:url(/skypost/img/main/visual2025_02.jpg)}
.visual .visual_list>li.bg3{background-image:url(/skypost/img/main/visual2025_03.jpg)}
.visual .visual_list>li.bg4{background-image:url(/skypost/img/main/visual2025_04.jpg)}
.visual .visual_list>li.bg5{background-image:url(/skypost/img/main/visual2025_05.jpg)}
.visual .visual_list>li.bg6{background-image:url(/skypost/img/main/visual2025_06.jpg)}
.visual .visual_list>li.select{opacity:1; -webkit-animation:visualBg 2s ease alternate forwards; animation:visualBg 2s ease alternate forwards;}
@keyframes visualBg{
	0%{top:-10%; left:-10%; width:120%; height:120%}
	100%{top:0%; left:0%; width:100%; height:100%} 
} 

.visual_btn {display:flex; gap:5px; position:absolute; bottom:60px; left:50%; padding:11px 25px; padding-right:210px; border-radius:22px; backdrop-filter:blur(2px); background:rgba(0,0,0,.55); box-shadow:0 0 22px rgba(0,0,0,.3) inset; transform:translateX(-50%);}
.visual_btn a {display:block;}
.visual_btn .circle {display:block; width:15px; height:15px; overflow:hidden; font-size:0; text-indent:-5000px; background:no-repeat center top;}
.visual_btn .btn_prev .circle {background-image:url('/skypost/img/main/visual_btn_prev.png');}
.visual_btn .btn_next .circle {background-image:url('/skypost/img/main/visual_btn_next.png');}
.visual_btn .btn_stop .circle {background-image:url('/skypost/img/main/visual_btn_stop.png');}
.visual_btn .btn_num .circle {border-radius:50%; border:1px solid #fff;}
.visual_btn .btn_num.select .circle {background:#fff;}
.visual_btn .tit {display:none; position:absolute; right:25px; top:5px; text-align:center; width:170px; letter-spacing:-1px; color:#fff; font-size:17px;}
.visual_btn .btn_num.select .tit {display:block;}

.slogan {text-align:center; font-weight:bold; font-size:60px; color:#fff; font-family:'KBIZHanmaumMyungjo'; text-shadow:0 0px 8px rgba(0,0,0,.8), 0 0 5px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,5); opacity:0; transform:translateY(-15px); transition:2.5s;}
.slogan.on {opacity:1; transform:translateY(0);}

.mdbtns {display:flex; gap:8px; max-width:810px; width:80%; margin:40px auto;}
.visual_search {flex:1 1 auto; padding:0 40px; border:1px solid #fff; border-radius:80px; background:rgba(0,0,0,.55);}
.visual_search input[type=text] {width:calc(100% - 40px); color:#fff; font-size:25px; line-height:80px; height:80px; border:0; background:none;}
.visual_search input[type=text]::placeholder {color:#fff; font-family:'GyeonggiTitleM'}
.visual_search input[type=submit] {width:35px; height:36px; border:0; background:url('/skypost/img/inc/search_submit.png') no-repeat; overflow:hidden; text-indent:-100%; font-size:0;}
.btn_find {position:relative; display:block; padding:0 70px 0 25px; height:80px; font-size:25px; line-height:80px; color:#fff; font-family:'GyeonggiTitleM'; border:1px solid #072185; border-radius:80px; background:linear-gradient(to right, #4d33e5, #6d1ec7); z-index:1;}
.btn_find:after {position:absolute; content:""; top:0; right:0; left:0; bottom:0; background:linear-gradient(to right, #304dfc, #4d33e5); border-radius:80px; transition:1s; z-index:-1;}
.btn_find:before {position:absolute; content:""; top:22px; right:25px; width:34px; height:34px; background:url('/skypost/img/main/find_link.png');}
.btn_find:hover {text-decoration:none;}
.btn_find:hover:after {opacity:0;}
#quick .remote{display:none !important; border-radius:5px 0px 0px 0px}

.additional {position:absolute; right:20px; bottom:20px;}
.additional>li {float:left; margin-left:10px; padding:7px 20px 9px 40px; color:#282828; font-size:16px; font-weight:500; letter-spacing:-0.5px; background:#fff no-repeat 15px center; border-radius:10px;}
.additional>li.tel {background-image:url('/skypost/img/main/ic_phone.gif');}
.additional>li.count {background-image:url('/skypost/img/main/ic_counter.gif');}

.grave_btn{position:fixed;right:0;top: 30%;margin-top: 165px;width:120px;z-index:999;}
.grave_btn a{display:block; text-align:center; padding:18px 0px 15px 0px; color:#fff; font-size: 14px; background:#053dae; border-radius:5px 0px 0px 5px; box-shadow:0px 0px 5px rgba(0,0,0,.3);}
.grave_btn a:before{display:inline-block; content:''; width:100%; height:47px; background-repeat:no-repeat; background-position:center top; background-size:48px }
.grave_btn .btn_vr a:before{background:url('/skypost/img/main/ic_vr.png') no-repeat center top/48px}
.grave_btn .btn_grave a{background:#2458cf}
.grave_btn .btn_grave a:before{background:url('/skypost/img/main/iclink04_on.png') no-repeat center top/30px}

#contents>.wrap {display:grid; gap:40px; grid-template-columns:485px auto auto; grid-template-rows:auto auto auto; width:1400px; padding:60px 0;}
#contents>.wrap .lCon {grid-row:span 3; padding-right:5px;}
#contents>.wrap .icLink,
#contents>.wrap .findStep {grid-column:span 2;}

.popupzone{position:relative; max-width:100%; border-radius:10px; overflow:hidden;}
.popupzone ul.list{white-space:nowrap; font-size:0px}
.popupzone ul.list li{display:inline-block; width:100%}
.popupzone ul.list li img{width:100%;}
.popupzone ul.control{position:absolute; right:15px; top:15px; padding:0 15px 0 20px; border-radius:38px; background:rgba(0,0,0,.5); overflow:hidden; z-index:1;}
.popupzone ul.control li{float:left; margin:0 1px;}
.popupzone ul.control li a{display:block; position:relative; width:19px; height:20px; margin-top:10px; text-indent:-5000px; font-size:0px}
.popupzone ul.control li a:after,
.popupzone ul.control li a:before{display:block; content:''; position:absolute; top:0; left:45%; width:3px; height:55%; border-radius:3px; background:#fff}
.popupzone ul.control li a:after{margin-top:36%}
.popupzone ul.control li.num {margin-right:5px; color:#fff; font-size:17px; line-height:38px;}
.popupzone ul.control li.prev a:before{transform:rotate(45deg)}
.popupzone ul.control li.prev a:after{transform:rotate(-45deg)}
.popupzone ul.control li.next a:before{transform:rotate(-45deg)}
.popupzone ul.control li.next a:after{transform:rotate(45deg)}
.popupzone ul.control li.stop a:after,
.popupzone ul.control li.stop a:before{margin:3px -3px; width:3px; height:65%}
.popupzone ul.control li.stop a:after{margin-left:3px}
.popupzone ul.control li.play{display:none;}
.popupzone ul.control li.play a:before{display:none;}
.popupzone ul.control li.play a:after{margin-top:2px; margin-left:-2px; width:0px; height:1px; border:6px solid transparent; border-width:7px 9px; border-left-color:#fff; border-radius:2px; background:none;}

.icLink {display:flex; flex:0 0 100%; justify-content:space-between; align-items:center; text-align:center;}
.icLink>li {flex:1;}
.icLink>li>a {position:relative; display:block; padding-top:75px; font-size:18px; font-weight:500; background-repeat:no-repeat; background-position:center top; transition:.4s;}
.icLink .i01 {background-image:url('/skypost/img/main/iclinks01.png');}
.icLink .i02 {background-image:url('/skypost/img/main/iclinks02.png');}
.icLink .i03 {background-image:url('/skypost/img/main/iclinks03.png');}
.icLink .i04 {background-image:url('/skypost/img/main/iclinks04.png');}
.icLink .i05 {background-image:url('/skypost/img/main/iclinks05.png');}
.icLink .i06 {background-image:url('/skypost/img/main/iclinks06.png');}
.icLink>li>a:hover{text-decoration:none;}
.icLink>li>a:after{content:''; position:absolute; left:0; right:0; top:50%; width:90%; height:0; margin:auto; border-radius:5px; background:#fff; box-shadow:0 0 10px rgba(0,0,0,.2); z-index:-1; opacity:0; transition:.4s;}
.icLink>li>a:hover:after{top:-25%; height:150%; opacity:1;}


.letter {position:relative; flex:0 1 490px; display:flex; flex-direction:column; justify-content:center; max-width:100%; padding:52px; color:#fff; border-radius:10px; background:url('/skypost/img/main/letter_bg2025.jpg') no-repeat right bottom; background-size:cover; overflow:hidden;}
.letter_ttl {font-size:35px; font-family:'GyeonggiTitleM';  font-weight:normal; letter-spacing:-1px;}
.letter_txt {margin-top:15px; margin-bottom:30px; font-size:18px;}
.letter_link {display:inline-block; padding:0 25px; font-size:18px; color:#fff; line-height:53px; border-radius:53px; border:1px solid #fff; background:rgba(0,0,0,.3) no-repeat right 25px center; transition:.5s;}
.letter_link:hover {text-decoration:none; color:#254f90; background-color:#fff;}
.letter_link:nth-child(2) {padding-right:55px; color:#ffdc97; font-weight:500; border-color:#ffdc97; background-image:url('/skypost/img/main/letter_book.png');}
.letter_link:nth-child(2):hover {color:#111; background-color:#ffdc97; background-image:url('/skypost/img/main/letter_book_on.png')}
.letter_ttl:before {position:absolute; right:22px; top:95px; width:160px; height:119px; background:url('/skypost/img/main/letter_obj.png') no-repeat; z-index:5; content:"";}
.letter:before {position:absolute; right:182px; top:115px; width:51px; height:48px; background:url('/skypost/img/main/letter_obj_w1.png') no-repeat; z-index:1; content:""; animation-name:padak; animation-duration:5s; animation-iteration-count:infinite;}
.letter:after {position:absolute; right:12px; top:125px; width:50px; height:47px; background:url('/skypost/img/main/letter_obj_w2.png') no-repeat; z-index:1; content:""; animation-name:padak2; animation-duration:5s; animation-iteration-count:infinite;}
@keyframes padak { 
	0% {transform:rotate(0);}
	50% {transform:translateY(5px) rotate(-15deg);}
	100% {transform:rotate(0);}
}
@keyframes padak2 { 
	3% {transform:rotate(0);}
	50% {transform:translateY(5px) rotate(15deg);}
	98% {transform:rotate(0);}
}

.vr {flex:1 1 calc(100% - 530px); position:relative;  padding:57px 10px; padding-left:37px; border-radius:10px; background:url('/skypost/img/main/vr_bg2025.jpg') #c6e2b5 no-repeat right bottom;}
.vr_ttl {font-size:35px; font-family:'GyeonggiTitleM'; font-weight:normal; letter-spacing:-1px; line-height:42px;}
.vr_txt {margin:20px 0 30px; letter-spacing:-1px;}
.vr_link {display:inline-block; padding:0 25px; font-weight:500; font-size:18px; line-height:53px; border-radius:53px; border:1px solid #000; background:rgba(198,226,181,.8); transition:.5s;}
.vr_link:hover {text-decoration:none; color:#fff; background:#000;}
.vr:before {position:absolute; right:7%; bottom:33.5%; width:28px; height:40px; background:url('/skypost/img/main/vr_pointer.png') no-repeat; content:"";
					animation-name:vrPoint; animation-duration:1s;  animation-fill-mode:both; animation-iteration-count:infinite; animation-timing-function:ease;}
@keyframes vrPoint { 
	0% {opacity:.8; transform:translateY(-5px); }
	50% {opacity:1; transform:translateY(5px);}
	100% {opacity:.8; transform:translateY(-5px);}
}

.findStep {display:flex; flex:1 1 100%; background:#fafafa; border:1px solid #888; border-radius:10px;}
.findStep>div.ttl {position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; flex:0 0 27%;}
.findStep>div.ttl:before {position:absolute; right:0; top:25px; bottom:25px; border-left:1px solid #888; content:"";}
.findStep .findStep_ttl {font-size:35px; font-family:'GyeonggiTitleM'; font-weight:normal; letter-spacing:-1px; line-height:42px;}
.findStep .findStep_link { display:inline-block; padding:0 10px; margin-top:15px; font-weight:500; font-size:18px; line-height:53px; border-radius:53px; border:1px solid #666; transition:.5s; letter-spacing:-1px;}
.findStep .findStep_link:hover {text-decoration:none; background:#222; color:#fafafa;}
.findStep .listWrap {position:relative; padding-right:95px;}
.findStep .listWrap #findStepList {overflow:hidden;}
.findStep .listWrap .list {position:relative; width:calc(100% + 7px); white-space:nowrap; font-size:0;}
.findStep .listWrap .list>li {position:relative; text-align:center; display:inline-block; padding:43px 0; width:33.33%; font-size:18px;}
.findStep .listWrap .list>li img {margin-bottom:4px;}
.findStep .listWrap .list>li:not(.lastStep):after {position:absolute; top:calc(50% - 20px); right:-5px; width:11px; height:19px; background:url('/skypost/img/main/findstep_arr.gif'); content:"";}
.findStep .listWrap .control .next a {position:absolute; right:20px; top:50%; width:55px; height:55px; border-radius:50%; font-size:0; overflow:hidden; text-indent:-5000px; background:rgba(0,0,0,.5); transform:translateY(-50%);}
.findStep .listWrap .control .next a:before {position:absolute; top:18px; left:19px; width:21px; height:5px; border-radius:3px; background:#fff; transform:rotate(45deg); content:"";}
.findStep .listWrap .control .next a:after {position:absolute; top:30px; left:19px; width:21px; height:5px; border-radius:3px; background:#fff; transform:rotate(-45deg); content:"";}


.relatedSite{position:relative; margin-top:3%; border-top:1px solid #ddd;}
.relatedSite .btn>li{display:block; position:absolute; top:15px}
.relatedSite .btn>li.next{right:0px}
.relatedSite .btn>li a{display:block; position:relative; width:30px; text-indent:-5000px}
.relatedSite .btn>li a:after{display:block; content:''; position:absolute; left:10px; top:6px; width:10px; height:10px; border:2px solid #333; border-width:0px 0px 2px 2px; transform:rotate(45deg); border-radius:1px}
.relatedSite .btn>li.next a:after{transform:rotate(225deg);}
.relatedSite div{margin:0px 70px; padding:15px 0px; overflow:hidden}
.relatedSite div ul{white-space:nowrap; position:relative;}
.relatedSite div ul li{display:inline-block; margin-right:25px; font-size:.95em}
.relatedSite div ul li+li:before{display:block}

/***************************************************************************************************************************/
@media all and (min-width:2000px){
	.visual .visual_bg img {max-width:unset; width:100%;}
}

@media all and (max-width:1280px){
	
	.visual {min-height:850px;}
	.visual_btn {bottom:100px;}
	.additional {left:50%; bottom:35px; right:auto; transform:translateX(-50%);}
	.additional>li:first-child {margin-left:0;}
	
	.grave_btn{position:static; margin:0px; width:100%; overflow:hidden}
	.grave_btn>li{float:left; width:50%}
	.grave_btn>li+li a{border-left:1px solid rgba(0,0,0,.4)}
	.grave_btn a{font-size:16px; padding:12px 5px 10px; border-radius:0px; box-shadow:none}
	.grave_btn a:before{margin-right:8px; width:35px; height:33px; vertical-align:middle;}
	.grave_btn .btn_vr a:before{background-size:contain}
	
	
	#contents>.wrap {gap:40px 30px; grid-template-columns:485px auto; width:90%;}
	#contents>.wrap>* {order:1;}
	#contents>.wrap .lCon {grid-row:span 2; padding-right:0;}
	#contents>.wrap .icLink {order:0;}
	#contents>.wrap .findStep {order:2;}
	
	.letter_txt {font-size:16px;}
	.letter_ttl:before {width:100px; background-size:100% auto;}
	.letter:before {right:125px; width:30px; background-size:100% auto;}
	.letter:after {right:12px; width:31px; background-size:100% auto;}
	.letter_link {margin-bottom:3px;}
	
}

@media all and (max-width:930px){
	.visual {height:auto; padding:28% 5% 28%; background-size:auto 120%;}
	.slogan {font-size:8vw;}
	
	
	#contents>.wrap {gap:20px; grid-template-columns:100%;}
	#contents>.wrap>* {width:100%;}
	#contents>.wrap .lCon {grid-row:span 1; padding-right:0;}
	#contents>.wrap .icLink,
	#contents>.wrap .findStep {grid-column:span 1;}
		
	.notice {padding-top:30px; padding-bottom:20px; margin-bottom:30px;}
	.notice:after {height:100%;}
	.notice .wrap{width:95%; margin-left:5%;}
	.notice_list>ul {display:block; margin-top:10px; white-space:nowrap; overflow:scroll;}
	.notice_list>ul>li {display:inline-block; vertical-align:top; width:330px; padding:20px; max-width:80%; white-space:normal;}


	.relatedSite {display:none}
	.popupzone {width:100%;}
	.mdbtns {flex-wrap:wrap; justify-content:center;}
	
	.additional .count {display:none;}
	.icLink {flex-wrap:wrap; padding-bottom:15px;}
	.icLink>li {flex:0 0 33.33%;}
	.letter {flex:1 1 100%; padding:50px 37px;}
	
	.vr_ttl br {display:none;}
	.findStep {display:block; padding:32px 25px; width:100%;}
	.findStep>div.ttl {display:block; text-align:;}
	.findStep .listWrap .list>li {width:50%;}
	.findStep>div.ttl:before {display:none;}
	.findStep .listWrap {padding-right:0;}
	.findStep .listWrap .list>li {/* padding-bottom:0; */}
	.findStep .findStep_link {padding:0 25px;}
	.findStep .listWrap .control .next a {top:auto; bottom:-15.5px; right:auto; left:50%; text-indent:0; font-size:15px; height:auto; width:auto; padding:5px 35px 5px 15px; color:#111; border-radius:0; background:none; transform:translateX(-50%);}
	.findStep .listWrap .control .next a:after {left:0; right:0; top:auto; bottom:0px; width:auto; height:2px; border-radius:0; background:#111; transform:none;}
	.findStep .listWrap .control .next a:before {right:0; left:auto; top:auto; bottom:8px; width:20px; height:2px; border-radius:0; background:#111;}
}

@media all and (max-width:650px){
	.visual_search {margin:5% auto 0; padding:0 25px;}
	.visual_search input[type=text] {height:58px; line-height:58px; font-size:4vw;}
	.btn_find {height:58px; line-height:58px; font-size:4vw;}
	.btn_find:before {top:50%; transform:translateY(-50%);}
}

@media all and (max-width:495px){

	.popupzone ul.control {padding:0 15px;}
	.popupzone ul.control li.num {line-height:32px; font-size:15px;}
	.popupzone ul.control li a {margin-top:7px;}
	
	.notice_ttl {font-size:25px;}
	.notice_list>ul>li dt {margin-bottom:50px; padding-bottom:0; font-size:16px;}
	.notice_list>ul>li dt a{height:53px; overflow:hidden;}
	.notice_list>ul>li dt:after {margin-bottom:-25px;}
	.notice_list>ul>li dd {font-size:14px;}
	.notice_list>ul>li dd a {height:90px; overflow:hidden;}
	.notice_list>ul>li dd .date {font-size:14px;}
	
	.visual {min-height:auto;}
	.icLink>li>a {font-size:16px;}
	.visual_btn .tit {display:none !important;}
	.visual_btn {padding-right:25px;}
	.letter_link {padding:0 15px; font-size:16px;}
	.letter_link:nth-child(2) {padding-right:45px; background-position:right 15px center;}
	
	.additional>li.tel {width:220px;}
	
	.btn_find {display:none;}
	.visual_btn {display:none;}
	.visual_search {margin-top:0;}
	.visual {padding:22% 5% 7.5%;}
	.mdbtns {margin-top:30px;}
	.additional {display:none;}

}


@media print {
	body {print-color-adjust:exact; -webkit-print-color-adjust:exact;}
	header {display:none !important;}	
	.dp_mb{display:none !important;}
}