/*교육과정 안내*/
.wrap.courseType {margin: 0 auto}
.wrap.courseType .contentTit {font-size: 24px; font-weight: bold; line-height: 28px; display: inline-block; width: 100%; margin-bottom: 20px; border-bottom: 1px solid #404040}
.wrap.courseType .contentTit p {width: auto; margin-bottom: 5px}
.wrap.courseType .contentTit .boardSearch {top:12px}
.wrap.another .courseListItem {margin: 0}
.wrap.another .courseListItem .cover a {width: 100%; border-right: none}
.wrap.courseType.other {min-height: 480px}
.courseTable {width: 100%; border: 1px solid; margin: 0 15px 15px; display: inline-table}
.courseTable tr td {border-bottom: 1px solid; border-right: 1px solid}
.courseTable tr:first-child td{border-top: 1px solid}
.courseTable tr td:first-child {border-left: 1px solid}
.anotherTd > span {line-height: 43px; display: table-cell; border-right: 1px solid; box-sizing: border-box; padding: 0 10px}
.anotherTd .courseTd {width: 293.5px}
.anotherTd > span:last-child {border-right: 0}
.anotherTd > span.bgColoreee {width: 151px}
.borderleft0 {border-left: none !important}
.learningChoose label {float: right; line-height: 26px; letter-spacing: -0.5px}
.learningChoose label input[type=radio] {margin-left: 5px; height: 16px; width: 16px}
.learningChoose .bgCcolor {color: #fff}
.courseTable.learningChoose, .learningChoose tr td {border-color: #2384c6 !important}
.tableWrap, .courseBtnWrap {float: left}
.tableWrap {width: 67%}
.courseBtnWrap {font-size: 18px; margin: 0 15px}
.courseBtnWrap > div {float: left}
.term, .courseBtnBox {width: 100%}
.courseBtnWrap label {width: 100%; font-size: 17px; line-height: 24px; margin-left: 30px}
.courseBtnWrap label:nth-child(2) {margin-left: 0 !important}
.courseBtnWrap label input[type=radio] {width: 16px; height: 16px; margin-right: 5px; vertical-align: middle}
.courseBtnBox a {display: inline-block; width: 24%; height: 50px; line-height: 50px; border-radius: 10px; box-sizing: border-box; color: #fff}
.courseBtnBox a img {width: 30px; vertical-align: middle; margin-right: 5px}
.wish {border: 1px solid #ccc; background: #000}
.wish img.on {display: inline-block}
.preview {background: #666}
.courseRegist {background: #ff3e4c}
.wrap.courseType .tabTitle ul li {width: 20%}
.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 * {font-size: 16px !important}
.teacherTitle {font-weight: bold; padding: 10px 0}
.courseDetailTxt .half:first-child {padding-right: 20px}
.courseDetailTxt .half:nth-child(2) {padding-left: 30px}
.courseDetailTxt table {margin: 0 !important; line-height: normal}
.courseScore {width: 100px; vertical-align: sub; display: inline-block}
.courseReview table {border-color: #404040}
.courseReview table .star span {vertical-align: super}
.courseDetail .wrap:last-child {margin-bottom: 0}
.courseDetailView.active {display: block}
.courseDetailView {display: none}
.contentSubTit {font-size: 15px; color: #666; font-family: "NanumSquareRB"}
.courseDateSelect {background: #2384C6}
.smallBannerBox {width: 100%; height: 130px; display: inline-block; margin-top: 30px}
.smallBannerBox img {border-radius: 10px}
.dim { position: fixed; right: 0; top: 0; left: 0; bottom: 0; z-index: 500; width: 100vw; height: 100vh; background: rgba(0,0,0,0.3);}

/*카테고리*/
.divisionWrap {width: 100%; height: auto; overflow: hidden}
.divisionWrap > .divisionHeader {background: aliceblue}
.divisionHeader {font-family: 'NanumSquareR'; font-size: 22px; font-weight: bold; width: 100%; line-height: 28px; padding: 10px; box-sizing: border-box}
.divisionBtn {line-height: 20px; font-size: 13px; font-weight: normal; padding: 3px 10px; background: #2384C6; border-color: #2384C6; color: #fff}
.divisionBtn.on {background: #ff7800; color: #fff; border-color: #ff7800}
.division {padding: 10px 0; text-align: center}
.mainCategory {height: 100px; padding:10px 0; border: 1px solid #999; border-radius: 10px; font-family: "NanumSquareR"; font-weight: bold; background: #fff;
    margin: 4px 2px; box-sizing: border-box; display: inline-block; font-size: 14px; width: 135px; text-align: center; line-height: 20px; letter-spacing: -1px}
.mainCategory:hover, .mainCategory.on {background: #ffecf3; color: #2384C6; border-color: #2384C6}
.mainCategory.VPType:hover, .mainCategory.VPType.on {color: #9305b5; border-color: #9305b5}
.cateName {display: table-cell; vertical-align: middle; height: 50px; width: 142px; word-break: keep-all}
.divisionHeader > div.showInline {margin-left: -67px}
.divisionHeader .boardSearch {right: 25px}
.divisionHeader .boardSearch input {height: 30px !important}

.divisionSearchBox {padding: 20px 0; width: 100%; box-sizing: border-box}
.divisionSearchBox.NoRefundType {padding: 15px 0 0; float: left; width: 50%}
.divisionArea .boardSearch {width: auto; display: inline-block; position: static; float: none}
.divSearch, .division, .divisionWrap > .divisionHeader {border-bottom: 1px dashed #2384C6}
.divisionArea {font-family: "NanumSquareR"; font-weight: bold; width: 100%}
.divisionArea, .onoffswitch {display: inline-block}
.onoffswitch {vertical-align: middle}
.divisionArea > span {font-size: 14px}
.divisionSearchBox.allCateType {padding: 0; float: right; text-align: right; width: 70%; margin-top: 15px}
.divisionSearchBox.allCateType .divisionArea {padding: 0; width: 87%; vertical-align: sub}
.divisionSearchBox.allCateType .listTypeSelect {margin-top: 4px}
.divisionHeader .divisionArea {padding: 0}
.divisionHeader .divisionSearchBox {padding: 40px 0 0 0}
.divisionSearchBox a.searchSort {font-size: 14px; margin-right: 4px}

.onoffswitch {position: relative; width: 48px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none}
.onoffswitch-checkbox {display: none}
.onoffswitch-label {display: block; overflow: hidden; cursor: pointer; border: 2px solid #fff; border-radius: 20px}
.onoffswitch-inner {display: block; width: 200%; margin-left: -100%;transition: margin 0.3s ease-in 0s}
.onoffswitch-inner:before, .onoffswitch-inner:after {display: block; float: left; width: 50%; height: 22px; padding: 0; line-height: 22px; font-size: 13px; color: white;
    font-family: Trebuchet, Arial, sans-serif; font-weight: bold;box-sizing: border-box}
.onoffswitch-inner:before {content: "";padding-left: 10px; background-color: #2384C6; color: #FFFFFF}
.onoffswitch-inner:after {content: ""; padding-right: 10px; background-color: #EEEEEE; color: #999999;text-align: right}
.onoffswitch-switch {display: block; width: 18px; margin: 1px; background: #FFFFFF; position: absolute; top: 1px; bottom: 0; right: 29px; border: 2px solid #2384C6;
    border-radius: 20px; transition: all 0.3s ease-in 0s; height: 18px}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {margin-left: 0}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {right: 0}

.listTypeSelect {width: 68px; height: 34px; float: right; margin-top: 20px}
.listTypeSelect .half {cursor: pointer; text-align: center; height: 34px; line-height: 34px; background: #fff; border: 1px solid #e4e4e4}
.listTypeSelect .galleryType {border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-right: none}
.listTypeSelect .galleryType.on .TypeImg {background: url("../Images/gallery_active.png") no-repeat; background-position: 50%}
.listTypeSelect .listType.on .TypeImg {background: url("../Images/list_active.png") no-repeat; background-position: 50%}
.listTypeSelect .galleryType .TypeImg {background: url("../Images/gallery.png") no-repeat; background-position: 50%}
.listTypeSelect .listType .TypeImg {background: url("../Images/list.png") no-repeat; background-position: 50%}
.listTypeSelect .listType {border-top-right-radius: 5px; border-bottom-right-radius: 5px}
.listTypeSelect .listType .TypeImg {background: url("../Images/list.png") no-repeat; background-position: 50%}
.listTypeSelect .galleryType:hover, .listTypeSelect .listType:hover {background: #2384C6}
.listTypeSelect .galleryType:hover .TypeImg {background: url("../Images/gallery_on.png") no-repeat; background-position: 50%}
.listTypeSelect .listType:hover .TypeImg {background: url("../Images/list_on.png") no-repeat; background-position: 50%}

/*교육과정 안내 비환급*/
.division.NoRefundType {text-align: left !important; border-bottom: 1px dashed #666}
.mainCategory.NoRefundType {height: 80px}
.mainCategory.VPType {height: 80px; background: url("../Images/VPCate_bg.png") no-repeat}
.subCategoryBox {margin-top: 10px; border-top: 1px dashed #666; width: 100%; padding-top: 10px}
.subCategoryBox.noLine {border-top: none; border-bottom: 1px dashed #666; padding-bottom: 10px; height: auto; overflow: hidden; margin-bottom: 10px}
.subCategory, .mainCategory.another {font-size: 13px; height: 27px; padding: 3px 10px; border: 1px solid #2384C6; border-radius: 5px; font-weight: bold; line-height: 20px;
    margin: 2px; box-sizing: border-box; display: inline-block; color: #2384C6; cursor: pointer; width: 155px; text-align: center; letter-spacing: -1px}
.subCategory.on {background: #2384C6; border-color: #2384C6; color: #fff}
.divisionSearchBox.NoRefundType .divisionArea {margin-left: 75px}

/*수강신청유의사항*/
.refundTable {margin: 5px 0; border: 2px solid #000}
.refundTable tr th {border-right: 1px solid #ccc; font-size: 12px; font-weight: bold}
.refundTable tr td {border-right: 1px solid #ccc; border-bottom: 1px solid #ccc !important; font-size: 12px; font-weight: bold}
.refundTable tr:last-child td {border-bottom: 0 !important}

/*.onoffswitch {position: relative; width: 48px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none}
.onoffswitch-checkbox {display: none}
.onoffswitch-label {display: block; overflow: hidden; cursor: pointer; border: 2px solid #fff; border-radius: 20px}
.onoffswitch-inner {display: block; width: 200%; margin-left: -100%;transition: margin 0.3s ease-in 0s}
.onoffswitch-inner:before, .onoffswitch-inner:after {display: block; float: left; width: 50%; height: 22px; padding: 0; line-height: 22px; font-size: 13px; color: white;
    font-family: Trebuchet, Arial, sans-serif; font-weight: bold;box-sizing: border-box}
.onoffswitch-inner:before {content: "";padding-left: 10px; background-color: #2384C6; color: #FFFFFF}
.onoffswitch-inner:after {content: ""; padding-right: 10px; background-color: #EEEEEE; color: #999999;text-align: right}
.onoffswitch-switch {display: block; width: 18px; margin: 1px; background: #FFFFFF; position: absolute; top: 1px; bottom: 0; right: 29px; border: 2px solid #2384C6;
    border-radius: 20px; transition: all 0.3s ease-in 0s; height: 18px}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {margin-left: 0}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {right: 0}

.divisionArea {line-height: 60px}
.divisionArea, .onoffswitch {display: inline-block}
.onoffswitch {vertical-align: middle}
.divisionArea > span {font-size: 14px}
.divisionArea .searchBtn {height: 34px; line-height: 34px; vertical-align: middle; padding: 1px 22px; font-size: 15px; font-weight: normal}
.division {margin-bottom: 50px}
.mainCategory {height: 70px; padding: 6px 12px; border: 1px solid #404040; border-radius: 10px; font-weight: bold; line-height: 20px; margin: 4px 2px; box-sizing: border-box;
    display: inline-block; font-size: 15px; width: 155px; text-align: center}
.mainCategory.on {background: #666; color: #fff}*/

#loading {width: 100%; height: 100%; top: 0px; left: 0px; position: fixed; display: block; opacity: 0.7; background-color: #fff; z-index: 9999; text-align: center; }
#loading-image {position: absolute; top: 45%; left: 45%; z-index: 10000}


.List.listType .courseTit {font-size: 14px; height: auto; line-height: 24px; margin-bottom: 0; word-break: keep-all}
.List.listType .courseBtn {float: unset !important; width: 40px; margin: 0 auto}
.List.listType .courseBtn > div {margin: 3px !important; width: 30px; height: 30px}
.List.listType .courseBtn .licenseBtn {margin: 0 !important; width: 30px; height: 30px}

.calendarWrap {background: #fff; position: absolute; width: 30vw; left: calc(100vw /2 - 15vw); top: calc(100vh /2 - 263.5px); padding: 15px 20px; box-sizing: border-box}

.List.listType table tr th {font-size: 14px; font-family: "NanumSquareR"; font-weight: bold; padding: 10px 3px}
.List.listType table tr td {padding: 3px}
.voucherCourseGoBtn {font-size: 14px; display: inline-block; padding: 5px 20px; border: 1px solid #ff4242; border-radius: 5px; color: #ff4242; margin-left: 15px}
.voucherCourseGoBtn:hover {background: #ff4242; color: #fff}

/*연계과정*/
.relationCourseSlideBox {height: auto; overflow: hidden; margin: 20px 0 30px}
.relationCourseTitle {padding: 30px 20px 0; float: left; width: 180px; height: 135px; box-sizing: border-box; background: url("../Images/chainCourse.png") no-repeat}
.wrap.another .relationCourseSlide .courseListItem {margin: 0 8px}
.relationCourseSlide {width: 960px; height: 135px; float: left}
.relationCourseSlide .slick-track {margin: unset !important}
.relationCourseSlide .courseListItem {width: 228px; height: 100px; padding-bottom: 35px}
.relationCourseSlide .courseListItem .courseImg {height: 90px}
.relationCourseSlide .courseListItem .courseImg > img {border-radius: 10px}
.relationCourseSlide .courseListItem .cover a img {display: inline-block}
.relationCourseSlide .courseListItem .courseDetail {padding: 2px 0; font-size: 13px}
.relationCourseSlide .courseListItem .courseTit {height: 40px; margin-bottom: 0}
.relationCourseSlide .courseListItem .courseTit.simpleTxts {line-height: 16px}
.relationCourseSlide .slick-prev {left: -140px}
.relationCourseSlide .slick-prev:before, .relationCourseSlide .slick-next:before {content: ''}
.relationCourseSlide .slick-next {left: -90px}
.relationCourseSlide .slick-prev, .relationCourseSlide .slick-next {width: 45px; height: 45px; top: 72%}
.relationCourseSlide .slick-prev, .relationCourseSlide .slick-prev:hover, .relationCourseSlide .slick-prev:focus {background: url(../Images/prev.png) no-repeat !important}
.relationCourseSlide .slick-next, .relationCourseSlide .slick-next:hover, .relationCourseSlide .slick-next:focus {background: url(../Images/next.png) no-repeat !important}

/*과정검색 박스*/

.courseSearchBox {width: 100%; height: 165px; background: #fff8d7}
.courseSearchBg {height: 100%}
.courseSearch {padding: 55px 0; box-sizing: border-box}
.courseSearch 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}
#courseSearchBtn {display: inline-block; width: 55px; height: 55px; box-sizing: border-box; background: #ff9000; padding: 12px; text-align: center;
    vertical-align: middle; position: absolute; right: 70px; border-radius: 30px}
.courseSearchBox.type015 {background: #ffe7e7}
.courseSearchBox.type015 #courseSearchBtn {background: #e74338}
.courseSearchBox.type009 {background: #deffdd}
.courseSearchBox.type009 #courseSearchBtn {background: #157370}
.divisionArea label input[type=checkbox] {vertical-align: middle}

/*바우처 패키지*/
#voucherPackage img {vertical-align: top}
#voucherPackage .packageWrap:first-child {padding-top: 0}
#voucherPackage .vpMenu {display: inline-block; width: 190px; height: 235px; margin: 40px 3px 0; float: left}
#voucherPackage .vpMenu a {position: relative}
#voucherPackage .vpMenu a .imgBox {position: relative; z-index: 1; width: 190px; height: 235px;}
#voucherPackage .vpMenu a .imgBg {display: inline-block; background: #fff; width: 190px; height: 145px; box-sizing: border-box; border: 1px solid #d7dbdb;
    border-radius: 20px; position: relative; bottom: 150px}
#voucherPackage .vpMenu:nth-of-type(1) a .imgBox { background: url("../Images/VoucherPackage/VPmenu1_off.png") no-repeat}
#voucherPackage .vpMenu:nth-of-type(1) a:hover .imgBox {background: url("../Images/VoucherPackage/VPmenu1_on.png") no-repeat}
#voucherPackage .vpMenu:nth-of-type(1) a.on .imgBox {background: url("../Images/VoucherPackage/VPmenu1_on.png") no-repeat}
#voucherPackage .vpMenuBox {float: left; width: 1004px; display: inline-block; height: 235px; padding-top: 103px}
#voucherPackage .vpMenuBox .smallVpMenu {display: inline-block; width: 156px; height: 60px; float: left; margin: 15px 5px}
#voucherPackage .vpMenuBox .smallVpMenuu a {position: relative}
#voucherPackage .vpMenuBox .smallVpMenu a .imgBox {position: relative; z-index: 1; width: 155px; height: 60px; -ms-background-position-y: bottom !important;
    background-position-y: bottom !important}
#voucherPackage .vpMenuBox .smallVpMenu a .imgBg {display: inline-block; background: #fff; width: 155px; height: 55px; box-sizing: border-box; border: 1px solid #d7dbdb;
    border-radius: 10px; position: relative; bottom: 54px}


#voucherPackage .vpMenu a:hover .imgBg, #voucherPackage .vpMenu a.on .imgBg {box-shadow: 1px 5px 10px rgba(0,0,0,0.2); border: 1px solid #00aeff}
#voucherPackage .smallVpMenu a:hover .imgBg, #voucherPackage .smallVpMenu a.on .imgBg {box-shadow: 1px 5px 10px rgba(0,0,0,0.2); border: 1px solid #00aeff}
#voucherPackage .vpLeftArea {width: 800px; float: left}
#voucherPackage .vpLeftArea .scrollWrap {min-height: 100px}
#voucherPackage .vpRightArea {width: 400px; float: right}
#voucherPackage .sellBox_info {width: 100%; min-height: 266px; background: url("../Images/VoucherPackage/sellBox_img2.png") repeat-y;
    padding: 0 25px; box-sizing: border-box}
#voucherPackage .vpCourseSelect select {-webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box;
    background: url("../Images/downArrow.png") 100% no-repeat; font-family: "GmarketSansM"}
#voucherPackage .vpCourseSelect select option {font-family: "Noto Sans KR"}
#voucherPackage .packageWrap.vpNotice {background: #f8f8f8}
#voucherPackage .sellBox {width: 372px; min-height: 486px; height: auto; overflow: hidden; margin-left: 30px; transition: all ease-in-out 0.3s;
    box-shadow: 5px 5px 10px rgba(0,0,0,0.2); z-index: 6}
#voucherPackage .sellBox.on {position: fixed; top: 140px}
#voucherPackage .vpInfo {padding: 20px 10px}
#voucherPackage .vpInfo p {font-family: "GmarketSansL"; font-size: 16px; font-weight: bold; line-height: 22px}
#voucherPackage .vpInfo p span {font-family: "GmarketSansM"}
#voucherPackage .vpPrice {font-family: "GmarketSansL"; font-size: 16px; font-weight: bold; padding: 27px 10px 0; box-sizing: border-box}
#voucherPackage .vpPrice b {font-family: "GmarketSansM"; line-height: 45px}
#voucherPackage .vpPrice span.realPrice {font-family: "GmarketSansB"; font-size: 30px; letter-spacing: -2px; color: #ff0000; float: right}


#voucherPackage .vpCourseItem {float: left; width: 353px; height: auto; overflow: hidden; margin-left: 70px}
#voucherPackage .vpCourseItem:first-child {margin-left: 0}
#voucherPackage .vpCourseItem .courseImg {width: 353px; height: 235px; float: left; margin-bottom: 20px}
#voucherPackage .vpCourseItem .courseText {float: left; padding: 10px 0 10px 20px; width: 500px; box-sizing: border-box; font-family: "GmarketSansL"; font-weight: bold;
    line-height: 24px}
#voucherPackage .vpCourseItem p {font-family: "GmarketSansL"; font-weight: bold; font-size: 24px; color: #3e3a39; line-height: 30px; text-align: left}
#voucherPackage .VPCourseAllBtn img {margin-top: 63px}

#voucherPackage .cover a img {vertical-align: text-bottom; width: 30px}
#voucherPackage .cover a {border: none; width: 100%; font-family: "GmarketSansL"; font-weight: bold}
#voucherPackage .vpCourseGiftWrap {font-family: "GmarketSansM"; font-weight: bold; color: #3e3a39; font-size: 18px; text-align: left; line-height: 24px}
#voucherPackage .vpCourseGiftWrap span {color: #ff0000}
#voucherPackage .vpCourseGift {height: auto; overflow: hidden}
#voucherPackage .vpCourseGift > div {float: left; height: auto; overflow: hidden}
#voucherPackage .vpCourseGiftImg {text-align: center; width: 200px}
#voucherPackage .vpCourseGiftImg img {margin: 25px 25px 10px 25px}
#voucherPackage .vpCourseGiftImg a {display: block; width: 100%; background: #eee; padding: 10px 10px 8px; border-radius: 15px; box-sizing: border-box}
#voucherPackage .vpCourseGiftText {padding-top: 35px; margin-left: 30px; width: 70%}

#vp0 .packageWrap:first-child > img {margin-top: 85px}
#vp0 .sellBox.on.bottomFix {position: absolute; bottom: -2870px; top: auto}
#vp0 .packageWrap:nth-child(2) {background: #f2f2f2}
#vp0 .packageWrap:nth-child(3) a {display: inline-block; width: 380px; margin-right: 26px}
#vp0 .packageWrap:nth-child(3) a:nth-child(3n) {margin-right : 0}
#vp0 .packageWrap:nth-child(3) a img {width: 100%}
#vp0 .VPListBtn {font-size: 26px; font-family: "GmarketSansM"; background: #4b6ae6; padding: 15px 70px 10px; color: #fff; border-radius: 50px}
#vp0 .vpSlideArea .courseListItem {width: 371px; height: 247px}
#vp0 .vpSlideArea .courseListItem .cover {box-sizing: border-box; padding: 110px 0; color: #fff; font-size: 30px}
#vp0 .vpSlideArea .courseListItem .cover img {vertical-align: middle; margin-right: 10px; display: inline-block}
#vp0 .vpSlideArea .slick-dots {margin: 30px auto; bottom: -80px; left: 222px}
#vp0 .vpSlideWrap {height: 500px}
#vp0 .slick-dots li button:before {border: 2px solid #ff65c3}
#vp0 .slick-dots li.slick-active button:before {background: #ff65c3}
#vp0 .reviewSlideBox {border-bottom: 1px solid #494949}
#vp0 .reviewItem div {color: #494949; box-sizing: border-box}
#vp0 .reviewWriter {font-size: 16px; font-family: "GmarketSansB"; width: 105px; padding: 32px 0 28px; float: left}
#vp0 .reviewText {font-size: 14px; font-family: "GmarketSansM"; color: #494949; width: 690px; padding: 22px 10px; text-align: left; line-height: 20px;
    -webkit-line-clamp: 2; word-break: break-all; display: -webkit-box !important; height: 60px; float: right}
#vp0 .reviewItem {border-bottom: 1px solid #494949; box-sizing: border-box; height: 80px; width: 800px}
#vp0 .reviewSlideBox .slick-current.slick-active {background: #f0f1ff}
#vp0 .packageWrap:nth-child(4) {background: url("../Images/VoucherPackage/sec5_bg.png") no-repeat; background-size: cover; max-height: 722px; height: 722px; overflow: visible}

#vp .packageWrap:first-child {height: auto; overflow: hidden; min-width: 1200px; padding-top: 0}
#vp.vp1 .sellBox.on.bottomFix {position: absolute; bottom: -2350px; top: auto}
#vp.vp3 .sellBox.on.bottomFix {position: absolute; bottom: -2775px; top: auto}
#vp.vp4 .sellBox.on.bottomFix {position: absolute; bottom: -2200px; top: auto}
#vp.vp5 .sellBox.on.bottomFix {position: absolute; bottom: -2450px; top: auto}
#vp.vp6 .sellBox.on.bottomFix {position: absolute; bottom: -2450px; top: auto}
#vp.vp7 .sellBox.on.bottomFix {position: absolute; bottom: -2775px; top: auto}
#vp.vp8 .sellBox.on.bottomFix {position: absolute; bottom: -2480px; top: auto}
#vp.vp9 .sellBox.on.bottomFix {position: absolute; bottom: -2390px; top: auto}
#vp.vp10 .sellBox.on.bottomFix {position: absolute; bottom: -2200px; top: auto}
#vp.vp11 .sellBox.on.bottomFix {position: absolute; bottom: -1890px; top: auto}
#vp.vp12 .sellBox.on.bottomFix {position: absolute; bottom: -3050px; top: auto}
#vp.vp13 .sellBox.on.bottomFix {position: absolute; bottom: -2515px; top: auto}

#vp .packageWrap~.packageWrap {padding: 160px 0 107px}
#vp .packageWrap:nth-child(2) {background: #f8f8f8}
#vp .packageWrap:nth-child(4) {padding: 40px 0 0}
#voucherPackage .MPBar {width: 100%; height: 100px; position: relative; bottom: 0; background: #cdf7ee; padding: 18px 0; box-sizing: border-box}
#voucherPackage .MPBar.on {position: fixed; z-index: 50}
#voucherPackage .vpCourseSelect {width: 360px; display: inline-block; margin-left: 30px; margin-top: 10px}
#voucherPackage .vpCourseSelect, #voucherPackage .priceWrap {display: inline-block; float: left}
#voucherPackage .priceWrap {width: 360px; text-align: right; font-size: 20px;}
#voucherPackage .realPrice {font-weight: bold}
#voucherPackage .realPrice b {font-size: 32px; color: #ff0000; font-family: "GmarketSansB"}
#voucherPackage .inner1200 a {display: inline-block; float: right; margin-right: 30px}
#voucherPackage .vpCourseSelect select {-webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box;
    background: url("../Images/downArrow.png") 100% no-repeat; font-family: "GmarketSansM"; background-color: #fff; height: 44px; font-size: 18px}
#voucherPackage .vpCourseSelect select option {font-family: "Noto Sans KR"}
#voucherPackage .mNuriInfoWrap {padding: 100px 0; min-width: 1200px; height: auto; overflow: hidden; box-sizing: border-box}

.popupWrap.voucherType {position: fixed; width: 500px; height: 500px; z-index: 16; transform: translate(-50%, -50%); top: 50%; left: 50%}
.popupWrap.voucherType .popup {width: 100%; height: 100%}
.popupWrap.voucherType .popup img {width: 100%}


.VPListType .cover {box-sizing: border-box; padding: 90px 0; color: #fff; font-size: 30px; text-align: center}
.VPListType .cover img {color: #fff; font-size: 30px; vertical-align: middle; margin-right: 5px}

.divisionSearchBox.NoRefundType.vpType {width: 58%; float: right}
.divisionSearchBox.NoRefundType.vpType .divisionArea {margin-left: 0}

.vpNotice .exGroupSectionTitle {color: #fff}
.vpNotice .noticeWrap {text-align: left; font-family: "GmarketSansL"; font-weight: normal; font-size: 17px; line-height: 30px; margin: 50px 0 50px 116px; color: #fff}
.vpNotice .noticeWrap b {font-family: "GmarketSansB"; font-size: 24px; vertical-align: middle; line-height: 24px; color: #fff000}
.vpNotice .noticeWrap .linkBtn {background: #1faf17; color: #fff; font-size: 14px; vertical-align: middle; padding: 7px 10px 5px; border-radius: 10px}
.vpNotice .noticeWrap span {font-family: "GmarketSansM"; font-weight: normal; color: #fff000}

.VPPopup {position: fixed; transform: translate(-50%, -50%); top:50%; left: 50%; width: 500px; z-index: 10}
.VPPopup .modalClose {color: #fff; position: absolute; right: -30px; top: -30px}

.VPPopupArea {position: fixed; width: 818px; height: auto; overflow: hidden; transform: translate(-50%, -50%); top: 50%; left: 50%; z-index: 5000;
    box-shadow: 5px 5px 10px rgb(0 0 0 / 20%); display: none}
.VPPopupArea .popupTitle .modalClose {color: #fff}
.VPPopupArea .popupDetail {background: #fff; padding: 20px; height: auto; overflow: hidden}
.VPPopupArea .popupDetail .tableWrap {width: 100%; height: 400px; overflow-y: auto}
.VPPopupArea .popupDetail .tableWrap table {border-top: 0}
.VPPopupArea .popupDetail .tableWrap table thead {position: sticky; top: 0}
.VPPopupArea .popupDetail .tableWrap table thead tr th {border-top: 2px solid #2384C6}

.scrollWrap {width: 100%; height: auto; overflow-y: auto;border-bottom: 2px solid #2384C6}
.scrollWrap table thead {position: sticky; top: 0; z-index: 10}
.scrollWrap table thead tr th {border-top: 2px solid #2384C6}
.scrollWrap table {border-top: 0; border-bottom: 0}

.VPSelectBox {text-align: left}
.VPSelectBox p {font-family: "GmarketSansB"; font-size: 18px; border-bottom: 2px solid #000}
.VPSelectBox div {line-height: 22px; padding: 10px 0}
.VPSelectBox div a {background: #ff0000; color: #fff; width: 20px; height: 20px; text-align: center; display: inline-block; line-height: 20px; vertical-align: top}
.VPSelectBox .noItem {text-align: center}
.VPSelectCourse {text-align: right}
#voucherPackage .VPSelectBox .vpPrice b {line-height: 32px}
#VPCart .VPSelectCourseCartIn {padding: 0}
#VPCart .sellBox.on.bottomFix {position: absolute; bottom: -1300px; top: auto}
#VPCart .sellBox.on {top: 100px}

    /*평생교육 패키지 결제*/
#voucherPackage .vpCourseDateSelectBtn {padding: 5px 20px; background: #2384C6; color: #fff; font-size: 15px; display: inline-block; border-radius: 10px;
    line-height: 30px; font-family: "NanumSquareR"}
#voucherPackage .wrap.paymentType input[type=text] {height: 31px !important}
#voucherPackage .half.paymentType .textBox {font-size: 13px}

/*NCS 합격패스*/
.jobEduSaleType .packageBtnWrap {background: #00265f}
.jobEduSaleType .exGroupCart {padding-top: 20px}
.jobEduSaleType .packageBtnWrap {background: #00265f}
.jobEduSaleType .exGroupCart {padding-top: 20px}
.jobEduSaleType .packageWrap .inner1200 {padding: 100px 0}
.jobEduSaleType .packageWrap:nth-of-type(3) {background: #f3f3f3}
.jobEduSaleType .packageWrap:nth-of-type(4) {background: url("../Images/ncsPass/jobEduSale_4_bg.jpg") no-repeat;}
.jobEduSaleType .packageWrap:nth-of-type(5) {background: #e5e7fd}
.jobEduSaleType .packageWrap:nth-of-type(6) {background: #5650b0}
.jobEduSaleType .packageWrap:nth-of-type(7) .btnWrap {height: auto; overflow: hidden}
.jobEduSaleType .packageWrap:nth-of-type(7) .btnWrap .half:first-child {text-align: right}
.jobEduSaleType .packageWrap:nth-of-type(7) .btnWrap .half:first-child img {margin-right: 50px}
.jobEduSaleType .packageWrap:nth-of-type(7) .btnWrap .half:nth-child(2) {text-align: left}
.jobEduSaleType .packageWrap:nth-of-type(7) .btnWrap .half:nth-child(2) img {margin-left: 50px}
.jobEduSaleType .packageWrap:nth-of-type(8) {background: #8a7a9b}
.jobEduSaleType .packageWrap:nth-of-type(9) {background: #f1f1f1}

.jobEduSaleType .jobEduSaleCourseBox {width: 952px; height: 420px; text-align: center; padding: 180px 0 0}
.jobEduSaleType .jobEduSaleCourseBox .courseListItem {width: 353px; height: auto; overflow: hidden; margin: 20px 25px 25px 70px}
.jobEduSaleType .jobEduSaleCourseBox .courseListItem .courseImg {height: 222px}
.jobEduSaleType .jobEduSaleCourseText > p {font-size: 20px; font-family: "GmarketSansM"; color: #000; font-weight: bold; margin-top: 20px}
.jobEduSaleType .jobEduSaleCourseText > p span {color: #ffba00}
.jobEduSaleType .jobEduSaleCourseText .tagBox {font-family: "GmarketSansM"; font-weight: normal; padding: 20px 0; line-height: 24px}
.jobEduSaleType .ncsDocumentWrap {width: 25%; height: auto; overflow: hidden; box-sizing: border-box; text-align: center; float: left}
.jobEduSaleType .courseListItem {height: 228px; margin: 0}
.jobEduSaleType .courseListItem~.courseListItem {margin-left: 42px}

/*230109 수강후기 이벤트 과정 상세페이지 팝업*/
.courseViewPopup {position: fixed; width: 600px; height: 186px; top: 50%; left:50%; transform: translate(-50%, -50%)}
.courseViewPopup .popupDetail {background: #fff; padding: 20px 30px}
.courseViewPopup .popupDetail div {border: 1px solid #bbb; line-height: 20px; padding: 10px}

/*직업훈련생계비 대부 안내페이지*/
#LoansType .tabWrap ul {border-bottom: 2px solid #0c0c0c; text-align: left}
#LoansType .tabWrap ul li {display: inline-block}
#LoansType .tabWrap ul li.tab a {display: inline-block; line-height: 40px; font-family: "GmarketSansM"; font-size: 20px; padding: 5px 40px 0; font-weight: bold}
#LoansType .tabWrap ul .tab.on {background: #00777e}
#LoansType .tabWrap ul .tab.on a {color: #fff; font-weight: normal}
#LoansType .loansInfoView {background: #e6fffb; width: 100%; height: auto; overflow: hidden; font-family: "GmarketSansL"; font-size: 18px; text-align: left; box-sizing: border-box;
    line-height: 32px; padding: 50px; display: none; font-weight: bold}
#LoansType .loansInfoView b {font-family: "GmarketSansM"}
#LoansType .loansInfoView.on {display: block}
#LoansType .loansProcessItem {display: inline-block; float: left; position: relative; width: 384px; height: 248px; margin-right: 24px; margin-bottom: 30px}
#LoansType .loansProcessItem:nth-of-type(3n) {margin-right: 0}
#LoansType .loansProcessItem .label {background: #00777e; color: #fff; font-family: "GmarketSansM"; font-size: 20px; display: inline-block; padding: 10px 30px 5px; border-radius: 10px;
    position: absolute; left: 0; top: 0; z-index: 5}
#LoansType .loansProcessItem .box {width: 367px; height: 230px; border-radius: 10px; border: 1px solid #404040; box-sizing: border-box; margin: 20px; position: relative;
    padding: 40px 0;}
#LoansType .loansProcessItem .box .upBox {font-family: "GmarketSansL"; line-height: 24px; font-weight: bold}
#LoansType .loansProcessItem .box .upBox b {font-family: "GmarketSansM"; font-size: 18px}
#LoansType .loansProcessItem .box .downBox {position: absolute; bottom: 0; width: 100%; height: 58px; background: #d03a5b}
#LoansType .loansProcessItem .box .downBox a {display: inline-block; width: 100%; height: 100%; font-family: "GmarketSansM"; font-size: 18px; color: #fff; line-height: 60px}
#LoansType .courseListItem {text-align: left !important; margin: 20px 16px}
#LoansType .courseListItem:nth-of-type(3){margin-right: 0}
#LoansType .btnWrap {margin-top: 50px; display: block; clear: both; background: #00f0ff; border-radius: 60px; height: 87px; width: 100%}
#LoansType .btnWrap a {display: inline-block; width: 100%; height: 100%; line-height: 100px; font-family: "GmarketSansB"; color: #273889; font-size: 43px; box-sizing: border-box}

/*문화누리카드*/
#mNuni .mNuriInfoWrap {padding: 100px 0; min-width: 1200px; height: auto; overflow: hidden; box-sizing: border-box}
#mNuni .mNuriInfoWrap:nth-of-type(2) {background: #f5f6f8}
#mNuni .mNuriInfoWrap .mNuriInfoBox1 {display: inline-block; width: 401px; float: left; margin-top: 54px; float: left}
#mNuni .mNuriInfoWrap .mNuriInfoBox2 {display: inline-block; width: 725px; float: right}
#mNuni .mMuriInfoBtn {width: 100%; height: auto; overflow: hidden; margin-top: 80px}
#mNuni .mMuriInfoBtn a~a {margin-left: 11px}
#mNuni .mNuriInfoWrap:nth-of-type(5) .mMuriInfoBtn a~a {margin-left: 75px}
#mNuni .mNuriInfoFooter {background: url("../Images/Mnuri/MnuriInfo_img6_bg.jpg") no-repeat; -moz-background-size: 100%; padding: 137px 0; box-sizing: border-box}
#mNuni .mNuriBar.on {position: fixed; background: #dfe5f1}
#mNuni .mNuriBar {width: 100%; height: 100px; position: relative; bottom: 0; background: #dfe5f1}
#mNuni .mNuriInfoBg {background: #f2f2f2}

/*문화누리카드 패키지*/
#MnuriPackage .packageWrap.notice {background: #f8f8f8}
#mp .packageInner .title {margin: 100px}
#mp .packageInner .contentsWrap a {display: inline-block}
#mp .packageInner .contentsWrap a~a {margin-left: 55px}
#MnuriPackage .MPBar {width: 100%; height: 100px; position: relative; bottom: 0; background: #dfe5f1; padding: 18px 0; box-sizing: border-box}
#MnuriPackage .MPBar.on {position: fixed}
#MnuriPackage .vpCourseSelect {width: 360px; display: inline-block; margin-left: 30px; margin-top: 10px}
#MnuriPackage .vpCourseSelect, #MnuriPackage .priceWrap {display: inline-block; float: left}
#MnuriPackage .priceWrap {width: 360px; text-align: right; font-size: 20px;}
#MnuriPackage .inner1200 a {display: inline-block; float: right; margin-right: 30px}
#MnuriPackage .vpCourseSelect select {-webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box;
    background: url("../Images/downArrow.png") 100% no-repeat; font-family: "GmarketSansM"; background-color: #fff; height: 44px; font-size: 18px}
#MnuriPackage .vpCourseSelect select option {font-family: "Noto Sans KR"}
.VPPopupArea.mpType {left: 50%}
#voucherPackage .sellBox.mpType {min-height: 430px}
#voucherPackage .sellBox.mpType .sellBox_info {min-height: 200px}
#voucherPackage .scrollWrap.mpType {height: 406px}

/*직업교육 유의사항*/
#packageType .exGroupWrap .noticeWrap b {color: #0c0c0c; vertical-align: sub}
#packageType .exGroupWrap:nth-of-type(7) {background: #f4f4f4}
#packageType .exGroupSectionTitle {text-align: left}