@charset "utf-8";

/* 
 * content CSS Document
 *
 */

/* layout */
#content{padding:var(--page-top) 0 calc(var(--page-top) + 60rem);}

/* sub common */
[data-subarea]{padding: 0rem 0;}		   
[data-subarea] .title{display:flex; flex-direction:column; gap:20rem;}
[data-subarea] .title em{font-family:var(--font-eng); font-size:var(--font20); font-weight:700; color:var(--color-point); text-transform:uppercase;}
[data-subarea] .title h3{font-size:var(--font40); font-weight:700; letter-spacing:-1rem;}
[data-subarea] .title h3 span{color:var(--color-point);}
[data-subarea] .title-mid{font-size:var(--font35); font-weight:700; letter-spacing:-1rem;}
[data-subarea] .title-mid strong{color:var(--color-point);}
[data-subarea] .title-desc{margin-top:45rem; font-size:var(--font22); font-weight:300; line-height:1.5; letter-spacing:-1rem; text-align:center;}
[data-subarea] .title-check{position:relative; margin-top:60rem; padding-left:25rem; padding-bottom:15rem; background:url(../images/content/tab_bg.gif) repeat-x 0 100%; font-size:var(--font25); font-weight:700; letter-spacing:-0.5rem;}
[data-subarea] .title-check i{display:inline-block; position:absolute; left:0; top:4rem; font-size:var(--font22); font-weight:normal;}
.ko_board_noData{color:rgba(0,0,0,0.6);}
	/* margin padding */
.mt0{margin-top:0 !important;}
@media (max-width:768px){
	[data-subarea] .title-check i{top:2rem;}
}
@media (max-width:480px){
	#content{padding: 40rem 0; padding-bottom: 80rem;}	
}


/* 온라인교육 - 목록 */					 
.eud-list{display:grid; grid-template-columns:repeat(3, 1fr); gap:30rem 25rem;}
.eud-list li{overflow:hidden; position:relative; border-radius:15rem; background-color:#f7f7f7;}
.eud-list li a{display:block;}
.eud-list [data-board="img"]{overflow:hidden; display:block; aspect-ratio:3/2;}
.eud-list [data-board="img"] img{display:block; object-fit:cover; width:100%; height:100%; transition:transform 0.7s ease;}
.eud-list [data-board="division"]{display:flex; justify-content:center; align-items:center; position:absolute; left:10rem; top:15rem; z-index:5; width:80rem; height:32rem; padding:0 10rem; background-color:#222; border-radius:50em; font-size:var(--font15); color:#fff;}
.eud-list [data-board="tit"],
.eud-list [data-board="con"]{display:-webkit-box; overflow:hidden; -webkit-line-clamp:1; -webkit-box-orient:vertical; text-overflow:ellipsis; letter-spacing:-0.5rem;}
.eud-list [data-board="tit"]{font-size:var(--font20); font-weight:700;}
.eud-list [data-board="con"]{margin-top:10rem; font-size:var(--font17); color:#777;}
.eud-list [data-board="price"]{margin-top:40rem; font-size:var(--font20); font-family:var(--font-combine); font-weight:600; letter-spacing:-0.5rem;}
.eud-list [data-board="price"].free{color:var(--color-point);}
.eud-list [data-board="btn"]{display:flex; justify-content:center; align-items:center; position:absolute; bottom:20rem; right:30rem; z-index:10; width:118rem; height:45rem; background-color:#fff; border:2rem solid #e7e7e7; border-radius:50em; font-weight:600; color:var(--color-point); text-align:center; font-size:16rem; transition:0.3s ease;}
.eud-list-box{padding:30rem;}
.eud-list-box > *{display:block;}
@media (hover:hover){
	.eud-list [data-board="btn"]:hover{background-color:var(--color-point); border-color:var(--color-point); color:#fff;}
	.eud-list li > a:hover [data-board="img"] img{transform:scale(1.07);}
}
@media (max-width:768px){
	.eud-list{grid-template-columns:repeat(2, 1fr); gap:30rem 20rem;}
}
@media (max-width:480px){
	.eud-list{grid-template-columns:1fr;}
	.eud-list li{border-radius:10rem;}
	.eud-list [data-board="btn"]{right:20rem;}
	.eud-list-box{padding:25rem 20rem;}
}

/* 온라인 교육 - 상세 */
[data-subarea="edu"]{padding-top:0 !important;}
[data-subarea="edu"] .ko_board_noData{border-radius:5rem; color:#999; font-size:var(--font16);}
.edu-view-top{--sizeHig:200rem; overflow:hidden; position:relative; height:var(--sizeHig); border-radius:10rem; border:4rem solid var(--color-point);}
.edu-view-top [data-board="img"]{display:block; position:absolute; top:0; width:100%; height:100%;}
.edu-view-top [data-board="img"] img{object-fit:cover; width:100%; height:100%;}
/* .eud-top-box{display:flex; flex-direction:column; justify-content:center; gap:25rem; width:50%; height:100%; position:relative; z-index:10; padding:20rem 80rem; background-image:linear-gradient(90deg, rgba(34,34,34,1), rgba(34,34,34,0.7) 40%, rgba(34,34,34,0));  color:#fff; word-break:keep-all;} */
.eud-top-box{display:flex; flex-direction:column; justify-content:center; align-items:center; gap:25rem; height:100%; position:relative; z-index:10; padding:40rem 0; background-color:#fff; word-break:keep-all; text-align:center;}
.eud-top-box [data-board="tit"]{font-size:var(--font40); font-weight:700;}
.eud-top-box [data-board="con"]{font-size:var(--font20); font-weight:300; line-height:1.5;}
.edu-view-box{display:flex; align-items:flex-start; gap:60rem; margin-top:20rem;}
.edu-view-total{order:2; flex:0 0 350rem;}
.edu-view-info{order:1; flex:auto;}
[data-subarea="edu"] .btn_area.line{margin-top:0; padding-top:60rem; background:url(../images/content/tab_bg.gif) repeat-x 0 0;}
	/* 온라인 교육 - 상세 탭  */
.edu-tab{--sizeHig:55rem; position:sticky; top:0; z-index:10; background:#fff url(../images/content/tab_bg.gif) repeat-x 0 100%;}
.edu-tab ul{display:flex; align-items:stretch; height:var(--sizeHig);}
.edu-tab ul > li > a{display:flex; justify-content:center; align-items:center; gap:3rem; padding:0 25rem; height:100%; text-align:center; font-size:var(--font20); font-weight:700; color:#999;}
.edu-tab ul > li > a:before{content:'\e92c'; opacity:0; display:block; font-family:var(--font-xi); font-size:var(--font20); font-weight:normal; transition:opacity 0.3s ease;}
.edu-tab ul > li > a i{display:flex; justify-content:center; align-items:center; min-width:34rem; height:20rem; padding:0 4rem; background-color:var(--color-point); border-radius:50em; font-size:12rem; color:#fff; font-weight:900;}
.edu-tab ul > li > a.active{color:var(--color-point);}
.edu-tab ul > li > a.active:before{opacity:1;}
.edu-tab-box{min-height:41vh; padding:35rem 30rem;}
.edu-tab-box .bbsContent{padding:0; margin-bottom:20rem; border-top-width:0 !important;}
	/* 온라인 교육 - 상세 - 커리큘럼 */
.edu-course-list{counter-reset:title; display:flex; flex-direction:column; gap:5rem;}
.edu-course-list > li{display:flex; flex-direction:column;}
.edu-course-list > li > *{display:flex; justify-content:flex-start; align-items:center; gap:5rem; min-height:60rem; padding:10rem 30rem; border-radius:5rem; background-color:#f4f7f5; border:1rem solid #d8e2dc; font-size:var(--font18); text-align:left;}
.edu-course-list > li > *:before{flex:none; counter-increment:title; content:counters(title, ".")"강"; min-width:50rem; font-weight:700;}
.edu-course-list > li span{opacity:0.4; flex:none; margin-left:auto; font-weight:800;}
.edu-course-list > li em{padding-right:20rem;}
@media (hover:hover){
	.edu-course-list > li{transition:0.3s ease;}
	.edu-course-list > li:hover{z-index:5; border-color:var(--color-point); box-shadow:0 20rem 20rem rgba(0,0,0,0.1);}	
}
.edu-detail__box{
	&{padding:30rem; background-color:#f7f7f7; border-radius:5rem;}
	h3{margin-bottom:20rem; font-size:var(--font20);}
	@media (max-width:480px){
		&{padding:30rem 15rem;}
	}
}		 
.edu-dot-list{
	&{display:flex; flex-direction:column; gap:7rem;}
	> li{position:relative; padding-left:13rem; font-size:var(--font17); word-break:keep-all; line-height:1.4;}
	> li:before{content:''; display:block; position:absolute; left:0; top:8rem; width:3rem; height:3rem; background-color:#a9a9a9;}
	> li ul{display:flex; flex-direction:column; gap:5rem; margin:10rem 0; padding:20rem; background-color:#fff; border:2rem solid #eaeaea; border-radius:5rem;}
	> li ul li{position:relative; padding-left:12rem; font-size:var(--font16);}
	> li ul li:before{content:''; display:block; position:absolute; left:0; top:9rem; width:4rem; height:2rem; background-color:#a9a9a9;}

	@media (max-width:480px){		
		> li ul{padding:20rem 15rem;}
	}
}
	/* 온라인 교육 - 상세 - 후기 */
.edu-review-list{display:flex; flex-direction:column; gap:6rem;}
.edu-review-list > li{display:flex; flex-wrap:wrap; align-items:center; align-content:flex-start; gap:13rem 20rem; min-height:130rem; padding:20rem 30rem; border:1rem solid #d8e2dc; border-radius:5rem;}
.edu-review-list p{flex:0 1 100%;}
[data-review]{display:flex; align-items:center;} 
[data-review="name"]{order:1; gap:10rem; font-size:var(--font18); font-weight:600;}
[data-review="name"]:before{content:''; display:block; width:34rem; height:34rem; background:#e6f0e9 url(../images/content/review_icon.svg) no-repeat 50% 50%; background-size:18rem; border-radius:100%;}
[data-review="btn"]{order:2; gap:0;}
[data-review="star"]{order:3; margin-left:auto; margin-right:30rem;}
[data-review="star"] i{font-size:var(--font20); color:#eee;}
[data-review="star"]:after{content:attr(data-reviewTotal); margin-left:7rem; font-size:var(--color-base); font-weight:600;}
[data-review="star"]:is([data-reviewTotal="1"], [data-reviewTotal="2"], [data-reviewTotal="3"], [data-reviewTotal="4"]) i:nth-of-type(1){color:#fab005;}
[data-review="star"]:is([data-reviewTotal="2"], [data-reviewTotal="3"], [data-reviewTotal="4"]) i:nth-of-type(2){color:#fab005;}
[data-review="star"]:is([data-reviewTotal="3"], [data-reviewTotal="4"]) i:nth-of-type(3){color:#fab005;}
[data-review="star"]:is([data-reviewTotal="4"]) i:nth-of-type(4){color:#fab005;}
[data-review="star"][data-reviewTotal="5"] i{color:#fab005;}
[data-review="date"]{order:4; opacity:0.7;}
[data-review="con"]{order:5; color:#666; line-height:1.4; word-break:keep-all;}
@media (hover:hover){
	.edu-review-list > li{transition:0.3s ease;}
	.edu-review-list > li:hover{z-index:5; border-color:var(--color-point); box-shadow:0 20rem 20rem rgba(0,0,0,0.1);}	
}
	/* 온라인 교육 - 가격 및 신청 */
.edu-view-total{--sizePad:30rem; position:sticky; top:10rem; z-index:11;}
.edu-view-total .box{overflow:hidden; border:1rem solid #ddd; border-radius:0 10rem 10rem 0;}
.edu-view-total h4{font-weight:800;}
.edu-view-title{display:flex; flex-direction:column; gap:10rem; padding:var(--sizePad);}
.edu-view-title [data-board="division"]{font-weight:800; color:#e67f3b;}
.edu-view-title [data-board="tit"]{font-size:var(--font20); font-weight:800; word-break:keep-all;}
.edu-view-title .list{display:flex; flex-direction:column; gap:3rem;}
.edu-view-title .list > li{display:flex; align-items:center; gap:20rem; font-size:var(--font15); font-weight:500;}
.edu-view-title .list > li > em{opacity:0.6; flex:none; width:60rem;}
.edu-view-title .list > li > span{font-weight:500;} 
.edu-view-price{display:flex; flex-direction:column; gap:5rem; padding:var(--sizePad); text-align:right;}
.edu-view-price em{opacity:0.6; font-size:var(--font14); font-weight:500;}
.edu-view-price [data-board="price"]{font-size:var(--font25); font-weight:900;}
.edu-view-price [data-board="price"] small{margin-left:3rem; font-weight:700;}
.edu-view-price [data-board="price"].free{font-size:var(--font25);}
.edu-view-price.total{display:flex; flex-flow:row nowrap; justify-content:space-between; align-items:center; background-color:#f4f7f5;}
.edu-view-price.total em{opacity:1; font-size:var(--font-base); font-weight:800;}
.edu-view-price.total [data-board="price"]{font-size:var(--font22); color:var(--color-point);}
.edu-view-price .price-list{display:flex; flex-direction:column; align-items:stretch; gap:3rem; width:100%; padding-top:15rem;}
.edu-view-price .price-list > li{display:flex; justify-content:space-between; align-items:center; gap:5rem; font-size:var(--font15); font-weight:500;}
.edu-view-price .price-list > li em{opacity:0.6;}
.edu-view-price .price-list > li.total{margin-top:10rem;}
.edu-view-price .price-list > li.total em{opacity:1; font-size:var(--font16); font-weight:700;}
.edu-view-price .price-list > li.total span{font-size:var(--font18); font-weight:900;}
.edu-view-btn{display:flex; flex-direction:column; padding:0 var(--sizePad) 25rem;}
.edu-view-btn .info-box{flex:0 1 100%; display:flex; justify-content:center; align-items:center; padding:10px 5px; background-color:#f5f5f5; border-radius:5rem; text-align:center; color:#999; font-size:var(--font15);}
.edu-view-btn.mob{display:none;}
.edu-teacher{margin-top:5rem; padding:var(--sizePad); background-color:#f4f7f5; border:1rem solid #ddd; border-radius:0 10rem 10rem 0;}
.edu-teacher .list{display:flex; flex-direction:column; gap:5rem;}
.edu-teacher .list > li{display:flex; align-items:center; gap:10rem; font-size:var(--font18); font-weight:500;}
.edu-teacher .list > li > em{opacity:0.6; flex:none; width:80rem;}
.edu-teacher .list > li > span{font-weight:500;}
.edu-teacher .list > li.edu-people > span{color:#1c5ed8; font-weight:700;}		
	/* 온라인 교육 상세 - 반응형 */
@media (max-width:1024px){
	.edu-view-box{gap:30rem;}
	.edu-view-top{--sizeHig:auto;}
	.edu-view-total{--sizePad:20rem; flex:0 0 300rem;}
	.edu-view-title [data-board="division"]{font-size:var(--font15);}
	.edu-view-btn .button.lg{min-width:inherit; width:100%;}
}
@media (max-width:768px){
	.edu-view-box{order:1; flex-direction:column;}
	.edu-view-info{order:2; width:100%;}
	.edu-view-title{gap:5rem;}
	.edu-view-total{flex:auto; position:static; width:100%; background-color:#fff;}
	.edu-view-box .edu-view-total .box{border-width:0;}
	.edu-teacher{border-radius:5rem;}
	.edu-view-box .edu-view-btn{display:none; flex-direction:row; gap:10rem; padding:0 0 25rem;}
	.edu-view-box .edu-view-btn .button{margin:0;}
	.edu-view-box .edu-view-btn.mob{order:3; display:flex; position:sticky; bottom:0; z-index:12; width:100%; padding:15rem 0 10rem; background:#fff url(../images/content/tab_bg.gif) repeat-x 0 0;}
	.edu-tab-box{padding:35rem 0;}
	.edu-view-top{border-radius:5rem;}
	[data-review="star"]{margin-right:10rem;}
	.edu-view-box .btn_area.line{display:none;}
}
@media (max-width:480px){
	.edu-view-top{border-width:0; border-bottom-width:3rem; border-radius:0;}
	.eud-top-box{align-items:flex-start; gap:15rem; padding:0 0 30rem; text-align:left;}
	.edu-view-box .edu-view-title{padding-top:0;}
	.edu-tab ul > li > a{padding:0 7rem; font-size:var(--font18);}
	.edu-course-list > li{font-size:var(--font15);}
	.edu-course-list > li > *{flex-wrap:wrap; padding:10rem 15rem;}
	.edu-course-list > li > *:before{min-width:40rem;}
	.edu-course-list > li span{flex:0 1 100%; margin-left:45rem;}
	.edu-course-list > li em{width:calc(100% - 45rem); padding-right:0;}
	.edu-review-list > li{padding:20rem 15rem;}
	[data-review="date"]{order:6;}
	[data-review="btn"]{order:10; margin-left:auto;}
	.edu-tab-box{min-height:20vh;}
	.edu-view-box .btn_area.line{display:flex; padding-top:30rem; padding-bottom:0;}
	.edu-view-btn.mob [data-eduBtn="list"]{display:none;}
	#anchor-review .btn_area{padding-bottom:0;}
}

/* 수강 신청 */
.edu-apply-box{display:flex; align-items:flex-start; gap:60rem;}
.edu-apply-info{flex:auto;}
.eud-view-coupon{padding:var(--sizePad); border-top:1rem solid #eee;}
.eud-view-coupon .coupon-num{font-size:var(--font14); color:#9a9a9a; font-weight:500;}
.eud-view-coupon .coupon-num i{color:var(--color-point); font-weight:700;}
.eud-view-coupon .coupon-price{--sizeHig:45rem; display:flex; align-items:center; gap:10rem; margin-top:15rem;}
.eud-view-coupon .coupon-price > span{display:block; position:relative; height:var(--sizeHig);}
.eud-view-coupon .coupon-price > span i{position:absolute; left:15rem; top:50%; font-weight:700; transform:translateY(-50%);}
.eud-view-coupon .coupon-price input[type="text"]{width:100%; height:100%; margin:0; padding-left:40rem; border-radius:5rem; border:1rem solid #dcdcdc;}
.eud-view-coupon .coupon-price input[type="text"]:readonly{background-color:#f5f5f5;}
.eud-view-coupon .coupon-price .button{min-width:85rem; height:var(--sizeHig); margin:0; padding:0 10rem; border-radius:5rem; font-size:var(--font15);}
.eud-view-coupon .coupon-price .button span{font-weight:700;}
.edu-view-agree{padding:20rem 0 0;}
.edu-view-agree .edu-view-btn{padding:0; margin-top:20rem;}
.edu-view-agree p{font-size:var(--font14); color:#9a9a9a; font-weight:500;}
.edu-view-agree p a{color:#222; text-decoration:underline;}
.edu-apply-list .list{margin-top:10rem;}
.edu-apply-list .list > li{display:flex; gap:20rem; padding:20rem 0 20rem 20rem; border-bottom:1rem solid #e6f0e9;}
.edu-apply-list .list > li > a,
.edu-apply-list .list > li > .box{flex:auto; display:flex; gap:20rem;}
.edu-apply-list .list > li > .box{position:relative;}
.edu-apply-list [data-board="img"]{overflow:hidden; flex:none; width:180rem; border-radius:5rem;}
.edu-apply-list [data-board="img"] img{object-fit:cover; width:100%; height:100%;}
.edu-apply-list .con{flex:auto; display:flex; flex-direction:column; justify-content:center; gap:15rem;}
.edu-apply-list .edu-view-price{flex:0 0 200rem; display:flex; justify-content:center; align-items:flex-end; position:relative; border-top-width:0; text-align:right;}
.edu-apply-list .edu-view-price:before{content:''; display:block; position:absolute; bottom:-20rem; left:0; width:1rem; height:calc(100% + 20rem); background-color:#e6f0e9;}
.edu-apply-list [data-board="tit"]{display:flex; gap:10rem; font-size:var(--font25); font-weight:700;}
.edu-apply-list [data-board="tit"] [data-board="status"]{display:inline-flex; justify-content:center; align-items:center; min-width:70rem; height:25rem; border-radius:3rem; font-size:13rem; color:#fff; font-weight:normal;}
.edu-apply-list [data-board="tit"] [data-board="status"].type01{background-color:#1ea7ac;}
.edu-apply-list [data-board="tit"] [data-board="status"].type02{background-color:#129544;}
.edu-apply-list [data-board="tit"] [data-board="status"].type03{background-color:#b2b2b2;}
.edu-apply-list .con-list{display:flex; flex-wrap:wrap; gap:60rem;}
.edu-apply-list .con-list > li{display:flex; align-items:center; gap:20rem; font-size:var(--font16); font-weight:500;}
.edu-apply-list .con-list > li > em{opacity:0.6; flex:none; min-width:60rem;}
.edu-apply-list .list .btn-del{display:block; width:35rem; height:35rem; background-color:transparent; font-size:var(--font16);}
.edu-apply-list .list .btn-del span{font-size:0;}
.edu-apply-list .ko_board_noData{margin-top:10rem;}
.edu-apply-payment{margin-top:30rem;}
.payment-info{margin-top:20rem; padding:30rem; background:#f4f7f5; border-radius:5rem;}
.payment-info p{font-size:var(--font18); line-height:1.5;}
.payment-info p strong{font-weight:800;}
.payment-info i[class*="xi-"]{font-size:var(--font25);}
.payment-info i.xi-message-o{margin-right:5rem; font-size:var(--font20); transform:scaleX(-1);}
.payment-info.ico p{display:flex; flex-wrap:wrap; align-items:center; gap:3rem; position:relative; padding-left:30rem; word-break:keep-all; line-height:1.2;}
.payment-info.ico p i{position:absolute; left:0; top:-1rem;}
.payment-info.ico p strong{color:var(--color-point);}
	/* 결제방법 선택 radio */
.radio-group{display:flex; flex-wrap:wrap; align-items:center; gap:5rem;}
.radio-group label{position:relative; min-width:130rem; height:40rem; cursor:pointer;}
.radio-group label input{position:absolute; opacity:0;}
.radio-group label span{display:flex; justify-content:center; align-items:center; gap:5rem; width:100%; height:100%; border:2rem solid #d2d9d4; border-radius:50em; color:#999; font-size:var(--font15); font-weight:500; transition:0.3s ease;}
.radio-group label i{font-size:var(--font20); font-weight:normal;}
.radio-group label input:checked ~ span{border-color:var(--color-point); color:var(--color-point);}
@media (max-width:1400px){
	[data-subarea="edu"] .edu-apply-list .list > li{flex-wrap:wrap; gap:5rem; padding-bottom:10rem;}
	[data-subarea="edu"] .edu-apply-list .edu-view-price{flex:0 1 100%;}
	[data-subarea="edu"] .edu-apply-list .edu-view-price:before{display:none;}
}
@media (max-width:1024px){
	.edu-apply-box{gap:30rem;}
	.eud-view-coupon .coupon-price{gap:5rem;}
	.eud-view-coupon .coupon-price .button{min-width:75rem; font-size:var(--font14);}
	.edu-view-price.total{flex-wrap:wrap;}
	.edu-view-price.total [data-board="price"]{flex:0 1 100%;}
}
@media (max-width:768px){
	.edu-apply-box{order:1; flex-direction:column; align-items:stretch;}
	.edu-apply-list .con-list{gap:40rem;}
	.edu-apply-list .con-list > li{gap:10rem;}
	.edu-apply-box .edu-view-total .box{border-radius:10rem;}
	.eud-view-coupon .coupon-price > span{flex:auto;}
	.edu-view-agree p{word-break:keep-all;}
	.edu-view-agree p br{display:none;}
}
@media (max-width:480px){
	.edu-apply-list [data-board="img"]{display:none; width:100rem; aspect-ratio:3/2;}
	.edu-apply-list .list > li{padding:15rem 0;}
	.edu-apply-list .list > li > a{align-items:flex-start;}
	.edu-apply-list .con-list{flex-direction:column; gap:5rem; margin-top:5rem;}
	.payment-info{padding:20rem;}
	.edu-apply-box .edu-view-price.total [data-board="price"]{font-size:var(--font25);}
	
	.edu-apply-list [data-board="tit"]{flex-direction:column; align-items:flex-start; gap:5rem;}
	.edu-apply-list .con{gap:10rem;}
	
	.edu-apply-list .list > li{flex-wrap:wrap; gap:5rem;}
	.edu-apply-list .edu-view-price{flex:0 1 100%;}
	.edu-apply-list .edu-view-price:before{display:none;}
}

/* 쿠폰선택 */
.coupon-box{padding-bottom:60rem;}
.coupon-box ul{display:flex; flex-direction:column; gap:5rem;}
.coupon-box ul li{font-size:var(--font15);}
.coupon-box .btn_area{position:fixed; bottom:0; left:0; z-index:5; width:100%; margin-top:0; padding:10rem 20rem; background-color:#fff;}
.coupon-box .btn_area .button{width:100%;}

/* 내강의실 */
[data-subarea="lecture"]{overflow:hidden; padding-top:0 !important;}
.progress-bar{overflow:hidden; display:inline-block; position:relative; width:150rem; height:10rem; margin-right:5rem; background-color:#e8e8e8; border-radius:50em;}
.progress-bar i{display:inline-block; position:absolute; top:0; left:0; height:100%; background-color:var(--color-point); border-radius:50em;}
[class*="lecture-list"] .edu-view-price .button{min-width:170rem; min-height:55rem;}
.lecture-list__ing .edu-view-price .button{border-color:var(--color-point);}
.lecture-list__ing .edu-view-price .button span{color:var(--color-point);}
.lecture-list__end .progress-bar i{background-color:#4c9fe5;}
	/* 내강의실 - 상세 */
.lecture-view{display:flex; align-items:stretch;}
.lecture-video{flex:auto; background-color:#232323;}
.lecture-video-bottom{aspect-ratio:16/9;}
.lecture-video-bottom iframe{width:100%; height:100%;}
.lecture-video-top{display:flex; align-items:center; gap:20rem; height:70rem; padding:10rem 0 10rem 20rem; background-color:#222; box-shadow:0 20rem 20rem rgba(0,0,0,0.2); color:#fff;}
.lecture-video-top .button{flex:none; min-width:90rem; min-height:35rem; margin:0; background-color:rgba(255,255,255,0.07); font-size:var(--font15);}
.lecture-video-top .button span{color:rgba(255,255,255,0.6); transition:color 0.3s ease;}
.lecture-video-top .button:hover span{color:rgba(255,255,255,0.9);}
.lecture-video-top h3{font-size:var(--font20); font-weight:700;}
.lecture-video-top .btn{flex:none; display:flex; align-items:stretch; height:calc(100% + 20rem); margin-left:auto;}
.lecture-video-top .btn a{display:inline-flex; justify-content:center; align-items:center; padding:0 25rem; border-left:1rem solid #000; text-align:center; font-size:var(--font15);}
.lecture-video-top .btn a i{margin-right:3rem; color:#fab005;}
.lecture-course{flex:0 0 380rem; background-color:#fff; border:1rem solid #ddd; border-left-width:0;}
.lecture-course-top{padding:20rem; background:url(../images/content/tab_bg.gif) repeat-x 0 100%;}
.lecture-course-top h4{font-size:var(--font20); font-weight:700;}
.lecture-course-top .box{display:flex; justify-content:space-between; align-items:center; margin-bottom:5rem;}
.lecture-course-top .course-total{display:flex; align-items:center; gap:20rem; color:#9a9a9a; font-size:var(--font15); font-weight:500;}
.lecture-course-top .course-total strong{margin-right:3rem; color:var(--color-point);}
.lecture-course-top .con-list > li{display:flex; align-items:center; gap:20rem; font-size:var(--font15);}
.lecture-course-top .con-list > li em{opacity:0.6;}
.lecture-course-top .con-list span{flex:auto; display:flex; align-items:center; gap:15rem; font-weight:700;}
.lecture-course-list{overflow-y:auto; max-height:38.802vw/* 745rem */; padding:20rem;}
.lecture-course-list .edu-course-list > li > *{flex-wrap:wrap; gap:2rem; position:relative; padding:15rem 50rem 15rem 20rem; font-size:var(--font16); transition:0.3s ease;}
.lecture-course-list .edu-course-list > li > *:before{min-width:35rem;}
.lecture-course-list .edu-course-list > li span{flex:0 1 100%; display:flex; align-items:center; gap:3rem;}
.lecture-course-list .edu-course-list > li span:before{content:'\eb1a'; display:block; font-family:var(--font-xi); font-size:var(--font20); font-weight:normal;}
.lecture-course-list .edu-course-list > li i{position:absolute; right:20rem; top:50%; font-size:var(--font20); color:#999; transform:translateY(-50%); transition:color 0.3s ease;}
.lecture-course-list .edu-course-list > li .on{border-width:2rem; border-color:var(--color-point);}
.lecture-course-list .edu-course-list > li .finish i{color:var(--color-point);}
.lecture-review{mask:linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 85%, rgba(0,0,0,0) 95%);}
.lecture-review .inr-1400{position:relative;}
.lecture-review .title-check{margin-bottom:30rem; padding-top:10rem;}
.lecture-review .title-check i{top:14rem;}
.lecture-review .swiper_bottom{--sizeBtn:35rem; display:flex; align-items:center; gap:20rem; position:absolute; right:var(--page-pad); top:0;}
.lecture-review .swiper_bottom .button,
.lecture-review .swiper_bottom button{min-height:var(--sizeBtn);}
.lecture-review .swiper_bottom button{opacity:0.5; min-width:45rem; background-color:transparent; transition:opacity 0.3s ease;}
.lecture-review .swiper_bottom button i{font-size:var(--font25);}
.lecture-review .swiper_bottom button span{font-size:0;}
.lecture-review .swiper_bottom button:hover{opacity:1;}
.review-slide{overflow:inherit; padding-bottom:40rem;}
.review-slide .swiper-slide{width:480rem; height:auto; min-height:230rem;}
.review-slide .edu-review-list{flex-direction:row; align-items:stretch; gap:10rem;}
.review-slide .edu-review-list > li{align-content:space-between;}
.review-slide .edu-review-list [data-review="con"]{margin-bottom:auto;}
.review-slide .edu-review-list [data-review="star"]{order:10; margin-left:0;}
.review-slide .edu-review-list [data-review="btn"]{order:11;}
.review-slide .edu-review-list [data-review="date"]{margin-left:auto;}
@media (max-width:1800px){
	.lecture-review{mask:none;}
}
@media (max-width:1400px){
	.lecture-video-top h3{font-size:var(--font18);}
	.lecture-course-top h4{font-size:var(--font18);}
	.lecture-course{flex:0 0 330rem;}
	.lecture-course-list .edu-course-list > li > *{padding:10rem 30rem 10rem 20rem; font-size:14rem;}
	.lecture-course-list .edu-course-list > li em{width:calc(100% - 45rem); padding-right:0;}
	.lecture-course-list .edu-course-list > li i{right:10rem;}
}
@media (max-width:1024px){
	[data-subarea="lecture"] .edu-apply-list .edu-view-price{flex:0 0 150rem; padding-left:15rem; padding-right:15rem;}
	[class*="lecture-list"] .edu-view-price .button{min-width:inherit; width:100%;}
	.lecture-view{flex-direction:column;}
	.lecture-course{flex:auto; border-left-width:1rem;}
	.lecture-course-list{max-height:400rem;}
	.review-slide .swiper-slide{width:400rem;}
}
@media (max-width:768px){
	[class*="lecture-list"] .edu-apply-list .con-list{flex-direction:column; gap:5rem;}
	[class*="lecture-list"] .edu-view-price .button{min-height:45rem;}
	[class*="lecture-list"] .edu-view-price .button span{font-size:var(--font16);}
	.lecture-video-top{height:auto; min-height:70rem; padding:0 0 0 10rem;}
	.lecture-video-top .btn{flex-direction:column; justify-content:center; height:70rem;}
	.lecture-video-top .btn a{flex:0 1 50%; display:flex; padding:0 13rem; border-top:1rem solid #000;}
	.lecture-video-top .btn a:nth-of-type(1){border-top-width:0;}
	.lecture-video-top h3{padding-top:5rem; padding-bottom:5rem;}
	.review-slide .swiper-slide{gap:10rem; width:300rem; padding:20rem;}
	.review-slide [data-review="con"]{font-size:14rem;}
}
@media (max-width:480px){
	[class*="lecture-list"] .edu-apply-list [data-board="img"]{display:block; width:100%;}
	[class*="lecture-list"] .edu-apply-list .list > li > a, 
	[class*="lecture-list"] .edu-apply-list .list > li > .box{flex-direction:column;}
	[data-subarea="lecture"] .edu-apply-list .edu-view-price{flex:0 1 100%; padding-left:0; padding-right:0; margin-top:10rem;}
	[data-subarea="lecture"] .edu-apply-list .edu-view-price:before{display:none;}
	.lecture-video-top{flex-wrap:wrap; gap:0; padding:10rem 0 0 0;}
	.lecture-video-top .btn{flex:0 1 100%; height:35rem; flex-flow:row nowrap; margin-top:10rem;}
	.lecture-video-top .btn a:nth-of-type(1){border-top-width:1rem;}
	.lecture-video-top .btn a{font-size:13rem;}
	.lecture-video-top .button{display:none;}
	.lecture-video-top .button span{font-size:13rem;}
	.lecture-video-top h3{flex:0 1 100%; padding:3rem 10rem; text-align:center;}
	.lecture-course-top,
	.lecture-course-list{padding:15rem;}
	.lecture-course-list .edu-course-list > li span{margin-left:35rem;}
	.review-slide{padding-bottom:0;}
	.review-slide .edu-review-list [data-review="date"]{flex:0 1 100%; margin-left:0;}
	.lecture-review .swiper_bottom{gap:5rem;}
	.lecture-review .title-check i{top:12rem;}
	.lecture-review .swiper_bottom .button{min-width:90rem; padding:5rem 10rem;}
	.lecture-review .btn_area{padding-bottom:0;}
}

/* 후기 작성  */
.review-write{padding-bottom:60rem;}
.review-write .title-check{margin-top:30rem;}
.review-write .btn_area{position:fixed; bottom:0; left:0; z-index:5; width:100%; margin-top:0; padding:10rem 20rem; background-color:#fff;}
.review-write .btn_area .button{width:100%;}
.review-write .designLabel-radio{margin-top:10rem;}
.review-write .designLabel-radio ul{display:grid; grid-template-columns:1fr 1fr 1fr; gap:3rem;}
.review-write .designLabel-radio [data-review="star"]{min-height:40rem; margin-right:0; padding-left:30rem; padding-right:15rem; border-radius:5rem;}
.review-write .designLabel-radio [data-review="star"] i{font-size:var(--font16);}
.review-write .designLabel-radio [data-review="star"]:after{font-size:var(--font15);}
.review-write .designLabel-radio label span:before{left:10rem;}
.review-write .designText-box{margin-top:10rem;}
.review-write .designText-box textarea{width:100%; height:100rem; border-radius:5rem;}
@media (max-width:480px){
	.review-write .designLabel-radio ul{grid-template-columns:1fr 1fr;}
}

/* 장바구니 */
[data-subarea="basket"] .edu-apply-list .edu-view-price{flex:0 0 230rem; position:relative; padding:0 20rem;}
[data-subarea="basket"] .edu-view-price .button{position:absolute; bottom:0; left:20rem; width:calc(100% - 40rem); min-height:35rem;}
[data-subarea="basket"] .edu-view-price .button span{font-size:var(--font14);}
[data-subarea="basket"] .edu-view-price [data-board="price"]{margin-bottom:40rem;}
[data-subarea="basket"] .edu-apply-info{position:relative;}
.edu-basket-btn{display:flex; align-items:center; gap:20rem; position:absolute; right:0; top:-10rem;}
.edu-basket-btn label,
.edu-basket-btn .button span{font-size:var(--font15);}
.edu-basket-btn .button{min-height:35rem;}
@media (max-width:1024px){
	[data-subarea="basket"] .edu-apply-list .edu-view-price{flex:0 0 200rem;}
}
@media (max-width:768px){
	[data-subarea="basket"] .edu-apply-list .con-list{flex-direction:column; gap:5rem;}
	[data-subarea="basket"] .edu-apply-list [data-board="img"]{width:120rem; height:80rem;}
	[data-subarea="basket"] .edu-apply-list .con{gap:10rem;}
}
@media (max-width:480px){
	[data-subarea="basket"] .edu-apply-list .list .btn-del{position:absolute; right:0; top:-5rem;}
	[data-subarea="basket"] .edu-apply-list .list > li > .box{width:calc(100% - 40rem);}
	[data-subarea="basket"] .edu-apply-list [data-board="tit"]{padding-right:35rem;}
	[data-subarea="basket"] .edu-apply-list .edu-view-price{flex:0 1 100%;}
	[data-subarea="basket"] .edu-view-price [data-board="price"]{margin-bottom:0;}
	[data-subarea="basket"] .edu-view-price .button{position:static; width:100%;}
	.edu-basket-btn{gap:5rem;}
}

/* 결제내역 */
[data-subarea="payment-detail"]{padding-top:0 !important;}
[data-subarea="payment-detail"] .edu-view-price{flex:0 0 320rem; padding:0 20rem;}
[data-subarea="payment-detail"] .edu-view-price .price-list .btn{margin-top:10rem;}
[data-subarea="payment-detail"] .edu-apply-list .con-list{gap:100rem;}
[data-subarea="payment-detail"] .btn-cancel{display:flex; justify-content:center; align-items:center; width:100%; height:35rem; padding:5rem 20rem; border:none; border-radius:6px; cursor:pointer; background-color:#fff; border:2rem solid #ff4d4d; color:#ff4d4d; font-size:var(--font14); font-weight:600; text-align:center; transition:0.3s ease;}
[data-subarea="payment-detail"] .btn-cancel:hover{border-color:#222; color:#222;}
@media (max-width:768px){
	[data-subarea="payment-detail"] .edu-view-price{flex:0 0 250rem;}
	[data-subarea="payment-detail"] .edu-apply-list .con-list{gap:50rem;}
}
@media (max-width:480px){
	[data-subarea="payment-detail"] .edu-view-price{flex:0 1 100%; margin-top:10rem; padding:15rem; background-color:#f5f5f5;}
	[data-subarea="payment-detail"] .edu-view-price .price-list{padding-top:0;}
	[data-subarea="payment-detail"] .edu-apply-list .con-list{gap:5rem;}
}

/* 문의내역 */
[data-subarea="inquiry"] .edu-apply-list .edu-view-price{padding:0 20rem;}
[data-subarea="inquiry"] .edu-apply-list .edu-view-price .button{width:100%;}
@media (max-width:768px){
	[data-subarea="inquiry"] .edu-apply-list .edu-view-price{flex:0 0 150rem;}
}
@media (max-width:480px){
	[data-subarea="inquiry"] .edu-apply-list .edu-view-price{flex:0 1 100%; padding:10rem 0 0 0;}
	[data-subarea="inquiry"] .edu-apply-list .con{gap:10rem;}
	[data-subarea="inquiry"] .btn_area .button.lg{min-width:inherit; width:100%;}
}

/* 문의내역 - 상세 */
[data-subarea="inquiry"] .btn_area.lay{position:relative;}
[data-subarea="inquiry"] .btn_area.lay .button{min-height:55rem;}
[data-subarea="inquiry"] .btn_area .right{position:absolute; right:0;}
@media (max-width:480px){
	[data-subarea="inquiry"] .btn_area{padding-bottom:0; padding-top:0;}
	[data-subarea="inquiry"] .btn_area.lay{flex-wrap:nowrap;}
	[data-subarea="inquiry"] .btn_area .right{position:static;}
	[data-subarea="inquiry"] .btn_area .right .button{min-width:90rem;}	
}

/* 문의내역 - 글쓰기 */
[data-subarea="inquiry"].type02{padding-top:0 !important;}
[data-form="write"]{--sizeHig:65rem; gap:10rem; margin-top:20rem; padding-bottom:0;}
[data-form="write"] input:not([type="checkbox"]):not([type="radio"]),
[data-form="write"] select,
[data-form="write"] textarea{padding-left:90rem; background-color:#f4f7f5; border-radius:5rem; border:1rem solid #c6ccc8;}
[data-form="write"] textarea{padding:50rem 20rem 30rem;}
[data-form="write"] select{padding-left:20rem;}
[data-form="write"] > li{position:relative;}
[data-form="write"] > li > em{display:inline-flex; align-items:center; position:absolute; left:20rem; top:50%; z-index:5; font-size:var(--font16); color:rgba(51,51,51,0.5); transform:translateY(-50%);}
[data-form="write"] .marking{flex:none; margin:0 0 0 5rem;}
[data-form="write"] .in{z-index:4;}
[data-form="write"] .in :is( input, select, textarea, .designSelect .selectbox),
[data-form="write"] .active :is( input, select, textarea, .designSelect .selectbox){background-color:#fff;}
[data-form="write"] .active:not(.in) > label,
[data-form="write"] .active:not(.in) > em{color:rgba(51,51,51,0.5);}
[data-form="write"] .active :is( input[readonly]){background-color:#fff !important; color:#343434 !important;}
[data-form="write"] > li.conts > em{top:16rem; transform:translateY(0);}
[data-form="write"] [data-formwrite="mail"] #email2{padding-left:20rem;}
[data-subarea="inquiry"].type02 [data-form="write"]{gap:10rem 30rem;}
[data-form="write"] [data-formwrite="spam"] .spam{border-radius:5rem;}
[data-form="write"] .spam-wrap em{position:static; transform:translateY(0);}
[data-form="write"] .spam-wrap input:not([type="checkbox"]):not([type="radio"]){padding-left:20rem;}
.box_agree{margin-top:40rem; text-align:center;}
.box_agree p{margin-bottom:40rem; line-height:1.6; color:#444; word-break:keep-all;}
.box_agree .policy{font-weight:600; color:#111;}
@media (max-width:480px){
	[data-form="write"] textarea{height:150rem;}
	[data-form="write"] .mail-wrap em{top:25rem; transform:translateY(0);}
	.box_agree p br{display:none;}
}

/* modal */
.modal-custom{--titleHig:67rem; display:flex; align-items:center; justify-content:center; position:fixed; top:0; left:0; z-index:9999; width:100%; height:100%; background:rgba(0, 0, 0, 0.2);}
.modal-custom .popTitle{display:flex; align-items:center; min-height:var(--titleHig); box-sizing:border-box; padding:5rem 20rem; border-bottom:1rem solid #e4e4e4; font-size:var(--font23); font-weight:700; letter-spacing:-1rem;}
.modal-content{position:relative; background:white; width:400rem; text-align:center;}
.modal-content .popConts{padding:20rem;}
.modal-custom textarea{width:100%; height:150px;}
.modal-buttons{display:flex; gap:10px; justify-content:center;}
.modal-custom .btn_close{display:flex; justify-content:center; align-items:center; position:absolute; right:0; top:0; width:var(--titleHig); height:var(--titleHig); background-color:transparent; box-shadow:none; font-size:0;}
.modal-custom .btn_close span{display:block; position:relative; width:30rem; height:30rem;}
.modal-custom .btn_close span:before{content:'\e922'; opacity:0.5; position:absolute; left:0; line-height:1; font-family:var(--font-xi); font-size:30rem; text-indent:0; font-weight:normal; transition:opacity 0.3s ease;}
.modal-custom .btn_close:hover span:before{opacity:1;}

@media (max-width:480px){
	.modal-content{width:100%; height:100%;}
	.modal-content .popConts{overflow-y:auto; max-height:calc(100% - var(--titleHig));}
}

/* 202506 */
[data-subarea="about"] { }
[data-subarea="about"] .about-wrap {display: flex;gap: clamp(50rem, calc(100 / 1400 * 100vw), 100rem);flex-wrap: wrap; justify-content: center;}
[data-subarea="about"] .about-wrap figure img { max-width: 600rem !important; width: 100%; height: 100%; object-fit: cover; border-radius: 20rem; }
[data-subarea="about"] .greetings { display: flex; flex-direction: column; gap: 40rem; }
[data-subarea="about"] .greetings .txt {line-height: 1.5;font-size: var(--font18);}
[data-subarea="about"] .greetings .tp {line-height:1.4; font-size: var(--font30); font-weight: 600; }
[data-subarea="about"] .profile{padding-top:60rem; background:url(../images/content/tab_bg.gif) repeat-x 0 0;}
[data-subarea="about"] .profile h3{margin-bottom:20rem; font-size:var(--font30); font-weight:600;}
[data-subarea="about"] .profile ul{display:flex; flex-direction:column; gap:5rem;}
[data-subarea="about"] .profile ul > li{position:relative; padding-left:15rem;}
[data-subarea="about"] .profile ul > li:before{content:''; display:block; position:absolute; left:0; top:10rem; width:3rem; height:3rem; background-color:#666; border-radius:100%;}
@media (max-width:480px){
	[data-subarea="about"] .greetings .txt{word-break:keep-all;}  
	[data-subarea="about"] .greetings .txt .mob-none{display:none;}
	[data-subarea="about"] .profile{padding-top:40rem; padding-bottom:50rem;}
	[data-subarea="about"] .profile ul > li{padding-left:10rem;}	
	[data-subarea="about"] .profile ul > li:before{top:5rem;}
}