@charset "utf-8";

html {
	scroll-behavior: smooth;
}


#sub_img {
	width:100%;
	height:229px;
	background:url("../image/sub/sub_top.jpg") no-repeat top center;
}
.sub_you_bg {
	position:relative;
	width:100%;
	min-height:450px;
	left:0;
	top:0;
	overflow:hidden;
	background:#5e5a56;
	opacity:1;
}
.sub_you_bg::before {
	content:"";
	position:absolute;
	inset:0;
	background:url("../image/sub/top_01.jpg") no-repeat top center;
	background-size:cover;
	transform:scale(1.2);
	opacity:0;
	animation:subHeroFade 1.6s ease forwards, subHeroFloat 18s ease-in-out infinite 1.6s;
	will-change:transform, opacity;
}
.sub_you_bg > * {
	position:relative;
	z-index:1;
}
.sub_you_bg--about::before {
	background-image:url("../image/sub/top_01.jpg");
}
.sub_you_bg--teacher::before {
	background-image:url("../image/sub/top_02.jpg");
}
.sub_you_bg--class::before {
	background-image:url("../image/sub/top_03.jpg");
}
.sub_you_bg--column::before {
	background-image:url("../image/sub/top_04.jpg");
}
.sub_you_bg--customer::before {
	background-image:url("../image/sub/top_05.jpg");
}
.sub_you_bg--business::before {
	background-image:url("../image/sub/top_06.jpg");
}
.sub_menu {
	position:absolute;
	overflow:hidden;
	left:50%;
	transform:translateX(-50%);
	radius:14px;
	bottom:6%;
	margin-top:10px;
}
.sub_menu_b {bottom:4% !important;}
.sb_inner{
	border-radius:30px;
	background:rgba(255, 255, 255, 0.2);
}
.sub_menu ul {
	display:flex;  justify-content: center;
	flex: 0 0 auto;
	gap:15px 30px;
	font-weight:600;
	letter-spacing:0.01rem !important;
}
/* 기본: PC */
.pc_s { display:inline; }
.mo_s { display:none; }

/* 모바일 */
@media (max-width:768px){
    .pc_s { display:none; }
    .mo_s { display:inline; }
}
.sub_menu li {
	padding:18px 0 16px;
}
.sub_menu li:first-child {
	margin-left:35px;
}
.sub_menu li:last-child {
	margin-right:35px;
}
.sub_menu li a {
	color:#fff;
}
.sub_menu li a:hover {
	font-weight:bold;
}
.sub_inner {
	width:90%;
	position:relative;
	margin:70px auto 0px;
	line-height:1.7rem;
	word-break: keep-all;
}
.sub_title {
	font-size:4.5rem;
	position:absolute;
	transform:translateX(-50%);
	margin-top:155px;
	white-space: wrap;   
	z-index:100;
	font-weight:100;
	color:#fff;
	width:100%;
	text-align:center;
	font-family: 'Asta Sans', '맑은고딕','Malgun Gothic', sans-serif;
	line-height:4rem;
}
.sub_title a {
	color:#fff !important;
}
.point_tt {
	font-size:3.3rem;
	line-height:3.0rem;
	font-family: "Lexend",'Asta Sans', '맑은고딕','Malgun Gothic', sans-serif;
	font-weight:200;
	letter-spacing:0.01rem;
	margin-bottom:30px;
}
.point_t2 {
	font-size:3.0rem;
	line-height:3.2rem;
	font-family: "Lexend",'Asta Sans', '맑은고딕','Malgun Gothic', sans-serif;
	font-weight:200;
	letter-spacing:-0.02rem;
	margin-bottom:1.3rem;
}
.wd_in {
	max-width:790px;
	margin:0 auto;
	word-break: keep-all;
}
.about_txt {
	width:100%;
	min-height:240px;
	background:#f3ece2;
	margin-top:60px;

}
.about_txt .inner {
	display:flex;
	padding:80px 0;
}
.about_pros {
	width:60%;
	display:flex;
	flex-wrap: wrap;
	font-size:1.25rem;
	align-content: flex-start;
	gap:15px 0;
	word-break:keep-all;
	font-weight:500;
}
.about_pros p{
	flex: 1 1 100%;
	line-height:1.6rem;
	letter-spacing:-0.04rem;
}
.nomore {
	font-size:4.2rem; color:#fff;
	position:absolute;
	bottom:13%;
	left:0px;
	letter-spacing:-0.15rem !important;
	line-height:3.8rem !important;
	animation:none;
	text-shadow: 0px 0px 5px #d5cab9;
}

.about_vod{
	width:40%;
}
.about_vod p {
	
	}
.about_pros span {
	color:#900906;
}
.sub_menu li.s_on a {
	font-weight:700;
	color:#fff;
}
.sub_menu li.s_on {
	position:relative;
}

.sub_inner2 {
	width:100%;
	position:relative;
	margin:70px auto 0px;
	min-height:400px;
	display:flex; gap:0px 50px;
	align-items:flex-start;
	/*word-break: keep-all;*/

}
.tc_txt {
	width:340px;
	position:sticky;
	top:170px;
	
	animation-name: move, fadeIn, changeColor; 
	animation-duration: 1s; 
	animation-iteration-count: 1; 
	transition-timing-function: ease-in;
}

.tc_t1{
	font-size:3.3rem;
	line-height:3.0rem;
	font-weight:200;
}
.tc_t2{
	font-size:2.8rem;
	line-height:2.6rem;
	font-weight:200;
}
.column_intro {
	border-left:1px solid #ddd;
	padding-left:45px;
	flex:1 1 auto;
	letter-spacing:-0.02rem !important;
}
.teacher_intro {
	border-left:1px solid #ddd;
	padding-left:45px;
	flex:1 1 auto;
	letter-spacing:-0.02rem !important;
}
.teacher_intro dl {
	margin-bottom:3rem;
}
.teacher_intro dl:last-child {
	margin-bottom:4rem;
}
.teacher_intro dt{
	font-family: "Lexend", sans-serif;
	font-size:1.6rem;
	margin-bottom:1rem;
}
.teacher_intro dd {
	margin-bottom:1.2rem;
}
.teacher_intro dd p:first-child {
	color:var(--green);
	font-weight:600;
	font-size:1.2rem;
	margin-bottom:5px;
}
.teacher_intro dd img {
	object-fit: cover;
	width:100%; height:100%;
	max-width:650px;
}
.teacher_intro dd ul {
	padding-inline-start: 1.0rem;
	list-style-position: outside;
	list-style-type: disc;
}
.teacher_intro dd ul li {
	padding:0.23rem 0;
	line-height:1.3rem !important;
}
.teacher_intro span,
.class_txt span{
	display:block;
	width:36px;
	height:7px;
	border-radius: 50px;
	background:var(--green);
	margin-bottom:0.8rem;
}
small {
	font-size:0.9rem;
	color:#666
}
.add, .b_register, .b_close, .b_most, .b_new {
	font-size:0.7rem;
	color:#fff;
	font-weight:600;
	display:inline-block;
	padding:0px 5px;
	 border-radius:10px;
	 margin-right:7px;
	 line-height:1.1rem;
}
.sc_wrp {
	padding:10px; 
	box-sizing: border-box;
	border:1px solid #ddd;
	margin-bottom:2rem;
	border-radius:20px;
	display:flex; gap:10px 15px;
	justify-content: space-around;
	flex-wrap: wrap;
	font-size:0.9rem;
	box-sizing: border-box
}
.sc_wrp p {
}
.add {
	background:#555;
}
.b_register {
	background:var(--green);
}
.b_close {
	background:#999;
}
.b_most {
	background:var(--orange);
}
.b_new {
	background:#418def;
}
.sch_title {
    font-size:1.8rem;
    letter-spacing:-0.04rem;
    background: url('../image/sub/time.png') no-repeat left center;
    background-size: contain;
	text-indent:35px;
}
.teacher_intro ol {
	display:flex;
	flex-wrap: wrap;
	border-bottom:1px dotted #ccc
}
.teacher_intro ol:first-child {
	border-top:1px dotted #ccc
}
.teacher_intro ol li:first-child {
	min-width:170px;
	width:170px;
	text-align:left !important;	
}
.teacher_intro ol li {
	width:24.5%;
	min-width:100px;
	padding:7px 0;
	text-align:center;
}
.teacher_intro ol li:last-child {
	min-width:150px !important;
	font-size:0.9rem;
	flex-grow: 1;
}


.infor, .onsite, .notice {
margin:60px 0 100px;
}
.infor dl{
	display:flex;
	gap:10px;
	margin-top:20px;
	border-bottom:1px dotted #ccc;
	padding-bottom:20px;
}
.infor dt {
	min-width:150px;
	font-size:1.1rem;
	font-weight:600;
	color:var(--green);
}
.infor dd {
	flex-grow: 1;
}
.infor dt span {

}
.bd_line {
	padding-bottom:1.5rem;
	border-bottom:1px solid #ddd;
}
.infor dd ul {
	padding-inline-start: 1.0rem;
	list-style-position: outside;
	list-style-type: disc;
}
.orange dt {
	color:var(--orange);
}
.infor span {
	font-weight:600;
}


.sub_you_bg2 {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    margin: 0;
    overflow: hidden;
}

.sub_you_bg2::before {
    content: "";
    position: absolute;
    top: -5%;
    left: -5%;
    width: 110%;
    height: 110%;
    background: url("../image/sub/sub_bg2.jpg") center center / cover no-repeat;
    animation: bgMove 20s ease-in-out infinite alternate;
    will-change: transform;
    z-index: 0;
}

@keyframes bgMove {
    0% {
        transform: translate(0, 0) scale(1);
    }
    100% {
        transform: translate(-4%, -4%) scale(1.08);
    }
}

.over_inner {
	position:relative;
	width:100%;
	min-height:600px;
	margin:250px auto 70px;
	background-color:transparent;
	display:flex;
	flex-wrap: wrap;
	justify-content: center;
	gap:5px 10px;

}
.over_inner div img {
	object-fit: cover;
}
.over_title {
	font-size:6.5rem;	
	color:#fff;
	width:100%;
	text-align:center;
	font-family: 'Lexend','Asta Sans', '맑은고딕','Malgun Gothic', sans-serif;
	letter-spacing:-0.2rem;
	text-shadow:12px 3px 15px #473f37;
}
.over_title a {
	color:#fff !important;
}
.fade_title {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 1.3s ease, transform 1.3s ease;
	position:sticky;
	top:180px;
	white-space: wrap;   
	z-index:100;
	height:250px;
}

.fade_title.is-hidden {
    opacity: 0;
    transform: translateY(-60px);
}
/* 갤러리 기본 */
.gallery_item {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.6s ease;
    will-change: transform, opacity;
}

/* 등장 상태 */
.gallery_item.show {
    opacity: 1;
    transform: translateY(0);
}
.gallery_item img {
    transform: translateY(0);
    transition: transform 0.1s linear;
    will-change: transform;
	max-width:550px;
}



.side_btn {
	width:100%;
	background:#a3a3a3;
	color:#fff;
	padding:10px;
	text-indent:7px;
	box-sizing: border-box;
	font-weight:600;
}
.side_btn a {
	color:#fff;
	display:block;
	width:100%; height:100%;
}
/* hover 상태를 강제로 유지 */
.side_btn.active {
    background:
        var(--green);
}

.side_btn.active::before,
.side_btn.active::after {
    transform: translateX(100%);
}
/* hover 효과를 항상 유지 */
.side_btn.active.hvr-bounce-to-right:before {
    transform: scaleX(1);
}

/* 텍스트 색도 hover처럼 */
.side_btn.active {
    color: #fff;
}


.column_b1 {
	font-size:2.2rem;
	letter-spacing:-0.05rem !important;
	line-height:2.4rem;
	color:var(--green)
}
.about_hans {
	display:flex;
	gap:40px;
}
.about_hans_pht {
	width:35%;
	 flex-shrink: 0;
}
.about_hans_pht img {
	object-fit:contain;
	width:100%;
	max-width:400px;
}
.img100 img{
	object-fit:contain;
	max-width:560px;
}

.class_wrap {
	margin-top:0;
	display:flex;
	flex-direction:column;
	position:sticky;
	top:105px;
	background:#fff;
	padding-top:50px;
	z-index:20;
}
.class_btn_small {
	width:90%;
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:12px;
	margin:0 auto 25px;
}
.class_btn_small p {
	flex:1 1 0;
	margin:0;
	padding:12px 10px;
	border-radius:999px;
	text-align:center;
	font-size:1rem;
	line-height:1.2;
	font-weight:500;
	color:#666;
	background:#f4f4f4;
	cursor:pointer;
	transition:background-color .28s ease, color .28s ease, transform .28s ease, box-shadow .28s ease;
	user-select:none;
}
.class_btn_small p:hover,
.class_btn_small p:focus-visible {
	color:#111;
	transform:translateY(-1px);
}
.class_btn_small p.on {
	color:#fff;
	font-weight:700;
	box-shadow:0 5px 10px rgba(0, 0, 0, 0.2);
}
.class_bd {
	position:relative;
	width:100%;
	height:4px;
	background:#d2d2d2;
	border-radius:40px;
}
.class_bd p {
	position:absolute;
	top:-8px;
	left:0;
	transform:translateX(-50%);
	border-radius:100px;
	width:10px;
	height:10px;
	margin:0;
	border:5px solid #fff;
	background:#62caf3;
	transition:left .45s ease, background-color .35s ease;
	box-shadow:0 4px 14px rgba(0, 0, 0, 0.12);
}
.class_txt {
	margin:0 auto;
	width:98%;
	line-height:1.5rem;
}
.class_txt img {
	width:95%;
	margin:0 auto;
	padding:20px 0;
}
.class_txt div {
	padding-top:60px;
}
.goal {
	padding:5px 20px;
	color:#fff;
	background:var(--green);
	border-radius:20px;
	display:inline-block;
	text-align:center;
	font-size:1.1rem;
	margin-top:30px;
	margin-bottom:10px;
}
.class_txt_sm {
	font-size:0.92rem;
	color:#777;
	margin-top:10px;
}


.guide_wrp {
	display:flex;
	flex-wrap:wrap;
	gap:35px;
}
.guide_wrp div {
	padding:25px;
	position:relative;
	box-sizing: border-box;
	border:1px solid #ddd;
	width:31%;
	text-align:center;
	line-height:1.4rem;
	word-break: keep-all; 
	flex-shrink: 0;

}
.tri {
 width: 0px;
    height: 0px;
    border-top: 50px solid #333;
    border-left: 0px solid transparent;
    border-right: 50px solid transparent;  
	  position:absolute; top:0px; left:0px;
}
.num {
	 position:absolute; top:2px; left:10px;
	 color:#fff;
	 font-size:0.85rem;
	 z-index:3;
	 font-weight:600;
}
.guide_btn {
	border-radius:30px;
	background:var(--green);
	color:#fff;
	width:200px;
	padding:10px;
	margin:15px auto;
}
.guide_btn_or {
	background:var(--orange) !important;
}
.guide_btn a {
	color:#fff;
	display:inline-block;
}
.newpg {
	width:15px;
	height:15px;
	background: url("../image/sub/guide_pop.png") center center / cover no-repeat;
	display:inline-block;
	margin-left:3px;
}




/*//////////////////////////////////////*/
@keyframes subHeroFade {
	0% {
		opacity:0;
		transform:scale(1.12);
	}
	100% {
		opacity:1;
		transform:scale(1);
	}
}

@keyframes subHeroFloat {
	0% {
		transform:scale(1) translate3d(0, 0, 0);
	}
	50% {
		transform:scale(1.04) translate3d(0, -10px, 0);
	}
	100% {
		transform:scale(1) translate3d(0, 0, 0);
	}
}


@keyframes move { /* @keyframes 뒤에 애니메이션을 대표하는 임의의 이름 move를 부여 */
   from { /* 애니메이션 시작 시점 */
       left: -100px;
	   opacity: 0;
   }
   to { /* 애니메이션 종료 시점 */
       left: 0px;
	   opacity: 1;
   }
}


html {
	scroll-behavior:smooth;
}

@media (max-width: 1024px) {
	.class_wrap {
		top:70px;
		padding-top:30px;
	}
	.class_btn_small {
		display:flex;
		flex-wrap:wrap;
	}
	.class_txt div {
		scroll-margin-top:170px;
	}
}



/* Anchor public boards */
.guide-stage-intro > *,
.guide_wrp > div,
.anchor-board-stage {
  will-change: opacity, transform;
}

.anchor-board-wrap {
  margin-top: 26px;
}

.anchor-board-info {
  margin-bottom: 24px;
  padding: 22px 24px;
  border: 1px solid #e5e5e5;
  background: #fafafa;
  border-radius: 16px;
  box-sizing: border-box;
}

.anchor-board-info p {
  margin: 0;
  color: #555;
  line-height: 1.85;
}

.anchor-board-card {
  margin-top: 18px;
  padding: 35px;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  background: #fff;
  box-sizing: border-box;
}

.anchor-board-card2 {
  margin-top: 18px;
  background: #fff;
  box-sizing: border-box;
}

.anchor-board-card:first-child {
  margin-top: 0;
}

.anchor-board-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

.anchor-board-head h3 {
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.4;
  color: #222;
  font-weight:500;
}

.anchor-board-meta {
  margin-top: 3px;
  color: #999;
  line-height: 1.7;
}

.anchor-board-meta span {
  display: inline-block;
  margin-right: 14px;
  color:#222;
  font-weight:300 !important;
  font-size:0.9rem;
}

.anchor-board-lock {
  display: inline-block;
  margin-right: 8px;
  color: #2e7d32;
  font-weight: 700;
}

.anchor-board-btn,
.anchor-board-actions a,
.anchor-board-actions button {
  display: inline-block;
  min-width: 108px;
  padding: 8px 25px;
  border: 0;
  border-radius: 999px;
  background: var(--green);
  color: #fff;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  box-sizing: border-box;
  cursor: pointer;
  font-size:1.00rem;
}

.anchor-board-actions .line,
.anchor-board-btn.line {
  background: #fff;
  color: #333;
  border:1px solid #666
}
.anchor-board-btn2 {
	display: inline-block;
  padding: 4px 10px;
  border: 0;
  border-radius: 999px;
  background: var(--green);
  color: #fff;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  box-sizing: border-box;
  cursor: pointer;
  font-size:0.85rem;
  line-height:1rem !important;
}
a.anchor-board-btn2  {
	color:#fff;
}
.anchor-board-form-row {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.anchor-board-field {
  flex: 1 1 260px;
}

.anchor-board-field label {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
}

.anchor-board-field input,
.anchor-board-field textarea,
.anchor-board-secret-box input {
  width: 100%;
  padding: 12px;
  border: 1px solid #d7d7d7;
  border-radius: 12px;
  background: #fff;
  color: #222;
  box-sizing: border-box;
}

.anchor-board-field textarea {
  min-height: 200px;
  resize: vertical;
  line-height: 1.4;
}

.anchor-board-note,
.anchor-board-secret-help {
  margin-top: 8px;
  color: var(--orange);
  line-height: 1.6;
  font-size:0.92rem;
  font-weight:500;
}

.anchor-board-table-wrap {
  overflow-x: auto;
}

.anchor-board-table {
  width: 100%;
  border-top: 2px solid #222;
  border-collapse: collapse;
}

.anchor-board-table th,
.anchor-board-table td {
  padding: 14px;
  border-bottom: 1px solid #ececec;
  vertical-align: middle;
}

.anchor-board-table th {
  font-weight: 500;
}

.anchor-board-table td.subject a {
  color: #222;
  text-decoration: none;
  line-height:1.3rem;
}

.anchor-board-table td.subject a:hover {
  color: var(--green);
}

.anchor-board-empty {
  padding: 36px 0;
  text-align: center;
  color: #777;
}

/* =========================
   Anchor Board Content FIX
   ========================= */

.anchor-board-content {
  font-family:"Noto Sans KR", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size:1rem;
  color:#222;
  word-break:break-word;
  box-sizing:border-box;
  font-weight:400;
  line-height:1.6rem;
}

.anchor-board-content2 {
  font-family:"Noto Sans KR", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size:1rem;
  line-height:1.6rem;
  color:#222;
  word-break:break-word;
  padding:15px;
  background:#f6f6f6;
  box-sizing:border-box;
  font-weight:400;
}

.anchor-board-content *,
.anchor-board-content2 * {
  font-weight:inherit;
  line-height:inherit !important;
}

.anchor-board-content strong,
.anchor-board-content b,
.anchor-board-content2 strong,
.anchor-board-content2 b {
  font-weight:600 !important;
}

.anchor-board-content span[style*="color"],
.anchor-board-content2 span[style*="color"] {
  font-weight:400 !important;
}

.anchor-board-content span[style*="font-weight:bold"],
.anchor-board-content span[style*="font-weight: bold"],
.anchor-board-content span[style*="font-weight:600"],
.anchor-board-content span[style*="font-weight: 600"],
.anchor-board-content span[style*="font-weight:700"],
.anchor-board-content span[style*="font-weight: 700"],
.anchor-board-content2 span[style*="font-weight:bold"],
.anchor-board-content2 span[style*="font-weight: bold"],
.anchor-board-content2 span[style*="font-weight:600"],
.anchor-board-content2 span[style*="font-weight: 600"],
.anchor-board-content2 span[style*="font-weight:700"],
.anchor-board-content2 span[style*="font-weight: 700"] {
  font-weight:600 !important;
}

.anchor-board-content img,
.anchor-board-content2 img {
  max-width:100%;
  height:auto;
}

.anchor-board-content p:first-child,
.anchor-board-content2 p:first-child {
  margin-top:0;
}


.anchor-board-secret-box {
  max-width: 480px;
}

.anchor-board-comments {
  margin-top: 18px;
}

.anchor-board-comment-item {
  padding: 18px 0;
  border-top: 1px solid #ececec;
}

.anchor-board-comment-item:first-child {
  border-top: 0;
  padding-top: 0;
}

.anchor-board-comment-author {
  font-weight: 400 !important;
  color:var(--green);
}

.anchor-board-comment-date {
  margin-left: 10px;
  font-size: 0.8rem;
  color: #666 !important;
  font-weight:400 !important;
}

.anchor-board-comment-body {
  margin-top: 8px;
  line-height: 1.6;
  font-size:0.9rem;
}

.anchor-board-message {
  margin-bottom: 25px;
  padding: 12px;
  border-radius: 12px;
  line-height: 1.7;
}

.anchor-board-message.ok {
  background: #eef9f1;
  color: #196b2f;
  text-indent:10px;
	font-weight:500;
}

.anchor-board-message.error {
  background: #fff2f2;
  color: #b42318;
   text-indent:10px;
font-weight:600;
}

.anchor-board-pagination {
  margin-top: 24px;
  text-align: center;
}

.anchor-board-pagination a,
.anchor-board-pagination strong {
  display: inline-block;
  min-width: 40px;
  margin: 0 3px;
  padding: 8px 10px;
  border-radius: 999px;
  background: #f3f5f7;
  color: #333;
  font-size: 1.4rem;
  text-decoration: none;
  box-sizing: border-box;
}

.anchor-board-pagination strong {
  background: var(--green);
  color: #fff;
}

/* Anchor level test */
.leveltest-page .bd_line {
}

.leveltest-intro {
  color: #222;
  line-height: 1.6;
}

.leveltest-intro span {
  color: #ff5b4d;
  font-weight: 600;
}

.leveltest-message p {
  margin: 0 0 4px;
}

.leveltest-message p:last-child {
  margin-bottom: 0;
}

.leveltest-wrap {
  margin-top: 18px;
}

.leveltest-form {
  display: flex;
  flex-wrap: wrap;
  gap: 38px;
}

.leveltest-main {
  flex: 1 1 620px;
  min-width: 0;
}

.leveltest-side {
  width: 385px;
  max-width: 100%;
}

.leveltest-row {
  display: grid;
  grid-template-columns: 105px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  padding: 12px 0;
  border-top: 1px solid #e7e7e7;
}

.leveltest-row:first-child {
  border-top: 0;
}

.leveltest-label {
  padding-top: 13px;
  color: #111;
  font-weight: 600;
}

.leveltest-control input[type="text"],
.leveltest-control input[type="date"],
.leveltest-control select {
  width: 100%;
  height: 44px;
  padding: 0 14px;
  border: 1px solid #d3d3d3;
  background: #fff;
  color: #222;
  box-sizing: border-box;
  font-size: 0.98rem;
  border-radius:10px;
}

.leveltest-control input[type="date"] {
   height:44px;
    border:1px solid #ddd;
    border-radius:6px;
    padding:0 12px;
}

.leveltest-inline-note {
  margin: 10px 0 0;
  color: #ff7a00;
  font-weight: 500;
}

.leveltest-slot-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}

.leveltest-date-wrap {
  position: relative;
}

.leveltest-calendar-btn {
  position: absolute;
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  border: 1px solid #d0d0d0;
  background: #fff;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
}

.leveltest-guide {
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid #e7e7e7;
  font-size:18px;
}
.leveltest-guide ul {
	width:95%;
	margin:0 auto;
}
.leveltest-guide li {
	list-style-position: outside;
  list-style-type: disc;
}
.leveltest-guide p {
  line-height: 1.9;
  color: #333;
}

.leveltest-guide p:last-child {
  margin-bottom: 0;
}

.leveltest-terms-box {
  border: 1px solid #d7d7d7;
  background: #fff;
}

.leveltest-terms-scroll {
  height: 495px;
  padding: 28px 24px;
  overflow-y: auto;
  color: #222;
  line-height: 1.5;
  font-size:0.9rem;
}

.leveltest-terms-scroll h3,
.leveltest-terms-scroll h4 {
  margin: 0 0 14px;
  color: #111;
  font-weight:500;
}

.leveltest-terms-scroll p {
  margin: 0 0 18px;
}

.leveltest-agree {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 10px;
  font-weight: 700;
  font-size:0.95rem;
  color:var(--orange) !important;
}

.leveltest-agree input {
  width: 18px;
  height: 18px;
  margin: 0;
}

.leveltest-submit-wrap {
  width: 100%;
  padding-top: 25px;
  border-top: 1px solid #e7e7e7;
  text-align: center;
}

.leveltest-submit-btn {
  min-width: 270px;
  height: 54px;
  padding: 0 26px;
  border: 0;
  background: #3f9375;
  color: #fff;
  font-size: 1.15rem;
  font-weight: 700;
  cursor: pointer;
  border-radius: 20px;
}

.leveltest-submit-btn:hover {
  background: #32795f;
}

@media (max-width: 980px) {
  .leveltest-form {
    gap: 22px;
  }

  .leveltest-main,
  .leveltest-side {
    flex: 1 1 100%;
    width: 100%;
  }

  .leveltest-terms-scroll {
    height: 180px;
  }
}


@media (max-width: 768px) {
  .leveltest-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .leveltest-label {
    padding-top: 0;
  }

  .leveltest-slot-grid {
    grid-template-columns: 1fr;
  }

  .leveltest-submit-btn {
    width: 100%;
    min-width: 0;
  }
}


.bd_bt {
	border-bottom:1px solid #ddd;
	padding-bottom:1.5rem;
	width:100%;
}
.onsite_circle {
	width:140px;
	height:140px;
	border-radius:100px;
	text-align:center;
	line-height:137px;
	font-size:1.1rem;
	font-weight:600;
	color:#fff;
}
.one {	
	background:#2eb05f ;
	border:12px solid #c5e9cb;
}
.two {
	background:#3396bf ;
	border:12px solid #c2e4f2;
}
.three {
	background:#f28732 ;
	border:12px solid #fbdec6;
}
.four {
	background:#f7595a ;
	border:12px solid #fcd1d0;
}
.onsite_wrp dl {
	width:100%;
	display:flex;	
	align-items: center;   
	gap:30px;
	margin-top:1.5rem !important;
	padding-bottom:1.5rem !important;
	border-bottom:1px solid #ddd;
}
.onsite_wrp dt {
	width:155px;
	margin-right:20px;
}
.onsite_wrp dd {
	display: flex;
}
.on_point {
	color:var(--orange);
	font-weight:600;
	padding-right:5px;
}
.notice_btn {
	line-height:1.3rem !important; 
	display:inline-block;
	padding:1px 8px 1px 5px; 
	font-size:15px; color:#fff; 
	background:var(--orange);
	border-radius:10px; 
	margin-right:10px; 
	font-weight:500;
}
.anchor-reply-badge{
	display:inline-block;
	margin-left:8px;
	padding:2px 9px;
	border-radius:999px;
	background:fff;
	font-size:0.78rem;
	font-weight:500;
	line-height:1.4;
	vertical-align:middle;
	border:1px solid #999;
}
.review-section {
  padding: 30px;
  background: #f6f6f6;
}

.review-wrap {
  max-width: 900px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

/* 공통 말풍선 */
.bubble {
  position: relative;
  max-width: 75%;
  padding: 16px 18px;
  border-radius: 16px;
  font-size: 16px;
  line-height: 1.45;
  word-break: keep-all;
  font-family:"Gowun Dodum", sans-serif;
  font-weight:500;
  box-sizing: border-box; 
}

/* 왼쪽 말풍선 */
.bubble.left {
  background: #ef7272;
  align-self: flex-start;
  border: 0px solid #e5e7eb;
   color: #fff;
}

/* 오른쪽 말풍선 */
.bubble.right {
  background: #477bed;
  color: #fff;
  align-self: flex-end;
}

/* 꼬리 */
.bubble.left::after {
  content: "";
  position: absolute;
  left: -15px;
  top: 18px;
  border-width: 8px;
  border-style: solid;
  border-color: transparent #ef7272 transparent transparent;
}

.bubble.right::after {
  content: "";
  position: absolute;
  right: -15px;
  top: 18px;
  border-width: 8px;
  border-style: solid;
  border-color: transparent transparent transparent #477bed;
}

/* 출처 텍스트 */
.bubble span {
  display: block;
  margin-top: 6px;
  font-size: 14px;
  opacity: 0.9;
}

/* 모바일 대응 */
@media (max-width: 768px) {
  .bubble {
    max-width: 90%;
    font-size: 15px;
  }
}