@charset "utf-8";
/* font */
@font-face { font-family: 'Pretendard'; font-style: normal; font-weight: 100; src: url('../fonts/Pretendard/Pretendard-Thin.woff') format('woff'); } 

@font-face { font-family: 'Pretendard'; font-style: normal; font-weight: 200; src: url('../fonts/Pretendard/Pretendard-ExtraLight.woff') format('woff'); } 

@font-face { font-family: 'Pretendard'; font-style: normal; font-weight: 300; src: url('../fonts/Pretendard/Pretendard-Light.woff') format('woff'); } 

@font-face { font-family: 'Pretendard'; font-style: normal; font-weight: 400; src: url('../fonts/Pretendard/Pretendard-Regular.woff') format('woff'); } 

@font-face { font-family: 'Pretendard'; font-style: normal; font-weight: 500; src: url('../fonts/Pretendard/Pretendard-Medium.woff') format('woff'); } 

@font-face { font-family: 'Pretendard'; font-style: normal; font-weight: 600; src: url('../fonts/Pretendard/Pretendard-SemiBold.woff') format('woff'); } 

@font-face { font-family: 'Pretendard'; font-style: normal; font-weight: 700; src: url('../fonts/Pretendard/Pretendard-Bold.woff') format('woff'); } 

@font-face { font-family: 'Pretendard'; font-style: normal; font-weight: 800; src: url('../fonts/Pretendard/Pretendard-ExtraBold.woff') format('woff'); } 

@font-face { font-family: 'Pretendard'; font-style: normal; font-weight: 900; src: url('../fonts/Pretendard/Pretendard-Black.woff') format('woff'); } 

@font-face { font-family: 'SCDream'; font-style: normal; font-weight: 100; src: url('../fonts/SCDream/SCDream1.woff') format('woff'); } 
@font-face { font-family: 'SCDream'; font-style: normal; font-weight: 200; src: url('../fonts/SCDream/SCDream2.woff') format('woff'); } 
@font-face { font-family: 'SCDream'; font-style: normal; font-weight: 300; src: url('../fonts/SCDream/SCDream3.woff') format('woff'); } 
@font-face { font-family: 'SCDream'; font-style: normal; font-weight: 400; src: url('../fonts/SCDream/SCDream4.woff') format('woff'); } 
@font-face { font-family: 'SCDream'; font-style: normal; font-weight: 500; src: url('../fonts/SCDream/SCDream5.woff') format('woff'); } 
@font-face { font-family: 'SCDream'; font-style: normal; font-weight: 600; src: url('../fonts/SCDream/SCDream6.woff') format('woff'); } 
@font-face { font-family: 'SCDream'; font-style: normal; font-weight: 700; src: url('../fonts/SCDream/SCDream7.woff') format('woff'); } 
@font-face { font-family: 'SCDream'; font-style: normal; font-weight: 800; src: url('../fonts/SCDream/SCDream8.woff') format('woff'); } 
@font-face { font-family: 'SCDream'; font-style: normal; font-weight: 900; src: url('../fonts/SCDream/SCDream9.woff') format('woff'); } 


/* reset */
* { margin:0; padding:0; } 
*, *::before, *::after { box-sizing: border-box; } 
html { -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; } 
body, h1, h2, h3, h4, p, figure, blockquote, dl, dd { margin-block-start: 0; margin-block-end: 0; } 
ul[role='list'], ol[role='list'], li { list-style: none; } 
body { min-height: 100vh; line-height: 1.5; letter-spacing: -0.05em; font-size: 1rem; word-break: keep-all; } 
h2, h3, h4, button, input, label { line-height: 1; } 
h1, h2, h3, h4 { text-wrap: balance; } 
a { text-decoration: none; color: inherit; } 
img, picture {max-width:100%;}
img.objectfit {object-fit: cover;}
input[type="password"],
input[type="text"] {-webkit-appearance:none; -webkit-border-radius:0; width:100%;max-width:100%;background:#fff;  border:1px solid #d8d8d8; -webkit-appearance: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; padding: 0px .5rem;  box-sizing:border-box;  height: 2rem; text-align:left;}
button, input { border: none; background: none; }
select{ background-image:none;   -webkit-appearance: none;    -moz-appearance: none;    -o-appearance: none;	-ms-appearance: none; padding:0 1rem 0 .5rem; height:2rem; border:1px solid #d8d8d8;background-image:none;   -webkit-appearance: none;    -moz-appearance: none;    -o-appearance: none;	-ms-appearance: none;	 background:#fff url("/images/default/content/sel_icon.png") no-repeat 92% 50%; min-width:2.5rem;}
textarea:not([rows]) {padding:10px;width:100%;min-height:10em;border:1px solid #d8d8d8;}
:target { scroll-margin-block: 5ex; } 
body, button, input, select, table, textarea { font-family: "Pretendard", "Malgun Gothic", dotum, sans-serif; color: var(--gray); } 
table { width:100%; border-spacing:0; border-collapse:collapse; table-layout:fixed; }
table caption {position: absolute; width: 1px !important; height: 1px !important;padding: 0 !important;margin: -1px !important;overflow: hidden !important;clip: rect(0, 0, 0, 0) !important;white-space: nowrap !important;border: 0 !important;}
inputp[type="checkbox"],inputp[type="radio"],label,button { cursor: pointer; } 
@media screen and (max-width: 480px) { 
    body { font-size: 15px; } 
}

:root { 
    /* color */
    --black: #111; 
    --dgray: #333; 
    --gray: #505050; 
    --lgray: #767676; 
    --white: #fff; 
    --line-gray: #ccc; 
    --brand: #0070BD; 
    --brand2: #082F49; 
    --red: #e53838;
    --bg: #F9F6F6; 

    --color-blue: #003E9D;
    --color-blue-light: #F5FAFF;
    --color-green: #009d47;
    
    --color-line-basic: #d1d5dc;
    --color-line-light: #F3F4F6;
    --color-bg-gray: #FAFAFA;

    /* font-family */
    --sc: 'SCDream';
    --pp: 'Poppins';
    --font-weight-light: 100;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-heavy: 900;
}

.color-black {color: var(--black);}
.color-blue {color: var(--color-blue);}
.color-green {color: var(--color-green);}
.color-red {color: var(--red);}
.color-gray {color: var(--lgray);}

.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;}

.no-view { display: none; } 
.sound-only { display: inline-block !important; position: absolute; top: 0; left: 0; width: 0; height: 0; margin: 0 !important; padding: 0 !important; font-size: 0; line-height: 0; border: 0 !important; overflow: hidden !important; } 

/* flex */
.flex { display: flex; } 
.flex-between { display: flex; justify-content: space-between; } 
.flex-center { display: flex; justify-content: center; } 
.flex-end { display: flex; justify-content: end; } 
.align-center { align-items: center; } 
.flex-column { display: flex; flex-direction: column; }

.flex-5 {width:100%;flex-wrap:wrap;}
.flex-5 > li {width:20%;}
@media screen and (max-width: 870px) {
	.flex-5 > li {width:25%;}
}
@media screen and (max-width: 768px) {
	.flex-5 > li {width:33.33%;}
}

/* 동영상 임베드 */
.embed-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.embed-container iframe,
.embed-container object,
.embed-container embed,
.embed-container video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/* 스크롤 커스텀 // 세로 */
.scrollbox,
.scrollbox-noie {
    overflow-x: hidden;
	overflow-y: auto;
	-ms-overflow-style: scrollbar;
}

.scrollbox::-webkit-scrollbar,
.scrollbox-noie::-webkit-scrollbar {
	width: 4px;
    height: 4px;
}

.scrollbox::-webkit-scrollbar-track,
.scrollbox-noie::-webkit-scrollbar-track {
	background-color: transparent;
}

.scrollbox::-webkit-scrollbar-thumb,
.scrollbox-noie::-webkit-scrollbar-thumb {
	border-radius: 2px;
	background-color: rgba(var(--color-basic-rgb),0.1);
    transition: .3s;
    cursor: pointer;
}

.scrollbox::-webkit-scrollbar-thumb:hover,
.scrollbox-noie::-webkit-scrollbar-thumb:hover {
	background-color: var(--color-yellow);
}


/* 가로 스크롤 */
.width-scrollbox {
	overflow-x: auto;
    margin: 0 -16px;
	-ms-overflow-style: scrollbar;
}

.width-scrollbox::-webkit-scrollbar {
    width: 12px;  /* 세로 스크롤바 너비 */
    height: 12px; /* 가로 스크롤바 높이 */
}

.width-scrollbox::-webkit-scrollbar-track {
    background: rgba(var(--color-basic-rgb),0.05);
    border-radius: 6px;
}

.width-scrollbox::-webkit-scrollbar-thumb {
    background: var(--color-line-basic);
    border-radius: 6px;
}

.width-scrollbox::-webkit-scrollbar-thumb:hover {
    background: var(--color-gray);
}

.width-scrollbox .scroll-con {
	padding: 0 16px 10px;
}

.width-scrollbox.w480 .scroll-con {
	width: 400px;
}

.width-scrollbox.w640 .scroll-con {
	width: 600px;
}

.width-scrollbox.w768 .scroll-con {
	width: 800px;
}

.width-scrollbox.w980 .scroll-con {
	width: 1000px;
}

@media screen and (min-width: 479px) {
	.width-scrollbox.w480 {
		margin: 0 !important;
	}

	.width-scrollbox.w480 .scroll-con {
		width: 100%;
        padding: 0;
	}
}

@media screen and (min-width: 639px) {
	.width-scrollbox.w640 {
		margin: 0 !important;
	}

	.width-scrollbox.w640 .scroll-con {
		width: 100%;
        padding: 0;
	}
}

@media screen and (min-width: 767px) {
	.width-scrollbox.w768 {
		margin: 0 !important;
	}

	.width-scrollbox.w768 .scroll-con {
		width: 100%;
        padding: 0;
	}
}

@media screen and (min-width: 979px) {
	.width-scrollbox.w980 {
		margin: 0 !important;
	}

	.width-scrollbox.w980 .scroll-con {
		width: 100%;
        padding: 0;
	}
}


/* 동영상 임베드 */
.embed-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.embed-container iframe,
.embed-container object,
.embed-container embed,
.embed-container video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* padding & margin */
.pdt0px { padding-top:0px !important; } 
.pdt5px { padding-top:5px !important; } 
.pdt10px { padding-top:10px !important; } 
.pdt15px { padding-top:15px !important; } 
.pdt20px { padding-top:20px !important; } 
.pdt30px { padding-top:30px !important; } 
.pdt40px { padding-top:40px !important; } 
.pdt50px { padding-top:50px !important; } 
.pdt60px { padding-top:60px !important; } 
.pdt70px { padding-top:70px !important; } 
.pdt80px { padding-top:80px !important; } 
.pdt90px { padding-top:90px !important; } 
.pdt100px { padding-top:100px !important; } 
 
.pdl0px { padding-left:0px !important; } 
.pdl5px { padding-left:5px !important; } 
.pdl10px { padding-left:10px !important; } 
.pdl15px { padding-left:15px !important; } 
.pdl20px { padding-left:20px !important; } 
.pdl30px { padding-left:30px !important; } 
.pdl40px { padding-left:40px !important; } 
.pdl50px { padding-left:50px !important; } 
.pdl60px { padding-left:60px !important; } 
.pdl70px { padding-left:70px !important; } 
.pdl80px { padding-left:80px !important; } 
.pdl90px { padding-left:90px !important; } 
.pdl100px { padding-left:100px !important; } 

.pdr0px { padding-right:0px !important; } 
.pdr5px { padding-right:5px !important; } 
.pdr10px { padding-right:10px !important; } 
.pdr15px { padding-right:15px !important; } 
.pdr20px { padding-right:20px !important; } 
.pdr30px { padding-right:30px !important; } 
.pdr40px { padding-right:40px !important; } 
.pdr50px { padding-right:50px !important; } 
.pdr60px { padding-right:60px !important; } 
.pdr70px { padding-right:70px !important; } 
.pdr80px { padding-right:80px !important; } 
.pdr90px { padding-right:90px !important; } 
.pdr100px { padding-right:100px !important; } 
 
.pdb0px { padding-bottom:0px !important; } 
.pdb5px { padding-bottom:5px !important; } 
.pdb10px { padding-bottom:10px !important; } 
.pdb15px { padding-bottom:15px !important; } 
.pdb20px { padding-bottom:20px !important; } 
.pdb30px { padding-bottom:30px !important; } 
.pdb40px { padding-bottom:40px !important; } 
.pdb50px { padding-bottom:50px !important; } 
.pdb60px { padding-bottom:60px !important; } 
.pdb70px { padding-bottom:70px !important; } 
.pdb80px { padding-bottom:80px !important; } 
.pdb90px { padding-bottom:90px !important; } 
.pdb100px { padding-bottom:100px !important; } 


.mgt0px { margin-top:0px !important; } 
.mgt5px { margin-top:5px !important; } 
.mgt10px { margin-top:10px !important; } 
.mgt15px { margin-top:15px !important; } 
.mgt20px { margin-top:20px !important; } 
.mgt30px { margin-top:30px !important; } 
.mgt40px { margin-top:40px !important; } 
.mgt50px { margin-top:50px !important; } 
.mgt60px { margin-top:60px !important; } 
.mgt70px { margin-top:70px !important; } 
.mgt80px { margin-top:80px !important; } 
.mgt90px { margin-top:90px !important; } 
.mgt100px { margin-top:100px !important; } 
 
.mgl0 { margin-left:0px !important; } 
.mgl5px { margin-left:5px !important; } 
.mgl10px { margin-left:10px !important; } 
.mgl15px { margin-left:15px !important; } 
.mgl20px { margin-left:20px !important; } 
.mgl30px { margin-left:30px !important; } 
.mgl40px { margin-left:40px !important; } 
.mgl50px { margin-left:50px !important; } 
.mgl60px { margin-left:60px !important; } 
.mgl70px { margin-left:70px !important; } 
.mgl80px { margin-left:80px !important; } 
.mgl90px { margin-left:90px !important; } 
.mgl100px { margin-left:100px !important; } 

.mgr0 { margin-right:0px !important; } 
.mgr5px { margin-right:5px !important; } 
.mgr10px { margin-right:10px !important; } 
.mgr15px { margin-right:15px !important; } 
.mgr20px { margin-right:20px !important; } 
.mgr30px { margin-right:30px !important; } 
.mgr40px { margin-right:40px !important; } 
.mgr50px { margin-right:50px !important; } 
.mgr60px { margin-right:60px !important; } 
.mgr70px { margin-right:70px !important; } 
.mgr80px { margin-right:80px !important; } 
.mgr90px { margin-right:90px !important; } 
.mgr100px { margin-right:100px !important; } 
 
.mgb0 { margin-bottom:0px !important; } 
.mgb5px { margin-bottom:5px !important; } 
.mgb10px { margin-bottom:10px !important; } 
.mgb15px { margin-bottom:15px !important; } 
.mgb20px { margin-bottom:20px !important; } 
.mgb30px { margin-bottom:30px !important; } 
.mgb40px { margin-bottom:40px !important; } 
.mgb50px { margin-bottom:50px !important; } 
.mgb60px { margin-bottom:60px !important; } 
.mgb70px { margin-bottom:70px !important; } 
.mgb80px { margin-bottom:80px !important; } 
.mgb90px { margin-bottom:90px !important; } 
.mgb100px { margin-bottom:100px !important; } 