@charset "utf-8";

/* Noto Sans KR */
@font-face {
	font-family: "Noto Sans KR"; 
	src: url("../fonts/NotoSans-Light.eot");
	src: local("※"), 
		 url("../fonts/NotoSans-Light.eot?#iefix") format("embedded-opentype"), 
		 url("../fonts/NotoSans-Light.woff2") format("woff2"),
		 url("../fonts/NotoSans-Light.woff") format("woff");
	font-style: normal;
	font-weight: 300;
}
@font-face {
	font-family: "Noto Sans KR"; 
	src: url("../fonts/NotoSans-Regular.eot");
	src: local("※"), 
		 url("../fonts/NotoSans-Regular.eot?#iefix") format("embedded-opentype"),
		 url("../fonts/NotoSans-Regular.woff2") format("woff2"),
		 url("../fonts/NotoSans-Regular.woff") format("woff");
	font-style: normal;
	font-weight: 400;
}
@font-face {
	font-family: "Noto Sans KR"; 
	src: url("../fonts/NotoSans-Medium.eot");
	src: local("※"),
		 url("../fonts/NotoSans-Medium.eot?#iefix") format("embedded-opentype"), 
		 url("../fonts/NotoSans-Medium.woff2") format("woff2"),
		 url("../fonts/NotoSans-Medium.woff") format("woff");
	font-style: normal;
	font-weight: 500;
}
@font-face {
	font-family: "Noto Sans KR";
	src: url("../fonts/NotoSans-Bold.eot");
	src: local("※"), 
		 url("../fonts/NotoSans-Bold.eot?#iefix") format("embedded-opentype"), 
		 url("../fonts/NotoSans-Bold.woff2") format("woff2"),
		 url("../fonts/NotoSans-Bold.woff") format("woff");
	font-style: normal;
	font-weight: 700;
}

/* Reset */
/*------------------------------------------------
* default definition
------------------------------------------------*/
html,body,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,input{
	margin:0;
	padding:0;
	border:0;
	text-decoration:none;
	box-sizing:border-box;
}
html,body {height:100%;color:#000;font-family: 'Noto Sans KR', "Open Sans","Dotum", "Dotumche", "돋움", "돋움체", "Arial";}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
ul,ol,li{list-style:none}
hr,legend {display:none;}
table {border-collapse:collapse; table-layout:fixed;}

:focus {outline:none;}

html {-webkit-text-size-adjust: none;}

.br_pc {display:block;}
.br_mo {display:none;}
@media screen and (max-width:540px) {
	.br_pc {display:none;}
	.br_mo {display:block;}
}

img {display:block;width:100%;}

.imsi {position:absolute;left:0;top:0;z-index:0;}

/* 
overflow:auto;
-webkit-overflow-scrolling: touch;
*/

.hidden {overflow:hidden;position: absolute !important;width:1px;height:1px;font-size:1px;line-height:1px;clip: rect(1px,1px,1px,1px);}
.hidden-link-copy {position:fixed;left:0;bottom:0;z-index:-99;}

/*------------------------------------------------
* Global
* not use global : bg, block, btn, cate, date, find, info, number, photo, toggle
/*------------------------------------------------*/
.none {display:none;}
.hidden {overflow:hidden;}
.float {display:block;}
.float:after {content:"";clear:both;display:block;}
.floatL {position:relative;float:left;}
.floatR {position:relative;float:right;}
.txtflow {display:inline-block;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.block {display:block !important;}
.fixed {position:fixed;}
.clear {clear:both;}
.clone {display:none;}



/*------------------------------------------------
* color
/*------------------------------------------------*/
.color_red {color:#eb4e38 !important;}
.color_blue {color:#7cb5ec;}


/*------------------------------------------------
* z-index
/*------------------------------------------------*/
.dimmed {z-index:9998;}
.loading {z-index:9999;}

header {z-index:4000;}
.popup {z-index:5000;}
.page-top {z-index:5000;}

.mgnb {z-index:6000;}

/*------------------------------------------------
* flex
/*------------------------------------------------*/
.flex {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}




/*------------------------------------------------
* button
/*------------------------------------------------*/
button {border:none;background:transparent;font-family: 'Noto Sans KR', "Open Sans","Dotum", "Dotumche", "돋움", "돋움체", "Arial";transition:background 0.25s;}
button:hover {cursor:pointer;}

/* .btn {display: inline-block;border: 1px solid #ccc;border-radius: 10px;height: 24px;line-height: 22px;margin: 0;font-size:13px;}
.btn-area {text-align:center;vertical-align:middle;font-size:0;user-select:none;-ms-user-select: none;}
.btn-area button:not(:first-child),
.btn-area a:not(:first-child) {margin-left:20px;}


button,
.btn-type {position:relative;background:transparent;cursor:pointer;border:1px solid #ccc;box-sizing:border-box;
	font-family:"Noto Sans KR","malgun gothic",'Nanum Gothic',NanumGothic,"돋움",dotum,sans-serif;
	font-size:14px;
	user-select:none;
	-ms-user-select: none;
	transition:border .25s;

	border-radius:30px;
	height:42px;
	line-height:40px;
	padding:0 30px;
}
.btn-type {display:inline-block;}

button:hover,
.btn-type:hover {border:1px solid #000;}
button span {position:relative;} */


/*------------------------------------------------
* Form
/*------------------------------------------------*/
input, textarea {border:1px solid #e1e1e1;background:#fff;outline:none;font-family: 'Noto Sans KR', "Open Sans","Dotum", "Dotumche", "돋움", "돋움체", "Arial";box-sizing:border-box;color:#000;font-size:16px;}
input:focus, textarea:focus {border:1px solid #000;}
textarea {width:100%;resize:none;padding:7px;line-height:18px;}

/* input[type="text"],
input[type="password"],
input[type="file"] {height:45px; line-height:45px;border-radius:0;padding:0 10px;}
input[type="image"] {border:none;border-radius:0;}
input[type="submit"] {height:25px;} */


/* input, checkbox */
input[type="radio"],
input[type="checkbox"] {position:absolute;width:0;height:0;opacity:0;border:none;}
input[type="radio"]+label,
input[type="checkbox"]+label {position:relative;display:inline-block;top:0px;cursor:pointer;}
input[type="radio"]:disabled+label,
input[type="checkbox"]:disabled+label {cursor:default;}


input[type=text]::-ms-clear {display: none;}

/*------------------------------------------------
* Link
/*------------------------------------------------*/
a:link {color:#000; text-decoration:none;}
a:visited {color:#000; text-decoration:none;}
a:hover {color:#000; text-decoration:none;}
a:active {color:#000; text-decoration:none;}


/*------------------------------------------------
*  loading
/*------------------------------------------------*/
.loading {
	position:absolute;
    border: 8px solid #0054a6;
    border-top: 8px solid #0080c6;
    border-radius: 50%;
    width:50px;
    height:50px;
	left:50%;
	top:50%;
	margin:-25px 0 0 -25px;
	animation: spin 0.6s linear infinite;
	opacity:0.7;
	display:none;
}
.loading.small {
    border: 4px solid #0054a6;
    border-top: 4px solid #0080c6;
    width:26px;
    height:26px;
	margin:-13px 0 0 -13px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.dimmed {position:fixed;left:0;top:0;width:100%;height:100%;background:#000;opacity:0.3;display:none;}
.dimmed.white {background:#fff;}



/*------------------------------------------------
* Layout
/*------------------------------------------------*/
body {}
header {}
.content {}
footer {}



/* youtube bg */
.youtube-bg-background {position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;}
.youtube-bg-foreground {position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;}
.youtube-bg-foreground iframe {position:absolute;top:0;left:0;width:100%;height:100%;}
/* @media (min-aspect-ratio: 16 / 9) {
    .youtube-bg-foreground {height:300%;top:-100%;}
}
@media (max-aspect-ratio: 16 / 9) {
    .youtube-bg-foreground {width:300%;left:-100%;}
} */


/*------------------------------------------------
* media query
/*------------------------------------------------*/

@media screen and (min-width:1px) and (max-width:540px) {


}


/*------------------------------------------------
* hack
/*------------------------------------------------*/

/* chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) {
	/* select {padding-top:2px;} */
}