@charset "utf-8";

/* 서브페이지 텝메뉴 */
.tab_area {overflow: hidden; margin-bottom: 40px; font-size: 0px;}
.tab_area a.m_slect {display: none;}
.tab_area ul {display: flex;border-bottom: 2px solid #006cb8;}
.tab_area ul li {float: left; max-width:25%; flex: 1; border: 2px solid #ededed; border-bottom: 2px solid #006cb8; border-radius: 10px 10px 0 0;margin-bottom: -2px;}
.tab_area ul li + li {margin-left: -2px;}
.tab_area ul li a {display: block; height: 54px; font-size: 18px; color: #777777; text-align: center; line-height: 54px;}
.tab_area ul li.active {position: relative; border: 2px solid #006cb8; border-bottom: 2px solid #fff;}
.tab_area ul li.active::before {position: absolute; display: block; content: ""; width: 2px; height: 100%; top: 6px; right: -2px; background: #006cb8;}
.tab_area ul li.active a {font-weight: bold; color: #000;}

/* 더보기 버튼 */
a.moreBtn {display: block; height: 35px; padding: 0 45px; font-size: 15px; font-weight: bold; color: #0e173e; text-align: center; line-height: 35px; border-radius: 20px; background: url('../images/common/m_menu_arrow_down.png') no-repeat center right 18px #f0f6fb; background-size: 13px 8px;}

/* 제목영역 */
.title_area {overflow: hidden; margin-bottom: 20px;}
.title_area.mb10 {margin-bottom: 10px;}
.title_area strong.title {font-size: 22px; color: #000; line-height: 32px;}
.title_area strong.title span {font-size: 15px;}
.title_area strong.title span em {color: #018f9b; font-style: normal;}
.title_area strong.title02 {font-size: 18px; color: #000; line-height: 32px;}
.title_area strong.title03 {font-size: 25px; color: #000; line-height: 32px; vertical-align: middle;}
.title_area span.tag {display: inline-block; height: 24px; padding: 0 10px; font-size: 14px; color: #fff; line-height: 24px; border-radius: 20px; vertical-align: middle;}
.title_area span.tag + strong {margin-left: 5px;}
.title_area div.right {float: right;}

/* 오시는길 */
.directions {padding-bottom: 30px;}
.directions + .directions {padding-top: 30px; border-top: 1px solid #dddddd;}

.map_area {overflow: hidden; width: 100%; height: 310px; margin-bottom: 20px; border: 1px solid #ddd; border-radius: 10px;}
.map_info_area {font-size: 0px;}
.map_info_area .left {position: relative; display: inline-block; width: 50%; vertical-align: top;}
.map_info_area .left::before {position: absolute; display: block; content: ""; width: 4px; height: 100%; top: 0px; left: 0px; border-radius: 10px; background-color: #00A3B1;}
.map_info_area .right {display: inline-block; width: 50%; text-align: right; vertical-align: top;}
.map_info_area p {padding-left: 35px; font-size: 16px; line-height: 1.8em; letter-spacing: -0.04em;}
.map_info_area .right dl {display: inline-block; padding: 10px 0 10px 40px; font-size: 16px;}
.map_info_area .right dl.call {background: url('../images/icon/icon_call.png') no-repeat center left;}
.map_info_area .right dl.fax {background: url('../images/icon/icon_fax.png') no-repeat center left;}
.map_info_area .right dl + dl {margin-left: 60px;}
.map_info_area .right dl dt {display: inline-block; font-weight: bold;}
.map_info_area .right dl dd {position: relative; display: inline-block; padding-left: 20px;}
.map_info_area .right dl dd::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 50%; left: 10px; margin-top: -5px; background-color: #dedede;}

.transport {margin-top: 30px; padding: 35px 40px 35px 50px; border: 1px solid #dddddd; background-color: #f8f8f8; border-radius: 10px;}
.transport > strong {display: block; float: left; width: 80px; margin-right: 35px; padding-bottom: 80px; font-size: 19px; text-align: center;}
.transport.type01 > strong {background: url('../images/common/transport_bg01.png') no-repeat center bottom 0px;}
.transport.type01 > ul strong.title01 {color: #006cb8;}
.transport.type02 > strong {background: url('../images/common/transport_bg02.png') no-repeat center bottom 0px;}
.transport.type02 > ul strong.title01 {color: #018f9b;}
.transport.type03 > strong {background: url('../images/common/transport_bg03.png') no-repeat center bottom 0px;}
.transport.type03 > ul strong.title01 {color: #7353a5;}
.transport > ul {overflow: hidden; display: block;}
.transport > ul p.title {margin-bottom: 15px; font-size: 16px; color: #777777; letter-spacing: -0.04em;}
.transport > ul p.title > strong {font-size: 20px; color: #006cb8;}
.transport > ul p.title > span {color: #006cb8;}
.transport > ul strong.title01 {display: block; margin-bottom: 15px; font-size: 20px;}
.transport > ul strong.title02 {display: block; font-size: 15px; color: #000;}
.transport > ul strong.title02 + p {margin-top: 8px;}
.transport > ul > li {padding: 15px;}
.transport > ul > li > dl {font-size: 15px;}
.transport > ul > li > dl + dl {margin-top: 5px;}
.transport > ul > li > dl > dt {display: inline-block; font-weight: bold; color: #000;}
.transport > ul > li > dl > dd {position: relative; display: inline-block; padding-left: 15px;}
.transport > ul > li > dl > dd::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 50%; left: 7px; margin-top: -5px; background-color: #dedede;}
.transport > ul > li:first-child {padding-top: 0px;}
.transport > ul > li:last-child {padding-bottom: 0px;}
.transport > ul > li + li {border-top: 1px solid #dddddd;}
.transport > ul > li > p {font-size: 15px; line-height: 1.6em; word-break: keep-all;}

.con_charge_area {margin-top: 30px; padding: 10px 30px 10px 50px; font-size: 0px; border: 1px solid #dddddd; background-color: #f8f8f8; border-radius: 10px;}
.con_charge_area > span {display: inline-block; padding: 15px 0 15px 70px; font-size: 15px; color: #333; background: url('../images/common/charge_bg01.png') no-repeat center left ; vertical-align: middle;}
.con_charge_area > ul {overflow: hidden; display: inline-block; width: calc(100% - 212px); margin-left: 55px; padding-left: 45px; border-left: 1px solid #dddddd; vertical-align: middle;}
.con_charge_area > ul > li + li {margin-top: 10px;}
.con_charge_area > ul > li > ul {display: flex; flex-wrap: wrap;}
.con_charge_area > ul > li > ul > li {flex: 1; font-size: 14px;}
.con_charge_area > ul > li > ul > li > strong {display: block; float: left;}
.con_charge_area > ul > li > ul > li > span {position: relative; overflow: hidden; display: block; padding-left: 25px; color: #888888;}
.con_charge_area > ul > li > ul > li > span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 50%; left: 12px; margin-top: -5px; background-color: #dddddd;}

.pdfViewer {overflow: hidden; width: 100%; height: 310px; margin-top: 40px; border-radius: 10px; background-color: #f1f1f1;}
.pdfViewer p {font-size: 33px; color:#333333; font-weight: bold; text-align: center; letter-spacing: -0.04em; line-height: 310px;}

/* 달력 */
#calendar {max-width: 950px; margin-top: 30px;}
#calendar .fc-today-button {background-color: #888 !important; border: 1px solid #888 !important;}
#calendar .fc-toolbar-title {color: #1d2127 !important; font-weight: normal;}
#calendar .fc-daygrid-day-number {color: #888 !important;}
#calendar .fc-daygrid-more-link {color: #888 !important;}


/* 지도, 테이블영역 */
.centerInfo_area {margin: 40px 0 30px 0; font-size: 0px;}
.centerInfo_area .korMapArea {position: relative; display: inline-block; width: 350px; height: 430px;}
.centerInfo_area .korMapArea object {width: 100%; height: 100%;}
.centerInfo_area .korMapArea text {display: none;}
.centerInfo_area .korMapArea > span {position: relative; padding: 3px 10px; font-size: 13px; color: #fff; border: 2px solid #fff !important; background-color: #0e3968; border-radius: 10px;}
.centerInfo_area .korMapArea > span::before {position: absolute; display: block; content: ""; width: 8px; height: 8px; bottom: -50%; left: 50%; margin: 0 0 6px -4px; background: #0e3968; border-bottom: 2px solid #fff;  border-right: 2px solid #fff;  transform: rotate(45deg);}
.centerInfo_area .korMapArea svg {outline: 0px;}
.centerInfo_area .korMapArea .KR-11-LABEL {top: 70px; left: 80px;}
.centerInfo_area .korMapArea .KR-41-LABEL {top: 80px; left: 95px;}
.centerInfo_area .korMapArea .KR-28-LABEL {top: 70px; left: 50px;}
.centerInfo_area .korMapArea .KR-51-LABEL {top: 50px; left: 150px;}
.centerInfo_area .korMapArea .KR-44-LABEL {top: 145px; left: 70px;}
.centerInfo_area .korMapArea .KR-36-LABEL {top: 145px; left: 95px;}
.centerInfo_area .korMapArea .KR-43-LABEL {top: 125px; left: 125px;}
.centerInfo_area .korMapArea .KR-30-LABEL {top: 160px; left: 105px;}
.centerInfo_area .korMapArea .KR-47-LABEL {top: 160px; left: 180px;}
.centerInfo_area .korMapArea .KR-27-LABEL {top: 200px; left: 170px;}
.centerInfo_area .korMapArea .KR-52-LABEL {top: 205px; left: 95px;}
.centerInfo_area .korMapArea .KR-48-LABEL {top: 235px; left: 140px;}
.centerInfo_area .korMapArea .KR-31-LABEL {top: 215px; left: 215px;}
.centerInfo_area .korMapArea .KR-26-LABEL {top: 240px; left: 200px;}
.centerInfo_area .korMapArea .KR-29-LABEL {top: 245px; left: 73px;}
.centerInfo_area .korMapArea .KR-46-LABEL {top: 270px; left: 60px;}
.centerInfo_area .korMapArea .KR-50-LABEL {top: 340px; left: 35px;}
.centerInfo_area .korMapArea .land {fill: #d1d1d1; fill-opacity: 1; stroke:white; stroke-opacity: 1; stroke-width:0.5; transition: all .2s;}
.centerInfo_area .korMapArea .land:hover {cursor: pointer; fill: #ffd69f;}
.centerInfo_area .korMapArea .land.active {cursor: pointer; fill: #ffd69f;}
.centerInfo_area .korMapArea svg > a:focus path,
.centerInfo_area .korMapArea svg > a:focus g {fill: #ffd69f;}
.centerInfo_area .korMaplistArea {display: none;}
.centerInfo_area .table_area {display: inline-block; overflow: auto; width: 600px; min-width: 600px; max-height: 410px; vertical-align: top;}
.centerInfo_area .table_area table.list tbody tr:hover {cursor: pointer;}
.centerInfo_area .table_area table.list tbody tr:hover td {background-color: #c2dcee;}

/* 소속 확인 */
.inquiry_area {overflow: hidden;}
.inquiry_area > strong {display: block; padding: 0 0 20px 0; font-size: 26px; color: #000; text-align: center; border-bottom: 1px solid #dddddd;}
.inquiry_area > p {margin: 20px 0 30px 0; font-size: 17px; color: #333; text-align: center; line-height: 2em; letter-spacing: -0.04em; word-break: keep-all;}
.inquiry_area > p.mt0 {margin-top: 0px;}
.inquiry_area > p > strong {font-size: 22px;}
.inquiry_area > p > strong > span {color: #01a4b2;}
.inquiry_area > p > span {display: block; font-size: 17px;}
.inquiry_area > p > span > em {color: #01a4b2; font-style: normal;}
.inquiry_area > p + .tip_txt {margin-top: 45px;}
.inquiry_area > strong + .tip_txt {margin-top: 50px;}
.inquiry_area > .inquiry_input_area {margin: 0 0 20px 0; padding: 40px 0; border: 1px solid #ddd; border-radius: 15px;}
.inquiry_area > .inquiry_input_area > div {overflow: hidden; width: 315px; margin: 0 auto;}
.inquiry_area > .inquiry_input_area > div strong {display: block; margin-bottom: 10px; font-size: 17px; color: #434343;}
.inquiry_area > .inquiry_input_area > div > div.selectBox02 {width: 100%; margin-bottom: 20px;}
.inquiry_area > .inquiry_input_area > div > div.selectBox02 select {width: 100%; height: 46px; padding: 0 35px 0 20px; font-size: 16px; border: 0px; background: url('../images/icon/icon_select_arrow.png') no-repeat center right 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_name {width: 100%; height: 46px; margin-bottom: 20px; background: url('../images/icon/icon_id.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_name input[type='text'] {width: 100%; height: 46px; padding: 0 20px 0 40px; background: transparent; border: 0px;}
.inquiry_area > .inquiry_input_area > div > div.input_number {width: 100%; height: 46px; margin-bottom: 20px; padding: 0 20px 0 40px; font-size: 0px; background: url('../images/icon/icon_password.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_number input {width: 45%; height: 46px; font-size: 15px; color: #888888; background: transparent; border: 0px; vertical-align: middle;}
.inquiry_area > .inquiry_input_area > div > div.input_number input::placeholder {font-size: 15px; color: #777777;}
.inquiry_area > .inquiry_input_area > div > div.input_number span {display: inline-block; width: 10%; font-size: 16px; text-align: center; vertical-align: middle;}
.inquiry_area > .inquiry_input_area > div > div.input_birth {width: 100%; height: 46px; margin-bottom: 20px; padding: 0 20px 0 40px; font-size: 0px; background: url('../images/icon/icon_calendar.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_birth input[type='text'] {width: 100%; height: 46px; background: transparent; border: 0px;}
.inquiry_area > .inquiry_input_area > div > div.input_txt {width: 100%; height: 46px; margin-bottom: 20px; padding: 0 20px 0 40px; font-size: 0px; background-color: #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_txt input[type='text'] {width: 100%; height: 46px; background: transparent; border: 0px;}
.inquiry_area > .inquiry_input_area > p.warning {word-break: keep-all; padding: 0 30px;}
.inquiry_area > .inquiry_table {width: 580px; margin: 30px auto;}
.inquiry_area > .inquiry_table > div.table_area > table.list {border-top: 0px; border-right: 1px solid #d1d7db;}
.inquiry_area > .inquiry_table > div.table_area > table.list thead th {padding: 11px 5px; font-size: 14px; color: #fff; border-bottom: 1px solid #d1d7db; background-color: #01a4b2;}
.inquiry_area > .inquiry_table > div.table_area > table.list tbody td {padding: 7px 5px; font-size: 15px; border-left: 1px solid #d1d7db; border-bottom: 1px solid #d1d7db; background-color: #fff;}

ul.certify_list {display: block; width: 320px; margin: 0 auto; text-align: center;}
ul.certify_list li {display: block; font-size: 0px;}
ul.certify_list li + li {margin-top: 10px;}
ul.certify_list li a {position: relative; display: block; width: 100%; height: 45px; color: #fff; font-size: 16px; text-align: left; line-height: 45px; border-radius: 10px;}
ul.certify_list li a.naver {color: #333333; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/common/login_naver2.png') no-repeat center left 25px #FFFFFF;}
ul.certify_list li a.pass {background: url('../images/common/login_pass.png') no-repeat center left 15px #8951ff;}
ul.certify_list li a.onepass {background: url('../images/common/login_onepass.png') no-repeat center left 15px #1c2674;}
ul.certify_list li a.kakao_login {color: #333333; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/common/ico_login_kakao.png') no-repeat center left 15px #FFFFFF; background-size: 13%;}
ul.certify_list li a.ogcr {color: #333333; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/icon/icon_lock.png') no-repeat center left 29px #FFFFFF;}
ul.certify_list li a.oacx {color: #FFFFFF; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/icon/icon_certificate.png') no-repeat center left 29px #374151;}
ul.certify_list li a span {padding-left: 90px;}
ul.certify_list li a span::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 20px; top: 50%; left: 70px; background-color: #dddddd; transform: translate(0, -50%);}

p.warning {margin: 30px 0; font-size: 14px; color: #ef7572; text-align: center; letter-spacing: -0.04em;}

a + div.joinChk_area {margin-top: 20px;}
div.joinChk_area + strong {margin-top: 20px;}
.joinChk_area + .genderChk_area {margin-top: 20px;}
.genderChk_area {margin-bottom: 20px;}

.inquiry_area > .inquiry_input_area > div > div.gender_area {margin-bottom: 25px;}
.inquiry_area > .inquiry_input_area > div > div.joinChk_area {padding: 20px 0; border-top: 1px solid #dddddd; border-bottom: 1px solid #ddd;}
.label_radio {font-size: 14px;}
.label_radio input.radio {display: inline-block; position: relative; width: 20px; height: 20px; border: 1px solid #d2d2d2; border-radius: 50%; vertical-align: middle; cursor: pointer;}
.label_radio input.radio:checked {border: 1px solid #01a4b2; background: url('../images/icon/check_radio.png') no-repeat center center #fff; background-size: 8px;}
.label_radio input.radio + span {margin-left: 10px; letter-spacing: -0.04em;}
.label_radio + .label_radio {margin-left: 30px;}

.label_check {font-size: 0px; vertical-align: middle;}
.label_check input.chk {display: inline-block; position: relative; width: 20px; height: 20px; border: 1px solid #cccccc; vertical-align: middle; cursor: pointer; background-color: #fff;}
.label_check input.chk:checked {border: 1px solid #01a4b2; background: url('../images/icon/check_chk.png') no-repeat center center #fff;}
.label_check input.chk + span {margin-left: 10px; font-size: 14px; vertical-align: middle;}


/* 달력선택 */
div.calendar_input_area {position: relative; overflow: hidden; display: inline-block; padding: 0 45px 0 10px; border: 1px solid #dddddd; border-radius: 20px; background-color: #fff; vertical-align: middle;}
div.calendar_input_area input {width: 100%; font-size: 14px; text-indent: 0; border: 0px; background: transparent; letter-spacing: -0.06em;}
div.calendar_input_area input::placeholder {font-size: 14px; letter-spacing: -0.06em;}
div.calendar_input_area a {position: absolute; display: inline-block; width: 18px; height: 18px; font-size: 0px; top: 6px; right: 15px; background: url('../images/icon/icon_calendar.png') no-repeat center center;}

/* 첨부파일 */
.add_file_area {overflow: hidden; margin-bottom: 20px;}
.add_file_area strong {display: block; margin: 0 0 15px 0; padding: 20px 0; font-size: 17px; color:#333; letter-spacing: -0.04em; border-bottom: 1px solid #ababab;}

/* 답변영역 */
.replay_area {overflow: hidden; margin-bottom: 20px;}
.replay_area .replay_header {overflow: hidden; position: relative; margin-top: 10px; margin-bottom: 15px;}
.replay_area .replay_header strong {font-size: 17px; color: #333; letter-spacing: -0.04em;}
.replay_area .replay_header div {position: absolute; top: 0px; right: 0px;}
.replay_area .replay_header div span {font-size: 15px; color: #999; letter-spacing: -0.04em;}
.replay_area .replay_header div span + span {position: relative; padding-left: 20px;}
.replay_area .replay_header div span + span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 6px; left: 7px; background-color: #dddddd;}
.replay_area .replay_box {padding: 15px 30px; font-size: 15px; color: #222; line-height: 1.6em; border: 1px solid #dddddd;}

/* 전체교육 교육링크 영역 */
.edu_link_area {overflow: hidden; margin-bottom: 35px; font-size: 0px;}
.edu_link_area li {display: inline-block; width: calc(25% - 7.5px); vertical-align: top;}
.edu_link_area li + li {margin-left: 10px;}
.edu_link_area li div {position: relative; width: 100%; height: 110px; padding: 20px 15px; background-color: #f4f4f4; border-radius: 15px;}
.edu_link_area li div strong {display: block; padding-right: 20px; font-size: 16px; word-break: keep-all; line-height: 1.4em; background: url('../images/icon/icon_link_bg.png') no-repeat top 2px right;}
.edu_link_area li div a {position: absolute; bottom: 20px; left: 15px; font-size: 13px; color: #777777; letter-spacing: -0.04em;}

/* 신청서작성 - 스텝 */
div.step_box {min-height: 82px; margin-bottom: 40px; background: #f4f4f4; border-radius: 5px;}
div.step_box ul {position: relative; display: block; width: 100%; margin: 0 auto; font-size: 0px;}
div.step_box ul::before {position: absolute; display: block; content: ""; width: 75%; height: 3px; top: 24px; left: 12.5%; background-color: #dadada;}
div.step_box ul li {display: inline-block; width: 25%; text-align: center;}
div.step_box ul li:nth-child(2).active::before {position: absolute; display: block; content: ""; width: 25%; height: 3px; top: 24px; left: 12.5%; background-color: #5986c2; z-index: 1;}
div.step_box ul li:nth-child(3).active::before {position: absolute; display: block; content: ""; width: 50%; height: 3px; top: 24px; left: 12.5%; background-color: #5986c2; z-index: 1;}
div.step_box ul li:nth-child(4).active::before {position: absolute; display: block; content: ""; width: 75%; height: 3px; top: 24px; left: 12.5%; background-color: #5986c2; z-index: 1;}
div.step_box.step03 ul li {width: 33.3333%;}
div.step_box.step03 ul::before {position: absolute; display: block; content: ""; width: 66.6666%; height: 3px; top: 24px; left: 16.6666%; background-color: #dadada;}
div.step_box.step03 ul li:nth-child(2).active::before {position: absolute; display: block; content: ""; width: 33.3333%; height: 3px; top: 24px; left: 16.6666%; background-color: #5986c2; z-index: 1;}
div.step_box.step03 ul li:nth-child(3).active::before {position: absolute; display: block; content: ""; width: 66.6666%; height: 3px; top: 24px; left: 16.6666%; background-color: #5986c2; z-index: 1;}

div.step_box.step06 ul li {width: 16.6666%; vertical-align: top;}
div.step_box.step06 ul::before {position: absolute; display: block; content: ""; width: 83.3333%; height: 3px; top: 24px; left: 8.3333%; background-color: #dadada;}

div.step_box ul li span {position: relative; display: inline-block; padding-top: 45px; font-size: 17px;}
div.step_box ul li span::before {position: absolute; display: inline-block; content: ""; width: 20px; height: 20px; top: 15px; left: 50%; margin: 0px 0 0 -10px; border: 1px solid #618bc3; border-radius: 50%; background-color: #fff; z-index: 2;}
div.step_box ul li span::after {position: absolute; display: inline-block; content: ""; width: 10px; height: 10px; top: 20px; left: 50%; margin: 0px 0 0 -5px; border: 1px solid #fff; border-radius: 50%; background-color: #618bc3; z-index: 2;}
div.step_box ul li em {display: block; font-style: normal; padding-bottom: 10px; font-size: 14px; color: #888888;}
div.step_box ul li.active ~ li span::before {position: absolute; display: inline-block; content: ""; width: 20px; height: 20px; top: 15px; left: 50%; margin: 0px 0 0 -10px; border: 1px solid #dadada; border-radius: 50%; background-color: #fff; z-index: 2;}
div.step_box ul li.active ~ li span::after {position: absolute; display: inline-block; content: ""; width: 10px; height: 10px; top: 20px; left: 50%; margin: 0px 0 0 -5px; border: 1px solid #fff; border-radius: 50%; background-color: #dadada; z-index: 2;}
/* div.step_box + .inquiry_area > p {margin-top: 0px;} */

div.step_box02 {overflow: hidden; margin-bottom: 30px;}
div.step_box02 ul {display: block; width: 100%; height: 42px; font-size: 0px; background-color: #f2f2f2; border-radius: 5px;}
div.step_box02 ul li {position: relative; display: inline-block; width: 50%; height: 100%; text-align: center; background-color: #f2f2f2; border-radius: 5px;}
div.step_box02 ul li span {font-size: 17px; color: #333; line-height: 42px;}
div.step_box02 ul li.active {background-color: #2d5571;}
div.step_box02 ul li.active span {color: #fff;}
div.step_box02 ul li.active:nth-child(1)::before {position: absolute; display: block; content: ""; width: 26px; height: 42px; top: 0px; right: -22px; background: url('../images/common/step_box02_bg.png') no-repeat center center; z-index: 1;}
div.step_box02 ul li.active:nth-child(2)::after {position: absolute; display: block; content: ""; width: 26px; height: 42px; top: 0px; left: -2px; background: url('../images/common/step_box02_bg02.png') no-repeat center center; z-index: 1;}

/* 스크롤박스 */
.scrollBox {display: block; overflow-y: scroll; height: 220px; margin-bottom: 20px; padding: 20px; font-size: 14px; color: #333; line-height: 1.6em; word-break: keep-all; border: 1px solid #dddddd; border-radius: 10px;}
.scrollBox.full {height: 100%; overflow-y: hidden;}

/* 신청서작성 과정설명 영역 */
.edu_info_box {overflow: hidden; margin-bottom: 20px;}
.edu_info_box > div {position: relative; }
.edu_info_box .edu_info_con {width: 690px; min-height: 233px; margin-left: 260px; padding: 20px 30px; border: 1px solid #dddddd; border-radius: 15px;}
.edu_info_box .edu_info_con p.edu_sort {margin-bottom: 10px; font-size: 12px; color: #777777;}
.edu_info_box .edu_info_con .thumbnailBox {position: absolute; overflow: hidden; width: 230px; height: 233px; top: 0px; left: 0px; border-radius: 15px;}
.edu_info_box .edu_info_con .thumbnailBox img {width: 100%; height: 100%;}
.edu_info_box .edu_info_con .thumbnailBox a.like {position: absolute; display: inline-block; width: 17px; height: 15px; font-size: 0px; bottom: 13px; right: 12px; background: url('../images/icon/icon_like.png') no-repeat center center; background-size: cover;}
.edu_info_box .edu_info_con .thumbnailBox a.like.active {background: url('../images/icon/icon_like_active.png') no-repeat center center; background-size: cover;}
.edu_info_box .edu_info_con .thumbnailBox .smple_area{
 color: #fdf2ef;
 border-radius: 20px;
 width:120px;
 text-align: center;
 position: absolute;
 bottom: 10px;
 left: 10px;
 padding: 0 0 1px 3px;
 line-height: 26px;
 background: url('../images/icon/icon_play.png') no-repeat 11px #454545;
}
.edu_info_box .edu_info_con strong.title {display: block; margin-bottom: 15px; font-size: 24px; line-height: 1.2em;}
.edu_info_box .edu_info_con span.tag {display: inline-block; height: auto; margin-bottom: 15px; padding: 2px 15px; font-size: 12px; color: #fff; border-radius: 20px;}
.edu_info_box .edu_info_con p {margin-bottom: 15px;}
.edu_info_box .edu_info_con ul.period_list {display: inline-block; position: absolute; bottom: 22px;}
.edu_info_box .edu_info_con ul.period_list li {display: block; font-size: 14px;}
.edu_info_box .edu_info_con ul.period_list li + li {margin-top: 2px;}
.edu_info_box .edu_info_con ul.period_list li strong {color: #000;}
.edu_info_box .edu_info_con ul.period_list li span {color: #777777;}
.edu_info_box .edu_info_con ul.period_list li strong + span {position: relative; padding-left: 20px;}
.edu_info_box .edu_info_con ul.period_list li strong + span::before {position: absolute; content: ""; width: 1px; height: 10px; top: 5px; left: 8px; background-color: #777;}
.edu_info_box .edu_info_con p.price {position: absolute; bottom: 20px; right: 30px; margin-bottom: 0px; font-size: 24px; color:#888; letter-spacing: -0.06em;}
.edu_info_box .edu_info_con p.price strong {font-size: 30px; color:#000;}
.edu_info_box .edu_info_con span.state_txt {position: absolute; top: 20px; right: 30px; font-size: 14px; letter-spacing: -0.04em;}
.edu_info_box .edu_info_con span.state_txt.red {color: #ef7572;}
.edu_info_box .edu_info_con span.state_txt.blue {color: #01a4b2;}

a.edu_request_btn {position: absolute; display: inline-block; height: 50px; bottom: 85px; right: 30px; border: 1px solid #fcc260; background-color: #feeed3; border-radius: 50px;}
a.edu_request_btn span {position: relative; display: inline-block; padding: 0 30px 0 65px; /*padding-left: 65px;*/ color: #333; font-size: 16px; line-height: 48px; letter-spacing: -0.04em;}
a.edu_request_btn span::before {position: absolute; display: inline-block; content: ""; width: 35px; height: 35px; top: 6.5px; left: 10px; border-radius: 50%; background: url('../images/icon/icon_edubtn_bg.png') no-repeat center center #cc8600; background-size: 18px;}
a.edu_request_btn.disabled {border: 1px solid #ddd; background-color: #e7e7e7;}
a.edu_request_btn.disabled span {color: #999;}
a.edu_request_btn.disabled span::before {background: url('../images/icon/icon_edubtn_bg.png') no-repeat center center #ccc;}
a.edu_request_btn.type02 {border: 1px solid #7dd5ec; background-color: #dbf3fa;}
a.edu_request_btn.type02 span {color: #333;}
a.edu_request_btn.type02 span::before {background: url('../images/icon/icon_edubtn_bg.png') no-repeat center center #42c2e3;}
p.edu_txt {display: inline-block; margin: 20px 0 0 260px; font-size: 14px; letter-spacing: -0.04em; color: #666666; vertical-align: middle;}
p.edu_txt span {color: #cc8600;}
p.edu_txt + a.btn01 {height: 24px; margin: 15px 0 0 10px; line-height: 24px; font-size: 13px; vertical-align: middle;}

a.ability_request_btn {display: inline-block; height: 50px; bottom: 85px; right: 30px; border: 1px solid #ffac63; background-color: #fee6d3; border-radius: 50px;}
a.ability_request_btn span {position: relative; display: inline-block; padding: 0 30px 0 65px; /*padding-left: 65px;*/ color: #333; font-size: 16px; font-weight: bold; line-height: 48px; letter-spacing: -0.04em;}
a.ability_request_btn span::before {position: absolute; display: inline-block; content: ""; width: 35px; height: 35px; top: 6.5px; left: 10px; border-radius: 50%; background: url('../images/icon/icon_edubtn_bg.png') no-repeat center center #ff7f11; background-size: 18px;}


ul.view_count_area {position: absolute; top: 20px; right: 30px; text-align: right;}
ul.view_count_area {}
ul.view_count_area li {position: relative; float: left; display: inline-block; font-size: 14px; color: #777; letter-spacing: -0.04em;}
ul.view_count_area li + li {position: relative; padding-left: 35px;}
ul.view_count_area li + li::before {position: absolute; content: ""; width: 1px; height: 10px; top: 6px; left: 10px; background: #dddddd;}
ul.view_count_area li a.like {position: absolute; display: inline-block; width: 17px; height: 15px; left: 15px; top: 3px; font-size: 0px; background: url('../images/icon/icon_like.png') no-repeat center center; background-size: cover;}
ul.view_count_area li a.like.active {background: url('../images/icon/icon_like_active.png') no-repeat center center; background-size: cover;}
ul.view_count_area li span.like {position: absolute; display: inline-block; width: 17px; height: 15px; left: 15px; top: 3px; font-size: 0px; background: url('../images/icon/icon_like.png') no-repeat center center; background-size: cover;}
ul.view_count_area li span.like.active {background: url('../images/icon/icon_like_active.png') no-repeat center center; background-size: cover;}


.txt_con01 {overflow: hidden; margin-bottom: 40px;}
.txt_con02 {overflow: hidden;}

/* 신청서작성 완료화면 */
.complete_area {overflow: hidden; width: 520px; margin: 0 auto;}
.complete_area p {font-size: 22px; padding-bottom: 105px; color: #000; font-weight: bold; text-align: center; word-break: keep-all; background: url('../images/sub/complete_bg.png') no-repeat bottom center;}
.complete_area p span {color: #01a4b2;}
.complete_area > strong {display: block; font-size: 22px; color: #000; font-weight: bold; text-align: center; word-break: keep-all;}
.complete_area > strong span {color: #01a4b2;}
.complete_area.type02 p {font-size: 18px; padding-bottom: 105px; color: #000; font-weight: normal; text-align: center; word-break: keep-all; background: url('../images/sub/complete_bg.png') no-repeat bottom center;}
.complete_area.type02 p span {color: #01a4b2; text-decoration: underline;}
.complete_area.type02 strong + p {margin-top: 15px;}
.complete_area > div {margin-top: 35px; font-size: 0px; text-align: center;}
.complete_area > div a {position: relative; display: inline-block; width: calc(50% - 10px); height: 39px; font-size: 17px; line-height: 37px; text-align: left; border-radius: 5px;}
.complete_area > div a::before {position: absolute; display: inline-block; content: ">"; font-size: 15px; top: 0; right: 27px;}
.complete_area > div a + a {margin-left: 20px;}
.complete_area > div a span {padding-left: 50px;}
.complete_area > div a:first-child {color: #006cb8; border: 1px solid #006cb8;}
.complete_area > div a:last-child {color: #01a4b2; border: 1px solid #01a4b2;}
.complete_area.type03 {width: 650px;}
.complete_area.type03 > div a {max-width: 220px;}
.complete_area.type04 {width: 100%;}
.complete_area.type04 > div a {max-width: 220px;}

.txt_box {overflow: hidden; margin-bottom: 20px; padding: 20px 25px; border: 1px solid #dddddd; border-radius: 10px;}
.txt_box p {margin-bottom: 20px; font-size: 14px; color: #cc8600; word-break: keep-all;}

/* 이용약관 */
.clause_area {overflow: hidden;}
.clause_area div.txtbox01 {margin-bottom: 30px; padding: 20px; border-radius: 15px; background-color: #f1f1f1;}
.clause_area div.txtbox01 p {font-size: 16px; color: #333; letter-spacing: -0.02em; word-break: keep-all;}
.clause_area ul > li:first-child {padding-top: 0px;}
.clause_area ul > li {padding: 30px 0; border-bottom: 1px solid #dddddd;}
.clause_area ul > li .mb10 {margin-bottom: 10px;}
.clause_area ul > li strong.tit01 {display: block; font-size: 18px; color: #000;}
.clause_area ul > li strong.tit02 {display: block; font-size: 15px; color: #000; word-break: keep-all;}
.clause_area ul > li p {font-size: 15px; color: #333; line-height: 1.5em; word-break: keep-all;}
.clause_area ol {font-size: 15px;}
.clause_area ol > li {margin-top: 2px; word-break: keep-all;}

/* 수강신청 - 교육상세 구분 */
.con_line {overflow: hidden; margin-bottom: 20px; padding-bottom: 10px;}
.con_line .editor_area {overflow: hidden;}
.con_line .con_slide_area {position: relative;}
.con_line .con_slide_area .swiper-container {overflow: hidden; width: 633px;}
.con_line .con_slide_area .swiper-container img {width: 100%;}
.con_line .con_slide_area .page_btn_area {position: absolute; width: 780px; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.con_line .con_slide_area .page_btn_area a {width: 42px; height: 42px;}
.con_line .con_slide_area .page_btn_area a::after {content: none;}
.con_line .con_slide_area .page_btn_area a.swiper-button-prev {background: url('../images/common/sub_slide_prev.png') no-repeat center center; background-size: cover;}
.con_line .con_slide_area .page_btn_area a.swiper-button-next {background: url('../images/common/sub_slide_next.png') no-repeat center center; background-size: cover;}
.con_line .con_slide_area .swiper-pagination {position: absolute; width: 100%; bottom: 10px; text-align:  center;}
.con_line .con_slide_area .swiper-pagination .swiper-pagination-bullet {width: 10px; height: 10px;}
.con_line .con_slide_area .swiper-pagination span.swiper-pagination-bullet-active {background-color: #007aff !important;}
.con_line .con_slide_area .swiper-pagination span + span {margin-left: 5px;}
.con_line .con_slide_area .swiper-pagination span.end {background-color: #000; opacity: 1;}
.con_line .con_slide_area .swiper-pagination span.end.swiper-pagination-bullet-active {background-color: #007aff !important;}

.youtube_area {overflow: hidden; position: relative; width: 100%; height: 100%; margin: 0 auto 20px; border:1px solid #ddd}
.youtube_area .Player01 {position: relative !important;}

/* 수강신청 - 교육상세 */
.book_info_area {position: relative; overflow: hidden; margin-bottom: 20px; font-size: 0px;}
.book_info_area .book_photo {overflow: hidden; display: inline-block; width: 150px; height: 215px; border: 1px solid #e2e2e2; vertical-align: top;}
.book_info_area .book_photo img {display: block; width: 100%; height: 100%;}
.book_info_area .book_info_box { display: inline-block; width: calc(100% - 190px); margin-left: 40px; vertical-align: top;}
.book_info_area .book_info_box strong.tit {overflow: hidden; display: block; font-size: 22px; color:#000; font-weight: bold; letter-spacing: -0.04em; line-height: 1.2em; vertical-align: middle;}
.book_info_area .book_info_box span.tag {float: left; margin: 4px 10px 0 0; font-size: 13px; color:#fff; vertical-align: middle; border-radius: 0px;}
.book_info_area .book_info_box span.tag.type01 {background: #2db8bd;}
.book_info_area .book_info_box span.tag.type02 {background: #888888;}
.book_info_area .book_info_box span.tag + strong.tit  {width: calc(100% - 150px); }
/* 
.book_info_area .book_info_box ul {display: block; margin-top: 15px; margin-bottom: 15px;}
.book_info_area .book_info_box ul li {display: inline-block;}
.book_info_area .book_info_box ul li + li {margin-left: 30px;}
.book_info_area .book_info_box ul li span.tit {display: inline-block; width: 48px; height: 19px; font-size: 13px; color: #888888; line-height: 17px; text-align: center; border: 1px solid #d9d9d9;}
.book_info_area .book_info_box ul li span.txt {display: inline-block; margin-left: 10px; font-size: 14px; color: #000;}
 */
.book_info_area .book_info_box ul {display: flex; margin-top: 10px; margin-bottom: 15px; flex-wrap: wrap; flex-direction: row; }
.book_info_area .book_info_box ul li {flex: auto; margin-top: 5px;}
.book_info_area .book_info_box ul li span.tit {float: left; display: inline-block; width: 48px; height: 19px; margin-right: 10px; font-size: 13px; color: #888888; line-height: 17px; text-align: center; border: 1px solid #d9d9d9;}
.book_info_area .book_info_box ul li span.txt {overflow: hidden; display: block; font-size: 14px; color: #000; word-break: break-word;}
.book_info_area .book_info_box p.price {display: block; margin-bottom: 15px; font-size: 13px; color: #000000; font-weight: bold; letter-spacing: -0.04em;}
.book_info_area .book_info_box p.price span {font-size: 12px; color:#006cb8;}
.book_info_area .book_info_box p.price strong {display: inline-block; margin-left: 10px; font-size: 19px;}
.book_info_area .book_info_box div.txt_box02 {width: 100%; font-size: 14px;}
.book_info_area + .book_info_area  {margin-top: 40px;}
.book_info_area a {position: absolute; top: 0px; right: 0px;}
/*교육상세 - 강사정보 20220919추가 */
.edu_instrctr_box {overflow: hidden; margin-bottom: 20px;}
.edu_instrctr_box > div {position: relative;}
.edu_instrctr_box .instrctr_info_con {min-height: 190px; margin-left: 200px; padding: 10px;}
.edu_instrctr_box .instrctr_info_con .txt_con {overflow: hidden; padding: 0px 13px; margin-bottom: 13px;}
.edu_instrctr_box .instrctr_info_con .imgBox {position: absolute; overflow: hidden; width: 190px; top: 0px; left: 0px; border-radius: 15px;}
.edu_instrctr_box .instrctr_info_con .imgBox img {width: 100%; height: 100%;}
.edu_instrctr_box .instrctr_info_con strong.title {display: block; margin-bottom: 15px; font-size: 19px; line-height: 1.2em;}
.edu_instrctr_box .instrctr_info_con .editor_area {overflow: hidden; font-size: 15px;}

.instrctr_info_con_multi .txt_con {overflow: hidden;}
.instrctr_info_con_multi strong.title {display: block; margin-bottom: 15px; font-size: 19px; line-height: 1.2em;}
.instrctr_info_con_multi .editor_area {overflow: hidden; font-size: 15px;}
.instrctr_con_imgBox {position: relative; margin-bottom: 13px;}
.instrctr_imgBox {display: inline-block; overflow: hidden; width: 190px; top: 0px; left: 0px; border-radius: 15px;}
.instrctr_imgBox img {width: 100%; height: 100%;}

/* 수강신청 - 수강후기 */
.epilogue_area {overflow: hidden;}
.epilogue_area .rating_area {}
.epilogue_area .rating_area .rating {display: inline-block; width: 350px; float: left; text-align: center;}
.epilogue_area .rating_area .rating strong {display: block; margin-top: 10px; font-size: 34px; color: #000; letter-spacing: -0.04em;}
.epilogue_area .rating_area .rating_list {display: inline-block; width: calc(100% - 450px);}
.epilogue_area .rating_area .rating_list ul {font-size: 0px;}
.epilogue_area .rating_area .rating_list ul li { float:left; width:19%; height:80px;text-align:center;margin-top: 3px;}
.epilogue_area .rating_area .rating_list ul li + li {margin-top: 3px;}
.epilogue_area .rating_area .rating_list ul li span {display: inline-block; width: 100%; font-size: 12px; color: #888888; vertical-align: middle;}
.epilogue_area .rating_area .rating_list ul li span strong {font-weight: bold; color: #000;}
.epilogue_area .rating_area .rating_list ul li div {width: 30px; height: calc(100% - 26px); background-color: #e5e5e5; border-radius: 3px; vertical-align: middle;position:relative;margin:0 auto;}
.epilogue_area .rating_area .rating_list ul li div > div {overflow: hidden; text-align: center; background-color: #0e964b;position:absolute;bottom:0px;}
.epilogue_area .rating_area .rating_list ul li div > div > span {font-size: 8px; font-weight: bold; color: #fff; }
.epilogue_area .rating_area + .comment_area {margin-top: 20px;}
.epilogue_area .comment_area {margin-bottom: 20px;}
.epilogue_area .comment_area ul {/*margin-bottom: 20px;*/ font-size: 0px;}
.epilogue_area .comment_area ul li {padding: 20px 30px; border-top: 1px solid #dddddd;}
.epilogue_area .comment_area ul li + li {/*margin-top: 10px;*/}
.epilogue_area .comment_area ul li div.comment_left {display: inline-block; width: 140px; font-size: 14px;}
.epilogue_area .comment_area ul li div.comment_left strong {}
.epilogue_area .comment_area ul li div.comment_left span {padding-left: 20px;}
.epilogue_area .comment_area ul li div.comment_left strong + span::before {position: relative; display: inline-block; content: ""; top: 0px; left: -10px; width: 1px; height: 10px; background: #cccccc;}
.epilogue_area .comment_area ul li div.comment_left .comment_icon {display: flex; height: 18px;}
.epilogue_area .comment_area ul li div.comment_left .reply_icon { background: url('../images/icon/icon_reply.png') no-repeat left center; background-size: 20px; width: 60px; height: 18px; line-height: 18px;}
.epilogue_area .comment_area ul li div.comment_left .good_icon { background: url('../images/icon/icon_good.png') no-repeat left center; background-size: 20px; width: 60px; height: 18px; line-height: 18px;}
.epilogue_area .comment_area ul li div.comment_left .bad_icon { background: url('../images/icon/icon_bad.png') no-repeat left center; background-size: 20px; width: 60px; height: 18px; line-height: 18px;}
.epilogue_area .comment_area ul li div.comment_left .good_icon.on { background: url('../images/icon/icon_good_on.png') no-repeat left center; background-size: 20px; width: 60px; height: 18px; line-height: 18px;}
.epilogue_area .comment_area ul li div.comment_left .bad_icon.on { background: url('../images/icon/icon_bad_on.png') no-repeat left center; background-size: 20px; width: 60px; height: 18px; line-height: 18px;}
.epilogue_area .comment_area ul li div.comment_right {display: inline-block; width: calc(100% - 140px); padding: 0 0 0 20px; font-size: 15px;margin-top:25px;}
.epilogue_area .comment_area ul li div.comment_right p {display: inline-block; float: left; width: calc(100% - 70px); padding: 0 10px 0 0; word-break: keep-all;}
.epilogue_area .comment_area ul div.write_area {padding-bottom: 45px;}
.epilogue_area .comment_area ul div.write_area li {border : solid 1px #dddddd;}

.epilogue_area .comment_area.type02 ul li  {overflow: hidden;}
.epilogue_area .comment_area.type02 ul li div.comment_left {display: inline-block; float: left; width: 788px;}
.epilogue_area .comment_area.type02 ul li div.comment_left span + .rating_box {margin-left: 20px;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_top + div.comment_bottom {margin-top: 30px;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom div.con {display: none;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom div.con.active {display: block;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn {display: inline-block; margin-top: 10px; font-size: 13px; color: #0e173e;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn span {padding: 0 20px 0 0; background: url('../images/icon/icon_acc_arrow02.png') no-repeat center right;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn.closed span {padding: 0 20px 0 0; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right;}
.epilogue_area .comment_area.type02 ul li div.comment_right {display: inline-block; width: 100px; padding-left: 0px; text-align: right;}
.epilogue_area .comment_area.type02 ul li div.comment_right a {width: 80px;}
.epilogue_area .comment_area.type02 ul li div.comment_right a + a {margin-top: 10px;}
.epilogue_area .comment_area.type02 ul li div.comment_right a + span {display: block; margin-top: 10px; font-size: 13px; color: #888888;}

.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_top div.rating_box span {background-size: auto;}

.epilogue_area .rating_box {display: inline-block; width: 110px;}
.epilogue_area .rating_box a {display: inline-block; float: left; width: 18px; height: 18px; font-size: 0px; background: url('../images/icon/icon_star.png') no-repeat center center; background-size:cover;}
.epilogue_area .rating_box.disabled > a {cursor: default;}
.epilogue_area .rating_box a + a {margin-left: 2px;}
.epilogue_area .rating_box a.active {background: url('../images/icon/icon_star_active.png') no-repeat center center; background-size: cover;}

.epilogue_area .rating_box span {display: inline-block; float: left; width: 18px; height: 18px; font-size: 0px; background: url('../images/icon/icon_star.png') no-repeat center center; background-size:cover;}
.epilogue_area .rating_box.disabled > span {cursor: default;}
.epilogue_area .rating_box span + span {margin-left: 2px;}
.epilogue_area .rating_box span.active {background: url('../images/icon/icon_star_active.png') no-repeat center center; background-size: cover;}

.epilogue_area .rating_input {display: inline-block;}

.epilogue_area .rating_input input[type='radio'] {position: relative; display: inline-block; width: 15px; height: 15px; font-size: 12px; line-height: 15px; text-align: center; border: 1px solid #9d9d9d; border-radius: 30%; vertical-align: middle;}
.epilogue_area .rating_input input[type='radio']:checked {display: inline-block; width: 15px; height: 15px; font-size: 12px; line-height: 15px; text-align: center; color: #fff; border: 1px solid #22c1ce; border-radius: 30%; background-color: #22c1ce;}

.epilogue_area .comment_area .rating_box a {width: 13px; height: 13px;}

/* 공통댓글 추가 20220901*/
.epilogue_area_sub .sub_comment_area {background-color: rgba(0,0,0,.02); padding-left: 26px;}
.epilogue_area_sub .sub_comment_area ul {font-size: 0px;}
.epilogue_area_sub .sub_comment_area ul div.sub_box {margin-top: 0px; padding-right: 26px;}
.epilogue_area_sub .sub_comment_area ul div.read_box {margin-top: 0px; padding-right: 26px;}
.epilogue_area_sub .sub_comment_area ul .comment_sub_ico {top: 30px; border-width: 0 0 1px 1px; border-style: solid; padding-bottom: 10px; padding-left: 10px; opacity: .4; position: relative;}

.epilogue_area_sub .sub_comment_area ul li {padding: 30px 30px; border-top: 1px solid #dddddd;}
.epilogue_area_sub .sub_comment_area ul li + li {/*margin-top: 10px;*/}
.epilogue_area_sub .sub_comment_area ul li div.comment_left {display: inline-block; font-size: 14px; float: left; width: 700px !important;}
.epilogue_area_sub .sub_comment_area ul li div.comment_left strong {}
.epilogue_area_sub .sub_comment_area ul li div.comment_left span {padding-left: 20px;}
.epilogue_area_sub .sub_comment_area ul li div.comment_left strong + span::before {position: relative; display: inline-block; content: ""; top: 0px; left: -10px; width: 1px; height: 10px; background: #cccccc;}
.epilogue_area_sub .sub_comment_area ul li div.comment_left .comment_icon {display: flex; height: 18px;}
.epilogue_area_sub .sub_comment_area ul li div.comment_left .reply_icon { background: url('../images/icon/icon_reply.png') no-repeat left center; background-size: 20px; width: 60px; height: 18px; line-height: 18px;}
.epilogue_area_sub .sub_comment_area ul li div.comment_left .good_icon { background: url('../images/icon/icon_good.png') no-repeat left center; background-size: 20px; width: 60px; height: 18px; line-height: 18px;}
.epilogue_area_sub .sub_comment_area ul li div.comment_left .bad_icon { background: url('../images/icon/icon_bad.png') no-repeat left center; background-size: 20px; width: 60px; height: 18px; line-height: 18px;}
.epilogue_area_sub .sub_comment_area ul li div.comment_left .good_icon.on { background: url('../images/icon/icon_good_on.png') no-repeat left center; background-size: 20px; width: 60px; height: 18px; line-height: 18px;}
.epilogue_area_sub .sub_comment_area ul li div.comment_left .bad_icon.on { background: url('../images/icon/icon_bad_on.png') no-repeat left center; background-size: 20px; width: 60px; height: 18px; line-height: 18px;}
.epilogue_area_sub .sub_comment_area ul li div.comment_right {display: inline-block; width: calc(100% - 100px); padding: 0 0 0 20px; font-size: 15px;margin-top:25px;}
.epilogue_area_sub .sub_comment_area ul li div.comment_right p {display: inline-block; float: left; width: calc(100% - 70px); padding: 0 10px 0 0; word-break: keep-all;}
.epilogue_area_sub .sub_comment_area ul div.sub_write_area {padding-left: 26px; padding-top: 30px; padding-bottom: 30px;}
.epilogue_area_sub .sub_comment_area ul div.sub_write_area li {border : solid 1px #dddddd;  background-color: #fff;}

/* 게시글(추천, 비추천) */
.ntt_exprs_area {display: flex; justify-content: center; font-size: 15px; padding: 15px; width: 100% !important;}
.ntt_exprs_area .ntt_exprs_btn_area {display: flex; justify-content: center;}
.ntt_exprs_area .ntt_exprs_btn_area .exprs_text{margin-left: 3px; font-size: 15px;}
.ntt_exprs_area .ntt_exprs_btn_area .good_btn{display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(109, 109, 109, 0.53); border-radius: 30px; padding: 13px;}
.ntt_exprs_area .ntt_exprs_btn_area .good_btn.on {display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(4, 36, 168, 0.4); border-radius: 30px; padding: 13px;}
.ntt_exprs_area .ntt_exprs_btn_area .bad_btn{display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(97, 96, 96, 0.53); border-radius: 30px; padding: 13px;}
.ntt_exprs_area .ntt_exprs_btn_area .bad_btn.on {display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(4, 36, 168, 0.4); border-radius: 30px; padding: 13px;}
.ntt_exprs_area .ntt_exprs_btn_area .good_btn .good_icon { background: url('../images/icon/icon_good.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}
.ntt_exprs_area .ntt_exprs_btn_area .bad_btn .bad_icon { background: url('../images/icon/icon_bad.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}
.ntt_exprs_area .ntt_exprs_btn_area .good_btn .good_icon.on { background: url('../images/icon/icon_good_on.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}
.ntt_exprs_area .ntt_exprs_btn_area .bad_btn .bad_icon.on { background: url('../images/icon/icon_bad_on.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}

/* 기관전용 - 일괄회원가입 */
.tip_txt {position: relative; margin-bottom: 20px; padding: 20px 30px 25px; border: 1px solid #e8e8e8; border-radius: 15px; background-color: #fff;}
.tip_txt .tit {position: absolute; top: -17px; left: 18px; background-color: #179fc6;}
.tip_txt .tit > strong {position: relative; display: block; height: 34px; padding: 4px 10px 4px 30px; font-size: 18px; font-weight: bold; color: #fff;}
.tip_txt .tit > strong::before {position: absolute; display: block; content: ""; width: 37px; height: 41px; top: -2px; left: -17px; background: url('../images/icon/icon_exclamation.png') no-repeat center center;}
.tip_txt .tit > strong::after {position: absolute; display: block; content: ""; width: 27px; height: 34px; top: 0px; right: -27px; background: url('../images/common/tip_txt_bg.png') no-repeat center center;}
.tip_txt > ol > li {font-size: 16px; line-height: 1;}
.tip_txt > ol > li + li {margin-top: 10px;}
.tip_txt > div.con {padding: 5px 0; background: url('../images/common/tip_txt_bg02.png') no-repeat center right;}
.tip_txt > div.con > p {font-size: 16px; letter-spacing: -0.04em;}
.tip_txt > div.con > p + ul {margin-top: 16px;}
.tip_txt > div.con > ul > li {position: relative; padding-left: 15px; font-size: 16px;}
.tip_txt > div.con > ul > li + li {margin-top: 3px; }
.tip_txt > div.con > ul > li::before {position: absolute; display: inline-block; content: ""; width: 6px; height: 6px; top: 9px; left: 0px; background-color: #49e3cb;}
.tip_txt > div.con > p.tip_p {font-size: 13px; color: #eb524e;}
.tip_txt > div.con > .edu_step > strong {font-size: 16px; margin-right: 10px;}
.tip_txt > div.con > .edu_step > ul.tip_step_list {display: inline-block; max-width: 565px; margin: 10px auto; padding: 0 70px; background-color: #f3f3f3; border-radius: 50px;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li {display: inline-block; padding: 10px 0;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li::before {content: none;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li + li {margin-top: 0px; padding-left: 60px; background: url('../images/icon/icon_arrow05.png') no-repeat center left 20px;}

/* 기관전용 - 일괄수정신청내역상세 */
div.tbl_dl {display: block; width: 100%;}
div.tbl_dl dl {display: block; width: 100%; font-size: 0px;}
div.tbl_dl dl + dl {margin-top: 3px;}
div.tbl_dl dl > dt {display: inline-block; width: 60px; font-size: 15px; color: #000; font-weight: bold; vertical-align: top;}
div.tbl_dl dl > dd {display: inline-block; width: calc(100% - 60px); font-size: 14px; padding-left: 10px; vertical-align: top;}
div.tbl_dl dl > dt + dd {position: relative;}
div.tbl_dl dl > dt + dd::before {position: absolute; display: block; content: ""; top: 2px; left: 0px; width: 1px; height: 15px; background-color: #ababab;}

.div_dl_area {overflow: hidden; margin-bottom: 30px; padding: 20px 30px; font-size: 0px; background: #f4f4f4; border-radius: 5px;}
.div_dl_area dl {display: inline-block; width: 50%;}
.div_dl_area dl dt {display: inline-block; width: 110px; font-size: 15px; font-weight: bold; color: #000; vertical-align: middle;}
.div_dl_area dl dd {display: inline-block; width: calc(100% - 160px); font-size: 15px; vertical-align: middle;}

/* 알림함 */
.accordion_list {overflow: hidden; margin-bottom: 30px;}
.accordion_list ul {font-size: 0px;}
.accordion_list ul li {border-bottom: 1px solid #dddddd;}
.accordion_list ul li div.accordion_info {position: relative; display: inline-block; width: 100%; padding: 22px 0; background: url('../images/icon/icon_alarm_bg.png') no-repeat top 15px left 0px;}
.accordion_list ul li div.accordion_info.kakao {background: url('../images/icon/icon_kakao_bg.png') no-repeat top 15px left 0px;}
.accordion_list ul li div.accordion_info span {position: absolute; display: inline-block; top: 25px; left: 55px; font-size: 13px; color: #777777; text-align: center; letter-spacing: -0.04em;}
.accordion_list ul li div.accordion_info a.tit {display: inline-block; width: calc(100% - 156px); margin-left: 156px; font-size: 16px; color: #000; letter-spacing: -0.04em;}
.accordion_list ul li div.accordion_con {display: none; width: calc(100% - 156px); margin-left: 156px; padding-bottom: 20px; font-size: 13px; color: #666666;}
.accordion_list ul li div.accordion_con.active {display: block;}
.accordion_list ul li div.accordion_con a.acc_close {display: inline-block; margin-top: 20px; padding-right: 20px; font-size: 13px; color: #0e173e; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right;}

/* 로그인 */
.txt_box_bg {min-height: 109px; margin-bottom: 30px; padding: 22px 0; border-radius: 15px; background: url('../images/common/txt_box_bg.png') no-repeat bottom right;}
.txt_box_bg p {font-size: 19px; color: #000; text-align: center;}
.txt_box_bg p strong {font-size: 24px; line-height: 1.6em;}
.login_area {text-align: center;}
.login_area > p {font-size: 15px; color: #333; word-break: keep-all;}
.login_area > strong.login_txt {font-size: 22px;}
.login_area > p.login_txt {font-size: 18px;}
.login_area > strong.login_txt + p.login_txt {margin-top: 25px;}
.login_area > p.login_txt + div {margin: 60px auto 0;}
.login_area > div {width: 320px; margin: 30px auto 0;}
.login_area > div > div.input_name {width: 100%; height: 46px; margin-bottom: 10px; background: url('../images/icon/icon_id.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.login_area > div > div.input_name input[type='text'] {width: 100%; height: 46px; padding: 0 20px 0 40px; background: transparent; border: 0px;}
.login_area > div > ul.certify_list {margin-bottom: 10px;}
.login_area > div > div.login_link_area {margin-bottom: 30px;}
.login_area > div > div.login_link_area a {font-size: 14px; color: #222;}
.login_area > div > div.login_link_area a + a {position: relative; padding-left: 15px;}
.login_area > div > div.login_link_area a + a::before {position: absolute; display: inline-block; content: ""; width: 2px; height: 9px; top: 7px; left: 5px; background-color: #e6e6e6;}

/* 회원가입 이용약관 */
.policy_area {overflow: hidden;}
.policy_area + .policy_area {margin-top: 40px;}

/* 나의수강현황 */
.myedu_con {overflow: hidden;}
.myedu_con .left_con {float: left; display: inline-block; width: 475px; margin-right: 40px;}
.myedu_con .left_con > ul {overflow: hidden; border: 1px solid #dddddd; border-radius: 10px; background-color: #f8f8f8;}
.myedu_con .left_con > ul > li + li {border-left: 1px solid #dddddd;}
.myedu_con .left_con > ul.type01 {height: 148px; margin-bottom: 20px;}
.myedu_con .left_con > ul.type01 > li {display: inline-block; float: left; width: 50%; height: 100%; padding: 20px 15px;}
.myedu_con .left_con > ul.type01 > li > strong {display: block; margin-bottom: 15px; font-size: 22px; letter-spacing: -0.04em;}
.myedu_con .left_con > ul.type01 > li > p { font-size: 13px; color: #333; line-height: 1;}
.myedu_con .left_con > ul.type01 > li > p + p {margin-top: 4px;}
.myedu_con .left_con > ul.type01 > li > p strong {font-size: 16px; color: #018f9b; line-height: 1;}
.myedu_con .left_con > ul.type01 > li:nth-child(2) p + p {margin-top: 9px;}
.myedu_con .left_con > ul.type02 {height: 207px;}
.myedu_con .left_con > ul.type02 > li {position: relative; display: inline-block; float: left; width: 33.3333%; height: 100%; padding: 20px 15px 0;}
.myedu_con .left_con > ul.type02 > li > strong {display: block; margin-bottom: 5px; font-size: 15px;}
.myedu_con .left_con > ul.type02 > li > a {position: absolute; display: block; width: 100%; height: 48px; bottom: 0px; left: 0px; text-align: center; border-top: 1px solid #dddddd; background-color: #eeeeee;}
.myedu_con .left_con > ul.type02 > li > a span {display: inline-block; padding-right: 25px; font-size: 13px; line-height: 48px; color: #666666; background: url('../images/icon/icon_link_bg.png') no-repeat center right;}
.myedu_con .left_con > ul.type02 > li > p {font-size: 13px; color: #666666;}
.myedu_con .left_con > ul.type02 > li > p span.pc_block {display: block; font-size: 13px; color: #666666;}
.myedu_con .left_con > ul.type02 > li > p > span {display: block; font-size: 16px; color: #000;}

.myedu_con .left_con > ul.type02 > li > p > strong {font-size: 16px; color: #01a4b2;}
.myedu_con .left_con > ul.type02 > li > p + p {margin-top: 10px;}
.myedu_con .right_con { display: inline-block; width: 435px;}
.myedu_con .right_con div.table_area {overflow: auto; height: 423px; margin-bottom: 0px;}
.edu_th_list {width: 820px; margin: 0 0 25px 130px;  font-size: 0px;}
.edu_th_list li {display: inline-block; width: 117px; text-align: center;}
.edu_th_list li span {position: relative; display: block; padding-top: 85px; font-size: 15px; color: #000;}
.edu_th_list li span::before {position: absolute; display: block; content: ""; width: 75px; height: 75px; top: 0px; left: 50%; margin-left: -37.5px; border: 1px solid #e4e4e4; border-radius: 50%;}
.edu_th_list li span.bg01::before {background: url('../images/sub/edu_tbl_bg01.png') no-repeat center center #fff;}
.edu_th_list li span.bg02::before {background: url('../images/sub/edu_tbl_bg02.png') no-repeat center center #fff;}
.edu_th_list li span.bg03::before {background: url('../images/sub/edu_tbl_bg03.png') no-repeat center center #fff;}
.edu_th_list li span.bg04::before {background: url('../images/sub/edu_tbl_bg04.png') no-repeat center center #fff;}
.edu_th_list li span.bg05::before {background: url('../images/sub/edu_tbl_bg05.png') no-repeat center center #fff;}
.edu_th_list li span.bg06::before {background: url('../images/sub/edu_tbl_bg06.png') no-repeat center center #fff;}
.edu_th_list li span.bg07::before {background: url('../images/sub/edu_tbl_bg07.png') no-repeat center center #fff;}
.con_line .con_left {overflow: hidden; display: inline-block; float: left; width: 455px; vertical-align: top;}
.con_line .con_right {overflow: hidden; display: inline-block; width: 455px; vertical-align: top;}
.con_line .con_left + .con_right {margin-left: 40px;}

.bg_box {margin-bottom: 25px; padding: 20px 100px; border-radius: 5px; background-color: #f4f4f4;}
.sign_btn {display: inline-block; width: 210px; height: 97px; border-radius: 15px; text-align: center; background-color: #f4f4f4;}
.sign_btn a {position: relative; display: block; width: 100%; height: 100%; padding: 20px; font-size: 14px; color: #888888;}
.sign_btn a span {position: absolute; width: 80%; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.sign_area {width: 548px; height: 212px; margin: 30px auto; border-radius: 10px; background-color: #f4f4f4;}

/* 퍼센트영역 */
.percent_list_area {margin-bottom: 35px;}
.percent_list_area ul {width: 100%; height: 80px; border: 1px solid #dddddd; border-radius: 10px;}
.percent_list_area ul li {position: relative; display: inline-block; float: left; width: 25%; height: 100%;}
.percent_list_area ul li + li {border-left: 1px solid #ddd;}
.percent_list_area ul li > div {padding: 18px 20px;}
.percent_list_area ul li div span {display: block; font-size: 15px; color: #666; letter-spacing: -0.04em; line-height: 1;}
.percent_list_area ul li div strong {display: block; margin-top: 10px; font-size: 20px; color: #000; letter-spacing: -0.04em; line-height: 1;}
.percent_list_area ul li div span + strong {margin-top: 5px;}
.percent_list_area ul li div div.percent {position: absolute; width: 53px; height: 53px; top: 15px; right: 23px; }

/* 과제목록 - 북러닝 */
.edu_list {margin-bottom: 20px;}
.edu_list > ul {width: 100%;}
.edu_list > ul > li {display: block;}
.edu_list > ul > li + li {margin-top: 30px;}
.edu_list > ul > li > div {position: relative; display: flex; padding: 13px 0; border: 1px solid #dddddd; border-radius: 10px; background-color: #f8f8f8;}
.edu_list > ul > li > div > span.txt_tag {position: absolute; display: inline-block; height: 19px; padding: 0 10px; top: -6px; left: 27px; font-size: 13px; color:#018f9b; line-height: 17px; border: 1px solid #018f9b; border-radius: 10px; background-color: #ffffff;}
.edu_list > ul > li > div > .num_area {position: relative; flex-basis: 100px; text-align: center; border-right: 1px solid #ddd;}
.edu_list > ul > li > div > .num_area strong {position: absolute; top: 50%; left: 50%; font-size: 22px; color: #777777; letter-spacing: -0.04em; line-height: 1; transform: translate(-50%, -50%);}
.edu_list > ul > li > div > .con_area {position: relative; padding: 0 20px 0 40px; flex-basis: calc(100% - 100px);}
.edu_list > ul > li > div > .con_area .con_inner_area01 {padding: 3px 50px 3px 0;}
.edu_list > ul > li > div > .con_area .con_inner_area01 > a.lock {padding-left: 20px; line-height: 1; background: url('../images/icon/icon_lock.png') no-repeat center left;}
.edu_list > ul > li > div > .con_area .con_inner_area01 > a > strong {font-size: 17px; color: #333; letter-spacing: -0.04em; vertical-align: middle;}
.edu_list > ul > li > div > .con_area .con_inner_area01 > ul {margin-top: 5px;}
.edu_list > ul > li > div > .con_area .con_inner_area02 {margin-top: 10px; padding: 10px 25px; border: 1px solid #dddddd; border-radius: 5px; background-color: #e5ebf0;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li {display: inline-block; padding-right: 40px; font-size: 13px; color: #333; letter-spacing: -0.04em;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li > strong + span {position: relative; padding-left: 20px;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li > strong + span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 5px; left: 8px; background-color: #cccccc;}
.edu_list > ul > li > div > .con_area .scorebox {position: absolute; display: block; width: 42px; height: 42px; top: 3px; right: 20px; background-color: #0f5383; border-radius: 5px;}
.edu_list > ul > li > div > .con_area .scorebox span {display: block; font-size: 14px; color: #fff; text-align: center; line-height: 42px;}
.edu_list > ul > li > div > .con_area .hits_area {overflow: hidden; margin-top: 5px;}
/*.edu_list > ul > li > div > .con_area .hits_area ul {text-align: right;}*/
.edu_list > ul > li > div > .con_area .hits_area ul li {display: inline-block;}
/*.edu_list > ul > li > div > .con_area .hits_area ul li + li {margin-left: 15px;}*/
.edu_list > ul > li > div > .con_area .hits_area ul li span {font-size: 13px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.nice {padding-left: 30px; background: url('../images/icon/icon_debate_bg01_on.png') no-repeat center left; background-size: 30px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.interest {padding-left: 30px; background: url('../images/icon/icon_debate_bg02_on.png') no-repeat center left; background-size: 30px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.comment {padding-left: 30px; background: url('../images/icon/icon_debate_bg03.png') no-repeat center left; background-size: 30px;}



/* 팝업 학습방법 */
.edu_step_list {overflow: hidden;}
.edu_step_list > li + li {position: relative; padding-top: 15px;}
.edu_step_list > li + li::before {position: absolute; display: inline-block; content: ""; width: 10px; height: 7px; top: 4px; left: 44px; background: url('../images/icon/icon_arrow_down.png') no-repeat center center;}
.edu_step_list > li > div {position: relative; display: inline-block; width: 98px; height: 74px; border-radius: 5px; vertical-align: middle;}
.edu_step_list > li > div > span {position: absolute; display: block; width: 100px; top: 50%; left: 50%; font-size: 14px; color: #000; line-height: 1.2em; letter-spacing: -0.04em; text-align: center; transform: translate(-50%, -50%);}
.edu_step_list > li > div > span.num {position: absolute; display: block; width: 20px; height: 20px; top: 24px; right: -11px; left: auto; color: #fff; font-size: 12px; text-align: center; line-height: 16px; color: #fff; border: 2px solid #fff; border-radius: 50%; transform: inherit;}
.edu_step_list > li > p {display: inline-block; width: calc(100% - 125px); margin-left: 20px; font-size: 15px; vertical-align: middle;}
.edu_step_list > li:nth-child(1) > div {border: 2px solid #9ed342; }
.edu_step_list > li:nth-child(1) > div > span.num {background-color: #9ed342;}
.edu_step_list > li:nth-child(2) > div {border: 2px solid #43d1a1; }
.edu_step_list > li:nth-child(2) > div > span.num {background-color: #43d1a1;}
.edu_step_list > li:nth-child(3) > div {border: 2px solid #40d3e2; }
.edu_step_list > li:nth-child(3) > div > span.num {background-color: #40d3e2;}
.edu_step_list > li:nth-child(4) > div {border: 2px solid #41a7e0; }
.edu_step_list > li:nth-child(4) > div > span.num {background-color: #41a7e0;}
.edu_step_list > li:nth-child(5) > div {border: 2px solid #4382dd; }
.edu_step_list > li:nth-child(5) > div > span.num {background-color: #4382dd;}
.edu_step_list > li:nth-child(6) > div {border: 2px solid #5571aa; }
.edu_step_list > li:nth-child(6) > div > span.num {background-color: #5571aa;}
.edu_step_list > li:nth-child(7) > div {border: 2px solid #abb5c6; }
.edu_step_list > li:nth-child(7) > div > span.num {background-color: #abb5c6;}

/* faq */
.faq_area {overflow: hidden; margin-bottom: 30px;}
.faq_area > ul {}
.faq_area > ul > li {overflow: hidden; border: 1px solid #dddddd; background-color: #f8f8f8; border-radius: 10px;}
.faq_area > ul > li + li {margin-top: 15px;}
.faq_area > ul > li div.faq_h {display: flex; padding: 16px 30px; align-items: center;}
.faq_area > ul > li div.faq_h:hover {cursor: pointer;}
.faq_area > ul > li div.faq_h strong {}
.faq_area > ul > li div.faq_h strong.num {flex-basis: 40px; font-size: 22px; font-weight: bold; color: #777777; text-align: center;}
.faq_area > ul > li div.faq_h span.classify {flex-basis: 120px; text-align: center; font-size: 15px; color: #333;}
.faq_area > ul > li div.faq_h strong.tit {flex-basis: 550px; font-size: 17px; color: #333; font-weight: normal; letter-spacing: -0.04em;}
.faq_area > ul > li div.faq_h ul {display: inline-block; padding-left: 10px;}
.faq_area > ul > li div.faq_h ul > li {display: inline-block; font-size: 13px; color: #333; }
.faq_area > ul > li div.faq_h ul > li > span {}
.faq_area > ul > li div.faq_h ul > li > span + span {position: relative; padding-left: 20px;}
.faq_area > ul > li div.faq_h ul > li > span + span::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 10px; top: 5px; left: 10px; background-color: #cccccc;}
.faq_area > ul > li div.faq_c {position: relative; display: none; padding: 25px 30px 55px 30px; background-color: #fff;}
.faq_area > ul > li div.faq_c div {position: relative; min-height: 63px; padding-left: 90px; background: url('../images/common/faq_bg.png') no-repeat center left;}
.faq_area > ul > li div.faq_c div::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 100%; top: 0px; left: 90px; background-color: #dddddd;}
.faq_area > ul > li div.faq_c div p {padding-left: 30px; }
.faq_area > ul > li div.faq_c a {position: absolute; display: inline-block; bottom: 18px; left: 35px; padding-right: 20px; font-size: 13px; color: #0e173e; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right;}
.faq_area > ul > li.active {border: 1px solid #0d73bc; background-color: #e2eef6;}

/* 검색결과없을경우 */
.none_search_keyword {display: inline-block; padding: 7px 0 7px 50px; font-size: 20px; font-weight: bold; background: url('../images/icon/icon_exclamation.png') no-repeat center left;}

/* 에러페이지 */
.error_area {width: 950px; margin: 0 auto; text-align: center;}
.error_area h1 {display: block; margin-top: 80px;}
.error_area h1 > a {font-size: 30px; font-weight: 500; color:#333; letter-spacing: -0.04em;}
.error_area h1 > a > span {padding-left: 65px; background: url('../images/common/logo02.png') no-repeat center left;}
.error_area > strong {display: block; margin-top: 95px; margin-bottom: 25px; font-size: 26px; color: #000;}
.error_area > strong + p {padding-top: 30px; border-top: 1px solid #dddddd;}
.error_area > p {margin-bottom: 40px; padding-bottom: 320px; font-size: 17px; color: #333; letter-spacing: -0.04em; word-break: keep-all; background: url('../images/common/error_bg.png') no-repeat center bottom;}

/* 운영자립도 진단 */
.abl_step_area {overflow: hidden; margin-bottom: 40px; border: 1px solid #e2e2e2; border-radius: 5px;}
.abl_step_area > .abl_step_top {background-color: #f6f6f6;}
.abl_step_area > .abl_step_top > ul.type01 {position: relative; overflow: hidden; margin: 0 40px; padding: 15px 0;}
.abl_step_area > .abl_step_top > ul.type01 > li {position: relative; display: inline-block; float: left; width: 20%; padding-bottom: 55px; vertical-align: top; text-align: center;}
.abl_step_area > .abl_step_top > ul.type01 > li > span {position: absolute; display: inline-block; width: 19px; height: 19px; margin-left: -9px; top: 85px; left: 50%; font-size: 12px; line-height: 17px; text-align: center; border: 1px solid #9d9d9d; border-radius: 50%; background-color: #fff;}
.abl_step_area > .abl_step_top > ul.type01 > li > p {font-size: 14px; color: #000; line-height: 1.2em; letter-spacing: -0.04em;}
.abl_step_area > .abl_step_top > ul.type01 > li > p > span {display: block;}
.abl_step_area > .abl_step_top > ul.type01 > li.line {position: absolute; width: 100%; height: 3px; bottom: 45px; padding: 0px; left: 0px; background-color: #006cb8; z-index: 10;}
.abl_step_area > .abl_step_top > ul.type01 > li.line div {position: relative;}
.abl_step_area > .abl_step_top > ul.type01 > li.line div::before {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; left: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_left.png') no-repeat center center;}
.abl_step_area > .abl_step_top > ul.type01 > li.line div::after {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; right: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_right.png') no-repeat center center;}
.abl_step_area > .abl_step_top > ul.type02 {position: relative; overflow: hidden; padding: 23px 0;}
.abl_step_area > .abl_step_top > ul.type02 > li {position: relative; display: inline-block; float: left; width: 33.3333%; vertical-align: top; text-align: center;}
.abl_step_area > .abl_step_top > ul.type02 > li + li {border-left: 1px solid #ddd;;}
.abl_step_area > .abl_step_top > ul.type02 > li > p {display: inline-block; padding-left: 55px; font-size: 14px; color:#000; text-align: left;}
.abl_step_area > .abl_step_top > ul.type02 > li > p > span {display: block;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(1) > p {background: url('../images/common/abl_step_bg01.png') no-repeat center left;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(2) > p {background: url('../images/common/abl_step_bg02.png') no-repeat center left;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(3) > p {background: url('../images/common/abl_step_bg03.png') no-repeat center left;}

.abl_step_area > .abl_step_mid {border-top: 1px solid #dddddd; background-color: #fff;}
.abl_step_area > .abl_step_mid .inner {padding: 20px;}
.abl_step_area > .abl_step_mid .inner + .inner {border-top: 1px solid #ddd;}
.abl_step_area > .abl_step_mid .inner .mid_h {margin-bottom: 10px;}
.abl_step_area > .abl_step_mid .inner .mid_h span {display: inline-block; float: left; width: 60px; margin-right: 25px; font-size: 13px; color: #fff; text-align: center; padding: 1px 0px; border-radius: 10px; background-color: #78a8d1;}
.abl_step_area > .abl_step_mid .inner .mid_h p {display: block; overflow: hidden; width: calc(100% - 85px); font-size: 14px; color: #000; word-break: keep-all;}
.abl_step_area > .abl_step_mid .inner .mid_c {}
.abl_step_area > .abl_step_mid .inner .mid_c ul {margin-left: 85px;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li {display: inline-block;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li + li {margin-left: 30px;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li span {display: inline-block; width: 19px; height: 19px; font-size: 12px; line-height: 17px; text-align: center; border: 1px solid #9d9d9d; border-radius: 50%; background-color: #fff; vertical-align: middle;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li p {display: inline-block; margin-left: 5px; font-size: 14px; vertical-align: middle;}

.abl_step_area > .abl_step_bottom {padding: 13px 25px; border-top: 1px solid #dddddd; background-color: #f6f6f6;}
.abl_step_area > .abl_step_bottom strong {display: inline-block; float: left; width: 60px; text-align: center; font-size: 16px; color: #006cb8; line-height: 1;}
.abl_step_area > .abl_step_bottom strong span {display: block;}
.abl_step_area > .abl_step_bottom div {overflow: hidden; display: block; width: calc(100% - 60px); height: 33px; border: 2px solid #83b6d9; border-radius: 5px; background-color: #fff;}
.abl_step_area > .abl_step_bottom div span {display: inline-block; height: 100%; background-color: #006cb8; vertical-align: top;}

.abl_form_area {overflow: hidden; margin-bottom: 20px; border-top: 3px solid #000;}
.abl_form_area > div {padding: 15px 25px; background-color: #f0f6fb;}
.abl_form_area > div > strong {font-size: 15px; color: #333;}
.abl_form_area > ul > li {border-top: 1px solid #dddddd;}
.abl_form_area > ul > li:last-child {border-bottom: 1px solid #dddddd;}
.abl_form_area > ul > li div.question_h {padding: 15px 25px; font-size: 15px; color: #333; background-color: #f6f6f6;}
.abl_form_area > ul > li div.question_h p {word-break: keep-all;}
.abl_form_area > ul > li div.question_a {border-top: 1px solid #dddddd;}
.abl_form_area > ul > li div.question_a ul {overflow: hidden; display: flex;}
.abl_form_area > ul > li div.question_a ul + ul {border-top: 1px solid #ddd;}
.abl_form_area > ul > li div.question_a ul > li {flex: 1 1 1px; padding: 15px 0; text-align: center;}
.abl_form_area > ul > li div.question_a ul > li + li {border-left: 1px solid #ddd;}

/* 
.num_chk {position: relative; display: inline-block;}
.num_chk input[type='radio'] {position: absolute; top: 0; left: -1px; width: 1px; height: 1px; border: none; opacity: 0.01; text-indent: -999px; overflow: hidden;}
.num_chk input[type='radio'] + label {position: relative; display: inline-block; width: 19px; height: 19px; font-size: 12px; line-height: 17px; text-align: center; border: 1px solid #9d9d9d; border-radius: 50%; background-color: #e1e1e1;}
.num_chk input[type='radio']:checked + label {display: inline-block; width: 19px; height: 19px; font-size: 12px; line-height: 17px; text-align: center; color: #22c1ce; border: 1px solid #22c1ce; border-radius: 50%; background-color: #fff;}
.num_chk input[type='radio']:focus + label::before {position: absolute; display: inline-block; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; outline: 1px solid #000;}
 */

.num_chk {position: relative; display: inline-block;}
.num_chk input[type='radio'] {position: absolute; top: 0; left: -1px; width: 1px; height: 1px; border: none; opacity: 0.01; text-indent: -999px; overflow: hidden;}
.num_chk input[type='radio'] + span {position: relative; display: inline-block; width: 19px; height: 19px; font-size: 12px; line-height: 17px; text-align: center; border: 1px solid #9d9d9d; border-radius: 50%; /*background-color: #e1e1e1;*/ vertical-align: middle;}
/* .num_chk input[type='radio']:checked + span {display: inline-block; width: 19px; height: 19px; font-size: 12px; line-height: 17px; text-align: center; color: #22c1ce; border: 1px solid #22c1ce; border-radius: 50%; background-color: #fff;} */
.num_chk input[type='radio']:checked + span {display: inline-block; width: 19px; height: 19px; font-size: 12px; line-height: 17px; text-align: center; color: #fff; border: 1px solid #22c1ce; border-radius: 50%; background-color: #22c1ce;}
.num_chk input[type='radio']:focus + span::before {position: absolute; display: inline-block; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; outline: 1px solid #000;}
.num_chk > p {display: inline-block; vertical-align: middle;}

/* 자립도 영역 */
.gpa_box {position: relative; overflow: hidden; margin-bottom: 20px; padding: 21px 20px; border: 1px solid #dddddd; border-radius: 5px; background-color: #f8f8f8;}
.gpa_box strong.gpa_txt {font-size: 17px; color: #000;}
.gpa_box strong.gpa_score {position: absolute; top: 13px; right: 20px; line-height: 1; font-size: 38px; color: #000;}
/* 자주도 차트 영역 */
.independent_chart {overflow: hidden; margin-bottom: 20px; border-radius: 5px; border: 1px solid #dddddd;}
.independent_chart .independent_chart_h {position: relative; padding: 13px 20px; background-color: #f8f8f8;}
.independent_chart .independent_chart_h span {display: inline-block; padding: 13px 0px 13px 60px; font-size: 15px; color: #333;}
.independent_chart .independent_chart_h span.in_h_txt01 {background: url('../images/common/independent_bg01.png') no-repeat center left;}
.independent_chart .independent_chart_h span.in_h_txt02 {position: absolute; top: 12px; right: 20px; background: url('../images/common/independent_bg02.png') no-repeat center left;}
.independent_chart .independent_chart_h div.line {position: absolute; width: calc(100% - 330px); height: 3px; bottom: 35px; margin: 0 165px; padding: 0px; left: 0px; background-color: #d6d6d6; z-index: 10;}
.independent_chart .independent_chart_h div.line div {position: relative;}
.independent_chart .independent_chart_h div.line div::before {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; left: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_left02.png') no-repeat center center;}
.independent_chart .independent_chart_h div.line div::after {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; right: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_right02.png') no-repeat center center;}
.independent_chart .independent_chart_b > div {height: 420px;}

/* 역량진단 */
.diagnosis_area {overflow: hidden; font-size: 0px;}
.diagnosis_area > ul {}
.diagnosis_area > ul > li {margin-bottom: 20px;}
.diagnosis_area > ul > li > strong {display: inline-block; margin-bottom: 15px; font-size: 22px; color: #006cb8; line-height: 1; letter-spacing: -0.04em;}
.diagnosis_area > ul > li > ul {border-bottom: 1px solid #ddd;}
.diagnosis_area > ul > li:last-child > ul {border-bottom: 0px;}
.diagnosis_area > ul > li > ul > li {display: inline-block; width: calc(50% - 20px); margin-bottom: 20px;}
.diagnosis_area > ul > li > ul > li:nth-child(odd) {margin-right: 20px;}
.diagnosis_area > ul > li > ul > li:nth-child(even) {margin-left: 20px;}
.diagnosis_area > ul > li > ul > li > span {display: block; margin-bottom: 10px; font-size: 17px; color: #333; line-height: 1; letter-spacing: -0.04em;}
.diagnosis_area > ul > li > ul > li > span > strong {display: inline-block; margin-right: 5px; font-weight: bold; color: #cecece;}
.diagnosis_area > ul > li > ul > li > div {padding: 20px; border: 1px solid #ddd; border-radius: 5px; background-color: #f8f8f8;}
.diagnosis_area > ul > li > ul > li > div > a {display: inline-block; padding: 0 15px; font-size: 13px; color: #333; border-radius: 20px; border: 1px solid #ddd; background-color: #fff;}
.diagnosis_area > ul > li > ul > li > div > a:hover {color: #0094a1; border: 1px solid #0094a1;}
.diagnosis_area > ul > li > ul > li > div > a:focus {color: #0094a1; border: 1px solid #0094a1;}
.diagnosis_area > ul > li > ul > li > div > a + a {margin-left: 20px;}

/* 토론상세(10.24 수정) */
.chat_div  {overflow: hidden; /*border: 1px solid #dddddd;*/}
.chat_div .boxDiv {width:50%; position: relative; display: inline-block; float: left; height: 655px;}

.chat_info_area {padding: 20px; background-color: #ffffff; border: 1px solid #dddddd; color: #333333;}
.chat_info_area .infoBox {height: 600px;}
.chat_info_area .infoBox .title {min-height: 40px; border-bottom: 1px solid; padding: 12px 5px;}
.chat_info_area .infoBox .title > strong {display: block; font-size: 20px; color: #000; line-height: 1;}
.chat_info_area .infoBox .smallCn {display: flex; height: 60px; padding-left: 5px;}
.chat_info_area .infoBox .smallCn .logo {line-height: 37px; margin-right: 10px; width: 39px; height: 37px; background: url('../images/common/logo.png') no-repeat center center;}

.chat_info_area .infoBox .dscsnCn {overflow-y: auto; height: 370px; padding-left: 5px;}
.chat_info_area .infoBox .dscsnCn >div p {display: inline-block; text-align: left; line-height: 1.2;}

.chat_info_area .fileBox {height: 100px; margin-top: 10px;}
.chat_info_area .fileBox a.fileIcon {display: inline-block; width: 25px; height: 20px; background: url('../images/icon/icon_file03.png') no-repeat center center;}
.chat_info_area .fileBox > div {height: 70px; /*border-radius: 5px;*/ border-top: 1px solid #999999; background-color: #fff; margin-top: 9px; color: #0d73bc; padding-top: 5px;}
/*.chat_info_area .fileBox > div > a {color: #0d73bc; vertical-align: top; padding-right: 10px;}*/
.chat_info_area .fileBox > div > div> a {color: #0d73bc; vertical-align: top;}
.chat_info_area .fileBox span {color: #999999;}

.chat_area {padding: 20px; background-color: #eaeaea;}
.chat_area .partinListArea {overflow-y: scroll; height: 450px; margin-bottom: 15px;}
/*.chat_area .partinListArea.back {background: url('../images/icon/icon_dscsn.png') no-repeat center center;}*/
.chat_area .partinListArea.reply {height: 390px;}
.chat_area .partinListArea .chatBox {}
.chat_area .partinListArea .chatBox p.year {margin-bottom: 20px; font-size: 16px; font-weight: bold; color: #666; text-align: center; letter-spacing: -0.04em;}
.chat_area .partinListArea .chatBox .chatrowBox {display: block; overflow: hidden;}
.chat_area .partinListArea .chatBox .chatrowBox + .chatrowBox {margin-top: 20px;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow {position: relative; width: auto;/* max-width: 80%;*/ min-width: 150px;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow p.name {display: block; margin-bottom: 10px; font-size: 13px; color: #333333; line-height: 1;}

.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv {display: flex; width: auto; height: 100%; max-width: 80%; min-width: 150px;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv .speechBox {position: relative; display: inline-block; margin-top: 10px; padding: 15px 20px; background-color: #fff; border-radius: 0px 10px 10px 10px; max-width: 80%; font-size: 15px;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv .speechBox::before {position: absolute; display: inline-block; content: ""; width: 0px; height: 0px; bottom: 0px; top: -10px; left: 0px; border-bottom: 10px solid none; border-top: 10px solid transparent; border-left: 20px solid #fff; border-right: 20px solid transparent;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv .speechBox > pre {display: inline-block; text-align: left; line-height: 1.2; }
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv .speechIcon {width: 20px; height: auto; position: relative;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv .speechIcon > a {width: 20px; height: 20px; font-size: 0px; position: absolute; bottom: 3%; display: inline-block;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv .speechIcon.like_btn > a > span {font-size: 13px; color: #999999; margin-left: 20px;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv .speechReply {background: url('../images/icon/icon_reply02.png') no-repeat center center;/* bottom: 11%; right: 14%;*/}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv .speechLike {background: url('../images/icon/icon_like.png') no-repeat center center;/* bottom: 11%; right: 8%;*/}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv .speechLike.on {background: url('../images/icon/icon_like_active.png') no-repeat center center;/* bottom: 11%; right: 8%;*/}

.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBox {position: relative; display: inline-block; margin-top: 10px; padding: 15px 20px; background-color: #fff; border-radius: 0px 10px 10px 10px;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBox::before {position: absolute; display: inline-block; content: ""; width: 0px; height: 0px; bottom: 0px; top: -10px; left: 0px; border-bottom: 10px solid none; border-top: 10px solid transparent; border-left: 20px solid #fff; border-right: 20px solid transparent;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBox .upperAnswerArea {border-bottom: 1px solid #eaeaea; font-size: 12px; text-align: left; padding-bottom: 5px; margin-bottom: 5px;}
/*.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBox > pre {border-bottom: 1px solid #eaeaea; font-size: 12px; text-align: left; padding-bottom: 5px; margin-bottom: 5px;}*/
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .chat_file_list {display: inline-block; /*max-width: 50%;*/ margin: 5px 0; padding: 5px 10px; border: 1px solid #ddd; background: #fff; border-radius: 5px; text-align: left;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .chat_file_list li {position: relative; padding-left: 10px;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .chat_file_list li::before {position: absolute; display: block; content: ""; width: 5px; height: 5px; top: 10px; left: 0; background: #ababab; border-radius: 50%;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .chat_file_list li + li {margin-top: 5px;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .chat_file_list li a {line-height: 1.2em; color: #0d73bc;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow p.time {font-size: 13px; color: #999;}
.chat_area .partinListArea .chatBox .chatrowBox.me .chatRow {float: right; text-align: right; padding-right: 5px;}
.chat_area .partinListArea .chatBox .chatrowBox.me .chatRow .speechBox {position: relative; display: inline-block; margin-top: 10px; padding: 15px 20px; background-color: #feffc9; border-radius: 10px 0px 10px 10px; max-width: 300px;}
.chat_area .partinListArea .chatBox .chatrowBox.me .chatRow .speechBox::before {position: absolute; display: inline-block; content: ""; width: 0px; height: 0px; bottom: -20px; left: auto; right: 0px; border-top: 20px solid none; border-bottom: 20px solid transparent; border-left: 20px solid transparent; border-right: 20px solid #feffc9;}
.chat_area .partinListArea .chatBox .chatrowBox.me .chatRow .speechBox > pre {text-align: left;}
.chat_area .partinListArea .chatBox .chatrowBox.me .chatRow .speechBox .upperAnswerArea {border-bottom: 1px solid #eaeaea; font-size: 12px; text-align: left; padding-bottom: 5px; margin-bottom: 5px;}
.chat_area .partinListArea .chatBox .chatrowBox.me .chatRow ul.chatbtn_area {position: absolute; right: 70px; bottom: 0px; font-size: 0px;}
.chat_area .partinListArea .chatBox .chatrowBox.me .chatRow ul.chatbtn_area li {display: inline-block;}

.chat_area .partinListArea .chatBox .chatrowBox.me .chatRow ul.chatbtn_area li a {font-size: 13px; color: #000;}
.chat_area .partinListArea .chatBox .chatrowBox.me .chatRow ul.chatbtn_area li a.del {color: red;}
.chat_area .partinListArea .chatBox .chatrowBox.me .chatRow ul.chatbtn_area li a.save {color: #5ac4ec;}
.chat_area .chatInputarea {min-height: 100px; /*margin-top: 10px; */padding: 15px; font-size: 0px; background-color: #fff; /*border-radius: 5px;*/}
.chat_area .chatInputarea .chatbox_area {display: inline-block; /*width: calc(100% - 100px); */ width: 100%; height: 80px; vertical-align: middle;}
/*.chat_area .chatInputarea textarea {width: calc(100% - 100px); height: 50px; font-size: 15px; border: 0px; resize: none;}*/
.chat_area .chatInputarea textarea {width: 100%; height: 100%; font-size: 15px; border: 0px; resize: none;}
.chat_area a.btn_chat {display: inline-block; width: 90px; height: 50px; margin-left: 10px; color: #fff; font-size: 15px; line-height: 50px; text-align: center; border-radius: 5px; background-color: #39cae9;}
/*.chat_area .chatInputarea div {margin-top: 5px;}*/
.chat_area .chatInputarea div > a {display: inline-block; /*min-width: 100px;*/ /*height: 19px; *//*font-size: 0px;*/}
.chat_area .chatInputarea div a + a {margin-left: 20px;}
.chat_area .chatInputarea div a.btn_photo {background: url('../images/icon/icon_photo.png') no-repeat center center;}
.chat_area .chatInputarea div a.btn_file {background: url('../images/icon/icon_file04.png') no-repeat left center; overflow: hidden; height: 30px; max-width: 70%;}
.chat_area .chatInputarea div a.btn_send {background: url('../images/icon/icon_message03.png') no-repeat left center; float: right;}
.chat_area .chatInputarea div a.btn_send > span {font-size: 0px;}
.chat_area .chatInputarea div.fileText {font-size: 12px; line-height: 30px; overflow: hidden; border-top: 1px solid #eaeaea; padding-top: 5px;}
.chat_area .chatInputarea div.fileText a > span {padding-left: 25px;}
/*.chat_area .chatInputarea div.fileText .fileBtn {max-width: 80%;}*/
/*.chat_area .chatInputarea div.fileText .fileBtn .fileName {}*/

.chat_area .chatReplyInputarea {min-height: 60px; padding: 10px 15px; font-size: 15px; background-color: #f8f9fa; display: flex; font-size: 14px; border-bottom: 1px solid #eaeaea;}
.chat_area .chatReplyInputarea > div {}
.chat_area .chatReplyInputarea .reply_seleted_cn {width: 90%; /*border-bottom: 1px solid #eaeaea;*/}
.chat_area .chatReplyInputarea .reply_area {overflow: hidden; height: 20px; color: #888888;}
.chat_area .chatReplyInputarea .reply_btn_area {width: 10%; /*border-bottom: 1px solid #eaeaea;*/}
.chat_area .chatReplyInputarea .reply_btn_area a {display: inline-block; width: 40px; height: 100%; font-size: 0px;}
.chat_area .chatReplyInputarea .reply_btn_area .close_btn {background: url('../images/icon/icon_clear_off.png') no-repeat center center;}

.chat_btn_area {text-align: center;}
.chat_btn_area a {position: relative; display: inline-block; width: 45px; height: 44px;}
.chat_btn_area .btnPre {background: url('../images/common/main_slide_prev.png') no-repeat center center;}
.chat_btn_area .btnPre:hover {background: url('../images/common/main_slide_prev_hover.png') no-repeat center center #000;}
.chat_btn_area .btnNext {background: url('../images/common/main_slide_next.png') no-repeat center center;}
.chat_btn_area .btnNext:hover {background: url('../images/common/main_slide_next_hover.png') no-repeat center center #000;}


/* 역량진단결과 */
.diagnosis_area {overflow: hidden; margin-bottom: 30px;}
.diagnosis_area .chart_area {width: 100%; height: 300px; border: 1px solid #dddddd; border-radius: 10px;}
.diagnosis_area .chart_area > div {height: 100%;}
.diagnosis_area .diagnosis_half {display: inline-block; float: left; width: calc(50% - 20px);}
.diagnosis_area .diagnosis_half:nth-child(1) {margin-right: 20px;}
.diagnosis_area .diagnosis_half:nth-child(2) {margin-left: 20px;}
.diagnosis_area .diagnosis_half .chart_area {height: 414px; padding: 20px 0px;}
.diagnosis_area .diagnosis_half .chart_area > div {overflow: hidden; height: 280px;}
.diagnosis_area .diagnosis_half .chart_area p {padding: 0 30px; font-size: 14px; letter-spacing: -0.04em;}
.diagnosis_area .diagnosis_half:nth-child(2) .chart_area > div {height: 100%;}

.independent_none_con {overflow: hidden; padding-bottom: 290px; text-align: center; background: url('../images/sub/independent_none_bg.png') no-repeat center bottom;}
.independent_none_con strong {display: block; margin-bottom: 15px; font-size: 22px; color: #333; line-height: 1.2em; }
.independent_none_con strong span {color: #01a4b2;}
.independent_none_con p {font-size: 17px; color: #333; line-height: 1.2em;}


/* 이용안내 */
.guide_box {position: relative; width: 100%; height: 304px; margin-bottom: 50px; background: url('../images/sub/guide_bg01.png') no-repeat center center;}
.guide_box div {position: absolute; width: 578px; height: 247px; padding: 40px; top: 28px; left: 30px; background-color: #fff; border-radius: 15px;}
.guide_box div strong {display: block; margin-bottom: 35px; font-size: 28px; color: #000; line-height: 1;}
.guide_box div p {font-size: 18px; color:#333; letter-spacing: -0.02em;}

.guide_box02 {overflow: hidden; margin-bottom: 45px;}
.guide_box02 > div {position: relative; display: inline-block; float: left; width: calc(50% - 55px);}
.guide_box02 > div:nth-child(1) {margin-right: 55px;}
.guide_box02 > div:nth-child(2) {margin-left: 55px;}
.guide_box02 > div > strong {display: block; margin-bottom: 15px; font-size: 23px; color: #000; text-align: center; line-height: 1;}
.guide_box02 > div > div {overflow: hidden; border: 1px solid #dddddd; border-radius: 10px;}
.guide_box02 > div + div::before {position: absolute; display: block; content: ""; width: 1px; height: 100%; top: 28px; left: -55px; background: #dddddd;}
.guide_box02 > div > div::before {display: block; content: ""; width: 100%; height: 211px; }
.guide_box02 > div:nth-child(1) > div::before {background: url('../images/sub/guide_bg02.png') no-repeat center center #e4eaf5;}
.guide_box02 > div:nth-child(2) > div::before {background: url('../images/sub/guide_bg03.png') no-repeat center center #f5e6dd;}
.guide_box02 > div > div > ul {margin: 20px 0 20px 40px;}
.guide_box02 > div > div > ul > li {position: relative; padding-left: 20px; font-size: 17px; line-height: 1;}
.guide_box02 > div > div > ul > li::before {position: absolute; display: block; content: ""; width: 6px; height: 6px; top: 5px; left: 0px; background-color: #1782c0;}
.guide_box02 > div > div > ul > li + li {margin-top: 15px;}

.guide_box03 {overflow: hidden; margin-bottom: 50px; padding-top: 20px;}
.guide_box03 ul {}
.guide_box03 ul li {display: inline-block; float: left; vertical-align: top;}
.guide_box03 ul li + li {margin-left: 44px;}
.guide_box03 ul li div {position: relative; width: 202px; height: 242px; border: 1px solid #dddddd; border-radius: 10px;}
.guide_box03 ul li div::before {display: block; content: ""; width: 100%; height: 122px; border-radius: 10px 10px 0 0;}
.guide_box03 ul li:nth-child(1) div::before {background: url('../images/sub/guide_icon_bg01.png') no-repeat center center #f5f5f5;}
.guide_box03 ul li:nth-child(2) div::before {background: url('../images/sub/guide_icon_bg02.png') no-repeat center center #f5f5f5;}
.guide_box03 ul li:nth-child(3) div::before {background: url('../images/sub/guide_icon_bg03.png') no-repeat center center #f5f5f5;}
.guide_box03 ul li:nth-child(4) div::before {background: url('../images/sub/guide_icon_bg04.png') no-repeat center center #f5f5f5;}
.guide_box03 ul li div span {position: absolute; width: 37px; height: 37px; margin-left: -18.5px; top: -13px; left: 50%; font-size: 20px; color: #fff; line-height: 37px; text-align: center; font-style: italic; background-color: #01a4b2; border-radius: 50%;}
.guide_box03 ul li div p {font-size: 16px; color: #333; padding: 15px 20px 0 30px; letter-spacing: -0.04em;}

.guide_box04 {overflow: hidden;}
.guide_box04 > strong {display: block; margin-bottom: 30px; font-size: 30px; color: #000; line-height: 1;}
.guide_box04 > p {font-size: 20px;}
.guide_box04 > p span {color: #006cb8;}
.guide_box04 > ul {margin-top: 50px;}
.guide_box04 > ul > li {overflow: hidden; display: block;}
.guide_box04 > ul > li + li {margin-top: 60px;}
.guide_box04 > ul > li > div.guide_img { display: inline-block; float: left; width: 338px; height: 240px; margin-right: 48px;}
.guide_box04 > ul > li > div.guide_img img {width: 100%; height: 100%;}
.guide_box04 > ul > li > div.guide_txt {overflow: hidden; width: calc(100% - 386px);}
.guide_box04 > ul > li > div.guide_txt strong {display: block; margin-bottom: 20px; font-size: 24px; color: #000; line-height: 1.2em; word-break: keep-all;}
.guide_box04 > ul > li > div.guide_txt p {margin-bottom: 35px; font-size: 16px; word-break: keep-all;}
.guide_box04 > ul > li > div.guide_txt ul {}
.guide_box04 > ul > li > div.guide_txt ul li {display: inline-block; min-width: 200px;}
.guide_box04 > ul > li > div.guide_txt ul li:nth-child(3),
.guide_box04 > ul > li > div.guide_txt ul li:nth-child(4) {margin-top: 20px;}
.guide_box04 > ul > li > div.guide_txt ul li span {padding: 2px 0 2px 50px; font-size: 18px;}
.guide_box04 > ul > li > div.guide_txt ul li span.bg01 {background: url('../images/sub/guide_icon01.png') no-repeat center left;}
.guide_box04 > ul > li > div.guide_txt ul li span.bg02 {background: url('../images/sub/guide_icon02.png') no-repeat center left;}
.guide_box04 > ul > li > div.guide_txt ul li span.bg03 {background: url('../images/sub/guide_icon03.png') no-repeat center left;}
.guide_box04 > ul > li > div.guide_txt ul li span.bg04 {background: url('../images/sub/guide_icon04.png') no-repeat center left;}
.guide_box04 > ul > li > div.guide_txt ul li span.bg05 {background: url('../images/sub/guide_icon05.png') no-repeat center left;}
.guide_box04 > ul > li > div.guide_txt ul li span.bg06 {background: url('../images/sub/guide_icon06.png') no-repeat center left;}
.guide_box04 > ul > li > div.guide_txt ul li span.bg07 {background: url('../images/sub/guide_icon07.png') no-repeat center left;}

/* 사용자안내 */
/*.user_guide_area {overflow: hidden;}*/
/*.user_guide_area > ul > li {overflow: hidden; display: inline-block; float: left; width: 292px; height: 346px; border: 1px solid #dddddd; border-radius: 15px; vertical-align: top;}*/
/*.user_guide_area > ul > li + li {margin-left: 37px;}*/
/*.user_guide_area > ul > li > div {text-align: center;}*/
/*.user_guide_area > ul > li > div::before {display: block; content: ""; width: 100%; height: 165px;}*/
/*.user_guide_area > ul > li:nth-child(1) > div::before {background: url('../images/sub/user_guide_img01.png') no-repeat center center #b2cee2;}*/
/*.user_guide_area > ul > li:nth-child(2) > div::before {background: url('../images/sub/user_guide_img02.png') no-repeat center center #bdead8;}*/
/*.user_guide_area > ul > li:nth-child(3) > div::before {background: url('../images/sub/user_guide_img03.png') no-repeat center center #7eb4c0;}*/
/*.user_guide_area > ul > li > div > strong {display: block; margin: 25px 0 20px 0; font-size: 19px; color: #000; line-height: 1;}*/
/*.user_guide_area > ul > li > div > p {font-size: 16px; color: #333;}*/
.user_guide_lists {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px;}
.user_guide_list {min-height: 346px; height: 346px; flex: 1 1 calc(25% - (14px * 3)); border: 1px solid #ddd; border-radius: 15px; overflow: hidden;}
.user_guide_list:nth-child(1) .user_guide_img {background-color: #B2CEE2;}
.user_guide_list:nth-child(2) .user_guide_img {background-color: #BDEAD8;}
.user_guide_list:nth-child(3) .user_guide_img {background-color: #7E87C0;}
.user_guide_list:nth-child(4) .user_guide_img {background-color: #7EB4C0;}
.user_guide_img {position: relative; padding-top: 164px;}
.user_guide_img>img {position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); object-fit: contain;}
.user_guide_cnt {padding: 24px 10px; text-align: center;}
.user_guide_cnt>strong {font-size: 18px; line-height: 22px;}
.user_guide_cnt>p {font-size: 16px; line-height: 19px; padding-top: 14px; word-break: keep-all;}
@media screen and (max-width: 1024px) {
 .user_guide_list {flex: 1 1 calc(50% - 14px)}
}
@media screen and (max-width: 767px) {
 .user_guide_list {flex: 1 1 100%; min-height: initial; height: 100%;}
}

/* 교육유형안내 */
.edu_info_txt_box {position: relative; overflow: hidden; width: 100%; height: 179px; margin-bottom: 50px; background: url('../images/sub/edu_info_type_txtbg.png') no-repeat center right #f5f5f5; border-radius: 20px;}
.edu_info_txt_box p {position: absolute; font-size: 25px; color: #666666; top: 50%; left: 40px; letter-spacing: -0.04em; transform: translate(0, -50%);}
.edu_info_txt_box p strong {font-weight: bold; font-size: 32px; color: #000;}

.edu_info_type_list_area {overflow: hidden; margin-bottom: 50px;}
.edu_info_type_list_area > strong {display: block; margin-bottom: 20px; font-size: 22px; color: #000;}
.edu_info_type_list_area > div {padding: 30px; background-color: #f8f8f8; border-radius: 20px;}
.edu_info_type_list_area > div > ul {}
.edu_info_type_list_area > div > ul > li {overflow: hidden;}
.edu_info_type_list_area > div > ul > li + li {margin-top: 30px;}
.edu_info_type_list_area > div > ul > li img {display: block; float: left; width: 175px; height: 105px; margin-right: 30px; vertical-align: top;}
.edu_info_type_list_area > div > ul > li > div {overflow: hidden; display: block; width: calc(100% - 205px); vertical-align: top;}
.edu_info_type_list_area > div > ul > li > div > strong {display: block; margin-top: 15px; font-size: 22px; color: #000; line-height: 1; letter-spacing: -0.04em;}
.edu_info_type_list_area > div > ul > li > div > p {margin-top: 20px; font-size: 18px; color: #666666; letter-spacing: -0.08em; word-break: keep-all;}

/* 설문 */
.question_title_area {position: relative; margin-bottom: 20px;}
.question_title_area > strong {display: block; width: 60%; font-size: 22px; color: #333; letter-spacing: -0.04em; line-height: 1.2em;}
.question_title_area ul {position: absolute; top: 2px; right: 0px;}
.question_title_area ul li {display: inline-block; font-size: 13px; }
.question_title_area ul li + li {margin-left: 10px;}
.question_title_area ul li strong {color: #333;}
.question_title_area ul li span {position: relative; color: #333;}
.question_title_area ul li strong + span {margin-left: 12px;}
.question_title_area ul li strong + span::before {position: absolute; content: ""; width: 1px; height: 10px; top: 5px; left: -7px; background-color: #cccccc;}

.question_area {position: relative; overflow: hidden; margin-bottom: 20px; border-bottom: 1px solid #dddddd;}
.question_area .q_box {overflow: hidden; position: relative; padding: 15px 25px; border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd;}
.question_area .q_box:first-child {border-top: 2px solid #000;}
.question_area .q_box.type01 {background-color: #f0f6fb;}
.question_area .q_box span.q_type {float: right; display: inline-block; margin-right: 0px; padding: 0 5px; font-size: 12px; vertical-align: middle; border-radius: 10px;}
.question_area .q_box div.q_txt_box {overflow: hidden; padding-right: 10px; font-weight: bold; font-size: 15px; color: #222; line-height: 1.2em;}
.question_area .q_box div.q_txt_box span {float: left; padding-right: 6px;}
.question_area .q_box div.q_txt_box pre {overflow: hidden; position: relative; color: #000; font-weight: 500; font-size: 15px; line-height: 1.2em; word-break: keep-all;}

.question_area .q_box.answer_o::before {position: absolute; display: inline-block; content: ""; width: 39px; height: 37px; top: 5px; left: 10px; background: url('../images/common/answer_o.png') no-repeat center center; background-size: 39px 37px;}
.question_area .q_box.answer_x::before {position: absolute; display: inline-block; content: ""; width: 39px; height: 38px; top: 5px; left: 10px; background: url('../images/common/answer_x.png') no-repeat center center;}

.question_area .q_box div.q_img {overflow: hidden; margin-top: 15px; text-align: center;}
.question_area .q_box div.q_img img {max-width: 100%;}
.question_area .q_box.type01 span.q_type {color: #fff; background-color: #2a76b7;}
.question_area .q_box.type02 {background-color: #f6f6f6;}
.question_area .q_box.type02 span.q_type {color: #666666; background-color: #d4d4d4;}
.question_area .q_box span.q_type.score {color: #78a8d1 !important; border: 1px solid #ddd !important; background-color: #fff !important;}
.question_area .q_box.sub {position: relative; padding-left: 55px; border: 1px solid #dddddd; border-radius: 10px;}
.question_area .q_box.sub::before {position: absolute; display: block; content: ""; width: 17px; height: 17px; top: 11px; left: 25px; background: url('../images/icon/icon_q_bg.png') no-repeat center center;}

.question_area .a_box {padding: 10px 25px;}
.question_area .a_box.table {padding: 0;}
.question_area .a_box ul.a_list_type01 li {overflow: hidden;}
.question_area .a_box ul.a_list_type01 li + li {margin-top: 10px;}
.question_area .a_box ul.a_list_type01 li .num_chk {float: left; margin-right: 10px;}
.question_area .a_box ul.a_list_type01 li select {float: left; margin-right: 10px;}
.question_area .a_box ul.a_list_type01 li .label_check {margin-right: 10px; vertical-align: middle;}
.question_area .a_box ul.a_list_type01 li > p {display: block; overflow: hidden;}
.question_area .a_box .a_list_type02 {position: relative; overflow: hidden; display: flex; margin: 0 40px; padding: 15px 0 30px 0;}
.question_area .a_box .a_list_type02 li {position: relative; flex: 1; padding-bottom: 40px; vertical-align: top; text-align: center;}
.question_area .a_box .a_list_type02 li > p {font-size: 14px; color: #000; line-height: 1.2em; letter-spacing: -0.04em;}
.question_area .a_box .a_list_type02 li.line {position: absolute; width: 100%; height: 3px; bottom: 50px; padding: 0px; left: 0px; background-color: #006cb8; z-index: 10;}
.question_area .a_box .a_list_type02 li.line div {position: relative;}
.question_area .a_box .a_list_type02 li.line div::before {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; left: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_left.png') no-repeat center center;}
.question_area .a_box .a_list_type02 li.line div::after {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; right: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_right.png') no-repeat center center;}
.question_area .a_box .a_list_type02 li > .num_chk {position: absolute; left: 50%; bottom: -15px; margin-left: -9.5px;}
.question_area .a_box ul li.answer_chk::after {display: inline-block; content: "(정답)"; color: #22c1ce; vertical-align: middle;}
.question_area .a_box.table {padding: 10px;}
.question_area .a_box.table .table_area  {padding: 0px; box-shadow: 0 0 0 1px #dedfdf; border-radius: 10px;}
.question_area .a_box.table .table_area table.list {border: 0px;}
.question_area .a_box.table .table_area table.list thead th {padding: 9px 5px;}
.question_area .a_box.table .table_area table.list tbody td {padding: 8px 5px;}
.question_area .a_box.table .table_area table.list tbody tr:nth-child(even) td {background-color: #fafafa;}
.question_area .a_box.table .table_area table.list tbody tr:last-child td {border-bottom: 0px;}
.question_area .a_box .ex_box {margin-top: 10px; padding: 10px; border: 1px solid #dddddd; border-radius: 5px; background-color: #fff;}
.question_area .a_box .ex_box span {display: inline-block; padding: 0px 15px 0 30px; font-size: 14px; color: #fff; background: url('../images/icon/icon_answer_bg.png') no-repeat center left 10px; background-color: #78a8d1; border-radius: 50px;}

.question_area .a_box ul.textarea_list_area {overflow: hidden;}
.question_area .a_box ul.textarea_list_area li {font-size: 0px;}
.question_area .a_box ul.textarea_list_area li + li {margin-top: 10px; padding-top: 10px; border-top: 1px solid #ddd;}
.question_area .a_box ul.textarea_list_area li span {display: inline-block; width: 20%; padding: 0 10px; font-size: 15px; vertical-align: middle; word-break: keep-all;}
.question_area .a_box ul.textarea_list_area li textarea {width: 80%; vertical-align: middle;}

.question_area .time_area {display: inline-block; width: 79px; height: 121px; padding: 0 15px; font-size: 13px; color:#333; text-align: center; border: 1px solid #dddddd; border-radius: 10px; background: #fff; z-index: 100;}
.question_area .time_area::before {display: inline-block; content: ""; width: 37px; height: 37px; margin-top: 10px; background: url('../images/common/time_bg.png') no-repeat center center;}
.question_area .time_area strong {display: block; margin-top: 10px; padding-top: 10px; letter-spacing: -0.04em; border-top: 1px solid #ddd;}

/* 설문 타입1 */
.question_area.type_green {border-top: 2px solid #000000; border-bottom: 0px;}
.question_area.type_green .q_con {margin-top: 20px; padding: 22px; border: 1px solid #dddddd; border-radius: 10px;}
.question_area.type_green .q_con .q_box {overflow: inherit;}
.question_area.type_green .q_con .q_box.type01 {padding: 0px; border: 0px; background: none;}
.question_area.type_green .q_con .q_box.type01 span.q_type {margin-right: -22px; padding: 3px 20px; background-color: #008272; border-radius: 50px 0 0 50px;}
.question_area.type_green .q_con .q_box.type02 {padding: 0px; border: 0px; background: none;}
.question_area.type_green .q_con .q_box.type02 span.q_type {margin-right: -22px; padding: 3px 20px; border-radius: 50px 0 0 50px;}
.question_area.type_green .q_con .q_box div.q_txt_box {min-height: 27px; line-height: 1.2em;}
.question_area.type_green .q_con .q_box div.q_txt_box span {float: left; position: relative; padding-right: 16px; color: #008272;}
.question_area.type_green .q_con .q_box div.q_txt_box span::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 10px; top: 6px; right: 5px; background-color: #cccccc;}
.question_area.type_green .q_con .q_box div.q_txt_box pre {overflow: hidden; color: #000; font-weight: 500; font-size: 15px; line-height: 1.2em;}
.question_area.type_green .q_con .q_box div.q_img {margin-top: 20px;}
.question_area.type_green .q_con .q_box.sub {padding-left: 25px;}
.question_area.type_green .q_con .q_box.sub::before {top: 4px; left: 0px;}
.question_area.type_green .q_con .a_box {padding: 20px 0px 0px 0px;}
.question_area.type_green .q_con .a_box ul.a_list_type01.radio_list {}
.question_area.type_green .q_con .a_box ul.a_list_type01.radio_list li {padding: 5px 20px; background-color: #f1f1f1; border-radius: 5px;}
.question_area.type_green .q_con .a_box ul.a_list_type01.radio_list li.active {background-color: #dbf0ed;}
.question_area.type_green .num_chk input[type='radio'] + span {background-color: #c4c4c4;}
.question_area.type_green .num_chk input[type='radio']:checked + span {color:#fff; background-color: #008272;}
.question_area.type_green .a_box .a_list_type02 li.line {background-color: #008272;}
.question_area.type_green .a_box .a_list_type02 li.line div::before {background:url('../images/common/line_arrow_left_g.png') no-repeat center center;}
.question_area.type_green .a_box .a_list_type02 li.line div::after {background:url('../images/common/line_arrow_right_g.png') no-repeat center center;}
.question_area.type_green .a_box.table .table_area table.list thead th {background-color: #e5f4f2;}
.question_area.type_green .q_box.answer_o::before {position: absolute; display: inline-block; content: ""; width: 39px; height: 37px; top: -5px; left: -10px; background: url('../images/common/answer_o.png') no-repeat center center; background-size: 39px 37px;}
.question_area.type_green .q_box.answer_x::before {position: absolute; display: inline-block; content: ""; width: 39px; height: 38px; top: -5px; left: -10px; background: url('../images/common/answer_x.png') no-repeat center center;}

/* 설문 타입2 */
.question_area.type_red {border-top: 2px solid #000000; border-bottom: 0px;}
.question_area.type_red .q_con {margin-top: 35px; padding: 0px; border: 0px;}
.question_area.type_red .q_con .q_box {overflow: inherit; margin-bottom: 20px;}
.question_area.type_red .q_con .q_box.type01 {padding: 0px; border: 0px; background: none;}
.question_area.type_red .q_con .q_box.type01 span.q_type {margin-right: 0px; padding: 3px 20px; background-color: #e3888c; border-radius: 5px;}
.question_area.type_red .q_con .q_box.type02 {padding: 0px; border: 0px; background: none;}
.question_area.type_red .q_con .q_box.type02 span.q_type {margin-right: 0px; padding: 3px 20px; border-radius: 5px;}
.question_area.type_red .q_con .q_box div.q_txt_box {padding-left: 10px; min-height: 27px; line-height: 1.2em;}
.question_area.type_red .q_con .q_box div.q_txt_box span {float: left; position: relative; padding-right: 6px; color: #e3888c;}
.question_area.type_red .q_con .q_box div.q_txt_box span::before {content: none;}
.question_area.type_red .q_con .q_box div.q_txt_box pre {overflow: hidden; color: #000; font-weight: 500; font-size: 15px; line-height: 1.2em;}

.question_area.type_red .q_con .q_box div.q_img {margin-top: 15px;}
.question_area.type_red .q_con .q_box.sub {padding-left: 25px;}
.question_area.type_red .q_con .q_box.sub::before {top: -2px; left: 0px;}
.question_area.type_red .q_con .a_box {padding: 20px; background-color: #f5f5f5; border-radius: 5px;}
.question_area.type_red .q_con .a_box ul.a_list_type01.radio_list {}
.question_area.type_red .q_con .a_box ul.a_list_type01.radio_list li {padding: 5px 20px;}
.question_area.type_red .q_con .a_box ul.a_list_type01.radio_list li.active {background-color: #ffffff;}
.question_area.type_red .num_chk input[type='radio'] + span {background-color: #c4c4c4;}
.question_area.type_red .num_chk input[type='radio']:checked + span {color:#fff; background-color: #e3888c; border: 1px solid #e3888c;}
.question_area.type_red .a_box .a_list_type02 li.line {background-color: #e3888c;}
.question_area.type_red .a_box .a_list_type02 li.line div::before {background:url('../images/common/line_arrow_left_r.png') no-repeat center center;}
.question_area.type_red .a_box .a_list_type02 li.line div::after {background:url('../images/common/line_arrow_right_r.png') no-repeat center center;}
.question_area.type_red .a_box .label_check input.chk:checked {border: 1px solid #e3888c; background: url('../images/icon/check_chk_r.png') no-repeat center center #fff;}
.question_area.type_red .a_box .label_radio input.radio:checked {border: 1px solid #e3888c; background: url('../images/icon/check_radio_r.png') no-repeat center center #fff;}
.question_area.type_red .a_box.table .table_area table.list thead th {background-color: #f9e7e8;}
.question_area.type_red .q_box.answer_o::before {position: absolute; display: inline-block; content: ""; width: 39px; height: 37px; top: -10px; left: 0px; background: url('../images/common/answer_o.png') no-repeat center center; background-size: 39px 37px;}
.question_area.type_red .q_box.answer_x::before {position: absolute; display: inline-block; content: ""; width: 39px; height: 38px; top: -10px; left: 0px; background: url('../images/common/answer_x.png') no-repeat center center;}

/* 기관안내 */
.introduce_area {overflow: hidden; margin-bottom: 35px; font-size: 0px;}
.introduce_area div {overflow: hidden; position: relative; display: inline-block; width: 440px; height: 140px; padding: 25px 0 25px 150px; background-color: #f0f3f5; border-radius: 100px;}
.introduce_area div + div {margin-left: 70px;}
.introduce_area div:nth-child(1)::before {position: absolute; display: inline-block; content: ""; width: 108px; height: 108px; top: 17px; left: 20px; background: url('../images/sub/introduce_bg01.png') no-repeat center center #01a4b2; border-radius: 50%;}
.introduce_area div:nth-child(2)::before {position: absolute; display: inline-block; content: ""; width: 108px; height: 108px; top: 17px; left: 20px; background: url('../images/sub/introduce_bg02.png') no-repeat center center #3b5990; border-radius: 50%;}
.introduce_area div span {display: block; margin-bottom: 3px; font-size: 21px; color: #333;}
.introduce_area div p {font-size: 18px; color: #666666; word-break: keep-all; letter-spacing: -0.06em; line-height: 1.3em; word-break: keep-all;}

.introduce_area02 .introduce_box {overflow: hidden; margin-bottom: 30px; padding: 30px 120px 30px 30px; border: 6px solid #e6eaed; border-radius: 10px; background: url('../images/sub/introduce_bg03.png') no-repeat center right 0px #f9f9f9;}
.introduce_area02 .introduce_box strong {font-size: 25px; color: #018f9b; letter-spacing: -0.04em; line-height: 1;}
.introduce_area02 .introduce_box strong + p {margin-top: 20px;}
.introduce_area02 .introduce_box p {font-size: 18px; color: #000; letter-spacing: -0.04em; line-height: 1.6em; word-break: keep-all;}
.introduce_area02 .introduce_list_box {margin-bottom: 20px;}
.introduce_area02 .introduce_list_box ul {font-size: 0px; text-align: center;}
.introduce_area02 .introduce_list_box ul li {display: inline-block; width: 290px; vertical-align: top;}
.introduce_area02 .introduce_list_box ul li + li {margin-left: 40px;}
.introduce_area02 .introduce_list_box ul li div {width: 290px; height: 200px; margin-bottom: 15px;}
.introduce_area02 .introduce_list_box ul li div img {width: 100%; margin-bottom: 15px;}
.introduce_area02 .introduce_list_box ul li p {font-size: 17px; color: #000; letter-spacing: -0.04em; line-height: 1.4em; word-break: keep-all;}

.rb_area {overflow: hidden; padding: 20px 50px; font-size: 0px; border: 2px solid #ededed; border-radius: 10px; background-color: #f8f8f8;}
.rb_area > span {position: relative; display: block; float: left; width: 215px; padding-left: 70px; font-size: 15px;}
.rb_area > span::before {position: absolute; display: block; content: ""; width: 45px; height: 45px; top: -12px; left: 0px; background: url('../images/sub/rb_bg01.png') no-repeat center center;}
.rb_area > ul {position: relative; display: flex; width: calc(100% - 215px); padding-left: 45px;}
.rb_area > ul::before {position: absolute; display: block; content: ""; width: 1px; height: 40px; top: -9px; left: 0px; background: #ddd; }
.rb_area > ul > li {font-size: 14px; flex: 1 1 1px;}
.rb_area > ul > li > strong {color: #000;}
.rb_area > ul > li > span {color: #999;}
.rb_area > ul > li > strong + span {position: relative; padding-left: 25px;}
.rb_area > ul > li > strong + span::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 10px; top: 6px; left: 10px; background-color: #999;}

/* 복지개발원 소개 */
.con_txt_box_area {overflow: hidden;}
.con_txt_box_area .con_txt_box {margin-bottom: 30px; padding: 30px 50px; border: 1px solid #ddd; border-radius: 10px; background-color: #f8f8f8;}
.con_txt_box_area .con_txt_box > strong {display: block; float: left; width: 80px; padding-bottom: 85px; font-size: 19px; font-weight: bold; color: #333; text-align: center;}
.con_txt_box_area .con_txt_box.type01 > strong {background: url('../images/sub/con_txt_box_bg01.png') no-repeat center bottom;}
.con_txt_box_area .con_txt_box.type02 > strong {background: url('../images/sub/con_txt_box_bg02.png') no-repeat center bottom;}
.con_txt_box_area .con_txt_box.type03 > strong {background: url('../images/sub/con_txt_box_bg03.png') no-repeat center bottom;}
.con_txt_box_area .con_txt_box.type04 > strong {background: url('../images/sub/con_txt_box_bg04.png') no-repeat center bottom;}
.con_txt_box_area .con_txt_box > div {overflow: hidden; padding: 0 0 0 50px;}
.con_txt_box_area .con_txt_box > div > strong {font-size: 20px; font-weight: bold; line-height: 1.4em; word-break: keep-all;}
.con_txt_box_area .con_txt_box.type01 > div > strong {color: #006cb8;}
.con_txt_box_area .con_txt_box.type02 > div > strong {color: #018f9b;}
.con_txt_box_area .con_txt_box.type03 > div > strong {color: #7353a5;}
.con_txt_box_area .con_txt_box.type04 > div > strong {color: #b97a01;}
.con_txt_box_area .con_txt_box > div > ul {margin-top: 25px;}
.con_txt_box_area .con_txt_box > div > ul > li {position: relative; padding-left: 10px; font-size: 15px; color: #333; line-height: 1.4em; letter-spacing: -0.04em;}
.con_txt_box_area .con_txt_box > div > ul > li + li {margin-top: 15px;}
.con_txt_box_area .con_txt_box > div > ul > li::before {position: absolute; display: block; content: ""; width: 3px; height: 3px; top: 7px; left: 0px; background-color: #393f71;}

.position_guide_area {overflow: hidden;}
.position_guide_area div.map {width: 100%; height: 320px; margin-bottom: 30px; border-radius: 10px;}
.position_guide_area div.map img {width: 100%; height: 100%;}
.public_transit_list {overflow: hidden; display: flex;}
.public_transit_list li {width: 296px;}
.public_transit_list li + li {margin-left: 30px;}
.public_transit_list li div {height: 100%; padding: 35px 20px; text-align: center; border: 1px solid #ddd; border-radius: 10px; background-color: #f8f8f8;}
.public_transit_list li div strong {display: block; margin-bottom: 20px; padding-bottom: 90px; font-size: 20px; color: #333;}
.public_transit_list li div p {font-size: 15px; font-weight: bold; word-break: keep-all; letter-spacing: -0.04em;}
.public_transit_list li:nth-child(1) div strong {background:url('../images/sub/transit_bg01.png') no-repeat center bottom;}
.public_transit_list li:nth-child(2) div strong {background:url('../images/sub/transit_bg02.png') no-repeat center bottom;}
.public_transit_list li:nth-child(3) div strong {background:url('../images/sub/transit_bg03.png') no-repeat center bottom;}
.public_transit_list li:nth-child(1) div p {color: #006cb8;}
.public_transit_list li:nth-child(2) div p {color: #018f9b;}
.public_transit_list li:nth-child(3) div p {color: #7353a5;}

.val_area {margin: 80px 0 30px 0;}
.val_area ul {display: flex; flex-direction: column; align-items: flex-end;}
.val_area ul li {position: relative; height: 37px; border-radius: 10px 0 0 0;}
.val_area ul li strong {position: absolute; padding-bottom: 48px; top: -70px; font-size: 22px; letter-spacing: -0.04em; line-height: 1; text-align: center;}
.val_area ul li strong span {font-size: 16px;}
.val_area ul li p {padding: 7px 0 0 40px; font-size: 16px; color: #fff;}
.val_area ul li:nth-child(1) {width: 20%; background-color: #fe4646; border-radius: 10px 10px 0 0;}
.val_area ul li:nth-child(1) strong {width: 100%; color:#fe4646; background: url('../images/sub/val_bg01.png') no-repeat center bottom;}
.val_area ul li:nth-child(1) p {padding-left: 0px; text-align: center;}
.val_area ul li:nth-child(2) {width: 40%; background-color: #b97a01;}
.val_area ul li:nth-child(2) strong {width: 50%; color:#b97a01; background: url('../images/sub/val_bg02.png') no-repeat center bottom;}
.val_area ul li:nth-child(3) {width: 60%; background-color: #0f5f40;}
.val_area ul li:nth-child(3) strong {width: 33.3333%; color:#0f5f40; background: url('../images/sub/val_bg03.png') no-repeat center bottom;}
.val_area ul li:nth-child(4) {width: 80%; background-color: #01a4b2;}
.val_area ul li:nth-child(4) strong {width: 25%; color:#01a4b2; background: url('../images/sub/val_bg04.png') no-repeat center bottom;}
.val_area ul li:nth-child(5) {width: 100%; background-color: #006582; border-radius: 10px 0 10px 10px;}
.val_area ul li:nth-child(5) strong {width: 20%; color:#006582; background: url('../images/sub/val_bg05.png') no-repeat center bottom;}

/* 교육체계 */
.eduSys_h {overflow: hidden; margin-bottom: 30px;}
.eduSys_h ul.left {display: inline-block;}
.eduSys_h ul.left li {display: inline-block;}
.eduSys_h ul.left li + li {margin-left: 50px;}
.eduSys_h ul.left li i {display: inline-block; width: 30px; height: 30px; text-indent: -9999px; border-radius: 50%; vertical-align: middle;}
.eduSys_h ul.left li i.eduType01 {border: 3px solid #fdd99b; background: url('../images/sub/edu_type_bg01.png') no-repeat center center;}
.eduSys_h ul.left li i.eduType02 {border: 3px solid #91e0e7; background: url('../images/sub/edu_type_bg02.png') no-repeat center center;}
.eduSys_h ul.left li span {font-size: 15px; color: #000; vertical-align: middle; letter-spacing: -0.04em;}

.eduSys_h ul.right {float: right; font-size: 0px;}
.eduSys_h ul.right li {display: inline-block;}
.eduSys_h ul.right li + li {padding-left: 50px; background: url('../images/icon/icon_arrow03.png') no-repeat center left 10px;}
.eduSys_h ul.right li span {display: block; height: 35px; padding: 0 20px; line-height: 35px; font-size: 14px; color: #fff; text-align: center; border-radius: 50px;}
.eduSys_h ul.right li:nth-child(1) span {background-color: #007b54;}
.eduSys_h ul.right li:nth-child(2) span {background-color: #339d33;}

/*ul.eduSys_list {display: flex;}*/
/*ul.eduSys_list li {flex: 1 1 1px; flex-basis: auto; flex-grow: 0; width: 33.33%;}*/
/*ul.eduSys_list li + li {padding-left: 40px;}*/
/*ul.eduSys_list li span {display: block; height: 100%; padding: 5px 15px; font-size: 14px; color: #000; word-break: keep-all; border-radius: 10px; background: #fff;}*/
/*ul.eduSys_list li span.bg01 {padding-left: 40px; background: url('../images/sub/edu_type_bg01.png') no-repeat center left 15px #fff;}*/
/*ul.eduSys_list li span.bg02 {padding-left: 40px; background: url('../images/sub/edu_type_bg02.png') no-repeat center left 15px #fff;}*/
/*ul.eduSys_list.color01 li span {border: 2px solid #c2dcee; }*/
/*ul.eduSys_list.color02 li span {border: 2px solid #c3dbdd; }*/
/*ul.eduSys_list.color03 li span {border: 2px solid #e7dac5; }*/
/*ul.eduSys_list.color04 li span {border: 2px solid #b0dbbf; }*/
/*ul.eduSys_list.type02 li + li {padding-left: 70px; background: url('../images/icon/icon_arrow03.png') no-repeat center left 19px;}*/
/*ul.eduSys_list + ul.eduSys_list {margin-top: 15px;}*/

/* st 20240807 수정 */
ul.eduSys_list {display: flex;}
ul.eduSys_list li {flex: 1 1 1px; flex-basis: auto; flex-grow: 0; width: 33.33%;}
ul.eduSys_list li + li {padding-left: 40px;}
ul.eduSys_list li span {display: block; height: 100%; padding: 5px 15px; font-size: 14px; color: #000; word-break: keep-all; border-radius: 10px; background: #fff;}
ul.eduSys_list li span.bg01 {padding-left: 40px; background: url('/common/images/sub/edu_type_bg01.png') no-repeat center left 15px #fff;}
ul.eduSys_list li span.bg02 {padding-left: 40px; background: url('/common/images/sub/edu_type_bg02.png') no-repeat center left 15px #fff;}
ul.eduSys_list.color01 li span, .eduSys_item.color01 {border: 2px solid #c2dcee;}
ul.eduSys_list.color02 li span, .eduSys_item.color02 {border: 2px solid #c3dbdd;}
ul.eduSys_list.color03 li span, .eduSys_item.color03 {border: 2px solid #e7dac5;}
ul.eduSys_list.color04 li span, .eduSys_item.color04 {border: 2px solid #b0dbbf;}
ul.eduSys_list.type02 li + li {padding-left: 70px; background: url('/common/images/icon/icon_arrow03.png') no-repeat center left 19px;}
ul.eduSys_list + ul.eduSys_list {margin-top: 15px;}

.eduSys_item-wrap {display: flex; align-items: stretch; gap: 10px;}
.eduSys_item-wrap .right {display: flex; flex-direction: column; gap: 10px; width: 100%;}
.eduSys_items {display: flex; align-items: stretch; gap: 20px;}
.eduSys_items.col {display: flex; flex-direction: column; gap: 10px;}
.eduSys_items:has(.arow_next) {gap: 60px;}
.eduSys_items>li {flex: 1 1 100%;}
.eduSys_item {position: relative; display: flex; justify-content: center; align-items: center; height: 100%; padding: 5px 15px; border-radius: 10px; background-color: #fff;}
.eduSys_item>p {text-align: center; font-size: 14px; color: #000; word-break: keep-all; }
.border_dashed {border-bottom-style: dashed !important;}
.chip {z-index: 1; top: -15px; right: -18px; position: absolute; padding: 2px 5px; font-size: 12px; color: #fff; background-color: #2d69aa; font-weight: 600;}
.chip_new {background-color: #fe4646;}
.arow_next {position: relative;}
.arow_next::after {top: 50%; transform: translateY(-50%); right: calc((-60px - 33px)/2); position: absolute; height: 20px; width: 33px; display: block; content: ''; background-image: url('/common/images/icon/icon_arrow03.png');}
.arrow_diagonal {position: relative;}
.arrow_diagonal::after {left: -44px; bottom: -25px; transform: rotate(145deg); position: absolute; height: 20px; width: 33px; display: block; content: ''; background-image: url('/common/images/icon/icon_arrow03.png');}
.icon_zoom,
.icon_blend {/*justify-content: flex-start;*/ padding-left: 30px;}
.icon_zoom::before,
.icon_blend::before {top: 50%; left: 8px; transform: translateY(-50%); position: absolute; width: 14px; height: 18px; content: ''; display: block; background-image: url('/common/images/sub/edu_type_bg01.png');}
.icon_blend::before {background-image: url('/common/images/sub/edu_type_bg02.png');}
.icon_zoom>p, .icon_blend>p {/*text-align: left;*/}
@media screen and (max-width: 1024px) {
 .eduSys_item-wrap {flex-direction: column;}
 .chip {right: 0;}
}
@media screen and (max-width: 767px) {
 .eduSys_items {flex-direction: column; gap: 20px;}
 .eduSys_items:has(.arow_next),.eduSys_item-wrap .right {gap: 20px;}
 .eduSys_item {justify-content: flex-start;}
 .arrow_diagonal::after {display: none;}
}
/* ed 20240807 수정 */

/* 사이트맵 */
.sitemap_area {overflow: hidden;}
.sitemap_area a {word-break: keep-all;}
.sitemap_area > ul {display: flex; flex-wrap: wrap; justify-content: space-between;}
.sitemap_area > ul > li {width: 225px; height: 100%; margin-bottom: 40px;}
.sitemap_area > ul > li > strong {display: block; height: 50px; color: #fff; font-weight: normal; font-size: 16px;  line-height: 50px; text-align: center; background-color: #0e3c5d; border-radius: 5px;}
.sitemap_area > ul > li > ul {margin-top: 15px;}
.sitemap_area > ul > li > ul > li + li {margin-top: 25px;}
.sitemap_area > ul > li > ul > li > a {position: relative; display: block; padding-left: 15px;}
.sitemap_area > ul > li > ul > li > a::before {position: absolute; display: block; content: ""; width: 5px; height: 5px; top: 10px; left: 0px; border-radius: 50%; background-color: #6d889c;}
.sitemap_area > ul > li > ul > li > a > span {font-size: 16px; color: #333333; letter-spacing: -0.04em;}
.sitemap_area > ul > li > ul > li > ul {margin: 10px 0 30px 0; padding: 17px; border: 1px solid #dddddd; border-radius: 5px; background-color: #f4f4f4;}
.sitemap_area > ul > li > ul > li:last-child > ul {margin-bottom: 0px;}
.sitemap_area > ul > li > ul > li > ul > li + li {margin-top: 10px;}
.sitemap_area > ul > li > ul > li > ul > li > a {font-size: 15px; color: #888888; letter-spacing: -0.04em;}
.sitemap_area > ul > li > ul > li > ul > li > a:hover {color: #333;}

/* 동영상영역 */
.player_area {overflow: hidden; display: inline-block; width: 715px; float: left; margin-right: 17px; transition: all ease 1s 0s;}
.player_area.fold {width: 100%; margin-right: 0px;}
.player_area .player_wrap .youtube_area {margin-bottom: 15px;}
.player_area .player_wrap .youtube_area video {display: block; width: 100%; height: 100%;}
.player_area .player_wrap .youtube_area a.side_fold_btn {display: none;}
.player_area.fold .player_wrap .youtube_area a.side_fold_btn {position: absolute; display: inline-block; width: 67px; height: 34px; top: 10px; right: 10px; color: #fff; font-size: 15px; line-height: 34px; text-align: center; border-radius: 5px; background: #01a4b2;}
.player_area .player_info_area .player_tit_area {padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #dddddd;}
.player_area .player_info_area .player_tit_area > strong {display: block; margin-bottom: 15px; font-size: 22px; color: #000; line-height: 1.2em;}
.player_area .player_info_area .player_tit_area span {display: block; color: #666666;}
.player_area .player_info_area .player_tit_area span strong {font-weight: bold;}

.side_menu_area {position: absolute; display: inline-block; width: 218px; right: 0px; transform: translate(0,0); transition: all ease 1s 0s;}
.side_menu_area.fold {transform: translate(218px,0);}
.side_menu_area > div.inner {height: 553px; border: 1px solid #dddddd; border-radius: 5px;}
.side_menu_area > div.inner > ul.side_menu_tab {height:35px; font-size: 0px;}
.side_menu_area > div.inner > ul.side_menu_tab li {display: inline-block; float: left; width: 33.3333%; background: #1a3552;}
.side_menu_area > div.inner > ul.side_menu_tab li + li {border-left: 1px solid #506479;}
.side_menu_area > div.inner > ul.side_menu_tab li a {display: block; height: 35px; font-size: 13px; line-height: 35px; text-align: center; color: #fff; opacity: 0.6;}
.side_menu_area > div.inner > ul.side_menu_tab li.active {background: #2f5780;}
.side_menu_area > div.inner > ul.side_menu_tab li.active a {opacity: 1;}
.side_menu_area > a.side_btn {position: absolute; display: block; width: 19px; padding: 10px 0; bottom: 75px; left: -19px; font-size: 12px; color: #fff; text-align: center; background: #7f7f7f; border-radius: 5px 0 0 5px;}

.side_menu_area > div.inner > div.side_list_box {overflow-y: scroll; height: 522px; background: #f5f5f5;}
.side_menu_area > div.inner > div.side_list_box.bg01 {background-color: #e4e5e7;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li {padding: 10px 12px; border-bottom: 1px solid #ddd;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li:last-child {border-bottom: 0px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li.active {background: #fff;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li:hover {background: #fff;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > span {display: inline-block; margin-bottom: 15px; padding: 2px 6px; font-size: 10px; color: #fff; font-weight: bold; border-radius: 50px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > span.red {background: #e16c48;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > span.blue {background: #01a4b2;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > a {display: block; font-size: 13px; color: #222; line-height: 1.2em;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > a::after {display: inline-block; content: ""; width: 13px; height: 13px; margin-left: 5px; background: url('../images/icon/icon_play02.png') no-repeat center center; vertical-align: middle;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li.active > a::after {background: url('../images/icon/icon_play.png') no-repeat center center;}

.side_menu_area > div.inner > div.side_list_box > div > ul.type02 {border-top: 1px solid #dddddd;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li {position: relative; display: flex; font-size: 0px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li a {display: flex; width: 100%; color: #333333;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li:first-child {background-color: #f5f5f5;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li:first-child div + div {border-left: 1px solid #dddddd;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li:first-child div {text-align: center;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li:first-child div.left {text-align: left;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li:last-child {border-bottom: 1px solid #fff;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li + li {border-top: 1px solid #fff;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li:nth-child(1) + li:nth-child(2) {border-top: 1px solid #ddd;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div {overflow: hidden; position: relative; display: inline-block; padding: 9px 2px; font-size: 12px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div + div {border-left: 1px solid #fff;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div.time {width: 58px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div.info {width: calc(100% - 58px);}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div span {display: block; text-align: center;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div span + span {position: relative; padding-top: 10px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div span + span::before {position: absolute; display: block; width: 100%; top: -4px; content: "~"; text-align: center;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div p {position: absolute; width: 130px; top: 50%; left: 2px; font-size: 13px; transform: translate(0px, -50%);}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div input[type='text'] {width: 100%; height: 29px; font-size: 12px; border: 1px solid #dddddd; text-indent: 3px; line-height: 27px; border-radius: 2px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div input[type='text']::placeholder {font-size: 12px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area {position: absolute; display: inline-block; width: auto; padding: 0px; top: 8px; right: 5px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a {display: inline-block; width: 28px; height: 19px; font-size: 11px; color: #fff; border-radius: 5px; line-height: 19px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a + a {border-left: 5px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a.add {background-color: #cc8600;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a.modi {background-color: #ec5f5b;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a.cancel {background-color: #ec5f5b;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a.save {background-color: #009fad;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li a.row_del_btn {position: absolute; display: inline-block; width: 13px !important; height: 13px; top: 4px; right: 0px; background: url('../images/icon/icon_delete_bg.png') no-repeat center center #f35858; font-size: 0px; border-radius: 50%;}

.side_menu_area > div.inner > div.side_list_box > .side_con {display: none;}
.side_menu_area > div.inner > div.side_list_box > .side_con.active {display: block;}
.side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt {padding: 10px; background-color: #fff;}
.side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt p {font-size: 13px; color: #222; word-break: keep-all; letter-spacing: -0.04em;}

/* 외부교육관리 */
.label_list {display: flex !important; flex-direction: row; flex-wrap: wrap;}
.label_list li {margin: 1px 5px;}
.time_com_area {overflow: hidden; display: block; width: 100%;}
.time_com_area input[type='text'] {width: calc(100% - 139px); vertical-align: middle; background-color: #ddd;}
.time_com_area input[type='text'] + a {margin-left: 5px;}
.time_com_area a {vertical-align: middle;}
.pop_h_con01 {overflow: hidden;}
.pop_h_con01 label {font-size: 15px; vertical-align: middle;}
.pop_h_con01 label + input[type='text'] {margin-left: 10px;}
.pop_h_con01 input[type='text'] + label.label_check {font-size: 0px; margin-left: 10px;}

.fc .fc-col-header-cell-cushion  {color: #888 !important;}

/* 맛보기 동영상영역 */
.smp_player_area {overflow: hidden; display: inline-block; width: 75%; max-width:1000px; float: left; margin-right: 17px; transition: all ease 1s 0s;}
.smp_player_area .player_wrap .youtube_area {margin: 0 0 15px 10px;}
.smp_player_area .player_wrap .youtube_area video {display: block; width: 100%; height: 100%;}
.smp_player_area .player_wrap .youtube_area a.side_fold_btn {display: none;}
.smp_player_area .player_info_area .player_tit_area { margin: 0 0 20px 20px; }
.smp_player_area .player_info_area .player_tit_area > strong {margin-bottom: 15px; font-size: 22px; color: #000; line-height: 1.2em;}
.smp_player_area .player_info_area .player_tit_area span strong {font-weight: bold;}

.smp_side_menu_area {position: absolute; display: inline-block; width:22%; max-width: 250px; right: 0px; transform: translate(0,0); transition: all ease 1s 0s;}
.smp_side_menu_area.fold {transform: translate(218px,0);}
.smp_side_menu_area > div.inner {height: 100%; border: 1px solid #dddddd; border-radius: 5px;}
.smp_side_menu_area > div.inner > ul.side_menu_tab {height:35px; font-size: 0px;}
.smp_side_menu_area > div.inner > ul.side_menu_tab li {display: inline-block; float: left; width: 33.3333%; background: #1a3552;}
.smp_side_menu_area > div.inner > ul.side_menu_tab li + li {border-left: 1px solid #506479;}
.smp_side_menu_area > div.inner > ul.side_menu_tab li a {display: block; height: 35px; font-size: 13px; line-height: 35px; text-align: center; color: #fff; opacity: 0.6;}
.smp_side_menu_area > div.inner > ul.side_menu_tab li.active {background: #2f5780;}
.smp_side_menu_area > div.inner > ul.side_menu_tab li.active a {opacity: 1;}
.smp_side_menu_area > a.side_btn {position: absolute; display: block; width: 19px; padding: 10px 0; bottom: 75px; left: -19px; font-size: 12px; color: #fff; text-align: center; background: #7f7f7f; border-radius: 5px 0 0 5px;}

.smp_side_menu_area > div.inner > div.side_list_box {overflow-y: scroll; height: 412px; background: #f5f5f5;}
.smp_side_menu_area > div.inner > div.side_list_box.bg01 {background-color: #e4e5e7;}
.smp_side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li {padding: 10px 12px; border-bottom: 1px solid #ddd;}
.smp_side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li:last-child {border-bottom: 0px;}
.smp_side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li.active {background: #fff;}
.smp_side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li:hover {background: #fff;}
.smp_side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > span {display: inline-block; margin-bottom: 15px; padding: 2px 6px; font-size: 10px; color: #fff; font-weight: bold; border-radius: 50px;}
.smp_side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > span.red {background: #e16c48;}
.smp_side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > span.blue {background: #01a4b2;}
.smp_side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > a {display: block; font-size: 13px; color: #222; line-height: 1.2em;}
.smp_side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > a::after {display: inline-block; content: ""; width: 13px; height: 13px; margin-left: 5px; background: url('../images/icon/icon_play02.png') no-repeat center center; vertical-align: middle;}
.smp_side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li.active > a::after {background: url('../images/icon/icon_play.png') no-repeat center center;}

.smp_side_menu_area > div.inner > div.side_list_box > .side_con {display: none;}
.smp_side_menu_area > div.inner > div.side_list_box > .side_con.active {display: block;}
.smp_side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt {padding: 10px; background-color: #fff;}
.smp_side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt p {font-size: 13px; color: #222; word-break: keep-all; letter-spacing: -0.04em;}



/* 테블릿 640치수에 1.5나눈다 */
@media only screen and (max-width: 1024px) {

/* 서브페이지 텝메뉴 */
.tab_area {position: relative; margin-bottom: 27px;}
.tab_area a.m_slect {display: block; height: 37px; padding: 0 25px; font-size: 19px; text-align: center; color: #000; border:2px solid #b0d1e9; line-height: 35px; border-radius: 20px; background: url('../images/common/m_menu_arrow_down.png') no-repeat center right 16px #fff; background-size: 11px 7px;}
.tab_area a.m_slect.active {border-radius: 20px 20px 0 0; border-bottom: 0px; background: url('../images/common/m_menu_arrow_up.png') no-repeat center right 16px #e9f3f6; background-size: 11px 7px;}
.tab_area ul {display: none; border: 1px solid #ddd; border-left: 2px solid #b0d1e9; border-right: 2px solid #b0d1e9; border-bottom: 2px solid #b0d1e9; border-radius: 0 0 20px 20px;}
.tab_area ul.active {display: block;}
.tab_area ul li {float: none; flex: none; width:100%; max-width:100%; border: 0px; border-bottom: 1px solid #ddd !important; border-radius: 10px 10px 0 0;}
.tab_area ul li:last-child {border-bottom: 0px !important;}
.tab_area ul li + li {margin-left: 0px;}
.tab_area ul li a {display: block; height: auto; padding: 10px 0; font-size: 19px; color: #000; text-align: center; line-height: normal;}
.tab_area ul li.active {position: relative; border: 0px;}
.tab_area ul li.active::before {content: none;}
.tab_area ul li.active a {font-weight: normal; color: #000;}

/* 더보기 버튼 */
a.moreBtn {display: block; height: 35px; padding: 0 45px; font-size: 15px; font-weight: bold; color: #0e173e; text-align: center; line-height: 35px; border-radius: 20px; background: url('../images/common/m_menu_arrow_down.png') no-repeat center right 16px #f0f6fb; background-size: 11px 7px;}

/* 제목영역 */
.title_area {overflow: hidden; margin-bottom: 20px;}
.title_area.mb10 {margin-bottom: 10px;}
.title_area strong.title {font-size: 20px; color: #000;}
.title_area strong.title span {font-size: 15px;}
.title_area strong.title02 {font-size: 18px; color: #000;}
.title_area strong.title03 {font-size: 23px; color: #000; }
.title_area span.tag {height: 24px; padding: 0 10px; font-size: 14px; line-height: 24px;}
.title_area span.tag + strong {margin-left: 5px;}

/* 오시는길 */
.directions {padding-bottom: 10px;}
.directions + .directions {padding-top: 10px; border-top: 0px;}

.map_area {height: 207px; margin-bottom: 13px;}
.map_info_area {position: relative; font-size: 0px;}
.map_info_area .left {display: block; width: 100%;}
.map_info_area .left::before {position: absolute; display: block; content: ""; width: 4px; height: 100%; top: 0px; left: 0px; border-radius: 10px; background-color: #00A3B1;}
.map_info_area .right {display: block; width: 100%; margin-top: 8px; text-align: left;}
.map_info_area p {padding-left: 15px; font-size: 17px; line-height: 1.8em}
.map_info_area .right dl {display: inline-block; width: 50%; padding: 10px 0 10px 40px; font-size: 16px;}
.map_info_area .right dl.call {background: url('../images/icon/icon_call.png') no-repeat center left; background-size: 29px 29px;}
.map_info_area .right dl.fax {background: url('../images/icon/icon_fax.png') no-repeat center left; background-size: 29px 29px;}
.map_info_area .right dl + dl {margin-left: 0px;}
.map_info_area .right dl dd {padding-left: 20px;}
.map_info_area .right dl dd::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 50%; left: 10px; margin-top: -4px; background-color: #dedede;}

.transport {margin-top: 20px; padding: 12px 15px;}
.transport > strong {display: inline-block; float: none; width: auto; margin-right: 0px; padding-left: 67px; padding-bottom: 0px; font-size: 19px; text-align: center; line-height: 50px;}
.transport.type01 > strong {background: url('../images/common/transport_bg01.png') no-repeat center left 0px; background-size: 50px 50px;}
.transport.type02 > strong {background: url('../images/common/transport_bg02.png') no-repeat center left 0px; background-size: 50px 50px;}
.transport.type03 > strong {background: url('../images/common/transport_bg03.png') no-repeat center left 0px; background-size: 50px 50px;}
.transport > ul {margin-top: 13px; padding-top: 20px; border-top: 1px solid #dedede;}
.transport > ul p.title {margin-bottom: 15px; font-size: 16px;}
.transport > ul p.title > strong {display: block; font-size: 18px;}
.transport > ul strong.title01 {margin-bottom: 15px; font-size: 18px;}
.transport > ul strong.title02 {font-size: 16px;}
.transport > ul strong.title02 + p {margin-top: 8px;}
.transport > ul > li {padding: 20px 0;}
.transport > ul > li > dl {font-size: 15px;}
.transport > ul > li > dl + dl {margin-top: 5px;}
.transport > ul > li > dl > dt {float: left;}
.transport > ul > li > dl > dd {position: relative; overflow: hidden; display: block; padding-left: 15px;}
.transport > ul > li > dl > dd::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 7px; left: 7px; margin-top: 0px; background-color: #dedede;}
.transport > ul > li > p {font-size: 15px; line-height: 1.6em; word-break: keep-all;}

.con_charge_area {margin-top: 20px; padding: 15px;}
.con_charge_area > span {display: block; padding: 9px 0 9px 60px; font-size: 15px; background: url('../images/common/charge_bg01.png') no-repeat center left; background-size: 40px 40px;}
.con_charge_area > ul {overflow: hidden; display: inline-block; width: 100%; margin: 10px 0 0 0; padding: 10px 0 0 0; border-left: 0px; border-top: 1px solid #dddddd;}
.con_charge_area > ul > li {overflow: hidden;}
.con_charge_area > ul > li + li {margin-top: 10px; padding-top: 10px; border-top: 1px solid #dddddd;}
.con_charge_area > ul > li > ul {display: block; width: 100%;}
.con_charge_area > ul > li > ul > li {overflow: hidden; display: inline-block; float: left; width: 50%; flex: none; font-size: 15px;}
.con_charge_area > ul > li > ul > li:nth-child(3) {margin-top: 5px;}
.con_charge_area > ul > li > ul > li > strong {display: block; float: left;}
.con_charge_area > ul > li > ul > li > span {position: relative; overflow: hidden; display: block; padding-left: 25px; color: #888888;}
.con_charge_area > ul > li > ul > li > span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 7px; left: 12px; margin-top: 0px; background-color: #dddddd;}

.pdfViewer {overflow: hidden; width: 100%; height: 230px; margin-top: 26px; border-radius: 10px; background-color: #f1f1f1;}
.pdfViewer p {font-size: 22px; color:#333333; font-weight: bold; text-align: center; letter-spacing: -0.04em; line-height: 230px;}

/* 달력 */
#calendar {max-width: none; margin-top: 20px;}
#calendar .fc-today-button {background-color: #76828e; border: 1px solid #76828e;}
#calendar .fc-toolbar-title {color: #1d2127; font-weight: normal;}
.fc-direction-ltr .fc-toolbar>*>:not(:first-child) {margin-left: 5px;}

/* 지도, 테이블영역 */
.centerInfo_area {margin: 15px 0 26px 0; font-size: 0px;}
.centerInfo_area .korMapArea {display: none;}
.centerInfo_area .korMaplistArea {overflow: hidden; display: block; margin-bottom: 20px;}
.centerInfo_area .korMaplistArea ul li {display: inline-block; float: left; width: calc(20% - 5px); margin: 0 0 5px 5px;}
.centerInfo_area .korMaplistArea ul li:nth-child(5n-4) {margin-left: 0px;}
.centerInfo_area .korMaplistArea ul li a {display: block; width: 100%; height: 32px; color: #000; font-size: 16px; line-height: 30px; text-align: center; border: 1px solid #d1d7db; background-color: #f0f6fb; border-radius: 5px; transition: all 0.2s 0.2s;}
.centerInfo_area .korMaplistArea ul li a.active {color: #fff; background: #4a4f6e;}
.centerInfo_area .table_area {display: block; overflow: auto; width: 100%; min-width: 100%; max-height: 410px; vertical-align: top;}
.centerInfo_area .table_area table.list tbody tr:hover {cursor: pointer;}
.centerInfo_area .table_area table.list tbody tr:hover td {background-color: #c2dcee;}

/* 소속 확인 */
.inquiry_area {overflow: hidden;}
.inquiry_area > strong {display: block; padding: 0 0 20px 0; font-size: 21px; color: #000; text-align: center; border-bottom: 1px solid #dddddd;}
.inquiry_area > p { margin: 20px 0 26px 0; font-size: 16px; color: #333; text-align: center; line-height: 2em; word-break: keep-all;}
.inquiry_area > p > strong {font-size: 20px;}
.inquiry_area > p > strong > span {color: #01a4b2;}
.inquiry_area > p > span {font-size: 16px;}
.inquiry_area > p + .tip_txt {margin-top: 40px;}
.inquiry_area > strong + .tip_txt {margin-top: 40px;}
.inquiry_area > .inquiry_input_area {margin: 0 0 20px 0; padding: 26px 0; border: 1px solid #ddd; border-radius: 15px;}
.inquiry_area > .inquiry_input_area > div {overflow: hidden; width: 315px; margin: 0 auto;}
.inquiry_area > .inquiry_input_area > div strong {display: block; margin-bottom: 10px; font-size: 17px; color: #434343;}
.inquiry_area > .inquiry_input_area > div > div.selectBox02 {width: 100%; margin-bottom: 20px;}
.inquiry_area > .inquiry_input_area > div > div.selectBox02 select {width: 100%; height: 46px; padding: 0 35px 0 20px; font-size: 16px; border: 0px; background: url('../images/icon/icon_select_arrow.png') no-repeat center right 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_name {width: 100%; height: 46px; margin-bottom: 20px; background: url('../images/icon/icon_id.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_name input[type='text'] {width: 100%; height: 46px; padding: 0 20px 0 40px; background: transparent; border: 0px;}
.inquiry_area > .inquiry_input_area > div > div.input_number {width: 100%; height: 46px; margin-bottom: 20px; padding: 0 20px 0 40px; font-size: 0px; background: url('../images/icon/icon_password.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_number input {width: 45%; height: 46px; font-size: 15px; color: #888888; background: transparent; border: 0px; vertical-align: middle;}
.inquiry_area > .inquiry_input_area > div > div.input_number input::placeholder {font-size: 15px; color: #777777;}
.inquiry_area > .inquiry_input_area > div > div.input_number span {display: inline-block; width: 10%; font-size: 16px; text-align: center; vertical-align: middle;}
.inquiry_area > .inquiry_input_area > div > div.input_birth {width: 100%; height: 46px; margin-bottom: 20px; padding: 0 20px 0 40px; font-size: 0px; background: url('../images/icon/icon_calendar.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_birth input[type='text'] {width: 100%; height: 46px; background: transparent; border: 0px;}
.inquiry_area > .inquiry_input_area > div > div.input_txt {width: 100%; height: 46px; margin-bottom: 20px; padding: 0 20px 0 40px; font-size: 0px; background-color: #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_txt input[type='text'] {width: 100%; height: 46px; background: transparent; border: 0px;}

p.warning {margin: 25px 0; font-size: 16px; color: #ef7572; text-align: center; letter-spacing: -0.04em;}

a + div.joinChk_area {margin-top: 25px;}
.joinChk_area + .genderChk_area {margin-top: 20px;}
.genderChk_area {margin-bottom: 20px;}

.inquiry_area > .inquiry_input_area > div > div.gender_area {margin-bottom: 25px;}
.inquiry_area > .inquiry_input_area > div > div.joinChk_area {padding-top: 25px; border-top: 1px solid #dddddd;}
.label_radio {font-size: 16px; }
.label_radio input.radio {display: inline-block; position: relative; width: 20px; height: 20px; border: 1px solid #d2d2d2; border-radius: 50%; vertical-align: middle; cursor: pointer;}
.label_radio input.radio:checked {border: 1px solid #01a4b2; background: url('../images/icon/check_radio.png') no-repeat center center; background-size: 8px;}
.label_radio input.radio + span {margin-right: 10px;}
.label_radio + .label_radio {margin-left: 30px;}

.label_check {font-size: 0px;}
.label_check input.chk {width: 20px; height: 20px;}
.label_check input.chk:checked {background: url('../images/icon/check_chk.png') no-repeat center center;}
.label_check input.chk + span {margin-left: 10px; font-size: 16px;}


/* 달력선택 */
div.calendar_input_area {position: relative; overflow: hidden; padding: 0 45px 0 10px; border: 1px solid #dddddd; border-radius: 20px; background-color: #fff; vertical-align: middle;}
div.calendar_input_area input {width: 100%; font-size: 16px; text-indent: 0; border: 0px; background: transparent; letter-spacing: -0.06em;}
div.calendar_input_area input::placeholder {font-size: 16px; letter-spacing: -0.06em;}
div.calendar_input_area a {position: absolute; display: inline-block; width: 16px; height: 16px; font-size: 0px; top: 6px; right: 15px; background: url('../images/icon/icon_calendar.png') no-repeat center center; background-size: cover;}

/* 첨부파일 */
.add_file_area {overflow: hidden; margin-bottom: 13px;}
.add_file_area strong {display: block; margin: 0 0 13px 0; padding: 20px 0; font-size: 16px; color:#333; letter-spacing: -0.04em; border-bottom: 1px solid #ababab;}

/* 답변영역 */
.replay_area {overflow: hidden; margin-bottom: 13px;}
.replay_area .replay_header {overflow: hidden; position: relative; margin-top: 27px; margin-bottom: 20px;}
.replay_area .replay_header strong {font-size: 17px; color: #333; letter-spacing: -0.04em;}
.replay_area .replay_header div {position: absolute; top: 0px; right: 0px;}
.replay_area .replay_header div span {font-size: 16px; color: #999; letter-spacing: -0.04em;}
.replay_area .replay_header div span + span {position: relative; padding-left: 20px;}
.replay_area .replay_header div span + span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 7px; left: 7px; background-color: #dddddd;}
.replay_area .replay_box {padding: 20px 16px; font-size: 16px; color: #222; line-height: 1.6em; border: 1px solid #dddddd;}

/* 전체교육 교육링크 영역 */
.edu_link_area {overflow: hidden; margin-bottom: 23px; font-size: 0px;}
.edu_link_area li {display: inline-block; width: calc(50% - 7px); margin-bottom: 13px; vertical-align: top;}
.edu_link_area li + li {margin-left: 0px;}
.edu_link_area li:nth-child(even) {margin-left: 14px;}
.edu_link_area li div {position: relative; width: 100%; height: 93px; padding: 13px; background-color: #f4f4f4; border-radius: 13px;}
.edu_link_area li div strong {display: block; padding-right: 17px; font-size: 16px; word-break: keep-all; line-height: 1.4em; background: url('../images/icon/icon_link_bg.png') no-repeat top 2px right; background-size: 17px;}
.edu_link_area li div a {position: absolute; bottom: 13px; left: 13px; font-size: 13px; color: #777777; letter-spacing: -0.04em;}

/* 신청서작성 과정설명 영역 */
.edu_info_box {margin-bottom: 25px;}
.edu_info_box .edu_info_con {width: 100%; min-height: 233px; margin-left: 0px; padding: 0px;}
.edu_info_box .edu_info_con p.edu_sort {margin: 20px 13px; font-size: 15px;}
.edu_info_box .edu_info_con .thumbnailBox {position: relative; float: left; width: 133px; height: 133px; margin-right: 20px;}
.edu_info_box .edu_info_con .thumbnailBox img {width: 100%; height: 100%;}
.edu_info_box .edu_info_con .thumbnailBox a.like {position: absolute; display: inline-block; width: 17px; height: 15px; font-size: 0px; bottom: 13px; right: 12px; background: url('../images/icon/icon_like.png') no-repeat center center; background-size: cover;}
.edu_info_box .edu_info_con .thumbnailBox a.like.active {background: url('../images/icon/icon_like_active.png') no-repeat center center; background-size: cover;}
.edu_info_box .edu_info_con .thumbnailBox .smple_area{ width:80px;line-height: 18px;background: url('../images/icon/icon_play.png') no-repeat 5px #454545;}
.edu_info_box .edu_info_con .txt_con {overflow: hidden; padding: 0px 13px; margin-bottom: 13px;}
.edu_info_box .edu_info_con strong.title {min-height: 2.4em; margin-bottom: 15px; font-size: 20px; line-height: 1.2em;}
.edu_info_box .edu_info_con span.tag {display: inline-block; margin-bottom: 15px; padding: 2px 15px; font-size: 13px;}
.edu_info_box .edu_info_con p {font-size: 15px; margin-bottom: 0px;}
.edu_info_box .edu_info_con ul.period_list {position: relative; display: block; bottom: auto; margin-bottom: 15px; padding: 0px 13px;}
.edu_info_box .edu_info_con ul.period_list li {font-size: 15px;}
.edu_info_box .edu_info_con ul.period_list li + li {margin-top: 2px;}
.edu_info_box .edu_info_con ul.period_list li strong + span {padding-left: 20px;}
.edu_info_box .edu_info_con ul.period_list li strong + span::before {position: absolute; content: ""; width: 1px; height: 10px; top: 5px; left: 8px; background-color: #777;}
.edu_info_box .edu_info_con p.price {position: relative; bottom: auto; right: auto; float: none; text-align: right; padding: 20px 10px; font-size: 16px; border-top: 1px solid #dddddd;}
.edu_info_box .edu_info_con p.price strong {font-size: 20px;}
.edu_info_box .edu_info_con span.state_txt {position: absolute; top: auto; right: auto; bottom: 25px; left: 13px; font-size: 14px;}
.edu_info_box .edu_info_con .txt_con02 {position: relative;}

a.edu_request_btn {position: relative; display: block; width: 100%; height: 50px; margin-top: 25px; bottom: auto; right: auto; text-align: center; border: 1px solid #fcc260; background-color: #feeed3; border-radius: 50px;}
a.edu_request_btn span {position: relative; display: block; padding: 0px; color: #333; font-size: 16px; line-height: 48px; letter-spacing: -0.04em;}
a.edu_request_btn span::before {position: absolute; display: inline-block; content: ""; width: 35px; height: 35px; top: 6.5px; left: 10px; border-radius: 50%; background: url('../images/icon/icon_edubtn_bg.png') no-repeat center center #cc8600; background-size: 18px;}
p.edu_txt {display: block; margin: 20px 0 0 0px; font-size: 14px;}
p.edu_txt + a.btn01 {height: 24px; margin: 10px 0 0 0px; line-height: 24px; font-size: 13px; vertical-align: middle;}

ul.view_count_area {position: absolute; top: auto; right: auto; bottom: 25px; left: 13px;}
ul.view_count_area li {position: relative; float: left; display: inline-block; font-size: 14px; color: #777; letter-spacing: -0.04em;}
ul.view_count_area li + li {position: relative; padding-left: 35px;}
ul.view_count_area li + li::before {position: absolute; content: ""; width: 1px; height: 10px; top: 6px; left: 10px; background: #dddddd;}
ul.view_count_area li a.like {position: absolute; display: inline-block; width: 17px; height: 15px; left: 15px; top: 3px; font-size: 0px; background: url('../images/icon/icon_like.png') no-repeat center center; background-size: cover;}
ul.view_count_area li a.like.active {background: url('../images/icon/icon_like_active.png') no-repeat center center; background-size: cover;}
ul.view_count_area li span.like {position: absolute; display: inline-block; width: 17px; height: 15px; left: 13px; top: 3px; font-size: 0px; background: url('../images/icon/icon_like.png') no-repeat center center; background-size: cover;}
ul.view_count_area li span.like.active {background: url('../images/icon/icon_like_active.png') no-repeat center center; background-size: cover;}

/* 신청서작성 완료화면 */
.complete_area.type03 {width: 600px;}
.complete_area.type04 {width: 100%;}

.txt_con01 {overflow: hidden;}
.txt_con02 {overflow: hidden;}

.txt_box {margin-bottom: 20px; padding: 26px 20px;}
.txt_box p {margin-bottom: 20px; font-size: 17px;}


/* 수강신청 - 교육상세 구분 */
.con_line {margin-bottom: 30px; padding-bottom: 0px; border-bottom: 0px;}
.con_line .con_slide_area .swiper-container {width: 80%;}
.con_line .con_slide_area .page_btn_area {width: 100%}
.con_line .con_slide_area .page_btn_area a {width: 42px; height: 42px;}

.youtube_area {display: block; width: 100%; height: 100%; margin: 0 auto 20px;}

/* 수강신청 - 교육상세 */
.book_info_area {overflow: hidden; margin-bottom: 20px; font-size: 0px;}
.book_info_area .book_photo {overflow: hidden; display: inline-block; width: 150px; height: 215px; border: 1px solid #e2e2e2; vertical-align: top;}
.book_info_area .book_photo img {display: block; width: 100%; height: 100%;}
.book_info_area .book_info_box {display: inline-block; width: calc(100% - 200px); margin-left: 30px; vertical-align: top;}
.book_info_area .book_info_box strong.tit {display: block; font-size: 22px; color:#000; font-weight: bold; letter-spacing: -0.04em; line-height: 1.2em;}
.book_info_area .book_info_box span.tag {margin: 4px 10px 0 0; font-size: 13px;}
.book_info_area .book_info_box ul {margin-top: 10px; margin-bottom: 0px;}
.book_info_area .book_info_box ul li {display: inline-block; width: 45%; margin-top: 0px;  margin-bottom: 10px; vertical-align: top;}
.book_info_area .book_info_box ul li span.tit {display: inline-block; float: left; width: 48px; height: 19px; margin-right: 10px; font-size: 13px; color: #888888; line-height: 17px; text-align: center; border: 1px solid #d9d9d9;}
.book_info_area .book_info_box ul li span.txt {overflow: hidden; display: block; margin-left: 10px; font-size: 14px; color: #000; line-height: 1.2em;}

.book_info_area .book_info_box p.price {display: block; margin-bottom: 10px; font-size: 13px; color: #000000; font-weight: bold; letter-spacing: -0.04em;}
.book_info_area .book_info_box p.price span {font-size: 12px; color:#006cb8;}
.book_info_area .book_info_box p.price strong {display: inline-block; margin-left: 10px; font-size: 19px;}
.book_info_area .book_info_box div.txt_box02 {width: 100%; font-size: 14px;}

/* 기관전용 - 일괄회원가입 */
.tip_txt > div.con {padding: 0; background: none;}
.tip_txt > div.con > .edu_step {margin-top: 30px;}
.tip_txt > div.con > .edu_step + .edu_step {margin-top: 0px;}
.tip_txt > div.con > .edu_step > strong {font-size: 16px; margin-right: 10px;}
.tip_txt > div.con > .edu_step > ul.tip_step_list {display: block; max-width: 100%; width: 100%; margin: 15px auto; padding: 0 55px;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li {display: inline-block; padding: 10px 0;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li::before {content: none;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li + li {padding-left: 60px; background: url('../images/icon/icon_arrow05.png') no-repeat center left 20px;}


/* 수강신청 - 수강후기 */
.epilogue_area .comment_area {margin-bottom: 0px;}
.epilogue_area .comment_area.type02 ul li {overflow: hidden; margin-top: 10px;}
.epilogue_area .comment_area.type02 ul li div.comment_left {display: block; float: none; width: 100%;}
.epilogue_area .comment_area.type02 ul li div.comment_left span + .rating_box {margin-left: 20px;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_top + div.comment_bottom {margin-top: 30px;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn {display: inline-block; margin-top: 10px; font-size: 13px; color: #0e173e;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn span {padding: 0 20px 0 0; background: url('../images/icon/icon_acc_arrow02.png') no-repeat center right;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn.closed span {padding: 0 20px 0 0; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right;}
.epilogue_area .comment_area.type02 ul li div.comment_left + div.comment_right {margin-top: 10px;}
.epilogue_area .comment_area.type02 ul li div.comment_right {display: block; width: 100%; padding-left: 0px; text-align: right;}
.epilogue_area .comment_area.type02 ul li div.comment_right a {width: 80px;}
.epilogue_area .comment_area.type02 ul li div.comment_right a + a {margin-top: 0px;}
.epilogue_area .comment_area.type02 ul li div.comment_right a + span {display: block; margin-top: 10px; font-size: 13px; color: #888888;}
.div_dl_area dl dd {width: calc(100% - 120px);}

/* 나의수강현황 */
.myedu_con {overflow: hidden;}
.myedu_con .left_con {float: none; display: inline-block; width: 100%; margin-right: 0px;}
.myedu_con .left_con > ul {overflow: hidden; border: 1px solid #dddddd; border-radius: 10px; background-color: #f8f8f8;}
.myedu_con .left_con > ul > li + li {border-left: 1px solid #dddddd;}
.myedu_con .left_con > ul.type01 {height: 148px; margin-bottom: 30px;}
.myedu_con .left_con > ul.type01 > li {display: inline-block; float: left; width: 50%; height: 100%; padding: 20px 15px;}
.myedu_con .left_con > ul.type01 > li > strong {display: block; margin-bottom: 15px; font-size: 22px; letter-spacing: -0.04em;}
.myedu_con .left_con > ul.type01 > li > p { font-size: 13px; color: #333; line-height: 1;}
.myedu_con .left_con > ul.type01 > li > p + p {margin-top: 4px;}
.myedu_con .left_con > ul.type01 > li > p strong {font-size: 16px; color: #018f9b; line-height: 1;}
.myedu_con .left_con > ul.type01 > li:nth-child(2) p + p {margin-top: 9px;}
.myedu_con .left_con > ul.type02 {height: 207px; margin-bottom: 30px;}
.myedu_con .left_con > ul.type02 > li {position: relative; display: inline-block; float: left; width: 33.3333%; height: 100%; padding: 20px 15px 0;}
.myedu_con .left_con > ul.type02 > li > strong {display: block; margin-bottom: 5px; font-size: 15px;}
.myedu_con .left_con > ul.type02 > li > a {position: absolute; display: block; width: 100%; height: 48px; bottom: 0px; left: 0px; text-align: center; border-top: 1px solid #dddddd; background-color: #eeeeee;}
.myedu_con .left_con > ul.type02 > li > a span {display: inline-block; padding-right: 25px; font-size: 13px; line-height: 48px; color: #666666; background: url('../images/icon/icon_link_bg.png') no-repeat center right;}
.myedu_con .left_con > ul.type02 > li > p {font-size: 13px; color: #666666;}
.myedu_con .left_con > ul.type02 > li > p > span {display: block; font-size: 16px; color: #000;}
.myedu_con .left_con > ul.type02 > li > p > strong {font-size: 16px; color: #01a4b2;}
.myedu_con .left_con > ul.type02 > li > p + p {margin-top: 10px;}
.myedu_con .right_con { display: inline-block; width: 100%;}
.myedu_con .right_con div.table_area {overflow: auto; height: 423px; margin-bottom: 0px;}
.edu_th_list {width: 820px; margin: 0 0 25px 130px;  font-size: 0px;}
.edu_th_list li {display: inline-block; width: 117px; text-align: center;}
.edu_th_list li span {position: relative; display: block; padding-top: 85px; font-size: 15px; color: #000;}
.edu_th_list li span::before {position: absolute; display: block; content: ""; width: 75px; height: 75px; top: 0px; left: 50%; margin-left: -37.5px; border: 1px solid #e4e4e4; border-radius: 50%;}
.edu_th_list li span.bg01::before {background: url('../images/sub/edu_tbl_bg01.png') no-repeat center center #fff;}
.edu_th_list li span.bg02::before {background: url('../images/sub/edu_tbl_bg02.png') no-repeat center center #fff;}
.edu_th_list li span.bg03::before {background: url('../images/sub/edu_tbl_bg03.png') no-repeat center center #fff;}
.edu_th_list li span.bg04::before {background: url('../images/sub/edu_tbl_bg04.png') no-repeat center center #fff;}
.edu_th_list li span.bg05::before {background: url('../images/sub/edu_tbl_bg05.png') no-repeat center center #fff;}
.edu_th_list li span.bg06::before {background: url('../images/sub/edu_tbl_bg06.png') no-repeat center center #fff;}
.edu_th_list li span.bg07::before {background: url('../images/sub/edu_tbl_bg07.png') no-repeat center center #fff;}
.con_line .con_left {overflow: hidden; display: inline-block; float: none; width: 100%; vertical-align: top;}
.con_line .con_right {overflow: hidden; display: inline-block; width: 100%; vertical-align: top;}
.con_line .con_left + .con_right {margin: 30px 0 0 0px;}

.bg_box {margin-bottom: 25px; padding: 20px 50px; border-radius: 5px; background-color: #f4f4f4;}
.sign_btn {display: inline-block; width: 210px; height: 97px; border-radius: 15px; text-align: center; background-color: #f4f4f4;}
.sign_btn a {position: relative; display: block; width: 100%; height: 100%; padding: 20px; font-size: 14px; color: #888888;}
.sign_btn a span {position: absolute; width: 80%; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.sign_area {width: 510px; height: 212px; margin: 30px auto;}

/* 퍼센트영역 */
.percent_list_area {margin-bottom: 35px;}
.percent_list_area ul {overflow: hidden; width: 100%; height: auto;}
.percent_list_area ul li {width: 50%; height: 80px;}
.percent_list_area ul li + li {border-left: 1px solid #ddd;}
.percent_list_area ul li:nth-child(1),.percent_list_area ul li:nth-child(2) {border-bottom: 1px solid #ddd;}
.percent_list_area ul li:nth-child(3) {border-left: 0px;}
.percent_list_area ul li > div {padding: 18px 20px;}
.percent_list_area ul li div span {font-size: 15px;}
.percent_list_area ul li div strong {margin-top: 10px; font-size: 20px;}
.percent_list_area ul li div span + strong {margin-top: 5px;}
.percent_list_area ul li div div.percent {width: 53px; height: 53px; top: 15px; right: 23px; }

/* 과제목록 - 북러닝 */
.edu_list {margin-bottom: 20px;}
.edu_list > ul {width: 100%;}
.edu_list > ul > li {display: block;}
.edu_list > ul > li + li {margin-top: 30px;}
.edu_list > ul > li > div {position: relative; display: block; padding: 26px 20px 20px; border: 1px solid #dddddd; border-radius: 10px; background-color: #f8f8f8;}
.edu_list > ul > li > div > span.txt_tag {position: absolute; display: inline-block; height: 19px; padding: 0 10px; top: -6px; left: 27px; font-size: 13px; color:#01a4b2; line-height: 17px; border: 1px solid #01a4b2; border-radius: 10px; background-color: #ffffff;}
.edu_list > ul > li > div > .num_area {position: relative; flex-basis: auto; text-align: left; border-right: 0;}
.edu_list > ul > li > div > .num_area strong {position: relative; top: auto; left: auto; font-size: 22px;}
.edu_list > ul > li > div > .con_area {position: relative; padding: 0; flex-basis: auto; width: 100%;}
.edu_list > ul > li > div > .con_area .con_inner_area01 {padding: 3px 50px 3px 0;}
.edu_list > ul > li > div > .con_area .con_inner_area01 > strong {font-size: 17px; color: #333; letter-spacing: -0.04em; vertical-align: middle;}
.edu_list > ul > li > div > .con_area .con_inner_area01 > ul {margin-top: 5px;}
.edu_list > ul > li > div > .con_area .con_inner_area02 {margin-top: 10px; padding: 10px 25px; border: 1px solid #dddddd; border-radius: 5px; background-color: #e5ebf0;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li {display: inline-block; padding-right: 40px; font-size: 13px; color: #333; letter-spacing: -0.04em;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li > strong + span {position: relative; padding-left: 20px;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li > strong + span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 5px; left: 8px; background-color: #cccccc;}
.edu_list > ul > li > div > .con_area .scorebox {position: absolute; display: block; width: 42px; height: 42px; top: 3px; right: 0px; background-color: #0f5383; border-radius: 5px;}
.edu_list > ul > li > div > .con_area .scorebox span {display: block; font-size: 14px; color: #fff; text-align: center; line-height: 42px;}
.edu_list > ul > li > div > .con_area .hits_area {overflow: hidden; margin-top: 5px;}
.edu_list > ul > li > div > .con_area .hits_area ul {text-align: right;}
.edu_list > ul > li > div > .con_area .hits_area ul li {display: inline-block;}
.edu_list > ul > li > div > .con_area .hits_area ul li + li {margin-left: 15px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span {font-size: 13px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.nice {padding-left: 30px; background: url('../images/icon/icon_debate_bg01_on.png') no-repeat center left; background-size: 30px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.interest {padding-left: 30px; background: url('../images/icon/icon_debate_bg02_on.png') no-repeat center left; background-size: 30px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.comment {padding-left: 30px; background: url('../images/icon/icon_debate_bg03.png') no-repeat center left; background-size: 30px;}


/* faq */
.faq_area {overflow: hidden; margin-bottom: 30px;}
.faq_area > ul > li + li {margin-top: 15px;}
.faq_area > ul > li div.faq_h {display: block; padding: 16px 30px; align-items: center;}
.faq_area > ul > li div.faq_h strong.num {display: block; margin-bottom: 10px; flex-basis: auto; font-size: 22px; text-align: left;}
.faq_area > ul > li div.faq_h span.classify {display: block; margin-bottom: 5px; flex-basis: 120px; text-align: left; font-size: 15px;}
.faq_area > ul > li div.faq_h strong.tit {display: block; flex-basis: auto; margin-bottom: 10px; font-size: 17px;}
.faq_area > ul > li div.faq_h ul {display: block; padding-left: 0px;}
.faq_area > ul > li div.faq_h ul > li {font-size: 13px; color: #333; }
.faq_area > ul > li div.faq_h ul > li > span + span {padding-left: 20px;}
.faq_area > ul > li div.faq_h ul > li > span + span::before {width: 1px; height: 10px; top: 5px; left: 10px;}
.faq_area > ul > li div.faq_c {position: relative; display: none; padding: 25px 30px 55px 30px;}
.faq_area > ul > li div.faq_c div {position: relative; min-height: auto; padding-left: 0px; background: none;}
.faq_area > ul > li div.faq_c div::before {content: none;}
.faq_area > ul > li div.faq_c div p {padding-left: 0px; }
.faq_area > ul > li div.faq_c a {position: absolute; display: inline-block; bottom: 18px; left: 35px; padding-right: 20px; font-size: 13px; color: #0e173e; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right;}

/* 검색결과없을경우 */
.none_search_keyword {padding-left: 50px; font-size: 20px; background: url('../images/icon/icon_exclamation.png') no-repeat center left;}

/* 에러페이지 */
.error_area {width: 100%; text-align: center;}
.error_area h1 {display: block; width: auto; text-align: center;}
.error_area h1 > a > span {padding-top: 0px;}

/* 운영자립도 진단 */
.abl_step_area {margin-bottom: 40px;}
.abl_step_area > .abl_step_top > ul.type01 {position: relative; overflow: hidden; margin: 0 40px; padding: 15px 0;}
.abl_step_area > .abl_step_top > ul.type01 > li {position: relative; display: block; float: none; width: 100%; padding-bottom: 0px; vertical-align: top; text-align: left;}
.abl_step_area > .abl_step_top > ul.type01 > li + li {margin-top: 10px;}
.abl_step_area > .abl_step_top > ul.type01 > li > span {position: absolute; display: inline-block; width: 19px; height: 19px; margin-left: -9px; top: 0px; left: auto; right:  0px; font-size: 12px; line-height: 17px; text-align: center; border: 1px solid #9d9d9d; border-radius: 50%; background-color: #e1e1e1;}
.abl_step_area > .abl_step_top > ul.type01 > li > p {font-size: 14px; color: #000; line-height: 1.2em; letter-spacing: -0.04em;}
.abl_step_area > .abl_step_top > ul.type01 > li > p > span {display: inline-block;}
.abl_step_area > .abl_step_top > ul.type01 > li.line {display: none;}
.abl_step_area > .abl_step_top > ul.type02 {position: relative; overflow: hidden; padding: 0px;}
.abl_step_area > .abl_step_top > ul.type02 > li {position: relative; display: block; float: none; width: 100%; padding: 0px 50px; text-align: left;}
.abl_step_area > .abl_step_top > ul.type02 > li + li {border-left: 0px solid #ddd; border-top: 1px solid #ddd;}
.abl_step_area > .abl_step_top > ul.type02 > li > p {display: block; padding: 20px 0 20px 55px; font-size: 14px; color:#000; text-align: left;}
.abl_step_area > .abl_step_top > ul.type02 > li > p > span {display: inline-block;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(1) > p {background: url('../images/common/abl_step_bg01.png') no-repeat center left;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(2) > p {background: url('../images/common/abl_step_bg02.png') no-repeat center left;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(3) > p {background: url('../images/common/abl_step_bg03.png') no-repeat center left;}

.abl_step_area > .abl_step_mid .inner {padding: 20px;}
.abl_step_area > .abl_step_mid .inner + .inner {border-top: 1px solid #ddd;}
.abl_step_area > .abl_step_mid .inner .mid_h {margin-bottom: 10px;}
.abl_step_area > .abl_step_mid .inner .mid_h span {float: none; width: 60px; margin-bottom: 10px; margin-right: 0px; font-size: 13px;}
.abl_step_area > .abl_step_mid .inner .mid_h p {width: 100%; font-size: 14px; word-break: keep-all;}
.abl_step_area > .abl_step_mid .inner .mid_c ul {margin-left: 0px;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li {display: block;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li + li {margin-top: 10px; margin-left: 0px;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li span {width: 19px; height: 19px; font-size: 12px; line-height: 17px;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li p {margin-left: 5px; font-size: 14px;}

.abl_step_area > .abl_step_bottom {padding: 13px 25px; background-color: #f6f6f6;}
.abl_step_area > .abl_step_bottom strong {display: block; float: none; width: 100%; margin-bottom: 15px; text-align: left; font-size: 16px; color: #006cb8; line-height: 1;}
.abl_step_area > .abl_step_bottom strong span {display: inline-block;}
.abl_step_area > .abl_step_bottom div {overflow: hidden; display: block; width: 100%; height: 33px; border: 2px solid #83b6d9; border-radius: 5px;}
.abl_step_area > .abl_step_bottom div span {display: inline-block; height: 100%; background-color: #006cb8;}

.abl_form_area {overflow: hidden; margin-bottom: 20px; border-top: 3px solid #000;}
.abl_form_area > div {padding: 15px 25px; background-color: #f0f6fb;}
.abl_form_area > div > strong {font-size: 15px; color: #333;}
.abl_form_area > ul > li {border-top: 1px solid #dddddd;}
.abl_form_area > ul > li:last-child {border-bottom: 1px solid #dddddd;}
.abl_form_area > ul > li div.question_h {padding: 15px 25px; font-size: 15px; color: #333; background-color: #f6f6f6;}
.abl_form_area > ul > li div.question_h p {word-break: keep-all;}
.abl_form_area > ul > li div.question_a {border-top: 1px solid #dddddd;}
.abl_form_area > ul > li div.question_a ul {overflow: hidden; display: flex;}
.abl_form_area > ul > li div.question_a ul > li {flex: 1 1 1px; padding: 15px 0; text-align: center;}
.abl_form_area > ul > li div.question_a ul > li + li {border-left: 1px solid #ddd;}

.num_chk {position: relative; display: inline-block;}
.num_chk input[type='radio'] {position: absolute; top: 0; left: -1px; width: 1px; height: 1px; border: none; opacity: 0.01; text-indent: -999px; overflow: hidden;}
.num_chk input[type='radio'] + span {position: relative; display: inline-block; width: 19px; height: 19px; font-size: 12px; line-height: 17px; text-align: center; border: 1px solid #9d9d9d; border-radius: 50%; /*background-color: #e1e1e1;*/ vertical-align: middle;}
.num_chk input[type='radio']:checked + span {display: inline-block; width: 19px; height: 19px; font-size: 12px; line-height: 17px; text-align: center; color: #22c1ce; border: 1px solid #22c1ce; border-radius: 50%; background-color: #fff;}
.num_chk input[type='radio']:focus + span::before {position: absolute; display: inline-block; content: ""; width: 100%; height: 100%; top: 0px; left: 0px; outline: 1px solid #000;}
.num_chk > p {display: inline-block; vertical-align: middle;}

/* 자립도 영역 */
.gpa_box {margin-bottom: 20px; padding: 21px 20px;}
.gpa_box strong.gpa_txt {font-size: 17px;}
.gpa_box strong.gpa_score {top: 13px; right: 20px; font-size: 38px;}

/* 자주도 차트 영역 */
.independent_chart .independent_chart_h {padding: 13px 20px;}
.independent_chart .independent_chart_h span {padding: 13px 0px 13px 60px; font-size: 15px;}
.independent_chart .independent_chart_h span.in_h_txt01 {background: url('../images/common/independent_bg01.png') no-repeat center left;}
.independent_chart .independent_chart_h span.in_h_txt02 {position: absolute; top: 12px; right: 20px; background: url('../images/common/independent_bg02.png') no-repeat center left;}
.independent_chart .independent_chart_h div.line {position: absolute; width: calc(100% - 330px); height: 3px; bottom: 35px; margin: 0 165px; padding: 0px; left: 0px; background-color: #d6d6d6; z-index: 10;}
.independent_chart .independent_chart_h div.line div::before {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; left: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_left02.png') no-repeat center center;}
.independent_chart .independent_chart_h div.line div::after {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; right: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_right02.png') no-repeat center center;}
.independent_chart .independent_chart_b > div {height: 420px;}

/* 역량진단결과 */
.diagnosis_area {margin-bottom: 30px;}
.diagnosis_area .chart_area {height: 300px;}
.diagnosis_area .diagnosis_half {display: block; float: none; width: 100%;}
.diagnosis_area .diagnosis_half + .diagnosis_half {margin-top: 30px;}
.diagnosis_area .diagnosis_half:nth-child(1) {margin-right: 0px;}
.diagnosis_area .diagnosis_half:nth-child(2) {margin-left: 0px;}
.diagnosis_area .diagnosis_half .chart_area {height: 414px; padding: 20px 0px;}
.diagnosis_area .diagnosis_half .chart_area > div {height: 280px;}
.diagnosis_area .diagnosis_half .chart_area p {padding: 0 30px; font-size: 14px;}

.independent_none_con {padding-bottom: 290px; background: url('../images/sub/independent_none_bg.png') no-repeat center bottom;}
.independent_none_con strong {margin-bottom: 15px; font-size: 22px;}
.independent_none_con p {font-size: 17px;}

/* 이용안내 */
.guide_box {position: relative; width: 100%; height: auto; margin-bottom: 30px; background: none;}
.guide_box div {position: relative; width: 100%; height: 247px; padding: 40px; top: 0px; left: 0px; background-color: #f5f5f5; border-radius: 15px;}
.guide_box div strong {display: block; margin-bottom: 35px; font-size: 28px; color: #000; line-height: 1;}
.guide_box div p {font-size: 18px; color:#333; letter-spacing: -0.02em;}

.guide_box02 {overflow: hidden; margin-bottom: 30px;}
.guide_box02 > div {position: relative; display: block; float: none; width: 100%;}
.guide_box02 > div:nth-child(1) {margin-right: 0px;}
.guide_box02 > div:nth-child(2) {margin-left: 0px;}
.guide_box02 > div > strong {display: block; margin-bottom: 15px; font-size: 23px; color: #000; text-align: center; line-height: 1;}
.guide_box02 > div > div {overflow: hidden; border: 1px solid #dddddd; border-radius: 10px;}
.guide_box02 > div + div {margin-top: 30px;}
.guide_box02 > div + div::before {content: none;}
.guide_box02 > div > div::before {display: block; content: ""; width: 100%; height: 211px; }
.guide_box02 > div:nth-child(1) > div::before {background: url('../images/sub/guide_bg02.png') no-repeat center center #e4eaf5;}
.guide_box02 > div:nth-child(2) > div::before {background: url('../images/sub/guide_bg03.png') no-repeat center center #f5e6dd;}
.guide_box02 > div > div > ul {margin: 20px 0 20px 40px;}
.guide_box02 > div > div > ul > li {position: relative; padding-left: 20px; font-size: 17px; line-height: 1;}
.guide_box02 > div > div > ul > li::before {position: absolute; display: block; content: ""; width: 6px; height: 6px; top: 5px; left: 0px; background-color: #1782c0;}
.guide_box02 > div > div > ul > li + li {margin-top: 15px;}

.guide_box03 {overflow: hidden; margin-bottom: 30px; padding-top: 20px;}
.guide_box03 ul {}
.guide_box03 ul li {display: inline-block; float: left; width: calc(50% - 20px); vertical-align: top;}
.guide_box03 ul li:nth-child(odd) {margin-right: 20px;}
.guide_box03 ul li:nth-child(even) {margin-left: 20px;}
.guide_box03 ul li:nth-child(3),
.guide_box03 ul li:nth-child(4) {margin-top: 20px;}
.guide_box03 ul li + li {margin-left: 0px;}
.guide_box03 ul li div {position: relative; width: 100%; height: 242px; border: 1px solid #dddddd; border-radius: 10px;}
.guide_box03 ul li div::before {display: block; content: ""; width: 100%; height: 122px; border-radius: 10px 10px 0 0;}
.guide_box03 ul li div span {position: absolute; width: 37px; height: 37px; margin-left: -18.5px; top: -13px; left: 50%; font-size: 20px; color: #fff; line-height: 37px; text-align: center; font-style: italic; background-color: #01a4b2; border-radius: 50%;}
.guide_box03 ul li div p {font-size: 16px; color: #333; padding: 15px 20px 0 30px;}

.guide_box04 {overflow: hidden;}
.guide_box04 > strong {display: block; margin-bottom: 30px; font-size: 30px; color: #000; line-height: 1;}
.guide_box04 > p {font-size: 20px;}
.guide_box04 > p span {display: block; color: #006cb8;}
.guide_box04 > ul {margin-top: 50px;}
.guide_box04 > ul > li {overflow: hidden; display: block;}
.guide_box04 > ul > li + li {margin-top: 60px;}
.guide_box04 > ul > li > div.guide_img { display: block; float: none; width: 338px; height: 240px; margin: 0 auto 20px;}
.guide_box04 > ul > li > div.guide_img img {width: 100%; height: 100%;}
.guide_box04 > ul > li > div.guide_txt {overflow: hidden; width: 100%;}
.guide_box04 > ul > li > div.guide_txt strong {display: block; margin-bottom: 20px; font-size: 24px; color: #000; line-height: 1.2em;}
.guide_box04 > ul > li > div.guide_txt p {margin-bottom: 35px; font-size: 16px;}
.guide_box04 > ul > li > div.guide_txt ul {}
.guide_box04 > ul > li > div.guide_txt ul li {display: inline-block; min-width: 200px;}
.guide_box04 > ul > li > div.guide_txt ul li:nth-child(3),
.guide_box04 > ul > li > div.guide_txt ul li:nth-child(4) {margin-top: 20px;}
.guide_box04 > ul > li > div.guide_txt ul li span {padding: 2px 0 2px 50px; font-size: 18px;}

/* 사용자안내 */
/*.user_guide_area > ul > li {display: inline-block; float: left; width: calc(50% - 10px); height: 346px;}*/
/*.user_guide_area > ul > li:nth-child(odd) {margin-right: 10px;}*/
/*.user_guide_area > ul > li:nth-child(even) {margin-left: 10px;}*/
/*.user_guide_area > ul > li:nth-child(1),*/
/*.user_guide_area > ul > li:nth-child(2) {margin-bottom: 20px;}*/
/*.user_guide_area > ul > li + li {margin-left: 0px;}*/
/*.user_guide_area > ul > li > div::before {height: 165px;}*/
/*.user_guide_area > ul > li > div > strong {margin: 25px 0 20px 0; font-size: 19px;}*/
/*.user_guide_area > ul > li > div > p {font-size: 16px;}*/

/* 교육유형안내 */
.edu_info_txt_box {width: 100%; height: 179px; margin-bottom: 50px; background: url('../images/sub/edu_info_type_txtbg.png') no-repeat center right #f5f5f5; border-radius: 20px;}
.edu_info_txt_box p {font-size: 25px; top: 50%; left: 40px;}
.edu_info_txt_box p strong {font-size: 32px;}

.edu_info_type_list_area {margin-bottom: 50px;}
.edu_info_type_list_area > strong {margin-bottom: 20px; font-size: 22px;}
.edu_info_type_list_area > div {padding: 30px; border-radius: 20px;}
.edu_info_type_list_area > div > ul > li + li {margin-top: 30px;}
.edu_info_type_list_area > div > ul > li img {width: 175px; height: 105px; margin-right: 30px;}
.edu_info_type_list_area > div > ul > li > div {width: calc(100% - 205px);}
.edu_info_type_list_area > div > ul > li > div > strong {margin-top: 10px; font-size: 22px;}
.edu_info_type_list_area > div > ul > li > div > p {margin-top: 15px; font-size: 18px;}

/* 설문 */
.question_title_area {position: relative; margin-bottom: 20px;}
.question_title_area > strong {display: block; width: 100%; margin-bottom: 20px; font-size: 22px; color: #333; letter-spacing: -0.04em; line-height: 1.2em;}
.question_title_area ul {position: relative; top: auto; right: auto;}
.question_title_area ul li {display: inline-block; font-size: 13px; }
.question_title_area ul li + li {margin-left: 10px;}
.question_title_area ul li strong {color: #333;}
.question_title_area ul li span {position: relative; color: #333;}
.question_title_area ul li strong + span {margin-left: 12px;}
.question_title_area ul li strong + span::before {position: absolute; content: ""; width: 1px; height: 10px; top: 5px; left: -7px; background-color: #cccccc;}
.question_area {margin-bottom: 20px;}
.question_area .q_box {overflow: hidden; padding: 15px 25px; border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd;}
.question_area .q_box:first-child {border-top: 2px solid #000;}
.question_area .q_box.type01 {background-color: #f0f6fb;}
.question_area .q_box span.q_type {float: right; display: inline-block; margin-right: 0px; padding: 0 5px; font-size: 12px; vertical-align: middle; border-radius: 10px;}
.question_area .q_box div.q_txt_box {overflow: hidden; padding-right: 10px; font-weight: bold; font-size: 15px; color: #222; line-height: 1.2em;}
.question_area .q_box div.q_txt_box span {float: left; padding-right: 6px;}
.question_area .q_box div.q_txt_box pre {overflow: hidden; position: relative; color: #000; font-weight: 500; font-size: 15px; line-height: 1.2em; word-break: keep-all;}
.question_area .q_box div.q_img {overflow: hidden; text-align: center;}
.question_area .q_box.type01 span.q_type {color: #fff; background-color: #2a76b7;}
.question_area .q_box.type02 {background-color: #f6f6f6;}
.question_area .q_box.type02 span.q_type {color: #666666; background-color: #d4d4d4;}
.question_area .q_box.sub {position: relative; padding-left: 55px; border: 1px solid #dddddd; border-radius: 10px;}
.question_area .q_box.sub::before {position: absolute; display: block; content: ""; width: 17px; height: 17px; top: 11px; left: 25px; background: url('../images/icon/icon_q_bg.png') no-repeat center center;}

.question_area .a_box {padding: 10px 25px;}
.question_area .a_box.table {padding: 0;}
.question_area .a_box ul.a_list_type01 li {overflow: hidden;}
.question_area .a_box ul.a_list_type01 li + li {margin-top: 10px;}
.question_area .a_box ul.a_list_type01 li .num_chk {float: left; margin-right: 10px;}
.question_area .a_box ul.a_list_type01 li select {float: left; margin-right: 10px;}
.question_area .a_box ul.a_list_type01 li .label_check {margin-right: 10px; vertical-align: middle;}
.question_area .a_box ul.a_list_type01 li > p {display: block; overflow: hidden;}
.question_area .a_box .a_list_type02 {position: relative; overflow: hidden; display: flex; margin: 0 40px; padding: 15px 0 30px 0;}
.question_area .a_box .a_list_type02 li {position: relative; flex: 1; padding-bottom: 40px; vertical-align: top; text-align: center;}
.question_area .a_box .a_list_type02 li > p {font-size: 14px; color: #000; line-height: 1.2em; letter-spacing: -0.04em;}
.question_area .a_box .a_list_type02 li.line {position: absolute; width: 100%; height: 3px; bottom: 50px; padding: 0px; left: 0px; background-color: #006cb8; z-index: 10;}
.question_area .a_box .a_list_type02 li.line div {position: relative;}
.question_area .a_box .a_list_type02 li.line div::before {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; left: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_left.png') no-repeat center center;}
.question_area .a_box .a_list_type02 li.line div::after {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; right: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_right.png') no-repeat center center;}
.question_area .a_box .a_list_type02 li > .num_chk {position: absolute; left: 50%; bottom: -15px; margin-left: -9.5px;}
.question_area .a_box ul li.answer_chk::after {display: inline-block; content: "(정답)"; color: #22c1ce; vertical-align: middle;}
.question_area .a_box.table {padding: 10px;}
.question_area .a_box.table .table_area  {padding: 0px; box-shadow: 0 0 0 1px #dedfdf; border-radius: 10px;}
.question_area .a_box.table .table_area table.list {border: 0px;}
.question_area .a_box.table .table_area table.list thead th {padding: 9px 5px;}
.question_area .a_box.table .table_area table.list tbody td {padding: 8px 5px;}
.question_area .a_box.table .table_area table.list tbody tr:nth-child(even) td {background-color: #fafafa;}
.question_area .a_box.table .table_area table.list tbody tr:last-child td {border-bottom: 0px;}
.question_area .a_box .ex_box {margin-top: 10px; padding: 10px; border: 1px solid #dddddd; border-radius: 5px;}
.question_area .a_box .ex_box span {display: inline-block; padding: 0px 15px 0 30px; font-size: 14px; color: #fff; background: url('../images/icon/icon_answer_bg.png') no-repeat center left 10px; background-color: #78a8d1; border-radius: 50px;}
.question_area .a_box ul.textarea_list_area li + li {margin-top: 10px; padding-top: 10px; border-top: 1px solid #ddd;}
.question_area .a_box ul.textarea_list_area li span {display: block; width: 100%; margin-bottom: 10px; padding: 0px; font-size: 14px;}
.question_area .a_box ul.textarea_list_area li textarea {width: 100%; font-size: 14px;}

/* 설문 타입1 */
.question_area.type_green {border-top: 2px solid #000000; border-bottom: 0px;}
.question_area.type_green .q_con {margin-top: 20px; padding: 22px; border: 1px solid #dddddd; border-radius: 10px;}
.question_area.type_green .q_con .q_box {overflow: inherit;}
.question_area.type_green .q_con .q_box.type01 {padding: 0px; border: 0px; background: none;}
.question_area.type_green .q_con .q_box.type01 span.q_type {margin-right: -22px; padding: 3px 20px; background-color: #008272; border-radius: 50px 0 0 50px;}
.question_area.type_green .q_con .q_box.type02 {padding: 0px; border: 0px; background: none;}
.question_area.type_green .q_con .q_box.type02 span.q_type {margin-right: -22px; padding: 3px 20px; border-radius: 50px 0 0 50px;}
.question_area.type_green .q_con .q_box div.q_txt_box {line-height: 1.2em;}
.question_area.type_green .q_con .q_box div.q_txt_box span {position: relative; padding-right: 16px; color: #008272;}
.question_area.type_green .q_con .q_box div.q_txt_box span::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 10px; top: 6px; right: 5px; background-color: #cccccc;}
.question_area.type_green .q_con .q_box div.q_txt_box pre {font-size: 14px;}
.question_area.type_green .q_con .q_box div.q_img {margin-top: 20px;}
.question_area.type_green .q_con .q_box.sub {padding-left: 25px;}
.question_area.type_green .q_con .q_box.sub::before {top: 4px; left: 0px;}
.question_area.type_green .q_con .a_box {padding: 20px 0px 0px 0px;}
.question_area.type_green .q_con .a_box ul.a_list_type01.radio_list {}
.question_area.type_green .q_con .a_box ul.a_list_type01.radio_list li {padding: 5px 20px; background-color: #f1f1f1; border-radius: 5px;}
.question_area.type_green .q_con .a_box ul.a_list_type01.radio_list li.active {background-color: #dbf0ed;}
.question_area.type_green .num_chk input[type='radio'] + span {background-color: #c4c4c4;}
.question_area.type_green .num_chk input[type='radio']:checked + span {color:#fff; background-color: #008272;}
.question_area.type_green .a_box .a_list_type02 li.line {background-color: #008272;}
.question_area.type_green .a_box .a_list_type02 li.line div::before {background:url('../images/common/line_arrow_left_g.png') no-repeat center center;}
.question_area.type_green .a_box .a_list_type02 li.line div::after {background:url('../images/common/line_arrow_right_g.png') no-repeat center center;}
.question_area.type_green .a_box.table .table_area table.list thead th {background-color: #e5f4f2;}

/* 설문 타입2 */
.question_area.type_red {border-top: 2px solid #000000; border-bottom: 0px;}
.question_area.type_red .q_con {margin-top: 35px; padding: 0px; border: 0px;}
.question_area.type_red .q_con .q_box {overflow: inherit; margin-bottom: 20px;}
.question_area.type_red .q_con .q_box.type01 {padding: 0px; border: 0px; background: none;}
.question_area.type_red .q_con .q_box.type01 span.q_type {margin-right: 0px; padding: 3px 20px; background-color: #e3888c; border-radius: 5px;}
.question_area.type_red .q_con .q_box.type02 {padding: 0px; border: 0px; background: none;}
.question_area.type_red .q_con .q_box.type02 span.q_type {margin-right: 0px; padding: 3px 20px; border-radius: 5px;}
.question_area.type_red .q_con .q_box div.q_txt_box {line-height: 1.2em;}
.question_area.type_red .q_con .q_box div.q_txt_box span {position: relative; padding-right: 6px; color: #e3888c;}
.question_area.type_red .q_con .q_box div.q_txt_box span::before {content: none;}
.question_area.type_red .q_con .q_box div.q_txt_box pre {font-size: 14px;}
.question_area.type_red .q_con .q_box div.q_img {margin-top: 15px;}
.question_area.type_red .q_con .q_box.sub {padding-left: 25px;}
.question_area.type_red .q_con .q_box.sub::before {top: -2px; left: 0px;}
.question_area.type_red .q_con .a_box {padding: 20px; background-color: #f5f5f5; border-radius: 5px;}
.question_area.type_red .q_con .a_box ul.a_list_type01.radio_list {}
.question_area.type_red .q_con .a_box ul.a_list_type01.radio_list li {padding: 5px 20px;}
.question_area.type_red .q_con .a_box ul.a_list_type01.radio_list li.active {background-color: #ffffff;}
.question_area.type_red .num_chk input[type='radio'] + span {background-color: #c4c4c4;}
.question_area.type_red .num_chk input[type='radio']:checked + span {color:#fff; background-color: #e3888c; border: 1px solid #e3888c;}
.question_area.type_red .a_box .a_list_type02 li.line {background-color: #e3888c;}
.question_area.type_red .a_box .a_list_type02 li.line div::before {background:url('../images/common/line_arrow_left_r.png') no-repeat center center;}
.question_area.type_red .a_box .a_list_type02 li.line div::after {background:url('../images/common/line_arrow_right_r.png') no-repeat center center;}
.question_area.type_red .a_box .label_check input.chk:checked {border: 1px solid #e3888c; background: url('../images/icon/check_chk_r.png') no-repeat center center #fff;}
.question_area.type_red .a_box .label_radio input.radio:checked {border: 1px solid #e3888c; background: url('../images/icon/check_radio_r.png') no-repeat center center #fff;}
.question_area.type_red .a_box.table .table_area table.list thead th {background-color: #f9e7e8;}

/* 기관안내 */
.introduce_area {margin-bottom: 35px;}
.introduce_area div {width: 100%; height: 140px; padding: 25px 0 25px 160px; border-radius: 100px;}
.introduce_area div + div {margin-top: 20px; margin-left: 0px;}
.introduce_area div:nth-child(1)::before {position: absolute; display: inline-block; content: ""; width: 108px; height: 108px; top: 17px; left: 20px; background: url('../images/sub/introduce_bg01.png') no-repeat center center #01a4b2; border-radius: 50%;}
.introduce_area div:nth-child(2)::before {position: absolute; display: inline-block; content: ""; width: 108px; height: 108px; top: 17px; left: 20px; background: url('../images/sub/introduce_bg02.png') no-repeat center center #3b5990; border-radius: 50%;}
.introduce_area div span {display: block; margin-bottom: 5px; font-size: 21px; color: #333;}
.introduce_area div p {font-size: 18px; color: #666666; word-break: keep-all; letter-spacing: -0.04em; line-height: 1.4em;}

.introduce_area02 .introduce_box {overflow: hidden; margin-bottom: 30px; padding: 30px 30px 30px 30px; border: 6px solid #e6eaed; border-radius: 10px; background: url('../images/sub/introduce_bg03.png') no-repeat center right 0px #f9f9f9;}
.introduce_area02 .introduce_box strong {font-size: 25px; color: #018f9b; letter-spacing: -0.04em; line-height: 1;}
.introduce_area02 .introduce_box strong + p {margin-top: 20px;}
.introduce_area02 .introduce_box p {font-size: 18px; color: #000; letter-spacing: -0.04em; line-height: 1.6em; word-break: keep-all;}
.introduce_area02 .introduce_list_box {margin-bottom: 20px;}
.introduce_area02 .introduce_list_box ul {font-size: 0px; text-align: center;}
.introduce_area02 .introduce_list_box ul li {display: inline-block; width: 33%; padding: 10px; vertical-align: top;}
.introduce_area02 .introduce_list_box ul li + li {margin-left: 0px;}
.introduce_area02 .introduce_list_box ul li div {width: 290px; height: 200px; margin: 0 auto 15px;}
.introduce_area02 .introduce_list_box ul li div img {width: 100%; margin-bottom: 15px;}
.introduce_area02 .introduce_list_box ul li p {font-size: 17px; color: #000; letter-spacing: -0.04em; line-height: 1.4em; word-break: keep-all;}

.rb_area {overflow: hidden; padding: 20px 30px; font-size: 0px; border: 2px solid #ededed; border-radius: 10px; background-color: #f8f8f8;}
.rb_area > span {position: relative; display: block; float: none; width: 100%; padding-left: 60px; font-size: 15px;}
.rb_area > span::before {position: absolute; display: block; content: ""; width: 45px; height: 45px; top: -12px; left: 0px; background: url('../images/sub/rb_bg01.png') no-repeat center center;}
.rb_area > ul {overflow: hidden; position: relative; display: block; width: 100%; margin-top: 25px; padding-top: 15px; padding-left: 0px; border-top: 1px solid #dedede;}
.rb_area > ul::before {content: none;}
.rb_area > ul > li {display: block; float: left; width: 50%; font-size: 14px; flex: none;}
.rb_area > ul > li > strong {display: inline-block; width: 40px; color: #000;}
.rb_area > ul > li > span {color: #999;}
.rb_area > ul > li > strong + span {position: relative; padding-left: 25px;}
.rb_area > ul > li > strong + span::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 10px; top: 6px; left: 10px; background-color: #999;}

/* 복지개발원 소개 */
.con_txt_box_area .con_txt_box {margin-bottom: 30px; padding: 30px 50px; border: 1px solid #ddd; border-radius: 10px; background-color: #f8f8f8;}
.con_txt_box_area .con_txt_box > strong {display: block; float: left; width: 80px; padding-bottom: 85px; font-size: 19px; font-weight: bold; color: #333; text-align: center;}
.con_txt_box_area .con_txt_box.type01 > strong {background: url('../images/sub/con_txt_box_bg01.png') no-repeat center bottom;}
.con_txt_box_area .con_txt_box.type02 > strong {background: url('../images/sub/con_txt_box_bg02.png') no-repeat center bottom;}
.con_txt_box_area .con_txt_box.type03 > strong {background: url('../images/sub/con_txt_box_bg03.png') no-repeat center bottom;}
.con_txt_box_area .con_txt_box.type04 > strong {background: url('../images/sub/con_txt_box_bg04.png') no-repeat center bottom;}
.con_txt_box_area .con_txt_box > div {overflow: hidden; padding: 0 0 0 50px;}
.con_txt_box_area .con_txt_box > div > strong {font-size: 20px; font-weight: bold; line-height: 1.4em; word-break: keep-all;}
.con_txt_box_area .con_txt_box.type01 > div > strong {color: #006cb8;}
.con_txt_box_area .con_txt_box.type02 > div > strong {color: #018f9b;}
.con_txt_box_area .con_txt_box.type03 > div > strong {color: #7353a5;}
.con_txt_box_area .con_txt_box.type04 > div > strong {color: #b97a01;}
.con_txt_box_area .con_txt_box > div > ul {margin-top: 25px;}
.con_txt_box_area .con_txt_box > div > ul > li {position: relative; padding-left: 10px; font-size: 15px; color: #333; line-height: 1.4em; letter-spacing: -0.04em;}
.con_txt_box_area .con_txt_box > div > ul > li + li {margin-top: 15px;}
.con_txt_box_area .con_txt_box > div > ul > li::before {position: absolute; display: block; content: ""; width: 3px; height: 3px; top: 7px; left: 0px; background-color: #393f71;}

.position_guide_area {overflow: hidden;}
.position_guide_area div.map {width: 100%; height: 320px; margin-bottom: 30px; border: 1px solid #ddd; border-radius: 10px;}
.public_transit_list {overflow: hidden; display: flex;}
.public_transit_list li {width: 296px;}
.public_transit_list li + li {margin-left: 30px;}
.public_transit_list li div {height: 100%; padding: 35px 20px; text-align: center; border: 1px solid #ddd; border-radius: 10px; background-color: #f8f8f8;}
.public_transit_list li div strong {display: block; margin-bottom: 20px; padding-bottom: 90px; font-size: 20px; color: #333;}
.public_transit_list li div p {font-size: 15px; font-weight: bold; word-break: keep-all; letter-spacing: -0.04em;}
.public_transit_list li:nth-child(1) div strong {background:url('../images/sub/transit_bg01.png') no-repeat center bottom;}
.public_transit_list li:nth-child(2) div strong {background:url('../images/sub/transit_bg02.png') no-repeat center bottom;}
.public_transit_list li:nth-child(3) div strong {background:url('../images/sub/transit_bg03.png') no-repeat center bottom;}
.public_transit_list li:nth-child(1) div p {color: #006cb8;}
.public_transit_list li:nth-child(2) div p {color: #018f9b;}
.public_transit_list li:nth-child(3) div p {color: #7353a5;}

.val_area {margin: 80px 0 30px 0;}
.val_area ul {display: flex; flex-direction: column; align-items: flex-end;}
.val_area ul li {position: relative; height: auto; padding: 10px; border-radius: 10px 0 0 0;}
.val_area ul li strong {position: absolute; padding-bottom: 48px; top: -70px; font-size: 22px; letter-spacing: -0.04em; line-height: 1; text-align: center;}
.val_area ul li strong span {font-size: 16px;}
.val_area ul li p {padding: 0px; font-size: 16px; color: #fff; line-height: 1.2em;}
.val_area ul li:nth-child(1) {width: 20%; background-color: #fe4646; border-radius: 10px 10px 0 0;}
.val_area ul li:nth-child(1) strong {width: 100%; color:#fe4646; background: url('../images/sub/val_bg01.png') no-repeat center bottom;}
.val_area ul li:nth-child(1) p {padding-left: 0px; text-align: center;}
.val_area ul li:nth-child(2) {width: 40%; background-color: #cc8600;}
.val_area ul li:nth-child(2) strong {width: 50%; color:#cc8600; background: url('../images/sub/val_bg02.png') no-repeat center bottom;}
.val_area ul li:nth-child(3) {width: 60%; background-color: #0f5f40;}
.val_area ul li:nth-child(3) strong {width: 33.3333%; color:#0f5f40; background: url('../images/sub/val_bg03.png') no-repeat center bottom;}
.val_area ul li:nth-child(4) {width: 80%; background-color: #01a4b2;}
.val_area ul li:nth-child(4) strong {width: 25%; color:#01a4b2; background: url('../images/sub/val_bg04.png') no-repeat center bottom;}
.val_area ul li:nth-child(5) {width: 100%; background-color: #006582; border-radius: 10px 0 10px 10px;}
.val_area ul li:nth-child(5) strong {width: 20%; color:#006582; background: url('../images/sub/val_bg05.png') no-repeat center bottom;}

/* 교육체계 */
.eduSys_h {overflow: hidden; margin-bottom: 30px;}
.eduSys_h ul.left {display: inline-block;}
.eduSys_h ul.left li {display: block;}
.eduSys_h ul.left li + li {margin-top: 10px; margin-left: 0px;}
.eduSys_h ul.left li i {display: inline-block; width: 30px; height: 30px; border-radius: 50%; vertical-align: middle;}
.eduSys_h ul.left li i.eduType01 {border: 3px solid #fdd99b; background: url('../images/sub/edu_type_bg01.png') no-repeat center center;}
.eduSys_h ul.left li i.eduType02 {border: 3px solid #91e0e7; background: url('../images/sub/edu_type_bg02.png') no-repeat center center;}
.eduSys_h ul.left li span {font-size: 15px; color: #000; vertical-align: middle; letter-spacing: -0.04em;}

.eduSys_h ul.right {float: none; margin-top: 20px;}
.eduSys_h ul.right li {display: inline-block;}
.eduSys_h ul.right li + li {padding-left: 50px; background: url('../images/icon/icon_arrow03.png') no-repeat center left 10px;}
.eduSys_h ul.right li span {display: block; height: 35px; padding: 0 20px; line-height: 35px; font-size: 14px; color: #fff; text-align: center; border-radius: 50px;}

ul.eduSys_list {display: block; padding: 0 10px;}
ul.eduSys_list li {display: block; width: inherit;}
ul.eduSys_list li + li {padding-left: 0px; padding-top: 25px;}
ul.eduSys_list li span {display: block; height: 100%; padding: 5px 15px; font-size: 14px; color: #000; word-break: keep-all; border-radius: 10px; background: #fff;}
ul.eduSys_list li span.bg01 {padding-left: 40px; background: url('../images/sub/edu_type_bg01.png') no-repeat center left 15px #fff;}
ul.eduSys_list li span.bg02 {padding-left: 40px; background: url('../images/sub/edu_type_bg02.png') no-repeat center left 15px #fff;}
ul.eduSys_list.type02 li + li {padding-left: 0px; background: url('../images/icon/icon_arrow04.png') no-repeat top -13px center}
ul.eduSys_list + ul.eduSys_list {margin-top: 35px; padding-top: 35px; border-top: 1px solid #000;}

/* 사이트맵 */
.sitemap_area {overflow: hidden;}
.sitemap_area a {word-break: keep-all;}
.sitemap_area > ul {display: flex; flex-wrap: wrap; justify-content: space-between;}
.sitemap_area > ul > li {width: 30%; height: 100%; margin-bottom: 40px;}
.sitemap_area > ul > li > strong {display: block; height: 50px; color: #fff; font-weight: normal; font-size: 16px;  line-height: 50px; text-align: center; background-color: #0e3c5d; border-radius: 5px;}
.sitemap_area > ul > li > ul {margin-top: 15px;}
.sitemap_area > ul > li > ul > li + li {margin-top: 25px;}
.sitemap_area > ul > li > ul > li > a {position: relative; display: block; padding-left: 15px;}
.sitemap_area > ul > li > ul > li > a::before {position: absolute; display: block; content: ""; width: 5px; height: 5px; top: 10px; left: 0px; border-radius: 50%; background-color: #6d889c;}
.sitemap_area > ul > li > ul > li > a > span {font-size: 16px; color: #333333; letter-spacing: -0.04em;}
.sitemap_area > ul > li > ul > li > ul {margin: 10px 0 30px 0; padding: 17px; border: 1px solid #dddddd; border-radius: 5px; background-color: #f4f4f4;}
.sitemap_area > ul > li > ul > li:last-child > ul {margin-bottom: 0px;}
.sitemap_area > ul > li > ul > li > ul > li + li {margin-top: 10px;}
.sitemap_area > ul > li > ul > li > ul > li > a {font-size: 15px; color: #888888; letter-spacing: -0.04em;}
.sitemap_area > ul > li > ul > li > ul > li > a:hover {color: #333;}

/* 동영상영역 */
.player_area {width: 100%; float: none; margin-right: 0px; transition: none;}
.player_area.fold {width: 100%; margin-right: 0px;}
.player_area .player_wrap .youtube_area {margin-bottom: 15px;}
.player_area .player_wrap .youtube_area video {display: block; width: 100%; height: 100%;}
.player_area .player_wrap .youtube_area a.side_fold_btn {display: none;}
.player_area .player_info_area .player_tit_area {padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #dddddd;}
.player_area .player_info_area .player_tit_area > strong {display: block; margin-bottom: 15px; font-size: 22px; color: #000; line-height: 1.2em;}
.player_area .player_info_area .player_tit_area span {display: block; color: #666666;}
.player_area .player_info_area .player_tit_area span strong {font-weight: bold;}

.side_menu_area {position: relative; overflow: hidden; display: block; width: 100%; height: 553px; transition: none;}
.side_menu_area > div.inner > ul.side_menu_tab li a {height: 35px; font-size: 13px; line-height: 35px;}
.side_menu_area > a.side_btn {display: none;}

.side_menu_area > div.inner > div.side_list_box {overflow-y: scroll; height: 522px; background: #f5f5f5;}
.side_menu_area > div.inner > div.side_list_box > ul.type01 > li {padding: 10px 12px; border-bottom: 1px solid #ddd;}
.side_menu_area > div.inner > div.side_list_box > ul.type01 > li:last-child {border-bottom: 0px;}
.side_menu_area > div.inner > div.side_list_box > ul.type01 > li.active {background: #fff;}
.side_menu_area > div.inner > div.side_list_box > ul.type01 > li:hover {background: #fff;}
.side_menu_area > div.inner > div.side_list_box > ul.type01 > li > span {display: inline-block; margin-bottom: 15px; padding: 2px 6px; font-size: 10px; color: #fff; font-weight: bold; border-radius: 50px;}
.side_menu_area > div.inner > div.side_list_box > ul.type01 > li > span.red {background: #ff7575;}
.side_menu_area > div.inner > div.side_list_box > ul.type01 > li > span.blue {background: #01a4b2;}
.side_menu_area > div.inner > div.side_list_box > ul.type01 > li > a {display: block; font-size: 13px; color: #222; line-height: 1.2em;}
.side_menu_area > div.inner > div.side_list_box > ul.type01 > li > a::after {display: inline-block; content: ""; width: 13px; height: 13px; margin-left: 5px; background: url('../images/icon/icon_play02.png') no-repeat center center; vertical-align: middle;}
.side_menu_area > div.inner > div.side_list_box > ul.type01 > li.active > a::after {background: url('../images/icon/icon_play.png') no-repeat center center;}

.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div {padding: 9px 2px; font-size: 13px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div.time {width: 100px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div.info {width: calc(100% - 100px);}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div span + span {padding-top: 10px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div p {width: 100%;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div input[type='text'] {width: 100%; height: 29px; font-size: 13px; line-height: 27px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div input[type='text']::placeholder {font-size: 13px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area {padding: 0px; top: 5px; right: 5px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a {width: 35px; height: 28px; font-size: 13px; border-radius: 5px; line-height: 28px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a + a {border-left: 5px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li a.row_del_btn {width: 18px !important; height: 18px; top: 2px; right: 0px; background: url('../images/icon/icon_delete_bg.png') no-repeat center center #f35858;}

.side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt {padding: 10px;}
.side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt p {font-size: 14px;}

.epilogue_area .rating_area .rating {width: 300px;}
.epilogue_area .rating_area .rating_list {width: calc(100% - 300px);}
.epilogue_area .rating_area .rating_list ul li {width: 20%;}

.epilogue_area .rating_input {display: none;}
}

/* 모바일 큰화면 1.7 */
@media only screen and (max-width: 640px) {

/* 서브페이지 텝메뉴 */
.tab_area {position: relative; margin-bottom: 27px;}
.tab_area a.m_slect {display: block; height: 33px; padding: 0 25px; font-size: 16px; text-align: center; color: #000; border:2px solid #b0d1e9; line-height: 33px; border-radius: 20px; background: url('../images/common/m_menu_arrow_down.png') no-repeat center right 16px #fff; background-size: 11px 7px;}
.tab_area a.m_slect.active {border-radius: 18px 18px 0 0; border-bottom: 0px; background: url('../images/common/m_menu_arrow_up.png') no-repeat center right 16px #e9f3f6; background-size: 11px 7px;}
.tab_area ul {display: none; border: 1px solid #ddd; border-left: 2px solid #b0d1e9; border-right: 2px solid #b0d1e9; border-bottom: 2px solid #b0d1e9; border-radius: 0 0 20px 20px;}
.tab_area ul.active {display: block;}
.tab_area ul li {float: none; flex: none; border: 0px; border-bottom: 1px solid #ddd !important; border-radius: 10px 10px 0 0;}
.tab_area ul li:last-child {border-bottom: 0px !important;}
.tab_area ul li + li {margin-left: 0px;}
.tab_area ul li a {display: block; height: auto; padding: 8px 0; font-size: 16px; color: #000; text-align: center; line-height: normal;}
.tab_area ul li.active {position: relative; border: 0px;}
.tab_area ul li.active::before {content: none;}
.tab_area ul li.active a {font-weight: normal; color: #000;}

/* 더보기 버튼 */
a.moreBtn {display: block; height: 31px; padding: 0 45px; font-size: 15px; font-weight: bold; color: #0e173e; text-align: center; line-height: 31px; border-radius: 20px; background: url('../images/common/m_menu_arrow_down.png') no-repeat center right 16px #f0f6fb; background-size: 11px 7px;}

/* 제목영역 */
.title_area {overflow: hidden; margin-bottom: 18px;}
.title_area.mb10 {margin-bottom: 8px;}
.title_area strong.title {font-size: 18px; color: #000; line-height: 28px;}
.title_area strong.title span {font-size: 13px;}
.title_area strong.title02 {font-size: 17px; color: #000; line-height: 28px;}
.title_area strong.title03 {font-size: 22px; color: #000; line-height: 28px;}
.title_area span.tag {height: 20px; padding: 0 8px; font-size: 13px; line-height: 20px;}
.title_area span.tag + strong {margin-left: 5px;}

/* 오시는길 */
.directions {padding-bottom: 10px;}
.directions + .directions {padding-top: 10px; border-top: 0px;}

.map_area {height: 182px; margin-bottom: 13px;}
.map_info_area {position: relative; font-size: 0px;}
.map_info_area .left {display: block; width: 100%;}
.map_info_area .left::before {position: absolute; display: block; content: ""; width: 4px; height: 100%; top: 0px; left: 0px; border-radius: 10px; background-color: #00A3B1;}
.map_info_area .right {display: block; width: 100%; margin-top: 8px; text-align: left;}
.map_info_area p {padding-left: 15px; font-size: 15px; line-height: 1.6em}
.map_info_area .right dl {display: inline-block; width: 50%; padding: 10px 0 10px 35px; font-size: 14px;}
.map_info_area .right dl.call {background: url('../images/icon/icon_call.png') no-repeat center left; background-size: 25px 25px;}
.map_info_area .right dl.fax {background: url('../images/icon/icon_fax.png') no-repeat center left; background-size: 25px 25px;}
.map_info_area .right dl + dl {margin-left: 0px;}
.map_info_area .right dl dd {padding-left: 16px;}
.map_info_area .right dl dd::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 50%; left: 6px; margin-top: -4px; background-color: #dedede;}

.transport {margin-top: 18px; padding: 11px 13px;}
.transport > strong {display: inline-block; float: none; width: auto; margin-right: 0px; padding-left: 60px; padding-bottom: 0px; font-size: 16px; text-align: center; line-height: 50px;}
.transport.type01 > strong {background: url('../images/common/transport_bg01.png') no-repeat center left 0px; background-size: 44px 44px;}
.transport.type02 > strong {background: url('../images/common/transport_bg02.png') no-repeat center left 0px; background-size: 44px 44px;}
.transport.type03 > strong {background: url('../images/common/transport_bg03.png') no-repeat center left 0px; background-size: 44px 44px;}
.transport > ul {margin-top: 10px; padding-top: 17px; border-top: 1px solid #dedede;}
.transport > ul p.title {margin-bottom: 15px; font-size: 15px;}
.transport > ul p.title > strong {display: block; font-size: 16px;}
.transport > ul strong.title01 {margin-bottom: 13px; font-size: 16px;}
.transport > ul strong.title02 {font-size: 14px;}
.transport > ul strong.title02 + p {margin-top: 8px;}
.transport > ul > li {padding: 18px 0;}
.transport > ul > li > dl {font-size: 14px;}
.transport > ul > li > dl + dl {margin-top: 5px;}
.transport > ul > li > dl > dt {float: left;}
.transport > ul > li > dl > dd {position: relative; overflow: hidden; display: block; padding-left: 15px;}
.transport > ul > li > dl > dd::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 7px; left: 7px; margin-top: 0px; background-color: #dedede;}
.transport > ul > li > p {font-size: 14px; line-height: 1.6em; word-break: keep-all;}

.con_charge_area {margin-top: 18px; padding: 11px;}
.con_charge_area > span {display: block; padding: 9px 0 9px 53px; font-size: 13px; background: url('../images/common/charge_bg01.png') no-repeat center left; background-size: 35px 35px;}
.con_charge_area > ul {overflow: hidden; display: inline-block; width: 100%; margin: 9px 0 0 0; padding: 9px 0 0 0; border-left: 0px; border-top: 1px solid #dddddd;}
.con_charge_area > ul > li {overflow: hidden;}
.con_charge_area > ul > li + li {margin-top: 9px; padding-top: 9px; border-top: 1px solid #dddddd;}
.con_charge_area > ul > li > ul {display: block; width: 100%;}
.con_charge_area > ul > li > ul > li {overflow: hidden; display: inline-block; float: left; width: 50%; flex: none; font-size: 13px;}
.con_charge_area > ul > li > ul > li:nth-child(3) {margin-top: 5px;}
.con_charge_area > ul > li > ul > li > strong {display: block; float: left;}
.con_charge_area > ul > li > ul > li > span {position: relative; overflow: hidden; display: block; padding-left: 22px; color: #888888;}
.con_charge_area > ul > li > ul > li > span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 5px; left: 11px; margin-top: 0px; background-color: #dddddd;}

.pdfViewer {overflow: hidden; width: 100%; height: 203px; margin-top: 24px; border-radius: 10px; background-color: #f1f1f1;}
.pdfViewer p {font-size: 19px; color:#333333; font-weight: bold; text-align: center; letter-spacing: -0.04em; line-height: 203px;}

/* 달력 */
#calendar {max-width: none; margin-top: 18px;}
#calendar .fc-toolbar {display: block;}
#calendar .fc-toolbar.fc-header-toolbar {position: relative; margin-bottom: 18px;}
#calendar .fc-today-button {background-color: #76828e; border: 1px solid #76828e;}
#calendar .fc-toolbar-title {color: #1d2127; font-weight: normal; font-size: 18px; text-align: center;}
#calendar .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk:nth-child(1) {position: absolute; bottom: 0px;}
#calendar .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk:nth-child(2) {margin-bottom: 5px;}
#calendar .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk:nth-child(3) {float: right;}
#calendar .fc-button,
#calendar .fc-button .fc-icon {font-size: 11.5px;}
.fc-direction-ltr .fc-toolbar>*>:not(:first-child) {margin-left: 5px;}

/* 지도, 테이블영역 */
.centerInfo_area {margin: 20px 0 26px 0;}
.centerInfo_area .korMaplistArea {margin-bottom: 20px;}
.centerInfo_area .korMaplistArea ul li {width: calc(25% - 5px); margin: 0 0 5px 5px;}
.centerInfo_area .korMaplistArea ul li:nth-child(5n-4) {margin-left: 5px;}
.centerInfo_area .korMaplistArea ul li:nth-child(4n-3) {margin-left: 0px;}
.centerInfo_area .korMaplistArea ul li a {height: 28px; font-size: 14px; line-height: 26px;}
.centerInfo_area .table_area {max-height: 376px;}

/* 소속 확인 */
.inquiry_area {overflow: hidden;}
.inquiry_area > strong {display: block; padding: 0 0 18px 0; font-size: 19px; color: #000; text-align: center; border-bottom: 1px solid #dddddd;}
.inquiry_area > p {margin: 20px 0 24px 0; font-size: 14px; color: #333; text-align: center; line-height: 2em; word-break: keep-all;}
.inquiry_area > p > strong {font-size: 18px;}
.inquiry_area > p > strong > span {color: #01a4b2;}
.inquiry_area > p > span {font-size: 14px;}
.inquiry_area > p + .tip_txt {margin-top: 30px;}
.inquiry_area > strong + .tip_txt {margin-top: 30px;}
.inquiry_area > .inquiry_input_area {margin: 0 0 20px 0; padding: 23px 0; border: 1px solid #ddd; border-radius: 15px;}
.inquiry_area > .inquiry_input_area > div {overflow: hidden; width: 315px; margin: 0 auto;}
.inquiry_area > .inquiry_input_area > div strong {display: block; margin-bottom: 10px; font-size: 15px; color: #434343;}
.inquiry_area > .inquiry_input_area > div > div.selectBox02 {width: 100%; margin-bottom: 18px;}
.inquiry_area > .inquiry_input_area > div > div.selectBox02 select {width: 100%; height: 41px; padding: 0 35px 0 20px; font-size: 14px; border: 0px; background: url('../images/icon/icon_select_arrow.png') no-repeat center right 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_name {width: 100%; height: 41px; margin-bottom: 18px; background: url('../images/icon/icon_id.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_name input[type='text'] {width: 100%; height: 41px; padding: 0 20px 0 40px; background: transparent; border: 0px;}
.inquiry_area > .inquiry_input_area > div > div.input_number {width: 100%; height: 41px; margin-bottom: 18px; padding: 0 20px 0 40px; font-size: 0px; background: url('../images/icon/icon_password.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_number input {width: 45%; height: 41px; font-size: 14px; color: #888888; background: transparent; border: 0px; vertical-align: middle;}
.inquiry_area > .inquiry_input_area > div > div.input_number input::placeholder {font-size: 14px; color: #777777;}
.inquiry_area > .inquiry_input_area > div > div.input_number span {display: inline-block; width: 10%; font-size: 16px; text-align: center; vertical-align: middle;}
.inquiry_area > .inquiry_input_area > div > div.input_birth {width: 100%; height: 41px; margin-bottom: 18px; padding: 0 20px 0 40px; font-size: 0px; background: url('../images/icon/icon_calendar.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_birth input[type='text'] {width: 100%; height: 41px; background: transparent; border: 0px;}
.inquiry_area > .inquiry_input_area > div > div.input_txt {width: 100%; height: 41px; margin-bottom: 18px; padding: 0 20px 0 40px; font-size: 0px; background: #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_txt input[type='text'] {width: 100%; height: 41px; background: transparent; border: 0px;}

.inquiry_area > .inquiry_table {width: 100%; margin: 17px auto;}
.inquiry_area > .inquiry_table > div.table_area > table.list thead th {padding: 8px 3px; font-size: 14px;}
.inquiry_area > .inquiry_table > div.table_area > table.list tbody td {padding: 5px 3px; font-size: 14px;}

ul.certify_list {display: block; width: 320px; margin: 0 auto; text-align: center;}
ul.certify_list li {display: block; font-size: 0px;}
ul.certify_list li + li {margin-top: 18px;}
ul.certify_list li a {width: 100%; height: 41px; line-height: 41px; font-size: 16px;}
ul.certify_list li a.naver {color: #333333; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/common/login_naver2.png') no-repeat center left 25px #FFFFFF;}
ul.certify_list li a.pass {background: url('../images/common/login_pass.png') no-repeat center left 15px #8951ff;}
ul.certify_list li a.onepass {background: url('../images/common/login_onepass.png') no-repeat center left 15px #1c2674;}
ul.certify_list li a.kakao_login {color: #333333; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/common/ico_login_kakao.png') no-repeat center left 15px #FFFFFF; background-size: 13%;}
 ul.certify_list li a.ogcr {color: #333333; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/icon/icon_lock.png') no-repeat center left 29px #FFFFFF;}
 ul.certify_list li a.oacx {color: #FFFFFF; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/icon/icon_certificate.png') no-repeat center left 29px #374151;}
ul.certify_list li a span {padding-left: 90px; }
ul.certify_list li a span::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 20px; top: 50%; left: 70px; background-color: #dddddd; transform: translate(0, -50%);}

p.warning {margin: 23px 0; font-size: 14px; color: #ef7572; text-align: center; letter-spacing: -0.04em;}

a + div.joinChk_area {margin-top: 23px;}
.joinChk_area + .genderChk_area {margin-top: 18px;}
.genderChk_area {margin-bottom: 18px;}
.inquiry_area > .inquiry_input_area > div > div.gender_area {margin-bottom: 23px;}
.inquiry_area > .inquiry_input_area > div > div.joinChk_area {padding-top: 23px; border-top: 1px solid #dddddd;}
.label_radio {font-size: 14px;}
.label_radio input.radio {display: inline-block; position: relative; width: 18px; height: 18px; border: 1px solid #d2d2d2; border-radius: 50%; vertical-align: middle; cursor: pointer;}
.label_radio input.radio:checked {border: 1px solid #01a4b2; background: url('../images/icon/check_radio.png') no-repeat center center; background-size: 8px;}
.label_radio input.radio + span {margin-right: 8px;}
.label_radio + .label_radio {margin-left: 17px;}

.label_check {font-size: 0px;}
.label_check input.chk {width: 18px; height: 18px;}
.label_check input.chk:checked {background: url('../images/icon/check_chk.png') no-repeat center center;}
.label_check input.chk + span {margin-left: 8px; font-size: 14px;}

/* 달력선택 */
div.calendar_input_area {position: relative; overflow: hidden; padding: 0 45px 0 10px; border: 1px solid #dddddd; border-radius: 20px; background-color: #fff; vertical-align: middle;}
div.calendar_input_area input {width: 100%; font-size: 14px; text-indent: 0; border: 0px; background: transparent; letter-spacing: -0.06em;}
div.calendar_input_area input::placeholder {font-size: 14px; letter-spacing: -0.06em;}
div.calendar_input_area a {position: absolute; display: inline-block; width: 14px; height: 14px; font-size: 0px; top: 6px; right: 15px; background: url('../images/icon/icon_calendar.png') no-repeat center center; background-size: cover;}

/* 첨부파일 */
.add_file_area {overflow: hidden; margin-bottom: 12px;}
.add_file_area strong {display: block; margin: 0 0 12px 0; padding: 17px 0; font-size: 14px; color:#333; letter-spacing: -0.04em; border-bottom: 1px solid #ababab;}

/* 답변영역 */
.replay_area {overflow: hidden; margin-bottom: 12px;}
.replay_area .replay_header {overflow: hidden; position: relative; margin-top: 23px; margin-bottom: 15px;}
.replay_area .replay_header strong {font-size: 15px; color: #333; letter-spacing: -0.04em;}
.replay_area .replay_header div {position: absolute; top: 0px; right: 0px;}
.replay_area .replay_header div span {font-size: 14px; color: #999; letter-spacing: -0.04em;}
.replay_area .replay_header div span + span {position: relative; padding-left: 15px;}
.replay_area .replay_header div span + span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 5px; left: 6px; background-color: #dddddd;}
.replay_area .replay_box {padding: 18px 15px; font-size: 14px; color: #222; line-height: 1.6em; border: 1px solid #dddddd;}

/* 전체교육 교육링크 영역 */
.edu_link_area {overflow: hidden; margin-bottom: 20px; font-size: 0px;}
.edu_link_area li {display: inline-block; width: calc(50% - 6px); margin-bottom: 12px; vertical-align: top;}
.edu_link_area li + li {margin-left: 0px;}
.edu_link_area li:nth-child(even) {margin-left: 12px;}
.edu_link_area li div {position: relative; width: 100%; height: 82px; padding: 12px; background-color: #f4f4f4; border-radius: 12px;}
.edu_link_area li div strong {display: block; padding-right: 18px; font-size: 14px; word-break: keep-all; line-height: 1.4em; background: url('../images/icon/icon_link_bg.png') no-repeat top 2px right; background-size: 15px;}
.edu_link_area li div a {position: absolute; bottom: 10px; left: 10px; font-size: 12px; color: #777777; letter-spacing: -0.04em;}

/* 신청서작성 - 스텝 */
div.step_box {height: 70px; margin-bottom: 24px;}
div.step_box ul::before {height: 3px; top: 24px;}
div.step_box ul li:nth-child(2).active::before {top: 24px;}
div.step_box ul li:nth-child(3).active::before {top: 24px;}
div.step_box ul li:nth-child(4).active::before {top: 24px;}
div.step_box.step03 ul::before {height: 3px; top: 24px;}
div.step_box.step03 ul li:nth-child(2).active::before {top: 24px;}
div.step_box.step03 ul li:nth-child(3).active::before {top: 24px;}
div.step_box.step06 ul::before {top: 24px;}
div.step_box ul li span {padding-top: 40px; font-size: 13px;}
div.step_box ul li span::before {width: 14px; height: 14px; top: 18px; margin: 0px 0 0 -7px;}
div.step_box ul li span::after {width: 8px; height: 8px; top: 21px; margin: 0px 0 0 -4px;}
div.step_box ul li em {padding-bottom: 5px; font-size: 12px;}
div.step_box ul li.active ~ li span::before {width: 14px; height: 14px; top: 18px; margin: 0px 0 0 -7px;}
div.step_box ul li.active ~ li span::after {width: 8px; height: 8px; top: 21px; margin: 0px 0 0 -4px;}

div.step_box02 {margin-bottom: 24px;}
div.step_box02 ul {height: 35px;}
div.step_box02 ul li span {font-size: 15px; line-height: 35px;}
div.step_box02 ul li.active:nth-child(1)::before {width: 21px; height: 35px; right: -17px; background: url('../images/common/step_box02_bg.png') no-repeat center center; background-size: cover;}
div.step_box02 ul li.active:nth-child(2)::after {width: 21px; height: 35px; left: -2px; background: url('../images/common/step_box02_bg02.png') no-repeat center center; background-size: cover;}


/* 스크롤박스 */
.scrollBox {height: 135px; margin-bottom: 17px; padding: 17px; font-size: 14px; line-height: 1.6em;}

/* 신청서작성 과정설명 영역 */
.edu_info_box {margin-bottom: 24px;}
.edu_info_box .edu_info_con {min-height: auto;}
.edu_info_box .edu_info_con p.edu_sort {margin: 12px; font-size: 13px;}
.edu_info_box .edu_info_con .thumbnailBox {width: 117px; height: 117px; margin-right: 18px;}
.edu_info_box .edu_info_con .thumbnailBox a.like {width: 16px; height: 14px; bottom: 13px; right: 12px; background: url('../images/icon/icon_like.png') no-repeat center center; background-size: cover;}
.edu_info_box .edu_info_con .thumbnailBox a.like.active {background: url('../images/icon/icon_like_active.png') no-repeat center center; background-size: cover;}
.edu_info_box .edu_info_con .txt_con {overflow: hidden; padding: 0px 13px; margin-bottom: 13px;}
.edu_info_box .edu_info_con strong.title {margin-bottom: 10px; font-size: 18px;}
.edu_info_box .edu_info_con span.tag {margin-bottom: 10px; padding: 2px 10px; font-size: 13px;}
.edu_info_box .edu_info_con p {font-size: 14px; margin-bottom: 0px;}
.edu_info_box .edu_info_con ul.period_list {display: block; margin-bottom: 10px; padding: 0px 13px;}
.edu_info_box .edu_info_con ul.period_list li {font-size: 13px;}
.edu_info_box .edu_info_con ul.period_list li + li {margin-top: 2px;}
.edu_info_box .edu_info_con ul.period_list li strong + span {padding-left: 15px;}
.edu_info_box .edu_info_con ul.period_list li strong + span::before {top: 5px; left: 6px;}
.edu_info_box .edu_info_con p.price {padding: 17px 10px; font-size: 14px;}
.edu_info_box .edu_info_con p.price strong {font-size: 18px;}
.edu_info_box .edu_info_con span.state_txt {bottom: 20px; left: 10px; font-size: 13px;}

a.edu_request_btn {height: 45px; margin-top: 18px;}
a.edu_request_btn span {font-size: 16px; line-height: 43px;}
a.edu_request_btn span::before {width: 30px; height: 30px; top: 6.5px; left: 10px; background: url('../images/icon/icon_edubtn_bg.png') no-repeat center center #cc8600; background-size: 16px;}
p.edu_txt {display: block; margin: 17px 0 0 0px; font-size: 14px;}
p.edu_txt + a.btn01 {height: 21px; margin: 10px 0 0 0px; line-height: 21px; font-size: 13px;}
ul.view_count_area {position: absolute; top: auto; right: auto; bottom: 20px; left: 10px;}
ul.view_count_area li {font-size: 13px;}
ul.view_count_area li + li {position: relative; padding-left: 30px;}
ul.view_count_area li + li::before {position: absolute; content: ""; width: 1px; height: 10px; top: 6px; left: 10px; background: #dddddd;}
ul.view_count_area li a.like {width: 13px; height: 12px; left: 16px; top: 4px; background: url('../images/icon/icon_like.png') no-repeat center center; background-size: cover;}

/* 신청서작성 완료화면 */
.complete_area {width: 100%; margin: 0 auto;}
.complete_area p {font-size: 18px; padding-bottom: 88px; background: url('../images/sub/complete_bg.png') no-repeat bottom center; background-size: 66px 66px;}
.complete_area.type02 > strong {font-size: 18px;}
.complete_area.type02 p {font-size: 16px; padding-bottom: 88px; background: url('../images/sub/complete_bg.png') no-repeat bottom center; background-size: 66px 66px;}
.complete_area.type02 strong + p {margin-top: 15px;}
.complete_area > div {margin-top: 26px;}
.complete_area > div a {width: calc(50% - 9px); height: 31px; font-size: 14px; line-height: 29px; border-radius: 5px;}
.complete_area > div a::before {font-size: 15px; top: 0; right: 20px;}
.complete_area > div a + a {margin-left: 18px;}
.complete_area > div a span {padding-left: 30px;}
.complete_area.type03 {width: 100%;}
.complete_area.type03 > strong {font-size: 18px;}
.complete_area.type04 {width: 100%;}
.complete_area.type04 > strong {font-size: 18px;}
.txt_box {margin-bottom: 18px; padding: 20px 18px;}
.txt_box p {margin-bottom: 18px; font-size: 15px;}

/* 이용약관 */
.clause_area div.txtbox01 {margin-bottom: 30px; padding: 18px;}
.clause_area div.txtbox01 p {font-size: 15px;}
.clause_area ul > li:first-child {padding-top: 0px;}
.clause_area ul > li {padding: 0 0 30px 0; border-bottom: 0px;}
.clause_area ul > li .mb10 {margin-bottom: 13px;}
.clause_area ul > li strong.tit01 {font-size: 17px;}
.clause_area ul > li strong.tit02 {font-size: 14px;}
.clause_area ul > li p {font-size: 14px;}
.clause_area ol {font-size: 14px;}
.clause_area ol > li {margin-top: 2px;}

/* 수강신청 - 교육상세 구분 */
.con_line {margin-bottom: 25px;}
.con_line .con_slide_area .swiper-container {width: 100%;}
.con_line .con_slide_area .page_btn_area {margin-top: 16px; z-index: 100;}
.con_line .con_slide_area .page_btn_area a {width: 32px; height: 32px;}
.youtube_area {display: block; width: 100%; height: 100%; margin: 0 auto 17px;}

/* 수강신청 - 교육상세 */
.book_info_area {position: relative; margin-bottom: 20px; padding-bottom: 153px;}
.book_info_area .book_photo {width: 87px; height: 126px;}
.book_info_area .book_info_box {display: inline-block; width: calc(100% - 105px); margin-left: 18px; vertical-align: top;}
.book_info_area .book_info_box strong.tit {font-size: 18px;}
.book_info_area .book_info_box span.tag {margin: 2px 5px 0 0; font-size: 11px;}
.book_info_area .book_info_box span.tag + strong.tit {width: calc(100% - 135px);}
.book_info_area .book_info_box ul {margin-top: 10px; margin-bottom: 10px;}
.book_info_area .book_info_box ul li {width: 100%; margin-bottom: 8px;}
.book_info_area .book_info_box ul li span.tit {width: 48px; height: 18px; margin-right: 8px; font-size: 13px; line-height: 16px;}
.book_info_area .book_info_box ul li span.txt {margin-left: 10px; font-size: 14px; color: #000; line-height: 1.2em;}
.book_info_area .book_info_box p.price {margin-bottom: 0px; font-size: 13px;}
.book_info_area .book_info_box p.price span {font-size: 14px;}
.book_info_area .book_info_box p.price strong {margin-left: 10px; font-size: 18px;}
.book_info_area .book_info_box div.txt_box02 {overflow-y: scroll; width: 100%; border: 1px solid #dddddd; border-radius: 5px; position: absolute; height: 135px; bottom: 0px; left: 0px; padding: 10px; font-size: 14px;}

 /*교육상세 - 강사정보 20220919추가 */
 .edu_instrctr_box > div {position: relative;}
 .edu_instrctr_box .instrctr_info_con {min-height: auto; margin-left: 120px;}
 .edu_instrctr_box .instrctr_info_con strong.title {font-size: 15px}
 .edu_instrctr_box .instrctr_info_con .txt_con {overflow: hidden; padding: 0px 13px}
 .edu_instrctr_box .instrctr_info_con .imgBox {width: 117px;}
 .edu_instrctr_box .instrctr_info_con .editor_area {overflow: hidden; font-size: 14px;}

/* 수강신청 - 수강후기 */
.epilogue_area .rating_area .rating {position: relative; display: block; width: 100%; float: none; margin-bottom: 18px;}
.epilogue_area .rating_area .rating strong {margin-top: 0px; font-size: 30px;}
.epilogue_area .rating_area .rating_list {display: none; }

.epilogue_area .rating_area + .comment_area {margin-top: 17px;}
.epilogue_area .comment_area {margin-bottom: 0px;}
.epilogue_area .comment_area ul {margin-bottom: 17px; font-size: 0px;}
.epilogue_area .comment_area ul li {position: relative; padding: 17px;}
.epilogue_area .comment_area ul li + li {margin-top: 17px;}
.epilogue_area .comment_area ul li div.comment_left {display: block; width: 100% !important; font-size: 14px;}
.epilogue_area .comment_area ul li div.comment_left strong {}
.epilogue_area .comment_area ul li div.comment_left span {padding-left: 20px;}
.epilogue_area .comment_area ul li div.comment_left strong + span::before {left: -10px; height: 10px;}
.epilogue_area .comment_area ul li div.comment_right {display: block; width: 100%; padding: 0px; font-size: 14px;}
.epilogue_area .comment_area ul li div.comment_right p {display: inline-block; float: none; width: 100%; margin-top: 15px; padding: 0;}

.epilogue_area .comment_area.type02 ul li {overflow: hidden; margin-top: 10px;}
.epilogue_area .comment_area.type02 ul li:first-child div.comment_left .rating_box {position: relative; top: auto; right: auto;}
.epilogue_area .comment_area.type02 ul li div.comment_left {display: block; float: none; width: 100%;}
.epilogue_area .comment_area.type02 ul li div.comment_left span + .rating_box {margin-left: 20px;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_top + div.comment_bottom {margin-top: 30px;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn {display: inline-block; margin-top: 10px; font-size: 13px; color: #0e173e;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn span {padding: 0 20px 0 0; background: url('../images/icon/icon_acc_arrow02.png') no-repeat center right;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn.closed span {padding: 0 20px 0 0; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right;}
.epilogue_area .comment_area.type02 ul li div.comment_left + div.comment_right {margin-top: 10px;}
.epilogue_area .comment_area.type02 ul li div.comment_right {display: block; width: 100%; padding-left: 0px; text-align: center;}
.epilogue_area .comment_area.type02 ul li div.comment_right a {width: 49%;}
.epilogue_area .comment_area.type02 ul li div.comment_right a + a {margin-top: 0px;}
.epilogue_area .comment_area.type02 ul li div.comment_right a + span {display: block; margin-top: 10px; font-size: 13px; text-align: right;}

.epilogue_area .rating_box {position: absolute; top: 20px; right: 20px; width: auto;}
.epilogue_area .rating_box a {display: inline-block; float: left; width: 18px; height: 18px; font-size: 0px; background: url('../images/icon/icon_star.png') no-repeat center center; background-size: cover;}
.epilogue_area .rating_box a + a {margin-left: 2px;}
.epilogue_area .rating_box a.active {background: url('../images/icon/icon_star_active.png') no-repeat center center; background-size: cover;}
.epilogue_area .rating_area .rating .rating_box {position: relative; overflow: hidden; display: inline-block; width: auto; top: auto; right: auto; text-align: center;}

.epilogue_area .rating_box span {display: inline-block; float: left; width: 18px; height: 18px; font-size: 0px; background: url('../images/icon/icon_star.png') no-repeat center center; background-size: cover;}
.epilogue_area .rating_box span + span {margin-left: 2px;}
.epilogue_area .rating_box span.active {background: url('../images/icon/icon_star_active.png') no-repeat center center; background-size: cover;}

 /* 게시글(추천, 비추천) */
 .ntt_exprs_area {display: flex; justify-content: center; font-size: 15px; padding: 15px; width: 100% !important;}
 .ntt_exprs_area .ntt_exprs_btn_area {display: flex; justify-content: center;}
 .ntt_exprs_area .ntt_exprs_btn_area .exprs_text{margin-left: 3px; font-size: 13px;}
 .ntt_exprs_area .ntt_exprs_btn_area .good_btn{display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(109, 109, 109, 0.53); border-radius: 25px; padding: 10px;}
 .ntt_exprs_area .ntt_exprs_btn_area .good_btn.on {display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(4, 36, 168, 0.4); border-radius: 25px; padding: 10px;}
 .ntt_exprs_area .ntt_exprs_btn_area .bad_btn{display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(97, 96, 96, 0.53); border-radius: 20px; padding: 10px;}
 .ntt_exprs_area .ntt_exprs_btn_area .bad_btn.on {display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(4, 36, 168, 0.4); border-radius: 20px; padding: 10px;}
 .ntt_exprs_area .ntt_exprs_btn_area .good_btn .good_icon { background: url('../images/icon/icon_good.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}
 .ntt_exprs_area .ntt_exprs_btn_area .bad_btn .bad_icon { background: url('../images/icon/icon_bad.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}
 .ntt_exprs_area .ntt_exprs_btn_area .good_btn .good_icon.on { background: url('../images/icon/icon_good_on.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}
 .ntt_exprs_area .ntt_exprs_btn_area .bad_btn .bad_icon.on { background: url('../images/icon/icon_bad_on.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}

/* 기관전용 - 일괄회원가입 */
.tip_txt {margin-top: 40px; margin-bottom: 24px; padding: 40px 18px 18px;}
.tip_txt .tit {top: -17px; left: 18px;}
.tip_txt .tit > strong {height: 34px; padding: 4px 10px 4px 30px; font-size: 18px;}
.tip_txt .tit > strong::before {width: 37px; height: 41px; top: -2px; left: -17px; background: url('../images/icon/icon_exclamation.png') no-repeat center center;}
.tip_txt .tit > strong::after {width: 27px; height: 34px; top: 0px; right: -27px; background: url('../images/common/tip_txt_bg.png') no-repeat center center;}
.tip_txt > ol > li {font-size: 15px; word-break: keep-all; line-height: 1.2em;}
.tip_txt > ol > li + li {margin-top: 5px;}
.tip_txt > div.con {padding: 0px; background: none;}
.tip_txt > div.con > p {font-size: 15px;}
.tip_txt > div.con > p + ul {margin-top: 16px;}
.tip_txt > div.con > ul > li {padding-left: 15px; font-size: 15px;}
.tip_txt > div.con > ul > li + li {margin-top: 3px;}
.tip_txt > div.con > ul > li::before {position: absolute; display: inline-block; content: ""; width: 6px; height: 6px; top: 9px; left: 0px; background-color: #49e3cb;}
.tip_txt > div.con > p.tip_p {font-size: 13px; word-break: keep-all;}
.tip_txt > div.con > p.tip_p + p.tip_p {margin-top: 10px;}
.tip_txt > div.con > .edu_step {margin-top: 10px;}
.tip_txt > div.con > .edu_step > strong {font-size: 14px; margin-right: 0px;}
.tip_txt > div.con > .edu_step > ul.tip_step_list {display: block; width: 100%; margin: 10px auto; padding: 0 20px; text-align: left; }
.tip_txt > div.con > .edu_step > ul.tip_step_list li {padding: 10px 0;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li strong {font-size: 13px;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li + li {padding-left: 30px; background: url('../images/icon/icon_arrow05.png') no-repeat center left 7px;}


/* 기관전용 - 일괄수정신청내역상세 */
div.tbl_dl dl + dl {margin-top: 3px;}
div.tbl_dl dl > dt {width: 60px; font-size: 14px;}
div.tbl_dl dl > dd {width: calc(100% - 60px); font-size: 14px; padding-left: 10px;}

.div_dl_area {margin-bottom: 23px; padding: 10px 15px;}
.div_dl_area dl {display: block; width: 100%;}
.div_dl_area dl + dl {margin-top: 10px;}
.div_dl_area dl dt {width: 110px; font-size: 14px;}
.div_dl_area dl dd {width: calc(100% - 110px); font-size: 14px;}

/* 알림함 */
.accordion_list {margin-bottom: 18px;}
.accordion_list ul li div.accordion_info {width: 100%; padding: 15px 0px 15px 50px; background: url('../images/icon/icon_alarm_bg.png') no-repeat top 15px left 0px; background-size: 32px;}
.accordion_list ul li div.accordion_info.kakao {background: url('../images/icon/icon_kakao_bg.png') no-repeat top 15px left 0px; background-size: 32px;}
.accordion_list ul li div.accordion_info span {position: relative; display: block; top: auto; left: auto; font-size: 13px; text-align: left;}
.accordion_list ul li div.accordion_info a.tit {margin-left: 0px; width: 100%; font-size: 15px; }
.accordion_list ul li div.accordion_con {display: none; width: 100%; margin-left: 50px; padding-bottom: 20px; font-size: 13px;}
.accordion_list ul li div.accordion_con a.acc_close {margin-top: 20px; padding-right: 20px; font-size: 13px; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right;}

/* 로그인 */
.txt_box_bg {min-height: 84px; margin-bottom: 24px; padding: 18px 0; border-radius: 15px; background: url('../images/common/txt_box_bg.png') no-repeat bottom right;}
.txt_box_bg p {font-size: 15px;}
.txt_box_bg p strong {font-size: 21px;}
.login_area > p {font-size: 14px;}
.login_area > strong.login_txt {font-size: 18px;}
.login_area > p.login_txt {font-size: 15px;}
.login_area > strong.login_txt + p.login_txt {margin-top: 18px;}
.login_area > p.login_txt + div {margin: 35px auto 0;}
.login_area > div {max-width: 320px; width: 100%; margin: 24px auto 0;}
.login_area > div > div.input_name {width: 100%; height: 41px; margin-bottom: 18px; background: url('../images/icon/icon_id.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.login_area > div > div.input_name input[type='text'] {width: 100%; height: 41px; padding: 0 20px 0 40px; background: transparent; border: 0px;}
.login_area > div > ul.certify_list {margin-bottom: 10px;}
.login_area > div > div.login_link_area {margin-bottom: 30px;}
.login_area > div > div.login_link_area a {font-size: 14px;}
.login_area > div > div.login_link_area a + a {padding-left: 15px;}
.login_area > div > div.login_link_area a + a::before {position: absolute; display: inline-block; content: ""; width: 2px; height: 9px; top: 7px; left: 5px; background-color: #e6e6e6;}

/* 회원가입 이용약관 */
.policy_area + .policy_area {margin-top: 30px;}

/* 나의수강현황 */
.myedu_con .left_con > ul.type01 {height: 130px; margin-bottom: 25px;}
.myedu_con .left_con > ul.type01 > li {padding: 14px 17px;}
.myedu_con .left_con > ul.type01 > li > strong {margin-bottom: 15px; font-size: 18px;}
.myedu_con .left_con > ul.type01 > li > p { font-size: 13px;}
.myedu_con .left_con > ul.type01 > li > p + p {margin-top: 4px;}
.myedu_con .left_con > ul.type01 > li > p strong {font-size: 15px;}
.myedu_con .left_con > ul.type01 > li:nth-child(2) p + p {margin-top: 9px;}
.myedu_con .left_con > ul.type02 {height: 190px; margin-bottom: 25px;}
.myedu_con .left_con > ul.type02 > li {float: left; width: 33.3333%; padding: 20px 10px 0;}
.myedu_con .left_con > ul.type02 > li > strong {margin-bottom: 5px; font-size: 15px;}
.myedu_con .left_con > ul.type02 > li > a {position: absolute; display: block; width: 100%; height: 36px; bottom: 0px; left: 0px; text-align: center; border-top: 1px solid #dddddd; background-color: #eeeeee;}
.myedu_con .left_con > ul.type02 > li > a span {padding-right: 20px; font-size: 13px; line-height: 36px; color: #666666; background: url('../images/icon/icon_link_bg.png') no-repeat center right;}
.myedu_con .left_con > ul.type02 > li > p {font-size: 13px;}
.myedu_con .left_con > ul.type02 > li > p > span {font-size: 14px;}
.myedu_con .left_con > ul.type02 > li > p > strong {font-size: 14px;}
.myedu_con .left_con > ul.type02 > li > p + p {margin-top: 5px;}
.myedu_con .right_con div.table_area {height: 365px;}
.edu_th_list {width: 820px; margin: 0 0 15px 130px;  font-size: 0px;}
.edu_th_list li {width: 117px;}
.edu_th_list li span {padding-top: 75px; font-size: 14px;}
.edu_th_list li span::before {width: 70px; height: 70px; left: 50%; margin-left: -35px;}
.edu_th_list li span.bg01::before {background: url('../images/sub/edu_tbl_bg01.png') no-repeat center center #fff; background-size: 70px;}
.edu_th_list li span.bg02::before {background: url('../images/sub/edu_tbl_bg02.png') no-repeat center center #fff; background-size: 70px;}
.edu_th_list li span.bg03::before {background: url('../images/sub/edu_tbl_bg03.png') no-repeat center center #fff; background-size: 70px;}
.edu_th_list li span.bg04::before {background: url('../images/sub/edu_tbl_bg04.png') no-repeat center center #fff; background-size: 70px;}
.edu_th_list li span.bg05::before {background: url('../images/sub/edu_tbl_bg05.png') no-repeat center center #fff; background-size: 70px;}
.edu_th_list li span.bg06::before {background: url('../images/sub/edu_tbl_bg06.png') no-repeat center center #fff; background-size: 70px;}
.edu_th_list li span.bg07::before {background: url('../images/sub/edu_tbl_bg07.png') no-repeat center center #fff; background-size: 70px;}
.con_line .con_left + .con_right {margin: 30px 0 0 0px;}

.bg_box {margin-bottom: 20px; padding: 15px 30px; border-radius: 5px; background-color: #f4f4f4;}
.bg_box .calendar_box {width: 100%;}
.bg_box .calendar_box .calendar_input_area {width: 100%;}
.bg_box .calendar_box span {display: block; text-align: center;}
.sign_btn {width: 180px; height: 83px; border-radius: 10px;}
.sign_btn a {padding: 10px; font-size: 14px;}

.sign_area {width: 100%; height: 180px; margin: 25px auto;}

/* 퍼센트영역 */
.percent_list_area {margin-bottom: 23px;}
.percent_list_area ul li {width: 50%; height: 65px;}
.percent_list_area ul li > div {padding: 16px 15px;}
.percent_list_area ul li div span {font-size: 13px;}
.percent_list_area ul li div strong {margin-top: 10px; font-size: 15px;}
.percent_list_area ul li div span + strong {margin-top: 5px;}
.percent_list_area ul li div div.percent {width: 38px; height: 38px; top: 15px; right: 12px; }

/* 과제목록 - 북러닝 */
.edu_list {margin-bottom: 18px;}
.edu_list > ul > li + li {margin-top: 24px;}
.edu_list > ul > li > div {padding: 26px 12px 18px;}
.edu_list > ul > li > div > span.txt_tag {position: absolute; display: inline-block; height: 19px; padding: 0 10px; top: -6px; left: 27px; font-size: 13px; color:#01a4b2; line-height: 17px; border: 1px solid #01a4b2; border-radius: 10px; background-color: #ffffff;}
.edu_list > ul > li > div > .num_area {position: relative; flex-basis: auto; text-align: left; border-right: 0;}
.edu_list > ul > li > div > .num_area strong {position: relative; top: auto; left: auto; font-size: 15px;}
.edu_list > ul > li > div > .con_area {position: relative; padding: 0; flex-basis: auto; width: 100%;}
.edu_list > ul > li > div > .con_area .con_inner_area01 {padding: 0px 40px 0px 0;}
.edu_list > ul > li > div > .con_area .con_inner_area01 > strong {font-size: 16px;}
.edu_list > ul > li > div > .con_area .con_inner_area01 > ul {margin-top: 5px;}
.edu_list > ul > li > div > .con_area .con_inner_area02 {margin-top: 18px; padding: 10px 14px;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li {display: block; padding-right: 0px; font-size: 13px;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li > strong + span {position: relative; padding-left: 20px;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li > strong + span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 5px; left: 8px; background-color: #cccccc;}
.edu_list > ul > li > div > .con_area .scorebox {position: absolute; display: block; width: 38px; height: 38px; top: 3px; right: 0px; background-color: #0f5383; border-radius: 5px;}
.edu_list > ul > li > div > .con_area .scorebox span {display: block; font-size: 14px; color: #fff; text-align: center; line-height: 38px;}
.edu_list > ul > li > div > .con_area .hits_area {margin-top: 5px;}
.edu_list > ul > li > div > .con_area .hits_area ul li + li {margin-left: 10px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span {font-size: 13px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.nice {padding-left: 25px; background: url('../images/icon/icon_debate_bg01_on.png') no-repeat center left; background-size: 25px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.interest {padding-left: 25px; background: url('../images/icon/icon_debate_bg02_on.png') no-repeat center left; background-size: 25px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.comment {padding-left: 25px; background: url('../images/icon/icon_debate_bg03.png') no-repeat center left; background-size: 25px;}


/* 팝업 학습방법 */
.edu_step_list > li + li::before {top: 4px; left: 35px;}
.edu_step_list > li > div {width: 85px; height: 64px;}
.edu_step_list > li > div > span {width: 85px; font-size: 13px; letter-spacing: -0.06em;}
.edu_step_list > li > p {width: calc(100% - 130px); margin-left: 15px; font-size: 13px;}

/* faq */
.faq_area {overflow: hidden; margin-bottom: 24px;}
.faq_area > ul > li + li {margin-top: 15px;}
.faq_area > ul > li div.faq_h {padding: 16px 13px;}
.faq_area > ul > li div.faq_h strong.num {margin-bottom: 10px; font-size: 15px;}
.faq_area > ul > li div.faq_h span.classify {margin-bottom: 5px; flex-basis: auto; font-size: 14px;}
.faq_area > ul > li div.faq_h strong.tit {margin-bottom: 10px; font-size: 16px;}
.faq_area > ul > li div.faq_h ul {display: block; padding-left: 0px;}
.faq_area > ul > li div.faq_h ul > li {font-size: 13px;}
.faq_area > ul > li div.faq_h ul > li > span + span {padding-left: 20px;}
.faq_area > ul > li div.faq_h ul > li > span + span::before {width: 1px; height: 10px; top: 5px; left: 10px;}
.faq_area > ul > li div.faq_c {position: relative; display: none; padding: 22px 18px 60px 18px;}
.faq_area > ul > li div.faq_c div {position: relative; min-height: auto; padding-left: 0px; background: none;}
.faq_area > ul > li div.faq_c div::before {content: none;}
.faq_area > ul > li div.faq_c div p {padding-left: 0px; font-size: 13px;}
.faq_area > ul > li div.faq_c a {position: absolute; display: inline-block; bottom: 18px; left: 18px; padding-right: 20px; font-size: 14px; color: #0e173e; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right;}

/* 검색결과없을경우 */
.none_search_keyword {padding: 5px 0px 5px 40px; line-height: normal; font-size: 18px; background: url('../images/icon/icon_exclamation.png') no-repeat center left; background-size: 27px 29px;}

/* 에러페이지 */
.error_area h1 {margin-top: 50px;}
.error_area h1 > a {font-size: 23px;}
.error_area h1 > a > span {padding-left: 43px; background: url('../images/common/logo02.png') no-repeat center left; background-size: 35px 35px;}
.error_area > strong {margin-top: 60px; margin-bottom: 19px; font-size: 20px;}
.error_area > strong + p {padding-top: 23px;}
.error_area > p {margin-bottom: 28px; padding-bottom: 195px; font-size: 15px; background: url('../images/common/error_bg.png') no-repeat center bottom; background-size: 200px 170px;}

/* 운영자립도 진단 */
.abl_step_area {margin-bottom: 27px;}
.abl_step_area > .abl_step_top > ul.type01 {margin: 0 13px; padding: 24px 0;}
.abl_step_area > .abl_step_top > ul.type01 > li + li {margin-top: 10px;}
.abl_step_area > .abl_step_top > ul.type01 > li > span {position: absolute; display: inline-block; width: 18px; height: 18px; margin-left: 0; font-size: 12px; line-height: 16px;}
.abl_step_area > .abl_step_top > ul.type01 > li > p {padding-right: 20px; font-size: 14px;}
.abl_step_area > .abl_step_top > ul.type02 > li {padding: 0px 29px;}
.abl_step_area > .abl_step_top > ul.type02 > li > p {padding: 12px 0 12px 40px; font-size: 14px;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(1) > p {background: url('../images/common/abl_step_bg01.png') no-repeat center left; background-size: 30px 31px;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(2) > p {background: url('../images/common/abl_step_bg02.png') no-repeat center left; background-size: 30px 31px;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(3) > p {background: url('../images/common/abl_step_bg03.png') no-repeat center left; background-size: 30px 31px;}
.abl_step_area > .abl_step_bottom {padding: 13px 12px;}
.abl_step_area > .abl_step_bottom strong {margin-bottom: 15px; font-size: 14px;}
.abl_step_area > .abl_step_bottom div {height: 19px; border: 1px solid #83b6d9;}

.abl_step_area > .abl_step_mid .inner {padding: 18px;}
.abl_step_area > .abl_step_mid .inner .mid_h {margin-bottom: 10px;}
.abl_step_area > .abl_step_mid .inner .mid_h span {float: none; width: 60px; margin-bottom: 10px; margin-right: 0px; font-size: 12px;}
.abl_step_area > .abl_step_mid .inner .mid_h p {font-size: 14px; word-break: keep-all;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li + li {margin-top: 8px; margin-left: 0px;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li span {width: 19px; height: 19px; font-size: 12px; line-height: 17px;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li p {margin-left: 5px; font-size: 14px;}

.abl_form_area {overflow: hidden; margin-bottom: 30px; border-top: 2px solid #000;}
.abl_form_area > div {padding: 18px 14px;}
.abl_form_area > div > strong {font-size: 14px;}
.abl_form_area > ul > li div.question_h {padding: 18px 14px; font-size: 14px;}
.abl_form_area > ul > li div.question_a ul > li {flex: 1 1 1px; padding: 15px 0; font-size: 12px;}

.num_chk input[type='radio'] + label {width: 18px; height: 18px; font-size: 12px; line-height: 16px;}
.num_chk input[type='radio']:checked + label {width: 18px; height: 18px; font-size: 12px; line-height: 16px;}

.num_chk input[type='radio'] + span {width: 16px; height: 16px; font-size: 12px; line-height: 14px;}
.num_chk input[type='radio']:checked + span {width: 16px; height: 16px; font-size: 12px; line-height: 14px;}
.num_chk > p {font-size: 12px;}

/* 자립도 영역 */
.gpa_box {margin-bottom: 24px; padding: 20px 13px;}
.gpa_box strong.gpa_txt {font-size: 14px;}
.gpa_box strong.gpa_score {top: 19px; right: 20px; font-size: 22px;}

/* 자주도 차트 영역 */
.independent_chart .independent_chart_h {padding: 12px 18px;}
.independent_chart .independent_chart_h span {padding: 56px 0px 0px 0px; font-size: 13px;}
.independent_chart .independent_chart_h span.in_h_txt01 {background: url('../images/common/independent_bg01.png') no-repeat top center; background-size: 41px 41px;}
.independent_chart .independent_chart_h span.in_h_txt02 {position: absolute; top: 12px; right: 20px; background: url('../images/common/independent_bg02.png') no-repeat top center; background-size: 41px 41px;}
.independent_chart .independent_chart_h div.line {position: absolute; width: calc(100% - 190px); height: 3px; bottom: 65px; margin: 0 90px; padding: 0px; left: 0px;}
.independent_chart .independent_chart_h div.line div::before {width: 12px; height: 17px; top: 50%; left: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_left02.png') no-repeat center center;}
.independent_chart .independent_chart_h div.line div::after {width: 12px; height: 17px; top: 50%; right: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_right02.png') no-repeat center center;}
.independent_chart .independent_chart_b > div {height: 365px;}

/* 역량진단 */
.diagnosis_area > ul > li {margin-bottom: 20px;}
.diagnosis_area > ul > li > strong {margin-bottom: 15px; font-size: 18px;}
.diagnosis_area > ul > li > ul {border-bottom: 0px;}
.diagnosis_area > ul > li > ul > li {display: block; width: 100%; margin-bottom: 18px;}
.diagnosis_area > ul > li > ul > li:nth-child(odd) {margin-right: 0px;}
.diagnosis_area > ul > li > ul > li:nth-child(even) {margin-left: 0px;}
.diagnosis_area > ul > li > ul > li > span {margin-bottom: 15px; font-size: 16px;}
.diagnosis_area > ul > li > ul > li > span > strong {margin-right: 10px;}
.diagnosis_area > ul > li > ul > li > div {padding: 12px 18px;}
.diagnosis_area > ul > li > ul > li > div > a {padding: 0 14px; font-size: 14px; border-radius: 20px;}
.diagnosis_area > ul > li > ul > li > div > a + a {margin-left: 18px;}

/* 토론상세(10.24 수정) */
.chat_div  {overflow: hidden; /*border: 1px solid #dddddd;*/}
.chat_div .boxDiv {width:100%; position: relative; display: inline-block;}
.dscsn_popup {width: 500px!important;}


/* 역량진단결과 */
.diagnosis_area {margin-bottom: 12px;}
.diagnosis_area .chart_area {height: 300px;}
.diagnosis_area .diagnosis_half + .diagnosis_half {margin-top: 12px;}
.diagnosis_area .diagnosis_half .chart_area {height: 414px; padding: 20px 0px;}
.diagnosis_area .diagnosis_half .chart_area > div {height: 280px;}
.diagnosis_area .diagnosis_half .chart_area p {padding: 0 8px; font-size: 13px;}

.independent_none_con {padding-bottom: 180px; background: url('../images/sub/independent_none_bg.png') no-repeat center bottom; background-size: 145px;}
.independent_none_con strong {margin-bottom: 15px; font-size: 18px; word-break: keep-all;}
.independent_none_con p {font-size: 15px; word-break: keep-all;}

/* 이용안내 */
.guide_box {margin-bottom: 18px;}
.guide_box div {height: auto; padding: 21px 18px;}
.guide_box div strong {margin-bottom: 23px; font-size: 21px;}
.guide_box div p {font-size: 15px;}

.guide_box02 {margin-bottom: 35px;}
.guide_box02 > div > strong {margin-bottom: 12px; font-size: 15px;}
.guide_box02 > div + div {margin-top: 15px;}
.guide_box02 > div > div::before {height: 130px;}
.guide_box02 > div:nth-child(1) > div::before {background: url('../images/sub/guide_bg02.png') no-repeat center center #e4eaf5; background-size: 247px 125px;}
.guide_box02 > div:nth-child(2) > div::before {background: url('../images/sub/guide_bg03.png') no-repeat center center #f5e6dd; background-size: 247px 125px;}
.guide_box02 > div > div > ul {margin: 18px 0 18px 18px;}
.guide_box02 > div > div > ul > li {padding-left: 12px; font-size: 15px;}
.guide_box02 > div > div > ul > li::before {position: absolute; display: block; content: ""; width: 4px; height: 4px; top: 5px; left: 0px; background-color: #1782c0;}
.guide_box02 > div > div > ul > li + li {margin-top: 15px;}

.guide_box03 {overflow: hidden; margin-bottom: 35px; padding-top: 12px;}
.guide_box03 ul {}
.guide_box03 ul li {width: calc(50% - 12px);}
.guide_box03 ul li:nth-child(odd) {margin-right: 12px;}
.guide_box03 ul li:nth-child(even) {margin-left: 12px;}
.guide_box03 ul li:nth-child(3),
.guide_box03 ul li:nth-child(4) {margin-top: 20px;}
.guide_box03 ul li + li {margin-left: 0px;}
.guide_box03 ul li div {position: relative; width: 100%; height: 214px; border: 1px solid #dddddd; border-radius: 10px;}
.guide_box03 ul li div::before {display: block; content: ""; width: 100%; height: 94px; border-radius: 10px 10px 0 0; background-size: 46px 45px !important;}
.guide_box03 ul li div span {position: absolute; width: 27px; height: 27px; margin-left: -13.5px; top: -13px; font-size: 14px; line-height: 27px;}
.guide_box03 ul li div p {font-size: 15px; padding: 18px 10px;}

.guide_box04 > strong {margin-bottom: 15px; font-size: 21px;}
.guide_box04 > p {font-size: 15px;}
.guide_box04 > ul {margin-top: 29px;}
.guide_box04 > ul > li + li {margin-top: 35px;}
.guide_box04 > ul > li > div.guide_img {max-width: 338px; width: 100%; height: 100%; margin: 0 auto 18px;}
.guide_box04 > ul > li > div.guide_txt strong {margin-bottom: 17px; font-size: 18px;}
.guide_box04 > ul > li > div.guide_txt p {margin-bottom: 18px; font-size: 14px;}
.guide_box04 > ul > li > div.guide_txt ul li {display: inline-block; min-width: auto; width: 50%; float: left;}
.guide_box04 > ul > li > div.guide_txt ul li:nth-child(3),
.guide_box04 > ul > li > div.guide_txt ul li:nth-child(4) {margin-top: 12px;}
.guide_box04 > ul > li > div.guide_txt ul li span {padding: 2px 0 2px 38px; font-size: 13px; background-size: 29px !important;}

/* 사용자안내 */
.user_guide_area > ul > li {display: block; float: none; width: 100%; height: auto;}
.user_guide_area > ul > li:nth-child(odd) {margin-right: 0px;}
.user_guide_area > ul > li:nth-child(even) {margin-left: 0px;}
.user_guide_area > ul > li:nth-child(1),
.user_guide_area > ul > li:nth-child(2) {margin-bottom: 0px;}
.user_guide_area > ul > li + li {margin-top: 23px !important;}
.user_guide_area > ul > li > div::before {height: 127px;}
.user_guide_area > ul > li:nth-child(1) > div::before {background: url('../images/sub/user_guide_img01.png') no-repeat bottom -40px center #b2cee2;}
.user_guide_area > ul > li:nth-child(2) > div::before {background: url('../images/sub/user_guide_img02.png') no-repeat bottom -40px center #bdead8;}
.user_guide_area > ul > li:nth-child(3) > div::before {background: url('../images/sub/user_guide_img03.png') no-repeat bottom -40px center #7eb4c0;}
.user_guide_area > ul > li > div > strong {margin: 18px 0 18px 0; font-size: 15px;}
.user_guide_area > ul > li > div > p {padding-bottom: 18px; font-size: 15px;}

/* 교육유형안내 */
.edu_info_txt_box {width: 100%; height: 104px; margin-bottom: 24px; background: url('../images/sub/edu_info_type_txtbg.png') no-repeat center right #f5f5f5; background-size: cover; border-radius: 10px;}
.edu_info_txt_box p {font-size: 15px; top: 50%; left: 14px;}
.edu_info_txt_box p strong {display: block; font-size: 19px;}

.edu_info_type_list_area {margin-bottom: 50px;}
.edu_info_type_list_area > strong {margin-bottom: 18px; font-size: 18px;}
.edu_info_type_list_area > div {padding: 24px 12px; border-radius: 10px;}
.edu_info_type_list_area > div > ul > li + li {margin-top: 29px;}
.edu_info_type_list_area > div > ul > li img {width: 103px; height: 62px; margin-right: 18px;}
.edu_info_type_list_area > div > ul > li > div {width: calc(100% - 121px);}
.edu_info_type_list_area > div > ul > li > div > strong {margin-top: 0px; font-size: 16px;}
.edu_info_type_list_area > div > ul > li > div > p {margin-top: 5px; font-size: 14px;}

/* 설문 */
.question_title_area {margin-bottom: 15px;}
.question_title_area > strong {margin-bottom: 12px; font-size: 18px;}
.question_title_area ul li {display: block; font-size: 13px; }
.question_title_area ul li + li {margin-top: 5px; margin-left: 0px;}
.question_title_area ul li strong + span {margin-left: 12px;}
.question_title_area ul li strong + span::before {width: 1px; height: 10px; top: 5px; left: -7px;}

.question_area {margin-bottom: 20px;}
.question_area .q_box {padding: 12px 18px;}
.question_area .q_box span.q_type {float: none; display: inline-block; margin-right: 0px; padding: 0 5px; font-size: 11px; border-radius: 10px;}
.question_area .q_box div.q_txt_box {padding-right: 10px; margin-top: 8px; font-size: 14px;}
.question_area .q_box div.q_txt_box span {padding-right: 6px;}
.question_area .q_box div.q_txt_box pre {font-size: 14px; word-break: keep-all;}

.question_area .q_box.sub {position: relative; padding-left: 50px; border-radius: 10px;}
.question_area .q_box.sub::before {width: 17px; height: 17px; top: 11px; left: 25px; background: url('../images/icon/icon_q_bg.png') no-repeat center center;}
.question_area .a_box {padding: 12px 18px;}
.question_area .a_box .a_list_type02 {margin: 0px; padding: 15px 0 30px 0;}
.question_area .a_box .a_list_type02 li {position: relative; flex: 1; padding-bottom: 40px; vertical-align: top; text-align: center;}
.question_area .a_box .a_list_type02 li > p {font-size: 13px;}
.question_area .a_box .a_list_type02 li.line {position: absolute; width: 100%; height: 3px; bottom: 50px; padding: 0px; left: 0px; background-color: #006cb8; z-index: 10;}
.question_area .a_box .a_list_type02 li.line div {position: relative;}
.question_area .a_box .a_list_type02 li.line div::before {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; left: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_left.png') no-repeat center center;}
.question_area .a_box .a_list_type02 li.line div::after {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; right: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_right.png') no-repeat center center;}
.question_area .a_box .a_list_type02 li > .num_chk {position: absolute; left: 50%; bottom: -15px; margin-left: -9.5px;}
.question_area .a_box ul li.answer_chk::after {font-size: 12px;}
.question_area .a_box.table {padding: 5px;}
.question_area .a_box.table .table_area  {padding: 0px; border-radius: 10px;}
.question_area .a_box.table .table_area table.list thead th {padding: 9px 5px;}
.question_area .a_box.table .table_area table.list tbody td {padding: 8px 5px;}
.question_area .a_box .ex_box {margin-top: 10px; padding: 5px; font-size: 12px;}
.question_area .a_box .ex_box span {padding: 0px 7px 0 20px; font-size: 12px; background: url('../images/icon/icon_answer_bg.png') no-repeat center left 7px #78a8d1; background-size: 10px;}
.question_area .a_box ul.textarea_list_area li + li {margin-top: 8px; padding-top: 8px;}
.question_area .a_box ul.textarea_list_area li span {margin-bottom: 8px; font-size: 14px;}

/* 설문 타입1 */
.question_area.type_green {}
.question_area.type_green .q_con {margin-top: 15px; padding: 10px;}
.question_area.type_green .q_con .q_box.type01 span.q_type {margin-right: 0px; padding: 0 4px; border-radius: 10px;}
.question_area.type_green .q_con .q_box.type02 span.q_type {margin-right: 0px; padding: 0 4px; border-radius: 10px;}
.question_area.type_green .q_con .q_box div.q_txt_box {line-height: 1.2em;}
.question_area.type_green .q_con .q_box div.q_txt_box span {float: left; position: relative; padding-right: 8px; color: #008272;}
.question_area.type_green .q_con .q_box div.q_txt_box span::before {width: 1px; height: 10px; top: 5px; right: 3px;}
.question_area.type_green .q_con .q_box div.q_txt_box pre {font-size: 14px;}
.question_area.type_green .q_con .q_box div.q_img {margin-top: 15px;}
.question_area.type_green .q_con .q_box.sub {padding-left: 25px;}
.question_area.type_green .q_con .q_box.sub::before {top: 4px; left: 0px;}
.question_area.type_green .q_con .a_box {padding: 15px 0px 0px 0px;}
.question_area.type_green .q_con .a_box ul.a_list_type01.radio_list li {padding: 5px 20px; background-color: #f1f1f1; border-radius: 5px;}
.question_area.type_green .a_box .a_list_type02 li.line div::before {margin-top: -7.5px; background:url('../images/common/line_arrow_left_g.png') no-repeat center center;}
.question_area.type_green .a_box .a_list_type02 li.line div::after {margin-top: -7.5px; background:url('../images/common/line_arrow_right_g.png') no-repeat center center;}
.question_area.type_green .q_box.answer_o::before {position: absolute; display: inline-block; content: ""; width: 39px; height: 37px; top: 20px; left: -10px; background: url('../images/common/answer_o.png') no-repeat center center; background-size: 39px 37px;}
.question_area.type_green .q_box.answer_x::before {position: absolute; display: inline-block; content: ""; width: 39px; height: 38px; top: 20px; left: -10px; background: url('../images/common/answer_x.png') no-repeat center center;}

/* 설문 타입2 */
.question_area.type_red {}
.question_area.type_red .q_con {margin-top: 20px;}
.question_area.type_red .q_con .q_box {margin-bottom: 10px;}
.question_area.type_red .q_con .q_box.type01 span.q_type {margin-right: 0px; padding: 3px 10px;}
.question_area.type_red .q_con .q_box.type02 span.q_type {margin-right: 0px; padding: 3px 10px;}
.question_area.type_red .q_con .q_box div.q_img {margin-top: 15px;}
.question_area.type_red .q_con .q_box div.q_txt_box {min-height: auto; padding-left: 0px; line-height: 1.2em;}
.question_area.type_red .q_con .q_box div.q_txt_box span {position: relative; padding-right: 6px; color: #e3888c;}
.question_area.type_red .q_con .q_box div.q_txt_box pre {font-size: 14px;}
.question_area.type_red .q_con .q_box.sub {padding-left: 25px;}
.question_area.type_red .q_con .q_box.sub::before {top: 4px; left: 0px;}
.question_area.type_red .q_con .a_box {padding: 10px; background-color: #f5f5f5; border-radius: 5px;}
.question_area.type_red .q_con .a_box ul.a_list_type01.radio_list li {padding: 5px 20px;}
.question_area.type_red .a_box .a_list_type02 li.line div::before {margin-top: -7.5px; background:url('../images/common/line_arrow_left_r.png') no-repeat center center;}
.question_area.type_red .a_box .a_list_type02 li.line div::after {margin-top: -7.5px; background:url('../images/common/line_arrow_right_r.png') no-repeat center center;}
.question_area.type_red .q_box.answer_o::before {position: absolute; display: inline-block; content: ""; width: 39px; height: 37px; top: 25px; left: 0px; background: url('../images/common/answer_o.png') no-repeat center center; background-size: 39px 37px;}
.question_area.type_red .q_box.answer_x::before {position: absolute; display: inline-block; content: ""; width: 39px; height: 38px; top: 20px; left: 0px; background: url('../images/common/answer_x.png') no-repeat center center;}

/* 기관안내 */
.introduce_area {margin-bottom: 0px;}
.introduce_area div {width: 100%; height: 103px; padding: 15px 10px 15px 100px; border-radius: 100px;}
.introduce_area div + div {margin-top: 18px;}
.introduce_area div:nth-child(1)::before {width: 71px; height: 71px; top: 17px; left: 20px; background: url('../images/sub/introduce_bg01.png') no-repeat center center #01a4b2; background-size: 71px; border-radius: 50%;}
.introduce_area div:nth-child(2)::before {width: 71px; height: 71px; top: 17px; left: 20px; background: url('../images/sub/introduce_bg02.png') no-repeat center center #3b5990; background-size: 71px; border-radius: 50%;}
.introduce_area div span {margin-bottom: 5px; font-size: 16px;}
.introduce_area div p {font-size: 14px;}

.introduce_area02 .introduce_box {margin-bottom: 18px; padding: 18px; border: 4px solid #e6eaed; border-radius: 10px; background: url('../images/sub/introduce_bg03.png') no-repeat center right 0px #f9f9f9; background-size: cover;}
.introduce_area02 .introduce_box strong {font-size: 14px; color: #018f9b;}
.introduce_area02 .introduce_box strong + p {margin-top: 8px;}
.introduce_area02 .introduce_box p {font-size: 14px;}
.introduce_area02 .introduce_list_box {margin-bottom: 0px;}
.introduce_area02 .introduce_list_box ul {font-size: 0px; text-align: center;}
.introduce_area02 .introduce_list_box ul li {display: block; width: 100%; padding: 0px;}
.introduce_area02 .introduce_list_box ul li + li {margin-top: 21px; margin-left: 0px;}
.introduce_area02 .introduce_list_box ul li div {max-width: 290px; height: auto; margin: 0 auto 10px;}
.introduce_area02 .introduce_list_box ul li div img {width: 100%; margin-bottom: 15px;}
.introduce_area02 .introduce_list_box ul li p {font-size: 15px;}

.rb_area {padding: 18px 12px; border: 1px solid #ededed;}
.rb_area > span {padding-left: 50px; font-size: 13px;}
.rb_area > span::before {width: 35px; height: 35px; top: -8px; left: 0px; background: url('../images/sub/rb_bg01.png') no-repeat center center; background-size: 35px;}
.rb_area > ul {margin-top: 20px; padding-top: 17px;}
.rb_area > ul > li {width: 50%; font-size: 13px;}
.rb_area > ul > li:nth-child(3) {margin-top: 5px;}
.rb_area > ul > li > strong {display: inline-block; width: 40px;}
.rb_area > ul > li > strong + span {padding-left: 20px;}
.rb_area > ul > li > strong + span::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 10px; top: 6px; left: 0px; background-color: #999;}

/* 복지개발원 소개 */
.con_txt_box_area .con_txt_box {margin-bottom: 18px; padding: 20px;}
.con_txt_box_area .con_txt_box:last-child {margin-bottom: 0px;}
.con_txt_box_area .con_txt_box > strong {display: block; float: none; width: 100%; padding-left: 62px; padding-bottom: 0px; line-height: 44px; font-size: 16px; text-align: left;}
.con_txt_box_area .con_txt_box.type01 > strong {background: url('../images/sub/con_txt_box_bg01.png') no-repeat left center; background-size: 44px;}
.con_txt_box_area .con_txt_box.type02 > strong {background: url('../images/sub/con_txt_box_bg02.png') no-repeat left center; background-size: 44px;}
.con_txt_box_area .con_txt_box.type03 > strong {background: url('../images/sub/con_txt_box_bg03.png') no-repeat left center; background-size: 44px;}
.con_txt_box_area .con_txt_box.type04 > strong {background: url('../images/sub/con_txt_box_bg04.png') no-repeat left center; background-size: 44px;}
.con_txt_box_area .con_txt_box > div {overflow: hidden; margin-top: 12px; padding: 16px 0 0 0px; border-top: 1px solid #dedede;}
.con_txt_box_area .con_txt_box > div > strong {font-size: 16px;}
.con_txt_box_area .con_txt_box > div > ul {margin-top: 24px;}
.con_txt_box_area .con_txt_box > div > ul > li {padding-left: 10px; font-size: 14px;}
.con_txt_box_area .con_txt_box > div > ul > li + li {margin-top: 15px;}
.con_txt_box_area .con_txt_box > div > ul > li::before {position: absolute; display: block; content: ""; width: 3px; height: 3px; top: 7px; left: 0px; background-color: #393f71;}

.position_guide_area {overflow: hidden;}
.position_guide_area div.map {width: 100%; height: 320px; margin-bottom: 18px;}
.public_transit_list {overflow: hidden; display: block;}
.public_transit_list li {width: 100%;}
.public_transit_list li + li {margin-top: 18px; margin-left: 0px;}
.public_transit_list li div {height: 100%; padding: 20px; text-align: left;}
.public_transit_list li div strong {display: block; margin-bottom: 0px; padding-left: 62px; padding-bottom: 0px; font-size: 16px; line-height: 44px;}
.public_transit_list li div p {margin-top: 12px; padding-top: 18px; font-size: 14px; border-top: 1px solid #ddd;}
.public_transit_list li:nth-child(1) div strong {background:url('../images/sub/transit_bg01.png') no-repeat left center; background-size: 44px;}
.public_transit_list li:nth-child(2) div strong {background:url('../images/sub/transit_bg02.png') no-repeat left center; background-size: 44px;}
.public_transit_list li:nth-child(3) div strong {background:url('../images/sub/transit_bg03.png') no-repeat left center; background-size: 44px;}

.val_area {margin: 50px 0 0 0;}
.val_area ul li {position: relative; height: auto; padding: 5px; border-radius: 10px 0 0 0;}
.val_area ul li strong {padding-bottom: 31px; top: -50px; font-size: 19px;}
.val_area ul li strong span {font-size: 14px;}
.val_area ul li p {font-size: 14px;}
.val_area ul li:nth-child(1) strong {background: url('../images/sub/val_bg01.png') no-repeat center bottom; background-size: 57px 29px;}
.val_area ul li:nth-child(2) strong {background: url('../images/sub/val_bg02.png') no-repeat center bottom; background-size: 57px 29px;}
.val_area ul li:nth-child(3) strong {background: url('../images/sub/val_bg03.png') no-repeat center bottom; background-size: 57px 29px;}
.val_area ul li:nth-child(4) strong {background: url('../images/sub/val_bg04.png') no-repeat center bottom; background-size: 57px 29px;}
.val_area ul li:nth-child(5) strong {background: url('../images/sub/val_bg05.png') no-repeat center bottom; background-size: 57px 29px;}

/* 교육체계 */
.eduSys_h {overflow: hidden; margin-bottom: 18px;}
.eduSys_h ul.left li + li {margin-top: 10px; margin-left: 0px;}
.eduSys_h ul.left li i {width: 28px; height: 28px;}
.eduSys_h ul.left li i.eduType01 {background: url('../images/sub/edu_type_bg01.png') no-repeat center center;}
.eduSys_h ul.left li i.eduType02 {background: url('../images/sub/edu_type_bg02.png') no-repeat center center;}
.eduSys_h ul.left li span {font-size: 13px;}
.eduSys_h ul.right {float: none; margin-top: 12px;}
.eduSys_h ul.right li + li {padding-left: 50px; background: url('../images/icon/icon_arrow03.png') no-repeat center left 10px;}
.eduSys_h ul.right li span {height: 32px; padding: 0 20px; line-height: 32px; font-size: 12px;}

ul.eduSys_list {padding: 0px;}
ul.eduSys_list li + li {padding-top: 15px;}
ul.eduSys_list li span {padding: 5px 15px; font-size: 14px;}
ul.eduSys_list li span.bg01 {padding-left: 40px; background: url('../images/sub/edu_type_bg01.png') no-repeat center left 15px #fff;}
ul.eduSys_list li span.bg02 {padding-left: 40px; background: url('../images/sub/edu_type_bg02.png') no-repeat center left 15px #fff;}
ul.eduSys_list.type02 li + li {padding-left: 0px; background: url('../images/icon/icon_arrow04.png') no-repeat top -5px center; background-size: 10px 16px;}
ul.eduSys_list + ul.eduSys_list {margin-top: 21px; padding-top: 21px; border-top: 1px solid #000;}

/* 사이트맵 */
.sitemap_area > ul > li {width: 100%; height: 100%; margin-bottom: 35px;}
.sitemap_area > ul > li > strong {height: 35px; font-size: 18px; line-height: 35px;}
.sitemap_area > ul > li > ul {margin-top: 15px;}
.sitemap_area > ul > li > ul > li + li {margin-top: 18px;}
.sitemap_area > ul > li > ul > li > a {padding-left: 10px;}
.sitemap_area > ul > li > ul > li > a::before {width: 4px; height: 4px; top: 8px; left: 0px;}
.sitemap_area > ul > li > ul > li > a > span {font-size: 14px; }
.sitemap_area > ul > li > ul > li > ul {margin: 12px 0 18px 0; padding: 15px;}
.sitemap_area > ul > li > ul > li > ul > li + li {margin-top: 10px;}
.sitemap_area > ul > li > ul > li > ul > li > a {font-size: 13px;}

/* 동영상영역 */
.player_area .player_wrap .youtube_area {margin-bottom: 15px;}
.player_area .player_info_area .player_tit_area {padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #dddddd;}
.player_area .player_info_area .player_tit_area > strong {display: block; margin-bottom: 15px; font-size: 18px;}
.player_area .player_info_area .player_tit_area span strong {font-weight: bold;}

.side_menu_area {height: auto;}
.side_menu_area > div.inner {height: auto;}
.side_menu_area > div.inner > div.side_list_box  {height: 230px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li {padding: 10px 12px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > span {margin-bottom: 12px; padding: 2px 6px; font-size: 10px; border-radius: 50px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > a {font-size: 14px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > a::after {width: 13px; height: 13px; margin-left: 5px; background: url('../images/icon/icon_play02.png') no-repeat center center; vertical-align: middle;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li.active > a::after {background: url('../images/icon/icon_play.png') no-repeat center center;}

.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div {padding: 9px 2px; font-size: 13px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div.time {width: 100px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div.info {width: calc(100% - 100px);}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div span + span {padding-top: 10px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div p {width: 100%;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div input[type='text'] {width: 100%; height: 29px; font-size: 13px; line-height: 27px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div input[type='text']::placeholder {font-size: 13px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area {padding: 0px; top: 7px; right: 5px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a {width: 30px; height: 24px; font-size: 12px; border-radius: 4px; line-height: 24px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a + a {border-left: 5px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li a.row_del_btn {width: 18px !important; height: 18px; top: 2px; right: 0px; background: url('../images/icon/icon_delete_bg.png') no-repeat center center #f35858;}

.side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt {padding: 10px;}
.side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt p {font-size: 13px;}


/* 외부교육관리 */
.label_list {display: block !important;}
.label_list li {display: inline-block; margin: 5px !important;}
.time_com_area {overflow: hidden; display: block; width: 100%;}
.time_com_area input[type='text'] {width: calc(100% - 139px); vertical-align: middle; background-color: #ddd;}
.time_com_area input[type='text'] + a {margin-left: 5px;}
.time_com_area a {vertical-align: middle;}
.pop_h_con01 {margin-bottom: 10px;}
.pop_h_con01 label {font-size: 13px;}
.pop_h_con01 label + input[type='text'] {margin-left: 8px;}
.pop_h_con01 input[type='text'] + label.label_check {font-size: 0px; margin-left: 8px;}


.smp_player_area {width: 100%; float: none; margin-right: 0px; transition: none;}
.smp_player_area.fold {width: 100%; margin-right: 0px;}
.smp_player_area .player_wrap .youtube_area {margin-bottom: 15px;}
.smp_player_area .player_wrap .youtube_area video {display: block; width: 100%; height: 100%;}

.smp_side_menu_area {position: relative; overflow: hidden; display: block; width: 100%; max-width:100%; transition: none;}
.smp_side_menu_area > div.inner > ul.side_menu_tab li a {height: 35px; font-size: 13px; line-height: 35px;}

.smp_side_menu_area > div.inner > div.side_list_box {overflow-y: scroll; height: 522px; background: #f5f5f5;}
.smp_side_menu_area > div.inner > div.side_list_box > ul.type01 > li {padding: 10px 12px; border-bottom: 1px solid #ddd;}
.smp_side_menu_area > div.inner > div.side_list_box > ul.type01 > li:last-child {border-bottom: 0px;}
.smp_side_menu_area > div.inner > div.side_list_box > ul.type01 > li.active {background: #fff;}
.smp_side_menu_area > div.inner > div.side_list_box > ul.type01 > li:hover {background: #fff;}
.smp_side_menu_area > div.inner > div.side_list_box > ul.type01 > li > span {display: inline-block; margin-bottom: 15px; padding: 2px 6px; font-size: 10px; color: #fff; font-weight: bold; border-radius: 50px;}
.smp_side_menu_area > div.inner > div.side_list_box > ul.type01 > li > span.red {background: #ff7575;}
.smp_side_menu_area > div.inner > div.side_list_box > ul.type01 > li > span.blue {background: #01a4b2;}
.smp_side_menu_area > div.inner > div.side_list_box > ul.type01 > li > a {display: block; font-size: 13px; color: #222; line-height: 1.2em;}
.smp_side_menu_area > div.inner > div.side_list_box > ul.type01 > li > a::after {display: inline-block; content: ""; width: 13px; height: 13px; margin-left: 5px; background: url('../images/icon/icon_play02.png') no-repeat center center; vertical-align: middle;}
.smp_side_menu_area > div.inner > div.side_list_box > ul.type01 > li.active > a::after {background: url('../images/icon/icon_play.png') no-repeat center center;}
.smp_side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt {padding: 10px;}
.smp_side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt p {font-size: 14px;}
}
/* 모바일 작은화면 2 */
@media only screen and (max-width: 411px) {

/* 서브페이지 텝메뉴 */
.tab_area {position: relative; overflow: hidden; margin-bottom: 20px; font-size: 0px;}
.tab_area a.m_slect {display: block; height: 28px; padding: 0 25px; font-size: 14px; text-align: center; color: #000; border:2px solid #b0d1e9; line-height: 26px; border-radius: 20px; background: url('../images/common/m_menu_arrow_down.png') no-repeat center right 10px #fff; background-size: 11px 7px;}
.tab_area a.m_slect.active {border-radius: 20px 20px 0 0; border-bottom: 0px; background: url('../images/common/m_menu_arrow_up.png') no-repeat center right 10px #e9f3f6; background-size: 11px 7px;}
.tab_area ul {display: none; border: 1px solid #ddd; border-left: 2px solid #b0d1e9; border-right: 2px solid #b0d1e9; border-bottom: 2px solid #b0d1e9; border-radius: 0 0 20px 20px;}
.tab_area ul.active {display: block;}
.tab_area ul li {float: none; flex: none; border: 0px; border-bottom: 1px solid #ddd !important; border-radius: 10px 10px 0 0;}
.tab_area ul li:last-child {border-bottom: 0px !important;}
.tab_area ul li + li {margin-left: 0px;}
.tab_area ul li a {display: block; height: auto; padding: 6px 0; font-size: 14px; color: #000; text-align: center; line-height: normal;}
.tab_area ul li.active {position: relative; border: 0px;}
.tab_area ul li.active::before {content: none;}
.tab_area ul li.active a {font-weight: normal; color: #000;}

/* 더보기 버튼 */
a.moreBtn {display: block; height: 28px; padding: 0 25px; font-size: 14px; font-weight: bold; color: #0e173e; text-align: center; line-height: 28px; border-radius: 20px; background: url('../images/common/m_menu_arrow_down.png') no-repeat center right 10px #f0f6fb; background-size: 11px 7px;}

/* 제목영역 */
.title_area {overflow: hidden; margin-bottom: 15px;}
.title_area.mb10 {margin-bottom: 5px;}
.title_area strong.title {font-size: 15px; color: #000; line-height: 24px;}
.title_area strong.title span {font-size: 11px;}
.title_area strong.title02 {font-size: 14px; color: #000;  line-height: 24px;}
.title_area strong.title03 {font-size: 18px; color: #000; line-height: 24px;}
.title_area span.tag {height: 18px; padding: 0 7px; font-size: 11px; line-height: 18px;}
.title_area span.tag + strong {margin-left: 5px;}

/* 오시는길 */
.directions {padding-bottom: 10px;}
.directions + .directions {padding-top: 10px; border-top: 0px;}
.map_area {height: 155px; margin-bottom: 10px;}
.map_info_area .right {display: block; width: 100%; margin-top: 8px; text-align: left;}
.map_info_area p {padding-left: 15px; font-size: 13px; line-height: 1.4em}

.map_info_area .right dl {display: inline-block; width: 50%; padding: 3px 0 3px 30px; font-size: 12px;}
.map_info_area .right dl.call {background: url('../images/icon/icon_call.png') no-repeat center left; background-size: 22px 22px;}
.map_info_area .right dl.fax {background: url('../images/icon/icon_fax.png') no-repeat center left; background-size: 22px 22px;}
.map_info_area .right dl + dl {margin-left: 0px;}
.map_info_area .right dl dd {padding-left: 11px;}
.map_info_area .right dl dd::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 50%; left: 4px; margin-top: -4px; background-color: #dedede;}

.transport {margin-top: 15px; padding: 10px 11px;}
.transport > strong {display: inline-block; float: none; width: auto; margin-right: 0px; padding-left: 50px; padding-bottom: 0px; font-size: 14px; line-height: 38px;}
.transport.type01 > strong {background: url('../images/common/transport_bg01.png') no-repeat center left 0px; background-size: 38px 38px;}
.transport.type02 > strong {background: url('../images/common/transport_bg02.png') no-repeat center left 0px; background-size: 38px 38px;}
.transport.type03 > strong {background: url('../images/common/transport_bg03.png') no-repeat center left 0px; background-size: 38px 38px;}
.transport > ul {margin-top: 10px; padding-top: 15px; border-top: 1px solid #dedede;}
.transport > ul p.title {margin-bottom: 15px; font-size: 13px;}
.transport > ul p.title > strong {display: block; font-size: 14px;}
.transport > ul strong.title01 {margin-bottom: 11px; font-size: 14px;}
.transport > ul strong.title02 {font-size: 13px;}
.transport > ul strong.title02 + p {margin-top: 8px;}
.transport > ul > li {padding: 10px 0;}
.transport > ul > li > dl {font-size: 13px;}
.transport > ul > li > dl + dl {margin-top: 5px;}
.transport > ul > li > dl > dt {float: left;}
.transport > ul > li > dl > dd {position: relative; overflow: hidden; display: block; padding-left: 15px;}
.transport > ul > li > dl > dd::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 7px; left: 7px; margin-top: 0px; background-color: #dedede;}
.transport > ul > li > p {font-size: 13px; line-height: 1.6em; word-break: keep-all;}

.con_charge_area {margin-top: 15px; padding: 10px;}
.con_charge_area > span {display: block; padding: 7px 0 7px 45px; font-size: 12px; background: url('../images/common/charge_bg01.png') no-repeat center left; background-size: 30px 30px;}
.con_charge_area > ul {overflow: hidden; display: inline-block; width: 100%; margin: 5px 0 0 0; padding: 5px 0 0 0; border-left: 0px; border-top: 1px solid #dddddd;}
.con_charge_area > ul > li {overflow: hidden;}
.con_charge_area > ul > li + li {margin-top: 10px; padding-top: 10px; border-top: 1px solid #dddddd;}
.con_charge_area > ul > li > ul {display: block; width: 100%;}
.con_charge_area > ul > li > ul > li {overflow: hidden; display: inline-block; float: left; width: 50%; flex: none; font-size: 11px;}
.con_charge_area > ul > li > ul > li:nth-child(3) {margin-top: 5px;}
.con_charge_area > ul > li > ul > li > strong {display: block; float: left;}
.con_charge_area > ul > li > ul > li > span {position: relative; overflow: hidden; display: block; padding-left: 18px; color: #888888;}
.con_charge_area > ul > li > ul > li > span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 4px; left: 9px; margin-top: 0px; background-color: #dddddd;}

.pdfViewer {overflow: hidden; width: 100%; height: 173px; margin-top: 20px; border-radius: 10px; background-color: #f1f1f1;}
.pdfViewer p {font-size: 17px; color:#333333; font-weight: bold; text-align: center; letter-spacing: -0.04em; line-height: 173px;}

/* 달력 */
#calendar {max-width: none; margin-top: 13px;}
#calendar .fc-toolbar.fc-header-toolbar {margin-bottom: 13px;}
#calendar .fc-today-button {background-color: #76828e; border: 1px solid #76828e;}
#calendar .fc-toolbar-title {color: #1d2127; font-weight: normal; font-size: 15px;}
#calendar .fc-button,
#calendar .fc-button .fc-icon {font-size: 9px;}
.fc-direction-ltr .fc-toolbar>*>:not(:first-child) {margin-left: 5px;}

/* 지도, 테이블영역 */
.centerInfo_area {margin: 13px 0 22px 0;}
.centerInfo_area .korMaplistArea {margin-bottom: 13px;}
.centerInfo_area .korMaplistArea ul li {width: calc(25% - 3px); margin: 0 0 3px 3px;}
.centerInfo_area .korMaplistArea ul li:nth-child(5n-4) {margin-left: 3px;}
.centerInfo_area .korMaplistArea ul li:nth-child(4n-3) {margin-left: 0px;}
.centerInfo_area .korMaplistArea ul li a {height: 24px; font-size: 12px; line-height: 22px;}
.centerInfo_area .table_area {max-height: 320px;}

/* 소속 확인 */
.inquiry_area {overflow: hidden;}
.inquiry_area > strong {display: block; padding: 0 0 15px 0; font-size: 16px; color: #000; text-align: center; border-bottom: 1px solid #dddddd;}
.inquiry_area > p {margin: 18px 0 20px 0; font-size: 12px; color: #333; text-align: center; line-height: 2em; word-break: keep-all;}
.inquiry_area > p > strong {font-size: 15px;}
.inquiry_area > p > strong > span {color: #01a4b2;}
.inquiry_area > p > span {font-size: 12px;}
.inquiry_area > p + .tip_txt {margin-top: 25px;}
.inquiry_area > .inquiry_input_area {margin: 0 0 20px 0; padding: 20px 15px; border: 1px solid #ddd; border-radius: 15px;}
.inquiry_area > .inquiry_input_area > div {overflow: hidden; width: 100%; margin: 0 auto;}
.inquiry_area > .inquiry_input_area > div strong {display: block; margin-bottom: 10px; font-size: 13px; color: #434343;}
.inquiry_area > .inquiry_input_area > div > div.selectBox02 {width: 100%; margin-bottom: 15px;}
.inquiry_area > .inquiry_input_area > div > div.selectBox02 select {width: 100%; height: 35px; padding: 0 35px 0 20px; font-size: 12px; border: 0px; background: url('../images/icon/icon_select_arrow.png') no-repeat center right 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_name {width: 100%; height: 35px; margin-bottom: 15px; background: url('../images/icon/icon_id.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_name input[type='text'] {width: 100%; height: 35px; padding: 0 20px 0 40px; background: transparent; border: 0px;}
.inquiry_area > .inquiry_input_area > div > div.input_number {width: 100%; height: 35px; margin-bottom: 15px; padding: 0 20px 0 40px; font-size: 0px; background: url('../images/icon/icon_password.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_number input {width: 45%; height: 35px; font-size: 12px; color: #888888; background: transparent; border: 0px; vertical-align: middle;}
.inquiry_area > .inquiry_input_area > div > div.input_number input::placeholder {font-size: 12px; color: #777777;}
.inquiry_area > .inquiry_input_area > div > div.input_number span {display: inline-block; width: 10%; font-size: 16px; text-align: center; vertical-align: middle;}
.inquiry_area > .inquiry_input_area > div > div.input_birth {width: 100%; height: 35px; margin-bottom: 15px; padding: 0 20px 0 40px; font-size: 0px; background: url('../images/icon/icon_calendar.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_birth input[type='text'] {width: 100%; height: 35px; background: transparent; border: 0px;}
.inquiry_area > .inquiry_input_area > div > div.input_txt {width: 100%; height: 35px; margin-bottom: 15px; padding: 0 20px 0 40px; font-size: 0px; background: #ececec; border-radius: 40px;}
.inquiry_area > .inquiry_input_area > div > div.input_txt input[type='text'] {width: 100%; height: 35px; background: transparent; border: 0px;}

.inquiry_area > .inquiry_input_area > p.warning {padding: 0px;}
.inquiry_area > .inquiry_table {margin: 15px auto;}
.inquiry_area > .inquiry_table > div.table_area > table.list thead th {padding: 6px 3px; font-size: 13px;}
.inquiry_area > .inquiry_table > div.table_area > table.list tbody td {padding: 4px 3px; font-size: 13px;}

ul.certify_list {display: block; max-width: 320px; width: 100%; margin: 0 auto; text-align: center;}
ul.certify_list li {display: block; font-size: 0px;}
ul.certify_list li + li {margin-top: 15px;}
ul.certify_list li a {width: 100%; height: 35px; line-height: 35px; font-size: 12px;}
ul.certify_list li a.naver {color: #333333; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/common/login_naver2.png') no-repeat center left 25px #FFFFFF; background-size: 15px;}
ul.certify_list li a.pass {background: url('../images/common/login_pass.png') no-repeat center left 15px #8951ff; background-size: 30px 10px;}
ul.certify_list li a.onepass {background: url('../images/common/login_onepass.png') no-repeat center left 8px #1c2674;}
ul.certify_list li a.kakao_login {color: #333333; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/common/ico_login_kakao.png') no-repeat center left 8px #FFFFFF; background-size: 13%;}
 ul.certify_list li a.ogcr {color: #333333; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/icon/icon_lock.png') no-repeat center left 29px #FFFFFF;}
 ul.certify_list li a.oacx {color: #FFFFFF; border-style: solid; border-color: #dddddd; border-width: 1px; background: url('../images/icon/icon_certificate.png') no-repeat center left 29px #374151;}
ul.certify_list li a span {padding-left: 60px; }
ul.certify_list li a span::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 20px; top: 50%; left: 51px; background-color: #dddddd; transform: translate(0, -50%); background-size: 13%;}

p.warning {margin: 20px 0; font-size: 12px; color: #ef7572; text-align: center; letter-spacing: -0.04em;}

a + div.joinChk_area {margin-top: 20px;}
.joinChk_area + .genderChk_area {margin-top: 15px;}
.genderChk_area {margin-bottom: 15px;}
.inquiry_area > .inquiry_input_area > div > div.gender_area {margin-bottom: 20px;}
.inquiry_area > .inquiry_input_area > div > div.joinChk_area {padding-top: 20px; border-top: 1px solid #dddddd;}
.label_radio {font-size: 12px;}
.label_radio input.radio {display: inline-block; position: relative; width: 15px; height: 15px; border: 1px solid #d2d2d2; border-radius: 50%; vertical-align: middle; cursor: pointer;}
.label_radio input.radio:checked {border: 1px solid #01a4b2; background: url('../images/icon/check_radio.png') no-repeat center center; background-size: 7px;}
.label_radio input.radio + span {margin-left: 5px;}
.label_radio + .label_radio {margin-left: 10px;}

.label_check {font-size: 0px;}
.label_check input.chk {width: 16px; height: 16px;}
.label_check input.chk:checked {background: url('../images/icon/check_chk.png') no-repeat center center; background-size: 14px;}
.label_check input.chk + span {margin-left: 7px; font-size: 12px;}

/* 첨부파일 */
.add_file_area {overflow: hidden; margin-bottom: 10px;}
.add_file_area strong {display: block; margin: 0 0 10px 0; padding: 15px 0; font-size: 12px; color:#333; letter-spacing: -0.04em; border-bottom: 1px solid #ababab;}

/* 달력선택 */
div.calendar_input_area {position: relative; overflow: hidden; padding: 0 45px 0 10px; border: 1px solid #dddddd; border-radius: 20px; background-color: #fff; vertical-align: middle;}
div.calendar_input_area input {width: 100%; font-size: 12px; text-indent: 0; border: 0px; background: transparent; letter-spacing: -0.06em;}
div.calendar_input_area input::placeholder {font-size: 12px; letter-spacing: -0.06em;}
div.calendar_input_area a {position: absolute; display: inline-block; width: 12px; height: 12px; font-size: 0px; top: 6px; right: 15px; background: url('../images/icon/icon_calendar.png') no-repeat center center; background-size: cover;}

/* 답변영역 */
.replay_area {overflow: hidden; margin-bottom: 12px;}
.replay_area .replay_header {overflow: hidden; position: relative; margin-top: 18px; margin-bottom: 10px;}
.replay_area .replay_header strong {font-size: 13px; color: #333; letter-spacing: -0.04em;}
.replay_area .replay_header div {position: absolute; top: 0px; right: 0px;}
.replay_area .replay_header div span {font-size: 12px; color: #999; letter-spacing: -0.04em;}
.replay_area .replay_header div span + span {position: relative; padding-left: 10px;}
.replay_area .replay_header div span + span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 5px; left: 3px; background-color: #dddddd;}
.replay_area .replay_box {padding: 13px; font-size: 12px; color: #222; line-height: 1.6em; border: 1px solid #dddddd;}

/* 전체교육 교육링크 영역 */
.edu_link_area {overflow: hidden; margin-bottom: 18px; font-size: 0px;}
.edu_link_area li {display: inline-block; width: calc(50% - 5px); margin-bottom: 10px; vertical-align: top;}
.edu_link_area li + li {margin-left: 0px;}
.edu_link_area li:nth-child(even) {margin-left: 10px;}
.edu_link_area li div {position: relative; width: 100%; height: 70px; padding: 10px; background-color: #f4f4f4; border-radius: 10px;}
.edu_link_area li div strong {display: block; padding-right: 16px; font-size: 12px; word-break: keep-all; line-height: 1.4em; background: url('../images/icon/icon_link_bg.png') no-repeat top 2px right; background-size: 13px;}
.edu_link_area li div a {position: absolute; bottom: 10px; left: 10px; font-size: 10px; color: #777777; letter-spacing: -0.04em;}

/* 신청서작성 - 스텝 */
div.step_box {height: 60px; margin-bottom: 24px;}
div.step_box ul::before {height: 3px; top: 18px;}
div.step_box ul li:nth-child(2).active::before {top: 18px;}
div.step_box ul li:nth-child(3).active::before {top: 18px;}
div.step_box ul li:nth-child(4).active::before {top: 18px;}
div.step_box.step03 ul::before {height: 3px; top: 18px;}
div.step_box.step03 ul li:nth-child(2).active::before {top: 18px;}
div.step_box.step03 ul li:nth-child(3).active::before {top: 18px;}
div.step_box.step06 ul::before {top: 18px;}
div.step_box ul li span {padding-top: 34px; font-size: 12px; letter-spacing: -0.06em;}
div.step_box ul li span::before {width: 12px; height: 12px; top: 12px; margin: 0px 0 0 -6px;}
div.step_box ul li span::after {width: 6px; height: 6px; top: 15px; margin: 0px 0 0 -3px;}
div.step_box ul li em {padding-bottom: 5px; font-size: 11px;}
div.step_box ul li.active ~ li span::before {width: 12px; height: 12px; top: 12px; margin: 0px 0 0 -6px;}
div.step_box ul li.active ~ li span::after {width: 6px; height: 6px; top: 15px; margin: 0px 0 0 -3px;}

div.step_box02 {margin-bottom: 20px;}
div.step_box02 ul {height: 30px;}
div.step_box02 ul li span {font-size: 13px; line-height: 30px;}
div.step_box02 ul li.active:nth-child(1)::before {width: 19px; height: 30px; right: -15px; background: url('../images/common/step_box02_bg.png') no-repeat center center; background-size: cover;}
div.step_box02 ul li.active:nth-child(2)::after {width: 19px; height: 30px; left: -2px; background: url('../images/common/step_box02_bg02.png') no-repeat center center; background-size: cover;}

/* 스크롤박스 */
.scrollBox {height: 115px; margin-bottom: 15px; padding: 15px; font-size: 13px; line-height: 1.6em;}

/* 신청서작성 과정설명 영역 */
.edu_info_box {margin-bottom: 20px;}
.edu_info_box .edu_info_con {min-height: auto;}
.edu_info_box .edu_info_con p.edu_sort {margin: 10px; font-size: 11px;}
.edu_info_box .edu_info_con .thumbnailBox {width: 100px; height: 100px; margin-right: 15px;}
.edu_info_box .edu_info_con .thumbnailBox a.like {width: 16px; height: 14px; bottom: 13px; right: 12px; background: url('../images/icon/icon_like.png') no-repeat center center; background-size: cover;}
.edu_info_box .edu_info_con .thumbnailBox a.like.active {background: url('../images/icon/icon_like_active.png') no-repeat center center; background-size: cover;}
.edu_info_box .edu_info_con .txt_con {overflow: hidden; padding: 0px 13px; margin-bottom: 13px;}
.edu_info_box .edu_info_con strong.title {margin-bottom: 8px; font-size: 15px;}
.edu_info_box .edu_info_con span.tag {margin-bottom: 8px; padding: 2px 10px; font-size: 11px;}
.edu_info_box .edu_info_con p {font-size: 11px; margin-bottom: 0px;}
.edu_info_box .edu_info_con ul.period_list {display: block; margin-bottom: 10px; padding: 0px 13px;}
.edu_info_box .edu_info_con ul.period_list li {font-size: 11px;}
.edu_info_box .edu_info_con ul.period_list li + li {margin-top: 2px;}
.edu_info_box .edu_info_con ul.period_list li strong + span {padding-left: 10px;}
.edu_info_box .edu_info_con ul.period_list li strong + span::before {top: 4px; left: 4px;}
.edu_info_box .edu_info_con p.price {padding: 13px 8px; font-size: 12px;}
.edu_info_box .edu_info_con p.price strong {font-size: 15px;}
.edu_info_box .edu_info_con span.state_txt {bottom: 15px; left: 8px; font-size: 11px;}

a.edu_request_btn {height: 39px; margin-top: 15px;}
a.edu_request_btn span {font-size: 14px; line-height: 39px;}
a.edu_request_btn span::before {width: 27px; height: 27px; top: 4.5px; left: 7px; background: url('../images/icon/icon_edubtn_bg.png') no-repeat center center #cc8600; background-size: 14px;}
p.edu_txt {display: block; margin: 15px 0 0 0px; font-size: 12px;}
p.edu_txt + a.btn01 {height: 18px; margin: 10px 0 0 0px; line-height: 18px; font-size: 11px;}
ul.view_count_area {position: absolute; top: auto; right: auto; bottom: 15px; left: 8px;}
ul.view_count_area li {font-size: 11px;}
ul.view_count_area li + li {position: relative; padding-left: 30px;}
ul.view_count_area li + li::before {position: absolute; content: ""; width: 1px; height: 10px; top: 3px; left: 10px; background: #dddddd;}
ul.view_count_area li a.like {width: 13px; height: 12px; left: 16px; top: 2px; background: url('../images/icon/icon_like.png') no-repeat center center; background-size: cover;}


/* 신청서작성 완료화면 */
.complete_area {width: 100%; margin: 0 auto;}
.complete_area p {font-size: 15px; padding-bottom: 75px; background: url('../images/sub/complete_bg.png') no-repeat bottom center; background-size: 56px;}
.complete_area.type02 > strong {font-size: 15px;}
.complete_area.type02 p {font-size: 14px; padding-bottom: 75px; background: url('../images/sub/complete_bg.png') no-repeat bottom center; background-size: 56px;}
.complete_area.type02 strong + p {margin-top: 10px;}
.complete_area > div {margin-top: 22.5px;}
.complete_area > div a {width: calc(50% - 7.5px); height: 26px; font-size: 12px; line-height: 24px; border-radius: 5px;}
.complete_area > div a::before {font-size: 15px; top: 0; right: 10px;}
.complete_area > div a + a {margin-left: 15px;}
.complete_area > div a span {padding-left: 10px;}
.complete_area.type03 > strong {font-size: 15px;}
.txt_box {margin-bottom: 15px; padding: 18px 15px;}
.txt_box p {margin-bottom: 15px; font-size: 13px;}

/* 이용약관 */
.clause_area div.txtbox01 {margin-bottom: 25px; padding: 15px;}
.clause_area div.txtbox01 p {font-size: 13px;}
.clause_area ul > li:first-child {padding-top: 0px;}
.clause_area ul > li {padding: 0 0 25px 0;}
.clause_area ul > li .mb10 {margin-bottom: 8px;}
.clause_area ul > li strong.tit01 {font-size: 15px;}
.clause_area ul > li strong.tit02 {font-size: 13px;}
.clause_area ul > li p {font-size: 13px;}
.clause_area ol {font-size: 13px;}
.clause_area ol > li {margin-top: 2px;}

/* 수강신청 - 교육상세 구분 */
.con_line {margin-bottom: 15px;}
.con_line .con_slide_area .page_btn_area {margin-top: 12.5px;}
.con_line .con_slide_area .page_btn_area a {width: 25px; height: 25px;}
.youtube_area {margin: 0 auto 15px;}

/* 수강신청 - 교육상세 */
.book_info_area {position: relative; margin-bottom: 20px; padding-bottom: 130px;}
.book_info_area .book_photo {width: 74px; height: 108px;}
.book_info_area .book_info_box {display: inline-block; width: calc(100% - 85px); margin-left: 10px;}
.book_info_area .book_info_box strong.tit {margin-bottom: 10px; font-size: 15px;}
.book_info_area .book_info_box span.tag + strong.tit {width: calc(100% - 50px);}
.book_info_area .book_info_box ul {margin-bottom: 8px;}
.book_info_area .book_info_box ul li {width: 100%; margin-bottom: 6px;}
.book_info_area .book_info_box ul li span.tit {width: 36px; height: 15px; margin-right: 5px; font-size: 11px; line-height: 13px;}
.book_info_area .book_info_box ul li span.txt {margin-left: 0px; font-size: 11px; letter-spacing: -0.04em;}
.book_info_area .book_info_box p.price {margin-bottom: 0px; font-size: 12px;}
.book_info_area .book_info_box p.price span {font-size: 12px;}
.book_info_area .book_info_box p.price strong {margin-left: 10px; font-size: 15px;}
.book_info_area .book_info_box div.txt_box02 {overflow-y: scroll; width: 100%; border: 1px solid #dddddd; border-radius: 5px; height: 115px; padding: 10px; font-size: 12px;}
.book_info_area a {position: absolute; top: auto; bottom: 125px; right: 0px;}
 /*교육상세 - 강사정보 20220919추가 */
 .edu_instrctr_box .instrctr_info_con strong.title {font-size: 14px}
 .edu_instrctr_box .instrctr_info_con .editor_area {font-size: 12px;}

/* 수강신청 - 수강후기 */
.epilogue_area .rating_area .rating {margin-bottom: 15px;}
.epilogue_area .rating_area .rating strong {margin-top: 0px; font-size: 25px;}
.epilogue_area .rating_area .rating_list ul li + li {margin-top: 5px;}
.epilogue_area .rating_area .rating_list ul li span {width: 50px; font-size: 11px;}
.epilogue_area .rating_area .rating_list ul li div {width: calc(100% - 50px); height: 12px;}
.epilogue_area .rating_area .rating_list ul li div > div > span {font-size: 10px; line-height: 12px;}

.epilogue_area .rating_area + .comment_area {margin-top: 15px;}
.epilogue_area .comment_area ul {margin-bottom: 15px; font-size: 0px;}
.epilogue_area .comment_area ul li {padding: 12px;}
.epilogue_area .comment_area ul li + li {margin-top: 10px;}
.epilogue_area .comment_area ul li div.comment_left {font-size: 12px; width: 100% !important;}
.epilogue_area .comment_area ul li div.comment_left span {padding-left: 20px;}
.epilogue_area .comment_area ul li div.comment_left strong + span::before {left: -10px; height: 10px;}
.epilogue_area .comment_area ul li div.comment_right {padding: 0px; font-size: 12px;}
.epilogue_area .comment_area ul li div.comment_right p {margin-top: 10px;}

.epilogue_area .comment_area.type02 ul li {overflow: hidden; margin-top: 10px;}
.epilogue_area .comment_area.type02 ul li:first-child div.comment_left .rating_box {position: relative; top: auto; right: auto;}
.epilogue_area .comment_area.type02 ul li div.comment_left {display: block; float: none; width: 100%;}
.epilogue_area .comment_area.type02 ul li div.comment_left span + .rating_box {margin-left: 20px;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_top + div.comment_bottom {margin-top: 30px;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn {display: inline-block; margin-top: 10px; font-size: 12px; color: #0e173e;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn span {padding: 0 20px 0 0; background: url('../images/icon/icon_acc_arrow02.png') no-repeat center right;}
.epilogue_area .comment_area.type02 ul li div.comment_left div.comment_bottom a.txt_fold_btn.closed span {padding: 0 20px 0 0; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right;}
.epilogue_area .comment_area.type02 ul li div.comment_left + div.comment_right {margin-top: 10px;}
.epilogue_area .comment_area.type02 ul li div.comment_right {display: block; width: 100%; padding-left: 0px; text-align: center;}
.epilogue_area .comment_area.type02 ul li div.comment_right a {width: 49%;}
.epilogue_area .comment_area.type02 ul li div.comment_right a + a {margin-top: 0px;}
.epilogue_area .comment_area.type02 ul li div.comment_right a + span {display: block; margin-top: 10px; font-size: 12px; text-align: right;}

.epilogue_area .rating_box {top: 15px; right: 12px;}
.epilogue_area .rating_box a {width: 18px; height: 18px; background: url('../images/icon/icon_star.png') no-repeat center center; background-size: cover;}
.epilogue_area .rating_box a.active {background: url('../images/icon/icon_star_active.png') no-repeat center center; background-size: cover;}
.epilogue_area .rating_area .rating .rating_box {position: relative; overflow: hidden; display: inline-block; width: auto; top: auto; right: auto; text-align: center;}

 .epilogue_area .rating_box span {width: 18px; height: 18px; background: url('../images/icon/icon_star.png') no-repeat center center; background-size: cover;}
 .epilogue_area .rating_box span.active {background: url('../images/icon/icon_star_active.png') no-repeat center center; background-size: cover;}

 /* 게시글(추천, 비추천) */
 .ntt_exprs_area {display: flex; justify-content: center; font-size: 12px; padding: 15px; width: 100% !important;}
 .ntt_exprs_area .ntt_exprs_btn_area {display: flex; justify-content: center;}
 .ntt_exprs_area .ntt_exprs_btn_area .exprs_text{margin-left: 3px; font-size: 12px;}
 .ntt_exprs_area .ntt_exprs_btn_area .good_btn{display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(109, 109, 109, 0.53); border-radius: 25px; padding: 8px;}
 .ntt_exprs_area .ntt_exprs_btn_area .good_btn.on {display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(4, 36, 168, 0.4); border-radius: 25px; padding: 8px;}
 .ntt_exprs_area .ntt_exprs_btn_area .bad_btn{display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(97, 96, 96, 0.53); border-radius: 20px; padding: 8px;}
 .ntt_exprs_area .ntt_exprs_btn_area .bad_btn.on {display:flex; justify-content:center; cursor: pointer; margin: 15px; border: 2px solid rgba(4, 36, 168, 0.4); border-radius: 20px; padding: 8px;}
 .ntt_exprs_area .ntt_exprs_btn_area .good_btn .good_icon { background: url('../images/icon/icon_good.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}
 .ntt_exprs_area .ntt_exprs_btn_area .bad_btn .bad_icon { background: url('../images/icon/icon_bad.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}
 .ntt_exprs_area .ntt_exprs_btn_area .good_btn .good_icon.on { background: url('../images/icon/icon_good_on.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}
 .ntt_exprs_area .ntt_exprs_btn_area .bad_btn .bad_icon.on { background: url('../images/icon/icon_bad_on.png') no-repeat left center; background-size: 20px; width: 20px; height: 18px; line-height: 18px; margin-right: 5px;}

/* 기관전용 - 일괄회원가입 */
.tip_txt {margin-top: 38px; margin-bottom: 20px; padding: 33px 15px 15px;}
.tip_txt .tit {top: -17px; left: 18px;}
.tip_txt .tit > strong {height: 30px; padding: 4px 0px 4px 17px; font-size: 14px; letter-spacing: -0.04em;}
.tip_txt .tit > strong::before {width: 32px; height: 35px; top: -3px; left: -17px; background: url('../images/icon/icon_exclamation.png') no-repeat center center; background-size: cover;}
.tip_txt .tit > strong::after {width: 27px; height: 30px; top: 0px; right: -27px; background: url('../images/common/tip_txt_bg.png') no-repeat center center;}
.tip_txt > ol > li {font-size: 13px; word-break: keep-all; line-height: 1.2em;}
.tip_txt > ol > li + li {margin-top: 5px;}
.tip_txt > div.con > p {font-size: 13px;}
.tip_txt > div.con > p + ul {margin-top: 16px;}
.tip_txt > div.con > ul > li {padding-left: 12px; font-size: 13px;}
.tip_txt > div.con > ul > li + li {margin-top: 3px;}
.tip_txt > div.con > ul > li::before {position: absolute; display: inline-block; content: ""; width: 6px; height: 6px; top: 7px; left: 0px; background-color: #49e3cb;}
.tip_txt > div.con > p.tip_p {font-size: 11px;}
.tip_txt > div.con > p.tip_p + p.tip_p {margin-top: 8px;}

.tip_txt > div.con > .edu_step {margin-top: 0px;}
.tip_txt > div.con > .edu_step > strong {font-size: 13px;}
.tip_txt > div.con > .edu_step > ul.tip_step_list {margin: 8px auto; padding: 0 9px;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li {padding: 8px 0;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li strong {font-size: 11px; letter-spacing: -0.04em;}
.tip_txt > div.con > .edu_step > ul.tip_step_list li + li {padding-left: 25px; background: url('../images/icon/icon_arrow05.png') no-repeat center left 3px;}


/* 기관전용 - 일괄수정신청내역상세 */
div.tbl_dl dl + dl {margin-top: 3px;}
div.tbl_dl dl > dt {width: 50px; font-size: 12px;}
div.tbl_dl dl > dd {width: calc(100% - 50px); font-size: 12px; padding-left: 10px;}

.div_dl_area {margin-bottom: 20px; padding: 10px 15px;}
.div_dl_area dl {display: block; width: 100%;}
.div_dl_area dl + dl {margin-top: 8px;}
.div_dl_area dl dt {width: 90px; font-size: 12px;}
.div_dl_area dl dd {width: calc(100% - 90px); font-size: 12px;}

/* 알림함 */
.accordion_list {margin-bottom: 15px;}
.accordion_list ul li div.accordion_info {padding: 15px 0px 15px 42px; background: url('../images/icon/icon_alarm_bg.png') no-repeat top 15px left 0px; background-size: 28px;}
.accordion_list ul li div.accordion_info.kakao {background: url('../images/icon/icon_kakao_bg.png') no-repeat top 15px left 0px; background-size: 28px;}
.accordion_list ul li div.accordion_info span {font-size: 11px;}
.accordion_list ul li div.accordion_info a.tit {font-size: 13px; }
.accordion_list ul li div.accordion_con {margin-left: 42px; padding-bottom: 10px; font-size: 11px;}
.accordion_list ul li div.accordion_con a.acc_close {margin-top: 15px; padding-right: 15px; font-size: 11px; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right; background-size: 10px 6px;}

/* 로그인 */
.txt_box_bg {min-height: 72px; margin-bottom: 20px; padding: 15px 0; border-radius: 15px; background: url('../images/common/txt_box_bg.png') no-repeat bottom right;}
.txt_box_bg p {font-size: 13px;}
.txt_box_bg p strong {font-size: 18px;}
.login_area > p {font-size: 12px;}
.login_area > strong.login_txt {font-size: 15px;}
.login_area > p.login_txt {font-size: 13px;}
.login_area > strong.login_txt + p.login_txt {margin-top: 15px;}
.login_area > p.login_txt + div {margin: 30px auto 0;}
.login_area > div {margin: 20px auto 0;}
.login_area > div > div.input_name {width: 100%; height: 35px; margin-bottom: 15px; background: url('../images/icon/icon_id.png') no-repeat center left 15px #ececec; border-radius: 40px;}
.login_area > div > div.input_name input[type='text'] {width: 100%; height: 35px; padding: 0 20px 0 40px; background: transparent; border: 0px;}
.login_area > div > ul.certify_list {margin-bottom: 10px;}
.login_area > div > div.login_link_area {margin-bottom: 20px;}
.login_area > div > div.login_link_area a {font-size: 12px;}
.login_area > div > div.login_link_area a + a {padding-left: 15px;}
.login_area > div > div.login_link_area a + a::before {position: absolute; display: inline-block; content: ""; width: 2px; height: 9px; top: 5px; left: 5px; background-color: #e6e6e6;}

/* 회원가입 이용약관 */
.policy_area + .policy_area {margin-top: 25px;}

/* 나의수강현황 */
.myedu_con .left_con > ul.type01 {height: 110px; margin-bottom: 20px; border-radius: 5px;}
.myedu_con .left_con > ul.type01 > li {padding: 10px;}
.myedu_con .left_con > ul.type01 > li > strong {margin-bottom: 14px; font-size: 15px;}
.myedu_con .left_con > ul.type01 > li > p { font-size: 11px;}
.myedu_con .left_con > ul.type01 > li > p + p {margin-top: 4px;}
.myedu_con .left_con > ul.type01 > li > p strong {font-size: 13px;}
.myedu_con .left_con > ul.type01 > li:nth-child(2) p + p {margin-top: 9px;}
.myedu_con .left_con > ul.type02 {height: auto; margin-bottom: 20px;}
.myedu_con .left_con > ul.type02 > li {float: none; width: 100%; padding: 15px 15px 45px;}
.myedu_con .left_con > ul.type02 > li:last-child {padding-bottom: 20px;}
.myedu_con .left_con > ul.type02 > li + li {border-left: 0px;}
.myedu_con .left_con > ul.type02 > li > strong {margin-bottom: 5px; font-size: 13px;}
.myedu_con .left_con > ul.type02 > li > a {position: absolute; display: block; width: 100%; height: 30px; padding-left: 15px; bottom: 0px; left: 0px; text-align: left; border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd; background-color: #eeeeee;}
.myedu_con .left_con > ul.type02 > li > a span {display: block; padding-right: 0; font-size: 11px; line-height: 30px; color: #666666; background: url('../images/icon/icon_link_bg.png') no-repeat center right 30px; background-size: 13.5px;}
.myedu_con .left_con > ul.type02 > li > p {font-size: 11px;}
.myedu_con .left_con > ul.type02 > li > p span.pc_block {display: inline-block; font-size: 11px;}
.myedu_con .left_con > ul.type02 > li > p > span {display: inline-block; font-size: 12px;}
.myedu_con .left_con > ul.type02 > li > p > strong {font-size: 14px;}
.myedu_con .left_con > ul.type02 > li > p + p {margin-top: 5px;}
.myedu_con .right_con div.table_area {height: 365px;}
.edu_th_list {width: 820px; margin: 0 0 10px 130px;  font-size: 0px;}
.edu_th_list li {width: 117px;}
.edu_th_list li span {padding-top: 65px; font-size: 12px;}
.edu_th_list li span::before {width: 60px; height: 60px; left: 50%; margin-left: -30px;}
.edu_th_list li span.bg01::before {background: url('../images/sub/edu_tbl_bg01.png') no-repeat center center #fff; background-size: 60px;}
.edu_th_list li span.bg02::before {background: url('../images/sub/edu_tbl_bg02.png') no-repeat center center #fff; background-size: 60px;}
.edu_th_list li span.bg03::before {background: url('../images/sub/edu_tbl_bg03.png') no-repeat center center #fff; background-size: 60px;}
.edu_th_list li span.bg04::before {background: url('../images/sub/edu_tbl_bg04.png') no-repeat center center #fff; background-size: 60px;}
.edu_th_list li span.bg05::before {background: url('../images/sub/edu_tbl_bg05.png') no-repeat center center #fff; background-size: 60px;}
.edu_th_list li span.bg06::before {background: url('../images/sub/edu_tbl_bg06.png') no-repeat center center #fff; background-size: 60px;}
.edu_th_list li span.bg07::before {background: url('../images/sub/edu_tbl_bg07.png') no-repeat center center #fff; background-size: 60px;}
.con_line .con_left + .con_right {margin: 30px 0 0 0px;}

.bg_box {margin-bottom: 10px; padding: 10px 15px; border-radius: 5px;}
.sign_btn {width: 153px; height: 70px; border-radius: 10px;}
.sign_btn a {padding: 10px; font-size: 13px;}
.sign_area {height: 160px; margin: 20px auto;}

/* 퍼센트영역 */
.percent_list_area {margin-bottom: 20px;}
.percent_list_area ul li {height: 57px;}
.percent_list_area ul li > div {padding: 13px 15px;}
.percent_list_area ul li div span {font-size: 12px;}
.percent_list_area ul li div strong {margin-top: 10px; font-size: 14px;}
.percent_list_area ul li div span + strong {margin-top: 5px;}
.percent_list_area ul li div div.percent {width: 38px; height: 38px; top: 10px; right: 15px; }

/* 과제목록 - 북러닝 */
.edu_list {margin-bottom: 15px;}
.edu_list > ul > li + li {margin-top: 20px;}
.edu_list > ul > li > div {padding: 23px 11px 15px;}
.edu_list > ul > li > div > span.txt_tag {position: absolute; display: inline-block; height: 17px; padding: 0 10px; top: -6px; left: 20px; font-size: 11px; line-height: 15px;}
.edu_list > ul > li > div > .num_area strong {font-size: 13px;}
.edu_list > ul > li > div > .con_area .con_inner_area01 {padding: 0px 40px 0px 0;}
.edu_list > ul > li > div > .con_area .con_inner_area01 > strong {font-size: 16px;}
.edu_list > ul > li > div > .con_area .con_inner_area01 > ul {margin-top: 5px;}
.edu_list > ul > li > div > .con_area .con_inner_area02 {margin-top: 18px; padding: 10px 14px;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li {display: block; padding-right: 0px; font-size: 13px;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li > strong + span {position: relative; padding-left: 20px;}
.edu_list > ul > li > div > .con_area ul.edu_info_list > li > strong + span::before {position: absolute; display: block; content: ""; width: 1px; height: 10px; top: 5px; left: 8px; background-color: #cccccc;}
.edu_list > ul > li > div > .con_area .scorebox {width: 32px; height: 32px; top: 3px; right: 0px;}
.edu_list > ul > li > div > .con_area .scorebox span {font-size: 13px; line-height: 32px;}
.edu_list > ul > li > div > .con_area .hits_area {margin-top: 5px;}
.edu_list > ul > li > div > .con_area .hits_area ul li + li {margin-left: 10px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span {font-size: 12px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.nice {padding-left: 23px; background: url('../images/icon/icon_debate_bg01_on.png') no-repeat center left; background-size: 25px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.interest {padding-left: 23px; background: url('../images/icon/icon_debate_bg02_on.png') no-repeat center left; background-size: 25px;}
.edu_list > ul > li > div > .con_area .hits_area ul li span.comment {padding-left: 23px; background: url('../images/icon/icon_debate_bg03.png') no-repeat center left; background-size: 25px;}


/* 팝업 학습방법 */
.edu_step_list > li + li::before {top: 4px; left: 35px;}
.edu_step_list > li > div {width: 80px; height: 60px;}
.edu_step_list > li > div > span {width: 80px; font-size: 12px; letter-spacing: -0.06em;}
.edu_step_list > li > div > span.num {top: 18px;}
.edu_step_list > li > p {width: calc(100% - 100px); margin-left: 15px; font-size: 12px;}

/* faq */
.faq_area {overflow: hidden; margin-bottom: 20px;}
.faq_area > ul > li + li {margin-top: 10px;}
.faq_area > ul > li div.faq_h {padding: 15px 11px;}
.faq_area > ul > li div.faq_h strong.num {margin-bottom: 8px; font-size: 13px;}
.faq_area > ul > li div.faq_h span.classify {margin-bottom: 5px; flex-basis: auto; font-size: 12px;}
.faq_area > ul > li div.faq_h strong.tit {margin-bottom: 8px; font-size: 14px;}
.faq_area > ul > li div.faq_h ul > li {font-size: 12px;}
.faq_area > ul > li div.faq_h ul > li > span + span {padding-left: 18px;}
.faq_area > ul > li div.faq_h ul > li > span + span::before {width: 1px; height: 10px; top: 5px; left: 7px;}
.faq_area > ul > li div.faq_c {position: relative; display: none; padding: 17px 11px 50px 11px;}
.faq_area > ul > li div.faq_c div {position: relative; min-height: auto; padding-left: 0px; background: none;}
.faq_area > ul > li div.faq_c div::before {content: none;}
.faq_area > ul > li div.faq_c div p {padding-left: 0px; font-size: 12px;}
.faq_area > ul > li div.faq_c a {position: absolute; display: inline-block; bottom: 18px; left: 11px; padding-right: 20px; font-size: 13px; color: #0e173e; background: url('../images/icon/icon_acc_arrow.png') no-repeat center right;}

/* 검색결과없을경우 */
.none_search_keyword {padding: 5px 0px 5px 40px; line-height: normal; font-size: 16px; background: url('../images/icon/icon_exclamation.png') no-repeat center left; background-size: 25px 27px;}

/* 에러페이지 */
.error_area h1 {margin-top: 45px;}
.error_area h1 > a {font-size: 20px;}
.error_area h1 > a > span {padding-left: 38px; background: url('../images/common/logo02.png') no-repeat center left; background-size: 30px 30px;}
.error_area > strong {margin-top: 53px; margin-bottom: 17px; font-size: 18px;}
.error_area > strong + p {padding-top: 20px;}
.error_area > p {margin-bottom: 25px; padding-bottom: 165px; font-size: 14px; background: url('../images/common/error_bg.png') no-repeat center bottom; background-size: 170px 145px;}

/* 운영자립도 진단 */
.abl_step_area {margin-bottom: 23px;}
.abl_step_area > .abl_step_top > ul.type01 {margin: 0 11px; padding: 20px 0;}
.abl_step_area > .abl_step_top > ul.type01 > li + li {margin-top: 10px;}
.abl_step_area > .abl_step_top > ul.type01 > li > span {width: 15px; height: 15px; font-size: 11px; line-height: 13px;}
.abl_step_area > .abl_step_top > ul.type01 > li > p {padding-right: 17px; font-size: 12px;}

.abl_step_area > .abl_step_top > ul.type02 > li {padding: 0px 25px;}
.abl_step_area > .abl_step_top > ul.type02 > li > p {padding: 10px 0 10px 34px; font-size: 12px;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(1) > p {background: url('../images/common/abl_step_bg01.png') no-repeat center left; background-size: 25px 26px;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(2) > p {background: url('../images/common/abl_step_bg02.png') no-repeat center left; background-size: 25px 26px;}
.abl_step_area > .abl_step_top > ul.type02 > li:nth-child(3) > p {background: url('../images/common/abl_step_bg03.png') no-repeat center left; background-size: 25px 26px;}

.abl_step_area > .abl_step_mid .inner {padding: 15px;}
.abl_step_area > .abl_step_mid .inner .mid_h {margin-bottom: 8px;}
.abl_step_area > .abl_step_mid .inner .mid_h span {float: none; width: 60px; margin-bottom: 10px; margin-right: 0px; font-size: 11px;}
.abl_step_area > .abl_step_mid .inner .mid_h p {font-size: 12px; word-break: keep-all;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li + li {margin-top: 6px; margin-left: 0px;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li span {width: 17px; height: 17px; font-size: 11px; line-height: 15px;}
.abl_step_area > .abl_step_mid .inner .mid_c ul li p {margin-left: 5px; font-size: 12px;}

.abl_step_area > .abl_step_bottom {padding: 11px 10px;}
.abl_step_area > .abl_step_bottom strong {margin-bottom: 13px; font-size: 12px;}
.abl_step_area > .abl_step_bottom div {height: 16px;}

.abl_form_area {margin-bottom: 26px;}
.abl_form_area > div {padding: 15px 12px;}
.abl_form_area > div > strong {font-size: 12px;}
.abl_form_area > ul > li div.question_h {padding: 15px 12px; font-size: 12px;}
.abl_form_area > ul > li div.question_a ul > li {padding: 13px 0;}

.num_chk input[type='radio'] + label {width: 15px; height: 15px; font-size: 11px; line-height: 13px;}
.num_chk input[type='radio']:checked + label {width: 15px; height: 15px; font-size: 11px; line-height: 13px;}

.num_chk input[type='radio'] + span {width: 16px; height: 16px; font-size: 12px; line-height: 14px;}
.num_chk input[type='radio']:checked + span {width: 16px; height: 16px; font-size: 12px; line-height: 14px;}
.num_chk > p {font-size: 12px;}

/* 자립도 영역 */
.gpa_box {margin-bottom: 20px; padding: 17px 11px;}
.gpa_box strong.gpa_txt {font-size: 12px;}
.gpa_box strong.gpa_score {top: 17px; right: 11px; font-size: 18px;}

/* 자주도 차트 영역 */
.independent_chart .independent_chart_h {padding: 10px 15px;}
.independent_chart .independent_chart_h span {padding: 48px 0px 0px 0px; font-size: 11px;}
.independent_chart .independent_chart_h span.in_h_txt01 {background: url('../images/common/independent_bg01.png') no-repeat top center; background-size: 35px 35px;}
.independent_chart .independent_chart_h span.in_h_txt02 {position: absolute; top: 10px; right: 15px; background: url('../images/common/independent_bg02.png') no-repeat top center; background-size: 35px 35px;}
.independent_chart .independent_chart_h div.line {position: absolute; width: calc(100% - 130px); height: 3px; bottom: 55px; margin: 0 65px; padding: 0px; left: 0px;}
.independent_chart .independent_chart_h div.line div::before {width: 12px; height: 17px; top: 50%; left: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_left02.png') no-repeat center center;}
.independent_chart .independent_chart_h div.line div::after {width: 12px; height: 17px; top: 50%; right: -1px; margin-top: -7.5px; background:url('../images/common/line_arrow_right02.png') no-repeat center center;}
.independent_chart .independent_chart_b > div {height: 310px;}

/* 역량진단 */
.diagnosis_area > ul > li {margin-bottom: 17px;}
.diagnosis_area > ul > li > strong {margin-bottom: 13px; font-size: 15px;}
.diagnosis_area > ul > li > ul > li {margin-bottom: 15px;}
.diagnosis_area > ul > li > ul > li > span {margin-bottom: 13px; font-size: 14px;}
.diagnosis_area > ul > li > ul > li > span > strong {margin-right: 9px;}
.diagnosis_area > ul > li > ul > li > div {padding: 10px 15px;}
.diagnosis_area > ul > li > ul > li > div > a {padding: 0 12px; font-size: 12px; border-radius: 17px;}
.diagnosis_area > ul > li > ul > li > div > a + a {margin-left: 15px;}

/* 토론상세(10.24 수정) */
.chat_div .boxDiv {position: relative; width: 100%;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow {max-width: 90%;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv {max-width: 90%;}
.chat_area .partinListArea .chatBox .chatrowBox .chatRow .speechBoxDiv .speechBox {max-width: 85%;}

/* 역량진단결과 */
.diagnosis_area {margin-bottom: 15px;}
.diagnosis_area .chart_area {height: 300px;}
.diagnosis_area .diagnosis_half + .diagnosis_half {margin-top: 15px;}
.diagnosis_area .diagnosis_half .chart_area {height: auto; padding: 20px 0px;}
.diagnosis_area .diagnosis_half .chart_area > div {height: 280px !important;}
.diagnosis_area .diagnosis_half .chart_area p {padding: 0 8px; font-size: 12px;}

.independent_none_con {padding-bottom: 153px; background: url('../images/sub/independent_none_bg.png') no-repeat center bottom; background-size: 123px;}
.independent_none_con strong {margin-bottom: 13px; font-size: 15px;}
.independent_none_con p {font-size: 13px;}

/* 이용안내 */
.guide_box {margin-bottom: 15px;}
.guide_box div {height: auto; padding: 18px 15px;}
.guide_box div strong {margin-bottom: 20px; font-size: 18px;}
.guide_box div p {font-size: 13px;}

.guide_box02 {margin-bottom: 30px;}
.guide_box02 > div > strong {margin-bottom: 10px; font-size: 13px;}
.guide_box02 > div + div {margin-top: 13px;}
.guide_box02 > div > div::before {height: 110px;}

.guide_box02 > div:nth-child(1) > div::before {background: url('../images/sub/guide_bg02.png') no-repeat center center #e4eaf5; background-size: 210px 107px;}
.guide_box02 > div:nth-child(2) > div::before {background: url('../images/sub/guide_bg03.png') no-repeat center center #f5e6dd; background-size: 210px 107px;}
.guide_box02 > div > div > ul {margin: 15px 0 15px 15px;}
.guide_box02 > div > div > ul > li {padding-left: 10px; font-size: 13px;}
.guide_box02 > div > div > ul > li::before {width: 4px; height: 4px; top: 5px; left: 0px;}
.guide_box02 > div > div > ul > li + li {margin-top: 13px;}

.guide_box03 {margin-bottom: 30px; padding-top: 10px;}
.guide_box03 ul li {width: calc(50% - 10px);}
.guide_box03 ul li:nth-child(odd) {margin-right: 10px;}
.guide_box03 ul li:nth-child(even) {margin-left: 10px;}
.guide_box03 ul li:nth-child(3),
.guide_box03 ul li:nth-child(4) {margin-top: 17px;}
.guide_box03 ul li div {height: 182px;}
.guide_box03 ul li div::before {height: 80px; background-size: 39px 38px !important;}
.guide_box03 ul li div span {width: 23px; height: 23px; margin-left: -11.5px; top: -11px; font-size: 12px; line-height: 23px;}
.guide_box03 ul li div p {font-size: 13px; padding: 15px 5px; letter-spacing: -0.04em;}

.guide_box04 > strong {margin-bottom: 13px; font-size: 18px;}
.guide_box04 > p {font-size: 13px;}
.guide_box04 > ul {margin-top: 25px;}
.guide_box04 > ul > li + li {margin-top: 30px;}
.guide_box04 > ul > li > div.guide_img {margin: 0 auto 15px;}
.guide_box04 > ul > li > div.guide_txt strong {margin-bottom: 14px; font-size: 15px;}
.guide_box04 > ul > li > div.guide_txt p {margin-bottom: 15px; font-size: 12px;}
.guide_box04 > ul > li > div.guide_txt ul li:nth-child(3),
.guide_box04 > ul > li > div.guide_txt ul li:nth-child(4) {margin-top: 10px;}
.guide_box04 > ul > li > div.guide_txt ul li span {padding: 2px 0 2px 32px; font-size: 11px; background-size: 25px !important;}

/* 사용자안내 */
.user_guide_area > ul > li + li {margin-top: 19px !important;}
.user_guide_area > ul > li > div::before {height: 108px;}
.user_guide_area > ul > li:nth-child(1) > div::before {background: url('../images/sub/user_guide_img01.png') no-repeat bottom 0px center #b2cee2; background-size: 191px 108px;}
.user_guide_area > ul > li:nth-child(2) > div::before {background: url('../images/sub/user_guide_img02.png') no-repeat bottom 0px center #bdead8; background-size: 191px 108px;}
.user_guide_area > ul > li:nth-child(3) > div::before {background: url('../images/sub/user_guide_img03.png') no-repeat bottom 0px center #7eb4c0; background-size: 191px 108px;}
.user_guide_area > ul > li > div > strong {margin: 15px 0 15px 0; font-size: 13px;}
.user_guide_area > ul > li > div > p {padding-bottom: 15px; font-size: 13px;}

/* 교육유형안내 */
.edu_info_txt_box {width: 100%; height: 89px; margin-bottom: 20px; background: url('../images/sub/edu_info_type_txtbg.png') no-repeat center right #f5f5f5; background-size: cover; border-radius: 10px;}
.edu_info_txt_box p {font-size: 13px; top: 50%; left: 12px;}
.edu_info_txt_box p strong {font-size: 16px;}

.edu_info_type_list_area {margin-bottom: 42px;}
.edu_info_type_list_area > strong {margin-bottom: 15px; font-size: 15px;}
.edu_info_type_list_area > div {padding: 20px 10px; border-radius: 10px;}
.edu_info_type_list_area > div > ul > li + li {margin-top: 25px;}

.edu_info_type_list_area > div > ul > li img {width: 88px; height: 53px; margin-right: 15px;}
.edu_info_type_list_area > div > ul > li > div {width: calc(100% - 103px);}
.edu_info_type_list_area > div > ul > li > div > strong {margin-top: 0px; font-size: 14px;}
.edu_info_type_list_area > div > ul > li > div > p {margin-top: 4px; font-size: 12px;}

/* 설문 */
.question_title_area {margin-bottom: 13px;}
.question_title_area > strong {margin-bottom: 10px; font-size: 15px;}
.question_title_area ul li {display: block; font-size: 11px; }
.question_title_area ul li + li {margin-top: 4px; margin-left: 0px;}
.question_title_area ul li strong + span {margin-left: 10px;}
.question_title_area ul li strong + span::before {width: 1px; height: 10px; top: 4px; left: -6px;}

.question_area {margin-bottom: 20px;}
.question_area .q_box {padding: 10px 15px;}
.question_area .q_box span.q_type {padding: 0 4px; font-size: 10px; border-radius: 10px;}
.question_area .q_box div.q_txt_box {margin-top: 7px; font-size: 12px;}
.question_area .q_box div.q_txt_box span {padding-right: 6px;}

.question_area .q_con .q_box div.q_txt_box pre {font-size: 12px;}
.question_area.type_red .q_con .q_box div.q_txt_box pre {font-size: 12px;}
.question_area.type_green .q_con .q_box div.q_txt_box pre {font-size: 12px;}

.question_area .q_box.sub {padding-left: 43px; border-radius: 10px;}
.question_area .q_box.sub::before {width: 14px; height: 14px; top: 9px; left: 21px; background: url('../images/icon/icon_q_bg.png') no-repeat center center; background-size: cover;}
.question_area .a_box {padding: 10px 15px;}
.question_area .a_box .a_list_type02 {margin: 0px; padding: 13px 0 25px 0;}
.question_area .a_box .a_list_type02 li {position: relative; flex: 1; padding-bottom: 34px; vertical-align: top; text-align: center;}
.question_area .a_box .a_list_type02 li > p {font-size: 11px;}
.question_area .a_box .a_list_type02 li.line {position: absolute; width: 100%; height: 3px; bottom: 40px; padding: 0px; left: 0px; background-color: #006cb8; z-index: 10;}
.question_area .a_box .a_list_type02 li.line div {position: relative;}
.question_area .a_box .a_list_type02 li.line div::before {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; left: -1px; margin-top: -6.5px; background:url('../images/common/line_arrow_left.png') no-repeat center center;}
.question_area .a_box .a_list_type02 li.line div::after {display: block; position: absolute; content: ""; width: 12px; height: 17px; top: 50%; right: -1px; margin-top: -6.5px; background:url('../images/common/line_arrow_right.png') no-repeat center center;}
.question_area .a_box .a_list_type02 li > .num_chk {position: absolute; left: 50%; bottom: -15px; margin-left: -9.5px;}
.question_area .a_box.table {padding: 3px;}
.question_area .a_box.table .table_area  {padding: 0px; border-radius: 10px;}
.question_area .a_box.table .table_area table.list thead th {padding: 9px 5px;}
.question_area .a_box.table .table_area table.list tbody td {padding: 8px 5px;}
.question_area .a_box .ex_box {margin-top: 10px; padding: 5px; font-size: 12px;}
.question_area .a_box .ex_box span {padding: 0px 7px 0 20px; font-size: 12px; background: url('../images/icon/icon_answer_bg.png') no-repeat center left 7px #78a8d1; background-size: 10px;}
.question_area .a_box ul.textarea_list_area li span {margin-bottom: 5px; font-size: 12px;}
.question_area .a_box ul.textarea_list_area li textarea {font-size: 12px;}

/* 기관안내 */
.introduce_area div {width: 100%; height: 88px; padding: 13px 9px 13px 85px; border-radius: 100px;}
.introduce_area div + div {margin-top: 15px;}
.introduce_area div:nth-child(1)::before {width: 60px; height: 60px; top: 14px; left: 17px; background: url('../images/sub/introduce_bg01.png') no-repeat center center #01a4b2; background-size: 60px; border-radius: 50%;}
.introduce_area div:nth-child(2)::before {width: 60px; height: 60px; top: 14px; left: 17px; background: url('../images/sub/introduce_bg02.png') no-repeat center center #3b5990; background-size: 60px; border-radius: 50%;}
.introduce_area div span {margin-bottom: 4px; font-size: 14px;}
.introduce_area div p {font-size: 12px;}

.introduce_area02 .introduce_box {margin-bottom: 15px; padding: 15px; border: 3px solid #e6eaed; background: url('../images/sub/introduce_bg03.png') no-repeat center right 0px #f9f9f9; background-size: cover;}
.introduce_area02 .introduce_box strong {font-size: 12px; color: #018f9b;}
.introduce_area02 .introduce_box strong + p {margin-top: 7px;}
.introduce_area02 .introduce_box p {font-size: 12px;}
.introduce_area02 .introduce_list_box ul li + li {margin-top: 18px;}
.introduce_area02 .introduce_list_box ul li div {max-width: 290px; height: auto; margin: 0 auto 10px;}
.introduce_area02 .introduce_list_box ul li div img {width: 100%; margin-bottom: 15px;}
.introduce_area02 .introduce_list_box ul li p {font-size: 13px;}

.rb_area {padding: 15px 10px;}
.rb_area > span {padding-left: 42px; font-size: 11px;}
.rb_area > span::before {width: 30px; height: 30px; top: -7px; left: 0px; background: url('../images/sub/rb_bg01.png') no-repeat center center; background-size: 30px;}
.rb_area > ul {margin-top: 17px; padding-top: 14px;}
.rb_area > ul > li {width: 50%; font-size: 11px;}
.rb_area > ul > li:nth-child(3) {margin-top: 4px;}
.rb_area > ul > li > strong {display: inline-block; width: 38px;}
.rb_area > ul > li > strong + span {padding-left: 17px;}
.rb_area > ul > li > strong + span::before {position: absolute; display: inline-block; content: ""; width: 1px; height: 10px; top: 6px; left: 0px; background-color: #999;}

/* 복지개발원 소개 */
.con_txt_box_area .con_txt_box {margin-bottom: 15px; padding: 17px;}
.con_txt_box_area .con_txt_box > strong {padding-left: 53px; line-height: 37px; font-size: 14px;}
.con_txt_box_area .con_txt_box.type01 > strong {background: url('../images/sub/con_txt_box_bg01.png') no-repeat left center; background-size: 37px;}
.con_txt_box_area .con_txt_box.type02 > strong {background: url('../images/sub/con_txt_box_bg02.png') no-repeat left center; background-size: 37px;}
.con_txt_box_area .con_txt_box.type03 > strong {background: url('../images/sub/con_txt_box_bg03.png') no-repeat left center; background-size: 37px;}
.con_txt_box_area .con_txt_box.type04 > strong {background: url('../images/sub/con_txt_box_bg04.png') no-repeat left center; background-size: 37px;}
.con_txt_box_area .con_txt_box > div {margin-top: 10px; padding: 14px 0 0 0px;}
.con_txt_box_area .con_txt_box > div > strong {font-size: 14px;}
.con_txt_box_area .con_txt_box > div > ul {margin-top: 20px;}
.con_txt_box_area .con_txt_box > div > ul > li {padding-left: 9px; font-size: 12px;}
.con_txt_box_area .con_txt_box > div > ul > li + li {margin-top: 13px;}
.con_txt_box_area .con_txt_box > div > ul > li::before {position: absolute; display: block; content: ""; width: 3px; height: 3px; top: 7px; left: 0px; background-color: #393f71;}

.position_guide_area div.map {height: 320px; margin-bottom: 15px;}
.public_transit_list li + li {margin-top: 15px;}
.public_transit_list li div {padding: 17px;}
.public_transit_list li div strong {padding-left: 53px; font-size: 14px; line-height: 37px;}
.public_transit_list li div p {margin-top: 10px; padding-top: 15px; font-size: 12px;}
.public_transit_list li:nth-child(1) div strong {background:url('../images/sub/transit_bg01.png') no-repeat left center; background-size: 37px;}
.public_transit_list li:nth-child(2) div strong {background:url('../images/sub/transit_bg02.png') no-repeat left center; background-size: 37px;}
.public_transit_list li:nth-child(3) div strong {background:url('../images/sub/transit_bg03.png') no-repeat left center; background-size: 37px;}

.val_area {margin: 43px 0 0 0;}
.val_area ul li {padding: 2px; border-radius: 10px 0 0 0;}
.val_area ul li strong {padding-bottom: 25px; top: -41px; font-size: 16px;}
.val_area ul li strong span {font-size: 12px;}
.val_area ul li p {font-size: 12px;}
.val_area ul li:nth-child(1) strong {background: url('../images/sub/val_bg01.png') no-repeat center bottom; background-size: 48px 25px;}
.val_area ul li:nth-child(2) strong {background: url('../images/sub/val_bg02.png') no-repeat center bottom; background-size: 48px 25px;}
.val_area ul li:nth-child(3) strong {background: url('../images/sub/val_bg03.png') no-repeat center bottom; background-size: 48px 25px;}
.val_area ul li:nth-child(4) strong {background: url('../images/sub/val_bg04.png') no-repeat center bottom; background-size: 48px 25px;}
.val_area ul li:nth-child(5) strong {background: url('../images/sub/val_bg05.png') no-repeat center bottom; background-size: 48px 25px;}

/* 교육체계 */
.eduSys_h {overflow: hidden; margin-bottom: 15px;}
.eduSys_h ul.left li + li {margin-top: 9px; margin-left: 0px;}
.eduSys_h ul.left li i {width: 24px; height: 24px;}
.eduSys_h ul.left li i.eduType01 {background: url('../images/sub/edu_type_bg01.png') no-repeat center center; background-size: 10px 12px;}
.eduSys_h ul.left li i.eduType02 {background: url('../images/sub/edu_type_bg02.png') no-repeat center center; background-size: 10px 12px;}
.eduSys_h ul.left li span {font-size: 11px;}
.eduSys_h ul.right {margin-top: 10px;}
.eduSys_h ul.right li + li {padding-left: 43px; background: url('../images/icon/icon_arrow03.png') no-repeat center left 5px;}
.eduSys_h ul.right li span {height: 27px; padding: 0 15px; line-height: 27px; font-size: 11px;}

ul.eduSys_list li + li {padding-top: 13px;}
ul.eduSys_list li span {padding: 4px 10px; font-size: 12px;}
ul.eduSys_list li span.bg01 {padding-left: 23px; background: url('../images/sub/edu_type_bg01.png') no-repeat center left 5px #fff;}
ul.eduSys_list li span.bg02 {padding-left: 23px; background: url('../images/sub/edu_type_bg02.png') no-repeat center left 5px #fff;}
ul.eduSys_list.type02 li + li {padding-left: 0px; background: url('../images/icon/icon_arrow04.png') no-repeat top -5px center; background-size: 10px 16px;}
ul.eduSys_list + ul.eduSys_list {margin-top: 18px; padding-top: 18px; border-top: 1px solid #000;}

/* 사이트맵 */
.sitemap_area > ul > li {margin-bottom: 30px;}
.sitemap_area > ul > li > strong {height: 30px; font-size: 15px; line-height: 30px;}
.sitemap_area > ul > li > ul {margin-top: 13px;}
.sitemap_area > ul > li > ul > li + li {margin-top: 15px;}
.sitemap_area > ul > li > ul > li > a {padding-left: 8px;}
.sitemap_area > ul > li > ul > li > a::before {width: 3px; height: 3px; top: 10px; left: 0px;}
.sitemap_area > ul > li > ul > li > a > span {font-size: 12px;}
.sitemap_area > ul > li > ul > li > ul {margin: 10px 0 15px 0; padding: 13px;}
.sitemap_area > ul > li > ul > li > ul > li + li {margin-top: 10px;}
.sitemap_area > ul > li > ul > li > ul > li > a {font-size: 11px;}

/* 동영상영역 */
.player_area .player_wrap .youtube_area {margin-bottom: 12px;}
.player_area .player_info_area .player_tit_area {padding-bottom: 17px; margin-bottom: 17px;}
.player_area .player_info_area .player_tit_area > strong {margin-bottom: 13px; font-size: 15px;}

.side_menu_area {height: auto;}
.side_menu_area > div.inner {height: auto;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > span {margin-bottom: 10px; padding: 2px 5px; font-size: 10px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > a {font-size: 12px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li > a::after {width: 13px; height: 13px; margin-left: 5px; background: url('../images/icon/icon_play02.png') no-repeat center center; vertical-align: middle;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type01 > li.active > a::after {background: url('../images/icon/icon_play.png') no-repeat center center;}

.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div {padding: 5px 2px; font-size: 12px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div.time {width: 60px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div.info {width: calc(100% - 60px);}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div span + span {padding-top: 10px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div input[type='text'] {height: 27px; font-size: 12px; line-height: 25px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div input[type='text']::placeholder {font-size: 12px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area {padding: 0px; top: 5px; right: 5px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a {width: 28px; height: 20px; font-size: 11px; border-radius: 5px; line-height: 20px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li div div.btn_area a + a {border-left: 5px;}
.side_menu_area > div.inner > div.side_list_box > div > ul.type02 > li a.row_del_btn {width: 15px !important; height: 15px; top: 2px; right: 0px; background: url('../images/icon/icon_delete_bg.png') no-repeat center center #f35858;}

.side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt {padding: 5px;}
.side_menu_area > div.inner > div.side_list_box > .side_con div.side_info_txt p {font-size: 12px;}




/* 외부교육관리 */
.label_list {display: block !important;}
.label_list li {display: block;}
.label_list li + li {margin-left: 0px; margin-top: 5px;}
.time_com_area {overflow: hidden; display: block; width: 100%;}
.time_com_area input[type='text'] {width: 100%;}
.time_com_area input[type='text'] + a {margin-left: 0px; margin-top: 10px;}
.time_com_area a {width: 100%; vertical-align: middle;}
.pop_h_con01 {margin-bottom: 5px;}
.pop_h_con01 label {font-size: 12px;}
.pop_h_con01 label + input[type='text'] {margin-left: 4px;}
.pop_h_con01 input[type='text'] + label.label_check {margin-left: 4px;}

}