@charset "utf-8";
@import url('https://flozfloz.malgnlms.com/html/fonts/pretendard/pretendard.css');

.ver_mobile { display:none !important;}
.ver_pc { display:block !important;}

.header h1 .svg_logo {max-height: 40px !important;}

/* 과정 목록 */
.photo_list .item {border-radius:10px !important;}
.photo_list .item .img_box > img {border-radius: 10px 10px 0px 0px !important;}
.item .con_box h4 {font-weight:600 !important;}

.con_box .price.pointColor strong {color:#fb0002 !important;}
.con_box .price.pointColor .month_price { display:flex !important; flex-wrap:wrap !important; gap:2px 5px !important; margin-top:7px !important; align-items:center !important;}
.con_box .price.pointColor .month_price strong {color:#000 !important; font-size:16px !important; line-height:1 !important;}
.con_box .price.pointColor .month_price p {margin:0px !important;}
.con_box .price.pointColor .per_price {line-height:1 !important;}

.photo_list .item .con_box .price.pointColor .price_wrap {display:flex !important; gap:2px 6px; flex-wrap:wrap !important; align-items:center !important; }
.photo_list .item .con_box .price.pointColor .price_wrap .dash {margin:0px !important;}
.thum_list .item .con_box .price.pointColor .month_price {display:inline-block !important;}
.thum_list .item .con_box .price .dash {margin:5px 0px !important;}


.percent {display:inline-block !important; width:auto !important; height:20px !important; line-height:20px !important; font-size:13px !important; font-weight:600 !important; color:#fff !important; padding:0px 5px !important; margin:0px !important; background:#fb0002 !important; border-radius:3px !important; }

.price_ver2 .price_table .price_in .price.pointColor,
.price_ver2 .price_table .total h4 .price.pointColor {color:#fb0002 !important;}
.price .dash {color:#777 !important; line-height:16px !important;}
.price .dash::after {background: #888 !important;}

.lnb_depth ul li#webtv-main {display:none !important;}

.about {position:relative; width:100%; display:flex; flex-wrap:wrap;}
.about p { width:100%;}
.about img { max-width:100%;}
.about_mov_wrap {position:relative;width:100%;padding:0px 14% 10% 14%;  box-sizing:border-box; background:url('/html/images/common/about02.jpg') 50% 0% no-repeat; background-size:100%; }
.about_mov { position:relative;display:inline-block;width:100%; height:0px; padding-bottom:56.25%;}
.about_mov iframe { position:absolute;left:0px;top:0px;width:100%; height:100%; }


@media (min-width:681px) {
    .photo_list .item .con_box { padding: 20px !important;}
}
@media (max-width: 1300px) {
    .thum_list {padding:0px !important;}
}
@media (max-width:980px) {
	.thum_list .item .con_box .price {width:95% !important; text-align:left !important;}
	.thum_list .item .con_box .price.pointColor .price_wrap {display:flex !important; gap:2px 6px; flex-wrap:wrap !important; align-items:center !important;}
	.thum_list .item .con_box .price.pointColor .per_price {display:inline-block !important; width:auto !important;}
	.thum_list .item .con_box .price .dash {margin: 0px !important;}
}

@media (max-width:680px) {
	.ver_mobile { display:block !important;}
	.ver_pc { display:none !important;}

	#header .head_in h1 .svg_logo,
	.header h1 .svg_logo  { max-width:120px !important; max-height:26px !important; }

	.login_cont h1 .svg_logo { max-width: 150px !important; padding-right:20px !important;}

    .con_box .price.pointColor .month_price,
	.con_box .price.pointColor .month_price strong,
	.con_box .price.pointColor .month_price p {font-size:14px !important;}
	.percent {height:16px !important; line-height:16px !important; font-size:12px !important; padding:0px 3px !important;}

	.photo_list .item .con_box .price.pointColor .price_wrap {gap:2px 4px !important;}

	.about_mov_wrap {padding:0px 10% 7% 10%;}

	h3.title { font-size:19px !important;}
	.compad .review_list .slick-prev,
	.compad .review_list .slick-next {top: -15px !important; width:20px !important;height:20px !important;padding:0px 0px !important;}
}

@media (max-width:390px) {
	h3.title { font-size:17px !important;}
}

@media (max-width:359px) {
    .con_box .price.pointColor .month_price,
	.con_box .price.pointColor .month_price strong,
	.con_box .price.pointColor .month_price p {font-size:13px !important;}
}


/* 메인 과정 모듈 */
.mCourse {background: linear-gradient(to bottom, #fee2c5, #b9defe);}
.mCourse * {font-family:'Pretendard' !important;  }
.mCourse h3.title {margin-bottom:100px;}
.mCourse h3.title img {max-width:90%;}
.mcourse_list {width:100%; max-width:1200px; display:flex; flex-wrap:nowrap; gap:6px; margin:0px auto; }
.mcourse_item { width:100%; display:flex; flex-wrap:wrap; background:#fff; border-radius:20px; overflow:hidden; }
.mcourse_item .mcourse_img {width:100%; padding:0px;}
.mcourse_item .mcourse_img img {max-width:100%;}
.mcourse_item .mcourse_price {width:100%; background:#f8f8f8; padding:40px 45px; box-sizing:border-box;}
.mcourse_item .mcourse_price dl {width:100%; margin:5px auto; display:flex; justify-content:space-between; align-items:center;}
.mcourse_item .mcourse_price dt {font-size:20px; letter-spacing:-0.05em;font-weight:600; line-height:1.2 !important;}
.mcourse_item .mcourse_price dd {font-size:22px;letter-spacing:-0.05em; line-height:1.2 !important;}
.mcourse_item .mcourse_price dl.before dt {color:#000;}
.mcourse_item .mcourse_price dl.before dd {color:#777; text-decoration:line-through; font-weight:500;}
.mcourse_item .mcourse_price dl.after dt {color:#ef191b;}
.mcourse_item .mcourse_price dl.after dd {font-size:42px; color:#ef191b;font-weight:800;}
.mcourse_item .mcourse_price dl.monthly dt {font-size:18px; color:#777;font-weight:500;}
.mcourse_item .mcourse_price dl.monthly dd {font-size:32px;color:#000;font-weight:600;}
.mcourse_item .mcourse_btn {width:100%; height:70px; border-radius:10px; background:#222; color:#fff;font-size:26px;font-weight:700; display:flex; justify-content:center;align-items:center; margin-top:40px;}
.mcourse_item.basic {margin:4px;}
.mcourse_item.master {border:4px #fe6a1b solid;}
.mcourse_item.master .mcourse_btn {background: linear-gradient(to right, #fea532, #e46e26);}



@media (max-width:1024px) {
	.mCourse h3.title {margin-bottom: 8vw;}
	.mcourse_item { border-radius:15px;}
	.mcourse_item .mcourse_price { padding:30px 32px;} 
	.mcourse_item .mcourse_price dt {font-size:16px;}
	.mcourse_item .mcourse_price dd {font-size:17px;}
	.mcourse_item .mcourse_price dl.after dd {font-size:34px;}
	.mcourse_item .mcourse_price dl.monthly dt {font-size:15px;}
	.mcourse_item .mcourse_price dl.monthly dd {font-size:28px;}
	.mcourse_item .mcourse_btn {height:60px;font-size:22px; margin-top:30px;}
}

@media (max-width:680px) {
	.mcourse_list {flex-wrap:wrap; gap:20px;}
	.mcourse_item.basic {margin:0px;}
	.mcourse_item .mcourse_price { padding:20px 25px; }
	.mcourse_item .mcourse_price dl {margin:3px auto;}
	.mcourse_item .mcourse_price dt {font-size:14px;}
	.mcourse_item .mcourse_price dd {font-size:16px;}
	.mcourse_item .mcourse_price dl.after dd {font-size:30px;}
	.mcourse_item .mcourse_price dl.monthly dt {font-size:13px;}
	.mcourse_item .mcourse_price dl.monthly dd {font-size:24px;}
	.mcourse_item .mcourse_btn {height:50px; border-radius:8px;font-size:18px; margin-top:20px;}

}