/** svg 아이콘 포인트컬러 설정 ******

    01. 손 위 톱니바퀴 아이콘 
    02. 책 아이콘
    03. 막대 그래프 아이콘
    04. 플러스 아이콘
*/
.class_detail_icon01 path:first-child,
.class_detail_icon02 path:nth-child(9),
.class_detail_icon03 path:nth-child(6),
.class_detail_icon03 path:nth-child(7),
.class_detail_icon03 path:nth-child(8),
.class_detail_icon04 path:nth-child(4),
.class_detail_icon04 path:nth-child(7),
.class_detail_icon04 path:nth-child(8),
.class_detail_icon04 path:nth-child(9) {fill: var(--class-point-color);}


/* class_wrapper */
#class_wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 20px 16px;
    padding: 35px 16px;
}
#class_wrapper > li {
    flex: 1 45%;
    max-width: calc(50% - 8px);
}
#class_wrapper .class.blank_message {
    width: 100%;
    word-break: keep-all;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding: 8px;
    border-radius: 8px;
    gap: 0 4px;
    background-color: var(--primary-10);
    align-content: center;
    justify-content: center;
}
#class_wrapper .class.blank_message svg {
    width: 50px;
    height: 50px;
}
#class_wrapper .class.blank_message svg path {fill: var(--ktech-gray-950);}
#class_wrapper .class.blank_message > div:first-child {
    width: 100%;
    text-align: center;
}
#class_wrapper .class.blank_message b {background-color: var(--primary-20);padding: 2px 4px;}
#class_wrapper .class a {
    display: block;
}
#class_wrapper .class_img_wrapper {
    position: relative;
    border-radius: 8px;
    margin-bottom: 8px;
    overflow: hidden;
}
#class_wrapper .class_img_wrapper img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center center;
}
#class_wrapper .class_img_wrapper .tag {
    display: block;
    position: absolute;
    top: 8px;
    left: 8px;
    background-color: #0f0f0fcc;
    border: 1px solid var(--ktech-gray-800);
    color: var(--ktech-gray-fff);
    font-size: 12px;
    font-weight: var(--font-weight-medium);
    padding: 2px 6px;
    border-radius: 50px;
}
#class_wrapper .class_img_wrapper .tag.hide {display: none;}
#class_wrapper .class_campus {
    font-weight: var(--font-weight-semibold);
    color: var(--primary-60);
    font-size: 14px;
}
#class_wrapper .class_title {
    width: 100%;
    color: var(--ktech-gray-950);
    font-size: 16px;
    font-weight: var(--font-weight-bold);
    margin-bottom: 6px;
}
#class_wrapper .class_date {
    color: var(--ktech-gray-600);
    font-size: 12px;
    font-weight: var(--font-weight-regular);
}
/* class_detail_wrapper */
#class_detail_wrapper {width: calc(100vw - (100vw - 100%));overflow-x: hidden;}
#class_detail_wrapper .img_wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    aspect-ratio: 1 / 1;
    padding: 36px 16px;
    background-color: var(--ktech-gray-fff);
    box-sizing: border-box;
    position: relative;
}
#class_detail_wrapper .img_wrapper .tag,
#class_detail_wrapper .img_wrapper .title {position: relative;z-index: 1;}
#class_detail_wrapper .img_wrapper .tag {
    width: fit-content;
    max-width: 100%;
    display: inline-block;
    color: var(--primary-60);
    font-size: 16px;
    font-weight: var(--font-weight-semibold);
    padding: 4px 12px;
    border-radius: 50px;
    background-color: var(--ktech-gray-fff);
    box-sizing: border-box;
}
#class_detail_wrapper .img_wrapper .title {
    width: 100%;
    color: var(--ktech-gray-fff);
    font-size: 32px;
    font-weight: var(--font-weight-bold);
    filter: drop-shadow(0 0 9px #21212130);
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-word;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
}
#class_detail_wrapper .img_wrapper .img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
#class_detail_wrapper .img_wrapper .img::after {
    content: '';
    width: 100%;
    height: 100%;
    background-color: var(--ktech-gray-950);
    opacity: 0.5;
    position: absolute;
    top: 0;
    left: 0;
}
#class_detail_wrapper .img_wrapper .img > img {
    width: 100%;
    object-fit: cover;
    object-position: center center;
}
#class_detail_wrapper .intro .info {padding: 32px 16px;}
#class_detail_wrapper .intro .info .top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
}
#class_detail_wrapper .intro .info .campus {
    color: var(--primary-60);
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
}
#class_detail_wrapper .intro .info .share_btn > svg {
    width: 24px;
    height: 24px;
    object-fit: contain;
    object-position: center center;
}
#class_detail_wrapper .intro .info .title {
    color: var(--ktech-gray-950);
    font-size: 20px;
    font-weight: var(--font-weight-bold);
    margin-bottom: 24px;
}
#class_detail_wrapper .intro .info .gray_box {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    background: var(--ktech-gray-100);
    border-radius: 8px;
    padding: 12px;
    box-sizing: border-box;
    margin-bottom: 24px;
}
#class_detail_wrapper .intro .info .gray_box > div.left {flex: 1.2;}
#class_detail_wrapper .intro .info .gray_box > div {flex: 1;}
#class_detail_wrapper .intro .info .gray_box> div > div:first-child {
    color: var(--primary-90);
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
    margin-bottom: 6px;
}
#class_detail_wrapper .intro .info .gray_box .d_day {
    color: var(--primary-60);
    font-size: 16px;
    font-weight: var(--font-weight-semibold);
    display: flex;
    align-items: center;
    gap: 4px;
}
#class_detail_wrapper .intro .info .gray_box .d_day svg {
    width: 16px;
    height: 16px;
}
#class_detail_wrapper .info_table {margin-bottom: 24px;}
#class_detail_wrapper .info_table tr > * {padding-bottom: 9.5px;}
#class_detail_wrapper .info_table th {
    text-align: left;
    color: var(--ktech-gray-400);
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
    width: 80px;
}
#class_detail_wrapper .info_table td {
    color: var(--ktech-gray-600);
    font-size: 16px;
    font-weight: var(--font-weight-semibold);
    padding-left: 20px;
}
#class_detail_wrapper .info_table td .small {font-size: 14px;}
#class_detail_wrapper .info_table td .cancel {
    color: var(--ktech-gray-400);
    font-size: 14px;
    font-weight: var(--font-weight-regular);
    text-decoration-line: line-through;
    margin-right: 4px;
}
#class_detail_wrapper .info_table td .notice {color: var(--primary-60);font-size: 16px;font-weight: var(--font-weight-regular);margin-top: 4px;}
#class_detail_wrapper .btn_wrapper {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: 16px;
}
#class_detail_wrapper .btn_wrapper > a {
    display: inline-block;
    width: 100%;
    text-align: center;
    font-size: 16px;
    font-weight: var(--font-weight-semibold);
    border: 0.5px solid var(--primary-60);
    border-radius: 8px;
    padding: 10px;
    box-sizing: border-box;
}
#class_detail_wrapper .btn_wrapper #apply_btn {
    color: var(--ktech-gray-fff);
    background-color: var(--primary-60);
}
#class_detail_wrapper .btn_wrapper #chat_counsel_btn {
    color: var(--primary-60);
    background-color: #0066ff1f;
}
/* class_detail */
.worker #class_detail {color: var(--ktech-gray-950);background-color: var(--ktech-gray-fff);}
#class_detail {color: var(--ktech-gray-fff);text-align: center;background-color: var(--ktech-gray-950);}
#class_detail > div {padding: 80px 16px;}
#class_detail > div > .sub_title {color: var(--class-point-color);font-size: 14px;font-weight: var(--font-weight-bold);margin-bottom: 24px;}
#class_detail > div > .title {font-size: 32px;font-weight: var(--font-weight-bold);}
/* 인트로 */
.worker #class_detail .section01 {background: linear-gradient(var(--class-point-color-light), var(--ktech-gray-200));}
.worker #class_detail .section01 .text06 {font-size: 24px;}
.worker #class_detail .section01 .outline {filter:drop-shadow(0 0 5.2px var(--class-point-color));}
#class_detail .section01 .emoji {margin-bottom: 16px;}
#class_detail .section01 .point_img {display: block;width: 290px;object-fit: contain;object-position: center center;margin: 0 auto;}
#class_detail .section01 .glow {filter:drop-shadow(0 0 27px var(--class-point-color));}
#class_detail .section01 .dot {display: inline-block;font-size: 0;width: 8px;height: 8px;border-radius: 50%;background-color: #ffffff80;margin: 40px 0;position: relative;}
#class_detail .section01 .dot::before {content: '';width: 8px;height: 8px;border-radius: 50%;background-color: #ffffff;margin: 40px 0;position: absolute;left: 0;top: -24px;}
#class_detail .section01 .dot::after {content: '';width: 8px;height: 8px;border-radius: 50%;background-color: #ffffff50;margin: 40px 0;position: absolute;left: 0;bottom: -24px;}
#class_detail .section01 .text01 {font-size: 22px;font-weight: var(--font-weight-regular);margin-bottom: 8px;}
#class_detail .section01 .text02 {font-size: 24px;font-weight: var(--font-weight-extrabold);}
#class_detail .section01 .text03 {font-size: 16px;font-weight: var(--font-weight-bold);margin-bottom: 16px;}
#class_detail .section01 .text04 {color: var(--ktech-gray-600);font-size: 14px;font-weight: var(--font-weight-regular);margin-bottom: 32px;}
#class_detail .section01 .text05 {font-size: 16px;font-weight: var(--font-weight-regular);margin-bottom: 16px;}
#class_detail .section01 .text06 {font-size: 20px;font-weight: var(--font-weight-bold);}
#curriculum_btn {display: flex;color: var(--ktech-gray-400);align-items: center;justify-content: center;gap: 8px;margin-top: 16px;}
#curriculum_btn svg {width: 16px;height: 16px;}
#curriculum_btn svg path {fill: var(--ktech-gray-400);}
/* 교육맛보기 */
.worker #class_detail .section02 {background-color: var(--ktech-gray-600);}
.worker #class_detail .section02 .title {color: var(--ktech-gray-fff);}
#class_detail .section02 {background-color: var(--ktech-gray-900);}
#class_detail .section02 .title {margin-bottom: 24px;}
#class_detail .section02 .swiper-slide {display: block;}
#class_detail .section02 img {width: 100%;aspect-ratio: 328 / 185;object-fit: cover;object-position: center center;border-radius: 8px;overflow: hidden;}
#class_detail .section02 .swiper-pagination-bullet {width: 8px;height: 8px;background: unset;background-color: var(--class-point-color-dark);}
#class_detail .section02 .swiper-pagination-bullet-active {background: var(--class-point-color);}
#class_detail .section02 .swiper-button-next,
#class_detail .section02 .swiper-button-prev {background-color: #0F0F0Fbd;border-radius: 50%;width: 28px;height: 28px;box-sizing: border-box;background-size: 75% 75%;border: 1px solid #ffffff50;filter: brightness(2);backdrop-filter: blur(2px);-webkit-backdrop-filter: blur(2px);}
/* 핵심포인트 */
.worker #class_detail .section03 {background-color: var(--ktech-gray-fff);background-image: none;}
.worker #class_detail .section03 > .title {filter: none;}
.worker #class_detail .section03 ul li {border-bottom: 1px solid var(--ktech-gray-200);}
.worker #class_detail .section03 ul li .num {color: var(--ktech-gray-fff);}
#class_detail .section03 {background-color: var(--ktech-gray-900);background-image: radial-gradient(circle farthest-side at 50% -100%, var(--class-point-color), var(--ktech-gray-900) 60%);background-repeat: no-repeat;}
#class_detail .section03 > .title {margin-bottom: 16px;filter: drop-shadow(0 0 3.5px var(--class-point-color));}
#class_detail .section03 > .detail {color: var(--ktech-gray-400);font-size: 16px;font-weight: var(--font-weight-regular);margin-bottom: 48px;}
#class_detail .section03 ul {text-align: left;}
#class_detail .section03 ul li {padding: 24px 16px;border-bottom: 1px solid var(--ktech-gray-700);}
#class_detail .section03 ul li:last-child {border: 0;}
#class_detail .section03 ul li > div {margin-bottom: 16px;}
#class_detail .section03 ul li .num {display: inline-block;text-align: center;color: var(--ktech-gray-950);font-size: 18px;font-weight: var(--font-weight-bold);width: 32px;height: 32px;border-radius: 50%;background-color: var(--class-point-color);line-height: 32px;}
#class_detail .section03 ul li .title {font-size: 22px;font-weight: var(--font-weight-bold);}
#class_detail .section03 ul li .detail {color: var(--ktech-gray-500);font-size: 16px;font-weight: var(--font-weight-regular);}
#class_detail .section03 ul li img {display: block;width: 100%;height: 62px;object-fit: contain;object-position: center right;}
#class_detail .section03 ul li .img_inner {width: 100%;text-align: right;margin-bottom: 0;}

/* 수강대상 */
.worker #class_detail .section04 {background-color: var(--ktech-gray-200);}
.worker #class_detail .section04 ul li {background-color: var(--ktech-gray-fff);}
.worker #class_detail .section04 ul li .check {background-color: var(--class-point-color);}
.worker #class_detail .section04 ul li .check path {stroke: var(--ktech-gray-fff);}
.worker #class_detail .section04 ul li .detail {color: var(--ktech-gray-900);}
#class_detail .section04 .title {margin-bottom: 48px;}
#class_detail .section04 ul li {min-height: 120px;display: flex;flex-wrap: nowrap;gap: 16px;align-items: center;padding: 16px 24px;border-radius: 8px;background-color: var(--ktech-gray-900);margin-bottom: 16px;box-sizing: border-box;}
#class_detail .section04 ul li:last-child {margin-bottom: 0;}
#class_detail .section04 ul li .check {flex-shrink: 0; width: 28px;height: 28px;background-color: var(--ktech-gray-950);border-radius: 50%;overflow: hidden;}
#class_detail .section04 ul li .check path {stroke: var(--class-point-color);}
#class_detail .section04 ul li .detail {text-align: left;color: var(--ktech-gray-100);font-size: 18px;font-weight: var(--font-weight-medium);}
/* 커리큘럼-숫자로 확인 */
.worker #class_detail .section05 {background-color: var(--ktech-gray-600);}
.worker #class_detail .section05 > .title {color: var(--ktech-gray-fff);}
.worker #class_detail .section05 .wrap .info {color: var(--ktech-gray-300);}
#class_detail .section05 {background-color: var(--ktech-gray-800);}
#class_detail .section05 > .title {margin-bottom: 48px;}
#class_detail .section05 .wrap {margin-bottom: 48px;}
#class_detail .section05 .wrap:last-child {margin-bottom: 0;}
#class_detail .section05 .wrap .big {font-size: 72px;font-weight: var(--font-weight-bold);margin-bottom: 24px;background: linear-gradient(var(--ktech-gray-fff) 48%, var(--class-point-color-light));color: transparent;-webkit-background-clip: text;animation: bg-blink 1s ease-out infinite;}
#class_detail .section05 .wrap .big > span {font-size: 32px;}
#class_detail .section05 .wrap .title {color: var(--ktech-gray-100);font-size: 22px;font-weight: var(--font-weight-semibold);margin-bottom: 8px;}
#class_detail .section05 .wrap .info {color: var(--ktech-gray-500);font-size: 14px;font-weight: var(--font-weight-regular);}
/* 수료후 취업 */
#class_detail .section06 {background-color: var(--ktech-gray-900);}
#class_detail .section06 > .title {margin-bottom: 38px;}
#class_detail .section06 > .title span {color: var(--class-point-color);}
#class_detail .section06 .outcomes_wrapper {width: 100%;display: flex;flex-wrap: nowrap;overflow: hidden;box-sizing: border-box;}
#class_detail .section06 .ticker {flex-shrink: 0;display: flex;flex-wrap: nowrap;}
#class_detail .section06 .outcome {display: flex;flex-direction: column;justify-content: flex-start;flex-shrink: 0;text-align: left;width: 242px;padding: 20px 24px;border-radius: 16px;border: 1px solid var(--ktech-gray-700);margin-right: 16px;box-sizing: border-box;}
#class_detail .section06 .outcome .title {width: 100%;font-size: 22px;font-weight: var(--font-weight-bold);margin-bottom: 8px;word-break: keep-all;}
#class_detail .section06 .outcome .info {width: 100%;color: var(--ktech-gray-400);font-size: 16px;font-weight: var(--font-weight-regular);}
/* 취업지원 */
.worker #class_detail .section07 > ul::before {background-color: var(--ktech-gray-200);}
.worker #class_detail .section07 > ul li .title {color: var(--ktech-gray-800);}
.worker #class_detail .section07 > ul li .step {color: var(--ktech-gray-400);}
.worker #class_detail .section07 > ul li ul li {color: var(--ktech-gray-400);}
.worker #class_detail .section07 > ul li ul li::before {background-color: var(--ktech-gray-400);}
.worker .highlight > span {mix-blend-mode: darken;}
.worker #class_detail .section07 .right_plus_btn {color: var(--ktech-gray-800);}
#class_detail .section07 > ul {margin-top: 48px;padding: 16px 0;position: relative;margin-bottom: 24px;}
#class_detail .section07 > ul::before {content: '';width: 1px;height: 100%;position: absolute;top: 0;left: 55px;background-color: var(--ktech-gray-600);}
#class_detail .section07 > ul li {text-align: left;display: flex;gap: 34px;margin-bottom: 66px;align-items: baseline;}
#class_detail .section07 > ul li:last-child {margin-bottom: 0;}
#class_detail .section07 > ul li .step {width: 42px;color: var(--ktech-gray-600);font-size: 12px;font-weight: var(--font-weight-bold);position: relative;}
#class_detail .section07 > ul li .step::after {content: '';width: 8px;height: 8px;position: absolute;top: 0;left: 100%;transform: translate(9px, 50%);background-color: var(--class-point-color);border-radius: 50%;outline: 2px solid var(--class-point-color-50);animation: blink 3s ease-in-out infinite;}
#class_detail .section07 > ul li .title {display: inline-block;color: var(--ktech-gray-100);font-size: 20px;font-weight: var(--font-weight-semibold);margin-bottom: 8px;}
#class_detail .section07 > ul li ul li {color: var(--ktech-gray-600);font-size: 16px;font-weight: var(--font-weight-regular);margin-bottom: 2px;position: relative;padding-left: 12px;margin-left: 8px;}
#class_detail .section07 > ul li ul li::before {content: '';width: 4px;height: 4px;border-radius: 50%;background-color: var(--ktech-gray-600);position: absolute;top: 10px;left: 0;}
#class_detail .section07 .right_plus_btn {color: var(--ktech-gray-100);font-weight: var(--font-weight-regular);}
.highlight {position: relative;}
.highlight > span {width: calc(100% + 8px);height: 100%;background-color: var(--class-point-color);position: absolute;top: 0;left: 0;transform: translate(-4px, 0);opacity: 0.8;mix-blend-mode: lighten;}
/* 커리큘럼-실무완성 */
.worker #class_detail .section08 {background-color: var(--ktech-gray-100);}
.worker #class_detail .section08 .details_wrapper details {background-color: var(--ktech-gray-fff);}
.worker #class_detail .section08 .details_wrapper .title {color: var(--ktech-gray-900);}
.worker #class_detail .section08 .details_wrapper details li {color: var(--ktech-gray-600);}
.worker #class_detail .section08 .details_wrapper .box {background-color: var(--ktech-gray-100);}
.worker #class_detail .section08 .details_wrapper details .content {border-top: 0px solid var(--ktech-gray-200);}
.worker #class_detail .section08 .details_wrapper details.open .content {border-top: 1px solid var(--ktech-gray-200);}
#class_detail .section08 {background-color: var(--ktech-gray-900);}
#class_detail .section08 .details_wrapper {margin-top: 48px;}
#class_detail .section08 .details_wrapper > li {margin-bottom: 16px;}
#class_detail .section08 .details_wrapper > li:last-child {margin-bottom: 0;}
#class_detail .section08 .details_wrapper details {text-align: left;padding: 24px 16px;border-radius: 8px;background-color: var(--ktech-gray-800);box-shadow: 0 0px 14px 2px #0c0c0d0d;}
#class_detail .section08 .details_wrapper details:last-child {margin-bottom: 0;}
#class_detail .section08 .details_wrapper details summary {display: block;position: relative;}
#class_detail .section08 .details_wrapper details summary::before {content: '';position: absolute;top: 50%;right: 0;transform: translateY(-50%);width: 10px;height: 10px;background-image: url(/m2/assets/img/arrow_down_gray_icon.png);background-position: center center;background-repeat: no-repeat;background-size: contain;}
#class_detail .section08 .details_wrapper details.open summary::before {transform: rotateX(180deg) translateY(100%);}
#class_detail .section08 .details_wrapper .step {color: var(--class-point-color);font-size: 12px;font-weight: var(--font-weight-bold);margin-bottom: 8px;}
#class_detail .section08 .details_wrapper .title {color: var(--ktech-gray-100);font-size: 20px;font-weight: var(--font-weight-bold);}
#class_detail .section08 .details_wrapper details ul {padding: 16px 0 16px 8px;}
#class_detail .section08 .details_wrapper details li {color: var(--ktech-gray-400);font-size: 16px;font-weight: var(--font-weight-regular);padding-left: 15px;position: relative;margin-bottom: 2px;}
#class_detail .section08 .details_wrapper details li::before {content: '';width: 3px;height: 3px;border-radius: 50%;background-color: var(--ktech-gray-400);position: absolute;top: 10px;left: 0;}
#class_detail .section08 .details_wrapper .box {color: var(--ktech-gray-500);font-size: 16px;font-weight: var(--font-weight-regular);padding: 12px;background-color: #3e465040;border-radius: 8px;}
#class_detail .section08 .details_wrapper details .content {overflow: hidden;max-height: 0;transition: all 0.5s ease;border-top: 0px solid var(--ktech-gray-700);}
#class_detail .section08 .details_wrapper details.open .content {max-height: 250px;border-top: 1px solid var(--ktech-gray-700);margin-top: 16px;}
/* 수강후기 */
.worker #class_detail .student_interview_section {background-color: var(--ktech-gray-200);}
#class_detail .student_interview_section > .title {margin-bottom: 48px;}
#class_detail .student_interview_section .swiper-button-next,
#class_detail .student_interview_section .swiper-button-prev {transform: translateY(-130%);background-color: #0F0F0Fbd;border-radius: 50%;width: 28px;height: 28px;box-sizing: border-box;background-size: 75% 75%;border: 1px solid #ffffff50;filter: brightness(2);backdrop-filter: blur(2px);-webkit-backdrop-filter: blur(2px);}
#class_detail .student_interview_section .interview {text-align: left;}
#class_detail .student_interview_section .interview a > img {width: 100%;object-fit: cover;object-position: center center;border-radius: 8px;margin-bottom: 24px;aspect-ratio: 164 / 105;}
#class_detail .student_interview_section .interview .title {width: 100%;font-size: 20px;font-weight: var(--font-weight-bold);margin-bottom: 8px;}
#class_detail .student_interview_section .interview .info {color: var(--ktech-gray-400);font-size: 14px;font-weight: var(--font-weight-regular);}
/* 한직교혜택 */
#class_detail .section10 {background-color: var(--ktech-gray-800);}
#class_detail .section10 .title {margin-bottom: 48px;}
#class_detail .section10 .wrapper {margin-bottom: 64px;}
#class_detail .section10 .wrapper .tag {display: inline-block;color: var(--ktech-gray-950);font-size: 14px;font-weight: var(--font-weight-semibold);border-radius: 50px;background-color: var(--class-point-color);padding: 8px 16px;margin-bottom: 24px;}
#class_detail .section10 .wrapper img {display: block;width: 244px;aspect-ratio: 18 / 11;object-fit: contain;object-position: center center;margin: 0 auto 24px;}
#class_detail .section10 .wrapper .title {font-size: 22px;font-weight: var(--font-weight-semibold);margin-bottom: 8px;}
#class_detail .section10 .wrapper .title .point {color: var(--class-point-color);}
#class_detail .section10 .wrapper .info {color: var(--ktech-gray-400);font-size: 16px;font-weight: var(--font-weight-regular);}
/* 강사 인터뷰 */
.worker #class_detail .teacher_interview_section {background-color: var(--ktech-gray-200);}
#class_detail .teacher_interview_section > .title {margin-bottom: 48px;}
#class_detail .teacher_interview_section .swiper-button-next,
#class_detail .teacher_interview_section .swiper-button-prev {transform: translateY(-130%);background-color: #0F0F0Fbd;border-radius: 50%;width: 28px;height: 28px;box-sizing: border-box;background-size: 75% 75%;border: 1px solid #ffffff50;filter: brightness(2);backdrop-filter: blur(2px);-webkit-backdrop-filter: blur(2px);}
#class_detail .teacher_interview_section .interview {text-align: left;}
#class_detail .teacher_interview_section .interview a > img {width: 100%;object-fit: cover;object-position: center center;border-radius: 8px;margin-bottom: 24px;aspect-ratio: 57 / 35;}
#class_detail .teacher_interview_section .interview .title {width: 100%;font-size: 20px;font-weight: var(--font-weight-bold);margin-bottom: 8px;}
#class_detail .teacher_interview_section .interview .info {color: var(--ktech-gray-400);font-size: 14px;font-weight: var(--font-weight-regular);}
/* 질문 */
.worker #class_detail .section11 {background-color: var(--ktech-gray-fff);}
.worker #class_detail .section11 .details_wrapper details summary {color: var(--ktech-gray-950);}
.worker #class_detail .section11 .details_wrapper details .answer {color: var(--ktech-gray-500);}
.worker #class_detail .section11 .details_wrapper > li {border-bottom: 1px solid var(--ktech-gray-200);}
#class_detail .section11 {background-color: var(--ktech-gray-900);}
#class_detail .section11 .title {margin-bottom: 48px;}
#class_detail .section11 .details_wrapper > li {text-align: left;border-bottom: 1px solid var(--ktech-gray-500);padding: 24px 16px;}
#class_detail .section11 .details_wrapper details:last-child {margin-bottom: 0;}
#class_detail .section11 .details_wrapper details summary {display: block;position: relative;padding: 0 24px;word-break: keep-all;color: var(--ktech-gray-100);font-size: 16px;font-weight: var(--font-weight-medium);}
#class_detail .section11 .details_wrapper details summary::after {content: 'Q.';color: var(--class-point-color);font-size: 16px;font-weight: var(--font-weight-extrabold);position: absolute;top: 0;left: 0;}
#class_detail .section11 .details_wrapper details summary::before {content: '';position: absolute;top: 50%;right: 0;transform: translateY(-50%);width: 10px;height: 10px;background-image: url(/m2/assets/img/arrow_down_gray_icon.png);background-position: center center;background-repeat: no-repeat;background-size: contain;}
#class_detail .section11 .details_wrapper details.open summary::before {transform: rotateX(180deg) translateY(100%);}
#class_detail .section11 .details_wrapper details .answer {color: var(--ktech-gray-400);font-size: 16px;font-weight: var(--font-weight-regular);overflow: hidden;max-height: 0;transition: all 0.5s ease;padding: 0 0 0 24px;}
#class_detail .section11 .details_wrapper details.open .answer {max-height: 250px;padding: 16px 0 0 24px;}
/* 신청문의 */
.worker #class_detail .counsel_section {background-color: var(--ktech-gray-600);}
.worker #class_detail .counsel_section form ul li input::placeholder {color: #BBBBBB;}
#class_detail .counsel_section {border-bottom: 1px solid var(--ktech-gray-700);}
#class_detail .counsel_section .title {color: var(--class-point-color);margin-bottom: 48px;}
#class_detail .counsel_section form {text-align: left;}
#class_detail .counsel_section form ul li {margin-bottom: 16px;}
#class_detail .counsel_section form ul li label {display: block;color: #f2f2f2;font-size: 16px;font-weight: var(--font-weight-semibold);margin-bottom: 12px;}
#class_detail .counsel_section form ul li input {width: 100%;color: var(--ktech-gray-fff);font-size: 14px;font-weight: var(--font-weight-regular);background-color: #bbbbbb10;border-radius: 4px;border: 1px solid #bbbbbb20;padding: 16px 10px;box-sizing: border-box;}
#class_detail .counsel_section form ul li input:focus {outline: 1.5px solid var(--class-point-color);}
#class_detail .counsel_section form ul li .phone_number_wrapper {display: flex;flex-wrap: nowrap;gap: 8px;align-items: center;font-size: 24px;}
#class_detail .counsel_section form .campus_select_area {display: none;}
#class_detail .counsel_section form .agree {margin-bottom: 24px;display: flex;align-items: center;}
#class_detail .counsel_section form .agree input[type=checkbox] + .check_icon {display: inline-flex;margin-right: 6px;width: 18px;height: 18px;background-color: #bbbbbb;border-radius: 4px;align-items: center;padding: 4.5px;box-sizing: border-box;}
#class_detail .counsel_section form .agree input[type=checkbox]:checked + .check_icon {background-color: var(--class-point-color);}
#class_detail .counsel_section form .agree input[type=checkbox]:checked + .check_icon svg path {stroke: var(--ktech-gray-950);}
#class_detail .counsel_section form .agree label {color: #bbbbbb;font-size: 14px;font-weight: var(--font-weight-regular);cursor: pointer;}
#class_detail .counsel_section form .agree .policy_agree_detail_btn {display: inline-block;text-decoration: underline;}
#class_detail .counsel_section form a.btn {display: block;text-align: center;color: #000000;font-size: 16px;font-weight: var(--font-weight-semibold);padding: 12px 24px;background-color: var(--class-point-color);border-radius: 8px;}
/* 커스텀섹션 */
.worker #class_detail .class_custom_section {background: linear-gradient(var(--ktech-gray-600), transparent 60%);}
.worker #class_detail .class_custom_section::before {background: linear-gradient(90deg, transparent, var(--ktech-gray-500), transparent);}
.worker #class_detail .class_custom_section > .title {color: var(--ktech-gray-fff);}
.worker #class_detail .class_custom_section > .detail {color: var(--ktech-gray-500);}
#class_detail .class_custom_section {background: linear-gradient(var(--ktech-gray-900), transparent);position: relative;}
#class_detail .class_custom_section::before {content: '';width: 50%;height: 2px;position: absolute;top: 0;left: 50%;transform: translateX(-50%);background: linear-gradient(90deg, transparent, var(--ktech-gray-700), transparent);}
#class_detail .class_custom_section > .title {margin-bottom: 48px;}
#class_detail .class_custom_section .contents_wrapper {margin-bottom: 48px;}
#class_detail .class_custom_section img {width: 100%;object-fit: contain;object-position: center;border-radius: 8px;overflow: hidden;}
#class_detail .class_custom_section > .sub_title {font-size: 20px;color: var(--class-point-color);text-align: left;margin-bottom: 8px;}
#class_detail .class_custom_section > .detail {color: var(--ktech-gray-300);text-align: left;}
#class_detail .class_custom_section .contents_wrapper a {position: relative;}
#class_detail .class_custom_section .contents_wrapper a::before {content: '▶';width: 40px;height: 40px;line-height: 40px;color: var(--ktech-gray-fff);font-size: 18px;text-align: center;border: 1px solid var(--ktech-gray-fff);display: inline-block;border-radius: 50%;background-color: var(--ktech-gray-950);opacity: 0.7;padding-left: 2px;box-sizing: border-box;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);cursor: pointer;pointer-events: none;}

/* graph */
#infographic .graph {height: 275px;margin-bottom: 16px;gap: 8px;}
#infographic .graph .arrow {display: none;}
#infographic .number {font-size: 16px;font-weight: var(--font-weight-medium);}
#infographic .date {color: var(--ktech-gray-100);font-size: 16px;font-weight: var(--font-weight-regular);}
#infographic .percent {font-size: 24px;font-weight: var(--font-weight-extrabold);color: transparent;filter: drop-shadow(0 0 8px var(--class-point-color));background: linear-gradient(var(--ktech-gray-fff) 48%, var(--class-point-color));-webkit-background-clip: text;}
/* bar */
#infographic.bar .graph {display: flex;flex-wrap: nowrap;justify-content: center;align-items: flex-end;position: relative;}
#infographic.bar .graph .arrow.bar {display: block;}
#infographic.bar .graph .arrow {position: absolute;top: 10%;left: 50%;width: 120px;height: 120px;transform: translate(-100%, 0);}
#infographic.bar .graph .arrow stop {stop-color: var(--class-point-color);}
#infographic.bar .graph .arrow path {fill: url('#arrow_gradiant_bar');}
#infographic.bar .number {display: inline-flex;padding: 8px 16px;margin: 0 8px;align-items: center;}
#infographic.bar .left .number {height: 100px;background-color: var(--ktech-gray-900);color: var(--ktech-gray-500);}
#infographic.bar .right .number {height: 150px;background-color: var(--class-point-color);background-image: linear-gradient(var(--class-point-color), var(--ktech-gray-950));color: var(--class-point-color-light);}
#infographic.bar .date {padding-top: 8px;position: relative;}
#infographic.bar .date::before {content: '';width: 150%;height: 4px;position: absolute;top: 0;left: 50%;background-color: var(--ktech-gray-700);transform: translateX(-50%);}
#infographic.bar .percent {margin-bottom: 4px; margin-left: 3px;}
/* line */
#infographic.line .graph {display: flex;flex-wrap: nowrap;justify-content: center;align-items: flex-end;position: relative;}
#infographic.line .number {width: 100px;}
#infographic.line .left {text-align: left;}
#infographic.line .left .number {transform: translateX(-30%);height: 140px;color: var(--ktech-gray-500);}
#infographic.line .right {text-align: right;}
#infographic.line .right .number {transform: translateX(30%);height: 230px;}
#infographic.line .date {padding-top: 8px;position: relative;}
#infographic.line .date::before {content: '';width: 150%;height: 4px;position: absolute;top: 0;left: 50%;background-color: var(--ktech-gray-700);transform: translateX(-50%);}
#infographic.line .arrow.line {display: block;width: 100px;height: 100px;position: absolute;top: 50%;left: 50%;transform: translate(30%, -50%);}
#infographic.line .arrow.line svg {width: 50px;}
#infographic.line .arrow.line svg linearGradient stop {stop-color: var(--class-point-color);}
#infographic.line .arrow.line svg polygon {fill: url('#arrow_gradiant_line');}
#infographic.line .percent {position: absolute;bottom: 20%;left: 50%;z-index: 2;transform: translateX(20%);}
#infographic.line .graph_line svg {width: 200px;position: absolute;top: 0;left: 50%;transform: translate(-50%, 45%);}
#infographic.line .graph_line svg linearGradient stop {stop-color: var(--class-point-color);}
#infographic.line .graph_line svg polyline {fill: none;stroke: url('#graph_line');stroke-width: 5px;stroke-miterlimit: 10;}
/* circle */
#infographic.circle .graph {display: flex;flex-wrap: nowrap;justify-content: center;align-items: flex-end;position: relative;}
#infographic.circle .number {display: inline-flex;padding: 8px;margin: 0 8px;align-items: center;justify-content: center;border-radius: 50%;aspect-ratio: 1 / 1;}
#infographic.circle .left,
#infographic.circle .right {width: 150px;}
#infographic.circle .left .number {width: 120px;background-image: linear-gradient(var(--ktech-gray-900), var(--ktech-gray-950));color: var(--ktech-gray-500);position: absolute;top: 50%;left: 50%;z-index: 1;transform: translate(-110%, -50%);border: 4px solid var(--ktech-gray-950);box-sizing: border-box;}
#infographic.circle .right .number {width: 150px;background-image: linear-gradient(var(--class-point-color), var(--class-point-color-dark));color: var(--class-point-color-light);transform: translateX(-25%);margin-bottom: 35px;}
#infographic.circle .percent {transform: translateX(-28px);margin-bottom: 12px;}
#infographic.circle .right .date {transform: translateX(-28px);}