/* CSS Document */

@charset "utf-8";

/******************
	etc
******************/


/*
#93DAFF	#98DFFF	#9DE4FF	#A2E9FF	#A7EEFF	#ACF3FF	#B0F7FF	#B4FBFF	#B9FFFF	#C0FFFF
#87CEFA	#91D8FA	#A5D8FA	#AFDDFA	#B9E2FA	#C3E7FA	#CDECFA	#D7F1FA	#E1F6FA	#EBFBFF
#00BFFF	#0AC9FF	#14D3FF	#1EDDFF	#28E7FF	#32F1FF	#3CFBFF	#46FFFF	#96FFFF	#C8FFFF
#00A5FF	#00AFFF	#00B9FF	#00C3FF	#00CDFF	#00D7FF	#00E1FF	#00EBFF	#00F5FF	#00FFFF
#1EA4FF	#28AEFF	#32B8FF	#3CC2FF	#46CCFF	#50D6FF	#5AE0FF	#6EE0FF	#6EEAFF	#78F3FF
#1E90FF	#289AFF	#32A4FF	#3CAEFF	#46B8FF	#50C2FF	#5ACCFF	#64D6FF	#6EE0FF	#78EAFF
#96A5FF	#A0AFFF	#AAB9FF	#B4C3FF	#BECDFF	#C8D7FF	#D2E1FF	#DCEBFF	#E8F5FF	#F4FFFF
#86A5FF	#90AFFF	#9AB9FF	#A4C3FF	#AECDFF	#B8D7FF	#CCE1FF	#E0EBFF	#EBF5FF	#F9FFFF
#6495ED	#6E9FED	#78A9ED	#82B3ED	#8CBDED	#96C7ED	#A0D1F7	#AADBFF	#B4E5FF	#BEEFFF
#0078FF	#0A82FF	#148CFF	#1E96FF	#28A0FF	#32AAFF	#3CB4FF	#46BEFF	#50C8FF	#5AD2FF
#0064FF	#0A6EFF	#1478FF	#1E82FF	#288CFF	#3296FF	#3CA0FF	#46AAFF	#50B4FF	#5ABEFF
#0000FF	#3232FF	#5050FF	#646EFF	#6478FF	#6482FF	#648CFF	#6496FF	#64A0FF	#64AAFF
#4169E1	#4B73E1	#557DE1	#5F87E1	#6991E1	#739BE1	#7DA5E1	#87AFEB	#91B9F5	#9BC3FF
#0064CD	#0A6ECD	#1478CD	#1E82CD	#288CD2	#3296D7	#3CA0E1	#46AAEB	#50B4F5	#5ABEF5
#5A5AFF	#6464FF	#6E6EFF	#7878FF	#8282FF	#8C8CFF	#A0A0FF	#B4B4FF	#C8C8FF	#D2D2FF
#7B68EE	#8572EE	#8F7CEE	#9986EE	#A390EE	#AD9AEE	#B7A4EE	#C1AEEE	#CBB8EE	#D5C2EE
#6A5ACD	#7E6ECD	#8878CD	#9282CD	#9C8CCD	#A696CD	#B0A0CD	#BAAAD7	#C4B4E1	#CEBEE1
#0000CD	#2828CD	#4646CD	#6464CD	#6E6ED7	#7878E1	#8282EB	#8C8CF5	#9696FF	#A0A0FF
#00008C	#14148C	#28288C	#3C3C8C	#50508C	#646496	#7878AA	#8C8CBE	#A0A0C8	#B4B4DC
#483D8B	#52478B	#5C518B	#665B8B	#70658B	#7A6F95	#84799F	#8E83A9	#988DB3	#A297BD
#000069	#1E3269	#323C73	#3C467D	#3C5087	#3C5A91	#46649B	#506EA5	#5A78AF	#6482B9


*/


/*	ime-mode		*/

.ime-d,
.TEL,
.HP,
.EMAIL,
.Number {
    ime-mode: disabled;
}

.ime-a {
    ime-mode: active;
}


/*	button	*/

button {
    cursor: pointer
}

a {
    color: #06b7f0;
}

a:hover,
a:active,
a:focus {
    color: #06b7f0;
    outline: none;
    text-decoration: none;
}

p {
    margin-bottom: 1.5em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: bold;
    margin: 0 0 30px 0;
}

hr {
    border-top: 1px solid #ddd;
}

::-webkit-selection {
    color: #fff;
    background: #06b7f0;
}

::-moz-selection {
    color: #fff;
    background: #06b7f0;
}

::selection {
    color: #fff;
    background: #06b7f0;
}


/*
::-webkit-scrollbar { display:none; }
*/


/*	animate	*/

a {
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

table caption {
    position: absolute;
    left: -200%;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}


/******************
	font
	Nanum Gothic Coding
	Jua
******************/

body {
    color: #000;
    font-family: 'Nanum Gothic', sans-serif;
    font-size: 16px;
    line-height: 1.6;
}


/******************
	z-index
******************/

#header {
    z-index: 4000;
}

#nav-toggle {
    z-index: 8000;
}

#loginWrapper {
    z-index: 9999;
}

#Content {
    z-index: 1;
}

#Content #enTeacher .tBox.active {
    z-index: 200;
}

footer {
    z-index: 3000;
}


/******************
	layout
******************/

#wrapper {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 80px 0 0 0;
    position: relative;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #FFF;
}


/*	header	*/

#header {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}


/*	헤더 이벤트 이미지 bg	*/

#header {
    background-color: #FFF;
}


/*	header nav	*/

#header .navbar {
    margin: 0;
    min-height: 80px;
    border-bottom: solid 3px;
    position: relative;
}

#header .navbar-default {
    background: url(https://www.espot.co.kr/images/event/Btype/header_bg.png) no-repeat center top;
    background-color: #fff;
    border-color: #d7d8da;
}

header .nav-header {
    min-height: 80px;
}

header .nav-header .navbar-toggle {
    margin-top: 18px;
}

header .navbar .navbar-brand {
    margin: 13px 45px 0 0;
    padding: 0;
}

header .navbar .navbar-nav {}

header .navbar-fixed-top .navbar-collapse {
    max-height: none;
    width: 100%;
}

header .navbar-fixed-top .navbar-collapse .navbar-nav {
    height: 100vh;
}

header .navbar .navbar-nav>li {
    margin-top: 21px;
}

header .navbar .navbar-nav>li a {
    font-size: 14px;
    line-height: 1.3666;
    text-transform: uppercase;
    padding-top: 8px;
    padding-bottom: 8px;
}

.navbar-default .navbar-nav>li>a {
    color: #000;
}

.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>a:hover {
    color: #000;
    background-color: transparent;
}

header .navbar .navbar-right {
    margin-top: 10px;
}

header .navbar .navbar-right .btn {
    padding: 6px 16px;
}

header .navbar .navbar-right .btn-black {
    color: #000;
    background-color: transparent;
    border-color: #000;
}

header .navbar .navbar-right .btn-black:hover {
    color: #fff;
    background-color: #000;
    border-color: #000;
}

#header.nav-up {
    top: -77px;
}

#header .scroll-progress {
    border-top: solid 3px #f00606;
    position: absolute;
    bottom: -3px;
}

header .navbar .navbar-nav>li.TopMenuNotice {
    display: block;
}

header .navbar .navbar-nav>li.cusMenu {
    display: block;
}

@media (min-width:768px) {
    header .navbar .navbar-nav>li.TopMenuNotice {
        display: none;
    }
    header .navbar .navbar-nav>li.cusMenu {
        display: none;
    }
}

@media (min-width:992px) {
    header .navbar .navbar-nav>li.TopMenuNotice {
        display: block;
    }
    header .navbar .navbar-nav>li.cusMenu {
        display: none;
    }
}

@media (min-width:1200px) {
    header .navbar .navbar-nav>li.TopMenuNotice {
        display: block;
    }
    header .navbar .navbar-nav>li.cusMenu {
        display: block;
    }
}


/*	Content	*/

#Content {
    width: 100%;
    min-height: 400px;
    position: relative;
    margin: 0;
}

#Content {
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}


/*	footer	*/

footer {
    display: block;
    width: 100%;
    padding: 20px 0 60px;
    background-color: #242d37;
    position: relative;
    color: #EBFBFF;
    font-size: 9pt;
}

footer section h5 {
    margin: 30px 0 4px;
    font-weight: 400;
    color: #969fa8;
    letter-spacing: 2px;
    text-transform: uppercase;
}

footer section li a {
    padding: 3px 0;
    display: inline-block;
}

footer a {
    font-size: 14px;
    color: #fff;
}

footer a:focus,
footer a:hover {
    color: #06b7f0;
    text-decoration: none;
}

footer .footerNav {
    padding-bottom: 0px;
    margin-bottom: 15px;
    border-bottom: solid 1px #e3e3e336;
}

footer .footerNav ul {}

footer .footerNav ul li {
    display: block;
}

footer .footerNav ul li a {
    display: block;
    padding: 7px 8px;
}

footer .footerNav {}

footer .customerCenter {
    margin: 15px 15px 15px 0;
}

footer .customerCenter h5 {
    display: inline-block;
    margin: 0 20px 0 0;
    padding: 0;
    font-size: 16px;
}

footer .customerCenter ul {
    display: block;
    margin: 0;
    padding: 0;
}

footer .customerCenter ul li {
    display: block;
    margin: 0 15px 0 0;
    padding: 0;
}

footer .customerCenter a.cusTel {
    color: #06b7f0;
    font-size: 30px;
    font-weight: 800;
}

@media (min-width:768px) {
    footer .footerNav ul li {
        display: inline-block;
    }
    footer .customerCenter {
        margin: 0 0 30px 0;
    }
    footer .customerCenter h5 {
        display: inline-block;
        margin: 0 20px 0 0;
        padding: 0;
        font-size: 12px;
    }
    footer .customerCenter ul {
        display: inline-block;
        margin: 0;
        padding: 0;
    }
    footer .customerCenter ul li {
        display: inline-block;
        margin: 0 15px 0 0;
        padding: 0;
    }
    footer .customerCenter a.cusTel {
        color: #06b7f0;
        font-size: 16px;
        font-weight: 800;
    }
}

footer .footerinfo {
    padding: 30px 0;
}

footer .footerinfo dl {
    margin-bottom: 0;
}

footer .footerinfo dl dt,
footer .footerinfo dl dd {
    display: inline-block;
}

footer .footerinfo dl dd:after {
    content: " ";
    display: block;
    float: right;
    width: 100%;
}

footer .footerinfo dl dt {
    padding-right: 8px;
}

footer .footerinfo dl dd {
    padding-right: 0;
}

footer #copyright {}

footer #copyright {
    text-align: center;
}

footer #copyright p {
    font-size: 9pt;
    margin: 15px 0;
    text-align: center;
    color: #CCC;
}

@media (min-width:768px) {
    header .nav-header {
        min-height: 0;
    }
    header .navbar-fixed-top .navbar-collapse .navbar-nav {
        height: auto;
    }
    footer #copyright p {
        text-align: right;
        margin: 0;
    }
    footer #copyright {
        text-align: left;
    }
    footer section h5 {
        margin-top: 0;
        margin-bottom: 15px;
    }
    footer .footerinfo dl {
        margin-bottom: 10px;
    }
    footer .footerinfo dl dd {
        padding-right: 20px;
    }
    footer .footerinfo dl dt,
    footer .footerinfo dl dd {
        display: inline-block;
    }
}

@media (min-width:992px) {}

@media (min-width:1200px) {}


/**********************************
	공통 세션
**********************************/

.section,
.section-fluid,
.section-emphasis {
    padding-top: 50px;
    padding-bottom: 70px;
    position: relative;
}

.section {
    background-color: #fff;
}

.section-fluid {
    background-color: #f4f5f7;
}

.section-fluid hr {
    border-top: 1px solid #ccc;
}

.section-emphasis {
    background-color: #242d37;
    color: #fff;
}

.section-emphasis hr {
    border-top: 1px solid #fff;
}

.section h1 {
    margin-bottom: 50px;
}

.title-section {
    padding-top: 70px;
    padding-bottom: 90px;
}

.title-section h2 {}


/**********************************
	메인
**********************************/


/*	Content	*/

.main #Content section {
    padding-top: 70px;
    padding-bottom: 70px;
}

#Content .padding0 {
    padding: 0;
}

#Content .banners {
    padding: 0 0 70px 0 !important;
    position: relative;
    overflow: hidden;
    height: 770px;
}

#Content .banners #mainBanners {
    background-color: #fdf0ce;
    height: 700px;
}

#Content .banners #mainBanners #mainBannerList {
    list-style: none;
    height: 100%;
}

#Content .banners #mainBanners #mainBannerList li {
    width: 100%;
    height: 100%;
    display: inline-block;
    float: left;
    padding: 70px 0;
    background: url(/images/Main_Top_BG.png) no-repeat center bottom;
    color: #fff;
}

#Content .banners #mainBanners #mainBannerList li img {
    width: 100% !important;
    height: auto;
}

#Content .banners #mainBanners #mainBannerList .container {
    min-height: 350px;
}

#Content .banners #mainBanners #mainBannerList .row {}

#Content .banners #mainBanners #mainBannerList h1 {
    font-size: 40px;
    color: #fed112;
    margin-top: 24px;
    margin-bottom: 15px;
    text-align: center;
}

#Content .banners #mainBanners #mainBannerList p {
    font-size: 24px;
    font-weight: 300;
    color: #fff;
    margin-top: 5px;
    padding-bottom: 30px;
    text-align: center;
}

#Content .banners #mainBanners #mainBannerList .bannerImg {
    background-image: none;
    position: relative;
}

#Content .Roller {
    background: url('/images/bg01_.png') center center no-repeat;
    height: 375px;
    padding-top: 75px;
    padding-bottom: 80px;
    background-color: #e8faff;
}

#Content .Roller .section_title h1{
    font-weight: 900;
    margin-bottom: 15px;
}

#Content .Roller .section_title p{
    font-size: 14px;
}

#Content .Roller .Roll_banner {
    height: 220px;
    overflow: hidden;
}

#Content .Roller .Roll_banner #Roller_list{
    list-style: none;
    padding: 0;
    margin: 0;
}

#Content .Roller .Roll_banner #Roller_list li{
    padding-bottom: 20px;
}

/* 애니메이션 키프레임 설정 */
@keyframes animate {
	0% { top: 0; } /* 초기 위치 */
	100% { top: -500px; } /* 원하는 롤링 이동 거리 (종료 위치) */
}


/*	이벤트	*/

#main_event {
    height: 250px;
    margin-bottom: 30px;
}

#main_event .swiper-container {
    width: 100%;
    height: 100%;
}

#main_event .swiper-slide {
    background-position: center;
    background-size: cover;
}


/*	공지사항	*/

#main_notice {
    height: 250px;
    font-size: 12pt;
}

#main_notice .notice_img {
    height: 50px;
    width: 100%;
    overflow: hidden;
    margin-bottom: 20px;
}

#main_notice #main_notice_list {}

#main_notice #main_notice_list li {
    margin-bottom: 7px;
    padding-bottom: 7px;
    border-bottom: dotted 1px #757171;
}

#main_notice #main_notice_list li a {
    display: block;
    color: #333;
}

@media (min-width:768px) {
    #Content .banners {
        padding: 0 0 70px 0 !important;
        position: relative;
        overflow: hidden;
        height: 870px;
    }
    #Content .banners #mainBanners {
        background-color: #fdf0ce;
        height: 800px;
    }
    #Content .banners #mainBanners #mainBannerList li img {
        width: 787px !important;
        height: auto;
    }
    #main_event {
        height: 350px;
    }
    #main_notice {
        height: 350px;
        font-size: 12pt;
    }
}

@media (min-width:992px) {}

@media (min-width:1200px) {}


/*	화상영어	*/

.mainEspot {
    padding: 70px 0;
    background: url(/images/espot/mainEspot.png) no-repeat center center;
    color: #fff;
}

.mainEspot .explanation {
    font-size: 20pt;
}

#espot .btn,
#edlive .btn,
#youame .btn {
    margin-bottom: 15px;
}

#Content #section1 {
    background-color: #242d37;
    color: #FFF;
}

#Content #section1 h2 {
    color: #FFF;
}

#Content #section2 {
    background-color: #f4f5f7;
}

#Content #section3 {
    background-color: #f4f5f7;
}

#Content #enTeacher {}

#Content #enTeacher #teacherList {
    position: relative;
    padding-bottom: 50px;
}

#Content #enTeacher .tBox {
    background-color: #fff;
    width: 80%;
    margin: 0 auto 50px auto;
    border: solid 1px #204d74;
}

#Content #enTeacher .tBox .tPhoto {
    width: 100%;
    height: auto;
    overflow: hidden;
}

#Content #enTeacher .tBox .tName {
    margin: 15px 5px;
    text-align: center;
}

#Content #enTeacher .tBox .tName a {
    font-weight: 800;
    color: #000;
}

#Content #enTeacher .tBox .tInfo,
#Content #enTeacher .tBox .tMovie {
    display: none;
}

#Content #enTeacher .tBox .tDetail {
    display: block;
}

#Content #enTeacher .tBox.active {
    width: 100%;
    padding: 25px;
    z-index: 200;
    position: absolute;
    top: 0;
    left: 0;
}

#Content #enTeacher .tBox.active .tPhoto {
    display: none;
}

#Content #enTeacher .tBox.active .tInfo,
#Content #enTeacher .tBox.active .tMovie,
#Content #enTeacher .tBox.active .tDetail {
    display: block;
}


/*	에듀라이브 item	*/

.itemList {}

.itemList .row {
    margin-bottom: 0px;
}

.itemList #eduLiveListHeader1 .itemHeader {
    background: url(/images/edulive/teacher/main/teacher01.png) center center;
}

.itemList #eduLiveListHeader2 .itemHeader {
    background: url(/images/edulive/teacher/main/teacher02.png) center center;
}

.itemList #eduLiveListHeader3 .itemHeader {
    background: url(/images/edulive/teacher/main/teacher03.png) center center;
}

.itemList #eduLiveListHeader4 .itemHeader {
    background: url(/images/edulive/teacher/main/teacher04.png) center center;
}

.itemList #eduLiveListHeader5 .itemHeader {
    background: url(/images/edulive/teacher/main/teacher05.png) center center;
}

.itemList #eduLiveListHeader6 .itemHeader {
    background: url(/images/edulive/teacher/main/teacher06.png) center center;
}

.itemList .itemBox {
    border: solid 1px #ddd;
    margin-bottom: 30px;
}

.itemList .itemBox:hover {
    border: solid 1px #277ece;
}

.itemList .itemBox .extension-preview {
    position: relative;
}


/*	수업 타입에 따른 아이콘	*/

.itemList .itemBox .classIcon_oneone:after {
    content: "\f51c";
}

.itemList .itemBox .classIcon_broadcast:after {
    content: "\f26c";
}

.itemList .itemBox .classIcon_video:after {
    content: "\f03d";
}

.itemList .itemBox .classIcon_oneone:after,
.itemList .itemBox .classIcon_broadcast:after,
.itemList .itemBox .classIcon_video:after {
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 2em;
    display: block;
    width: 50px;
    height: 50px;
    position: absolute;
    top: -15px;
    left: -10px;
    color: rgba(6, 50, 119, 0.7);
}

.itemList .itemBox:hover .classIcon_oneone:after,
.itemList .itemBox:hover .classIcon_broadcast:after,
.itemList .itemBox:hover .classIcon_video:after {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=4)";
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    top: -50px;
    color: rgba(6, 50, 119, 1);
}

.itemList .itemBox .extension-preview a {}

.itemList .itemBox .extension-preview a .extension-description {
    position: absolute;
    background-color: rgba(36, 45, 55, .9);
    color: #fff;
    padding: 10px;
    font-size: 14px;
    line-height: 16px;
    opacity: 0;
    height: 100%;
    width: 100%;
}

.itemList .itemBox .extension-preview a img {
    width: 100%;
}

.itemList .itemBox .extension-preview a:hover .extension-description {
    opacity: 0.9;
}

.itemList .itemBox .extension-name {
    min-height: 100px;
    border-top: solid 1px #ddd;
    padding: 10px;
    font-size: 17px;
}

.itemList .itemBox .extension-name h5 {
    font-weight: 600;
    margin-bottom: 10px;
}

.itemList .itemBox .extension-name h5 a {
    color: #000;
}

.itemList .itemBox .extension-name p {
    margin-bottom: 0;
}

.itemList .itemBox .extension-name .discount {
    display: inline-block;
    margin-right: 15px;
    text-decoration: line-through;
    color: #666;
}

.itemList .itemBox .extension-name .discount+svg,
.itemList .itemBox .extension-name .price {
    color: #F00;
}

.itemList .itemBox .extension-name .discount+svg {
    margin-right: 15px;
}

.itemList .itemBox .extension-name .price {
    font-weight: bold;
}

.itemList .itemBox .extension-bottom {
    min-height: 20px;
    border-top: solid 1px #ddd;
    font-size: 14px;
}

.itemList .itemBox .extension-bottom .row {
    margin-bottom: 0;
    padding: 10px;
}

.itemList .itemBox .extension-bottom .star {
    color: #10b4e9;
}

.itemList .itemHeader {
    min-height: 230px;
    position: relative;
    margin-bottom: 30px;
}

.itemList .itemHeader .itemHeaderBG,
.itemList .itemHeader .itemHeaderText {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
}

.itemList .itemHeader .itemHeaderText a {
    position: absolute;
    bottom: 0;
    right: 0;
}

.itemList .itemHeader .itemHeaderBG {
    opacity: 0.9;
    z-index: 100;
}

.itemList .itemHeader .itemHeaderText {
    z-index: 200;
    color: #fff;
    padding: 20px;
}

.itemList .itemHeader .itemHeaderText h3 {
    color: #fff;
    font-weight: bold;
    margin-top: 50px;
}

.itemList .itemHeader .teacher_title {
    display: block;
}

.itemList .itemHeader .teacher_title img {
    border: solid 1px #e3e3e3;
}

.itemList .itemHeader .teacher_title .teacher_title_name {
    margin-top: 15px;
    text-align: center;
}

.itemList .itemHeader .teacher_title .teacher_title_name strong {
    margin-right: 15px;
}


/*	메인 에듀라이브 과목 BG color	*/

#eduLiveList.itemList .itemHeader .itemHeaderBG {
    background-color: #123779;
}

#eduLiveList2.itemList .itemHeader .itemHeaderBG {
    background-color: #12b886;
}

@media (min-width:768px) {
    #Content .banners #mainBanners #mainBannerList h1 {
        font-size: 40px;
        text-align: left;
        margin-top: 54px;
        margin-bottom: 15px;
        text-align: left;
    }
    #Content .banners #mainBanners #mainBannerList p {
        font-size: 24px;
        text-align: left;
        font-weight: 300;
        color: #fff;
        margin-top: 5px;
        padding-bottom: 30px;
        text-align: left;
    }
    #Content .banners #mainBanners #mainBannerList .bannerImg {
        background-repeat: no-repeat;
        background-position: 0 0;
        height: 500px;
        width: 50%;
        position: absolute;
        right: 0;
        overflow: visible;
    }
    #Content .banners #mainBanners #mainBannerList .bannerImg1 {
        background-image: url(/images/main_banner.png);
    }
    #Content #enTeacher .tBox {
        width: 100%;
        margin: 0;
        border: none;
    }
    #Content #enTeacher .tBox.active {
        width: 200%;
        border: solid 1px #204d74;
    }
    #Content #enTeacher .tBox1.active,
    #Content #enTeacher .tBox2.active,
    #Content #enTeacher .tBox3.active {
        left: 0;
    }
    #Content #enTeacher .tBox4.active {
        left: -100%;
    }
    #Content #enTeacher .tBox .tPhoto {
        height: 150px;
    }
    .itemList .itemHeader {
        min-height: 345px;
        margin-bottom: 30px;
    }
    /*
	.itemList .row { margin-bottom:30px; }
	.itemList .itemBox { margin-bottom:0px; }
*/
    .itemList .itemHeader .itemHeaderText h3 {
        margin-top: 100px;
    }
}

@media (min-width:992px) {
    #Content #enTeacher .tBox .tPhoto {
        height: 200px;
    }
    .itemList .itemHeader {
        min-height: 275px;
    }
    .itemList .itemHeader .itemHeaderText h3 {
        margin-top: 50px;
    }
}

@media (min-width:1200px) {
    #Content #enTeacher .tBox .tPhoto {
        height: 250px;
    }
    .itemList .itemHeader {
        min-height: 305px;
    }
    .itemList .itemHeader .itemHeaderText h3 {
        margin-top: 100px;
    }
}


/*	메인 유아미	*/

#youame {
    background-color: #09712b;
    color: #fff;
}


/*	세션 타이틀 이미지	*/

.SectionIMG {
    position: relative;
}

.SectionIMG .titleImg {
    width: 100%;
    height: auto;
    position: relative;
    top: auto;
    right: auto;
    background: none;
}

@media (min-width:768px) {
    .SectionIMG .titleImg {
        height: 250px;
        width: 400px;
        position: absolute;
        top: 20px;
        right: 0;
    }
    .SectionIMG .edulive {
        background: url(/images/edulive_img.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    .SectionIMG .youame {
        background: url(/images/youame_img.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    .SectionIMG .adultbasics {
        background: url(/images/englishspot/adult_english_img.png) bottom;
        background-repeat: no-repeat;
    }
    .SectionIMG .speaking {
        background: url(/images/englishspot/toeic_speaking_img.png) bottom;
        background-repeat: no-repeat;
    }
    .SectionIMG .listening {
        background: url(/images/englishspot/toeic_listening_img.png) bottom;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .SectionIMG .general {
        background: url(/images/englishspot/general_english_img.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    .SectionIMG .business {
        background: url(/images/englishspot/business_english_img.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    .SectionIMG .tesol {
        background: url(/images/englishspot/tesol_img.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    .SectionIMG .esl {
        background: url(/images/englishspot/esl_img.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    .SectionIMG .Tuition {
        background: url(/images/hero-image.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
}

@media (min-width:992px) {}

@media (min-width:1200px) {}


/**********************************
	서브
**********************************/

.subpages {}

.subpages section.page-header {
    margin: 0;
    padding: 50px 0 50px 0;
    background-color: #0080c3;
}

.subpages section.page-header h1,
.subpages section.page-header p {
    color: #fff;
    text-align: center;
}

.subpages section.page-header h1 {
    margin: 0;
    font-size: 30px;
    font-weight: bold;
}

.subpages section.page-header p {
    margin: 10px 0 0 0;
    font-size: 12px;
}


/*	서브페이지 헤더 bg 이미지	*/

.subpages.contact section.page-header {
    background: url(/images/header_bg/contact.jpg) center center;
}

.subpages.extensions section.page-header {
    background: url(/images/header_bg/extensions.jpg) center center;
}

.subpages.demonstration section.page-header {
    background: url(/images/header_bg/demonstration.jpg) center center;
}

.subpages.feature section.page-header {
    background: url(/images/header_bg/feature.jpg) center center;
}

.subpages.partner section.page-header {
    background: url(/images/header_bg/partner.jpg) center center;
}

.subpages.login section.page-header {
    background: url(/images/header_bg/login.jpg) center center;
}

.subpages.register section.page-header {
    background: url(/images/header_bg/register.jpg) center center;
}

.subpages.english_adult section.page-header {
    background: url(/images/header_bg/english_adult.jpg) center center;
}

.subpages.english_student section.page-header {
    background: url(/images/header_bg/english_student.jpg) center center;
}

.subpages.english_teacher section.page-header {
    background: url(/images/header_bg/english_teacher.jpg) center center;
}

.subpages.edulive section.page-header {
    background: url(/images/header_bg/edulive.jpg) center center;
}

.subpages.youame section.page-header {
    background: url(/images/header_bg/youame.jpg) center center;
}

.subpages.company section.page-header {
    background: url(/images/header_bg/company.jpg) center center;
}

.subpages.careers section.page-header {
    background: url(/images/header_bg/careers2.png) center center;
}

.subpages.board_58 section.page-header {
    background: url(/images/header_bg/board_event.jpg) center center;
}

.subpages.board_47 section.page-header {
    background: url(/images/header_bg/board_faq.jpg) center center;
}

.subpages.board_41 section.page-header {
    background: url(/images/header_bg/board_notice.jpg) center center;
}

.subpages.board_program section.page-header {
    background: url(/images/header_bg/board_program.jpg) center center;
}

.subpages.board_59 section.page-header {
    background: url(/images/header_bg/board_question.jpg) center center;
}

.subpages.board_55 section.page-header {
    background: url(/images/header_bg/board_review.jpg) center center;
}

.subpages.board_setting section.page-header {
    background: url(/images/header_bg/board_setting.jpg) center center;
}

.subpages.board_support section.page-header {
    background: url(/images/header_bg/board_support.jpg) center center;
}


/*	서브페이지 왼쪽 메뉴	*/

.subpageSplit {}

.subpageSplit .splitMenu,
.subpageSplit .splitBody {
    margin-top: 30px;
}

.subpageSplit .left_Title {
    border-bottom: solid 2px #01afe8;
    padding-bottom: 10px;
    margin-bottom: 15px;
}

.subpageSplit .left_Title h3 {
    margin: 0;
    padding: 5px 8px;
}

.subpageSplit .left_Body {}

.subpageSplit .left_Body .leftnav_toggle {
    margin-bottom: 15px;
}

.subpageSplit .left_Body .leftNav {
    display: none;
}

.subpageSplit .left_Body .leftNav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.subpageSplit .left_Body .leftNav li {
    line-height: 35px;
    font-size: 18px;
}

.subpageSplit .left_Body .leftNav li a {
    padding-left: 20px;
    color: #333;
    display: block;
}

.subpageSplit .left_Body .leftNav li.active a,
.subpageSplit .left_Body .leftNav li a:hover {
    border-left: 2px solid #01afe8;
    background-color: #f4f5f7;
}

.subpageSplit .left_Body .leftNav hr {
    margin: 8px 10px;
    border-top: 1px solid #01afe850;
}

@media (min-width:768px) {
    .subpageSplit .splitMenu,
    .subpageSplit .splitBody {
        margin-top: 50px;
    }
    .subpageSplit .left_Body .leftNav {
        display: block !important;
    }
    .subpages section.page-header h1 {
        margin: 0;
        font-size: 40px;
        font-weight: bold;
    }
    .subpages section.page-header p {
        margin: 10px 0 0 0;
        font-size: 16px;
    }
}

@media (min-width:992px) {}

@media (min-width:1200px) {}

.english_student {}


/*	헤더 이미지 레벨	*/

.levelHeader1,
.levelHeader2,
.levelHeader3 {
    padding: 70px 0 50px 0;
    text-align: center;
    margin: 50px 0;
    color: #FFF;
    position: relative;
}

.levelHeader1 {
    background: url(/images/espot/level_content_bg1.png) center center;
    margin-top: 150px;
}

.levelHeader2 {
    background: url(/images/espot/level_content_bg2.png) center center;
}

.levelHeader3 {
    background: url(/images/espot/level_content_bg3.png) center center;
}

.booksheaderimg {
    background: url(/images/espot/book_content_bg1.png) center center;
    color: #fff;
}

#teacherHeader {
    background: url(/images/espot/teacher_bg1.png) center center;
    color: #fff;
}

#teacherHeader2 {
    background: url(/images/espot/teacher_bg2.png) center center;
    color: #fff;
}

.section-fluid .darkCover,
.section .darkCover {
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
}


/*	교재안내	*/

.english_student #espotBooks {}

.english_student #espotBooks .bookBox {
    padding: 15px;
    position: relative;
}

.english_student #espotBooks .bookBox .bookIMG {
    display: inline-block;
    width: 40%;
    vertical-align: top;
    margin-bottom: 25px;
}

.english_student #espotBooks .bookBox .bookIMG img {
    width: 100%;
    height: auto;
    border: solid 1px #e3e3e3;
}

.english_student #espotBooks .bookBox .bookInfo {
    display: inline-block;
    width: 60%;
    margin-bottom: 25px;
    margin-left: -10px;
    padding-left: 25px;
}

.english_student #espotBooks .bookBox .bookInfo .bookTitle {}

.english_student #espotBooks .bookBox .bookInfo p {}

@media (min-width:768px) {
    .english_student #espotBooks .bookBox .bookIMG {
        display: block;
        width: 200px;
    }
    .english_student #espotBooks .bookBox .bookInfo {
        display: block;
        width: 100%;
        margin-left: 0;
        padding-left: 0;
    }
}

@media (min-width:992px) {}

@media (min-width:1200px) {}


/*	회원가입	*/

#register {}

#register .step ul {
    height: 220px;
    margin-bottom: 30px;
}

#register .OnpageRegi {
    min-height: 600px;
}

#FrameAgree,
#FramePrivacy {
    width: 100%;
    border: solid 1px #ccc;
    padding: 15px;
    margin-bottom: 30px;
    height: 200px;
}

.FrameAgreeFull {
    width: 100%;
    border: solid 1px #ccc;
    padding: 15px;
    margin-bottom: 30px;
    height: 500px;
}

#BT_Aggre {
    margin-bottom: 60px;
}

@media (min-width:768px) {
    #register .step ul {
        height: auto;
    }
    #register .OnpageRegi {
        min-height: 450px;
    }
    #FrameAgree,
    #FramePrivacy {
        height: 200px;
    }
}

@media (min-width:992px) {
    #register .step ul {
        height: auto;
    }
    #register .OnpageRegi {
        min-height: 450px;
    }
    #FrameAgree,
    #FramePrivacy {
        height: 200px;
    }
}

@media (min-width:1200px) {
    #register .step ul {
        height: auto;
    }
    #register .OnpageRegi {
        min-height: 450px;
    }
    #FrameAgree,
    #FramePrivacy {
        height: 200px;
    }
}


/*	강사 프로필	*/

#enTeacher #teacherList>.row {
    margin-bottom: 30px;
    position: relative;
}


/*	비즈니스 잉글리쉬 교재 소개	*/

.bookInfo {
    color: #4b525d;
}


/*	화상영어 수강신청	*/

#getClassTypeErrorMessage .alert {
    margin-top: 30px;
}

#selectTeachers {
    margin: 0;
    padding: 0;
    list-style: none;
}

#selectTeachers li {
    width: 22%;
    display: inline-block;
    padding: 5px;
    text-align: center;
    margin: 5px;
    vertical-align: top;
}

#selectTeachers li img {
    margin-bottom: 5px;
    max-height: 100px;
}

#selectTeachers li label {
    font-weight: normal;
    cursor: pointer;
}

#selectTeachers li .checked {
    margin-right: 5px;
}


/*#CourseTable tr.impossible { background-color:rgba(230, 60, 60, 0.11); }*/

#CourseTable tr.possible {
    background-color: rgba(29, 206, 57, 0.18);
}

#CourseTable th,
#CourseTable td {
    text-align: center;
}

.order .PriceText {
    font-size: 1.4em;
    color: #0a6e8e;
    font-weight: bold;
}

@media (min-width:768px) {
    #selectTeachers li {
        width: 18%;
    }
}

@media (min-width:992px) {
    #selectTeachers li {
        width: 15%;
    }
}

@media (min-width:1200px) {
    #selectTeachers li {
        width: 13%;
    }
}


/*	edulive 강의 상세	*/

.edulive {}

.edulive #eTeacherInfo a {
    color: #0080c3;
}

.edulive #eTeacherInfo .media-body {
    padding-left: 20px;
    line-height: 2em;
}

.edulive #eTeacherInfo h4 {
    font-size: 24px;
    margin-bottom: 20px;
}

.edulive #eTeacherInfo h4 small {
    margin-left: 15px;
}

.edulive #eTeacherInfo .media-body i,
.edulive #eTeacherInfo .media-body svg {
    margin-right: 10px;
}

.edulive #eTeacherInfo .teacherSNS,
.edulive #eTeacherInfo .teacherSNS a {
    color: #0080c3;
}

.edulive .well.count {
    color: #4b525d;
}

.edulive .well.count strong {
    margin-left: 15px;
    font-size: 24px;
    font-weight: bold;
}

.edulive .well.count i,
.edulive .well.count svg {
    color: #7ec239;
}

.edulive .eClassDetail img {
    max-width: 100%;
    height: auto;
}

.SNSbuttons .fa-youtube-square {
    color: #F00;
}

.SNSbuttons .fa-facebook-square {
    color: #4267b2;
}

.SNSbuttons .fa-twitter-square {
    color: #1da1f2;
}

.SNSbuttons .fa-instagram {
    color: rgb(38, 38, 38);
}


/*	edulive 강사소개	*/

.edulive #teachers {}

.edulive .teachers {}

.edulive .teachers .teacher {
    margin-bottom: 50px;
    text-align: center;
}

.edulive .teachers .teacher a {
    color: #333;
}

.edulive .teachers .teacher a h4 {
    font-size: 24px;
    font-weight: bold;
}

.edulive .teachers .teacher a h4 small {
    font-size: 18px;
    color: #666;
}

.edulive .teachers .teacher a img {
    max-width: 90%;
    border: solid 3px #ddd;
    padding: 50px 50px 0 50px;
    background-color: #fff;
}

.edulive .teachers .teacher a:hover img {
    border: solid 3px #277ece;
}

.edulive #calendar .fc-view-container {
    background-color: #FFF;
}


/************		강사 상세 질문답변		******************/

.edulive .Teacher_Query {
    min-height: 60px;
    border-top: solid 1px #CCC;
}

.edulive .Teacher_Query .Teacher_Query_list {}

.edulive .Teacher_Query .Teacher_Query_list ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.edulive .Teacher_Query .Teacher_Query_list ul li {
    display: block;
    margin: 3px 0 6px 0;
}

.edulive .Teacher_Query .Teacher_Query_list .board_question {
    padding: 0 100px 15px 0;
}

.edulive .Teacher_Query .Teacher_Query_list .board_question .member {
    display: block;
    margin-bottom: 3px;
    padding: 0 5px;
}

.edulive .Teacher_Query .Teacher_Query_list .board_question .member .q_Name {
    font-weight: bold;
    margin: 0 10px 0 0;
    color: #2caff4;
}

.edulive .Teacher_Query .Teacher_Query_list .board_question .member .q_date {
    color: #fff;
    font-size: 9pt;
}

.edulive .Teacher_Query .Teacher_Query_list .board_question .question {
    background: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    border: 1px solid #d2d6de;
    margin: 5px 0 0 0;
    color: #444;
}

.edulive .Teacher_Query .Teacher_Query_list .board_answer {
    padding: 5px 0 0 100px;
}

.edulive .Teacher_Query .Teacher_Query_list .board_answer .teacjer {
    text-align: right;
    padding: 0 5px;
}

.edulive .Teacher_Query .Teacher_Query_list .board_answer .teacjer .t_Name {
    font-weight: bold;
    margin: 0 10px 0 0;
    color: #2caff4
}

.edulive .Teacher_Query .Teacher_Query_list .board_answer .teacjer .a_date {
    color: #fff;
    font-size: 9pt;
}

.edulive .Teacher_Query .Teacher_Query_list .board_answer .answer {
    background: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    border: 1px solid #f39c12;
    margin: 5px 0 0 0;
    color: #FFF;
}

.edulive .Teacher_Query,
.edulive .Teacher_Query_Write {
    padding: 15px;
}

.border-Horizontal>div+div {
    border-left: 1px solid #e2e4e8;
    padding-left: 20px;
}


/**************************		강의 동영상 재생바		***************************/

.videoPlayStateBar {
    background-color: #e3e3e3;
    width: 100%;
    height: 5px;
    overflow: hidden;
    padding: 0;
    margin: 5px 0 2px 0;
}

.videoPlayStateBar .VideoPlayTimeBar {
    background-color: #F60;
    height: 5px;
    margin: 0;
    padding: 0;
}


/*		Suport		*/

.Suport {
    margin: 20px 0 50px 0;
}

.Suport h4 {
    font-size: 25px;
}

.Suport ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.Suport ol {
    padding: 0;
    margin: 0 0 0 25px;
}

.Suport ul li,
.Suport ol li {
    margin-bottom: 50px;
}

.Suport ul li p,
.Suport ol li p {
    margin-bottom: 10px;
}

.Suport ul li image,
.Suport ol li image {}

.icons div {
    margin: 50px 0;
}


/**********************************
	UI Element
**********************************/


/*	큰 설명글	*/

.explanation {
    font-size: 12pt;
    margin-bottom: 30px;
}


/*	폼그룸 하위 라벨	*/

form label+label {
    margin-left: 15px;
}


/*	well 안에 form	*/

.well form {
    margin: 0;
}


/*	Alert */

.alert.alert-danger,
.alert.alert-info,
.alert.alert-success {
    position: relative;
    padding: 70px 15px 15px 15px;
    min-height: 100px;
}

.alert.alert-danger:before {
    position: absolute;
    left: 15px;
    top: 5px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f071";
    font-size: 36px;
    color: #EE8588;
}

.alert.alert-info:before {
    position: absolute;
    left: 15px;
    top: 5px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f05a";
    font-size: 36px;
    color: #7ecaf2;
}

.alert.alert-success:before {
    position: absolute;
    left: 15px;
    top: 5px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f058";
    font-size: 36px;
    color: #8abd8b;
}

@media (min-width:768px) {
    .alert.alert-danger,
    .alert.alert-info,
    .alert.alert-success {
        padding: 15px 15px 15px 100px;
        min-height: 80px;
    }
    .alert.alert-danger:before {
        position: absolute;
        left: 20px;
        top: 5px;
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        content: "\f071";
        font-size: 48px;
        color: #EE8588;
    }
    .alert.alert-info:before {
        position: absolute;
        left: 20px;
        top: 5px;
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        content: "\f05a";
        font-size: 48px;
        color: #7ecaf2;
    }
    .alert.alert-success:before {
        position: absolute;
        left: 20px;
        top: 5px;
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        content: "\f058";
        font-size: 48px;
        color: #8abd8b;
    }
}


/* h2 아이콘 <i class="fas fa-file-download"></i>	*/

h2 {
    position: relative;
}

h2 svg {
    position: absolute;
    top: -50%;
    right: 0;
    color: rgba(126, 202, 242, 0.5);
}


/*	Step	*/

.step {
    margin-bottom: 30px;
}

.step h2 {}

.step ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.step ul li {
    display: inline-block;
    margin-right: -4px;
    vertical-align: top;
    border: solid 1px #ddd;
    background-color: #f4f5f7;
    padding: 30px;
    position: relative;
    height: 100%;
}

.step ul li h3 {
    margin: 0;
    color: #01afe8;
    font-weight: bold;
    display: inline-block;
}

.step ul li h3 small {
    color: #01afe8;
    font-size: 85%;
    font-weight: 600;
    color: #01afe8;
    margin-left: 15px;
}

.step ul li h4 {
    margin: 0 0 0 15px;
    display: inline-block;
}

.step ul li p {
    margin: 15px 0 0 0;
}

.step ul li .arrow {
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 15px solid #f4f5f7;
    border-right: 0;
}

.step ul li .arrow.arrow-color {
    right: -500%;
    top: 32px;
    position: absolute;
    z-index: 800;
}

.step ul li .arrow.arrow-border {
    right: -500%;
    top: 32px;
    border-left-color: #ddd;
    position: absolute;
    z-index: 799;
}

.step ul li.active {
    background-color: #e4e5e6;
}

.step ul li.active .arrow {
    border-left: 15px solid #e4e5e6;
}

.step ul li.active .arrow.arrow-color {}

.step ul li.active .arrow.arrow-border {
    border-left-color: #e4e5e6;
}

.step.step2 ul li {
    width: 100%;
}

.step.step3 ul li {
    width: 100%;
}

.step.step4 ul li {
    width: 100%;
}

.step.step5 ul li {
    width: 100%;
}

#levelteststeps ul li,

/*	레벨테스트	*/

#teacherSteps ul li {
    min-height: 0px;
}


/*	강사 선발과정 */

#eduliveClassSteps ul li {
    min-height: 0px;
}


/*	에듀라이브 수강절차 안내 	*/

@media (min-width:768px) {
    .step ul li h3 {
        margin: 0;
        color: #01afe8;
        font-weight: bold;
        display: block;
    }
    .step ul li h4 {
        margin: 20px 0 0 0;
        display: block;
    }
    .step ul li .arrow.arrow-color {
        right: -15px;
    }
    .step ul li .arrow.arrow-border {
        right: -17px;
    }
    .step.step2 ul li {
        width: 50%;
    }
    .step.step3 ul li {
        width: 33.33%;
    }
    .step.step4 ul li {
        width: 25%;
    }
    .step.step5 ul li {
        width: 20%;
    }
    #teacherSteps ul li {
        min-height: 260px;
    }
    /*	강사 선발과정 */
    #levelteststeps ul li {
        min-height: 325px;
    }
    /*	레벨테스트 */
    #eduliveClassSteps ul li {
        min-height: 472px;
    }
    /*	에듀라이브 수강절차 안내 	*/
}

@media (min-width:992px) {
    .step.step2 ul li {
        width: 50%;
    }
    .step.step3 ul li {
        width: 33.33%;
    }
    .step.step4 ul li {
        width: 25%;
    }
    .step.step5 ul li {
        width: 20%;
    }
    #teacherSteps ul li {
        min-height: 240px;
    }
    /*	강사 선발과정 */
    #levelteststeps ul li {
        min-height: 260px;
    }
    /*	레벨테스트 */
    #eduliveClassSteps ul li {
        min-height: 350px;
    }
    /*	에듀라이브 수강절차 안내 	*/
}

@media (min-width:1200px) {
    #teacherSteps ul li {
        min-height: 240px;
    }
    /*	강사 선발과정 */
    #levelteststeps ul li {
        min-height: 240px;
    }
    /*	레벨테스트 */
    #eduliveClassSteps ul li {
        min-height: 322px;
    }
    /*	에듀라이브 수강절차 안내 	*/
}


/*	priceTable 	*/

.tablePrice {
    border: none;
    font-size: 9pt;
    margin-bottom: 50px;
}

.tablePrice thead {
    background-color: #FFF;
}

.tablePrice thead th {
    padding: 15px 0;
    font-size: 2em;
    color: #333;
}

.tablePrice thead th.student {
    border-bottom: solid 5px #0C6;
}

.tablePrice thead th.adult {
    border-bottom: solid 5px #01afe8
}

.tablePrice thead td {
    font-weight: 400;
}

.tablePrice tbody {
    border-top: solid 3px #ddd;
}

.tablePrice tbody tr {}

.tablePrice tbody th {}

.tablePrice tbody td {
    border-left: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
    font-weight: 400;
}

.tablePrice tbody th,
.tablePrice tbody td {
    padding: 15px 5px;
}

.tablePrice thead th,
.tablePrice thead td,
.tablePrice tbody th,
.tablePrice tbody td,
.tablePrice tfoot td,
.tablePrice tfoot th {
    text-align: center;
}

.tablePrice tfoot {
    border-top: solid 3px #ddd;
}

.tablePrice tfoot tr {}

.tablePrice tfoot th {}

.tablePrice tfoot td {}

.tablePrice tfoot th,
.tablePrice tfoot td {
    padding: 15px 5px;
}

.tablePrice tbody .won {
    font-weight: 600;
    color: #333;
}

.tablePrice tbody .fa-check {
    font-size: 1.2em;
    color: #01afe8;
}

.tablePrice tbody .fa-times {
    font-size: 1.2em;
    color: #999;
}

.tablePrice tfoot .buttonRow {
    display: none;
}

.tablePrice tfoot .won {
    color: #01afe8;
    font-weight: 600;
    font-size: 1.3em;
}


/*	정보 Table 	*/

.table_info {
    font-size: 9pt;
    margin-bottom: 50px;
}

.table_info th,
.table_info td {
    padding: 15px 10px !important;
}

@media (min-width:768px) {
    .tablePrice {
        font-size: 10pt;
    }
    .tablePrice tfoot .buttonRow {
        display: table-row;
    }
    .tablePrice tfoot td .btn {
        padding: 5px;
        font-size: 14px;
        font-weight: 600;
        line-height: 1.3333333;
        border-radius: 3px;
    }
    .table_info {
        font-size: 10pt;
    }
}

@media (min-width:992px) {
    .tablePrice {
        font-size: 11pt;
    }
    .tablePrice tfoot td .btn {
        padding: 10px 16px;
        font-size: 18px;
        border-radius: 6px;
    }
    .table_info {
        font-size: 11pt;
    }
}

@media (min-width:1200px) {
    .tablePrice {
        font-size: 12pt;
    }
    .table_info {
        font-size: 12pt;
    }
}


/* 버튼 xs 사이즈에서는 블럭	*/

.btn-auto {
    display: block;
    width: 100%;
}

@media (min-width:768px) {
    .btn-auto {
        display: inline-block;
        width: auto;
    }
}


/*	list-check	*/

.list-check {
    list-style: none;
    font-size: 12pt;
}

.list-check li:before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: "\f00c";
    margin-left: -30px;
    width: 29px;
    display: inline-block;
    color: #7ebd38;
}


/*	TapNav	*/

.TapNav {
    margin-top: 30px;
    background-color: #FFFFFFF01;
}

.TapNav .nav-tabs>li>a {
    position: relative;
    display: block;
    padding: 13px 15px;
    margin-right: 2px;
    line-height: 1.6;
    border: 0 solid transparent;
    border-radius: 0;
    color: #000;
    font-size: 14px;
    -webkit-transition: 0s;
    -o-transition: 0s;
    transition: 0s;
}

.TapNav .nav-tabs>li.active>a {
    padding-bottom: 0;
}

.TapNav .nav-tabs>li>a:hover {
    background-color: transparent;
}

.TapNav .nav-tabs>li.active>a,
.TapNav .nav-tabs>li.active>a:hover,
.TapNav .nav-tabs>li.active>a:focus {
    color: #01aee8;
    background-color: transparent;
    border: 0 solid #ddd;
    border-bottom-color: transparent;
    cursor: default;
    font-weight: 600;
}

.TapNav .nav-tabs>li.active>a:after {
    content: '';
    height: 3px;
    background-color: #14b5e9;
    display: block;
    margin-top: 10px;
}

.tab-content {
    margin-top: 0px;
}


/*	SubTapNav	*/

.sub_tab {
    margin-top: 5px;
    background-color: #FFFFFFF01;
}

.sub_tab .nav-tabs>li>a {
    position: relative;
    display: block;
    padding: 13px 15px;
    margin-right: 2px;
    line-height: 1.6;
    border: 0 solid transparent;
    border-radius: 0;
    color: #000;
    font-size: 14px;
    -webkit-transition: 0s;
    -o-transition: 0s;
    transition: 0s;
}

.sub_tab .nav-tabs>li.active>a {
    padding-bottom: 0;
}

.sub_tab .nav-tabs>li>a:hover {
    background-color: transparent;
}

.sub_tab .nav-tabs>li.active>a,
.sub_tab .nav-tabs>li.active>a:hover,
.sub_tab .nav-tabs>li.active>a:focus {
    color: #01aee8;
    background-color: transparent;
    border: 0 solid #ddd;
    border-bottom-color: transparent;
    cursor: default;
    font-weight: 600;
}

.sub_tab .nav-tabs>li.active>a:after {
    content: '';
    height: 3px;
    background-color: #14b5e9;
    display: block;
    margin-top: 10px;
}

.sub_tab .container {
    padding-left: 25px;
    padding-right: 25px;
}


/*	상품 리스트	*/

.PorductList {
    margin-bottom: 30px;
}

.PorductList .row {}

.PorductList .ProductHeader {}

.PorductList .ProductBody {}

@media (min-width:768px) {
    .PorductList .row {}
    .PorductList .ProductHeader {
        border-right: solid 1px #ccc;
    }
    .PorductList .ProductHeader h4 {
        margin: 30px 0;
    }
    .PorductList .ProductBody {
        padding-top: 15px;
    }
    .PorductList .ProductBody a {}
}


/* 2023-03-31  */

.PorductList a.btn.btn-primary.btn-auto.btn-lg.NewOrder {
    width: 400px;
}

h2.ProductTitle {
    text-align: center;
}

.PorductList .row.item {
    display: flex;
    justify-content: center;
}

.row.Addh {
    text-align: center;
}

.row.PorductList.Add {
    display: flex;
    justify-content: center;
}

.col-sm-12.ADDBT {
    display: flex;
    justify-content: center;
}

.PorductList .row.Pic {
    display: flex;
    justify-content: center;
}

.PorductList .row.AddPic {
    display: flex;
    justify-content: center;
}

.PorductList a.btn.btn-primary.btn-auto.btn-lg.AddBT {
    width: 400px;
}

@media (min-width:992px) {}

@media (min-width:1200px) {}


/*	특징	feature	col 하단에 div 사용하면 않됨	*/

.feature {
    margin-top: 50px;
}

.feature>div+div {
    border-left: 1px solid #e2e4e8;
    padding-left: 20px;
    padding-top: 30px;
}

.feature>div h4 {
    text-align: center;
}

.feature>div h4 img {
    display: block;
}

.feature>div h4 img,
.feature>div h4 svg,
.feature>div h4 .svg-inline--fa {
    font-size: 60px !important;
    color: #0080c3;
    margin-bottom: 30px;
}

.feature>div h4 {}

.feature>div p {
    color: #4b525d;
}

.feature .featureText {
    font-size: 18px;
    padding: 25px;
}

.feature .featureText p {
    margin-bottom: 8px;
}

.feature .featureImg {
    margin-bottom: 50px;
}

.feature .featureText.orange i,
.feature .featureText.orange svg,
.feature .featureText.orange strong,
.feature .featureText.orange q strong {
    color: #f39b2a;
}

.feature .featureText.orange q strong {
    color: #fff;
    background: #f39b2a;
}

.feature .featureText.blue i,
.feature .featureText.blue svg,
.feature .featureText.blue strong,
.feature .featureText.blue q strong {
    color: #26a6de;
}

.feature .featureText.blue q strong {
    color: #fff;
    background: #26a6de;
}

.feature+.row {
    margin-top: 50px;
}

@media (min-width:768px) {
    .feature>div+div {
        border-left: 1px solid #e2e4e8;
        padding-left: 20px;
        padding-top: 0;
    }
    .feature>div h4 {
        text-align: left;
    }
    .feature .featureText {
        min-height: 250px;
    }
}


/*	classflow	흐름	*/

.classflow {
    margin-top: 50px;
    padding: 0;
    list-style: none;
}

.classflow li {
    margin-bottom: 20px;
}

.classflow li h4 {
    display: block;
    width: 100%;
    padding-top: 10px;
    margin-bottom: 15px;
}

.classflow li h4 small {
    display: inline-block;
    margin-left: 20px;
    padding-top: 15px;
}

.classflow li>div {
    display: block;
    border-left: none;
    border-top: dotted 2px #0080c3;
    padding-bottom: 30px;
    padding-top: 20px;
}

.classflow .classflowsub {}

.classflow .classflowsub li {
    margin-bottom: 15px;
}

.classflow .classflowsub li h5 {
    margin-bottom: 8px;
}

@media (min-width:768px) {
    .classflow li h4 {
        display: table-cell;
        width: 150px;
        padding-top: 10px;
    }
    .classflow li h4 small {
        display: block;
        padding-top: 15px;
        margin-left: 0;
    }
    .classflow li>div {
        display: table-cell;
        border-left: dotted 2px #0080c3;
        border-top: none;
        padding-bottom: 30px;
        padding-top: 10px;
        padding-left: 40px;
    }
    .classflow li>div>ul,
    .classflow li>div>ol {
        padding: 0;
    }
}


/*	CircleList	*/

.CircleList {
    margin-bottom: 50px;
}

.CircleList ul,
.CircleList ol {
    list-style: none;
    text-align: center;
    padding: 0;
}

.CircleList ul li,
.CircleList ol li {
    display: inline-block;
    height: 100px;
    width: 100px;
    border: solid 15px #01afe8;
    border-radius: 50%;
    padding: 10px;
    margin: 0 -9px;
}


/*	border right, left, top, bottom	*/

.border-right {
    border-right: 1px solid #efefef;
}

.border-left {
    border-left: 1px solid #efefef;
}

.border-top {
    border-top: 1px solid #efefef;
}

.border-bottom {
    border-bottom: 1px solid #efefef;
}


/*	padding box	*/

.padingBox3020 {
    padding: 30px 20px;
}


/*	debulULList	*/

.debulULList>ul {
    padding: 0;
    list-style: none;
}

.debulULList>ul>li {
    margin-bottom: 30px;
}

.debulULList>ul>li h4 {
    margin-bottom: 15px;
}

.debulULList>ul>li>ul {
    padding-left: 20px;
}


/*	verticalDotlineList	*/

.verticalDotlineList {
    margin-bottom: 50px;
    padding: 0;
    border-left: dotted 4px #d2d2d2;
}

.verticalDotlineList li {
    margin-left: 7px;
    padding-left: 10px;
}


/**********************************
	학습 캘린더
**********************************/

.Calendar {}

.Calendar .CalendarBox {
    margin-bottom: 50px;
}

.Calendar .CalendarBox .Calendar_Toolbar {
    text-align: center;
    margin: 10px 0 15px 0;
}

.Calendar .CalendarBox .Calendar_Toolbar:before,
.Calendar .CalendarBox .Calendar_Toolbar:after {
    display: table;
    content: " ";
}

.Calendar .CalendarBox .Calendar_Toolbar:after {
    clear: both;
}

.Calendar .CalendarBox .Calendar_Toolbar .Calendar_Toolbar_left i,
.Calendar .CalendarBox .Calendar_Toolbar .Calendar_Toolbar_left button,
.Calendar .CalendarBox .Calendar_Toolbar .Calendar_Toolbar_right button {
    font-size: 9pt !important;
}

.Calendar .CalendarBox .Calendar_Toolbar .Calendar_Toolbar_center h3 {
    font-size: 11pt !important;
}

.Calendar .CalendarBox .Calendar_Toolbar .Calendar_Toolbar_left {
    float: left;
}

.Calendar .CalendarBox .Calendar_Toolbar .Calendar_Toolbar_center {
    display: inline;
}

.Calendar .CalendarBox .Calendar_Toolbar .Calendar_Toolbar_center h3 {
    display: inline;
    font-weight: bold;
}

.Calendar .CalendarBox .Calendar_Toolbar .Calendar_Toolbar_right {
    float: right;
}

.Calendar .CalendarBox .CalendarBody {
    font-size: 8pt;
}

.Calendar .CalendarBox .CalendarBody .CalendarTable {
    border-right: 1px solid #dbdbdb;
    border-bottom: 1px solid #dbdbdb;
}

.Calendar .CalendarBox .CalendarBody .CalendarTable thead {}

.Calendar .CalendarBox .CalendarBody .CalendarTable thead tr {}

.Calendar .CalendarBox .CalendarBody .CalendarTable thead tr th {
    text-align: center;
    background-color: #fafafa;
}

.Calendar .CalendarBox .CalendarBody .CalendarTable thead tr th,
.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr td {
    border-top: 1px solid #dbdbdb;
    border-right: none;
    border-bottom: none;
    border-left: 1px solid #dbdbdb;
}

.Calendar .CalendarBox .CalendarBody .CalendarTable tbody {}

.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr {}

.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr td {
    position: relative;
    background-clip: content-box;
    vertical-align: top;
    height: 100px;
    padding-top: 20px;
}

.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr td.per,
.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr td.next {
    background-color: #F8F8F8;
    border-left: 1px solid #dbdbdb;
    border-bottom: 1px solid #dbdbdb;
}

.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr td.per .Calendar_day,
.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr td.next .Calendar_day {
    color: #C8C8C8;
}

.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr td.now {
    background-color: #FFF;
}

.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr td.holiday {
    background-color: #ffe9e9;
}

.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr td.today {
    background-color: #fcf8e3;
}

.Calendar .CalendarBox .CalendarBody .CalendarTable tbody tr td .Calendar_day {
    position: absolute;
    top: 0px;
    right: 3px;
    font-size: 9pt;
}

.Calendar .Calendar_holiday_text {
    position: absolute;
    top: 24px;
    left: 3px;
    font-size: 8pt;
    line-height: 1.2em;
    color: #000;
}

.Calendar .Calendar_day_content {
    position: relative;
    padding: 5px;
    min-height: 100px;
}

.Calendar .Calendar_day_content a {
    display: block;
    cursor: pointer;
    margin: 3px 2px;
    padding: 1px 5px;
    border-radius: 5px;
    line-height: 1.6em;
}

.Calendar .Calendar_day_content a .time {
    font-weight: bold;
    padding-right: 5px;
}

.Calendar .Calendar_day_content a .title {}

.Calendar .Calendar_day_content .event {}

.Calendar .Calendar_day_content .event.green {
    background-color: #00a65a !important;
    color: #fff;
}

.Calendar .Calendar_day_content .event.yellow {
    background-color: #f39c12 !important;
    color: #fff;
}

.Calendar .Calendar_day_content .event.aqua {
    background-color: #00c0ef !important;
    color: #fff;
}

.Calendar .Calendar_day_content .event.blue {
    background-color: #3c8dbc !important;
    color: #fff;
}

.Calendar .Calendar_day_content .event.red {
    background-color: #dd4b39 !important;
    color: #fff;
}

.Calendar .Calendar_day_content .event.gray {
    background-color: #9c9c9c !important;
    color: #fff;
}

.Calendar .Calendar_day_content .event.purple {
    background-color: #663399 !important;
    color: #fff;
}


/**********************************
	학습 캘린더
**********************************/

#EvalM {
    padding: 15px;
}

#em_Date,
#em_T_Name {
    font-size: 14pt;
}

#em_Date {
    font-weight: bold;
}

#em_T_Name {
    text-align: right;
}

#em_Table {
    border-style: none;
    margin-bottom: 50px;
}

#em_Table tbody th,
#em_Table tbody td {
    border: none;
    font-size: 14px;
}

#em_Table tbody td {
    color: #4dc9f6;
}

#MonthChart {
    margin-bottom: 50px;
}

#EvalM .em_title {
    font-size: 14pt;
    font-weight: bold;
}

#em_Comment {
    margin: 5px 5px 30px 30px;
    padding: 15px;
    border: solid 1px #e3e3e3;
    border-radius: 10px;
}


/**********************************
	레벨 테스트
**********************************/

#LevettestReport {}

#LevettestReport .testHeader,
#LevettestReport .testInfo,
#LevettestReport .testTable,
#LevettestReport .testComment {
    font-size: 12pt;
}

#LevettestReport .testHeader,
#LevettestReport .testInfo,
#LevettestReport .testTable {
    margin-bottom: 30px;
}

#LevettestReport .testComment {
    margin-bottom: 80px;
}

#LevettestReport .testHeader small {
    font-size: 9px;
}

#LevettestReport .testInfo {
    font-size: 12pt;
    color: #404040;
}

#LevettestReport .testInfo p {
    margin-bottom: 6px !important;
}

#LevettestReport .testInfo b {
    font-size: 12pt;
    color: #404040 !important;
}

#LevettestReport #MyLevel {
    text-align: center;
    vertical-align: bottom;
    font: bold 80pt Tahoma, sans-serif;
    color: #06b7f0;
}

#LevettestReport #MyLevel small {
    font-size: 12pt;
    color: #404040;
    margin-left: -30px;
}

#LevettestReport .testComment .teacherComment {
    position: relative;
    padding-left: 150px;
}

#LevettestReport .testComment .teacherComment .Teacher_box {
    display: block;
    position: absolute;
    width: 140px;
    height: 140px;
    left: 10px;
    top: 10px;
    overflow: hidden;
}

#LevettestReport .testComment .teacherComment .Teacher_box .Teacher_Photo {}

#LevettestReport .testComment .teacherComment .Teacher_box .Teacher_Photo a {
    border: solid 3px #06b7f0;
    display: block;
    border-radius: 50%;
    width: 140px;
    height: 140px;
    overflow: hidden;
}

#LevettestReport .testComment .teacherComment .Teacher_box .Teacher_Photo a img {
    width: 100%;
}

#LevelTestMovie h5 {
    font-size: 12pt;
    font-weight: bold;
    margin: 15px 0 10px;
}

@media (min-width: 576px) {
    .levelSteps .ls_header {
        padding: 25px;
    }
    .levelSteps .ls_body {
        padding: 25px;
    }
}

@media (min-width: 768px) {
    #LevettestReport .testComment .teacherComment {
        position: relative;
        padding-left: 300px;
    }
    #LevettestReport .testComment .teacherComment .Teacher_box {
        display: block;
        position: absolute;
        width: 200px;
        height: 200px;
        left: 10px;
        top: 10px;
        overflow: hidden;
    }
    #LevettestReport .testComment .teacherComment .Teacher_box .Teacher_Photo {}
    #LevettestReport .testComment .teacherComment .Teacher_box .Teacher_Photo a {
        border: solid 3px #319fac;
        display: block;
        border-radius: 50%;
        width: 200px;
        height: 200px;
        overflow: hidden;
    }
}

@media (min-width: 992px) {}

@media (min-width: 1200px) {}


/**********************************
	회사소개
**********************************/

.subpages.company {}

.subpages.company .outline {
    padding: 70px 0;
    background: url(/images/company/content_bg.png) no-repeat center center;
    color: #fff;
}

.subpages.company section img {
    max-width: 90%;
    height: auto;
}


/**********************************
	채용전형
**********************************/

.subpages.careers section.page-header h1 {
    margin-bottom: 70px;
}

.subpages.careers section.page-header {
    color: #fff;
    line-height: 2em;
}

.subpages.careers section.recruit {
    padding: 70px 0;
    background: url(/images/company/careers.png) no-repeat center center;
    color: #fff;
}

@media (min-width:768px) {}

@media (min-width:992px) {}

@media (min-width:1200px) {}


/**********************************
	영상 플레이어
**********************************/


/**************************************
	MoviePlayer
***************************************/

#MoviePlayer {
    background: #000;
    display: block;
    border: 1px solid #e3e3e3;
    width: 100%;
    min-height: 200px;
    position: relative;
}

#MoviePlayer video {
    width: 100%;
    height: auto;
}

#MoviePlayer #palyICON {
    padding: 200px 0 0 50%;
}

#MoviePlayer #palyICON i,
#MoviePlayer #palyICON svg {
    color: aliceblue;
    width: 90px;
    height: 90px;
    font-size: 90px;
    margin: -45px 0 0 -45px;
}

@media (min-width: 768px) {
    #MoviePlayer {
        min-height: 300px;
    }
}

@media (min-width: 992px) {
    #MoviePlayer {
        min-height: 400px;
    }
}

@media (min-width: 1200px) {
    #MoviePlayer {
        min-height: 400px;
    }
}

#yPlayerBG {
    position: fixed;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    z-index: 5000;
    background-color: #000;
    opacity: 0.5;
    filter: Alpha(Opacity=50);
    display: none;
}

#yPlayer {
    position: fixed;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    z-index: 5001;
    display: none;
}

#yPlayer #ypWarp {
    width: 680px;
    margin: 200px auto 0 auto;
    padding: 20px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.5);
    background: #000;
    border-radius: 6px;
    overflow: visible;
}

#yPlayer iframe {
    width: 640px;
    height: 400px;
}

#ypFooter {
    text-align: right;
    padding: 5px 0 0 0;
}

#ypHeader {
    position: relative;
}

#ypHeader h4 {
    color: #FFF;
    margin-bottom: 10px;
}

#ypClose {
    margin-top: -2px;
    background: #000;
    color: #FFF;
    opacity: 0.5;
    filter: Alpha(Opacity=50);
    font-weight: bold;
    position: absolute;
    right: 0;
    top: 0;
}