/* 서울사이버대학체 */
@font-face {
  font-family: "Seoul CyberL";
  font-style: normal;
  font-display: swap;
  src: url("../font/seoulcyberL.eot"),
    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: "Seoul CyberM";
  font-style: normal;
  font-display: swap;
  src: url("../font/seoulcyberM.eot"),
    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: "Seoul CyberB";
  font-style: normal;
  font-display: swap;
  src: url("../font/seoulcyberB.eot"),
    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");
}
* { 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; -webkit-tap-highlight-color: transparent;}
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; }


table {	border-collapse: collapse; border-spacing: 0; table-layout: fixed; }
caption, legend { overflow: hidden; position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; clip: rect(0,0,0,0); white-space: nowrap; }


input[type="checkbox"]{display:none;}
input[type="checkbox"] + label {position:relative; display:inline-flex; flex-wrap:wrap; align-items:center; vertical-align:middle;}
input[type="checkbox"] + label:before{display:block; content:""; width:26px; height:26px; box-sizing:border-box; border:1px solid #cccccc; background:#fff; border-radius:0px;  margin-right:5px; align-self:flex-start;}
input[type="checkbox"] + label.mr0:before {margin-right: 0px;}
input[type="checkbox"]:checked + label::before{background:url(../resources/img/common/check_on.png) no-repeat center center #d6000f; border-color:#d6000f; border-radius:0px;}
input[type="checkbox"] + label > span {flex:1}

input[type="radio"]{display:none;}
input[type="radio"] + label {position:relative; display:inline-flex; flex-wrap:wrap; align-items:center; vertical-align:middle;}
input[type="radio"] + label:before{display:block; content:""; width:28px; height:28px; box-sizing:border-box; border:1px solid #cccccc; background:#fff; border-radius:100%;  margin-right:5px; align-self:flex-start;}
input[type="radio"]:checked + label::before{background:url(../resources/img/common/check_on.png) no-repeat center center #d6000f; border-color:#d6000f}
input[type="radio"] + label > span {flex:1}
	


/* 루트 */
: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: 1440px;
}


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;}
.bul01.two {display: flex; flex-wrap: wrap; gap:0.4em}
.bul01.two > li {margin:0px !important; flex:48%}

.bul01 > li {padding-left:0.8em; position: relative;}
.bul01 > li:before {content:""; width:3px; height:3px; border-radius:100%; background: var(--deep-key-color); position:absolute; left: 0px; top: 0.6em;}
.bul01 > li:not(:first-child) {margin-top:0.4em;}
.bul02 > li {padding-left:1em; text-indent:-1em;}
.bul02 > li:not(:first-child) {margin-top:0.4em;}

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

.radio_group {display: flex; flex-wrap: wrap; gap:0.5em 1em}
.note {font-size: var(--sub-font-size);}
.ico_note {position:relative; display:flex; align-items:center; gap:5px}
.ico_note:before {display:block; content:""; width:22px; height:20px; box-sizing:border-box; border-bottom:18px solid var(--key-color); border-left:10px solid transparent; border-right:10px solid transparent; border-radius:4px; }
.ico_note:after {display:block; content:"!"; width:22px; height:20px; color:#fff; font-size:14px; font-weight:600; text-align:center; line-height:1.8em; position:absolute; left:0px; top:50%; transform:translateY(-50%)}



@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){}