/*로그인*/
.loginWrap {width: 100vw; height: 100vh; background: #ecf4ff; position: relative}
.loginWrap .logo {margin: 0 auto 50px; display: block}
.loginWrap .loginBox {width: 1100px; height: 710px; margin: 0 auto; background: #fff; box-shadow: 8px 8px 25px rgba(0,0,0,0.2); position: absolute;
    top: calc((100vh - 710px) / 2); left: calc((100vw - 1100px) / 2)}
.loginWrap .loginBox .leftArea, .loginWrap .loginBox .rightArea {width: 50%; display: inline-block; float: left; height: 100%}
.loginWrap .loginBox .rightArea {padding: 80px 100px; box-sizing: border-box}
.loginWrap .loginBox .rightArea .inputBox {border-color: #999; border-radius: 5px; padding: 10px 10px 7px; width: 100%; height: 46px;
    box-sizing: border-box; font-size: 15px; color: #494949}
.loginWrap .loginBox .rightArea, .loginWrap .loginBox .rightArea .btn.findType label {font-size: 14px}
.loginWrap .loginBox .rightArea .btn.fullBtn {height: 46px; font-family: "GmarketSansM"; padding-top: 7px}
.loginWrap .loginBox .rightArea label input {vertical-align: text-top}
.loginWrap .loginBox .rightArea .loginCsWrap {font-weight: bold; margin-top: 30px}
.loginWrap .loginBox .rightArea .loginCsWrap p b {font-family: "GmarketSansB"}
.loginWrap .loginBox .rightArea .joinGoBtn a {text-align: center; font-size: 16px; line-height: 36px}

/*메인*/
section {padding: 15px 0}
.slide {margin-top: 20px}
.slide .slideItem {width: 257px !important; border-radius: 5px; border: 1px solid #494949; box-sizing: border-box; margin-left: 43px; transition: all ease-in-out 0.3s}
.slide .slideItem .imgBox {width: 100%; height: 160px}
.slide .slideItem .imgBox img {width: 100%; height: 100%; border-top-right-radius: 5px; border-top-left-radius: 5px}
.slide .slideItem .textBox {font-family: "GmarketSansM"; padding: 26px 15px; box-sizing: border-box; width: 100%; height: 90px; line-height: 22px; font-weight: bold}
.slide .slideItem .textBox p {-webkit-line-clamp: 2; height: 45px}

section:first-of-type {padding: 35px 0 15px}
section:first-of-type .slide button.slick-arrow {background: url("../Images/triangle_Y.png") no-repeat !important; width: 15px; height: 26px}
.slick-prev:before, .slick-next:before {content: ''!important}
.slide button.slick-arrow.slick-next{transform: rotate(180deg); top: -73px}
.slide button.slick-arrow {top: -60px}
.slide button.slick-arrow.slick-prev {right: 25px; left: auto}
.slide button.slick-arrow.slick-next {right: 0}
section:nth-of-type(2) .slide button.slick-arrow {background: url("../Images/triangle_B.png") no-repeat !important; width: 15px; height: 26px}
.slide .slideItem.slick-current {transform: scale(1.08)}
.slide .slick-list {padding: 10px 0}

section:nth-of-type(3) {background: #ecf4ff; margin-top: 35px; padding: 30px 0 60px}
.boardWrap {height: auto; overflow: hidden}
.boardWrap .titleArea {width: 100%; height: 94px; position: relative}
.boardWrap .moreBtn {font-weight: bold; right: 0; position: absolute; bottom: 10px}
.moreBtn span {font-size: 30px; vertical-align: sub; font-weight: bold}
.boardWrap .leftArea, .boardWrap .rightArea {width:536px}
.moreBtn.yType {color: #f9b232}
.moreBtn.bType {color: #0e71b8}
.boardWrap .boardArea {padding-left: 50px; width: 100%; box-sizing: border-box; padding-top: 30px}
.boardWrap .boardArea .boardItem {padding: 15px 0 8px}
.boardWrap .boardArea .boardItem > div {width: 75%; display: inline-block; font-weight: bold}
.boardWrap .boardArea .boardItem > span, .event .eventSlideItem span {font-size: 14px; float: right; color: #a7a7a7; font-weight: bold}

section:nth-of-type(4) {background: #174a64; padding: 50px 0}
.event {position: absolute; top: -30px; width: 1200px; height: 60px; box-sizing: border-box; background: url("../Images/main_eventSlide_bg.png") no-repeat;
    line-height: 62px; font-weight: bold; padding: 0 30px}
.event > span {font-size: 20px; color: #0e71b8; font-family: "GmarketSansM"; float: left; line-height: 65px}
.event .eventSlide {display: inline-block; width: 80%; margin: 0 20px}
.event .eventSlideItem {transition: all ease-in-out 0.3s; height: 60px !important; box-sizing: border-box}
.event .moreBtn {float: right; line-height: 62px}
.cardNewsWrap {height: 185px; box-sizing: border-box}
.cardNewsWrap .leftArea {width: 200px; height: 185px; margin-top: 20px}
.cardNewsWrap .moreBtn {display: inline-block; width: 100px; margin-top: 30px; margin-left: 50px}
.cardNewsWrap .rightArea {width: 1000px; height: 185px; box-sizing: border-box; padding: 35px 0 0 120px}
.cardNewsWrap .cardNewsItem {width: 400px; float: left; margin: 15px 20px}
.cardNewsWrap .cardNewsItem img {width: 53px; height: 53px}
.cardNewsWrap .cardNewsItem .cardNewsText {display: inline-block; color: #fff; padding: 5px 20px; font-weight: bold; width: 340px; box-sizing: border-box}
.cardNewsWrap .cardNewsItem .cardNewsText span {font-size: 14px; color: #a7a7a7}

section:nth-of-type(5) {background: url("../Images/certification_bg.jpg") no-repeat; height: 450px; box-sizing: border-box; padding: 40px 0 20px}
.certificationSlideWrap .bottomCertList {width: 90%; margin: 0 auto}
.certificationSlideWrap .bottomCertList ul li {display: inline-block; width: 140px; height: auto; overflow: hidden; margin: 20px; cursor: pointer}
.certificationSlideWrap .bottomCertList ul li img {width: 100%; box-shadow: 7px 8px 11px 5px rgba(0, 0, 0, 0.2 ); box-sizing: border-box}
.certificationSlideWrap .bottomCertList ul li .bottomCertTxt {padding: 25px 0; line-height: 20px; font-size: 14px}
.certificationSlideWrap .bottomCertList  button.slick-arrow.slick-next{transform: rotate(180deg)}
.certificationSlideWrap button.slick-arrow {background: url("../Images/triangle_Y.png") no-repeat !important; width: 15px; height: 26px; top: 125px}

/*Q&A팝업*/
.etcQA {position: fixed; width: 50%; height: 748px; min-height: 600px; z-index: 5000; background: #fff; top: calc((100vh - 748px) / 2); left: calc((100vw - 50%) / 2);
    min-width: 800px; display: none; border-radius: 5px}
.etcQA .contents {box-sizing: border-box; height: 675px; overflow-y: auto; width: 100%}
.etcQA .contents .qaSet > div {background: #f5f5f5; border-radius: 10px; padding: 10px 20px; line-height: 24px; font-size: 14px; font-family: "GmarketSansM"}
.qaSet {margin: 20px 0; font-size: 15px; font-family: "GmarketSansM"}
.qaSet:nth-of-type(1) {margin-top: 0}



/*회원가입*/
.areaBox > .wrap {width: 800px;  height: 600px; position: absolute; top: calc((100vh - 750px) / 2); left: calc((100vw - 800px) / 2)}
.register, .findWrap {width: 100%; margin: 0 auto; background: #fff; border-radius: 5px; box-shadow: 1px 1px 5px 2px rgba(0,0,0,0.2)}
.register .textareaBox { margin: 5px 0; height: 88px; padding: 20px; font-size: 14px; font-weight: bold}
.contentsWrap {padding: 20px 30px}
.wrap.join2 > div {float: left}
.wrap.join2 > div {border: 1px solid #ddd; height: 250px; width: 298px; text-align: center; position: relative; margin: 5px 19px 0 0}
.wrap.join2 > div:nth-child(3) {margin: 5px 0 0 0}
.certBox > div {box-sizing: border-box; padding: 15px 0; cursor: pointer}
.certBox b {display: block; margin-top: 10px}
.certBox p {font-size: 13px; text-align: left; line-height: 18px; padding: 0 5px; font-family: "NanumSquareRR"}
.certBox a img {vertical-align: sub}
.certAuth {padding-bottom: 10px !important;}
.juminBox {line-height: 48px !important; text-align: center !important;}
.juminBox input {width: 64px; box-sizing: border-box; padding: 3px; height: 24px; font-size: 12px; text-align: center}
.certBox .descriptionBox {position: absolute; bottom: 5px; padding: 5px; cursor: auto}
.agreeBtn {vertical-align: middle; width: 15px; height: 15px}
.wrap.registerType {width: 1000px; top: calc((100vh - 890px) / 2); left: calc((100vw - 1000px) / 2)}
.wrap.memberInfoType {top: calc((100vh - 850px) / 2)}
table.memberInfoType tr td {text-align: left !important}

.area {background: #ecf4ff; width: 100%; height: auto; overflow: hidden; min-height: 100vh}
.areaBox {position: relative; width: 100%; height: 100%}
.area.ConfirmStepType .memberInfoType {top: calc((100vh - 700px) / 2)}
.area.ConfirmStepType .registerForm > div {height: 335px}

/*아이디비번찾기*/
.wrap.findType {top: calc((100vh - 750px) / 2)}
.findBoxWrap {width: 100%; height: auto; overflow: hidden; box-sizing: border-box; padding: 30px}
.findArea {padding: 50px; min-height: 600px}
.findTab {margin: 20px auto 0; text-align: center; width: 480px; font-size: 14px; font-weight: 500; height: 46px; clear: both}
.findTab div {display: inline-block; line-height: 45px; width: 50%; box-sizing: border-box; border: 1px solid #D1D1D1; float: left; background: #fafafa}
.findTab div a:hover {text-decoration: none; color: #444}
.findTab div:nth-child(1) { border-right: 0}
.findTab div.active {background: #0e71b8; color: #fff; font-weight: bold; border: 1px solid #0e71b8}
.findTab div.active a {color: #fff}
.findForm {width: 100%; margin: 0 auto; height: 250px}
.findForm form{clear: none !important;}
.findForm div {display: inline-block; width: 250px; padding: 25px 50px}
.findForm form:nth-child(odd) .findBox {float: left; background: url("../Images/findTitle_bg1.png") no-repeat; background-size: 10%; background-position: 50px 14px}
.findForm form:nth-child(even) .findBox {float: right; background: url("../Images/findTitle_bg2.png") no-repeat; background-size: 9%; background-position: 50px 17px}
.findForm div .bTit {font-size: 16px; font-weight: bold; color: #0e71b8; margin-bottom: 15px; position: relative; left: 35px}
.findForm .findBtn {color: #0e71b8; border-color: #0e71b8 !important; background: #fff; font-weight: bold; line-height: 24px}
.findForm .findBtn:hover {background: #0e71b8; color: #fff}
.idPssearch {font-size: 14px; font-weight: bold}
.idPssearch p {padding: 20px; border-bottom: 2px solid #0e71b8}
.idPssearch div {padding: 30px; background: #ecf4ff}
.idPssearch div span {float: left; line-height: 40px}
.idPssearch div b {display: inline-block; background: #fff; width: 70%; height: 40px; line-height: 40px; font-size: 16px}
.findResultBox {width: 480px; margin: 0 auto; text-align: center}
.findTabLine {width: 100%; border-bottom: 1px solid #D1D1D1; margin-bottom: 50px}
.findForm div p input {padding: 8px; border: 1px solid #D1D1D1; color: #575757; font-size: 14px; border-radius: 3px; vertical-align: middle; box-sizing: border-box; height: 40px }
.hpBox input {width: 29.3%}
.findForm div:nth-child(1)::after {content: ''; width: 1px; height: 100px; color: #0e71b8; position: absolute;}
.findForm .hr {width: 1px; height: 100px; border-right: 1px solid #0e71b8; position: absolute; top : 345px; left: 405px}
.recaptchaDiv {width: 330px; margin: 0 auto; height: 100px}
.findResultBox a {height: 46px; font-weight: bold; padding: 15px 20px 8px}

/*달력*/
#calender table.fc-header {background: #0e71b8; color: #fff; border-top: 0; line-height: 38px}
#calender table.fc-header tr td {border-bottom: 0}
#calender .fc-day-number {text-align: right; font-weight: bold}
#calender .fc-sat {color: #2384C6}
#calender .fc-sun {color: #ff0000}
#calender .fc-content {border-left: 1px solid #e9e9e9}
#calender .fc-content tr td {border-right: 1px solid #e9e9e9}
#calender .fc-content tr td:first-child {border-left: 1px solid #e9e9e9}
.fc-day-header {height: 30px; line-height: 30px}
.fc-day > div {min-height: 80px !important; padding: 5px}
.fc-event-title {padding: 5px; margin-left: -1px; height: 100%}
.fc-event {position: relative; display: block; font-size: 1em; line-height: 2; border-radius: 3px; border: 1px solid #ada9ac; height: auto}
.fc-event-inner {cursor: pointer}
.fc-day-number {font-size: 16px}
.fc-state-highlight {background: rgba(255, 247, 0, 0.15)}
#calender .fc-content table {border-top: 0}
#calender .fc-header-left {text-align: left; padding-left: 15px; box-sizing: border-box}
#calender .fc-header-right {text-align: right; padding-right: 15px; box-sizing: border-box}
#calender .fc-button {display: inline-block; background: #f9b232; width: 30px; height: 30px; border-radius: 30px; padding: 0}
#calender .fc-button .fc-text-arrow {font-size: 38px; line-height: 26px; color: #fff}
#calender .fc-event {background: url("../Images/calendar_icon.png") no-repeat; text-align: right; font-weight: bold; background-size: 20%;
    background-position: 8px; background-color: #fffdb5 !important; border: 0; padding: 8px 10px 3px; margin-top: 10px}

/*일정 안내 레이어팝업*/
.planView {width: 1000px; height: 600px; position: fixed; top: calc((100vh - 600px) / 2); left: calc((100vw - 1000px) / 2); z-index: 99999; display: none}
.planView .contents {border-radius: 0; font-weight: bold; height: 550px; overflow-y: auto; box-sizing: border-box}
.planView .contents table .simpleTxt {max-width: 690px}

/*연간교육일정*/
.scWrap { background: white; border-radius: 5px; overflow: hidden; }
.scWrap h2.title { background: #259bf3; padding: 15px 30px; font-size: 16px; color: #fff; font-weight: 400; }
.scWrap .month { position: relative; background: #232c3d; padding: 15px 20px 10px; font-size: 22px; font-weight: 700; text-align: center; color: #ced1da }
.scWrap .month i {font-size: 18px; line-height: 28px}
.scWrap .month .calPrev { position: absolute; top: 11px; left: 30px; height: 27px; width: 27px; line-height: 27px; text-align: center; background: #313d4d; border-radius: 13px; color: #ced1da; }
.scWrap .month .calNext{ position: absolute; top: 11px; right: 30px; height: 27px; width: 27px; line-height: 27px; text-align: center; background: #313d4d; border-radius: 13px; color: #ced1da; }
.scWrap table { position: relative; z-index: 1; }
.scWrap table th { height: 40px; color: #aaa; font-family: arial; font-size: 14px; background: #fff; }
.scWrap table td { padding: 15px; height: 100px; border-left: solid 1px #e9e9e9; border-top: solid 1px #e9e9e9; vertical-align: top; background: #fff; text-align: right; }
.scWrap table td.day_0 { border-left: none; }
.scWrap table td span { top: 15px; right: 15px; color: #666; font-family: arial; font-size: 12px; font-weight: 700; }
.scWrap table td span.today { color: #f32525; font-size: 14px; font-weight: 700 !important; background: #f9b232; padding: 3px; border-radius: 10px}
.scWrap table td .study { position: absolute; top: 35px; left: 0; width: 380px; font-size: 14px; height: 30px; line-height: 30px; padding: 0 0 0 8px; border-left: solid 2px #4ac85f; background: #e8f8eb; z-index: 100; text-align: left; overflow: hidden; }
.scWrap table td .study2 { position: absolute; top: 35px; left: 0; width: 380px; font-size: 14px; height: 30px; line-height: 30px; padding: 0 0 0 8px; border-left: solid 2px #e8f8eb; background: #e8f8eb; z-index: 100; text-align: left; overflow: hidden; }

.scWrap.year { font-size: 0; }
.scWrap.year caption { padding: 10px 0; border-bottom: solid 1px #eee; background: #fcfcfc; display: block !important}
.scWrap.year table.tableWrap {border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-top: 0}
.scWrap.year table.tableWrap td.table_0 { border-left: none; }
.scWrap.year table.tableWrap td { font-size: 0; border-left: solid 2px #ddd; border-top: solid 1px #ddd; vertical-align: top; padding: 0; }

.scWrap.year table { display: inline-block; width: 100% }
.scWrap.year table.leftTable { border-left: none; }
.scWrap.year table th.sun { color: #cc0000; }
.scWrap.year table.schedule { border: 0}
.scWrap.year table.schedule th { font-size: 10px; font-weight: 400; text-align: center; height: 30px; }
.scWrap.year table.schedule td { font-size: 12px; padding: 0; border-left: solid 1px #eee; border-top: solid 1px #eee; height: 32px; text-align: center; vertical-align: middle; }
.scWrap.year table.schedule td.day_0 { border-left: none; }
.scWrap.year table.schedule td span { font-weight: 400; }
.scWrap.year table.schedule td.studyTd { background: #1a91eb; cursor: pointer;  }
.scWrap.year table.schedule td.studyTd span { color: white; font-weight: 700; }
.scWrap.year table.schedule td .study { left: 6px; background: white; border: solid 1px #ddd; border-radius: 4px; width: 204px; text-align: center; }
.scWrap.year table.schedule td .study.pos-0 { top: 29px; }
.scWrap.year table.schedule td .study.pos-1 { top: 61px; }
.scWrap.year table.schedule td .study.pos-2 { top: 94px; }
.scWrap.year table.schedule td .study.pos-3 { top: 127px; }
.scWrap.year table.schedule td .study.pos-4 { top: 160px; }
.scWrap.year table.schedule td .study.pos-5 { top: 183px; }
.scWrap.year table td.studyTd .study { opacity: 0; z-index: -1; -webkit-transition: 0.2s ease-out; overflow: visible; -moz-transition: 0.2s ease-out; -ms-transition: 0.2s ease-out; -o-transition: 0.2s ease-out; transition: 0.2s ease-out;  }
.scWrap.year table td.studyTd .study a { display: block; width: 100%; height: 30px; overflow: hidden; font-size: 12px; }
.scWrap.year table td.studyTd .study.day_0:after,.scWrap.year table td.studyTd .study.day_0:before { left: 5.5%; }
.scWrap.year table td.studyTd .study.day_1:after,.scWrap.year table td.studyTd .study.day_1:before { left: 20%; }
.scWrap.year table td.studyTd .study.day_2:after,.scWrap.year table td.studyTd .study.day_2:before { left: 35.5%; }
.scWrap.year table td.studyTd .study.day_3:after,.scWrap.year table td.studyTd .study.day_3:before { left: 50%; }
.scWrap.year table td.studyTd .study.day_4:after,.scWrap.year table td.studyTd .study.day_4:before { left: 65.5%; }
.scWrap.year table td.studyTd .study.day_5:after,.scWrap.year table td.studyTd .study.day_5:before { left: 80%; }
.scWrap.year table td.studyTd .study.day_9:after,.scWrap.year table td.studyTd .study.day_6:before { left: 94.5%; }
.scWrap.year table td.studyTd .study:after,.scWrap.year table td.studyTd .study:before { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.scWrap.year table td.studyTd .study:after { border-color: rgba(255, 255, 255, 0); border-top-color: #fff; border-width: 5px; margin-left: -5px; }
.scWrap.year table td.studyTd .study:before { border-color: rgba(221, 221, 221, 0); border-top-color: #ddd; border-width: 6px; margin-left: -6px; }

/*관심강의*/
.courseAllView {float: right; border: 2px solid #202020; border-radius: 50px; font-size: 18px; font-weight: bold; padding: 10px 20px; cursor: pointer}
.likeCourseBox {width: 31%; height: 430px; float: left; margin: 25px 37px 25px 0; text-align: right}
.likeCourseBox:nth-of-type(3n) {margin: 25px 0 25px 0}
.likeCourseItem {width: 335px; height: 430px; display: inline-block; box-shadow: 1px 8px 11px rgba(51, 51, 51, 0.2)}
.likeCourseItem .courseImg {width: 100%; position: relative; height: 200px}
.likeCourseItem .courseImg > img {border-top-left-radius: 5px; border-top-right-radius: 5px; width: 100%; height: 100%; border: 1px solid #e4e4e4; box-sizing: border-box}
.likeCourseItem .courseDetail {width: 100%; float: left; padding: 20px; box-sizing: border-box; font-size: 16px; line-height: 26px; text-align: left; font-weight: bold}
.likeCourseItem .courseTit {width: 100%; height: 52px; margin-bottom: 28px; font-family: "Noto Sans Kr" !important; font-weight: bold; display: inline-block}
.likeCourseItem .courseTit.simpleTxts {line-height: 26px; -webkit-line-clamp: 2; word-break: break-all; display: -webkit-box !important}
.likeCourseItem .courseTxt {width: auto; float: left}
.likeCourseItem .courseTxt p strong {font-weight: bolder; color: #ff4242}
.likeCourseItem .courseBtn {float: right !important;}
.likeCourseItem .courseBtn div {width: 40px; height: 40px; margin-left: 5px; float: left}
.likeCourseItem .mobileBtn {background: url("../Images/mobileBtn.png") no-repeat; background-size: 100%}
.likeCourseItem .mobileNoBtn {background: url("../Images/noMobileBtn.png") no-repeat; background-size: 100%}
.likeCourseItem .bookIcon {background: url("../Images/bookImg.png") no-repeat; background-size: 100%}
.likeCourseItem .licenseBtn {background: url("../Images/license_off.png") no-repeat; background-size: 100%}
.likeCourseItem .licenseBtn:hover {background: url("../Images/license_on.png") no-repeat; background-size: 100%}
.likeCourseItem .cover {position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all 0.5s; z-index: 10; background: rgba(0, 0, 0, 0.6);
    opacity: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; box-sizing: border-box}
.likeCourseItem .courseImg:hover .cover {opacity: 1}
.likeCourseItem .cover a {display: inline-block; width: 50%; box-sizing: border-box; height: 30px; color: #fff; line-height: 30px; font-size: 22px; font-weight: 500; float: left;
    padding: 0 16px; margin-top: 26%; text-align: center}
.likeCourseItem .cover a img {width: 30px; vertical-align: middle; margin-right: 10px}
.likeCourseItem .cover a:nth-child(1) {border-right: 2px solid #fff}
.likeCourseItem .cover a:hover {font-weight: bolder}
.likeCourseItem .min13 {margin: 0 5px 5px 0; vertical-align: middle}
.likeCourseItem .icon {width: 27px}

/*쪽지*/
.memoBoxBtn.on { background: #0e71b8; border: 1px solid #0e71b8 }
.memoBoxBtn {background: #f9b232; border: 1px solid #f9b232; color: #fff !important}

/*자주하는 질문*/
.faqTableBg {height: auto; overflow: hidden}


/*프로그램 다운로드*/
.infoBox .num {width: 100%; position: relative}
.infoBox .num span {font-size: 24px; margin: 20px 0; color: #333; font-family: 'NanumSquareB'}
.downloadWrap {margin-bottom: 50px}
.downloadWrap div {float: left}
.downloadWrap .imgBox {width: 50%; height: auto; border: none; padding: 20px; box-sizing: border-box}
.downloadWrap .txtBox {width: 47%; margin: 30px 0 20px 36px; font-size: 17px; line-height: 30px; padding: 0; height: auto}
.downloadWrap .txtBox a {display: inline-block; width: 258px; height: 70px; margin-top: 50px; float: right}
.infoBox {font-size: 18px; margin-bottom: 30px; height: auto; overflow: hidden; font-family: "NanumSquareR"}
.num {font-family: 'NanumSquareEB'; font-size: 48px; color: #ddd; float: left}
.screen {position: absolute; width: 30px; height: 15px; background: #fff; transform: rotate(-45deg); top: 37px; left: 40px}

/*학습환경설정*/
.contentTitSub {width: 100%; overflow: hidden; height: auto}
.contentTitSub > div {width: 50%; float: left; box-sizing: border-box; padding: 40px 10px}
.titleBg.setting {height: 310px; background: url("../Images/settingTit_bg.png") no-repeat; background-position-y: 65%}
.titTxt.setting {text-align: left; font-family: "NanumSquareR"}
.titTxt.setting b {font-size: 20px}
.titTxt.setting p {font-size: 17px; line-height: 24px}
.titTxt.setting p b {font-size: 16px}
.imgWrap {width: 100%; height: auto; overflow: hidden}
.imgWrap .imgBox {width: auto; height: auto; border: none; position: static}
.imgWrap div {float: left; margin: 20px}
.imgWrap .orBg {margin: 0 41px; background: url("../Images/login_bg1.jpg") no-repeat; width: 25px;}
.orBg.another {background-position-y: 42%; height: 304px}
.orBg.other {background-position-y: 42%; height: 400px}
.halfLeft, .halfRight {width: 50%; box-sizing: border-box; float: left}
.infoTxtBox .halfRight {padding-left: 65px}
.orBg.transparent {opacity: 0; height: 300px}
.imgWrap a {width: 258px; height: 70px; margin: 20px; display: inline-block}
.infoTxtBox {float: right; width: 1120px; box-sizing: border-box}
.infoBox .num span.setting {margin: 0}
.manualBtn {width: 100%; border: 2px solid #f9b232; font-family: "NanumSquareEB"; font-size: 20px; line-height: 60px; display: block;
    box-sizing: border-box; border-radius: 10px}
.manualBtn:hover {background: #f9b232; color: #fff}

/*이벤트*/
.tabWrap.eventType .tabTitle li {width: 50%}
.eventList {overflow: hidden}
.eventItem {float: left; margin: 15px; width: 47%; position: relative}
.figImg {overflow: hidden; width: 100%; height: 256px}
.figImg img {width: 100%; border-radius: 20px; height: 100%}
.figCont {padding: 30px 20px 40px}
.figCont .tit {font-size: 20px; font-weight: 700; color: #000; width: 100%}
.figCont .date {font-size: 16px; color: #666; position: relative; padding-left: 30px; font-weight: bold}
.eventCount {position: absolute; right: 15px; top: 15px; display: inline-block; padding: 10px 15px 6px; background: #a6ea00; border-radius: 30px; font-size: 16px;
    font-weight: 700; color: #000}
.figCont .date:before {content: ''; display: block; position: absolute; top: -3px; left: 0; width: 20px; height: 20px;
    background: url('../Images/eventIcon1.png') no-repeat; background-size: 100%}
.eventCount.on {background: #666; color: #fff}
.eventItem.on .figImg {opacity: 0.6}
.alwayschk {line-height: 38px}
.ui-datepicker table {border-top: none}
.commentsWrite .commentModify { padding: 8px; border:1px solid #D1D1D1; color:#575757; font-size: 14px; border-radius: 3px; vertical-align: middle; width: 100%;
    height: 100%; -webkit-transition: 0.3s ease-out; -moz-transition: 0.3s ease-out; -ms-transition: 0.3s ease-out; -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out; box-sizing: border-box; margin-bottom: 10px}
.commentsWrite {padding: 10px; margin: 8px 0 0 0; background: aliceblue !important; color: #404040!important; height: auto; overflow: hidden}
.commentsWrite .btn {float: right}
.cmt.reply {padding-left: 15px}

/*카드뉴스*/
.mainTitle.cardNewsType {position: relative}
.mainTitle.cardNewsType .moreBtn {position: absolute; right: 0}
.cardNewsItem img {width: 100%; height: 100%}
.cardNewsType .fileItemBox {border-bottom: 1px dashed #ccc; padding-bottom: 3px}
.cardNewsType .fileItemBox:last-child {border-bottom: none}
.item {width: 276px; height: 315px; box-sizing: border-box; border: 1px solid #0e71b8; background: #fff}
.item.cardNewsType {border: none; height: 380px; float: left; margin: 10px 32px 0 0}
.item.cardNewsType:nth-child(4n) {margin: 10px 0 0}
.item.cardNewsType .imgBox {height: 276px; border: none}
.cardNewsTitle {width: 276px; font-weight: bold}
.cardNewsTitle.simpleTxt {-webkit-line-clamp: 2; line-height: 24px; height: 48px; margin: 0 auto; display: -webkit-box; white-space: normal}
.cardNewsSlide {width: 600px; height: auto; margin: 0 auto}
.List.galleryType {border-top: 2px solid #6f6f6f; padding: 20px 0}
.cardNewsSlide .slick-prev, .cardNewsSlide .slick-prev:hover, .cardNewsSlide .slick-prev:focus {background: url("../Images/prev.png") no-repeat !important}
.cardNewsSlide .slick-next, .cardNewsSlide .slick-next:hover, .cardNewsSlide .slick-next:focus {background: url("../Images/next.png") no-repeat !important}
.cardNewsSlide .slick-prev, .cardNewsSlide .slick-next {width: 45px; height: 45px}
.cardNewsSlide .slick-next:before {content: ''}
.cardNewsSlide .slick-dots li.slick-active button:before {background: #000}
.cardNewsSlide .slick-dots  {position: static; margin: 10px 0}
.cardNewsSlide .slick-prev {left: -70px}
.cardNewsSlide .slick-next {right: -70px}
.cardNewsSlide .slick-dots li button:before {border-color: #000}
.cardNewsSlide .slick-dots li.slick-active button:before {background: #000}

/*1:1 상담*/
.noreply {color: #ff4242}
.consultingWrite {display: none}
.contentTit p {font-size: 20px; font-weight: bold; line-height: 28px; display: inline-block; width: 100%}

/*전화상담*/
.TelType label {line-height: 30px;}
.TelType input {vertical-align: middle}
.TelType span {margin-left: 30px}
.TelReservationWrap.viewOk {display: block}
.TelReservationWrap {width: 600px; height: 530px; background: #fff; position: fixed; top : calc((100vh - 530px) / 2); left: calc((100vw - 600px) / 2);
    display: none; z-index: 5000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); margin: 0 auto; border-radius: 5px}
.TelReservationWrap table .writeBox {min-height: auto; height: 100px; width: 96%}

/*나의 학습실*/
.subTab a {width: 128px; height: 40px; box-sizing: border-box; border: 1px solid #0e71b8; display: inline-block; text-align: center;
    font-size: 15px; color: #0e71b8; padding: 13px 0 8px; font-weight: bold}
.subTab a:hover, .subTab a.on {background: #f9b232; border: 1px solid #f9b232; color: #fff}
.divisionBtn {line-height: 20px; font-size: 13px; font-weight: normal; padding: 3px 10px; background: #0e71b8; border: 1px solid #0e71b8;
    color: #fff !important}
.magnitude {position: relative; width: 100%; height: 8px; background: #eee; display: inline-block; border-radius: 10px}
.magnitude span {position: absolute; height: 100%; background: #ff4242; left: 0; display: inherit; border-radius: inherit}
.yearSelect {float: right; display: inline-block; width: 120px; margin-right: 5px; font-size: 14px; padding: 5px 10px 1px; box-sizing: border-box; height: 27px}

/*공통아이콘*/
.icon {display: inline-block; width: 70px; height: 16px; padding: 5px 10px 3px; color: #fff; background: #003d76; text-align: center; vertical-align: middle; line-height: normal; border-radius: 5px}
.icon.card {background: #ff7e00}
.hoverBtn a.on {background: #006cda; color: #fff; border: 1px solid #006cda}
.icon.noRefund {background: #228e86}
.noRefund.courseListType {display: inline-block; width: 58px; height: 26px; padding: 4px 8px; color: #fff; font-size: 14px; line-height: 18px; font-weight: normal;
    border-radius: 5px; box-sizing: border-box; text-align: center; margin-left: 5px}
.card.courseListType {display: inline-block; width: 70px; height: 26px; padding: 4px 8px; color: #fff; font-size: 14px; line-height: 18px; font-weight: normal;
    border-radius: 5px; box-sizing: border-box; text-align: center; margin-left: 5px}
/*과정라벨*/
.FSite {color: #003d76; font-weight: bold}
.CSite {color: #ff7e00; font-weight: bold}
.noRefundCourse {color: #228e86; font-weight: bold}

/*수강후기*/
.starScore.reviewType {border-top: none; padding: 10px}
.starScore.reviewType .star {line-height: 20px}
.starWrap {background: url("../Images/star_gray.png") repeat-x;  height: 20px; width: 90px}
.star {background: url("../Images/star.png") repeat-x; height: 100%}
.starScore label {line-height: 38px; margin-right: 10px}
.starScore input {height: auto}
.starScore span {display: inline-block; width: 102px}
.starScore .star span {vertical-align: sub}

/*라이브강의 신청*/
.liveCourseBox {width: 31%; height: 480px; float: left; margin: 25px 37px 25px 0; text-align: right}
.liveCourseBox:nth-of-type(3n) {margin: 25px 0 25px 0}
.liveCourseItem {width: 335px; height: 480px; display: inline-block; box-shadow: 1px 8px 11px rgba(51, 51, 51, 0.2)}
.liveCourseItem .courseImg {width: 100%; position: relative; height: 200px}
.liveCourseItem .courseImg > img {border-top-left-radius: 5px; border-top-right-radius: 5px; width: 100%; height: 100%; border: 1px solid #e4e4e4; box-sizing: border-box}
.liveCourseItem .courseDetail {width: 100%; float: left; padding: 20px; box-sizing: border-box; font-size: 18px; line-height: 26px; text-align: left}
.liveCourseItem .courseTit {width: 100%; height: 52px; margin-bottom: 28px; font-family: "Noto Sans Kr" !important; font-weight: bold; display: inline-block}
.liveCourseItem .courseTit.simpleTxts {line-height: 26px; -webkit-line-clamp: 2; word-break: break-all; display: -webkit-box !important}
.liveCourseItem .courseTxt {width: auto; float: left}
.liveCourseItem .courseTxt p strong {font-weight: bolder; color: #ff4242}
.liveCourseItem .courseBtn {float: right !important;}
.liveCourseItem .courseBtn div {width: 40px; height: 40px; margin-left: 5px; float: left}
.liveCourseItem .mobileBtn {background: url("../Images/mobileBtn.png") no-repeat; background-size: 100%}
.liveCourseItem .mobileNoBtn {background: url("../Images/noMobileBtn.png") no-repeat; background-size: 100%}
.liveCourseItem .bookIcon {background: url("../Images/bookImg.png") no-repeat; background-size: 100%}
.liveCourseItem .licenseBtn {background: url("../Images/license_off.png") no-repeat; background-size: 100%}
.liveCourseItem .licenseBtn:hover {background: url("../Images/license_on.png") no-repeat; background-size: 100%}
.liveCourseItem .cover {position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all 0.5s; z-index: 10; background: rgba(0, 0, 0, 0.6);
    opacity: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; box-sizing: border-box}
.liveCourseItem .courseImg:hover .cover {opacity: 1}
.liveCourseItem > a {box-sizing: border-box; padding: 110px 0; color: #fff; font-size: 30px}
.liveCourseItem .cover .coverBtn {display: inline-block; width: 100%; box-sizing: border-box; height: 30px; color: #fff; line-height: 30px; font-size: 22px;
    padding: 0 16px; margin-top: 26%; text-align: center; float: none; font-weight: bold}
.liveCourseItem .cover img {width: 30px; vertical-align: middle; margin-right: 10px}
.liveCourseItem > a:hover .cover {font-weight: bolder}
.liveCourseItem .min13 {margin: 0 5px 5px 0; vertical-align: middle}
.icon.live {background: #ff1700; width: 40px; line-height: 20px; height: auto; padding: 0; border-radius: 5px; vertical-align: middle}
.liveApply {background: #ff1700; width: 100%; text-align: center; margin-top: 10px; font-size: 18px; color: #fff; padding: 10px 0 7px; box-sizing: border-box;
    font-family: "GmarketSansM"; border-radius: 5px; cursor: pointer}

/*수강신청 검색*/
.divisionWrap {width: 100%; height: auto; overflow: hidden; padding-top: 20px; margin-bottom: 20px}
.divisionWrap > .divisionHeader {background: aliceblue}
.divisionHeader {font-family: 'NanumSquareR'; font-size: 22px; font-weight: bold; width: 100%; line-height: 28px; padding: 10px; box-sizing: border-box}
.divisionBtn {line-height: 20px; font-size: 13px; font-weight: normal; padding: 3px 10px; background: #0e71b8; border:1px solid #0e71b8;
    color: #fff !important}
.divisionBtn.on {background: #ff7800; border-color: #ff7800; color: #fff}
.division {padding: 10px 0; text-align: center}
.divisionHeader > div.showInline {margin-left: -67px}

.divisionHeader .boardSearch {right: 15px; position: relative; width: auto}
.divisionHeader .boardSearch input {height: 29px !important; padding: 3px 8px; box-sizing: border-box; font-size: 14px}
.divisionArea .boardSearch .inputBox {width: 185px}

.divisionSearchBox {width: 690px; box-sizing: border-box; text-align: right; display: inline-block; float: right}
.divisionArea .boardSearch {width: 285px; display: inline-block}
.divSearch, .division, .divisionWrap > .divisionHeader {border-bottom: 1px dashed #0e71b8}
.divisionArea {font-weight: bold; width: 100%}
.divisionArea, .onoffswitch {display: inline-block}
.divisionArea > span {font-size: 14px}

/*온라인 수강신청*/

.aside {float: left; width: 180px; height: auto; overflow: hidden; margin-bottom: 50px}
.listArea {float: left; width: 1020px; height: auto; overflow: hidden; padding-left: 30px; box-sizing: border-box}
.aside > p {font-family: "GmarketSansB"; font-weight: normal; font-size: 18px}
.category {width: 100%; border-bottom: 1px solid #003d76;border-top: 3px solid #003d76}
.category div {font-weight: bold}
.bigCategory:hover,  .category.on > div {cursor: pointer; background: #003d76; color: #fff}
.allCategoryBtn {box-sizing: border-box; padding: 10px 5px 7px; cursor: pointer}
.bigCategory {border-top: 1px solid #003d76; box-sizing: border-box; padding: 12px 5px 9px; font-size: 14px}
.categoryBox.on .bigCategory {background: #003d76; color: #fff}
.categoryBox.on .bigCategory .changeIcon {transform: rotate(180deg)}
.middleCategory {padding: 10px 0; display: none}
.middleCategory a {font-size: 14px; display: block; padding: 8px 6px 6px 15px}
.middleCategory a:hover, .middleCategory a.on {color: #f9b232}
.changeIcon {display: inline-block; margin-right: 2px; font-family: math; transition: all ease-in-out 0.3s}
.list {clear: both; margin-top: 10px; padding-bottom: 70px}
.listItem {border: 1px solid #ccc; padding: 15px 0; margin-bottom: 20px; box-sizing: border-box; height: 265px; position: relative}
.listArea .listTitle {border-bottom: 1px solid #494949; font-size: 18px; height: 36px}
.listArea .listTitle > div:first-child {height: 100%; box-sizing: border-box; padding-top: 12px}
.listItem > div {float: left; box-sizing: border-box; height: 100%}
.courseImgWrap {width: 300px; padding: 0 10px}
.courseTextWrap {width: 538px; padding: 10px}
.courseBtnWrap {width: 150px}
.courseImgWrap .courseImg {width: 280px; position: relative; height: 177px}
.courseImgWrap .courseImg > img {border-radius: 28px; width: 100%; height: 100%; border: 1px solid #e4e4e4; box-sizing: border-box}
.courseImgWrap .courseDetail {width: 100%; float: left; padding: 25px 0; box-sizing: border-box; font-size: 18px; line-height: 26px}
.courseImgWrap .courseTit {width: 100%; height: 52px; margin-bottom: 28px; font-family: "Noto Sans Kr" !important; font-weight: bold; display: inline-block}
.courseImgWrap .courseTit.simpleTxts {line-height: 26px; -webkit-line-clamp: 2; word-break: break-all; display: -webkit-box !important}
.courseImgWrap .courseTxt {float: left; margin-top: 10px; font-weight: bold}
.courseImgWrap .courseTxt p strong {font-weight: bolder; color: #ff4242}
.courseImgWrap .courseBtn {float: right !important;}
.courseImgWrap .courseBtn div {width: 40px; height: 40px; margin: 10px 5px 5px; float: left}
.courseImgWrap .mobileBtn {background: url("../Images/mobileBtn.png") no-repeat; background-size: 100%}
.courseImgWrap .mobileNoBtn {background: url("../Images/noMobileBtn.png") no-repeat; background-size: 100%}
.courseImgWrap .bookIcon {background: url("../Images/bookImg.png") no-repeat; background-size: 100%}
.courseImgWrap .licenseBtn {background: url("../Images/license_off.png") no-repeat; background-size: 100%}
.courseImgWrap .licenseBtn:hover {background: url("../Images/license_on.png") no-repeat; background-size: 100%}
.courseImgWrap .cover {position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all 0.5s; z-index: 10; border-radius: 28px;
    background: rgba(0, 0, 0, 0.6); opacity: 0; box-sizing: border-box}
.courseImgWrap .courseImg:hover .cover {opacity: 1}
.courseImgWrap .cover a {display: inline-block; width: 100%; box-sizing: border-box; height: 45px; color: #fff; line-height: 45px; font-size: 22px;
    font-weight: 500; margin-top: 26%; text-align: center}
.courseImgWrap .cover a img {width: 26px; vertical-align: middle; margin-right: 10px}
.courseImgWrap .cover a:hover {font-weight: bolder}
.courseTextWrap .courseTit.simpleTxts {line-height: 20px; -webkit-line-clamp: 2; word-break: break-all; display: -webkit-box !important; font-weight: bold; height: 40px; margin-bottom: 10px}
.courseTextWrap .icon.refund {background: #003d76; width: 27px; height: auto; border-radius: 5px; vertical-align: middle}
.courseTextWrap .icon.noRefund {background: #228e86; width: 27px;  height: auto; border-radius: 5px; vertical-align: middle}
.hashTagWrap {position: absolute; bottom: -10px; word-break: keep-all}
.hashTagWrap span {font-size: 12px; font-weight: normal; padding: 4px 10px 2px; background: #fffdb5; border-radius: 20px; box-sizing: border-box; text-align: center;
    display: inline-block; margin-bottom: 5px; line-height: 16px; font-family: 'GmarketSansM'; border: 1px solid #f9b232}
.hashTagWrap.simpleTxts {line-height: 20px; -webkit-line-clamp: 2;  display: -webkit-box !important; font-weight: bold; height: 60px}
.courseBtnWrap {text-align: center; padding: 40px 0}
.courseBtnWrap a {min-width: 90px; margin-bottom: 10px}
.listItem .tableWrap {width: 100%; height: 74px; background: #fff; position: absolute; bottom: 0; z-index: 11; border-left: 2px solid #6f6f6f; border-right: 2px solid #6f6f6f;
    border-bottom: 2px solid #6f6f6f; box-sizing: border-box; opacity: 0; transition: all ease-in-out 0.3s}
.listItem:hover .tableWrap {bottom: -75px; opacity: 1}

/*수강신청 팝업*/
.applyPopup {width: 900px; min-height: 280px; position: fixed; top: calc((100vh - 280px) / 2); left: calc((100vw - 900px) / 2); z-index: 5001; display: none}
.applyPopup div:nth-of-type(2) {background: #fff; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px}

/*과정상세*/
.courseDetail .courseBtn {float: none; display: inline-block}
.courseBtn div {width: 40px; height: 40px; margin-right: 5px; display: inline-block; vertical-align: middle}
.mobileBtn {background: url("../Images/mobileBtn.png") no-repeat; background-size: 100%}
.mobileNoBtn {background: url("../Images/noMobileBtn.png") no-repeat; background-size: 100%}
.bookIcon {background: url("../Images/bookImg.png") no-repeat; background-size: 100%}
.licenseBtn {background: url("../Images/license_off.png") no-repeat; background-size: 100%}
.licenseBtn:hover {background: url("../Images/license_on.png") no-repeat; background-size: 100%}
.courseDetail > .csTitle {font-family: "GmarketSansM"; font-weight: normal; font-size: 18px; padding-bottom: 5px; border-bottom: 1px solid #003d76; margin-bottom: 10px; height: 28px}
.courseDetail .tabWrap {margin-left: 40px}
.courseDetail .tabWrap .tabTitle li {width: 33.33%; height: 30px}
.courseDetail .tabWrap .tabTitle li a {line-height: 30px; font-family: "GmarketSansM"; font-weight: normal}
.courseDetail .chainCourseDetailView {padding-left: 40px; box-sizing: border-box}
.csInfoBox {height: auto; overflow: hidden}
.csInfoDetail {background: #f5f5f5; height: auto; padding: 10px; line-height: 28px; height: 28px}
.csInfoBox .imgBox {width: 100%; box-sizing: border-box; height: auto; overflow: hidden}
.csInfoDetail a {line-height: normal}
.tabWrap .courseTab {width: 33.3333%}
.csContents > hr {margin: 0.1vw 0}
.chainCourseDetailView .courseItem {width: 100%; height: 100px; box-sizing: border-box; border: 1px solid #ddd; border-radius: 5px; margin-bottom: 5px}
.chainCourseDetailView .courseItem .imgBox {width: 138px; height: 80px; margin: 10px; float: left; box-sizing: border-box; padding-right: 0}
.chainCourseDetailView .courseItem .txtBox {width: 280px; float: left; box-sizing: border-box; height: auto; overflow: hidden; padding: 0 10px 0 0}
.chainCourseDetailView .courseItem .txtBox .courseItemTitle {height: 42px; padding: 5px 0; font-size: 14px; font-weight: bold}
.chainCourseDetailView .courseItem .txtBox .courseItemTitle.simpleTxts {-webkit-line-clamp: 2; line-height: 22px}
.csInfoBox .hashTagWrap {position: unset; bottom: unset}
.csInfoBox .priceWrap {line-height: 40px; text-align: right}
.csContents .tabWrap {margin-left: 0}

.courseDetailView .courseDetailTit {font-family: "GmarketSansB"; font-weight: normal; padding-bottom: 5px; border-bottom: 1px solid #d9d9d9}
.courseDetailView .courseDetailTxt {padding: 20px 10px; margin-bottom: 20px; font-weight: normal; line-height: 20px; font-family: "GmarketSansM"; font-size: 14px}
.courseDetailView .courseDetailTxt * {font-size: 14px !important; font-family: "GmarketSansM"; font-weight: normal}
.courseDetailView .teacherTitle {font-size: 15px !important; font-family: "GmarketSansB"; font-weight: normal; margin-bottom: 10px}
.courseDetailView .courseDetailTxt .half:first-child {padding-right: 20px; height: auto; overflow: hidden}
.courseDetailView .courseDetailTxt .half:nth-child(2) {padding-left: 30px; height: auto; overflow: hidden}
.csTitle .icon {width: 30px; font-family: "GmarketSansL"; font-weight: bold; font-size: 14px}
.courseItemTitle .icon {font-size: 12px; width: 25px; padding: 5px 6px 2px}

/*사내교육*/
.CompanyCourseItem {width: 289px; height: 395px; display: inline-block; margin-right: 10px; position: relative; box-shadow: 1px 8px 11px rgba(51, 51, 51, 0.2);
    box-sizing: border-box; border-radius: 5px; margin-bottom: 40px; border: 1px solid #ccc; box-sizing: border-box}
.CompanyCourseItem:nth-child(4n) {margin-right: 0}
.CompanyCourseItem .courseImg {width: 100%; position: relative; height: 174px}
.CompanyCourseItem .courseImg a > img {width: 100%; height: 100%; box-sizing: border-box; border-top-right-radius: 4px; border-top-left-radius: 4px}
.CompanyCourseItem .courseDetail {width: 100%; float: left; padding: 10px; box-sizing: border-box; font-size: 18px; line-height: 26px; text-align: left}
.CompanyCourseItem .courseTit {width: 100%; height: 52px; margin-bottom: 28px; font-family: "Noto Sans Kr" !important; font-weight: bold; display: inline-block}
.CompanyCourseItem .courseTit.simpleTxts {line-height: 26px; -webkit-line-clamp: 2; word-break: break-all; display: -webkit-box !important}
.CompanyCourseItem .courseTxt {width: auto; float: left}
.CompanyCourseItem .courseTxt p strong {font-weight: bolder; color: #ff4242}
.CompanyCourseItem .courseBtn {float: right !important;}
.CompanyCourseItem .limitDay {display: block; position: absolute; top: 15px; right: 15px; background: #ff4242; color: #fff; font-family: "GmarketSansB";
    font-weight: normal; font-size: 14px; padding: 5px 6px 3px; border-radius: 5px}
.CompanyCourseItem .courseBtn div {width: 40px; height: 40px; margin-left: 5px; float: left}
.CompanyCourseItem .mobileBtn {background: url("../Images/mobileBtn.png") no-repeat; background-size: 100%}
.CompanyCourseItem .mobileNoBtn {background: url("../Images/noMobileBtn.png") no-repeat; background-size: 100%}
.CompanyCourseItem .bookIcon {background: url("../Images/bookImg.png") no-repeat; background-size: 100%}
.CompanyCourseItem .licenseBtn {background: url("../Images/license_off.png") no-repeat; background-size: 100%}
.CompanyCourseItem .licenseBtn:hover {background: url("../Images/license_on.png") no-repeat; background-size: 100%}
.CompanyCourseItem .cover {position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all 0.5s; z-index: 10; background: rgba(0, 0, 0, 0.6);
    opacity: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; box-sizing: border-box}
.CompanyCourseItem .courseImg:hover .cover {opacity: 1}
.CompanyCourseItem > a {box-sizing: border-box; padding: 110px 0; color: #fff; font-size: 30px}
.CompanyCourseItem .cover .coverBtn {display: inline-block; width: 100%; box-sizing: border-box; height: 30px; color: #fff; line-height: 30px; font-size: 22px;
    padding: 0 16px; margin-top: 26%; text-align: center; float: none; font-weight: bold}
.CompanyCourseItem .cover img {width: 30px; vertical-align: middle; margin-right: 10px}
.CompanyCourseItem > a:hover .cover {font-weight: bolder}
.CompanyCourseItem .liveApply {background: #f9b232; border-radius: 0; margin-top: 0}
.liveApply.eneType {background: #494949}
.CompanyCourseItem .favoriteBtn {position: absolute; top: 15px; left: 15px; padding: 5px 6px 2px !important; font-family: "GmarketSansB";
    font-weight: normal; font-size: 14px; border-radius: 30px !important}


.CompanyCourseItem.offType .courseTit {margin-bottom: 10px}
.CompanyCourseItem.offType .courseDetail {line-height: 20px}

/*슬라이드 메인 팝업*/
.slideMainPopupWrap {width: 500px; position: absolute; z-index: 5; background: white; cursor: move; top: 150px;  left: 20px;}
.slideMainPopupWrap .slideItem {width: 500px; height: 500px}
.slideMainPopupWrap .slideItem a > img, .slideMainPopupWrap .slideItem > img {width: 100%}
.slideMainPopupNew {position: relative; height: 500px; overflow: hidden; z-index: 3; box-shadow: 5px 0 5px rgba(0, 0, 0, 0.2)}
.pBtn {margin: 0 auto; z-index: 2; box-shadow: 5px 0 5px rgba(0, 0, 0, 0.2); height: auto; overflow: hidden}
.popup {position: absolute; z-index: 16; background: white; cursor: move; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2)}
.mainPopupBtn {font-size: 14px; color: #fff; font-family: "NanumSquareL"; line-height: 36px; font-weight: 600; background: #949494; cursor: pointer}
.mainPopupCloseBtn {font-size: 14px; color: #fff; font-family: "NanumSquareL"; line-height: 36px; font-weight: 600; background: #0e71b8; cursor: pointer}
.slideMainPopupTextNew {position: absolute; top: 0; right: -100px; height: 500px; overflow: hidden; width: 100px; z-index: 1}
.slideTextGo {display: inline-block; width: 100px; height: auto; box-sizing: border-box; padding: 10px 5px; background: #fff; margin-bottom: 5px; margin-left: -5px;
    font-family: "NanumSquareR"; font-size: 12px; font-weight: bold; line-height: 18px; border-right: 15px solid #006cda; text-align: center; box-shadow: 2px 0 5px rgba(0, 0, 0, 0.2)}
.slideTextGoBox {width: 70px; margin: 0 auto}
.slideTextGo.on {border-color: #ff6600; transition: all 0.1s ease-in-out; margin-left: 0}

/*연수원 팝업 공지*/
#scNotice {width: 100%; height: auto; overflow: hidden; border-radius: 4px; background: #fff; font-weight: bold; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
    border: solid 1px #ddd;}
#scNotice h2 { font-size: 15px; padding: 10px 5px 5px; background: #f9e232; box-sizing: border-box; border-top-left-radius: 5px; text-align: center;
    border-top-right-radius: 5px;}
#scNotice > div {padding: 5px}
#scNotice p { font-size: 13px; color: #555; padding: 5px; line-height: 18px}
#scNotice span { display: block; padding: 0 5px; font-size: 11px; color: #999; }
.trainingPopupWrap {position: fixed; top: 160px !important; right: 100px; width: 210px}

/*휴메트로 팝업*/
.humetroPopup {width: 300px; height: 300px; background: url("../Images/humetro_popup.png") no-repeat; position: fixed; top: 400px; right: 50px}
.humetroPopup .modalClose  {float: right; border: 2px solid; width: 20px; height: 20px; line-height: 22px; font-size: 16px;
    margin: 5px; font-weight: bold; cursor: pointer}
.humetroPopup .popupLinkBtn {position: absolute; bottom: 35px}
.humetroNotice { width: 200px; padding: 10px 5px; border-radius: 4px; background: #fff; border: solid 1px #ddd; margin-top: 20px;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); font-size: 13px; line-height: 18px; font-weight: bold}
.humetroNotice p { font-size: 12px; color: #555; padding: 5px; line-height: 18px}
.humetroNoticeBtn { display: block; padding: 3px 5px; font-size: 12px; color: #fff; box-sizing: border-box; background: #2384C6; cursor: pointer}
.humetroNoticeBtn:hover {color: #fff}
.etcQAPopup .imgWrap {text-align: center}
.etcQAPopup .imgWrap a {width: 200px; display: inline-block; margin: 5px}
.etcQAPopup .imgWrap a img {width: 100%}

.humetroNotice2 {position: absolute; top: 0; left: -220px; width: 190px; padding: 10px 5px; border-radius: 4px; background: #fff; border: solid 1px #ddd; }
.dim {position: fixed; right: 0; top: 0; left: 0; bottom: 0; z-index: 4999; width: 100%; height: 100%; background: rgba(0,0,0,0.3); display: none}
.etcQAPopup {width: 700px; position: fixed; left: calc((100vw - 700px) / 2); z-index: 5000; font-size: 14px; line-height: 20px}
.etcQAPopup .wrap {border-radius: 0; background: #fff}
.etcQAPopup .modalClose {display: inline-block; width: 20px; height: 20px; line-height: 20px; box-sizing: border-box; border: 1px solid #fff; text-align: center; color: #fff}
.etcQAPopup .popupTitle {font-size: 16px; height: auto; overflow: hidden}
.etcQAPopup.etcQA1 {height: 600px; top: calc((100vh - 600px) / 2); display: none}
.etcQAPopup.etcQA2 {height: 257px; top: calc((100vh - 257px) / 2); display: none}
.etcQAPopup.etcQA3 {height: 197px; top: calc((100vh - 197px) / 2); display: none}
.etcQAPopup.etcQA1 .wrap {height: 500px; overflow: scroll}

/*mOtp 추가*/
.mOtpType {text-align: center; min-width: 1180px}
.mOtpType .input-div {background: #e9faff}
.mOtpType .input-div .btn {line-height: 24px; vertical-align: middle}
.mOtpType .input-div .inputBox {border: 1px solid #006cda}
.mOtpType .input-div input::-webkit-input-placeholder {color: #2384C6}
.mOtpType .input-div input:-ms-input-placeholder {color: #2384C6}
.mOtpType .input-div input::-moz-placeholder {color: #2384C6}
.mOtpType .input-div input:-moz-placeholder {color: #2384C6}
.mOtpType .infoBox {width: 33.33%; height: auto; overflow: hidden; float: left; padding: 0 40px; box-sizing: border-box; min-height: 600px;
    margin-bottom: 0; font-size: 16px}
.mOtpType .infoBoxWrap {padding: 20px 0}
.mOtpType .MotpFooter {width: 100%; height: auto; overflow: hidden; padding: 0 20px 10px 0; text-align: right; box-sizing: border-box}
.mOtpType .MotpFooter .btn {color: #697280; padding: 5px 10px; font-size: 14px; border-radius: 10px}

/*재응시 안내 팝업*/

.noticePopup.myPageType {width: 400px; height: 400px; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); position: fixed; top: calc((100vh - 400px) / 2); left: calc((100vw - 400px) / 2);
    background: url("../Images/cardNotice_230927.jpg") no-repeat; z-index: 20}
.noticePopup.myPageType .modalClose {width: 20px; height: 20px; float: right; border: 2px solid; text-align: center; font-size: 18px; line-height: 24px; margin: 5px;
    cursor: pointer; font-weight: bold}
.popupTypeDim { position: fixed; right: 0; top: 0; left: 0; bottom: 0; z-index: 4; width: 100vw; height: 100vh; background: rgba(0,0,0,0.3);}

/*시험 언어 선택 버튼*/
.selectLngBox {position: absolute; text-align: center; width: 100%; transform: translateY(-30%); top: 30%}
.selectLngBox span {display: inline-block; padding: 15px 40px; background: #0744b9; color: #fff}
.selectLngBox span:nth-of-type(2) {margin-left: 10px}

/*미디어쿼리*/
@media screen and (max-width: 1680px) {
    #scNotice, .humetroNotice, .humetroNotice2 {display: none}

}