@charset "utf-8";

/*font*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');



html, body, main, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;vertical-align: baseline;background: transparent; box-sizing: border-box;}

a:link { text-decoration: none; }
a:hover{ text-decoration: none; }
a:visited { text-decoration: none;}
a:active { text-decoration: none;}

body {line-height: 1; background: #fff; color: #000;}
body div.popup-wrap {background-color: rgb(0, 0, 0); position: fixed; inset: 0; opacity: 0.7; cursor: pointer; z-index: 1;}
main {width: 100%;}
ol,ul { list-style:none; }
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary { display: block;}
nav ul { list-style: none;}
blockquote, q { quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after { content: none;}
a { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; color:#555}
ins { background-color: #ff9; color: #000; text-decoration: none;}
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold;}
del { text-decoration: line-through;}
abbr[title], dfn[title] { border-bottom: 1px dotted #000; cursor: help;}
table { border-collapse: collapse; border-spacing: 0; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0;}
/*caption { text-indent:-9999em; font-size:0; line-height:0;}*/
caption {width: 100%; height: 1px; color: transparent; overflow: hidden; position: relative;}
input, select { vertical-align: middle; font-family: inherit;}
button{ border: 0; padding: 0; margin: 0; background: transparent; }
input, textarea, select, button {font-family: inherit;}
table{font-size:inherit;}
pre,code,kbd,samp,tt{font-family:monospace; font-size:108%;line-height:100%;}
.content legend {overflow:hidden;visibility:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0}

/* Default Document Style */
html {font-size:20px; height: 100%;}
body {
	margin: 0;
	padding: 0;
	border: none;
	color:#333;
	font-size: 1rem;
	font-style: normal;
	background: transparent;
	height: 100%;
	width: 100%;
	line-height: 1;
	letter-spacing: -0.5px;
	font-weight: 400;
	font-family: 'Noto Sans KR', sans-serif;
	transform-origin:center center;
	word-break: keep-all;
}

.fr {display: flex;	flex-direction: row;}
.frc {display: flex;flex-direction: row;justify-content: center;}
.fre {display: flex;flex-direction: row;justify-content: flex-end;}
.frs {display: flex;flex-direction: row;justify-content: space-between;}
.frcc {display: flex;flex-direction: row;justify-content: center;align-items: center;}
.fc {display: flex;	flex-direction: column;}
.fcc {display: flex;flex-direction: column;justify-content: center;}
.fcs {display: flex;flex-direction: column;justify-content: space-between;}
.fce {display: flex;flex-direction: column;justify-content: flex-end;}
.fcsc {display: flex;flex-direction: column;justify-content: flex-start;align-items: center;}
.fccc {display: flex;flex-direction: column;justify-content: center;align-items: center;}

* {box-sizing: border-box; margin:0; padding:0;}
img {vertical-align:top; border:0; margin:0; padding:0;}
span, a, strong, i, em {display: inline-block}
table {width: 100%; }
strong {font-weight: 500;}

/* skipToContent */
#skipToContent a {position:absolute;top:0;left:0;z-index:9999;width:100%;height:1px;margin-top:-1px;display:block;background-color:#3875c1;font-size:14px;font-weight:500;color:#fff;line-height:1;text-align:center;overflow:hidden;}
#skipToContent a:focus,
#skipToContent a:active {margin-top:0;height:auto;padding:10px 0;}

/*input*/
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"] { width: auto; height: 40px; line-height: 40px; padding:0 10px; border:1px solid #bbb; font-size: 1.7rem; vertical-align: middle;}
textarea {padding:20px; border:1px solid #bbb; min-height: 200px; width: 100%; font-size: 1.7rem;}
input:read-only { background-color: #eee;}

/*placeholder*/
::placeholder { color: #666; opacity:1;}

/*selectbox*/
select {position: relative; appearance: none; cursor: pointer; width:auto; height:40px; padding:0 40px 0 15px; border:1px solid #bbb; font-size: 1.7rem; vertical-align: middle;}
select::-ms-expand {display:none;}

/*button*/
button {cursor: pointer; vertical-align: middle; }

/* Text Color */
.txt-color-black {color: #000 !important;}
.txt-color-dgray {color: #222 !important;}
.txt-color-gray {color: #bbb !important;}
.txt-color-ltgray {color:#838383 !important;}
.txt-color-red {color: #e60012 !important;}
.txt-color-yellow {color: #f7ae00 !important;}
.txt-color-cyan {color: #00b1f0 !important;}
.txt-color-blue {color: #005b9e !important;}
.txt-color-navy {color: #063c6d !important;}
.txt-color-skyblue {color: #378ee0 !important;}
.txt-color-cobalt {color: #053868 !important;}
.txt-color-white {color: #fff !important;}
.txt-color-aqua {color: #01b4bb !important;}
.txt-color-green {color: #7ec356 !important;}
.txt-color-orange {color: #f04e30 !important;}

/* bg Color */
.bg-cyan {background-color: #01b3bb !important;}
.bg-blue {background-color: #005b9e !important; }
.bg-lt-blue {background-color: #496877 !important; }
.bg-sky {background-color: #99ccff !important; color:#333 !important;}
.bg-whgrey {background-color: #f5f5f5 !important;}
.bg-white {background-color: #fff !important; color:#005b9e !important;}
.bg-grey {background-color: #888888 !important;}
.bg-lt-grey {background-color: #eee !important;}
.bg-yellow {background-color: #ffcc00 !important;}
.bg-green {background-color: #abdc15 !important;}
.bg-red {background-color: #ff0033 !important;}
.bg-orange {background-color: #ff6633 !important;}

/* float */
.f-left {float: left;}
.f-right {float: right;}
.f-none {float: none !important;}
.clearfix {clear:both !important;}
.clear:after {clear:both;display:block;content:'';}

/* Text Style */
.txt-hidden {text-indent: -9999em; font-size:0; color: transparent;}
.txt-cnt {text-align:center !important;}
.txt-left {text-align:left !important;}
.txt-right {text-align:right !important;}

/* hidden */
.hidden, legend { visibility: hidden; overflow: hidden; width: 0; height: 0; font-size: 0; line-height: 0; margin:0; padding:0; background:none}

/*icon*/
i {display: inline-block; vertical-align: middle; background-size: contain !important;}

/*border*/
.bo-0 {border:0 !important;}

/*spacing*/
.p-0 {padding:0 !important;}
.pt-0 {padding-top:0 !important;}
.pt-20 {padding-top:20px !important;}
.pt-30 {padding-top:30px !important;}
.pt-40 {padding-top:40px !important;}
.pb-0 {padding-bottom:0 !important;}
.ph-20 {padding:20px 0 !important;}
.pw-20 {padding:0 20px !important;}

.m-0 {margin:0 !important;}
.mt-0 {margin-top:0 !important;}
.mt-10 {margin-top:10px !important;}
.mt-20 {margin-top:20px !important;}
.mt-30 {margin-top:30px !important;}
.mb-0 {margin-bottom:0 !important;}
.mb-10 {margin-bottom:10px !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;}
.mh-20 {margin:20px 0 !important;}
.mw-20 {margin:0 20px !important;}

.transition {
	-webkit-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
	-moz-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
	-o-transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
	transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}