@charset "utf-8";


/****************** Main Layout *************************************/
.main-contents{width: 100%; padding-bottom: 300px;}
.main-contents > .inner{width: 100%; max-width: 1420px; padding-left: 20px; padding-right: 20px; margin: 0 auto;}

@media screen and (max-width: 1050px){ 
	.main-contents{padding-bottom: 100px;}
}







/****************** 메인 슬라이드 *************************************/
.main_visual_slide_box{position: relative; overflow: hidden;}
#main_slider{width: 100%; position: relative;}
#main_slider .btn_sl{width: 25px; height: 45px; display: block; overflow: hidden; text-indent: -9999px; background-repeat: no-repeat; background-position: center center; position: absolute; top: calc(50% - 22.5px); z-index: 10;}
#main_slider .btn_sl.prev{background-image: url('../images/ic_slide_arrow_left.svg'); left: 20px;}
#main_slider .btn_sl.next{background-image: url('../images/ic_slide_arrow_right.svg'); right: 20px;}
#main_slider .swiper-slide{position: relative;}
#main_slider .swiper-slide::after{content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; background: linear-gradient(180deg, rgba(0,0,0,.34) 0%, rgba(0,0,0,0) 100%);}
#main_slider .swiper-slide .img_box{position: relative; z-index: 1; width: 100%; height: 730px;}
#main_slider .swiper-slide .img_box img{width: 100%; height: 100%; object-fit: cover; object-position: center center;}

#main_slider .swiper-slide .text_box{position: absolute; z-index: 4; left: 0; top: 0; width: 100%; height: 100%; text-align: center; display: flex; justify-content: center; align-items: center; flex-direction: column;}
#main_slider .swiper-slide .desc{color: white; text-shadow: 0 0 5px rgba(0,0,0,.30); font-family: var(--font-sCoreDream); font-size: 22px; font-weight: 200; margin-bottom: 5px; opacity: 0;}
#main_slider .swiper-slide .title{color: white; text-shadow: 0 0 5px rgba(0,0,0,.30); font-family: var(--font-sCoreDream); font-size: 50px; font-weight: 500; opacity: 0;}

#main_slider .swiper-slide.swiper-slide-active .desc{animation: fadeUp .8s .5s forwards;}
#main_slider .swiper-slide.swiper-slide-active .title{animation: fadeUp .8s .9s forwards;}


@keyframes fadeUp{
	from{
		opacity: 0;
		transform: translateY(30px);
	}

	to{
		opacity: 1;
		transform: translateY(0);
	}
}



@media screen and (max-width: 1050px){
	#main_slider .btn_sl{width: 20px; height: 40px; top: calc(50% - 20px); background-size: 100%;}
	#main_slider .btn_sl.prev{left: 8px;}
	#main_slider .btn_sl.next{right: 8px;}
	#main_slider .swiper-slide .img_box{height: 400px;}

	#main_slider .swiper-slide .desc{font-size: 14px;}
	#main_slider .swiper-slide .title{font-size: 25px;}
}









/****************** 메인 버튼 *************************************/
.main_visual_button_box{margin-top: -70px; position: relative; z-index: 10;}
.main_visual_button_box .inner{width: 100%; max-width: 925px; margin: 0 auto; display: flex;}
.main_visual_button_box .left_box{flex: 1 0 50%; border-radius: 50px 0 0 0; background-color: white; border: 1px solid var(--mainBtnNavy); padding: 45px 40px 45px 60px; color: var(--mainBtnNavy); display: flex; flex-wrap: wrap;}
.main_visual_button_box .right_box{flex: 1 0 50%; border-radius: 0 0 50px 0; background-color: var(--mainBtnNavy); border: 1px solid var(--mainBtnNavy); padding: 45px 40px 45px 60px; color: white; display: flex; flex-wrap: wrap;}
.main_visual_button_box h2{font-size: 25px; font-family: var(--font-sCoreDream); font-weight: 500; font-size: 25px; margin-bottom: 5px; width: 100%;}
.main_visual_button_box h3{font-size: 15px;}
.main_visual_button_box .btn_more{margin-left: auto; flex-shrink: 0; align-self: flex-end; min-width: 115px; height: 30px; border-radius: 20px; text-align: center; font-weight: 400; font-size: 13px; transition: .25s;}
.main_visual_button_box .left_box .btn_more{color: white; background-color: var(--mainBtnNavy);}
.main_visual_button_box .left_box .btn_more:hover{background-color: #101589;}
.main_visual_button_box .right_box .btn_more{color: var(--mainBtnNavy); background-color: white; font-weight: 500;}
.main_visual_button_box .right_box .btn_more:hover{background-color: #e0e2ff;}



@media screen and (max-width: 1050px){
	.main_visual_button_box{margin-top: -50px;}
	.main_visual_button_box .inner{padding: 0 30px; flex-wrap: wrap;}
	.main_visual_button_box .left_box{flex: auto; width: 100%; border-radius: 20px 0 20px 0; padding: 25px 20px 25px 30px; margin-bottom: 10px;}
	.main_visual_button_box .right_box{flex: auto; width: 100%; border-radius: 20px 0 20px 0; padding: 25px 20px 25px 30px;}
	.main_visual_button_box h2{font-size: 16px;}
	.main_visual_button_box h3{font-size: 13px;}
	.main_visual_button_box .btn_more{min-width: 90px; font-size: 11px;}
}








/****************** 통일전망대 관람내용 *************************************/
.main_sight_explain_box{margin-top: 180px; border-radius: 20px; background-color: var(--gray-bg-welcome); padding: 30px 90px; display: flex; gap: 20px 70px; align-items: center;}
.main_sight_explain_box .text_box{flex: 1; padding: 50px 0 50px;}
.main_sight_explain_box .img_box{flex-shrink: 0;}
.main_sight_explain_box .cate{font-family: var(--font-sCoreDream); color: var(--primary-navy); font-size: 15px; font-weight: 900; letter-spacing: 0.5em; margin-bottom: 15px;}
.main_sight_explain_box h2{font-family: var(--font-sCoreDream); color: var(--black3); font-weight: 500; font-size: 40px; letter-spacing: -0.06em; margin-bottom: 17px;}
.main_sight_explain_box h2 b{font-weight: 700; color: var(--primary-blue);}
.main_sight_explain_box h3{font-size: 18px; color: #555; line-height: 1.6; font-weight: 400;}



@media screen and (max-width: 1050px){
	.main_sight_explain_box{margin-top: 80px; padding: 50px 35px 40px; display: block;}
	.main_sight_explain_box .text_box{width: 100%; padding: 0 0 0;}
	.main_sight_explain_box .img_box{width: 100%; text-align: center; margin-top: 25px;}
	.main_sight_explain_box .cate{font-size: 12px; margin-bottom: 10px;}
	.main_sight_explain_box h2{font-size: 20px; margin-bottom: 15px;}
	.main_sight_explain_box h3{font-size: 13px;}
	.main_sight_explain_box h3 br{display: none;}
}








/****************** 프로세스 *************************************/
.main-contents .sec{margin-top: 200px;}
.main-contents .sec h2{font-family: var(--font-sCoreDream); color: #333; line-height: 1.3; font-weight: 500; font-size: 40px; text-align: center;}
.main-contents .sec h2 b{color: var(--primary-blue);}
.main-contents .sec h3{font-size: 20px; color: #777; margin-top: 13px; text-align: center; margin-bottom: 65px;}


.main_process_step_list{ width: 100%; max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 120px 90px;}
.main_process_step_list > li{text-align: center; position: relative;}
.main_process_step_list > li::after{content: ""; position: absolute; right: -95px; top: 80px; width: 95px; height: 15px; background: url('../images/ic_arrow_long_right.svg') no-repeat center center; background-size: 100%;}
.main_process_step_list > li:nth-of-type(3n)::after{display: none;}

.main_process_step_list .icons{width: 150px; height: 150px; margin: 0 auto 28px; display: flex; justify-content: center; align-items: center; border: 1px solid #EDEDED; background-color: #F9FAFE; border-radius: 50px 0 50px 0; padding: 20px;}
.main_process_step_list .step{display: inline-block; min-width: 97px; padding: 5px 10px; border-radius: 30px; background-color: #EFF1FD; color: var(--primary-blue); font-size: 16px; font-weight: 500; margin-bottom: 25px;}
.main_process_step_list .tit{font-size: 18px; font-weight: 700; color: #111; margin-bottom: 12px;}
.main_process_step_list .desc{font-size: 15px; font-weight: 400; line-height: 1.4; color: #444;}
.main_process_step_list .desc b{font-weight: 600; color: #222;}
.main_process_step_list .sub{font-size: 13px; font-weight: 400; line-height: 1.4; margin: 12px; color: #999;}


@media screen and (max-width: 1050px){
	.main-contents .sec{margin-top: 80px;}
	.main-contents .sec h2{font-size: 20px;}
	.main-contents .sec h3{font-size: 14px; margin-top: 10px; margin-bottom: 35px;}


	.main_process_step_list{grid-template-columns: repeat(2, 1fr); gap: 30px 8%;}
	.main_process_step_list > li::after{display: none;}

	.main_process_step_list .icons{width: 90px; height: 90px; margin: 0 auto 15px; border-radius: 20px 0 20px 0; padding: 25px;}
	.main_process_step_list .step{min-width: 70px; padding: 5px 10px; font-size: 12px; margin-bottom: 15px;}
	.main_process_step_list .tit{font-size: 16px; margin-bottom: 10px;}
	.main_process_step_list .desc{font-size: 12px;}
	.main_process_step_list .desc br{display: none;}
	.main_process_step_list .sub{font-size: 11px; margin: 10px;}
	.main_process_step_list .sub br{display: none;}
}








/****************** 소식 *************************************/
.main_board_wrap{border-top: 5px solid #000; display: flex; gap: 0 94px; padding-top: 10px;}
.main_board_wrap .board{flex: 1 0 1px; min-width: 0;}
.main_board_wrap .top_box{display: flex; gap: 10px; padding: 28px 20px; border-bottom: 1px solid #bbb; align-items: center;}
.main_board_wrap .top_box h4{flex: 1; font-size: 33px; font-weight: 600; color: #000; letter-spacing: -0.04em;}
.main_board_wrap .top_box .btn_more{flex-shrink: 0; width: 20px; height: 20px; background: url('../images/ic_plus.svg') no-repeat center center; overflow: hidden; text-indent: -9999px; }

.main_board_wrap .notice_list > li{border-bottom: 1px solid #eee; display: flex; align-items: center; gap: 15px; padding: 25px 10px;}
.main_board_wrap .notice_list > li > a{flex: 1; min-width: 0; font-size: 15px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #222; line-height: 1.4;}
.main_board_wrap .notice_list > li > a:focus,
.main_board_wrap .notice_list > li > a:hover{text-decoration: underline;}
.main_board_wrap .notice_list > li > .date{font-size: 15px; color: #888;}

.main_board_wrap .faq_list > li{border-bottom: 1px solid #eee;}
.main_board_wrap .faq_list .accor_tit{width: 100%; display: block; position: relative; padding: 25px 45px 25px 10px; color: #222; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; min-height: 60px; line-height: 1.4;}
.main_board_wrap .faq_list .accor_tit::after{content: ""; width: 20px; height: 20px; position: absolute; right: 10px; top: calc(50% - 10px); background: url('../images/ic_arrow_down.svg') no-repeat center center; transition: .25s;}
.main_board_wrap .faq_list .accor_cont{display: grid; grid-template-rows: 0fr; overflow: hidden; transition: .3s ease-out;}
.main_board_wrap .faq_list .accor_cont .cont{min-height: 0;}
.main_board_wrap .faq_list .accor_cont .cont-pd{padding: 25px 35px; background-color: #FAFAFA; font-size: 14px; line-height: 1.75; color: #555;}

.main_board_wrap .faq_list .accor_tit.on{white-space: inherit; text-overflow: inherit;}
.main_board_wrap .faq_list .accor_tit.on::after{transform: rotate(180deg);}
.main_board_wrap .faq_list .accor_tit.on + .accor_cont{grid-template-rows: 1fr;}


@media screen and (max-width: 1050px){
	.main_board_wrap{border-top: 3px solid #000; display: block; padding-top: 5px;}
	.main_board_wrap .board{width: 100%; margin-bottom: 30px;}
	.main_board_wrap .top_box{padding: 15px 15px;}
	.main_board_wrap .top_box h4{font-size: 18px; font-weight: 600; color: #000; letter-spacing: -0.04em;}
	.main_board_wrap .top_box .btn_more{width: 18px; height: 18px; background-size: 12px;}

	.main_board_wrap .notice_list > li{gap: 10px; padding: 15px 10px;}
	.main_board_wrap .notice_list > li > a{font-size: 13px;}
	.main_board_wrap .notice_list > li > .date{font-size: 12px; display: none;}

	.main_board_wrap .faq_list .accor_tit{padding: 15px 45px 15px 10px; min-height: 30px; font-size: 13px;}
	.main_board_wrap .faq_list .accor_tit::after{width: 17px; height: 17px; top: calc(50% - 8px); background-size: 10px;}
	.main_board_wrap .faq_list .accor_cont .cont-pd{padding: 20px 25px; font-size: 12px;}
}








/****************** 0 *************************************/



@media screen and (max-width: 1050px){

}