@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700&display=swap');



h1 {font-size: 2.0rem; margin: 0; padding: 0 0 15px 0; text-align: center;}
h2 {font-size: 1.5rem; margin: 0; padding: 0 0 15px 0;}
h3 {font-size: 1.25rem; margin: 0; padding: 0 0 15px 0;}
h4 {font-size: 1.2rem;margin: 0; padding: 0 0 15px 0;}
h5 {font-size: 1.1rem;margin: 0; padding: 0 0 15px 0;}


/******** etc **********/

.b1x {font-size: 1.1rem;}
.b2x {font-size: 1.2rem;}
.b3x {font-size: 1.3rem;}
.b4x {font-size: 1.4rem;}
.b5x {font-size: 1.5rem;}

input[type="checkbox"], input[type="radio"] {
		transform: scale(1.5); /* 크기 조절 */
		margin-right: 10px; /* 라벨과 간격 조정 */
}

.overHidden {overflow: hidden;}
.table-responsive .table {min-width: 700px;}

a.no-text-deco {
	text-decoration: none !important;
}

a.no-text-deco:hover {
	text-decoration: none !important;
}

.text-underline {text-decoration: underline;}

.m-auto {margin: 0 auto;}
.dpx {display: none;}

.small {font-size:0.85em}
.normal {font-weight: normal;}
.bold {font-weight: bold;}


.clearL {clear:left;}
.clearR {clear:right;}
.clearB {clear:both;}

.flL {float:left;}
.flR {float:right;}

.table-fixed {table-layout: fixed;}

.shadow {box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);}

.w100 {width: 100%;}
.round {border-radius: 50%;}

ul {padding:0 0 0 20px;}
ol {padding:0 0 0 20px;}

.ul-inline {list-style: none; padding: 0; margin: 0;}
.ul-inline li {display: inline-block; margin-right: 15px;}

.scale-big {
	transition: transform 0.3s ease; /* 확대 및 축소 모두에 부드러운 효과를 적용 */
}

.scale-big:hover {
	transform: scale(1.03); /* 3% 크기로 확대 (1.0이 기본 크기) */
	transition: transform 0.3s ease; /* 부드러운 확대 효과를 0.3초 동안 적용 (조절 가능) */
}

.truncated-text {
	display: inline-block;
	max-width: 100%; /* 필요에 따라 너비 제한 가능 */
	white-space: nowrap;
	overflow: hidden; /* 텍스트 초과 시 숨김 */
	text-overflow: ellipsis;
}


.pagination {
  --bs-pagination-color: #666;
  --bs-pagination-hover-color: #666;
  --bs-pagination-hover-bg: var(--color-grey-light);
  --bs-pagination-active-bg: var(--color-main);
  --bs-pagination-active-border-color: var(--color-main);
}

/****** button ******/
.btn-main {
  --bs-btn-color: var(--color-main-light);
  --bs-btn-bg: var(--color-main);
  --bs-btn-border-color: var(--color-main-dark);
  --bs-btn-hover-color: var(--color-main-light);
  --bs-btn-hover-bg: var(--color-main-dark);
  --bs-btn-hover-border-color: var(--color-main-dark);
  --bs-btn-active-color: var(--color-main-light);
  --bs-btn-active-bg: var(--color-main-dark);
  --bs-btn-active-border-color: var(--color-main-dark);
  --bs-btn-disabled-color: var(--color-grey-light);
  --bs-btn-disabled-bg: var(--color-grey);
  --bs-btn-disabled-border-color: var(--color-grey-dark);
}

.btn-outline-main {
  --bs-btn-color: var(--color-main);
  --bs-btn-border-color: var(--color-main-dark);
  --bs-btn-hover-color: var(--color-main-light);
  --bs-btn-hover-bg: var(--color-main);
  --bs-btn-hover-border-color: var(--color-main);
  --bs-btn-active-color: var(--color-main-light);
  --bs-btn-active-bg: var(--color-main);
  --bs-btn-active-border-color: var(--color-main);
  --bs-btn-disabled-color: var(--color-grey);
  --bs-btn-disabled-bg: var(--color-grey-light);
  --bs-btn-disabled-border-color: var(--color-grey-dark);
}

.btn-sub {
  --bs-btn-color: var(--color-sub-light);
  --bs-btn-bg: var(--color-sub);
  --bs-btn-border-color: var(--color-sub-dark);
  --bs-btn-hover-color: var(--color-sub-light);
  --bs-btn-hover-bg: var(--color-sub-dark);
  --bs-btn-hover-border-color: var(--color-sub-dark);
  --bs-btn-active-color: var(--color-sub-light);
  --bs-btn-active-bg: var(--color-sub-dark);
  --bs-btn-active-border-color: var(--color-sub-dark);
  --bs-btn-disabled-color: var(--color-grey-light);
  --bs-btn-disabled-bg: var(--color-grey);
  --bs-btn-disabled-border-color: var(--color-grey-dark);
}

.btn-outline-sub {
  --bs-btn-color: var(--color-sub);
  --bs-btn-border-color: var(--color-sub-dark);
  --bs-btn-hover-color: var(--color-sub-light);
  --bs-btn-hover-bg: var(--color-sub);
  --bs-btn-hover-border-color: var(--sub-color);
  --bs-btn-active-color: var(--color-sub-light);
  --bs-btn-active-bg: var(--color-sub);
  --bs-btn-active-border-color: var(--color-sub);
  --bs-btn-disabled-color: var(--color-grey);
  --bs-btn-disabled-bg: var(--color-grey-light);
  --bs-btn-disabled-border-color: var(--color-grey-dark);
}

.btn-point {
  --bs-btn-color: var(--color-point-light);
  --bs-btn-bg: var(--color-point);
  --bs-btn-border-color: var(--color-point-dark);
  --bs-btn-hover-color: var(--color-point-light);
  --bs-btn-hover-bg: var(--color-point-dark);
  --bs-btn-hover-border-color: var(--color-point-dark);
  --bs-btn-active-color: var(--color-point-light);
  --bs-btn-active-bg: var(--color-point-dark);
  --bs-btn-active-border-color: var(--color-point-dark);
  --bs-btn-disabled-color: var(--color-grey-light);
  --bs-btn-disabled-bg: var(--color-grey);
  --bs-btn-disabled-border-color: var(--color-grey-dark);
}

.btn-outline-point {
  --bs-btn-color: var(--color-point);
  --bs-btn-border-color: var(--color-point-dark);
  --bs-btn-hover-color: var(--color-point-light);
  --bs-btn-hover-bg: var(--color-point);
  --bs-btn-hover-border-color: var(--point-color);
  --bs-btn-active-color: var(--color-point-light)
  --bs-btn-active-bg: var(--color-point);
  --bs-btn-active-border-color: var(--color-point);
  --bs-btn-disabled-color: var(--color-grey);
  --bs-btn-disabled-bg: var(--color-grey-light);
  --bs-btn-disabled-border-color: var(--color-grey-dark);
}

.btn-dark {
  --bs-btn-color: var(--color-grey-light);
  --bs-btn-bg: var(--color-grey-dark);
  --bs-btn-border-color: var(--color-grey-dark);
  --bs-btn-hover-color: var(--color-grey-light);
  --bs-btn-hover-bg: var(--color-grey-dark);
  --bs-btn-hover-border-color: var(--color-grey-dark);
  --bs-btn-active-color: var(--color-grey-light);
  --bs-btn-active-bg: var(--color-grey-dark);
  --bs-btn-active-border-color: var(--color-grey-dark);
  --bs-btn-disabled-color: var(--color-grey-light);
  --bs-btn-disabled-bg: var(--color-grey);
  --bs-btn-disabled-border-color: var(--color-grey-dark);
}

.btn-outline-dark {
  --bs-btn-color: var(--color-grey-dark);
  --bs-btn-border-color: var(--color-grey-dark);
  --bs-btn-hover-color: var(--color-grey-light);
  --bs-btn-hover-bg: var(--color-grey-dark);
  --bs-btn-hover-border-color: var(--grey-color);
  --bs-btn-active-color: var(--color-grey-light);
  --bs-btn-active-bg: var(--color-grey);
  --bs-btn-active-border-color: var(--color-grey);
  --bs-btn-disabled-color: var(--color-grey);
  --bs-btn-disabled-bg: var(--color-grey-light);
  --bs-btn-disabled-border-color: var(--color-grey-dark);
}


/****** margin *********/

.m-0 {margin: 0;}
.m-3 {margin: 3px!important;}
.m-5 {margin: 5px!important;}
.m-10 {margin: 10px!important;}
.m-15 {margin: 15px!important;}
.m-20 {margin: 20px!important;}
.m-30 {margin: 30px!important;}
.m-40 {margin: 40px!important;}
.m-50 {margin: 50px!important;}

.mt-0 {margin-top: 0px!important;}
.mt-3 {margin-top: 3px!important;}
.mt-5 {margin-top: 5px!important;}
.mt-10 {margin-top: 10px!important;}
.mt-15 {margin-top: 15px!important;}
.mt-20 {margin-top: 20px!important;}
.mt-30 {margin-top: 30px!important;}
.mt-40 {margin-top: 40px!important;}
.mt-50 {margin-top: 50px!important;}

.mb-0 {margin-bottom: 0px!important;}
.mb-3 {margin-bottom: 3px!important;}
.mb-5 {margin-bottom: 5px!important;}
.mb-10 {margin-bottom: 10px!important;}
.mb-15 {margin-bottom: 15px!important;}
.mb-20 {margin-bottom: 20px!important;}
.mb-30 {margin-bottom: 30px!important;}
.mb-40 {margin-bottom: 40px!important;}
.mb-50 {margin-bottom: 50px!important;}

.ml-0 {margin-left: 0px!important;}
.ml-3 {margin-left: 3px!important;}
.ml-5 {margin-left: 5px!important;}
.ml-10 {margin-left: 10px!important;}
.ml-15 {margin-left: 15px!important;}
.ml-20 {margin-left: 20px!important;}
.ml-30 {margin-left: 30px!important;}
.ml-40 {margin-left: 40px!important;}
.ml-50 {margin-left: 50px!important;}

.mr-0 { margin-right: 0px!important;}
.mr-3 {margin-right: 3px!important;}
.mr-5 {margin-right: 5px!important;}
.mr-10 {margin-right: 10px!important;}
.mr-15 {margin-right: 15px!important;}
.mr-20 {margin-right: 20px!important;}
.mr-30 {margin-right: 30px!important;}
.mr-40 {margin-right: 40px!important;}
.mr-50 {margin-right: 50px!important;}


/****** padding *********/

.p-0 {padding: 0px!important;}
.p-3 {padding: 3px!important;}
.p-5 {padding: 5px!important;}
.p-10 {padding: 10px!important;}
.p-15 {padding: 15px!important;}
.p-20 {padding: 20px!important;}
.p-30 {padding: 30px!important;}
.p-40 {padding: 40px!important;}
.p-50 {padding: 50px!important;}

.pt-0 {padding-top: 0px!important;}
.pt-3 {padding-top: 3px!important;}
.pt-5 {padding-top: 5px!important;}
.pt-10 {padding-top: 10px!important;}
.pt-15 {padding-top: 15px!important;}
.pt-20 {padding-top: 20px!important;}
.pt-30 {padding-top: 30px!important;}
.pt-40 {padding-top: 40px!important;}
.pt-50 {padding-top: 50px!important;}

.pb-0 {padding-bottom: 0px!important;}
.pb-3 {padding-bottom: 3px!important;}
.pb-5 {padding-bottom: 5px!important;}
.pb-10 {padding-bottom: 10px!important;}
.pb-15 {padding-bottom: 15px!important;}
.pb-20 {padding-bottom: 20px!important;}
.pb-30 {padding-bottom: 30px!important;}
.pb-40 {padding-bottom: 40px!important;}
.pb-50 {padding-bottom: 50px!important;}

.pl-0 {padding-left: 0px!important;}
.pl-3 {padding-left: 3px!important;}
.pl-5 {padding-left: 5px!important;}
.pl-10 {padding-left: 10px!important;}
.pl-15 {padding-left: 15px!important;}
.pl-20 {padding-left: 20px!important;}
.pl-30 {padding-left: 30px!important;}
.pl-40 {padding-left: 40px!important;}
.pl-50 {padding-left: 50px!important;}

.pr-0 {padding-right: 0px!important;}
.pr-3 {padding-right: 3px!important;}
.pr-5 {padding-right: 5px!important;}
.pr-10 {padding-right: 10px!important;}
.pr-15 {padding-right: 15px!important;}
.pr-20 {padding-right: 20px!important;}
.pr-30 {padding-right: 30px!important;}
.pr-40 {padding-right: 40px!important;}
.pr-50 {padding-right: 50px!important;}


/* border */

.no-border {border: 0!important;}
.no-border-top {border-top: 0!important;}
.no-border-bottom {border-bottom: 0!important;}
.no-border-left {border-left: 0!important;}
.no-border-right {border-right: 0!important;}

.border {border: 1px solid var(--color-grey-light);}
.border-top {border-top: 1px solid var(--color-grey-light);}
.border-bottom {border-bottom-width: 1px; border-bottom-style: solid; border-color: var(--color-grey-light);}
.border-left {border-left: 1px solid var(--color-grey-light);}
.border-right {border-right: 1px solid var(--color-grey-light);}

.border-lg {border-width: 2px !important;}
.border-top-lg {border-top-width: 2px !important;}
.border-bottom-lg {border-bottom-width: 2px !important;}
.border-left-lg {border-left-width: 2px !important;}
.border-right-lg {border-right-width: 2px !important;}

.border-xlg {border-width: 3px !important;}
.border-top-xlg {border-top-width: 3px !important;}
.border-bottom-xlg {border-bottom-width: 3px !important;}
.border-left-xlg {border-left-width: 3px !important;}
.border-right-xlg {border-right-width: 3px !important;}

.border-dashed {border-style: dashed !important;}
.border-top-dashed {border-top-style: dashed !important;}
.border-bottom-dashed {border-bottom-style: dashed !important;}
.border-left-dashed {border-left-style: dashed !important;}
.border-right-dashed {border-right-style: dashed !important;}

.border-dotted {border-style: dotted !important;}
.border-top-dotted {border-top-style: dotted !important;}
.border-bottom-dotted {border-bottom-style: dotted !important;}
.border-left-dotted {border-left-style: dotted !important;}
.border-right-dotted {border-right-style: dotted !important;}

.no-border-radius {border-radius: 0;}
.border-radius-5 {border-radius: 5px;}
.border-radius-7 {border-radius: 7px;}
.border-radius-10 {border-radius: 10px;}


/****************/

/*PC*/

@media (min-width: 768px) {
  .mo {display:none !important;}
	.plmc {text-align: left;}
	.plmr {text-align: left;}
	.prmc {text-align: right;}
	.prml {text-align: right;}
	.ppr-0 {padding-right: 0px;}
	.ppl-0 {padding-left: 0px;}
	.ppr-3 {padding-right: 3px;}
	.ppl-3 {padding-left: 3px;}
	.ppr-10 {padding-right: 10px;}
	.ppl-10 {padding-left: 10px;}
	.ppr-20 {padding-right: 20px;}
	.ppl-20 {padding-left: 20px;}
	.ppr-30 {padding-right: 30px;}
	.ppl-30 {padding-left: 30px;}
	
	
	.pw10 {width: 10%;}
	.pw20 {width: 20%;}
	.pw30 {width: 30%;}
	.pw40 {width: 40%;}
	.pw50 {width: 50%;}
	.pw60 {width: 60%;}
	.pw70 {width: 70%;}
	.pw80 {width: 80%;}
	.pw90 {width: 90%;}
	.pw100 {width: 100%;}
	
	.minH-p100 {min-height: 100px;}
	.minH-p110 {min-height: 110px;}
	.minH-p120 {min-height: 120px;}
	.minH-p130 {min-height: 130px;}
	.minH-p140 {min-height: 140px;}
	.minH-p150 {min-height: 150px;}
	.minH-p200 {min-height: 200px;}
	.minH-p250 {min-height: 250px;}
	.minH-p300 {min-height: 300px;}
	.minH-p350 {min-height: 350px;}
	.minH-p400 {min-height: 400px;}
	.minH-p450 {min-height: 450px;}
	.minH-p500 {min-height: 500px;}
	.minH-p550 {min-height: 550px;}
	.minH-p600 {min-height: 600px;}
}

/*Mobile*/
@media (max-width: 768px) {
	
h1 {font-size: 1.8rem; margin: 0; padding: 0 0 15px 0; text-align: center;}
h2 {font-size: 1.3rem; margin: 0; padding: 0 0 15px 0;}
h3 {font-size: 1.15rem; margin: 0; padding: 0 0 15px 0;}
h4 {font-size: 1.1rem;margin: 0; padding: 0 0 15px 0;}
h5 {font-size: 1rem;margin: 0; padding: 0 0 15px 0;}

		html {
			font-size: 16px;
		}
	
  .mx {display:none !important;}
	.plmc {text-align: center;}
	.plmr {text-align: right;}
	.prmc {text-align: center;}
	.prml {text-align: left;}
	
	.mw10 {width: 10%;}	
	.mw20 {width: 20%;}	
	.mw30 {width: 30%;}	
	.mw40 {width: 40%;}
	.mw50 {width: 50%;}
	.mw60 {width: 60%;}
	.mw70 {width: 70%;}
	.mw80 {width: 80%;}
	.mw90 {width: 90%;}
	.mw100 {width: 100%;}
	
	.minH-m100 {min-height: 100px;}
	.minH-m110 {min-height: 110px;}
	.minH-m120 {min-height: 120px;}
	.minH-m130 {min-height: 130px;}
	.minH-m140 {min-height: 140px;}
	.minH-m150 {min-height: 150px;}
	.minH-m200 {min-height: 200px;}
	.minH-m250 {min-height: 250px;}
	.minH-m300 {min-height: 300px;}
	.minH-m350 {min-height: 350px;}
	.minH-m400 {min-height: 400px;}
	.minH-m450 {min-height: 450px;}
	.minH-m500 {min-height: 500px;}
	.minH-m550 {min-height: 550px;}
	.minH-m600 {min-height: 600px;}

}




@media (width: 768px) {
  .mx { display: none; }
  .mo { display: block !important; }
}