@font-face {
  font-family: 'seoulcyber';
  src: url("../font/seoulcyberT.eot"),
    url("../font/seoulcyberT.eot?#iefix") format("embedded-opentype"),
    url("../font/seoulcyberT.woff2") format("woff2"),
    url("../font/seoulcyberT.woff") format("woff"),
    url("../font/seoulcyberT.otf") format("opentype");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'seoulcyber';
  font-weight: 200;
  font-style: normal;
  font-display: swap;
  src: url("../font/seoulcyberUL.eot?#iefix") format("embedded-opentype"),
    url("../font/seoulcyberUL.woff2") format("woff2"),
    url("../font/seoulcyberUL.woff") format("woff"),
    url("../font/seoulcyberUL.otf") format("opentype");
}

@font-face {
  font-family: 'seoulcyber';

  font-weight: 300;
  font-style: normal;
  font-display: swap;
  src: url("../font/seoulcyberL.eot?#iefix") format("embedded-opentype"),
    url("../font/seoulcyberL.woff2") format("woff2"),
    url("../font/seoulcyberL.woff") format("woff"),
    url("../font/seoulcyberL.otf") format("opentype");

}

@font-face {
  font-family: 'seoulcyber';
  font-weight:400;
  font-style: normal;
  font-display: swap;
  src: url("../font/seoulcyberM.eot?#iefix") format("embedded-opentype"),
    url("../font/seoulcyberM.woff2") format("woff2"),
    url("../font/seoulcyberM.woff") format("woff"),
    url("../font/seoulcyberM.otf") format("opentype");
}

@font-face {
  font-family: 'seoulcyber';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url("../font/seoulcyberB.eot?#iefix") format("embedded-opentype"),
    url("../font/seoulcyberB.woff2") format("woff2"),
    url("../font/seoulcyberB.woff") format("woff"),
    url("../font/seoulcyberB.otf") format("opentype");
}

@font-face {
  font-family: 'seoulcyber';
  font-weight: 800;
  font-style: normal;
  font-display: swap;
  src: url("../font/seoulcyberEB.eot?#iefix") format("embedded-opentype"),
    url("../font/seoulcyberEB.woff2") format("woff2"),
    url("../font/seoulcyberEB.woff") format("woff"),
    url("../font/seoulcyberEB.otf") format("opentype");
}

.sc {font-family: "seoulcyber", sans-serif; font-weight:300; letter-spacing: -0.05em;}

* { margin: 0; padding: 0; font: inherit; color: inherit; box-sizing: border-box; }
html, body { scroll-behavior: smooth; line-height: 1; -webkit-font-smoothing: antialiased; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

a { text-decoration: none;}
ol, ul { list-style: none;}
img, video {max-width: 100%; vertical-align:top;}
strong, b { font-weight:700;} 
address, em { font-style:normal;}
blockquote, q {	quotes: none;}
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }


select, input, textarea, button { font-size: inherit; vertical-align: middle; border: 0; outline: none; padding:0.5em 0.8em; border-radius: 0; }
input[readonly="readonly"] { background: #f1f1f1 !important; cursor: default; }
select { border-radius: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(../img/common/select_arrow2.svg) no-repeat calc(100% - 5px) center; background-size: 17px auto; }
button { background-color: transparent; border: 0; cursor: pointer; font: inherit; line-height: inherit; vertical-align: inherit; }
button:focus { outline: none; }
button:disabled { cursor: default;}
textarea { width: 100%; resize: none;}
fieldset, iframe { border: 0; }
pre { white-space: pre-wrap; }




/* 루트 */
:root {
    /* primary-color */
    --default-txt: #000000;
    --sub-txt: #585F74;
    --key-color: #fde4f8;
    --sub-key-color: #f7f1fd;
    --point-color: #df017b;
    --sub-point-color: #FFFF85;
    --deep-key-color: #893dcc;

    /* sub-color */
    --gray-deep: #A5A6AA;
    --gray-mid: #C9CBD2; 
    --gray-lite: #ECEDF2;
    --bg-gray-color: #F8F9FA;
    --bg-blue-color: #F8FDFF;
    --bg-stroke-color: #CFF2FF;

    /* font-basic */
    --font-family: 'Pretendard', 'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋음', Dotum, 'Nanum Gothic', Arial, Verdana, sans-serif;
    --font-size: 16px;
    --font-weight: 400;
	--line-height:1.5em;

    /* font-style */
    --h2: 700 2.5rem/1.2 var(--font-family);
    --h3: 700 2rem/1.2 var(--font-family);
    --h4: 700 1.6rem/1.2 var(--font-family);

    --cont-inner: 1640px;
    --inner: 1720px;
}


body { font-weight: var(--font-weight); font-family: var(--font-family); font-size: var(--font-size); color: var(--default-txt); line-height:var(--line-height);}
body::-webkit-scrollbar { width: 6px; }
body::-webkit-scrollbar-thumb { background-color:#ccc; /* 스크롤바 색상 */ border-radius: 10px; /* 스크롤바 둥근 테두리 */ }
body::-webkit-scrollbar-track { background-color: transparent;  /*스크롤바 뒷 배경 색상*/ }
a { color: var(--default-txt); }

h2 { font: var(--h2); }
h3 { font: var(--h3); }
h4 { font: var(--h4); }


.t-black { color: var(--main-black); }
.t-key { color: var(--key-color); }
.t-sub { color: var(--sub-key-color); }
.t-point { color: var(--point-color); }
.t-dkey { color: var(--deep-key-color); }
.key-box {background:var(--key-color); padding:1em 1.5em}

.hidden { display: none; width: 0; height: 0; text-indent: -9999px; overflow: hidden; }
#accessibility, .skip, hr, legend {position:absolute;width:0; height:0; font-size:0; line-height:0;overflow:hidden; visibility:hidden ;}
#skipToContent {font-size: 0; left: 0;line-height: 0;position: absolute;top: -30px;	width: 100%;z-index: 999999;}
#skipToContent a:active, #skipToContent a:focus {font-size:13px;background-color: #333333;border: medium none;color: #FFFFFF;height: 30px;left: 0;position: absolute;text-align: center;text-decoration: underline;top: 30px;line-height: 30px;width: 100%;display: block;}
body.fixe {overflow:hidden;}

/* 폰트 굵기 */
.fw1 { font-weight: 100; }
.fw2 { font-weight: 200; }
.fw3 { font-weight: 300; }
.fw4 { font-weight: 400; }
.fw5 { font-weight: 500; }
.fw6 { font-weight: 600; }
.fw7 { font-weight: 700; }
.fw8 { font-weight: 800; }
.fw9 { font-weight: 900; }

.displayBlock { display: block; }
.displayInline { display: inline; }
.displayNone { display: none; }

.tc { text-align: center; justify-content: center;}
.tl { text-align: left; justify-content: flex-start;}
.tr { text-align: right; justify-content: flex-end;}

.video_wrap, .youtube_wrap {padding-bottom:calc(585 / 1040 * 100%); position:relative;}
.video_wrap iframe, .youtube_wrap iframe {position:absolute; left:0px; top:0px; width:100% !important; height:100% !important;}

.loading_area {position:fixed; width:100%; height:100%; z-index:99999;}
.loading_area #bg {background-color:#000; display:block; height:100%; left:0;  opacity:0.5; filter:alpha(opacity=50); position:fixed; top:0; width:100%; z-index:9999;}
.loading_area .loading_img { position:fixed; left:50%; top:50%; z-index: 99999}
.loader {height: 4px; width: 100%; position: absolute; left:0px; top: 0px;z-index: 99999; overflow: hidden; background-color: #ddd;}
.loader:before{display: block; position: absolute; content: ""; left: -200px; width: 200px; height: 4px; background-color: #d53f41; animation: loading 2s linear infinite;}

.input, .select {border-radius:4px; border:1px solid #dcdcdc;}


.pt0 {padding-top:0px !important}
.mt0 {margin-top:0px !important}



@media print {
	@page {
	  size: A4;
	  margin: 1cm;
	}
	body {zoom:70%; transform: scale(1);transform-origin: top left;}
	* {-webkit-print-color-adjust: exact;print-color-adjust: exact;}
	.sub_con, .section, .content, .box {page-break-inside: avoid;  break-inside: avoid;}
	.no_print {display: none;}
	
  }

 

@media screen and (max-width:768px){}