@charset "utf-8";
/* CSS Document */

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, sub, sup, tt, var,i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
caption, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video,button {
    margin: 0;
    padding: 0;
    border: 0;
	font-size:100%;
	text-decoration:none;
	word-break:break-all;
	line-height:120%;
}

strong,strike,b,u{
	margin: 0;
    padding: 0;
    border: 0;
	font-size:100%;
}


tbody, tfoot, thead, tr, th, td{margin: 0;
    padding: 0;
	font-size:100%;
	text-decoration:none;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}

html{height:100%; font-size:16px;}

body{
	font-family: 'Binggrae','Noto Sans KR', sans-serif;
	/*line-height:120%;*/
	height:100%;
	-webkit-font-smoothing: antialiased;
	font-weight:400;
	background-color: #fff;
	color:#93949C;
}

p, a,h1,h2,h3,h4,h5{
	font-family: 'Binggrae','Noto Sans KR', sans-serif;
    font-size:100%;
    text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	moz-osx-font-smoothing: grayscale;
	word-break:keep-all;
}

a{
	color:#93949C;
	cursor:pointer;
}

ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

.font70{font-size:4.375rem}
.font50{font-size:3.125rem}
.font30{font-size:1.875rem}
.font35{font-size:2.1875rem}
.font27{font-size:1.6875rem}
.font23{font-size:1.4375rem}
.font20{font-size:1.25rem}
.font25{font-size:1.5625rem}
.font17{font-size:1.0625rem;}
.font14{font-size:0.875rem;}

@media only screen and (max-width:768px){
	html{font-size:15px;}
}

@media only screen and (max-width:640px){
	html{font-size:14px;}
}


@media only screen and (max-width:425px){
	html{font-size:13px;}
}


input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"],  textarea {
    box-sizing: border-box;
    padding: 0px 16px;
    color: #8a8da1;
    font-size: 0.937em;
    outline: none;
    background: #e6e6f4;
    border-radius: 5px;
	border:none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -moz-appearance: none;
    -webkit-appearance: none;
	font-weight:400;
	transition:all .5s;
	font-family: 'Roboto','Noto Sans KR', sans-serif;
}

input::placeholder{color:#CCCCCC;}
textarea::placeholder{color:#CCCCCC;}

input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus,  textarea:focus{
	background: #E9E9E9; color:#737373;
	transition:all .5s;
}

input[type="button"],input[type="submit"],button{    
	box-sizing: border-box;
    font-size: 1rem;
    outline: none;
	border:none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -moz-appearance: none;
    -webkit-appearance: none;
	font-weight:400;
	cursor: pointer;
	transition: all .5s;
	font-family: 'Roboto','Noto Sans KR', sans-serif;
}







article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
    display: block;
}
*, :after, :before {
    box-sizing: inherit;
}

user agent stylesheet
article, aside, footer, header, hgroup, main, nav, section {
    display: block;
}

li {
    font-size: inherit;
}

*, :after, :before {
    box-sizing: inherit;
}

a {
    color: #000;
    outline: 0;
    -webkit-tap-highlight-color: transparent;
	transition: all .5s;
}

a:hover{
	color:#000;
}


a.button-type{display:inline-block; text-align:center; ; padding:10px;  transition: all .5s; font-family: 'Roboto','Noto Sans KR', sans-serif;  font-weight: 700; color:#000;}


a.button-type-white{display:block; text-align:center; border:1px solid #fff; padding:10px 0;  transition: all .5s; font-family: 'Roboto','Noto Sans KR', sans-serif;  font-weight: 700; border-radius: 5px; color:#fff;}
a.button-type-white:hover{background-color: #29549d; color:#fff; transition: all .5s; border:1px solid #29549d;}


a.button-type-black{display:inline-block; text-align:center; border:1px solid #000; color:#000; padding:10px 35px;  transition: all .5s; font-family: 'Roboto','Noto Sans KR', sans-serif;  font-weight: 500;}
a.button-type-black:hover{background-color: #000; color:#fff; transition: all .5s; border:1px solid #29549d;}

.button-type-black{display:inline-block; text-align:center; border:1px solid #000; color:#000; padding:10px 35px;  transition: all .5s; font-family: 'Roboto','Noto Sans KR', sans-serif;  font-weight: 500; background-color: #fff;}
.button-type-black:hover{background-color: #000; color:#fff; transition: all .5s; border:1px solid #29549d;}

.button-type-blue{display:inline-block; padding:10px 20px; text-align: center; background-color:#445CB4;  transition: all .5s; font-family: 'Binggrae','Noto Sans KR', sans-serif; font-weight:500; border-radius: 5px; color:#fff;}
.button-type-blue:hover{background-color: #63BFF3; transition: all .5s; color:#fff;}

.button-type-list{width:200px; height:50px; display:flex; align-items: center; justify-content: center; border-radius: 25px; border:1px solid #445CB4; color:#445CB4; margin:0 auto; font-size:16px; background-color: #fff;}
.button-type-list:hover{background-color: #445CB4; color:#fff;}

.button-type-sky{display:inline-block; padding:10px 20px; text-align: center; background-color:#63BFF3;  transition: all .5s; font-family: 'Binggrae','Noto Sans KR', sans-serif; font-weight:500; border-radius: 5px; color:#fff;}
.button-type-sky:hover{background-color: #6380F3; transition: all .5s; color:#fff;}

.button-type-down{padding:10px; border:2px solid #000; color:#000; transition:all 0.3s; font-weight: 700;}
.button-type-down:hover{padding:10px; border:2px solid #7b7bdf; color:#7b7bdf; transition:all 0.3s;}
.button-type-down > p{margin-right:15px; font-size:17px; float:left;}
.button-type-down > img{float:left;}



.btn-confirm{width:140px; height:42px; }
.check {width:20px; height:20px; display:block; position:relative; font-size:0.937em; cursor:pointer; user-select:none;-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; transition: all .5s;} 
.check input {position:absolute; opacity:0; cursor:pointer;} 
.checkmark {position:absolute; top:0; left:0px; width:100%; height:100%; background-color:#e6e6f4; border-radius: 5px; transition: all .5s;} 
.check:hover input ~ .checkmark {background-color:#d7d7ea; transition: all .5s;} 
.check input:checked ~ .checkmark {background-color:#3a3e56;} 
.checkmark:after {display:none; position:absolute; content:""; transition: all .5s;} 
.check input:checked ~ .checkmark:after {display:block;} 
.check .checkmark:after {top:45%; left:50%; width:5px; height:10px; border:solid #e58bf5; border-width:0 2px 2px 0; -webkit-transform:translate(-50%,-50%) rotate(45deg);-webkit-transform:translate(-50%,-50%) rotate(45deg); -ms-transform:translate(-50%,-50%) rotate(45deg); transition: all .5s;}

.check-circle {width:30px; height:30px; display:block; position:relative; font-size:0.937em; cursor:pointer; user-select:none;-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; transition: all .5s;} 
.check-circle input {position:absolute; opacity:0; cursor:pointer;} 
.checkmark-circle {position:absolute; top:0; left:0px; width:100%; height:100%; background-color:#cbcacb; border-radius: 50%; transition: all .5s;} 
.check-circle:hover input ~ .checkmark-circle {background-color:#d7d7ea; transition: all .5s;} 
.check-circle input:checked ~ .checkmark-circle {background-color:#152a76;} 
.checkmark-circle:after  {display:block; position:absolute; content:""; transition: all .5s;}  
.check-circle .checkmark-circle:after {top:45%; left:50%; width:5px; height:10px; border:solid #fff; border-width:0 2px 2px 0; -webkit-transform:translate(-50%,-50%) rotate(45deg);-webkit-transform:translate(-50%,-50%) rotate(45deg); -ms-transform:translate(-50%,-50%) rotate(45deg); transition: all .5s;}

.nr-rad-lb{background:#d6d6d6;  border-radius: 50%; width:18px; height: 18px; display: block; margin-right:10px; cursor: pointer; user-select:none;-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none;}
.nr-rad-lb input{display: none;}
.nr-rad-lb .nr-rad-inlb{width:18px; height: 18px; background-color:#fff; border-radius: 50%; display: block; transition: all .5s; border:1px solid #d6d6d6; }
.nr-rad-lb input[type="radio"]:checked ~ .nr-rad-inlb{width:17px; height: 17px; border:5px solid #445CB4;}

form{display: inline;}

.preloader-wrap{position:fixed; width:100%; height: 100%; z-index: 100; background: rgba(255,255,255,1); opacity:0;}
.preloader-wrap > img{position:fixed; top:50%; left:50%; -webkit-transform: translate(-50%,-50%); z-index: 101;}


#block{position:fixed; top:0px; left:0; width:100%; height: 100%; z-index: 51; background: rgba(0,0,0,0.8); cursor:pointer; display:none; }
.Top-btn{width:50px; height: 50px; border-radius: 50%; background: #fff; border:1px solid #00000; position:fixed; bottom:30px; right:-50px; z-index: 10; cursor: pointer;  opacity: 0; transition: all .5s; -webkit-transform: rotate(-200deg)}
.Top-btn > .inner-wrap{width:100%; height: 100%; position:relative;}
.Top-btn  img{width:40%; position:absolute; top:50%; left: 50%; -webkit-transform: translate(-50%,-50%);}
.Top-btn.on:hover{opacity: 1; transition: all .5s;}
.Top-btn.on{opacity: 0.5; transition: all .5s; right:30px; -webkit-transform: rotate(0deg);}

/*----- alert -----*/
.alert{width:calc(100% - 30px);  max-width:540px; position: fixed; top:50%; left:50%; -webkit-transform: translate(-50%,-50%); z-index: 52; background: #fff; border-radius: 5px; opacity: 0; display: none;}
.alert .inner-wrap{width:100%; position: relative; width:calc(100% - 30px); margin:0 auto;}
.alert .inner-wrap > .headBox{width:100%; font-size:1em; text-align: left; border-bottom:1px solid #142057; padding:15px 0; box-sizing: border-box; }
.alert .txt-box{width:calc(100% - 60px); height:auto; padding:50px 0; text-align: center; font-weight: 500; color:#707070; margin:0 auto; line-height: 150%;}
.alert .btn-box{width:100%; display:flex; justify-content: center; margin-bottom:20px;}
.alert .btn-box button{width:85px; height:35px; border-radius: 5px; font-size:1em; margin:0 5px; float:left; cursor: pointer; color:#fff; background:#263262; }



.boardpage-wrap{width:100%; margin-top:30px;}
.boardpage-wrap ul{margin:0 auto; display: table;}
.boardpage-wrap ul li{width:30px; height: 30px; cursor: pointer; text-align: center; font-size:0.875em; color:#707070; border:1px solid #C1C1C1; vertical-align: middle; box-sizing: border-box; display: table-cell;}
.boardpage-wrap ul li.on{font-weight: 500; background-color:#F0F0F0;  color:#152a76;}
.boardpage-wrap ul li:hover{font-weight: 500; background-color:#F0F0F0;  color:#152a76;}
.boardpage-wrap ul a img{vertical-align: middle;}
.boardpage-wrap ul a:nth-child(1) img{width:16px; height: 15px;}
.boardpage-wrap ul a:last-child  img{width:16px; height: 15px; -webkit-transform:rotate(0deg); 
	-moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH";}
.boardpage-wrap ul a:nth-child(2) img{width:8px; height: 15px;}
.boardpage-wrap ul a:nth-last-of-type(2) img{width:8px; height: 15px; -webkit-transform:rotate(0deg); 
	-moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH";}

.empty_message{text-align: center; margin:50px auto; font-size:1.25rem;}

.custom-wrap .read-wrap .pre-wrap{width:100%; margin-top:50px;}
.custom-wrap .read-wrap .pre-wrap ul{border-top:1px solid #152a75; border-bottom:1px solid #152a75;}
.custom-wrap .read-wrap .pre-wrap ul > li{border-bottom:1px solid #d8d9da; width:100%; height: 40px;}
.custom-wrap .read-wrap .pre-wrap ul > li:hover{background-color: #F7F7F7;}
.custom-wrap .read-wrap .pre-wrap ul > li > div{float:left; height: 40px; line-height: 40px; padding:0 10px; font-size:0.875em;}
.custom-wrap .read-wrap .pre-wrap ul > li > div.title-wrap{text-align: center; width:80px;}
.custom-wrap .read-wrap .pre-wrap ul > li > div.title-wrap > img{width:12px;}
.custom-wrap .read-wrap .pre-wrap ul > li.next div.title-wrap > img{-webkit-transform: rotate(180deg)}
.custom-wrap .read-wrap .pre-wrap ul > li > div.cont-wrap{main-width:130px; color:#737373;}
/*
.contents-wrap{width:100%;}
.contents-wrap > .inner{width:calc(100% - 30px); max-width:1366px; margin:0 auto; padding:150px 0 100px 0;}
.contents-wrap > .inner > .readyImg{width:100%; max-width:604px; display:block; margin:0 auto;}
*/
a.re_btn{display:block; width:218px; margin:50px auto;}
a.re_btn > img{width:100%;  display:block;}

.preLoader{position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); text-align:center; font-size:20px;  z-index:52; color:#fff; display:none; }
.preLoader > img{opacity:0.5; width:50%; margin-bottom:15px;}

.preSet{white-space: pre-line;}


.bord-page-numbering-wrap{margin:30px auto; display: flex; justify-content: center;}
.bord-page-numbering-wrap > ul{display:flex; align-items: center; justify-content: flex-start; margin:15px auto;  height: auto;}
.bord-page-numbering-wrap > ul li{width:40px; height: 40px; border-radius: 50%; background: #D6D6D6; text-align: center; line-height: 40px; margin-right:5px; transition: all .5s;}
.bord-page-numbering-wrap > ul a:last-child li{margin-right:0;}
.bord-page-numbering-wrap > ul li.on{background: #445CB4; color:#fff; transition: all .5s;} 
.bord-page-numbering-wrap > ul li.arrow-wrap{position:relative; background-color: #fff;}
.bord-page-numbering-wrap > ul li.prev .arrow-box{width:7px; height: 7px; border-top:4px solid #B7B7B7; border-left:4px solid #B7B7B7; position:absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotateZ(-45deg); -webkit-transform: translate(-50%,-50%) rotateZ(-45deg); border-radius: 3px;}
.bord-page-numbering-wrap > ul li.all.prev .arrow-box:nth-of-type(1){left:35%;}
.bord-page-numbering-wrap > ul li.all.prev .arrow-box:nth-of-type(2){left:55%;}
.bord-page-numbering-wrap > ul li.next .arrow-box{width:7px; height: 7px; border-top:4px solid #B7B7B7; border-right:4px solid #B7B7B7; position:absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotateZ(45deg); -webkit-transform: translate(-50%,-50%) rotateZ(45deg); border-radius: 3px;}
.bord-page-numbering-wrap > ul li.all.next .arrow-box:nth-of-type(1){left:35%;}
.bord-page-numbering-wrap > ul li.all.next .arrow-box:nth-of-type(2){left:55%;}
.bord-page-numbering-wrap > ul li.on .arrow-box{border-color:#e58bf5;}



.bord-page-numbering-myclass-wrap{margin:30px auto; display: flex; justify-content: center;}
.bord-page-numbering-myclass-wrap > ul{display:flex; align-items: center; justify-content: flex-start; margin:15px auto;  height: auto;}
.bord-page-numbering-myclass-wrap > ul li{width:35px; height: 35px; border-radius: 50%; background: #fff; text-align: center; line-height: 35px; margin-right:5px; transition: all .5s; border:1px solid #d6d6d6; box-sizing: border-box;}
.bord-page-numbering-myclass-wrap > ul a:last-child li{margin-right:0;}
.bord-page-numbering-myclass-wrap > ul li.on{background: #445CB4; color:#fff; transition: all .5s;} 
.bord-page-numbering-myclass-wrap > ul li.arrow-wrap{position:relative; background-color: #fff;}
.bord-page-numbering-myclass-wrap > ul li.prev .arrow-box{width:7px; height: 7px; border-top:4px solid #B7B7B7; border-left:4px solid #B7B7B7; position:absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotateZ(-45deg); -webkit-transform: translate(-50%,-50%) rotateZ(-45deg); border-radius: 3px;}
.bord-page-numbering-myclass-wrap > ul li.all.prev .arrow-box:nth-of-type(1){left:35%;}
.bord-page-numbering-myclass-wrap > ul li.all.prev .arrow-box:nth-of-type(2){left:55%;}
.bord-page-numbering-myclass-wrap > ul li.next .arrow-box{width:7px; height: 7px; border-top:4px solid #B7B7B7; border-right:4px solid #B7B7B7; position:absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotateZ(45deg); -webkit-transform: translate(-50%,-50%) rotateZ(45deg); border-radius: 3px;}
.bord-page-numbering-myclass-wrap > ul li.all.next .arrow-box:nth-of-type(1){left:35%;}
.bord-page-numbering-myclass-wrap > ul li.all.next .arrow-box:nth-of-type(2){left:55%;}
.bord-page-numbering-myclass-wrap > ul li.on .arrow-box{border-color:#e58bf5;}

#teahcer-frame{width:100%; max-width:960px; height:100vh; max-height:740px; border-radius: 20px; overflow: hidden; position:fixed; z-index: 55; top:50%; left:50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); opacity:0;}
#teahcer-frame > iframe{width:100%; height:100%;}
#block_teacher{width:100%; height: 100%; background-color:#000; opacity:0; position:fixed; top:0; left:0; z-index: 53;}

@media only screen and (max-width:560px){
	#teahcer-frame{border-radius: 0;}
	#teahcer-frame{max-height: none; max-width: none; top:0; left:0; transform:translate(0,0); -webkit-transform:translate(0,0);}
}