@charset "UTF-8";
@import url("font.css");
@import url("layout.css");

p,
dl,
dd,
ul {
  margin-bottom: 0;
}
ul {
  padding-left: 0;
}
a {
  color: var(--dark);
  text-decoration: none;
}
a:hover {
  color: var(--dark);
}
a:not([href]):not([class]),
a:not([href]):not([class]):hover {
  color: var(--dark);
  text-decoration: none;
}
li {
  list-style: none;
}
em,
i {
  font-style: normal;
}
.btn {
  font-family: var(--englab-font);
  padding: 13px 30px;
  letter-spacing: 1px;
  font-weight: 600;
  font-size: var(--font-size18);
}
.btn.btn-write {
  width: 100px;
}

td.left { text-align: left !important; }
td.right { text-align: right !important; }
td.center { text-align: center !important; }

.text-align-left { text-align: left !important; }
.text-align-right { text-align: right !important; }
.text-align-center { text-align: center !important; }

.w200{width: 200px !important;}
.w300{width: 300px !important;}

.c-blue{color: #0064d7;}
.c-red{color: #ff0000;}

.c-main{color: var(--englab-main);}
.c-sub1{color: var(--englab-sub1);}
.c-sub2{color: var(--englab-sub2);}
.c-sub3{color: var(--englab-sub3);}
.c-ello-main{color:var(--ello-main);}
.c-ello-sub{color:var(--ello-sub);}

.englab-common-bg{background: var(--englab-bg1);}

.input {
  padding: 7px 15px;
  font-size: var(--font-size14);
}
.select {
  padding: 7px 15px;
  font-size: var(--font-size14);
}
.input-lg {
  padding: 13px 18px;
}
.select-lg {
  padding: 13px 18px;
}
.text-muted {
  color: grey;
}

.guide-text-red {
  color: var(--red);
  display: block;
  padding-top: 10px;
}

.img-pc {
  display: block;
}
.img-mo {
  display: none;
}

.br-pc {
  display: block;
}
.br-ta {
  display: none;
}
.br-mo {
  display: none;
}

.container {
  padding: 50px 0 70px 0;
  max-width: 1200px;
  min-height: calc(100vh - 200px);
}

.table-bordered {
  margin-bottom: 0;
}
.table-bordered thead tr th {
  text-align: center;
  background: #f5f6f9;
}
.table-bordered tbody tr td {
  vertical-align: middle;
  text-align: center;
  padding: 10px 16px;
}
.table.table-bordered > :not(:first-child) {
  border-top: 1px solid #ced2e0;
}
.table .list-view tr td {
  font-size: 14px;
  padding: 20px 20px;
}
.table .list-view tr td.left {
  padding-left: 20px;
  padding-right: 20px;
  text-align: left;
}
.table .list-view tr td.mh200 {
  min-height: 200px;
}
.member-wrapper {
  min-height: calc(100vh - (70px * 2));
  padding: 0 30px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.member-wrapper .member-warp {
  width: 100%;
  max-width: 520px;
  padding: 50px 70px;
  border-radius: 30px;
  border: 1px solid #ced2e0;
  background: #fff;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);
}
.member-wrapper .member-warp .member-warp-title {
  font-size: var(--font-size18);
  font-weight: 700;
  text-align: center;
  margin-bottom: 20px;
}
.member-wrapper .member-warp .member-warp-title .logo {
  width: 300px;
  margin: 0 auto 10px auto;
}
.member-wrapper .member-warp .member-warp-title .logo img {
  width: 100%;
}
.member-wrapper .member-warp .member-warp-text {
  margin-bottom: 20px;
  word-break: keep-all;
  text-align: center;
}
.member-wrapper .member-warp .member-type {
  margin-bottom: 23px;
  display: flex;
  justify-content: center;
}
.member-wrapper .member-warp .member-input-group ul {
  margin-bottom: 10px;
}
.member-wrapper .member-warp .member-input-group ul li {
  margin-bottom: 10px;
}
.member-wrapper .member-warp .member-input-group .btn {
  height: 60px;
  font-weight: 600;
}
.member-wrapper .member-warp .member-input-group .form-control {
  width: 100%;
  font-size: var(--font-size16);
  height: 50px;
  padding: 0px 12px 0px 15px;
  border-radius: 4px;
  border: 1px solid #ced2e0;
  background: #fff;
}
.member-wrapper .member-warp .member-link {
  margin-top: 15px;
  font-size: var(--font-size15);
  color: #3f3f44;
  display: flex;
  justify-content: flex-start;
}
.member-wrapper .member-warp .member-link a:hover {
  color: var(--englab-main);
}
.member-wrapper .member-warp .member-link .find-password {
  margin-right: auto;
}
.member-wrapper .member-warp .form-check label {
  cursor: pointer;
}



.error-cont-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 60vh;
  padding-top: 50px;
}

.error-cont-wrapper .btn-warp{gap: 20px;}
.error-cont-area dl {
  text-align: center;
}
.error-cont-area dl dt {
  max-width: 500px;
  width: 70%;
  margin: 0 auto 30px auto;
}
.error-cont-area dl dt img {
  width: 100%;
}
.error-cont-area dl dd {
  font-size: var(--font-size16);
  padding: 0 30px;
  word-break: keep-all;
  line-height: 160%;
}
.error-cont-area .error-title{
  font-size: var(--font-size28);
  margin: 50px 0 20px 0;
  font-weight: 700;
}
.error-cont-area dl dd .btn {
  max-width: 200px;
  width: 100%;
}
.error-cont-area dl dd a {
  background: #fffecd;
  color: #000;
  display: inline-block;
  padding: 0 5px;
  border-radius: 3px;
}
.error-cont-area dl dd a:hover {
  color: #000;
}
.error-cont-area .btn-warp {
  margin-top: 50px;
}
.error-cont-area .btn-warp .btn{padding: 8px 20px;}

.find-data-warp {
  padding: 70px 30px 100px 30px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 100px;
}
.find-card-area {
  padding: 50px 30px;
  border-radius: 10px;
  border: 1px solid #ced2e0;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);
}
.find-card-area h3 {
  font-size: var(--font-size28);
  font-weight: 700;
  line-height: 100%;
  margin-bottom: 20px;
  text-align: center;
}
.find-card-area .login-card-input {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}
.find-card-area .login-card-input input {
  width: 300px;
  height: 50px;
  padding: 0px 12px 0px 15px;
}
.find-card-area .login-card-input button {
  margin-top: 10px;
}
.find-card-area .login-card-input em {
  font-size: 11px;
  color: var(--red);
  min-height: 31px;
}

.btn-warp {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 30px;
  align-self: stretch;
  margin-top: 50px;
}

.ispublic-check-area {
  display: inline-block;
}
.ispublic-check-box {
  position: relative;
  padding-left: 20px;
  display: inline-block;
}
.ispublic-check-box .ispublic-check {
  position: absolute;
  top: 3px;
  left: 0;
}
.question-tooltip {
  position: relative;
  display: inline-block;
  background: var(--englab-main);
  color: #fff;
  font-size: 10px;
  padding: 2px 5px 0px 5px;
  border-radius: 20px;
  cursor: pointer;
}
.question-tooltip .tooltip-content {
  visibility: hidden;
  min-width: 200px;
  max-width: 350px;
  border-radius: 5px;
  background-color: var(--englab-main);
  padding: 10px 15px;
  color: #fff;
  text-align: center;
  position: absolute;
  font-size: var(--font-size12);
  margin-top: 5px;
  z-index: 1;
  box-shadow: 0 17px 20px -18px rgba(0, 0, 0, 0.6);
  word-break: keep-all;
  font-weight: 400;
}
.question-tooltip:hover .tooltip-content {
  visibility: visible;
}
.question-tooltip.left .tooltip-content {
  top: -10px;
  right: 20px;
}

.guide-content-warp {
  display: flex;
  padding: 30px 0px 30px 0px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.cont-guide-area .icon-img-area {
  width: 230px;
  margin: 0 auto;
}
.cont-guide-area .icon-img-area img {
  width: 100%;
}
.cont-guide-area dl {
  max-width: 600px;
}
.cont-guide-area .guide-text {
  text-align: center;
}
.cont-guide-area .guide-text span {
  display: inline-block;
}
.cont-guide-area .guide-text .guide-text-box {
  border: 1px solid #ccc;
  background: #f8f8f8;
  padding: 15px 20px 10px 20px;
  border-radius: 10px;
  font-weight: 500;
  width: 100%;
}
.cont-guide-area .input-area {
  width: 100%;
  max-width: 400px;
}

.fix-quick-menu {
  position: fixed;
  bottom: 50px;
  right: 30px;
  z-index: 1;
  text-align: center;
  width: 90px;
}
.fix-quick-menu div:first-child {
  margin-bottom: 10px;
}
.fix-quick-menu .quick-img {
  width: 100%;
}

.join-step-warp {
  clear: both;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
.join-step-warp .join-type-warp {
  width: 900px;
  margin: 0 auto;
}
.join-step-warp .join-type-warp .join-type-area {
  float: left;
  width: 400px;
  margin: 0 25px;
}
.join-step-warp .join-type-warp .join-type {
  position: relative;
  border: 3px solid #e2e2e2;
  cursor: pointer;
  display: block;
  text-align: center;
  border-radius: 5px;
  width: 100%;
  padding: 40px 0;
  margin: 0 auto;
  margin: 0 0 30px 0;
}
.join-step-warp .join-type-warp .join-type .join-type-title p {
  font-size: var(--font-size14);
  margin-bottom: 30px;
}
.join-step-warp .join-type-warp .join-type .img-area {
  display: block;
  opacity: 0.4;
  filter: grayscale(100%);
  width: 100px;
  margin: 0 auto;
}
.join-step-warp .join-type-warp .join-type .img-area img {
  width: 100%;
}
.join-step-warp .join-type-warp .join-type:hover {
  border: 3px solid var(--englab-main);
  color: #000;
}
.join-step-warp .join-type-warp .join-type:hover .join-type-title h5 {
  color: var(--englab-main);
}
.join-step-warp .join-type-warp .join-type:hover .img-area {
  opacity: 1;
  filter: grayscale(0);
}

.join-policy-warp .join-commont {
  background: var(--gray-800);
  color: #fff;
  text-align: center;
  padding: 10px;
  margin-bottom: 10px;
}
.join-policy-warp .scroll-box-area {
  background: #f8f8f8;
  border: 1px solid #d5d5d5;
  padding: 30px 20px 20px 20px;
}
.join-policy-warp .scroll-box-area .scroll-box-tit {
  color: #202530;
  font-size: var(--font-size22);
  font-weight: 700;
  padding: 0 5px;
  margin-bottom: 7px;
}
.join-policy-warp .scroll-box-area .scroll-box-tit span {
  font-size: var(--font-size14);
  padding-left: 5px;
}
.join-policy-warp .scroll-box-area .scroll-box {
  background: #fff;
  border: 1px solid #d5d5d5;
  height: 200px;
  overflow: hidden;
  overflow-y: scroll;
}
.join-policy-warp .scroll-box-area .scroll-box .scroll-box-text {
  padding: 30px;
  font-size: var(--font-size14);
  line-height: 160%;
  font-family: var(--font-sans-serif);
}
.join-policy-warp .scroll-box-area .agree-area {
  margin-top: 7px;
  display: flex;
  justify-content: end;
  font-size: var(--font-size16);
}

.all-check-area {
  display: flex;
  padding-top: 20px;
  font-size: var(--font-size16);
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  align-self: stretch;
  border-top: 1px solid #ced2e0;
}
.mark-ess::after {
  content: "*";
  color: #ff0000;
  font-style: normal;
  padding-left: 5px;
}

.tab-menu {
  margin-bottom: 30px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.tab-menu a {
  display: block;
  flex: 1;
  height: 58px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: var(--englab-font);
  line-height: 100%;
  border: 1px solid #d5d5d5;
  border-right: none;
  color: rgba(0, 0, 24, 0.6);
  font-family: var(--englab-font);
  font-size: var(--font-size15);
  font-weight: 500;
  background: #fafafa;
}
.tab-menu a.on {
  border-top: 3px solid #000;
  height: 60px;
  background: #fff;
  font-weight: 700;
  border-bottom: none;
  font-size: var(--font-size16);
  color: #000;
}
.tab-menu a:last-child {
  border-right: 1px solid #d5d5d5;
}

.cont-guide-box {
  display: flex;
  padding: 25px 20px;
  word-break: keep-all;
  margin-bottom: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  border: 5px solid #ecf8de;
  background: #f5fcec;
}
.cont-guide-box .img {
  margin-bottom: 15px;
}
.cont-guide-box .text {
  font-size: var(--font-size16);
  font-weight: 500;
  line-height: 140%;
}
.cont-guide-box .text span {
  font-size: var(--font-size18);
  font-weight: 700;
}
.cont-guide-box .text p {
  font-size: var(--font-size14);
  font-weight: 400;
}

.membership-card-area-title {
  padding: 50px 0 0px 0;
  text-align: center;
  margin-bottom: 0;
  line-height: 120%;
  font-size: var(--font-size30);
  font-weight: 500;
}
.membership-card-area {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 기본: 3개 */
  gap: 16px;
  box-sizing: border-box;
}




.membership-card-area .membership-card {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e7edf5;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(13, 38, 76, 0.06);
  display: flex;
  flex-direction: column;
  min-height: 120px;
}
.membership-card .card-title {
  display: flex;
  padding: 10px 50px 0px 50px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-self: stretch;
}
.membership-card .card-title .course-type {
  display: flex;
  padding: 5px 15px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  background: #e6f0ff;
}
.membership-card .card-title h3 {
  display: flex;
  height: 60px;
  justify-content: center;
  align-items: center;
  font-size: var(--font-size20);
  margin-bottom: 0;
  font-weight: 500;
  line-height: 130%;
}
.membership-card .card-cont {
  padding: 20px 0px;
  width: 100%;
  height: 100%;
  border-bottom: 1px solid rgba(58, 137, 255, 0.2);
  font-size: var(--font-size16);
}
.membership-card .card-cont h3 {
  text-align: center;
  font-size: var(--font-size20);
  padding: 15px 30px 10px 30px;
  font-weight: 600;
  line-height: 130%;
}
.membership-card .card-cont ul {
  margin-left: 20px;
  padding: 0 50px;
}
.membership-card .card-cont ul li {
  padding-bottom: 10px;
  list-style-type: disc;
}
.membership-card .card-cont ul li:last-child {
  padding-bottom: 0px;
}
.membership-card .application-date {
  width: 100%;
  padding: 12px 0px 10px 0px;
  text-align: center;
  background: #f5f9ff;
  color: var(--englab-main);
  border-bottom: 1px solid rgba(58, 137, 255, 0.2);
  font-size: var(--font-size16);
  font-weight: 400;
  line-height: 150%;
}
.membership-card .card-foot {
  display: flex;
  padding: 15px 0px 20px 0px;
  justify-content: center;
  align-items: center;
  gap: 20px;
  align-self: stretch;
}
.membership-card .card-foot .attendance-status {
  font-size: var(--font-size16);
  line-height: 150%;
}
.membership-card .card-foot .btn {
  padding: 8px 20px;
}
.membership-card .card-foot .btn.off {
  cursor: default;
  background: var(--gray-300);
  border-color: var(--gray-300);
}
.membership-card .card-foot.attendance {
  background: #f5f9ff;
}
.attendance-status span {
  font-weight: 500;
  display: inline-block;
  padding-left: 10px;
}
.attendance-status .present {
  color: var(--blue);
}
.attendance-status .absent {
  color: var(--red);
}

.board-list {
  min-height: 500px;
}

.table-area table.two-area-column th {
  width: 20%;
  min-width: 120px;
}
.table-area table.two-area-column td {
  width: auto;
}
.table-area table {
  width: 100%;
  font-family: var(--font-sans-serif);
  border-top: 1px solid #dddddd;
}
.table-area table.top-line {
  border-top: 1px solid var(--gray-500);
}
.table-area table thead tr th {
  padding: 15px 10px;
  background: #f5f6f9;
  border-top: 1px solid #ced2e0;
  border-right: 3px solid #fff;
}
.table-area table thead tr th:last-child {
  border-right: 0;
}
.table-area table tbody tr {
  border-bottom: 1px solid #dddddd;
}
.table-area table tbody tr th {
  padding: 20px 10px;
  background: #f6f7f9;
  font-weight: 500;
}
.table-area table tr th,
.table-area table tr td {
  padding: 20px 0px;
  text-align: center;
}
.table-area table tr th {
  color: #202530;
  font-weight: 500;
  font-size: var(--font-size16);
}
.table-area table tr td {
  color: #222222;
  font-weight: 400;
  font-size: var(--font-size16);
}
.table-area table tr th.left,
.table-area table tr td.left {
  padding: 10px 20px;
  text-align: left;
}
.table-area table tr td.tit {
  font-size: var(--font-size16);
}
.table-area table tr td.number {
  color: rgba(34, 34, 34, 0.6);
}
.table-area table tbody tr.on td {
  background: rgba(255, 220, 40, 0.15);
  font-weight: 600;
}
.table-area table tbody tr.closing td {
  background: var(--gray-300);
  color: var(--gray-500);
}
.table-area table .company-name {
  font-weight: 500;
  display: inline-block;
  cursor: pointer;
}
.table-area table .company-name span {
  display: block;
}
.table-area table small {
  color: rgba(32, 37, 48, 0.3);
  font-size: var(--font-size12);
}
.table-area table tr.notice-top {
  border-top: 1px solid rgba(58, 137, 255, 0.2);
}
.table-area table tr.notice-top td {
  background: rgba(58, 137, 255, 0.07);
  font-weight: 500;
}
.table-area table.view {
  border-left: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
}
.table-area .form-control {
  height: 35px;
  padding: 9px 15px 7px 15px;
  font-size: var(--font-size13);
}
.table-area .form-control::placeholder {
  color: #a9aeb5;
}
.table-area .form-select {
  height: 35px;
  padding: 9px 40px 7px 15px;
  font-size: var(--font-size13);
}
.table-area .form-control.inline {
  display: inline-block;
}
.table-area .input-group .btn {
  height: 35px;
  padding: 0 30px;
  min-width: auto;
  font-weight: 500;
  font-size: var(--font-size14);
}

.table-in-form .only-text {
  height: 37.5px;
  line-height: 40px;
}
.table-in-form .form-check-label {
  line-height: 29px;
}
.table-in-form .form-check {
  margin-bottom: 0;
}

.join-step-box {
  padding: 0 0 30px 0;
}
.join-step-box ul {
  display: flex;
  justify-content: center;
  align-items: center;
}
.join-step-box ul li {
  width: 400px;
  position: relative;
}
.join-step-box ul.step-two li {
  width: 600px;
}
.join-step-box ul li .svg-area {
  z-index: 1;
  position: absolute;
  top: 1px;
  width: 22px;
  height: 48px;
  overflow: hidden;
}
.join-step-box ul li .svg-area.icon-right {
  right: -21px;
}
.join-step-box ul li .svg-area.icon-left {
  left: 0px;
}
.join-step-box ul li .svg-area svg {
  width: 23px;
  height: 48px;
  fill: #ffffff;
  stroke: #ced2e0;
}
.join-step-box ul li.on .svg-area.icon-right svg {
  width: 23px;
  height: 48px;
  fill: var(--englab-main);
  stroke: var(--englab-main);
}
.join-step-box .join-step {
  width: 100%;
  height: 50px;
  background: #fff;
  color: #b2b2ba;
  border: 1px solid #ced2e0;
  border-right: none;
  font-size: var(--font-size18);
  display: flex;
  justify-content: center;
  align-items: center;
}
.join-step-box .join-step .join-step-text {
  text-align: center;
  font-size: var(--font-size16);
  font-weight: 500;
}
.join-step-box .join-step .join-step-text strong {
  font-weight: 400;
  margin-bottom: 5px;
  padding-right: 5px;
}
.join-step-box li.on .join-step {
  color: #000018;
  background: var(--englab-main);
  color: #fff;
}
.join-step-box ul li.on svg.icon-right {
  fill: var(--englab-main);
  stroke: var(--englab-main);
}
.join-step-box ul li:last-child {
  border-right: 1px solid #ced2e0;
}

.join-step-warp {
  clear: both;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
.join-step-warp .join-type-warp {
  width: 900px;
  margin: 0 auto;
}
.join-step-warp .join-type-warp .join-type-area {
  float: left;
  width: 400px;
  margin: 0 25px;
}
.join-step-warp .join-type-warp .join-type {
  position: relative;
  border: 3px solid #e2e2e2;
  cursor: pointer;
  display: block;
  text-align: center;
  border-radius: 5px;
  width: 100%;
  padding: 40px 0;
  margin: 0 auto;
  margin: 0 0 30px 0;
}
.join-step-warp .join-type-warp .join-type .join-type-title p {
  font-size: var(--font-size14);
  margin-bottom: 30px;
}
.join-step-warp .join-type-warp .join-type .img-area {
  display: block;
  opacity: 0.4;
  filter: grayscale(100%);
  width: 100px;
  margin: 0 auto;
}
.join-step-warp .join-type-warp .join-type .img-area img {
  width: 100%;
}
.join-step-warp .join-type-warp .join-type:hover {
  border: 3px solid var(--englab-main);
  color: #000;
}
.join-step-warp .join-type-warp .join-type:hover .join-type-title h5 {
  color: var(--englab-main);
}
.join-step-warp .join-type-warp .join-type:hover .img-area {
  opacity: 1;
  filter: grayscale(0);
}


.term-box {
  background: #f8f8f8;
  border: 1px solid #d5d5d5;
  padding: 40px 30px 40px 30px;
  margin-top: 20px;
}
.term-box .term-cont {
  background: #fff;
  border: 1px solid #d5d5d5;
  padding: 40px;
  font-size: var(--font-size14);
  line-height: 160%;
}
.term-cont .tit {
  margin: 30px 0 10px 0;
  font-size: var(--font-size16);
}
.term-cont .tit:first-child {
  margin: 0 0 5px 0;
}
.term-cont .text-indent {
  padding: 5px 0px 5px 0px;
  font-size: var(--font-size14);
}
.term-cont .table {
  margin-top: 10px;
  border: 1px solid #ccc;
}
.term-cont .table th {
  background: #f8f8f8;
  text-align: center;
}
.term-cont .table td {
  text-align: center;
  border-right: 1px solid #ccc;
}
.term-cont .table th.tbl-tit {
  background: #f3f3f3;
  text-align: center;
  width: 150px;
  vertical-align: middle;
  line-height: 120%;
}
.term-cont .term-update-cont {
  margin-top: 20px;
}

.term-nav-box {
  background: #f3f3f3;
  border: 1px solid #ccc;
  padding: 10px 20px;
  margin: 10px 0;
}
.term-nav-box ul {
  clear: both;
  overflow: hidden;
}
.term-nav-box ul li {
  display: inline-block;
  width: 50%;
  float: left;
  padding: 5px 0;
}
.term-nav-box ul li a:hover {
  color: var(--englab-main);
}

.term-cont h5 {
  margin: 30px 0 0px 0;
  color: #132032;
}
.term-cont h5:first-child {
  margin: 0 0 0 0;
}
.term-cont h6 {
  margin: 30px 0 5px 0;
}
.term-cont h6.first-child {
  margin: 0 0 5px 0;
}

.article-area {
  min-height: 500px;
}
.article-area .article-header {
  border-bottom: 1px solid var(--gray-500);
  margin-bottom: 50px;
}
.article-area .article-header h3 {
  margin-bottom: 20px;
  font-weight: 600;
}
.article-area .article-header h3 em {
  color: var(--gray-500);
  padding-right: 10px;
}
.article-area .article-header .article-info {
  display: flex;
  padding-bottom: 20px;
  justify-content: space-between;
  align-items: flex-end;
  align-self: stretch;
}
.article-area .article-header .article-info p {
  vertical-align: bottom;
  font-size: var(--font-size16);
}
.article-area .article-header .article-info p > span:not(:last-child):after {
  content: "|";
  padding: 0 10px;
  color: var(--gray-500);
}
.article-area .answer-area {
  border: 1px solid var(--gray-300);
  margin-top: 50px;
}
.article-area .answer-area .answer-info {
  background: var(--gray-200);
  padding: 10px 20px;
}
.article-area .answer-area .answer-info p span {
  font-size: 0.875em;
  margin-left: 5px;
}
.article-area .answer-area .answer-content {
  padding: 0px 20px 0px 20px;
}

.article-btn-area {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  align-self: stretch;
}
.article-btn-area .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 38px;
  padding: 0 30px;
  line-height: 100%;
  min-width: auto;
  font-weight: 500;
}
.board-write-area .board-write-info {
  display: flex;
  padding: 10px 20px;
  margin-bottom: 10px;
  justify-content: space-between;
  align-items: flex-end;
  align-self: stretch;
  background: var(--gray-200);
  border: 1px solid var(--gray-300);
}
.board-write-area .board-write-info .write-author {
  display: inline-block;
}
.board-write-area .board-write-info .write-author input {
  display: inline-block;
  margin-left: 10px;
  width: 150px;
  background: #fff;
}
.board-write-content .board-write-title {
  padding: 10px 20px;
  margin-bottom: 10px;
}
.board-write-content .board-write {
  height: 300px;
  margin-top: 10px;
  padding: 20px;
}
.btn-listdata-del {
  width: 24px;
  height: 24px;
  display: inline-block;
  background: url(../images/icon_del.svg) no-repeat 50% 50%;
  background-size: 14px;
}
.w-auto {
  width: auto;
}

.carousel-cont {
  width: 100%;
  text-align: center;
}
.carousel-cont img {
  width: 100%;
  max-width: 1200px;
}

.modal-title {
  font-size: var(--font-size24);
  font-weight: 600;
}
.modal-body {
  padding: 30px;
}
.modal-footer {
  padding: 15px 20px;
}
.modal-footer .btn {
  padding: 8px 20px;
  width: auto;
  min-width: 120px;
}
.modal-footer.center {
  justify-content: center;
}
.modal .pop-find-id {
  text-align: center;
  font-size: var(--font-size16);
  padding: 20px 0;
}
.modal .pop-find-id p {
  margin-bottom: 15px;
}
.modal .pop-find-id .id-view {
  color: var(--englab-main);
  font-weight: 700;
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
  padding: 20px;
  background: rgba(58, 137, 255, 0.1);
  font-size: var(--font-size24);
}
.calendar-legend {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  font-size: 13px;
  line-height: 1.4;
  max-width: 400px;
  margin-right: 8px;
  white-space: normal;
}

.calendar-legend .legend-item {
  display: inline-flex;
  align-items: center;
  margin: 0; /* remove any outer margin */
  padding: 0; /* no extra padding */
  line-height: 1.3;
}

.calendar-legend .legend-item + .legend-item {
  margin-top: 0; /* ensure no vertical gap between them */
}

.calendar-legend .dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}


.calendar-srch-area {
  display: flex;
  height: 80px;
  padding: 0 30px;
  margin-bottom: 10px;
  justify-content: center;
  align-items: center;
  gap: 50px;
  align-self: stretch;
  border-radius: 10px;
  background: #0064d7;
}
.calendar-srch-area .form-area {
  flex: 1;
}
.calendar-srch-area .form-area label {
  margin-bottom: 0px;
  line-height: 100%;
  font-weight: 500;
}
.calendar-srch-area .form-area dl {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.calendar-srch-area .form-area dl {
  color: #fff;
  flex: 0;
  color: #fff;
  font-family: var(--englab-font);
  font-size: var(--font-size18);
  font-weight: 600;
  line-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.calendar-srch-area .form-area dl dd {
  flex: 1;
}

.legend-item-guide{text-align: right; margin-bottom: 30px;}

.join-step-warp .term-box {
  background: none;
  border: none;
  padding: 0px 0px 0px 0px;
  margin-top: 0px;
}
.join-step-warp .term-box .term-cont {
  background: #fff;
  border: none;
  padding: 0px;
  font-size: var(--font-size14);
  line-height: 160%;
}
.join-step-warp .term-box .term-cont h5 {
  display: none;
}
.join-step-warp .term-box .term-cont h6:first-child {
  margin: 0px 0 5px 0;
}
.join-step-warp .term-nav-box {
  display: none;
}

.qna-comment-area {
  padding: 0px 0px;
}
.qna-comment-area .table-bordered > :not(caption) > * {
  border-width: 0px 0;
}
.qna-comment-area .table-bordered td,
.qna-comment-area .table-bordered th {
  border: none;
}

.carousel-item.visualbg {
  aspect-ratio: 1920 / 700;
  width: 100%;
  max-height: 700px;
  padding: 0;
  margin: 0;
  background: #a7a7a8;
  background-size: cover;
  background-position: center;
  transition: opacity 0.5s ease-in-out;
}
.carousel-item.visualbg .carousel-cont {
  padding: 0 15%;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.carousel-item.visualbg .carousel-cont img {
  height: auto;
  display: block;
  margin: 0 auto;
}
.carousel-item {
  display: none;
}
.carousel-item.active {
  display: block;
}


#fcMoreModal .list-group-item {
  border: 1px solid #e9f3e6;
  border-radius: 12px;
  margin-bottom: 10px;
}

.fc-modal-item {
  padding: 8px 6px;
}
.fc-modal-item .time {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  color: #222;
  margin-bottom: 4px;
}
.fc-modal-item .time .dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #1976d2;
  display: inline-block;
}
.fc-modal-item .title {
  font-size: 1rem;
  color: #222;
  word-break: keep-all;
}

.class-info-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
}
.class-info-box h3 {
  text-align: center;
  font-size: var(--font-size24);
  font-weight: 600;
}
.class-info-text {
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
  border: 1px solid #ccc;
  padding: 17px 20px 15px 20px;
  background: #f6f6f6;
  border-radius: 12px;
}
.class-info-text dl {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 5px;
  font-size: var(--font-size16);
}
.class-info-text dl dt {
  color: #6c757d;
  font-weight: 400;
  width: 60px;
}
.class-info-text dl dd {
  font-weight: 600;
}

.day-event-emptybox {
  font-size: var(--font-size20);
  color: #6c747a;
  padding: 20px 0 30px 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: center;
  align-items: center;
}
.day-event-emptybox img {
  max-width: 120px;
}

.modal .btn-warp {
  margin-top: 30px;
}

.membership-status-box {
  font-family: var(--englab-font);
  margin-bottom: 30px;
  background: linear-gradient(0deg, #0556bf, #0661d4);
  border-radius: 14px;
  padding: 18px 22px 18px 40px;
  color: #e8f3ff;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.15) inset;
  width: min(1200px, 96vw);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.membership-status-box .title {
  color: #fff;
  font-size: var(--font-size18);
  line-height: 100%;
}
.membership-status-box .title .name {
  font-weight: 700;
}
.membership-status-box .title .name::after {
  content: " 선생님";
  font-weight: 500;
}
.membership-status-box .divider {
  width: 1px;
  height: 28px;
  background: rgba(255, 255, 255, 0.25);
}
.member-step-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
.member-step-area .step-progress-box {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}

.step-progress-box .step-box {
  position: relative;
  border: 1px solid #00aeff;
  display: inline-flex;
  height: 46px;
  padding: 3px 3px 3px 0;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border-radius: 6px;
}
.step-progress-box .step-box .node {
  font-size: var(--font-size28);
  color: rgba(0, 174, 255, 1);
  font-weight: 900;
  line-height: 100%;
  width: 50px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.step-progress-box .step-box .label {
  width: 65px;
  height: 40px;
  border-radius: 4px;
  background: #00aeff;
  color: #0064d7;
  display: flex;
  line-height: 100%;
  justify-content: center;
  align-items: center;
  font-size: var(--font-size18);
  font-weight: 600;
}
.step-progress-box .step-box .dot {
  position: absolute;
  top: 13px;
  left: -21px;
  z-index: 1;
  width: 30px;
  height: 20px;
  background: url(../images/stepbox_dot.png) no-repeat 50% 50%;
  background-size: cover;
}
.step-progress-box .step-box.active {
  border-color: #00dd25;
  background: #00dd25;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
}
.step-progress-box .step-box.active .node {
  color: #fff;
}
.step-progress-box .step-box.active .label {
  width: 80px;
  color: #fff;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.13);
  background-blend-mode: color-burn;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25) inset;
}
.step-progress-box .step-box.active .dot {
  background: url(../images/stepbox_dot_on.png) no-repeat 50% 50%;
  background-size: cover;
}

.member-badge-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.member-badge-area .badge-title {
  text-align: center;
  line-height: 100%;
}
.member-badge-area .badge-title .name {
  display: block;
  font-size: var(--font-size24);
  line-height: 30px;
  font-weight: 700;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  padding-top: 5px;
  margin-bottom: 5px;
}
.member-badge-area .badge-title .name::after {
  content: " 선생님";
  font-weight: 500;
}
.member-badge-area .badge-title p {
  font-size: var(--font-size18);
  font-weight: 700;
  padding: 5px 0;
}
.member-badge-area .badge-title small {
  font-size: 10px;
}
.member-badge-area .badge {
  width: 60px;
  height: 60px;
  padding: 0 0 0 0;
  position: relative;
  display: grid;
  place-items: center;
}
.member-badge-area .badge img {
  width: 100%;
}

.badge-slider-area {
  width: min(1200px, 96vw);
  margin: 24px auto;
  position: relative;
}
.badge-slider-area .sub-title {
  font-family: var(--englab-font);
  font-size: var(--font-size18);
  font-weight: 700;
  margin-bottom: 0;
}
.badge-slider-area .sub-title .counting {
  font-weight: 600;
}
.badge-slider-area .sub-title .counting::before {
  content: "(";
}
.badge-slider-area .sub-title .counting::after {
  content: ")";
}
.badge-slider-area .swiper {
  padding: 8px 44px;
}
.badge-slider-area .swiper-slide {
  height: 128px;
  display: grid;
  place-items: center;
}
.badge-slider-area .badge-img {
  width: 120px;
  height: 120px;
  object-fit: contain;
  display: block;
  filter: none;
}
.badge-slider-area .badge-img.obtainable {
  filter: grayscale(0.9) contrast(1.05) brightness(1.02);
  opacity: 0.4;
}
.badge-slider-area .badge-unknown {
  width: 110px;
  height: 110px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #eaf4ff;
}
.badge-slider-area .badge-unknown i {
  font-style: normal;
  font-weight: 900;
  font-size: var(--font-size50);
  color: #ffffff;
}
.badge-slider-area .swiper-button-prev:after,
.badge-slider-area .swiper-button-next:after {
  font-size: var(--font-size36);
  font-weight: 700;
  color: #9aa3b2;
}
.badge-slider-area .swiper-pagination-bullets .swiper-pagination-bullet {
  background: #cbd7ee;
  opacity: 1;
  width: 6px;
  height: 6px;
}
.badge-slider-area .swiper-pagination-bullet-active {
  background: #7ea7ff;
}

.class-attendance-box {
  width: 100%;
  max-width: 600px;
  margin: 70px auto 0px auto;
}
.class-attendance-title {
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
  padding: 0 0px 30px 0px;
  text-align: center;
}
.class-attendance-title dt {
  font-size: var(--font-size30);
  font-weight: 700;
  word-break: keep-all;
  line-height: 140%;
}
.class-attendance-title dd {
  margin: 0 0 0 0;
  font-weight: 500;
  word-break: keep-all;
  color: #7d7f8d;
}
.class-attendance-title dd .sub-box {
  font-size: var(--font-size18);
  background: #9fa2b8;
  word-break: keep-all;
  color: #fff;
  border-radius: 6px;
  padding: 3px 16px;
  display: inline-block;
}
.class-attendance-title dd .sub-box .sort::before { content: "|"; padding: 5px; }
.class-attendance-title dd .sub-box .sort:first-child::before { display: none; }
.class-attendance-form { padding: 0 50px; }
.class-attendance-form .form-floating > label { font-size: var(--font-size16); }
.class-attendance-form .form-floating > .form-control:focus,
.class-attendance-form .form-floating > .form-control:not(:placeholder-shown) { padding-top: 2rem; }

.register-guide h5{font-family: var(--englab-font); font-size: var(--font-size24); margin-bottom: 15px; font-weight: 600; display: flex; text-align: center; flex-direction: column; align-items: center; gap: 10px;}
.register-guide h5 span{background: var(--englab-main); font-size: var(--font-size16); line-height: 100%; display: inline-block; padding: 6px 10px 4px 10px; color: #fff; border-radius: 30px;}
.register-guide .register-guide-title{padding: 30px 0 10px 0; font-size: var(--font-size30);}
.register-guide .guide-table{width:100%; border-collapse:collapse; table-layout:fixed; border:1px solid #ddd; background:#fff;}
.register-guide .guide-table th, .register-guide .guide-table td{border:1px solid #d9d9d9; padding:10px 12px; vertical-align:middle; word-break:keep-all;}
.register-guide .guide-table thead th{background:#f4f6f8; text-align:center; font-weight:700;}
.register-guide .guide-table thead th.sub-th{ line-height: 120%; font-weight: 500; padding: 7px 6px;}
.register-guide .guide-table tbody th{background:#fafafa; font-weight:600; text-align: center;}
.register-guide .guide-table tbody td.td-point{text-align: left; font-weight: 600;}
.register-guide .guide-table .request-check-box{height: 40px; display: flex; align-items: center; justify-content: center;background: url(../images/request_check.svg) no-repeat 50% 50%; background-size: 40px;}
.register-guide .guide-table .request-check-box.active{background: url(../images/request_check_on.svg) no-repeat 50% 50%; background-size: 40px;}

.table-in-cont .document{padding-left: 15px;}
.table-in-cont .document li{ list-style: decimal; padding: 5px 0;}
.table-in-cont .document li ol { padding-left: 0; margin-bottom: 0; }
.table-in-cont .document li ol li { list-style: none; line-height: 1.4; position: relative; padding:0 0 0 14px; text-indent: 0; margin: 3px 0; }
.table-in-cont .document li ol li::before { content: '-'; position: absolute; left: 0; top: -1px; color: inherit; }

.register-guide table.subtbl{width:100%; border-collapse:collapse; border:1px solid #ccc; margin:.35rem 0 .6rem;}
.register-guide table.subtbl th, .register-guide table.subtbl td{border:1px solid #ccc; text-align: center; padding:8px 10px; background: #fff;}
.register-guide table.subtbl th{font-weight: 600; background: #FBFCFF;}
.register-guide table.subtbl td.left{text-align: left;}
.register-guide table.subtbl thead th{background:#EFF0F3;}

.register-guide .app-btn{display:inline-block; cursor: pointer; padding: 3px 12px; border-radius:6px; background:#eff5ff; color:var(--englab-main); border:1px solid var(--englab-main); font-weight:700; font-size:var(--font-size13); margin-top: 10px;}

.linline-align-area{display: flex; justify-content: flex-start; align-items: center; gap: 10px;}




/*********************************************************/

.mobile-image-slider {
  display: none;
}

.modal-report-viewr{width: 100%;}
.modal-report-viewr img{width: 100%;}

.modal.layerpopup .modal-content{background: none; border: none;}
.modal.layerpopup .modal-body{padding: 0 0 0 0;}
.modal.layerpopup .modal-body img{width: 100%;}
.modal.layerpopup .modal-footer{background: #fff; padding: 4px 10px; justify-content: space-between; align-items: center;}
.modal.layerpopup .modal-footer .form-check{display: flex; justify-content: flex-start; align-items: center; gap: 5px;}
.modal.layerpopup .modal-footer .form-check .form-check-label{line-height: 100%;}
.modal.layerpopup .modal-footer .form-check .form-check-input{margin-top: 0;}

.btn-icon{display: inline-flex; justify-content: center; align-items: center; gap: 20px;}
.btn-icon .icon{display: inline-block; width: 24px; height: 24px; background: url(../images/icon/arrow_right.svg) no-repeat 50% 50%; background-size: cover;}

.main-warp{margin-top: 70px;}
.main-section{display: flex; justify-content: center; align-items: center; flex-direction: column;}
.main-section .content{padding: 150px 0; width: 100%; max-width: 1200px; display: flex; flex-direction: column; gap: 70px;}


.sub-section{display: flex; justify-content: center; align-items: center; flex-direction: column;}
.sub-section .content{padding: 100px 0; width: 100%; max-width: 1200px;}
.sub-section .lab-meaning-area{padding: 100px 0; width: 100%; max-width: 1200px;}
.sub-section.textbook-part01 .content{padding-top: 30px;}

.main-section.main-part01{background: url(../images/main_section01_bg.jpg) no-repeat; background-size: cover;}
.main-section.main-part01 .blog-link-mo{display: none;}

.two-areas{display: flex; justify-content: space-between; align-items: center; width: 100%;}
.hero-copy .text {color: var(--englab-main); font-family: var(--englab-font); font-size: 48px; font-weight: 700; line-height: 120%; margin-bottom: 30px; }
.video-card { position: relative; border-radius: 24px; width: 100%; max-width: 700px; height: 394px; overflow: hidden; background: #000; box-shadow: 0 18px 50px rgba(0,0,0,.15); }
.video-box { position: relative; }
.video-box video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.video-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; transition: 0.25s ease; }
.overlay-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.9; }
.play-button { pointer-events: auto; width: 92px; height: 92px; border-radius: 50%; background: rgba(255, 255, 255, 0.92); border: 0; cursor: pointer; display: grid; place-items: center; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25); transition: transform 0.2s ease; transform: scale(1.05); }
.icon-triangle { width: 0; height: 0; border-left: 24px solid #333; border-top: 14px solid transparent; border-bottom: 14px solid transparent; margin-left: 6px; }
.video-card.is-playing .video-overlay { opacity: 0; visibility: hidden; }

/* 기본 버튼 */
.video-sound-toggle {
  position: absolute;
  right: 100px;
  bottom: 10px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background-color: rgba(0, 0, 0, 0.5);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px;
  cursor: pointer;
  transition: background-color .2s ease;
}

/* 기본 (음소거) 상태 → muted 아이콘 */
.video-sound-toggle.is-muted {
  background-image: url("../images/icon_sound__muted.svg");
}

/* 소리 켜짐 상태 → unmuted 아이콘 */
.video-sound-toggle:not(.is-muted) {
  background-image: url("../images/icon_sound__unmuted.svg");
}


.main-title{display: flex; flex-direction: column; align-items: center; align-self: stretch; color: #1F1D1C; text-align: center; word-break: keep-all; font-family: var(--englab-font); font-size: var(--font-size48); font-weight: 700; line-height: 120%;}
.main-title.white{color: #fff;}
.main-title span{font-size: var(--font-size36); font-weight: 400;}
.main-title span em{text-decoration: underline;}
.main-title p{margin: 0;}

.main-title.sub{ font-size: var(--font-size40); gap: 10px;}
.main-title.sub span{ font-size: var(--font-size24); font-weight: 500;line-height: 140%;}

.card-list-inline{ position: relative; display: flex; width: 100%; max-width: 1200px; align-items: flex-start; gap: 64px;}*/
.main-part02 .card-list-inline { display: flex; justify-content: space-between; gap: 20px; }
.main-part02 .card-list-inline .main-part02-card {flex: 1;}

.main-description-area .main-description-card::after{content: ''; width: 24px; height: 54px; position: absolute; right: -45px; top: 50%; transform: translateY(-50%); }
.main-description-area .main-description-card:last-child::after{display: none;}
.main-features-cont01 .main-description-card::after{background: url(../images/space_icon_part01.svg) no-repeat; background-size: cover;}
.main-features-cont02 .main-description-card::after{background: url(../images/space_icon_part02.svg) no-repeat; background-size: cover;}
.main-features-cont03 .main-description-card::after{background: url(../images/space_icon_part03.svg) no-repeat; background-size: cover; width: 30px; height: 30px; right: -49px;}


.main-part02-card{display: flex; padding: 20px 20px 40px 20px; flex-direction: column; align-items: center; flex: 1 0 0; border-radius: 24px; border: 1px solid var(--englab-main); background: #FFF; box-shadow: 0 14px 24px 0 rgba(0, 0, 0, 0.05);}
.main-part02-card .image{width: 100%; height: 136px;}
.main-part02-card .image img{width: 100%;}
.main-part02-card .text{word-break: keep-all; color: #1F1D1C; text-align: center; font-size: var(--font-size20); font-weight: 600; line-height: 140%; padding: 0 30px;}

.main-section.main-part03{background: url(../images/main_section03_bg.jpg) no-repeat 50% 0%; background-size: cover;}
.main-section.main-part03 .content{gap: 0px;}
.worry-interview-box{position: relative; width: 100%; height: 500px; text-align: center; background: url(../images/main_section03_cont01_bg.jpg) no-repeat 50% 50%; background-size:cover;display: flex; justify-content: center; align-items: center; }
.worry-interview-box .center-text{color: #6266F2; font-family: var(--englab-font); font-size: var(--font-size36); font-weight: 700; line-height: 120%;}
.worry-interview-box .chat-left.worry-bubble{left: 0;}
.worry-interview-box .chat-right.worry-bubble{right: 0;}
.worry-interview-box .worry-bubble{position: absolute;}
.worry-interview-box .worry-bubble.interview01{top: 50px; left: 100px;}
.worry-interview-box .worry-bubble.interview02{top: 190px;}
.worry-interview-box .worry-bubble.interview03{top: 330px; left: 120px;}
.worry-interview-box .worry-bubble.interview04{top: 50px; right: 100px;}
.worry-interview-box .worry-bubble.interview05{top: 178px;}
.worry-interview-box .worry-bubble.interview06{top: 300px; right: 120px;}


.chat-bubble{ display:flex; align-items:center; text-align: left; max-width:600px; gap:20px; color: #000; font-family: var(--englab-font); font-size: var(--font-size16); font-weight: 400; line-height: normal; }
.chat-bubble .avatar{ width:60px; height:60px; border-radius:50%; overflow:hidden; flex-shrink:0; animation: floatBubble 3.5s ease-in-out infinite; animation-delay: .3s;}
.chat-bubble .avatar img{ width:100%; height:100%; object-fit:cover; }
.chat-bubble .bubble{animation: floatBubble 3s ease-in-out infinite; position:relative; background:#fff; border-radius:30px; padding:18px 22px; font-size:18px; word-break: keep-all; line-height:1.4; z-index:1; box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.24); }


.chat-bubble.interview01 .bubble{max-width: 350px;}
.chat-bubble.interview02 .bubble{max-width: 350px;}
.chat-bubble.interview03 .bubble{max-width: 300px;}
.chat-bubble.interview04 .bubble{max-width: 340px;}
.chat-bubble.interview05 .bubble{max-width: 345px;}
.chat-bubble.interview06 .bubble{max-width: 240px;}

.chat-left .bubble::before{ content:""; position:absolute; left:-18px; top:35%; width:0; height:0; border:10px solid transparent; border-right-color:#fff; z-index:-1; }
.chat-right .bubble::before{ content:""; position:absolute; right:-18px; top:35%; width:0; height:0; border:10px solid transparent; border-left-color:#fff; z-index:-1; }
.chat-left{ flex-direction:row; }
.chat-right{ flex-direction:row-reverse; }

@keyframes floatBubble {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-6px); }
  100% { transform: translateY(0px); }
}

.ello-guide-area{margin-top: 70px; display: flex; justify-content: center; align-items: center; gap: 100px;}
.ello-guide-box{display: flex; width: 450px; padding: 50px 0 40px 0; flex-direction: column; align-items: center; gap: 30px; flex-shrink: 0; border-radius: 30px; background: #6468F3;}
.ello-guide-box .ello-title{color: #FFF; text-align: center; font-family: var(--englab-font); font-size: var(--font-size20); font-weight: 600;}
.ello-guide-box .ello-title p{ font-size: var(--font-size36); line-height: 130%;}
.ello-guide-box .ello-title span{ font-size: var(--font-size16); font-weight: 300;}
.ello-guide-btn{margin: 50px auto 0 auto; display: flex;}
.ello-guide-btn .btn-light{color: var(--englab-sub1);}
.ello-guide-btn .btn-icon .icon{background: url(../images/icon/arrow_right2.svg); background-size: contain;}

.problem-solving-title{color: #FFF; text-align: center; font-family: var(--englab-font); font-size: var(--font-size32); font-weight: 700; line-height: 120%;}
.problem-solving-title p{font-size: var(--font-size24); font-weight:500; letter-spacing: normal;}

.hybrid-system-wrap{display: flex; flex-direction: column; gap: 50px;}
.hybrid-system-banner{ border:6px solid #F08300; border-radius:0 50px 0 50px; display:flex; align-items:stretch; overflow:hidden; }
.hybrid-system-left{ position:relative; background: linear-gradient(114deg, #F08300 0%, #F08300 85%, #fff 85%); color:#fff; display:flex; align-items:center; gap:16px; min-width:500px; }
.hybrid-system-left-text{ font-size:var(--font-size24); line-height:1.5; font-weight:500; }
.hybrid-system-avatar{ width:150px; height:150px; overflow:hidden; flex-shrink:0; }
.hybrid-system-avatar img{ width:100%; height:100%; object-fit:cover; }
.hybrid-system-right{ flex:1; background:#fff; padding: 20px 30px 20px 0px; display:flex; flex-direction:column; justify-content:center; align-items: flex-start; font-size:18px; line-height:1.7;}
.hybrid-system-right ul{ margin:0; padding:0; list-style:none; }
.hybrid-system-right li{ display:flex; align-items: center; gap:10px; text-align: left; color: #000; font-size: var(--font-size24); font-weight: 700; line-height: 100%; letter-spacing: -0.52px; }
.hybrid-system-right li + li{margin-top:8px;}

.point-check{width: 37px; height: 37px; background: url(../images/icon/point_check.svg) no-repeat; background-size: cover;}

.main-section.main-part05{background: url(../images/main_section05_bg.jpg) no-repeat 50% 50%; background-size: 1920px;}
.main-part05-cont{display:flex; align-items: center; justify-content:center;}
.main-part05-cont .main-part05-area{width: 100%; max-width: 1200px;}
.main-part05-cont .main-part05-area img{width: 100%;}
/*
.main-part05-area{width: 100%; max-width: 1200px; display:flex; align-items: center; justify-content: space-between; background: url(../images/main_section05_img01.png) no-repeat 50% 50%; background-size: cover;}
.main-part05-area .main-part05-card{width: 33.3333%; text-align: center;}
.main-part05-area .main-part05-card dl{color: #000; text-align: center; font-size: var(--font-size20); line-height: 140%;}
.main-part05-area .main-part05-card dl dt{ font-size: var(--font-size28); font-weight: 700; line-height: 120%; padding-bottom: 10px;}
.main-part05-area .main-part05-card dl dt p{margin-bottom: 20px;}
*/




.routine-star {
  display: inline-block;
  width: 40px;
  height: 40px;
  margin-bottom: 26px;
}
.routine-star--pink{
  background: url(../images/routine_point_pink.svg) no-repeat;
  background-size: 100%;
}
.routine-star--purple{
  background: url(../images/routine_point_purple.svg) no-repeat;
  background-size: 100%;
}
.routine-star--blue{
  background: url(../images/routine_point_blue.svg) no-repeat;
  background-size: 100%;
}

.englab-english-routine-box {
  background: url(../images/englab_english_routine_bg.png) no-repeat 50% 50%;
  background-size: contain;
}

.englab-english-routine-box ul {
  display: flex;
  justify-content: center;
  align-items: stretch; padding: 15px 15px;
}

.englab-english-routine-box ul li {
  flex: 1;
  max-width: 33.333%;
  display: flex;
  justify-content: center;
}

/* 텍스트 컨텐츠 */
.englab-english-routine-box .routine-content {
  flex: 1;
  position: relative;
  text-align: center;
  width: 400px;
  height: 400px;
  display: flex; 
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding-bottom: 20px;
}

.englab-english-routine-box .routine-content h3 {
  color: #000;
  font-size: 28px;
  font-weight: 800;
  line-height: 120%;
}

.englab-english-routine-box .routine-content p {
  color: #000;
  font-size: 18px;
  font-weight: 500;
  line-height: 140%;
  margin-top: 10px;
}



.main-section.main-part0501{background: url(../images/main_section0501_bg.jpg) no-repeat 50% 0%; background-size: cover;}
.main-section.main-part0501 .btn-primary{background: var(--englab-sub2); border-color: var(--englab-sub2); height: 60px;}
.main-section.main-part0501 .btn-primary .icon{background: url(../images/icon/arrow_right_white.svg);}

.main-section.main-part0502{background: url(../images/main_section0502_bg.jpg) no-repeat 50% 0%; background-size: cover;}
.main-section.main-part0502 .btn-primary{background: var(--englab-sub1); border-color: var(--englab-sub1); height: 60px;}
.main-section.main-part0502 .btn-primary .icon{background: url(../images/icon/arrow_right_white.svg);}

.main-section.main-part0503{background: url(../images/main_section0503_bg.jpg) no-repeat 50% 0%; background-size: cover;}
.main-section.main-part0503 .btn-primary{background: var(--englab-sub2); border-color: var(--englab-sub2); height: 60px;}
.main-section.main-part0503 .btn-primary .icon{background: url(../images/icon/arrow_right_white.svg);}

.main-description-area{display: flex; flex-direction: column;align-items: center;}
.main-description-card{display: flex; position: relative; padding: 40px 0; flex-direction: column; align-items: center; gap: 30px; flex: 1 0 0;border-radius: 16px; border: 1px solid #FFF; background: #FFF; box-shadow: 0 0 36px 0 rgba(0, 0, 0, 0.10);}
.main-description-card .title{color: #000; text-align: center; font-size: var(--font-size26); font-weight: 700; line-height: 120%;}
.main-description-card .title p{display: flex; padding: 6px 0; line-height: 100%; width: 160px; margin-bottom: 12px; justify-content: center; align-items: center; border-radius: 0 10px; background: #645158; color: #FFF; font-size: var(--font-size16); font-weight: 600;}
.main-description-card .image{width: 160px; height: 160px; border-radius: 160px; overflow: hidden; aspect-ratio: 1/1;}
.main-description-card .image img{width: 100%;}
.main-description-card .text{color: #000; text-align: center; font-size: 16px; font-weight: 500; line-height: 140%; word-break: keep-all;}
.main-description-card .text ul li{list-style: disc; text-align: left;}


.main-section.main-part06{background: url(../images/main_section06_bg.jpg) no-repeat 50% 0%; background-size: cover;}
.main-part06-cont{ display: flex; width: 100%; max-width: 1200px; align-items: center; align-content: center; gap: 40px; flex-shrink: 0; flex-wrap: wrap;}
.main-part06-graph{width: 100%; max-width: 1200px; padding: 0 30px;}
.main-part06-graph ul{display: flex; align-items:flex-end; justify-content: space-between;}
.main-part06-graph ul li{text-align: center; font-family: var(--englab-font); font-size: 20px; font-weight: 700; line-height: 100%;}
.main-part06-graph ul li dl dt img{width: 100%;}
.main-part06-graph ul li dl dd{padding-top: 20px;}

.main-part06-graph ul li:nth-child(1) dl dd{ color: #5D6691; }
.main-part06-graph ul li:nth-child(2) dl dd{ color: #5A6AB7; }
.main-part06-graph ul li:nth-child(3) dl dd{ color:#415ACF; }
.main-part06-graph ul li:nth-child(4) dl dd{ color: #8285FF; }
.main-part06-graph ul li:nth-child(5) dl dd{ color: #6F7BFF; }
.main-part06-graph ul li:nth-child(6) dl dd{ color:#4554FA; }
.main-part06-graph ul li:nth-child(7) dl dd{ color:#6266F2; }

.main-part06-mo-imgbox{display: none;}



.rs-fluency-curriculum { width: 100%; padding: 60px 0; }

.rs-fluency-curriculum__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.rs-fluency-curriculum__levels {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.rs-fluency-curriculum__level {
  flex: 1;
  background: #5e6cff;
  border-radius: 6px;
  color: #fff;
  text-align: center;
  padding: 20px 10px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 13px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.08);
}

.rs-fluency-curriculum__level--step1 { height: 240px; background: #5D6691; }
.rs-fluency-curriculum__level--step2 { height: 270px; background: #5A6AB7; }
.rs-fluency-curriculum__level--step3 { height: 300px; background: #415ACF; }
.rs-fluency-curriculum__level--step4 { height: 330px; background: #8285FF; }
.rs-fluency-curriculum__level--step5 { height: 360px; background: #6F7BFF; }
.rs-fluency-curriculum__level--step6 { height: 390px; background: #4554FA; }
.rs-fluency-curriculum__level--step7 { height: 420px; background: #6266F2; }

.rs-fluency-curriculum__level--step7 {  position: relative; overflow: visible; }

.rs-fluency-curriculum__level--step7::before {
  content: "";
  position: absolute;
  top: -60px;                /* 삼각형 높이 */
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;

  border-left: 90px solid transparent;
  border-right: 90px solid transparent;
  border-bottom: 70px solid #6266F2;
}

.rs-fluency-curriculum__cefr-label {
  font-size: 18px;
  opacity: 0.7;
  display: block;
  margin-bottom: 6px;
}

.rs-fluency-curriculum__cefr-level {
  display: block;
  padding: 10px 0;
  background: rgba(0, 0, 0, 0.15);
  border-radius: 5px;
  font-size: 20px;
  font-weight: 700;
}

.rs-fluency-curriculum__title {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 8px;
}

.rs-fluency-curriculum__desc {
  list-style: none;
  padding: 0;
  margin: 0;
  opacity: 0.8;
  font-size: 14px;
  line-height: 1;
}

.rs-fluency-curriculum__desc li {
  margin-bottom: 6px; line-height: 1.2;
}

.rs-fluency-curriculum__step {
  position: absolute;
  bottom: -40px;
  left: 0;
  width: 100%;
  text-align: center;
}

.rs-fluency-curriculum__step span { font-size: 22px; font-weight: 600; color: #5b5b5b; font-family: var(--englab-font);}
.rs-fluency-curriculum__level--step1 .rs-fluency-curriculum__step span{color: #5D6691; }
.rs-fluency-curriculum__level--step2 .rs-fluency-curriculum__step span{color: #5A6AB7; }
.rs-fluency-curriculum__level--step3 .rs-fluency-curriculum__step span{color: #415ACF; }
.rs-fluency-curriculum__level--step4 .rs-fluency-curriculum__step span{color: #8285FF; }
.rs-fluency-curriculum__level--step5 .rs-fluency-curriculum__step span{color: #6F7BFF; }
.rs-fluency-curriculum__level--step6 .rs-fluency-curriculum__step span{color: #4554FA; }
.rs-fluency-curriculum__level--step7 .rs-fluency-curriculum__step span{color: #6266F2; }




.main-section.main-part07{background: var(--ello-main);}
.main-section.main-part07 .btn-primary{height: 60px; color: var(--ello-main);}
.main-section.main-part07 .btn-primary .icon{background: url(../images/icon/arrow_ello_main.svg);}
.main-part07-cont{display: flex; flex-direction: column; align-items: center; text-align: center;}
.main-part07-cont dl{color: #FFF; text-align: center; font-size: 48px; font-weight: 700; line-height: 130%;}
.main-part07-cont dl dd{ font-size: 20px; font-weight: 400; line-height: 160%; margin-top: 10px;}
.main-part07-cont p{color: #FFF; text-align: center; font-size: 48px; font-weight: 700; line-height: 130%; margin: 0 0 0 0;}

.main-section.main-part08{background: url(../images/main_section08_bg.jpg) no-repeat 50% 0%; background-size: cover;}
.main-section.main-part08 .content{gap: 30px;}
.main-part08-area{display: flex; align-items: center; flex-direction: column; gap: 30px;}
.main-part08-area .main-part08-cont{width: 100%; max-width: 1200px;}
.main-part08-area .main-part08-cont img{width: 100%;}





.main-study-effect-cont {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

/* wrap */
.main-study-effect-cont .effect-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}


/* 중앙 영역 */
.main-study-effect-cont .effect-center {
  width: 55%;
  position: relative;
}
.main-study-effect-cont .effect-center-bg{
  width: 100%;
  position: relative;
}
.main-study-effect-cont .effect-center-bg img{
  width: 100%;
}

/* 원형 효과 3개 */
.main-study-effect-cont .effect-item {
  position: absolute;
  width: 47%; height: 52%;
}

.main-study-effect-cont .effect-circle {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  font-family: var(--englab-font);
  color: #000;
  font-size: 28px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.4;
}

.main-study-effect-cont .effect-circle strong{display: block;}

/* 각 원 위치 */
.main-study-effect-cont .effect-item01 {
  top: 5%;
  left: 50%;
  transform: translateX(-50%);
}

.main-study-effect-cont .effect-item02 {
  bottom: 5%;
  left: 5%;
}

.main-study-effect-cont .effect-item03 {
  bottom: 5%;
  right: 5%;
}

/* 가운데 AI */
.main-study-effect-cont .effect-center-ai {
  position: absolute;
  z-index: 1003;
  top: 55%;
  left: 50%;
  width: 60%;
  transform: translate(-50%, -50%);
}

.main-study-effect-cont .effect-center-ai img {
  width: 100%;
  display: block;
}


/* 좌·우 텍스트 */
.main-study-effect-cont .effect-desc-box{
  position: absolute;
  z-index: 1003;
  width: 20%;
  margin-bottom: 10px;
}
.main-study-effect-cont .effect-desc-box ul {
  position: relative;
  padding-left: 30px;
}
.main-study-effect-cont .effect-desc-box ul li{
  word-break: keep-all;
  list-style: disc;
  padding: 3px 0;
  font-size: 20px;
  font-weight: 500;
  line-height: 120%;
}


.main-study-effect-cont .effect-desc-box-title{display: none;}

.main-study-effect-cont .effect-left.wcpm{ bottom: 130px; left: 0px;}
.main-study-effect-cont .effect-right.performance{top: 100px; right: 0px;}
.main-study-effect-cont .effect-right.reading{ bottom: 10px; right: 0px;}

.main-study-effect-cont .effect-left{padding-left: 20px;}
.main-study-effect-cont .effect-right{padding-right: 20px;}

.main-study-effect-cont .effect-left::before {
  content: "";
  position: absolute;
  left: 0;
  top: -32px;
  width: 13px;
  height: 13px;
  background: #DBE3F2;
  border-radius: 50%;
}

.main-study-effect-cont .effect-left::after {
  content: "";
  position: absolute;
  left: 0px;
  top: -26px;
  width: calc(100% + 150px);
  height: 2px;
  background: #DBE3F2;
}


.main-study-effect-cont .effect-right::after {
  content: "";
  position: absolute;
  right: 0;
  top: -21px;
  width: 13px;
  height: 13px;
  background: #FEE4EF;
  border-radius: 50%;
}

.main-study-effect-cont .effect-right::before {
  content: "";
  position: absolute;
  right: 0px;
  top: -16px;
  width: calc(100% + 250px);
  height: 2px;
  background: #FEE4EF;
}
.main-study-effect-cont .effect-right.reading::after{background: #EAE2FB;}
.main-study-effect-cont .effect-right.reading::before{background: #EAE2FB; width: calc(100% + 100px);}

.section-description{color: rgba(0, 0, 0, 0.50); font-size: 14px; font-weight: 400; line-height: 120%; text-align: center; width: 100%; margin-top: 50px;}
.ai-system-operation-bg{background: #6266F2;}

main{padding-top: 70px;}
.main-warp main{padding-top: 0px;}
.header{background: #fff; padding: 0 0 0 0;}
header{position: fixed; top: 0; left: 0; width: 100%; display: flex; z-index: 1050; align-items: center; justify-content: center; width: 100%; border-bottom: 1px solid rgba(0, 0, 0, 0.10); height: 70px; background: #FFF; box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.10); }
.header .header-area { width: 100%; max-width: 1200px; display: flex; align-items: center; justify-content: space-between;}
.header .header-logo { display: flex; justify-content: flex-start; align-items: center; gap: 5px; }
.header .header-logo a { display: block; height: 30px; text-decoration: none; color: inherit; cursor: pointer; }
.header .header-logo .logo-img { background: url(../images/logo_header.png) no-repeat 50% 50%; background-size: cover; width: 166px; height: 40px; display: inline-block; font-size: 0; }
.header .header-logo .logo-text { font-family: var(--englab-font); font-size: var(--font-size20); font-weight: 700; color: #0064d7; }
.header .header-menu .main-nav{display: flex; gap: 20px;}
.header .header-menu .nav-menu{ color: var(--dark); cursor: pointer; font-size: var(--font-size18); font-weight: 600; width: 100px; line-height: 100%; display: flex; justify-content: center; align-items: center;}
.header .header-menu .nav-menu:hover{color: var(--englab-main);}
.header .header-menu .nav-menu.active,
.header .header-menu .dropdown-toggle.active,
.header .header-menu .dropdown-item.active{color: var(--englab-main); }


.header .dropdown { position: relative; }
.header .dropdown-menu{ position: absolute; top: 30px; left: 0px; /*transform: translateX(-50%);*/ width: auto; min-width: auto; margin-top: 0; border-radius: 8px; border: 1px solid rgba(0,0,0,0.05); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08); padding: 30px 30px; background-color: #fff; }
.header .dropdown-toggle::after{display: none;}
.header .dropdown-menu .nav-menu-sub{text-align: left; font-weight: 500; border-radius: 20px; white-space: nowrap; padding: 1px 10px;}
.header .dropdown-menu .nav-menu-sub:hover{color: var(--englab-main);}
.header .dropdown-menu .nav-menu-sub.active{color: var(--englab-main); font-weight: 600;}
.navbar .dropdown-menu.show { display: flex; flex-direction: column; gap: 10px; justify-content: center; padding: 20px 20px; top: 35px; box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15); border: 1px solid rgba(0,0,0,0.08);}
.navbar .dropdown-menu > li {text-align: left;}

.navbar-toggler:focus{box-shadow: none;}
.navbar-toggler-icon { width: 1.75rem; height: 1.75rem; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0,0,24,1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); background-size: 100% 100%;}
.offcanvas .navbar-nav .nav-link { padding: .6rem 0; }
.offcanvas .collapse { margin: .25rem 0 .5rem 0; }
.offcanvas .list-unstyled { padding-left: 0; margin-bottom: 0; }
.offcanvas .submenu a { padding: .4rem 0; display: block; }
.offcanvas .collapse-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: .6rem 0; border: 0; background: none; font: inherit; text-align: left; }
.offcanvas .nav-menu{width: 100%; font-family: var(--englab-font); font-size: var(--font-size16);}
.offcanvas-end { width: 80%; border-left: none;}

.offcanvas-menu{font-size: var(--font-size16); padding: 0 10px;}
.offcanvas-menu li:first-child{padding: 0 0 10px 0;}
.offcanvas-menu li{padding: 20px 0;}
.offcanvas-menu .offcanvas-link{font-family: var(--englab-font); font-weight: 600; display: block; font-size: 18px;}
.offcanvas-menu .offcanvas-link.active{ color: var(--englab-main);}
.offcanvas-menu .offcanvas-submenu{padding-top:7px; font-weight: 400;}
.offcanvas-menu .offcanvas-submenu li{padding: 0 0 0 0;}
.offcanvas-menu .offcanvas-submenu li a{display: block;padding: 3px 0;}
.offcanvas-menu .offcanvas-submenu li a.active{ color: var(--englab-main);}

.slick-wrapper { position: relative;}
.slide-item-cont{display: flex; align-items: center; max-height: 700px; justify-content: center;}
.slide-item-cont img {width: 100%; max-width: 1200px;}
.slick-prev, .slick-next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; background: rgba(0,0,0,0.4); color: #fff; border: none; width: 45px; height: 45px; font-size: 26px; line-height: 1; cursor: pointer; border-radius: 50%; transition: all 0.3s ease;}
.slick-arrow{font-size: 0;}
.slick-prev:hover, .slick-next:hover { background: rgba(0,0,0,0.7); transform: translateY(-50%) scale(1.1);}
.slick-prev { left: 15px; background-color: rgba(0,0,0,0.4); background-repeat: no-repeat; background-position: center; background-size: 45%; transform: translateY(-50%) scaleX(-1); background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><polygon fill='white' points='160,115.4 180.7,96 352,256 180.7,416 160,396.7 310.5,256'/></svg>");}
.slick-next { right: 15px; background-color: rgba(0,0,0,0.4); background-repeat: no-repeat; background-position: center; background-size: 45%; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><polygon fill='white' points='160,115.4 180.7,96 352,256 180.7,416 160,396.7 310.5,256'/></svg>");}
.slick-dots { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); display: flex !important; gap: 8px; list-style: none; padding: 0; margin: 0; z-index: 5; }
.slick-dots li { width: 25px; height: 7px; background: rgba(255,255,255,0.5); border-radius: 2px; transition: all 0.3s ease; cursor: pointer; }
.slick-dots li.slick-active { background: #fff; transform: scale(1.15); }
.slick-dots button { display: none; }


.lnb-section{padding: 70px 0 50px 0;}
.lnb-section.lnb-solo{padding-bottom: 20px;}
.lnb-area { width: 100%; max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column; gap: 50px;}
.lnb-area .lnb-nav{color: #000; line-height: 140%; font-size: var(--font-size16); font-weight: 400;}
.lnb-area .lnb-nav h1{color: var(--englab-main); font-size: var(--font-size16); font-weight: 600; display: inline-block;}
.lnb-area .lnb-nav > span::after{content: '>'; padding-left: 7px; position: relative; top: -1px;}
.lnb-area .lnb-title-area{ font-family: var(--englab-font); display: flex; flex-direction: column; gap: 14px;}
.lnb-area .lnb-title-area .title{font-size: var(--font-size36); font-weight: 700; margin-bottom: 0; display: flex; flex-direction: column; gap: 16px;}
.lnb-area .lnb-title-area .title strong{font-size: var(--font-size54); font-weight: 700; display: block; line-height: 100%;}
.lnb-area .lnb-title-area .title-desc{color: #000; font-size: var(--font-size20); font-weight: 500; line-height: 160%;}
.lnb-area .lnb-title-area .title-desc.support{font-size: var(--font-size18); }

.lnb-area.light .lnb-nav a,
.lnb-area.light .lnb-nav span,
.lnb-area.light .lnb-title-area .title{color: #fff;}
.lnb-area.light .lnb-title-area .title-desc{color: #fff;}
.lnb-area.light .lnb-nav h1,
.lnb-area.light .lnb-nav h1 span{color: var(--englab-main);}

.lnb-fixed{position: relative;}
.lnb-fixed .lnb-section{position: absolute; top: 0px; left: 50%; transform: translate(-50%, 0%); width: 100%; max-width: 1200px;}

.footer {display: flex; align-items: center; justify-content: center; border-top: 0.5px solid rgba(91, 91, 91, 0.20); background: #F7F6FA; padding: 50px 0; }
.footer .footer-inner{display: flex; flex-direction: column; gap: 20px; width: 100%; max-width: 1200px; margin: 0 auto;}
.footer .foot-area {display: flex; justify-content: space-between; align-items: flex-start; align-self: stretch; }
.footer .foot-area .foot-cont{line-height: 180%;}
.footer .foot-area .foot-cont .foot-inline-data span::after{content: '|'; padding-right: 4px; margin-left: 4px; display: inline-block;}
.footer .foot-area .foot-cont .foot-inline-data span:last-child::after{display: none;}
.footer .foot-area .foot-cont .foot-data{display: block;}
.footer .foot-area .foot-logo{margin-bottom: 20px;}
.footer .foot-area .foot-logo img{width: 220px;}
.footer .copyright-area{display: flex; justify-content: space-between; align-items: center;}
.footer .copyright-area .copyright { font-weight: 300; font-size: var(--font-size12); color: rgba(50, 50, 50, 0.40);}
.footer .copyright-area .sns-link img{height: 18px;}
.footer .foot-cs-guide{display: flex; text-align: right; flex-direction: column;}
.footer .foot-cs-guide p{margin:60px 0 6px 0;}
.footer .foot-cs-guide p span{font-weight: 500; display: block;}
.footer .foot-cs-guide .btn{display: flex; padding: 13px 30px 10px 30px; justify-content: center; align-items: center; gap: 10px; border-radius: 52px; background: #FAE100; color: #3C1E1E; font-size: 16px; font-weight: 700; line-height: 100%; }
.footer .foot-cs-guide dl{margin:60px 0 6px 0;}
.footer .foot-cs-guide dl dt{color: #000; font-family: var(--englab-font); font-size: var(--font-size18); font-weight: 500; line-height: 180%; }
.footer .foot-cs-guide dl dt a{ font-weight: 700;}
.footer .foot-cs-guide dl dd{color: #231815; text-align: right; font-size: var(--font-size16); font-weight: 500; line-height: 26px;}
.footer .foot-cs-guide dl dd span{font-weight: 600; display: block;}
.branch-academy-box{display: flex; padding: 20px 0px; flex-direction: column; align-items: flex-start; gap: 30px; align-self: stretch;border-radius: 6px; background: #FFF;}
.branch-academy-box dl{display: flex; justify-content: flex-start; align-items: center; gap: 30px; line-height: 160%;}
.branch-academy-box dl dt{width: 180px; text-align: center; border-right: 1px solid #000; font-size: var(--font-size16);}
.branch-academy-box dl dt a{border: 1px solid #000; font-size: var(--font-size12); display: inline-block; margin-top: 5px; padding: 4px 10px 3px 10px; border-radius: 1px; line-height: 100%;}
.branch-academy-box dl dt a:hover{background: #000; color: #fff;}


.visual-section{background: url(../images/visualbox_contact_cont01.jpg) no-repeat; width: 100%; background-size: cover; display: flex; align-items: center; justify-content: center;}
.visual-section .visual-section-inner{background: rgba(0, 0, 0, 0.6); width: 100%; padding: 100px 0;}
.visual-section .visual-section-text{ text-shadow: 0px -1px 10px rgba(0, 0, 0, 0.4); text-align: center; color: #FFF; font-size: var(--font-size50); font-weight: 700; line-height: 160%;}
.visual-section .visual-section-text span{color: var(--englab-main);}

.contact-box{ max-width: 800px; margin: 0 auto; }
.privacy-box-area{display: flex; flex-direction: column; gap: 10px;}
.privacy-box-area .privacy-box { background: #f9f9f9; border: 1px solid #e0e0e0; padding: 20px; font-size: var(--font-size16); line-height: 1.7; }
.privacy-box-area .privacy-box ul { margin: 3px 0 0 0; font-size: var(--font-size12);}
.privacy-box-area .privacy-check { margin-top: 10px; display: flex; align-items: center; gap: 4px; margin: 0 auto;}
.form-title { margin-top: 30px; font-weight: 500; font-size: var(--font-size14);}
.form-group-area{ padding-bottom: 10px;}
.form-group-area table{width: 100%;}
.form-group-area table tr td{padding: 5px 0;}
.form-check-input-box{display: flex; align-items: center; justify-content: center;}
.form-check-input-box label{width: 35px;}
.form-check-input-box .form-control[type="text"]{position: relative; top:-2px;}
.required { color: #f00; margin-left: 2px; }

.choice-group{display: flex; align-items: flex-start; align-content: flex-start; gap: 4px 20px; flex: 1 0 0; flex-wrap: wrap;}


.content-box{display: flex; flex-direction: column; gap: 30px;}
.cont-title{font-weight: 700; line-height: 140%; word-break: keep-all; font-family: var(--englab-font); font-size: var(--font-size48); margin-bottom: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; align-self: stretch;}
.cont-title span{ font-size: var(--font-size24);  font-weight: 500; line-height: 160%;}
.cont-title.center{align-items: center; justify-content: center; text-align: center;}
.cont-text{ font-size: var(--font-size20); font-weight: 500; line-height: 140%;}

.box-center{display: flex; align-items: center; align-content: center; width: 100%;}
.box-center .cont-title{margin: 0 auto 50px auto;}


.form-check {display: flex; align-items: center; gap: 7px;}


.pagination-area { margin-top: 50px; display: flex; flex-direction: column; align-items: center; align-self: stretch; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 8px; }
.pagination li a { display: flex; justify-content: center; align-items: center; background: #ced2e0; border-radius: 4px; line-height: 100%; height: 40px; width: 40px; text-align: center; color: #fff; cursor: pointer; border: none; }
.pagination .prev a{width: 40px; height: 41px; display: inline-block; background: url(../images/paging_arrow_prev.png) no-repeat; background-size: cover;}
.pagination .next a{width: 40px; height: 41px; display: inline-block; background: url(../images/paging_arrow_next.png) no-repeat; background-size: cover;}
.pagination .prev a:hover{width: 40px; height: 41px; display: inline-block; background: url(../images/paging_arrow_prev_active.png) no-repeat; background-size: cover;}
.pagination .next a:hover{width: 40px; height: 41px; display: inline-block; background: url(../images/paging_arrow_next_active.png) no-repeat; background-size: cover;}
.pagination .prev.off a,
.pagination .next.off a { color: #ced2e0; cursor:default; }
.pagination li.active a { background: var(--englab-main); font-weight: 700; color: #fff; }

.board-list-top { display: flex; padding-bottom: 10px; justify-content: space-between; align-items: flex-end; align-self: stretch; }
.board-list-top .board-srch-area{ display: flex; align-items: center; gap: 10px; }
.board-list-top .board-srch-area .list-search-form { display: flex; justify-content: center; align-items: center; gap: 10px; }
.board-list-top .board-srch-area .form-select{min-width: 150px; height: 42px; font-size: var(--font-size14);}
.board-list-top .board-srch-area .list-search-control{height: 42px; display: flex; justify-content: center; align-items: center; border: 1px solid #ced4da; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;}
.board-list-top .board-srch-area .list-search-control .form-control{border: none; min-width: 200px; font-size: var(--font-size14);}
.board-list-top .total-text{font-size: var(--font-size14);}
.board-list-top .total-text .num{font-weight: 600;}

.board-wrap{width: 100%; max-width: 1200px; margin-bottom: 150px;}
.table tr td{height: 55px; vertical-align: middle; text-align: center; font-size: 16px;}
.table tr.list-fixed td{background: #FFF9F0;}
.table thead tr th{text-align: center; background: #F5F6F9; height: 55px; vertical-align: middle;}
.table > :not(:first-child) {border-top: 1px solid #CED2E0;}


.event-list{ border-top:1px solid #CED2E0; border-bottom:1px solid #CED2E0;}
.event-link{display: block;}
.event-link + .event-link{ border-top:1px solid #CED2E0;}
.event-card-area{display: flex; align-items: center; justify-content: space-between; padding: 20px 0;}
.event-card{display: flex; padding: 20px 0; align-items: center; align-self: stretch;}
.event-card .event-thumb{display: flex; width: 300px; height: 150px; justify-content: center; align-items: center; border-radius: 20px; overflow: hidden; background: #F0F2F8;}
.event-card .event-thumb img{width: 100%; height: 100%;}
.event-card .event-cont{display: flex; flex-direction: column; gap: 20px; width: 100%; align-items: flex-start; padding: 0 30px; flex: 1 0 0;}
.event-card .event-info .date-pill{ background:#F5F6F9; color:#202530; font-weight:400; display: inline-block; margin-bottom: 10px; font-size:var(--font-size12); padding:4px 15px 5px 15px; border-radius:999px; }
.event-card .event-info .title{margin: 0; font-size: var(--font-size20); font-weight: 600; }
.event-card .event-info .meta-info{font-size: var(--font-size12); color: #979494; margin-top: 5px;}

.event-state{background:#C9CFDA; color:#fff; display: block; width: 200px; text-align: center; font-weight:600; border-radius:100px; padding:6px 12px; font-size:var(--font-size14);}
.event-state.live{ background:#F08300; }
.event-state.closed{ background:#C9CFDA; }
.event-text {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4em;
  max-height: calc(1.4em * 2);
}


.sub-mainvisual{position: relative; min-height: calc(100vh - (70px)); overflow: hidden;}
.sub-mainvisual.starland{background: url(../images/starland_mainvisual_bg.jpg) no-repeat; background-size: cover;}
.sub-mainvisual.bookrclass{background: url(../images/bookrclass_mainvisual_bg.jpg) no-repeat; background-size: cover;}
.sub-mainvisual.talktree{background: url(../images/talktree_mainvisual_bg.jpg) no-repeat; background-size: cover;}

.sub-mainvisual .mainvisual-starland-bg__item01{position: absolute; top: 30%; right: 16%; z-index: 1000; width: 600px; animation: starlandPlanetDrift 5s ease-in-out infinite; animation-delay: .3s;}
.sub-mainvisual .mainvisual-starland-bg__item02{position: absolute; top: 32%; left: -70px; z-index: 1000; animation: starlandPlanetFloat1 6s ease-in-out infinite; animation-delay: .3s;}
.sub-mainvisual .mainvisual-starland-bg__item03{position: absolute; bottom: -70px; left: -80px; z-index: 1000; animation: starlandPlanetFloat2 4s ease-in-out infinite; animation-delay: .3s;}
.sub-mainvisual .mainvisual-starland-bg__item04{position: absolute; bottom: -70px; right: -30px; z-index: 1000; animation: starlandPlanetFloat3 6s ease-in-out infinite; animation-delay: .3s;}
.sub-mainvisual .mainvisual-starland-bg__item05{position: absolute; top: -30px; right: 200px; z-index: 1000; animation: starlandPlanetFloat4 4s ease-in-out infinite; animation-delay: .3s;}

.sub-mainvisual .mainvisual-talktree-bg__item01{position: absolute; z-index: 1002; bottom: 70px; left: 40%; z-index: 1000; animation: bounceStrong 2s ease-in-out infinite; animation-delay: .3s;}


.mainvisual-cont{display: flex; flex-direction: column; gap: 50px; width: 100%; max-width: 1200px; margin: 0 auto;}
.mainvisual-cont .lnb-section{height: 462px; position: relative; z-index: 1001; }
.mainvisual-cont .mainvisual-cont__inner{position: relative; z-index: 1000; display: flex; justify-content: flex-start; align-items: center; gap: 30px;}
.mainvisual-cont .video-card {width: 500px; height: 290px; border: 10px solid #FFF; background: #D2D2D2; box-shadow: 0 0 24px 0 rgba(39, 36, 36, 0.12);}

@keyframes starlandPlanetDrift {
  0%   { transform: translate(0, 0); }
  25%  { transform: translate(12px, -8px); }
  50%  { transform: translate(20px, 4px); }
  75%  { transform: translate(8px, 12px); }
  100% { transform: translate(0, 0); }
}

@keyframes starlandPlanetFloat1 {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}
@keyframes starlandPlanetFloat2 {
  0%   { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(-7px); opacity: 1; }
  100% { transform: translateY(-4px); opacity: 1; }
}
@keyframes starlandPlanetFloat3 {
  0%   { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(7px); opacity: 1; }
  100% { transform: translateY(-7px); opacity: 1; }
}
@keyframes starlandPlanetFloat4 {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-18px); }
  100% { transform: translateY(0); }
}

.list-view-area{width: 100%; max-width: 1200px; min-height: 700px; padding-bottom: 100px;}
.list-view-area .list-view-title{display: flex; height: 64px; padding: 10px 20px; justify-content: space-between; align-items: flex-start; align-items: center; border-radius: 7px; border: 1px solid #ECECEF; background: #F9F9F9;}
.list-view-area .list-view-title .list-date{color: #6C757D; font-size: 14px; font-weight: 400;}
.list-view-area .list-view-title .text-area{ display: flex; justify-content: center; align-items: center; gap: 5px;}
.list-view-area .list-view-title .text-area h5{color: #000; font-size: var(--font-size18); font-weight: 600; margin-bottom: 0;}
.list-view-area .list-view-title .text-area .btn-page-back{cursor: pointer; display: flex; justify-content: flex-start; align-items: center; width: 40px; height: 40px; background: url(../images/icon/page_back.svg) no-repeat 50% 50%; background-size: cover;}
.list-view-area .list-view-cont{font-size: var(--font-size16); padding: 30px 50px; text-align: center;}

.englab-hero {
  position: relative;
  width: 100%;
  padding: 100px 0;
  height: 480px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}

.englab-hero__video-wrap {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.englab-hero__video {
  height: 100%;
  width: 100%;
  max-width: 1200px;
  object-fit: cover;
  border-radius: 30px;
  transform: scale(1);
  transition:
    max-width 1.1s ease,
    transform 1.1s ease;
}

.englab-hero.englab-hero--full .englab-hero__video {
  max-width: 100%;
  transform: scale(1);
  border-radius: 0px;
}

.englab-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}

.englab-hero__overlay::before {
  content: "";
  width: 100%;
  height: 100%;
  max-width: 1200px;
  background: rgba(0, 0, 0, 0.45);
  border-radius: 30px;
  transform: scale(1);
  transform-origin: center;
  transition:
    max-width 1.1s ease,
    transform 1.1s ease;
}

.englab-hero.englab-hero--full .englab-hero__overlay::before {
  max-width: 100%;
  border-radius: 0px;
  transform: scale(1);
}

.englab-hero__inner {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  text-align: center;
  padding: 0 24px;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7);
}

.englab-hero__line {
  font-size: var(--font-size48);
  font-weight: 700;
  margin: 16px 0;
  display: none; 
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.englab-hero__line.show {display: block;    
  opacity: 1;
  transform: translateY(0);
}

.logo-line {
  font-size: 1.6rem;
  margin-top: 24px;
}
.logo-line img{height: 70px;}

.englab-hero-image {
  position: relative;
  width: 100%;
  padding: 100px 0;
  min-height: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: #fff; 
  background: url("../images/brand_section03_bg01.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.englab-hero-image .englab-hero__overlay::before{
  max-width: 100%;
  border-radius: 0px;
  transform: scale(1);
}

.englab-hero-image__inner{
  z-index: 2;
  color: #FFF;
  text-align: center;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7);
  font-size: var(--font-size48);
  font-weight: 700;
  line-height: 160%; 
}
.englab-hero-image__inner span{color: var(--englab-main);}


.englab-hero-image.franchise-inquiry-contact{
  background: url("../images/franchise_inquiry_contact_bg01.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}


.timeline-wrap {
  position: relative;
  max-width: 1200px;
  padding: 70px 0 200px 0;
  background: url("../images/brand_timeline_img.png") no-repeat top right;
  background-size: 500px;
}

.timeline-container {display: block;
  width: 100%;
}

/* 왼쪽 연혁 리스트 */
.timeline-area {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
}

.timeline-box {
  width: 100%;
  display: grid;
  grid-template-columns: 120px 60px 1fr;
  gap: 18px;
  position: relative;
  padding: 15px 0;
}


.timeline-box .year {
  position: relative;
  top: -10px;
  font-size: var(--font-size36);
  font-family: var(--englab-font);
  font-weight: 700;
  color: #ff7a00;
  white-space: nowrap;
}

.timeline-box.same-year .year {
  visibility: hidden;
}

/* Divider Line */
.timeline-box .divider {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

.timeline-box .divider::before {
  content: "";
  position: absolute;
  top: -24px;
  bottom: -24px;
  width: 2px;
  border-radius: 5px;
  background: #939396;
  transition: background 0.3s ease;
}

.timeline-box:first-child .divider::before { top: 10px; }
.timeline-box:last-child  .divider::before { bottom: 10px; }

.timeline-box.passed .divider::before {
  background: linear-gradient(270deg, #FFA55A 0%, #FF7A00 100%);
}

.timeline-box.active .divider::before {
  background: linear-gradient(180deg, #FFA55A 0%, #FFA55A 50%, #939396 51%, #939396 100%);
}

.timeline-box.year-last-box .divider{
  padding-bottom: 100px;
}

/* Dot (기본은 동그라미, active에서만 SVG) */
.timeline-box .dot {
  position: relative;
  top: 7px;
  z-index: 2;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #939396;
  transform: scale(0.9);
  transition:
    background 0.25s ease,
    transform 0.25s ease,
    opacity 0.25s ease,
    filter 0.25s ease,
    border-color 0.25s ease;
}

.timeline-box.passed .dot {
  background: var(--englab-main);
}

.timeline-box.active .dot {
  top: -11px;
  width: 30px;
  height: 40px;
  background: url("/images/brand_timeline_dot.svg") no-repeat center;
  background-size: contain;
  border: none;
  opacity: 1;
  transform: scale(1.15);
  filter: drop-shadow(0 0 8px rgba(255, 122, 0, 0.75));
}

/* Content */
.timeline-box .timeline-cont {
  font-size: var(--font-size18);
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 20px;
  font-weight: 600;
}

.timeline-box .date {
  width: 60px;
  color: rgba(0, 0, 0, 0.6);
}

.timeline-box .text {
  color: rgba(0, 0, 0, 1.0);
  line-height: 1.5;
}

.timeline-box.timeline-skip-area{padding: 100px 0;}
.timeline-box.timeline-skip-area .divider::before { top: -100px; bottom: -100px;}
.timeline-box .timeline-skip{ display: flex; flex-direction: column; background: #fff; z-index: 3; padding: 0 0 20px 0; }
.timeline-box .timeline-skip .dot{
  border: 3px solid #fff;
}

.timeline-box.passed .timeline-skip .dot {
  background: var(--englab-main);
}

.timeline-box.active .timeline-skip .dot{
  background: #939396;
  top: 7px;
  width: 15px;
  height: 15px;
  transform: scale(0.9);
  filter:none;
}

/* -------------------------
  Right Image Panel (Position)
------------------------- */
.timeline-photo-panel{
  position: absolute;
  top: 0;
  right: 0;
  width: 500px;
  pointer-events: none;  /* 필요하면 클릭 막기 */
}

/* 처음에는 wrap의 오른쪽 상단에 붙어 있음 */
.timeline-photo-panel .photo-panel{
  position: absolute;
  top: 0;
  right: 0;
  max-width: 500px;
}

/* 스크롤 후 화면 중앙에 고정되는 상태 */
.timeline-photo-panel .photo-panel.is-fixed {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  right: calc(50% - 600px);  /* 1200px 컨텐츠 기준 오른쪽 정렬 */
}

/* (원하면 아래에 붙이는 상태도 유지할 수 있음 – 지금은 안 써도 됨) */
.timeline-photo-panel .photo-panel.is-bottom {
  position: absolute;
  top: auto;
  bottom: 0;
  right: 0;
  transform: none;
}

/* 이미지 슬라이드/페이드 전환 */
.timeline-photo-panel .photo-panel img {
  display: block;
  width: auto;          /* 원본 비율 유지 */
  max-width: 500px;     /* 최대 500px까지만 */
  border-radius: 12px;
  object-fit: cover;
}

/* 기본 상태 */
.timeline-photo-panel #fixed-photo {
  opacity: 1;
  transform: translateX(0);
  transition:
      opacity 0.45s ease,
      transform 0.45s ease;
}

/* 왼쪽으로 빠지면서 사라짐 */
.timeline-photo-panel #fixed-photo.slide-out {
  opacity: 0;
  transform: translateX(-40px);
}

/* 오른쪽에서 들어오기 시작 상태 */
.timeline-photo-panel #fixed-photo.slide-in {
  opacity: 0;
  transform: translateX(40px);
}

/* slide-in에서 제자리 */
.timeline-photo-panel #fixed-photo.slide-in-active {
  opacity: 1;
  transform: translateX(0);
}



.operation-wrap {
  width: 100%;
  max-width: 1200px;
  margin: 40px auto 80px;
  padding: 0 16px;
}

.operation-section {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 60px;
}

.dialog-user-box{display:inline-block; position: relative;}


/* 말풍선 공통 */
.speech-balloon {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  position: absolute;
  top: 0;
  left: 105%;
  min-width: 210px;
  padding: 14px 18px;
  background: #FFF200;
  word-break: keep-all;
  border-radius: 50px;
  font-size: var(--font-size20);
  line-height: 1.4;
  padding: 30px 50px;
  animation: bubbleFloat2 3.5s ease-in-out infinite alternate;
}

/* 🔽 말풍선 꼬리 */
.speech-balloon::after {
  content: "";
  position: absolute;
  top: 50px;
  left: -12px;
  width: 0;
  height: 0;
  border-right: 50px solid #FFF200;
  border-top: 5px solid transparent;
  border-bottom: 10px solid transparent;
}

.speech-balloon.reverse{
  left: auto;
  right: 105%;
}

.speech-balloon.reverse::after { left: auto;
  right: -12px;
  border-right: none; border-left: 12px solid #FFF200;
}




.ello-section.reverse .user-bubble { left: auto; right: 105%; }

.ello-section.reverse .user-bubble::after { left: auto; right: -12px; border-right: none; border-left: 12px solid #E5E9F0; }

#aisystem-manage-feature{margin-top:-300px;}
.operation-feature-layout{display: flex; flex-direction: column; gap: 50px;}
.aisystem-manag-feature-area{display: flex; flex-direction: column; gap: 30px;}
.operation-feature-box{display: flex; justify-content: space-between; align-items: center; position: relative; font-weight: 600;}
.aisystem-manag-feature-area.feature-example01 .operation-feature-box{align-items: flex-end;}
.aisystem-manag-feature-area.feature-example01 .ello .speech-balloon{left:-360px ; top: 42%; width: 500px; }
.aisystem-manag-feature-area.feature-example01 .user{padding-left: 50px; position: relative; z-index: 1000;}
.aisystem-manag-feature-area.feature-example01 .user .speech-balloon{left:310px ; top: 20%; width: 300px; background: #E5E9F0; animation: bubbleFloat 3.5s ease-in-out infinite alternate;}
.aisystem-manag-feature-area.feature-example01 .user .speech-balloon::after {border-right: 12px solid #E5E9F0;}

.aisystem-manag-feature-area.feature-example02 .operation-feature-box{align-items: flex-start; padding: 50px 0;}
.aisystem-manag-feature-area.feature-example02 .ello .speech-balloon{left:380px ; top: 46%; width: 500px; left: 380px; top: 46%;}
.aisystem-manag-feature-area.feature-example02 .ello .speech-balloon::after {border-right: 12px solid #FFF200; left: -12px;}
.aisystem-manag-feature-area.feature-example02 .user .speech-balloon{left: -340px; top: 30%; width: 300px; background: #E5E9F0; animation: bubbleFloat 3.5s ease-in-out infinite alternate;}
.aisystem-manag-feature-area.feature-example02 .user .speech-balloon::after {border-left: 12px solid #E5E9F0;}

.aisystem-manag-feature-area.feature-example03 .operation-feature-box{align-items: flex-end;}
.aisystem-manag-feature-area.feature-example03 .ello .speech-balloon { left: -360px; top: 20%; width: 500px; }
.aisystem-manag-feature-area.feature-example03 .user{ position: relative; z-index: 1000;}
.aisystem-manag-feature-area.feature-example03 .user .speech-balloon{left:250px ; top: 20%; width: 400px; background: #E5E9F0; animation: bubbleFloat 3.5s ease-in-out infinite alternate;}
.aisystem-manag-feature-area.feature-example03 .user .speech-balloon::after {border-right: 12px solid #E5E9F0;}

.ai-system-learning-infographic {padding: 80px 0 100px;}
.ai-system-learning-infographic .ai-learning-inner {
  position: relative;
  width: 600px;
  height: 600px;
  margin: 0 auto;
  background: url(../images/ai-system_learning_infographic_bg.png) no-repeat 50% 50%;
  background-size: 600px;
}

/* 중앙 영역 + 링 */
.ai-system-learning-infographic .ai-center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 280px;
  height: 280px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 바깥/안쪽 링 */
.ai-system-learning-infographic .ai-center::before,
.ai-system-learning-infographic .ai-center::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  inset: 0;
  margin: auto;
}

.ai-system-learning-infographic .ai-center::before {
  width: 280px;
  height: 280px;
  background: radial-gradient(circle, rgba(79,148,255,0.08), transparent 60%);
}

.ai-system-learning-infographic .ai-center::after {
  width: 360px;
  height: 360px;
  background: radial-gradient(circle, rgba(79,148,255,0.15), transparent 60%);
}

/* 중앙 파란 원 */
.ai-system-learning-infographic .ai-center-circle {
  position: relative;
  font-size: 0;
  text-align: center;
  width: 200px;
  height: 200px;
  margin: 0 auto;
  background: url(../images/ai-system_learning_infographic_ai.png) no-repeat 50% 50%;
  background-size: cover;
}

/* 공통 카드 스타일 */
.ai-system-learning-infographic .ai-card {
  position: absolute;
}

.ai-system-learning-infographic .ai-card__inner {
  display: flex;
  width: 400px;
  height: 180px;
  padding: 30px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 10px; 
  border-radius: 110px;
  border: 8px solid #FFF;
  background: #EAEFF6;
  box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.05) inset, 0 0 10px 0 rgba(0, 0, 0, 0.08);
}

.ai-system-learning-infographic .ai-card h3 {
  font-size: 24px;
  font-weight: 700;
  font-family: var(--englab-font);
  margin-bottom: 0;
}

.ai-system-learning-infographic .ai-card ul {
  margin: 0;
  padding-left: 18px;
}
.ai-system-learning-infographic .ai-card ul li{
  text-align: left;
  font-size: var(--font-size18);
  line-height: 120%;
  list-style: disc;
  padding-top: 3px;
}

/* 카드 위치 */
.ai-system-learning-infographic .ai-card--top {
  top: -50px;
  left: 50%;
  transform: translateX(-50%);
}

.ai-system-learning-infographic .ai-card--left {
  left: -280px;
  top: 50%;
  transform: translateY(-50%);
}

.ai-system-learning-infographic .ai-card--right {
  right: -270px;
  top: 50%;
  transform: translateY(-50%);
}

.ai-system-learning-infographic .ai-card--bottom {
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
}



.aisystem-manag-use-area .aisystem-use-list {
  display: flex;
  flex-direction: column;
  gap: 90px;
  margin-top: 50px;
}

/* 박스 프레임 */
.aisystem-manag-use-area .aisystem-use-box {
  position: relative;
  background: #ffffff;
  border-radius: 18px;
  border: 2px solid #343434;
  padding: 30px 32px 26px;
}

/* 상단 라벨 */
.aisystem-manag-use-area .use-label {
  position: absolute;
  left: -2px;           /* 프레임과 딱 붙게 */
  top: -18px;
  
  display: flex;
padding: 16px 30px 14px 30px;
justify-content: center;
align-items: center;
gap: 10px;
color: #FFF;
text-align: center;
font-family:  var(--englab-font);
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 100%; /* 24px */
border-radius: 30px 0;
background: #3F3F3F;
}

/* 안쪽 레이아웃: 왼쪽 문장 / 오른쪽 기능 박스 */
.aisystem-manag-use-area .use-inner {
  display: flex;
  justify-content: space-between;
  gap: 28px;
}

/* 메인 카피 영역 */
.aisystem-manag-use-area .use-main {
  position: relative;
  flex: 1;
}


.aisystem-manag-use-area .use-main p {
  color: #3F3F3F;
  text-align: center;
  font-family: var(--englab-font);
  font-size: 36px;
  font-weight: 700;
  line-height: 120%;
  display: flex; justify-content: center; align-items: center;
  height: 100%;
}

/* 큰 따옴표 배경 */
.aisystem-manag-use-area .use-main .text-box{display: inline-block; position: relative;}
.aisystem-manag-use-area .use-main .text-box::before {
  content: "";
  position: absolute;
  left: -30px;
  top: -30px;
  width: 70px;
  height: 58px;
  background: url(../images/reviewbox_icon_open.svg) no-repeat;
  background-size: cover;
}
.aisystem-manag-use-area .use-main .text-box::after {
  content: "";
  position: absolute;
  right:  -30px;
  bottom: -30px;
  width: 70px;
  height: 58px;
  background: url(../images/reviewbox_icon_close.svg) no-repeat;
  background-size: cover;
}

/* 오른쪽 퍼플 박스 */
.aisystem-manag-use-area .use-feature {
  width: 550px;
  height: 200px;
  background: linear-gradient(135deg, #6867ff, #5046ff);
  border-radius: 24px;
  padding: 20px 30px;
  color: #ffffff;
  display: flex;
  align-items: center;
  word-break: keep-all;
  letter-spacing: -3%;
}

/* 체크 리스트 */
.aisystem-manag-use-area .check-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.aisystem-manag-use-area .check-list li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 10px;
  font-size: 24px;
  line-height: 120%;
}

.aisystem-manag-use-area .check-list li:last-child {
  margin-bottom: 0;
}

/* ✓ 체크 아이콘을 CSS로 그림 */
.aisystem-manag-use-area .check-list li::before {
  content: "";
  position: absolute;
  left: 3px;
  top: 0px;
  width: 12px;
  height: 20px;
  border-right: 4px solid #ffe84a;  /* 노란색 체크 */
  border-bottom: 4px solid #ffe84a;
  transform: rotate(45deg);
}
.btn-error-back{background: #9B9B9B; color: #fff;}
.icon-arrow-left {
    position: relative;
    top: 3px;
    width: 20px;
    height: 20px;
    margin-right: 13px;
    display: inline-block;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M15.75 19.5L8.25 12L15.75 4.5' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
  }
  .btn-error-back:hover{color: #fff;}
.ello-highlight-bar {
  width: 100%;
  padding: 13px 40px;
  background: #6266F5; /* 보라 강조색 */
  color: #fff;
  text-align: center;
  word-break: keep-all;
  line-height: 1.6;
  border-radius: 16px;
  border: 10px solid #fff;
  text-align: center;
  font-family: var(--englab-font);
  font-size:var(--font-size24);
  font-style: normal;
  font-weight: 600;
  letter-spacing: -0.48px;
  box-shadow:
    0 6px 0 rgba(136,140,255,0.35),
    0 16px 16px rgba(0,0,0,0.1);
}
  
.ello-highlight-bar span { color: #FFF770; line-height: 120%;}
  
.right-fixed-item{position: relative;}
.right-fixed-item .right-item{position: absolute; right: 0; top: -30px; animation: bounceUp 1.8s ease-in-out infinite; animation-delay: 0.2s;}

.learning-part01 .content{ padding: 0 0 100px 0;}

.learning-system-process{width: 100%; position: relative;}
.learning-system-process ul li{ position: relative; min-height: 640px; display: flex; align-items: center; justify-content: center;}
.learning-system-process ul li:nth-child(1){background: url(../images/aisystem_learning_part02_bg01.png) no-repeat 50%; background-size: cover;}
.learning-system-process ul li:nth-child(2){background: url(../images/aisystem_learning_part02_bg02.png) no-repeat 50%; background-size: cover;}
.learning-system-process ul li:nth-child(3){background: url(../images/aisystem_learning_part02_bg03.png) no-repeat 50%; background-size: cover;}
.learning-system-process ul li:nth-child(4){background: url(../images/aisystem_learning_part02_bg04.png) no-repeat 50%; background-size: cover;}

.learning-system-process ul li:nth-child(1) .mascot-box{position: absolute; bottom: 50px; right: 50%;}
.learning-system-process ul li:nth-child(2) .mascot-box{position: absolute; top: 30px; left: 200px;}
.learning-system-process ul li:nth-child(3) .mascot-box{position: absolute; bottom: 50px; right: 45%;}
.learning-system-process ul li:nth-child(4) .mascot-box{position: absolute; bottom: 50px; left: 45%;}

.learning-process-box{position: relative; width: 100%; max-width: 1200px;}
.learning-process-box .stage-badge { position: absolute; top: 50%; left: 0px; transform: translateY(-50%); width: 100%; max-width: 350px; aspect-ratio: 1 / 1;display: flex; align-items: center; justify-content: center; border: 10px solid #fff; border-radius: 50%; background: #EAEFF6; color: #111827; box-shadow:0 18px 35px rgba(0, 0, 0, 0.18); }

.learning-system-process ul li.right .learning-process-box .stage-badge {left:auto; right: 0px;}
.learning-process-box::after{ content: ''; position: absolute; top: 170px; width: 1200px; height: 300px; background: url(../images/aisystem_learning_part02_process_line1.png) no-repeat; background-size: 1200px;}
.learning-system-process ul li.right .learning-process-box::after{background: url(../images/aisystem_learning_part02_process_line2.png) no-repeat; background-size: 1200px;}
.learning-system-process ul li:nth-child(4) .learning-process-box::after{display: none;}

.learning-process-box .stage-badge__inner{text-align: center; padding: 0 30px; word-break: keep-all;}
.learning-process-box .stage-badge__title { font-size: var(--font-size30); font-weight: 700;  margin-bottom: 14px; font-family: var(--englab-font); }
.learning-process-box .stage-badge__desc { font-weight: 500; font-size: var(--font-size16); }

.bounce-type1 {animation: bounceSoft 1.8s ease-in-out infinite;}
.bounce-type2 {animation: bounceStrong 1.4s cubic-bezier(0.28, 0.84, 0.42, 1) infinite;}
.bounce-type3 {animation: bounceScale 1.6s ease-in-out infinite;}
.bounce-type4 {animation: bounceFloat 2.2s ease-in-out infinite;}



/* 전체 배경 */
.curriculum-education-goal-area {
  background: #fff7ec;
  padding: 70px 0 100px 0;
  font-family: var(--englab-font);
  color: var(--englab-main);
}

.curriculum-education-goal-area .education-goal-inner {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}

/* 상단 타이틀 화살표 */
.curriculum-education-goal-area .goal-title-wrap {
  position: relative;
  display: inline-block;
  margin-bottom: 24px;
}

.curriculum-education-goal-area .goal-title {
  min-width: 500px;
  padding: 50px 0px;
  background: var(--englab-main);
  color: #fff;
  font-weight: 600;
  clip-path: polygon(10% 0, 90% 0, 100% 50%, 90% 100%, 10% 100%, 0 50%);


font-family: var(--englab-font);
font-size: 36px;
line-height: 100%;
}

.goal-bridge{position: relative; top: -20px;}
.curriculum-education-goal-area .goal-hex-list {
  position: relative; top: -50px;
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 0px;
}
.curriculum-education-goal-area .goal-hex {
  flex: 0 0 auto;
  display: flex;
  width: 300px;
  height: 260px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 20px;
  background: url(../images/goal_hex_box_border.svg) no-repeat;
  background-size: cover;
  margin-left: -40px;
  position: relative;
  z-index: 1001;
  backdrop-filter: opacity(20%);
}
.curriculum-education-goal-area .goal-hex:first-child {
  margin-left: 0;
}

.curriculum-education-goal-area .goal-hex-shape {
  font-family: var(--englab-font);
  font-size: var(--font-size24);
  font-weight: 600;
  line-height: 140%;
}


.curriculum-part02-box{margin-top: 70px;}


.englab-6year-course-area {
  position: relative;
  width: 100%;
  padding-bottom: 60px;
}

.englab-6year-course-area .course-inner {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  max-width: 1400px;
  margin: 0 auto;
  position: relative;
}


.englab-6year-course-area .course-left{width: 500px;}
.englab-6year-course-area .course-left img {
  width: 320px;
  height: auto;
}

/* 우측 단계 리스트 */
.englab-6year-course-area .course-steps {
  flex: 1;
  list-style: none;
  margin: 0;
  background: url(../images/englab_curriculum_6year_arrow.png) no-repeat 100% 0%;
  background-size: 260px;
}

.englab-6year-course-area .course-steps .step {
  position: relative;
  display: flex; justify-content: flex-start; align-items: center;
  gap: 20px;
  margin: 20px 0;
}

/* 점 + 점선 */
.englab-6year-course-area .course-steps .step::before {
  content: "";
  position: absolute;
  left: -182px;
  top: 79px;
  width: 6px;
  height: 6px;
  background: #777;
  border-radius: 50%;
}

.englab-6year-course-area .course-steps .step::after {
  content: "";
  position: absolute;
  left: -177px;
  top: 81px;
  width: 180px;
  border-top: 1px dashed #aaa;
  transform-origin: left center;
  transform: rotate(-12deg);
}
.englab-6year-course-area .step-7.step::after { transform: rotate(-15deg);  top: 93px; left: -174px;}
.englab-6year-course-area .step-6.step::after { transform: rotate(-11deg); top: 79px;}
.englab-6year-course-area .step-5.step::after { transform: rotate(-2deg); top: 50px; left: -180px;}
.englab-6year-course-area .step-4.step::after { transform: rotate(6deg); top: 27px;}
.englab-6year-course-area .step-3.step::after { transform: rotate(17deg); top: -10px; left: -174px;}
.englab-6year-course-area .step-2.step::after { transform: rotate(29deg); left: -175px; top: -54px; width: 200px;}
.englab-6year-course-area .step-1.step::after { transform: rotate(30deg); left: -182px; top: -67px; width: 210px;}

.englab-6year-course-area .step-7.step::before { top: 91px; }
.englab-6year-course-area .step-6.step::before { top: 77px; }
.englab-6year-course-area .step-5.step::before { top: 48px; }
.englab-6year-course-area .step-4.step::before { top: 24px; }
.englab-6year-course-area .step-3.step::before { top: -14px; }
.englab-6year-course-area .step-2.step::before { top: -59px; }
.englab-6year-course-area .step-1.step::before { top: -68px; }


/* 단계 라벨 공통 */
.englab-6year-course-area .step-label {
  border: 2px solid #F6A400; 
  padding: 3px;
  display: inline-block;
  border-radius: 100px;

}
.englab-6year-course-area .step-label em{
  display: block;  
  font-size: 18px;
  font-weight: 500;
  width: 80px;
  text-align: center;
  border-radius: 100px;
  line-height: 100%;
  padding: 5px 0 7px 0;
  color: #fff;
}
.englab-6year-course-area .step-label em strong{font-weight: 600; font-size: 24px; position: relative; top: 2px;}

.englab-6year-course-area .step-info h4 {
  font-size: 24px;
  font-weight: 700;
}
.englab-6year-course-area .step-info p{font-size: 18px;}

.englab-6year-course-area .step-info .period {
  font-size: 16px;
  background: #B3BCC4;
  color: #fff;
  padding: 3px 10px;
  line-height: 100%;
  font-weight: 500;
  border-radius: 4px;
  margin-left: 8px;
}


.englab-6year-course-area .step-7 .step-label{border-color: #F6A400;}
.englab-6year-course-area .step-7 .step-label em{ background:#F6A400; }

.englab-6year-course-area .step-6 .step-label{border-color: #F06B8F;}
.englab-6year-course-area .step-6 .step-label em{ background:#F06B8F; }

.englab-6year-course-area .step-5 .step-label{border-color: #9C85E2;}
.englab-6year-course-area .step-5 .step-label em{ background:#9C85E2; }

.englab-6year-course-area .step-4 .step-label{border-color: #4D5A7C;}
.englab-6year-course-area .step-4 .step-label em{ background:#4D5A7C; }

.englab-6year-course-area .step-3 .step-label{border-color: #4DA8FF;}
.englab-6year-course-area .step-3 .step-label em{ background:#4DA8FF; }

.englab-6year-course-area .step-2 .step-label{border-color: #B9D5EA;}
.englab-6year-course-area .step-2 .step-label em{ background:#B9D5EA; color:#333; }

.englab-6year-course-area .step-1 .step-label{border-color: #E9E3D6;}
.englab-6year-course-area .step-1 .step-label em{ background:#E9E3D6; color:#333; }



 .englab-level-map-area {
  padding: 50px 0 30px 0;
}

.englab-level-map-area .level-map-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px 20px 30px 20px;
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.06);
  display: flex;
  gap: 32px;
}

.englab-level-map-area .level-map-left {
  flex: 0 0 120px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.englab-level-map-area .level-arrow {
  position: relative;
  width: 200px;
  height: 100%;
  background: url(../images/level_system_7step_arrow.png) no-repeat;
  background-size: 100%;
}

.englab-level-map-area .level-arrow .arrow-body {
  padding-top: 55px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.englab-level-map-area .level-arrow .arrow-body span {
  font-size: 18px;
  font-weight: 700;
  font-weight: 700;
  color: #000;
  font-family: var(--englab-font);
  height: 60px;
  display: block;
  display: flex;
  justify-content: center;
  align-items: center;
}


.englab-level-map-area .level-map-right {
  flex: 1;
}

.englab-level-map-area .level-board {
  position: relative;
  height: 600px;
  background-color: #fdfdfd;
  padding: 0px 40px 30px 40px;
  margin: 0px 50px 20px 50px;
  background: url(../images/level_system_7step_arrow_up.png) no-repeat;
  background-size: 1000px;
  background-position: 85% 30%;
}

/* 그리드 배경 */
.englab-level-map-area .level-board::before {
  content: "";
  position: absolute;
  inset: 10px -28px;
  background-image:
    linear-gradient(#eceff3 1px, transparent 1px),
    linear-gradient(90deg, #eceff3 1px, transparent 1px);
  background-size: 20px 20px;
  opacity: 0.6;
  pointer-events: none;
}


.englab-level-map-area .range-box {
  position: absolute;
  border-radius: 24px;
  background: transparent;
  pointer-events: none;
}

.englab-level-map-area .range-reading {
  inset: 30px -51px -22px -36px;
  border: 3px solid #f4a623; /* 주황 */
}

.englab-level-map-area .range-speaking {
  inset: 40px -40px 68px 80px;
  border: 3px solid #21a34a; /* 초록 */
}

.englab-level-map-area .range-grammar {
  inset: 50px -27px 389px 552px;
  border-radius: 20px;
  border: 3px solid #7b3ef0;
}

.englab-level-map-area .range-phonics {
  inset: 449px 550px -10px -24px;
  border: 3px solid #f03b29; /* 빨강 */
  border-radius: 20px;
}




.englab-level-map-area .lab-label {
  position: absolute;
  z-index: 2;
  border: none;
  width: 150px;
  height: 60px;
  border-radius: 999px;
  background: #3F3F3F;
  color: #fff;
  font-family: var(--englab-font);
  font-size: 18px;
  font-weight: 600;
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.25);
  cursor: default;
  transform: translateX(-50%);
}

.englab-level-map-area .lab-seeker{ left: 7.14%;  bottom: 0px; }
.englab-level-map-area .lab-builder { left: 21.42%; bottom: 80px; }
.englab-level-map-area .lab-challenger { left: 35.70%; bottom: 160px; }
.englab-level-map-area .lab-explorer { left: 50.00%; bottom: 240px; }
.englab-level-map-area .lab-inventor { left: 64.28%; bottom: 320px; }
.englab-level-map-area .lab-innovator  { left: 78.56%; bottom: 400px; }
.englab-level-map-area .lab-master { left: 92.85%; bottom: 480px; }


.englab-level-map-area .axis-text {
  position: absolute;
  z-index: 2;
  margin: 0;
  font-weight: 800;
  font-size: 18px;
  font-family: var(--englab-font);
}

.englab-level-map-area .axis-reading {
  bottom: -10px;
  right: -20px;
  color: #f4a623;
}

.englab-level-map-area .axis-speaking {
  bottom: 83px;
  right: -13px;
  color: #21a34a;
}

.englab-level-map-area .axis-phonics {
  bottom: 1px;
  left: 174px;
  color: #f03b29;
}

.englab-level-map-area .axis-grammar {
  top: 173px;
  right: -9px;
  color: #7b3ef0;
}


.curriculum-cta-btn{position: relative; height: 100px;}
.curriculum-cta-btn p{ border-radius: 20px; color: #fff; overflow: hidden; width: 250px; padding: 10px 0 10px 20px;}
.curriculum-cta-btn .program-character{position: absolute; bottom: 0; right: 0;}
.curriculum-cta-btn .program-text { font-size: 16px; padding-left: 30px; font-family: var(--englab-font); }
.curriculum-cta-btn .program-text strong{font-size: 24px; font-weight: 500; display: block;}


.curriculum-cta-btn.program-btn--starland p{
  background: #00345b;
}
.curriculum-cta-btn.program-btn--bookrclass p{
  background: #3b73ff;
}
.curriculum-cta-btn.program-btn--talktree p{
  background: #0bb259;
}
.curriculum-cta-btn.program-btn--ello p{
  background: #6a4ad8;
}



@keyframes bounceSoft {
  0%   { transform: translateY(0); }
  25%  { transform: translateY(-8px); }
  40%  { transform: translateY(0); }
  60%  { transform: translateY(-4px); }
  100% { transform: translateY(0); }
}

@keyframes bounceStrong {
  0%   { transform: translateY(0); }
  20%  { transform: translateY(-14px); }
  40%  { transform: translateY(3px); }
  60%  { transform: translateY(-8px); }
  80%  { transform: translateY(1px); }
  100% { transform: translateY(0); }
}

@keyframes bounceScale {
  0%   { transform: translateY(0) scale(1); }
  20%  { transform: translateY(-10px) scale(1.05); }
  40%  { transform: translateY(0) scale(1); }
  60%  { transform: translateY(-5px) scale(1.03); }
  100% { transform: translateY(0) scale(1); }
}

@keyframes bounceFloat {
  0%   { transform: translateY(0); }
  30%  { transform: translateY(-12px); }
  50%  { transform: translateY(-6px); }
  70%  { transform: translateY(-12px); }
  100% { transform: translateY(0); }
}

@keyframes bounceUp {
  0% { transform: translateY(0); }
  25% { transform: translateY(-6px); }
  40% { transform: translateY(0); }
  60% { transform: translateY(-3px); }
  100% { transform: translateY(0); }
}

/* 둥둥 떠다니는 효과 */
@keyframes bubbleFloat {
  0%   { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(-7px); opacity: 1; }
  100% { transform: translateY(-4px); opacity: 1; }
}
/* 둥둥 떠다니는 효과 */
@keyframes bubbleFloat2 {
  0%   { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(7px); opacity: 1; }
  100% { transform: translateY(-7px); opacity: 1; }
}

.aisystem-manage-part2-area{padding: 70px 0 50px 0;}

.ello-howtouse{position: relative; z-index: 1000;}
.ello-howtouse ul{display: flex; flex-direction: column; gap: 70px;}

.curriculum-table { position: relative; margin-top: 50px; width: 100%;}


.curri-table {
  border-spacing: 5px;
  width: 100%;
  color: #000;
}
.curri-table th{
  font-family: var(--englab-font)
}
.curri-table thead th {
  padding: 10px 0 15px 0;
  text-align: center;
  font-size: var(--font-size18);
  line-height: 100%;
}

.curri-table tbody th {
  text-align: center;
  font-size: var(--font-size18);
  color: var(--englab-main);
  line-height: 100%;
}

.curri-table td {
  font-size: var(--font-size14);
  font-weight: 600;
  line-height: 120%;
  padding: 5px 2px;
  position: relative;
}

.curri-table td .td-inner{
  font-size: var(--font-size14);
  background: #fff;
  display: flex;
  padding: 20px 10px;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 100%;
}
.curri-table td .td-inner ul li{text-align: left; list-style: disc; padding: 3px;}

.curri-table img {
  width: 100%;
  height: auto;
}


/* 에러페이지 사이트맵 전체 영역 */
.error-sitemap {
  font-family: var(--englab-font);
  background: #f08300;
  color: #fff;
  padding: 40px 0;
}

.error-sitemap__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.error-sitemap__list {
  display: flex;
  justify-content: center;
  gap: 60px;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 1차 메뉴(컬럼) */
.error-sitemap__item {
  min-width: 90px;
}

.error-sitemap__title {
  display: block;
  margin-bottom: 10px;
  font-size: var(--font-size20);
  font-weight: 600;
}

/* 링크 기본 스타일 */
.error-sitemap a {
  color: #fff;
  text-decoration: none;
}

.error-sitemap a:hover,
.error-sitemap a:focus {
  text-decoration: underline;
}

/* 2차 메뉴 */
.error-sitemap__sub {
  list-style: none;
  margin: 0;
  padding: 0;
}

.error-sitemap__sub li a{
  font-size: var(--font-size14);
  color: rgba(255, 255, 255, 0.8);
  padding:  5px 0;
  display: block;
}

.curriculum-part03-box{margin-top: 30px;}

.curriculum-cta-area{margin-top: 50px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 30px;}
.curriculum-cta-title{display: flex; justify-content: center; align-items: center; padding-top: 55px;
  background: url(../images/curriculum_cta_title_bg.png) no-repeat 50% 0; background-size: 35px; 
  color: var(--englab-main); text-align: center; font-family: var(--englab-font); font-size: var(--font-size36); font-weight: 600; line-height: 100%;}
.curriculum-cta-list{display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px;}

.ailearning-part-area{display: flex; justify-content: center; align-items: center; flex-direction: column; position: relative;}
.ailearning-part-area.gray{background: #F5F7FE;}
.ailearning-part-area.starland-bg{background: var(--starland-color);}
.ailearning-part-area.bookrclass-bg{background: var(--bookrclass-color1);}
.ailearning-part-area.talktree-bg{background: var(--talktree-color);}
.ailearning-part-area.starland-features{ overflow: hidden; background: url("../images/starland_features_bg.png") no-repeat bottom center; background-size: cover;}
.ailearning-part-cont{padding: 100px 0; width: 100%; max-width: 1200px; display: flex; flex-direction: column; gap: 50px; }

.news-view-container .list-view-area .list-view-cont a{color: #0073ff; text-decoration: underline;}

.ailearning-part-cont .cont-title{justify-content: center; align-items: center; text-align: center;}
.ailearning-part-cont .cont-title .title-point{display: block; width: 123px; height: 40px; background-size: cover;}
.starland-warp .ailearning-part-cont .cont-title{color: #003B6F;}
.starland-warp .ailearning-part-cont .cont-title .title-point{ background: url(../images/ailearning_part_title_starland.png) no-repeat;}
.bookrclass-warp .ailearning-part-cont .cont-title{color: #263238;}
.bookrclass-warp .ailearning-part-cont .cont-title .title-point{background: url(../images/ailearning_part_title_bookrclass.png) no-repeat;}
.talktree-warp .ailearning-part-cont .cont-title{color: #104F2F;}
.talktree-warp .ailearning-part-cont .cont-title .title-point{background: url(../images/ailearning_part_title_talktree.png) no-repeat;}
.talktree-warp .learning-flow__num{display: none;}
.starland-warp .ailearning-part-area.light .cont-title,
.bookrclass-warp .ailearning-part-area.light .cont-title,
.talktree-warp .ailearning-part-area.light .cont-title{color: #fff;}
.starland-warp .ailearning-part-area.light .cont-title .title-point{ background: url(../images/ailearning_part_title_starland_light.png) no-repeat;}
.bookrclass-warp .ailearning-part-area.light .cont-title .title-point{ background: url(../images/ailearning_part_title_bookrclass_light.png) no-repeat;}
.talktree-warp .ailearning-part-area.light .cont-title .title-point{background: url(../images/ailearning_part_title_talktree_light.png) no-repeat;}

.feature-circle-cont-area{display: flex; justify-content: space-between; padding-bottom: 70px;}
.feature-circle-cont-area li:first-child,
.feature-circle-cont-area li:last-child{margin-top: 80px;}
.feature-circle-cont-area .feature-circle-cont{display: flex; text-align: center;
  width: 250px; height: 250px; border-radius: 300px; flex-direction: column;
  justify-content: center; align-items: center;
  gap: 10px; background: #fff; color:  var(--starland-color); aspect-ratio: 1/1;}
.feature-circle-cont-area .feature-circle-cont dt{font-size: var(--font-size24);}
.feature-circle-cont-area .feature-circle-cont dd{font-size: var(--font-size18);}

.bookrclass-warp .feature-circle-cont-area{padding-bottom: 200px;}
.bookrclass-warp .feature-circle-cont-area .feature-circle-cont{background: var(--bookrclass-color1); color: #fff;}
.bookrclass-features-bg-point{position: absolute; bottom: 50px; left: 50%; transform: translate(-50%, 0%);}

.ailearning-part-layout{display: flex; justify-content: center; align-items: center; flex-direction: column; position: relative;}
.ailearning-part-layout ul{display: flex; justify-content: space-between; gap: 50px;}
.ailearning-part-layout ul li{display: flex; flex-direction: column; gap: 30px;}

.bookrclass-level-point{position:absolute; top: 50px; left: 20%;  animation: starlandPlanetDrift 5s ease-in-out infinite; animation-delay: .3s;}



.ai-learning-review-area{
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px 60px;
}

.ai-learning-review-area .ai-learning-review-card {
  display: flex;
  align-items: center;
  gap: 40px;
}

.ai-learning-review-area .profile-area {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100px;
}

.ai-learning-review-area .profile-role {
  position: relative;
  top: -13px;
  display: flex;
  width: 90px;
  padding: 5px 10px;
  justify-content: center;
  align-items: center;
  font-size:var(--font-size14);
  font-weight: 700;
  border-radius: 40px;
  background: #FEC600;
  color: #100C00;
  box-shadow: 0 -5px 4px 0 rgba(0, 0, 0, 0.12);
}

.ai-learning-review-area .profile-thumb {
  display: flex;
  width: 120px;
  height: 120px;
  border-radius: 120px;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1/1;
  overflow: hidden;
  border: 4px solid #ffd54a;
  background: #fff;
}

.ai-learning-review-area .profile-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 말풍선 */
.ai-learning-review-area .review-bubble {
  width: 100%;
  background: #ffffff;
  padding: 20px 30px 20px 30px;
  border-radius: 60px; 
  position: relative; 
  color: #000;
  font-family: var(--englab-font);
  font-size: var(--font-size16); font-weight: 500;
  line-height: 140%;
  word-break: keep-all;
  box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.06);
  animation: floatBubble 3.5s ease-in-out infinite; animation-delay: 3s;
}

/* 말풍선 꼬리 — 무조건 왼쪽 */
.ai-learning-review-area .review-bubble::before {
  content: "";
  position: absolute;
  left: -14px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 16px solid #ffffff;
}

.ai-learning-review-area.starland .profile-role { background: #76FEBB; }
.ai-learning-review-area.starland .profile-thumb{border-color: #76FEBB;}

.ai-learning-review-area.talktree .profile-role { background: #EDFF3D; }
.ai-learning-review-area.talktree .profile-thumb{border-color: #EDFF3D;}


/* 전체 그리드 */
.two-column-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

/* 카드 공통 (추가 여백은 필요에 맞게 조정) */
.two-column-grid .whyuse-box {
  height: 100%;
}

/* 모바일에서 slick으로 바뀔 때 display 문제 방지 */
.two-column-grid.slick-initialized {
  display: block;
}

/* slick 공통 커스터마이징 */
.two-column-grid .slick-slide {
  padding: 0 8px;
  box-sizing: border-box;
}

/* 필요하면 슬릭 도트 숨기기/보이기 선택 가능 */
.two-column-grid .slick-dots {
  margin-top: 16px;
}
.three-column-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 50px; }

.customize-learn-box{background: var(--bookrclass-color1); border-radius: 30px; border: 5px solid var(--bookrclass-color1); overflow: hidden;}
.customize-learn-box dl{ color: #fff; display: flex; align-items: center; justify-content: space-between; }
.customize-learn-box dl dt{width: 250px; text-align: center; font-size: var(--font-size20); font-weight: 600;}
.customize-learn-box dl dd img{width: 100%; height: 200px;}

.images-color-box{background: var(--bookrclass-color1); border-radius: 20px; color: #fff; border: 5px solid var(--bookrclass-color1); overflow: hidden;}
.images-color-box .ra-caption{color: #FFF; font-family: var(--englab-font); text-align: center; font-size: var(--font-size18); font-weight: 500; line-height: 100%; padding: 15px 0;}
.ra-item.images-color-box{background: var(--bookrclass-color2); border-color: var(--bookrclass-color2);}
.ra-item.images-color-box .ra-caption{color: #000; }
.images-color-box img{width: 100%;}
/* 전체 박스 */
.reading-activity-box { max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}

/* 온라인 / 오프라인 구역 */
.reading-activity-box .ra-section {
  margin-bottom: 20px;
  position: relative;
  display: flex; justify-content: space-between; align-items: center; gap: 50px;
}

/* 왼쪽 라벨 */
.reading-activity-box .ra-title {
  border-radius: 20px;
  border: 3px solid var(--bookrclass-color2);
  color: var(--bookrclass-color2);
  display: flex;
  width: 120px;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  gap: 10px;
  flex-shrink: 0;
  align-self: stretch;
  font-size: var(--font-size20);
  font-family: var(--englab-font);
}

/* 아이템 리스트 (3개씩) */
.reading-activity-box .ra-items {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  align-items: start;
}

/* 이미지 + 캡션 */
.reading-activity-box .ra-item img {
  width: 100%;
  border-radius: 16px;
  display: block;
}


/* 가운데 + 표시 */
.reading-activity-box .ra-plus {width: 100%; text-align: center; margin-bottom: 20px; padding-left: 170px;}


.whyuse-box {
  background: var(--bookrclass-color1); /* 파란 배경 */
  color: #fff;
  border-radius: 30px;
  padding: 24px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 160px;
}

/* 텍스트 영역 */
.whyuse-box dl {
  margin: 0;
}

.whyuse-box dt {
  font-size: var(--font-size20);
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 8px;
}

.whyuse-box dd {
  margin: 0;
  font-size: var(--font-size14);
  line-height: 1.6;
}

.column-box-cont__images{width: 100%; max-width: 150px;}
.column-box-cont__images img {
  width: 100%;
  height: auto;
  display: block;
}


.starland-spot-title{display: flex;
  padding: 10px 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  text-align: center;
  background:  var(--starland-color);
  color: #FFF;
  font-family: var(--englab-font);
  font-size: var(--font-size20);
  font-weight: 600;
  line-height: 140%;}

.img-cont-box{text-align: center;}
.img-cont-box{font-family: var(--englab-font); font-weight: 600; font-size: var(--font-size20);}
.img-cont-box img{width: 100%;}
.img-cont-box p{margin-top: 20px;}

.learning-flow__desc{display: none;}
.starland-btn{border: 2px solid var(--starland-color); color:  var(--starland-color);}
.starland-btn:hover{border-color: var(--starland-color); background: var(--starland-color); color: #fff;}
.talktree-btn{border: 2px solid var(--talktree-color); color:  var(--talktree-color);}
.talktree-btn:hover{border-color: var(--talktree-color); background: var(--talktree-color); color: #fff;}

.bookrclass-point-video{display: flex; justify-content: center; align-items: center;}
.bookrclass-point-video .bookrclass-point-video__inner { display: flex; align-items: center; position: relative; flex-direction: column; gap: 30px;}
.bookrclass-point-video .video-card { width: 700px; height: 450px;   border: 15px solid #fff;}
.bookrclass-point-video .video-box,
.bookrclass-point-video .hero-video { width: 100%; height: 100%; display: block; object-fit: cover; border-radius: 12px;}

.interactive-content-box{position: absolute;  display: flex; z-index: 1003; width: 250px; height: 100px; padding: 10px 20px; justify-content: center; align-items: center; text-align: center; font-weight: 600; gap: 10px; border-radius: 30px; font-size: var(--font-size20); background: #FEC600; border-radius: 30px; font-family: var(--englab-font);}
.interactive-content-box.point01{left: -150px; top: 30px; box-shadow: 10px 0 10px 0 rgba(0, 0, 0, 0.12);}
.interactive-content-box.point02{right: -150px; top: 30px; box-shadow: -10px 0 10px 0 rgba(0, 0, 0, 0.12);}
.interactive-content-box.point03{left: -200px; top: 190px; box-shadow: 10px 0 10px 0 rgba(0, 0, 0, 0.12);}
.interactive-content-box.point04{right: -200px; top: 190px; box-shadow: -10px 0 10px 0 rgba(0, 0, 0, 0.12);}
.interactive-content-box.point05{left: -150px; bottom: 30px; box-shadow: 10px 0 10px 0 rgba(0, 0, 0, 0.12);}
.interactive-content-box.point06{right: -150px; bottom: 30px; box-shadow: -10px 0 10px 0 rgba(0, 0, 0, 0.12);}

.ex-small-text{color: rgba(0, 0, 0, 0.60); font-size: var(--font-size14); font-style: normal; text-align: center; line-height: 120%;}


/* 공통 섹션 */
.learning-flow__section {
  display: flex;
  align-items: flex-start;
  gap: 50px;
  margin-bottom: 40px;
  width: 1200px;
}

/* 왼쪽 그린 원 라벨 */
.learning-flow__label {
  flex-shrink: 0;
}

.learning-flow__label span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: var(--talktree-color);
  color: #fff;
  font-size: var(--font-size20);
  font-weight: 700;
  font-family: var(--englab-font);
  text-align: center;
}

/* 오른쪽 콘텐츠 */
.learning-flow__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 30px;
  min-width: 0;
}

/* 위/아래 행 */
.learning-flow__row {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 50px;
  background: url("../images/talktree_learning_process_arrow.png") no-repeat 100% 40%;
}
.learning-flow__row.right {
  justify-content: flex-end;
  align-items: flex-start;
  background-position: -466% 40%;
}
.learning-flow__row.fluency-focus{
  background: none;
}
.learning-flow__row .lf-step-set{ 
  display: flex;
  justify-content: center; align-items: flex-start;
  gap: 10px;
}
.learning-flow__row .lf-step-set__20{  
  display: flex;
  justify-content: flex-start;
  gap: 20px;
}

  .talktree-process-flow {
    max-width: 1200px;
    margin: 0 auto;
  }
  

/* 단계 카드 */
.talktree-process-flow .lf-step {
  position: relative;
  width: 160px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column;
  gap: 10px;
}

/* 카드 안 모바일 화면 */
.talktree-process-flow .lf-step__card {
  margin-bottom: 10px;
  box-shadow: 0 4px 30px 0 rgba(0, 0, 0, 0.13);
  border-radius: 20px;
  max-width: 170px;
}

.talktree-process-flow .lf-step__card img {
  display: block;
  width: 100%;
  height: auto;
}

.talktree-process-flow .lf-step__desc { color: #000; text-align: center; font-family: var(--englab-font); font-size: var(--font-size14); font-weight: 500; line-height: 140%; word-break: keep-all;}
.talktree-process-flow .lf-step__desc span{margin-top: 10px; display: block; color: #454545;}


/* 중간 배너 텍스트 */
.learning-flow__banner {
  margin: 50px 0 50px 210px;
  padding: 10px 16px;
  text-align: center;
  background: var(--talktree-color);
  color: #fff;
  font-size: var(--font-size24);
  font-weight: 600;
  font-family: var(--englab-font);
}

/* 하단 섹션(Fluency) 설명 블록 */
.learning-flow__content--fluency {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}

.learning-flow__row--fluency {
  flex: 1;
  gap: 20px;
}

.talktree-process-flow .lf-desc-block {
  flex: 1;
  color: #000;
  font-family: var(--englab-font);
  font-size: var(--font-size18); font-weight: 600; line-height: 160%; letter-spacing: -0.18px; }

.talktree-process-flow .lf-desc-block__highlight {
  color: var(--talktree-color);
  font-weight: 500;
  margin-top: 40px;
}

.learning-flow__section--fluency .lf-step::after {
  content: none;
}

/* 2x2 그리드 */
.talktree-features-area .talktree-grid {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px 20px;
}

/* 4개 기능 박스 */
.talktree-features-area .feature-box {
  background: #fff;
  border-radius: 22px;
  padding: 30px 30px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
  position: relative;
  z-index: 1000;
  text-align: left;
}

.talktree-features-area .feature-box h3 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
}

.talktree-features-area .feature-box p {
  font-size: 14px;
  line-height: 140%;
  margin: 0;
}

.talktree-features-area .feature-box.fs-2,
.talktree-features-area .feature-box.fs-4{
  text-align: right;
}

/* ■■■ 가운데 플로팅 카드는 그리드 위를 덮는 형태 ■■■ */
.talktree-features-area .feature-center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  width: 350px;
  padding: 30px 0 20px 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0px;
  border-radius: 100px;
  border: 15px solid #F5F7FE;
  background: var(--talktree-color);
  z-index: 1003;
}

/* 중앙 타이틀 */
.talktree-features-area .center-title {color: #000;
  text-align: center;
  font-size: var(--font-size14);
  font-weight: 500;
  line-height: 140%;
}

.talktree-features-area .center-title span {
  color: #FFF;
  text-align: center;
  text-shadow: 0 4px 0 rgba(0, 0, 0, 0.25);
  font-family: var(--englab-font);
  font-size: var(--font-size28);
  display: block;
  font-weight: 800;
  line-height: 140%; /* 39.2px */
  margin-bottom: 5px;
}

.talktree-features-area .center-face {
  position: relative;
  margin: 20px auto 0;
  width: 123px;
  height: 60px;
  background: url(../images/talktree_character_face.svg) no-repeat 50% 50%; background-size: cover;
}

.quick-control-box {
  position: fixed;
  right: 20px;
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
  z-index: 1050;
}

.quick-control-box.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.quick-control-box .btn-go-top {
  width: 50px;
  height: 50px;
  border: none;
  padding: 0;
  cursor: pointer;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.7);
  box-shadow: 0 4px 30px 0 rgba(0, 0, 0, 0.13);
}

/* TOP 텍스트는 시각적으로 숨기고 접근성용으로만 사용 */
.quick-control-box .icon-top {
  position: absolute;
  width: 14px;
  height: 20px;
  background: url("../images/icon_top.svg") no-repeat center center;
  background-size: contain;
  font-size: 0;
}




.textbook-list-wrap {width: 100%;}
.textbook-list{background: var(--englab-bg1);}
.textbook-list::after{content: ''; width: 100%; height: 50px; background: url(../images/textbook_section_bg1.jpg) no-repeat 0 50%; background-size: 100%; display: block;}
.textbook-list:nth-child(even){background: #fff;}
.textbook-list:nth-child(even)::after{background: url(../images/textbook_section_bg2.jpg) no-repeat 0 50%; background-size: 100%;}
.textbook-list:last-child::after{display: none;}

.textbook-list-wrap .textbook-list__inner { width: 100%; max-width: 1000px; padding: 70px 0; margin: 0 auto; display: flex; align-items: center; flex-direction: column; gap: 20px; }
.textbook-list-wrap .textbook-list__inner:first-child{padding-top: 0;}
.textbook-list-wrap .textbook-list__inner:last-child{padding-bottom: 100px;}
.textbook-contents{width: 100%; display: flex; display: flex; flex-direction: row; align-items: center;}
.textbook-contents .textbook-thumb{width: 300px; height: 300px;}
.textbook-contents .textbook-thumb img{width: 100%;}
.textbook-list-wrap .textbook-info{ flex: 1; display: flex; flex-direction: column; gap: 20px;}
.textbook-list-wrap .textbook-title { text-align: center; font-family: var(--englab-font); font-size: var(--font-size36); font-style: normal; font-weight: 700; line-height: 100%; display: inline-block; margin-bottom: 0; }
.textbook-list-wrap .textbook-level-badge { border-left: 2px solid #000; line-height: 100%; padding-left: 10px; margin-left: 10px; font-size: var(--font-size30); }

.textbook-list-wrap .textbook-desc-box { border-radius: 10px; font-size: var(--font-size14); text-align: center; border: 2px solid #f08300; background: #fff; padding: 20px 20px; font-size: 12px; line-height: 1.5; color: #444; }
.textbook-list-wrap .textbook-desc-box ul li{ color: #000; text-align: left; font-size: var(--font-size14); line-height: 120%; padding-bottom: 6px; }
.textbook-list-wrap .textbook-desc-box ul li:last-child{padding-bottom: 0;}
.textbook-list-wrap .textbook-desc-box ul li p{display: inline-block; width: 80px;}
.textbook-list-wrap .textbook-desc-box ul li span{display: block; margin-left: 80px;}
.textbook-list-wrap .textbook-desc-box ul li p::after{content: '|'; padding-left: 10px; padding-right: 10px;}

.textbook-list-wrap .textbook-books { border-radius: 30px; background: #FFF; box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.12); width: 100%; padding: 40px 20px; }
.textbook-list-wrap .textbook-books__row{ display: flex; flex-direction: column; gap: 10px;}
.textbook-list-wrap .textbook-books__row ul{ display: flex; justify-content: space-between; align-items: center; width: 100%;}
.textbook-list-wrap .textbook-books__row ul:nth-child(2){padding: 0 30px;}
.textbook-list-wrap .textbook-books__row ul li { display: flex; justify-content: center; align-items: center;}
.textbook-list-wrap .textbook-books__row ul li img { width: 60px; height: 80px; display: block;}
.textbook-list-wrap .textbook-books__row.part-seeker ul{justify-content: center; gap: 30px;}
.textbook-list-wrap .textbook-books__row.part-seeker ul:nth-child(2){justify-content: center; gap: 115px;}
.textbook-list-wrap .textbook-books__row.part-seeker ul li img { width: 85px; height: 111px;}
.textbook-list-wrap .textbook-books__row.part-master ul li img { width: auto; height: 105px;}

.textbook-list-wrap .level-seeker .textbook-title { color: #f08300; }
.textbook-list-wrap .level-seeker .textbook-level-badge { color: #f08300; border-color: #f08300;}
.textbook-list-wrap .level-seeker .textbook-desc-box { border-color: #f08300;}
.textbook-list-wrap .level-seeker .textbook-tag { background: #f08300; }

.textbook-list-wrap .level-builder .textbook-title { color: #d23b2f; }
.textbook-list-wrap .level-builder .textbook-level-badge { color: #d23b2f; border-color: #d23b2f;}
.textbook-list-wrap .level-builder .textbook-desc-box { border-color: #d23b2f;}
.textbook-list-wrap .level-builder .textbook-tag { background: #d23b2f; }

.textbook-list-wrap .level-challenger .textbook-title { color: #0050a4; }
.textbook-list-wrap .level-challenger .textbook-level-badge { color: #0050a4; border-color: #0050a4;}
.textbook-list-wrap .level-challenger .textbook-desc-box { border-color: #0050a4;}
.textbook-list-wrap .level-challenger .textbook-tag { background: #0050a4; }

.textbook-list-wrap .level-explorer .textbook-title { color: #00764a; }
.textbook-list-wrap .level-explorer .textbook-level-badge { color: #00764a; border-color: #00764a;}
.textbook-list-wrap .level-explorer .textbook-desc-box { border-color: #00764a;}
.textbook-list-wrap .level-explorer .textbook-tag { background: #00764a; }

.textbook-list-wrap .level-inventor .textbook-title { color: #f5a623; }
.textbook-list-wrap .level-inventor .textbook-level-badge { color: #f5a623; border-color: #f5a623; }
.textbook-list-wrap .level-inventor .textbook-desc-box { border-color: #f5a623;}
.textbook-list-wrap .level-inventor .textbook-tag { background: #f5a623; }

.textbook-list-wrap .level-innovator .textbook-title { color: #5a2aa8; }
.textbook-list-wrap .level-innovator .textbook-level-badge { color: #5a2aa8; border-color: #5a2aa8;}
.textbook-list-wrap .level-innovator .textbook-desc-box { border-color: #5a2aa8;}
.textbook-list-wrap .level-innovator .textbook-tag { background: #5a2aa8; }

.textbook-list-wrap .level-master .textbook-title { color: #222b3f; }
.textbook-list-wrap .level-master .textbook-level-badge { color: #222b3f; border-color: #222b3f;}
.textbook-list-wrap .level-master .textbook-desc-box { border-color: #222b3f;}
.textbook-list-wrap .level-master .textbook-tag { background: #222b3f; }



@media (max-width: 1024px) {
  html, body {
    scrollbar-width: none;      /* Firefox */
    -ms-overflow-style: none;   /* IE, Edge */
  }
  
  html::-webkit-scrollbar,
  body::-webkit-scrollbar {
    display: none;              /* Chrome, Safari */
  }



  .container { min-height:auto; }
  .footer {padding: 50px 30px;}
  .sub-section{padding: 0 30px;}
  .lnb-section { padding: 50px 50px 30px 50px;}
  .lnb-area { gap: 10px; }

  .rs-fluency-curriculum__levels {gap: 20px;}

  main{padding-top: 60px;}
  .main-warp main{padding-top:0px;}
  .main-warp{margin-top: 60px;}
  
  header{height: 60px;}
  .header .header-area .header-logo{padding-left: 20px;}
  .header .header-menu .main-nav{gap: 30px; margin-right: 20px;}
  .header .header-menu .nav-menu{width: auto;}
  .header .header-logo .logo-img { width: 130px; height: 30px;}


  .main-section .content { padding: 100px 50px; gap: 50px;}

  .main-title {font-size: 42px;}
  .main-title span {font-size: 28px;}
  
  .video-card { max-width: 540px; height: 305px;}
  .hero-copy .text {font-size: 36px;}

  .textbook-list-wrap .textbook-books__row ul li { margin-left: -10px;}
  .textbook-list-wrap .textbook-books__row ul li img { width: 55px; height: 60px;}

  .worry-interview-box .worry-bubble.interview05 {top: 200px;}
  .worry-interview-box .worry-bubble.interview06 {top: 330px; right: 90px; }

  .chat-bubble.interview01 .bubble{max-width: 250px;}
  .chat-bubble.interview02 .bubble{max-width: 200px;}
  .chat-bubble.interview03 .bubble{max-width: 220px;}
  .chat-bubble.interview04 .bubble{max-width: 280px;}
  .chat-bubble.interview05 .bubble{max-width: 215px;}
  .chat-bubble.interview06 .bubble{max-width: 240px;}

  .ello-guide-area { margin-top: 20px; gap: 80px; }
  .ello-guide-box { width: 390px;}
  .ello-guide-box .ello-img{ width: 430px;}
  .ello-guide-box .ello-img img{width: 100%;}

  .main-study-effect-cont .effect-circle{font-size: 20px;}
  .main-study-effect-cont .effect-right.performance {top: 60px;}
  .main-study-effect-cont .effect-desc-box {width: 25%;}
  .main-study-effect-cont .effect-right.reading{width: 20%; bottom: 50px;}
  .main-study-effect-cont .effect-desc-box ul {padding-left: 0px;}
  .main-study-effect-cont .effect-desc-box ul li {font-size: 16px;}

  .hybrid-system-avatar { width: 130px; height: 130px;}
  .hybrid-system-right li {font-size: 18px;}
  .hybrid-system-left-text { font-size: 20px;}
  .hybrid-system-left {min-width: 360px;}
  .hybrid-system-wrap {gap: 30px;}

  .main-section.main-part05 {background-size: cover;}
  .englab-english-routine-box .routine-content {width: 300px; height: 300px;}
  .englab-english-routine-box ul { padding: 0px 15px;}
  .englab-english-routine-box ul li {max-width: 31%;}
  .routine-star { width: 30px; height: 30px; margin-bottom: 14px;}
  .englab-english-routine-box .routine-content h3 { color: #000; font-size: 24px;}
  .englab-english-routine-box .routine-content p { font-size: 14px;}

  .main-description-card {gap: 24px;}
  .main-description-card .text ul{margin: 0 20px 0 50px; height: 100px;}
  .card-list-inline {gap: 60px;}
  .main-description-card .image { width: 120px; height: 120px;}
  .main-description-card .title { font-size: 22px;}

  .visual-section .visual-section-text{font-size: var(--font-size40);}
  .visual-section .visual-section-inner { padding: 50px 0; }
  .cont-title {font-size: var(--font-size36);}

  .ailearning-part-area{padding: 0 50px;}
  .mainvisual-starland-bg__item01 img{width: 600px}
  .sub-mainvisual{min-height: auto;}

  .englab-hero__line { font-size: var(--font-size36);}
  .englab-hero-image__inner{ font-size: var(--font-size36);}

  .lnb-area .lnb-title-area .title {gap: 7px;}
  .lnb-area .lnb-title-area .title strong{font-size: 48px;}

  .sub-section{padding: 0 50px;}
  .sub-section .lab-meaning-area{padding: 50px 0;}

  .englab-hero { padding: 50px 0; min-height: auto;}
  .englab-hero-image { padding: 50px 0; min-height: auto;}

  .aisystem-manag-feature-area.feature-example02 .user{margin-top: -40px;}
  .aisystem-manag-feature-area.feature-example03 .user .speech-balloon { top: 40%;}
  .aisystem-manag-feature-area.feature-example03 .ello .speech-balloon { top: 20%;}
  .aisystem-manag-feature-area.feature-example03 .ello .speech-balloon::after{top: 130px;}
  .ello-highlight-bar{line-height: 140%; padding: 20px 0;}
  .ello-highlight-bar span{display: block; font-size: 30px;}
  .right-fixed-item .right-item img{width: 230px;}

  .aisystem-manag-use-area .use-feature {width: 480px;}
  .aisystem-manag-use-area .use-main p {font-size: 30px;}
  .ai-system-learning-infographic .ai-learning-inner { width: 500px; height: 500px; background-size: 500px;}
  .ai-system-learning-infographic .ai-card__inner { width: 280px; padding: 20px 40px; height: 140px;}
  .ai-system-learning-infographic .ai-card h3 { font-size: 22px;}
  .ai-system-learning-infographic .ai-card--right {right: -150px;}
  .ai-system-learning-infographic .ai-card--left {left: -150px;}
  .ai-system-learning-infographic .ai-center-circle { width: 130px; height: 130px;}

  .ai-system-learning-infographic .ai-card ul{display: none;}
  .ai-system-learning-infographic .ai-card ul li { font-size: 12px;}

  .learning-part02{padding: 0 0;}
  .learning-process-box::after {background-size: 900px; background-position: 22% 0%;}
  .learning-system-process ul li.right .learning-process-box::after{ background-size: 900px; background-position: 22% 0%;}
  .learning-process-box .stage-badge {left: 50px;}
  .learning-process-box .stage-badge__desc {font-size: 19px;}
  .learning-process-box .stage-badge__title { margin: 10px 0 25px 0;}
  .learning-system-process ul li.right .learning-process-box .stage-badge {right: 50px;}
  .learning-system-process ul li .mascot-box{z-index: 1000;}
  .learning-system-process ul li:nth-child(1) .mascot-box {right: 48%;}
  .learning-system-process ul li:nth-child(2){background-position: 37% 0%;}
  .learning-system-process ul li:nth-child(2) .mascot-box { left: 150px;  top: -30px;}
  .learning-system-process ul li:nth-child(3){ background-size: 1910px; background-position: 71% -50px;}
  .learning-system-process ul li:nth-child(4){ background-size: 1750px; background-position: 41% 20%;}
  
  .curriculum-education-goal-area { padding: 40px 0 60px 0;}
  .curriculum-education-goal-area .goal-hex { width: 260px; height: 225px;}

  .englab-6year-course-area .course-left {  width: 280px; }
  .englab-6year-course-area .step-1.step::before {top: -28px; }
  .englab-6year-course-area .step-2.step::before {top: -9px; }
  .englab-6year-course-area .step-3.step::before { top: 16px; }

  .englab-6year-course-area .step-1.step::after { transform: rotate(20deg); top: -27px; width: 194px;}
  .englab-6year-course-area .step-2.step::after { transform: rotate(15deg); left: -175px; top: -6px; width: 180px; }
  .englab-6year-course-area .step-3.step::after { transform: rotate(8deg); top: 19px; width: 176px;}


  .englab-level-map-area .range-phonics { inset: 448px 339px -10px -43px;}
  .englab-level-map-area .range-grammar{ inset: 50px -44px 389px 342px}
  .englab-level-map-area .range-speaking { inset: 40px -52px 68px 27px;}
  .englab-level-map-area .range-reading { inset: 30px -61px -22px -60px;}

  .englab-level-map-area .axis-grammar { top: 216px; right: -38px;}
  .englab-level-map-area .axis-phonics { left: 123px;}

  .curriculum-cta-list{grid-template-columns: repeat(2, 1fr);}
  .curriculum-cta-btn p {width: 300px;}

  .mainvisual-cont .lnb-section { height: auto;}
  .mainvisual-cont {gap: 20px;}
  .mainvisual-cont .mainvisual-cont__inner {padding: 0 50px 70px 50px;}

  .video-card{position: relative; z-index: 999;}

  .sub-mainvisual .mainvisual-starland-bg__item01 {right: -7%;}
  .sub-mainvisual .mainvisual-starland-bg__item02 { position: absolute;top: 43%; left: -40px;}
  .sub-mainvisual .mainvisual-starland-bg__item02 img{width: 100px;}
  .sub-mainvisual .mainvisual-starland-bg__item03 img{width: 150px;}
  .sub-mainvisual .mainvisual-starland-bg__item04 img{width: 200px;}

  .sub-mainvisual .mainvisual-talktree-bg__item01 { left: 50%;}

  .feature-circle-cont-area .feature-circle-cont { width: 220px; height: 220px;}
  .feature-circle-cont-area .feature-circle-cont dt{font-size: 22px; line-height: 140%;}
  .feature-circle-cont-area .feature-circle-cont dd{font-size: 16px;}

  .ailearning-part-layout.starland-connection-box ul li:nth-child(1) img{ height: 950px;}
  .bookrclass-features-bg-point { bottom: 50px;}

  .ailearning-part-cont{padding: 70px 0;}
  .ailearning-part-area#bookrclass-features{padding-bottom: 100px;}

  #bookrclass-features{padding-bottom: 100px;}
  #bookrclass-level .ailearning-part-layout img{width: 100%;}

  .ai-learning-review-area .review-bubble br{display: none;}



  #talktree-learning-report .ailearning-part-layout img{width: 100%;}

}

@media (max-width: 820px) {

  .br-pc { display: none; }
  .br-ta { display: block; }
  .br-ta2 { display: block;}
  .br-mo { display: none; }

  .img-pc { display: none; }
  .img-mo { display: block;}

  .rs-fluency-curriculum__levels { gap: 10px;}
  .rs-fluency-curriculum__level--step7::before { position: absolute; top: -30px; border-left-width: 70px; border-right-width: 70px; border-bottom-width: 40px;}
  .rs-fluency-curriculum__cefr-level { padding: 5px 0; font-size: 15px;}
  .rs-fluency-curriculum__title { font-size: 14px;}


  .textbook-list::after { background: url(../images/textbook_section_bg1_mo.jpg) no-repeat 0 50%; background-size: 100%; height: 90px;}
  .textbook-list:nth-child(even)::after { background: url(../images/textbook_section_bg2_mo.jpg) no-repeat 0 50%; background-size: 100%; }
  .sub-section.textbook-part01{padding: 0 0 0 0;}
  .textbook-list-wrap .textbook-books__row { flex-direction: row; justify-content: center; gap: 30px;}
  .textbook-list-wrap .textbook-books__row ul { justify-content: flex-start; flex-direction: column; width: auto;}
  .textbook-list-wrap .textbook-books__row ul:nth-child(2){padding: 0 0 0 0;}
  .textbook-list-wrap .textbook-books__row ul li img { width: 100%; height: auto;}
  .textbook-list-wrap .textbook-books__row.part-seeker ul li img { width: 100%; height: auto;}
  .textbook-list-wrap .textbook-books__row.part-seeker ul:nth-child(2){gap: 30px;}
  .textbook-list-wrap .textbook-list__inner{padding: 50px 30px 50px 30px;}
  .textbook-list-wrap .textbook-list__inner:last-child { padding-bottom: 50px;}
  .textbook-contents{padding-top: 70px;}
  .textbook-list-wrap .textbook-desc-box ul li{font-size: 18px;}
  .textbook-list-wrap .textbook-desc-box ul li p{width: 100px;}
  .textbook-list-wrap .textbook-desc-box ul li span{display: contents; margin-left: 0;}
  .textbook-list-wrap .textbook-level-badge{display: block; border: none; margin: 0 0 0 0; padding: 5px 0 0 0;}
  

  .learning-system-process ul li .learning-process-box::after{
    background: url(../images/aisystem_learning_part02_process_line1_ta.png) no-repeat;
    top: 170px;
    background-position: 24% 50%;
  }
  .learning-system-process ul li.right .learning-process-box::after{
    background: url(../images/aisystem_learning_part02_process_line2_ta.png) no-repeat;
    background-position: 24% 50%;
  }
  .learning-system-process ul li:nth-child(3) {
    background-size: 1630px;
    background-position: 65% -30px;}
    .learning-system-process ul li:nth-child(1) .mascot-box {
      right: 38%; bottom: 30px;
  }
  .learning-system-process ul li:nth-child(3) .mascot-box { bottom: 60px;
    right: 35%;}

    .learning-system-process ul li:nth-child(4) .mascot-box {
      bottom: 20px;
      left: 34%;
  }
  .main-section .content { padding: 70px 50px; }

  .video-card { max-width: 390px; height: 218px; }
  .hero-copy .text { font-size: 30px; }
  .card-list-inline { gap: 30px; }
  .main-part02-card .text{padding: 0;}
  .main-section .content { gap: 30px;}
  .main-part02-card .image {  height: auto;}
  .main-title { font-size: 36px; }

  .worry-interview-box .chat-left.worry-bubble { left: -30px; }
  .worry-interview-box .chat-right.worry-bubble { right: -30px; }
  .worry-interview-box .worry-bubble.interview01 { top: 30px; left: -10px;}
  .worry-interview-box .worry-bubble.interview03 { top: 360px; left: 0px;}
  .worry-interview-box .worry-bubble.interview04 { top: 30px; right: -10px;}
  .worry-interview-box .worry-bubble.interview06 { top: 360px; right: 0;}
  .worry-interview-box .center-text { font-size: 32px;}

  .chat-bubble.interview04 .bubble { max-width: 280px; }
  .ello-guide-box { width: 300px; } 
  .ello-guide-box .ello-img { width: 340px; }
  .ello-guide-box .ello-title p { font-size: 30px;}
  .ello-guide-box .ello-title span{word-break: keep-all; padding: 0 50px; text-align: center; display: block;}
  .main-study-effect-cont .effect-desc-box { width: 26%; letter-spacing: -1px; font-size: 12px; }
  .main-section.main-part08 .section-description{width: 50%; text-align: center; word-break: keep-all;}
  .main-study-effect-cont .effect-left::after { width: calc(100% + 30px);}
  .main-study-effect-cont .effect-left.wcpm {left: 0px; bottom: 20px;}
  .main-study-effect-cont .effect-right.reading { padding-right: 0px; width: 21%; bottom: -40px; }
  .main-study-effect-cont .effect-right.reading::before { width: calc(100% + 40px);}
  .englab-english-routine-box .routine-content h3 { font-size: 20px; }
  .englab-english-routine-box ul li { max-width: 34%; }
  .englab-english-routine-box .routine-content h3 { margin-bottom: 0; font-size: 20px;  }

  .main-part08-area{gap: 50px;}

  .main-title.sub{font-size: 36px;}
  .main-title.sub span{font-size: 20px;}
  .main-study-effect-cont .effect-right.performance { top: 47px; }
  .main-study-effect-cont .effect-right::before { width: calc(100% + 180px);}

  .hybrid-system-banner { flex-direction: column; background: var(--englab-main);}
  .hybrid-system-banner br{display: none;}
  .hybrid-system-left{background: var(--englab-main); gap: 0px;}
  .hybrid-system-avatar { width: 100px; height: 70px;} 
  .hybrid-system-left-text { font-size: 24px; }
  .hybrid-system-right {padding: 20px 30px 20px 30px;}
  .hybrid-system-right li { font-size: 22px;}
  .hybrid-system-right li .point-check {width: 30px; height: 30px;}
  

  .main-description-area .main-description-card{padding: 30px 0;}
  .main-description-area .main-description-card::after { width: 15px; height: 34px; right: -25px;}
  .main-description-area .main-description-card .image { width: 90px; height: 90px; }
  .main-description-area .main-description-card .title{font-size: 18px;}
  .main-description-area .main-description-card .title p{font-size: 12px;}
  
  .main-description-area.main-features-cont01 .main-description-card .text ul { margin: 0px 0px 0 20px;}
  .main-description-area.main-features-cont03 .main-description-card::after{ width: 18px; height: 18px; right: -25px;}
  .main-description-area.main-features-cont03 .main-description-card .text{ height: 60px;}

  .main-description-card .text{font-size: 14px; padding: 0 20px;}
  .main-part06-graph{padding: 0 0;}
  .main-part06-graph ul {flex-direction: column;}
  .main-part06-graph ul li{padding-left: 80px; position: relative;}
  .main-part06-graph ul li dl dd{position: absolute; left: 0; top: 50%;transform: translate(0%, -50%); padding-top: 0;}



  .main-part07-cont p { font-size: 36px;}

  .chat-bubble.interview01 .bubble {max-width: 200px;}
  .chat-bubble.interview02{top: 183px;}
  .chat-bubble.interview02 .bubble {max-width: 170px;}
  .chat-bubble.interview04 .bubble { max-width: 220px; }
  .chat-bubble.interview05 .bubble { max-width: 180px; }

  .hybrid-system-left-text { font-size: 22px; }

  .lnb-area .lnb-title-area .title strong { font-size: 36px; }
  .lnb-area .lnb-title-area .title-desc{font-size: 18px;}
  .englab-hero__line { font-size: var(--font-size30); margin: 0px 0;}
  .timeline-box { width: 100%; display: grid; grid-template-columns: 90px 40px 1fr; gap: 10px;}
  .timeline-box .year { font-size:30px;}
  .timeline-box .text{ position: relative; top: -1px; text-shadow: 7px 3px 9px rgba(255, 255, 255, 1);}
  .timeline-box .timeline-cont{gap: 0px; }
  .timeline-wrap { background-size: 400px; background-position: 285px 90px;}
  .timeline-container{background: rgba(255, 255, 255, 0.7);}

  .speech-balloon {padding: 20px 30px;}
  .speech-balloon::after { top: 41px; left: -12px;}
  .speech-balloon.reverse::after {right: -11px;}
  .operation-feature-box {padding-top: 60px;}
  .dialog-user-box.ello img{width: 300px;}
  .dialog-user-box.user img{width: 160px;}
  .aisystem-manag-feature-area.feature-example01 .ello .speech-balloon {width: 440px; top:30%;}
  .aisystem-manag-feature-area.feature-example01 .user .speech-balloon {width: 390px; left: 230px; top: 40%;}
  
  .aisystem-manag-feature-area.feature-example02 .operation-feature-box { align-items: flex-start; padding: 100px 0 0px 0; }
  .aisystem-manag-feature-area.feature-example02 .ello .speech-balloon { left: 220px; top: 26%; width: 400px;}
  .aisystem-manag-feature-area.feature-example02 .user {margin-top: -100px;}
  .aisystem-manag-feature-area.feature-example02 .user .speech-balloon { left: -322px; top: 20%; width: 300px;}

  .aisystem-manag-feature-area.feature-example03 .operation-feature-box { padding: 30px 0 0px 0; }
  .aisystem-manag-feature-area.feature-example03 .ello {margin-bottom: 60px;}
  .aisystem-manag-feature-area.feature-example03 .ello .speech-balloon{top: 2%; left: -340px; width: 420px;}
  .aisystem-manag-feature-area.feature-example03 .user .speech-balloon { left: 190px;}
  .ello-highlight-bar { line-height: 140%; padding: 20px 30px; }

  .aisystem-manag-use-area .check-list li { font-size: 18px;}
  .aisystem-manag-use-area .use-feature { width: 310px;}
  .aisystem-manag-use-area .use-main p { font-size: 24px;}
  .aisystem-manag-use-area .use-label {font-size: 18px;}

  .curriculum-education-goal-area .goal-hex { width: 200px; height: 173px; }
  .curriculum-education-goal-area .goal-hex-shape { font-size: 20px;}

  .curriculum-education-goal-area .goal-title { width: 420px; margin: 0 auto; padding: 36px 0px;}

  .englab-6year-course-area .course-left { width: 10px;}
  .englab-6year-course-area .course-left img { width: 260px; opacity: 0.1;}
  .englab-6year-course-area .course-inner{gap: 0;}
  
  .englab-6year-course-area .step::before{display: none;}
  .englab-6year-course-area .step::after{display: none;}

  .englab-level-map-area .level-map-inner { padding: 20px 40px 30px 20px;}
  .englab-level-map-area .level-arrow { width: 140px; background-size: 140px;}

  .englab-level-map-area .range-phonics { inset: 448px 157px -11px -58px;}
  .englab-level-map-area .range-grammar { inset: 51px -59px 389px 82px; }
  .englab-level-map-area .range-speaking { inset: 41px -70px 68px -13px; }
  .englab-level-map-area .range-reading { inset: 32px -81px -22px -70px; }

  .englab-level-map-area .axis-text { font-size: 13px;}

  .englab-level-map-area .axis-grammar { top: 56px; right: 145px; }
  .englab-level-map-area .axis-speaking { bottom: 83px; right: -53px;}
  .englab-level-map-area .axis-reading { right: -60px;}
  .englab-level-map-area .axis-phonics { left: 113px; }

  .curriculum-table-area{padding-bottom: 30px; position: relative;}
  .curriculum-table-area::before {
    content: "← swipe";
    position: absolute;
    left: 8px;
    bottom: 0px;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.3);
    pointer-events: none;
  }

  .curriculum-table-area::after {
    content: "swipe →";
    position: absolute;
    right: 8px;
    bottom: 0px;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.3);
    pointer-events: none;
  }

  .curriculum-table {
    overflow-x: scroll;
    -webkit-overflow-scrolling: auto;
    margin-top: 30px;
    scrollbar-width: thin;
    scrollbar-color: #e5d9ce #f1f1f1;
    scroll-snap-type: x mandatory;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 10px;
  }

  .curriculum-table::-webkit-scrollbar {
    height: 10px;
  }

  .curriculum-table::-webkit-scrollbar-track {
    background: #e5d9ce;
    border-radius: 10px;
  }

  .curriculum-table::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    border: 2px solid #f1f1f1;
  }

  .curriculum-table::-webkit-scrollbar-thumb:hover {
    background: #8f93a3;
  }



  .curriculum-table .curri-table { min-width: 1200px;   }
  .curri-table td{font-size: 16px;}
  .sub-mainvisual .mainvisual-starland-bg__item01 { right: -32%; top: 36%; }
  .mainvisual-cont .video-card{height: 198px;}
  .feature-circle-cont-area .feature-circle-cont { width: 160px; height: 160px; gap: 5px;}
  .feature-circle-cont-area .feature-circle-cont dt {font-size: 18px;}
  .feature-circle-cont-area .feature-circle-cont dd {font-size: 12px;}
  .ailearning-part-cont {gap: 30px; }
  .sub-mainvisual .mainvisual-starland-bg__item05 {right: -90px;}
  .ailearning-part-layout.starland-connection-box ul li:nth-child(1){display: flex; align-items: flex-end; justify-content: flex-end;}
  .ailearning-part-layout.starland-connection-box ul li:nth-child(1) img{height: 650px;}
  .lnb-area .lnb-title-area .title { font-size: 34px; }
  .bookrclass-features-bg-point { bottom: 20px; }
  .ai-learning-review-area{grid-template-columns: repeat(1, 1fr);}

  .contact-box { max-width: 100%; margin: 0 30px; }
  .event-state {width: 70px;}


}

@media (max-width: 768px) {
  .br-pc { display: none; }
  .br-ta { display: block; }
  .br-mo { display: none; }

  .sub-section .content {padding: 70px 0;}

  .hero-copy .text { font-size: 28px; }
  .video-card { max-width: 340px; height: 191px; }

  .main-description-area .main-description-card { gap: 14px; }
  .main-description-area .main-description-card .title {width: 100%; text-align: center;}
  .main-description-area .main-description-card .title p{ width: 120px; margin: 0 auto 5px auto; }
  .main-description-area .main-description-card .text ul { margin: 0 0px 0 15px;}
  
  .main-section .slick-slider .slick-list .slick-track{padding: 30px 0;}


  .mobile-slide-frame{width: 100%;  overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 12px;}

    .news-view-container .lnb-section.lnb-solo{display: none;}
    .list-view-area .list-view-title {
      padding: 10px 0px 15px 0px;
      justify-content: flex-start;
      align-items: flex-start;
      border-radius: 0;
      border:none;
      border-bottom: 1px solid #ECECEF;
      background: none;
      flex-direction: column;
      height: auto;
      gap: 10px;
  }
  .list-view-area .list-view-title .text-area { align-items: flex-start; flex-direction: column; gap: 0px;}
  .list-view-area .list-view-title .text-area .btn-page-back {position: relative; left: -11px;}
  .list-view-area .list-view-title .text-area h5{font-size: 22px; line-height: 140%;}

  .list-view-area .list-view-cont{padding: 30px 0px; text-align: left;}
  
  .news-view-container .btn{padding: 15px 25px;}

  .news-notice-container .table thead{display: none;}
  .news-notice-container .table tbody tr{display: flex; flex-direction:column; width: 100%;} 
  .news-notice-container .table tbody tr td{width: 100% !important; display: block;height: auto; }
  .news-notice-container .table tr th:nth-child(1),
  .news-notice-container .table tr th:nth-child(2),
  .news-notice-container .table tr td:nth-child(1),
  .news-notice-container .table tr td:nth-child(2){display: none;}

  .news-notice-container .table tr td:nth-child(3){border-bottom: none; padding: 15px 10px 0px 10px; font-size: 15px; font-weight: 600;}
  .news-notice-container .table tr td:nth-child(4){text-align: left; color: #6C757D; padding: 5px 10px 15px 10px; font-size: 14px; font-weight: 400;}

  .ai-system-learning-infographic .ai-center::after { width: 100%; }
    
}

  
@media (max-width: 430px) {
  .footer {
    padding: 30px 30px;
}

  .br-pc { display: none; }
  .br-ta { display: none; }
  .br-mo { display: block; }

  .main-part06-cont{display: none;}
  .main-part06-mo-imgbox{display: block;}
  .main-part06-mo-imgbox img{width: 100%;}

  .btn-warp{margin-top: 30px;}

  
  .textbook-contents { flex-direction: column; padding-top: 0px;}
  .textbook-contents .textbook-thumb{width: 200px; height: 200px;}
  .textbook-list-wrap .textbook-title{font-size: 24px;}
  .textbook-list-wrap .textbook-level-badge{font-size: 20px; display: inline-block; padding-top: 0;}
  .textbook-list-wrap .textbook-desc-box ul li { font-size: 13px; }
  .textbook-list-wrap .textbook-desc-box ul li p { width: 70px; }
  .textbook-list-wrap .textbook-info__head{text-align: center;}
  .textbook-list-wrap .textbook-info { padding-top: 10px; gap: 10px;}
  .textbook-list-wrap .textbook-books__row{gap: 20px; justify-content: center;}
  .textbook-list-wrap .textbook-books__row ul li img { width: 50px}
  .textbook-list-wrap .textbook-books__row.part-seeker{gap: 40px;}
  .textbook-list-wrap .textbook-books__row.part-seeker ul li img { width: 80px;}
  .textbook-list-wrap .textbook-books__row.part-master ul li img { width: 60px; height: auto;}
  .textbook-list::after { height: 40px;}


  .footer .foot-area .foot-logo img { width: 150px; }
  .footer .foot-area .foot-cont{font-size: 12px;}

  .ailearning-part-cont .cont-title .title-point { width: 80px; height: 26px;}
  .starland-warp .ailearning-part-cont .cont-title .title-point{ background: url(../images/ailearning_part_title_starland.png) no-repeat; background-size: 100%;}
  .starland-warp .ailearning-part-area.light .cont-title .title-point{ background: url(../images/ailearning_part_title_starland_light.png) no-repeat; background-size: 100%;}
  .bookrclass-warp .ailearning-part-cont .cont-title .title-point { background: url(../images/ailearning_part_title_bookrclass.png) no-repeat; background-size: 100%;}
  .bookrclass-warp .ailearning-part-area.light .cont-title .title-point { background: url(../images/ailearning_part_title_bookrclass_light.png) no-repeat; background-size: 100%;}


  .talktree-warp .ailearning-part-cont .cont-title .title-point { background: url(../images/ailearning_part_title_talktree.png) no-repeat; background-size: 100%;}
  .talktree-warp .ailearning-part-area.light .cont-title .title-point { background: url(../images/ailearning_part_title_talktree_light.png) no-repeat; background-size: 100%;}

  .rs-fluency-curriculum__step { bottom: auto; text-align: left; top: -22px;}
  .rs-fluency-curriculum__step span{border: 2px solid #fff; font-size: 18px; background: #fff; padding: 3px 10px; border-radius: 50px; box-shadow: 0 6px 18px rgba(0,0,0,0.12);}
  .rs-fluency-curriculum { padding: 0px 0 60px 0;}
  .rs-fluency-curriculum__levels { gap: 40px; flex-direction: column; align-items: flex-start; overflow: hidden;}
  .rs-fluency-curriculum__level{flex-direction: row; height: auto; width: 80%; align-items: center;}
  .rs-fluency-curriculum__content{width: 70%;}
  .rs-fluency-curriculum__cefr{width: 30%;}
  .rs-fluency-curriculum__cefr-level{font-size: 14px;}
  .rs-fluency-curriculum__title{text-align: left;}
  .rs-fluency-curriculum__title br{display: none;}
  .rs-fluency-curriculum__desc{text-align: left;}
  .rs-fluency-curriculum__desc li{display: contents; margin-bottom: 0; word-break: keep-all;}
  .rs-fluency-curriculum__desc li::after{content: '/'; padding-left: 5px;}
  .rs-fluency-curriculum__desc li:last-child::after{display: none;}

  .rs-fluency-curriculum__level--step1 { width: 75%; margin-top: 40px;}
  .rs-fluency-curriculum__level--step2 { width: 78%;}
  .rs-fluency-curriculum__level--step3 { width: 81%;}
  .rs-fluency-curriculum__level--step4 { width: 84%;}
  .rs-fluency-curriculum__level--step5 { width: 87%;}
  .rs-fluency-curriculum__level--step6 { width: 90%;}
  .rs-fluency-curriculum__level--step7 { width: 88%; margin-bottom: 8px; border-radius: 6px 0 0 6px;}
  .rs-fluency-curriculum__level--step7::before { top: 50%; left: 99%; transform: translateY(-50%); border-left: 35px solid #6266F2; border-top: 60px solid transparent; border-bottom: 60px solid transparent; }


  .modal-title{font-size: 18px;}
  .board-list-top .total-text{padding-bottom: 2px;}

  .news-view-container .btn { padding: 14px 25px;}
  .news-view-container .modal .btn { padding: 8px 25px;}
  .privacy-box-area { margin-top: 30px;}

  .learning-system-process ul li .learning-process-box::after {
    background: url(../images/aisystem_learning_part02_process_line1_mo.png) no-repeat;
    top: 110px;
    background-position: 30% -50%;
    background-size: 180px;
    width: 300px;
    margin: 0 auto;
  }
  .learning-system-process ul li.right .learning-process-box::after{
    background: url(../images/aisystem_learning_part02_process_line2_mo.png) no-repeat;
    background-position: 30% -50%;
    background-size: 180px;
  }

  .footer .foot-area { align-items: flex-start; flex-direction: column;}
  .footer .foot-area .foot-cont .foot-inline-data span::after { content: ''; display: block;}
  .footer .foot-cs-guide dl { margin: 20px 0 0px 0; gap: 5px; }
  .footer .foot-cs-guide dl dt{text-align: left;}
  .footer .foot-cs-guide dl dd{text-align: left;}
  .footer .foot-cs-guide dl dd span{display: block;}
  .footer .copyright-area { align-items: self-start;}

  .branch-academy-box{padding: 20px 20px;}
  .branch-academy-box dl { align-items: flex-start; flex-direction: column; line-height: 140%; gap: 10px;}
  .branch-academy-box dl dt{width: auto; border-right: none; line-height: 21px; font-size: 14px;}
  .branch-academy-box dl dt p{display: inline-block;}
  .branch-academy-box dl dt p a{margin-top: 0; margin-left: 10px;}
  .branch-academy-box dl dd span{display: block; font-size: 12px;}
  .branch-academy-box dl dd br{display: none;}

  .footer .copyright-area .copyright{font-size: 11px;}

  .btn{font-size: 16px;}

  .main-section .content { padding: 50px 30px;  }
  .main-section .content.mo-full{padding: 50px 0; }
  .main-section .content.mo-full .main-title{padding: 0 30px; }

  .main-section.main-part01 .two-areas{flex-direction: column; justify-content: center; align-items: center; gap: 20px;}
  .main-section.main-part01 .hero-copy{text-align: center;}
  .main-section.main-part01 .hero-copy .text { word-break: keep-all; font-size: 28px; width: 100%; text-align: center; margin-bottom: 0px;}
  .main-section.main-part01 .hero-copy .text br{display: none;}
  
  .main-section.main-part01 .blog-link-pc{display: none;}
  .main-section.main-part01 .blog-link-mo{display: block;}

  .video-card { max-width: 100%; height: 190px;}
  .main-title { font-size: 28px; gap: 5px;}
  .main-title span { font-size: 18px; line-height: 140%;}
  .main-title p{display: contents; word-break: keep-all;}

  .main-part02-card { padding: 20px 20px 20px 20px; gap: 10px; width: 100%;}
  .main-part02-card .text { font-size: 16px;}
  .main-part02-card .image { width: 220px; margin: 0 auto;}

  .card-list-inline .slick-list{overflow:hidden; padding: 0 30px !important;}
  .card-list-inline .slick-slide {margin: 0 10px; }

  .main-part0501 .card-list-inline .slick-slide,
  .main-part0502 .card-list-inline .slick-slide,
  .main-part0503 .card-list-inline .slick-slide {margin: 0 20px !important;}

  .ello-guide-area { gap: 50px; flex-direction: column; padding-right: 60px;}

  .worry-interview-box {background-size: 100%; background-position: 50% 100%; align-items:flex-end; height: auto; padding-top: 550px; padding-bottom: 40px; margin-top: 50px;}
  
  .chat-bubble .avatar {animation: none;}
  .chat-bubble .bubble{font-size: 14px;}
  .chat-bubble.interview01 .bubble {max-width: 100%;}
  .chat-bubble.interview02 .bubble {max-width: 100%;}
  .chat-bubble.interview03 .bubble {max-width: 100%;}
  .chat-bubble.interview04 .bubble {max-width: 100%;}
  .chat-bubble.interview05 .bubble {max-width: 100%;}
  .chat-bubble.interview06 .bubble {max-width: 100%;}
  .worry-interview-box .worry-bubble.interview01 {top: 0px;}
  .worry-interview-box .worry-bubble.interview04 { top: 85px;}
  .worry-interview-box .worry-bubble.interview02 { top: 170px; left: 0px; }
  .worry-interview-box .worry-bubble.interview05 { top: 253px; right: 0px; }
  .worry-interview-box .worry-bubble.interview03 { top: 321px; left: 0px; }
  .worry-interview-box .worry-bubble.interview06 { top: 406px; right: 0;}


  .ello-guide-box { width: 100%; position: relative; height: 225px; padding: 25px 0 0px 30px; align-items: flex-start;}
  .ello-guide-box .ello-img{ width: 210px; position: absolute; text-align: left; right: -65px; bottom: -15px;}
  .ello-guide-box .ello-title{text-align: left; font-size: 20px;}
  .ello-guide-box .ello-title p{text-align: left; font-size: 26px;}
  .ello-guide-box .ello-title span{text-align: left; padding: 0 0 0 0;}

  .main-title.sub { font-size: 26px; }
  .main-title.sub span { font-size: 16px; }
  .main-part06-graph ul li dl dd{font-size: 16px;}
  .main-part06-graph ul li { padding-left: 55px;}
  .main-section.main-part07 .content { padding: 70px 30px;}
  .main-part07-cont p {font-size: 23px;}
  .main-part07-cont .btn-warp { margin-top: 30px;}
  .main-section.main-part07 .btn-primary { height: 46px;}
  


  .main-study-effect-cont .effect-right {padding-right: 0px;}
  .main-study-effect-cont .effect-right::before { width: 2px; height: 100px; right: auto; left: -29px; top: -5px;}
  .main-study-effect-cont .effect-right::after { top: -15px; left: -35px;}
  .main-study-effect-cont .effect-right.performance { top: 0px; right: 6px; width: 54%;}
  .main-study-effect-cont .effect-right.reading{padding-bottom: 10px; width: 30%; bottom: 6px;}
  .main-study-effect-cont .effect-right.reading::before { width: 2px; height: 130px; top: auto; bottom: 0;}
  .main-study-effect-cont .effect-right.reading::after { top: auto; bottom: 0; left: -35px;}
  .main-study-effect-cont .effect-left.wcpm::before { right: auto; left: -12px; top: auto; bottom: 0;}
  .main-study-effect-cont .effect-left.wcpm::after { width: 2px; height: 120px; left: -7px; top: auto; bottom: 0;}

  .main-study-effect-cont .effect-wrap { flex-direction: column; gap: 20px;}
  .main-study-effect-cont .effect-center{margin-bottom: 10px; width: 100%;}
  .main-study-effect-cont .effect-circle {font-size: 14px;}    
  .main-study-effect-cont .effect-desc-box{position: relative; margin-bottom: 20px;}
  .main-study-effect-cont .effect-desc-box ul { padding-left: 30px;}
  .main-study-effect-cont .effect-desc-box ul li { font-size: 14px; }
  .main-study-effect-cont .effect-left{padding-left: 7px;}
  .main-study-effect-cont .effect-left.wcpm { width: 100%; left: auto; bottom: auto;}
  .main-study-effect-cont .effect-left.wcpm::after { height: 100%; bottom: auto; top: -5px; left: 6px;}
  .main-study-effect-cont .effect-left.wcpm::before { right: auto; left: 1px; top: -15px; bottom: auto; }
  .main-study-effect-cont .effect-right{padding-left: 7px;}
  .main-study-effect-cont .effect-right::before { width: 2px; height: 120px; right: auto; left: 6px; top: -5px; }
  .main-study-effect-cont .effect-right::after { top: -15px; left: 1px; }
  .main-study-effect-cont .effect-right.performance { top: auto; right: auto;  width: 100%; }
  .main-study-effect-cont .effect-right.reading { padding-bottom: 0px; width: 100%; bottom: auto; }
  .main-study-effect-cont .effect-right.reading::after { top: -15px; bottom: auto; left: 1px;}
  .main-study-effect-cont .effect-right.reading::before { height: 100%; top: -5px; bottom: auto;}

  .main-study-effect-cont .effect-desc-box-title{display: block; font-size: 14px; font-weight: 600; margin:5px 0; font-family: var(--englab-font); padding: 8px 10px 5px 10px; border-radius: 0 5px 5px 0;}
  .main-study-effect-cont .performance .effect-desc-box-title{background: #FEE4EF;}
  .main-study-effect-cont .reading .effect-desc-box-title{background: #EAE2FB;}
  .main-study-effect-cont .wcpm .effect-desc-box-title{background: #DBE3F2;}


  .main-section.main-part08 .section-description { width: 100%; font-size: 12px; font-weight: 400; margin-top: 20px;}

  .hybrid-system-avatar { width: 80px; height: 70px; }
  .hybrid-system-left { min-width: 100%; }
  .hybrid-system-left-text { font-size: 16px; padding-right: 30px; word-break: keep-all; line-height: 120%; }
  .hybrid-system-right { padding: 15px 10px 15px 15px;}
  .hybrid-system-right li { font-size: 14px; line-height: 140%; word-break: keep-all; align-items: flex-start; font-weight: 500; gap: 5px;}
  .hybrid-system-right li .point-check {width: 18px; height: 18px;}

  .englab-english-routine-box { background: none}
  .englab-english-routine-box ul{flex-direction: column; padding: 0 0 0 0; gap: 10px;}
  .englab-english-routine-box ul li { max-width: 100%; border: 10px solid var(--ello-main); background: #fff; border-radius: 70px;}
  .englab-english-routine-box .routine-content {width: 100%; height: auto; padding: 20px 20px;}
  .englab-english-routine-box .routine-content .routine-star{ width: 40px; height: 40px; margin-bottom: 0; position: absolute; top: -11px; left: -12px;}
  .englab-english-routine-box .routine-content h3 { margin-bottom: 0; font-size: 18px; width: 100%; text-align: center;}
  .englab-english-routine-box .routine-content p{ width: 100%; padding-left: 0px; margin-top: 10px;}
  .englab-english-routine-box .routine-content h3 br,
  .englab-english-routine-box .routine-content p br{display: none;}

  .main-description-card { flex-direction: column; gap: 15px;}
  .main-description-card .text{padding: 0 20px 0 20px; font-size: 14px; text-align: center;}
  .main-description-card .title { width: 100%; height: auto;}
  .main-description-card .image { position: relative; right: auto; top: auto; transform: none; width: 120px; height: 120px; margin: 15px auto 15px auto;}

  .main-description-area.main-features-cont01 .main-description-card .text{padding: 0 0 0 0; height: 75px;}
  .main-description-area.main-features-cont01 .main-description-card .text ul {margin: 0px 20px 0 40px;}
  .main-description-area.main-features-cont02 .main-description-card .text{height: 60px;}
  .main-description-area.main-features-cont03 .main-description-card .text{padding: 0 30px 0 30px; height: auto;}
  
  .lnb-section { padding: 30px 30px 30px 30px; }
  .lnb-area .lnb-nav{font-size: 14px;}
  .lnb-area .lnb-nav h1{font-size: 14px;}
  .lnb-area .lnb-title-area .title{word-break:keep-all;}
  .lnb-area .lnb-title-area .title strong {font-size: 32px; line-height: 120%;}
  .lnb-area .lnb-title-area .title-desc { font-size: 16px; word-break:keep-all; line-height: 140%;}
  .englab-hero__video,
  .englab-hero__overlay::before{border-radius: 0;}
  .englab-hero__line { display: contents; font-size: 24px; word-break: keep-all;}
  .englab-hero__line.logo-line{display: block; margin-top: 20px;}
  .englab-hero__line.logo-line img{height: 30px;}

  .sub-section {padding: 0 30px;}

  .cont-title { font-size: 28px; line-height: 120%;}
  .cont-title span {font-size: 18px; line-height: 120%;}
  .cont-text {font-size: 14px; line-height: 160%; word-break: keep-all; font-weight: 400;}


  .sub-section .content.mo-full{padding: 50px 0; }
  .sub-section .content.mo-full .cont-title{padding: 0 30px; }


  .content-box { gap: 10px;}
  .sub-section .lab-meaning-area{padding: 40px 0;}
  
  .englab-hero-image{padding: 50px 30px 50px 30px;}
  .englab-hero-image__inner{font-size: 24px;}
  .englab-hero-image__inner p{display: contents; word-break: keep-all;}
  .englab-hero-image.franchise-inquiry-contact {background-attachment: unset;}
  .brand-container .englab-hero-image {background-attachment: unset;}
  .form-title{margin-top: 0;}
  .box-center .cont-title { margin: 0 auto 30px auto; }

  .timeline-wrap { position: relative; max-width: 1200px; padding: 30px 0 50px 0; background: none;}
  .timeline-box { grid-template-columns: 60px 30px 1fr;}
  .timeline-box .year { font-size: 24px; top: -2px;}
  .timeline-box .timeline-cont { font-size: 14px; position: relative; top: 5px;}
  .timeline-box .date{width: 20%;}
  .timeline-box .text{width: 80%;}

  .sub-section .content { padding: 50px 0;}
  .timeline-box.timeline-skip-area { padding: 40px 0; }
  

  .dialog-user-box.ello img { width: 170px; }
  .aisystem-manag-feature-area.feature-example01 .user{padding-left: 0;}
  .aisystem-manag-feature-area.feature-example01 .ello .speech-balloon { width: 260px; top: 30%; }
  .speech-balloon{font-size: 14px; padding: 20px 20px;}
  .speech-balloon::after { top: 45px; left: -10px; }
  .speech-balloon.reverse::after {right: -9px;}
  .dialog-user-box.user img { width: 100px; }


  .operation-feature-layout{gap: 80px;}

  .ello-highlight-bar {line-height: 140%; padding: 10px 10px; font-size: 14px; font-weight: 400;}
  .ello-highlight-bar span{margin-top: 5px; font-size: 24px; font-weight: 600;}

  .aisystem-manag-feature-area.feature-example01 .operation-feature-box{ padding: 250px 0 50px 0;}
  .aisystem-manag-feature-area.feature-example01 .ello .speech-balloon { width: 210px; top: 20%; left: -150px; }
  .aisystem-manag-feature-area.feature-example01 .ello .speech-balloon.reverse::after {top: 80px; }
  .aisystem-manag-feature-area.feature-example01 .user { padding-left: 0; top: 70px; }
  .aisystem-manag-feature-area.feature-example01 .user .speech-balloon { width: 200px; min-width: 100px; left: 115px; top: 0%;}

  .aisystem-manag-feature-area.feature-example02 .operation-feature-box { padding: 50px 0 0 0; }
  .aisystem-manag-feature-area.feature-example02 .user{margin-top: -50px; z-index: 1000;}
  .aisystem-manag-feature-area.feature-example02 .user .speech-balloon { left: -182px; top: 8%; width: 160px; min-width: 100px; }  
  .aisystem-manag-feature-area.feature-example02 .speech-balloon br{display: none;}
  .aisystem-manag-feature-area.feature-example02 .ello{bottom: -30px;}
  .aisystem-manag-feature-area.feature-example02 .ello .speech-balloon { left: 90px;  top: 20%;  width: 225px; min-width: auto; z-index: 1001;}
  .aisystem-manag-feature-area.feature-example02 .ello .speech-balloon::after{left: -9px;}
  .aisystem-manag-feature-area.feature-example02 .ello img { width: 130px; position: relative; left: 0px; z-index: 1000;}

  .aisystem-manag-feature-area.feature-example03 .operation-feature-box {padding: 0 0 0 0; }
  .aisystem-manag-feature-area.feature-example03 .speech-balloon br{display: none;}
  .aisystem-manag-feature-area.feature-example03 .ello { margin-bottom: 70px;}
  .aisystem-manag-feature-area.feature-example03 .ello img { width: 130px; z-index: 1000;}
  .aisystem-manag-feature-area.feature-example03 .ello .speech-balloon { top: 7%; left: -180px; width: 210px; min-width: auto; z-index: 1001;}
  .aisystem-manag-feature-area.feature-example03 .ello .speech-balloon::after {top: 90px; }
  .aisystem-manag-feature-area.feature-example03 .user{margin-top: 20px; z-index: 1002; bottom: -20px;}
  .aisystem-manag-feature-area.feature-example03 .user .speech-balloon { top: 10%; left: 120px; width: 180px; min-width: auto;}
  
  .right-fixed-item .right-item img { width: 140px; }
  .aisystem-manag-use-area .check-list li { font-size: 14px; }
  .aisystem-manag-use-area .aisystem-use-box {padding: 20px 20px;}
  .aisystem-manag-use-area .use-inner { gap: 20px; padding-top: 30px; flex-direction: column;}
  .aisystem-manag-use-area .use-feature { width: 100%; height: auto; padding: 20px 20px; }
  .aisystem-manag-use-area .use-main .text-box::before { left: -10px; top: -14px; width: 40px; height: 30px;}
  .aisystem-manag-use-area .use-main .text-box::after { right: -10px; bottom: -14px; width: 40px; height: 30px;}
  .right-fixed-item .right-item { right: -30px; top: 20px;}
  .aisystem-manag-use-area .use-label { font-size: 16px; padding: 12px 30px 12px 30px; }
  .aisystem-manag-use-area .aisystem-use-list { display: flex; flex-direction: column; gap: 50px;}
  .aisystem-manag-use-area .check-list li::before { left: 1px; top: -2px; width: 9px; height: 15px; border-right: 3px solid #ffe84a; border-bottom: 3px solid #ffe84a;}
  .aisystem-manag-use-area .use-main p { font-size: 22px;}

  .ai-system-learning-infographic .ai-learning-inner { width: 250px; height: 250px; background: url(../images/ai-system_learning_infographic_bg_mo.png) no-repeat 50% 50%; background-size: 250px;}
  .ai-system-learning-infographic .ai-card__inner { width: 120px; height: 120px; padding: 5px 20px; gap: 5px;  }
  .ai-system-learning-infographic .ai-card h3 { font-size: 16px; }
  .ai-system-learning-infographic .ai-card h3 span{ font-size: 12px; display: block;}
  .ai-system-learning-infographic .ai-center-circle { width: 90px; height: 90px;}
  
  .ai-system-learning-infographic { padding: 0px 0 70px; }
  .ai-system-learning-infographic .ai-card--left { left: -50px; }
  .ai-system-learning-infographic .ai-card--right { right: -50px; }
  
  .ex-small-text{font-size: 11px; word-break: keep-all;}

  .learning-process-box .stage-badge__title {
    margin: 5px 0 10px 0;
    font-size: 20px;
}
.learning-process-box .stage-badge__desc {
  font-size: 14px;
}
.sub-section.learning-part02{padding: 0 0 0 0;}


.learning-system-process ul li:nth-child(1) {
  background: url(../images/aisystem_learning_part02_bg01.png) no-repeat 50%;
  background-size: 680px; background-position: 60% 201px;}
  .learning-system-process ul li:nth-child(2) {
    background-position: 27% 0%;
}

.ai-center::after .stage-badge { width: 230px; border: 7px solid #fff; position: absolute; top: 120px; left: 50%;  transform: translateX(-50%);}

.learning-process-box .stage-badge {width: 230px; border: 7px solid #fff;}
  
.learning-system-process ul li{min-height: 400px;}
.learning-system-process ul li:nth-child(1) .mascot-box { right: 65%; width: 100px; top: 270px; }
.learning-system-process ul li:nth-child(1) .mascot-box img{width: 100%;}
.learning-system-process ul li:nth-child(2) { background-position: 39% 110%; background-size: 660px; }
.learning-system-process ul li:nth-child(2) .mascot-box{top: 240px; left: 0%;}
.learning-system-process ul li:nth-child(2) .mascot-box img{width: 70%;}

.learning-system-process ul li:nth-child(3) { background-size: 620px; background-position: 75% 0px; }
.learning-system-process ul li:nth-child(3) .mascot-box{left: 25px;}
.learning-system-process ul li:nth-child(3) .mascot-box img{width: 90px;}

.learning-system-process ul li:nth-child(4) { background-size: 590px; background-position: 37% -17%; }
.learning-system-process ul li:nth-child(4) .mascot-box { top: 80px; left: 270px; }
.learning-system-process ul li:nth-child(4) .mascot-box img{width: 90px;}

.curriculum-education-goal-area { padding: 50px 0 0px 0; }
.curriculum-education-goal-area .goal-title { width: 310px; min-width: auto; padding: 20px 0px; font-size: 26px; }
.curriculum-education-goal-area .goal-hex-list { top: -90px;  display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;}
.curriculum-education-goal-area .goal-hex-shape { font-size: 16px; }
.curriculum-education-goal-area .goal-hex {margin-left: 0px; width: 150px; height: 130px;}
.curriculum-education-goal-area .goal-bridge { top: -42px; }
.curriculum-education-goal-area .goal-bridge svg{width: 70%;}

.sub-section#englab-curriculum-steps{padding: 0 0 0 0 ;}

.englab-6year-course-area .step-label em strong{font-size: 14px; top: 0px;}
.englab-6year-course-area .step-label em{font-size: 14px;width: 50px;}
.englab-6year-course-area .course-left {
  width: 0px; display: none;
}
.englab-6year-course-area .step-info h4 {
  font-size: 18px;}
  .englab-6year-course-area .step-info p {
    font-size: 12px;
}
  .englab-6year-course-area .step-info .period {
  font-size: 12px;}
  .englab-6year-course-area .course-steps {
    background: url(../images/englab_curriculum_6year_arrow.png) no-repeat 118% 0%;
    background-size: 180px; padding-left: 30px;}

  .englab-6year-course-area .step-info .period { padding: 3px 5px;}
  .curriculum-part02-box {
    margin-top: 30px;
}
.englab-6year-course-area {
  padding-bottom: 0px;
}

.englab-level-map-area .level-arrow .arrow-body span {
  font-size: 14px;}

  .englab-level-map-area .level-arrow {
    width: 80px;
    background-size: 80px;
}

.englab-level-map-area .level-map-left {
  flex: auto;}
  .englab-level-map-area .lab-label {width: 80px;
    height: 30px;
    font-size: 12px;}
    .englab-level-map-area .level-map-inner {
      padding: 20px 20px 50px 10px;
  }
  .englab-level-map-area .level-board {height: 400px; background: none;}
  
  .englab-level-map-area .lab-seeker{bottom: 0px; }
  .englab-level-map-area .lab-builder {bottom: 50px; }
  .englab-level-map-area .lab-challenger {bottom: 100px; }
  .englab-level-map-area .lab-explorer {bottom: 150px; }
  .englab-level-map-area .lab-inventor {bottom: 200px; }
  .englab-level-map-area .lab-innovator  {bottom: 250px; }
  .englab-level-map-area .lab-master { bottom: 300px; }
  .englab-level-map-area .axis-text { font-size: 10px; }
  .englab-level-map-area { padding: 30px 0 30px 0; }
  .englab-level-map-area .range-reading { inset:25px -58px -49px -79px; }
  .englab-level-map-area .range-phonics { inset: 312px -32px -16px -58px; }
  .englab-level-map-area .range-grammar { inset: 60px -43px 239px -37px; }
  .englab-level-map-area .range-speaking { inset: 33px -51px 39px -67px; }
  .englab-level-map-area .level-arrow .arrow-body { padding-top: 68px; gap: 21px;}
  .englab-level-map-area .level-arrow .arrow-body span {height: 30px;}
  .englab-level-map-area .axis-phonics { left: 57px; bottom: -10px; }
  .englab-level-map-area .axis-reading { right: -45px; bottom: -44px; }
  .englab-level-map-area .axis-grammar { top: 66px; right: 56px; }
  .englab-level-map-area .axis-speaking { top: 39px; left: -54px; width: 210px; }

  .curriculum-cta-area { margin: 30px 0;}
  .curriculum-cta-list{grid-template-columns: repeat(1, 1fr); gap: 15px; width: 100%;}
  .curriculum-cta-list li{flex: 1; width: 100%; }
  .curriculum-cta-btn{display: block; width: 100%; height: 68px;}
  .curriculum-cta-btn .program-text {position: absolute; bottom: 0; width: 100%; font-size: 18px; line-height: 100%; height: 67px; width: 100%; padding: 12px 0 10px 20px; display: flex; justify-content: flex-start; gap: 10px; align-items: center;}
  .curriculum-cta-btn .program-text strong { font-size: 20px; display: inline-block; font-weight: 600;}
  .curriculum-cta-btn .program-text span{opacity: 0.7; }
  .curriculum-cta-btn .program-character{right: -10px;}
  .curriculum-cta-btn .program-character img { height: 72px; }


  .lnb-area .lnb-title-area .title-desc.support { font-size: 14px; }
  .lnb-area .lnb-title-area .title { font-size: 24px; }

  .brand-container .lnb-area .lnb-title-area .title strong,
  .operation-container .lnb-area .lnb-title-area .title strong,
  .curriculum-container .lnb-area .lnb-title-area .title strong{display: contents;}
  

  .mainvisual-starland-bg__item01 img { width: 390px; }
  .sub-mainvisual .mainvisual-starland-bg__item01 { right: -112%; top: 21%; }
  .sub-mainvisual .mainvisual-starland-bg__item01 img { width: 240px; }
  .sub-mainvisual .mainvisual-starland-bg__item02 { top: 54%; }
  .sub-mainvisual .mainvisual-starland-bg__item04 img { width: 110px; }
  .sub-mainvisual .mainvisual-starland-bg__item03 img { width: 140px; }
  .sub-mainvisual .mainvisual-starland-bg__item05 { right: -50px; top: 0px; }
  .sub-mainvisual .mainvisual-starland-bg__item05 img { width: 140px; }
  .ailearning-part-area {padding: 0 30px;}

  .ailearning-part-area#starland-features,
  .ailearning-part-area#bookrclass-features{padding: 0 0px;}
  .ailearning-part-area#starland-features .cont-title,
  .ailearning-part-area#bookrclass-features .cont-title{padding: 0 30px;}

  .bookrclass-warp .feature-circle-cont-area{ background: url(../images/bookrclass_features_bg_point.png) no-repeat 50% 100%; background-size: 130%;}
  .bookrclass-features-bg-point{display: none;}
  .bookrclass-warp .feature-circle-cont-area { padding-bottom: 150px; }

  .feature-circle-cont-area {display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin: 0 auto;}

  .feature-circle-cont-area li:first-child, .feature-circle-cont-area li:last-child{margin-top: 0;}

  .starland-spot-title { font-size: 14px; padding: 5px 0px;width: 170px;   }
  .btn {padding: 8px 25px;}
  .img-cont-box { width: 170px;}
  .ailearning-part-layout img{width: 100%;}
  .ailearning-part-layout ul {gap: 10px; flex-direction: column;}

  .ailearning-part-area#starland-learning-connection .ailearning-part-layout ul{justify-content: space-between;}
  .ailearning-part-layout.starland-connection-box ul li .starland-spot-title{width: 100%;}
  .ailearning-part-layout.starland-connection-box ul li .img-cont-box{width: 100%;}
  .ailearning-part-layout.starland-connection-box ul li:nth-child(1){width: 24%;}
  .ailearning-part-layout.starland-connection-box ul li:nth-child(1) img { height: 330px;}
  .ailearning-part-layout.starland-connection-box ul li:nth-child(2){width: 38%;}
  .ailearning-part-layout.starland-connection-box ul li:nth-child(3){width: 38%;}

  .ai-learning-review-area .review-bubble { font-size: 14px; padding: 20px 20px 20px 20px;}

  .ai-learning-review-area .profile-thumb { display: flex; width: 90px; height: 90px;}

  .ai-learning-review-area .ai-learning-review-card {gap: 20px;}

  .sub-mainvisual .mainvisual-talktree-bg__item01 img { width: 100px; }
  .sub-mainvisual .mainvisual-talktree-bg__item01 { left: 70%;  bottom: 20px; }

  .mainvisual-cont .video-card { height: 160px;}
  .ai-learning-review-area .review-bubble { font-size: 14px; padding: 15px 20px 15px 20px; border-radius: 30px; }

  .ai-learning-review-area {gap: 10px 60px;}
  .feature-circle-cont-area .feature-circle-cont dt { font-size: 16px; }

  .whyuse-box { padding: 10px 30px; gap: 10px;}
  .bookrclass-level-point { position: absolute; top: -10px; left: 10%; width: 100px;}


.two-column-grid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 20px;
}

.whyuse-box dt {
  font-size: var(--font-size20);
  font-size: 16px;
}
.whyuse-box dd {font-size: 12px; line-height: 140%;}
.column-box-cont__images {
  width: 70%;
  max-width: 100px;
}
.bookrclass-point-video .video-card {
  width: 320px;
  height: 240px;
  border: 10px solid #fff;
}


.interactive-content-box {
  width: 100px;
  height: 80px;
  line-height: 120%;
  font-size: 12px;
  word-break: keep-all;
}

.ailearning-part-area#starland-learning-process .ailearning-part-layout ul li{    justify-content: center; gap: 10px; align-items: center;}
.ailearning-part-area#starland-learning-process .ailearning-part-layout ul{gap: 30px;}
.ailearning-part-area#starland-learning-process .ailearning-part-layout .img-cont-box{ width: 320px;}


.ailearning-part-area#starland-learning-connection .ailearning-part-layout ul{        flex-direction: row;}

.interactive-content-box.point01 { left: 10px; top: -40px;}
.interactive-content-box.point02 { right: 10px; top: -40px;}
.interactive-content-box.point03 { left: -10px; top: 78px;}
.interactive-content-box.point04 { right: -10px; top: 78px;}
.interactive-content-box.point05 { left: 10px; bottom: 20px;}
.interactive-content-box.point06 { right: 10px; bottom: 20px;}

.customize-learn-box dl { flex-direction: column;}
.customize-learn-box dl dt{padding: 10px 0 10px 0;}

.reading-activity-box .ra-section {gap: 20px; flex-direction: column;}
.reading-activity-box .ra-plus {padding-left: 0;}
.reading-activity-box .ra-title { width: 100%;}
.reading-activity-box .ra-items { display: grid; grid-template-columns: repeat(1, 1fr); gap: 20px;}
.three-column-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 20px; }

.grid-box { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); gap: 20px; }


.error-sitemap__list {gap: 20px; display: grid; grid-template-columns: repeat(3, 1fr); }
.error-sitemap__item{text-align: center;}

.event-card { flex-direction: column; gap: 20px; width: 100%; padding: 0 0 0 0;}
.event-card-area{position: relative; padding: 30px 0;}
.event-card-area .event-card-state{position: absolute; position: absolute; top: 40px; right: 10px; }
.event-card .event-cont { width: 100%; height: auto; padding: 0 15px;}
.event-card .event-thumb{width: 100%; height: auto;}

.board-list-top .board-srch-area .list-search-control .form-control {min-width: auto; width: 60px;}
.board-list-top .board-srch-area .list-search-control .form-control::placeholder{color: #fff;}
.board-list-top .board-srch-area .form-select{width: 120px; min-width: auto;}
.board-list-top .board-srch-area .btn { padding: 8px 5px; }

.ailearning-part-layout .m-5 .img-cont-box { width: 100%; }

.customize-learn-box dl dd img{height: auto;}



.learning-flow__label{width: 100%;}
.learning-flow__label span { width: 100%; height: auto; border-radius: 10px; padding: 5px 0 4px 0;}

.talktree-warp .talktree-features-area .feature-box { padding: 20px 20px; width: 100%; min-width: 0; display: flex; flex-direction: column;}
.talktree-warp .talktree-features-area .feature-box.fs-1,
.talktree-warp .talktree-features-area .feature-box.fs-2{padding-bottom: 50px;}
.talktree-warp .talktree-features-area .feature-box.fs-3,
.talktree-warp .talktree-features-area .feature-box.fs-4{padding-top: 100px; flex-direction: column-reverse;}

.talktree-warp .talktree-features-area .feature-box h3 { font-size: 14px; letter-spacing: -0.2px; font-weight: 700;}
.talktree-warp .talktree-features-area .feature-box p{word-break: keep-all;}
.talktree-warp .talktree-features-area .feature-box.fs-1 h3,
.talktree-warp .talktree-features-area .feature-box.fs-2 h3{min-height: auto;}
.talktree-warp .talktree-features-area .feature-box.fs-3 h3,
.talktree-warp .talktree-features-area .feature-box.fs-4 h3{ margin-top: 10px; margin-bottom: 0;}
.talktree-warp .talktree-features-area .center-face {margin: 10px auto 0; width: 75px; height: 35px;}
.talktree-warp .talktree-features-area .center-title span{font-size: 20px;}
.talktree-warp .talktree-features-area .feature-center{width: 260px; padding: 15px 0 15px 0; border: 10px solid #F5F7FE;}

.talktree-warp .ailearning-part-layout ul { gap: 30px;}
.talktree-warp .ailearning-part-layout .img-cont-box{width: 100%;}


.talktree-warp .learning-flow__section{flex-direction: column; width: 100%; gap: 30px; margin-bottom: 0;}
.talktree-warp .learning-flow__content{width: 100%; gap: 10px;}

.talktree-warp .learning-flow__num{display: block;}
.talktree-warp .learning-flow__row{flex-direction: column; align-items: flex-start; justify-content: left; gap: 20px;  background: url(../images/talktree_learning_process_arrow_mo.png) no-repeat 95% 0%; background-size: 20px;}
.talktree-warp .learning-flow__row.right{justify-content: flex-end; gap: 0px; background-position: 95% 175%;}
.talktree-warp .learning-flow__row.fluency-focus{flex-direction: column; justify-content: center; align-items: center;}
.talktree-warp .learning-flow__row .lf-step__card{max-width: 50px; min-width: 50px; margin-bottom: 0;}
.talktree-warp .learning-flow__row .lf-step {align-items: center; width: auto; flex-direction: row-reverse; gap: 20px;}
.talktree-warp .learning-flow__row .lf-step-set{ justify-content: center; width: 100%; gap: 5px; flex-direction: column; margin-top: 20px;}
.talktree-warp .learning-flow__row .lf-step-set:nth-child(2){justify-content: flex-end; margin-top: 20px;}
.talktree-warp .learning-flow__row .lf-step-set__20 .lf-step .lf-step__card{max-width: 80px; min-width: 80px;}

.talktree-warp .learning-flow__banner{margin: 20px 0 50px 0; color: var(--talktree-color); background: #E0E4EC; font-size: 16px; text-align: left; word-break: keep-all;}
.talktree-process-flow .lf-desc-block {text-align: center; font-size: 14px; word-break: keep-all;}
.talktree-process-flow .lf-desc-block br{display: none;}
.talktree-process-flow .lf-desc-block__highlight {font-size:16px; margin-top: 10px;}
.talktree-process-flow .lf-step__desc{text-align: left;}

.talktree-warp .learning-flow__row.fluency-focus{background: none;}

.learning-flow__desc { display: block;
  margin-top: 24px; 
}

.learning-flow__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 메인 단계 */
.learning-flow__num {
  position: relative;
  padding: 18px 0;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

/* 라인 */
.learning-flow__num::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 30px;
  bottom: 0;
  width: 2px;
  background: #E0E4EC;
  height: 130px;
}

/* 메인 단계 번호 */
.learning-flow__num span{
  position: relative;
  top: -7px;
  z-index: 2;
  min-width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--talktree-color);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 3px rgba(50,145,208,0.12);
}
.learning-flow__num.space span{box-shadow: none; background: none; font-size: 0;}

.learning-flow__text {
  font-size: 15px;
  line-height: 1.4;
  font-weight: 600;
  word-break: keep-all;
}

.learning-flow__item--sub-group{padding-left: 18px;}
.learning-flow__item--sub-group ul li{margin-top: 20px;font-size: 15px; font-weight: 400; list-style: circle;}
}