@charset "UTF-8";

#wrapper {
  position: relative;
  padding: 110px 0 0;
}
#wrapper.type1 {
  position: relative;
  padding: 0;
}
#wrapper.type2 {
  position: relative;
  margin-top: 55px;
  padding: 0;
}
#wrapper.type3 {
  position: relative;
  padding: 110px 0 0;
}
#wrapper.fixm01,
#wrapper.fixm02 {
  transition: padding 0.5s;
}

/* header(서브 전용 헤더 스타일) */
#header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  transition: all 0.3s;
}

/* sub banner */
.banner img {
  width: 100%;
}

/* 페이지 닫는 버튼 */
.page_close {
  position: absolute;
  top: 15px;
  right: 15px;
}
.page_close img {
  width: 15px;
}

/* select style */
select.v1 {
  height: 30px;
  padding-left: 10px;
  border: 1px solid #dfdfdf;
  background: #fff url(/images/commonSub/bg_select.png) no-repeat right center;
  background-size: 33px;
  outline: none;
  outline: 0px;
  color: #010101;
  font-size: 12px;
  transition: all 0.2s ease-out;
  vertical-align: top;
  color: #666 !important;
}
select.v2 {
  height: 44px;
  padding-left: 15px;
  background: url(/images/board/sel_arr02.gif) right 15px center no-repeat;
  background-size: 11px 7px;
  border: 1px solid #222;
  border-radius: 5px;
  color: #555;
}

/* input style */
input[type="submit"] {
  cursor: pointer;
}
.form input[type="radio"] {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.form input[type="radio"] + label {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  padding-left: 29px;
  cursor: pointer;
  line-height: 22px;
}
.form input[type="radio"] + label:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  background: url(/images/sub/radio_ico.png) 0 0 no-repeat;
  background-size: 100%;
}
.form input[type="radio"]:checked + label:after {
  background-position: 0 -22px;
}
.form input[type="checkbox"] {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.form input[type="checkbox"] + label {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  padding-left: 29px;
  cursor: pointer;
  line-height: 22px;
}
.form input[type="checkbox"] + label:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  background: url(/images/sub/chk_ico.png) 0 0 no-repeat;
  background-size: 100%;
}
.form input[type="checkbox"]:checked + label:after {
  background-position: 0 -22px;
}
.product input[type="radio"] {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.product input[type="radio"] + label {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  padding-left: 29px;
  cursor: pointer;
  line-height: 17px;
}
.product input[type="radio"] + label:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  background: url(/images/sub/radio_ico.png) 0 0 no-repeat;
  background-size: 100%;
}
.product input[type="radio"]:checked + label:after {
  background-position: 0 -22px;
}

/* sub common */
.sub_nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  top: 55px;
  left: 0;
  width: 100%;
  height: 55px;
  padding: 0 12px 0 20px;
  background: #ed3535 url(/images/sub/sub_nav_bg.png) center 0 no-repeat;
  background-size: 66%;
  z-index: 99;
  transition: all 0.5s;
}
.sub_nav.fixed {
  box-shadow: 5.7px 5.7px 8px 0 rgb(0 0 0 / 10%);
}
.sub_nav h2 {
  position: relative;
  margin-top: -3px;
  color: #fff;
}
.sub_nav h2 > a {
  display: inline-block;
  position: relative;
  font-weight: 900;
  font-size: 18px;
  color: #fff;
}
.sub_nav h2 > a.depth:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: -20px;
  width: 13px;
  height: 8px;
  margin-top: -4px;
  background: url(/images/sub/sub_nav_arr.png) 0 0 no-repeat;
  background-size: 100%;
  transition: transform 0.5s;
}
.sub_nav h2 > a.depth.on:before {
  transform: rotate(180deg);
}
.sub_nav h2 > a + ul {
  opacity: 0;
  position: absolute;
  top: 34px;
  left: 0;
  min-width: 135px;
  background-color: #fff;
  border: 1px solid #121212;
  border-radius: 14px;
  transition: all 0.5s;
  transform: translateZ(0) scale(0);
}
.sub_nav h2 > a.on + ul {
  opacity: 1;
  transform: translateZ(0) scale(1);
}
.sub_nav h2 > a + ul li:not(:first-child) {
  border-top: 1px dashed #ccc;
}
.sub_nav h2 > a + ul li a {
  display: flex;
  align-items: center;
  height: 38px;
  padding: 0 12px;
  font-size: 14px;
  color: #121212;
  white-space: nowrap;
}
.sub_nav .link img {
  width: 79px;
}
.sub_nav .sch {
  width: 55px;
  height: 23px;
  padding: 1px 10px 0 0;
  background: #fff url(/images/sub/experienceHall/sch_ico.png) 6px 5px no-repeat;
  background-size: 12px;
  border-radius: 12px;
  font-size: 13px;
  text-align: right;
}
/* .sub_nav .sch a{display:block; width:15px; height:17px; background:url(/images/common/sch_ico.gif) 0 0 no-repeat; background-size:15px auto;}
.sub_nav .sch a.on{background-position:0 -17px;} */
.sub_nav select {
  width: 75px;
  height: 25px;
  padding-left: 9px;
  background: #fff url(/images/sub/sel_arr01.gif) right 10px center no-repeat;
  background-size: 9px 6px;
  border: 1px solid #222;
  border-radius: 4px;
}
.sub_contents {
  padding: 0 17px 30px;
}
.sub_contents > h3 {
  padding-left: 10px;
  margin-bottom: 8px;
  font-weight: 700;
  font-size: 18px;
}

/* 단강몰 검색 */
#globalSearch {
  overflow: hidden;
  height: 0;
  opacity: 0;
  transition: all 0.5s;
}
#globalSearch.on {
  overflow: visible;
  height: 43px;
  margin-top: 15px;
  opacity: 1;
}
#globalSearch.on:before {
  content: "";
  display: block;
  position: absolute;
  top: 48px;
  left: 0;
  width: 100%;
  height: 59px;
  background-color: #fff;
}
#globalSearch div {
  position: relative;
  width: 100%;
  height: 43px;
  padding: 5px;
  border: 1px solid #ed3535;
  border-radius: 5px;
}
#globalSearch div form {
  display: inline;
}
#globalSearch div input[type="search"] {
  width: calc(100% - 60px);
  height: 30px;
  border: none;
}
#globalSearch div input[type="submit"] {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 55px;
  height: 30px;
  background-color: #ed3535;
  border: none;
  border-radius: 5px;
  font-weight: 700;
  font-size: 11px;
  color: #fff;
}

/* tab(1:페이지 이동 탭, 2:온라인강의실/아이디 비밀번호 찾기, 3:메타코칭, 5:아이디 비밀번호 찾기, 6:학습신청) */
.tab1 {
  display: flex;
  text-align: center;
}
.tab1 + .form {
  padding: 30px 17px 50px;
}
.tab1 a {
  flex: 1;
  height: 43px;
  background-color: #fff;
  border: 1px solid #ed3535;
  font-weight: 700;
  font-size: 15px;
  line-height: 42px;
  color: #1c1b32;
}
.tab1 a.on {
  background-color: #ed3535;
  color: #fff;
}
.tab2 {
  display: flex;
  justify-content: center;
  position: relative;
  margin: 12px 0;
}
.tab2 li {
  position: relative;
  background-color: #e9e9e9;
}
.tab2 li:first-child {
  border-radius: 20px 0 0 20px;
}
.tab2 li:last-child {
  border-radius: 0 20px 20px 0;
}
.tab2 li.line {
  position: absolute;
  top: 0;
  left: 0;
  width: 105px;
  height: 40px;
  background-color: #fff;
  border: 2px solid #e5e5e5;
  border-radius: 20px;
  font-weight: 700;
  color: #ed3535;
  line-height: 36px;
  transition: transform 0.5s;
}
.tab2 li a,
.tab2 li label {
  display: block;
  height: 36px;
  padding: 0 12px;
  font-weight: 700;
  font-size: 13px;
  color: #a4a4a4;
  line-height: 36px;
  text-align: center;
}
.tab2 li.on a,
.tab2 li.on label {
  background-color: #ed3535;
  border: 2px solid #e9e9e9;
  border-radius: 20px;
  color: #fff;
  line-height: 32px;
}
.tab2 li input {
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
}
.tab2.type1 a,
.tab2.type1 label {
  width: 122px;
}
.tab2.type2 a,
.tab2.type2 label {
  width: 137px;
}
.tab3 {
  display: flex;
  justify-content: center;
  margin: 30px 0 15px;
  padding: 0 15px;
}
.tab3.scroll {
  display: block;
  overflow-x: auto;
  -ms-overflow-style: none;
} /* 탭메뉴 스크롤 생성 시 */
.tab3.scroll::-webkit-scrollbar {
  display: none;
}
.tab3.scroll .inner {
  display: flex;
  width: 540px;
}
.tab3 a {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 32px;
  padding: 4px 0 5px;
  border: 1px solid #1b1b1b;
  border-radius: 50px;
  font-weight: 700;
  font-size: 13px;
  color: #1b1b1b;
  text-align: center;
  line-height: 17px;
}
.tab3 a:not(:first-child) {
  margin-left: 5px;
}
.tab3 a.on {
  background-color: #1b1b1b;
  color: #fff;
}
.tab5 {
  display: flex;
  text-align: center;
}
.tab5 a {
  position: relative;
  flex: 1;
  height: 51px;
  background-color: #fff;
  border-top: 1px solid #e7e7e7;
  border-bottom: 1px solid #e7e7e7;
  font-weight: 500;
  font-size: 15px;
  line-height: 51px;
  color: #1b1b1b;
}
.tab5 a.on {
  font-weight: 700;
  color: #ed3535;
}
.tab5 a.on:before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 50%;
  width: calc(100% - 40px);
  height: 2px;
  transform: translateX(-50%);
  background-color: #ed3535;
}
.tab6 {
  display: flex;
  text-align: center;
}
.tab6 a {
  flex: 1;
  height: 50px;
  background-color: #fff;
  border: 1px solid #1b1b1b;
  font-weight: 700;
  font-size: 15px;
  line-height: 50px;
  color: #1c1b32;
}
.tab6 a.on {
  background-color: #1b1b1b;
  color: #fff;
}
.tab6 a.on span {
  color: #f25555;
}

/* sign(1:게시판 상단, 2:컨텐츠 아래 작은 글) */
.sign1 {
  height: 43px;
  font-size: 13px;
  text-align: center;
  line-height: 42px;
}
.sign2 {
  margin-top: 15px;
  font-size: 11px;
  color: #97999b;
}
.sign2 span {
  color: #ed3535;
}
.sign2 + h3 {
  margin-top: 30px;
}

/* 컨텐츠 이미지 */
.sec_img + .form {
  margin-top: 35px;
}
.sec_img img {
  width: 100%;
}

/* 브랜드 안내 */
.brand1,
.brand2,
.brand3,
.brand4,
.brand5 {
  text-align: center;
}
.brand1 img,
.brand2 img,
.brand3 img,
.brand4 img,
.brand5 img {
  width: 100%;
}
.brand1 {
  padding-top: 82px;
  margin-bottom: 38px;
  background: url(/images/sub/brand_bg01.gif) 0 0 no-repeat;
  background-size: 100%;
}
.brand1 h3 {
  font-weight: 900;
  font-size: 42px;
  color: #fff;
  line-height: 54px;
}
.brand1 img {
  width: auto;
  height: 89px;
  margin: 23px 0;
}
.brand1 .txt1 {
  margin-bottom: 180px;
  font-weight: 700;
  font-size: 25px;
  line-height: 32px;
}
.brand1 .txt2 {
  margin-bottom: 19px;
  font-weight: 700;
  font-size: 18px;
}
.brand1 .txt2 span {
  color: #ed3535;
}
.brand1 .txt3 {
  margin-bottom: 40px;
  font-family: "MalgunGothic";
  font-size: 16px;
}
.brand1 .txt3 span {
  position: relative;
}
.brand1 .txt3 span:before {
  content: "";
  display: block;
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 10px;
  background-color: #ffe3e4;
  z-index: -1;
}
.brand1 .txt3 span b {
  color: #ed3535;
}
.brand1 .video {
  position: relative;
  padding-top: 56.25%;
}
.brand1 .video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}
.brand2 {
  margin-bottom: 25px;
}
.brand2 .img1 {
  margin-bottom: 35px;
}
.brand2 .txt1 {
  margin-bottom: 16px;
  font-weight: 700;
  font-size: 18px;
}
.brand2 .txt2 {
  font-size: 16px;
}
.brand2 .txt2 + .txt2 {
  margin-top: 20px;
}
.brand2 .txt2 span {
  font-weight: 700;
  color: #ed3535;
}
.brand2 .txt3 {
  margin: 25px 0 45px;
  font-weight: 900;
  font-size: 20px;
  color: #232b40;
}
.brand2 .txt3 span {
  display: inline-block;
  position: relative;
}
.brand2 .txt3 span:before {
  content: "";
  display: block;
  position: absolute;
  bottom: 1px;
  left: 0;
  width: 100%;
  height: 10px;
  background-color: #ffe3e4;
  z-index: -1;
}
.brand3 {
  padding-bottom: 65px;
}
.brand3 .img1 {
  margin-bottom: 40px;
}
.brand3 .img2 {
  margin: 53px 0 42px;
  padding: 0 15px;
}
.brand3 .tit {
  margin-bottom: 24px;
  font-size: 18px;
  line-height: 22px;
}
.brand3 .tit span {
  font-weight: 900;
}
.brand3 .tit span b {
  font-weight: 900;
  color: #ed3535;
}
.brand3 .txt1 {
  font-size: 16px;
}
.brand3 .txt1 + .txt1 {
  margin-top: 20px;
}
.brand3 .txt1 span {
  display: inline-block;
  position: relative;
  font-weight: 700;
}
.brand3 .txt1 span:before {
  content: "";
  display: block;
  position: absolute;
  bottom: 1px;
  left: 0;
  width: 100%;
  height: 10px;
  background-color: #ffe3e4;
  z-index: -1;
}
.brand3 .txt1 b {
  color: #ed3535;
}
.brand3 .txt2 {
  margin-top: 25px;
  font-weight: 900;
  font-size: 18px;
  color: #232b40;
}
.brand3 .txt2 span {
  display: inline-block;
  position: relative;
}
.brand3 .txt2 span:before {
  content: "";
  display: block;
  position: absolute;
  bottom: 1px;
  left: 0;
  width: 100%;
  height: 10px;
  background-color: #ffe3e4;
  z-index: -1;
}
.brand4 {
  padding-bottom: 60px;
}
.brand4 .img1 {
  margin-bottom: 18px;
}
.brand4 .txt1 {
  margin-bottom: 30px;
  font-weight: 700;
  font-size: 18px;
  color: #232b40;
}
.brand4 .txt2 {
  font-size: 16px;
}
.brand4 .txt3 {
  margin: 30px 0 35px;
  font-weight: 700;
  font-size: 18px;
}
.brand4 .txt3 span {
  display: inline-block;
  position: relative;
}
.brand4 .txt3 span:before {
  content: "";
  display: block;
  position: absolute;
  bottom: 1px;
  left: 0;
  width: 100%;
  height: 10px;
  background-color: #ffe3e4;
  z-index: -1;
}
.brand4 .txt3 span b {
  color: #ed3535;
}
.brand5 {
  position: relative;
  background: url(/images/sub/brand_bg02.gif) 0 0 no-repeat;
  background-size: 100%;
}
.brand5 div {
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
}
.brand5 div p {
  font-weight: 900;
  font-size: 18px;
  color: #fff;
}
.brand5 div p span {
  color: #ed3535;
}
.brand5 div a {
  display: inline-block;
  width: 237px;
  height: 40px;
  margin-top: 12px;
  background: #ed3535 url(/images/sub/brand_link_arr.png) center right 23px
    no-repeat;
  background-size: 4px 7px;
  border-radius: 20px;
  font-weight: 500;
  font-size: 16px;
  color: #fff;
  text-align: center;
  line-height: 39px;
}

/* 메타인지 기반 완전학습 */
.meta_intro {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 90px;
  margin-bottom: 32px;
  background: url(/images/sub/realTime_intro_bg.gif) center center no-repeat;
  background-size: auto 130px;
  font-size: 12px;
  color: #fff;
  text-align: center;
}
.meta_intro p span {
  color: #40fdbb;
}
.meta_titBox {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 94px;
  margin-bottom: 27px;
  background-color: #f9f9f9;
  border-top: 1px solid #ededed;
  border-bottom: 1px solid #ededed;
  text-align: center;
}
/* .meta_titBox.badge126{background:url(/images/sub/badge126.png) right 25px top no-repeat; background-size:40px auto;} */
.meta_titBox .tit {
  margin-bottom: 7px;
  font-weight: 700;
}
.meta_titBox .txt {
  font-size: 10px;
}
.meta_titBox .txt span {
  color: #ed3535;
}
.meta_wrap > .type1 {
  padding: 40px 20px;
  background-color: #fdf3f4;
  text-align: center;
}
.meta_wrap .type1 h3 {
  margin-bottom: 10px;
  font-size: 20px;
  line-height: 25px;
}
.meta_wrap .type1 h3 span {
  color: #ed3535;
}
.meta_wrap .type1 h3 span.cat {
  display: block;
  width: 70px;
  height: 17px;
  margin: 0 auto 3px auto;
  background-color: #2a5deb;
  border-radius: 15px;
  font-weight: 400;
  font-size: 9px;
  color: #fff;
  line-height: 16px;
  text-align: center;
}
.meta_wrap .type1 h4 {
  margin-bottom: 15px;
  font-weight: 700;
  font-size: 15px;
  line-height: 19px;
}
.meta_wrap .type1 h4 span {
  display: block;
  color: #2a5deb;
}
.meta_wrap .type1 > p {
  margin-bottom: 22px;
  font-size: 13px;
  line-height: 17px;
}
.meta_wrap .type1 > p span {
  display: block;
  color: #ed3535;
}
.meta_wrap .type2 {
  padding: 40px 20px;
  background-color: #fff;
  text-align: center;
}
.meta_wrap .type2 h3 {
  margin-bottom: 12px;
  font-weight: 700;
  font-size: 20px;
}
.meta_wrap .type2 h3 span {
  display: block;
  width: 70px;
  height: 17px;
  margin: 0 auto;
  background-color: #2a5deb;
  border-radius: 15px;
  font-weight: 400;
  font-size: 9px;
  color: #fff;
  line-height: 16px;
  text-align: center;
}
.meta_wrap .type2 h4 {
  margin-bottom: 12px;
  font-weight: 700;
  font-size: 15px;
  line-height: 19px;
}
.meta_wrap .type2 h4 .color1 {
  color: #2a5deb;
}
.meta_wrap .type2 h4 .color2 {
  color: #ed3535;
}
.meta_wrap .type2 > p {
  font-size: 13px;
  line-height: 16px;
}
.meta_wrap .type2 > p span {
  display: block;
  font-weight: 700;
}
.meta_wrap .type2 > p span b {
  color: #ed3535;
}
.meta_wrap .type3 {
  padding: 40px 20px;
  background-color: #f6efe5;
}
.meta_wrap .type4 {
  padding: 40px 20px;
  background-color: #e6f9f3;
  text-align: center;
}
.meta_wrap .type4 h3 {
  margin-bottom: 25px;
  font-size: 20px;
  line-height: 25px;
}
.meta_wrap .type4 h3 span {
  color: #ed3535;
}
.meta_wrap .type1 > div,
.meta_wrap .type2 > div {
  text-align: left;
}
.meta_wrap .type1 > div + div,
.meta_wrap .type2 > div + div,
.meta_wrap .type3 > div + div {
  margin-top: 40px;
}
.meta_wrap .type1 img,
.meta_wrap .type2 img,
.meta_wrap .type3 img,
.meta_wrap .type4 img {
  max-width: 100%;
}

/* 메타인지 기반 완전학습 - 스마트 강의 */
.smart_lctr1 {
  background: url(/images/sub/badge.gif) top right 40px no-repeat;
  background-size: 53px auto;
}
.smart_lctr1 > div {
  padding: 40px 20px;
  background-color: #fff;
  border-radius: 10px;
}
.smart_lctr1 > div ol li:first-child {
  margin-bottom: 30px;
}
.smart_lctr1 > div ol li p {
  position: relative;
  margin-bottom: 15px;
  padding-left: 30px;
  font-weight: 700;
  font-size: 10px;
  color: #1c1b32;
  line-height: 14px;
}
.smart_lctr1 > div ol li p:before {
  content: "1";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: 23px;
  height: 23px;
  transform: translateY(-50%);
  background-color: #1b1b1b;
  border-radius: 50%;
  font-weight: 700;
  font-size: 10px;
  color: #fff;
  line-height: 22px;
  text-align: center;
}
.smart_lctr1 > div ol li:nth-child(2) p:before {
  content: "2";
}
.smart_lctr1 > div ol li span {
  display: inline-block;
  margin-top: 10px;
  font-size: 8px;
  color: #888;
  line-height: 14px;
}
.smart_lctr1 > div > ul {
  padding: 0 0 0 12px;
}
.smart_lctr1 > div > ul > li {
  display: flex;
  align-items: center;
}
.smart_lctr1 > div > ul > li:not(:first-child) {
  margin-top: 20px;
}
.smart_lctr1 > div > ul > li .cat {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 55px;
  height: 55px;
  border-radius: 50%;
  background-color: #1b1b1b;
  font-weight: 700;
  font-size: 10px;
  color: #fff;
  text-align: center;
}
.smart_lctr1 > div > ul > li .con {
  width: calc(100% - 73px);
  margin-left: 18px;
  font-size: 10px;
  color: #1c1b32;
}
.smart_lctr1 > div > ul > li .con > p {
  margin-bottom: 6px;
  font-weight: 700;
}
.smart_lctr1 > div > ul > li .con > ul li {
  position: relative;
  padding-left: 5px;
}
.smart_lctr1 > div > ul > li .con > ul li:before {
  content: "";
  display: block;
  position: absolute;
  top: 8px;
  left: 0;
  width: 3px;
  height: 1px;
  background-color: #1c1b32;
}
.smart_lctr2 > img {
  height: 178px;
  margin: 28px 0;
}
.smart_lctr2 > div {
  padding: 40px 20px;
  background-color: #efefef;
  border-radius: 10px;
}
.smart_lctr2 > div ul {
  margin-bottom: 25px;
}
.smart_lctr2 > div ul li {
  position: relative;
  padding-left: 5px;
  font-size: 10px;
  color: #1c1b32;
}
.smart_lctr2 > div ul li:before {
  content: "";
  display: block;
  position: absolute;
  top: 8px;
  left: 0;
  width: 3px;
  height: 1px;
  background-color: #1c1b32;
}
.smart_lctr2 > div img + ul {
  margin-top: 8px;
}

/* 메타인지 기반 완전학습 - 내신완공, 레벨완공 */
.completion1.type1 h3 {
  margin-bottom: 25px;
}
.completion1 > div {
  position: relative;
  padding: 40px 20px;
  background-color: #fff;
  border-radius: 10px;
}
.completion1 > div:before {
  content: "";
  display: block;
  position: absolute;
  top: 20px;
  right: -20px;
  width: 172px;
  height: 131px;
  background: url(/images/sub/scholGrds_block.png) 0 0 no-repeat;
  background-size: 172px 131px;
}
.completion1 > div .tit {
  margin-bottom: 8px;
  font-weight: 700;
  font-size: 15px;
}
.completion1 > div .txt {
  font-size: 10px;
  line-height: 14px;
}
.completion1 > div .txt span {
  font-weight: 700;
  color: #2a5deb;
}
.completion2.type2 h3 {
  font-weight: 400;
  font-size: 13px;
}
.completion2.type2 h3 b {
  font-weight: 700;
}
.completion2 ul {
  display: flex;
  justify-content: center;
}
.completion2 ul li:nth-child(2) {
  margin-left: 10px;
}
.completion2 ul li p {
  margin-bottom: 5px;
  font-weight: 700;
  font-size: 10px;
  color: #1c1b32;
}
.completion2 ul li p span {
  color: #2a5deb;
}
.completion3 dl {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
.completion3 dl dt {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 66px;
  height: 66px;
  margin-right: 12px;
  background-color: #2a5deb;
  border-radius: 50%;
  font-weight: 700;
  font-size: 15px;
  color: #fff;
  text-align: center;
  line-height: 19px;
}
.completion3 dl dt span {
  display: block;
  font-weight: 300;
  font-size: 10px;
  color: #addff8;
}
.completion3 dl dd {
  width: calc(100% - 78px);
  font-weight: 700;
  font-size: 10px;
  line-height: 14px;
}
.completion3 dl dd span {
  color: #2a5deb;
}
.completion3 > div {
  position: relative;
  padding: 40px 20px 35px;
  background-color: #fff;
  border-radius: 10px;
}
.completion3 > div .inner {
  overflow: hidden;
  text-align: center;
}
.completion3 > div .inner p {
  margin-top: 5px;
  font-weight: 700;
  font-size: 10px;
}
.completion3 > div > span {
  display: block;
  font-size: 8px;
  text-align: center;
  color: #888; /* position: absolute; */
  padding-top: 30px;
}
.completion3 .swiper-pagination.swiper-pagination-bullets {
  bottom: 12px;
}
.completion3 .swiper-pagination.swiper-pagination-bullets span {
  width: 6px;
  height: 6px;
  background-color: #c4c4c4;
  opacity: 1;
}
.completion3
  .swiper-pagination.swiper-pagination-bullets
  span.swiper-pagination-bullet-active {
  background-color: #5a5a5a;
}
.completion3 > div.type1 {
  padding: 40px 20px 35px;
}
.completion3 > div.type1 .swiper-pagination.swiper-pagination-bullets {
  bottom: 9px;
}

/* 메타인지 기반 완전학습 - 학습과정 모니터링 */
.monitoring.type1 > p {
  font-weight: 700;
  font-size: 13px;
}
.monitoring.type1 > p span {
  display: inline-block;
}
.monitoring.type1 > div {
  padding: 40px 20px;
  background-color: #fff;
  border-radius: 10px;
  text-align: center;
}
.monitoring.type1 > div + h3 {
  margin-top: 30px;
}
.monitoring.type2 > p {
  margin-bottom: 22px;
  font-weight: 700;
}
.monitoring.type2 > p span {
  display: inline-block;
  color: #ed3535;
}
.monitoring.type2 > div {
  padding: 40px 20px;
  background-color: #efefef;
  border-radius: 10px;
  text-align: center;
}
.monitoring > .con1 img:nth-child(1) {
  width: 280px;
  margin-bottom: 40px;
}
.monitoring > .con1 img:nth-child(2) {
  width: 288px;
}
.monitoring > .con2 img:nth-child(1) {
  width: 280px;
  margin-bottom: 40px;
}
.monitoring > .con2 img:nth-child(2) {
  width: 246px;
}
.monitoring .slider1,
.monitoring .slider2 {
  position: relative;
}
.monitoring .slider1 h4,
.monitoring .slider2 h4 {
  font-size: 15px;
}
.monitoring .slider1 p,
.monitoring .slider2 p {
  margin-bottom: 18px;
  font-size: 10px;
  line-height: 14px;
}
.monitoring .slider1 span,
.monitoring .slider2 span {
  color: #ed3535;
}
.monitoring .slider1 .inner,
.monitoring .slider2 .inner {
  overflow: hidden;
}
.monitoring .slider1 img,
.monitoring .slider2 img {
  width: 100%;
}
.monitoring .vertical .swiper-wrapper {
  display: flex;
  align-items: center;
}
.monitoring .swiper-pagination.swiper-pagination-bullets {
  bottom: 20px;
}
.monitoring .swiper-pagination.swiper-pagination-bullets span {
  width: 6px;
  height: 6px;
  background-color: #c4c4c4;
  opacity: 1;
}
.monitoring
  .swiper-pagination.swiper-pagination-bullets
  span.swiper-pagination-bullet-active {
  background-color: #5a5a5a;
}

/* 메타인지 기반 완전학습 - 문제 해결 시스템 */
.diary {
  text-align: center;
}
.diary h3 {
  margin-bottom: 12px;
  font-weight: 700;
  font-size: 20px;
}
.diary p {
  margin-bottom: 18px;
  font-size: 13px;
  line-height: 16px;
}
.diary ul {
  display: flex;
  justify-content: center;
}
.diary ul li:not(:first-child) {
  margin-left: 10px;
}
.diary ul li img {
  width: 150px;
}
.diary ul.column {
  flex-direction: column;
  align-item: center;
}
.diary ul.column li:not(:first-child) {
  margin: 7px 0 0;
}
.diary ul.column li img {
  width: 310px;
}

/* 메타인지 기반 완전학습 - 리얼타임 메타코칭 */
.real_time1 {
  padding: 35px 20px;
  background: #fbeeee url(/images/sub/realTime_people.gif) right 123px no-repeat;
  background-size: 150px auto;
  line-height: 1.2;
}
.real_time1 h3 {
  margin-bottom: 23px;
  font-size: 24px;
  line-height: 32px;
}
.real_time1 h3 span {
  display: block;
  color: #ed3535;
}
.real_time1 p + p {
  margin-top: 18px;
}
.real_time1 p > b {
  font-weight: 700;
}
.real_time1 p span b {
  font-weight: 700;
  color: #ed3535;
}
.real_time2 {
  padding: 45px 20px 40px;
  text-align: center;
}
.real_time2 img {
  width: 244px;
}
.real_time2 h3 {
  margin-bottom: 20px;
  font-size: 16px;
  line-height: 21px;
}
.real_time2 h3 span {
  display: block;
  color: #ed3535;
}
.real_time2 .inner {
  overflow: hidden;
}
.real_time2 .slider {
  position: relative;
  padding: 40px 50px;
  background-color: #efefef;
  border-radius: 10px;
  line-height: 1.2;
}
.real_time2 .slider > span {
  position: absolute;
  bottom: 20px;
  left: 50%;
  width: 100%;
  transform: translateX(-50%);
  font-size: 8px;
  color: #888;
  transition: opacity 0.2s;
}
.real_time2 .slider .inner {
  height: 434px;
}
/* .real_time2 .slider .swiper-wrapper li.sign{position:relative;}
.real_time2 .slider .swiper-wrapper li.sign:before{content:"*학생이 ONLY1을 학습하는 요일과 시간에 맞춰 주 2회 실시간 코칭을 제공합니다."; display:block; position:absolute; bottom:0; left:50%; transform:translateX(-50%); font-size:8px; color:#888;} */
.real_time2 .slider .tit {
  margin-bottom: 17px;
  font-size: 15px;
}
.real_time2 .slider .tit b {
  display: block;
  font-weight: 700;
  font-size: 22px;
  color: #2a5deb;
}
.real_time2 .slider .txt {
  display: block;
  margin-bottom: 15px;
  font-size: 10px;
}
.real_time2 .swiper-container-vertical > .swiper-pagination-bullets {
  position: absolute;
  top: 40px;
  right: inherit;
  left: 15px;
  transform: inherit;
  text-align: center;
}
.real_time2 .swiper-container-vertical > .swiper-pagination-bullets:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 100%;
  background-color: #c4c4c4;
  z-index: -1;
}
.real_time2 .swiper-container-vertical > .swiper-pagination-bullets span {
  width: 6px;
  height: 6px;
  margin: 0 auto;
  background-color: #c4c4c4;
  opacity: 1;
}
.real_time2
  .swiper-container-vertical
  > .swiper-pagination-bullets
  span.swiper-pagination-bullet-active {
  width: 10px;
  height: 10px;
  background-color: #5a5a5a;
}
.real_time2
  .swiper-container-vertical
  > .swiper-pagination-bullets
  span:not(:first-child) {
  margin-top: 38px;
}
.real_time3 {
  padding: 18px 20px 35px;
  background-color: #f6efe5;
  text-align: center;
}
.real_time3 h3 {
  margin-bottom: 20px;
  font-size: 16px;
  line-height: 21px;
}
.real_time3 h3 span {
  color: #ed3535;
}
.real_time3 h3 span.emphasis {
  font-size: 12px;
}
.real_time3 .slider {
  position: relative;
  margin-bottom: 50px;
  padding: 40px 20px 52px;
  background-color: #fff;
  border-radius: 10px;
}
.real_time3 .slider .inner {
  overflow: hidden;
}
.real_time3 .slider img {
  width: 100%;
}
.real_time3 .slider .step {
  display: inline-block;
  width: 95px;
  height: 23px;
  margin-bottom: 7px;
  background-color: #ededed;
  border-radius: 15px;
  font-weight: 700;
  font-size: 10px;
  line-height: 23px;
  color: #1c1b32;
}
.real_time3 .slider .step span {
  color: #ed3535;
}
.real_time3 .slider .tit {
  margin-bottom: 18px;
  font-weight: 700;
  font-size: 20px;
  color: #2a5deb;
}
.real_time3 .slider .txt {
  margin-top: 8px;
  font-weight: 700;
  font-size: 11px;
  color: #1c1b32;
}
.real_time3 .list li {
  display: flex;
  align-items: center;
  height: 107px;
  padding: 0 18px 0 14px;
  background-color: #fff;
  border-radius: 15px;
}
.real_time3 .list li:not(:first-child) {
  margin-top: 7px;
}
.real_time3 .list li .ico {
  width: 80px;
  justify-content: center;
}
.real_time3 .list li:nth-child(1) .ico img {
  width: 35px;
}
.real_time3 .list li:nth-child(2) .ico img {
  width: 38px;
}
.real_time3 .list li:nth-child(3) .ico img {
  height: 33px;
}
.real_time3 .list li .con {
  width: calc(100% - 80px);
  text-align: left;
}
.real_time3 .list li .con .tit {
  width: 115px;
  height: 26px;
  margin-bottom: 8px;
  border: 1px solid #ed3535;
  border-radius: 15px;
  font-weight: 700;
  font-size: 11px;
  color: #1c1b32;
  line-height: 26px;
  text-align: center;
}
.real_time3 .list li .con .txt {
  font-size: 10px;
}
.real_time3 .list li .con .txt b {
  font-weight: 700;
  color: #ed3535;
}
.real_time3 .list li .con .txt span {
  display: block;
  font-size: 8px;
  color: #888;
}
.real_time3 .swiper-pagination.swiper-pagination-bullets {
  bottom: 30px;
}
.real_time3 .swiper-pagination.swiper-pagination-bullets span {
  width: 6px;
  height: 6px;
  background-color: #c4c4c4;
  opacity: 1;
}
.real_time3
  .swiper-pagination.swiper-pagination-bullets
  span.swiper-pagination-bullet-active {
  background-color: #5a5a5a;
}
.real_time4 {
  padding: 40px 20px;
  text-align: center;
}
.real_time4 img {
  width: 100%;
}
.real_time4 h3 {
  margin-bottom: 20px;
  font-weight: 700;
  font-size: 16px;
  line-height: 21px;
}
.real_time4 h3 span {
  display: block;
  color: #ed3535;
}
.real_time4 .slider {
  overflow: hidden;
}
.real_time4 .swiper-pagination span {
  width: 6px;
  height: 6px;
  background-color: #c4c4c4;
  opacity: 1;
}
.real_time4 .swiper-pagination span.swiper-pagination-bullet-active {
  background-color: #5a5a5a;
}

/* 메타인지 기반 완전학습 - 서울대 선배 가이드 */
.guide1.type1 h3 {
  margin-bottom: 25px;
}
.guide1 ul {
  padding: 28px 35px;
  background-color: #fff;
  border-radius: 10px;
  text-align: left;
}
.guide1 ul li {
  display: flex;
  align-items: center;
}
.guide1 ul li:first-child {
  margin-bottom: 10px;
}
.guide1 ul li .tit {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  margin-right: 14px;
  background-color: #2a5deb;
  border-radius: 50%;
  font-size: 9px;
  color: #fff;
  text-align: center;
}
.guide1 ul li:nth-child(2) .tit {
  background-color: #1b1b1b;
}
.guide1 ul li .tit span {
  display: block;
  font-weight: 700;
  font-size: 12px;
}
.guide1 ul li .txt {
  width: calc(100% - 64px);
  font-weight: 700;
  font-size: 13px;
  line-height: 17px;
}
.guide1 ul li .txt span {
  display: block;
  color: #2a5deb;
}
.guide2 ul li {
  position: relative;
}
.guide2 ul li:not(:first-child) {
  margin-top: 35px;
}
.guide2 ul li:not(:first-child):before {
  content: "";
  display: block;
  position: absolute;
  top: 11px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #1b1b1b;
  z-index: 0;
}
.guide2 ul li:nth-child(1) img {
  height: 217px;
}
.guide2 ul li:nth-child(2) img {
  width: 320px;
}
.guide2 ul li:nth-child(3) img {
  width: 320px;
}
.guide2 ul li p {
  display: block;
  position: relative;
  width: 80px;
  height: 23px;
  margin: 0 auto 11px auto;
  background-color: #fff;
  border: 1px solid #1b1b1b;
  border-radius: 15px;
  font-weight: 700;
  font-size: 11px;
  line-height: 21px;
  text-align: center;
  z-index: 1;
}
.guide2 ul li div {
  display: inline-block;
  position: relative;
}
.guide2 ul li div span {
  position: absolute;
  bottom: -27px;
  font-weight: 700;
  font-size: 10px;
  color: #ed3535;
}
.guide2 ul li div span:nth-child(2) {
  left: 35px;
}
.guide2 ul li div span:nth-child(3) {
  right: 35px;
}

/* 초등 학습 소개 공통 */
.ele_learning .btn {
  display: block;
  text-indent: -9999px;
}
.ele_learning img {
  width: 100%;
}
.ele_learning .step {
  position: relative;
  margin: -15px 0 40px;
  padding: 0 20px;
  text-align: center;
}
.ele_learning .step .txt {
  padding-bottom: 25px;
  margin-top: 20px;
  border-bottom: 1px solid #eee;
  font-weight: 700;
  font-size: 16px;
  line-height: 22px;
}
.ele_learning .step .txt span {
  color: #2a5deb;
}
.ele_learning .step + .con {
  padding: 0 20px 27px;
}
.ele_learning .con {
  padding: 30px 20px 27px;
  text-align: center;
}
.ele_learning .con .cat {
  display: inline-block;
  min-width: 150px;
  height: 38px;
  margin: 0 auto 21px auto;
  padding: 0 20px;
  background-color: #5682f7;
  border-radius: 20px;
  font-weight: 700;
  font-size: 20px;
  color: #fff;
  line-height: 38px;
  text-align: center;
}
.ele_learning .con .swiper-container + .cat {
  margin-top: 30px;
}
.ele_learning .con:nth-of-type(3),
.ele_learning .con:nth-of-type(5) {
  background-color: #f5f5f5;
}
.ele_learning .swiper-container .swiper-pagination {
  position: absolute;
  bottom: 37px;
  left: 50%;
  transform: translate(-50%, 0);
  font-size: 0;
}
.ele_learning .swiper-container .swiper-pagination .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin: 0 2px;
  background-color: #ccc;
  opacity: 1;
}
.ele_learning
  .swiper-container
  .swiper-pagination
  .swiper-pagination-bullet-active {
  background-color: #5a5a5a;
}
.ele_learning .swiper-button-prev:after,
.ele_learning .swiper-button-next:after {
  display: none;
}
.ele_learning .swiper-pagination-bullet {
  margin: 0 3px;
}

/* 초등 학습 소개 learning1 */
.ele_learning .learning1 {
  position: relative;
}
.ele_learning .learning1 .btn {
  position: absolute;
  bottom: 7%;
  left: 50%;
  transform: translateX(-50%);
  width: 81%;
  height: 8.8%;
}

/* 초등 학습 소개 learning4 */
.ele_learning .learning4 {
  padding-bottom: 18px;
  background-color: #f5f5f5;
}
.ele_learning .learning4 .learning_slide1 {
  width: calc(100% - 40px);
  margin: 0 auto;
}

/* 초등 학습 소개 learnin5 */
.ele_learning .learning5 {
  position: relative;
  background: linear-gradient(
    180deg,
    rgba(245, 245, 245, 1) 0%,
    rgba(166, 223, 232, 1) 100%
  );
}
.ele_learning .learning5 .step_slide {
  width: calc(100% - 107px);
  padding-bottom: 69px;
}
.ele_learning .learning5 .swiper-button-prev {
  left: 34px;
  width: 39px;
  height: 39px;
  background: url(/images/sub/eleLearning/learning_step_arr.png) 0 0 no-repeat;
  background-size: 100%;
  animation: scale 1s ease-in infinite alternate;
}
.ele_learning .learning5 .swiper-button-next {
  right: 34px;
  width: 39px;
  height: 39px;
  background: url(/images/sub/eleLearning/learning_step_arr.png) 0 0 no-repeat;
  background-size: 100%;
  background-position: 0 -39px;
  animation: scale 1s ease-in infinite alternate;
}
.ele_learning .learning5 .swiper-button-disabled {
  display: none;
}
.ele_learning .learning5 .step_slide .swiper-pagination {
  bottom: 46px;
}
.ele_learning
  .learning5
  .step_slide
  .swiper-pagination
  .swiper-pagination-bullet {
  background-color: #fff;
}
.ele_learning
  .learning5
  .step_slide
  .swiper-pagination
  .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #5a5a5a;
}

/* 초등 학습 소개 learnin6 */
.ele_learning .learnin6 .con:nth-of-type(6) .swiper-pagination {
  bottom: 25px;
}

/* 초등 학습 소개 learnin7 */
.ele_learning .learning7 {
  border-top: 1px solid #eee;
}

/* 초등 학습 소개 learnin10 */
.ele_learning .learning10 {
  padding-bottom: 54px;
  background-color: #2e2e42;
}
.ele_learning .learning10 .slider {
  position: relative; /* left:50%; width:540px; transform:translateX(-50%); */
}
.ele_learning .learning10 .slider .swiper-container:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 26%;
  height: 100%;
  background-color: #000;
  opacity: 0.5;
  z-index: 10;
}
.ele_learning .learning10 .slider .swiper-container:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 26%;
  height: 100%;
  background-color: #000;
  opacity: 0.5;
  z-index: 10;
}
.ele_learning .learning10 .slider .swiper-slide {
  width: 48%;
}
.ele_learning .learning10 .slider .swiper-container > div {
  top: 50%;
  width: 27px;
  height: 27px;
  background: url(/images/sub/eleLearning/learning10_slide_arr.png) 0 0
    no-repeat;
  background-size: auto 27px;
  opacity: 1;
  z-index: 100;
}
.ele_learning .learning10 .slider .swiper-button-prev {
  left: 15%;
  right: auto;
}
.ele_learning .learning10 .slider .swiper-button-prev:after {
  display: none;
}
.ele_learning .learning10 .slider .swiper-button-next {
  left: auto;
  right: 15%;
  background-position: -27px 0 !important;
}
.ele_learning .learning10 .slider .swiper-button-next:after {
  display: none;
}

/* 중등 학습 소개 공통 */
.mid_learning img {
  width: 100%;
}

/* 중등 학습 소개 네비게이션 */
.learning_nav {
  display: flex;
  position: sticky;
  top: 110px;
  background-color: #fff;
  border-bottom: 1px solid #ececed;
  z-index: 99;
}
/* .learning_nav.onFixdmenu{position:fixed; width:100%;} */
.learning_nav a {
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  position: relative;
  height: 55px;
  font-weight: 500;
  font-size: 13px;
  text-align: center;
}
.learning_nav a.on {
  font-weight: 700;
  color: #ed3535;
}
.learning_nav a.on:before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #ed3535;
}

/* 중등 학습 소개 learnin1 */
.mid_learning .learning1 {
  padding: 30px 0 calc(87px - 14%);
  text-align: center;
}
.mid_learning .learning1 .con {
  position: relative;
  overflow: hidden;
  padding: 0 14px 14%;
  margin-top: 25px;
}
.mid_learning .learning1 .con .arr {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 0 27.7%;
  z-index: -1;
}
.mid_learning .learning1 .dual {
  position: relative;
}
.mid_learning .learning1 .dual .circle {
  position: absolute;
  top: 56%;
  left: 40.5%;
  z-index: 10;
}
.mid_learning .learning1 .dual .circle.rol {
  width: 66px;
  height: 67px;
  background: url(/images/sub/midLearning/learning01_dual_circle.png) center
    center no-repeat;
  background-size: 100%;
  animation: rotate_image 6s linear infinite;
  transform-origin: 50% 50%;
}
.mid_learning .learning1 .dual .circle.txt {
  top: 66%;
  left: 49.5%;
  transform: translate(-50%, -50%);
  width: 22px;
  height: 24px;
  background: url(/images/sub/midLearning/learning01_dual_txt.png) center center
    no-repeat;
  background-size: 100%;
}
.mid_learning .learning1 .con .align {
  display: flex;
  margin-top: 20px;
}
.mid_learning .learning1 .con .align img {
  width: calc(50% - 6px);
}

/* 중등 학습 소개 - 중등 학습 컨텐츠 learnin2 */
.mid_learning .learning2 .tit {
  padding: 50px 0 30px;
}
.mid_learning .learning2 .con1 {
  padding-bottom: 46px;
  background-color: #f4f6f9;
}
.mid_learning .learning2 .con1 .gallery-slider {
  position: relative;
  margin-bottom: 15px;
  padding-bottom: 20px;
}
.mid_learning .learning2 .con1 .gallery-slider .bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, calc(-50% + 27px));
  width: 54%;
  z-index: 10;
}
.mid_learning .learning2 .con1 .gallery-slider:before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 30px;
  height: 100%;
  background: linear-gradient(
    90deg,
    rgba(245, 245, 245, 1) 30%,
    rgba(255, 255, 255, 0) 100%
  );
  z-index: 10;
}
.mid_learning .learning2 .con1 .gallery-slider:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 30px;
  height: 100%;
  background: linear-gradient(
    270deg,
    rgba(245, 245, 245, 1) 30%,
    rgba(255, 255, 255, 0) 100%
  );
  z-index: 10;
}
.mid_learning .learning2 .con1 .gallery-thumbs {
  margin-bottom: 30px;
}
.mid_learning .learning2 .con1 .gallery-thumbs .swiper-slide {
  display: block;
  width: 62px;
  height: 34px;
  background-color: #fff;
  border: 1px solid #e2e2e2;
  border-radius: 5px;
  font-size: 14px;
  text-align: center;
  line-height: 32px;
}
.mid_learning .learning2 .con1 .gallery-thumbs .swiper-slide-active {
  background-color: #2f2476;
  border: 1px solid #2f2476;
  color: #fff;
}
.mid_learning .learning2 .con1 .thumb {
  position: relative;
}
.mid_learning .learning2 .con1 .thumb .swiper-slide {
  overflow: hidden;
  width: 48%;
  border: 1px solid #888;
  border-radius: 10px;
}
.mid_learning .learning2 .con1 .thumb .swiper-slide-active {
  border: none;
}
.mid_learning .learning2 .con1 .swiper-button-prev {
  left: 12%;
  right: auto;
  width: 34px;
  height: 34px;
  background: url(/images/sub/midLearning/learning02_slide_arr.png) 0 0
    no-repeat;
  background-size: auto 34px;
  opacity: 1;
  z-index: 100;
}
.mid_learning .learning2 .con1 .swiper-button-prev:after {
  display: none;
}
.mid_learning .learning2 .con1 .swiper-button-next {
  left: auto;
  right: 12%;
  width: 34px;
  height: 34px;
  background: url(/images/sub/midLearning/learning02_slide_arr.png) -34px 0
    no-repeat;
  background-size: auto 34px;
  opacity: 1;
  z-index: 100;
}
.mid_learning .learning2 .con1 .swiper-button-next:after {
  display: none;
}
.mid_learning .learning2 .con1 .swiper-pagination.swiper-pagination-bullets {
  position: absolute;
  bottom: 20px;
  left: 50%;
  width: auto;
  height: 15px;
  transform: translateX(-50%);
}
.mid_learning
  .learning2
  .con1
  .swiper-pagination.swiper-pagination-bullets
  span {
  width: 15px;
  height: 15px;
  background-color: #fff;
  border: 1px solid #c0c0c0;
  opacity: 1;
}
.mid_learning
  .learning2
  .con1
  .swiper-pagination.swiper-pagination-bullets
  span.swiper-pagination-bullet-active {
  background-color: #5a5a5a;
  border: 1px solid #c0c0c0;
}
.mid_learning .learning2 .con2 {
  padding: 0 14px;
}
.mid_learning .learning2 .con2 > img {
  display: block;
}
.mid_learning .learning2 .con2 > img:nth-last-of-type(1) {
  margin-top: 14px;
}
.mid_learning .learning2 .con2 {
  padding-bottom: 50px;
}
.mid_learning .learning2 .con2 .slider {
  position: relative;
  margin-top: 30px;
}
.mid_learning .learning2 .con2 .slider .learning_slide1 {
  width: 100%;
  padding: 0 21px;
  position: absolute;
  top: 29%;
  left: 0;
}
.mid_learning
  .learning2
  .con2
  .slider
  .learning_slide1
  .swiper-pagination-bullet {
  width: 30px;
  height: 3px;
  margin: 0 4px;
  background: #ddd;
  border-radius: 3px;
  opacity: 1;
}
.mid_learning
  .learning2
  .con2
  .slider
  .learning_slide1
  .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #666;
}
.mid_learning .learning2 .con2 .slider .learning_slide1 .swiper-pagination {
  bottom: -14px;
  left: 50%;
  transform: translateX(-50%);
}
.mid_learning .learning2 .con2 .sign {
  margin-top: 6px;
  font-weight: 500;
  font-size: 11px;
  color: #91979c;
  text-align: right;
}

/* 중등 학습 소개 - 내신학습 learnin3 */
.mid_learning .learning3 > .tit {
  padding: 50px 0 30px;
}
.mid_learning .learning3 .con {
  position: relative;
  padding: 0 14px;
  margin-bottom: 50px;
}
.mid_learning .learning3 .con .tit {
  margin-bottom: 5px;
}
.mid_learning .learning3 .con .rolling {
  display: flex;
  overflow: hidden;
  position: absolute;
  top: 12.4%;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 28px);
}
.mid_learning .learning3 .con .rolling .roller.original {
  animation: 30s linear 0s infinite normal forwards running rollingLeft1;
}
.mid_learning .learning3 .con .rolling .roller.clone {
  animation: 30s linear 0s infinite normal none running rollingLeft2;
}
.mid_learning .learning3 .con .rolling .roller img {
  width: auto;
  height: 19px;
  margin: 0 2px;
}
.mid_learning .learning3 .con .video {
  position: relative;
}
.mid_learning .learning3 .con .video video {
  overflow: hidden;
  position: absolute;
  top: 7.5%;
  left: 50%;
  transform: translateX(-50%);
  width: 70.7%;
  border-radius: 18px;
}
.mid_learning .learning3 .con .roulette {
  position: relative;
}
.mid_learning .learning3 .con .slider1 {
  position: relative;
  overflow: hidden;
}
.mid_learning .learning3 .con .cover {
  position: relative;
  z-index: 2;
}
.mid_learning .learning3 .con .slider {
  position: absolute;
  top: 36.6%;
  width: 17.5%;
  height: 100%;
  z-index: 1;
  background-size: 100% !important;
}
.mid_learning .learning3 .con .swiper-slide-active .slider.slider1 {
  left: 22%;
  background: url(/images/sub/midLearning/roulette01.png) repeat;
}
.mid_learning .learning3 .con .swiper-slide-active .slider.slider2 {
  left: 41.5%;
  top: 33%;
  background: url(/images/sub/midLearning/roulette02.png) repeat;
}
.mid_learning .learning3 .con .swiper-slide-active .slider.slider3 {
  left: 60.6%;
  top: -46%;
  background: url(/images/sub/midLearning/roulette03.png) repeat;
}
.mid_learning .learning3 .con .swiper-slide-active .slider.slider1.s1 {
  animation: slotsUP1_1 3s ease-in-out forwards;
}
.mid_learning .learning3 .con .swiper-slide-active .slider.slider2.s2 {
  animation: slotsDown_1 3s ease-in-out forwards;
}
.mid_learning .learning3 .con .swiper-slide-active .slider.slider3.s3 {
  animation: slotsUP1_2 3s ease-in-out forwards;
}
.mid_learning .learning3 .con .swiper-slide-active .slider.slider1.s4 {
  animation: slotsUP2_1 3s ease-in-out forwards;
}
.mid_learning .learning3 .con .swiper-slide-active .slider.slider2.s5 {
  animation: slotsDown_2 3s ease-in-out forwards;
}
.mid_learning .learning3 .con .swiper-slide-active .slider.slider3.s6 {
  animation: slotsUP2_2 3s ease-in-out forwards;
}
.mid_learning .learning3 .teacher {
  position: relative;
  padding: 50px 0;
  background: #f4f6f9;
}
.mid_learning .learning3 .teacher .slider {
  background: url(/images/sub/midLearning/learning03_slide_bg.png) no-repeat
    center bottom / 90%;
  position: relative;
}
.mid_learning .learning3 .teacher .slider .swiper-container {
  position: relative;
  width: 100%;
  margin: 0 auto;
  overflow: visible;
}
.mid_learning .learning3 .teacher .slider .swiper-slide {
  opacity: 0 !important;
  transition: opacity ease 0.5s;
}
.mid_learning .learning3 .teacher .slider .swiper-slide-active {
  opacity: 1 !important;
}
.mid_learning .learning3 .teacher .slider .button_arrow {
  top: auto;
  bottom: 110px;
  width: 31px;
  height: 30px;
  margin: 0;
  background: url(/images/sub/midLearning/learning03_slide_arr.png) 0 0
    no-repeat;
  background-size: cover;
}
.mid_learning .learning3 .teacher .slider .button_arrow:after {
  display: none;
}
.mid_learning .learning3 .teacher .slider .button_arrow.swiper-button-prev {
  left: 5px;
}
.mid_learning .learning3 .teacher .slider .button_arrow.swiper-button-next {
  right: 5px;
  background-position: -32px 0;
}
.mid_learning .learning3 .teacher .graph {
  position: relative;
  margin-top: 30px;
  padding: 0 14px;
}
.mid_learning .learning3 .teacher .graph .circle_box {
  position: absolute;
  top: 10%;
  left: 9.5%;
}
.mid_learning .learning3 .teacher .graph .circle_box:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  box-shadow: 0 0 6px 1px rgb(0 0 0 / 33%);
}
.mid_learning .learning3 .teacher .graph .circle_box:after {
  content: "";
  display: block;
  position: absolute;
  top: calc(50% - 2px);
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
  border-radius: 50%;
  box-shadow: inset 0 0 6px 1px rgb(0 0 0 / 33%);
}
.mid_learning .learning3 .teacher .circle-percent {
  position: absolute;
  top: 80px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  font-family: "GmarketSansBold", sans-serif;
  font-size: 22px;
  text-align: center;
  color: #007fff;
  letter-spacing: -2px;
  line-height: 1.2;
  zoom: 0.6;
}
.mid_learning .learning3 .teacher .circle-percent span {
  display: block;
  font-family: "GmarketSansMedium", sans-serif;
  font-size: 16px;
  color: #000;
}
.mid_learning .learning3 .teacher .circle-percent b {
  color: #000;
  font-family: "GmarketSansBold", sans-serif;
  font-size: 22px;
  display: block;
}
.mid_learning .learning3 .teacher .circle-percent i {
  display: inline-block;
  width: auto;
  font-style: inherit;
}
.mid_learning .learning3 .teacher .circle-percent i.sign {
  width: auto;
  font-size: 22px;
  vertical-align: top;
}

/* 중등 학습 소개 - 시험대비 learnin4 */
.mid_learning .learning4 .con {
  padding: 50px 0 86px;
}
.mid_learning .learning4 .con:nth-of-type(1) {
  padding: 30px 0 50px;
}
.mid_learning .learning4 .con:nth-of-type(2) {
  background-color: #f4f6f9;
}
.mid_learning .learning4 .con .tit {
  margin-bottom: 25px;
}
.mid_learning .learning4 .con .inner {
  position: relative;
  padding: 0 14px;
}
.mid_learning .learning4 .con .swiper-pagination {
  bottom: -40px;
  width: calc(100% - 28px);
}
.mid_learning .learning4 .con .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin: 0 3px;
  background-color: #ccc;
  opacity: 1;
}
.mid_learning .learning4 .con .swiper-pagination-bullet-active {
  background: #ed3535;
}

/* 중등 학습 소개 - 국영수전문 learnin5 */
.mid_learning .learning5 > .tit {
  padding: 50px 0 30px;
}
.mid_learning .learning5 .con {
  padding: 0 14px 30px;
}
.mid_learning .learning5 .con > ul li:not(:first-child) {
  margin-top: 20px;
}
.mid_learning .learning5 .con > ul + img {
  margin-top: 7px;
}
.mid_learning .learning5 .con .learning_slide2:not(:first-child) {
  margin-top: 20px;
}
.mid_learning .learning5 .con .learning_slide2 .swiper-slide .gif {
  display: flex;
  justify-content: space-between;
  position: absolute;
  bottom: 16%;
  left: 50%;
  width: 91%;
  transform: translateX(-50%);
}
.mid_learning .learning5 .con .learning_slide2 .swiper-slide .gif img {
  width: 49%;
}
.mid_learning .learning5 .con .swiper-pagination {
  bottom: 16px;
}
.mid_learning .learning5 .con .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin: 0 3px;
  background-color: #ccc;
  opacity: 1;
}
.mid_learning .learning5 .con .swiper-pagination-bullet-active {
  background: #ed3535;
}
.mid_learning .learning5 .con .box {
  overflow: hidden;
  position: relative;
  padding: 30px 30px 20px;
  border: 1px solid #ccc;
  border-radius: 20px;
}
.mid_learning .learning5 .con .box:not(:first-child) {
  margin-top: 10px;
}
.mid_learning .learning5 .con .box.type1 {
  padding: 30px 30px 203px;
}
.mid_learning .learning5 .con .box.type2 {
  padding: 30px 20px;
}
.mid_learning .learning5 .con .box .tit {
  margin-top: 2px;
  font-weight: 900;
  font-size: 20px;
  line-height: 27px;
  color: #121212;
}
.mid_learning .learning5 .con .box .txt1 {
  font-weight: 800;
  color: #ed3535;
}
.mid_learning .learning5 .con .box .txt2 {
  margin-top: 10px;
  color: #6c7481;
  line-height: 19px;
}
.mid_learning .learning5 .con .box > img {
  margin-top: 28px;
}
.mid_learning .learning5 .con .box .learning_slide2 {
  padding: 0 15px;
  margin-top: 0;
  transform: translateY(20px);
}
.mid_learning .learning5 .con .box .learning_slide2 .swiper-slide {
  opacity: 0 !important;
}
.mid_learning .learning5 .con .box .learning_slide2 .swiper-slide-active {
  opacity: 1 !important;
}
.mid_learning .learning5 .con .box .rolling {
  display: flex;
  position: absolute;
  top: 58%;
}
.mid_learning .learning5 .con .box .rolling .roller.original {
  animation: 30s linear 0s infinite normal forwards running rollingLeft1;
}
.mid_learning .learning5 .con .box .rolling .roller.clone {
  animation: 30s linear 0s infinite normal none running rollingLeft2;
}
.mid_learning .learning5 .con .box .rolling .roller img {
  width: auto;
  height: 115px;
  margin: 0 2px;
}
.mid_learning .learning5 .con .box ul li {
  padding: 0 10px;
}
.mid_learning .learning5 .con .box ul li:last-child {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px dashed #ccc;
}

/* 중등 학습 소개 - 국영수전문 - 국어전문 팝업 */
.learning_popup {
  overflow: hidden;
  width: 96%;
  margin-top: 20%;
}
.learning_popup img {
  width: 100%;
}
.learning_popup .obj {
  display: flex;
  justify-content: center;
  position: absolute;
  bottom: 0;
  left: 0;
  transform: translateY(100px);
  opacity: 0;
  transition: transform 0.7s;
}
.learning_popup .close {
  position: absolute;
  top: 5px;
  right: 5px;
}
.learning_popup .close img {
  width: 43px;
}
.l_popup4 .obj {
  width: 100%;
}
.l_popup1 .obj img {
  width: 86%;
}
.l_popup2 .obj img {
  width: 78%;
}
.l_popup3 .obj img {
  width: 84%;
}
.l_popup4 .obj img {
  width: 48%;
}
.learning_popup.active .obj {
  transform: translateY(0);
  opacity: 1;
}

/* 중등 학습 소개 - 국영수전문 - 선생님 배너 */
.mid_learning .teacher_banner {
  overflow: hidden;
  position: relative;
  padding:/*30px 0 160px 30px*/ 7vw 0 40vw 30px;
  background: linear-gradient(
    170deg,
    rgba(244, 246, 249, 1) 0%,
    rgba(225, 228, 234, 1) 100%
  );
}
.mid_learning .teacher_banner p {
  font-family: "Pretendard";
  font-weight: 500;
  color: #121212;
}
.mid_learning .teacher_banner .tit {
  margin-top: 7px;
  font-weight: 900;
  font-size: 30px;
  line-height: 35px;
}
.mid_learning .teacher_banner .txt1 {
  font-weight: 800;
  font-size: 18px;
  color: #ed3535;
}
.mid_learning .teacher_banner .txt2 {
  margin-top: 9px;
}
.mid_learning .teacher_banner .txt3 {
  margin-top: 9px;
  color: #6c7481;
  line-height: 19px;
}
.mid_learning .teacher_banner .profile {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.mid_learning .teacher_banner .profile img {
  position: absolute;
  bottom: -30vw;
  right: -12vw;
  width: 76%;
  filter: drop-shadow(40px 40px 40px #888c93);
}
.mid_learning .teacher_banner .profile img.kor {
  bottom: 46vw;
  transform: translateY(88%);
} /* 국어 타이틀 텍스트로 인한 높이값 문제로 조절 */
.mid_learning .teacher_banner .profile p {
  position: absolute;
  right: 33px;
  bottom: 10px;
  padding: 4px 15px 3px;
  background-color: #000;
  border-radius: 30px;
  font-weight: 300;
  color: #fff;
  letter-spacing: 0;
}
.mid_learning .teacher_banner .profile p span {
  font-weight: 800;
}

/* 이 시기 주요 학습 */
.learning {
  padding: 25px 14px;
}
.learning > .tit {
  margin-bottom: 21px;
  font-weight: 700;
  font-size: 15px;
  text-align: center;
  line-height: 21px;
}
.learning > .tit span {
  font-weight: 900;
  color: #ed3535;
}
.learning .list li {
  padding: 15px 10px 10px;
  border: 1px solid #121212;
  border-radius: 10px;
  box-shadow: 0 5px 0 0 rgb(0 0 0 / 10%);
  text-align: left;
}
.learning .list li:not(:first-child) {
  margin-top: 10px;
}
.learning .list li .top {
  display: flex;
  gap: 15px;
  margin-bottom: 10px;
}
.learning .list li .top .num {
  font-family: "GmarketSansBold";
  font-size: 30px;
  color: #ed3535;
}
.learning .list li .top .txt .tit {
  margin-bottom: 2px;
  font-weight: 700;
  font-size: 15px;
}
.learning .list li .top .txt .date {
  font-size: 11px;
  color: #91979c;
  letter-spacing: 0;
}
.learning .list li .bottom {
  overflow: hidden;
  border-radius: 10px;
}
.learning .list li .bottom img {
  width: 100%;
}

/* 학습 맛보기 */
.taste {
  padding: 27px 20px;
  text-align: center;
}
.taste img {
  width: 100%;
}
.taste h3 {
  margin-bottom: 10px;
  font-family: "GmarketSansBold";
  font-size: 20px;
  line-height: 23px;
}
.taste h3 span {
  color: #ed3535;
}
.taste .con {
  position: relative;
}
.taste .con > .title {
  margin-bottom: 7px;
}
.taste .con > .title ul {
  display: flex;
  gap: 21px;
}
.taste .con > .title ul li {
  flex: 1;
  position: relative;
  border: 1px solid #90d4de;
  border-radius: 8px;
}
.taste .con > .title ul li:not(:first-child):before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: -22px;
  transform: translateY(-50%);
  width: 24px;
  height: 28px;
  background: url(/images/sub/taste_step_arr.png) 0 0 no-repeat;
  background-size: 100%;
  z-index: 5;
}
.taste .con > .title ul li.swiper-slide-thumb-active:after {
  content: "";
  display: block;
  position: absolute;
  top: -1px;
  left: -1px;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  border: 2px solid #0099af;
  border-radius: 8px;
  animation: blinker1 1s step-end infinite;
}
.taste .con .btn {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.taste .con .btn button {
  width: 10px;
  height: 10px;
  text-indent: -9999px;
}
.taste .con .con1 .btn button {
  position: absolute;
  width: 26%;
  height: 46%;
}
.taste .con .con1 .btn button:nth-child(1) {
  top: 24%;
  left: 19%;
}
.taste .con .con1 .btn button:nth-child(2) {
  top: 26%;
  right: 20%;
}
.taste .con .con2 .btn button {
  position: absolute;
  width: 24%;
  height: 39%;
}
.taste .con .con2 .btn button:nth-child(1) {
  top: 13%;
  left: 5%;
}
.taste .con .con2 .btn button:nth-child(2) {
  top: 13%;
  left: 33%;
}
.taste .con .con2 .btn button:nth-child(3) {
  top: 52%;
  left: 5%;
}
.taste .con .con2 .btn button:nth-child(4) {
  top: 52%;
  left: 33%;
}
.taste .con .con2 .btn button:nth-child(5) {
  top: 31%;
  right: 5%;
}
.taste .con .con3 .btn {
  justify-content: space-between;
  padding: 0 15%;
}
.taste .con .con3 .btn button {
  width: 39%;
  height: 51%;
}
.taste .con > .swiper-pagination {
  bottom: 10px;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 3px;
}
.taste .con > .swiper-pagination .swiper-pagination-bullet {
  width: 6px;
  height: 6px;
  background: #ccc;
  opacity: 1;
}
.taste .con > .swiper-pagination .swiper-pagination-bullet-active {
  background: #ed3535;
}
.taste .sign {
  margin-top: 11px;
  font-size: 12px;
  color: #ed3535;
}
.taste video[poster] {
  width: 100%;
}

/* 학습 맛보기 레이어 팝업 공통 */
.taste #layerPop {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
}
.taste #layerPop * {
  font-family: "Noto Sans KR";
}
.taste #layerPop .dim1 {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.7;
  z-index: 1;
}
.taste #layerPop > .inner {
  position: fixed;
  left: 50%;
  top: 50.5%;
  transform: translate(-50%, -50%);
  z-index: 2;
  width: calc(100% - 40px);
  opacity: 0;
  transition: all 0.3s;
  overflow: hidden;
  border: 2px solid #000;
  border-radius: 10px;
}
.taste #layerPop > .inner.on {
  top: 50%;
  opacity: 1;
}
.taste #layerPop > .inner h1 {
  height: 40px;
  padding-left: 18px;
  background-color: #333;
  border-radius: 4px 4px 0 0;
  font-weight: 700;
  font-size: 14px;
  color: #fff;
  text-align: left;
  line-height: 40px;
}
.taste #layerPop > .inner .con {
  position: relative;
  padding: 20px 0 65px;
  background-color: #fff;
}
.taste #layerPop > .inner .con h2 {
  font-weight: 700;
  font-size: 20px;
  color: #ff0095;
  line-height: 21px;
}
.taste #layerPop > .inner .con h2 span {
  display: block;
  font-size: 15px;
  color: #555;
}
.taste #layerPop > .inner .con .txt1 {
  margin: 10px 0 13px;
  font-weight: 500;
  font-size: 14px;
  color: #1b1b1b;
  line-height: 18px;
}
.taste #layerPop > .inner .con .tablet {
  position: relative;
  padding: 0 30px;
}
.taste #layerPop > .inner .con .tablet.back {
  padding: 0 43px 0 17px;
}
.taste #layerPop > .inner .con .tablet .inner {
  position: relative;
  padding: 4% 5.5% 6%;
  background: url(/images/sub/sampleExercise/popup_tablet_bg.png) 0 0 no-repeat;
  background-size: 100%;
}
.taste #layerPop > .inner .con .tablet .btn {
  align-items: end;
  justify-content: space-between;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 8%;
}
.taste #layerPop > .inner .con .tablet .btn button {
  width: 24%;
  height: 69%;
}
.taste #layerPop > .inner .con .sign {
  margin-top: 15px;
  font-weight: 500;
  font-size: 13px;
  color: #ed3535;
}
.taste #layerPop > .inner a {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 14px;
}
.taste #layerPop .con .slider_layerPop {
  position: relative;
  width: 100%;
  padding: 4% 5.5% 6%;
  background: url(/images/sub/sampleExercise/popup_tablet_bg.png) 0 0 no-repeat;
  background-size: 100%;
}
.taste #layerPop .con .slider_layerPop .slider {
  overflow: hidden;
  border-radius: 4px;
}
.taste #layerPop .con .slider_layerPop .box {
  overflow: hidden;
  border-radius: 4px;
}
.taste #layerPop .con .slider_layerPop .video {
  overflow: hidden;
  position: relative;
  padding-top: 60.25%;
}
.taste #layerPop .con .slider_layerPop .video video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  cursor: pointer;
}
.taste #layerPop .con .swiper-button-next:after,
.taste #layerPop .con .swiper-button-prev:after {
  display: none;
}
.taste #layerPop .con .swiper-button-prev.swiper-button-disabled,
.taste #layerPop .con .swiper-button-next.swiper-button-disabled {
  display: none;
}
.taste #layerPop .con .swiper-button-next img,
.taste #layerPop .con .swiper-button-prev img {
  width: 100%;
}
.taste #layerPop .con .swiper-pagination-bullet {
  width: 5px;
  height: 5px;
  margin: 0 3px;
  background: #ccc;
  opacity: 1;
}
.taste #layerPop .con .swiper-pagination-bullet-active {
  background-color: #5a5a5a;
}

/* 학습 맛보기 레이어 팝업 - 마음챙김 */
.taste #layerPop > .inner .con.type1 {
  background: linear-gradient(
    180deg,
    rgba(255, 232, 246, 1) 0%,
    rgba(255, 255, 255, 1) 100%
  );
}
.taste #layerPop > .inner .con.type1 .slider {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  padding: 4% 5.5% 6%;
}
.taste #layerPop > .inner .con.type1 .slider .swiper-container {
  overflow: hidden;
  border-radius: 4px;
}
.taste #layerPop > .inner .con.type1 .slider .back {
  position: absolute;
  top: 50%;
  right: -36px;
  transform: translateY(-50%);
}
.taste #layerPop > .inner .con.type1 .slider .back img {
  width: 25px;
}
.taste #layerPop > .inner .con.type1 .slider .back p {
  margin-top: 3px;
  font-weight: 700;
  font-size: 10px;
  color: #2c2c2c;
}

/* 학습 맛보기 레이어 팝업 - 말뼈사전 */
.taste #layerPop > .inner .con.type2 {
  background: linear-gradient(
    180deg,
    rgba(255, 251, 224, 1) 0%,
    rgba(255, 255, 255, 1) 100%
  );
}
.taste #layerPop > .inner .con.type2 h2 {
  font-size: 14px;
  color: #f1781d;
}
.taste #layerPop > .inner .con.type2 h2 span {
  margin-bottom: 2px;
}
.taste #layerPop > .inner .con.type2 h2 span img {
  width: 109px;
}
.taste #layerPop > .inner .con.type2 .tablet .inner {
  padding: 4.5% 5.5% 6%;
}

/* 학습 맛보기 레이어 팝업 - 교과정복 */
.taste #layerPop > .inner .con.type3 {
  background: linear-gradient(
    180deg,
    rgba(249, 255, 229, 1) 0%,
    rgba(255, 255, 255, 1) 100%
  );
}
.taste #layerPop > .inner .con.type3 h2 {
  color: #000;
}
.taste #layerPop > .inner .con.type3 .tab {
  display: flex;
  justify-content: center;
  gap: 4px;
  margin-bottom: 12px;
}
.taste #layerPop > .inner .con.type3 .tab button {
  width: 45px;
  height: 26px;
  background-color: #e9edf4;
  font-weight: 500;
  font-size: 13px;
  color: #000;
  line-height: 26px;
}
.taste #layerPop > .inner .con.type3 .tab button.on {
  background-color: #4982c6;
  font-weight: 700;
  color: #fff;
}
.taste #layerPop > .inner .con.type3 .video {
  overflow: hidden;
  position: relative;
  padding-top: 60.25%;
  border-radius: 4px;
}
.taste #layerPop > .inner .con.type3 .video video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  cursor: pointer;
}

/* 학습 맛보기 레이어 팝업 - 메타카드 */
.taste #layerPop > .inner .con.type4 {
  background: linear-gradient(
    180deg,
    rgba(255, 244, 244, 1) 0%,
    rgba(255, 255, 255, 1) 100%
  );
}
.taste #layerPop > .inner .con.type4 h2 {
  color: #000;
}
.taste #layerPop > .inner .con.type4 h2 img {
  width: auto;
  height: 25px;
}
.taste #layerPop > .inner .con.type4 .txt1 {
  margin: 7px 0 15px;
  font-weight: 700;
  font-size: 13px;
  color: #f1781d;
  line-height: 20px;
}
.taste #layerPop > .inner .con.type4 .slide_tit {
  display: inline-block;
  width: 140px;
  height: 26px;
  margin-bottom: 5px;
  background-color: #519094;
  border-radius: 100px;
  font-weight: 700;
  font-size: 12px;
  color: #fff;
  line-height: 26px;
}
.taste #layerPop > .inner .con.type4 .swiper-button-next {
  right: 7%;
}
.taste #layerPop > .inner .con.type4 .swiper-button-prev {
  left: 7%;
}
.taste #layerPop > .inner .con.type4 .swiper-pagination {
  bottom: -21px;
  width: calc(100% - 60px);
}

/* 학습 맛보기 레이어 팝업 - 개뼈노트 */
.taste #layerPop > .inner .con.type5 {
  padding: 20px 0 45px;
  background: linear-gradient(
    180deg,
    rgba(255, 244, 227, 1) 0%,
    rgba(255, 255, 255, 1) 100%
  );
}
.taste #layerPop > .inner .con.type5 h2 {
  color: #000;
}
.taste #layerPop > .inner .con.type5 h2 img {
  width: 116px;
}

/* 학습 맛보기 레이어 팝업 - 개뼈노트+창의융합플러스+메타플러스 공통 */
.taste #layerPop > .inner .con.type5 .txt1,
.taste #layerPop > .inner .con.type6 .txt,
.taste #layerPop > .inner .con.type7 .txt1 {
  margin: 7px 0 15px;
  font-weight: 700;
  font-size: 13px;
  color: #f1781d;
  line-height: 20px;
}
.taste #layerPop > .inner .con.type5 .txt2,
.taste #layerPop > .inner .con.type6 .txt2,
.taste #layerPop > .inner .con.type7 .txt2 {
  margin-top: 11px;
  font-weight: 500;
  font-size: 13px;
}
.taste #layerPop > .inner .con.type5 .txt2 .v1,
.taste #layerPop > .inner .con.type6 .txt2 .v1,
.taste #layerPop > .inner .con.type7 .txt2 .v1 {
  color: #f26523;
}
.taste #layerPop > .inner .con.type5 .txt2 .v2,
.taste #layerPop > .inner .con.type6 .txt2 .v2,
.taste #layerPop > .inner .con.type7 .txt2 .v2 {
  color: #ed3535;
}
.taste #layerPop > .inner .con.type5 .sign {
  margin-top: 10px;
}
.taste #layerPop > .inner .con.type5 .swiper-button-next,
.taste #layerPop > .inner .con.type6 .swiper-button-next,
.taste #layerPop > .inner .con.type5 .swiper-button-prev,
.taste #layerPop > .inner .con.type6 .swiper-button-prev {
  top: auto;
  bottom: 12%;
  width: 28px;
  height: 28px;
  animation: scale-effect 1s ease-in-out infinite alternate;
}
.taste #layerPop > .inner .con.type5 .swiper-button-prev,
.taste #layerPop > .inner .con.type6 .swiper-button-prev {
  left: 12.5%;
}
.taste #layerPop > .inner .con.type5 .swiper-button-next,
.taste #layerPop > .inner .con.type6 .swiper-button-next {
  right: 12.5%;
}
.taste #layerPop > .inner .con.type5 .swiper-pagination,
.taste #layerPop > .inner .con.type6 .swiper-pagination {
  bottom: 27px;
}

/* 학습 맛보기 레이어 팝업 - 창의융합플러스 */
.taste #layerPop > .inner .con.type6 {
  padding: 20px 0 45px;
  background: linear-gradient(
    180deg,
    rgba(245, 250, 255, 1) 0%,
    rgba(255, 255, 255, 1) 100%
  );
}
.taste #layerPop > .inner .con.type6 h2 img {
  width: 124px;
}

/* 학습 맛보기 레이어 팝업 - 메타플러스 */
.taste #layerPop > .inner .con.type7 {
  padding: 20px 0 45px;
}
.taste #layerPop > .inner .con.type7 h2 img {
  width: 98px;
}
.taste #layerPop > .inner .con.type7 .txt2 {
  margin-top: 15px;
}
.taste #layerPop > .inner .con.type7 .slide_tit {
  display: inline-block;
  width: 150px;
  height: 26px;
  margin-bottom: 5px;
  background-color: #686868;
  border-radius: 100px;
  font-weight: 700;
  font-size: 12px;
  color: #fff;
  line-height: 26px;
}
.taste #layerPop > .inner .con.type7 .swiper-button-next {
  top: 10.5vh;
  right: 7%;
}
.taste #layerPop > .inner .con.type7 .swiper-button-prev {
  top: 10.5vh;
  left: 7%;
}
.taste #layerPop > .inner .con.type7 .swiper-pagination {
  bottom: -21px;
  width: calc(100% - 60px);
}

/* 학습 맛보기 레이어 팝업 - 화상수업 */
.taste #layerPop > .inner .con.type8 {
  padding: 20px 0 110px;
  background: linear-gradient(
    180deg,
    rgba(253, 231, 238, 1) 0%,
    rgba(255, 255, 255, 1) 100%
  );
}
.taste #layerPop > .inner .con.type8 h2 {
  color: #131212;
}
.taste #layerPop > .inner .con.type8 .txt1 {
  margin: 7px 0 15px;
  font-weight: 700;
  font-size: 13px;
  color: #f1781d;
  line-height: 20px;
}
.taste #layerPop > .inner .con.type8 .slider_layerPop {
  padding: 6% 5.5% 9%;
}
.taste #layerPop > .inner .con.type8 .slider_layerPop .box .video {
  padding-top: 55.25%;
}

/* 학습 맛보기 레이어 팝업 - 전화튜터링 */
#layerPop > .inner .con.type9 {
  padding: 20px 30px 117px;
}
#layerPop > .inner .con.type9 h2 {
  font-weight: 500;
  font-size: 13px;
  color: #6c6c6c;
}
#layerPop > .inner .con.type9 h2 span {
  display: inline-block;
  position: relative;
  margin-top: 3px;
  font-weight: 900;
  font-size: 18px;
  color: #000;
}
#layerPop > .inner .con.type9 h2 span:before {
  content: "";
  display: block;
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #000;
}
#layerPop > .inner .con.type9 h2 + .txt1 {
  margin: 18px 0 10px;
}

/* 학습 맛보기 레이어 팝업 - AI캠프 */
#layerPop > .inner .con.type10 {
  padding: 20px 30px;
}
#layerPop > .inner .con.type10 h2 {
  font-weight: 500;
  font-size: 13px;
  color: #6c6c6c;
}
#layerPop > .inner .con.type10 h2 span {
  display: inline-block;
  position: relative;
  margin-top: 3px;
  font-weight: 900;
  font-size: 18px;
  color: #000;
}
#layerPop > .inner .con.type10 h2 span:before {
  content: "";
  display: block;
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #000;
}
#layerPop > .inner .con.type10 h2 + .txt1 {
  margin: 18px 0 10px;
}
#layerPop > .inner .con.type10 dl {
  margin: 15px 0 10px;
  font-weight: 500;
  text-align: left;
}
#layerPop > .inner .con.type10 dt {
  display: inline-block;
  padding: 3px 5px;
  background-color: #def2f9;
  font-size: 13px;
}
#layerPop > .inner .con.type10 dt + dd {
  margin-top: 5px;
}
#layerPop > .inner .con.type10 dd + dt {
  margin-top: 10px;
}
#layerPop > .inner .con.type10 dd {
  display: block;
  font-size: 12px;
}
#layerPop > .inner .con.type10 dd + dd {
  margin-top: 5px;
}
#layerPop > .inner .con.type10 .tablet {
  padding: 0;
}

/* 강좌리스트 */
.lecture .cat {
  display: flex;
  position: fixed;
  top: 110px;
  width: 100%;
  background-color: #fff;
  border-top: 1px solid #ececed;
  border-bottom: 1px solid #ececed;
  z-index: 100;
}
.lecture .cat a {
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  position: relative;
  height: 55px;
  font-weight: 500;
  font-size: 13px;
  text-align: center;
  color: #000;
  line-height: 16px;
}
.lecture .cat a.on {
  font-weight: 700;
  color: #ed3535;
}
.lecture .cat a.on:before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #ed3535;
}
.lecture > .inner {
  padding: 70px 14px 14px;
  background-color: #f4f6f9;
}
.lecture > .inner .cat_box {
  margin-bottom: 14px;
}
.lecture > .inner .cat_box .toggle {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 77px;
  height: 25px;
  padding-right: 14px;
  background-color: #121212;
  border-radius: 45px;
  font-weight: 500;
  font-size: 11px;
  color: #fff;
  line-height: 25px;
  text-align: center;
  z-index: -1;
}
.lecture > .inner .cat_box .toggle:before {
  content: "";
  display: block;
  position: absolute;
  top: 11px;
  right: 12px;
  width: 9px;
  height: 5px;
  background: url(/images/sub/lectureList_cat_arr.png) 0 0 no-repeat;
  background-size: 100%;
  transition: all 0.5s;
}
.lecture > .inner .cat_box .toggle.on:before {
  transform: rotate(180deg);
}
.lecture > .inner .cat_box.fixed {
  position: fixed;
  top: -80px;
  left: 0;
  width: 100%;
  padding: 14px;
  background-color: #f4f6f9;
  transition: all 0.5s;
  z-index: 5;
  box-shadow: 0 10px 30px 0px rgb(185 188 193 / 100%);
}
.lecture > .inner .cat_box.fixed .toggle {
  bottom: -38px;
  z-index: 0;
}
.lecture > .inner .cat_box .tab {
  display: flex;
  text-align: center;
}
.lecture > .inner .cat_box .tab a {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  height: 50px;
  background-color: #fff;
  border-top: 1px solid #dbdbdb;
  border-bottom: 1px solid #dbdbdb;
  border-left: 1px solid #dbdbdb;
  font-weight: 500;
  font-size: 12px;
  color: #91979c;
  line-height: 15px;
}
.lecture > .inner .cat_box .tab a.on {
  background-color: #121212;
  border: 1px solid #000;
  font-weight: 900;
  color: #fff;
}
.lecture > .inner .cat_box .tab a:first-child {
  border-radius: 10px 0 0 0;
}
.lecture > .inner .cat_box .tab a:last-child {
  border-right: 1px solid #dbdbdb;
  border-radius: 0 10px 0 0;
}
.lecture > .inner .cat_box .tab a:last-child.on {
  border-right: 1px solid #121212;
}
.lecture > .inner .cat_box .sel {
  background-color: #fff;
  border: 1px solid #dbdbdb;
  border-top: none;
  border-radius: 0 0 10px 10px;
}
.lecture > .inner .cat_box .sel .area {
  display: flex;
  gap: 6px;
  padding: 10px;
}
.lecture > .inner .cat_box .sel .area:not(:first-child) {
  border-top: 1px solid #dbdbdb;
}
.lecture > .inner .cat_box .sel .area span {
  display: none;
}
.lecture > .inner .cat_box .sel .area .active {
  display: block;
  width: calc((100% - 12px) / 3);
  flex: 1;
}
.lecture > .inner .cat_box .sel .area .active:nth-of-type(1) {
  margin-left: 0;
}
.lecture > .inner .cat_box .sel .area .active select {
  width: 100%;
}
.lecture > .inner .cat_box .sel .area select {
  text-overflow: ellipsis;
  white-space: nowrap;
  position: relative;
  width: calc((100% - 12px) / 3);
  height: 32px;
  padding: 0 25px 0 12px;
  background: url(/images/sub/lectureList_sel_arr01.png) right 12px center
    no-repeat;
  background-size: 9px 5px;
  border: 1px solid #dbdbdb;
  border-radius: 6px;
  font-weight: 500;
  font-size: 12px;
  color: #666;
}
.lecture > .inner .cat_box .sel .area select:focus {
  background: url(/images/sub/lectureList_sel_arr02.png) right 12px center
    no-repeat;
  background-size: 9px 5px;
  border: 1px solid #121212;
  color: #121212;
}
.lecture > .inner .cat_box .sel .area select:disabled {
  background-color: #f4f6f9;
  color: #ccc;
}
.lecture > .inner .cat_box .sel .area.sch {
  position: relative;
}
.lecture > .inner .cat_box .sel .area.sch input {
  width: 100%;
  height: 40px;
  padding-left: 16px;
  background-color: #f4f6f9;
  border: none;
  border-radius: 20px;
}
.lecture > .inner .cat_box .sel .area.sch input::placeholder {
  font-weight: 500;
  font-size: 12px;
  color: #666;
}
.lecture > .inner .cat_box .sel .area.sch button {
  position: absolute;
  top: 50%;
  right: 14px;
  width: 40px;
  height: 40px;
  transform: translateY(-50%);
}
.lecture > .inner .cat_box .sel .area.sch button img {
  width: 16px;
}
.lecture > .inner .cat_box .sel .area.sch .bubble {
  position: absolute;
  left: 3%;
  bottom: -38px;
  line-height: 1;
  animation: search_bubble 0.3s 0s ease-in-out forwards;
  opacity: 0;
  z-index: 2;
}
.lecture > .inner .cat_box .sel .area.sch .bubble > .inner {
  position: relative;
  background: #282c3b;
  border-radius: 100px;
  padding: 8px 15px;
  box-shadow: 0 5px 10px rgb(0 0 0 / 30%);
}
.lecture > .inner .cat_box .sel .area.sch .bubble > .inner .txt {
  position: relative;
  color: #fff;
  font-size: 12px;
  line-height: 1.3;
  text-align: center;
}
.lecture > .inner .cat_box .sel .area.sch .bubble > .inner .txt span {
  display: inline-block;
  color: #ffed27;
}
.lecture > .inner .cat_box .sel .area.sch .bubble > .inner:after {
  content: "";
  position: absolute;
  top: 3px;
  left: 50%;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-bottom-color: #282c3b;
  border-top: 0;
  margin-left: -10px;
  margin-top: -10px;
}
.lecture > .inner .cat_box .sel .area.sch .bubble > .inner .btn_close {
  position: absolute;
  right: 0;
  top: 0;
  width: 22px;
  height: auto;
  aspect-ratio: 1 / 1;
  text-indent: -9999em;
  background: url(/images/sub/ico_bubble_close.png) no-repeat 0 0 / 100%;
}
.cat_box.fixed .area.sch .bubble {
  display: none;
}
@keyframes search_bubble {
  0% {
    transform: translateY(-10%);
  }
  80% {
    transform: translateY(2%);
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
.lecture > .inner .list li {
  background-color: #fff;
  border: 1px solid #dbdbdb;
  border-radius: 10px;
}
.lecture > .inner .list li:not(:first-child) {
  margin-top: 10px;
}
.lecture > .inner .list li.default {
  display: flex;
  justify-content: center;
  padding: 30px 0;
}
.lecture > .inner .list li a {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 140px;
  padding: 0 39px 0 14px;
  background: url(/images/sub/lectureList_link_arr.png) right 12px bottom 12px
    no-repeat;
  background-size: 22px;
}
.lecture > .inner .list li a .thumb {
  position: relative;
  margin-top: auto;
}
.lecture > .inner .list li a .thumb .book {
  position: absolute;
  top: 6px;
  left: 0;
  padding-right: 2px;
  background: url(/images/sub/lectureList_book_bg.png) right 0 no-repeat;
  background-size: auto;
}
.lecture > .inner .list li a .thumb .book img {
  width: 53px;
  border: 1px solid #ccc;
}
.lecture > .inner .list li a .thumb .picture {
  position: relative;
  margin-left: 28px;
  z-index: 1;
}
.lecture > .inner .list li a .thumb .picture img {
  height: 124px;
}
.lecture > .inner .list li a .con {
  width: calc(100% - 124px);
}

/* 개정 아이콘 추가 시작 2026-04-15 */
.course_15 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 500;
  font-size: 13px;
  color: #91979c;
}
.course_15 span {
  display: block;
  min-width: 38px;
  height: 22px;
  padding: 1px 5px 0;
  background-color: #e2e9f6;
  border-radius: 15px;
  font-weight: 700;
  color: #203864;
  text-align: center;
  width: 60px;
}
.course_22 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 500;
  font-size: 13px;
  color: #91979c;
}
.course_22 span {
  display: block;
  min-width: 38px;
  height: 22px;
  padding: 1px 5px 0;
  background-color: #dfeed6;
  border-radius: 15px;
  font-weight: 700;
  color: #385723;
  text-align: center;
  width: 60px;
}

.course_15_d {
  display: inline-flex;
  border: 1px solid #203864;
  color: #203864;
  font-size: 11px;
  width: 45px;
  align-items: center;
  justify-content: center;
}
.course_22_d {
  display: inline-flex;
  border: 1px solid #385723;
  color: #385723;
  font-size: 11px;
  width: 45px;
  align-items: center;
  justify-content: center;
}

/* 개정 아이콘 추가 끝 2026-04-15 */

.lecture > .inner .list li a .con .name {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 500;
  font-size: 13px;
  color: #91979c;
}
.lecture > .inner .list li a .con .name span {
  display: block;
  min-width: 38px;
  height: 22px;
  padding: 1px 5px 0;
  background-color: #fff0ef;
  border-radius: 15px;
  font-weight: 700;
  color: #ed3535;
  text-align: center;
}
.lecture > .inner .list li a .con .tit {
  margin-top: 4px;
  max-height: 45px;
  font-weight: 700;
  font-size: 15px;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.lecture > .inner .list li a .con .price {
  margin-top: 6px;
  font-size: 12px;
  color: #91979c;
}
.lecture > .inner .list li a .con .price span {
  margin-left: 4px;
  font-family: "Pretendard";
  font-weight: 700;
  font-size: 13px;
  color: #121212;
}

/* 유료학습 신청 */
.charged {
  margin-bottom: 20px;
}
.charged img {
  width: 100%;
}
.product {
  padding: 0 20px;
}
.product h3 {
  margin: 0 0 10px;
  font-weight: 700;
  font-size: 15px;
}
.product h3 span {
  font-weight: 500;
  font-size: 14px;
}
.product .align {
  margin: 0 0 10px;
}
.product .align h3 {
  margin: 0;
}
.product .btn {
  display: flex;
}
.product .btn a {
  display: inline-block;
  width: 89px;
  height: 30px;
  background-color: #1b8b94;
  border: 1px solid #095a60;
  border-radius: 4px;
  font-weight: 700;
  font-size: 11px;
  line-height: 28px;
  color: #fff;
  text-align: center;
}
.product .btn a:last-child {
  margin-left: 5px;
}
.product .btn a.v1 {
  background-color: #2d3e78;
  border: 1px solid #162555;
}
.product .btn a span {
  padding-right: 9px;
  background: url(/images/sub/lineup_arr.png) right center no-repeat;
  background-size: 5px;
}
.product .btn a span b.v1 {
  color: #ffe869;
}
.product .btn a span b.v2 {
  color: #231e7b;
}
.product > div > ul + h3,
.product > div > ul + .align {
  margin-top: 50px;
}
.product > div > ul > li > p {
  height: 40px;
  padding-left: 17px;
  background-color: #f9f9f9;
  border-top: 2px solid #97999b;
  font-weight: 700;
  line-height: 38px;
}
.product > div > ul > li:nth-child(2) > p {
  border-top: none;
}
.product > div > ul > li ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 17px;
  border-bottom: 1px solid #c0c0c0;
}
.product > div > ul > li ul li.end {
  align-items: end;
} /* 수직정렬 클래스 추가 */
.product > div > ul > li ul li.state {
  padding: 30px 17px 17px;
} /* 상품명에 상태값 들어갈 때 */
.product > div > ul > li ul li .date label {
  font-weight: 700;
}
.product > div > ul > li ul li .date label b {
  color: #2a5deb;
}
.product > div > ul > li ul li .date label span {
  display: block;
  width: 72px;
  height: 19px;
  margin: -15px 0 6px;
  border: 1px solid #333;
  border-radius: 15px;
  font-size: 12px;
  text-align: center;
  line-height: 17px;
}
.product > div > ul > li ul li .price.type1 {
  margin-top: -12px;
} /* 상품과 가격 정렬로 인한 클래스 */
.product > div > ul > li ul li .price {
  display: flex;
  align-items: end;
  margin-top: 4px;
}
.product > div > ul > li ul li .price div {
  display: flex;
  justify-content: end;
  align-items: center;
  width: 46px;
  margin-right: 6px;
}
.product > div > ul > li ul li .price div span {
  position: relative;
  width: 14px;
  height: 14px;
  text-indent: -9999px;
}
.product > div > ul > li ul li .price div span:not(:first-child) {
  margin-left: 2px;
}
.product > div > ul > li ul li .price div span:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 14px;
  height: 14px;
  background: url(/images/sub/grade_ico.gif) no-repeat;
  background-size: 14px;
}
.product > div > ul > li ul li .price div span.v1:before {
  background-position: 0 0;
} /* 초 */
.product > div > ul > li ul li .price div span.v2:before {
  background-position: 0 -14px;
} /* 중 */
.product > div > ul > li ul li .price div span.v3:before {
  background-position: 0 -28px;
} /* 고 */
.product > div > ul > li ul li .price p {
  line-height: 1;
  text-align: right;
}
.product > div > ul > li ul li .price p b {
  font-weight: 700;
  color: #ed3535;
}
.product > div > ul > li ul li .price p span {
  display: inline-block;
  position: relative;
  margin-bottom: 3px;
  font-size: 10px;
}
.product > div > ul > li ul li .price p span:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #a7a7a7;
  z-index: -1;
}
.product input[type="button"] {
  width: 100%;
  height: 43px;
  margin-top: 15px;
  background-color: #ed3535;
  border: none;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #fff;
  line-height: 43px;
  cursor: pointer;
}

/* 유료학습 신청 - 온리원 중등 상품 한 눈에 보기 */
.summary {
  margin-top: 77px;
  padding: 44px 15px 32px;
  background-color: #f9f9f9;
  text-align: center;
}
.summary img {
  width: 100%;
}
.summary > .tit {
  margin-bottom: 30px;
  font-family: "GmarketSansBold";
  font-size: 22px;
}
.summary > .tit span {
  display: block;
  margin-bottom: -5px;
  font-family: "GmarketSansMedium";
  font-size: 15px;
}
.summary > .tit b {
  position: relative;
  color: #1563d8;
  z-index: 10;
}
.summary > .tit b:before {
  content: "";
  display: block;
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 158px;
  height: 12px;
  background-color: #fee2df;
  z-index: -1;
}
.summary .guide {
  display: flex;
  margin-top: 10px;
  border-top: 1px solid #888;
  border-bottom: 1px solid #888;
}
.summary .guide .tit {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-shrink: 0;
  width: 17.9%;
  background-color: #ecf8ff;
  border-right: 1px solid #888;
  border-left: 1px solid #888;
  font-weight: 700;
  font-size: 10px;
  color: #1b1b1b;
  line-height: 15px;
}
.summary .guide .tit span {
  display: block;
  color: #1563d8;
}
.summary .guide ul {
  display: flex;
  flex-wrap: wrap;
  background-color: #fff;
  text-align: right;
  flex-grow: 1;
}
.summary .guide ul li {
  position: relative;
  width: calc(100% / 3);
  padding: 27px 10px 8px 0;
  border-right: 1px solid #888;
}
.summary .guide ul li.empty {
  background: #ecf8ff;
}
.summary .guide ul li:nth-child(n + 4) {
  border-top: 1px solid #888;
}
.summary .guide ul.splite4 li {
  width: calc(100% / 4);
}
.summary .guide ul.splite4 li:nth-child(4) {
  border-top: 0;
}
.summary .guide ul li.on {
  background-color: #fbeeee;
}
.summary .guide ul li.on:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  border: 1px solid #5a5a5a;
}
.summary .guide ul li .cat {
  display: flex;
  gap: 3px;
  position: absolute;
  top: 7px;
  left: 4px;
}
.summary .guide ul li .cat span {
  display: block;
  width: 30px;
  height: 17px;
  border-radius: 20px;
  font-size: 8px;
  color: #fff;
  line-height: 17px;
  text-align: center;
}
.summary .guide ul li .cat span.v1 {
  background-color: #ed3535;
}
.summary .guide ul li .cat span.v2 {
  background-color: #1b1b1b;
}
.summary .guide ul li .cat span.v3 {
  background-color: #1b8b94;
}
.summary .guide ul li .cat span.v4 {
  background-color: #2d3e78;
}
.summary .guide ul li .cat.type1 span {
  width: 32px;
}
.summary .guide ul li .info p {
  font-weight: 700;
  font-size: 9px;
  color: #1b1b1b;
}
.summary .guide ul li .info .price {
  margin-top: -3px;
  font-weight: 500;
}
.summary .guide ul li .info .price span {
  font-weight: 700;
  color: #ed3535;
}
.summary .btn_area {
  display: block;
  margin: 15px 0 0;
  text-align: center;
}
.summary .btn_area input[type="button"] {
  width: 100%;
  height: 43px;
  margin-top: 15px;
  background-color: #ed3535;
  border: none;
  border-radius: 5px;
  font-weight: 700;
  font-size: 13px;
  color: #fff;
  line-height: 43px;
  cursor: pointer;
}
.summary .btn_area .sign {
  margin-top: 20px;
}
.summary .btn_area .sign p {
  font-weight: 700;
  font-size: 16px;
  color: #000;
}
.summary .btn_area .sign p span {
  margin-left: 10px;
  color: #828282;
}
.summary .btn_area .sign p span i {
  margin-left: 5px;
  font-style: normal;
  color: #2e323d;
}
.summary .btn_area .sign > span {
  font-size: 13px;
  line-height: 21px;
  color: #828282;
}

/* 유료학습 신청 - 자주 묻는 질문 */
#helpDesk {
  margin: 60px 0 0;
}
#helpDesk.open {
  margin: 60px 0 60px;
}
#helpDesk .section_top {
  position: relative;
  background: #ffeded;
  border: 1px solid #ffcfcf;
  border-left: none;
  border-right: none;
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#helpDesk .section_top p {
  position: relative;
  color: #000;
  font-size: 14px;
  font-weight: 700;
}
#helpDesk .section_top p:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: -30px;
  width: 18px;
  height: 10px;
  margin-top: -4px;
  background: url(img/state_arr.png) 0 0 no-repeat;
  background-size: 80%;
  transition: transform 0.5s;
}
#helpDesk .section_top.open p:before {
  transform: rotate(180deg);
}
#helpDesk .board_list2 {
  display: none;
  padding: 0 17px;
}
#helpDesk .board_list2 > li > a {
  text-indent: -13px;
  padding: 0 0 0 13px;
}
#helpDesk .board_list2 > li > a {
  padding: 18px 20px 18px 20px;
}
#helpDesk .board_list2 > li:first-child {
  border-top: none;
}
#helpDesk .txtBox li {
  line-height: 1.8;
  text-indent: -10px;
  padding: 0 0 0 10px;
}

/* 유료학습 신청 - 구매 전 확인 */
#noticeBenefit img {
  width: 100%;
}
#noticeBenefit .section_top {
  position: relative;
  background: #eee;
  border: 1px solid #d8d8d8;
  border-left: none;
  border-right: none;
  width: 100%;
  height: 35px;
  display: flex;
  align-items: center;
  padding: 0 0 0 20px;
}
#noticeBenefit .section_top p {
  color: #1b1b1b;
  font-size: 14px;
  font-weight: 700;
}
#noticeBenefit .section_top .btn {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  border: 1px solid #c0c0c0;
  background: #fff;
  text-align: center;
  width: 60px;
  height: 25px;
  color: #000;
  font-size: 12px;
  line-height: 23px;
}
#noticeBenefit .infoMsg {
  position: relative;
  background: #f9f9f9;
  padding: 20px;
  display: none;
}
#noticeBenefit .txtBox li {
  color: #616161;
  text-indent: -6px;
  padding: 0 0 0 10px;
  font-size: 12px;
}
#noticeBenefit .txtBox li:not(:first-child) {
  margin-top: 5px;
}
#noticeBenefit h3 {
  border-top: 1px solid #cbcbcb;
  margin: 20px 0 0;
  padding: 20px 0 10px;
  font-size: 15px;
}
#noticeBenefit h3:first-child {
  border: none;
  padding: 0 0 10px;
  margin: 0;
}
#noticeBenefit .end {
  border-top: 1px solid #cbcbcb;
  vertical-align: middle;
  border-bottom: 1px solid #cbcbcb;
  padding: 15px 7px;
  text-align: right;
  margin: 50px 0 0;
  font-size: 16px;
  color: #03030b;
}
#noticeBenefit .end span {
  vertical-align: middle;
}
#noticeBenefit .end span.num {
  vertical-align: -5px;
  font-size: 24px;
}
#noticeBenefit .btn_infoView {
  display: block;
  background: #858585;
  color: #fff;
  border: 1px solid #737373;
  border-radius: 5px;
  vertical-align: 2px;
  padding: 3px 8px;
  margin-top: 4px;
  font-size: 12px;
}
#noticeBenefit h3 + ul {
  border-bottom: none;
}

/* 학습자료실 */
.portal {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px 20px 0;
}
.portal > p {
  margin-bottom: 12px;
}
.portal select {
  width: 185px;
  margin-bottom: 20px;
}
.portal div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  height: 150px;
  margin-bottom: 20px;
  background-color: #f9f9f9;
  border-top: 1px solid #ededed;
  border-bottom: 1px solid #ededed;
  text-align: center;
}
.portal div .tit {
  margin-bottom: 15px;
}
.portal div .tit strong {
  display: block;
  font-weight: 700;
  font-size: 23px;
}
.portal div .tit strong span {
  color: #ed3535;
}
.portal div .txt {
  font-size: 13px;
}
.portal div .txt span {
  color: #ed3535;
}
.portal a {
  display: inline-block;
  width: 160px;
  height: 30px;
  padding: 6px 0;
  margin-left: auto;
  border: 1px solid #010101;
  border-radius: 5px;
  font-weight: 700;
  font-size: 11px;
  text-align: center;
}
.portal_sel {
  display: flex;
  justify-content: end;
  padding: 20px 20px 0;
}
.portal_sel select {
  width: 115px;
}
.portal_sel select:nth-child(2) {
  margin-left: 5px;
}

/* 온라인 강의실 무료체험 남은시간 */
.remaining_time {
  height: 47px;
  background-color: #1b1b1b;
  text-align: center;
  line-height: 45px;
}
.remaining_time p {
  font-size: 12px;
  color: #ed3535;
}
.remaining_time p span {
  margin-left: 5px;
  font-weight: 700;
  font-size: 18px;
  color: #fff;
}

/* 설정, 앱다운 */
.setting {
  padding: 25px 15px;
}
.setting li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
}
.setting li:not(:first-child) {
  margin-top: 25px;
}
.setting li .tit {
  width: 67px;
  margin-right: 15px;
  font-weight: 700;
}
.setting li .btnBox {
  width: calc(100% - 82px);
}
.setting li .btnBox.Quality {
  display: flex;
  justify-content: space-between;
}
.setting li .btnBox.Quality a {
  width: calc((100% - 4px) / 3);
  height: 50px;
  background-color: #eee;
  border: 1px solid #d3d3d3;
  line-height: 48px;
  text-align: center;
}
.setting li .btnBox.Quality a.on {
  background-color: #ed3535;
  border: 1px solid #ed3535;
  font-weight: 700;
  color: #fff;
}
.setting li .btnBox .sec {
  display: block;
  height: 44px;
  border: 1px solid #666;
  border-radius: 5px;
  font-weight: 700;
  color: #666;
  line-height: 42px;
  text-align: center;
}
.setting li > a {
  display: block;
  width: calc(100% - 82px);
  height: 44px;
  border: 1px solid #ed3535;
  border-radius: 5px;
  font-weight: 700;
  color: #ed3535;
  line-height: 42px;
  text-align: center;
}
.setting li > a span {
  padding-right: 22px;
  background: url(/images/sub/app_dwn_arr.gif) right center no-repeat;
  background-size: 6px 10px;
}

/* 단강말 질답게시판 상단 */
.lecture_info {
  padding: 10px;
  background-color: #f4f4f4;
  box-shadow: inset 0 -1px 0 #fff;
  font-size: 12px;
}
.lecture_info ul li {
  padding: 8px 0;
  border-top: 1px dashed #ddd;
}
.lecture_info ul li:first-child {
  padding-bottom: 8px;
  border-top: none;
}

/* 입력형식 */
.form {
  padding: 0 17px 50px;
}
.form.type1 {
  padding: 25px 17px 50px;
}
.form > .btn_area {
  margin: 0 0 15px;
}
.form form + .btn_area {
  margin-top: 20px;
}
.form .memtypeui {
  margin-bottom: 34px;
}
.form .txtarea {
  padding: 35px 0;
  text-align: center;
}
.form .txtarea p:nth-child(1) {
  font-size: 14px;
  line-height: 18px;
}
.form .txtarea p:nth-child(2) {
  font-size: 13px;
  line-height: 17px;
}
.form .txtarea p + p {
  margin-top: 17px;
}
.form .txtarea p strong {
  font-weight: 700;
}
.form .txtarea p span {
  color: #ed3535;
}
.form .tit {
  font-weight: 700;
  font-size: 16px;
  text-align: center;
}
.form .tit + .txt2 {
  margin: 15px 0 30px;
}
.form .txt1 {
  font-size: 13px;
}
.form .txt1 span {
  font-weight: 700;
}
.form .txt2 {
  margin: 35px 0;
  text-align: center;
}
.form .sort {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 23px;
}
.form .sort p {
  margin-bottom: 12px;
  font-weight: 700;
  font-size: 13px;
}
.form .sort div {
  display: flex;
  justify-content: space-between;
  width: 100%;
  text-align: center;
}
.form .sort div a {
  width: calc(50% - 7px);
  height: 50px;
  background-color: #b1b3b3;
  border-radius: 8px;
  font-weight: 700;
  font-size: 15px;
  color: #fff;
  line-height: 50px;
  transition: all 0.5s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.form .sort div a:nth-child(1).on {
  background-color: #ed3535;
}
.form .sort div a:nth-child(2).on {
  background-color: #1c1b32;
}
.form .sort div a span {
  position: relative;
  padding-left: 30px;
  display: inline-block;
  line-height: 22px;
}
.form .sort div a span:before {
  content: "";
  display: block;
  position: absolute;
  top: -1px;
  left: 0;
  width: 22px;
  height: 22px;
  background: url(/images/sub/sort_chk.png) 0 0 no-repeat;
  background-size: 22px;
}
.form .sort div a.on span:before {
  background-position: 0 -22px;
}
.form .sort .sign {
  display: none;
  margin-top: 10px;
  font-weight: 500;
  color: #555;
  line-height: 17px;
  text-align: center;
}
.form .agree + h3 {
  margin-top: 23px;
}
.form .agree + .btn_area {
  margin-top: 10px;
}
.form .agree > a {
  display: block;
  height: 43px;
  margin: 16px 0;
  background-color: #f9f9f9;
  border: 1px solid #b1b3b3;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #97999b;
  line-height: 41px;
  text-align: center;
}
.form .agree > a.on {
  background-color: #fff;
  border: 1px solid #ed3535;
  color: #ed3535;
}
.form .agree > p {
  font-size: 13px;
  color: #1b1b1b;
  text-align: center;
}
.form .agree > p .essential {
  color: #ed3535;
}
.form .agree > ul > li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 0;
}
.form .agree > ul > li:not(:last-child) {
  border-bottom: 1px solid #ededed;
}
.form .agree > ul > li p .essential {
  color: #ed3535;
}
.form .agree > ul > li .view {
  position: relative;
  font-size: 11px;
  color: #97999b;
}
.form .agree > ul > li .view:before {
  content: "";
  display: inline-block;
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  border-bottom: 1px solid #97999b;
}
.form .agree > ul > li .con ul li {
  font-size: 11px;
}
.form .agree > ul > li .con ul li:not(:first-child) {
  margin-top: 3px;
}
.form .agree > ul > li .con ul li ul {
  padding: 5px;
}
.form .agree_chk {
  margin-top: 20px;
  padding: 15px;
  background-color: #f9f9f9;
  border-top: 1px solid #ededed;
  border-bottom: 1px solid #ededed;
}
.form .agree_chk + h3 {
  margin-top: 20px;
}
.form .agree_chk label {
  font-weight: 700;
  font-size: 13px;
}
/* 약관동의 accordion 방식 */
.form > form .agree.accordion > ul > li {
  display: block;
  padding: 0;
}
.form > form .agree.accordion > ul > li:last-child {
  border-bottom: 1px solid #ededed;
}
.form > form .agree.accordion > ul > li a {
  display: block;
  padding: 23px 0;
  position: relative;
}
.form > form .agree.accordion > ul > li .con {
  padding: 10px;
}
.form > form .agree.accordion > ul > li .con ul li {
  font-size: 11px;
}
.form > form .agree.accordion > ul > li .con ul li:not(:first-child) {
  margin-top: 3px;
}
.form > form .agree.accordion > ul > li .con ul li ul {
  padding: 5px;
}
.form input[type="text"],
.form input[type="password"] {
  width: 100%;
  height: 43px;
  padding-left: 13px;
  border: 1px solid #b1b3b3;
  border-radius: 5px;
  font-family: "Noto Sans KR";
}
.form input[type="text"]::placeholder,
.form input[type="password"]::placeholder {
  color: #97999b;
}
.form input[type="button"] {
  height: 43px;
  border: 1px solid #b1b3b3;
  border-radius: 5px;
  font-family: "Noto Sans KR";
}
.form input[type="button"].btn {
  width: 100%;
  height: 43px;
  margin-top: 33px;
  background-color: #ed3535;
  border: none;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #fff;
  line-height: 43px;
  cursor: pointer;
}
.form select {
  width: 100%;
  height: 43px;
  padding-left: 13px;
  background: url(/images/sub/join_sel_arr.gif) right 10px center no-repeat;
  background-size: 11px 7px;
  border: 1px solid #b1b3b3;
  border-radius: 5px;
  font-family: "Noto Sans KR";
  color: #000;
}
.form textarea {
  width: 100%;
  min-height: 100px;
  padding: 10px;
  border: 1px solid #b1b3b3;
  border-radius: 5px;
}
.form h3 {
  position: relative;
  padding-bottom: 6px;
  border-bottom: 1px solid #97999b;
  font-weight: 700;
  font-size: 15px;
}
.form h3.essential:before {
  content: "*는 필수입력 항목입니다.";
  display: block;
  position: absolute;
  top: 2px;
  right: 0;
  font-weight: 400;
  font-size: 11px;
  color: #ed3535;
}
.form h3 .essential {
  margin-left: 2px;
  color: #ed3535;
}
.form h3 .chk {
  position: absolute;
  top: -2px;
  right: 0;
}
.form h3 + .txt1 {
  margin-top: 15px;
}
.form h3 a {
  position: absolute;
  top: -1px;
  right: 0;
}
.form h3 a.send1 {
  height: 25px;
  line-height: 23px;
}
.form .insert + h3 {
  margin-top: 25px;
}
.form .insert + a {
  margin-top: 30px;
}
.form .insert + .align {
  margin-top: 30px;
}
.form .insert + .btn_area {
  margin-top: 30px;
}
.form .insert > li {
  margin-top: 20px;
}
.form .insert > li p {
  margin-bottom: 10px;
}
.form .insert > li p .essential {
  margin-left: 2px;
  color: #ed3535;
}
.form .insert > li p .description {
  font-size: 11px;
}
.form .insert > li .sign {
  display: inline-block;
  margin-bottom: 5px;
  font-size: 11px;
}
.form .insert > li > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.form .insert > li > div > span,
.form .insert > li > div > div > span {
  width: 17px;
  text-align: center;
  color: #97999b;
}
.form .insert > li .confirm input[type="text"] {
  width: calc(100% - 110px);
}
.form .insert > li .confirm input[type="submit"] {
  width: 103px;
  height: 43px;
  background-color: #fff;
  border: 1px solid #ed3535;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #ed3535;
}
.form .insert > li .confirm input[type="submit"].complete {
  background-color: #c1c1c1;
  border: 1px solid #c1c1c1;
  color: #666;
}
.form .insert > li .confirm a,
.form .insert > li .confirm input[type="button"] {
  width: 103px;
  height: 43px;
  background-color: #fff;
  border: 1px solid #ed3535;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #ed3535;
  text-align: center;
  line-height: 42px;
  cursor: pointer;
}
.form .insert > li .confirm input[type="button"]:disabled {
  border: 1px solid #898989;
  -webkit-text-fill-color: #898989;
}
.form .insert > li .phone div {
  display: flex;
  justify-content: space-between;
  width: calc(100% - 110px);
}
.form .insert > li .phone div select {
  width: calc(33.3% - 4px);
}
.form .insert > li .phone div input {
  width: calc(33.3% - 4px);
}
.form .insert > li .phone input[type="button"],
.form .insert > li .phone a {
  width: 103px;
  height: 43px;
  border: 1px solid #ed3535;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #ed3535;
  text-align: center;
  line-height: 42px;
  background-color: #fff;
}
.form .insert > li .phone + .confirm {
  margin-top: 13px;
}
.form .insert > li .parents input {
  width: calc(100% - 110px);
}
.form .insert > li .parents select {
  width: 103px;
}
.form .insert > li .email input {
  width: calc(100% - 194px);
}
.form .insert > li .email select {
  width: 177px;
}
.form .insert > li .email.type1 div {
  display: flex;
  align-items: center;
  width: calc(100% - 127px);
}
.form .insert > li .email.type1 input {
  flex: 1;
  width: calc(50% - 8.5px);
} /* 직접입력칸 있는 경우 */
.form .insert > li .email.type1 select {
  width: 120px;
}
.form .insert > li .email.type1 .mod {
  width: calc(100% - 110px);
}
.form .insert > li .email.type1 .mod input {
  width: calc(50% - 8.5px);
}
.form .insert > li .email.type2 div {
  display: flex;
  align-items: center;
  width: calc(100% - 137px);
}
.form .insert > li .email.type2 input {
  flex: 1;
  width: calc(50% - 8.5px);
}
.form .insert > li .email.type2 select {
  width: 130px;
}
.form .insert > li .email.type2 .mod {
  width: calc(100% - 132px);
}
.form .insert > li .email.type2 .mod input {
  width: calc(50% - 8.5px);
}
.form .insert > li .email a {
  width: 103px;
  height: 43px;
  border: 1px solid #ed3535;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #ed3535;
  text-align: center;
  line-height: 42px;
  background-color: #fff;
}
.form .insert > li .addr {
  flex-direction: column;
}
.form .insert > li .addr .num {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.form .insert > li .addr .num div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(100% - 110px);
}
.form .insert > li .addr .num div input {
  width: calc(50% - 8.5px);
}
.form .insert > li .addr .num a {
  width: 103px;
  height: 43px;
  border: 1px solid #ed3535;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #ed3535;
  text-align: center;
  line-height: 42px;
}
.form .insert > li .addr > input {
  margin-top: 13px;
}
.form .insert > li .tel select {
  width: 120px;
}
.form .insert > li .tel input {
  width: calc((100% - 133px) / 2);
}
.form .insert > li .grade {
  display: inline-block;
  width: 52px;
  height: 21px;
  margin-bottom: 13px;
  border: 1px solid #333;
  border-radius: 10px;
  font-weight: 500;
  text-align: center;
  line-height: 19px;
}
.form .insert > li .radio {
  display: flex;
  flex-wrap: wrap;
}
.form .insert > li .radio + .grade {
  margin-top: 30px;
}
.form .insert > li .radio + .introduce {
  margin-top: 10px;
}
.form .insert > li .radio + .confirm {
  margin-top: 33px;
}
.form .insert > li .radio li {
  width: calc(100% / 3);
}
.form .insert > li .radio li:nth-child(n + 4) {
  margin-top: 15px;
}
.form .insert > li .radio.type1 li {
  width: 50%;
}
.form .insert > li .radio.type1 li:nth-child(n + 3) {
  margin-top: 15px;
}
.form .insert > li .radio.type1 li.wide {
  width: 100%;
}
.form .insert > li .radio.type1 li.wide p span {
  display: inline-block;
  margin: 0 5px;
  vertical-align: 3px;
}
.form .insert > li .chk {
  padding: 8px 9px;
  background-color: #f9f9f9;
  border-top: 1px solid #ededed;
  border-bottom: 1px solid #ededed;
}
.form .insert > li .chk ul {
  display: flex;
  flex-wrap: wrap;
}
.form .insert > li .chk ul li {
  width: calc(100% / 3);
}
.form .insert > li .chk ul li {
  margin: 5px 0;
}
.form .insert > li .chk ul li label {
  font-size: 12px;
}
.form .insert > li .chk ul li.all {
  width: 100%;
}
.form .insert > li .chk ul li.all label {
  font-weight: 700;
  font-size: 13px;
}
.form .insert > li .agree {
  flex-wrap: wrap;
  padding: 13px 9px;
  background-color: #f9f9f9;
  border-top: 1px solid #ededed;
  border-bottom: 1px solid #ededed;
}
.form .insert > li .agree p {
  margin-bottom: 12px;
}
.form .insert > li .agree p label {
  font-weight: 700;
}
.form .insert > li .agree span {
  width: auto;
  font-size: 13px;
  text-align: left;
  color: #333;
}
.form .insert > li .birthday input {
  width: calc((100% / 3) - 17px);
}
.form .insert > li .birthday select {
  width: calc((100% - 14px) / 3);
}
.form .insert > li .education div {
  display: flex;
  align-items: center;
  width: calc(100% - 167px);
}
.form .insert > li .education div input {
  width: calc(50% - 17px);
}
.form .insert > li .education select {
  width: 167px;
}
.form .insert > li .education .sel {
  width: calc(100% - 174px);
  justify-content: space-between;
}
.form .insert > li .education .sel select {
  width: calc(50% - 3.5px);
}
.form .insert > li .education input {
  width: 167px;
}
.form .insert > li .education_mid .sel {
  display: flex;
  justify-content: space-between;
  width: calc(100% - 174px);
}
.form .insert > li .education_mid .sel select {
  width: calc(50% - 3.5px);
}
.form .insert > li .education_mid .inp {
  width: 167px;
}
.form .insert > li .education_mid .inp input {
  width: calc(50% - 17px);
}
.form .insert > li .career {
  display: block;
}
.form .insert > li .career > div:not(:first-child) {
  margin-top: 15px;
}
.form .insert > li .career > div > span {
  display: inline-block;
  width: 97px;
  height: 21px;
  margin-bottom: 5px;
  border: 1px solid #333;
  border-radius: 15px;
  font-size: 12px;
  color: #333;
  text-align: center;
  line-height: 19px;
}
.form .insert > li .career > div div {
  display: flex;
  align-items: center;
  margin-top: 10px;
}
.form .insert > li .career > div div input {
  width: calc((100% / 4) - 21.25px);
}
.form .insert > li .career > div div span {
  width: 17px;
  text-align: center;
  color: #97999b;
}
.form .insert > li .introduce select {
  width: 104px;
  margin-right: 5px;
}
.form .insert > li .introduce input {
  width: calc(100% - 109px);
}
.form .insert > li .file {
  display: block;
}
.form .insert > li .file .sch {
  display: flex;
  justify-content: space-between;
  position: relative;
  width: 100%;
}
.form .insert > li .file .sch .txt {
  position: relative;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: calc(100% - 110px);
  height: 43px;
  padding: 10px;
  border: 1px solid #b1b3b3;
  border-radius: 5px;
  color: #8f9294;
  transition: border 0.1s;
}
.form .insert > li .file .sch input[type="file"] {
  display: none;
}
.form .insert > li .file .sch a {
  display: inline-block;
  width: 103px;
  height: 43px;
  border: 1px solid #ed3535;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #ed3535;
  text-align: center;
  line-height: 42px;
}
.form .insert > li .file .attachfile div {
  position: relative;
  width: calc(100% - 110px);
  height: 43px;
  padding: 10px;
  border: 1px solid #b1b3b3;
  border-radius: 5px;
  color: #8f9294;
  transition: border 0.1s;
}
.form .insert > li .file .attachfile em {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  width: 103px;
  height: 43px;
  padding: 0;
  margin: 0;
  border: 1px solid #ed3535;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #ed3535;
  text-align: center;
  line-height: 42px;
}
.form .insert > li .file .attachfile input {
  width: calc(100% - 110px);
  height: 43px;
}
.form .insert > li .file .sign {
  margin-top: 10px;
  font-size: 11px;
  color: #97999b;
}
.form .insert > li .file .current {
  margin-top: 8px;
  font-size: 13px;
}
.form .insert > li .file .current span {
  display: block;
  width: 100%;
  color: #333;
  text-align: left;
}
.form .insert > li .file .current a {
  vertical-align: middle;
}
.form .insert > li .file .current .name {
  display: block;
  word-break: break-all; /* overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:calc(100% - 50px); */
  padding-right: 3px;
}
/* .form .insert > li .file .current .del{display:inline-block; width:35px; padding:2px 0; background-color:#ed3535; border-radius:5px; font-size:12px; text-align:center; color:#fff;} */
.form .insert > li > .upload > li:not(:first-child) {
  margin-top: 10px;
}
.form .insert > li > .upload > li > span {
  display: inline-block;
  font-size: 11px;
  color: #999;
}
.form .insert > li.agree {
  padding-top: 10px;
  border-top: 1px solid #b1b3b3;
  border-bottom: 1px solid #b1b3b3;
  text-align: center;
}
.form .insert > li.agree p {
  margin-top: 10px;
}
.form .insert > li .filebox {
  position: relative;
  height: 43px;
  margin-bottom: 5px;
  font-size: 0;
}
.form .insert > li .filebox .upload-name {
  display: inline-block;
  width: calc(100% - 110px);
  height: 100%;
  padding-left: 13px;
  border: 1px solid #b1b3b3 !important;
  border-radius: 5px;
  font-size: 13px;
  vertical-align: middle;
}
.form .insert > li .filebox label {
  display: inline-block;
  width: 103px;
  height: 100%;
  padding: 0;
  background: none;
  border: 1px solid #ed3535;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  line-height: 42px;
  color: #ed3535;
  cursor: pointer;
  text-align: center;
}
.form .insert > li .filebox input[type="file"] {
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
}
.form .agree_state {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 15px;
  padding: 10px;
  background-color: #f9f9f9;
}
.form .agree_state + .btn_area {
  margin-top: 20px;
}
.form .agree_state span {
  display: block;
  position: relative;
  margin-right: 7px;
  padding-right: 10px;
}
.form .agree_state span:nth-child(n + 4) {
  margin-top: 10px;
}
.form .agree_state span:nth-child(3) {
  margin-right: 0;
  padding-right: 0;
}
.form .agree_state span:not(:last-child):before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  width: 1px;
  height: 10px;
  background-color: #000;
  transform: translateY(-50%);
}
.form .agree_state span:nth-child(3):before {
  display: none;
}
.form .agree_state a {
  display: inline-block;
  padding: 3px 10px;
  background-color: #666;
  border-radius: 5px;
  font-size: 13px;
  color: #fff;
}
.form > button {
  width: 100%;
  height: 43px;
  margin-top: 33px;
  background-color: #ed3535;
  border: none;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #fff;
  line-height: 43px;
  cursor: pointer;
}
.form .info {
  margin-bottom: 25px;
}
.form .info + .info {
  margin-bottom: 30px;
}
.form .info p {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 41px;
  background-color: #f9f9f9;
  border-top: 2px solid #959595;
  font-weight: 700;
  font-size: 13px;
}
.form .info p span {
  color: #2a5deb;
}
.form .info ul {
  padding: 20px 0;
  border-bottom: 1px solid #ededed;
  text-align: center;
}
.form .info ul li {
  display: flex;
  justify-content: center;
}
.form .info ul li:not(:first-child) {
  margin-top: 5px;
}
.form .info ul li span {
  flex: 1;
}
.form .info ul li span:nth-child(2) {
  text-align: left;
}
.form .info ul li span b {
  font-weight: 700;
}
.form .info ul li label span {
  font-weight: 700;
}

/* 로그인 */
.login {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: column;
  height: 100%;
  padding: 0 30px;
  text-align: center;
}
.login h1 img {
  width: 151px;
}
.login p {
  margin-top: 14px;
  font-size: 13px;
  line-height: 16px;
}
.login p + .join_btn {
  margin-top: 30px;
}
.login p strong {
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
}
.login p span {
  color: #ed3535;
}
.login .insert {
  margin-top: 30px;
}
.login .insert input {
  width: 100%;
  height: 43px;
  padding-left: 13px;
  border: 1px solid #b1b3b3;
  border-radius: 5px;
  font-family: "Noto Sans KR";
}
.login .insert input[type="password"] {
  margin: 6px 0 27px;
}
.login .insert input[type="submit"] {
  padding: 0;
  background-color: #ed3535;
  border: none;
  font-weight: 700;
  font-size: 19px;
  color: #fff;
  cursor: pointer;
}
.login .sch {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 20px 0 17px;
  padding-bottom: 57px;
  border-bottom: 1px solid #ededed;
}
.login .sch a {
  position: relative;
  font-size: 13px;
}
.login .sch a:first-child {
  margin-right: 13px;
  padding-right: 14px;
}
.login .sch a:first-child:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  width: 1px;
  height: 12px;
  transform: translateY(-50%);
  background-color: #b1b3b3;
}
.login span {
  font-weight: 500;
  font-size: 13px;
  color: #97999b;
}
.login span a {
  margin-left: 5px;
  padding-right: 9px;
  background: url(/images/sub/join_arr.gif) right center no-repeat;
  background-size: 5px 10px;
  font-weight: 700;
  color: #333;
}
.login .banner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 220px;
  margin: 30px 0 40px;
  background-color: #eee;
}

/* 로그인 배너 추가 */
.login .login_banner {
  width: 100%;
  max-width: 470px;
  margin: 30px 0 0;
}
.login .login_banner .swiper-slide img {
  width: 100%;
}
.login .login_banner .swiper-pagination {
  position: relative;
  margin: 15px 0 0;
}
.login .login_banner .swiper-pagination-bullet {
  margin: 0 4px;
  width: 10px;
  height: 10px;
  background: #ccc;
  opacity: 1;
}
.login .login_banner .swiper-pagination-bullet-active {
  background: #2b2b2b;
}
.login .sch {
  margin: 0 0 20px !important;
  padding: 0 0 20px !important;
}
.login .sns ul {
  margin: 0 0 30px !important;
}

/* 마이페이지 */
.pw_chk {
  padding: 30px;
  text-align: center;
}
.pw_chk p {
  margin-bottom: 15px;
}
.pw_chk p span {
  color: #ed3535;
}
.pw_chk p + input[type="submit"] {
  margin-top: 0;
}
.pw_chk input {
  width: 100%;
}
.pw_chk input[type="password"] {
  height: 44px;
  padding-left: 14px;
  border-radius: 5px;
}
.pw_chk input[type="submit"],
.pw_chk input[type="button"] {
  width: 100%;
  height: 44px;
  margin-top: 25px;
  background-color: #ed3535;
  border: none;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  color: #fff;
  line-height: 43px;
  cursor: pointer;
}
.member_info {
  border-top: 2px solid #97999b;
  border-bottom: 1px solid #ededed;
  font-size: 13px;
}
.member_info li {
  display: flex;
  align-items: center;
}
.member_info li.type1 {
  align-items: stretch;
}
.member_info li p {
  width: 125px;
  padding: 10px 15px;
  background-color: #f9f9f9;
}
.member_info li span {
  width: calc(100% - 125px);
  padding-left: 15px;
}
.member_info li div {
  width: calc(100% - 125px);
  padding: 10px 0 10px 15px;
}
.member_info li div ul {
  display: flex;
  flex-wrap: wrap;
}
.member_info li div ul li {
  width: 50%;
}
.member_info li div ul li:not(:nth-child(-n + 2)) {
  margin-top: 5px;
}
.member_info textarea {
  width: 100%;
  height: 115px;
  border: 1px solid #b1b3b3;
}
.member_info input[type="checkbox"] {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.member_info input[type="checkbox"] + label {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  padding-left: 25px;
  cursor: pointer;
  line-height: 22px;
}
.member_info input[type="checkbox"] + label:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  background: url(/images/sub/chk_ico.png) 0 0 no-repeat;
  background-size: 100%;
}
.member_info input[type="checkbox"]:checked + label:after {
  background-position: 0 -22px;
}

/* 선생님 콕링크 */
.cok {
  padding: 14px;
}
.cok a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  border: 1px solid #dbdbdb;
  border-radius: 10px;
  font-weight: 500;
  font-size: 13px;
}
.cok a span {
  padding-right: 10px;
  background: url(/images/sub/lecture_link_arr01.png) right 7px no-repeat;
  background-size: 5px 8px;
}
.cok a span img {
  height: 20px;
  margin-right: 4px;
}

/* 회원탈퇴 */
.widtdrawl {
  padding: 24px 20px;
}
.widtdrawl h3 {
  margin-bottom: 4px;
  font-weight: 700;
  font-size: 15px;
}
.widtdrawl .box {
  padding: 18px 15px;
  background-color: #f9f9f9;
  border-top: 1px solid #97999b;
  border-bottom: 1px solid #ededed;
}
.widtdrawl .box.type1 {
  background-color: #fff5f5;
}
.widtdrawl .box + h3 {
  margin-top: 24px;
}
.widtdrawl .box > ul > li {
  position: relative;
  padding-left: 10px;
  font-size: 13px;
}
.widtdrawl .box > ul > li:before {
  content: "";
  display: block;
  position: absolute;
  top: 9px;
  left: 0;
  width: 3px;
  height: 3px;
  border-radius: 100%;
  background-color: #1b1b1b;
}
.widtdrawl .box > ul > li:not(:first-child) {
  margin-top: 3px;
}
.widtdrawl .box > ul > li span {
  color: #ed3535;
}
.widtdrawl .box > ul > li ul {
  display: flex;
  flex-wrap: wrap;
}
.widtdrawl .box > ul > li ul li {
  width: 50%;
}
.widtdrawl .box > ul > li ul li span {
  font-weight: 700;
  color: #333;
}
.widtdrawl .box > ul > li ul li span b {
  color: #ed3535;
}
.widtdrawl .sign {
  margin: 18px 0 20px;
}
.widtdrawl .sign li {
  position: relative;
  padding-left: 10px;
  font-size: 12px;
}
.widtdrawl .sign li:before {
  content: "";
  display: block;
  position: absolute;
  top: 9px;
  left: 0;
  width: 3px;
  height: 3px;
  border-radius: 100%;
  background-color: #1b1b1b;
}
.widtdrawl .sign li span {
  font-weight: 700;
}
.widtdrawl .sign li span b {
  color: #ed3535;
}

/* 선생님 모집 */
.recruit_intro {
  margin-bottom: 15px;
}
.recruit_intro img {
  width: 100%;
}
.recruit {
  padding: 0 20px 50px;
}
.recruit h3 {
  margin-bottom: 5px;
}
.recruit h3 span {
  color: #ed3535;
}
.recruit .banner {
  margin-bottom: 20px;
}
.recruit .banner img {
  width: 100%;
}
.recruit .banner img + img {
  margin-top: 15px;
}
.recruit table {
  width: 100%;
  table-layout: fixed;
  border-top: 2px solid #1b1b1b;
}
.recruit table + h3 {
  margin-top: 52px;
}
.recruit table thead tr {
  height: 33px;
}
.recruit table thead tr th {
  background-color: #f9f9f9;
  border-bottom: 1px solid #b1b3b3;
  font-weight: 700;
}
.recruit table tbody tr {
  height: 57px;
  border-bottom: 1px solid #b1b3b3;
}
.recruit table tbody tr th {
  font-weight: 300;
  background-color: #f9f9f9;
}
.recruit table tbody tr td {
  padding: 15px;
  font-size: 13px;
}
.recruit table tbody tr td span {
  display: block;
  font-weight: 700;
  color: #ed3535;
}
.recruit table tbody tr td span:not(:first-child) {
  margin-top: 8px;
  display: block;
}
.recruit table tbody tr td p + p {
  margin-top: 10px;
}
.recruit table tbody tr td a {
  color: #2c46c6;
}
.recruit .welfare1 {
  margin-bottom: 20px;
}
.recruit .welfare1 li {
  display: flex;
  align-items: center;
  height: 67px;
  background-color: #f8f8f8;
  border-radius: 8px;
}
.recruit .welfare1 li:not(:first-child) {
  margin-top: 10px;
}
.recruit .welfare1 li .ico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 76px;
}
.recruit .welfare1 li .ico img.ico1 {
  width: 32px;
}
.recruit .welfare1 li .ico img.ico2 {
  width: 28px;
}
.recruit .welfare1 li .ico img.ico3 {
  height: 28px;
}
.recruit .welfare1 li .ico img.ico4 {
  width: 28px;
}
.recruit .welfare1 li .ico img.ico5 {
  width: 25px;
}
.recruit .welfare1 li .ico img.ico6 {
  height: 26px;
}
.recruit .welfare1 li .ico img.ico7 {
  height: 30px;
}
.recruit .welfare1 li .ico img.ico8 {
  height: 27px;
}
.recruit .welfare1 li .con {
  line-height: 13px;
}
.recruit .welfare1 li .con p {
  font-weight: 700;
  font-size: 13px;
  line-height: 18px;
}
.recruit .welfare1 li .con p span {
  color: #ed3535;
}
.recruit .welfare1 li .con > span {
  display: block;
  margin-top: 3px;
  font-size: 10px;
  color: #999;
}
.recruit .welfare1 li.type1 {
  height: 90px;
  padding: 0 3px;
  background-color: #fef3f3;
}
.recruit .welfare1 li.type1 .ico {
  width: 81px;
}
.recruit .welfare1 li.type1 .ico img {
  width: 49px;
}
.recruit .welfare1 li.type1 .con > span {
  color: #333;
}
.recruit .welfare2 {
  margin-bottom: 20px;
}
.recruit .welfare2 li {
  display: flex;
  align-items: center;
  height: 90px;
  padding: 0 20px;
  background-color: #e7eaff;
  border-radius: 12px;
}
.recruit .welfare2 li:not(:first-child) {
  margin-top: 10px;
}
.recruit .welfare2 li .ico {
  margin-right: 20px;
}
.recruit .welfare2 li .ico img {
  width: 49px;
}
.recruit .welfare2 li .con p {
  font-size: 13px;
}
.recruit .step {
  margin-bottom: 20px;
  text-align: center;
}
.recruit .step img.v1 {
  width: 320px;
}
.recruit .step img.v2 {
  height: 214px;
}
.recruit .step p {
  margin-top: 15px;
  font-size: 11px;
  color: #999;
}
.recruit > a {
  display: block;
  width: 180px;
  height: 44px;
  margin: 30px auto 0 auto;
  background-color: #ed3535;
  border-radius: 7px;
  font-weight: 700;
  color: #fff;
  line-height: 44px;
  text-align: center;
}
.recruit_box {
  padding: 20px 0;
  background-color: #f3f3f3;
  font-weight: 700;
  font-size: 16px;
  text-align: center;
}
.recruit_box img {
  width: 61px;
  margin: 0 3px;
}
.recruit_box a {
  display: block;
  width: 180px;
  height: 44px;
  margin: 15px auto 0 auto;
  background-color: #ed3535;
  border-radius: 7px;
  font-weight: 700;
  color: #fff;
  line-height: 44px;
  text-align: center;
}

/* add 250709 */
.recruit_combine_wrap {
  margin: 0 auto;
  max-width: 100%;
}
.recruit_combine_wrap .benefition {
  max-width: 100%;
}
.recruit_combine_wrap .detail {
  margin-top: 29px;
  padding: 0 10px;
}
.recruit_combine_wrap .detail > .tit {
  font-size: 25px;
  padding-bottom: 21px;
  border-bottom: 1px solid #ececec;
  font-weight: 600;
  color: #000;
}
.recruit_combine_wrap .detail table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  margin-top: 21px;
  border-top: 2px solid #5a5a5a;
  background: #fff;
}
.recruit_combine_wrap .detail table th,
.recruit_combine_wrap .detail table td {
  border: 1px solid #ddd;
  word-break: break-word;
  vertical-align: middle;
}
.recruit_combine_wrap .detail table th:first-child,
.recruit_combine_wrap .detail table td:first-child {
  border-left: 0;
}
.recruit_combine_wrap .detail table th:last-child,
.recruit_combine_wrap .detail table td:last-child {
  border-right: 0;
}
.recruit_combine_wrap .detail table th {
  background-color: #f8f8f8;
  font-size: 15px;
  color: #000;
  text-align: center;
  height: 50px;
}
.recruit_combine_wrap .detail table td {
  padding: 14px 20px;
}
.recruit_combine_wrap .detail table td.tit {
  font-size: 13px;
  color: #1b1b1b;
  font-weight: 600;
  text-align: center;
}
.recruit_combine_wrap .gray_box {
  background: 0;
  padding: 0 10px;
  flex-direction: column;
  gap: 20px;
  display: flex;
  color: #666;
  margin-top: 37px;
}
.recruit_combine_wrap .gray_box dl {
  width: 100%;
}
.recruit_combine_wrap .gray_box dl dt {
  font-size: 13px;
  margin-bottom: 5px;
  color: #111;
  font-weight: 600;
}
.recruit_combine_wrap .gray_box dl dd {
  font-size: 10px;
  color: #111;
  line-height: 1.8;
}
.recruit_combine_wrap .detail table h3 {
  font-size: 12px;
  color: #111;
}
.recruit_combine_wrap .detail table td b {
  font-size: 12px;
  color: #111;
  line-height: 1.6;
}
.recruit_combine_wrap .detail table ul {
  gap: 3px;
  margin: 5px 0 14px;
  display: flex;
  flex-direction: column;
}
.recruit_combine_wrap .detail table ul li {
  font-size: 12px;
}
.recruit_combine_wrap .detail table td strong {
  font-size: 15px;
  margin-bottom: 12px;
  color: #111;
  display: block;
}
.recruit_combine_wrap .detail table td small {
  font-size: 9px;
  display: block;
}
.recruit_combine_wrap .process {
  margin-top: 51px;
  border-top: 0;
  padding: 0 41px;
  display: block;
  text-align: center;
}
.recruit_combine_wrap .process .img {
  max-width: 100%;
}
/* //add 250709 */

/* 이용약관, 개인정보처리방침 */
.privacy {
  padding: 0 17px 35px;
  color: #666;
}
.privacy h3 {
  margin-bottom: 15px;
  font-size: 13px;
  font-weight: 700;
  color: #1b1b1b;
}
.privacy p {
  font-size: 10px;
}
.privacy p + h3 {
  margin-top: 15px;
}
.privacy p strong {
  font-weight: 700;
  color: #ed3535;
}
.privacy ol > li {
  font-weight: 700;
  font-size: 10px;
}
.privacy ol > li:not(:last-child) {
  margin-bottom: 12px;
}
.privacy ol > li > ul {
  margin-top: 10px;
  font-weight: 400;
}
.privacy table {
  width: 100%;
  table-layout: fixed;
  margin: 10px 0;
  text-align: center;
}
.privacy table th {
  padding: 10px;
  font-weight: 700;
  font-size: 12px !important;
}
.privacy table td {
  padding: 10px;
  font-size: 12px !important;
}
.privacy .view {
  text-align: center;
}
.privacy .view a {
  display: inline-block;
  position: relative;
  margin-top: 30px;
  padding-right: 8px;
  background: url(/images/sub/view_link_arr.gif) right 0px center no-repeat;
  background-size: 3px auto;
  font-size: 11px;
  color: #97999b;
}
.privacy .view a:before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #97999b;
}

.clause_tit {
  position: relative;
  padding: 5px 10px 0;
}
.clause_tit h3 {
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
}
.clause_tit .btn_view {
  position: absolute;
  right: 0;
  top: -5px;
  border: 1px solid #000;
  height: 35px;
  line-height: 35px;
  font-size: 13px;
  font-weight: 600;
  padding: 0 20px;
  color: #333;
  background: #fff;
  border-radius: 3px;
}
.clause_s_box {
  position: relative;
  border: 1px solid #333;
}
.clause_s_box > .inner {
  position: relative;
  max-height: 250px;
  overflow: auto;
}
.clause_s_box:after {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 98%;
  height: 50px;
  background: linear-gradient(
    to bottom,
    rgb(255, 255, 255, 0.14),
    rgb(255 255 255)
  );
  content: "";
}

/* btn */
.btn_area {
  display: flex;
  margin-top: 20px;
}
.btn_area.center {
  justify-content: center;
}
.btn_area.left {
  justify-content: start;
}
.btn_area.right {
  justify-content: end;
}
.btn_area a {
  display: inline-block;
}
.btn_area a:nth-child(2),
.btn_area a + input {
  margin-left: 5px;
}
.btn_area a + button {
  margin-left: 5px;
}
.btn_area .cancel1 {
  width: 98px;
  height: 44px;
  background-color: #97999b;
  border: none;
  border-radius: 4px;
  font-weight: 700;
  color: #fff;
  line-height: 44px;
  text-align: center;
}
.btn_area .mod1 {
  width: 98px;
  height: 44px !important;
  background-color: #ed3535;
  border: 1px solid #ed3535 !important;
  border-radius: 4px;
  font-weight: 700;
  font-size: 14px;
  color: #fff;
  text-align: center;
  cursor: pointer;
  line-height: 42px;
}
.btn_area .request {
  width: 113px;
  height: 44px;
  background-color: #1c1b32;
  border-radius: 5px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 44px;
}
.btn_area .order {
  width: 113px;
  height: 44px;
  margin-left: 5px;
  background-color: #ed3535;
  border-radius: 5px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 44px;
}
.sch_btn1 {
  display: inline-block;
  width: 56px;
  height: 30px;
  background-color: #fff;
  border: 1px solid #ed3535;
  border-radius: 4px;
  font-weight: 700;
  font-size: 11px;
  color: #ed3535;
  line-height: 28px;
} /* 나의 공부방 검색버튼 */
.del1 {
  display: inline-block;
  width: 63px;
  height: 30px;
  border: 1px solid #666;
  border-radius: 4px;
  font-weight: 700;
  font-size: 12px;
  color: #666;
  line-height: 28px;
  text-align: center;
}
.send1 {
  display: inline-block;
  min-width: 63px;
  height: 30px;
  padding: 0 5px;
  border: 1px solid #ed3535;
  border-radius: 5px;
  font-weight: 700;
  font-size: 12px;
  color: #ed3535;
  line-height: 28px;
  text-align: center;
}
.join_btn {
  display: block;
  width: calc(100% - 20px);
  height: 43px;
  margin: 0 auto;
  background-color: #ed3535;
  border-radius: 5px;
  font-weight: 700;
  font-size: 19px;
  line-height: 43px;
  color: #fff;
  text-align: center;
}

/* 온리원 학습 체험관(list:메인 리스트, sch:검색창, result:검색결과 없음, popup:컨텐츠 팝업) */
.experienceHall.list {
  padding: 16px 10px;
  background: #fafeff;
}
.experienceHall.list .section {
  overflow: hidden;
  border: 1px solid #eee;
  border-radius: 5px;
}
.experienceHall.list .section:not(:first-child) {
  margin-top: 16px;
}
.experienceHall.list .section h3 {
  height: 34px;
  padding-left: 15px;
  background: #edf2fa;
  font-weight: 700;
  font-size: 13px;
  line-height: 34px;
}
.experienceHall.list .section ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 0;
  padding: 15px;
}
.experienceHall.list .section ul li {
  width: 50%;
}
.experienceHall.list .section ul li a {
  display: flex;
  align-items: center;
  gap: 5px;
  position: relative;
  height: 28px;
  font-size: 13px;
}
.experienceHall.list .section ul li a img {
  width: 24px;
}
.experienceHall.list .section ul li a p {
  padding-right: 12px;
  background: url(/images/sub/experienceHall/link_arr01.png) right center
    no-repeat;
  background-size: 3px 6px;
}
.experienceHall.list .section ul li a p b {
  display: block;
  margin-top: -3px;
  font-weight: 400;
  font-size: 10px;
}
.experienceHall.sch .sch_wrap {
  display: flex;
  align-items: center;
  margin: 0 0 16px -11px;
  background: #fff;
}
.experienceHall.sch .sch_wrap .back {
  display: block;
  padding: 10px 8px;
}
.experienceHall.sch .sch_wrap .back img {
  width: 7px;
  vertical-align: middle;
}
.experienceHall.sch .sch_wrap .insert {
  position: relative;
  width: calc(100% - 23px);
}
.experienceHall.sch .sch_wrap .insert.insert:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 12px;
  transform: translateY(-50%);
  width: 15px;
  height: 15px;
  background: url(/images/sub/experienceHall/sch_btn.png) left center no-repeat;
  background-size: 100%;
}
.experienceHall.sch .sch_wrap .insert input {
  width: 100%;
  height: 41px;
  padding: 0 42px 0 35px;
  border: 1px solid #ed3535;
  border-radius: 20px;
  font-size: 15px;
}
.experienceHall.sch .sch_wrap .insert input::placeholder {
  font-weight: 400;
  font-family: "Noto Sans KR";
  font-size: 13px;
  color: #acacac;
}
.experienceHall.sch .sch_wrap .insert .del {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  padding: 9px 11px;
}
.experienceHall.sch .sch_wrap .insert .del img {
  width: 22px;
}
.experienceHall.sch {
  padding: 13px 21px 0;
}
.experienceHall.sch .section h3 {
  height: 31px;
  margin-bottom: 7px;
  padding: 10px;
  background: #f6f7fa;
  font-weight: 700;
  font-size: 13px;
  color: #000;
  line-height: 1;
}
.experienceHall.sch .section + .section {
  margin-top: 15px;
}
.experienceHall.sch .section ul li {
  position: relative;
}
.experienceHall.sch .section ul li:not(:last-child):before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  width: calc(100% - 37px);
  height: 1px;
  background: #f5f5f5;
}
.experienceHall.sch .section ul li a {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 11px 0 11px 4px;
  background: url(/images/sub/experienceHall/link_arr02.png) right center
    no-repeat;
  background-size: auto 14px;
}
.experienceHall.sch .section ul li a img {
  width: 24px;
}
.experienceHall.sch .section ul li a p {
  font-weight: 500;
  font-size: 14px;
}
.experienceHall.sch .section ul li a p span {
  display: block;
  margin-top: -2px;
  font-size: 10px;
  color: #a0a0a0;
}
.experienceHall.sch .section ul li a p b {
  font-weight: 500;
  color: #ed3535;
}
.experienceHall .result {
  display: flex;
  justify-content: center;
  height: calc(100vh - 125px);
  padding: 59px 0 0;
  text-align: center;
}
.experienceHall .result p {
  padding-top: 34px;
  margin-top: 18px;
  background: url(/images/sub/experienceHall/schResult_ico.png) center top
    no-repeat;
  background-size: 23px auto;
  font-weight: 500;
  font-size: 18px;
}
.experienceHall .result p span {
  display: block;
  margin-top: 12px;
  font-weight: 400;
  font-size: 14px;
  color: #535353;
}
.experienceHall .top_btn {
  position: fixed;
  bottom: 0;
  right: 14px;
  box-shadow: 0 3px 7px 0 rgb(0 0 0 / 15%);
  border-radius: 50%;
  opacity: 0;
  transition: all 0.5s;
}
.experienceHall .top_btn.active {
  bottom: 9.5%;
  opacity: 1;
}
.experienceHall .top_btn img {
  width: 32px;
}
.experienceHall_popup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: #fff;
  z-index: 9999;
}
.experienceHall_popup .header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 55px;
  padding-left: 20px;
  background: #ed3535 url(/images/sub/sub_nav_bg.png) center 0 no-repeat;
  background-size: 66%;
  z-index: 110;
  transition: all 0.5s;
}
.experienceHall_popup .header h1 {
  position: relative;
  margin-top: -3px;
  font-weight: 900;
  font-size: 18px;
  color: #fff;
}
.experienceHall_popup .header .close {
  width: 36px;
  height: 36px;
}
.experienceHall_popup .header .close img {
  width: 18px;
}
.experienceHall_popup .con {
  padding-top: 15%;
  text-align: center;
}
.experienceHall_popup .con h2 {
  display: inline-block;
  min-width: 181px;
  height: 42px;
  padding: 0 20px;
  margin: 0 auto;
  background: #fe5050;
  border-radius: 50px;
  font-family: "GmarketSansBold";
  font-size: 23px;
  color: #fff;
  line-height: 48px;
}
.experienceHall_popup .con p {
  margin-top: 12px;
  font-weight: 500;
  font-size: 13px;
  line-height: 17px;
}
.experienceHall_popup .con p span {
  color: #f40f0f;
}
.experienceHall_popup .con .video {
  overflow: hidden;
  position: relative;
  padding-top: 50.25%;
  margin: 20px 20px 0;
  border: 10px solid #000;
  border-radius: 10px;
}
.experienceHall_popup .con .video video,
.experienceHall_popup .con .video img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
.experienceHall_popup .con .video img {
  height: 100%;
}
.experienceHall_popup .con .slide {
  position: relative;
  margin-top: 18px;
  padding: 20px 20px 53px;
  background: #eaedf3;
}
.experienceHall_popup .con .slide .swiper-container {
  padding-bottom: 15px;
}
.experienceHall_popup .con .slide .swiper-container .swiper-slide {
  opacity: 0 !important;
}
.experienceHall_popup .con .slide .swiper-container .swiper-slide-active {
  opacity: 1 !important;
}
.experienceHall_popup .con .slide .swiper-container .swiper-slide h3 {
  font-weight: 700;
  font-size: 15px;
}
.experienceHall_popup .con .slide .swiper-container .swiper-slide p {
  margin: 3px 0 13px;
  font-size: 12px;
  color: #3a3a3a;
}
.experienceHall_popup .con .slide .swiper-container .swiper-slide .thumb {
  border: 10px solid #000;
  border-radius: 10px;
}
.experienceHall_popup .con .slide .swiper-container .swiper-slide .thumb img {
  width: 100%;
}
.experienceHall_popup .con .slide .swiper-button-prev {
  left: 7px;
  width: 22px;
  height: 60px;
  background: url(/images/sub/experienceHall/slide_prev_arr.png) 0 0 no-repeat;
  background-size: 100%;
}
.experienceHall_popup .con .slide .swiper-button-next {
  right: 7px;
  width: 22px;
  height: 60px;
  background: url(/images/sub/experienceHall/slide_next_arr.png) 0 0 no-repeat;
  background-size: 100%;
}
.experienceHall_popup .con .slide .swiper-button-prev:after,
.experienceHall_popup .con .slide .swiper-button-next:after {
  display: none;
}
.experienceHall_popup .con .slide .swiper-button-disabled {
  display: none;
}
.experienceHall_popup .con .slide .swiper-pagination {
  bottom: -5px;
  width: 100%;
}
.experienceHall_popup .con .slide .swiper-pagination span {
  width: 8px;
  height: 8px;
  margin: 0 4px;
  background: #bbbec2;
}
.experienceHall_popup
  .con
  .slide
  .swiper-pagination
  span.swiper-pagination-bullet-active {
  background: #fe5050;
}

/* animation */
/* 깜박거림 */
@keyframes blinker1 {
  50% {
    opacity: 0;
  }
}

/* 축소 확대 애니메이션 */
@keyframes scale {
  50% {
    transform: scale(0.9);
  }
}

/* 돌아가는 애니메이션 */
@keyframes rotate_image {
  100% {
    transform: rotate(360deg);
  }
}

/* 오른쪽으로 흐르는 애니메이션 */
@keyframes rollingLeft1 {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(100%);
  }
  50.01% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes rollingLeft2 {
  0% {
    transform: translateX(-200%);
  }
  100% {
    transform: translateX(0);
  }
}

/* 룰렛 애니메이션 */
@keyframes slotsUP1_1 {
  0% {
    background-position: 0 0;
  }
  1% {
    filter: blur(2px);
  }
  50% {
    background-position: 0 171%;
  }
  51% {
    filter: blur(0);
    background-position: 0 171%;
  }
  100% {
    background-position: 0 171%;
  }
}

@keyframes slotsUP1_2 {
  0% {
    background-position: 0 0;
  }
  1% {
    filter: blur(2px);
  }
  50% {
    background-position: 0 150%;
  }
  51% {
    filter: blur(0);
    background-position: 0 150%;
  }
  100% {
    background-position: 0 150%;
  }
}

@keyframes slotsDown_1 {
  0% {
    background-position: 0 -100%;
  }
  50% {
    background-position: 0 -225%;
    filter: blur(2px);
  }
  51% {
    filter: blur(0);
  }
  90% {
    background-position: 0 -225%;
  }
  100% {
    background-position: 0 -225%;
  }
}

@keyframes slotsUP2_1 {
  0% {
    background-position: 0 0;
  }
  1% {
    filter: blur(2px);
  }
  50% {
    background-position: 0 196%;
  }
  51% {
    filter: blur(0);
    background-position: 0 196%;
  }
  100% {
    background-position: 0 196%;
  }
}

@keyframes slotsUP2_2 {
  0% {
    background-position: 0 0;
  }
  1% {
    filter: blur(2px);
  }
  50% {
    background-position: 0 125%;
  }
  51% {
    filter: blur(0);
    background-position: 0 125%;
  }
  100% {
    background-position: 0 125%;
  }
}

@keyframes slotsDown_2 {
  0% {
    background-position: 0 -100%;
  }
  50% {
    background-position: 0 -249%;
    filter: blur(2px);
  }
  51% {
    filter: blur(0);
  }
  90% {
    background-position: 0 -249%;
  }
  100% {
    background-position: 0 -249%;
  }
}

@keyframes arrow {
  0% {
    transform: translateY(0);
  }
  10% {
    transform: translateX(5px);
  }
  20% {
    transform: translateX(0);
  }
  30% {
    transform: translateX(5px);
  }
  40% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(0);
  }
}

/*-------------------------------------------- 아래는 기존 commonSub.css, common.css에 있던 스타일 --------------------------------------------*/

/* 공통 스타일 */
.align {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.fleft {
  float: left;
}
.fright {
  float: right;
}
.fclear {
  clear: both;
}
.fgroup > li {
  float: left;
  text-align: center;
}
.fgroup:after {
  content: " ";
  display: block;
  clear: both;
}

select.select {
  vertical-align: top;
  color: #666 !important;
  width: 100%;
  height: 35px;
  padding: 0px 28px 0px 5px;
  white-space: nowrap;
  text-overflow: ellipsis;
  border: 1px solid #dfdfdf;
  background: #fff url(/images/commonSub/bg_select.png) no-repeat right center;
  background-size: 33px;
  outline: none;
  outline: 0px;
  appearance: none;
  box-sizing: border-box;
  border-radius: 0 !important;
  color: #010101;
  font-size: 12px;
  transition: all 0.2s ease-out;
}
select.select:focus {
  border: 1px solid #3a7bd3;
  outline-style: none;
}

.bold {
  font-weight: bold;
}
.normal {
  font-weight: normal !important;
}
.ls-1 {
  letter-spacing: -1px;
}
.ls-2 {
  letter-spacing: -2px;
}
small {
  font: 11px Malgun Gothic;
}
small.eng {
  font: bold 9px/1.5em Verdana;
  letter-spacing: 0;
}

/* align */
.tleft {
  text-align: left !important;
}
.tright {
  text-align: right !important;
}
.tcenter {
  text-align: center !important;
}
.tjustify {
  text-align: justify !important;
}
.breakWord {
  text-align: left !important;
  word-break: keep-all;
  word-wrap: break-word;
}
.bcenter {
  margin-left: auto;
  margin-right: auto;
}
.nowrap {
  white-space: nowrap;
  display: inline-block;
}

/* display */
.d_i {
  display: inline-block;
}
.d_b {
  display: block;
}
.m_d_b {
  display: block;
} /* media */
.vmid_all * {
  vertical-align: middle !important;
}
.d_i_all * {
  display: inline-block !important;
}
.vtop {
  vertical-align: top;
}
.vbottom {
  vertical-align: bottom;
}

/* box style */
.group1 {
  padding: 1em;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ddd;
  text-align: center;
}
.group2 {
  padding: 1em;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ddd;
  text-align: left;
}
.group2 h4:first-child {
  margin-top: 0;
}

.selectGroup {
  padding: 1em;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ddd;
}
.selectGroup li {
  float: left;
}
.selectGroup li div {
  padding: 0 0.125em;
}
.selectGroup li div select {
  width: 100%;
}
.selectGroup:after {
  content: " ";
  display: block;
  clear: both;
}

.box01 {
  padding: 0.5em 1em;
  background: #f4f4f4;
  border-bottom: 1px solid #ddd;
  box-shadow: inset 0 -1px 0 #fff;
  font-size: 12px;
}
.box02 {
  padding: 1em;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ddd;
  box-shadow: inset 0 -1px 1px #fff;
  background: #47f524 linear-gradient(top, #ffffff, #fafafa);
  background: #47f524 -ms-linear-gradient(top, #ffffff, #fafafa);
  background: #47f524 -moz-linear-gradient(top, #ffffff, #fafafa);
  background: #47f524 -webkit-gradient(
      linear,
      0% 0%,
      0% 100%,
      from(#ffffff),
      to(#fafafa)
    );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#ffffff, endColorStr=#fafafa);
}
.box03 {
  padding: 1em;
  border: 1px #dddddd solid;
  background: #f5f5f5;
}

/* ico style */
[class^="icn_"] {
  width: 20px;
  height: 20px;
  vertical-align: top;
  background-image: url("../../images/common/icons.png");
  background-size: 220px 100%;
  background-repeat: no-repeat;
  display: inline-block;
}
.icn_check {
  background-position: 0 50%;
}
.icn_close {
  background-position: -20px 50%;
}
.icn_top {
  background-position: -40px 50%;
}
.icn_up {
  background-position: -60px 50%;
}
.icn_down {
  background-position: -80px 50%;
}
.icn_left {
  background-position: -100px 50%;
}
.icn_right {
  background-position: -120px 50%;
}
.icn_prev {
  /* background-position:-140px 50%; */
  background: url(/images/sub/arrow-left_white.png) no-repeat 2px center;
  background-size: 30px;
  width: 30px;
  height: 30px;
}
.icn_next {
  /* background-position:-160px 50%; */
  background: url(/images/sub/arrow-right_white.png) no-repeat -2px center;
  background-size: 30px;
  width: 30px;
  height: 30px;
}
.icn_play {
  background-position: -180px 50%;
}
.icn_vod {
  background-position: -200px 50%;
}

/* 스와이프 메뉴 */
.flexslider.fx01 {
  position: fixed !important;
  top: 110px;
  left: 0;
  width: 100%;
  z-index: 3;
}

/* tab(02:최근 수강한 강좌, 03,04:나의공부방, 08:선생님 상세, 031:내신완성, 99:내신완성) */
.tab02 {
  font-weight: bold;
  line-height: 20px;
  overflow: hidden;
}
.tab02 ul {
  padding: 0 15px;
  background: #eee;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ddd;
}
.tab02 ul li {
  float: left;
  background: url("../../images/common/line01_v16.png") 0 50% no-repeat;
}
.tab02 ul li a {
  padding: 10px 10px;
  color: #333;
  text-align: center;
  white-space: nowrap;
  display: block;
}
.tab02 ul li.on a {
  position: relative;
  top: 5px;
  margin-right: -2px;
  padding-top: 5px;
  background: #fff;
  border: 1px solid #ddd;
  z-index: 1;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  box-shadow: inset 2px 2px 3px #eee;
}
.tab02 ul li:first-child {
  background: none;
}
.tab02 ul:after {
  content: " ";
  display: block;
  clear: both;
}
.tab03Wrap {
  overflow: hidden;
}
.tab03 {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-bottom: 1px solid #e2e2e2;
}
.tab03 li:first-child {
  border-left: none;
}
.tab03 li {
  display: table-cell;
  vertical-align: middle;
  border-left: 1px solid #e2e2e2;
  width: 100%;
  background: #eee;
  text-align: center;
}
.tab03 li a {
  display: block;
  padding: 15px 10px;
  color: #888;
  font-size: 12px;
}
.tab03 li.on {
  background: #666;
}
.tab03 li.on a {
  color: #fff;
}
.tab04 {
  overflow: hidden;
}
.tab04 li {
  float: left;
  width: calc(100% / 3);
  text-align: center;
  padding: 0 0 5px 5px;
  display: table;
}
.tab04 li:nth-child(3n + 1) {
  padding: 0 0 5px 0;
}
.tab04 li a {
  height: 48px;
  width: 100%;
  display: inline-block;
  display: table-cell;
  vertical-align: middle;
  font-size: 13px;
  padding: 8px 0;
  border: 1px solid #e2e2e2;
  background: #fff;
  color: #888;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 1.2;
}
.tab04 li.on a {
  border: 1px solid #2c93d0;
  background: #e0f2ff;
  color: #2c93d0;
}
.tab08 {
  overflow: hidden;
  width: 102%;
}
.tab08 li {
  float: left;
  display: inline-block;
  position: relative;
  cursor: pointer;
  z-index: 1;
  text-align: center;
  border-top: 1px solid #dbdbdb;
  border-left: 1px solid #dbdbdb;
  border-bottom: 1px solid #dbdbdb;
  padding: 10px 8px;
  color: #888;
  background: #fff;
  margin: 0 0 0 -1px;
  line-height: 1.2;
  display: -webkit-box;
  display: -moz-box;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
}
.tab08 li:first-child {
  border-left: none;
}
.tab08 li a {
  display: inline-block;
  width: 100%;
  font-size: 13px;
  color: #888;
}
.tab08 li.on {
  font-weight: bold;
  color: #333;
  z-index: 2;
  background: #e0f2ff;
  border-bottom: 1px solid #e0f2ff;
  border-top: 1px solid #dbdbdb;
  border-left: 1px solid #dbdbdb;
  border-right: 1px solid #dbdbdb;
}
.tab08 li.on a {
  color: #007dc6;
}
.tab031Wrap {
  background: #eee;
}
.tab031Wrap:after {
  content: "";
  display: block;
  clear: both;
}
.tab031 li {
  display: table;
  float: left;
  width: calc(100% / 5);
  text-align: center;
}
.tab031 li a {
  width: 100%;
  display: table-cell;
  vertical-align: middle;
  padding: 8px 5px;
  border: 1px solid #e2e2e2;
  border-left: none;
  background: #eee;
  color: #666;
  box-sizing: border-box;
}
.tab031 li.on a {
  border: 1px solid #7a7a7a;
  background: #666;
  font-weight: 500;
  color: #fff;
}
.tab99 {
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
}
.tab99 li {
  flex: 1 1 0;
  z-index: 999;
  display: inline-block;
  cursor: pointer;
  z-index: 1;
  text-align: center;
  border-top: 1px solid #dcdcdc;
  border-left: 1px solid #dcdcdc;
  border-bottom: 1px solid #888;
  padding: 10px 8px;
  color: #888;
  background: #eee;
  margin: 0 0 0 0;
  line-height: 1.2;
  text-align: center;
}
.tab99 li:first-child.on {
  border-left: none;
}
.tab99 li:last-child.on {
  border-right: none;
}
.tab99 li a {
  display: inline-block;
  width: 100%;
  font-size: 13px;
  color: #888;
}
.tab99 li.on {
  font-weight: bold;
  color: #333;
  z-index: 2;
  padding: 10px 8px 11px;
  background: #fff;
  border-bottom: none;
  border-top: 1px solid #888;
  border-left: 1px solid #888;
  border-right: 1px solid #888;
}
.tab99 li.on a {
  color: #333;
}

/* 내신완성 탭 박스 */
.cate_open.fixed {
  position: fixed;
  z-index: 2;
}
.cate_open.jsTab {
  top: -132px !important;
}
.cate_open {
  width: 100%;
  transition: all 0.5s;
}
.cate_open .box {
  background: #fff;
}
/* 내신완성 탭 박스 - 펼쳐졌을때 */
.menuOpenWrap {
  border-top: 1px solid #888;
  overflow: hidden;
  display: none;
  cursor: pointer;
}
.menuOpenWrap .box,
.menuOpenWrap .box .arrow {
  background: url(/images/commonSub/menuOpenWrap.png) no-repeat;
  background-size: 100px;
}
.menuOpenWrap .box {
  background-position: 0 -28px;
  width: 100px;
  height: 24px;
  text-align: center;
  margin: 0 auto;
}
.menuOpenWrap .box {
  vertical-align: top;
  padding: 3px 0 0;
  display: block;
}
.menuOpenWrap .box > div {
  color: #fff;
  font-size: 12px;
  vertical-align: top;
  display: inline-block;
  letter-spacing: 0;
}
.menuOpenWrap .box .arrow {
  display: inline-block;
  background-position: -86px 0;
  width: 14px;
  height: 10px;
  margin: 0 0 0 5px;
}
.menuOpenWrap.on .box .arrow {
  background-position: -86px -12px;
}

/* 내신완성 셀렉트 박스 */
.select_w {
  display: table;
  width: 100%;
  border-spacing: 2px;
  text-align: center;
}
.select_w > div {
  display: table-cell;
}

/* 리스트(01:썸네일 게시판, 02:상세페이지 상단 ,03:,) */
.list_st01 {
  border-top: 1px solid #e1e1e1;
  position: relative;
}
.list_st01 .item {
  overflow: hidden;
  padding: 15px 14px;
  border-bottom: 1px solid #e1e1e1;
  background: url(/images/commonSub/renew/r_arrow.png) no-repeat 97% center;
  background-size: 7px auto;
}
.list_st01 .thumb {
  float: left;
  margin: 0 15px 0 0;
  width: 80px;
  height: 80px;
  text-align: center;
}
.list_st01 .section_left {
  position: relative;
  float: right;
  width: 70%;
  width: calc(100% - 100px);
  padding: 0 30px 0 0;
}
.list_st02 {
  border-top: 1px solid #e1e1e1;
  padding: 15px 14px;
}
.list_st02:after {
  content: "";
  display: block;
  clear: both;
}
.list_st02 .thumb {
  float: left;
  margin: 0 15px 0 0;
  width: 80px;
  height: 80px;
  text-align: center;
}
.list_st02 .section_left {
  float: left;
  width: 48%;
  width: calc(100% - 150px);
  position: relative;
  padding: 0 0 0 0;
}
.list_st02 .section_left .name {
  display: inline-flex;
}
.list_st02 .section_right {
  float: right;
}
.list_st02 .section_right .record {
  border: 1px solid #cc3344;
  color: #cc3344;
  font-size: 11px;
  text-align: center;
  width: 45px;
  height: 18px;
  margin: 0 0 2px;
}
.list_st02 .section_right .btnSns {
  border: 1px solid #e5e5e5;
  text-align: center;
  width: 45px;
  height: 45px;
  color: #888;
  font-size: 11px;
}
.list_st02 .section_right .btnSns .sns {
  background: url(/images/commonSub/bgSns.png) no-repeat;
  background-size: 125px;
}
.list_st02 .section_right .snsBox .close,
.list_st02 .section_right .snsBox .snsBtn a {
  background: url(/images/commonSub/bgSns1.png) no-repeat;
  background-size: 260%;
}
.list_st02 .section_right .btnSns .sns {
  display: block;
  background-position: 2px 0;
  width: 16px;
  height: 17px;
  margin: 8px auto 0;
}
.list_st02 .section_right .snsBoxWrap {
  display: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 99;
  border: 1px solid #888;
  background: #fff;
  transition: all 0.5s ease-out;
}
.list_st02 .section_right .snsBoxWrap.on {
  display: block;
}
.list_st02 .section_right .snsBox {
  position: relative;
  padding: 10px;
}
.list_st02 .section_right .snsBox .snsBtn {
  display: flex;
  gap: 5px;
  overflow: hidden;
  margin-top: 10px;
  text-align: center;
}
.list_st02 .section_right .snsBox .snsBtn a {
  display: inline-block;
  width: 35px;
  height: 35px;
  text-indent: -9999em;
}
.list_st02 .section_right .snsBox .snsBtn a:nth-child(1) {
  background-position: 0 -39px;
}
.list_st02 .section_right .snsBox .snsBtn a:nth-child(2) {
  background-position: 0 -82px;
}
.list_st02 .section_right .snsBox .snsBtn a:nth-child(3) {
  background-position: -42px -82px;
}
.list_st02 .section_right .snsBox .close {
  display: block;
  position: absolute;
  right: 0;
  top: 5px;
  width: 30px;
  height: 30px;
  text-indent: -9999em;
  background-position: -74px 4px;
  background-size: 100px;
}
/* list_st01,list_st02 공통사용 */
.list_st01 .thumb,
.list_st02 .thumb {
  position: relative;
  width: 80px;
  height: 80px;
  margin: 0 5px 0 0;
  display: inline-block;
  overflow: hidden;
}
.list_st02 .thumb {
  margin: 0 15px 0 0 !important;
}
.list_st01 .thumb img,
.list_st02 .thumb img {
  position: relative;
  top: 0px;
  left: -38px;
  width: 160px;
  height: 120px;
}
.list_st01 .thumb img:after,
.list_st02 .thumb img:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 80px;
  height: 80px;
  display: block;
  border: none;
  content: " ";
}
/* 단강몰 list */
#LectureList li a .section_left .name span {
  color: #666;
}
#LectureList li a .section_left .tit {
  margin-top: 2px;
  font-weight: 700;
  font-size: 16px;
}
#LectureList li a .section_left .info {
  margin-top: 2px;
  color: #666;
}
#LectureList li a .section_left .info div {
  display: inline-block;
  padding: 3px 5px;
  margin-top: 2px;
  background: #cc3344;
  color: #666;
}
#LectureList li a .section_left .info div a {
  color: #fff;
}
#LectureList li a .section_left .info span {
  color: #cc3344;
}
/* 교재몰 list */
#bookList li a .section_left .tit {
  margin-top: 2px;
  font-weight: 700;
  font-size: 16px;
}
#bookList li a .section_left .info {
  margin-top: 2px;
  color: #666;
  letter-spacing: -0.8px;
}
#bookList li a .section_left .info span {
  color: #3b7bd3;
}

/* 내신완성 상세페이지 */
.lessonWrap01 ul {
  border-bottom: 1px solid #e1e1e1;
}
.lessonWrap01 li {
  border-top: 1px solid #e1e1e1;
  padding: 20px 0;
}
.lessonWrap01 li > span {
  text-align: left;
  display: inline-block;
  vertical-align: middle;
}
.lessonWrap01 li > span.cat {
  width: 15%;
  padding: 0 0 0 10px;
  font-weight: 500;
  font-size: 16px;
}
.lessonWrap01 li > span.tit {
  width: 43%;
  padding: 0 10px 0 0;
  font-size: 13px;
  color: #666;
}
.lessonWrap01 li > span.price {
  width: 28%;
  text-align: right;
  padding: 0 10px 0 0;
  font-weight: 500;
  font-size: 16px;
  color: #cc3344;
  font-size: 12px;
}
.lessonWrap01 li > span.price span:nth-child(1) {
  font-size: 16px;
}
.lessonWrap01 li > span.price span:not(:nth-child(1)) {
  color: #666;
}
.lessonWrap01 li > span.chk {
  width: 10%;
  text-align: right;
}
.flexslider.fx011 {
  height: 45px;
}
.flexslider.fx011 .flex-direction-nav a {
  height: 100%;
}
.flexslider.fx011 .slides > li {
  line-height: 3.5;
}
.flexslider.fx011 .slides > li a {
  letter-spacing: -1.5px;
}
.total_price {
  padding: 8px;
  font-weight: 700;
  font-size: 16px;
  text-align: right;
}
.total_price .price {
  margin-left: 5px;
  color: #cc3344;
}
.dbCont {
  padding: 10px 0 0;
}
.dbCont * {
  font-size: 12px !important;
} /* 수정될 수 있음 */
.dbCont .box {
  padding: 8px;
}
.dbCont .box * {
  line-height: 2;
}
.tit_line01 {
  font-size: 12px;
  color: #333;
  border-top: 1px solid #d9d9d9;
  border-bottom: 1px solid #888;
  background: #f9f9f9;
  font-weight: bold;
  padding: 8px;
}
.tit_line01 strong {
  position: relative;
  font-size: 12px;
  color: #333;
  padding: 0 8px;
}
.tit_line01 strong:before {
  position: absolute;
  left: 0;
  top: 50%;
  content: "";
  background: #333;
  width: 2px;
  height: 2px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}
.tit_line02 {
  padding: 8px;
  border-top: 1px solid #dcdcdc;
  border-bottom: 1px solid #dcdcdc;
}
.rating1 {
  width: 75px;
  height: 15px;
  background-position: 0 -15px;
  background-repeat: no-repeat;
  overflow: hidden;
  display: inline-block;
}
.rating1 em {
  height: 100%;
  display: block;
}
.rating1,
.rating1 em {
  background-image: url("/images/sub/star1.png");
}
.tabSec select {
  height: 23px;
  appearance: auto;
}

/* 더보기 */
.moreView {
  text-align: center;
  background: #fff;
  border-bottom: 1px solid #d3d2d2;
  padding: 1em 0;
}
.moreView a {
  font-size: 13px;
  color: #888;
  display: block;
  font-weight: bold;
}

/* 나의 공부방, 장바구니 */
.shop_list .item {
  position: relative;
  border-top: 1px solid #e1e1e1;
  padding: 15px 8px;
  overflow: hidden;
  vertical-align: middle;
  width: 100%;
}
.shop_list .item:last-child {
  border-bottom: 1px solid #e1e1e1;
}
.shop_list .item label {
  margin-top: 5px;
  font-size: 11px;
  display: inline-block;
}
.shop_list .item.total {
  border-top: none;
  padding: 8px 8px;
}
.shop_list .item.total input,
.shop_list .item.total label {
  vertical-align: middle;
}
.shop_total {
  border-top: 1px solid #1b1b1b;
  border-bottom: 1px solid #1b1b1b;
  background: #fafafa;
  padding: 10px 0 0;
}
.shop_total .item {
  overflow: hidden;
  color: #333;
  padding: 0 8px;
}
.shop_total .item dt {
  font-size: 11px;
}
.shop_total .item dd strong {
  font-size: 14px;
}
.shop_total .item dd span {
  font-size: 12px;
}
.shop_total .note01 {
  margin-bottom: 10px;
  font-size: 11px;
  color: #666;
  padding: 0 8px;
}
.shop_total .note01 #discountLayer span:first-child {
  padding: 1px 5px;
  background-color: #ed3535;
  font-weight: 700;
  color: #fff;
}
.shop_total .note01 #discountLayer span:last-child {
  font-weight: 700;
  font-size: 13px;
  color: #ed3535;
}
.shop_total .total_item {
  overflow: hidden;
  border-top: 1px solid #d5d5d5;
  padding: 10px 8px;
  background: #fafafa;
  font-size: 16px;
}
.shop_total .total_item dd {
  color: #ed3535;
}

/* 나의 공부방 list(01:최근 수강한 강좌, 04:최근 수강한 강좌 상세) */
.list01 {
  background: #efefef;
}
.list01 > ul > li {
  position: relative;
  background: #fff;
  margin: 0 10px 10px;
  box-shadow: 0px 3px 3px #c3c3c3;
}
.list01 > ul > li:before {
  position: absolute;
  top: 0;
  right: 0;
  width: 21px;
  height: 100%;
  content: " ";
  background: url(/images/commonSub/renew/r_arrow.png) left center no-repeat;
  background-size: 7px auto;
}
.list01 > ul > li.noarr:before {
  background: none;
}
.list01 > ul > li > a {
  position: relative;
  padding: 1.25em 40px 1.25em 1.5em;
  display: block;
  z-index: 1;
}
.list01 > ul > li > a:after {
  content: " ";
  display: block;
  clear: both;
}
.list04 li {
  padding-left: 1em;
  text-indent: -0.8em;
}
.list04 li:before {
  padding-right: 0.3em;
  content: "\2022";
}

.lec1 {
  position: relative;
}
.lec1 .tcPhoto4 {
  float: left;
}
.lec1 h3.lpTitle {
  color: #666;
  font-weight: normal;
  font-size: 0.98em;
}
.lec1 h5 {
  color: #333;
  background: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lec1 h5.ti {
  overflow: visible;
  white-space: normal;
  font-weight: bold;
  font-size: 16px;
}
.lec1 h6 {
  color: #777;
  font-weight: normal;
}
.lec1 p.lpList {
  color: #333;
  font-size: 13px;
  padding: 0.2em 0;
  font-weight: bold;
}
.lec1 p.tName {
  color: #333;
  font-size: 0.9em;
  background: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lec1 .point2 {
  color: #0c448e;
}
.lec1 div {
  margin: 0 0 0 70px;
  line-height: 1.35em;
}
.lec1 div .topRight {
  position: absolute;
  top: 0;
  right: 0;
}
.lec1:after {
  content: " ";
  display: block;
  clear: both;
}
.lec2 p {
  float: left;
  padding-top: 0.3em;
  width: 70px;
  text-align: center;
  font-weight: bold;
  font-size: 12px;
}
.lec2 div {
  margin-left: 80px;
  font-size: 12px;
}
.lpCountNum {
  margin: 0.7em 0 -0.5em;
}
.lpCountNum p {
  padding: 0 1em;
}
.lpCountNum p span {
  color: #d7444e;
}
.lpCountNum p em {
  font-weight: bold;
  font-size: 1.3em;
}
p.lpProgress {
  font-size: 12px;
}
p.lpProgress em {
  font-weight: bold;
  color: #d9444f;
}
p.lpProgress span {
  color: #d9444f;
}
.tcPhoto4 {
  position: relative;
  width: 60px;
  height: 60px;
  margin: 0 5px 0 0;
  display: inline-block;
  overflow: hidden;
}
.tcPhoto4 img {
  position: relative;
  top: 3px;
  left: -30px;
  width: 125px;
}
.tcPhoto4:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 58px;
  height: 58px;
  display: block;
  border: 1px solid #d6d6d6;
  content: " ";
}

/* btnWrap(01:회색버튼, 02:하단픽스 버튼) */
.btnWrap_01 {
  overflow: hidden;
  padding: 10px 0 0;
  margin: 0 8px;
  border-top: 1px solid #e1e1e1;
  text-align: right;
}
.btnWrap_01 .gray {
  background: #888;
}
.btnWrap_01 .blue {
  background: #007dc6;
}
.btnWrap_01 .disabled {
  background: #d9d9d9;
  color: #939393;
  cursor: auto;
}

.btnWrap_01 a {
  display: inline-block;
  color: #fff;
  font-size: 12px;
  text-align: center;
  padding: 8px 20px;
  margin: 0 0 0 2px;
}
.btnWrap_02 {
  overflow: hidden;
  position: fixed;
  bottom: -15%;
  left: 0;
  width: 100%;
  transition: all 0.5s;
  width: 100%;
  z-index: 999;
  background: #eee url(/images/commonSub/arrow03.png) no-repeat 95% center;
  background-size: 21px;
  line-height: 1.2;
}
.btnWrap_02.fixed {
  bottom: 0;
}
.btnWrap_02 a {
  float: left;
  display: inline-block;
  width: 28%;
  height: 58px;
  padding: 0 !important;
  color: #fff;
  font-weight: 500;
  text-align: center;
  line-height: 58px;
  cursor: pointer;
}
.btnWrap_02 a:nth-of-type(1) {
  background: #1c1b32;
}
.btnWrap_02 a:nth-of-type(2) {
  background: #666;
}
.btnWrap_02 a:nth-of-type(3) {
  background: #cd3b45;
}
.btnWrap_02 a:nth-of-type(4) {
  width: calc(100% - 84%);
  display: inline-block;
  text-indent: -9999em;
}

.space01 {
  padding: 0 15px;
}
.space02 {
  padding: 15px 15px;
  background: #e0f2ff;
  border-bottom: 1px solid #dbdbdb;
}
.space02 .d_i {
  display: inline-block;
}

/* btn */
.center > .btn_st01 {
  text-align: center;
}
.btn_st01 {
  width: 100%;
  display: inline-block;
  padding: 12px 0;
  background: #cd3b45;
  color: #cd3b45;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
} /* 빨간색 큰 버튼 */
.btn_st01_gray {
  width: 40%;
  display: inline-block;
  padding: 7px 0;
  background: #888;
  color: #cd3b45;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
} /* 회식 큰 버튼 */
.btn_st02 {
  border: 1px solid #9d9d9d;
  background: #888;
  padding: 5px 15px;
  display: inline-block;
  color: #fff;
  font-size: 12px;
  text-align: center;
}
.btn_st03 {
  border: 1px solid #d2d1d1;
  background: #fff;
  padding: 3px 6px;
  display: inline-block;
  color: #666;
  font-size: 12px; /* min-height:35px; */
}
.btn_st03.on {
  border: 1px solid #9d9d9d;
  background: #888;
  color: #fff;
}
.btn_st03.detail {
  min-height: inherit;
  padding: 4px 10px;
  margin-left: 5px;
}
.btn_st04 {
  border: 1px solid #9d9d9d;
  background: #888;
  padding: 3px 15px;
  display: inline-block;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
} /* 닫기버튼 */
.btn_st05 {
  overflow: hidden;
}
.btn_st05 li {
  float: left;
  width: 50%;
  padding: 0 0 0 5px;
  line-height: 1.2;
  display: table;
}
.btn_st05 li:first-child {
  padding: 0;
}
.btn_st05 li a {
  width: 100%;
  padding: 12px 8px;
  display: table-cell;
  vertical-align: middle;
  font-weight: bold;
  color: #666;
  border: 1px solid #888;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.btn_st05 li .bg_888 {
  color: #fff;
  background: #888;
}
.btn_st06 {
  overflow: hidden;
}
.btn_st06 a {
  float: left;
  font-size: 18px;
  width: 50%;
  font-weight: bold;
  color: #fff;
  padding: 14px 0;
  text-align: center;
}
.btn_st06 a:nth-child(1) {
  background: #1b1b1b;
  color: #cd3b45;
}
.btn_st06 a:nth-child(2) {
  background: #666;
}
.btn_st07 {
  display: inline-block;
  background: #666;
  color: #fff;
  font-size: 16px;
  padding: 5px 10px 5px 20px;
}
.btn_st07 {
  margin: 0 0 0 2px;
}
.btn_st07:nth-of-type(1) {
  margin: 0;
}
.btn_st07 i,
.section_replyThumb .save {
  display: inline-block;
  vertical-align: middle;
  background: url(/images/commonSub/sp_sign02.png);
  background-size: 50px;
  margin: 0 0 0 5px;
} /* sp_background */
.btn_st07 .write {
  width: 18px;
  height: 18px;
  background-position: 0 0;
}
.btn_st07 .recommend {
  width: 18px;
  height: 18px;
  background-position: 0 -21px;
}
.btn_st07 .checked {
  width: 18px;
  height: 18px;
  background-position: 0 -44px;
}
.btn_box_red {
  background: #cd3b45;
  color: #fff;
  display: inline-block;
  padding: 5px 12px;
}
.btn_box_new {
  background: #fcdb00;
  color: #cc3344;
  font-weight: bold;
  display: inline-block;
}
.btn_st08 {
  text-align: center;
}
.btn_st08 a {
  display: inline-block;
  font-size: 18px;
  text-align: center;
  width: 49.5%;
  font-weight: bold;
  color: #fff;
  padding: 14px 0;
}
.btn_st08 a:nth-child(1) {
  background: #cd3b45;
}
.btn_st08 a:nth-child(2) {
  background: #666;
}
.btn_st08 a.gray {
  background: #666 !important;
}

.btn01 {
  padding: 0.0833em 0.5em;
  font-size: 12px;
  line-height: 1em;
  font-weight: bold;
  border: 1px solid;
  border-color: #dcdcdc #ccc #bdbdbd;
  border-radius: 3px;
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.2);
  background: #f0f0f0 linear-gradient(top, #f8f8f8, #e8e8e8);
  background: #f0f0f0 -ms-linear-gradient(top, #f8f8f8, #e8e8e8);
  background: #f0f0f0 -moz-linear-gradient(top, #f8f8f8, #e8e8e8);
  background: #f0f0f0 -webkit-gradient(
      linear,
      0% 0%,
      0% 100%,
      from(#f8f8f8),
      to(#e8e8e8)
    );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#f8f8f8, endColorStr=#e8e8e8);
  position: relative;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
}
.paging1 .btn01 {
  background: #3a7bd3;
  border: none;
  -webkit-border-radius: 0;
  border-radius: 0;
  width: 30px;
  height: 30px;
  padding: 0;
}
.paging1 img {
  width: 26px;
}
.btn01.red {
  border: 1px solid #911c23;
  color: #fff;
  background: #f0f0f0 linear-gradient(top, #cc3b45, #b7262e);
  background: #f0f0f0 -ms-linear-gradient(top, #cc3b45, #b7262e);
  background: #f0f0f0 -moz-linear-gradient(top, #cc3b45, #b7262e);
  background: #f0f0f0 -webkit-gradient(
      linear,
      0% 0%,
      0% 100%,
      from(#cc3b45),
      to(#b7262e)
    );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#CC3B45, endColorStr=#B7262E);
}
.btn01.h40 {
  padding: 0.8333em 1em;
}

.btn02 {
  padding: 0.0833em 0.6em;
  font-size: 12px;
  line-height: 1em;
  color: #333;
  background: #eee;
  border: 1px solid #ddd;
  border-radius: 0.625em;
  position: relative;
  vertical-align: middle;
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
}
.btn02.type1 {
  color: #fff;
  background: #776865;
  border: 1px solid #583a3c;
}

.btn03 {
  padding: 0.21875em 0.3125em;
  font-size: 13px;
  line-height: 1em;
  color: #fff;
  background: #836761;
  border: 1px solid #453b39;
  border-radius: 3px;
  position: relative;
  vertical-align: top;
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
}

.btn10 {
  /* 그라데이션 버튼 height:30px */
  position: relative;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
  appearance: none;
  border: 1px solid #aaa;
  border-radius: 0;
  background: #fff;
  padding: 10px 15px;
  font-size: 12px;
}
.btn10.white {
  background: #f0f0f0 linear-gradient(top, #fff, #f4f4f4);
  background: #f0f0f0 -ms-linear-gradient(top, #fff, #f4f4f4);
  background: #f0f0f0 -moz-linear-gradient(top, #fff, #f4f4f4);
  background: #f0f0f0 -webkit-gradient(
      linear,
      0% 0%,
      0% 100%,
      from(#fff),
      to(#f4f4f4)
    );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#ffffff, endColorStr=#f4f4f4);
}
.btn10.red {
  color: #fff;
  border: 1px solid #ed3535;
  background: #ed3535;
}
.btn10.blue {
  background: #2763ba;
  border: 1px solid #2763ba;
  color: #fff;
}
.btn10 [class^="icn_"] {
  height: 1em;
  margin-right: -0.3em;
}
.btn10 .icn_fleft {
  margin-left: -0.3em;
  margin-right: 0;
}
.btn10 .icn_only {
  margin-left: -0.5em;
  margin-right: -0.5em;
}

/* paging */
.paging1 {
  padding: 0.9375em 0;
  background: #fff;
  border-bottom: 1px solid #ddd;
  text-align: center;
}
.paging1 span {
  padding: 0 0.625em;
  vertical-align: middle;
  display: inline-block;
}
.paging1 span a {
  width: 8px;
  height: 8px;
  padding: 0;
  margin: 0 1px;
  border: 1px solid #ddd;
  background: #ddd;
  vertical-align: baseline;
  display: inline-block;
  border-radius: 5px;
}
.paging1 span a.on {
  border-color: #8f1a2c;
  background: #cd2735;
}

.paging2 {
  padding: 0.9375em 50px;
  text-align: center;
}
.paging2 div {
  position: relative;
  display: inline-block;
}
.paging2 div > span {
  padding: 0 0.625em;
  vertical-align: middle;
  display: inline-block;
}
.paging2 div > .left {
  position: absolute;
  left: -50px;
}
.paging2 div > .right {
  position: absolute;
  right: -50px;
}

/* form ( default height:30px ) */
input[type="search"] {
  -webkit-appearance: none;
  -webkit-box-sizing: content-box;
}
input[type="text"],
input[type="number"],
input[type="search"],
input[type="password"] {
  padding: 0.3125em 0.625em;
  border: 1px solid #ddd;
  line-height: 1em;
  background: #fff;
  box-shadow: none;
  -webkit-appearance: none;
  height: 35px;
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  /* border-radius:0 !important; */
}

textarea {
  padding: 0.3125em 0.625em;
  border: 1px solid #ddd;
  resize: none;
  border-radius: 3px;
  background: #fff;
  box-shadow: none;
  font-family: "Noto Sans KR";
}
textarea:focus,
input[type="text"]:focus,
input[type="search"]:focus,
input[type="password"]:focus,
input[type="number"]:focus {
  border: 1px solid #3a7bd3;
}
input[type="radio"],
input[type="checkbox"] {
  width: 1em;
  height: 1em;
  vertical-align: top;
}
select {
  height: 1.875em; /*line-height:1.875em;*/
}

/*------------------------------------------------------------------------------
| Common Style
|.............................................................................*/

.absolute {
  position: absolute;
}
.relative {
  position: relative;
}

.justify {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.justify dt {
  white-space: nowrap;
}
.justify dd {
  white-space: nowrap;
}
.justify dd.center {
  float: none;
  margin-left: 30%;
  margin-right: 30%;
  text-align: center;
}
.justify dd.type1 .paging1 a {
  width: 21px;
  height: 21px;
  background-size: 21px !important;
}
.justify dd.type1 .paging1 a:first-child {
  background: #fff url(/images/sub/prev_arr1.gif) 0 0 no-repeat;
}
.justify dd.type1 .paging1 a:last-child {
  background: #fff url(/images/sub/next_arr1.gif) 0 0 no-repeat;
}
.justify dd.type1 .paging1 a i {
  display: none;
}
.justify .paging1 {
  border: 0;
}
.justify.type1 {
  padding-left: 1em;
  padding-right: 1em;
}

/* text */
.f11 {
  font-size: 11px !important;
}
.f12 {
  font-size: 12px !important;
}
.f13 {
  font-size: 13px !important;
}
.f14 {
  font-size: 14px !important;
}
.f16 {
  font-size: 16px !important;
}
.f18 {
  font-size: 18px !important;
}
.f20 {
  font-size: 20px !important;
}

.bold {
  font-weight: bold;
}
.point0 {
  color: #333 !important;
} /* 기본컬러 */
.point1 {
  color: #cd3b45 !important;
}
.point2 {
  color: #4a73ab !important;
}
.comment1 {
  font-size: 14px;
  color: #888;
}
.strcut {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.strcut2,
.strcut3 {
  overflow: hidden;
  word-wrap: break-word;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}
.strcut2 {
  -webkit-line-clamp: 2;
} /* 2줄 말줄임 block 요소에서만 적용됨 */
.strcut3 {
  -webkit-line-clamp: 3;
}

/* margin */
.p0 {
  padding: 0 !important;
}
.b0 {
  border: 0 !important;
}
.bt0 {
  border-top: 0 !important;
}
.bl0 {
  border-left: 0 !important;
}
.br0 {
  border-right: 0 !important;
}
.bb0 {
  border-bottom: 0 !important;
}
.bt1 {
  border-top: 1px solid #ddd !important;
}
.bl1 {
  border-left: 1px solid #ddd !important;
}
.br1 {
  border-right: 1px solid #ddd !important;
}
.bb1 {
  border-bottom: 1px solid #ddd !important;
}

/* 해상도에 따라 보이고 감추기 */
.resBlock1,
.resBlock2 {
  display: none;
}
.resInline1,
.resInline2 {
  display: none;
}

/* input type=file */
.attachfile {
  position: relative;
  text-align: left;
  display: block;
}
.attachfile input[type="file"] {
  position: absolute;
  top: 0;
  left: 0;
  filter: alpha(opacity: 0);
  opacity: 0;
}
.attachfile em {
  float: left;
  margin-right: 1em;
  cursor: pointer;
}
.attachfile div {
  padding: 0.25em 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.attachfile:after {
  content: " ";
  display: block;
  clear: both;
}

.tRed {
  color: #cc3344 !important;
}
.tBlue {
  color: #3b7bd3 !important;
}

/* GNB */
.ico_menu {
  width: 100%;
  height: 100%;
  background: url("../../images/common/ico_menu.png") 50% 50% no-repeat;
  display: inline-block;
}
.ico_search {
  width: 100%;
  height: 100%;
  background: url("../../images/common/ico_search.png") 50% 50% no-repeat;
  display: inline-block;
}

/*------------------------------------------------------------------------------
| Title Style
|.............................................................................*/

h2.tit1 {
  /* height:40px */
  padding: 0.5em 1em;
  color: #fff;
  font-size: 13px;
  letter-spacing: -1px;
  background: #54544c linear-gradient(top, #54544c, #666666);
  background: #54544c -ms-linear-gradient(top, #54544c, #666666);
  background: #54544c -moz-linear-gradient(top, #54544c, #666666);
  background: #54544c -webkit-gradient(
      linear,
      0% 0%,
      0% 100%,
      from(#54544c),
      to(#666666)
    );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#54544C, endColorStr=#666666);
}
h2.tit2 {
  padding: 0.45em 1em 0.45em 40px;
  background: #f5f6f7;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ddd;
  position: relative;
  font-size: 20px;
  letter-spacing: -1px;
}
h2.tit2:before {
  position: absolute;
  top: 3px;
  left: 8px;
  content: url("../../images/common/ico_check_ok.png");
}
h2.tit2.type1 {
  padding-left: 0.5em;
}
h2.tit2.type1:before {
  position: static;
  padding-right: 0.5em;
  color: #888;
  content: "\2022"; /*font-size:16px;*/
}

h4.tit1 {
  margin-top: 0.4375em;
  padding: 0.4375em 1em 0.4375em 0;
  font-weight: bold;
}
h4.tit1:before {
  padding-right: 0.5em;
  content: "\2022";
}

.read {
  padding: 0.3125em 0;
  font-size: 12px;
}
.read img {
  margin-top: 0.3125em;
}

a.myPageBanner {
  position: relative;
  display: block;
  background: #b5efff;
  padding: 20px 20px;
}
a.myPageBanner:before {
  position: absolute;
  top: 0;
  right: 0;
  width: 21px;
  height: 100%;
  content: " ";
  background: url(/images/commonSub/renew/r_arrow2.png) left center no-repeat;
  background-size: 7px auto;
}
a.myPageBanner img {
  width: 260px;
}
div.myLectureList li {
  padding-left: 70px;
}
div.myLectureList .tcPhoto4 {
  position: absolute;
  left: -56px;
  top: 20px;
}
div.myLectureList samp {
  white-space: normal;
  line-height: 1.45em;
}
div.myLectureList .lec1 h5 {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}
div.myLectureList .lec1 h6 {
  padding-bottom: 0.3em;
}

.lec1 h5.ti {
  overflow: visible;
  white-space: normal;
  font-weight: bold;
}
/* //2015-10-07 나의 공부방 리스트 개선*/

/*------------------------------------------------------------------------------
| Bar Style
|.............................................................................*/

.rating1 {
  width: 75px;
  height: 15px;
  background-position: 0 -15px;
  background-repeat: no-repeat;
  overflow: hidden;
  display: inline-block;
}
.rating1 em {
  height: 100%;
  display: block;
}
.rating1,
.rating1 em {
  background-image: url("../../images/common/star1.png");
}

/*------------------------------------------------------------------------------
| Tab Style position:relative; left:2px; margin-right:-2px;
|.............................................................................*/

.tab01 ul li {
  float: left;
  background: #efefef url("../../images/common/btn10.overlay.png") repeat-x;
}
.tab01 ul li a,
.tab01 ul li em {
  padding: 0.45em 0.625em;
  border: solid #ddd;
  border-width: 1px 0 1px 1px;
  border-top: 1px solid #fff;
  font-weight: bold;
  text-align: center;
  white-space: nowrap;
  display: block;
}
.tab01 ul li.on a,
.tab01 ul li.on em {
  color: #fff;
  background: #666;
  border-color: #666;
}
.tab01 ul li:first-child a {
  border-left-width: 0;
}
.tab01 ul:after {
  content: " ";
  display: block;
  clear: both;
}

.tab02 {
  font-weight: bold;
  line-height: 20px;
  overflow: hidden;
}
.tab02 ul {
  padding: 0 15px;
  background: #eee;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ddd;
}
.tab02 ul li {
  float: left;
  background: url("../../images/common/line01_v16.png") 0 50% no-repeat;
}
.tab02 ul li a {
  padding: 10px 10px;
  color: #333;
  text-align: center;
  white-space: nowrap;
  display: block;
}
.tab02 ul li.on a {
  position: relative;
  top: 5px;
  margin-right: -2px;
  padding-top: 5px;
  background: #fff;
  border: 1px solid #ddd;
  z-index: 1;
  border-top-left-radius: 6px;
  -moz-border-radius-topleft: 6x;
  -webkit-border-radius-top-left: 6px;
  border-top-right-radius: 6px;
  -moz-border-radius-topright: 6x;
  -webkit-border-radius-top-right: 6px;
  box-shadow: inset 2px 2px 3px #eee;
  -moz-box-shadow: inset 2px 2px 3px #eee;
  -webkit-box-shadow: inset 2px 2px 3px #eee;
}
.tab02 ul li:first-child {
  background: none;
}
.tab02 ul:after {
  content: " ";
  display: block;
  clear: both;
}

.tab03 {
  overflow: hidden;
}
.tab03 ul {
  border-bottom: 1px solid #ddd;
  text-align: center;
}
.tab03 ul li {
  float: left;
  padding: 0.5em 0;
  background: url("../../images/common/line01_v16.png") 0 50% no-repeat;
}
.tab03 ul li a {
  margin: 0 1em;
  padding: 0.2em 0; /*font-size:16px;*/
  font-weight: bold;
  text-align: center;
  white-space: nowrap;
  display: block;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
}
.tab03 ul li.on a {
  color: #fff;
  background: #bc3a45;
  border: 1px solid #a0333d;
}
.tab03 ul li:first-child {
  background: none;
}
.tab03 ul:after {
  content: " ";
  display: block;
  clear: both;
}

.divi2 li {
  width: 50%;
}
.divi4 li {
  width: 25%;
}
.divi5 li {
  width: 20%;
}
.divi3 li {
  width: 33.3333%;
}
[class*="divi"] li,
[class*="divi"] li a {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/*------------------------------------------------------------------------------
| Table Style
|.............................................................................*/

.tbl01 {
  width: 100%;
  font-size: 12px;
}
.tbl01 th {
  padding: 0.5em;
  border: 1px solid #ddd;
  background: #f5f6f7;
}
.tbl01 td {
  padding: 0.5em;
  border: 1px solid #ddd;
  background: #fff;
}

.tdType1 tr th:first-child,
.tdType1 tr td:first-child {
  border-left: 0 !important;
}
.tdType1 tr th:last-child,
.tdType1 tr td:last-child {
  border-right: 0 !important;
}

.tdCenter tbody td {
  text-align: center;
}

/*------------------------------------------------------------------------------
| List Style
|.............................................................................*/

.list00 {
  padding: 0;
}
.list00 > ul > li {
  position: relative;
  padding: 1.25em 1em;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ddd;

  background: #ffffff linear-gradient(top, #ffffff, #fafafa);
  background: #ffffff -ms-linear-gradient(top, #ffffff, #fafafa);
  background: #ffffff -moz-linear-gradient(top, #ffffff, #fafafa);
  background: #ffffff -webkit-gradient(
      linear,
      0% 0%,
      0% 100%,
      from(#ffffff),
      to(#fafafa)
    );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#ffffff, endColorStr=#fafafa);
}
.list00 .fright {
  margin-left: 0.3125em;
  margin-bottom: 0.3125em;
}

.list01 {
  background: #efefef;
}
.list01 > ul > li {
  position: relative;
  background: #fff;
  margin: 0 10px 10px;
  -webkit-box-shadow: 0px 3px 3px #c3c3c3;
  box-shadow: 0px 3px 3px #c3c3c3;
}
.list01 > ul > li:before {
  position: absolute;
  top: 0;
  right: 0;
  width: 21px;
  height: 100%;
  content: " ";
  background: url(/images/commonSub/renew/r_arrow.png) left center no-repeat;
  background-size: 7px auto;
}
.list01 > ul > li.noarr:before {
  background: none;
}
.list01 > ul > li > a {
  position: relative;
  padding: 1.25em 40px 1.25em 1.5em;
  display: block;
  z-index: 1;
}
.list01 > ul > li > a:after {
  content: " ";
  display: block;
  clear: both;
}
.list02 li {
  padding: 0 1em;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ddd;
  white-space: nowrap;
}
.list02 li a {
  padding: 0.5em 1.2em 0.5em 0;
  background: url("../../images/common/ico_arr3right.png") right center
    no-repeat;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}
.list02.blt1 a:before {
  content: "ㆍ";
}
.list03 li {
  padding: 0.5em 0 0.5em 1em;
  border-top: 1px dashed #ddd;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.list03 li:first-child {
  border-top-width: 0;
}
.list03.blt1 li:before {
  content: "ㆍ";
}
.list04 li {
  padding-left: 1em;
  text-indent: -0.8em;
}
.list04 li:before {
  padding-right: 0.3em;
  content: "\2022";
}
.list05 dt {
  float: left;
  width: 5em;
  padding: 0.2em 0;
  color: #888;
  border-top: 1px dashed #ddd;
}
.list05 dt:before {
  content: "ㆍ";
}
.list05 dt:first-child {
  border-top-width: 0;
}
.list05 dd {
  margin-left: 5em;
  padding: 0.2em 0;
  border-top: 1px dashed #ddd;
}
.list05 dd:nth-of-type(1) {
  border-top-width: 0;
}
.list05 dd strong {
  color: #bb3945;
}
.list05 dt.input {
  padding-top: 12px;
}
.list05.word4 dt {
  width: 6em;
}
.list05.word4 dd {
  margin-left: 6em;
}
.list06 dt {
  color: #cd3b45;
  padding-top: 0.3125em;
  font-weight: bold;
}
.list06 dt:before {
  padding-right: 0.3125em;
  content: "※";
}
.list06 dt:first-child {
  padding-top: 0;
}

.calendar1 dl {
  font-size: 12px;
  font-weight: bold;
}
.calendar1 dl dd {
  float: left;
  position: relative;
  width: 14.2857%;
  height: 70px;
}
.calendar1 dl dd em {
  padding: 0 5px;
}
.calendar1 dl dd ul {
  position: absolute;
  bottom: 3px;
  right: 3px;
}
.calendar1 dl dd ul li {
  line-height: 1.3em;
  font-weight: normal;
  text-align: right;
  white-space: nowrap;
}
.calendar1 dl dd.gray {
  color: #ccc !important;
}
.calendar1 dl dd.thisweek {
  background: #f5f6f7;
}
.calendar1 dl dd:nth-of-type(7n + 1),
.calendar1 ol li:nth-of-type(7n + 1) {
  color: #e23d5f;
}
.calendar1 dl dd:nth-of-type(7n + 7),
.calendar1 ol li:nth-of-type(7n + 7) {
  color: #40acb6;
}
.calendar1 dl dd:nth-of-type(7n + 1):before {
  border-left: 0;
}
.calendar1 dl dd:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: solid #ddd;
  border-width: 0 0 1px 1px;
  content: " ";
  display: inline-block;
}
.calendar1 dl:after {
  content: " ";
  display: block;
  clear: both;
}
.calendar1 .head {
  border-bottom: 1px solid #ddd;
}
.calendar1 .head li {
  float: left;
  padding: 0.25em 0;
  width: 14.2857%;
  background: #f5f6f7;
  text-align: center;
}
.calendar1 .head:after {
  content: " ";
  display: block;
  clear: both;
}
.calendar1 .tail {
  padding: 5px 5px 0 0;
  text-align: right;
}
.calendar1 .tail span:nth-of-type(1),
.calendar1 ul li:nth-of-type(1) {
  color: #222222;
} /*목표*/
.calendar1 .tail span:nth-of-type(2),
.calendar1 ul li:nth-of-type(2) {
  color: #46b519;
} /*실천*/
.calendar1 .tail span:nth-of-type(3),
.calendar1 ul li:nth-of-type(3) {
  color: #d35465;
} /*학습시간*/
.calendar1:after {
  content: " ";
  display: block;
  clear: both;
}

/* nav */
nav#gnb {
  border-top: 1px solid #545454;
  border-bottom: 2px solid #545454;
  background: #656565; /* Old browsers */
  background: -moz-linear-gradient(top, #656565 0%, #757575 100%); /* FF3.6+ */
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0%, #656565),
    color-stop(100%, #757575)
  ); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(
    top,
    #656565 0%,
    #757575 100%
  ); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(
    top,
    #656565 0%,
    #757575 100%
  ); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #656565 0%, #757575 100%); /* IE10+ */
  background: linear-gradient(to bottom, #656565 0%, #757575 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#656565', endColorstr='#757575',GradientType=0 ); /* IE6-9 */
}
nav#gnb ul {
  display: table;
  width: 100%;
}
nav#gnb li {
  display: table-cell;
  width: 20%;
  height: 39px;
  vertical-align: middle;
  text-align: center;
  border-left: 1px solid #404040;
}
nav#gnb li:first-child {
  border: none;
}
nav#gnb li a {
  display: block;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  font-size: 0.857em;
  line-height: 3.2em;
  color: #fff;
  font-weight: bold;
}
nav#gnb li:last-child a {
  color: #fff1d1;
}

/* main.asp */
#layoutMain #mainMenu1 {
  position: relative;
  background: #544140;
}
#layoutMain #mainMenu1 ul li {
  float: left;
  width: 50%;
  text-align: center;
}
#layoutMain #mainMenu1 ul li a {
  padding: 0.9em 0;
  font-size: 21px;
  color: #f0ede6;
  border: 1px solid;
  border-color: #503c3a #1d0d0a #0f0402 #5a4542;
  font-weight: bold;
  white-space: nowrap;
  display: block;
}
#layoutMain #mainMenu1 ul li a:after {
  padding-left: 5px;
  content: url("../../images/common/ico_arr2right.png");
  line-height: 1em;
  vertical-align: -4px;
  display: inline-block;
}
#layoutMain #mainMenu1 ul:after {
  content: " ";
  display: block;
  clear: both;
}
#layoutMain .group1 {
  padding-bottom: 2.5em;
  background: #423c3b;
  border-top: 1px solid #574744;
}
#layoutMain .group1 #mainMenu2 {
  padding-bottom: 1em;
}
#layoutMain .group1 #mainMenu2 li {
  float: left;
  width: 25%;
  text-align: center;
}
#layoutMain .group1 #mainMenu2 li img {
  width: 90%;
  max-width: 103px;
  border: 1px solid #4a3e3b;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  box-shadow:
    0 0 3px rgba(0, 0, 0, 1),
    0 0 2px rgba(0, 0, 0, 7);
  -moz-box-shadow:
    0 0 3px rgba(0, 0, 0, 1),
    0 0 2px rgba(0, 0, 0, 7);
  -webkit-box-shadow:
    0 0 3px rgba(0, 0, 0, 1),
    0 0 2px rgba(0, 0, 0, 7);
}
#layoutMain .group1 #mainMenu2:after {
  content: " ";
  display: block;
  clear: both;
}

/* main.asp banner */
#layoutMain #oBanner {
  position: relative;
  background: #fff4dc;
  border-bottom: 1px solid #ede9e1;
  margin: 0 0 9px;
}
#layoutMain #oBanner .arrLeft,
#layoutMain #oBanner .arrRight {
  position: absolute;
  top: 0;
  width: 12%;
  height: 100%;
  cursor: pointer;
}
#layoutMain #oBanner .arrRight {
  right: -12.5%;
  background: url("../../images/common/ico_arr4right.png") 75% 50% no-repeat;
  background-size: auto 30%;
}
#layoutMain #oBanner .arrLeft {
  left: -12.5%;
  background: url("../../images/common/ico_arr4left.png") 25% 50% no-repeat;
  background-size: auto 30%;
}
#layoutMain #oBanner .items {
  position: relative;
  height: 200px;
  margin: 0 auto;
  overflow: hidden;
}
#layoutMain #oBanner .items ul {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
}
#layoutMain #oBanner .items ul li {
  float: left;
  height: 100%;
  text-align: center;
  vertical-align: middle;
}
#layoutMain #oBanner .items ul li img {
  width: 100%;
  max-width: 300px;
}
#layoutMain #oBanner .items ul li .vBlank {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
#layoutMain #oBanner dl {
  position: absolute;
  bottom: 5px;
  width: 100%;
  text-align: center;
}
#layoutMain #oBanner dl dt.on {
  background: #cd2735;
}
#layoutMain #oBanner dl dt {
  width: 10px;
  height: 10px;
  margin: 0 2px;
  background: #707070;
  vertical-align: baseline;
  display: inline-block;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}
#layoutMain #oBanner.mainBanner {
  height: 149px;
}

/* memberCase */
#memberCase {
  position: relative;
}
#memberCase.beforeLogin a {
  display: block;
  text-align: center;
}
#memberCase.beforeLogin a img {
  width: 100%;
  max-width: 720px;
}
#memberCase.moohan {
  padding: 7px 0;
  margin: 0 14px;
}
#memberCase.moohan:after {
  content: "";
  display: block;
  clear: both;
}
/*#memberCase.moohan .left{float:left;display:inline-block;padding:0 0 0 50px;margin:8px 0 0 0;background:url(/images/main/bg_moohan.png) 0 0 no-repeat;background-size:42px 48px;}*/
#memberCase.moohan .left {
  float: left;
  display: inline-block;
  padding: 0 0 0 0px;
  margin: 8px 0 0 0;
  background-size: 42px 48px;
}

#memberCase.moohan .left span {
  display: block;
  color: #747474;
  font-size: 0.688em;
}
#memberCase.moohan .left p {
  display: inline;
  color: #fff;
  letter-spacing: -1px;
  font-weight: bold;
  font-size: 1.125em;
  background: #2c75b4;
  padding: 2px;
}
#memberCase.moohan .right {
  float: right;
  display: inline-block;
}
#memberCase.moohan .right ul {
  line-height: 140%;
}
#memberCase li {
  color: #545454;
  font-size: 1em;
  font-weight: bold;
}
#memberCase li:before {
  content: "\2022";
  padding: 0 3px 0 0;
}
#memberCase li a {
  color: #545454;
}
#memberCase li a em {
  color: #d5434e;
}
#memberCase.dangang {
  padding: 7px 0;
  margin: 0 14px;
}
#memberCase.dangang:after {
  content: "";
  display: block;
  clear: both;
}
#memberCase.dangang .right {
  position: absolute;
  top: 7px;
  right: 0;
}
#memberCase.dangang .right img {
  width: 149px;
}

/* notice */
#notice {
  position: relative;
  margin: 0 10px;
}
#notice ul {
  display: block;
  margin: 0 35px 0 70px;
} /* 2015.08.10 t공지사항 디자인변경*/
#notice ul:after {
  content: "";
  display: block;
  clear: both;
}
#notice li {
  display: block;
  width: 100%;
  padding: 2px 0;
  border-bottom: 1px solid #ddd;
}
#notice li a {
  display: block;
  width: 100%;
  height: 100%;
  font-size: 0.8em;
  color: #666;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-text-size-adjust: none;
}
#notice .event, /* 2015.08.10 공지사항 디자인변경*/
#notice .noti {
  position: relative;
  margin: 0 0 20px;
}
#notice .noti {
  /* 2015.08.10 공지사항 디자인변경*/
  border-bottom: 1px solid #d1d1d1;
  padding-bottom: 0px;
  margin: 15px 0 14px;
  height: 65px;
}
#notice .event li:nth-child(1), /* 2015.08.10 공지사항 디자인변경*/
#notice .noti li:nth-child(2) {
  border-bottom: 1px dotted #ccc;
}
#notice .event li:nth-child(2),
#notice .noti li:nth-child(3) {
  border: none;
}
#notice .more {
  /* 2015.08.10 공지사항 디자인변경*/
  position: absolute;
  top: 14px;
  right: 0;
  display: block;
  width: 25px;
  height: 23px;
  text-align: center;
  color: #fff;
  letter-spacing: -1px;
  font-size: 0.929em;
  font-weight: bold;
  line-height: 3.8em;
  background: #c4c4c4;
}
#notice .more .ico {
  /* 2015.08.10 공지사항 디자인변경*/
  position: absolute;
  bottom: 0;
  right: 0;
  display: block;
  width: 25px;
  height: 23px;
  background: #fff url(/images/main/btnMore.png) center 50% no-repeat;
  background-size: 25px 23px;
}
#notice .noti .more {
  background: #9bbbd9;
} /* 2015.08.10 공지사항 디자인변경*/
#notice .noti .more .ico {
  background-color: #6e97be;
} /* 2015.08.10 공지사항 디자인변경*/
#notice figure {
  position: absolute;
  left: 2px;
  top: -5px;
  margin: 0;
  padding: 0;
  width: 59px;
}
#notice figure img {
  /* 2015.08.10 공지사항 디자인변경*/
  width: 100%;
}

#notice .noEvent {
  font-size: 0.8em;
  height: 45px;
  line-height: 45px;
  border-bottom: none !important;
  color: #666;
}

/* bnnrFreeZone */
.bnnrFreeZone {
  text-align: center;
  margin: 0 10px 10px 10px;
}
.bnnrFreeZone img {
  width: 100%;
  max-width: 720px;
}

/* bestLect */
.bestLect {
  margin: 0 0 10px;
}
.bestLect h2 {
  display: block;
  text-indent: 13px;
  font-size: 0.85em;
  padding: 10px 0;
  margin: 7px 0;
  background: #eaeaea;
  border-top: 2px solid #ccc;
  border-bottom: 1px solid #ccc;
}
.bestLect .tab {
  margin: 0 0 12px;
}
.bestLect .tab ul {
  display: table;
  width: 100%;
  margin: 0 auto;
}
.bestLect .tab ul:after {
  content: "";
  display: block;
  clear: both;
}
.bestLect .tab li {
  position: relative;
  display: table-cell;
  width: 15%;
  height: 20px;
  text-align: center;
  border-left: 1px solid #9f9f9f;
}
.bestLect .tab li:nth-child(4),
.bestLect .tab li:nth-child(5),
.bestLect .tab li:nth-child(6) {
  width: 20%;
}
.bestLect .tab li:first-child {
  border: none;
}
.bestLect .tab li a {
  position: relative;
  display: block;
  font-size: 0.85em;
  font-weight: bold;
  letter-spacing: -1px;
  color: #6a6a6a;
  padding: 0.1em 0.1em 0 0.1em;
  margin: 0 6px;
}
.bestLect .tab li a .ico {
  display: none;
  position: absolute;
  bottom: -6px;
  left: 50%;
  margin-left: -3px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #d75861;
}
.bestLect .tab li.on a {
  color: #fff;
  background: #d75861;
}
.bestLect .tab li.on a .ico {
  display: block;
}
.bestLect .tabCont {
  margin: 0 9px;
}
.bestLect .tabCont li {
  display: block;
  border-top: 1px solid #d1d1d1;
  padding: 7px 0;
}
.bestLect .tabCont li a {
  display: block;
  font-size: 0.8em;
  color: #666;
  margin-right: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-text-size-adjust: none;
}
.bestLect .tabCont li a .ico {
  display: inline-block;
  width: 50px;
  text-align: center;
  letter-spacing: -1px;
  font-size: 11px;
  color: #fff;
  margin-right: 7px;
  background: #939393;
  border-radius: 2px;
}
.bestLect .tabCont li a:before {
  content: "\2022";
  color: #d75861;
  padding: 0 3px;
}

/* goService */
.goService {
  padding: 9px 15px 20px 15px;
  margin: 0 0 17px;
  background: #eee;
  border-top: 2px solid #ccc;
  border-bottom: 1px solid #ccc;
}
.goService h2 {
  display: block;
  font-size: 0.85em;
  margin: 0 0 9px;
}
.goService ul {
  display: table;
  width: 100%;
}
.goService li {
  display: table-cell;
  width: 20%;
  text-align: center;
}
.goService li a {
  position: relative;
  display: block;
  font-size: 0.85em;
  line-height: 100%;
  color: #666;
  padding: 60px 0 10px 0;
  margin: 0 0 0 5px;
  border: 1px solid #e0e0e0;
  border-radius: 5px;
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top, #ffffff 0%, #f3f3f3 100%); /* FF3.6+ */
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0%, #ffffff),
    color-stop(100%, #f3f3f3)
  ); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(
    top,
    #ffffff 0%,
    #f3f3f3 100%
  ); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(
    top,
    #ffffff 0%,
    #f3f3f3 100%
  ); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #ffffff 0%, #f3f3f3 100%); /* IE10+ */
  background: linear-gradient(to bottom, #ffffff 0%, #f3f3f3 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f3f3f3',GradientType=0 ); /* IE6-9 */
}
.goService li:first-child a {
  margin: 0;
}
.goService li a span {
  position: absolute;
  top: 11px;
  left: 50%;
  display: block;
  width: 42px;
  height: 42px;
  margin: 0 0 0 -21px;
  background: url(/images/main/spr_main.png) no-repeat;
  background-size: 42px auto;
}
.goService li .service1 span {
  background-position: 0 0;
}
.goService li .service2 span {
  background-position: 0 -44px;
}
.goService li .service3 span {
  background-position: 0 -87px;
}
.goService li .service4 span {
  background-position: 0 -131px;
}
.goService li .service5 span {
  background-position: 0 -174px;
}

/* cscenter */
.cscenter {
  position: relative;
  margin: 17px 17px 0;
  padding: 0 0 17px;
}
.cscenter div {
  line-height: 120%;
  margin: 0 0 0 65px;
}
.cscenter div a {
  font-size: 0.875em;
  color: #666;
  font-weight: bold;
  -webkit-text-size-adjust: none;
}
.cscenter div a .ico {
  position: relative;
  top: 2px;
  display: inline-block;
  width: 14px;
  height: 14px;
  text-align: center;
  border-radius: 13px;
  margin: 0 0 0 8px;
  background: #8e8e8e;
}
.cscenter div a .ico i {
  position: absolute;
  top: 4px;
  left: 50%;
  display: inline-block;
  width: 0;
  height: 0;
  margin: 0 0 0 -1px;
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-left: 3px solid #fff;
}
.cscenter div p {
  display: block;
  color: #999;
  font-size: 0.75em;
  -webkit-text-size-adjust: none;
}
.cscenter .icoCs {
  position: absolute;
  top: 5px;
  left: 0;
  display: block;
  width: 3.125em;
  height: 3.125em;
  background: #ddd url(/images/main/ico_cscenter.png) center 50% no-repeat;
  background-size: 28px 38px;
  border-radius: 3px;
}

/* poRela */
.poRela {
  position: relative !important;
}
.noPaddng {
  padding: 0 !important;
}
.noMargin {
  margin: 0 !important;
}

/* cskakao / 2015-10-27 / 카카오콕 친절상담추가 */
.cskakao ul.info {
  overflow: hidden;
  margin: 0;
  padding: 0;
}
.cskakao ul.info li:nth-child(2) {
  border-left: 1px solid #d1d1d1;
}
.cskakao ul.info li {
  width: 50%;
  float: left;
  box-sizing: border-box;
  overflow: hidden;
}
.cskakao li h3 {
  border-bottom: 1px solid #d1d1d1;
  background: #eee;
  text-align: center;
  padding: 0.5em 0;
}

.cskakao p {
  color: #999;
  font-size: 0.8em;
  letter-spacing: -0.09em;
  padding: 0.4em 0;
}
.cskakao li a {
  font-size: 0.95em;
  letter-spacing: -0.11em;
  display: block;
  line-height: 1.2em;
  font-weight: bold;
  color: #666;
}
.cskakao li .wrap {
  padding: 10px;
}
.cskakao a .ico {
  width: 12.5px;
  height: 13.5px;
  background: url(/images/icon/icoTel.png) no-repeat 0px 0px;
  background-size: 100%;
  display: inline-block;
  vertical-align: middle;
  margin: 0 0 0.1em 0.3em;
}
.cskakao li button {
  font-size: 0.8em;
  padding: 0.5em 0.9em;
}
h3.csTitle {
  border-top: 1px solid #d1d1d1;
  letter-spacing: -0.1em;
  padding: 0.9em 0 0.5em 1em;
}

/* 하단 띠배너 */
#bottombanner {
  z-index: 1000;
  position: fixed;
  bottom: 0;
  left: 0;
  text-align: center;
  width: 100%;
  background: #000;
}
#bottombanner a {
  padding: 0;
}
#bottombanner a img {
  width: 100%;
  max-width: 400px;
}

body {
  overflow-x: hidden;
}
body.on {
  overflow: hidden !important;
  position: fixed !important;
}
body {
  overflow: initial;
}

.dim {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
  width: 100%;
  height: 100%;
  background-color: #000;
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: alpha(opacity=70);
  transition: all 0.5s ease-out;
}

aside {
  transition-duration: 0.3s;
  transition-timing-function: ease-in-out;
  position: fixed !important;
  overflow: scroll !important;
  border: none !important; /* -webkit-overflow-scrolling: touch; */
}
aside.on {
  left: 0;
}

.hBtnMemu {
  position: relative;
  cursor: pointer;
  float: left;
  width: 44px;
  height: 44px;
  margin: 0 0 0;
  overflow: hidden;
}
.hamburger-menu {
  margin: -4px 0 0 10px;
}
.bar,
.bar:after,
.bar:before {
  width: 22px;
  height: 2px;
}

.bar {
  position: relative;
  transform: translateY(25px);
  -webkit-transform: translateY(25px);
  -moz-transform: translateY(25px);
  -o-transform: translateY(25px);
  -ms-transform: translateY(25px);

  background: #38393a;
  transition: all 0ms 300ms;
  -webkit-transition: all 0ms 300ms;
  -moz-transition: all 0ms 300ms;
  -o-transition: all 0ms 300ms;
  -ms-transition: all 0ms 300ms;
  border-radius: 2px;
}
.bar.animate {
  background: rgba(255, 255, 255, 0);
}

.bar:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 6px;
  background: #38393a;
  transition:
    bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-transition:
    bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -moz-transition:
    bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -o-transition:
    bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -ms-transition:
    bottom 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
  border-radius: 2px;
}

.bar:after {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  background: #38393a;
  transition:
    top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-transition:
    top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -moz-transition:
    top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -o-transition:
    top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -ms-transition:
    top 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
  border-radius: 2px;
}

.bar.animate:after {
  top: 0;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);

  transition:
    top 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-transition:
    top 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -moz-transition:
    top 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -o-transition:
    top 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -ms-transition:
    top 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

.bar.animate:before {
  bottom: 0;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);

  transition:
    bottom 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-transition:
    bottom 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -moz-transition:
    bottom 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -o-transition:
    bottom 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  -ms-transition:
    bottom 300ms cubic-bezier(0.23, 1, 0.32, 1),
    transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
}

/* 디자인 셀렉트 */
select.select {
  vertical-align: top;
  color: #666 !important;
  width: 100%;
  height: 35px;
  padding: 0px 28px 0px 5px;
  white-space: nowrap;
  text-overflow: ellipsis;
  border: 1px solid #dfdfdf;
  background: #fff url(/images/commonSub/bg_select.png) no-repeat right center;
  background-size: 33px;
  outline: none;
  outline: 0px;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-border-radius: 0 !important;
  -moz-border-radius: 0 !important;
  -ms-border-radius: 0 !important;
  border-radius: 0 !important;
  color: #010101;
  font-size: 12px;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
select.select:focus {
  border: 1px solid #3a7bd3;
  outline-style: none;
}

.border_box,
.border_box * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.space01 {
  padding: 0 15px;
}
.space02 {
  padding: 15px 15px;
  background: #e0f2ff;
  border-bottom: 1px solid #dbdbdb;
}
.tab_type01 {
  overflow: hidden;
  width: 100%;
}
.tab_type01 li {
  float: left;
  width: 50%;
  text-align: center;
}
.tab_type01 li a {
  display: block;
  border: 1px solid #dbdbdb;
  width: auto;
  background: #fff;
  color: #666;
  font-size: 13px;
  padding: 10px 0;
  font-weight: bold;
}
.tab_type01 li.on a {
  color: #007dc6;
  border: 1px solid #007dc6;
  background: #e0f2ff;
}
.tab_type01 li:nth-child(odd) a {
  margin-right: 2px;
}
.tab_type01 li:nth-child(even) a {
  margin-left: 2px;
}

.btnCok_mean {
  display: inline-block;
  padding: 8px 12px;
  background: #747474;
  color: #cbcbcb;
  font-size: 12px;
  text-align: center;
  font-weight: bold;
}

.section_tit_line {
  position: relative;
  padding: 12px 20px;
  background: #f9f9f9;
  border-top: 1px solid #e3e3e3;
  border-bottom: 1px solid #e3e3e3;
}
.section_cok_list01 {
  position: relative;
  z-index: 1;
}
.section_cok_list01 > ul > .item {
  padding: 10px 20px;
  border-bottom: 1px solid #ddd;
  position: relative;
}
.section_cok_list01 > ul > .item:last-child {
  border-top: none;
}
.section_cok_list01 .section_right {
  overflow: hidden;
  position: absolute;
  right: 20px;
  top: 50%;
  margin: -25px 0 0;
}
.section_cok_list02 {
  position: relative;
  z-index: 1;
}
.section_cok_list02 > ul > .item {
  padding: 10px 20px;
  border-bottom: 1px solid #ddd;
  position: relative;
}
.section_cok_list02 > ul > .item:last-child {
  border-top: none;
}
.section_cok_list02 .section_right {
  overflow: hidden;
  position: absolute;
  right: 20px;
  top: 50%;
  margin: -25px 0 0;
}
.section_cok_list03 {
  position: relative;
  z-index: 1;
}
.section_cok_list03 > ul > .item {
  padding: 10px 20px;
  border-bottom: 1px solid #ddd;
  position: relative;
}
.section_cok_list03 > ul > .item:last-child {
  border-top: none;
}
.section_cok_list03 .section_right {
  overflow: hidden;
  position: absolute;
  right: 20px;
  top: 50%;
  margin: -25px 0 0;
}

.cok_q,
.cok_v,
.cok_le {
  background-image: url(/images/commonSub/sp_cokIcon.png);
  background-size: 300px;
  float: left;
  display: inline-block;
  width: 52px;
  height: 20px;
  text-indent: -9999em;
  width: 48px;
  height: 51px;
  margin: 0 0 0 5px;
}
.cok_q {
  background-position: 0 0;
}
.cok_v {
  background-position: -52px 0;
}
.cok_le {
  background-position: -104px 0;
}

/* 더보기 */
.moreView {
  text-align: center;
  background: #fff;
  border-bottom: 1px solid #d3d2d2;
  padding: 1em 0;
}
.moreView a {
  font-size: 12px;
  color: #888;
  display: block;
  font-weight: bold;
}

/* modal Popup */
.fixPop {
  display: none;
  position: fixed;
  _position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10000;
  cursor: pointer;
}
.fixPop .fixPop_area {
  position: absolute;
  left: 50%;
  top: 50%;
  background: #fff;
  font-size: 0;
  line-height: 0;
  cursor: pointer;
}
.fixPop .fixPop_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.75;
  -moz-opacity: 0.75;
  filter: alpha(opacity=75);
  cursor: pointer;
}

#layerPopup {
  display: none;
  z-index: 999991;
  position: fixed;
}
.cok_how {
  border: 1px solid #8d8d8d;
  padding: 0 0;
}
.cok_how .tit {
  background: #ccc;
  font-size: 15px;
  padding: 12px 20px;
}
.cok_how .dec {
  background: #fff;
  font-size: 12px;
  padding: 12px 20px;
}

/* tab */
.tab08 {
  overflow: hidden;
  width: 102%;
}
.tab08 li {
  float: left;
  display: inline-block;
  position: relative;
  cursor: pointer;
  z-index: 1;
  text-align: center;
  border-top: 1px solid #dbdbdb;
  border-left: 1px solid #dbdbdb;
  border-bottom: 1px solid #dbdbdb;
  padding: 10px 8px;
  color: #888;
  background: #fff;
  margin: 0 0 0 -1px;
  line-height: 1.2;
  display: -webkit-box;
  display: -moz-box;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
}
.tab08 li:first-child {
  border-left: none;
}
.tab08 li a {
  display: inline-block;
  width: 100%;
  font-size: 13px;
  color: #888;
}
.tab08 li.on {
  font-weight: bold;
  color: #333;
  z-index: 2;
  background: #e0f2ff;
  border-bottom: 1px solid #e0f2ff;
  border-top: 1px solid #dbdbdb;
  border-left: 1px solid #dbdbdb;
  border-right: 1px solid #dbdbdb;
}
.tab08 li.on a {
  color: #007dc6;
}

.tab09 {
  overflow: hidden;
  width: 102%;
}
.tab09 li {
  float: left;
  display: inline-block;
  position: relative;
  cursor: pointer;
  z-index: 1;
  text-align: center;
  border-top: 1px solid #dcdcdc;
  border-left: 1px solid #dcdcdc;
  border-bottom: 1px solid #888;
  padding: 10px 8px;
  color: #888;
  background: #eee;
  margin: 0 0 0 -1px;
  line-height: 1.2;
  display: -webkit-box;
  display: -moz-box;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
}
.tab09 li:first-child {
  border-left: none;
}
.tab09 li a {
  display: inline-block;
  width: 100%;
  font-size: 13px;
  color: #888;
}
.tab09 li.on {
  font-weight: bold;
  color: #333;
  z-index: 2;
  background: #fff;
  border-bottom: none;
  border-top: 1px solid #888;
  border-left: 1px solid #888;
  border-right: 1px solid #888;
}
.tab09 li.on a {
  color: #333;
}

.w_2 li {
  width: 49.3% !important;
}
.w_3 li {
  width: 33.3% !important;
}
.w_4 li {
  width: 25% !important;
}
.w_5 li {
  width: 20% !important;
}
.w_6 li {
  width: 16.666% !important;
}
.w_6 li:first-child {
  width: 16.667% !important;
}

.tab03.blue {
}
.tab03.blue li {
  background: #38393a;
}
.tab03.blue li a {
  color: #fff;
}
.tab03.blue li.on {
  background: #3a7bd3;
}

.tab031Wrap {
  overflow: hidden;
  background: #eee;
}
.tab031 {
  width: 102%;
}
.tab031 li {
  float: left;
  text-align: center;
  display: table;
}
.tab031 li a {
  width: 100%;
  display: table-cell;
  vertical-align: middle;
  padding: 8px 5px;
  border: 1px solid #e2e2e2;
  border-left: none;
  background: #eee;
  color: #666;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.tab031 li.on a {
  border: 1px solid #7a7a7a;
  background: #666;
  color: #fff;
}

.c_666 {
  color: #666;
}

.topCokBanner img {
  width: 100%;
}

.btn_st08 {
  display: inline-block;
  padding: 8px 40px;
  background: #666;
  color: #fff;
  font-size: 14px;
  font-size: 13px;
  font-weight: bold;
}

/* 메뉴열기 */
.btnMoreView {
  position: relative;
  margin: -1px 0 0;
  z-index: 2;
  overflow: hidden;
  cursor: pointer;
}
.btnMoreView .box {
  background: url(/images/commonSub/menuOpenWrap.png) no-repeat;
  background-size: 100px;
}
.btnMoreView .box {
  background-position: 0 -28px;
  width: 100px;
  height: 24px;
  text-align: center;
  margin: 0 auto 10px;
}
.btnMoreView .box {
  vertical-align: top;
  padding: 3px 0 0;
  display: block;
}
.btnMoreView .box > div {
  color: #fff;
  font-size: 12px;
  vertical-align: top;
  display: inline-block;
  letter-spacing: 0;
}

/* 내 교재 검색 */
.myBook {
  position: relative;
}
.myBookSlide {
  padding: 0 15px;
  position: relative;
  z-index: 1;
}
.myBookSlide .itemArea {
  overflow: hidden;
}
.myBookSlide .item {
  float: left;
  width: 33.3%;
}
.myBookSlide .item {
  padding: 0 5px;
}
.myBookSlide .item img {
  border: 1px solid #c6c6c5; /* max-height:100px; min-height:100px; */
}
@media all and (min-width: 320px) {
  .myBookSlide .item img {
    height: 100px;
  }
}
@media all and (min-width: 360px) {
  .myBookSlide .item img {
    height: 119px;
  }
}
@media all and (min-width: 375px) {
  .myBookSlide .item img {
    height: 134px;
  }
}
@media all and (min-width: 412px) {
  .myBookSlide .item img {
    height: 142px;
  }
}
@media all and (min-width: 414px) {
  .myBookSlide .item img {
    height: 143px;
  }
}
@media all and (min-width: 600px) {
  .myBookSlide .item img {
    height: 241px;
  }
}
@media all and (min-width: 768px) {
  .myBookSlide .item img {
    height: 300px;
  }
}
@media all and (min-width: 1024px) {
  .myBookSlide .item img {
    height: 414px;
  }
}

.myBookSlide .item.on img {
  border: 1px solid #007dc6;
}
.myBookSlide .item.on .txt {
  color: #007dc6;
}
.myBookSlide .item img {
  width: 100%;
}
.myBookSlide .item .txt {
  margin: 3px 0 0;
  font-size: 11px;
  line-height: 1.2;
}
.myBookSlide .flex-nav-prev {
  position: absolute;
  left: 5px;
  top: 50%;
  z-index: 2;
  margin: -20px 0 0;
}
.myBookSlide .flex-prev {
  position: relative;
  border: 5px solid #e0f2ff;
  text-indent: -9999em;
  display: block;
  width: 100%;
  height: 100%;
}
.myBookSlide .flex-prev:after,
.flex-prev:before {
  right: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.myBookSlide .flex-prev:after {
  border-color: rgba(255, 255, 255, 0);
  border-right-color: #e0f2ff;
  border-width: 10px;
  margin-top: -10px;
}
.myBookSlide .flex-prev:before {
  border-color: rgba(0, 125, 198, 0);
  border-right-color: #007dc6;
  border-width: 17px;
  margin-top: -17px;
}
.myBookSlide .flex-nav-next {
  position: absolute;
  right: 5px;
  top: 50%;
  z-index: 2;
  margin: -20px 0 0;
}
.myBookSlide .flex-next {
  position: relative;
  border: 5px solid #e0f2ff;
  text-indent: -9999em;
  display: block;
  width: 100%;
  height: 100%;
}
.myBookSlide .flex-next:after,
.flex-next:before {
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.myBookSlide .flex-next:after {
  border-color: rgba(255, 255, 255, 0);
  border-left-color: #e0f2ff;
  border-width: 10px;
  margin-top: -10px;
}
.myBookSlide .flex-next:before {
  border-color: rgba(0, 125, 198, 0);
  border-left-color: #007dc6;
  border-width: 17px;
  margin-top: -17px;
}

/* 20171116 add */
aside .movieQuality {
  background: #eee;
  padding: 10px;
  border-radius: 15px;
  margin: 10px 0 0;
}
aside .movieQuality > a {
  display: inline-block;
  background: #cfcfcf;
  color: #888 !important;
  border-radius: 10px;
  border: none !important;
  margin: 0 0 0 5px;
  padding: 10px 22px !important;
}
aside .movieQuality > a:first-child {
  margin: 0;
}
aside .movieQuality > a.on {
  background: #da656d;
  color: #fff !important;
  font-weight: bold;
}
aside .asideMenu_ul > li .new {
  background: url(/images/common/icon_n.png) no-repeat;
  width: 11px;
  height: 11px;
  display: inline-block;
  margin: -2px 0 0 3px;
  vertical-align: middle;
  background-size: 11px 11px;
}

/* check */
.radioBox {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  vertical-align: middle;
  position: relative;
  width: 24px !important;
  height: 24px !important;
  box-shadow: none;
  margin-right: 4px;
  border: 1px solid #aaa;
  border-radius: 2px;
}
.radioBox:before {
  content: "";
  position: absolute;
  left: 4px;
  top: 6px;
  width: 12px;
  height: 5px;
  border-width: 0 0 2px 2px;
  border-style: solid;
  border-color: #eee;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
.radioBox:checked:before {
  border-color: #fff;
}
.radioBox:checked {
  background: #3a7bd3;
  border-color: #3a7bd3;
}
/* .radioBox:checked{background-position:0 -33px;} */
#js_check:checked + label {
  font-weight: bold;
}

.radioBox.white {
  background-position: 0 -93px;
}
.radioBox:checked.white {
  background-position: 0 -117px;
}

.main_list1 {
  margin: 0 10px;
  overflow: hidden;
  border: 1px solid #d8d8d8;
  border-left: none;
  border-top: none;
}
.main_list1 li {
  float: left;
  border-left: 1px solid #d8d8d8;
  border-top: 1px solid #d8d8d8;
  padding: 15px 10px;
  background: url(/images/commonSub/renew/r_arrow.png) no-repeat 92% center;
  background-size: 7px auto;
}
.main_list1 li a {
  width: 100%;
  height: 100%;
}

.main_list1.w2 li {
  width: 50%;
}

.customerWrap {
  background: #555;
  border-top: 10px solid #e6e6e6;
  margin: 15px 0 0;
  overflow: hidden;
}
.customerWrap .article_top {
  text-align: center;
  padding: 15px 0;
}
.customerWrap .article_top .tit {
  display: inline-block;
  color: #fff;
  font-size: 18px;
  vertical-align: top;
  margin: 5px 15px 0 0;
  background: url(/images/commonSub/renew/sp_customer.png) no-repeat left 4px;
  background-size: 22px auto;
  padding: 0 0 0 26px;
}
.customerWrap .article_top .dec {
  display: inline-block;
  color: #aaa;
  text-align: left;
  font-size: 13px;
}
.customerWrap .article_btm {
  border-top: 1px solid #707070;
  overflow: hidden;
}
.customerWrap .article_btm dl {
  float: left;
  font-size: 13px;
  display: inline-block;
  border-left: 1px solid #707070;
  padding: 15px;
  min-height: 78px;
}
.customerWrap .article_btm dl:first-child {
  border-left: none;
  width: 25%;
}
.customerWrap .article_btm dl:first-child + dl {
  width: 32%;
}
.customerWrap .article_btm dt {
  color: #aaa;
}
.customerWrap .article_btm dd {
  color: #fff;
  margin: 8px 0 0;
}
.customerWrap .article_btm .last {
  text-align: center;
  width: 43%;
  padding: 15px 10px;
}
.customerWrap .article_btm .last dd {
  margin: 3px 0 0;
}
.customerWrap .article_btm .btnBox a {
  display: inline-block;
  color: #f6f7f9;
  border: 1px solid #f6f7f9;
  padding: 5px 10px;
  font-size: 11px;
}
.customerWrap .article_btm .btnBox a:first-child + a {
  margin: 0 0 0 -3px;
  border-left: none;
}

.recentviewedB {
  background: none;
  height: 58px;
}
.recentviewedB .inner {
  position: relative;
  text-align: center;
  height: 100%;
  width: 100%;
  padding: 13px 0 0;
}
.recentviewedB .inner .d_btm {
  z-index: 1;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
}
.recentviewedB .inner .btnBox {
  position: relative;
  z-index: 2;
}
.recentviewedB .inner .btnBox button:first-child {
  margin: 0;
}
.recentviewedB .inner .btnBox button {
  border: 1px solid #fff;
  font-size: 13px;
  min-width: 100px;
  margin: 0 0 0 3px;
  color: #fff;
  padding: 8px 10px;
  background: none;
  display: inline-block;
}

.btnBlueN {
  background: #3a7bd3;
  color: #fff;
  border-radius: 0 !important;
}

#layoutMain .tab03.blue li a {
  font-size: 15px;
}

.cont2 .btn_box_blue {
  background: #3a7bd3;
  color: #fff;
  display: inline-block;
  padding: 10px 20px;
  font-weight: bold;
}
.cont2 .btn_box_gray {
  background: #dbdbdb;
  color: #38393a;
  display: inline-block;
  padding: 10px 20px;
  font-weight: bold;
}

.btn_blueBox {
  background: #3a7bd3;
  color: #fff;
  padding: 5px 10px;
  font-size: 12px;
}

input[type="radio"] {
  width: 20px;
  height: 20px;
}

.btnBlueN {
  display: block;
  background: #3a7bd3;
  color: #fff;
  border-radius: 0;
  padding: 20px 20px;
  font-size: 14px;
  margin: 10px 0 0;
  font-size: 15px;
  font-weight: bold;
}

/* modal Popup */
.fixPop {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999999;
}
.fixPop .fixPop_area {
  position: absolute;
  left: 50%;
  top: 50%;
  background: #fff;
  font-size: 0;
  line-height: 0;
}
.fixPop .fixPop_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.75;
  -moz-opacity: 0.75;
  filter: alpha(opacity=75);
}
.fixPop_area {
  margin: 0 !important;
}
.fixPop_area img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-height: 350px;
}
.fixPop img {
  width: auto;
  max-width: 90vw;
}
/* 
#header{height:auto !important; background:#fff;}
#header > .inner{height:44px; overflow:hidden;}
 */

.my_100_info {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-bottom: 1px solid #d8d8d8;
}
.my_100_info li:first-child {
  border: none;
}
.my_100_info li {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  border-left: 1px solid #d8d8d8;
  padding: 10px 0;
}
.my_100_info li .a1 {
  color: #000;
  font-size: 14px;
}
.my_100_info li .a2 {
  color: #3a7bd3;
  font-size: 13px;
  font-weight: 700;
}

/* 초등, 키즈 무료체험 추가 */
.onlyone-ele-btn-2 {
  max-width: 100%;
  width: 260px;
  margin: 33px auto 0;
  height: 48px;
  background-color: #ed3535;
  border: none;
  border-radius: 5px;
  font-weight: 700;
  font-size: 18px;
  color: #fff;
  line-height: 43px;
  cursor: pointer;
  font-family: inherit;
  display: block;
}
.onlyone-ele-btn-2 span {
  color: #ffe763;
}
.onlyone-ele-btn-box {
  display: flex;
  justify-content: center;
  padding: 25px 0 0;
}
.onlyone-ele-btn-box > a,
.onlyone-ele-btn-box > button {
  display: flex;
  justify-content: center;
  align-items: center;
  word-break: keep-all;
  transition: 0.1s;
  margin-right: 7px;
  background: transparent;
  border-radius: 50px;
  font-weight: 500;
  border: 1px solid;
  height: 45px;
  padding: 0 15px;
  font-size: 12px;
}
.onlyone-ele-btn-box > a:last-child,
.onlyone-ele-btn-box > button:last-child {
  margin-right: 0;
}
.onlyone-ele-btn-box > .kid {
  border-color: #eaa500;
  color: #eaa500;
}
.onlyone-ele-btn-box > .ele {
  border-color: #3a84ea;
  color: #3a84ea;
}
.onlyone-ele-btn-box > a::after,
.onlyone-ele-btn-box > button::after {
  content: "";
  background: url(/brand/product/expEle/lib/images/link-icon.png) no-repeat 0
    0 / auto 11.5px;
  flex-shrink: 0;
  width: 11.5px;
  height: 11.5px;
  margin-left: 4px;
}
.onlyone-ele-btn-box > .kid::after {
  background-position: 0 0;
}
.onlyone-ele-btn-box > .ele::after {
  background-position: -11.5px 0;
}

.box_type01 {
  padding: 20px;
}
.box_type01 > .inner {
}
.box_type01 .txtlist_Type01 {
}
.box_type01 .txtlist_Type01 > li {
  text-indent: -12px;
  padding: 0 0 0 12px;
}

.blue {
  color: #0055be;
}

/* 2025/04/18 추가: 게시판 운영 개선 */
.note_operational_policy_txt {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  word-break: keep-all;
  text-indent: -15px;
  padding: 10px 10px 10px 25px;
  background: #f7f7f7;
}
.note_operational_policy_txt .txt {
  font-size: 13px;
}
.note_operational_policy_txt .btn_pop_operational_policy {
  background: #666;
  color: #fff;
  padding: 5px 10px;
  font-size: 13px;
  border-radius: 3px;
  margin: -10px 0 0;
}

#laypop_operational_policy {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
  display: none;
}
#laypop_operational_policy > .inner {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#laypop_operational_policy > .inner > .box {
  position: relative;
  transition: all 0.3s;
  max-width: 90vw;
  z-index: 2;
  background: #fff;
  color: #010101;
  word-break: keep-all;
}
#laypop_operational_policy > .inner > .box .popup-header {
  background: #000;
  color: #fff;
  padding: 10px 30px;
  height: 50px;
  font-size: 18px;
  position: relative;
  overflow: hidden;
}
#laypop_operational_policy > .inner > .box .popup-header .close-btn {
  position: absolute;
  width: 84px;
  height: 100%;
  top: 0;
  right: 0;
  cursor: pointer;
}
#laypop_operational_policy > .inner > .box .popup-header .close-btn::before,
.close-btn::after {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
  content: "";
  position: absolute;
  width: 2px;
  height: 32px;
  background-color: #fff;
}
#laypop_operational_policy > .inner > .box .popup-header .close-btn::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
#laypop_operational_policy > .inner > .box .popup-body {
  padding: 20px;
  font-size: 14px;
  color: #333;
  line-height: 1.5;
  overflow: auto;
  max-height: calc(100vh - 30vh);
}
#laypop_operational_policy > .inner > .box .popup-body .note1 {
  font-size: 14px;
  color: #333;
}
#laypop_operational_policy > .inner > .box .section {
  margin: 20px 0 0;
}
#laypop_operational_policy > .inner > .box .section .tit_group {
  display: flex;
  gap: 5px;
}
#laypop_operational_policy > .inner > .box .section .num {
  margin: 3px 0 0;
  background: #ff0000;
  color: #fff;
  font-weight: 700;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#laypop_operational_policy > .inner > .box .section .section-title {
  flex: 1;
  font-weight: 700;
  color: #010101;
  font-size: 14px;
  padding: 0 10px 0 0;
  line-height: 1.3;
}
#laypop_operational_policy > .inner > .box .boxed-list {
  border: 1px solid #000;
  padding: 5px 15px;
  margin: 8px 0 0 25px;
  border-radius: 4px;
  background: #f9f9f9;
}
#laypop_operational_policy > .inner > .box ul.policy-list {
  margin-top: 8px;
  padding-left: 10px;
}
#laypop_operational_policy > .inner > .box ul.policy-list li {
  position: relative;
  font-size: 14px;
  color: #010101;
}
#laypop_operational_policy > .inner > .box ul.policy-list li::before {
  content: "-";
  position: absolute;
  left: -12px;
}
#laypop_operational_policy > .inner > .box .tbl {
  margin: 20px 0 0;
  padding: 0 0 0 25px;
}
#laypop_operational_policy > .inner > .box .tbl table {
  width: 100%;
}
#laypop_operational_policy > .inner > .box .tbl table th,
#laypop_operational_policy > .inner > .box .tbl table td {
  border: 1px solid #999;
  padding: 5px;
  text-align: center;
  color: #010101;
}
#laypop_operational_policy > .inner > .box .tbl table th {
  background: #eee;
  font-size: 14px;
}
#laypop_operational_policy > .inner > .box .tbl table td {
  font-size: 14px;
}
#laypop_operational_policy > .inner > .box .tbl table td:last-child {
  text-align: left;
}
#laypop_operational_policy > .inner > .box .tbl .note2 {
  margin: 10px 0 0;
  font-size: 14px;
  color: #010101;
}
#laypop_operational_policy > .inner > .box .last_txt {
  margin: 10px 0 0;
  font-size: 14px;
  color: #010101;
  padding: 0 25px;
}
#laypop_operational_policy .dim {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  background: rgb(0 0 0 / 80%);
  z-index: 1;
}

#detail .form {
  position: relative;
}
#detail .form .byte {
  position: absolute;
  top: 36vw;
  right: 10vw;
  font-size: 13px;
  color: #999;
  font-family: "Pretendard";
}

/* 202505 중등개선 */
.lecture .cat {
  z-index: 9;
  top: 215px;
}
.lecture > .inner {
  position: relative;
  padding: 125px 14px 14px;
}
.lecture > .inner .cat_box.fixed {
  transition: all 0.3s;
}
.lecture > .inner .cat_box.fixed .toggle {
  bottom: -150px;
}
.lecture > .inner .cat_box.fixed .toggle.on {
  bottom: -50px;
}
.lecture .cat + .inner {
  padding: 175px 14px 14px;
}
.lecture > .inner .cat_box.fixed .toggle.type1 {
  bottom: -95px;
}
.lecture > .inner .cat_box.fixed .toggle.type1.on {
  bottom: -50px;
}
.sub_nav .btn_machine_service {
  background: #fff url(/images/sub/ico_machine_service.png) no-repeat left 12px
    center / 17%;
  color: #000;
  font-size: 13px;
  padding: 8px 13px 8px 41px;
  border-radius: 60px;
  line-height: 1;
}
.banner_school_e_pm {
  position: fixed;
  top: 110px;
  left: 0;
  width: 100%;
  height: 105px;
  z-index: 9;
  text-align: center;
}
.banner_school_e_pm img {
  height: 100%;
}

/* 수강중인 상품 정보  */
.lectureInfo {
  border-top: 1px solid #dfdfdf;
  border-bottom: 1px solid #dfdfdf;
  background: #f4f6f9;
  padding: 15px 21px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 15px;
  margin-top: 9px;
}
.lectureInfo dl {
  display: flex;
  flex-direction: column;
}
.lectureInfo dl dt {
  font-size: 12px;
  color: #000;
  font-weight: 600;
  margin-bottom: 5px;
}
.lectureInfo dl dd {
}
.lectureInfo dl dd p {
  font-size: 12px;
  color: #666;
  font-weight: 500;
  line-height: 1.4;
}
.lectureInfo dl dd p + p {
}
.lectureInfo dl dd .subs {
  display: flex;
  gap: 6px;
}
.lectureInfo dl dd .subs .tag {
  font-size: 10px;
  padding: 0px 5px 1px;
  border: 1px solid #000;
  border-radius: 6px;
  height: 17px;
  display: inline-flex;
  align-items: center;
  font-weight: 500;
}
.lectureInfo dl dd .subs .tag.kor {
  color: #ed6c1f;
  background: #ffe7d8;
  border-color: #ebd5c7;
}
.lectureInfo dl dd .subs .tag.eng {
  color: #ea4867;
  background: #ffe9ed;
  border-color: #ebd7da;
}
.lectureInfo dl dd .subs .tag.soc {
  color: #9160e5;
  background: #f3edff;
  border-color: #e0daeb;
}
.lectureInfo dl dd .subs .tag.sci {
  color: #0f95d3;
  background: #e4f7ff;
  border-color: #d2e4eb;
}
.lectureInfo dl dd .subs .tag.math {
  color: #0d9646;
  background: #dcfae9;
  border-color: #cbe6d7;
}