<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "utf-8";

/* CSS Document */

/** NotoSans Font 설정 **/
@font-face {
font-family: 'NotoSansL';
font-style: normal;
font-weight: 100;
src: local('Noto Sans Light'), local('NotoSans-Light'), url(../webfont/NotoSans-Light.eot);
src: url(../webfont/NotoSans-Light.eot?#iefix) format('embedded-opentype'),
url(../webfont/NotoSans-Light.woff2) format('woff2'),
url(../webfont/NotoSans-Light.woff) format('woff');
}
@font-face {
font-family: 'NotoSansR';
font-style: normal;
font-weight: 300;
src: local('Noto Sans Regular'), local('NotoSans-Regular'), url(../webfont/NotoSans-Regular.eot);
src: url(../webfont/NotoSans-Regular.eot?#iefix) format('embedded-opentype'),
url(../webfont/NotoSans-Regular.woff2) format('woff2'),
url(../webfont/NotoSans-Regular.woff) format('woff');
}
@font-face {
font-family: 'NotoSansM';
font-style: normal;
font-weight: 500;
src: local('Noto Sans Medium'), local('NotoSans-Medium'), url(../webfont/NotoSans-Medium.eot);
src: url(../webfont/NotoSans-Medium.eot?#iefix) format('embedded-opentype'),
url(../webfont/NotoSans-Medium.woff2) format('woff2'),
url(../webfont/NotoSans-Medium.woff) format('woff');
}
@font-face {
font-family: 'NotoSansB';
font-style: normal;
font-weight: 700;
src: local('Noto Sans Bold'), local('NotoSans-Bold'), url(../webfont/NotoSans-Bold.eot);
src: url(../webfont/NotoSans-Bold.eot?#iefix) format('embedded-opentype'),
url(../webfont/NotoSans-Bold.woff2) format('woff2'),
url(../webfont/NotoSans-Bold.woff) format('woff');
}

/* 기본 테이블 */
table {width: 100%; border-collapse: separate; border-top: 1px solid #333; border-left: 1px solid #ddd; vertical-align: middle;}
.tblCapt {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; white-space:nowrap; border:0;}
table thead th {line-height: 24px; font-weight: 500; letter-spacing: -0.048em; background: #f8f8f8; border-bottom: 1px solid #bbb; font-weight:bold;}
table tbody th, table tbody td {line-height: 24px; position: relative;}
table tbody th { background: #fdfdfd; font-weight:bold;}
table th, table td {border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 12px 16px;}
/* 변형 테이블 */
table.trsTblSt0 {}
table.trsTblSt1 {border-top:none; border-left:none;}
table.trsTblSt1 th {background-color:inherit; color:#333;}
table.trsTblSt1 tbody th {font-weight:normal;}
table.trsTblSt1 th, table.trsTblSt1 td {border-right:none; border-bottom: 1px dashed #c1c1c1;}
table.trsTblSt1 td {line-height:20px; padding: 10px 16px; text-align:center;}
table.trsTblSt1 tbody tr:last-child th, table.trsTblSt1 tbody tr:last-child td {border-bottom: 1px solid #c1c1c1;}
table.trsTblSt2 {border-top:2px solid #333; border-left:none;}
table.trsTblSt2 th {background-color:inherit; color:#333;}
table.trsTblSt2 tbody th {font-weight:normal;}
table.trsTblSt2 th, table.trsTblSt2 td {border-right:none; border-bottom: 1px dashed #c1c1c1;}
table.trsTblSt2 td {line-height:20px; padding: 10px 16px; text-align:center;}
table.trsTblSt2 tbody tr:last-child th, table.trsTblSt2 tbody tr:last-child td {border-bottom: 1px solid #c1c1c1;}
table.trsTblSt2  &gt; thead &gt; tr &gt;  th {background: #fcfcfc;}
table.trsTblSt3 {border-top:2px solid #333; border-left:none;}
table.trsTblSt3 th {background-color:#fcfcfc; color:#333;}
table.trsTblSt3 tbody th {font-weight:normal;}
table.trsTblSt3 th, table.trsTblSt3 td {border-right:none; border-bottom: 1px dashed #c1c1c1;}
table.trsTblSt3 td {line-height:20px; padding: 10px 16px; text-align:left;}
table.trsTblSt3 tbody tr:last-child th, table.trsTblSt3 tbody tr:last-child td {border-bottom: 1px solid #c1c1c1;}
table.trsTblSt3  &gt; thead &gt; tr &gt;  th {background: #fcfcfc;}


/*문단셋팅*/
h1 {font-weight:bold;}
h2 {font-size:32px;}
h3 {font-size:24px;}

/*폰트크기*/
.fontSz1 {font-size:14px;}
.fontSz2 {font-size:16px;}
/*폰트색상*/
.fontCol1 {color:#a34407/*#e56818*/;}
.fontCol2 {color:#222e77;}
.fontCol3 {color:#108883;}

.spaceSt1 {width: 15px; display: inline-block; vertical-align: middle;}
.spaceSt2 {width: 8px; display: inline-block; vertical-align: middle;}
.readonlyInp {background-color:#ddd}

/*정렬셋팅*/
.fL {float:left;}
.fR {float:right;}
.taL {text-align:left;}
.taLi {text-align:left !important;}
.taR {text-align:right;}
.taC {text-align:center;}
.taCi {text-align:center !important;}
.vaM {vertical-align:middle;}
.clear_both {clear:both;}
.pstRel {position:relative;}
.pstAbs {position:absolute;}

.dspBlc {display:block;}

/*문단구분선*/
hr {border:none; border-top:1px solid #ccc; height:1px; margin:30px 0;}
.liDivisSt2 {overflow:hidden;}
.liDivisSt2 li {float:left; width: 49%;}
.liDivisSt2 li:nth-child(even) {margin-left:2%;}

/* 넓이 높이 */
.wid138 {width:138px;}
.wid520 {width:520px;}
.wid640 {width:640px;}
.wid730 {width:730px;}
.wid740 {width:740px;}
.wid28p {width:28.8%;}
.wid50p {width:50%;}
.wid69p {width:69.2%;}
.wid100p {width:100%;}
.wid50vw {width:50vw;}
.widCalcSt1 {width: calc(100% - 110px);}
.minht139px {min-height:139px;}

/*마진셋팅*/
.mT8 {margin-top:8px;}
.mT10 {margin-top:10px;}
.mT24 {margin-top:24px;}
.mT32 {margin-top:32px;}
.mL5 {margin-left:5px;}
.mL8 {margin-left:8px;}
.mR10 {margin-right:10px;}
.mR13 {margin-right:13px;}
.pL08 {padding-left:8px;}
.pL16 {padding-left:16px;}
.pL24 {padding-left:24px;}

.txtEllipsis1 {display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; word-wrap: normal; vertical-align:middle;}
.fwBold {font-weight:bold}

.wrap {width:100%; height:100%;}

/* 버튼 */
.cursorSt1 {cursor: pointer;}
.btn_globMenu {display: inline-block; width: 32px; height: 32px; background-image: url(../images/common/btn_globmenu1.png); background-repeat: no-repeat; background-size: contain; margin:38px 0 38px 40px; text-indent: -9999px;}
.btn_popClose1 {position: absolute; top: 16px; right: 24px; display: inline-block; width: 32px; height: 32px; background-image: url(../images/common/btn_popclose1.png); background-repeat: no-repeat; background-size: contain; text-indent: -9999px;}
.btn_more {}

.btnSt0 {display:inline-block; text-align:center; vertical-align:middle;}
.btnSt1 {display:block; text-align:center; vertical-align:middle;}
.btnImgSt1 {display:inline-block; text-align:center; vertical-align:middle; background-image:url(../images/common/ico_download.png); text-indent:-9999px; background-position:center center; background-repeat: no-repeat;}
.btnImgSt2 {display:inline-block; text-align:center; vertical-align:middle; background-image:url(../images/common/ico_qna.png); text-indent:-9999px; background-position:center center; background-repeat: no-repeat;}
.btnImgSt1:hover, .btnImgSt2:hover {background-color:#efefef;}

.btnColSt0 {font-family:NotoSansL, sans-serif; color:#333; background-color:#FFFFFF; border:1px solid #c1c1c1 !important;}
.btnColSt1 {font-family:NotoSansL, sans-serif; color:#333; background-color:#dddddd; border:1px solid #c1c1c1 !important;}
.btnColSt2 {font-family:NotoSansR, sans-serif; color:#FFF; background-color:#5678c0/*#90c5c3*/; border:1px solid #5678c0/*#90c5c3*/ !important; text-shadow: 0 0 3px rgba(0,0,0,1);}
.btnColSt3 {font-family:NotoSansR, sans-serif; color:#FFF; background-color:#e79949/*#fcaf7e*/; border:1px solid #e79949/*#fcaf7e*/ !important; text-shadow: 0 0 3px rgba(0,0,0,1);}
.btnColSt4 {font-family:NotoSansL, sans-serif; font-size:14px; color:#000; background-color:#FFFFFF; border:1px solid #c1c1c1 !important; }

.btnSizeWSt0 {width:auto; padding-left:34px !important; padding-right:34px !important;}
.btnSizeWSt1 {width:100px;}
.btnSizeWSt2 {width:104px;}
.btnSizeWSt3 {width:128px;}
/*.btnSizeWSt4 {width:50px;}*/
.btnSizeWSt4 {width:55px;}
.btnSizeWSt5 {width:29px;}

.btn2Line {line-height:18px; padding-top:5px !important; padding-bottom:5px !important;}
.btnXL {font-size:12px; line-height: 46px; letter-spacing: -0.3px;}
.btnLg {font-size:12px; line-height: 38px;}
.btnMd {}
.btnSm {font-size:12px; line-height: 26px;}
.btnXS {}
.upPdsDelBtn {display:inline-block; width:20px; height:20px; border-radius:50%; vertical-align:middle; background-image: url(../images/common/btn_uppdsdel1.png); background-repeat: no-repeat; background-size: contain; margin-left:4px; margin-right:16px;}
.icoQAOpen {display:inline-block; width:20px; height:20px; vertical-align:middle; background-image: url(../images/common/ico_qaopen.png); background-repeat: no-repeat; background-size: contain;}
.icoQAPriv {display:inline-block; width:20px; height:20px; vertical-align:middle; background-image: url(../images/common/ico_qapriv.png); background-repeat: no-repeat; background-size: contain;}

.btnLoginSz1 {font-size: 20px; line-height: 104px; border-radius: 2px;}
.btnLoginSz2 {font-size: 20px; border-radius: 2px; display:table;}
.psswTbc {display:table-cell; line-height: 24px; height: 162px; vertical-align: middle;}

.btnByInpSel {margin-left:-5px !important;}

.borRadius2 {border-radius:2px;}

/***** head *****/
/* skip nav */
.scMn {position: absolute; left: 0; top: 0; width: 0; height: 0; overflow: hidden;}
.skip_nav a {position:fixed; left:0; top:0; width:100%; display:block; font-family: NotoSansR, sans-serif; font-size:17px; line-height:28px; color:#000; text-align:center; background:#fcaf7e; padding:16px; z-index:999; opacity:0; transform:translate(0,-60px); transition:opacity .3s ease-out, transform .3s ease-out;}
.skip_nav a:focus {opacity:1; transform:translate(0,0);}
/* navigation */
.navigation {padding-top:20px;}
.navigation &gt; div {width:1280px; margin:0 auto; height:36px;}
.smNav {float:right;}
.smNav li {float:left; padding: 0px 12px 0px 13px; height:36px; background:url(../images/common/line_h_dot1.png) right 12px no-repeat; line-height:30px;}
.smNav li:nth-last-child(2), .smNav li:last-child {background:none;}
.smNav li a {font-size:13px; color:#666;}
li a.langChg {display: inline-block; font-size:11px; line-height:16px; height:16px; padding:0 5px; background-color:#e0e0e0; border-radius:8px;}
li a.langChg:hover {background-color:#000; color:#fff;}
/* header */
.header {position: relative;}
.header &gt; div {width: 1280px; height: 108px; margin: 13px auto 0;}
.hd_logo {float:left;}
.logo {margin-top:31px;}
.header .logo a {width: 441px; height: 57px; display: block; background-image: url(../images/common/logo.png); background-repeat: no-repeat; background-position: left center; background-size: auto 100%; font-size:24px; font-family: NotoSansR, sans-serif; font-weight:bold; color:#222e77; line-height: 57px; letter-spacing:-2px;}
.hdLogoTxt {display: inline-block; width:260px; height:57px; margin-right:5px; text-indent:-9999px; vertical-align: bottom;}
/*.logoTxt {display: inline-block; vertical-align: bottom; height: 57px; line-height: 43px; font-size: 19px;}*/
.logoTxt {display: inline-block; vertical-align: bottom; height: 57px; line-height: 57px; font-size: 19px;}
.hd_gnb {float:right;}
.hd_gnb .gnb {float:left;}
.hd_gnb .gnb &gt; ul &gt; li {float:left; position: relative;}
.hd_gnb .gnb &gt; ul &gt; li &gt; a {position: relative; display: block; width:190px; height:108px; font-family: NotoSansM, sans-serif; text-align:center; font-size: 19px; line-height: 108px; letter-spacing: -0.048em; color: #000;}
.hd_gnb .gnb &gt; ul &gt; li .gnbSub {position:absolute; left:5%; top:108px; width:90%; display:block; border-radius:0 0 2px 2px; opacity:0; transform:translate(0,-30px); background-color:#fff; box-shadow: 0 1px 3px rgba(119,109,99,0.5); transition:opacity .3s ease-out, transform .3s ease-out;}
.hd_gnb .gnb &gt; ul &gt; li:hover .gnbSub {opacity:1; transform:translate(0,0);}
.hd_gnb .gnb &gt; ul &gt; li &gt; a:focus ~ div {opacity:1; transform:translate(0,0);}
.hd_gnb .gnb &gt; ul &gt; li &gt; a:hover {color:#bf002b;}
.gnbSub::before {content:""; display:block; width:23px; height:12px; background-image: url(../images/common/gnb_arr_st1.png); background-repeat: no-repeat; background-position: center center; background-size: auto 100%; margin:-12px 0 0 76px;}
.gnbSub &gt; div &gt; ul {padding:16px 5%}
.gnbSub &gt; div &gt; ul &gt; li &gt; a {display:block; padding:0 8px; line-height:32px;}
/* 전체메뉴 */
.globMenu {position: fixed; left: 0; top: 0; right:0; bottom:0; width: 100%; height: 100%; overflow: hidden; z-index: 910; display: none; opacity: 0; background-color:rgba(0,0,0,0.7); transition: opacity .3s ease-out;}
.globMenu.open {opacity: 1;}
.globMenu &gt; div {position:relative; width:1080px; margin:177px auto 0; background:#fff; transition:transform 9s ease-out;}
.globMenuTitArea {height:64px; padding:18px 24px; border-bottom: 1px solid #ccc; overflow:hidden}
.globMenuTit {vertical-align:middle;}
.globMenuTit span {font-size:18px; font-family: NotoSansM, sans-serif; color:#000; line-height:28px}
.globMenuCont {padding:24px; overflow:hidden;}
.globMenuCont &gt; div &gt; ul {display:table; width:100%;}
.globMenuCont &gt; div &gt; ul &gt; li {display:table-cell; width:20%; border:1px solid #ccc; border-right:none;}
.globMenuCont &gt; div &gt; ul &gt; li:last-child {border-right:1px solid #ccc;}
.gMC1Depth {display:block; font-size:16px; line-height:64px; background-color:#f5f5f5; vertical-align:middle; padding:0 24px; font-weight:bold;}
.gMC2Depth &gt; ul {padding:10px 0;}
.gMC2Depth ul li {padding-left:24px;}
.gMC2Depth &gt; ul &gt; li &gt; a {display:block; font-size:14px; line-height:24px; padding-top:10px;  padding-bottom:10px;}
.gMC3Depth ul {overflow:hidden;}
.gMC3Depth ul li {width:100% !important; height:32px; font-size:12px; line-height:18px; padding:7px 0 7px 16px;}
.gMC3Depth a::before {content:"- "; margin-left: -6px;}
.gMCPc1Depth {display:block; font-size:16px; line-height:64px; background-color:#f5f5f5; vertical-align:middle; padding:0 24px; font-weight:bold;}
.gMCPc2Depth &gt; ul {padding:10px 0;}
.gMCPc2Depth ul li {padding-left:24px;}
.gMCPc2Depth &gt; ul &gt; li &gt; a {display:block; font-size:14px; line-height:24px; padding-top:10px;  padding-bottom:10px;}
.gMCPc3Depth ul {overflow:hidden;}
.gMCPc3Depth ul li {width:100% !important; height:32px; font-size:12px; line-height:18px; padding:7px 0 7px 16px;}
.gMCPc3Depth a::before {content:"- "; margin-left: -6px;}
/***** //head *****/

/***** main contents *****/
/* main bg */
/*.mainBg1 {height:463px; background-image:url(../images/main/bg1.jpg); background-repeat: no-repeat; background-position:center center; background-color:#a9c8cd;}*/
.mainBg1 {height:340px; background-image:url(../images/main/bg1.jpg); background-repeat: no-repeat; background-position:center center; background-color:#a9c8cd;}
.mainBg1 &gt; div {width:1280px; margin:0 auto; position:relative;}
.mainBgTxt {position:absolute; top:90px; left:64px;}
.mainBgTxt p {width:824px; font-size: 45px; line-height: 63px; color:#000; letter-spacing: -1.6px; text-shadow: 0 0 10px rgba(255,255,255,0.8);}
.mainBgTxt p i {font-size: 64px; font-weight:bold; letter-spacing: -4px; display: block;}
.mainBgTxt p span {display:block; padding-left:10px; margin-top:46px; font-size: 16px; line-height: 24px; letter-spacing: -0.8px; text-shadow: 0 0 4px rgba(255,255,255,0.8);}
.mainBgTxt p span.mbSpBold {width:auto; font-size: 45px; line-height: 63px; color:#000; letter-spacing: -2px; font-family:NotoSansR, 'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋움', 'Dotum', sans-serif; margin:0; padding:0; display:inline-block;}
/* main content */
.mainCont &gt; div {margin:64px auto 0; width:1152px; height:544px;}
.mLink {position:relative; float:right; font-size:13px; line-height:18px;}
.mLink a {display:block;}
.mLinkTit {display:block; padding:42px 0 0 44px; font-size:26px; line-height:28px; font-family: NotoSansB, sans-serif; font-weight:normal; color:#fff; letter-spacing: -1px; text-shadow: 0 0 3px rgba(0,0,0,0.5);}
.mLinkSTit {display:block; padding:5px 0 0 48px; font-size:18px; line-height:28px; font-family: NotoSansM, sans-serif; font-weight:normal; color:#fff; letter-spacing: -1px; text-shadow: 0 0 3px rgba(0,0,0,0.5);}
.mLinkDesc {display:block; margin:10px 0 0 44px; color:#fff; text-shadow: 0 0 3px rgba(0,0,0,0.7);}
.mLinkBtn {position:absolute; left:46px; bottom:46px; display:block; width:146px; height:44px; font-size:13px; line-height:44px; font-family: NotoSansR, sans-serif; color:#777; background-color:#fff; padding:0 26px; background-image: url(../images/common/btn_arr_st1.png); background-repeat: no-repeat; background-position: right center;}
.mLSt1 {width:270px; height:544px; background-color:#1399a2; background-image: url(../images/main/m_link_bg1.png); background-repeat: no-repeat; background-position: right 216px; /*background-size: auto 100%;*/}
.mLSt1 .mLinkTit {font-size:32px; line-height:38px; padding:41px 0 0 45px;}
.mLSt1 .mLinkDesc {margin:7px 0 0 48px; color:#fff;}
.mLSt2 {width:572px; height:262px; background-color:#1774af; margin:0 20px 20px 0; background-image: url(../images/main/m_link_bg2.png); background-repeat: no-repeat; background-position: 326px 105px; /*background-size: auto 100%;*/}
.mLSt2 .mLinkBtn {width:94px; bottom:inherit; top:172px;}
.mLSt2 .mLinkDesc {width:210px; height:54px; font-size:13px; line-height:18px; margin:5px 0 0 47px; white-space: normal; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow: hidden; text-overflow:ellipsis; word-wrap:break-word;}
.mLSt3 {width:270px; height:262px; background-color:#776d63; margin:0 20px 20px 0;}
.mLSt3 .mLinkBtn {color:#776d63; background-image: url(../images/common/btn_arr_st2.png);}
.mLSt4 {width:270px; height:262px; background-color:#989898; margin:0 20px 0 0;}
.mLSt1 a {width:270px; height:544px;}
.mLSt2 a {display:inline-block;/*width:572px; height:262px;*/}
.mLSt3 a, .mLSt4 a {width:270px; height:262px;}
.mNotice {position:relative; float:left; font-size:16px; line-height:34px; margin-right:20px; width:572px; height:262px; background-color:#f0f0f0;}
.notiTit a {display: block; height: 57px; margin:30px 46px 0; font-family: NotoSansB, sans-serif; font-size: 26px; line-height: 55px; color: #333; border-bottom:1px solid #565656; text-indent:3px;}
.notiCont ul { margin:8px 46px;}
.notiCont &gt; ul &gt; li {height:32px;}
.notiCont &gt; ul &gt; li &gt; a {display:inline-block; width:390px; line-height:32px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; word-wrap: normal; text-indent:2px;}
.notiCont .notiDate {float:right; font-size:13px; line-height:32px; color:#7e7e7e;}
.btn_more {position: absolute; right: 46px; top: 32px; width: 32px; height: 32px; margin-top: 10px; background: url(../images/common/btn_more_st1.png) no-repeat center center; background-size:50%; text-indent:-9999px;}
.sp-caption-container {position: absolute; color: #fff; top: 0;}
.sp-buttons {text-align: left !important; left: 0 !important; bottom: 45px !important;}
.sp-button {margin-left:8px !important; margin-right:8px !important;}
.sp-button:first-child {margin-left:2px !important;}
/***** //main contents *****/

/***** SUB Page contents *****/
/* sub bg */
.subBg1 {height:207px; background-image: url(../images/common/bg2.jpg); background-repeat: no-repeat; background-position: center top;}
.subBg1 &gt; div {width:1280px; margin:0 auto; position:relative;}
.subBgTxt {position:absolute; top:92px; right:0;}
.subBgTxt p {width:470px; font-size: 30px; line-height: 40px; color:#fff; letter-spacing: -1.6px; text-shadow: 0 4px 10px rgba(0,0,0,0.5);}
.subBgTxt p i {display:block; font-size: 47px; font-weight:bold; letter-spacing: -3px;}
.subBgTxt p span {display:block; width:466px; padding-left:10px; margin-top:46px; font-size: 16px; line-height: 24px; letter-spacing: -0.8px; text-shadow: 0 2px 4px rgba(0,0,0,0.5);}

.subCont &gt; div {width:1280px; margin:0 auto;}
/* Location, Page Title, 3Depth Menu */
.subLocation {margin-top:16px;}
.subLocation ul {overflow:hidden;}
.subLocation ul li {float:left; padding:0 12px 0 18px; background-image: url(../images/common/loc_arr_st1.png); background-repeat: no-repeat; background-position: left center;}
.subLocation ul li:first-child {background-image:none; padding-left:0;}
.subLocation ul li:last-child a {color:#a34407/*#e56818*/; font-weight:bold;}
.subLocation ul li a {font-size:14px; line-height:30px;}
.subTop .subTitleLine {padding: 12px 0 28px; border-bottom: 1px solid #ddd;}
.subTop .subTitleLine h2 {display: block; height: 40px; font-family: NotoSansR, sans-serif; font-size: 32px; font-weight:normal; line-height: 40px; letter-spacing: -0.08em; color: #333;}
.subTitleLine .subTitle {padding-left:4px;}
.tab_gnb3Depth {margin-top:24px;}
.tab_gnb3Depth &gt; ul {display:table; width:100%;}
.tab_gnb3Depth &gt; ul &gt; li {display:table-cell; vertical-align:middle; text-align:center; height: 78px; border:1px solid #ddd; border-left:none;}
.tab_gnb3Depth &gt; ul &gt; li:first-child {border-left:1px solid #ddd;}
.tab_gnb3Depth &gt; ul &gt; li.on {background-color:#776d63; box-shadow:inset 0 0 0 1px #333;}
.tab_gnb3Depth &gt; ul &gt; li.on h3 {color:#fff;}
.tab_gnb3Depth &gt; ul &gt; li &gt; a {display:block; height:78px;}
.tab_gnb3Depth .split2 li {width:50%;}
.tab_gnb3Depth .split4 li {width:25%;}
.joinStepMn li {position:relative;}
.joinStepMn li.on::after {position: absolute; display: block; content: ''; width: 48px; height: 48px; right: -24px; top: 50%; margin-top:-24px; background-image: url(../images/common/btn_nextstep.png); background-repeat: no-repeat; background-position: center center; background-size: contain;}
.joinStepMn li:last-child.on::after {display: none;}
.tab_gnb3Depth h3 {display:inline-block; font-size:24px; color:#555; /*line-height:30px;*/line-height:78px;}
.engSpt4JoinStp1 &gt; li &gt; h3 {line-height:30px;}
.outTxt {float:right; text-indent:-9999px; margin: -50px 10px 0 0;}
/* sub Contents */
.subContBody {margin-top:48px; /*font-size: 15px;*/}
.sTit1 {position:relative; font-family: NotoSansR, sans-serif; font-size: 20px; line-height: 28px; color: #0a6c68/*#108c87*/; margin-top: 44px;}
.sTit1::before {position: absolute; display: block; content: ''; width: 40px; height: 2px; left: 0; top: -10px; background-color: #096f6a;}
.sTit1_1 {position:relative; font-family: NotoSansR, sans-serif; font-size: 20px; line-height: 28px; padding:5px 8px 12px; color:#8f5633/*#b06f46*/;}
.sTit2 {position:relative; font-family: NotoSansR, sans-serif; font-size: 18px; line-height: 26px; margin-top: 24px; padding:0 0 0 8px; color:#a34407/*#b06f46*/;}
/* .sTit2::before {position: absolute; display: block; content: ''; width: 8px; height: 2px; left: 8px; top: 12px; background-color: #096f6a;} */
.sTit3 {font-family: NotoSansR, sans-serif; font-size: 16px; line-height: 24px; margin-top: 16px; padding:0 0 0 16px; color:#776d63;}
.expTxt1 {line-height: 22px; color: #444; padding:0 0 0 8px; margin-top: 8px;}
.expTxt1 strong {font-family: NotoSansR, sans-serif;}
.expTxt2 {font-size: 15px; line-height: 15px; color: #555; font-family: NotoSansL, sans-serif;}
.expTxt3 {font-size: 14px; line-height: 20px; font-family: NotoSansL, sans-serif; margin-top:6px;}
.bTxt1 {font-weight:bold;}
.tblArea1 {margin-top:8px; /*padding-left:8px;*/}
.ulListArea1 {margin-top:8px; line-height: 24px;}
.ulListArea2 {line-height: 32px;}
.eduPlBox1 .ulListArea2 {display:inline-block; width:584px; vertical-align:middle;}
.ulListArea1 li, .ulListArea2 li {position:relative; padding: 2px 0 2px 20px;}
.ulListArea1 li::before, .ulListArea2 li::before {position: absolute; display: block; content: ''; width: 4px; height: 4px; left: 8px; top: 12px; background-color: rgba(252,175,126,0.7); border-radius: 2px;}
.ulListArea1.colorSt1 li::before {background-color: rgba(144,197,195,0.7);}
.ulListArea1.colorSt2 li::before {background-color: rgba(51,51,51,1);}
.ulListArea2.colorSt2 li::before {top: 16px; background-color: rgba(51,51,51,1);}
.ulList2Depth li::before {position: absolute; display: block; content: ''; width: 4px; height: 1px; left: 8px; top: 14px; background-color: rgba(51,51,51,0.5) !important; border-radius: 0px;}
.sTit2 ~ .tblArea1, .sTit2 ~ .ulListArea1 {padding-left:8px;}
.sTit2 ~ .expTxt1, .sTit2 ~ .expTxt2, .sTit2 ~ .expTxt3, .sTit3 ~ .tblArea1, .sTit3 + .ulListArea1 {padding-left:16px;}
.sTit3 ~ .expTxt1, .sTit3 ~ .expTxt2, .sTit3 ~ .expTxt3 {padding-left:24px;}
.lineBox0 {padding:4px 0 15px; border-top:2px solid #333; border-bottom:1px solid #c1c1c1;}
.lineBox1 {padding:14px 0 15px; border-top:2px solid #333; border-bottom:1px solid #c1c1c1;}
.lineBox2 {padding:14px 0 0; border-top:2px solid #333;}
.eduPlBox1 {padding:22px 54px; background-color:#f5f5f5; border-bottom:1px solid #c1c1c1;}
.eduPlBox1 .btnLocSt1 {width:130px; text-align:right; display:inline-block; vertical-align:middle;}
.eduPBRight {display:inline-block; width:580px; text-align:right; vertical-align:middle;}
.eduProgressArea {display:inline-block; vertical-align:middle; text-align:center; margin-right:64px;}
.progTxt {display:block;font-size:14px; color:#333;}
.progTxt i {font-size:20px; color:#8f5633/*#b06f46*/;}
.eduProGraph {width:320px; height:96px; padding:23px 9px 25px 11px; text-align:left; background: url(../images/etc/img_grpsticknew_bg1.png) no-repeat 7px 2px;}
.nStick1 {height: 32px; border-radius: inherit; background: url(../images/etc/img_grpsticknew_red.png) repeat-y left center; box-shadow: 0px 3px 3px rgba(0,0,0,0.4); border-radius: 0 6px 6px 0;}
.regClassBox1 {overflow:hidden;}
.regClassBox1 .lineBox2 {float:left; width:49%; margin-top:32px; margin-right:2%;}
.regClassBox1 .lineBox2:nth-child(2n) {margin-right:0;}
.regClassBox1 .lineBox2:nth-child(-n+2) {margin-top:0;}
.manageCertBox1 {overflow:hidden;}
.manageCertBox1 .lineBox2 {float:left; width:49%; margin-top:32px; margin-right:2%;}
.manageCertBox1 .lineBox2:nth-child(2n) {margin-right:0;}
.manageCertBox1 .lineBox2:nth-child(-n+2) {margin-top:32px;}
.regClassBox1 .eduPlBox1 {padding: 22px 24px;}
.regClassBox1 .eduPBLeft {display:inline-block; width:230px; vertical-align:top;}
.regClassBox1 .btnLocSt1 {margin-top:16px;}
.regClassBox1 .eduPBRight {width: 344px;}
.regClassBox1 .eduPlBox1 .ulListArea2 {width: 330px; text-align:left; margin-left: 15px;}
.regClassBox1 table.trsTblSt1 tbody th {background-color:#f5f5f5;}
.manageCertBox1 .eduPlBox1 .ulListArea2 {width: 350px;}
.manageCertBox1 .eduPBRight {width: 160px;}
.manageCertBox1 .eduPlBox1 .btnLocSt1 {width:160px;}
/* label, select, input css */
input, textarea, select {font-family: NotoSansL, 'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋움', 'Dotum', sans-serif;}
.inpTitle {font-size: 18px; line-height: 24px; padding-left:8px; padding-right:24px; vertical-align: middle;}
.selYearSt1 {height:48px; font-size: 16px; padding:8px 67px 8px 8px; border:1px solid #c1c1c1; color:#555; text-align: left; text-align-last: left; display: inline-block; vertical-align: middle; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(../images/common/bg_select1.png) right center no-repeat;}
.selYearSt1::-ms-expand { display: none; }
.selectSt1 {height:28px; font-size: 16px; padding:0px 67px 0px 8px; border:1px solid #ddd; color:#555; text-align: left; text-align-last: left; display: inline-block; vertical-align: middle; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(../images/common/bg_select1.png) right center no-repeat;}
.selectSt1::-ms-expand { display: none; }
.inpBoxSt1 {height: 48px !important; padding-left: 16px; padding-right: 16px; border: 1px solid #ddd; background: #fcfcfc; border-radius: 2px; margin-top: 0 !important;  font-size: 14px; color: #000 !important; vertical-align: middle;}
.inpBoxSt2 {height: 48px !important; padding-left: 16px; padding-right: 16px; border: 1px solid #ddd; border-radius: 2px; margin-top: 0 !important;  font-size: 16px; color: #000 !important; vertical-align: middle;}
.inpBoxSt3 {height: 28px !important; padding-left: 16px; padding-right: 16px; border: 1px solid #ddd; border-radius: 2px; margin-top: 0 !important;  font-size: 16px; color: #000 !important; vertical-align: middle;}
.inpBoxSt4 {height: 28px !important; padding-left: 16px; padding-right: 16px; border: 1px solid #ddd; background: #fcfcfc; border-radius: 2px; margin-top: 0 !important;  font-size: 16px; color: #000 !important; vertical-align: middle;}
.textAreaSt1 {width:100%; padding: 16px; border: 1px solid #ddd; border-radius: 2px; margin-top: 0 !important;  font-size: 14px; color: #000 !important; vertical-align: middle;}
.textAreaSt2 {display:block; margin:0 auto; padding: 80px; border: 1px solid #ddd; border-radius: 2px; font-size: 18px; line-height: 24px; color: #000 !important; vertical-align: middle; background-color: #f5f5f5;}
.textAreaSt3 {width:100%; padding: 16px; border: none; border-radius: 2px; margin-top: 0 !important;  font-size: 14px; color: #000 !important; vertical-align: middle; height:200px;}
/* board css */
.boardBtnGroup1 {line-height: 0; text-align: right; margin-top: 8px; vertical-align: middle;}

.boardBtnGroup2 {line-height: 0; text-align: center; margin-top: 32px; vertical-align: middle;}
.boardBtnGroup1 .btnSt0, .boardBtnGroup2 .btnSt0 {margin-left:12px;}
.boardBtnGroup2 .btnSt0:first-child {margin-left:0;}
.boardPaging {line-height: 0; text-align: center; margin-top: 32px; vertical-align: middle;}
.boardPaging a, .boardPaging strong {display: inline-block; width: 48px; height: 48px; font-family: 'NotoSansL'; font-size: 16px; line-height: 48px; font-weight: bold; text-align: center; color: #333; margin: 1px; vertical-align: middle;}
.boardPaging strong {color:#a34407/*#e56818*/; border-radius: 2px; text-decoration:underline;}
.boardPaging a:hover {text-decoration:underline;}
.pgFirst {background-image: url(/images/common/btn_pgfirst_off.png); background-position: center center; background-repeat: no-repeat; background-size: 50%;}
.pgFirst:hover {background-image: url(/images/common/btn_pgfirst_on.png);}
.pgPrev {background-image: url(/images/common/btn_pgprev_off.png); background-position: center center; background-repeat: no-repeat; background-size: 50%;}
.pgPrev:hover {background-image: url(/images/common/btn_pgprev_on.png);}
.pgNext {background-image: url(/images/common/btn_pgnext_off.png); background-position: center center; background-repeat: no-repeat; background-size: 50%;}
.pgNext:hover {background-image: url(/images/common/btn_pgnext_on.png);}
.pgLast {background-image: url(/images/common/btn_pglast_off.png); background-position: center center; background-repeat: no-repeat; background-size: 50%;}
.pgLast:hover {background-image: url(../images/common/btn_pglast_on.png);}
.tDLabels1 label {margin-right:16px;}
.tDLabels1 label:last-child {margin-right:0;}
div.upload-btn_wrap {overflow: hidden; position: relative; float: left; margin-right: -2px;}
div.upload-btn_wrap input.input_file {position: absolute; top: 0; right: 0; cursor: pointer; opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; -khtml-opacity: 0; -moz-opacity: 0; vertical-align: middle;}
.wFtTitSt1 {font-size: 32px !important; font-weight: bold; line-height: 40px !important; padding: 16px 16px !important; word-break:break-all;}
input.upload_text {float: left; width: 300px; height: 19px; line-height: 21px; border: 1px solid #bbb;}
/* 레이어팝업용 css */
.layerPopSt1 {position: fixed; left: 0; top: 0; right:0; bottom:0; width: 100%; height: 100%; overflow: hidden; z-index: 910; display: none; opacity: 0; background-color:rgba(0,0,0,0.7); transition: opacity .3s ease-out;}
.layerPopSt1.open {opacity: 1;}
.layerPopSt1 &gt; div {position: absolute; top: 50%; left: 50%; background:#fff; transition:transform 9s ease-out;}
.layerPopSt1TitArea {height:64px; padding:18px 24px; border-bottom: 1px solid #ccc; overflow:hidden}
.layerPopSt1Tit {vertical-align:middle;}
.layerPopSt1Tit span {font-size:18px; font-family: NotoSansM, sans-serif; color:#000; line-height:28px}
.layerPopSt1Cont {padding:24px; overflow:hidden;}

.joinArea {margin-top:48px;}
.joinList {overflow:auto;}
ul.joinList li {float:left; width:49%; min-height: 104px; margin-left:2%; margin-bottom: 32px; position: relative; font-size: 16px;}
ul.joinList li:nth-child(odd) {margin-left:0;}
ul.joinList li p.jiTit {margin-bottom: 8px; font-weight:bold;}
ul.joinList li p.invarValue {width: 100%; min-height: inherit; padding: 16px 24px; font-size: 16px; line-height: 16px; font-weight: normal; background-color: #ddd; color:#000;}
.mailAddArea .mailAdd {float: left; width: calc(100% / 2 - 141px) !important;}
ul.joinList .atMk {font-size: 20px; font-weight: 100; vertical-align: -7px;}
.mailAddArea .mailAdd.atMk {display: inline-block; width: 26px !important; padding: 0 3px; line-height: 44px;}
ul.joinList li .liInBox {position: relative; width: 100%; background: #fff;}
.exComment1 {font-size: 14px; font-weight:normal; color: #000; display: inline-block;}
ul.joinList .warnTxt1 {font-size: 14px; color: #ff0000;}
.myPgLabel1 {display: inline-block; position: relative; width: 100%; vertical-align: top;}
.chkOk {position: absolute; top: 50%; right: 16px; width: 26px; height: 18px; margin-top: -9px; font-size: 0; background: url(/images/common/ico_chkok.png) 0 0 no-repeat;}
ul.joinList .warnOk {color: #108883;}
/* ul.joinList .warnTxt1:last-child {display: block;} */
.necTxt {display: inline-block; font-weight:normal; padding-right: 5px; color: #ff0000;}
.memBox {height: 320px; overflow-y: scroll; overflow-x: hidden; margin:8px 8px 0; padding:32px; border: 1px solid #ddd;}
.memBox pre {word-wrap: break-word; white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-break: break-all; font-size:14px;}
.memBox pre span {font-size:15px; font-weight:bold;}
.memBox pre span.memSTit {display:block; text-align:center; font-size:17px; font-weight:bold;}
.liDivisSt2 .memBox {margin: 8px 0 0 8px;}
.impTxt1 {display: block; font-size:32px; line-height:40px; font-weight:bold; margin-bottom:32px;}
.optDivTab1 {display:inline-block; margin-top:10px;}
.optDivTab2 {display:inline-block; margin-top:10px;}
.optDTTit1 {display:inline-block;}
.optDTTit2 {display:inline-block;}
.optDTTit3 {display:inline-block;}
.optDTTit4 {display:inline-block;}
.optDTCont1 {display:inline-block;}
.optDTCont2 {display:inline-block;}
.optDTCont2 .wid50vw {max-width:736px;}
.verifCodeInpArea {margin-top:8px;}
.verifCodeSendArea {display:inline-block;}
.memDBReWriBtn {margin-top: -6px !important; margin-left: 40px !important;}
.pwdPopSz1 {width:500px; height:232px; margin-top:-116px; margin-left:-250px;}
.pwdPopSz2 {width:80vw; height:670px; max-width:900px; margin-top:-335px; margin-left:-450px;}
.popDivScrSt1 {overflow-y:scroll; height: 420px;}
.qustUlSt1 li {padding-left:20px;}
.inpRdoBtnSt1 {margin-left:-16px;}
.qustImgSt1 {vertical-align:middle;}
.grpArea1 {margin-top: 8px; padding-left: 8px; font-size:0; line-height:0;}
.grpArea1 ul {border:1px solid #cccccc; padding:10px 0; text-align:center;}
.grpArea1 ul li {position:relative; display:inline-block; width:212px; height:50px; margin:10px 21px; vertical-align:middle; font-family: NotoSansR, 'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋움', 'Dotum', sans-serif; font-size:15px; line-height:50px; color:#fff;}
.grpArea1 ul li::after {position: absolute; display: block; content: ''; width: 42px; height: 42px; right: -42px; top: 50%; margin-top:-21px; background-image: url(../images/common/btn_nextstep2.png); background-repeat: no-repeat; background-position: center center; background-size: contain;}
.grpArea1 ul li:last-child::after {display: none;}
.bgColSt1 {background-color:#2c9f75;}
.bgColSt2 {background-color:#23968a;}
.bgColSt3 {background-color:#2c909f;}
.bgColSt4 {background-color:#2c809f;}
.bgColSt5 {background-color:#386f9d;}
.infoTxtBoxArea {display:table; width: 100%; min-height: 105px; margin-top:8px;}
.infoTxtBoxSt1 {display:table-cell; padding:22px 22px 22px 142px; background-color:#f8f8f8; vertical-align:middle; font-family: NotoSansR, 'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋움', 'Dotum', sans-serif; font-size:15px; line-height:1.5; color:#333; border-radius:6px; background-image: url(../images/common/info_txt_i.png); background-repeat: no-repeat; background-position: 48px center; background-size: auto;}
/***** //SUB Page contents *****/


/***** Login *****/
.loginMenuWrap {width: 640px; padding: 0 40px; margin: 0 auto; border: 1px solid #fff; background-color: #fff; color: #fff; line-height: 1.5;}
.useInfoTitle {display: table; width: 100%; margin-bottom: 24px;}
.useInfoTitArea {display: table-cell; vertical-align: middle;}
.useInfoTit {display: inline-block; padding-right: 18px; font-family: 'NotoSansR', sans-serif; font-size: 36px; color:#555;}
.useInfoText {display: inline-block; width:424px; margin-left: 0; font-family: 'NotoSansL', sans-serif; font-size: 16px; line-height: 1.4; color:#555;}
.useInfoText strong {font-weight:bold; color:#222e77;}
.loginInpWrap {clear: both; border-top: 1px solid #000; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; border-left: 1px solid #ddd; background: #fff; overflow: hidden;}
.loginFormWrap { position: relative; padding: 40px 60px;}
.loginFormTitle {font-family: 'NotoSansR', sans-serif; font-size: 24px; margin-bottom: 24px; color:#333;}
.loginFormTitleText {font-family: 'NotoSansL', sans-serif; font-size: 14px; margin-left: 10px; color:#555;}
.loginInpBoxWrap {overflow: hidden;}
.loginId, .loginPassword {position: relative; font: bold 14px '돋움', dotum, Verdana, Geneva, sans-serif;}
.loginId {margin-bottom: 10px;}
.inpInTxt1 {position: absolute; font-family: 'NotoSansL', sans-serif; font-size: 14px; color: #777; top: 13px; left:0; margin-left: 16px;}
.l_InpArea {float: left;}
.l_BtnArea {float: right;}
.loginId input, .loginPassword input {width: 320px; height: 48px !important; padding-left: 86px !important; border: 1px solid #ddd; background: #fcfcfc; border-radius: 2px; margin-top: 0 !important; font-family: 'NotoSansL', sans-serif; font-size: 14px; color: #000 !important;}
input.norSt1{width: 320px; height: 48px !important; padding-left: 16px !important; padding-right: 16px !important; border: 1px solid #ddd; background: #fcfcfc; border-radius: 2px; margin-top: 0 !important; font-family: 'NotoSansL', sans-serif; font-size: 14px; color: #000 !important;}
.loginBtnWrap {margin-top: 24px; text-align:center;}
.loginBtnWrap &gt; .btnSm {margin-right: 13px;}
.loginBtnWrap &gt; .btnSm:last-child {margin-right: 0;}
/***** //Login *****/


/***** footer *****/
/* 약관, 개인정보처리방침, 이메일수집 거부 */
.footer {background: #f8f8f8; margin-top:64px;}
.ftCont &gt; div {position:relative; width:1280px; margin:0 auto; padding:47px 0 49px;}
.ftNavigation ul {overflow:hidden;}
.ftNavigation ul li {float:left; background: url(/images/common/line_h_sol1.png) right 6px no-repeat;}
.ftNavigation ul li:last-child {background: none;}
.ftNavigation ul li a {height:24px; line-height:24px; padding:0 22px 0 24px; font-family: NotoSansR, sans-serif;}
.ftNavigation ul li:first-child a {padding-left:0;}
ul li.prLink a {color:#a34407/*#e56818*/;}
/* 주소, copyright */
.ftAddress {font-size:13px; color:#555; margin-top:26px; padding-left:1px;}
.ftCopyright {font-size:12px; color:#555; margin-top:4px; padding-left:1px;}
/* 상단이동 */
.btn_top {position: absolute; right: 0; top: 44px; width: 32px; height: 32px; overflow:hidden; background: url(/images/common/btn_arr_st3.png) no-repeat center center; background-size:100%; text-indent:-9999px;}
/***** //footer *****/

.engLineH13px {line-height: 13px;}

/*#######  mobile  #######*/
@media (min-width:1280px) {
    /* .hd_gnb {float:right;}
	.header.mainMbSt1 {border-bottom: 1px solid #ddd;}
	.header &gt; div {height: 55px;} */
	.pcDpNo {display:none;}
    .pcDpNoi {display:none !important;}
}

@media (min-width:768px) and (max-width:1279px) {
    .mbBgSt1 {background:none;}
    .hd_logo {float:none;}
    .logo {margin-top: 0px; padding-top:8px;}
    .header .logo a {margin:0 auto; width: 344px; height: 40px; line-height: 40px;}
    .hdLogoTxt {width: 168px; height: 40px;}
    .logoTxt {display: inline-block; vertical-align: top; height: 40px; line-height: 40px;}
    .hd_gnb {float:left; margin-top: -48px;}
    .header.mainMbSt1 {background-color:rgba(255,255,255,0.8); border-bottom: 1px solid rgba(255,255,255,0.8);}
	.header &gt; div {width:auto; height: 55px; margin: 0 auto;}
    .btn_globMenu {margin: 12px 0 12px 12px;}
    .mainBg1 {height: 264px; background-size: cover;}
    .mainBg1 &gt; div {width: auto;}
    .mainCont {text-align: center;}
    .mainCont &gt; div {margin: 64px auto 0; width: auto; max-width:900px; height: auto; /*overflow: auto;*/}
    .mainBgTxt {top: 40px; right: 0px;}
    .mainBgTxt p {width: 640px; font-size: 30px; line-height: 53px; letter-spacing: 0.6px;}
    .mainBgTxt p i {font-size: 50px;}
    .mainBgTxt p span {padding-left: 6px; margin-top: 30px; font-size: 15px; line-height: 24px;}
    .mainBgTxt p span.mbSpBold {font-size:30px; line-height: 53px;}
    .mLink {float:none; display:inline-block; vertical-align:middle; text-align: left;}
    .mLSt1 {margin: 0 auto 20px; width: 748px; height: 262px; background-image: url(/images/main/m_link_bg1lt.png); background-position: left 50px;}
    .mLSt1 a {width: 100%; height: 262px;}
    .mLSt1 .mLinkTit {text-align:right; padding: 41px 45px 0;}
    .mLSt1 .mLinkDesc {text-align:right; margin: 7px 48px 0;}
    .mLSt2 {width: 454px; margin: 0 10px 20px 0; background-position: 216px 105px;}
    .mLSt3{margin: 0 0 20px 10px;}
    .mLSt4{margin: 0 10px 0 0px;}
    .sp-buttons {bottom: -10px !important;}
    .mLinkBtn {left: inherit; right: 46px;}
    .mNotice {float:none; display:inline-block; width:454px; margin: 0 0 0 10px; vertical-align:middle; text-align: left;}
    .notiCont &gt; ul &gt; li &gt; a {width:80%;}
    .ftCont {width:94%; margin:0 auto;}
    .ftCont &gt; div {width:auto; padding: 47px 0 49px;}
    .globMenu {/* position: absolute; */}
    .globMenu &gt; div {width: 280px; margin:0; height:100%;}
    .globMenuTitArea {padding: 12px 24px;}
    .userIdVw1 {vertical-align:middle; position:relative;}
    .userIdVw1 span {font-size: 18px; font-family: NotoSansM, sans-serif; color: #000; line-height: 28px;}
    .idiConPic {display:block; width:100%; padding:6px 48px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; word-wrap: normal; background-image: url(/images/common/ico_id_pic1.png); background-position: left center; background-repeat: no-repeat; background-size: contain;}
    .btnLogout {position:absolute; top:4px; right:0; display:block; width:32px; height:32px; background-image: url(/images/common/btn_logout.png); background-position: center; background-repeat: no-repeat; background-size: contain; text-indent:-9999px;}
    .btnLogOn {position:absolute; top:4px; right:0; display:block; width:32px; height:32px; background-image: url(/images/common/btn_login.png); background-position: center; background-repeat: no-repeat; background-size: contain; text-indent:-9999px;}
    .globMenuCont &gt; div &gt; ul &gt; li {width:auto; border: none!important;}
    .smNav  {float:none; overflow:hidden;}
    .smNav li {vertical-align:middle; padding: 0; width:48px !important; height: 48px; line-height: 48px; background:none;}
    /* .smNav li:first-child {padding-left: 0;}
    .smNav li:last-child {padding-right: 0;} */
    .btnMbHome {display:block; width:48px; height:48px; background-image: url(/images/common/btn_home1.png); background-position: center; background-repeat: no-repeat; background-size: contain; text-indent:-9999px;}
    .btnLangSt1 {display:block; width:32px; height:32px; margin:8px 0 0 8px; border-radius:50%; background-color:#90c5c3; font-size:12px !important; font-weight:bold; color:#fff !important; text-align:center; line-height:32px; text-shadow: 0 0 3px rgba(0,0,0,0.7);}
    .globMenuCont &gt; div &gt; ul.mbMnSt1 {display:block; border-top:1px solid #ddd !important;}
    .globMenuCont &gt; div &gt; ul.mbMnSt1 li {display:block;}
    .globMenuCont &gt; div &gt; ul.mbMnSt1 &gt; li {border-bottom:1px solid #ddd !important;}
    .gMC1Depth {line-height:48px;}
    .gMC3Depth ul li {font-size:14px;}
    .btn_popClose1.mbMnCloseSt1 {right: -48px; background-image: url(/images/common/btn_popclose2.png);}
    .gMC2Depth {display:none;}
    .gMC2Depth &gt; ul {position: inherit; padding: 10px 0; height: auto; opacity:1; transform:translate(0,0);}
    /* sub login */
    .subBg1 &gt; div {width: 100%;}
    .subCont &gt; div {width: 100%; padding: 0 16px;}
    .subLocation {margin-top:25px;}
    /* //sub login */
    /* sub */
    .manageCertBox1 .lineBox2 {float: none; width: 100%; margin-top: 32px; margin-right: 2%;}
    .eduPlBox1 {overflow:hidden;}
    .manageCertBox1 .eduPlBox1 .ulListArea2 {width:auto;}
    .wid50vw {width: 28vw;}
    .eduPlBox1 .ulListArea2 {width: auto;}
    .eduPBRight {float:right; margin-top:16px; width: auto;}
    .txtEllipsisTd1 {width:50vw; max-width:50vw;}
    .txtEllipsisTd1 &gt; a.wid520 {width:100%}
    .txtEllipsisTd2 {width:50vw; max-width:46vw;}
    .txtEllipsisTd2 &gt; a.wid640 {width:100%}
    .txtEllipsisTd2 &gt; a.wid740 {width:100%}
    .icoQAPriv {position:absolute;}
    ul.joinList li {float: none; width: 100%; margin-left:0; min-height:inherit;}
    .liInBox {max-width:880px;}
    .mailAddArea {max-width:880px;}
    .verifCodeSendArea {}
    .verifCodeInpArea {max-width:880px;}
    .widCalcSt1 {max-width: 770px;}
    .pwdPopSz2 {margin-top:-335px; margin-left:-40vw;}
    /* //sub */
    .pdDpNo {display:none;}
    .pdDpNoi {display:none !important;}
}

@media (max-width:784px) {
    .mbBgSt1 {background-image: url(/images/main/mb_bg_st1.jpg); background-repeat: no-repeat; background-position: center top; background-size: 100%;}
    .hd_logo {float:none;}
    .logo {margin-top: 0px; padding-top:8px;}
    .header .logo a {margin:0 auto; width: 350px; height: 40px; line-height: 40px;}
    .hdLogoTxt {width: 170px; height: 40px;}
    .logoTxt{height: 40px; line-height: 34px;}
    .hd_gnb {float:left; margin-top: -48px;}
    .header.mainMbSt1 {background-color:rgba(255,255,255,0.8); border-bottom: 1px solid rgba(255,255,255,0.8);}
	.header &gt; div {width:auto; height: 55px; margin: 0 auto;}
    .btn_globMenu {margin: 12px 0 12px 12px;}
    .mainCont {text-align: center;}
    .mainCont &gt; div {margin: 76vw auto 0; width: auto; max-width:767px; height: auto; /*overflow: auto;*/}
    .mLink {float:none; display:inline-block; vertical-align:middle; text-align: left;}
    .mLSt1 {margin: 0 10px 20px 10px; width: 748px; height: 262px; background-position: left 50px;}
    .mLSt1 a {width: 100%; height: 262px;}
    .mLSt1 .mLinkTit {text-align:right; padding: 41px 45px 0;}
    .mLSt1 .mLinkDesc {text-align:right; margin: 7px 48px 0;}
    .mLSt2 {display:block; width: 88%; height: 134px; overflow:hidden; margin: 0 auto 20px; background-color: rgba(0,0,0,0.6); background-image: url(../images/main/m_link_bg2_mb.png); background-position: right 48px; background-size: auto 88%}
    .mLSt2 .mLinkDesc {width:auto; padding-right:144px; height: 36px; -webkit-line-clamp: 2;}
    .mLSt3{margin: 0 10px 20px 10px;}
    .mLSt4{margin: 0 10px 20px 10px;}
    .mbQLinkTit {display: block; padding: 20px 0 0; font-size: 26px; line-height: 28px; font-family: NotoSansB, sans-serif; font-weight: normal; color: #333; letter-spacing: -1px; text-shadow: 0 0 8px rgba(255, 255, 255, 1);}
    span.mQLinkDesc {display:inline-block; font-size:14px; line-height:18px; text-shadow: 0 0 3px rgba(255, 255, 255, 1);}
    .mbQLinkSt1, .mbQLinkSt2, .mbQLinkSt3 {display: block; width: 80%; height: 106px; margin: 0 auto; text-align:left;}
    .mbQLinkSt1 a, .mbQLinkSt2 a, .mbQLinkSt3 a {display: block; height:100%; padding-left:130px; background-repeat: no-repeat; background-position: left center; background-size: contain;}
    .mbQLinkSt1 a {background-image: url(/images/main/m_mb_qlink_bg1.png);}
    .mbQLinkSt2 a {background-image: url(/images/main/m_mb_qlink_bg2.png);}
    .mbQLinkSt3 a {background-image: url(/images/main/m_mb_qlink_bg3.png);}
    .mbQLinkSt2, .mbQLinkSt3 {margin-top:-21px;}
    .mbQLinkSt3 {margin-bottom:32px;}
    .mLinkTit {padding: 8px 0 0 24px; font-size: 18px; line-height: 24px; letter-spacing: -1px;}
    .mLinkSTit {padding: 0px 0 0 28px; font-size: 14px; line-height: 22px; letter-spacing: -1px;}
    .sp-buttons {bottom: inherit !important; top: 104px;}
    .sp-button {width: 10px !important; height: 10px !important; margin-right: 4px !important;}
    .mLinkBtn {left: inherit; right: 46px;}
    .mNotice {float:none; display:block; width:88%; height:auto; min-height:96px; margin:0 auto; vertical-align:middle; text-align: left; overflow:hidden;}
    .notiTit {margin: 16px 24px 0;}
    .notiTit a {font-size:18px; line-height: 26px; margin: 0; height: 32px; color:#555;}
    .notiCont ul {margin: 8px 24px 16px;}
    .notiCont &gt; ul &gt; li {height: 24px;}
    .notiCont &gt; ul &gt; li &gt; a {width:100%; font-size:14px; line-height:24px;}
    .notiCont .notiDate {line-height:24px;}
    .btn_more {right: 24px; top: 15px; margin-top: 0;}
    .footer {margin-top: 32px;}
    .ftCont &gt; div {width:auto; min-width:320px; padding: 17px 8px 24px; border-top:1px solid #989898; text-align:center;}
    .ftNavigation ul li a {font-size:14px; height: 24px; line-height: 24px; padding: 0 22px 0 24px; color:#222e77;}
    .ftNavigation ul li.prLink {background:none; float:inherit; text-align:center;}
    .ftAddress {margin-top: 7px; line-height:16px; font-size:13px;}
    .ftCopyright {margin-top: 21px; line-height:16px; font-size:13px;}
    .btn_top {top: 14px; right: 8px;}
    .globMenu {/* position: absolute; */}
    .globMenu &gt; div {width: 76vw; margin:0;}
    .globMenuTitArea {padding: 12px 24px;}
    .userIdVw1 {vertical-align:middle; position:relative;}
    .userIdVw1 span {font-size: 18px; font-family: NotoSansM, sans-serif; color: #000; line-height: 28px;}
    .idiConPic {display:block; width:100%; padding:6px 48px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; word-wrap: normal; background-image: url(../images/common/ico_id_pic1.png); background-position: left center; background-repeat: no-repeat; background-size: contain;}
    .btnLogout {position:absolute; top:4px; right:0; display:block; width:32px; height:32px; background-image: url(/images/common/btn_logout.png); background-position: center; background-repeat: no-repeat; background-size: contain; text-indent:-9999px;}
    .btnLogOn {position:absolute; top:4px; right:0; display:block; width:32px; height:32px; background-image: url(/images/common/btn_login.png); background-position: center; background-repeat: no-repeat; background-size: contain; text-indent:-9999px;}
    .globMenuCont {padding:24px 16px}
    .globMenuCont &gt; div &gt; ul &gt; li {width:auto; border: none!important;}
    .smNav  {float:none; overflow:hidden;}
    .smNav li {vertical-align:middle; padding: 0; width:48px !important; height: 48px; line-height: 48px; background:none;}
    /* .smNav li:first-child {padding-left: 0;}
    .smNav li:last-child {padding-right: 0;} */
    .btnMbHome {display:block; width:48px; height:48px; background-image: url(/images/common/btn_home1.png); background-position: center; background-repeat: no-repeat; background-size: contain; text-indent:-9999px;}
    .btnLangSt1 {display:block; width:32px; height:32px; margin:8px 0 0 8px; border-radius:50%; background-color:#90c5c3; font-size:12px !important; font-weight:bold; color:#fff !important; text-align:center; line-height:32px; text-shadow: 0 0 3px rgba(0,0,0,0.7);}
    .globMenuCont &gt; div &gt; ul.mbMnSt1 {display:block; border-top:1px solid #ddd !important;}
    .globMenuCont &gt; div &gt; ul.mbMnSt1 li {display:block;}
    .globMenuCont &gt; div &gt; ul.mbMnSt1 &gt; li {border-bottom:1px solid #ddd !important;}
    .gMC1Depth {line-height:48px;}
    .gMC3Depth ul li {font-size:14px;}
    .btn_popClose1.mbMnCloseSt1 {right: -48px; background-image: url(/images/common/btn_popclose2.png);}
    /*.gMC2Depth &gt; ul {position:absolute; left: -9999px; top:-9999px; padding: 0; height: 0; overflow:hidden; opacity:0; transform:translate(0,32px); transition:opacity .3s ease-out, transform .5s ease-out;}*/
    /*ul.mbMnSt1 &gt; li:hover &gt; .gMC2Depth &gt; ul {position: inherit; padding: 10px 0; height: auto; opacity:1; transform:translate(0,0);}*/
    .gMC2Depth {display:none;}
    .gMC2Depth &gt; ul {position: inherit; padding: 10px 0; height: auto; opacity:1; transform:translate(0,0);}
    /* sub login */
    .subBg1 {display:none;}
    .subBg1 &gt; div {width: 100%; min-width:320px;}
    .subCont &gt; div {width: 100%; min-width:320px; padding: 0 8px;}
    .subTop .subTitleLine {padding: 19px 0 20px;}
    .header.subMbSt1 {background-color: rgba(255,255,255,0.6); border-bottom: 1px solid rgba(221,221,221,1);}
    .subLocation {margin-top:25px;}
    .subContBody {margin-top: 24px;}
    .loginMenuWrap {width:100%; max-width:640px; padding: 0;}
    .useInfoText {width:auto;}
    .loginFormWrap {padding: 24px 32px;}
    .loginFormTitleText {margin-left: 0; display: inline-block;}
    .l_InpArea {float:none; clear: both;}
    .loginId input, .loginPassword input {width:100%;}
    .l_BtnArea {float:none; clear: both; margin-top:10px}
    .mbDpLogBtn1 {display:block; width:100%; height:48px; line-height: 46px;}
    .loginBtnWrap.mbDpLogBtn2 .btnSm {display:block; width:100%; height:40px; line-height:40px; margin-bottom:8px;}
    .loginBtnWrap.mbDpLogBtn2 &gt; .btnSm {margin-right:0;}
    .liDivisSt2 li {float:none; width: 100%;}
    .liDivisSt2 .memBox {margin: 8px 0 0;}
    .liDivisSt2 li:nth-child(even) {margin-left: 0;}
    /* //sub login */
    /* sub */
    .manageCertBox1 .lineBox2 {float: none; width: 100%; margin-top: 32px; margin-right: 2%;}
    .eduPlBox1 {overflow:hidden; padding: 14px;}
    .manageCertBox1 .eduPlBox1 .ulListArea2 {width:auto;}
    .eduPBRight {float:right; margin-top:14px; width:auto;}
    .eduProgressArea {margin-right: 32px;}
    .regClassBox1 .lineBox2 {float: none; width: 100%; margin-top: 32px; margin-right: 2%;}
    .regClassBox1 .eduPlBox1 .ulListArea2 {width:auto; margin-left: 0;}
    .tab_gnb3Depth &gt; ul &gt; li {height: 56px;}
    .tab_gnb3Depth &gt; ul &gt; li &gt; a {height: 56px;}
    .tab_gnb3Depth h3 {/*line-height: 22px;*/line-height: 56px; font-family:NotoSansR, 'Noto Sans KR', '맑은고딕', 'Malgun Gothic', '돋움', 'Dotum', sans-serif; font-size: 20px;}
    .engSpt4JoinStp1 &gt; li &gt; h3 {line-height:22px;}
    .wid50vw {width: 50vw;}
    .eduPlBox1 .ulListArea2 {width: auto;}
    .txtEllipsisTd1 {width:50vw; max-width:44vw;}
    .txtEllipsisTd1 &gt; a.wid520 {width:100%}
    .txtEllipsisTd2 {width:50vw; max-width:40vw;}
    .txtEllipsisTd2 &gt; a.wid640 {width:100%}
    .txtEllipsisTd2 &gt; a.wid740 {width:100%}
    .optDTTit2 {display:inline-block; padding-right: 17px;}
    .optDTTit3 {display:inline-block; padding-right: 53px;}
    .icoQAPriv {position:absolute;}
    .pdDpNoWid100p {width:100%;}
    .btnSizeWSt3 {width: 108px;}
    ul.joinList li {float: none; width: 100%; margin-left:0;}
    ul.joinList li {min-height:inherit;}
    .layerPopSt1 &gt; div.pwdPopSz2 {top:0; left:0;}
    .pwdPopSz2 {width:100vw; height:100vh; max-width:900px; min-height:670px; margin-top:0; margin-left:0;}
    .popDivScrSt1 {height: calc(100vh - 218px);}
    .imgBigSzSt1 {max-width:768px; width:100%;}
    /* //sub */
    .mbDpNo {display:none;}
    .mbDpNoi {display:none !important;}
    /*.hd_logo {float:none;}
    .logo {margin-top: 0px;}
    .header .logo a {margin:0 auto;}
    .hd_gnb {float:left;}
    .header.mainMbSt1 {border-bottom: 1px solid #ddd;}
	.header &gt; div {height: 55px; margin: 0 auto}
    .btn_globMenu {margin: 12px 0 12px 12px;}*/
}
@media (max-width:546px) {
    .logoTxt{font-size:16px;}
    .optDivTab2 {display:block;}
    .mbDpSrchBtn1 {display: block; margin:10px auto 0 !important;}
    .regClassBox1 .eduPBRight, .eduPBRight {float: none; width: 100%; margin-top: 16px; text-align:center;}
    .eduProgressArea {margin-right: 0; margin-left:-16px;}
    .eduPlBox1 .btnLocSt1 {text-align:center; display:block; margin-top:10px;}
    .txtEllipsisTd1 {width:50vw; max-width:44vw;}
    .txtEllipsisTd1 &gt; a.wid520 {width:100%}
    .txtEllipsisTd2 {width:50vw; max-width:40vw;}
    .txtEllipsisTd2 &gt; a.wid640 {width:100%}
    .txtEllipsisTd2 &gt; a.wid740 {width:100%}
    table thead th {padding: 12px 8px;}
    table.trsTblSt1 th, table.trsTblSt1 td {padding: 10px 8px;}
    .btnSizeWSt2 {width:72px}
    .mbDpNo2 {display:none;}
    .mbDpNo2Yes {display:inline-block;}
    .mbDpNo2Yes2 {display:block;}
    .sz546DivTblSt1 {margin-bottom:-5px;}
    .sz546DivTblSt1 .trsTblSt3 tbody tr:last-child th, .sz546DivTblSt1 .trsTblSt3 tbody tr:last-child td {border-bottom: 1px dashed #c1c1c1;}
    table.trsTblSt3.sz546TblSt1 {border-top: none;}
    .boardBtnGroup1 {margin-top: 0;}
    .boardBtnGroup1 .btnSt0, .boardBtnGroup2 .btnSt0 {margin-top: 8px;}
    .engSpt4JoinStp1 &gt; li &gt; h3 {line-height:14px;}
    .tab_gnb3Depth .joinStepMn li h3 span {font-size: 14px}
    .joinStepMn li.on::after {background-size: 32px 32px;}
    .mailAddArea .mailAdd {width: calc(100% / 2 - 14px) !important;}
    .verifCodeSendArea {display:block; width:100%; text-align:center; margin-top:8px;}
    .verifCodeSendArea #AuthRequest, .verifCodeSendArea #SendEmaiAuth {width:100%; margin-left:0;}
    #selectEmail.mL8 {margin-left: 0; margin-top:8px; width:100%;}
    .expTxt1 {padding:0 8px;}
    .wid100pFor546 {width:100%;}
    .pd32For546 {padding: 32px;}
    .memDBReWriBtn {display:block; margin-top: 10px !important; margin-left: 0 !important; width:104px;}
    .memDBGoEduStsBtn {line-height: 48px;}
    .btn546Sz100pMl0 {width:100%; margin-left:0;}
    .header .logo a {width: 360px; font-size: 18px; padding-left: 46px; background-position: 46px center;}
    .engLogoTit {display:inline-block; line-height:34px;}
    table.trsTblSt0 th, table.trsTblSt0 td {padding:12px 8px;}
    .pwdPopSz1 {width: 300px; margin-left: -150px;}
    .mbQLinkTit {padding: 10px 0 0; font-size: 16px; line-height: 22px;}
    span.mQLinkDesc {font-size: 12px;line-height: 16px;}
}
@media (max-width:360px) {
	.header .logo a {width: 320px; font-size: 18px;}
    .hdLogoTxt {width: 170px;}
    .logoTxt {font-size:12px;}
    .globMenu &gt; div {width: 254px; margin:0;}
    /* sub */
    .eduPlBox1 {overflow:hidden; padding: 6px 6px 14px;}
    .regClassBox1 .eduPlBox1 {overflow:hidden; padding: 6px 6px 14px;}
    .tab_gnb3Depth &gt; ul &gt; li {height: 56px;}
    .tab_gnb3Depth &gt; ul &gt; li &gt; a {height: 56px;}
    .engSpt4JoinStp1 &gt; li &gt; h3 {line-height:11px;}
    .tab_gnb3Depth .joinStepMn li h3 span {font-size: 11px}
    .wid50vw {width: 46vw;}
    .mbQLinkTit {padding: 10px 0 0; font-size: 14px; line-height: 22px;}
    span.mQLinkDesc {font-size: 12px;line-height: 14px;}
}
    /*.inpBox320 {width: 100vw;}
    .inpBox360 {display:block; width:auto;}*/
    /* //sub */
    /*.hd_logo {float:none;}
    .logo {margin-top: 0px;}
    .header .logo a {margin:0 auto;}
    .hd_gnb {float:left;}
    .header.mainMbSt1 {border-bottom: 1px solid #ddd;}
	.header &gt; div {height: 55px; margin: 0 auto}
    .btn_globMenu {margin: 12px 0 12px 12px;}*/
}
@media (max-width:320px) {
    .eduProgressArea {margin-right: 0; margin-left: 0;}
}
/*#######  //mobile  #######*/</pre></body></html>