@charset "utf-8";

*, :after, :before {box-sizing:border-box; }

:root {-webkit-tap-highlight-color:transparent; -webkit-text-size-adjust:100%; text-size-adjust:100%; cursor:default; overflow-wrap:break-word; -moz-tab-size:4; tab-size:4;}

html {font-size:62.5%;}
body {font-size:1.6rem;}

html {scroll-behavior: smooth;}
body, input, textarea, select, button, table {
	margin:0; 
	font-family:'ntsr', '나눔고딕', '맑은 고딕', 'YetHangul', '돋움', Dotum, '새굴림', sans-serif; /*220224*/
	font-style: normal;
	color: #333;
	letter-spacing:-0.05rem;
	line-height:1.2;
}
body, h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, li, ol, th, td, p, form, fieldset, legend, input, button,
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {margin:0; padding:0; /* word-break:keep-all; */}

a {text-decoration:none; color:#333;}
a:hover, a:active, a:focus {text-decoration:none;}

picture, video, canvas, svg {display:block; max-width:100%;}

img, fieldset {border:0 none;}
img {max-width:100%;
	line-height: 0; font-size: 0;
	-ms-interpolation-mode: bicubic;}

dl, ul, ol, li {list-style: none outside none;}

table {table-layout: fixed; border-collapse:collapse; width:100%; border-spacing:0;}
table, th, td, div {border-collapse:collapse;}

button, input, select, textarea {vertical-align:middle; font-size:inherit; border:0; cursor:pointer;}
button, input {-webkit-border-radius:0; background-color:transparent; border-radius:0; border:0}
textarea {overflow:auto; resize:none; vertical-align:top;}

label {cursor:pointer;}
button, input {background-color:transparent; border-radius:0; border:0;}
input:checked[type=checkbox] {background-color:#666;}

em, address, caption, cite, code, dfn, strong, th, var {font-style:normal;}
strong, .strong , b {font-weight:normal;}


@media only screen and (max-width: 768px) {
    html {font-size:56.3%;}
}
@media only screen and (min-width: 768px) and (max-width: 1024px){
    html {font-size:56.3%;}
}
@media only screen and (max-width: 767px) {
    html {font-size:50%;}
}

/* ==== common ==== */
.blind, caption, legend {position: absolute; clip: rect(0 0 0 0); width:1px; height:1px; margin:-1px; font-size:0; text-indent:-99999px; overflow: hidden;}

.clear {*zoom:1;}
.clear:after{content:''; display:block; clear:both;}

.ex-hidden {overflow:hidden;}


#dimd {z-index:45; position:fixed; top:0; left:0; right:0; bottom:0; background-color:rgba(0, 0, 0, .7);}

/* accessibility */
.ellipsis {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -moz-binding:url('ellipsis.xml#ellipsis');}
.ellipsis_block {width:100%; overflow: hidden; text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
	/* height: 66px; line-height: 22px;*/
}

/* accessibility */
#accessibility { position:absolute; z-index:2000; left:0; top:0; width:100% }
#accessibility a { display:block; width:1px; height:1px; margin-bottom:-1px; overflow:hidden; text-align:center; color:#222; font-size:16px; }
#accessibility a:focus, #accessibility a:active { width:100%; height:auto; padding:9px 0; background:#fff; }


/* placeholder */
input::placeholder, 
textarea::placeholder {
    opacity: 1;
	font-size:1.3rem;
	color:#a2a2a2;
	font-weight:200;
}
input:-ms-input-placeholder, 
textarea:-ms-input-placeholder {
	font-size:1.3rem;
	color:#a2a2a2;
	font-weight:200;
}
input::-ms-input-placeholder, 
textarea::-ms-input-placeholder {
	font-size:1.3rem;
	color:#a2a2a2;
	font-weight:200;
}
@media (max-width: 1239px) {
	input::placeholder, 
	textarea::placeholder {
		color: #b2b2b2 !important;
	}
	input:-ms-input-placeholder, 
	textarea:-ms-input-placeholder {
		color: #b2b2b2 !important;
	}
	input::-ms-input-placeholder, 
	textarea::-ms-input-placeholder {
		color: #b2b2b2 !important;
	}
}

/* text-align */
.tl {text-align:left ;}
.tr {text-align:right !important;}
.tc {text-align:center !important;}

/* float */
.fl {float:left;}
.fr {float:right;}

/*//230318 버튼 추가*/
.no-border {border:none !important;}
.no-bg {background:none !important;}

.fs-xl {font-size:20px;}
.fs-lg {font-size:18px;}
.fs-md {font-size:16px;}
.fs-sm {font-size:14px;}
.fs-xs {font-size:12px;}

.bg-green {background:#6ea115;}
.bg-blue {background:#76a4e3;}
.bg-red {background:#ff6666;}
.bg-violet {background:#7575d0;}
.bg-orange {background:#ff9933;}
.bg-lgray {background:#ccc;}
.bg-dgray {background:#555;}

.fc-white {color:#fff !important;}
.fc-black {color:#333 !important;}
.f-bold {font-weight:bold;}

.btn-round {padding:6px 22px 8px; border-radius:30px; letter-spacing:0; color:#fff; display:inline-block;}
.btn-mid-round {padding:6px 12px 8px; border-radius:12px; letter-spacing:0; color:#fff; display:inline-block;}
.btn-box {padding:6px 12px 8px; border-radius:2px; letter-spacing:0; color:#fff; display:inline-block;}

.flex {display:flex; flex-wrap:wrap;}
.flex-no {display:flex;}
.flex-tl {justify-content:flex-start;}
.flex-tr {justify-content:flex-end;}
.flex-tc {justify-content:center;}
.flex-tj {justify-content:space-between;}
.flex-vc {align-items:center;}
.flex-vt {align-items:flex-start;}
.flex-vb {align-items:flex-end;}

.col-1 {width:25%;}
.col-2 {width:50%;}
.col-3 {width:75%;}
.col-4 {width:100%;}

@media (max-width:767px){
.col-1, .col-2, .col-3, .col-4 {width:100%;}
}
/*230318 버튼 추가//*/

/* margin */
.m0{margin:0px !important}
.m10{margin:10px !important}
.mt0{margin-top:0px !important}
.mt5{margin-top:5px !important}
.mt10{margin-top:10px !important}
.mt15{margin-top:15px !important}
.mt20{margin-top:20px !important}
.mt25{margin-top:25px !important}
.mt30{margin-top:30px !important}
.mt40{margin-top:40px !important}
.mt50{margin-top:50px !important}
.mb0{margin-bottom:0px !important}
.mb5{margin-bottom:5px !important}
.mb10{margin-bottom:10px !important}
.mb15{margin-bottom:15px !important}
.mb20{margin-bottom:20px !important}
.mb25{margin-bottom:25px !important}
.mb30{margin-bottom:30px !important}
.mb35{margin-bottom:35px !important}
.mb40{margin-bottom:40px !important}
.mb50{margin-bottom:50px !important}
.mb60{margin-bottom:60px !important}
.mb70{margin-bottom:70px !important}
.mb80{margin-bottom:80px !important}
.mb90{margin-bottom:90px !important}
.mb100{margin-bottom:100px !important}
.ml0{margin-left:0px !important}
.ml5{margin-left:5px !important}
.ml10{margin-left:10px !important}
.ml15{margin-left:15px !important}
.ml20{margin-left:20px !important}
.mr0{margin-right:0px !important}
.mr5{margin-right:5px !important}
.mr10{margin-right:10px !important}
.mr15{margin-right:15px !important}
.mr20{margin-right:20px !important}

/* padding */
.p0{padding:0px !important}
.p5{padding:5px !important}
.p10{padding:10px !important}
.p15{padding:15px !important}
.p20{padding:20px !important}
.p25{padding:25px !important}
.p30{padding:30px !important}
.pt0{padding-top:0px !important}
.pt3{padding-top:3px !important}
.pt5{padding-top:5px !important}
.pt10{padding-top:10px !important}
.pt15{padding-top:15px !important}
.pt20{padding-top:20px !important}
.pt25{padding-top:25px !important}
.pt30{padding-top:30px !important}
.pt40{padding-top:40px !important}
.pt50{padding-top:50px !important}
.pb0{padding-bottom:0px !important}
.pb10{padding-bottom:10px !important}
.pb15{padding-bottom:15px !important}
.pb20{padding-bottom:20px !important}
.pb25{padding-bottom:25px !important}
.pb30{padding-bottom:30px !important}
.pb40{padding-bottom:40px !important}
.pb50{padding-bottom:50px !important}
.pl0{padding-left:0px !important}
.pl5{padding-left:5px !important}
.pl10{padding-left:10px !important}
.pl15{padding-left:15px !important}
.pl20{padding-left:20px !important}
.pl25{padding-left:25px !important}
.pl30{padding-left:30px !important}
.pl40{padding-left:40px !important}
.pl50{padding-left:50px !important}
.pl60{padding-left:60px !important}
.pr0{padding-right:0px !important}
.pr5{padding-right:5px !important}
.pr10{padding-right:10px !important}
.pr15{padding-right:15px !important}
.pr20{padding-right:20px !important}
.pr25{padding-right:25px !important}
.pr30{padding-right:30px !important}
.pr40{padding-right:40px !important}
.pr50{padding-right:50px !important}
.pr60{padding-right:60px !important}


@media only screen and (max-width:767px){
	.m10{margin:5px !important}
	.mt5{margin-top:3px !important}
	.mt10{margin-top:5px !important}
	.mt15{margin-top:7px !important}
	.mt20{margin-top:10px !important}
	.mt25{margin-top:12px !important}
	.mt30{margin-top:15px !important}
	.mt40{margin-top:20px !important}
	.mt50{margin-top:25px !important}
	.mb5{margin-bottom:3px !important}
	.mb10{margin-bottom:5px !important}
	.mb15{margin-bottom:7px !important}
	.mb20{margin-bottom:10px !important}
	.mb25{margin-bottom:12px !important}
	.mb30{margin-bottom:15px !important}
	.mb35{margin-bottom:17px !important}
	.mb50{margin-bottom:25px !important}
	.mb60{margin-bottom:30px !important}
	.mb70{margin-bottom:35px !important}
	.ml5{margin-left:3px !important}
	.ml10{margin-left:5px !important}
	.ml15{margin-left:7px !important}
	.ml20{margin-left:10px !important}
	.mr5{margin-right:3px !important}
	.mr10{margin-right:5px !important}
	.mr15{margin-right:7px !important}
	.mr20{margin-right:10px !important}
	.mlr5{margin-left:3px !important; margin-right:3px !important}
	
	.p5{padding:3px !important}
	.p10{padding:5px !important}
	.p15{padding:7px !important}
	.p20{padding:10px !important}
	.p25{padding:12px !important}
	.p30{padding:15px !important}
	.pt3{padding-top:2px !important}
	.pt5{padding-top:3px !important}
	.pt10{padding-top:5px !important}
	.pt15{padding-top:7px !important}
	.pt20{padding-top:10px !important}
	.pt25{padding-top:12px !important}
	.pt30{padding-top:15px !important}
	.pt40{padding-top:20px !important}
	.pt50{padding-top:25px !important}
	.pb10{padding-bottom:5px !important}
	.pb15{padding-bottom:7px !important}
	.pb20{padding-bottom:10px !important}
	.pb25{padding-bottom:12px !important}
	.pb30{padding-bottom:15px !important}
	.pb40{padding-bottom:20px !important}
	.pb50{padding-bottom:25px !important}
	.pl5{padding-left:3px !important}
	.pl10{padding-left:5px !important}
	.pl15{padding-left:7px !important}
	.pl20{padding-left:10px !important}
	.pl25{padding-left:12px !important}
	.pl30{padding-left:15px !important}
	.pl40{padding-left:20px !important}
	.pl50{padding-left:25px !important}
	.pl60{padding-left:30px !important}
	.pr5{padding-right:3px !important}
	.pr10{padding-right:5px !important}
	.pr15{padding-right:7px !important}
	.pr20{padding-right:10px !important}
	.pr25{padding-right:12px !important}
	.pr30{padding-right:15px !important}
	.pr40{padding-right:20px !important}
	.pr50{padding-right:25px !important}
	.pr60{padding-right:30px !important}		

	/*//230318 버튼 추가*/
	.fs-xl {font-size:15px;}
	.fs-lg {font-size:13px;}
	.fs-md {font-size:12px;}
	.fs-sm {font-size:11px;}
	.fs-xs {font-size:10px;}
	
	.btn-round {padding:4px 16px 5px; border-radius:18px;}
	.btn-mid-round {padding:4px 9px 5px; border-radius:9px;}
	.btn-box {padding:4px 9px 5px; border-radius:2px;}
	/*230318 버튼 추가//*/
}

/* 전체 스크롤바 custom */
* {
	scrollbar-width: thin;
}
::-webkit-scrollbar {
	width: 7px;
	height: 7px;
}
::-webkit-scrollbar-track {
	background-color: #4242421a;
	border-radius: 3px;
}
::-webkit-scrollbar-thumb {
	background: #c5c5c6;
	border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
	background: #a5a5a5; 
}


/* 검색창 [X] 버튼 : 변경을 위해 기본을 사용 안하도록 함 */
::-webkit-search-cancel-button {
	-webkit-appearance: none;
}