/* 메인 슬릭 슬라이더 */
.v_textBody p {
  font-weight: 700;
}

.v_textBody p:last-child {
  font-weight: 400;
}

.v_textBody h2 {
  letter-spacing: -0.04em;
}
.v_textBody h2 span.red {
  color: #e3452e;
}

/* 콘텐츠 아이콘 리스트 */
.contentsList ul li {
  padding: 36px 20px;
}

/* 풋터 배너 */
.footerBannerBody {
  background-image: url(../images/online/footerBanner.png);
  background-position: center center;
}

/* 서브 학과소개 > 학과개요 */
.d_informationBody {
  display: flex;
  flex-direction: column;
  gap: 80px;
}

.tit_cont {
  padding-bottom: 0;
}

.tit_cont h3 {
  color: #3c5bda;
}

.tit_cont h3::before,
.tit_cont h3::after {
  background-color: #3c5bda;
  width: 276px;
}

.d_informationBody h4 {
  margin-bottom: 24px;
}

.introduce_itemList {
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-align: center;
  margin-top: 24px;
}

.introduce_itemList.item3 {
  flex-direction: row;
}

.introduce_itemList li {
  width: 100%;
  padding: 14px 0;
  border: 1px solid #3c5bda33;
  border-radius: 20px;
  font-size: 18px;
  font-weight: 600;
}

.introduce_itemList li.blueBg {
  background-color: #748efc;
  margin-bottom: 12px;
}

.introduce_itemList.item3 li {
  width: calc(100% / 4);
  padding: 120px 0 14px;
  background: no-repeat center 24px / 80px;
}

.introduce_itemList.item3 li:nth-child(1) {
  background-image: url(../images/online/introduce_item_1.png);
}

.introduce_itemList.item3 li:nth-child(2) {
  background-image: url(../images/online/introduce_item_2.png);
}

.introduce_itemList.item3 li:nth-child(3) {
  background-image: url(../images/online/introduce_item_3.png);
}

.introduce_itemList.item3 li:nth-child(4) {
  background-image: url(../images/online/introduce_item_4.png);
}

.introduce_itemList li strong {
  font-family: "Seoul CyberB";
  font-size: 20px;
  line-height: 1.3;
  letter-spacing: -0.04em;
  color: #ffffff;
}

.introduce_itemList.item3 li strong {
  font-family: "Pretendard Variable";
  font-size: 18px;
  letter-spacing: -0.02em;
  color: #000;
}

.introduce_itemList li strong span {
  display: block;
}

.introduce_itemList li .beforeCircle {
  display: flex;
  justify-content: center;
  align-items: center;
}

.introduce_itemList li .beforeCircle::before {
  content: "";
  background-color: #3c5bda;
  font-size: 29px;
  margin: -4px 11px 0 0;
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50px;
}

.online_titBox {
  width: 100%;
  padding: 80px 0;
  background-image: url(../images/online/online_titBox.png);
  background-size: cover;
  background-position: center;
  border-radius: 20px;
  letter-spacing: -0.04em;
  color: #fff;
  text-align: center;
}

.online_titBox h4 {
  font-size: 28px;
  line-height: 1.3;
}

.online_titBox h4 strong {
  display: block;
  font-size: 48px;
  padding: 16px 0 0;
}

.online_titBox h4 + p {
  font-size: 16px;
  line-height: 1.3;
  letter-spacing: -0.02em;
}

.orderList {
  width: 100%;
  display: flex;
  letter-spacing: -0.02em;
  height: 74px;
}

.orderList strong {
  width: 310px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  background-color: #748efc;
  border-radius: 50px;
  color: #ffffff;
  font-size: 24px;
}

.orderList span {
  width: calc(100% - 272px);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: 68px;
  border-radius: 0 50px 50px 0;
  color: #3c5bda;
  font-size: 20px;
  background-color: #f3f5f9;
  margin-left: -38px;
  z-index: -1;
  font-weight: 600;
  border: 1px solid #3c5bda66;
}

.textList_small p {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.textList_small p:first-child {
  margin-top: 0;
}

.textList_small span {
  display: inline-block;
  line-height: 1.5;
  letter-spacing: -0.02em;
  border: 1px solid #3c5bda;
  border-radius: 50px;
  padding: 8px 24px;
  color: #3c5bda;
  background-color: #3c5bda0f;
}

/* 서브 교육과정 > 학습로드맵 */
.licenseTable .textLeft ol li {
  list-style: disc;
}

.materialBody {
  gap: 56px;
}

/* 서브 교육과정 > 커리큘럼 */
.icon_diamond_blue {
  position: relative;
  font-size: 0;
  letter-spacing: 0;
  text-indent: -9999px;
}
.icon_diamond_blue::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 20px;
  background: no-repeat center / cover;
  width: 20px;
  background-image: url(../images/icons/diamond_blue.png);
}

/* 서브 교육과정 > 교과목소개 */
.courseList li .c_imgBody {
  background-image: url(../images/online/course_1.jpg);
}

.courseList li:nth-of-type(2) .c_imgBody {
  background-image: url(../images/online/course_2.jpg);
}

.courseList li:nth-of-type(3) .c_imgBody {
  background-image: url(../images/online/course_3.jpg);
}

.courseList li:nth-of-type(4) .c_imgBody {
  background-image: url(../images/online/course_4.jpg);
}

.courseList li:nth-of-type(5) .c_imgBody {
  background-image: url(../images/online/course_5.jpg);
}

.courseList li:nth-of-type(6) .c_imgBody {
  background-image: url(../images/online/course_6.jpg);
}

.courseList li:nth-of-type(7) .c_imgBody {
  background-image: url(../images/online/course_7.jpg);
}

.courseList li:nth-of-type(8) .c_imgBody {
  background-image: url(../images/online/course_8.jpg);
}

.courseList li:nth-of-type(8) .c_imgBody {
  background-image: url(../images/online/course_8.jpg);
}

.courseList li:nth-of-type(9) .c_imgBody {
  background-image: url(../images/online/course_9.jpg);
}

.courseList li:nth-of-type(10) .c_imgBody {
  background-image: url(../images/online/course_10.jpg);
}

.courseList li:nth-of-type(11) .c_imgBody {
  background-image: url(../images/online/course_11.jpg);
}

.courseList li:nth-of-type(12) .c_imgBody {
  background-image: url(../images/online/course_12.jpg);
}

.courseList li:nth-of-type(13) .c_imgBody {
  background-image: url(../images/online/course_13.jpg);
}

.courseList li:nth-of-type(14) .c_imgBody {
  background-image: url(../images/online/course_14.jpg);
}

.courseList li:nth-of-type(15) .c_imgBody {
  background-image: url(../images/online/course_15.jpg);
}

.courseList li:nth-of-type(16) .c_imgBody {
  background-image: url(../images/online/course_16.jpg);
}

.courseList li:nth-of-type(17) .c_imgBody {
  background-image: url(../images/online/course_17.jpg);
}

.courseList li:nth-of-type(18) .c_imgBody {
  background-image: url(../images/online/course_18.jpg);
}

.courseList li:nth-of-type(19) .c_imgBody {
  background-image: url(../images/online/course_19.jpg);
}

.courseList li:nth-of-type(20) .c_imgBody {
  background-image: url(../images/online/course_20.jpg);
}

.courseList li:nth-of-type(21) .c_imgBody {
  background-image: url(../images/online/course_21.jpg);
}

.courseList li:nth-of-type(22) .c_imgBody {
  background-image: url(../images/online/course_22.jpg);
}

.courseList li:nth-of-type(23) .c_imgBody {
  background-image: url(../images/online/course_23.jpg);
}

.courseList li:nth-of-type(24) .c_imgBody {
  background-image: url(../images/online/course_24.jpg);
}

.courseList li:nth-of-type(25) .c_imgBody {
  background-image: url(../images/online/course_25.jpg);
}

/* 서브 교육과정 > 졸업후진로 */
.textList > div {
  padding-top: 40px;
}

.textList > div:first-child {
  padding-top: 0;
}

.textList > div:first-child p:first-child {
  margin-top: 0;
}

.textList p {
  margin-top: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.textList span {
  display: inline-block;
  font-size: 20px;
  line-height: 1.5;
  letter-spacing: -0.02em;
  border: 1px solid #3c5bda;
  border-radius: 50px;
  padding: 8px 24px;
  color: #3c5bda;
  background-color: #ffffff;
}

.textList p:nth-of-type(even) span.blue,
.textList span.blue {
  background-color: #3c5bda;
  color: #ffffff;
}

/* 서브 강의체험 > 강의맛보기 */
.imageList {
  display: flex;
  gap: 40px 20px;
  flex-wrap: wrap;
}

.imageList li {
  width: calc((100% - 40px) / 3);
  border: 1px solid #ebeef1;
  border-radius: 20px;
  overflow: hidden;
}

.imageList li a {
  letter-spacing: -0.02em;
}

.imageList li a .i_imgBody {
  width: 100%;
  height: 180px;
  border-radius: 0;
}

.imageList.big li a .i_imgBody {
  height: 310px;
}

.imageList li a strong {
  display: block;
  font-size: 20px;
  line-height: 1.5;
  margin: 16px 16px 6px;
  word-break: keep-all;
}

.imageList li a p {
  font-size: 14px;
  line-height: 1.5;
  color: #6a6f75;
  margin: 0 16px 16px;
}

.page li.active a {
  background-color: #3c5bda;
}

/* 서브 온컴스토리 > 학교소식 */
.contentBody .tabContent ul li a.blue {
  border-radius: 20px;
  border: 1px solid #bbc8ff;
}

.noneTextBody {
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: #41454a;
}

.list_search_form {position: relative; margin-top:0px; width: 100%; height: 40px; padding-right:67px; box-sizing: border-box; text-align: right; vertical-align: top;}
.list_search_form .result {position: absolute; bottom:0; left:0; font-size:16px; line-height: 20px;}
.list_search_form .selectbox {display: inline-block; text-align: left; width: 130px; margin-right:7px;}
.list_search_form .comText {width: 300px; height: 40px; border:1px solid #e5e5e5; font-size:16px; background:#fff; padding:0 15px; box-sizing: border-box; vertical-align: top;}
.list_search_form button {position: absolute; right:0; bottom:0; display: block; margin-left:-1px; width: 68px; height: 40px; font-size:16px; border:1px solid #3499ff; color:#3499ff; z-index: 1; vertical-align: top;}

.list_search_form.not_search {margin-top:0; height: 20px;}

/* table table_data */
.table {width: 100%;}
.table table {
  width: 100%; 
  border-top: 1px solid #3c5bda;
  table-layout: fixed;
}
legend, caption, hr{width: 0; height: 0; overflow: hidden; opacity: 0; font-size:0; line-height: 0; text-indent: -999em;}

.table.table_data{position:relative;overflow:auto;}
.table.table_data::-webkit-scrollbar {height: 6px;  /* Í∞ÄΰúÏ∂ï ?§ÌŨΰ§Î∞î Í∏∏Ïù?*/}
.table.table_data::-webkit-scrollbar-track {background-color: #e5e5e5;}
.table.table_data:-webkit-scrollbar-track-piece {background-color: #e5e5e5;}
.table.table_data::-webkit-scrollbar-thumb {background-color:#3499ff;}
.table.table_data table{min-width:600px;box-sizing:border-box;}
.table.table_data thead tr th{height:50px;text-align:center;font-size:17px; line-height: 25px;font-weight:700;border-top:1px solid #c6d0dd;border-right:1px solid #c6d0dd;border-bottom:2px solid #4d75a7;background:#ecf2fa;color:#333;word-break:keep-all;box-sizing:border-box;}
.table.table_data thead tr th.bt{border-bottom:0;}
.table.table_data thead tr th:last-child{border-right:0;}

.table.table_data tbody tr th{font-size:16px;line-height: 28px;}
.table.table_data thead tr th.first{border-left:0;}
.table.table_data tbody tr td{padding:25px 10px;font-size:16px;line-height:28px;border-left:1px solid #e1e1e1;border-bottom:1px solid #e1e1e1;}
.table.table_data tbody tr td.first{border-left:none;border-bottom:1px solid #333;}
.table.table_data tbody tr th {text-align: center;}
.table.table_data tbody tr th.first{border-left:0;}
.table.table_data tbody tr td.th{border-bottom:1px solid #e1e1e1;text-align: center; vertical-align: middle;}
.table.table_data tbody tr td.center {text-align: center; vertical-align: middle;}
.table.table_data tbody tr td.bttm{border-bottom:1px solid #333;}

.table.table_data tbody tr td .course{display:block;position:relative;padding-left:10px;}
.table.table_data tbody tr td .course::before{content:'';position:absolute;left:0;top:13px;width:4px;height:4px;border-radius:2px;background-color:#111;}

.table.table_data table.roadmap_table thead th.sub {padding:6px 0;}
.table.table_data table.roadmap_table tbody td {vertical-align: top; padding:16px 10px 16px 20px;word-break: break-all;}
.table.table_data table.roadmap_table tbody td.table_bg01 {border-left:0}
.table.table_data table.roadmap_table tbody td.center,
.table.table_data table.roadmap_table tbody td.th {text-align: center; vertical-align: middle; padding-left:0; padding-right:0;}

.table.table_data tbody tr td ul.dot li {position: relative; padding:3px 0 3px 9px; box-sizing: border-box; font-size:16px; line-height: 28px; font-weight: normal;}
.table.table_data tbody tr td ul.dot li:before {content: ""; position: absolute; top:17px; left:0; display: block; width: 3px; height: 3px; background: #3499ff;}





/* .table.table_board thead {
  display: none;
} */
.table.table_board thead tr th {
  text-align: center;
  font-size: 18px;
  line-height: 1.8;
  padding: 20px 16px;
  font-weight: 400; 
  border-bottom:1px solid #ebeef1; 
  color: #2c2f32; 
  word-break: keep-all;
}
.table.table_board tbody tr td {
  text-align: center; 
  font-size: 16px;
  line-height: 1.8;
  padding: 20px 4px;
  border-bottom:1px solid #ebeef1; 
   vertical-align: middle;
 }
.table.table_board tbody tr td.link_data {
  text-align: left;
}
.table.table_board tbody tr td.link_data .m_info {
  display: none;
  
}
.table.table_board tbody tr td.link_data .link {
  position: relative; 
  display: inline-block; 
  max-width:100%; 
  text-overflow:ellipsis;
  white-space:nowrap;
  word-wrap:normal; 
  overflow:hidden; 
  vertical-align: top; 
  letter-spacing: -0.03em;
  box-sizing: border-box;
  font-size: 16px;
}
.table.table_board tbody tr td.link_data .link.new {
  padding-right:20px;
}
.table.table_board tbody tr td.link_data .link.new:before {
  content: "";
  position: absolute;
  top:50%; 
  right:0; 
  display: block;
  width: 15px; 
  height: 15px; 
  margin-top:-7px; 
  background: url("../images/common/icons.png") no-repeat -425px -500px;
}
.table.table_board tbody tr td.sp {
  font-size: 14px;
  color: #6a6f75;
}
.table.table_board tbody tr td .download {
  position: relative; 
  display: inline-block; 
  vertical-align: top;
  overflow: hidden;
  text-indent: -99999px;
  width: 40px;
  height: 28px;
}
.table.table_board tbody tr td .download:before {
  content: "";
  position: absolute;
  top:50%; 
  left:50%;
  margin:-11px 0 0 -11px;
  display: block;
  width: 23px;
  height: 16px;
  background: url("../images/icons/icons.png") no-repeat -400px -500px;
}

.table.table_board tr.notice {
  /* background-color: #f4f8fb; */
}
.table.table_board tr.notice td {
  /* background-color: #f3f5f9 !important; */
}
.table.table_board tr.notice td .link {
  font-weight: bold;
}
.table.table_board tr.notice td .ib {
  display: inline-block; 
  line-height: 24px;
  padding: 6px 13px; 
  background-color: #3c5bda ; 
  color:#fff; 
  z-index: 1;
  border-radius: 50px;
  font-style: normal;
}


input, label {border-radius: 0 !important;  -webkit-appearance: none; -webkit-border-radius: 0 !important;}
.selectbox {position: relative; width: 190px;}
.selectbox label {position: absolute; top:0; left:0; width: 100%; height: 40px; border:1px solid #e5e5e5; padding:0 45px 0 20px; box-sizing: border-box; font-size:16px; color:#666666; background: #fff; background: #fff url("../images/common/bg_drop_lst.png") no-repeat right center; z-index: 1; line-height: 37px; cursor: pointer; z-index: 1;}
.selectbox select {position: relative; width: 100%; height: 40px; opacity: 0; filter:alpha(opacity=0); -webkit-appearance: none; -moz-appearance: none; appearance: none; z-index: 2;}
.selectbox select::-ms-expand { display:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; }
.selectbox select option {display: block; padding:0 45px 0 20px;}


.page_index {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 40px;
}
.page_index .pb {
  display: block;
  width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: 50px;
  text-align: center;
  font-size: 16px;
  letter-spacing: -0.02em;
  color: #41454a;
}
.page_index .pb.btn_next,
.page_index .pb.btn_prev {
  width: 16px;
  display: block;
  overflow: hidden;
  text-indent: -999px;
  margin: 0 16px;
  background-image: url(../images/icons/arrow_page_gray.png);
  background-size: cover;
  border-radius: 0;
}


.page_index .pb.btn_prev {
  transform: rotate(180deg);
}

.page_index .active { 
  background-color: #3c5bda;
  color: #fff;
}


.clearfix:after {content: ""; display: block; clear: both;}
article.cont {padding-top:0px;}
h4 {margin-bottom:10px;}
p.desc {font-size:16px; line-height: 28px;}
.c_blue {color:#3499ff;}
.m_blue {color:#1a2fce;}




/*액션버튼*/
.actionArea{position:relative;padding:5px 0;} 
.actionArea.view{padding-top:15px;}
.actionArea .inner{position:relative;text-align:right;}

.actionArea .inner a{position:relative;display:inline-block;background:#000;width: 14%;text-align:center;box-sizing:border-box;border: 1px solid #000; padding:12px 0 12px 0;color: #000;letter-spacing:-1px;}
.actionArea .inner a:hover{opacity:.9;}

.board_viewer {display: block; margin-top:10px; border-top:1px solid #3C5BDA !important;}
.board_viewer .viewer_header {position: relative; padding:25px 20px; background: #F3F5F9;}
.board_viewer .viewer_header .title {font-size:24px; line-height: 32px; padding:1px 0; width: 100%;}
.board_viewer .viewer_header .info {margin-top:12px;}
.board_viewer .viewer_header .info li {position: relative; display: block; float:left; margin-left:20px; padding-left:20px; font-size:14px; line-height: 24px; color:#666;}
.board_viewer .viewer_header .info li em {font-weight: bold; margin-right:6px;}
.board_viewer .viewer_header .info li:first-child {margin-left:0; padding-left:0;}
.board_viewer .viewer_header .info li:before {content: ""; position: absolute; top:50%; left:0; display: block; width: 1px; height: 16px; margin-top:-8px; background-color: #dce2e7;}
.board_viewer .viewer_header .info li:first-child:before {display: none;}

.board_viewer .viewer_downline {height: 61px; padding:18px 20px; border-bottom:1px solid #e5e5e5; box-sizing: border-box; vertical-align: top; background-color: #f0f4f7; vertical-align: top; color:#666;}
.board_viewer .viewer_downline .down_title {position: relative; padding-left:31px; display: inline-block; font-size:14px; height: 24px; line-height: 24px; font-weight: bold; vertical-align: top; text-indent: -999em;}
.board_viewer .viewer_downline.disable .down_title {text-indent: 0; margin-right:5px; }
.board_viewer .viewer_downline .down_title:before {content: ""; position: absolute; top:3px; left:0; display: block; width: 23px; height: 16px; background: url("../images/common/icons.png") no-repeat -400px -500px;}
.board_viewer .viewer_downline .down_link {font-size:14px; line-height: 24px; vertical-align: top;}
.board_viewer .viewer_downline a.down_link {color:#000;}

.board_viewer .viewer_body {padding:40px 20px; border-bottom:1px solid #e5e5e5;}
.board_viewer .viewer_body .img {margin-bottom:34px;}

.board_viewer .viewer_footer {}
.board_viewer .viewer_footer .page_button > div {
  position: relative; 
  padding:19px 60px 19px 90px; 
  box-sizing: border-box; 
  border-bottom:1px solid #e5e5e5;
}
.board_viewer .viewer_footer .page_button > div .t {
  position: absolute; 
  top: 50%;
  transform: translateY(-50%);
  left: 20px;
  font-size: 18px;
  }
.board_viewer .viewer_footer .page_button > div.disable .t {color:#999;}
.board_viewer .viewer_footer .page_button > div > .link {
  position: relative; 
  display: block;
  width:100%; 
  color:#000; 
  white-space:nowrap; 
  overflow:hidden;
  text-overflow:ellipsis;
  font-size: 18px;
}
.board_viewer .viewer_footer .page_button > div > .link:hover,
.board_viewer .viewer_footer .page_button > div > .link:focus {text-decoration: underline;}
.mobile .board_viewer .viewer_footer .page_button > div > .link:hover,
.mobile .board_viewer .viewer_footer .page_button > div > .link:focus {text-decoration: none;}
.board_viewer .viewer_footer .page_button > div > .link.none {text-decoration: none !important; color:#999;}
.board_viewer .viewer_footer .page_button > div:before {content: ""; position: absolute; top:50%; right:20px; display: block; width: 14px; height: 8px; margin-top:-4px; background: url("../images/common/icons.png") no-repeat 0 0; background-position: 0 -550px}
.board_viewer .viewer_footer .page_button > div.page_next:before {background-position: -25px -550px;}
.board_viewer .viewer_footer .page_button > div.disable:before {background-position: 0 -575px;}
.board_viewer .viewer_footer .page_button > div.page_next.disable:before {background-position: -25px -575px;}

.board_viewer .viewer_footer .comment {position: relative; border-bottom:1px solid #e5e5e5; background: #f0f4f7; padding:13px 110px 17px 20px;}
.board_viewer .viewer_footer .name {font-size:16px; line-height: 24px; color:#333333; font-weight: bold;}
.board_viewer .viewer_footer .com_text {margin-top:9px;}
.board_viewer .viewer_footer .date {position: absolute; top:15px; line-height: 24px; right:20px; color:#999;}
.board_viewer .viewer_footer .btns {position: absolute; bottom:19px; right:20px;}
.board_viewer .viewer_footer .btns ul li {position: relative; display: block; float:left;}
.board_viewer .viewer_footer .btns ul li:first-child {padding-right:12px; margin-right:10px;}
.board_viewer .viewer_footer .btns ul li:before {content: ""; position: absolute; top:50%; right:0; display: block; width:1px; height: 12px; margin-top:-6px; background: #cccccc;}
.board_viewer .viewer_footer .comment.comment_write {padding:20px 110px 20px 20px;}
.board_viewer .viewer_footer .comment.comment_write .form_text {display: block; border:1px solid #e5e5e5; font-size:14px; line-height: 24px; width:100%; height: 80px; padding:15px 20px; box-sizing: border-box; color:#333;}
.board_viewer .viewer_footer .comment.comment_write button {position: absolute; top:20px; right:20px; width:80px; height: 80px; padding:30px 0; text-align: center; box-sizing: border-box; line-height: 20px; color:#3499ff; font-weight: bold; border:1px solid #3499ff; background: #fff;}

.board_viewer .viewer_buttons {padding-top:30px;}
.board_viewer .viewer_buttons .btn_list {display: inline-block; width: 140px; height: 50px; line-height: 50px; font-size:16px; color:#fff; text-align: center; background-color: #3C5BDA;}




.photo_gallery {margin-top:20px; padding:30px 0; border-top:1px solid #222222; border-bottom:1px solid #e5e5e5;}
.photo_gallery ul {margin:0 -10px;}
.photo_gallery ul li {display: block; float:left; padding:10px; width:25%; box-sizing: border-box;}
.photo_gallery ul li .page_link {position: relative; display: block; width:100%; height: 260px; padding-top:144px; border:1px solid #e5e5e5; box-sizing: border-box;}
.photo_gallery ul li .page_link .image {position: absolute; top:0; left:0; padding:1px; width:100%; height: 144px; overflow: hidden; background: url("../images/common/bg_video.jpg") no-repeat center center; background-size: cover;  object-fit: cover;}
.photo_gallery ul li .page_link .image img {display: none;}
.photo_gallery ul li .page_link .image:before {content: ""; position: absolute; top:0; left:0; width: 100%; height: 100%; background: #000; opacity: 0; -webkit-transition:opacity 0.15s cubic-bezier(0, 0, 0.25, 1) 0.15s; transition:opacity 0.15s cubic-bezier(0, 0, 0.25, 1) 0.15s; z-index: 1;}
.photo_gallery ul li .page_link .image:after {content: ""; position: absolute; top:50%; left:50%; margin:-20px 0 0 -20px; display: block; width:40px; height: 40px; background: url("../images/common/icons.png") no-repeat -50px -550px; z-index: 2; opacity: 0; -webkit-transition:opacity 0.15s cubic-bezier(0, 0, 0.25, 1) 0.15s; transition:opacity 0.15s cubic-bezier(0, 0, 0.25, 1) 0.15s;}
.photo_gallery ul li .page_link:hover .image:before,
.photo_gallery ul li .page_link:focus .image:before {opacity: 0.3;}
.mobile .photo_gallery ul li .page_link:hover .image:before,
.mobile .photo_gallery ul li .page_link:focus .image:before {opacity: 0;}
.photo_gallery ul li .page_link:hover .image:after,
.photo_gallery ul li .page_link:focus .image:after {opacity: 1;}
.mobile .photo_gallery ul li .page_link:hover .image:after,
.mobile .photo_gallery ul li .page_link:focus .image:after {opacity: 0;}
.photo_gallery ul li .page_link .image img {position: absolute; top:50%; left:50%; width: 100%; height: 100%; object-fit: cover; transform: translate(-50%, -50%);}
.photo_gallery ul li .page_link .infos {display: block; padding:16px 20px 0;}
.photo_gallery ul li .page_link .infos > span {display: block;}
.photo_gallery ul li .page_link .infos .t {font-size:16px; line-height: 24px; height: 48px; color:#333; font-weight: bold; max-width: 100%; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word; white-space: normal; word-break: keep-all; overflow: hidden;}
.photo_gallery ul li .page_link .infos .date {position: absolute; bottom:11px; left:20px; font-size:14px; line-height: 24px; color:#999;}
.photo_gallery ul li .page_link .infos .count {position: absolute; bottom:17px; right:20px; font-size:14px; line-height: 24px; color:#999;}

.buttons {padding-top:20px;}
.buttons .btn_write {display: inline-block; width: 140px; height: 50px; line-height: 49px; font-size:16px; color:#fff; text-align: center; background-color: #1c4475;}
.buttons.m_hide {display: block;}


@media all and (max-width:1340px) {
  .tit_cont h3::before, .tit_cont h3::after{width: 176px;}
  .orderList {word-break: keep-all; line-height: 1.25;}
  .orderList strong{width: 250px; font-size: 20px;}
  .orderList span{width: 100%; padding-right: 2em;padding-left: 60px;font-size: 18px; }
  .introduce_itemList li, .textList_small span{font-size: 15px;}
  .textList span{font-size: 16px;}

}
@media all and (max-width:1200px) {
  .introduce_itemList li{padding: 14px 1.5em}
  .introduce_itemList li .beforeCircle .m_only{display: block !important}
  .introduce_itemList li .beforeCircle {
    position: relative;
     display: block;
     padding-left: 18px;
     line-height: 1.25;
   }
   
   .introduce_itemList li .beforeCircle::before {
     position: absolute;
     font-size: 29px;
     margin: 0;
     top: calc(50% - 2px);
     left: 16px;
   }
}
@media all and (max-width:1023px) {
  .photo_gallery ul li {width: 33.333%;}
  .contentsList ul li{padding: 26px 20px;}
  .contentsList ul li .c_iconBody{margin-right: 20px;}
  
}



/*768px 이하일 때만 적용*/
@media all and (max-width:900px) {
  .gnb .logo, .sectionBody, .footerMenuBody{padding: 0 16px;}
  .subWrap{padding: 0 16px;}
  
 .list_search_form.not_search {display: none;}
 .list_search_form .result {display: none;}
 .list_search_form {margin-top:0; padding-left:100px; padding-right:84px;}
 .list_search_form .selectbox {position: absolute; bottom:0; left:0; width: 90px;}
 .list_search_form .selectbox label {padding-left:15px; padding-right:33px; background-image: url("../images/common/bg_drop_lst_m.png"); background-size: 27px 7px;}
 .list_search_form .comText {width: 100%; font-size:14px;}
 .list_search_form button {width: 85px;font-size:14px;}
 .table.table_data thead tr th {font-size:14px; line-height: 21px; padding:10px 0;}
 .table.table_data tbody tr th {font-size:14px; line-height: 21px; padding:10px 0;}
 .table.table_data tbody tr td {font-size:14px; line-height: 21px; padding:10px 12px;}
 .table.table_data tbody tr td ul.dot li {font-size:14px; line-height: 21px; padding:2px 0 2px 9px;}
 .table.table_data tbody tr td ul.dot li:before {top:11px;}
 
 .table.table_data table.roadmap_table tbody td {vertical-align: top; padding:9px 5px 9px 12px;}
 .table.table_board {margin-top:10px;}
 .table.table_board colgroup {display: none;}
 .table.table_board thead tr th {
   font-size:14px;
   padding: 12px 8px;
 }
 .table.table_board tbody tr td {
   font-size:14px;
   padding: 12px 8px;
 }
 .table.table_board thead tr th.sp,
 .table.table_board tbody tr td.sp {display: none;}
 .table.table_board thead tr th.num {width: 61px;}
 .table.table_board tbody tr td.num {
   width: 61px; 
   vertical-align: middle; 
   box-sizing: border-box;
 }
 .table.table_board tbody tr td.link_data .m_info {
   display: flex;
   gap: 18px;
 }
 .table.table_board tbody tr td.link_data .m_info li {
   font-size:12px;
   color: #6a6f75;
 }
 .table.table_board tbody tr td.link_data .link {
   font-size: 14px;
 }
 .table.table_board tbody tr td.link_data .link.new {padding-right:20px;}
 .table.table_board tbody tr td.link_data .link.new:before {width: 13px; height: 13px; margin-top:-6px; background-position: -400px -250px; background-size: 500px auto;}
 .table.table_board tbody tr td .download {
   width: 30px;
   height: 100%;
 }
 
 .table.table_board table tbody tr.notice td:nth-child(1) {padding-top:9px;}
 .table.table_board table tbody tr.notice td:nth-child(1) .ib {
   font-size:12px;
   line-height: 24px;
   padding: 0px 11px;
 }
 .selectbox label {font-size:14px; background-image: url("../images/common/bg_drop_lst_m.png"); background-size: 27px 7px;}
 .page_index {
   margin-top: 24px;
 }
 
 .page_index .pb {
   width: 32px;
   height: 32px;
   line-height: 32px;
   font-size: 16px;
 }
 
 .page_index .pb.btn_next,
 .page_index .pb.btn_prev {
   width: 16px;
   margin: 0 16px;
 }
 .rightContent article.cont {padding: 25px 0 0;}
 h4 {font-size:18px; line-height: 28px; margin-top:-5px; margin-bottom:5px;}
 p.desc {font-size:14px; line-height: 23px;}
 .board_viewer {margin-top:-5px;}
 .board_viewer .viewer_header {padding:15px;}
 .board_viewer .viewer_header .title {font-size:16px; line-height: 24px;}
 .board_viewer .viewer_header .info {margin-top:0;}
 .board_viewer .viewer_header .info li {margin-left:10px; padding-left:11px; font-size:12px; line-height: 22px;}
 .board_viewer .viewer_header .info li:before {height: 10px; margin-top:-5px;}
 .board_viewer .viewer_header .info li em {margin-right:4px;}
 
 .board_viewer .viewer_downline {height: 37px; padding:6px 15px;}
 .board_viewer .viewer_downline .down_title {position: relative; padding-left:30px; margin-right:3px;}
 .board_viewer .viewer_downline .down_title:before {content: ""; position: absolute; top:3px; left:0; display: block; width: 22px; height: 16px; background: url("../images/common/icons.png") no-repeat -375px -250px; background-size: 500px auto;}
 
 .board_viewer .viewer_body {padding:20px 15px;}
 .board_viewer .viewer_body .img {margin-bottom:16px;}
 
 
 
 .board_viewer .viewer_footer .page_button > div {
   padding:14px 45px 14px 63px; 
 }
 .board_viewer .viewer_footer .page_button > div .t {
   left: 14px;
   font-size: 12px;
 }
 .board_viewer .viewer_footer .page_button > div > .link {
   font-size: 12px;
 }
 
 .board_viewer .viewer_footer .page_button > div:before {right: 16px; width: 11px; height: 7px; margin-top:-3px; background-position: -300px -275px; background-size: 500px auto;}
 .board_viewer .viewer_footer .page_button > div.page_next:before {background-position: -325px -275px;}
 .board_viewer .viewer_footer .page_button > div.disable:before {background-position: -350px -275px;}
 .board_viewer .viewer_footer .page_button > div.page_next.disable:before {background-position: -375px -275px;}
 
 .board_viewer .viewer_buttons {padding-top:20px;}
 .board_viewer .viewer_buttons .btn_list {width: 120px; height: 40px; font-size:14px; line-height: 40px; padding:0; box-sizing: border-box;}
 
 .board_viewer .viewer_footer .comment {padding:10px 15px 35px;}
 .board_viewer .viewer_footer .name {font-size:14px;}
 .board_viewer .viewer_footer .com_text {margin-top:3px; font-size:14px; line-height: 24px; word-break: break-all;}
 .board_viewer .viewer_footer .date {top:10px; right:15px;}
 .board_viewer .viewer_footer .btns {bottom:10px; right:15px;}
 .board_viewer .viewer_footer .btns ul li a {display: inline-block; font-size:12px; line-height: 22px;}
 .board_viewer .viewer_footer .comment.comment_write {padding:15px; text-align: center;}
 .board_viewer .viewer_footer .comment.comment_write .form_text {height: 75px;}
 .board_viewer .viewer_footer .comment.comment_write button {position: relative; margin-top:15px; top:0; left:0; width: 80px; height: 33px; line-height: 31px; font-size: 12px; padding:0;}
 
 
 .photo_gallery {padding:15px 0;}
 .photo_gallery ul {margin:-5px;}
 .photo_gallery ul li {width: 50%; padding:5px;}
 .photo_gallery ul li .page_link {padding-top:156px; height: 250px;}
 .photo_gallery ul li .page_link .image {height: 156px;}
 .photo_gallery ul li .page_link .infos {padding:12px 15px 9px;}
 .photo_gallery ul li .page_link .infos .date {font-size:12px; position: relative; top:0; left:0; right: 0; bottom:0; display: inline-block;}
 .photo_gallery ul li .page_link .infos .count {font-size:12px; position: relative; top:0; left:0; right: 0; bottom:0; margin-left:5px; padding-left:8px; display: inline-block;}
 .photo_gallery ul li .page_link .infos .count:before {content: ""; position: absolute; top:50%; left:0; width: 1px; height: 9px; margin-top:-4px; background: #999;}
 .photo_gallery ul li .page_link .infos .t {margin-bottom:4px; overflow: hidden; line-height: 22px; height: 44px;}
 
 .buttons.m_hide {display: none;}
 .buttons .btn_write {width: 120px; height: 40px; font-size:14px; line-height: 39px; padding:0; box-sizing: border-box;}
 /* 메인 슬릭 슬라이더 */
 
 /* 콘텐츠 아이콘 리스트 */
 .contentsList ul li {
   padding: 16px 20px;
 }
 
 /* 서브 학과소개 > 학과안내 */
 .d_informationBody {
   gap: 56px;
 }
 
 .tit_cont h3::before,
 .tit_cont h3::after {
   width: 18px;
   top: -7px;
 }
 
 .d_informationBody h4 {
   margin-bottom: 16px;
 }
 
 .introduce_itemList {
   gap: 8px;
   margin-top: 16px;
 }
 
 .introduce_itemList.item3 {
   flex-direction: column;
 }
 
 .introduce_itemList li {
   padding: 8px 16px;
   border-radius: 10px;
   font-size: 14px;
   text-align: left;
   line-height: 1.4;
   position: relative;
 }
 
 .introduce_itemList li.blueBg {
   margin-bottom: 8px;
   text-align: center;
 }
 
 .introduce_itemList.item3 li {
   width: 100%;
   padding: 24px 16px 24px 96px;
   background: no-repeat 16px 16px / 56px;
 }
 
 .introduce_itemList li strong {
   font-size: 18px;
 }
 
 .introduce_itemList.item3 li strong {
   font-size: 14px;
 }
 
 .introduce_itemList li .beforeCircle::before{left: 0; width: 8px; height: 8px;}
 
 .introduce_itemList li .beforeCircle .blue{display: inline-block; margin: 2px -4px;}

 .online_titBox {
   padding: 56px 0;
   border-radius: 10px;
 }
 
 .online_titBox h4 {
   font-size: 24px;
 }
 
 .online_titBox h4 strong {
   font-size: 28px;
   padding: 24px 0 0;
 }
 
 .online_titBox h4 + p {
   font-size: 13px;
 }
 
 .orderList {
   flex-direction: column;
   height: auto;
 }
 
 .orderList strong {
   width: 100%;
   line-height: 40px;
   font-size: 16px;
 }
 
 .orderList span {
   width: 100%;
   justify-content: center;
   margin-top: -18px;
   padding: 30px 32px 12px;
   border-radius: 0 0 20px 20px;
   font-size: 15px;
   margin-left: 0;
   text-align: center;
   line-height: 1.8;
 }
 
 .textList_small p {
   margin-top: 8px;
   flex-wrap: wrap;
   gap: 8px;
 }
 
 .textList_small span {
   font-size: 13px;
   padding: 8px 20px;
 }
 
 /* 서브 교육과정 > 커리큘럼 */
 .icon_diamond_blue::before {
   height: 14px;
   width: 14px;
 }
 
 /* 서브 교육과정 > 졸업후진로 */
 .textList > div {
   padding-top: 32px;
 }
 
 .textList p {
   margin-top: 8px;
   gap: 8px;
 }
 
 .textList p.m_only {
   display: flex !important;
 }
 
 .textList span {
   font-size: 14px;
   padding: 8px 20px;
 }
 
 /* 서브 강의체험 > 강의맛보기 */
 .imageList {
   gap: 34px 0;
   flex-direction: column;
 }
 
 .imageList li {
   width: 100%;
 }
 
 .imageList li a .i_imgBody {
   width: 100%;
   height: auto;
 }
 
 .imageList li a strong {
   font-size: 20px;
   margin: 11px 11px 6px;
 }
 
 .imageList li a p {
   font-size: 14px;
   margin: 0 11px 11px;
 }
 
 /* 서브 온컴스토리 > 학교소식 */
 .noneTextBody {
   height: 281px;
   font-size: 13px;
 }
}

@media all and (max-width:620px){
  .textList p{flex-wrap: wrap}
}
@media all and (max-width:600px){
  .photo_gallery ul li .page_link {padding-top:116px; height: auto;}
  .photo_gallery ul li .page_link .image {height: 116px;}

}
@media all and (max-width:359px){
  .photo_gallery ul li {width: 100%;}
  .photo_gallery ul li .page_link .infos .t {height: auto; max-height: 44px;}
}

@media all and (max-width:356px){
  .textList span{font-size: 13px; padding: 8px 14px;}
  .introduce_itemList li strong{font-size: 16px;}
}
@media all and (max-width:325px){
  .tit_cont strong{font-size: 16px;}
  .tit_cont h3{font-size: 24px;}
  .tit_cont p strong{font-size: 18px;}
  .tit_cont p br.m_only{display: none !important}
}

@media all and (max-width: 320px){
  .contentsList ul li .c_iconBody{
    width: 45px;
    height: 45px;
    margin-right: 10px;
  }
  .introduce_itemList li{padding: 8px 12px;}
  .textList span{padding: 8px 12px; white-space: nowrap;}
}