/*
    Document   : Style
	Created on : 2019. 8. 28
    Description:
        Purpose of the stylesheet follows.
*/


/*헤더*/
.mainHeader {height: 84px; width: 100%; position: relative}
#logo {float: left; text-align: center; margin: 14px 0; width: 250px}
#logo, .gnb {display: inline-block}
#logo a {display: inline-block; width: 46%}



#logo img {width: 100%}
.subWrap {margin-top: -5px; background: #fff; position: absolute; box-shadow: 1px 1px 2px rgba(51, 51, 51, 0.2); width: 100%}
.subWrapInner {width: 1200px}
.gnb {font-size: 20px; font-weight: bold; height: 84px; width: 1200px; margin: 0 auto}
.gnb ul {text-align: center; height: 100%}
.gnb > ul li {display: inline-block; width: auto; padding: 0 25px; min-width: 80px; max-height: 84px; box-sizing: border-box}
.gnb > ul li#menu7 a {line-height: 20px; padding-top: 32px}
/*.gnb > ul li:nth-of-type(4) {width: 15%}*/
.gnb a {color: #fff; text-shadow: 1px 1px 2px #333; float: left; width: 100%; text-align: center; box-sizing: border-box; height: 84px; display: block; line-height: 84px}
/*.gnb li.on a {border-bottom: 8px solid #2384c6}*/
.mainHeader.on .gnb ul li:hover, .mainHeader.on .gnb ul li.on {border-bottom: 8px solid #2384c6}
.headerBtn {float: right; margin-right: 60px}
.headerBtn a {display: inline-block; vertical-align: middle; margin: 20px 10px; text-align: center; position: relative}
.headerBtn img {display: block; margin: 0 auto}
.headerBtn span {color: #fff; font-size: 12px}
.mNum {position: absolute; top:-4px; right: -2px; background: #ff0023; border-radius: 50px}
.mNum span {min-width: 18px; height: 18px; display: block; text-align: center; line-height: 19px}
/*.sub.on {display: block !important}*/
header {min-width: 1280px; z-index: 15}
header.on {background: #fff; box-shadow: 1px 1px 2px rgba(51, 51, 51, 0.2); z-index: 17}
header.on .gnb a, header.on .headerBtn span {color: #333; text-shadow: none; font-weight: bold}
header.on .mNum span {color: #fff; font-weight: normal}
#headerBtn1, #headerBtn2 {display: none}
.vpMainMenu a {color: #048d7d}
.mpMainMenu a {color: #ff7e00}

.sub {width: 100%; background: #fff; clear: both; font-size: 18px; padding-left: 325px; line-height: 40px;
    border-top: 1px solid #f5f5f5; display: none}
.submenu1, .submenu4, .subTitle, .submenu3, .submenu6, .submenu7 {height: 40px}
.subTitle {font-family: 'NanumSquareEB'; color: #2384c6; border-right: 1px solid #f1f1f1; width: 180px; float: left; text-align: center}
.sub ul li {float: left; text-align: center; min-width: 80px; padding: 0 20px}
.submenu1 .depth2 li:nth-of-type(2) {margin-left: 20px}
.submenu2, .submenu2 .subTitle {height: 200px}
.depth2 li, .depth4 li  {font-size: 16px; font-weight: bolder}
.depth3 li {font-size: 14px; line-height: 30px; text-align: left !important}
.depth2 li:first-child .depth3 li, .depth2 li:nth-child(4) .depth3 li, .depth2 li:nth-child(5) .depth3 li {margin-left: 25px}
.depth2 li:nth-child(2) .depth3 li {margin-left: 15px}
.depth2 li:nth-child(3) .depth3 li {margin-left: 10px}
.depth3 li a {color: #666}
.sub a:hover {color: #2384c6}
.submenu2 .depth2 li {width: 140px}
.submenu3 .depth4 li {width: auto; padding: 0 15px}
/*.submenu3 .depth4 li:first-of-type {width: 130px; padding: 0}*/
.submenu4 .depth2 li {width: 120px}
.exGroup img {width: 100%; height: 100%}

.sticker {position: absolute; top: -10px; right: -10px}
.exGroup {font-family: "Noto Sans KR"}

a.listDownload {display: inline-block; width: 150px; height: 52px; position: absolute; font-size: 15px; line-height: 18px; background: #e7e7e7; padding: 10px 0;
    margin-top: 15px; border-radius: 17px; font-family: "GmarketSansM"; color: #000; margin-left: 50px}

/*회원 수강정보*/
.memberBox {background: url("../Images/memberBox_bg.jpg") no-repeat; background-size: cover; width: 100%; height: 215px; box-sizing: border-box; padding: 20px 0}
.memberBox * {font-family: "GmarketSansL"}
.memberBox .leftArea {width: 750px; float: left}
.memberBox .rightArea {width: 430px; float: right}
.memberBox .leftArea > p b {font-size: 18px}
.memberBox .leftArea .info {display: inline-block; width: 110px; height: 110px; text-align: center; margin-left: 60px;
    font-family: "GmarketSansM"; font-size: 18px; color: #fff; box-sizing: border-box; padding-top: 40px}
.memberBox .leftArea .infoBox {margin-top: 0; min-height: unset; margin-bottom: 15px}
.memberBox .leftArea .info {line-height: 26px}
.memberBox .leftArea .memberBoxBtnWrap {display: inline-block; width: 30%; float: right}
.memberBox .leftArea .memberBoxBtn img {width: 16px; vertical-align: middle; margin-right: 5px}
.memberBox .leftArea .memberBoxBtn {font-family: "GmarketSansL"; font-weight: bold; font-size: 14px; color: #fff; line-height: 26px}
.memberBox .leftArea .memberWrap {width: 650px; margin: 30px 0 20px}
.memberBox .leftArea .infoBox a {padding: 10px; border: 3px solid #fff; color: #fff; font-weight: bold; text-align: center; border-radius: 5px;
    display: inline-block; width: 100%; font-size: 18px; font-family: "GmarketSansL"}
.memberBox .leftArea .infoBox a:hover {color: #FFD700; border-color: #ffb328}
.memberBox .leftArea .infoBox a i {font-size: 30px !important; margin: 0 10px}
.memberBox .leftArea .infoBox .btnWrap a b {color: #FFD700}
.memberBox .leftArea .memberWrap .memberBoxBtn {color: #fff; font-family: "GmarketSansM"}
.memberBox .leftArea .memberWrap .info {display: inline-block; width: 110px; height: 110px; text-align: center; font-family: "GmarketSansM"; font-size: 18px; color: #fff;
    box-sizing: border-box; padding-top: 40px; background: url("../Images/memberBox_info5.png") no-repeat}
.memberBox .leftArea .memberWrap .memberBoxBtn img {width: 18px; vertical-align: middle; margin-right: 5px}
.memberBox .rightArea .studyInfoSelect {width: 100%; margin-bottom: 18px; height: auto; overflow: hidden}
.memberBox .rightArea .info {display: inline-block; width: 110px; height: 110px; text-align: center; font-family: "GmarketSansM"; font-size: 18px; color: #fff;
    box-sizing: border-box; padding-top: 40px; background: url("../Images/memberBox_info5.png") no-repeat}
.memberBox .rightArea .studyInfoSelect select {border: 1px solid #f9b232; width: 100%; border-radius: 5px; box-sizing: border-box; padding: 8px 30px 5px 10px;
    float: left; background: url(../Images/downArrow.png) 100% no-repeat; height: 36px; background-color: #fff; font-size: 14px; -webkit-appearance: none;
    -ms-progress-appearance: none; -moz-appearance: none; font-family: "GmarketSansM"}
.memberBox .rightArea .studyInfo2 .goStudyBtn {line-height: 33px; font-family: "GmarketSansM"; background: #FFD700; text-align: center; color: #494949;
    border-radius: 5px; float: left; width: 100%; box-sizing: border-box; padding-top: 3px; margin-top: 10px}
.memberBox .rightArea .studyInfo2 {width: 100%; height: auto; overflow: hidden}
.memberBox .rightArea .studyCommentBox {float: right; width: 300px; box-sizing: border-box; padding: 15px 30px; color: #fff; font-weight: bold; text-align: center;
    line-height: 26px; border: 3px solid #fff; border-radius: 5px; height: 110px}
.memberBox .rightArea .studyInfo1 {width: 100%; box-sizing: border-box; padding: 25px; color: #fff; font-weight: bold; text-align: center; margin: 0 auto;
    line-height: 26px; border: 3px solid #fff; border-radius: 5px; height: 110px;}
.memberBox .infoBox .btnWrap {height: auto; overflow: hidden}
.memberBox .infoBox .btnWrap a {padding: 10px; border: 3px solid #fff; color: #fff; font-weight: bold; text-align: center; border-radius: 5px; display: inline-block; width: 340px}
.memberBox .infoBox .btnWrap a:hover {color: #FFD700; border-color: #ffb328}
.memberBox .infoBox .btnWrap a i {font-size: 30px !important; margin: 0 !important; vertical-align: middle}
.memberBox .centerArea .csNum {color: #fff; font-weight: bold}
.memberBox .centerArea .csNum p~p {margin-top: 30px}
.memberBox .centerArea .csNum i {font-size: 20px !important}
.memberBoxType {background: #4180c3; width: 100%; height: auto; overflow: hidden}
.memberBoxType .inner a {width: 50%; float: left; box-sizing: border-box; text-align: center; padding: 10px; font-family: "GmarketSansM"; font-size: 25px; color: #fff}
.memberBoxType .inner a img {margin-right: 15px; vertical-align: middle}
.memberBoxType .inner a:first-child {border-right: 1px solid #fff}
#miniStudyInfoSelect option {line-height: 30px !important}

.sectionTitle {width: 100%; margin: 50px 0 20px; padding: 15px 10px 8px; box-sizing: border-box; font-family: "GmarketSansM"; font-size: 35px; font-weight: bolder; border-radius: 5px}
.sectionTitle img {vertical-align: middle; margin-right: 10px}
.sectionTitle .moreBtn {float: right; display: inline-block; box-sizing: border-box; text-align: center; font-family: "GmarketSansM";
    padding: 5px 20px 3px; border-radius: 5px; font-size: 18px; line-height: 20px}
.sectionTitle.recommendCourseType {color: #a051ac; background: url("../Images/section0_title1.png") no-repeat; padding-left: 100px; font-family: "GmarketSansB"; margin-top: 20px}
.sectionTitle.mNuriType {color: #0c8100; background: url("../Images/section0_title0.png") no-repeat; padding-left: 100px; font-family: "GmarketSansB"}
.recommend .contentsWrap  .sectionTitle {padding-left: 100px; font-family: "GmarketSansB"; min-height: 66px}
.recommend:nth-child(2) .contentsWrap  .sectionTitle {background: url("../Images/mainConTit1.png") no-repeat; color: #ff8019}
.recommend:nth-child(2) .contentsWrap  .sectionTitle .moreBtn {color: #ff8019}
.recommend:nth-child(3) .contentsWrap  .sectionTitle {background: url("../Images/mainConTit2.png") no-repeat; color: #484cff}
.recommend:nth-child(3) .contentsWrap  .sectionTitle .moreBtn {color: #484cff}
.recommend:nth-child(4) .contentsWrap  .sectionTitle {background: url("../Images/mainConTit3.png") no-repeat; color: #ff003c}
.recommend:nth-child(4) .contentsWrap  .sectionTitle .moreBtn {color: #ff003c}
.recommend:nth-child(5) .contentsWrap  .sectionTitle {background: url("../Images/mainConTit4.png") no-repeat; color: #594d35}
.recommend:nth-child(5) .contentsWrap  .sectionTitle .moreBtn {color: #594d35}

/*메인과정리스트*/
.recommend {width: 100%}
.mainCourseListItem:hover {transform: scale(1.05); transition: all ease-in-out 0.3s}
.mainCourseListItem .itemLabel {width: auto; height: 22px; line-height: 22px; background: #bf2600; text-align: center; font-size: 14px; color: #fff; padding: 3px 15px 0;
    position: absolute; top: -10px; left: -5px; z-index: 2; border-radius: 15px}
.mainCourseListItem .itemLabel.another {background: #2f7370}
.mainCourseListItem .cover {background: rgba(0,0,0,0.5); width: 100%; height: 100%; position: absolute; bottom: 0; opacity: 0; transition: all 0.3s linear; border-radius: 0}
.mainCourseListItem {width: 280px; height: 315px; box-sizing: border-box; border: 1px solid #494949; background: #fff; float: left; margin: 10px; position: relative; font-weight: bold; border-radius: 5px}

.mainCourseListItem:nth-of-type(4n) {margin-right: 0}
.mainCourseListItem .imgBox {width: 100%; height: 165px; box-sizing: border-box; position: relative}
.mainCourseListItem .imgBox:hover .cover {opacity: 1}
.mainCourseListItem .imgBox > img {width: 100%; height: 100%; border-top-right-radius: 3px; border-top-left-radius: 3px; border-bottom: 1px solid #494949}
.mainCourseListItem .txtBox {padding: 10px 15px; height: 48%; box-sizing: border-box; width: 100%}
.mainCourseListItem .mainCourseListItem .itemTit {font-size: 15px; font-weight: bold; margin: 0; width: inherit; font-family: "GmarketSansM"}
.mainCourseListItem .mainCourseListItem .itemTit.simpleTxts {line-height: 24px; height: 48px; -webkit-line-clamp: 2; word-break: break-all}
.mainCourseListItem .coverBtn {width: 100%; box-sizing: border-box; padding: 0 10px; text-align: center; margin-top: 25%}
.mainCourseListItem .coverBtn a {color: #fff; font-weight: bold; line-height: 30px; font-size: 18px; box-sizing: border-box; margin-top: auto; padding: 0; height: auto}
.mainCourseListItem .coverBtn a:first-child {border-right: 1px solid #fff}
.mainCourseListItem .coverBtn img {width: 30px; vertical-align: middle}
.mainCourseListItem .moreBtnWrap {width: 100%; text-align: right; margin-top: 30px}
.mainCourseListItem .courseBtn {position: absolute; bottom: 10px; right: 15px; height: 36px}
.mainCourseListItem .courseBtn > div {float: left; width: 36px; height: 36px; background-size: 100%; display: block}
.mainCourseListItem .mobileBtn {background: url("../Images/mobileBtn.png") no-repeat}
.mainCourseListItem .mobileNoBtn {background: url("../Images/noMobileBtn.png") no-repeat}
.mainCourseListItem .licenseBtn {background: url("../Images/license_off.png") no-repeat; margin-left: 5px}
.mainCourseListItem .licenseBtn:hover {background: url("../Images/license_on.png") no-repeat; background-size: 100%}
.courseListItemFooter {position: absolute; width: 100%; bottom: 10px}
.courseListItemFooter .courseBtn {bottom: 5px}


/*추천강의*/
.recommendCourse {position: relative}
.recommendCourseSlide .mainCourseListItem {width: 280px !important; height: 315px; margin: 10px}
.recommendCourseSlide .mainCourseListItem:hover {transform: scale(1)}
.recommendCourseSlide .mainCourseListItem img {display: inline-block}
.recommendCourseSlide .slick-arrow {width: 40px; height: 40px; top: -46px; opacity: 1}
.recommendCourseSlide .slick-arrow.slick-prev {right: 160px; left: unset}
.recommendCourseSlide .slick-arrow.slick-next {right: 20px}
.recommendCourseSlide  .slick-prev:before, .recommendCourseSlide .slick-next:before {font-size: 40px; color: #a051ac}
.recommendCourse .pagingInfo1 {position: absolute; top: 40px; right: 85px; font-family: "GmarketSansB"; color: #404040; font-size: 16px}
.recommendCourse .pagingInfo1 span {font-size: 28px}

.selectCategory {position: fixed; width: 810px; height: auto; overflow: hidden; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 5000; display: none}
.selectCategory .modalClose {float: right; color: #fff; font-size: 12px; font-weight: bold}
.selectCategory .popupContents {background: #fff; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; padding: 20px}
.selectCategory .popupContents p {font-family: "GmarketSansB"; font-size: 18px; margin-bottom: 10px}
.selectCategory .popupContents .labelArea {line-height: 22px; font-size: 16px; font-family: "GmarketSansM"; color: #666; margin-bottom: 30px}
.selectCategory .popupContents label {display: inline-block; width: 189px}
.selectCategory .popupContents .labelArea input {margin-right: 5px}

/*메인서치*/
.mainDivisionArea {width: 100%; text-align: right; box-sizing: border-box; margin-top: 30px}
.divisionArea.mainType {width: 480px; border: 2px solid #1555b6; display: inline-block; border-radius: 60px}
#mainCategorySelect {vertical-align: bottom; border: none; font-size: 17px; width: 115px; display: inline-block; float: left; margin-left: 20px; position: relative}
.mainType .boardSearch::before {content: '｜'; display: block; color: #c3c3c3; position: absolute; left: -22px; top: 4px; font-size: 20px}
.mainType .boardSearch {vertical-align: middle; box-sizing: border-box; display: inline-block}
.boardSearch.mainType .inputBox {font-family: "GmarketSansM"; border: none; font-size: 17px; width: 290px}
#mainCategorySearchBtn {vertical-align: middle; margin-right: 15px; cursor: pointer}

/*셀렉트박스*/
.divisionArea.mainType select {appearance: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; font-family: "GmarketSansM";
    background: url("../Images/downArrow.png") 100% no-repeat}
.divisionArea.mainType select::-ms-expand {display:none}

/*윙*/
.wing {position: fixed; right: 0px; z-index: 20; background: #56788d; width: 60px; height: 100%; transition: all 0.3s; top: 0}
.wingTit {width: 100%; height: 170px; box-sizing: border-box; padding: 25px 19px 20px}
.wingBannerBtn {text-align: center; position: absolute; bottom: 10px; width: 100%}
.wingBannerBtn a {margin-bottom: 0; display: inline-block}
.wingBannerBtn a:last-of-type {margin-top: 50px}
.wingBannerBtn a img {width: 35px; margin: 10px auto 2px}
.wingBannerBtn a p {text-align: center; font-size: 12px; color: #fff; font-family: "GmarketSansL"}
/*.wingBannerBtn p {border-top: 1px solid #3497db; padding: 10px 18px; font-size: 13px; height: 30px; line-height: 30px}
.wingBannerBtn p:last-child {border-bottom: 1px solid #3497db}
.wingBannerBtn p span {width: 80px; margin-left: 18px; vertical-align: middle; color: #fff; display: inline-block; line-height: 18px; word-break: keep-all; text-align: center}
.wingBannerBtn p img {vertical-align: middle}
.wing:hover {right: 0; transition: 0.3s}
.wing:hover .wingTit .wingTitImg.hidden {display: block}
.wing:hover .wingTit .wingTitImg {display: none}*/
.wingApp_off {text-align: center; padding: 30px 5px 0; box-sizing: border-box; width: 60px; color: #fff; font-size: 13px}
.wingApp_off img {width: 40px}
.wingApp_off img, .wingApp img {margin-top: 10px}
.wing:hover .wingApp_off {display: none}
.wing:hover .wingApp {display: block}
.wingApp {text-align: center; padding: 20px 5px; box-sizing: border-box; color: #fff; font-size: 13px}

/*퀵*/
.quick {position: fixed; bottom: 130px; right: 10%; transition: all .5s ease; z-index: 9999}
.quick a {width: 45px; height: 45px; display: block; margin: 5px}

/*메인*/
.mainQBtnWrap {background: #e1dbff}
.mainQBtn {width: 1200px; height: 74px; margin: 0 auto}
.mainQBtn > a, .mainQBtn .manualSelectBtn {width: 19.5%; text-align: center; display: inline-block; vertical-align: middle; font-size: 1.1rem; font-weight: bold; line-height: 74px}
.mainQBtn a:hover, .mainQBtn .manualSelectBtn:hover {color: #2384c6}
.mainQBtn > a img, .mainQBtn .manualSelectBtn > img {vertical-align: middle; width: 20%}
.manualSelectBtn {position: relative; color: #333; cursor: pointer}
.manualSelectWrap {position: absolute; width: 80%; background: #000; box-sizing: border-box; left: 30px; top: 68px; height: 115px; z-index: 9;
    display: none; transition: all ease-in-out 0.3s; margin-left: 20px}
.mainQBtn .manualSelectBtn.on .manualSelectWrap {display: block}
.manualSelectWrap > a {width: 100%; box-sizing: border-box; display: block; text-align: left; padding: 5px 20px; line-height: 36px; color: #fff;
    font-size: 14px; height: 60px}
.manualSelectWrap > a:first-child {border-bottom: 1px dashed #fff; border-top: 5px solid #2384C6}

/*슬라이드*/
section {width: 100%}
#sec01 {position: relative}
#sec02 {overflow-x: hidden}
/*.slideBanner:nth-child(1) {background: url("../Images/slideBg1.jpg") no-repeat center top; background-size: 100%; min-width: 1200px; height: 935px}*/
/*.slideBanner:nth-child(2) {background: url("../Images/slideBg2.jpg") no-repeat center top; background-size: 100%; min-width: 1200px; height: 935px}*/
.slideWrap {min-width: 1280px;}
.mainSlideWrap {min-width: 1280px; height: 430px}
.mainSlide {position: relative; height: 100%}
.mainSlide .slideItem:nth-of-type(1) {background: url("../Images/mainSlide4.jpg") no-repeat}
.mainSlide .slideItem:nth-of-type(2) {background: url("../Images/mainSlide3.jpg") no-repeat}
.mainSlide .slideItem:nth-of-type(3) {background: url("../Images/mainSlide2.jpg") no-repeat}
.mainSlide .slideItem:nth-of-type(4) {background: url("../Images/mainSlide6.jpg") no-repeat}
.mainSlide .slideItem:nth-of-type(5) {background: url("../Images/mainSlide7.jpg") no-repeat}
.mainSlide .slideItem:nth-of-type(6) {background: url("../Images/mainSlide8.jpg") no-repeat}
.mainSlide .slideItem {height: 430px}
.mainSlide .slideItem .inner1200 {height: 100%}
.slideBanner > img {width: 100%}
.slideBtnArea {position: absolute; top: 70%; left: 19%; right: 0; bottom: 0}
.mainSlideBtn {width: 15px; height: 15px; border-radius: 20px; background: #fff}
.mainSlideBtn.on {width: 30px}
#sec02 .contentsWrap .inner {padding: 50px 30px 110px}
#sec03 .contentsWrap .inner {overflow: visible}

.mainSlideWrap {min-width: 1200px}
.slideItem .detailViewBtn {position: absolute; width: 150px; height: 42px; line-height: 46px; text-align: center; color: #fff; font-size: 16px; border: 1px solid #fff;
    border-radius: 50px; top: 330px; left: 430px; font-family: "GmarketSansM"}
.pagingInfo {position: absolute; bottom: 15px; right: 70px; font-family: "GmarketSansM"; font-size: 24px; color: #fff }
.pagingInfo span {font-family: "GmarketSansB"; font-size: 36px}
.mainSlide .slick-prev, .mainSlide .slick-next {bottom: 5px; top: unset; width: 33px; height: 33px; border: 1px solid #fff; border-radius: 50%; line-height: 45px}
.mainSlide .slick-prev {left: 1360px; z-index: 1}
.mainSlide .slick-next {left:1530px}
.mainSlide .slick-next:before {content: '>'; font-family: "GmarketSansM"; opacity: 1}
.mainSlide .slick-prev:before {content: '<'; font-family: "GmarketSansM"; opacity: 1}
.mainSlide .slick-dots  {left: 430px; margin: 0; bottom: 120px}



/*섹션2*/
.contentsWrap {position: relative; width: 1200px; margin: 0 auto}
.Ctit {position: relative; z-index: 8; float: left; width: 300px; height: 320px}
.Ctit .select {background: url("../Images/click_icon.png") 140px 55px no-repeat}
.row {font-size: 40px; line-height: 56px;}
.sl_taste {position: relative; display: inline-block; vertical-align: middle; z-index: 4; margin-bottom: 20px; cursor: pointer}
.contentsWrap .sl_hd {border-left: none; border-right: none; border-top: none; width: 202px; display: block}
.sl_hd {position: relative; top: -4px; width: 200px; border-bottom: 4px solid #202020; overflow: visible; text-align: left; z-index: 3; background-color: transparent;}
.sl_hd strong {display: inline-block; color: #101010; font-weight: 700; font-size: 38px; line-height: 54px; padding-right: 40px}
.sl_hd:after {content: ''; position: absolute; top: 50%; right: 7px; width: 13px; height: 13px; margin-top: -9px; border-right: 2.5px solid #303030; border-bottom: 2.5px solid #303030;
    -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg)}
.sl_taste.on .sl_hd:after {margin-top: -3px; -ms-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg);
    transform: rotate(-135deg)}
.sl_taste .lay_sl{display: none}
.sl_taste.on .lay_sl {display: block; position: absolute; left: 0; top: 55px; width: 200px; padding: 7px 0; border: 1px solid #202020; background: #fff; z-index: 1; overflow: hidden}
.sl_taste .lay_sl span {display: block; width: 100%; height: 54px; padding: 5px 0 0 23px; color: #606060; font-weight: bold; font-size: 28px; line-height: 50px; text-align: left; cursor: pointer}
.sl_taste .lay_sl span.selected, .sl_taste .lay_sl span:hover {background-color: #f7f7f7; color: #101010}
.rowSmall {font-size: 16px; font-family: 'Noto Sans KR'}
.rowSmall span {color: #2384c6}
.slideArrow {margin-top: 35px}
.prev, .next {display: inline-block; width: 19px; height: 14px; cursor: pointer}
.prev {background: url("../Images/arrow.png") no-repeat}
.next {background: url("../Images/arrow.png") no-repeat; transform: rotate(180deg)}
.count {display: inline-block; font-size: 18px; font-weight: bold; margin: 0 17px}
.number {font-size: 16px}
.number strong {font-weight: bolder; font-size: 24px}


.subSlide {position: absolute; left: 320px; float: left; width: 1200px; height: 350px; overflow: hidden}
.slideWindow {position: absolute; left: 0; top: 0; min-width: 1574px}
.inner {padding: 75px 30px 110px; min-height: 350px; height: auto; overflow: hidden}
.container {height: auto; overflow: hidden; width: 100%}
.cateItemList .cateItem {width: 940px; height: 250px; margin-right: 60px}
.cateItemList .cateItem div {float: left}
.cateItemList .courseImg {width: 400px; position: relative; height: 100%}
.codeBox {position: absolute; bottom: -2px; background: #000; padding: 10px 30px; box-sizing: border-box; width: 100%; color: #fff; border-bottom-left-radius: 25px;
    border-bottom-right-radius: 25px}
.cateItemList .courseImg img {border-radius: 28px; width: 100%; height: 100%}
.cateItemList .courseDetail {width: 475px; float: left; padding: 38px 30px; box-sizing: border-box; font-size: 18px; line-height: 26px}
.cateItemList .courseTit {font-weight: bolder; width: 100%; height: 80px}
.cateItemList .courseBtn div {width: 40px; height: 40px; margin: 10px 5px 5px}
.cateItemList .mobileBtn {background: url("../Images/mobileBtn.png") no-repeat; background-size: 100%}
.cateItemList .licenseBtn {background: url("../Images/license_off.png") no-repeat; background-size: 100%}
.cateItemList .licenseBtn:hover {background: url("../Images/license_on.png") no-repeat; background-size: 100%}
.cateItemList .cover {position: absolute; top: 0; left: 0; width: 402px; height: 252px; transition: all 0.5s; z-index: 10; border-radius: 28px; background: rgba(0, 0, 0, 0.6); opacity: 0}
.cateItemList .courseImg:hover .cover {opacity: 1}
.cateItemList .cover a {display: inline-block; width: 200px; box-sizing: border-box; height: 45px; color: #fff; line-height: 45px; font-size: 22px; font-weight: 500; float: left;
    padding: 0 16px; margin-top: 26%; text-align: center}
.cateItemList .cover a img {width: 45px; vertical-align: middle; margin-right: 10px}
.slideWindow ul {opacity: 1; width: 3800px; transform: translate3d(-787px, 0px, 0px)}
.slideWindow ul li {margin-left: 790px}
_:-ms-fullscreen, :root .slideWindow ul li {margin-left: 790px}
_:-ms-lang(x), .slideWindow ul li {margin-left: 790px}
@media screen and (min-width:0\0) and (min-resolution: .001dpcm) {
    .slideWindow ul li {margin-left: 0}
}
@media \0screen {
    .slideWindow ul li {margin-left: 0}
}
.newCourseCertificate:nth-child(n+2):nth-child(-n+3) {display: none}
.newCourseLanguage, .newCourseOA {display: none}

.dim1 {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}
.cateItemList .courseAllView {position: absolute; top: 240px; right: 360px; float: none}

/*중앙배너*/
.middleBanner{display: inline-block !important; width: 100%; min-width: 1200px; margin-top: -45px; position: relative}
.middleBanner .slideBtnArea {left: 77%; top: 82%}
.midBannerBtn {width: 15px; height: 15px; border-radius: 20px; background: #fff}
.midBannerBtn.on {width: 30px}

/*섹션3*/
#sec03 .inner {padding: 110px 30px 0}
.contentsTit {font-size: 30px; font-weight: bolder; line-height: 60px}
.courseAllView {float: right; border: 2px solid #202020; border-radius: 50px; font-size: 18px; font-weight: bold; padding: 10px 20px; cursor: pointer}
.courseListItem {width: 31%; height: 420px; float: left; margin: 20px 13px}
.courseImg {width: 100%; position: relative; height: 223px}
.courseImg > img {border-radius: 28px; width: 100%; height: 100%; border: 1px solid #e4e4e4; box-sizing: border-box}
.courseDetail {width: 100%; float: left; padding: 25px 0; box-sizing: border-box; font-size: 18px; line-height: 26px}
.courseTit {width: 100%; height: 52px; margin-bottom: 28px; font-family: "Noto Sans Kr" !important; font-weight: bold; display: inline-block}
.courseTit.simpleTxts {line-height: 26px; -webkit-line-clamp: 2; word-break: break-all; display: -webkit-box !important}
.courseTxt {width: auto; float: left}
.courseTxt p strong {font-weight: bolder; color: #ff4242}
.courseBtn {float: right !important;}
.courseBtn div {width: 40px; height: 40px; margin: 10px 5px 5px; float: left}
.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%}
.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}
.courseImg:hover .cover {opacity: 1}
.cover a {display: inline-block; width: 50%; box-sizing: border-box; height: 45px; color: #fff; line-height: 45px; font-size: 22px; font-weight: 500; float: left;
    padding: 0 16px; margin-top: 26%; text-align: center}
.cover a img {width: 42px; vertical-align: middle; margin-right: 10px}
.cover a:nth-child(1) {border-right: 2px solid #fff}
.cover a:hover {font-weight: bolder}

/*메인이벤트*/
.eventList.mainType {overflow: inherit}
.mainType .eventItem {width: 23%; margin: 30px 32px 35px 0}
.mainType .eventItem:last-child {margin-right: 0}
.mainType .figImg {height: 125px}
.mainType .eventCount {right: 10px; top: 10px; padding: 6px 10px; font-size: 12px}
.mainType .figCont {padding: 8px 15px}
.mainType .figCont .tit {font-size: 16px}
.mainType .figCont .date {font-size: 12px; padding-left: 20px}
.mainType .figCont .date:before {width: 16px}

/*콘텐츠배너*/
.boxWrap {height: auto; overflow: hidden; margin-bottom: 50px; clear: both}
.boxWrapInner, .bannerBox#certification {display: inline-block; width: 50%; height: 186px; float: left}
.bannerBox {width: 100%; height: 100%; color: #fff; box-sizing: border-box; padding: 37px 30px; font-size: 14px; line-height: 30px}
.boxWrapInner .bannerBox{background: url("../Images/cs.png") no-repeat; line-height: 24px}
.bannerBox#certification {background: url("../Images/certification.png") no-repeat; cursor: pointer; font-size: 18px}
.bannerBox#certification b {font-size: 24px}
.bannerBox a {color: #fff}
.bannerBox a b {font-size: 24px; font-family: 'NanumSquareB'; color: #ffce00}
.questionMark {display: inline-block; width: 18px; height: 18px; background: #ffce00; font-weight: bold; font-size: 14px; text-align: center; line-height: 20px;
    border-radius: 15px; color: #000; vertical-align: middle}
.customerCenterLink {display: inline-block}

/*풋터*/
.footer {width: 100%; background: #375468; color: #fff; padding: 50px 0 0; height: 200px; box-sizing: border-box; font-size: 16px; line-height: 22px}
.footer .contentsWrap > div {float: left; margin: 0 20px}
.bottomLogo {width: 115px; height: 40px}
.bottomLogo img {width: 100%}
.footerBtn a {color: #fff; display: block; border: 1px solid #fff; padding: 5px 10px; width: 137px; text-align: center; margin: 5px 0; font-weight: bold;
    font-family: "NanumSquareL"}
.footerTxt {width: 785px}
.footerTxt p {font-family: "Noto Sans KR"}
.footerTxt p:last-child {margin-top: 20px}
.footerBanners {height: 80px}
.footerBanners li {display: inline-block}
.footerBanners a {display:block; height: 40px; padding: 15px 33px}
.footerBanners img {height: 40px}
.footer .contentsWrap div a {color: #fff}
.bottomMenu {background: #232b54; padding: 10px 0}
.bottomMenu a {display: inline-block; color: #fff; text-align: center; width: 15%}
.bottomMenu a:hover {color: #ffdf00}
.familyLink {width: 160px}
.familyLink button {width: 100%; background: #375468; padding: 8px 10px 5px 13px; border: 1px solid #fff; color: #fff; position: relative; font-family: "GmarketSansM";
    font-size: 15px; cursor: pointer}
.familyLinkBox {width: 160px; position: absolute; background: #fff; padding: 0 20px; box-sizing: border-box; display: none}
.familyLinkBox a {font-family: "GmarketSansM"; font-size: 14px; line-height: 22px; width: 100%; display: block; margin: 5px 0; font-weight: bold; color: #0c0c0c !important;
    text-align: left !important; padding: 0 !important; border: none !important;}
.familyLinkBox a:hover {color: #2384C6 !important;}

/*인증서팝업*/
#certificationPopup {position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 9999999; background: rgba(0,0,0,0.3); display: none}
#certificationPopup ul {width: 100%; height: 100%; position: relative}
#certificationPopup ul li {text-align: center; width: 840px; margin: 0 auto; position: absolute; top: 0; left: 0; right: 0; bottom: 0}
.cardCertLeft {height: 100%; width: 100px; font-size: 100px; color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center}
.cardCertRight {height: 100%; width: 100px; font-size: 100px; color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center}
.CertDownload {padding: 8px 12px; font-size: 16px; background: #2384c6; color: #fff; border-radius: 3px; position: fixed; right: 24%; bottom: 48px;}
.certPaper {display: flex; align-items: center; justify-content: center; padding: 20px 0; height: 100%; width: 630px}
.certPaper img {width: 95%}

/*서브 - 내일배움카드제도안내*/
.infoBox {position: relative; min-height: 140px; font-size: 18px; margin-bottom: 30px; height: auto; overflow: hidden}
.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}
.infoTxtBox {float: right; width: 1070px; box-sizing: border-box}
.infoTxtBox b {font-size: 24px; display: block; margin: 20px 0}
.infoTxtBox div {line-height: 30px}
.infoTxtBox p span {font-weight: bold}
.infoTxtBox table {border: 2px solid #ddd}
.support {height: 100px}
.support div:first-child {width: 780px; height: 100px; float: left; background: url("../Images/arrow_bg1.png") no-repeat; background-position-y: 35px;
    background-position-x: -75px}
.support div:nth-child(2) {font-size: 24px; font-weight: bold; color: #404040; position: absolute; top: 45px; right: 0}
.support div:nth-child(2) span {font-size: 40px}
.people>div {text-align: center; background: #eee; width: 24%; font-size: 16px; line-height: 24px; height: 100px; box-sizing: border-box;
    margin: 5px; float: left; font-family: "NanumSquareRB"; display: flex; align-items: center; justify-content: center}
.people span, .people h5 {font-size: 14px; line-height: 18px}
.people h5 {float: right; font-weight: 500; margin-top: 10px; font-family: "NanumSquareRB"}
.institution .center {width: 50%; float: left}
.smallTit {width: 100px; padding: 10px 15px; background: #eee; border-radius: 50px; margin-right: 20px; font-family: 'NanumSquareB'}
.institution .center > div {float: left}
.institution .center > div p {margin-top: 10px; line-height: 35px; width: 370px}

/*테이블 공통*/
table {width: 100%; font-family: '맑은 고딕','Malgun Gothic', 'Sans-Serif'; color: #666; text-align: center; border-top: 2px solid #2384c6; border-bottom: 2px solid #2384c6; font-size: 14px}
table .subject {text-align: left}
table tr th, table tr td {padding: 10px; border-bottom: 1px solid #ddd}
table thead {background: #edf8ff}
table tr:last-child td {border-bottom: 0}
.infoType tr th, .infoType tr td {border-right: 1px solid #ddd; padding: 10px}
.infoType tr th:last-child, .infoType tr td:last-child {border-right: 0}
.infoType {margin-top: 30px; border-top: none; border-bottom: none; font-size: 15px !important;}
.infoType tr th {background: #eee; font-weight: bold}
.infoType.another tr td {padding: 3px 10px}

/*콘텐츠 공통*/
.inner.center {padding: 75px 0 110px}
.innerTit {margin: 30px 0 80px}
.innerTit b {font-size: 30px}
.innerTit p {margin-top: 25px; font-family: "Noto Sans KR"}
.line {position: relative; z-index: 10}
@keyframes line { from{ width: 0%} to {width: 120%} }
.line::before {display: block; content: ''; position: absolute; bottom: -4px; left: -10%; width: 0%; height: 12px; background: #bbe3ff; z-index: -1;
    animation: line; animation-duration: 1.5s; animation-fill-mode: forwards}

.contentWrap {width: 800px; overflow: hidden; height: auto; margin: 0 auto}
/*.contentTit {padding-bottom: 10px}*/
.contentTit p {font-size: 24px; font-weight: bold; line-height: 28px; display: inline-block; width: 100%; font-family: "Noto Sans Kr"}
.contentTit > p span {font-size: 15px; color: #666; font-family: "NanumSquareRB"}


input {font-size: 14px; padding: 8px; box-sizing: border-box; height: 38px}
input[type=checkbox] {width: 18px; height: 18px; vertical-align: sub}

em {width: 20px; height: 20px; display: inline-block; background: url("../Images/search_icon.png") no-repeat; cursor: pointer; position: relative;
    left: -30px; top: 5px}

.goBtn {width: 1000px; height: 80px; color: #fff; background: #16486a; display: inline-block; text-align: center; line-height: 80px; font-size: 24px;
    font-weight: bold; margin-top: -10px}

/*서브 - 내일배움카드발급안내*/
.stepWrap {clear: both}
.stepWrapBg {background: url("../Images/stepWrap_bg.png") no-repeat; width: 100%; height: 50px; background-position-y: center; background-size: 85%}
.stepBox {width: 100%; height: 180px; font-size: 16px}
.step {width: 300px; height: 175px}
.stepBox:nth-child(1) {padding-top: 50px; margin-left: 45px}
.stepBox:nth-child(3) {margin-left: 85px}
.stepBox:nth-child(1) .step {float: left; background: url("../Images/stepBox_bg.png") no-repeat; margin-right: 50px}
.stepBox:nth-child(3) .step {float: left; background: url("../Images/stepBox_bg2.png") no-repeat; margin-left: 50px}
.step > span {display: inline-block; height: 92px; padding: 28px 20px; text-align: center; box-sizing: border-box; vertical-align: middle; width: 100%;
    line-height: 25px; font-weight: bold}
.step > b {padding: 8px 12px; line-height: 30px; display: inline-block; box-sizing: border-box; font-size: 16px}
.step > b span {font-size: 30px; font-family: 'NanumSquareEB'}
.stepBox:nth-child(3) .step > b {margin-top: 37px}
.stepBox:nth-child(3) .step > span {padding: 12px 20px}
.roundBtn {width: 300px; line-height: 40px; margin: 50px 0; border-bottom: 3px solid #2384c6; position: relative; right: 25px; float: right}
.roundBtn div {float: right; width: 40px; height: 40px; background: #2384c6; color: #fff; text-align: center; border-radius: 50px; position: absolute; right: -23px; top: 3px}
.infoBox:nth-child(3) .stepWrap {background: url("../Images/stepWrap_bg2.jpg") no-repeat; width: 100%; height: 72px; background-size: 100%}
.infoBox:nth-child(3) .step {width: 228px; line-height: 80px; float: left; height: 72px; text-align: center}

/*법정의무교육*/
.infoType.legalEduType tr th {padding: 20px 10px !important}
.infoType.legalEduType tr td:first-child {padding: 10px !important}
.infoBox.legalEduType {margin-bottom: 0}

/*약관 및 개인정보 처리방침*/
.termsBox {width: 1100px; height: 660px; background: #daf0ff; margin: 0 auto; padding: 20px; box-sizing: border-box}
.termsBox > div {width: 980px; height: 540px; font-size: 16px; background: #fff; margin: 40px auto; overflow-y: scroll; text-align: left; box-sizing: border-box;
    padding: 40px 60px; line-height: 24px}
.termsBox > div, .termsBox > div pre, .agreementBox > div, .agreementBox > div pre {font-family: 'Noto Sans KR' !important; line-height: 24px}

/*탭*/
.tabWrap .tabTitle {overflow: hidden}
.tabWrap .tabTitle li {position: relative; float: left; width: 50%; height: 57px; margin-bottom: 25px}
.tabWrap .tabTitle li a {position: relative; display: block; width: 100%; height: 100%; background: #e9eaef; font-size: 18px; font-weight: 700; color: #767676;
    line-height: 57px; text-align: center}
.tabWrap .tabTitle li.active a {background: #2384c6; color: #fff}
.tabWrap .tabTitle li::before {display: block; content: ''; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background: #dddee3; z-index: 1}
.tabWrap .tabTitle li:last-child::before {width: 0}
.tabWrap .tabTitle li.active a::after {position: absolute; bottom: -5px; left: 50%; display: block; content: ''; width: 10px; height: 10px; background: #2384c6;
    transform: rotate(45deg)}



/*학습환경설정*/
.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; }
.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 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}

/*프로그램 다운로드*/
.infoBox .num {position: relative}
.infoBox .num span {font-size: 24px; margin: 20px 0; color: #333; font-family: 'NanumSquareB'}
.container.download {margin-bottom: 50px}
.container.download div {float: left}
.container.download .imgBox {width: 42%; padding: 20px}
.container.download .txtBox {width: 52%; margin: 40px 0 20px 20px; font-size: 17px; line-height: 30px}
.container.download .txtBox a {display: inline-block; width: 258px; height: 70px; margin-top: 50px; float: right}

/*게시판 공통*/
.boardSearchWrap {float: right; margin-bottom: 10px}
.boardSearch, .boardSearchWrap > span {float: left}
.boardSearch {position: relative; right: -20px}
select {padding: 8px; vertical-align: top; height: 38px}
_:-ms-fullscreen, :root .searchInputBox {padding: 6px 35px 6px 8px;}
.searchInputBox {padding: 6px 35px 7px 8px; width: 270px}
.paging {clear: both; margin-top: 50px; text-align: center; font-size: 18px}
.paging a, .paging b {display: inline-block; padding: 0 8px}
.paging > span a {padding: 0; width: 30px; height: 30px; vertical-align: middle}
.pagePrev a {background: url("../Images/pagePrev.png") no-repeat}
.prevBtn a {background: url("../Images/prevBtn.png") no-repeat}
.pageNext a {background: url("../Images/pageNext.png") no-repeat}
.nextBtn a {background: url("../Images/nextBtn.png") no-repeat}
.downloadBtn {display: inline-block; background: url("../Images/downloadBtn.png") no-repeat; width: 110px; height: 30px; vertical-align: middle}
/*.contentsDetail {padding: 30px; line-height: 30px}*/
.boardBtnWrap {margin: 10px 0}
.commentsWrap {height: auto; overflow: hidden}
.cmtTit {line-height: 24px; border-bottom: 1px solid #2384c6; padding: 5px 10px}
.commentsWrite, .commentsList {padding: 10px}
.commentsWrite textarea {width: 85%}
.commentsWrite a.btn {float: right; width: 8.5%}
.commentsList ul li, .cmtContents {padding: 10px}
.commentsList ul li span {font-family: 'Noto Sans KR'; margin-right: 10px}
.cmtInfo {margin-bottom: 10px}
.cmtContents {font-family: 'Noto Sans KR'; padding: 10px 20px; color: #666; font-size: 14px}
.empty {text-align: center}
.writer {font-size: 18px; padding-right: 15px}
.reply {padding-left: 4% !important}
.replyIcon {background: url("../Images/replyIcon.png") no-repeat; width: 15px; height: 15px; background-size: 100%; display: inline-block}
.writeBox {min-height: 300px}
.commentNum {margin-left: 5px}

.BoardDetailWrap {border-top: 2px solid #2384c6; border-bottom: 2px solid #2384c6}
.boardTop {position: relative; padding-bottom: 40px; margin-top: 40px}
.boardTop h2 {margin-bottom: 18px; font-size: 24px; font-weight: 700}
.boardTop>span {color: #666}
.secWrap {padding: 50px 0}
.boardTop:after {content: ''; display: block; position: absolute; bottom: 0; left: 50%; width: 50px; height: 1px; margin-left: -25px; background: #999}
.detailContent img {vertical-align: top}

/*이벤트*/
.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 {padding-bottom: 12px; 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; background: #ffbf0b; border-radius: 30px; font-size: 16px;
    font-weight: 700; color: #192649}
.figCont .date:before {content: ''; display: block; position: absolute; top: -2px; 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}
/*.tabWrap.eventType .tabTitle li.active a {background: #6dc63d}
.tabWrap.eventType .tabTitle li.active a::after {background: #6dc63d}*/

/*자주하는 질문*/
.selectBox span {display: inline-block; background: #2384c6; padding: 0 20px; color: #fff; line-height: 41px}
.secWrap .selectBox {float: left; width: 15%}
.secWrap .selectBox select {width: 100%}
.tableWrap {float: right; width: 83%}
.secWrap.boardType {overflow: hidden; height: auto; width: 100%; padding: 0}
.FAQTable tr td {padding: 10px 15px; width: 1000px}
.FAQTable tr td b {font-size: 18px}
.FAQTable .answerTit {vertical-align: top}
.answer {display: none}
.answer.on {display: block}
.answer td {padding-left: 40px !important;}
.question .modify {float: right; border-color: #2384c6; color: #2384c6}
.FkeywordTable tr th {border-right: 1px solid #ddd}
.FkeywordTable tr th:last-of-type {border-right: 0}

/*1:1 상담*/
.noreply {color: #ff4242}
.consultingWrite {display: none}

/*후기*/
.star {height: 20px; overflow: hidden}
.star span {display: inline-block; background: url("../Images/starbg.png") repeat-x; width: 100%; 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}

/*전화상담*/
.TelType label {line-height: 30px;}
.TelType input {vertical-align: middle}
.TelType span {margin-left: 30px}
/*#TelReservationModal {position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 999; background: rgba(0,0,0,0.3); display: none}*/
.TelReservationWrap.viewOk {display: block}
.TelReservationWrap {width: 600px; height: 530px; background: #fff; padding: 15px; position: absolute; top : 27%; right: 0; bottom: 0; left: 0; display: none;
    border: 1px solid #b8b8b8; z-index: 5000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); margin: 0 auto}
.TelReservationWrap table .writeBox {min-height: auto; height: 100px; width: 96%}



/*알림메시지*/
.noticeMassageBox {padding: 10px; overflow: hidden; height: auto; position: relative}
.noticeMassageBox div {float: left}
.messageTit img {width: 25px; margin-right: 5px; vertical-align: middle}
.massageWrap {font-size: 12px; line-height: 20px; padding: 10px 20px; box-sizing: border-box; width: 100%; background: #edf8ff}
#message {position: fixed; top:95px; right: 70px; width: 315px; border: 1px solid #ddd; max-height: 680px; display: none; z-index: 10000}
#message.viewOk {display: block}
.contentWrap.messageType {width: 100%; background: #fff}
.messageTit {border-color: #ddd}
.massageWrap .simpleTxt {width: 255px; height: 16px}
#message .scroll {max-height: 620px; height: auto}

/*자격증 정보*/
.licenseItem {width: 373px; height: 250px; display: inline-block; margin: 10px 12px; position: relative}
.licenseItem img {border-radius: 30px; width: 100%; height: 100%; border: 1px solid #ebebeb}
.licenseTit {width: 340px; padding: 5px 10px}
.wrap.licenseType {margin: 0 auto}
.eventCount.licenseType {bottom:20px; top: auto; padding: 7px 15px}
.noInfo.licenseType {font-size: 18px; height: 300px; width: 50%; margin: 0 auto; padding: 115px 0; box-sizing: border-box; border-radius: 30px; line-height: 34px}
.courseDetailTit, .courseDetailTxt {float: left}
.courseDetailTit {width: 18%}
.courseDetailTit p {width: 70%; text-align: center; border: 1px solid #2384c6; padding: 10px; margin: 0 auto; font-weight: bold}
.courseDetailTxt {width: 82%; font-size: 17px; line-height: 30px; padding-left: 20px; box-sizing: border-box}
.courseDetailTxt table {margin: 0 !important;}
.courseScore {width: 100px; vertical-align: sub; display: inline-block}
.courseReview table {border-color: #404040}
.courseReview table .star span {vertical-align: super}


/*공통아이콘*/
.icon {display: inline-block; width: 70px; height: 16px; padding: 5px 10px; color: #fff; background: #003d76; font-family: "NanumSquareRB"; letter-spacing: -1px}
.icon.card {background: #ff7e00}
.hoverBtn a.on {background: #2384C6; color: #fff; border: 1px solid #2384C6}
.icon.noRefund {background: #228e86}
.icon.voucher {background: #ff7291}
.icon.package {background: #ff4343; width: 50px}
.noRefund.courseListType, .card.courseListType {display: inline-block; width: 22px; height: 22px; padding: 0 !important; color: #fff; font-size: 14px;
    line-height: 25px; font-weight: normal; border-radius: 26px; box-sizing: border-box; text-align: center; margin-left: 5px; cursor: pointer}
.icon.couponIcon {background: #b46fff}
.couponIcon.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}
.bookFlag {background: #58e257; padding: 5px; border-radius: 5px; font-family: "NanumSquareREB"; font-weight: normal; color: #fff; margin-right: 5px}
.itemFlag {background: #27c4de; padding: 5px; border-radius: 5px; font-family: "NanumSquareREB"; font-weight: normal; color: #fff; margin-right: 5px}


.showhide {line-height: 38px}
.showhide input[type=radio] {height: 16px; width: 24px; vertical-align: middle}
.modalTit{font-family: "NanumSquareEB"; font-size: 18px; margin-bottom: 10px}

/*스터디팝업*/
#timebarStudy {color: #ff6c00; font-weight: bolder; line-height: 28px; position: fixed; right: 15px; height: 28px}
.studyPopupTitle {border-bottom: 2px solid #2384C6; padding: 10px 10px 0; height: auto; overflow: hidden; box-sizing: border-box}
.studyPopupTitle div {padding: 5px; box-sizing: border-box}
#timebarStudy img {width: 20px}
.iframeArea {padding: 5px 10px 0}

/*메인팝업*/
.pBtn {margin: 0 auto}
.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}
.closeBtn {font-size: 14px; color: #fff; font-family: "NanumSquareL"; line-height: 36px; font-weight: 600; background: #2384C6; cursor: pointer}

/*슬라이드 메인 팝업*/
.slideMainPopupWrap {width: 450px; height: 450px; position: absolute; z-index: 16; background: white; cursor: move; top: calc((100vh - 450px) / 2); left: calc((100vw - 450px) / 2)}
.slideMainPopupWrap .slideItem {width: 450px; height: 450px}
.slideMainPopupWrap .slideItem img {max-width: 450px}
.slideMainPopupWrap .slick-dots {width: 100%; margin: 0 auto; bottom: 0; left: 0}
.slideMainPopupWrap .slick-dots li button:before {border: none}
.slideMainPopupWrap .slick-dots li.slick-active button:before {background: #000}
.slideMainPopupWrap .slick-dots li button:before {background: #fff}
.slideMainPopupNew {position: relative; height: 450px; overflow: hidden; z-index: 3; box-shadow: 5px 0 5px rgba(0, 0, 0, 0.2)}
.slidePopupCloseBtn {position: absolute; right: 0; top: 0; color: #fff; font-size: 20px; width: 30px; height: 30px; line-height: 28px;
    text-align: center; border: 2px solid #fff; box-sizing: border-box; margin: 5px; z-index: 5; background: rgba(0,0,0,0.3)}
.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: #2384c6; cursor: pointer}
.slideMainPopupTextNew {position: absolute; top: 0; right: -106px; height: auto; overflow: hidden; width: 106px; z-index: 1}
.slideTextGo {display: inline-block; width: 100px; height: auto; box-sizing: border-box; padding: 5px; background: #fff; margin-bottom: 5px; cursor: pointer;
    font-size: 12px; font-weight: bold; line-height: 18px; border-right: 15px solid #2384c6; text-align: center; box-shadow: 2px 0 5px rgba(0, 0, 0, 0.2)}
.slideTextGoBox {width: 100%; margin: 0 auto; font-family: "GmarketSansL"; color: #000}
.slideTextGo.on {border-color: #ff6600; transition: all 0.1s ease-in-out; width: 106px}

/*오시는 길*/
.locationInfoBox {width: 100%; height: auto; overflow: hidden}
.locationInfoBox img {width: 60px;float: left; margin: 0 20px}
.locationInfo {float: left; line-height: 28px; font-size: 17px}
.locationInfo b {font-size: 18px; display: inline-block; margin-bottom: 10px}

/*대표인사말*/
.greeting {position: relative; line-height: 28px}
.greeting::after {position: absolute; background: url("../Images/ceo_bg.png") no-repeat; background-position: 680px 0;  content: ''; display: block;
    top: 0; left: 0; width: 100%; height: 100%}
.greeting p {line-height: 40px}
.greeting > pre {font-family: "NanumSquareR"}

/*사업영역*/
.infoBox.businessType .stepWrap {background: url(../Images/stepWrap_bg2.jpg) no-repeat; background-size: 124% 100%; height: 72px; background-position-x: -278px}
.businessTxt {margin-bottom: 30px; line-height: 28px}
.infoBox.businessType .step {width: 25%; box-sizing: border-box; display: flex; align-items: center; justify-content: center; float: left; height: 100%}
.infoBox.businessType .step > b {font-size: 18px}
.infoBox.businessType .step > b span {font-size: 24px; display: inline-block; margin-right: 8px; letter-spacing: -3px}
.infoContent {width: 277px; height: 300px; float: left; border: 1px solid #ddd; box-sizing: border-box}
.tbTitle {border-top: 2px solid #2384C6; font-weight: bold; font-size: 15px}
.infoContent tbody tr td {text-align: left}
.infoContent tbody tr th {background: #fafafa}
.infoBox.businessType {font-size: 18px; margin-bottom: 30px; height: auto; overflow: hidden}
.infoBox.businessType .tbTitle {font-weight: bold; font-size: 18px; font-weight: bold; margin-bottom: 5px; border-top: 0}
.infoBox.businessType .tbTitle i {font-size: 24px !important}
.infoBox.businessType table {border-top-color: #6f6f6f; border-bottom: 1px solid #ddd}
.infoBox.businessType table tr:last-child th {border-bottom: 0}
.businessType table tr th, .businessType table tr td {font-size: 16px; font-family: "NanumSquareR" !important}
.infoBox.businessType table tr th {background: #f5f5f5}

/*수강신청 및 완료, 결제상세*/
.paymentbg1 {background: url("../Images/paymentbg1.png") no-repeat; width: 100%; height: 107px; margin-bottom: 50px; background-size: 100%}
.paymentbg2 {background: url("../Images/paymentbg2.png") no-repeat; width: 100%; height: 107px; margin-bottom: 50px; background-size: 100%}
.wrap.paymentType {width: 94%}
.sign {width: 20px; height: 20px; border: 1px solid; border-radius: 20px; line-height: 21px; font-weight: bolder; margin-top: 15px; font-size: 20px}
#bookNewAddr p:nth-of-type(2){margin-top: 8px}
#bookNewAddr p span {width: 152px; font-size: 15px !important; text-align: center; height: 32px; background: #2384c6; color: #fff !important; line-height: 32px}
.addr1 {width: 525px !important}
.addr2 {width: 175px !important}
.half.paymentType {width: 48%; margin-left: 36px}
.half.paymentType:nth-child(1) {margin-left: 0}
.Number {width: 80px}
.half.paymentType .textBox {height: 162px; text-align: left; width: 510px; border: 1px solid #ddd; padding: 10px; overflow: auto; font-family: "Noto Sans KR" !important}
.half.paymentType .textBox pre {font-family: "Noto Sans KR" !important}
#couponModal {position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 999; background: rgba(0,0,0,0.3); display: none}
#couponModal.viewOk {display: block}
.couponWrap {width: 400px; height: auto; overflow: hidden; background: #fff; padding: 15px; margin: 300px auto 0}
.couponWrap label {display: block}
.couponCancel {display: inline-block; line-height: 38px; float: right; color: #2384C6; cursor: pointer; text-decoration: underline; margin-right: 15px !important}
.payKindWrap {border-top: 2px solid #2384C6; border-bottom: 2px solid #2384C6}
.wrap.paymentType input[type=text] {height: 28px !important; padding: 3px !important}
.wrap.paymentType select {height: 28px !important; padding: 3px !important}
.cashcheck {height: 18px !important}
.half.paymentType table {height: 210px}
#bookNewAddr p .btn {height: 23px; line-height: 24px}
.paymentTb tr:last-child td {border-bottom: 0 !important}
.pointSelect td, .awardSelectBox td {border-bottom: 1px solid #ddd !important}

/*공지팝업*/
.noticePopup {width: 500px; height: 500px; 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/240226_nitice.jpg") no-repeat; z-index: 20}
.noticePopup.exGroupType {background: url("../Images/exGroupPaymentPopup.png") no-repeat !important}
.noticePopup.exGroupType1 {background: url("../Images/exGroupPopup.png") no-repeat !important; box-shadow: none; left: 0; top: 150px}
.noticePopup.licenseType {background: url("../Images/cardNotice_200323.png") no-repeat !important}
.noticePopup .btnWrap {position: absolute; bottom: 0; width: 100%}
.noticePopup .noticePopupBtn {text-align: center; color: #fff; display: inline-block; width: 50%; height: 40px; line-height: 40px; background: #2384C6;
    font-weight: bold; box-sizing: border-box; float: left}
.noticePopup .noticePopupBtn:first-child {border-right: 1px solid #fff}
.noticePopup .modalClose {color: #fff}
.noticePopup .modalClose, .noticePopup2 .modalClose {font-weight: bold; margin: 5px; cursor: pointer}
.allDayCloseBtn {position: absolute; bottom: 45px; left: 10px; color: #fff; font-size: 14px; font-weight: bold}
.allDayCloseBtn input {vertical-align: middle !important}

.noticePopup2 {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/popup_220103_2.png") no-repeat; z-index: 20; background-size: 100%}

/*법정교육상담*/
.eduConsult.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)}
.eduConsultPopup .contents {width: 1000px; height: 840px; background: #fff; position: absolute; top: 6vh; left: calc(100% / 2 - 500px); padding: 20px; box-sizing: border-box; z-index: 5000}
.eduConsultPopup .modalClose {line-height: 19px }
.eduConsultPopup table th {background: #edf8ff}
.eduConsultPopup table td {text-align: left}
.eduConsultPopup table th, .eduConsultPopup table td {padding: 3px 10px}
.textareaBox.eduConsultType {height: 150px; overflow-y: auto; padding: 20px; box-sizing: border-box; border: 1px solid #bbb; font-family: "Noto Sans KR"}
.eduConsultPopup table td textarea {width: 745px}
.eduConsultPopup .text1 {line-height: 20px}
.zipcodeBtn {height: 38px; background: #2384C6; cursor: pointer; color: #fff; line-height: 37px; box-sizing: border-box; display: inline-block; padding: 0 15px; vertical-align: middle}

/*학습지원센터 메뉴탭*/
.tabWrap.MyPageType ul li {width: 20%}
.tabWrap.MyPageType ul li.active a::after {display: none}
.tabWrap .tabTitle li.active a {background: #2384c6; color: #fff}

/*카드뉴스*/
.licenseType .item {margin: 30px 10px 10px; height: 460px; width: 380px}
.licenseType .item .imgBox {height: 380px; width: 380px}
.licenseType .item .cardNewsTitle, .licenseType .item .cardNewsWrap {width: 380px}
.cardNewsSlide {width: 600px; height: auto; margin: 0 auto}
.cardNewsSlide .slick-prev, .cardNewsSlide .slick-next {width: 21px !important; height: 39px !important}
.cardNewsSlide .slick-prev::before, .cardNewsSlide .slick-next::before {content: ''}
.cardNewsSlide .slick-prev {background: url("../Images/prevArrow.png") no-repeat !important; left: -50px}
.cardNewsSlide .slick-next {background: url("../Images/nextArrow.png") no-repeat !important; right: -50px}
.cardNewsSlide .slick-dots {position: static; margin: 10px 0}
.cardNewsSlide .slick-dots li.slick-active button:before {background: #000}
.cardNewsSlide .slick-dots li button:before {border-color: #000}
.fileItemBox {border-bottom: 1px dashed #ccc; padding-bottom: 3px}
.fileItemBox:last-child {border-bottom: none}
.mainReview:nth-child(1) {background: url("../Images/mainReview_bg.jpg") no-repeat; height: auto; overflow: hidden; z-index: 5; background-size: cover}
.mainReview:nth-child(2) {background: #f3f3fb; height: auto; overflow: hidden}
.mainReview:nth-child(1) .list {height: 430px}
.contentsHead p {font-weight: bolder; font-size: 30px; text-align: center; padding: 30px 0}
.item {margin: 10px 20px; width: 260px; height: 355px; float: left}
.cardNewsWrap {width: 260px; font-size: 18px; border-radius: 50px; float: left}
.cardNewsWrap .imgBox {width: 260px; height: 260px}
.cardNewsWrap .imgBox img {width: 100%; height: 100%}
.cardNewsTitle {width: 260px; font-weight: bold}
.cardNewsTitle.simpleTxts {font-size: 15px; font-weight: normal; color: #007eff; -webkit-line-clamp: 3; height: 60px; line-height: 20px}

/*수강후기*/
.cardReviewList .item {width: 280px; background: #fff; height: 165px; position: relative; border-radius: 20px; margin: 40px 10px 10px}
.cardReviewList .item .itemInfo {width: 55%; float: right; padding: 15px; font-weight: bold}
.cardReviewList .item .txtBox {width: 100%; height: 50px; box-sizing: border-box; padding: 5px 20px; clear: both; line-height: 22px; -webkit-line-clamp: 2}
.cardReviewList .item .txtTitleBox {width: 100%; box-sizing: border-box; margin-top: 5px; padding: 0 20px; color: #adadad; font-size: 12px; height: auto; overflow: hidden}
.cardReviewList .item .imgBox {width: 100px; height:100px; position: absolute; top: -35px; left: -10px}
.cardReviewList .item .imgBox img {width: 100%; border-radius: 50px;}
.linkBanner {position: absolute; right: 0; width: 300px}
.linkBanner.LinkType2 {position: absolute; left: 0; right: unset; top: 45px}
.linkBanner img {border-radius: 20px}
.bestIcon, .courseDetailTxt .bestIcon {font-family: "GmarketSansM"; font-size: 10px !important; background: #25ffcd; padding: 3px 5px 1px; border-radius: 5px; font-weight: bold; vertical-align: middle}

/*자격증 취득후기*/
.linkBtnWrap {position: relative; display: inline-block; width: 20%; float: left}
.linkBtnWrap .sticker {background: #ffdb00; font-size: 12px; padding: 4px 6px 3px; font-family: "GmarketSansM"; border-radius: 5px; position: absolute;
    line-height: 18px; top: -28px}
.linkBtnWrap .sticker::after {content: ''; width: 10px; height: 10px; display: inline-block; position: absolute; background: #ffdb00; bottom: -5px; left: 25%;
    transform: rotate(45deg)}
.bestReviewBtn {float: right}
.bestReviewBtn .btn:first-of-type {background: #e13223; border-color: #e13223; color: #fff}

/*패키지 공통*/
.packageInner {width: 1200px; margin: 0 auto}
.packageTitle {padding:70px 0 50px}
.packageBox {width: 100%; height: 175px; margin-bottom: 50px; position: relative}
.packageCourserLinkBtn {font-family: "NanumSquareEB"; font-size: 18px; display: block; position: absolute; color: #fff; right: 22px; top: 15px;
    width: 146px; height: 30px; line-height: 30px; box-sizing: border-box}
.packageCourserOrderBtn {width: 150px; height: 40px; display: block; box-sizing: border-box; background: #fff; border-radius: 20px; line-height: 38px;
    font-family: "NanumSquareEB"; font-size: 18px; right: 20px; bottom: 15px; position: absolute}
.dim.chapterPopupType {display: none}
.chapterPopup {width: 900px; height: 600px; position: fixed; box-sizing: border-box; background: #fff; left: calc((100vw - 900px) / 2);
    top: calc((100vh - 600px) / 2); z-index: 50; display: none}
.chapterPopup .courseTable, .packageInner .courseTable {margin: 0}
.packageInner .courseListItem {height: auto; overflow: hidden}
.packageInner .courseListItem .courseImg {height: 250px}
.packageInner .courseListItem:last-child {margin-right: 0}
.packageInner .courseTable {background: #fff}
.tbWrap {width: 100%; height: 88%; overflow-y: auto; padding: 0 20px; box-sizing: border-box}
.packageTb {font-size: 16px; margin-bottom: 30px}
.packageTb thead {background: #dfe6f7; font-family: "NanumSquareEB"; font-size: 18px}
.packageTb tbody tr:nth-child(even) {background: #fafafa}
.packageTb tbody tr:hover {background: #fdffe3}
.packageTb tbody tr td {font-family: "NanumSquareR"}
.packageTb tbody tr:last-child td {border-bottom: none}
.courseTitle {margin: 20px 0 30px; font-family: "Noto Sans KR"; font-weight: bold; font-size: 20px; word-break: keep-all; height: 60px}
.chapterPopup.on {display: block}
.package6ConBox {width: 220px; line-height: 90px; text-align: center}
.package6ConBox2 {width: 980px; box-sizing: border-box; height: 90px}
.package6ConBox2 .courseTitle {width: 435px; background: #fff; padding: 15px; height: 90px; box-sizing: border-box; display: inline-block; margin: 0; text-align: left}
.plus {text-align: center; font-size: 45px; line-height: 90px; display: inline-block; vertical-align: bottom; margin: 0 20px}
.packageBtnWrap {position: fixed; bottom: 0; background: #255fef; width: 100%; height: 120px; box-sizing: border-box; z-index: 10; line-height: 120px; opacity: 0;
    transition: all 0.3s ease-in-out}
.packageFooter.packageType {background: #255fef; width: 100%; height: 120px; box-sizing: border-box; z-index: 10; line-height: 120px; margin-top: -30px}
.packageBtnWrap.on {opacity: 1}
.packageBtnBg {position: absolute; left: 0; top: -30px}
.packageBtnTxt {position: absolute; left: 270px; color: #f4ff48; font-size: 30px; font-weight: bold; font-family: "GmarketSansM"}
.packageBtnTxt.packageType {position: absolute; left: 250px; color: #f4ff48; font-size: 24px; font-weight: bold; font-family: "GmarketSansM"}
.packageFooter .courseRegist {display: inline-block;  width: 200px;  height: 50px; line-height: 50px; border-radius: 10px; box-sizing: border-box; color: #fff;
    font-size: 18px}
.courseDateSelect.packageType {display: inline-block;  width: 180px;  height: 50px; line-height: 50px; border-radius: 10px; box-sizing: border-box; color: #fff;
    font-size: 18px; background: #2384C6; float: right; text-align: center}
#calendar .fc-widget-header {border: 1px solid #2384C6}
#calendar .fc-widget-content{border: 1px solid #c1c1c1}
#calendar .fc-border-separate {border: 2px solid #2384C6}
#calendar .fc-widget-content.selectDate {background: #fffdc5}
#calendar .fc-widget-content.selectDate:hover {background: #2384C6; color: #fff}
#calendar .fc-state-default {border: none; background: #fff; box-shadow: none; text-shadow: none}
#calendar .fc-state-default:hover {background: #ffecf3}
.packageGift {width: 18px; height: 18px; margin-right: 5px; vertical-align: middle}
.packageGiftLabel {font-size: 16px; font-weight: bold; font-family: "NanumSquareR"}
.packageGiftLabel:hover {color: #2384C6}
.packageGiftSelect {width: 100%; height: 450px; overflow-y: scroll; position: relative}
.packageTbHead tr th {font-weight: bold; font-family: "NanumSquareR"}
.packageGiftSelect .packageTb {margin-bottom: 0; border-top: 0; border-bottom: 0}
.packageGiftSelect .packageTb input[type=radio] {width: 18px; height: 18px}
.packageTbBtn {border-top: 2px solid #2384C6; border-bottom: 2px solid #2384C6; box-sizing: border-box; width: 100%; height: auto; overflow: hidden; padding: 20px 10px; text-align: left}
.packageGiftLabel.on, .packageGiftSelect label.on {color: #2384C6}
.hrdBtnWrap {text-align: left; padding-left: 35px}

#package .packageWrap:nth-of-type(3) {margin-top: -20px}
#package .packageWrap img {vertical-align: top}
#package .packageWrap:nth-of-type(4) {background: #2795b0}
#package .packageWrap:nth-of-type(6) {background: #251e1c}
#package .packageWrap:nth-of-type(8) {background: #364f9f}
#package .packageWrap:nth-of-type(10) {background: #973676}
.packageWrap {min-width: 1200px; height: auto; overflow: hidden; box-sizing: border-box; text-align: center}
.packageSelectBtn {width: 300px; float: right; line-height: normal}
.packageSelectBtn a {height: 70px; width: 100%}
.exGroupCart p.packageType {color: #fffd2d}

/*금융공기업*/

#package.finance .packageWrap:nth-of-type(2) {background: #edf5fd; padding: 100px 0}
#package.finance .packageWrap:nth-of-type(5), #package.finance .packageWrap:nth-of-type(7) {background: #f4f4f4; padding: 100px 0}
#package.finance .packageWrap:nth-of-type(6) {background: #a8cffa; padding: 100px 0}
#package.finance .packageBtnWrap {background: #255fef}

/*패키지1*/
.movingArrow {position: absolute; bottom: 5px; width: 38px}
.movingArrow.first {left:285px}
.movingArrow.second {right: 285px}
.packageCourserOrderBtn.type1 {border: 2px solid #ffc000}
.packageCourserOrderBtn.type2 {border: 2px solid #a4a8ff}
.packageCourserOrderBtn.type3 {border: 2px solid #38c89e}
.packageSec3Footer {width: 100%; background: #f5f5f5; padding: 50px 0}
.packageTb2 {width: 950px; height: 220px; border: 2px solid #000; background: #fff; font-family: "NanumSquareEB"; font-size: 18px; color: #000}
.package6Wrap {background: #ffe5f0}
.package7TopBg {background: url("../Images/package1_sec67bg.png") repeat-x; height: 18px; margin-top: -18px}
.package7Wrap {background: #000ad4}
.package2Wrap {background: #345a93; padding: 70px 0}
.awardLinkBtn {width: 215px; height: 50px; border: 2px solid #000; background: #ff4343; color: #fff; font-family: "NanumSquareR"; font-weight: bold; text-align: center;
    border-radius: 25px; display: inline-block; box-sizing: border-box; line-height: 50px; font-size: 18px; position: absolute; right: 250px; bottom: 0}

/*패키지2*/
.packageSec.package2_3type {background: #454fd8; padding-bottom: 100px; margin-top: 70px}
.packageBox.package2_3type {width: 357px; height: 465px; float: left; margin-bottom: 0; margin-right: 64px; overflow: hidden}
.packageBox.package2_3type:nth-child(3) {margin-right: 0}
.packageCover {position: absolute; top: 0; left: 357px; transition: all 0.3s ease-in-out}
.packageBox.package2_3type:hover .packageCover {left: 0}
.box.package2_4type {background: #28245d; padding-top: 20px}
.packageBox.package2_4type {height: auto; overflow: hidden; position: static; margin-bottom: 0}
.packageTxtBox {display:inline-block; width: 1044px; text-align: center; margin-bottom: 0; position: static; font-size: 25px; height: 152px; box-sizing: border-box;
    vertical-align: top; line-height: 50px}
.packageTxtBox p {font-size: 40px; font-family: "NanumSquareEB"}
.packageTxtBox p span {font-family: "Noto Sans KR"; font-weight: 700}
.packageTxtBox .line::before, .packageImgBox .imgBox .cover a.line::before {background: #ffd8e9}
.packageImgBox .imgBox .cover a.line::before {height: 6px; bottom: 2px}
.dashedLine {width: 8px; height: 248px; background: url("../Images/dashedLine.png") no-repeat; padding: 65px 70px; display: inline-block; background-position: center}
.packageBox.package2_4type:last-child .dashedLine {background: none}
.packageImgBox {display:inline-block; width: 1044px; vertical-align: top}
.packageImgBox > div {float: left; padding: 50px 0 50px 50px}
.packageImgBox .label {background: #454fd8; color: #fff; font-size: 18px; font-weight: bold; display: block; width: 80px; height: 36px; text-align: center; line-height: 36px;
    border-top-left-radius: 10px; border-top-right-radius: 10px}
.packageImgBox .imgBox {position: relative; width: 362px; height: 184px; box-sizing: border-box; border: 3px solid #454fd8}
.packageImgBox .imgBox img {width: 100%}
.packageImgBox .imgBox .cover {width: 100%; height: 100%}
.packageImgBox .imgBox:hover .cover {border-radius: 0; opacity: 1}
.packageImgBox .imgBox .cover a {border-right: 0; position: absolute; left: 32%; top: 40%; padding: 0; margin: 0; width: 130px; float: none}
.packageImgBox .imgBox .cover a:hover {font-weight: normal}
.packageImgBox .txtBox {background: #454fd8; text-align: center; word-break: keep-all; width: 362px; padding: 10px 50px; box-sizing: border-box; color: #fff;
    font-size: 18px; min-height: 62px}

/*패키지3*/
.packageSec.package3_2type {background: url("../Images/package3_sec2bg.png") no-repeat; background-size: cover}
.packageSec.package3_3type {background: url("../Images/package3_sec3bg.png") no-repeat; background-size: cover}
.packageSec.package3_3type .packageInner {position: relative; padding: 137px 0 80px; background: url("../Images/package3_sec3_contents3.png") center 72% no-repeat; min-height: 840px;
    box-sizing: border-box; overflow: hidden}
.sec3con1 {position: absolute; top: 30px; left: -500px; transition: all 0.3s ease-in-out}
.sec3con2 {position: absolute; bottom: 30px; right: 0; transition: all 0.5s ease-in-out; opacity: 0}
.packageSec.package3_4type {background: url("../Images/package3_sec4bg.png") no-repeat; background-size: cover; padding: 50px 0}
.package3_4type .packageTitle {padding-top: 30px}
.package3_4type .packageTitle p {font-size: 30px}
.contents1.package3_4type .packageImgBox {width: 100%; background: url("../Images/package3_sec4_contents1_1plus.png") center center no-repeat}
.contents2.package3_4type .packageImgBox {width: 100%; background: url("../Images/package3_sec4_contents2_plus.png") center center no-repeat}
.contents3.package3_4type .packageImgBox {width: 100%; background: url("../Images/package3_sec4_contents3_plus.png") center center no-repeat}
.package3_4type .packageImgBox > div {position: static; display: inline-block; padding: 0; margin: 0 100px}
.package3_4type .packageImgBox > div p {margin-bottom: 10px; font-weight: bold}
.contents1.package3_4type .packageImgBox > div p {color: #048d7d}
.contents2.package3_4type .packageImgBox > div p {color: #4f6ac1}
.contents3.package3_4type .packageImgBox > div p {color: #ad43ef}
.package3_4type .packageImgBox .imgBox {border: 3px solid}
.contents1.package3_4type .packageImgBox .imgBox {border-color: #048d7d}
.contents2.package3_4type .packageImgBox .imgBox {border-color: #4f6ac1}
.contents3.package3_4type .packageImgBox .imgBox {border-color: #ad43ef}
.package3_4type .packageImgBox .txtBox {line-height: 24px}
.contents1.package3_4type .packageImgBox .txtBox {background: #048d7d}
.contents2.package3_4type .packageImgBox .txtBox {background: #4f6ac1}
.contents3.package3_4type .packageImgBox .txtBox {background: #ad43ef}
.contents1 .courseTable.learningChoose, .contents1 .learningChoose tr td {border-color: #048d7d !important}
.contents2 .courseTable.learningChoose, .contents2 .learningChoose tr td {border-color: #4f6ac1 !important}
.contents3 .courseTable.learningChoose, .contents3 .learningChoose tr td {border-color: #ad43ef !important}
.contentsBox {background: #f5f5f5; padding: 25px 0; box-sizing: border-box; margin-top: 10px; height: auto; overflow: hidden}
.contentsBox > img {margin: 0 70px}
.courseListItem.package3_4type {width: 560px; text-align: left; margin: 0 20px; height: 130px}
.courseListItem.package3_4type .courseImg {width: 170px; height: 96px; border-radius: 0; float: left; box-sizing: border-box; border: 2px solid;}
.contents1 .courseListItem.package3_4type .courseImg {border-color: #048d7d}
.contents2 .courseListItem.package3_4type .courseImg {border-color: #4f6ac1}
.contents3 .courseListItem.package3_4type .courseImg {border-color: #ad43ef}
.courseListItem label {cursor: unset}
.courseListItem.package3_4type .courseTable {width: 370px; margin-left: 20px; float: left}
.courseListItem.package3_4type .courseImg > img {border-radius: 0; border: none}
.contentsBox .priceBox {width: 1162px; box-sizing: border-box; height: 104px; background: #fff; border: 10px solid #dcdcdc; margin: 0 auto; position: relative;
    font-family: "NanumSquareEB"; font-size: 24px; text-align: left; padding: 20px}
.priceBox .realPrice {font-size: 48px; letter-spacing: -2.5px; color: #ff4242; margin-left: 40px}
.priceBox > span {display: inline-block}
.priceBox > span:first-child {letter-spacing: -3px}
.priceBox .priceArrow {position: absolute; top: 40px; left: 13px}
.priceBox .courseApplyBtn {position: absolute; top: -10px; right: -10px}
.packageSec.package3_5type {background: url("../Images/package3_sec5_titleBg.png") no-repeat; background-size: cover}
.packageSec.package3_6type {background: url("../Images/package3_sec5_Bg.png") no-repeat; background-size: cover; background-position-y: 35px}
.package3_sec5_titleLogo {opacity: 0; transition: all 0.5s ease-in-out; vertical-align: top}
.packageTitle.package3_6type {position: absolute; padding: 0; left: 0; z-index: 5; transition: all 0.3s ease-in-out}
.conBox.package3_6type {width: 981px; height: 616px; box-sizing: border-box; background: url("../Images/package3_sec5_conBox.png") no-repeat; position: relative;
    top: 20px; left: 180px}
.conBox.package3_6type .conImgBox {display: inline-block; margin: 130px 50px; position: relative}
.conImgBox .cover {width: 239px; height: 303px; top: unset; left: 10px; bottom: 21px; border-radius: 0; line-height: 300px; background: rgba(0, 0, 0, 0.8)}
.conImgBox:hover .cover {opacity: 1}
.layerPopup.package3_gift {width: 1000px;position: fixed;left: calc((100vw - 1000px) / 2); background: #fff; box-sizing: border-box; padding: 20px;
    z-index: 20; display: none}
.package3_gift.type1 {height: 410px; top: calc((100vh - 410px) / 2)}
.package3_gift.type2 {height: 540px; top: calc((100vh - 540px) / 2)}
.dim.packageType {display: none; z-index: 6}


/*다음 우편번호 검색*/
#searchZipcodeBox {display:none; position:fixed; overflow:hidden; z-index:99999999999999999; -webkit-overflow-scrolling:touch; background: #fff}
#searchZipcodeBox .searchZipcodeTitle {line-height: 36px; padding: 5px 5px 5px 10px; border-bottom: 1px solid}
#searchZipcodeBox .modalCloseBtn {width: 20px; height: 20px; float: right; border: 2px solid; text-align: center; font-size: 18px; line-height: 16px; margin: 5px; cursor: pointer}

/*수강중인 과정 미니팝업*/
/*.studyMyBox {position: absolute; width: 300px; box-sizing: border-box; top: 180px; left: 30px; transition: all 0.5s ease-in-out; opacity: 1; cursor: move;
    z-index: 10; box-shadow: 1px 0 5px rgba(0, 0, 0, 0.2); height: 390px}
.studyInfoWrap {padding: 20px; background: #fff; font-family: "NanumSquareR"; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; height: 305px}
.studyInfoWrap p b {line-height: 30px}
.studyMyBox .popupTitle {padding: 10px}
.studyMyBox select {padding: 3px 40px 3px 8px; width: 100%}
.owlBtn {position: absolute; top: 240px; left: 110px; display: none; cursor: move}
.owlBtn div {width: 145px; height: 145px; background: url("../Images/owl2.png") no-repeat}
.owlBtn div p {color: #fff; font-family: "NanumSquareR"; font-weight: bold; line-height: 42px; cursor: pointer}
.studyMyBox .popupTitle { padding: 10px; background: #ff7800; font-weight: bold; font-size: 18px; color: #fff; border-top-left-radius: 5px; border-top-right-radius: 5px;}
.closeBtn2 {float: right; width: 24px; height: 24px; border: 1px solid; background: transparent; display: inline-block; font-size: 24px; line-height: 21px;
    text-align: center; box-sizing: border-box; cursor: pointer}
.miniStudyArea a.btn {width: 100%; padding: 10px; text-align: center; box-sizing: border-box; background: #ff7800; color: #fff}
.studyInfoWrapTitleTxt {width: 77%; line-height: 12px}
.studyInfoWrapTitle {border-bottom: 1px dashed #999; padding-bottom: 5px}
.studyInfoWrap select {appearance: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box;
    background: url(../Images/downArrow.png) 100% no-repeat}
.studyInfoWrapTitleTxt p:nth-child(2) {margin-top: -5px}
.studyInfoWrapTitle .exGroupStamp {display: inline-block; width: 25px; height: 25px}

.owlBtn.logOutType {display: block; top: 100px; left: 55px}*/

/*체험단*/
.exGroupWrap {width: 100%; text-align: center; height: auto; overflow: hidden}
.exGroupWrap:first-of-type img {min-width: 1200px}
.exGroupWrap:nth-of-type(2) {background: #f4f7ff}
.exGroupSectionTitle {font-family: "GmarketSansM"; font-size: 36px; margin-top: 50px}
.exGroupSectionTitleTxt {font-size: 24px; line-height: 30px; margin: 20px auto}
.exGroupSec2img {display: inline-block; float: left; transition: 0.2s ease-in-out}
.exGroupSec2img:first-child {width: 33.33333%; height: 634px; background: url("../Images/exGroup2_img1_off.png") center bottom no-repeat}
.exGroupSec2img:nth-of-type(2) {width: 33.33333%; height: 634px; background: url("../Images/exGroup2_img2_off.png") center bottom  no-repeat}
.exGroupSec2img:nth-of-type(3) {width: 33.33333%; height: 634px; background: url("../Images/exGroup2_img3_off.png") center bottom  no-repeat}
.exGroupSec2img:first-child:hover {width: 33.33333%; height: 634px; background: url("../Images/exGroup2_img1_on.png") center bottom no-repeat}
.exGroupSec2img:nth-of-type(2):hover {width: 33.33333%; height: 634px;background: url("../Images/exGroup2_img2_on.png") center bottom  no-repeat}
.exGroupSec2img:nth-of-type(3):hover {width: 33.33333%; height: 634px;background: url("../Images/exGroup2_img3_on.png") center bottom  no-repeat}
.exGroupBtnWrap {position: fixed; bottom: 0; background: #7f4c4c; width: 100%; height: 120px; box-sizing: border-box; z-index: 10; line-height: 120px; display: none;
    transition: all 0.3s ease-in-out}
.exGroupBtnWrap.on {display: block}
.exGroupBtnImg {position: absolute; left: 0; top: -94px}
.exGroupBtnImg.another {top: -40px; bottom: 5px}
.courseCounterWrap {position: absolute; left: 0; text-align: center; height: 100%; width: 233px}
.courseCounter {color: #a9003c; font-family: "GmarketSansM"; font-size: 24px; line-height: 170px; text-align: center}
.courseCounter span {font-family: "GmarketSansB"; font-size: 71px; letter-spacing: -3px}
.d_time {position: absolute; left: 233px; font-family: "GmarketSansM"; color: #fff; padding: 0 20px; line-height: 140px; font-size: 30px}
.d_time span {font-size: 46px; font-family: "GmarketSansB"; color: #fffd2d; display: inline-block; width: auto}
.d_time.another #d_time {font-size: 30px; padding-right: 10px}

.exGroupPriceWrap {width: 965px; margin: 50px auto 60px}
.exGroupPriceTitle {width: 100%; height: 65px; box-sizing: border-box; background: #ff686c; border-top-left-radius: 10px; border-top-right-radius: 10px;
    position: relative}
.exGroupPriceTitle img {position: absolute; bottom: 0; right: 30px}
blink {font-size: 30px; color: #fff; animation: blinker 0.5s alternate infinite; line-height: 65px}
@keyframes blinker {
    30% {
        opacity: 0;
        font-size: 31px;
    }
}
blink.exGroupBtnType {font-family: "GmarketSansB"; color: #000; position: absolute; left: 0; display: inline-block; width: 100%; text-align: center;
    padding: 33px 0; box-sizing: border-box}
.exGroupPriceFooter {width: 100%; height: 40px; box-sizing: border-box; background: #ff686c; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;
    color: #fff; font-family: "GmarketSansM"; font-size: 14px; text-align: left; line-height: 40px; padding: 0 20px}
.exGroupPrice {width: 100%; height: 483px; background: url("../Images/exGroupPrice.png") no-repeat; position: relative; overflow: hidden}
.exGroupPrice_box1 {width: 288px; height: 144px; position: absolute; top: 30px; left: -100%; transition: all ease-in-out 0.3s}
.exGroupPrice_box1::after {content: ""; position: absolute; background: url("../Images/exGroupPrice_1img.png") center no-repeat; opacity: 0;
    width: 100%; height: 100%; top: 0; left: 0; transition: ease-in-out 0.8s}
.exGroupPrice_box1.on::after, .exGroupPrice_box2.on::after, .exGroupPrice_box3.on::after {opacity: 1}
.exGroupPrice_box1 img {padding-top: 94px; position: absolute; left: 0; z-index: 2}
.exGroupPrice_box2 {width: 614px; height: 185px; position: absolute; top : 120px; left: -100%; transition: all ease-in-out 0.5s}
.exGroupPrice_box2::after {content: ""; position: absolute; background: url("../Images/exGroupPrice_2img.png") right no-repeat; opacity: 0;
    width: 100%; height: 100%; top: 0; left: 0; transition: ease-in-out 1.2s}
.exGroupPrice_box2 img {padding-top: 135px; position: absolute; left: 0; z-index: 2}
.exGroupPrice_box3 {width: 936px; height: 329px; position: absolute; top: 130px; left: -100%; transition: all ease-in-out 1s}
.exGroupPrice_box3::after {content: ""; position: absolute; background: url("../Images/exGroupPrice_3img.png") right no-repeat; opacity: 0;
    width: 100%; height: 100%; top: 0; left: 0; transition: ease-in-out 1.5s}
.exGroupPrice_box3 img {padding-top: 278px; position: absolute; left: 0; z-index: 2}

.exGroupWrap:nth-of-type(3) {background: url("../Images/exGroup4bg.png") repeat-x; margin-top: -20px; padding-bottom: 30px}
.exGroupMissionGoBtn {display: block; width: 70%; height: 60px; box-sizing: border-box; padding: 15px 0 13px; font-family: "GmarketSansM";
    font-size: 30px; background: #ff335e; color: #fff; margin: 0 auto; border-radius: 10px}
.exGroupWrap:nth-of-type(4) {background: url("../Images/exGroup5bg.png")}
.exGroupWrap:nth-of-type(6) {background: url("../Images/exGroup6bg.png") repeat-x; height: 24px}
.exGroupWrap:nth-of-type(7) {background: #c6b0db}
.exGroupWrap:nth-of-type(4) .packageInner {margin: 50px auto}
.exGroup4txt {text-align: left; background: #fff; padding: 20px 30px; height: auto; overflow: hidden; font-family: "GmarketSansL"; font-weight: bold; font-size: 17px;
    line-height: 30px; border-radius: 10px; box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.2); margin-top: 20px}
.exGroup4txt span, .exGroup4txt b {font-family: "GmarketSansB"; font-weight: normal}
.exGroup4txt span {color: #5e4dff}
.exGroup4txt .linkBtn {background: #ff335e; color: #fff; font-size: 14px; vertical-align: middle; padding: 7px 10px 5px; border-radius: 10px}
.exGroupWrap .noticeWrap {text-align: left; font-family: "GmarketSansL"; font-weight: bold; font-size: 17px; line-height: 30px; margin: 50px 0}
.exGroupWrap .noticeWrap span {font-family: "GmarketSansB"; font-weight: normal; color: #000cff}
.exGroupWrap .noticeWrap b {font-family: "GmarketSansB"; color: #aa44a0; font-size: 24px}
.exGroupWrap .noticeWrap .linkBtn {background: #1faf17; color: #fff; font-size: 14px; vertical-align: middle; padding: 7px 10px 5px; border-radius: 10px}

.exGroupPriceTable {font-family: "GmarketSansM"; border-top: 3px solid #2d3447; background: #fff; color: #2d2d2d; font-size: 20px; text-align: right;
    width: 90%; margin: 50px auto 10px; border-bottom: none}
.exGroupPriceTable tr td, .exGroupPriceTable tr th {padding: 28px}
.exGroupPriceTable tr td, .exGroupPriceTable thead tr th {border-left: 1px solid #ccc; vertical-align: bottom}
.exGroupPriceTable thead tr th:first-child {border-left: 0}
.exGroupPriceTable thead tr th {background: #fff; font-size: 24px}
.exGroupPriceTable tbody tr th {text-align: left}
.exGroupPriceTable tbody tr:last-child {background: #2d3447; color: #fff}
.exGroupPriceTable tbody tr:last-child th {border-bottom: 0}
.exGroupPriceTableTxt {font-size: 20px; font-family: "GmarketSansL"; text-align: right; padding-right: 60px; margin-bottom: 120px}
.exGroupPriceTableTxt span {color: #f300df; font-family: "GmarketSansM"}
.wrap.myPageType .contentTitSub {height: 127px}
.wrap.myPageType .contentTitSub > div {width: 100%; height: 100%; padding: 15px 10px}
.exGroupType {background: url("../Images/exGroupBannerBg.png") no-repeat}
.exGroupStamp {width: 40px; vertical-align: middle}
.contentTitSubTxt.exGroupType p {text-align: right; font-size: 14px; margin-top: 10px; padding-right: 250px}
.ncsSearchWrap {width: 100%; height: 165px; background: #fff1f1}
.ncsSearchBg {height: 100%}
.ncsSearch {padding: 55px 0; box-sizing: border-box}
.ncsSearch input {border: 0; width: 520px; height: 55px; box-sizing: border-box; padding: 8px 20px; border-radius: 30px; font-size: 18px;
    font-family: "NanumSquareR"; position: relative}
#ncsSearchBtn, #packageNcsSearchBtn {display: inline-block; width: 55px; height: 55px; box-sizing: border-box; background: #e74338; padding: 12px; text-align: center;
    vertical-align: middle; position: absolute; right: 70px; border-radius: 30px}
.ncsLeftArea {float: left; width: 200px; box-sizing: border-box}
.ncsLeftArea p {display: inline-block; width: 100%; background: #2384C6; color: #fff; text-align: center; font-size: 18px; line-height: 41px; margin-bottom: 5px}
.ncsCode a {display: inline-block; width: 100%; line-height: 24px; font-size: 14px; padding-left: 5px}
.ncsCode a:hover {color: #2384C6; font-weight: bold}
.ncsRightArea {float: right; width: 920px}
.mobileBtnWrap .mobileBtn, .mobileBtnWrap .mobileNoBtn {width: 40px; height: 40px; margin: 0 auto; float: none}
.d_time.exGroupCourseType {line-height: 40px; padding-top: 30px}
.d_time.exGroupCourseType span {font-size: 30px}

.exGroupGuideBtn {position: fixed; bottom: 30px; left: 50px; text-align: center}
.exGroupGuideBtn a > span {background: #0a2774; color: #ffec00; padding: 10px 20px 10px; border-radius: 30px; font-family: "GmarketSansM";}
.exGroupGuideBtn .exGroupBtnImg {position: unset; display: block; margin-top: 5px}

/*체험단 과정 결제*/
.exGroupCart {width: 40%; display: inline-block; margin-right: 30px}
.exGroupCart > p {height: 20px; margin: 15px 0 10px; line-height: 26px}
.exGroupCartIn {width: 100%; height: 26px; line-height: 26px; color: #fff; font-size: 18px}
.exGroupCartDel {display: inline-block; width: 18px; height: 18px; box-sizing: border-box; text-align: center; color: #000; line-height: 18px;
    background: #daf0ff; font-weight: bold; float: right; margin: 4px 0 0 10px; border-radius: 3px}
.icon.exGroup {background: #ffb100}
.channelTable input[type=radio] {height: 15px; width: 15px; vertical-align: middle; margin-right: 5px; margin-bottom: 2px}
.exGroupAgreement {width: 100%; clear: both; border-top: 2px solid #2384c6; border-bottom: 2px solid #2384c6; padding: 10px; box-sizing: border-box;
    height: auto; overflow: hidden}
.exGroupAgreement .txtBox {width: 100%; min-height: 75px; font-size: 14px; font-family: "Noto Sans KR"; padding: 20px; box-sizing: border-box;
    line-height: 26px; overflow-y: scroll; color: #666; border: 1px solid #ddd; margin: 5px 0}
.exGroupAgreement .txtBox:nth-of-type(1) {height: 120px}
#chatInfoPopup.contentWrap {position: fixed; width: 500px; height: 310px; background: #fff; top: calc((100vh - 310px) / 2);
    left: calc((100vw - 500px) / 2); box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); border: 1px solid #ccc; display: none}
#chatInfoPopup.contentWrap .box {padding: 20px; box-sizing: border-box}
#chatInfoPopup .popupTitle {background: #2384C6; padding: 10px; color: #fff}
#chatInfoPopup .modalClose {color: #fff; border-color: #fff}

/*채용정보, 키워드뉴스, NCS 직무기술서*/
.licenseType .item.shortType {height: 420px}
.licenseType .item.shortType2 {height: 430px}

/*게임소양교육*/
.gameCourseBanner {position: fixed; bottom: 0; background: #fff9b5; width: 100%; height: 120px; box-sizing: border-box; z-index: 10; line-height: 120px; opacity: 1;
    transition: all 0.3s ease-in-out; border-top: 3px solid #232b54; transition: all ease-in-out 0.3s}
.bannerTxt {position: absolute; left: 233px; font-family: "GmarketSansM"; color: #ff003b; padding: 0 20px; font-size: 30px; line-height: 70px}
.bannerTxt > span {font-family: "GmarketSansM"; color: #fff; display: block; background: #ff3161; width: auto; text-align: center; line-height: 30px; border-radius: 20px;
    margin-top: 20px; padding-top: 3px}
p.gameCourseBtnType {font-family: "GmarketSansB"; color: #000; position: absolute; left: 0; display: inline-block; width: 100%; text-align: center;
    padding: 33px 0; box-sizing: border-box; line-height: 30px; font-size: 24px}
p.gameCourseBtnType1.blink1 {font-family: "GmarketSansB"; color: #000; position: absolute; left: 0; display: inline-block; width: 100%; text-align: center;
    padding: 33px 0; box-sizing: border-box}
.gameCourseBtnType1 {color: #fff; font-family: "GmarketSansB"; position: absolute; left: 0; display: inline-block; width: 100%; text-align: center;
    padding: 33px 0; box-sizing: border-box; line-height: 30px; font-size: 24px}
blink1 {font-size: 40px; color: #fff; animation: blinker 0.5s alternate infinite; line-height: 65px}
@keyframes blinker {
    30% {
        opacity: 0;
    }
}
.guidePopup.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}
.guidePopup .title {padding: 10px; width: 100%; box-sizing: border-box}
.guideContents {width: 100%; height: 100%; background: #fff; padding: 0; box-sizing: border-box; z-index: 5000}
.guideContents img {width: 100%; vertical-align: top}
.guidePopupCloseBtn.modalClose {line-height: 19px }
.guidePopup {width: 37%; position: fixed; z-index: 5000; background: #fff; top: 3%; left: calc((100vw - 37%) / 2); height: auto; overflow: hidden; display: none;
    min-width: 545px}

/*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}
.popupTitle {padding: 15px 20px; box-sizing: border-box; font-size: 18px; font-weight: bold; color: #fff; background: #2384C6; height: auto; overflow: hidden; line-height: 24px}
.popupTitle .modalClose {line-height: 20px}
.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}

/*평생교육이용권*/
.voucherWrap {padding: 100px 0 85px; min-width: 1200px; height: auto; overflow: hidden; box-sizing: border-box; text-align: center}
.voucherWrap:first-of-type {padding: 0}
.voucherInner {width: 1200px; margin: 0 auto; padding: 0 90px; box-sizing: border-box}
.voucherWrap .btnWrap {padding-top: 30px;}
.voucherWrap:nth-of-type(2) .btnWrap > img {position: absolute; margin-left: 470px}
.voucherWrap .btnWrap a {display: inline-block; border: 1px solid #000; width: 688px; line-height: 100px; box-sizing: border-box; font-size: 24px;
    font-family: "GmarketSansB"; background: #fff; transition: all ease-in-out 0.3s}
.voucherWrap:nth-of-type(2) .btnWrap a {margin-top: 90px}
.voucherWrap .btnWrap a:hover {background: #ffec80}
.voucherWrap:nth-of-type(3) {background: #f4f4f4}
.standardPopup {width: 840px; height: auto; overflow: hidden; position: fixed; z-index: 5000; top: calc((100vh - 592px) / 2); left: calc((100vw - 840px) / 2);
    background: #fff; display: none}
.standardPopup .popupTitle {background: #9c6767}
.standardPopup .contents {box-sizing: border-box; height: 500px; width: 100%}
.voucherItem {margin: 0 5px; width: 185px; height: 260px; display: inline-block; position: relative; transition: all ease-in-out 0.2s}
.voucherItem:hover img {position: absolute; top: -20px; left: 0}
.voucherWrap:nth-of-type(5) {background: #edf2ff}
.voucherWrap:nth-of-type(6) {background: url("../Images/2024/voucher_img6_bg.jpg") no-repeat}
/*.voucherWrap:nth-of-type(8) {background: url("../Images/voucherWrap_bg.png") repeat-x; height: 793px}*/
.voucherBar.on {position: fixed}
.voucherBar {width: 100%; height: 100px; position: relative; bottom: 0; background: #b3b8f0; padding: 18px 0; box-sizing: border-box}
/*.voucherBar {width: 100%; height: 120px; background: url("../Images/voucherBar_bg.png") repeat-x; position: relative; bottom: 0}
.voucherBarObj {position: relative; bottom: 30px}
.voucherBar .voucherInner > a {display: inline-block; width: 415px; height: 85px; line-height: 85px; box-sizing: border-box; text-align: center; font-family: "GmarketSansM";
    font-size: 28px; color: #150c59; border-radius: 10px; position: relative; bottom: 78px; margin: 0 8px; font-weight: bold}
.voucherBar .voucherInner > a:hover {color: #ff0000}
.voucherGoBtn {background: #ffec80}
.voucherApplyGoBtn {background: #c6ff98}
.voucherWrap:last-of-type {background: #e9edf5; padding: 30px}*/
.voucherNoticePopup {width: 500px; height: 500px; background: url("../Images/VoucherPackage/voucher_stop.jpg") no-repeat; padding: 10px; box-sizing: border-box; position: fixed;
    top: calc((100vh - 500px) / 2); left: calc((100vw - 500px) / 2); z-index: 600; cursor: pointer}
.voucherNoticePopup .modalClose {font-weight: bold}
.voucherNoticePopup2 {width: 500px; height: 500px; background: url("../Images/20220228_popup2.jpg") no-repeat; padding: 10px; box-sizing: border-box; position: fixed;
    top: calc((100vh - 500px) / 2); left: calc((100vw - 500px) / 2); z-index: 550; background-size: cover}
.voucherNoticePopup2 .modalClose {font-weight: bold; color: #fff; border-color: #fff}

.vpMenuWrap {height: 235px; position: relative}
.vpSelectBox {width: 985px; height: 145px; float: right; box-sizing: border-box; margin-top: 125px; border-radius: 20px; border: 1px solid #dfdfdf; background: #fff1f9;
    padding: 35px 0 35px 50px; position: relative;}
.vpSelectBox:hover {border: 1px solid #12b1ff; box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.15);}
.vpSelectBox .vpCourseSelect {width: 75%}
.vpSelectBox:hover .vpCourseSelect select {border: 1px solid #ff65c3}
.vpSelectBox .vpCourseSelect select {line-height: 55px; font-size: 20px; padding-left: 20px; height: 70px; background-color: #fff !important; border: 1px solid #fff; border-radius: 10px}
.vpSelectBox .vpSelectBg {position: absolute; right: 0; bottom: 0}
.eventBell {position: fixed; bottom: -4px; left: 100px}

#cardInfo .voucherWrap:first-child {background: #ececec}
#cardInfo .voucherWrap:nth-child(2) {background: #f2f2f2}
#cardPay .voucherWrap:first-child {background: #194db3}
#cardPay .voucherWrap:nth-child(2) {background: #f2f2f2}


/*증명서발급*/
.searchWarp {background: #f4f4f4; height: auto; overflow: hidden; text-align: left; padding: 20px 20px 15px; font-family: "GmarketSansM"; font-size: 20px;
    font-weight: bold; color: #2384C6}
.searchWarp input {border: 1px solid #2384C6; margin: 0 10px; height: 32px; width: 150px}
.searchWarp a.btn {display: inline-block; width: 40px; text-align: center; height: 28px; vertical-align: middle; line-height: 32px; font-family: "GmarketSansM" !important;
    font-size: 14px !important}
.searchWarp a:hover {background: #2384C6; color: #fff}
.paperSearchBtn {float: right; width: 120px !important; background: #2384C6 !important; color: #fff !important; box-sizing: border-box; height: 36px !important;
    line-height: 24px; border-radius: 5px; font-size: 20px; text-align: center; font-family: "GmarketSansM"}

/*체험단 알림신청*/
.exGroupBellWrap {position: fixed; bottom: -5px; left: 80px; z-index: 30}
.exGroupBellInfo {position: fixed; width: 40%; height: 520px; min-height: 520px; z-index: 5000; background: #fff; top: calc((100vh - 520px) / 2); left: calc((100vw - 40%) / 2);
    min-width: 800px; display: none}
.exGroupBellInfo .textAreaBox {margin: 0 auto; border: 1px solid #D1D1D1; color: #575757; font-size: 12px; overflow-y: auto; box-sizing: border-box; font-family: "GmarketSansM"; line-height: 18px}

/*바우처 팝업*/
.voucherPopup {position: fixed; width: 500px; top: calc((100vh - 500px) / 2); left: calc((100vw - 500px) / 2); z-index: 501}
.popupTypeDim { position: fixed; right: 0; top: 0; left: 0; bottom: 0; z-index: 15; width: 100vw; height: 100vh; background: rgba(0,0,0,0.3);}

.voucherPopup1 {position: fixed; width: 500px; top: 200px; left: calc((100vw - 500px) / 2); z-index: 501}

/*수료증 진위여부*/
.infoBox.authType {text-align: left; font-size: 18px; font-family: "GmarketSansL"; line-height: 34px; padding-left: 150px; font-weight: bold; color: #666}
.CertificateAuthBox {font-family: "GmarketSansM"; padding: 10px 20px; height: 150px; box-sizing: border-box; background: url("../Images/bgImg1.png") no-repeat;
    transition: all ease-in-out 0.3s}
.CertificateAuthBox:hover {background: url("../Images/bgImg2.png") no-repeat}
.CertificateAuthBox > div {float: left; box-sizing: border-box; margin-top: 46px}
.CertificateAuthBox > div:first-child {line-height: 42px; width: 60%; text-align: right; padding-right: 30px; font-family: "GmarketSansM"; font-size: 20px; color: #2384C6}
.CertificateAuthBox > div:last-child {line-height: 115px; width: 28%}
.CertificateAuthBox input, .CertificateAuthBox select {height: 36px; box-sizing: border-box; padding: 3px 8px; border: 1px solid #2384C6;
    vertical-align: middle; width: 300px}
.CertificateAuthBtn {background: #2384C6; text-align: center; color: #fff; padding: 15px 30px 10px; font-size: 20px; border-radius: 5px; border: 1px solid #2384C6; font-family: "GmarketSansM"}
.CertificateAuthClearBtn {background: #fff; text-align: center; color: #2384C6; padding: 15px 30px 10px; font-size: 20px; border-radius: 5px; border: 1px solid #2384C6; font-family: "GmarketSansM"}
.CertificateAuthExImg {width: 711px; height: 456px; position: fixed; top: calc((100vh - 456px) / 2); left: calc((100vw - 711px) / 2); display: none; z-index: 5002}
.CertificateAuthExImg .modalClose {width: 30px; height: 30px; line-height: 32px; font-size: 22px; font-weight: bold; margin-bottom: 10px; color: #fff; border-color: #fff}
.CertificateAuthExImg img {width: 100%;}
.CertificateAuthResult p {display: inline-block; width: 100%; font-family: "GmarketSansM"; font-size: 20px; color: #666; margin-bottom: 30px}
.CertificateAuthResult table {width: 800px; margin: 0 auto}
.CertificateAuthResult table tr td, .CertificateAuthResult table tr th {text-align: left; font-family: "GmarketSansL"; font-size: 16px; padding-left: 30px; font-weight: bold}


/*품절 레이어 팝업*/
.soldOut {position: fixed; width: 400px; height: 400px; left: calc((100vw - 400px) / 2); top: calc((100vh - 400px) / 2); z-index: 10}
.dim3 { position: fixed; right: 0; top: 0; left: 0; bottom: 0; z-index: 7; width: 100vw; height: 100vh; background: rgba(0,0,0,0.3);}

/*품절 스티커*/
.soldOutSticker {position: absolute; top: 0; left: 0}

/*패키지 안내 팝업*/
.voucherInfoPopup {position: fixed; width: 500px; height: 500px; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 10}
.voucherInfoPopup .modalClose {top: 10px; right: 10px; position: absolute; font-weight: bold}

/*자격증 스케쥴*/
.titleWrap {height: auto; overflow: hidden}
.titleWrap .boardSearchWrap {margin-bottom: 0}
.datePicker {display: inline-block; width: 50%; float: left; font-family: "GmarketSansM"; font-weight: bold; font-size: 24px}
.datePicker span.arrow {margin: 0 10px; cursor: pointer; font-size: 28px; display: inline-block; height: 36px; vertical-align: bottom; line-height: 48px}
.datePicker .arrow:hover {color: #2384C6}
.datePicker .btn {padding: 7px 10px 3px !important; font-family: "GmarketSansL"; font-size: 14px; vertical-align: bottom}
.datePicker .boardSearchWrap {margin-bottom: 0}
.calendarBox.licenceScheduleType .calendarWrap {background: #fff; position: absolute; width: 385px; left: calc((100vw - 385px) / 2); top: calc((100vh - 317px ) / 2)}
.calendarBox.licenceScheduleType {position: fixed; right: 0; top: 0; left: 0; bottom: 0; z-index: 500; width: 100vw; height: 100vh; background: rgba(0,0,0,0.3)}
.calendarBox.licenceScheduleType * {font-family: "GmarketSansM"; font-weight: normal}
.calendarBox.licenceScheduleType .popupTitle {padding: 10px 10px 5px; font-size: 16px}
.calendarBox.licenceScheduleType .popupTitle .modalClose {color: #fff; border-color: #fff; line-height: 24px}
#licenceCalendar {padding: 0 10px 10px}
#licenceCalendar .fc-text-arrow {width: 25px; height: 25px; text-indent: 90em; display: block; margin: 0}
#licenceCalendar .fc-button {padding: 0}
#licenceCalendar .fc-button-prev .fc-text-arrow {background: url("../Images/slide_left.png") no-repeat !important}
#licenceCalendar .fc-button-next .fc-text-arrow {background: url("../Images/slide_right.png") no-repeat !important}
#licenceCalendar .fc-state-default, #licenceCalendar .ui-state-default .ui-icon {background: none; border: none; box-shadow: none}

#licenceCalendar .fc-header-title h2 {font-size: 1.4em !important; white-space: normal !important}
#licenceCalendar .fc-view-month .fc-event, #licenceCalendar .fc-view-agendaWeek .fc-event {font-size: 0; overflow: hidden;height: 2px }
#licenceCalendar .fc-view-agendaWeek .fc-event-vert {font-size: 0; overflow: hidden; width: 2px !important}
#licenceCalendar .fc-agenda-axis {width: 20px !important; font-size: .7em}
#licenceCalendar .fc-button-content {padding: 0}
#licenceCalendar table {border-top: none; border-right: none; border-left: none; border-bottom: 1px solid #eee; font-size: 0.7em !important}
#licenceCalendar thead {background: #2384C6; color: #fff}
#licenceCalendar thead th {padding: 5px 0}
#licenceCalendar .ui-state-default, #licenceCalendar .ui-widget-content .ui-state-default, #licenceCalendar .ui-widget-header .ui-state-default {border: none; background: none}
#licenceCalendar .ui-state-hover, #licenceCalendar .ui-widget-content .ui-state-hover, #licenceCalendar .ui-widget-header .ui-state-hover, #licenceCalendar .ui-state-focus,
#licenceCalendar .ui-widget-content .ui-state-focus, #licenceCalendar .ui-widget-header .ui-state-focus {border: none; background: none}
#licenceCalendar .fc-day > div {min-height: 30px !important; padding: 2px; box-sizing: border-box}
#licenceCalendar .fc-header .fc-button {margin-bottom: 0}
.dateTabWrap {height: 70px}
.dateTab {display: inline-block; width: 162.5px; background: #ecffcc; font-family: "GmarketSansL"; font-weight: bold; text-align: center; height: 70px; box-sizing: border-box;
    padding: 15px 0 13px; float: left; border-right: 1px solid #2384C6; border-top: 1px solid #2384C6; border-bottom: 2px solid #2384C6; cursor: pointer; line-height: 24px}
.dateTab:first-child {border-left: 1px solid #2384C6}
.dateTab.active {background: #fff; border-right: 2px solid #2384C6; border-top: 2px solid #2384C6; border-left: 1px solid #2384C6; border-bottom: 2px solid #fff}
.dateTab.active:first-child {border-left: 2px solid #2384C6}
.dateTab:hover {background: #d0eaff}
.dateTab.active:hover {background: #fff}
.LicenceScheduleWrap {margin-top: 10px; min-height: 300px}
.LicenceScheduleWrap table {font-family: "GmarketSansL"; font-weight: bold}
.LicenceScheduleWrap table tr th, .LicenceScheduleWrap table tr td {padding: 12px 10px 10px}
.LicenceScheduleWrap table tr:last-child td {border-bottom: 1px solid #ddd}
.LicenceScheduleWrap .label {font-size: 14px; display: inline-block; text-align: center; background: #e30000; padding: 6px 5px 3px; color: #fff; border: 1px solid #e30000;
    border-radius: 5px; margin-right: 5px; width: 65px}
.LicenceScheduleWrap .label.m1Type {background: #fff; border: 1px solid #2384C6; color: #2384C6}
.LicenceScheduleWrap .label.p1Type {background: #ccc; border: 1px solid #ccc; color: #494949}
.searchInputBox.licenceScheduleType {font-family: "GmarketSansL"; font-weight: bold; padding-top: 11px}

.LicenceScheduleSearchBox * {font-family: "GmarketSansM"; font-weight: normal}
.LicenceScheduleSearchBox {position: fixed; width: 1140px; height: 600px; top: calc((100vh - 600px) / 2); left: calc((100vw - 1140px) / 2); z-index: 5555;
    box-sizing: border-box; display: none}
.LicenceScheduleSearchBox .contents {background: #fff; padding: 15px 15px 15px 15px; overflow-y: auto; height: 546px; overflow-x: hidden}
.LicenceScheduleSearchBox .modalClose {color: #fff; border-color: #fff; line-height: 24px}
.LicenceScheduleSearchBox .label {font-size: 14px; display: inline-block; text-align: center; background: #e30000; padding: 6px 5px 3px; color: #fff; border: 1px solid #e30000;
    border-radius: 5px; margin-right: 5px; width: 65px}
.LicenceScheduleSearchBox .label.m1Type {background: #fff; border: 1px solid #2384C6; color: #2384C6}
.LicenceScheduleSearchBox .label.p1Type {background: #ccc; border: 1px solid #ccc; color: #494949}
.LicenceScheduleSearchBox table tr:last-child td {border-bottom: 1px solid #ddd}

/*mOtp 추가*/
.mOtpType {text-align: center; min-width: 1180px}
.mOtpType .input-div {background: #e9faff}
.mOtpType .input-div .btn {line-height: 18px; 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; background: #eee; border: none}
.mOtpType .MotpFooter .btn:hover {color: #697280; background: #eee}

/*과정 상세페이지 내 안내 팝업*/
.dim2 {position: fixed; right: 0; top: 0; left: 0; bottom: 0; z-index: 11; width: 100vw; height: 100vh; background: rgba(0,0,0,0.3)}
.courseInPopup {position: absolute; top: 20%; left: 50%; width: 500px; transform: translateX(-50%); z-index: 555}
.courseInPopup .popupContents {position: relative}
.courseInPopup a img {vertical-align: middle}
.courseInPopup a.modalClose {position: absolute; top: 0; right: -40px; width: 30px; height: 30px; font-size: 24px; line-height: 32px;
    font-weight: bold; background: #fff}

.courseDetailTxt img {max-width: 100%}

/*페이지 내 팝업*/
.popupTypeDim .popupArea {position: fixed; width: 500px; height: 500px; transform: translate(-50%, -50%); top: 50%; left: 50%}
.popupTypeDim .popupArea .modalClose {position: relative; right: -60px; color: #fff; top: 55px; width: 50px; height: 50px; font-size: 40px;
    line-height: 50px; font-weight: bold}

/*연혁*/
#history {height: auto; overflow: hidden; padding-bottom: 100px}
#history > div {float: left; display: inline-block}
#history .subTit {font-family: "GmarketSansM"; margin-right: 100px; width: 280px; box-sizing: border-box; position: fixed; top: 330px}
#history .subTit h2 {font-size: 48px}
#history .subTit p {font-family: "NanumSquareR"; margin-top: 50px; font-size: 18px}
#history .subTit > div {width: 280px; margin-top: 30px}
#history .subTit > div img {opacity: 0.5}
#history .subBox {border-left: 1px solid #ccc; width: 720px; box-sizing: border-box; padding-left: 90px; float: right}
#history .subBox > div {position: relative; margin-bottom: 50px}
#history .subBox > div::before {content: ''; display: block; border-radius: 50%; position: absolute; width:10px; height: 10px; background: #fff;
    border: 8px solid #ccc; left: -103px}
#history .subBox > div > dl {height: auto; overflow: hidden}
#history .subBox > div > dl > dt {font-size: 30px; font-weight: bold; width: 26%}
#history .subBox > div > dl > dd {width: 74%}
#history .subBox > div > dl > dd p {font-size: 17px; line-height: 25px; margin-bottom: 10px}
#history .subBox > div > dl > dd p span {display: inline-block; padding-right: 30px}

/*간편상담신청*/
.easyConsultWrap {position: fixed; bottom: -25px; width: 1200px; height: 80px; box-sizing: border-box; background: #cd0000; transition: all ease-in-out 1s;
    margin: 0 auto; border-radius: 20px; padding: 0 30px; z-index: 10; transform: translate(-50%, -50%); left: 50%}
.easyConsultWrap table {border-top: none; border-bottom: none}
.easyConsultWrap table tr td {color: #fff; font-family: "GmarketSansM"}
.easyConsultWrap table tr td .inputBox, .easyConsultWrap table tr td select {margin: 10px 0}
.easyConsultWrap table tr td .inputBox {width: 152px; border: none; border-radius: 5px}
.easyConsultWrap .applyBtn {height: 38px; text-align: center}
.easyConsultWrap .consultPolicyViewBtn {text-decoration: underline #fff078; color: #fff078; margin-left: 10px}
.easyConsultWrap .applyBtn {display: inline-block; background: #ffe040; width: 152px; box-sizing: border-box; line-height: 42px; border-radius: 5px;
    font-size: 15px; font-weight: bold}

.consultPolicyWrap {position: fixed; transform: translate(-50%, -50%); left: 50%; top: 50%; width: 800px; height: auto; overflow: hidden;
    background: #fff; display: none; z-index: 5000}
.consultPolicyWrap .popupDetail {padding: 20px 30px 30px}
.consultPolicyWrap .popupDetail table {border-top: 2px solid #0c0c0c; border-bottom: 1px solid #0c0c0c}
.consultPolicyWrap .popupDetail p {font-family: "GmarketSansL"; font-weight: bold; font-size: 15px; line-height: 20px}
.consultPolicyWrap * {font-family: "GmarketSansM"}
.consultPolicyWrap .popupTitle {background: #000; padding: 12px 20px}
.consultPolicyWrap .popupTitle .modalClose {color: #fff; font-size: 15px; line-height: 22px}

.lllcardGoBtn {width: 90%; font-size: 30px; text-align: center; display: block; background: #ffffcc; margin: 20px auto; padding: 20px; font-weight: bold;
    border-radius: 10px}

/*미디어쿼리*/
@media screen and (max-width: 1680px) {
    .sub {padding-left: 19vw}
    #sec02 .inner {padding: 60px 30px}
    #sec03 .inner {padding: 60px 30px 0}
    .gnb {width: 65%; font-size: 18px}
    .gnb ul li {min-width: 12%; padding: 0 15px}
    .quick {right: 6%}
    .depth3 li {margin-left: 0}
    .headerBtn a {margin: 20px 4px}

}

/*@media screen and (max-width: 1600px) {

.sub {padding: 20px 0 20px 260px}
#sec02 .inner {padding: 60px 30px 40px}
#sec03 .inner {padding: 60px 30px 0}
.gnb {width: 65%;}
.gnb ul li {font-size: 17px}
.mainQBtnWrap {top: 82%}
.quick {right: 5%}
.depth2 li, .depth4 li {padding-left: 50px}
.depth3 li {padding-left: 0}
}*/

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

    .sub {font-size: 17px}
    #sec02 .inner {padding: 60px 30px 30px}
    #sec03 .inner {padding: 60px 30px 0}
    .gnb {width: 65%;}
    .gnb ul li {margin-left: 0; font-size: 16px; min-width: 12%; padding: 0 15px}
    .CScenter.boardType:nth-of-type(2) {margin-left: 5% !important;}
    .detailViewBtn {left: 240px; top: 380px}
    .mainQBtnWrap {top: 82%}
    .slideBtnArea {left: 180px; top: 450px}
    .quick {right: 5px}
    .depth2 li, .depth4 li {margin-left: 30px; font-size: 14px}
    .depth3 li {margin-left: 0}
    .quick {display: none}

}