@charset "utf-8";

:root {
	--sidebar-width: 270px;    /* ← 교체 허용 */
	--sidebar-bg: #fff;        /* ← 교체 허용 */
	--gnb-sub-width: 340px;   /* ← 교체 허용 */
	--base: #0f489a;
}

html, body { word-break: keep-all; width: 100%; position: static; font-size: 16px; font-weight: 400; color: #666; }
section { position: relative; width: 100%; }

/* 서브페이지 콘텐츠 박스 */
section.contents_box { position: relative; padding: 0; padding-left: var(--sidebar-width); height: 100%; text-align: center; background-color: #fff; }
section.contents_box .contents { display: inline-block; max-width: 1200px; width: 100%; padding: 0; font-weight: normal; color: #666; line-height: 1.8; text-align: left; margin-top: 140px; }
section.contents_box .contents img { max-width: 100%; height: auto; }

/* 데스크탑 (1250px~) */
@media (min-width: 1250px) {
	section.contents_box { padding: 0 0 100px var(--sidebar-width); }
	.contents-wrap { position: relative; max-width: 1200px; width: 100%; margin: 0 auto; padding: 100px 0; }
	footer { display: flex !important; padding: 30px 100px; border-top: 5px solid var(--c_base1); background-color: #fff; font-size: 14px; font-weight: 400; line-height: 1; color: #666; justify-content: space-between; }
	footer strong { font-size: 16px; font-weight: 800; color: #000; display: block; padding-bottom: 10px; }
	footer a { color: #666; }
	footer address span { display: inline-block; }
	footer .goTop { border: 1px solid #dbdce7; border-radius: 3rem; padding: 12px 25px; color: var(--c_base1); font-size: 10px; font-weight: 500; height: 35px; }


	/* 페이징 PC*/
	.page_box {margin-top:48px; line-height:1; font-size:14px; text-align:center; position:relative; text-align:center; border:1px solid transparent;}
	.page_box .pagination.pc {display:flex; align-items:center; justify-content:center;}
	.page_box .pagination.pc>li {margin-left:-1px;}
	.page_box .pagination.pc>li>a {
		font-size:var(--fs18);font-weight: 300;
		color:#666; width:40px; height:40px; line-height:1;
		display: flex; align-items: center; justify-content: center;
	}
	.page_box .pagination.pc>li>a:hover {}
	.page_box .pagination.pc>li>a.active {color:var(--c_base4); font-weight:500;}
	
	.page_box .pagination.pc>li>a.first {background-image:url(/images/common/icon_page_first.svg);}
	.page_box .pagination.pc>li>a.prev {background-image:url(/images/common/icon_page_prev.svg); margin:0 25px 0 10px;}
	.page_box .pagination.pc>li>a.next {background-image:url(/images/common/icon_page_next.svg); margin:0 10px 0 25px;}
	.page_box .pagination.pc>li>a.last {background-image:url(/images/common/icon_page_last.svg);}
	
	.page_box .pagination.pc>li>a.first:hover {background-image:url(/images/common/icon_page_first_on2.svg);}
	.page_box .pagination.pc>li>a.prev:hover {background-image:url(/images/common/icon_page_prev_on2.svg);}
	.page_box .pagination.pc>li>a.next:hover {background-image:url(/images/common/icon_page_next_on2.svg);}
	.page_box .pagination.pc>li>a.last:hover {background-image:url(/images/common/icon_page_last_on2.svg);}
	
	.page_box .btn.write {margin-left:20px;}
}

/* 모바일 (~1249px) */
@media (max-width: 1249px) {
	section.contents_box .contents { margin-top: 0; }
	.contents-wrap { padding: 40px; }
	footer { padding: 25px; border-top: 5px solid var(--c_base1); text-align: left; font-size: 14px; color: #666; }
	footer strong { font-size: 16px; font-weight: 800; color: #000; display: block; padding-bottom: 5px; }

	/* 페이징 MOBILE */
	.page_box {position:relative; margin-top:50px; text-align:center;}
	.page_box .mobile {gap:10px; display:flex !important; align-items:center; justify-content:center;}
	.page_box .mobile label {display:none;}
	.page_box .mobile>li {margin-left:-1px;}
	.page_box .mobile>li>a {border:0; padding:0; color:#666; width:40px; height:40px; line-height:1; display: flex; align-items: center; justify-content: center;}
	.page_box .mobile>li>a img {height:10px;}
	.page_box .mobile>li>a:hover {background:#f0f0f0}
	.page_box .mobile>li>a.active {color:#fff; background:var(--c_base1); border:1px solid var(--c_base1);  font-weight:normal;}
	.page_box .mobile select {width:75px; height:40px; padding:0 40px 0 20px; background-position:calc(100% - 10px) 50%; }
	
	.page_box .mobile>li>a.prev {background:url(/images/common/icon_page_prev.svg)center no-repeat;}
	.page_box .mobile>li>a.next {background:url(/images/common/icon_page_next.svg)center no-repeat;}
	
	.page_box .btn.write {width:auto; padding:10px 20px;}
	.page_box .btn.write:hover {background-color:#000;}
}

/* 모바일 (0~767px) */
@media (max-width: 767px) {
	.contents-wrap { padding: 20px; }
}