@charset "utf-8";
/* *******************************************************
 * filename : main_responsive.css
 * description : 메인 레이아웃 및 컨텐츠 반응형 CSS
 * date : 2022-08-08
******************************************************** */

/* ******************  메인 비주얼 ********************** */
@media all and ( max-width: 1280px ){
	/* 공통 :: 레이아웃 */
	#fullpage .section:not(#mainVisual){height:auto !important;}
	#fullpage .fp-section .fp-tableCell{height:auto !important;}

	.page-on .main-visual-txt-box{padding-top:12rem;}
}
@media all and (max-width:800px){
	#fullpage #mainVisual{height:120vh !important;}
	.page-on .main-visual-txt-box{padding-top:var(--header-height); height:50%;}
	.main-visual-txt-box .main-visual-txt1{font-size:4rem;}
	.main-search-box{margin-top:3rem; height:7rem;}
	.main-search-box .main-search-inner{height:7rem;}
	.main-search-box .bbs-search-btn{width:5rem; height:5rem;}

	.main-visual-bottom-box{height:50%;}
	.main-visual-archive{display: block; padding:3rem 0;}
	.main-visual-archive .left-box{width:100%; position: relative;}
	.main-visual-archive .left-box .txt-box{width:calc(100% - 5rem);}
	.main-visual-archive .left-box .txt{font-size:2.4rem; margin-bottom:1.5rem;}
	.main-visual-archive .left-box .link-btn{position: absolute; top:50%; right:0; transform:translateY(-50%);}
	.main-visual-archive .left-box .link-btn .icon{width:4rem; height:4rem; line-height:4rem; font-size:2rem;}
	.main-visual-archive .left-box .link-btn .btn-txt{display: none;}
	.main-visual-archive .right-box{width:100%;}
	.main-visual-archive .right-box .main-archive-list .list-item{width:calc(50% - 2rem);}
	.main-visual-archive .right-box .main-archive-list .list-item a{padding:2rem 1.5rem;}
	.main-visual-archive .right-box .main-archive-list .list-item .txt{font-size:1.8rem;}
	.main-visual-archive .right-box .main-archive-list .list-item .num{font-size:1.3rem;}
	.main-visual-archive .right-box .main-archive-list .list-item .icon-box iframe{width:4.2rem; height:4rem;}
}

/* ******************  메인 컨텐츠 ********************** */
@media all and (max-width:1480px){
	#mainContent1 .main-top-con{height:40%;}
	#mainContent1 .main-bottom-con{height:60%}
}
@media all and (max-width:1280px){
	#mainContent1 .main-top-con{padding-top:6rem; margin-bottom:10rem;}
	.slide-box-wrap .swiper .slide-item .txt-box .tit{font-size:2.4rem;}
	.slide-box-wrap .swiper.left-swiper{margin-right:4rem;}
	.slide-box-wrap .swiper.right-swiper{margin-left:4rem;}

	#mainContent1 .main-bottom-con{margin-bottom:10rem;}
}
@media all and (max-width:800px){
	#mainContent1 .main-top-con{height:auto; padding:1rem 0;}
	#mainContent1 .main-top-con:before{width:100%; height:100%;}
	#mainContent1 .main-top-con:after{width:100%; height:50%;}
	.slide-box-wrap{display: block; }
	.slide-box-wrap .swiper{width:100%; margin-right:0 !important; margin-left:0 !important; padding:4rem 0;}
	.slide-box-wrap .swiper .slide-item .txt-box{margin-bottom:5rem;}
	.slide-box-wrap .swiper .slide-item .txt-box .tit{font-size:2rem;}
	#mainContent1 .swiper-button{bottom:5rem;}
	#mainContent1 .swiper-pagination{bottom:5rem;}
	#mainContent1 .swiper-pagination-progressbar{background:rgba(255,255,255,0.5);}


	#mainContent1 .sub-tab-content-style{margin-top:5rem;}
	.sub-tab-con .main-board-link{top:-1rem;}
	.main-board-list{flex-wrap:wrap;}
	.main-board-list .board-item{width:100%; padding-right:0;}
	.main-board-list .board-item .item-tit{width:calc(100% - 10rem);}
}
@media all and (max-width:480px){
	.slide-box-wrap .swiper{padding-bottom:6rem;}
	.slide-box-wrap .swiper .slide-item .txt-box{margin-bottom:0;}
	#mainContent1 .swiper-button{bottom:4rem;}
	#mainContent1 .swiper-pagination{bottom:4rem; width:calc(100% - 8rem); right:auto; left:0;}
}

/* ******************  메인 하단 퀵메뉴 ********************** */
@media all and (max-width:800px){
	.bottom-sub-menu{display: block;}
	.bottom-sub-menu .menu-item{width:100%;}
	.bottom-sub-menu .menu-item a .txt{font-size:2rem;}
}

/* ******************  메인 왼쪽 퀵메뉴 (Fullpage) ********************** */
@media all and (max-width:1366px){
	#fp-nav{left:10px;}
}
@media all and (max-width:1280px){
	#fp-nav{display:none !important;}
}