@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'); } 

@font-face { font-family: 'GmarketSans'; font-style: normal; font-weight: 300; src: local('GmarketSansLight'), url('../fonts/GmarketSans/GmarketSansLight.woff') format('woff'); }
@font-face { font-family: 'GmarketSans'; font-style: normal; font-weight: 500; src: local('GmarketSansMedium'), url('../fonts/GmarketSans/GmarketSansMedium.woff') format('woff'); }
@font-face { font-family: 'GmarketSans'; font-style: normal; font-weight: 700; src: local('GmarketSansBold'), url('../fonts/GmarketSans/GmarketSansBold.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; }
em, i {font-style:normal;}
a { text-decoration: none; color: inherit; } 
img { max-width: 100%;}
picture { max-width: 100%; display: block; }
img.objectfit {object-fit: cover;}
fieldset {border:0;}
legend {position:absolute;margin:-1px;width: 1px;height: 1px;font-size:1px;color:transparent;clip: rect(0,0,0,0);overflow: hidden;}
button, input { border: none; background: none; } 
textarea:not([rows]) { min-height: 10em; } 
textarea{padding:20px; width:100%; box-sizing:border-box; vertical-align:middle; line-height:1.5; background:#fff; border:1px solid #b2b2b2;  color:#898989; -webkit-appearance: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border-radius:0; font-size:1rem;}
: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;}
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: #0000ff; */
	--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';
	--gm: 'GmarketSans';
    --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);}
a.color-blue:hover {text-decoration:underline;}
.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-start { display: flex; align-items: flex-start; } 
.flex-end { display: flex; justify-content: end; } 
.align-center { align-items: center; } 
.flex-column { display: flex; flex-direction: column; } 

@media screen and (max-width: 767px) {
	.flex-start {flex-direction:column;}
}

.gap10 {gap:10px;}
.gap15 {gap:15px;}
.gap20 {gap:20px;}

/* 동영상 임베드 */
.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-inline: 0 !important;
	}

	.width-scrollbox.w480 .scroll-con {
		width: 100%;
        padding: 0;
	}
}

@media screen and (min-width: 639px) {
	.width-scrollbox.w640 {
		margin-inline: 0 !important;
	}

	.width-scrollbox.w640 .scroll-con {
		width: 100%;
        padding: 0;
	}
}

@media screen and (min-width: 767px) {
	.width-scrollbox.w768 {
		margin-inline: 0 !important;
	}

	.width-scrollbox.w768 .scroll-con {
		width: 100%;
        padding: 0;
	}
}

@media screen and (min-width: 979px) {
	.width-scrollbox.w980 {
		margin-inline: 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%;
}

.clearfix::after {content:"";display:table;width:100%;clear:both;}
.fl {float:left !important;}
.fr {float:right !important;}
.al {text-align:left !important;}
.ac {text-align:center !important;}
.ar {text-align:right !important;}

/* 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; }