@charset "utf-8";
@import url('Pretendard.css');
@import url('GangwonEduPower.css');
@import url('NanumSquare.css');
@import url('NotoSansKR.css');
@import url('Montserrat.css');


hr {height: 0;margin: 0;border: 0 none;}


/* ========================================================================================================== */
/* ================================================== 레이아웃 ================================================== */
/* ========================================================================================================== */
div.wrapper {overflow: hidden;position: relative;min-width: 1300px;font-size: 17px;line-height: 30px;color: #5c5c5c;font-family:'Pretendard-Regular', sans-serif;}

#headerWrap {z-index: 100;position: relative;padding-top: 40px;height: 115px;}
#headerWrap:before {position: absolute;top: 0;left: 0;display: block;width: 100%;height: 40px;background-color: #3c6476;content: '';}
#headerWrap > div {position: relative;width: 1300px;margin: 0 auto;box-sizing: border-box;}
#headerWrap h1 {position: absolute;top: 25px;left: 50%;margin-left: -650px;}
#headerWrap h1 a {display: block;text-decoration: none;}
#headerWrap h1 img {display: block;}

#headerWrap div.viewMenu {position: absolute;top: 33px;right: 0;}
#headerWrap div.viewMenu a {display: block;width: 50px;height: 50px;border-radius: 50%;background: url('/image/common/viewMenu.png') center center no-repeat;font-size: 0;line-height: 0;text-indent: -9999px;}
#headerWrap div.viewMenu.active a {background-image: url('/image/common/closeMenu.png');}

#headerWrap .gnbBg {display: none;position: absolute;top: 155px;left: 0;width: 100%;content: '';background-color: rgba(57,64,66,0.82);}

/* GNB */
ul#gnb, ul#gnb li, ul#gnb a {display: block;margin: 0;padding: 0;list-style: none;text-decoration: none;}
ul#gnb {position: absolute;top: 0;right: 50px;padding: 26px 0 25px;font-size: 0;line-height: 0;text-align: right;}
ul#gnb > li {position: relative;display: inline-block;vertical-align: top;padding: 20px 30px 20px;max-width: 110px;text-align: center;}
ul#gnb > li > a {display: inline-block;position: relative;color: #696969;font-size: 20px;line-height: 24px;font-family: 'Pretendard-Regular', sans-serif;letter-spacing: -0.5px;}
ul#gnb > li.on > a {color: #eb543d;font-family: 'Pretendard-Bold', sans-serif;}
ul#gnb > li.on > a:after {position: absolute;z-index: -1;bottom: 0;left: 0;width: 100%;height: 8px;border-radius: 4px;background-color: #ffe0cb;content: '';}
ul#gnb > li:last-child:hover > a {letter-spacing: -1.5px;}
ul#gnb > li:last-child ul a:hover {letter-spacing: -1px;}
/* GNB 2depth */
ul#gnb ul {display: none;position: absolute;z-index: 50;top: 90px;left: 0;text-align: center;width: 100%;padding-top: 10px;}
ul#gnb ul li a {padding: 10px 0;color: #ddd;font-size: 16px;line-height: 16px;font-family: 'Pretendard-Light', sans-serif;word-break: keep-all;}
ul#gnb ul li a:hover {color: #ffc342;font-family: 'Pretendard-SemiBold', sans-serif;}

ul.headerUtil, ul.headerUtil li, ul.headerUtil a {display: block;margin: 0;padding: 0;list-style: none;text-decoration: none;}
ul.headerUtil {position: absolute;top: -40px;right: 0;font-size: 0;line-height: 0;text-align: right;}
ul.headerUtil li {position: relative;display: inline-block;vertical-align: top;padding: 10px 20px;}
ul.headerUtil li:last-child {padding-right: 0 !important;}
ul.headerUtil li:before {position: absolute;top: 15px;left: 0;width: 1px;height: 10px;background-color: rgba(255,255,255,0.17);content: '';}
ul.headerUtil li:first-child:before {display: none;}
ul.headerUtil li a {color: #fff;font-size: 13px;line-height: 20px;font-family: 'Pretendard-Medium', sans-serif;}


#container {position: relative;background: url('/image/common/bg.png') center top no-repeat;}

.pageTit {margin: 0;padding: 60px 0 50px;text-align: center;color: #282828;font-size: 40px;line-height: 50px;font-family: 'GangwonEduPowerExtraBold', sans-serif;}

/* LNB 메뉴 */
div.lnbWrap {width: 1300px;height: 60px;margin: 0 auto;border-radius: 30px 30px 0 0;background: linear-gradient(14deg, #13a5d3, #14c7a3);box-shadow: 0 7px 8px rgba(0,0,0,0.07);}
div.lnbWrap:after {display: block;clear: both;height: 0;line-height: 0;font-size: 0;content: '';}

div.lnbWrap dl, div.lnbWrap dt, div.lnbWrap dd, div.lnbWrap ul, div.lnbWrap li, div.lnbWrap a {display: block;margin: 0;padding: 0;list-style: none;}

div.lnbWrap > * {float: left;}
div.lnbWrap a {display: block;font-family: 'Pretendard-Medium', sans-serif;}

div.lnbWrap p {padding-left: 10px;}
div.lnbWrap p > a {width: 65px;height: 60px;font-size: 0;line-height: 0;background: url('/image/common/lnb_home.png') center center no-repeat;}

div.lnbWrap dl {z-index: 50;position: relative;float: left;height: 60px;}
div.lnbWrap dl:before {position: absolute;top: 23px;left: 0;display: block;width: 1px;height: 15px;background-color: rgba(255,255,255,0.41);content: '';}
div.lnbWrap dt a {position: relative;min-width:170px;font-size: 16px;line-height: 30px;padding:15px 30px 15px 27px;font-family: 'Pretendard-SemiBold', sans-serif;color: rgba(255,255,255,0.58);box-sizing: border-box;}
div.lnbWrap dt a:after {display: block;position: absolute;top: 29px;right: 20px;width: 7px;height: 3px;background: url('/image/common/lnb_depth.png');content: '';}
div.lnbWrap dt.view a {color: #fff;}
div.lnbWrap dt.view a:after {background-image: url('/image/common/lnb_depth_on.png');}
div.lnbWrap dd {position: absolute;width: 100%;top: 60px;padding: 10px 18px 0 18px;border: 3px solid #13a5d3;border-top: 0 none;background-color: #fff;box-shadow:0 2px 15px rgba(0,0,0,.35);box-sizing: border-box;}
div.lnbWrap dd li {border-bottom: 1px solid #dcdcdc;}
div.lnbWrap dd li:last-child {border-bottom: 0 none;}
div.lnbWrap dd a {display: block;font-size: 15px;line-height: 24px;padding:10px 7px;color: #a0a7a7;}
div.lnbWrap dd a:hover {color: #313434;}

div#container > div.contents {width: 1300px;padding: 50px 0 40px;margin: 0 auto;box-sizing: border-box;}

#footerWrap {background-color: #56575d;color: #fff;font-size: 15px;line-height: 22px;font-family: 'Pretendard-Light', sans-serif;}
#footerWrap div {width: 1300px;margin: 0 auto;padding: 28px 102px;background: url('/image/common/footer_logo.png') left center no-repeat;box-sizing: border-box;}
#footerWrap div p {color: #ccc;}

ul.footerMenu, ul.footerMenu li, ul.footerMenu a {display: block;margin: 0;padding: 0;list-style: none;text-decoration: none;}
ul.footerMenu {margin-top: 10px;}
ul.footerMenu:after {display: block;clear: both;height: 0;line-height: 0;font-size: 0;content: '';}
ul.footerMenu li {float: left;margin-left: 5px;}
ul.footerMenu li:first-child {margin-left: 0;}
ul.footerMenu li a {padding: 0 25px;border-radius: 3px;border: 1px solid #e7e7e7;text-align: center;color: #fff;line-height: 26px;font-size: 14px;font-family: 'Pretendard-ExtraLight', sans-serif;}

/* ====== 메인 ====== */
div#container.main {background-image: none !important;}

div.mainBnr {position: relative;}
div.mainBnr ul, div.mainBnr ul li, div.mainBnr img {display: block;margin: 0;padding: 0;list-style: none;}
div.mainBnr li {background-position: center top;background-repeat: no-repeat;}
div.mainBnr li a {cursor:pointer;}
div.mainBnr img {width: 1920px;margin: 0 auto;}

div.mainBnr .bx-pager {position: absolute;bottom: 35px;left: 50%;padding: 10px 15px;border-radius: 21px;transform: translateX(-50%);background-color: rgba(0,0,0,0.2);font-size: 0;line-height: 0;text-align: center;}
div.mainBnr .bx-pager > div {position: relative;display: inline-block;vertical-align: top;padding: 8px;text-align: center;}
div.mainBnr .bx-pager > div a {display: inline-block;vertical-align: top;width: 6px;height: 6px;border-radius:3px;background-color: #fff;}
div.mainBnr .bx-pager > div a.active {}
div.mainBnr .bx-pager > div a.active:after {position: absolute;top: 0;left: 0;width: 22px;height: 22px;border-radius: 50%;border: 1px solid #fff;background-color: transparent;box-sizing: border-box;content: '';}

div.mainBnr .bx-prev,
div.mainBnr .bx-next {position: absolute;top: 50%;display: block;width: 70px;height: 70px;margin-top: -35px;background-repeat: no-repeat;background-position: center center;font-size: 0;line-height: 0;text-indent: -9999px;}
div.mainBnr .bx-prev {left: 50%;margin-left: -830px;background-image: url('/image/main/mainBnr_prev.png');}
div.mainBnr .bx-next {right: 50%;margin-right: -830px;background-image: url('/image/main/mainBnr_next.png');}
div.mainBnr .bx-prev:hover {background-image: url('/image/main/mainBnr_prev_ov.png');}
div.mainBnr .bx-next:hover {background-image: url('/image/main/mainBnr_next_ov.png');}

div.mainLogin {position: absolute;top: 80px;right: 50%;width: 430px;min-height: 400px;margin-right: -650px;padding: 37px 50px 38px;background-color: #e6503a;border-radius: 50px 0 50px 0;box-sizing: border-box;}
div.mainLogin h2 {padding: 5px 0 25px;text-align: center;color: #fff;font-weight: normal;font-size: 30px;line-height: 34px;font-family: 'Pretendard-SemiBold', sans-serif;}
div.mainLogin h2 span {display: block;color: rgba(255,255,255,0.62);font-size: 14px;line-height: 18px;font-family: 'Pretendard-Medium', sans-serif;text-transform: uppercase;}

div.mainLogin dl, div.mainLogin dt, div.mainLogin dd {margin: 0;padding: 0;}
div.mainLogin dl {position: relative;}
div.mainLogin dt {position: absolute;top: 60px;left: 0;width: 70px;padding-left: 24px;}
div.mainLogin dt:first-child {top: 0;}
div.mainLogin dt:first-child + dd {margin-bottom: 10px;}
div.mainLogin dt label {color: #fff;font-size: 14px;line-height: 50px;font-family: 'Pretendard-SemiBold', sans-serif;}
div.mainLogin dd {width: 100%;padding-left: 95px;border: 1px solid rgba(255,255,255,0.65);border-radius: 25px;box-sizing: border-box;}
div.mainLogin dd input {width: 100%;height: 48px;border: 0 none;background-color: transparent;box-sizing: border-box;color: #fff;}

div.saveID {padding: 10px 0;text-align: right;font-size: 0;line-height: 0;}
div.saveID > * {display: inline-block;vertical-align: top;}
div.saveID label {margin-left: 8px;color: #fff;font-size: 15px;line-height: 18px;font-family: 'Pretendard-Medium', sans-serif;}
div.saveID span.inputC {width: 18px;height: 18px;border-radius: 50%;background-color: #fff;background-image: none;border: 0 none;}
div.saveID span.inputC.on {}
div.saveID span.inputC.on:after {position: absolute;top: 50%;left: 50%;width: 8px;height: 8px;border-radius: 50%;background-color: #d7523b;transform: translate(-50%, -50%);content: '';}

div.mainLogin div.btn {margin-top: 10px;}
div.mainLogin div.btn > * {width: 100%;height: 50px;padding: 10px 65px 10px 34px;border-radius: 25px;background: #2c5866 url('/image/main/mainLogin_arr.png') right 34px center no-repeat;border: 0 none;text-align: left;color: #fff;font-size: 20px;line-height: 30px;font-family: 'Pretendard-Bold', sans-serif;box-sizing:border-box;box-shadow: 0 2px 13px rgba(129,165,168,0.13);}
div.mainLogin div.btn a.logout {background-color: #4b332f;}

ul.loginUtil, ul.loginUtil li, ul.loginUtil a {display: block;margin: 0;padding: 0;list-style: none;text-decoration: none;}
div.mainLogin ul.loginUtil {margin-top: 15px;font-size: 0;line-height: 0;text-align: right;}
div.mainLogin ul.loginUtil li {display: inline-block;vertical-align: top;padding: 0 16px;}
div.mainLogin ul.loginUtil a {color: #fff;font-size: 13px;line-height: 20px;font-family: 'Pretendard-SemiBold', sans-serif;}
div.mainLogin ul.loginUtil img {display: inline-block;vertical-align: top;margin-right: 5px;}

div.myInfo {padding: 25px 0 32px;}
div.myInfo .userInfo {padding: 6px 0 43px;text-align: center;color: #fff;font-weight: normal;font-size: 30px;line-height: 34px;font-family: 'Pretendard-SemiBold', sans-serif;}
div.myInfo .userInfo span {display: inline-block;vertical-align: top;font-family: 'Pretendard-SemiBold', sans-serif;}

div.myInfo div.goto {margin: 0;padding: 0;}
div.myInfo div.goto > a {position: relative;display: block;padding: 14px 54px 14px 24px;border: 1px solid rgba(255,255,255,0.62);border-radius: 25px;color: #fff;font-size: 14px;line-height: 20px;font-family: 'Pretendard-SemiBold', sans-serif;}
div.myInfo div.goto > a + a {margin-top: 10px;}
div.myInfo div.goto img {position: absolute;top: 12px;right: 28px;}

div.myInfo div.goto > a:hover {background-color: #1092bb;border-color: #1092bb;}

div.myInfo div.btn {margin-top: 25px;}

div.mainQuick {background-color: #f9fafd;border-bottom: 1px solid #e5e5e5;}
div.mainQuick ul, div.mainQuick li, div.mainQuick a {display: block;margin: 0;padding: 0;list-style: none;}
div.mainQuick ul {width: 1376px;margin: 0 auto;padding: 55px 0;display: flex; justify-content:space-between;}
div.mainQuick ul:after {display: block;clear: both;height: 0;font-size: 0;line-height: 0;content: '';}
div.mainQuick li {float: left;width: 14.2857%;}
div.mainQuick a {position: relative;padding-top: 130px;text-align: center;color: #333;font-size: 18px;line-height: 24px;}
div.mainQuick a img {position: absolute;top: 0;left: 50%;margin-left: -60px;z-index: 5;display: block;}
div.mainQuick a:before {position: absolute;top: 0;left: 50%;width: 120px;height: 120px;margin-left: -60px;border-radius: 40px;border: 1px solid #dee4f6;background-color: #fff;box-shadow: 0 0 12px rgba(0,0,0,0.04);content: '';}

div.mainQuick a:hover {color: #2e4497;}
div.mainQuick a:hover img {top: -22px;}
div.mainQuick a:hover:before {top: -22px;border-color: #5472e3;}

div.mainEdu {width: 1300px;margin: 0 auto;padding: 50px 0 70px;}
div.mainEdu:after {display: block;clear: both;height: 0;line-height: 0;font-size: 0;content: '';}
div.mainEdu dl, div.mainEdu dt, div.mainEdu dd {margin: 0;padding: 0;}

div.mainEdu dl {float: left;margin-left: 30px;width: 413px;min-height: 194px;border-width: 1px;border-style: solid;padding: 37px 58px 50px;color: #fff;box-sizing: border-box;}
div.mainEdu dl:first-child {margin-left: 0;}
div.mainEdu dt {display: table-cell;width: 800px;height: 64px;text-align: center;vertical-align: middle;font-size: 28px;line-height: 32px;font-weight: normal;font-family: 'Pretendard-SemiBold', sans-serif;}
div.mainEdu dd {padding-top: 20px;}
div.mainEdu dd > a {display: block;margin-top: 10px;padding: 10px 55px 10px 25px;background: url('/image/main/main_arr_w.png') right 25px center no-repeat;border-radius: 10px;border: 1px solid #fff;font-size: 18px;line-height: 28px;}
div.mainEdu dd > a:first-child {margin-top: 0;}

div.mainEdu dl:nth-child(1) {border-radius: 50px 50px 0px 50px;border-color: #283975;background: linear-gradient(to bottom, #3d54ab, #344892);}
div.mainEdu dl:nth-child(2) {border-radius: 50px 0px 50px 50px;border-color: #1b4159;background: linear-gradient(to bottom, #2e6e97, #275e81);}
div.mainEdu dl:nth-child(3) {border-radius: 50px 50px 50px 0px;border-color: #1b5759;background: linear-gradient(to bottom, #2e9397, #277e81);}

div.mainEdu dd > a:hover {background-color: #fff;background-image: url('/image/main/main_arr.png');color: #000;}

div.mainMore {position: relative;background-color: #f0f0f0;}
dl.mainBbs dt, dl.mainBbs dd, dl.mainBbs ul, dl.mainBbs li {margin: 0;padding: 0;list-style: none;}
dl.mainBbs {width: 1300px;margin: 0 auto;padding: 34px 524px 45px 0;box-sizing: border-box;color: #111;}
dl.mainBbs dt {font-size: 28px;line-height: 35px;font-family: 'Pretendard-SemiBold', sans-serif;}
dl.mainBbs dd {padding-top: 13px;min-height: 174px;}
dl.mainBbs ul {}
dl.mainBbs ul:after {display: block;clear: both;height: 0;line-height: 0;font-size: 0;content: '';}
dl.mainBbs li {float: left;width: 383px;margin: 10px 0 0 10px;}
dl.mainBbs li:nth-child(-n+2) {margin-top: 0;}
dl.mainBbs li:nth-child(2n+1) {clear: both;margin-left: 0;}
dl.mainBbs li a {display: block;padding: 25px 55px 25px 24px;background: url('/image/main/main_arr.png') right 24px center no-repeat;border: 1px solid #ddd;background-color: #fff;border-radius: 10px;font-size: 18px;line-height: 30px;text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
dl.mainBbs li a:hover {color: #374c9b;font-family: 'Pretendard-Medium', sans-serif;}

div.mainYoutube {z-index: 5;position: absolute;top: -20px;right: 50%;margin-right: -650px;width: 495px;height: 320px;}
div.mainYoutube:after {position: absolute;display: block;top: 0;right: -10px;width: 10px;height: 20px;background: url('/image/main/mainYoutube_bg.png') left top no-repeat;content: '';}
div.mainYoutube ul, div.mainYoutube li {margin: 0;padding: 0;list-style: none;}
div.mainYoutube ul,
div.mainYoutube li {height: 320px;}

div.mainYoutube .bx-pager {position: absolute;top: 33px;right: 15px;font-size: 0;line-height: 0;text-align: right;}
div.mainYoutube .bx-pager > div {display: inline-block;vertical-align: top;margin-left: 5px;}
div.mainYoutube .bx-pager > div a {display: block;width: 12px;height: 12px;border-radius: 6px;background-color: #fff;}
div.mainYoutube .bx-pager > div a.active {width: 24px;background-color: #d82d36;}

ul.mainSponsor, ul.mainSponsor li, ul.mainSponsor a, ul.mainSponsor img {display: block;margin: 0;padding: 0;list-style: none;text-decoration: none;}
ul.mainSponsor {width: 1300px;margin: 0 auto;padding: 18px 0;font-size: 0;line-height: 0;text-align: center;}
ul.mainSponsor li {position: relative;display: inline-block;padding: 0 25px;vertical-align: top;}
ul.mainSponsor li:before {position: absolute;top: 14px;left: 0;width: 1px;height: 38px;background-color: #d5d5d5;content: '';}
ul.mainSponsor li:first-child:before {display: none;}
ul.mainSponsor a {display: table-cell;height: 64px;vertical-align: middle;}
ul.mainSponsor img {max-height: 90%;margin: 0 auto;}