/* --------------------

2번째로 호출

이 파일은 각 프로젝트에 따라 변경이 있는 유동적인 개별 css 입니다.
해당 프로젝트에만 쓰일 색상, 폰트, padding값 등 기본적인것은 이곳에 작성해 주세요.

기본값으로 설정된것은

font-family: 'Paperlogy';
color: #1c1c1c;
line-height: 100%;
font-weight: normal;
font-size: 16px;
line-height: 100%;
letter-spacing: -0.05em;

입니다.

해당 프로젝트에 관련된 변경사항이 있을때는 reset.css대신
현재 파일인 styleguide.css에 작성해주세요.

-------------------- */

/* --------------------

z-index 현황




-------------------- */

*{
	font-family: 'Paperlogy';
	letter-spacing: 0;
}
body{
	font-size: 18px;
	color: #1c1c1c;
	font-weight: 400;
}
.center{
	width: 90%;
	max-width: 1400px;
	margin: 0 auto;
}
.center1760{
	width: 90%;
	max-width: 1760px;
	margin: 0 auto;
}
.center1000{
	width: 90%;
	max-width: 1000px;
	margin: 0 auto;
}
.center500{
	width: 90%;
	max-width: 500px;
	margin: 0 auto;
}
::placeholder{color: #999;}
select{color: #5d5d5d;}



/* ---------------커스텀 클래스 START--------------- */
/* ------------------------------------------------------------------------------------------
.ctm :  small, em, i, b, strong, u 등 에디터 사용시 글자 관련 스타일 미적용 방지를 위하여 따로 작성함.
			html, php에 위 태그들을 style 초기화해서 사용 할 경우 ctm 속성 추가해서 사용.

			※꼭! 에디터로 작성된 내용이 안들어가는 객체에만 사용하세요.
			(ex. view 페이지 내용 출력 부분에는 사용 X)
------------------------------------------------------------------------------------------ */
.ctm{
	font-weight: inherit;
	font-family: inherit;
	color: inherit;
	font-style: inherit;
	text-decoration: none;
	font-size: inherit;
}
.clearfix::after{
	content: "";
	clear: both;
	display: block;
}
.hidden{
	position: fixed;
	left: -100000px;
}
.clear{clear: both;}
.pe-none{pointer-events: none;}
.drag-none{-ms-user-select: none; -moz-user-select: -moz-none; -webkit-user-select: none; -khtml-user-select: none; user-select:none;}
.scroll-none{overflow: hidden; touch-action: none;}
.tal{text-align: left;}
.tar{text-align: right;}
.tac{text-align: center;}
.test-section{height: 2000px; background-color: yellowgreen;}
@media screen and (max-width:600px){
	.mxw600-none{display: none;}
}
/* ---------------커스텀 클래스 END--------------- */



/* ---------------폰트 관련 START--------------- */
@font-face{
	font-family: 'Paperlogy';
	src: url(/assets/fonts/Paperlogy/Paperlogy-1Thin.ttf) format('truetype');
	font-style: normal;
	font-weight: 100;
}
@font-face{
	font-family: 'Paperlogy';
	src: url(/assets/fonts/Paperlogy/Paperlogy-2ExtraLight.ttf) format('truetype');
	font-style: normal;
	font-weight: 200;
}
@font-face{
	font-family: 'Paperlogy';
	src: url(/assets/fonts/Paperlogy/Paperlogy-3Light.ttf) format('truetype');
	font-style: normal;
	font-weight: 300;
}
@font-face{
	font-family: 'Paperlogy';
	src: url(/assets/fonts/Paperlogy/Paperlogy-4Regular.ttf) format('truetype');
	font-style: normal;
	font-weight: 400;
}
@font-face{
	font-family: 'Paperlogy';
	src: url(/assets/fonts/Paperlogy/Paperlogy-5Medium.ttf) format('truetype');
	font-style: normal;
	font-weight: 500;
}
@font-face{
	font-family: 'Paperlogy';
	src: url(/assets/fonts/Paperlogy/Paperlogy-6SemiBold.ttf) format('truetype');
	font-style: normal;
	font-weight: 600;
}
@font-face{
	font-family: 'Paperlogy';
	src: url(/assets/fonts/Paperlogy/Paperlogy-7Bold.ttf) format('truetype');
	font-style: normal;
	font-weight: 700;
}
@font-face{
	font-family: 'Paperlogy';
	src: url(/assets/fonts/Paperlogy/Paperlogy-8ExtraBold.ttf) format('truetype');
	font-style: normal;
	font-weight: 800;
}
@font-face{
	font-family: 'Paperlogy';
	src: url(/assets/fonts/Paperlogy/Paperlogy-9Black.ttf) format('truetype');
	font-style: normal;
	font-weight: 900;
}
.kr, .kr-all *{font-family: 'Paperlogy';}
.fw100{font-weight: 100;}
.fw200{font-weight: 200;}
.fw300{font-weight: 300;}
.fw400{font-weight: 400;}
.fw500{font-weight: 500;}
.fw600{font-weight: 600;}
.fw700{font-weight: 700;}
.fw800{font-weight: 800;}
.fw900{font-weight: 900;}

.fsz70{font-size: 70px;}
.fsz50{font-size: 50px;}
.fsz40{font-size: 40px;}
.fsz30{font-size: 30px;}
.fsz28{font-size: 28px;}
.fsz26{font-size: 26px;}
.fsz24{font-size: 24px;}
.fsz22{font-size: 22px;}
.fsz20{font-size: 20px;}
.fsz18{font-size: 18px;}
.fsz16{font-size: 16px;}
.fsz15{font-size: 15px;}
.fsz14{font-size: 14px;}
.fsz13{font-size: 13px;}
@media screen and (max-width:1350px){
.fsz70{font-size: 63px;}
.fsz50{font-size: 45px;}
.fsz40{font-size: 36px;}
.fsz30{font-size: 28px;}
.fsz28{font-size: 26px;}
.fsz26{font-size: 24px;}
.fsz24{font-size: 22px;}
.fsz22{font-size: 20px;}
.fsz20{font-size: 19px;}
.fsz18{font-size: 17px;}
}
@media screen and (max-width:1150px){
.fsz70{font-size: 56px;}
.fsz50{font-size: 40px;}
.fsz40{font-size: 32px;}
.fsz30{font-size: 26px;}
.fsz28{font-size: 24px;}
.fsz26{font-size: 22px;}
.fsz24{font-size: 20px;}
.fsz22{font-size: 19px;}
.fsz20{font-size: 18px;}
.fsz18{font-size: 16px;}
.fsz16{font-size: 15px;}
.fsz15{font-size: 14px;}
.fsz14{font-size: 13px;}
.fsz13{font-size: 12px;}
}
@media screen and (max-width:600px){
.fsz70{font-size: 49px;}
.fsz50{font-size: 35px;}
.fsz40{font-size: 29px;}
.fsz30{font-size: 24px;}
.fsz28{font-size: 22px;}
.fsz26{font-size: 20px;}
.fsz24{font-size: 18px;}
.fsz22{font-size: 17.5px;}
.fsz20{font-size: 17px;}
.fsz18{font-size: 15px;}
.fsz16{font-size: 14px;}
.fsz15{font-size: 13px;}
.fsz14{font-size: 12px;}
.fsz13{font-size: 11px;}
}
@media screen and (max-width:450px){
.fsz70{font-size: 42px;}
.fsz50{font-size: 30px;}
.fsz40{font-size: 26px;}
.fsz30{font-size: 22px;}
.fsz28{font-size: 20px;}
.fsz26{font-size: 18px;}
.fsz24{font-size: 17px;}
.fsz22{font-size: 16.5px;}
.fsz20{font-size: 16px;}
.fsz18{font-size: 14px;}
.fsz16{font-size: 13px;}
.fsz15{font-size: 12px;}
.fsz14{font-size: 11px;}
.fsz13{font-size: 10px;}
}
/* ---------------폰트 관련 END--------------- */



/* ---------------color 관련 START--------------- */
.bgc0{background-color: #389311;}
.bgc1{background-color: #4b8c2f;}
.bgc2{background-color: #6bc743;}
.bgc3{background-color: #003973;}
.bgc4{background-color: #bd2f2f;}
.bgc5{background-color: #f4f9f1;}

.bgcw{background-color: #FFF;}

.bgc-b1{background-color: #1c1c1c;}
.bgc-b2{background-color: #2c2c2c;}
.bgc-b3{background-color: #3b3b3b;}
.bgc-b4{background-color: #404040;}
.bgc-b5{background-color: #505050;}
.bgc-b6{background-color: #606060;}
.bgc-b7{background-color: #707070;}

.bgc-g1{background-color: #f7f7f7;}
.bgc-g2{background-color: #c5c5c5;}
.bgc-g3{background-color: #aaa;}
.bgc-g4{background-color: #bbb;}
.bgc-g5{background-color: #ccc;}
.bgc-g6{background-color: #7f7f7f;}
.bgc-g7{background-color: #646464;}



.txc0{color: #389311}
.txc1{color: #4b8c2f;}
.txc2{color: #6bc743;}
.txc3{color: #003973;}
.txc4{color: #bd2f2f;}
.txc5{color: #f4f9f1;}

.txcw{color: #FFF;}

.txc-b1{color: #1c1c1c;}
.txc-b2{color: #2c2c2c;}
.txc-b3{color: #3b3b3b;}
.txc-b4{color: #404040;}
.txc-b5{color: #505050;}
.txc-b6{color: #606060;}
.txc-b7{color: #707070;}

.txc-g1{color: #f7f7f7;}
.txc-g2{color: #c5c5c5;}
.txc-g3{color: #aaa;}
.txc-g4{color: #bbb;}
.txc-g5{color: #ccc;}
.txc-g6{color: #7f7f7f;}
.txc-g7{color: #646464;}



.before-bgc0::before{background-color: #389311;}
.before-bgc1::before{background-color: #4b8c2f;}
.before-bgc2::before{background-color: #6bc743;}
.before-bgc3::before{background-color: #003973;}
.before-bgc4::before{background-color: #bd2f2f;}
.before-bgc5::before{background-color: #f4f9f1;}

.after-bgc0::after{background-color: #389311;}
.after-bgc1::after{background-color: #4b8c2f;}
.after-bgc2::after{background-color: #6bc743;}
.after-bgc3::after{background-color: #003973;}
.after-bgc4::after{background-color: #bd2f2f;}
.after-bgc5::after{background-color: #f4f9f1;}



@media screen and (min-width:991.1px){
	.hover-bgc0:hover{background-color: #389311 !important;}
	.hover-bgc1:hover{background-color: #4b8c2f !important;}
	.hover-bgc2:hover{background-color: #6bc743 !important;}
	.hover-bgc3:hover{background-color: #003973 !important;}
	.hover-bgc4:hover{background-color: #bd2f2f !important;}
	.hover-bgc5:hover{background-color: #f4f9f1 !important;}

	.hover-txc0:hover{color: #389311 !important;}
	.hover-txc1:hover{color: #4b8c2f !important;}
	.hover-txc2:hover{color: #6bc743 !important;}
	.hover-txc3:hover{color: #003973 !important;}
	.hover-txc4:hover{color: #bd2f2f !important;}
	.hover-txc5:hover{color: #f4f9f1 !important;}
}
/* ---------------color 관련 END--------------- */



/* ---------------padding 관련 START--------------- */
.pd50{
	padding: 50px 0;
	box-sizing: border-box;
}
.pdt50{
	padding-top: 50px;
	box-sizing: border-box;
}
.pdb50{
	padding-bottom: 50px;
	box-sizing: border-box;
}
.pd70{
	padding: 70px 0;
	box-sizing: border-box;
}
.pdt70{
	padding-top: 70px;
	box-sizing: border-box;
}
.pdb70{
	padding-bottom: 70px;
	box-sizing: border-box;
}
.pd100{
	padding: 100px 0;
	box-sizing: border-box;
}
.pdt100{
	padding-top: 100px;
	box-sizing: border-box;
}
.pdb100{
	padding-bottom: 100px;
	box-sizing: border-box;
}
.pd150{
	padding: 150px 0;
	box-sizing: border-box;
}
.pdt150{
	padding-top: 150px;
	box-sizing: border-box;
}
.pdb150{
	padding-bottom: 150px;
	box-sizing: border-box;
}
.pd200{
	padding: 200px 0;
	box-sizing: border-box;
}
.pdt200{
	padding-top: 200px;
	box-sizing: border-box;
}
.pdb200{
	padding-bottom: 200px;
	box-sizing: border-box;
}
@media screen and (max-width:1350px){
	.pd50{padding: 45px 0;}
	.pdt50{padding-top: 45px;}
	.pdb50{padding-bottom: 45px;}
	.pd70{padding: 67px 0;}
	.pdt70{padding-top: 67px;}
	.pdb70{padding-bottom: 67px;}
	.pd100{padding: 85px 0;}
	.pdt100{padding-top: 85px;}
	.pdb100{padding-bottom: 85px;}
	.pd150{padding: 135px 0;}
	.pdt150{padding-top: 135px;}
	.pdb150{padding-bottom: 135px;}
	.pd200{padding: 180px 0;}
	.pdt200{padding-top: 180px;}
	.pdb200{padding-bottom: 180px;}
}
@media screen and (max-width:1150px){
	.pd50{padding: 40px 0;}
	.pdt50{padding-top: 40px;}
	.pdb50{padding-bottom: 40px;}
	.pd70{padding: 55px 0;}
	.pdt70{padding-top: 55px;}
	.pdb70{padding-bottom: 55px;}
	.pd100{padding: 70px 0;}
	.pdt100{padding-top: 70px;}
	.pdb100{padding-bottom: 70px;}
	.pd150{padding: 120px 0;}
	.pdt150{padding-top: 120px;}
	.pdb150{padding-bottom: 120px;}
	.pd200{padding: 160px 0;}
	.pdt200{padding-top: 160px;}
	.pdb200{padding-bottom: 160px;}
}
@media screen and (max-width:600px){
	.pd50{padding: 35px 0;}
	.pdt50{padding-top: 35px;}
	.pdb50{padding-bottom: 35px;}
	.pd70{padding: 47px 0;}
	.pdt70{padding-top: 47px;}
	.pdb70{padding-bottom: 47px;}
	.pd100{padding: 62px 0;}
	.pdt100{padding-top: 62px;}
	.pdb100{padding-bottom: 62px;}
	.pd150{padding: 100px 0;}
	.pdt150{padding-top: 100px;}
	.pdb150{padding-bottom: 100px;}
	.pd200{padding: 140px 0;}
	.pdt200{padding-top: 140px;}
	.pdb200{padding-bottom: 140px;}
}
@media screen and (max-width:450px){
	.pd50{padding: 30px 0;}
	.pdt50{padding-top: 30px;}
	.pdb50{padding-bottom: 30px;}
	.pd70{padding: 40px 0;}
	.pdt70{padding-top: 40px;}
	.pdb70{padding-bottom: 40px;}
	.pd100{padding: 55px 0;}
	.pdt100{padding-top: 55px;}
	.pdb100{padding-bottom: 55px;}
	.pd150{padding: 85px 0;}
	.pdt150{padding-top: 85px;}
	.pdb150{padding-bottom: 85px;}
	.pd200{padding: 120px 0;}
	.pdt200{padding-top: 120px;}
	.pdb200{padding-bottom: 120px;}
}
@media screen and (max-width:350px){
	.pd50{padding: 25px 0;}
	.pdt50{padding-top: 25px;}
	.pdb50{padding-bottom: 25px;}
	.pd70{padding: 35px 0;}
	.pdt70{padding-top: 35px;}
	.pdb70{padding-bottom: 35px;}
	.pd100{padding: 45px 0;}
	.pdt100{padding-top: 45px;}
	.pdb100{padding-bottom: 45px;}
	.pd150{padding: 70px 0;}
	.pdt150{padding-top: 70px;}
	.pdb150{padding-bottom: 70px;}
	.pd200{padding: 90px 0;}
	.pdt200{padding-top: 90px;}
	.pdb200{padding-bottom: 90px;}
}
.pd0{padding: 0;}
.pdt0{padding-top: 0;}
.pdb0{padding-bottom: 0;}
.pdl0{padding-left: 0;}
.pdr0{padding-right: 0;}

.pdn{padding: 0 !important;}
.pdtn{padding-top: 0 !important;}
.pdbn{padding-bottom: 0 !important;}
.pdln{padding-left: 0 !important;}
.pdrn{padding-right: 0 !important;}
/* ---------------padding 관련 END--------------- */



/* ---------------br 관련 START--------------- */
@media screen and (min-width:1350.1px){
	.brs1350{display: none;}
}
@media screen and (max-width:1350px){
	.brl1350{display: none;}
}
@media screen and (min-width:991.1px){
	.brs{display: none;}
}
@media screen and (max-width:991px){
	.brl{display: none;}
}
@media screen and (min-width:600.1px){
	.brs600{display: none;}
}
@media screen and (max-width:600px){
	.brl600{display: none;}
}
/* ---------------br 관련 END--------------- */



/* ---------------media screen START--------------- */
@media screen and (min-width:991.1px){

}

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

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

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

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

}

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

}
/* ---------------media screen END--------------- */



/* ---------------그누보드 페이지네이션 START--------------- */
/* ------------------------------------------------------------
그누보드에서 기본으로 출력되는 .pg_wrap 를
.pagination-btns 클래스로 한번 감싸고 사용.
------------------------------------------------------------ */
.pagination-btns {
	width: 100%;
	text-align: center;
}

.pagination-btns .pg_wrap {
	clear: unset;
	float: none;
	display: inline-block;
}

.pagination-btns .pg_wrap .pg {
	display: block;
	text-align: center;
}

.pagination-btns .pg_wrap .pg::after {
	content: '';
	display: block;
	clear: both;
}

.pagination-btns .pg_wrap .pg .sound_only {
	position: fixed;
	left: -100000px;
}

.pagination-btns .pg_wrap .pg .pg_current,
.pagination-btns .pg_wrap .pg .pg_page,
.pagination-btns .pg_wrap .pg .pg_start::after,
.pagination-btns .pg_wrap .pg .pg_end::after,
.pagination-btns .pg_wrap .pg .pg_prev::after,
.pagination-btns .pg_wrap .pg .pg_next::after {
	min-width: unset;
	padding: unset;
	float: left;
	display: block;
	margin: 0 10px;
	position: relative;
	width: 60px;
	height: 60px;
	line-height: 60px;
	border-radius: 100%;
	text-align: center;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: #1c1c1c;
	font-size: 18px;
	font-family: 'Paperlogy';
	-webkit-transition: background-color 0.3s, color 0.3s;
	transition: background-color 0.3s, color 0.3s;
}

@media screen and (min-width:991.1px){
	.pagination-btns .pg_wrap .pg .pg_page:hover {
		color: #389311;
	}
}

@media screen and (max-width:991px){
	.pagination-btns .pg_wrap .pg .pg_page:active {
		color: #389311;
	}
}

.pagination-btns .pg_wrap .pg .pg_start,
.pagination-btns .pg_wrap .pg .pg_end,
.pagination-btns .pg_wrap .pg .pg_prev,
.pagination-btns .pg_wrap .pg .pg_next {
	text-indent: unset;
	background: none;
	font-size: 0 !important;
	border: 0;
	line-height: 0;
}

.pagination-btns .pg_wrap .pg .pg_start:hover,
.pagination-btns .pg_wrap .pg .pg_end:hover,
.pagination-btns .pg_wrap .pg .pg_prev:hover,
.pagination-btns .pg_wrap .pg .pg_next:hover {
	background: none;
	color: unset;
}

.pagination-btns .pg_wrap .pg .pg_start:hover::after,
.pagination-btns .pg_wrap .pg .pg_end:hover::after,
.pagination-btns .pg_wrap .pg .pg_prev:hover::after,
.pagination-btns .pg_wrap .pg .pg_next:hover::after {  
	color: #389311;
}

.pagination-btns .pg_wrap .pg .pg_start::after,
.pagination-btns .pg_wrap .pg .pg_end::after,
.pagination-btns .pg_wrap .pg .pg_prev::after,
.pagination-btns .pg_wrap .pg .pg_next::after {
	position: absolute;
	left: 0;
	top: 0;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font-family: "Font Awesome 6 Pro";
	font-weight: 400;
	margin: 0;
}

.pagination-btns .pg_wrap .pg .pg_start::after {
	content: '\f053';
}

.pagination-btns .pg_wrap .pg .pg_end::after {
	content: '\f054';
}

.pagination-btns .pg_wrap .pg .pg_prev::after {
	content: '\f053';
}

.pagination-btns .pg_wrap .pg .pg_next::after {
	content: '\f054';
}

.pagination-btns .pg_wrap .pg .pg_current {
	font-weight: 800;   
	color: #fff;
	background-color: #389311;
}
@media screen and (max-width:1350px){
	.pagination-btns .pg_wrap .pg .pg_current,
	.pagination-btns .pg_wrap .pg .pg_page,
	.pagination-btns .pg_wrap .pg .pg_start::after,
	.pagination-btns .pg_wrap .pg .pg_end::after,
	.pagination-btns .pg_wrap .pg .pg_prev::after,
	.pagination-btns .pg_wrap .pg .pg_next::after {
		margin: 0 9px;
		width: 54px;
		height: 54px;
		line-height: 54px;
		font-size: 17px;
	}
}
@media screen and (max-width:1150px){
	.pagination-btns .pg_wrap .pg .pg_current,
	.pagination-btns .pg_wrap .pg .pg_page,
	.pagination-btns .pg_wrap .pg .pg_start::after,
	.pagination-btns .pg_wrap .pg .pg_end::after,
	.pagination-btns .pg_wrap .pg .pg_prev::after,
	.pagination-btns .pg_wrap .pg .pg_next::after {
		margin: 0 8px;
		width: 48px;
		height: 48px;
		line-height: 48px;
		font-size: 16px;
	}
}
@media screen and (max-width:600px){
	.pagination-btns .pg_wrap .pg .pg_current,
	.pagination-btns .pg_wrap .pg .pg_page,
	.pagination-btns .pg_wrap .pg .pg_start::after,
	.pagination-btns .pg_wrap .pg .pg_end::after,
	.pagination-btns .pg_wrap .pg .pg_prev::after,
	.pagination-btns .pg_wrap .pg .pg_next::after {
		margin: 0 7px;
		width: 42px;
		height: 42px;
		line-height: 42px;
		font-size: 15px;
	}
}
@media screen and (max-width:450px){
	.pagination-btns .pg_wrap .pg .pg_current,
	.pagination-btns .pg_wrap .pg .pg_page,
	.pagination-btns .pg_wrap .pg .pg_start::after,
	.pagination-btns .pg_wrap .pg .pg_end::after,
	.pagination-btns .pg_wrap .pg .pg_prev::after,
	.pagination-btns .pg_wrap .pg .pg_next::after {
		margin: 0 6px;
		width: 36px;
		height: 36px;
		line-height: 36px;
		font-size: 14px;
	}
}
/* ---------------그누보드 페이지네이션 END--------------- */