@charset "utf-8";

/*-------------------------------------------------------------------
    파일정의 : 컨텐츠 스타일
-------------------------------------------------------------------*/

/*-------------------------------------------------------------------
    @공통
-------------------------------------------------------------------*/
.sub {display: flex; align-items: flex-start; gap: 0 2rem; max-width: 145rem; padding: 3.5rem 0 4.5rem; margin: 0 auto;}
.sub > div {padding-left: 2.5rem; padding-right: 2.5rem;}
.sub .lnb {flex: none; width: 30rem;}
.sub .lnb .inner {padding: 2.5rem 3rem; border-radius: 2rem; background-color: #ffffff; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1);}
.sub .lnb .inner .tit-depth {font-size: 3.2rem; font-weight: 700; line-height: 1.1875;}

.sub .lnb .inner .depth02 {margin-top: 2rem; padding-top: 2rem; border-top: 0.1rem solid #DDDDDD;}
.sub .lnb .inner .depth02 > ul > li + li {margin-top: 2rem;}
.sub .lnb .inner .depth02 > ul > li > a {display: block; font-size: 2.1rem; font-weight: 600; line-height: 1.191}

.sub .lnb .inner .depth03 {margin-top: 1.4rem;}
.sub .lnb .inner .depth03 > ul > li + li {margin-top: 1.5rem;}
.sub .lnb .inner .depth03 > ul > li > a {display: block; position: relative; padding-left: 2.4rem; font-size: 1.8rem; font-weight: 600; line-height: 1.333;}
.sub .lnb .inner .depth03 > ul > li > a::before {content: ""; width: 0.4rem; height: 0.4rem; border-radius: 50%; background-color: #000000; position: absolute; left: 1rem; top: 50%; transform: translateY(-50%);}

.sub .lnb .inner .depth02 > ul > li.on > a {color: #0A6E23;}

.sub .lnb .inner .depth03 > ul > li.on > a {color: #0A6E23;}
.sub .lnb .inner .depth03 > ul > li.on > a::before {background-color: #0A6E23;}
.sub .lnb .inner .depth03 > ul > li.on > a > span {border-bottom: 0.1rem solid #0A6E23}

.sub .layout {flex: 1 0; min-width: 0;}
.sub .layout .location {padding-bottom: 2rem; border-bottom: 0.1rem solid #DDDDDD;}
.sub .layout .location .loc-area ul {display: flex; align-items: center; gap: 0 3rem;}
.sub .layout .location .loc-area ul li {position: relative;}
.sub .layout .location .loc-area ul li + li::before {content: ""; position: absolute; left: -1rem; top: 50%; color: #0A6E23; width: 1rem; height: 100%; background: url('../img/icon/ic_arr_location.png') no-repeat center/0.7rem; transform: translate(-100%, -50%);}
.sub .layout .location .loc-area ul li a {display: block; width: 100%; height: 100%; font-size: 1.6rem; line-height: 1.1875;}

.sub .layout .location .loc-area ul li.home {text-indent: -9999px; width: 1.6rem; height: 1.6rem; background: url('../img/icon/ic_home.png') no-repeat center/100%;}

.sub .layout .location .tit-area {margin-top: 0.8rem;}
.sub .layout .location .tit-area .tit-depth {width: fit-content; position: relative;}
.sub .layout .location .tit-area .tit-depth p,
.sub .layout .location .tit-area .tit-depth select {font-size: 3.2rem; font-weight: 700; line-height: 1.1875; background: none; border: 0; width: fit-content;}
.sub .layout .location .tit-area .tit-depth select {display: none; position: relative; z-index: 1;}
.sub .layout .location .tit-area .tit-depth .depth-dropdown {width: fit-content; position: relative; z-index: 1; display: none;}
.sub .layout .location .tit-area .tit-depth .depth-dropdown .btn-dropdown {font-size: 3.2rem; font-weight: 700; line-height: 1.1875; display: block; padding-right: 4.6rem;}
.sub .layout .location .tit-area .tit-depth .depth-dropdown .dropdown-list {position: absolute; min-width: 100%; background-color: #ffffff; border-radius: 0.8rem; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); top: 100%; margin-top: 1rem; width: fit-content; display: none;}
.sub .layout .location .tit-area .tit-depth .depth-dropdown .dropdown-list ul li + li {border-top: 0.1rem solid #DDDDDD;}
.sub .layout .location .tit-area .tit-depth .depth-dropdown .dropdown-list ul li a {text-align: center; padding: 1.2rem 1.6rem; font-size: 2.4rem; line-height: 1.5; font-weight: 500; display: block;}
.sub .layout .location .tit-area .tit-depth .depth-dropdown.on .dropdown-list {display: block;}
.sub .layout .location + .contents {padding-top: 3rem; padding-bottom: 5.5rem;}

.sub .layout .contents {padding-top: 4.5rem; padding-bottom: 3.5rem;}

/* 서브 비쥬얼 */
.sub-visual{}

.sub-visual.bg01{}

.sub-visual .tit-visual{}

.sub-visual .txt-visual{}

/* box 레이아웃 */
.box-wrap {position: relative;}
.box-wrap > .inner {max-width: 92.5rem; width: calc(100% - 47.5rem)}

.box-wrap .map-area {}
.box-wrap .map-area.small {height: 20rem;}
.box-wrap .map-area.big {height: 42rem;}

.box-wrap .headline {position: relative;}
.box-wrap .headline .assist-area {display: flex; align-items: center; justify-content: space-between;}
.box-wrap .headline .assist-area .tag-list ul {max-width: none;}
.box-wrap .headline .assist-area .share-area {display: flex; align-items: center; gap: 0 1rem;}
.box-wrap .headline .assist-area + * {margin-top: 1.6rem;}
.box-wrap .headline .title {font-size: 2.6rem; line-height: 1.193; font-weight: 700;}
.box-wrap .headline .title + .keyword-list {margin-top: 6.4rem;}
.box-wrap .headline .title + .procedure-area {margin-top: 1.6rem;}
.box-wrap .headline .procedure-area {display: flex; align-items: center; justify-content: space-between; gap: 3rem 1.6rem;}
.box-wrap .headline .procedure-area .progress-area {display: flex; gap: 0 1.6rem; flex: 1 0; min-width: 0;}
.box-wrap .headline .procedure-area .progress-area dl {background-color: #ffffff; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); height: 6rem; border-radius: 6rem; padding: 1.2rem 3rem; display: flex; align-items: center; justify-content: space-between; max-width: 22rem; flex: 1 0;}
.box-wrap .headline .procedure-area .progress-area dl dt {font-size: clamp(11px, 1.6rem, 1.6rem); font-weight: 600; color: #0A6E23}
.box-wrap .headline .procedure-area .progress-area dl dd {font-size: 2.9rem; font-weight: 600;}
.box-wrap .headline .procedure-area .state-area {display: flex; justify-content: space-between; gap: 0 4rem;}
.box-wrap .headline .procedure-area .state-area dl {display: flex; align-items: center; gap: 0 2rem;}
.box-wrap .headline .procedure-area .state-area dl dt {font-size: clamp(11px, 1.6rem, 1.6rem); font-weight: 600; color: #0A6E23;}
.box-wrap .headline .procedure-area .state-area dl dd {font-size: 2.9rem; font-weight: 700;}
.box-wrap .headline .procedure-area .state-area dl.is-incomplete dd {color: #555555;}

.box-wrap .lecture-data {position: absolute; right: 0; top: 0; width: 44.5rem; border-radius: 3rem; background-color: #ffffff; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); overflow: hidden; z-index: 1;}
.box-wrap .lecture-data.scroll {position: fixed; left: 50%; top: 14.5rem; bottom: auto; transform: translateX(25.5rem); right: auto;}
.box-wrap .lecture-data .thumb-area {position: relative; padding-top: 74.832%; overflow: hidden;}
.box-wrap .lecture-data .thumb-area img {position: absolute; width: 100%; height: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); object-fit: cover;}
.box-wrap .lecture-data .cont-area {padding: 4.8rem 2rem 1.6rem;}
.box-wrap .lecture-data .cont-area .btn-wrap {margin-top: -5.4rem; transform: translateY(-2.4rem);}
.box-wrap .lecture-data .cont-area .title {font-size: clamp(16px, 2rem, 2rem); font-weight: 700; line-height: 1.2;}
.box-wrap .lecture-data .cont-area .title + .data-area {margin-top: 1.2rem;}
.box-wrap .lecture-data .cont-area .data-area table {width: 100%; table-layout: fixed;}
.box-wrap .lecture-data .cont-area .data-area table tbody tr th,
.box-wrap .lecture-data .cont-area .data-area table tbody tr td {padding: 0.4rem 0; font-size: clamp(12px, 1.5rem, 1.5rem); text-align: left; line-height: 1.3334; vertical-align: middle;}
.box-wrap .lecture-data .cont-area .data-area table tbody tr th {font-weight: 700;}
.box-wrap .lecture-data .cont-area .data-area table tbody tr td .rating-stars .star {width: 2rem; height: 2rem;}
.box-wrap .lecture-data .cont-area .data-area table tbody tr td .rating-result .value {font-weight: 300;}

.box-wrap .scroll-controller {height: 6.5rem; }
.box-wrap * + .scroll-controller {margin-top: 4.5rem;}
.box-wrap .scroll-controller .floating {top: 11.4rem; max-width: 92.5rem; width: calc(100% - 52.5rem); z-index: 2;}
.box-wrap .scroll-controller.scroll .floating {position: fixed; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); background-color: #ffffff;}
.box-wrap .scroll-controller + * {margin-top: 4rem;}
.box-wrap .scroll-controller ul {display: flex; justify-content: flex-start;}
.box-wrap .scroll-controller ul li {flex: none;}
.box-wrap .scroll-controller ul li a {display: flex; align-items: center; height: 6.5rem; padding: 0 4rem; font-size: 2.2rem; font-weight: 700; line-height: 1.182; gap: 0 0.4rem; position: relative; justify-content: center;}
.box-wrap .scroll-controller ul li a .cnt {width: 6rem; height: 3.5rem; line-height: 3.5rem; text-align: center; border-radius: 50rem; background-color: #CBFACE; font-size: 1.5rem; font-weight: 700; color: #0B4C1B;}
.box-wrap .scroll-controller ul li.on a {color: #0A6E23;}

.box-wrap .summary .tit.v2 + .text {margin-top: 2rem;}
.box-wrap .summary .text {font-size: clamp(12px, 1.7rem, 1.7rem); font-weight: 500; line-height: 1.177;}
.box-wrap .summary .text + img {margin-top: 1.2rem;}

.box-wrap .index .tit.v2 + .acc-wrap {margin-top: 1.2rem;}

.box-wrap .review .tit + .review-area {margin-top: 2rem;}
.box-wrap .review .review-area .review-top {display: flex; align-items: center; justify-content: space-between;}
.box-wrap .review .review-area .review-top .data-area dl {display: flex; align-items: center; gap: 0 0.8rem;}
.box-wrap .review .review-area .review-top .data-area dl dt,
.box-wrap .review .review-area .review-top .data-area dl dd {font-size: clamp(12px, 1.7rem, 1.7rem); font-weight: 700; letter-spacing: -0.007rem; line-height: 1.5;}
.box-wrap .review .review-area .review-top .data-area dl dd strong {color: #0A6E23;}
.box-wrap .review .review-area .review-top + .review-input {margin-top: 1.2rem;}

.box-wrap .review .review-area .review-input textarea {height: 16rem;}
.box-wrap .review .review-area .review-input .cnt {text-align: right; margin-top: 0.4rem; font-size: clamp(11px, 1.5rem, 1.5rem)}
.box-wrap .review .review-area .review-input .rating-area {margin-top: 2rem;}
.box-wrap .review .review-area .review-input + .review-list {margin-top: 3.2rem}

.box-wrap .review .review-area .review-list ul li {border-top: 0.1rem solid #dddddd; padding: 2.4rem 0}
.box-wrap .review .review-area .review-list ul li:last-of-type {border-bottom: 0.1rem solid #DDDDDD}
.box-wrap .review .review-area .review-list ul li .user-area {display: flex; align-items: center; gap: 0 1.6rem;}
.box-wrap .review .review-area .review-list ul li .user-area .name {font-size: clamp(12px, 1.7rem, 1.7rem); font-weight: 700; line-height: 1.177;}
.box-wrap .review .review-area .review-list ul li .user-area + .cont-area {margin-top: 1.6rem;}
.box-wrap .review .review-area .review-list ul li .cont-area .txt {font-size: clamp(11px, 1.5rem, 1.5rem); letter-spacing: -0.03em; line-height: 1.5;}
.box-wrap .review .review-area .review-list ul li .cont-area .txt + .data-area {margin-top: 0.8rem;}
.box-wrap .review .review-area .review-list ul li .cont-area .data-area {display: flex; gap: 0 1.6rem;}
.box-wrap .review .review-area .review-list ul li .cont-area .data-area p {font-size: clamp(11px, 1.5rem, 1.5rem); letter-spacing: -0.03em; line-height: 1.4; position: relative; color: #555555}
.box-wrap .review .review-area .review-list ul li .cont-area .data-area p + p::before {content: ""; width: 0.1rem; height: 1.2rem; background-color: #DDDDDD; position: absolute; left: -0.8rem; top: 50%; transform: translateY(-50%);}

.box-wrap .board .headline-area .tag-list + .title-area {margin-top: 1.6rem;}
.box-wrap .board .headline-area .title-area {display: flex; align-items: center; justify-content: space-between;}
.box-wrap .board .headline-area .title-area .title {font-size: 2.6rem; font-weight: 700; line-height: 1.193; flex: 1 0;}
.box-wrap .board .headline-area .title-area .label-area {flex: none;}
.box-wrap .board .headline-area .title-area + .data-area {margin-top: 1.2rem;}
.box-wrap .board .headline-area .data-area {display: flex; align-items: center; gap: 0 1.6rem}
.box-wrap .board .headline-area .data-area p {position: relative; font-size: 1.7rem; line-height: 1; color: #555555;}
.box-wrap .board .headline-area .data-area p + p::before {content: ""; width: 0.1rem; height: 1.2rem; background-color: #C6C6C6; position: absolute; left: -0.8rem; top: 0.2rem}
.box-wrap .board .headline-area + .view-area {margin-top: 1.2rem;}
.box-wrap .board .view-area {border-radius: 1.6rem; border: 0.1rem solid #DDDDDD; padding: 2rem 2rem;}
.box-wrap .board .view-area + .attach-area {margin-top: 4rem;}
.box-wrap .board .attach-area .attach-top {display: flex; align-items: center; justify-content: space-between;}
.box-wrap .board .attach-area .attach-top .data-area .cnt {font-size: 1.7rem; letter-spacing: -0.07rem; line-height: 1.5; font-weight: 700; color: #333333;}
.box-wrap .board .attach-area .attach-top .data-area .cnt strong {color: #0A6E23}
.box-wrap .board .attach-area .attach-top + .attach-list {margin-top: 1rem;}
.box-wrap .board .attach-area .attach-list ul li {padding: 2rem 1.6rem; display: flex; align-items: center; border: 0.1rem solid #DDDDDD; border-radius: 0.8rem; min-height: 6rem;}
.box-wrap .board .attach-area .attach-list ul li + li {margin-top: 1rem;}
.box-wrap .board .attach-area .attach-list ul li .tit {font-size: 1.7rem; line-height: 1; flex: 1 0; min-width: 0;}
.box-wrap .board .attach-area .attach-list ul li .btn-download {flex: none;}

.box-wrap .answer {background-color: #F4F5F6;}
.box-wrap .answer .headline-area .tag-list + .title-area {margin-top: 1.6rem;}
.box-wrap .answer .headline-area .title-area {display: flex; align-items: center; justify-content: space-between;}
.box-wrap .answer .headline-area .title-area .title {font-size: 2.6rem; font-weight: 700; line-height: 1.193; flex: 1 0;}
.box-wrap .answer .headline-area .title-area .label-area {flex: none;}
.box-wrap .answer .headline-area .title-area + .data-area {margin-top: 1.2rem;}
.box-wrap .answer .headline-area .data-area {display: flex; align-items: center; gap: 0 1.6rem}
.box-wrap .answer .headline-area .data-area p {position: relative; font-size: 1.7rem; line-height: 1; color: #555555;}
.box-wrap .answer .headline-area .data-area p + p::before {content: ""; width: 0.1rem; height: 1.2rem; background-color: #C6C6C6; position: absolute; left: -0.8rem; top: 0.2rem}
.box-wrap .answer .headline-area + .view-area {margin-top: 1.2rem;}
.box-wrap .answer .view-area {border-radius: 1.6rem; border: 0.1rem solid #DDDDDD; padding: 2rem 2rem; background-color: #ffffff;}

.box-wrap .rent-info {display: flex; gap: 2.4rem 2.4rem; align-items: flex-start;}
.box-wrap .rent-info .rent-intro {flex: none; width: 43.138%;}
.box-wrap .rent-info .rent-intro .visual-area {position: relative;}
.box-wrap .rent-info .rent-intro .visual-area .intro-swiper01 .swiper .swiper-wrapper .swiper-slide {position: relative; padding-top: 71.591%; overflow: hidden; border-radius: 2rem;}
.box-wrap .rent-info .rent-intro .visual-area .intro-swiper01 .swiper .swiper-wrapper .swiper-slide img {position: absolute; width: 100%; height: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); object-fit: cover;}
.box-wrap .rent-info .rent-intro .visual-area .intro-swiper02 {margin-top: 1.6rem;}
.box-wrap .rent-info .rent-intro .visual-area .intro-swiper02 .swiper .swiper-wrapper .swiper-slide {position: relative; padding-top: 22.73%; overflow: hidden; border-radius: 0.8rem;}
.box-wrap .rent-info .rent-intro .visual-area .intro-swiper02 .swiper .swiper-wrapper .swiper-slide img {position: absolute; width: 100%; height: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); object-fit: cover;}
.box-wrap .rent-info .rent-intro .visual-area .btn-room-prev,
.box-wrap .rent-info .rent-intro .visual-area .btn-room-next {top: 32.21%}
.box-wrap .rent-info .rent-intro .visual-area .btn-room-prev {left: 1.2rem;}
.box-wrap .rent-info .rent-intro .visual-area .btn-room-next {right: 1.2rem}
.box-wrap .rent-info .info-area {margin-top: 3.2rem;}
.box-wrap .rent-info .info-area .tag-list + .title {margin-top: 0.8rem;}
.box-wrap .rent-info .info-area .title {font-size: 2.6rem; font-weight: 700; line-height: 1.193;}
.box-wrap .rent-info .info-area .title + .classroom-info {margin-top: 1.6rem;}
.box-wrap .rent-info .info-area .classroom-info dl {display: flex; align-items: flex-start; gap: 0 1.6rem;}
.box-wrap .rent-info .info-area .classroom-info dl + dl {margin-top: 1.2rem;}
.box-wrap .rent-info .info-area .classroom-info dl dt {flex: none;}
.box-wrap .rent-info .info-area .classroom-info dl dd {flex: 1 0; min-width: 0; padding: 0.6rem 0; font-size: 1.8rem; font-weight: 500; line-height: 1.1667;}
.box-wrap .rent-reserve {flex: 1 0; min-width: 0;}
.box-wrap .rent-reserve .reserve-area {border: 0.1rem solid #DDDDDD; border-radius: 1.2rem;}
.box-wrap .rent-reserve .reserve-area .ui-datepicker {border: 0 !important; width: 100%;}
.box-wrap .rent-reserve .reserve-area .time-area {padding: 1.6rem 1.6rem; border-top: 0.1rem solid #DDDDDD;}
.box-wrap .rent-reserve .reserve-area .time-area .in-time {margin-top: 1.2rem; display: flex; gap: 0 1.4rem;}
.box-wrap .rent-reserve .reserve-area .time-area .in-time .check-drop {flex: 1 0; min-width: 0;}
.box-wrap .rent-reserve .reserve-area .time-area .in-time .btn {width: 12rem;}
.box-wrap .rent-reserve .reserve-area .time-area .out-time {margin-top: 0.8rem;}
.box-wrap .rent-reserve .reserve-area .time-area .out-time ul li {display: flex; align-items: center; justify-content: flex-start; gap: 0 0.8rem}
.box-wrap .rent-reserve .reserve-area .time-area .out-time ul li + li {margin-top: 0.8rem;}
.box-wrap .rent-reserve .reserve-area .time-area .out-time ul li p {font-size: 1.5rem; line-height: 1.5; color: #0B4C1B;}

.box-wrap .rent-data .data-area {margin-top: 2rem;}
.box-wrap .rent-data .data-area ul {display: flex; gap: 1.6rem 1.6rem; flex-wrap: wrap; align-items: stretch;}
.box-wrap .rent-data .data-area ul li {flex: 1 0; min-width: 0; display: flex; align-items: flex-start; padding: 2rem 2rem; gap: 0 2rem; border-radius: 1.6rem; border: 0.1rem solid #DDDDDD;}
.box-wrap .rent-data .data-area ul li .img-area {width: 4.8rem; flex: none;}
.box-wrap .rent-data .data-area ul li .text-area {flex: 1 0; min-width: 0;}
.box-wrap .rent-data .data-area ul li .text-area .title {font-size: 2rem; font-weight: 700; line-height: 1.2;}
.box-wrap .rent-data .data-area ul li .text-area .text {font-size: 1.6rem; font-weight: 500; line-height: 1.1875; margin-top: 0.8rem;}

.box-wrap .branch-wrap {display: flex; align-items: flex-start; gap: 4rem 4rem;}
.box-wrap .branch-wrap .map-area {position: relative; width: 45.589%; background: url('../img/sub/img_campus_map.png') no-repeat center/100%; padding-top: 38.474%;}
.box-wrap .branch-wrap .map-area .mutual-area {position: absolute; width: 100%; height: 100%; z-index: 1; top: 0;}
/* .box-wrap .branch-wrap .map-area > img {position: relative; z-index: 2;} */
.box-wrap .branch-wrap .map-area .map-overlay {position: absolute; z-index: 1; width: 100%; top: 0; left: 0; height: 100%;}
.box-wrap .branch-wrap .map-area ul li {position: absolute; font-size: 1.4rem; font-weight: 700; color: #088A20; transform: translate(-50%, -50%);}
.box-wrap .branch-wrap .map-area ul li[data-campus="17"]  { left: 33.6%; top: 63%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="18"]  { left: 32%; top: 84%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="19"]  { left: 33%; top: 49%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="20"]  { left: 51.4%; top: 57.9%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="21"]  { left: 90%; top: 53%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="22"]  { left: 14%; top: 48%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="23"]  { left: 44.6%; top: 68.6%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="24"]  { left: 40.1%; top: 44.1%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="25"]  { left: 76.8%; top: 53.9%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="26"] { left: 55%; top: 49.3%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="27"] { left: 50.34%; top: 40.51%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="28"] { left: 66%; top: 51.5%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="29"] { left: 60%; top: 36%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="30"] { left: 68.4%; top: 42.4%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="31"] { left: 64%; top: 15.3%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="32"] { left: 59.8%; top: 23.7%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="33"] { left: 43.3%; top: 82%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="34"] { left: 74%; top: 19%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="35"] { left: 38.7%; top: 30%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="36"] { left: 71%; top: 73.4%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="37"] { left: 78.3%; top: 36.7%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="38"] { left: 84%; top: 68.3%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="39"] { left: 58.2%; top: 75.8%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="40"] { left: 21%; top: 63.4%; }
.box-wrap .branch-wrap .map-area ul li[data-campus="41"] { left: 18.5%; top: 72.4%; }

.box-wrap .branch-wrap .map-area ul li.on {text-indent: -9999px; width: 4.9rem; height: 6.3rem; background: url('../img/sub/img_pin.png') no-repeat center/100%; transform: translate(-50%, -100%); z-index: 1;}

.box-wrap .branch-wrap .info-area {flex: 1 0;}
.box-wrap .branch-wrap .info-area .data-area {margin-top: 2rem;}
.box-wrap .branch-wrap .info-area .data-area dl {display: flex; align-items: flex-start; gap: 0 1.6rem;}
.box-wrap .branch-wrap .info-area .data-area dl + dl {margin-top: 1.2rem;}
.box-wrap .branch-wrap .info-area .data-area dl dt {flex: none;}
.box-wrap .branch-wrap .info-area .data-area dl dd {flex: 1 0; min-width: 0; padding: 0.6rem 0; font-size: 1.8rem; font-weight: 500; line-height: 1.1667;}
.box-wrap .branch-wrap .info-area .data-area ul li {display: flex; gap: 0 1.6rem;}
.box-wrap .branch-wrap .info-area .data-area ul li + li {margin-top: 2rem;}
.box-wrap .branch-wrap .info-area .data-area ul li .icon-area {flex: none;}
.box-wrap .branch-wrap .info-area .data-area ul li .cont-area {flex: 1 0; min-width: 0;}
.box-wrap .branch-wrap .info-area .data-area ul li .cont-area .title {padding: 0.3rem 0; font-size: 1.8rem; font-weight: 500; letter-spacing: -0.07em; line-height: 1.5;}
.box-wrap .branch-wrap .info-area .data-area ul li .cont-area .title + .text {margin-top: 0.8rem;}
.box-wrap .branch-wrap .info-area .data-area ul li .cont-area .text {font-size: 1.7rem; font-weight: 500; color: #555555;}
.box-wrap .branch-wrap .info-area .data-area ul li .cont-area .text + .text {margin-top: 0.8rem;}

.box-wrap .direction-info .info-area {margin-top: 2rem;}
.box-wrap .direction-info .info-area dl {display: flex; align-items: flex-start; gap: 0 1.6rem;}
.box-wrap .direction-info .info-area dl + dl {margin-top: 1.2rem;}
.box-wrap .direction-info .info-area dl dt {flex: none;}
.box-wrap .direction-info .info-area dl dd {flex: 1 0; min-width: 0; padding: 0.6rem 0; font-size: 1.8rem; font-weight: 500; line-height: 1.1667;}
.box-wrap .direction-info .map-guide {margin-top: 0.8rem;}
.box-wrap .direction-info .map-guide ul {display: flex; gap: 1.6rem 1.6rem; flex-wrap: wrap;}
.box-wrap .direction-info .map-guide ul li {overflow: hidden; border-radius: 0.8rem; border: 0.1rem solid #DDDDDD; position: relative; padding-top: 22.375%; overflow: hidden; width: calc(calc(100% - 3.2rem)/3); cursor: pointer;}
.box-wrap .direction-info .map-guide ul li img {position: absolute; width: 100%; height: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); object-fit: cover;}
.box-wrap .direction-info .map-guide ul li .cover {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4) url('../img/icon/ic_detail.png') no-repeat center/5.6rem; opacity: 0; transition: all 0.3s ease;}

.box-wrap .mobility-info .info-area {margin-top: 2rem;}
.box-wrap .mobility-info .info-area dl + dl {margin-top: 1.6rem;}
.box-wrap .mobility-info .info-area dl dt {display: flex; align-items: center; justify-content: flex-start; gap: 0 1.6rem;}
.box-wrap .mobility-info .info-area dl dt p {font-size: 1.8rem; font-weight: 500; line-height: 1.167;}
.box-wrap .mobility-info .info-area dl dd {margin-top: 0.8rem; font-size: 1.7rem; line-height: 1.471; color: #555555;}

.box-wrap .learn {display: flex; align-items: flex-start; gap: 4rem 4rem;}
.box-wrap .learn .view-area {width: 59.329%;}
.box-wrap .learn .view-area .video-area {overflow: hidden; border-radius: 1.6rem; position: relative; padding-top: 74.843%;}
.box-wrap .learn .view-area .video-area > * {width: 100%; height: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover;}
.box-wrap .learn .view-area .cont-area {margin-top: 2rem;}
.box-wrap .learn .view-area .cont-area .title {font-size: clamp(16px, 2.2rem, 2.2rem); font-weight: 700; line-height: 1.182;}
.box-wrap .learn .view-area .cont-area .text-index {margin-top: 0.8rem; font-size: clamp(12px, 1.7rem, 1.7rem); line-height: 1.5; color: #555555;}
.box-wrap .learn .learn-data {flex: 1 0; padding-top: 2rem;}
.box-wrap .learn .learn-data .tit-wrap > .etc-area .value {font-size: 1.7rem;}
.box-wrap .learn .learn-data .tit-wrap > .etc-area .value strong {color: #0A6E23; font-weight: 700;}
.box-wrap .learn .learn-data .progress-bar {margin-top: 1.6rem; height: 1.6rem; width: 100%; border-radius: 1.6rem; background-color: #DDDDDD; position: relative; overflow: hidden;}
.box-wrap .learn .learn-data .progress-bar .bar {position: absolute; left: 0; border-radius: 1.6rem; background-color: #0A6E23; height: 100%; top: 0; width: 0;}
.box-wrap .learn .learn-data .status-list {margin-top: 4rem;}
.box-wrap .learn .learn-data .status-list ul li {border-radius: 0.8rem; border: 0.1rem solid #DDDDDD; padding: 1.6rem 4.4rem 1.6rem 2rem; background-image: url('../img/icon/ic_check_index_default.png'); background-repeat: no-repeat; background-position: right 2rem center; background-size: 2.4rem;}
.box-wrap .learn .learn-data .status-list ul li + li {margin-top: 0.8rem;}
.box-wrap .learn .learn-data .status-list ul li p {font-size: 2rem; font-weight: 500; line-height: 1.2;}
.box-wrap .learn .learn-data .status-list ul li.is-complete {background-image: url('../img/icon/ic_check_index_complete.png');}
.box-wrap .learn .learn-data .status-list ul li.is-active {background-image: url('../img/icon/ic_check_index_active.png'); background-color: #E0F0E9; border-color: #E0F0E9;}
.box-wrap .learn .learn-data .status-list ul li.is-active p {color: #0A6E23; font-weight: 700;}

.rating-area {display: flex; align-items: center; justify-content: space-between;}
.rating-area .btn {flex: none; width: fit-content;}

.rating-result {display: flex; align-items: center; gap: 0 0.4rem}
.rating-result .value {flex: none; font-size: clamp(11px, 1.5rem, 1.5rem); font-weight: 600;}

.rating-stars {display: flex; align-items: center; gap: 0 0.2rem}
.rating-stars .star {flex: none; width: 2.4rem; height: 2.4rem; background-repeat: no-repeat; background-position: center; background-size: 100%;}
.rating-stars .star.off {background-image: url('../img/icon/ic_star_off.png');}
.rating-stars .star.on {background-image: url('../img/icon/ic_star_on.png');}

.rating-input {display: flex; align-items: center; gap: 0 0.8rem;}
.rating-input .title {flex: none; font-size: clamp(11px, 1.5rem, 1.5rem); font-weight: 600; line-height: 1.5; letter-spacing: -0.007rem;}
.rating-input .rating-stars .star {cursor: pointer}

.process-area {padding: 6rem 0;}
.process-area ul {display: flex; align-items: center; justify-content: center;}
.process-area ul li {width: 22rem; position: relative;}
.process-area ul li img {width: 6.4rem; margin: 0 auto;}
.process-area ul li p {text-align: center; font-size: 2.2rem; line-height: 1.182; margin-top: 1.6rem;}
.process-area ul li.on.last p {color: #0A6E23; font-weight: 800;}
.process-area ul li + li::before {content: ""; width: 4rem; height: 4rem; position: absolute; background-image: url('../img/sub/img_arr_apply_off.png'); background-repeat: no-repeat; background-position: center; background-size: 100%; top: 1.2rem; left: 0; transform: translateX(-50%)}
.process-area ul li.on::before {background-image: url('../img/sub/img_arr_apply_on.png');}

.agree-area {border-radius: 1.6rem; overflow: hidden; border: 0.1rem solid #DDDDDD;}
.agree-area .agree-tit {padding: 0 3rem;}
.agree-area .agree-tit .inner {border-bottom: 0.1rem solid #DDDDDD; padding: 3rem 0;}
.agree-area .agree-tit .inner .tit {font-size: 2.6rem; font-weight: 700;}
.agree-area .agree-cont {max-height: 34rem; overflow: auto; padding: 2rem 2rem;}
.agree-area .agree-cont .tit {font-size: 1.7rem; font-weight: 600; line-height: 1.177;}
.agree-area .agree-cont .txt {font-size: 1.7rem; color: #555555; line-height: 1.177;}
.agree-area .agree-cont .tit + .txt {margin-top: 0.4rem;}
.agree-area .agree-cont .txt + .tit {margin-top: 1.6rem;}
.agree-area .agree-cont .txt + .txt {margin-top: 1.6rem;}
.agree-area .agree-cont .tit + .agree-table {margin-top: 0.4rem;}
.agree-area .agree-cont .agree-table {display: flex; flex-wrap: wrap; border: 0.1rem solid #DDDDDD; align-items: stretch;}
.agree-area .agree-cont .agree-table dl {flex: 1 0; display: flex; flex-direction: column;}
.agree-area .agree-cont .agree-table dl + dl {border-left: 0.1rem solid #DDDDDD;}
.agree-area .agree-cont .agree-table dl dt {padding: 1.8rem 0; text-align: center; font-weight: 700; line-height: 1.9rem; line-height: 1.527; background-color: #F3F3F3; width: 100%; flex: none;;}
.agree-area .agree-cont .agree-table dl dd {padding: 1.2rem 0; text-align: center; font-size: 1.7rem; font-weight: 500; line-height: 1.705; border-top: 0.1rem solid #DDDDDD; display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1 0; min-height: 8.5rem;}
.agree-area .agree-cont .txt + .agree-table {margin-top: 1.2rem;}
.agree-area .agree-cont .agree-table + .txt {margin-top: 2rem;}
.agree-area .agree-result {background-color: #E0F0E9; padding: 2rem 2rem;}

.exam-wrap .exam-item + .exam-item {margin-top: 5rem;}
.exam-wrap .exam-item .txt-exam {font-size: 2.2rem; font-weight: 700; line-height: 1.182; word-break: break-word;}
.exam-wrap .exam-item .txt-exam + .img-area {margin-top: 1.5rem;}
.exam-wrap .exam-item .img-area + .exam-cont {margin-top: 1.5rem;}
.exam-wrap .exam-item .txt-exam + .exam-cont {margin-top: 1.5rem;}
.exam-wrap .exam-item .exam-cont ul li + li {margin-top: 1.5rem;}
.exam-wrap .exam-item .exam-cont ul li {position: relative; width: fit-content;}
.exam-wrap .exam-item .exam-cont ul li input {border: 0; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
.exam-wrap .exam-item .exam-cont ul li input + label {position: relative; width: fit-content; display: block;}
.exam-wrap .exam-item .exam-cont ul li input + label p {font-size: 2.2rem; line-height: 1.182; font-weight: 500;}
.exam-wrap .exam-item .exam-cont ul li input:checked + label p {color: #0A6E23; font-weight: 700; text-decoration: underline;}
.exam-wrap .exam-item .exam-cont ul li input:focus,
.exam-wrap .exam-item .exam-cont ul li input:active {width: 100%; height: 100%; margin: 0; overflow: visible; clip-path: none; white-space: normal;}

.survey-wrap .survey-item + .survey-item {margin-top: 5rem;}
.survey-wrap .survey-item .txt-survey {font-size: 2.2rem; font-weight: 700; line-height: 1.182; word-break: break-word;}
.survey-wrap .survey-item .txt-survey + .survey-cont {margin-top: 1.5rem;}
.survey-wrap .survey-item .survey-cont ul li + li {margin-top: 1.5rem;}
.survey-wrap .survey-item .survey-cont ul li {position: relative; width: fit-content;}
.survey-wrap .survey-item .survey-cont ul li input {border: 0; clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
.survey-wrap .survey-item .survey-cont ul li input + label {position: relative; width: fit-content; display: block;}
.survey-wrap .survey-item .survey-cont ul li input + label p {font-size: 2.2rem; line-height: 1.182; font-weight: 500;}
.survey-wrap .survey-item .survey-cont ul li input:checked + label p {color: #0A6E23; font-weight: 700; text-decoration: underline;}
.survey-wrap .survey-item .survey-cont ul li input:focus,
.survey-wrap .survey-item .survey-cont ul li input:active {width: 100%; height: 100%; margin: 0; overflow: visible; clip-path: none; white-space: normal;}
.survey-wrap .survey-item .survey-cont ul.emotion-scale {display: flex; align-items: flex-start; justify-content: space-between;}
.survey-wrap .survey-item .survey-cont ul.emotion-scale li + li {margin-top: 0;}
.survey-wrap .survey-item .survey-cont ul.emotion-scale li input + label::before {content: ""; width: 2rem; height: 2rem; background: url('../img/icon/ic_radio_03_off.png') no-repeat center; background-size: 100%; position: absolute; left: 50%; top: 0; transform: translateX(-50%);}
.survey-wrap .survey-item .survey-cont ul.emotion-scale li input:focus,
.survey-wrap .survey-item .survey-cont ul.emotion-scale li input:active {width: 2.4rem; height: 3rem; margin: 0; overflow: visible; clip-path: none; white-space: normal;}
.survey-wrap .survey-item .survey-cont ul.emotion-scale li input:checked + label::before {background: url('../img/icon/ic_radio_03_on.png') no-repeat center; background-size: 100%;}
.survey-wrap .survey-item .survey-cont ul.emotion-scale li input + label p {padding-top: 2.8rem;}
.survey-wrap .survey-item .survey-cont ul.emotion-scale li input:checked + label p {text-decoration: none;}

/*-------------------------------------------------------------------
    @메뉴명
-------------------------------------------------------------------*/
/* 로그인 */
.login .login-form {border-radius: 3rem; background-color: #ffffff; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); padding: 4.5rem 4.5rem 3rem; max-width: 59rem; margin: 0 auto;}
.login .login-form .login-headline {width: fit-content; margin: 0 auto;}
.login .login-form .login-headline p {text-align: center;}
.login .login-form .login-headline .text01 {padding: 0.8rem 0 0.2rem 3.2rem; line-height: 1.25; font-size: 2.4rem; font-weight: 700; color: #0A6E23; background: url('../img/common/logo_symbol.png') no-repeat left top/3.2rem;}
.login .login-form .login-headline .text02 {margin-top: 0.6rem; font-size: 1.6rem; line-height: 1.5; font-weight: 500;}
.login .login-form .login-headline + .form-wrap.v1 {margin-top: 1.6rem;}
.login .login-form .form-wrap.v1 {gap: 1.5rem 0}
.login .login-form .form.row {gap: 0.8rem 0;}
.login .login-form .form.row .form-tit .tit {font-size: 1.6rem; color: #0A6E23;}
.login .login-form .login-support {margin-top: 2rem;}
.login .login-form .login-support ul {display: flex; align-items: center; gap: 0 5rem; justify-content: center;}
.login .login-form .login-support ul li {position: relative;}
.login .login-form .login-support ul li + li::before {content: ""; width: 0.2rem; height: 1.6rem; background-color: #dddddd; position: absolute; left: -2.6rem; top: 50%; transform: translateY(-50%);}
.login .login-form .login-support ul li a {color: #333333; line-height: 1.1875; font-weight: 600; color: #333333; font-size: 1.6rem;}
.login .login-form .sba-join {margin-top: 2rem; border-top: 0.1rem solid #DDDDDD; padding-top: 2.5rem;}
.login .login-form .sba-join .title {text-align: center; font-size: 2.4rem; line-height: 1.25; font-weight: 600;}
.login .login-form .sba-join .text {text-align: center; font-size: 1.6rem; line-height: 1.5; font-weight: 500; margin-top: 1.5rem;}

/* 검색결과 */
.search-result .total-search {max-width: 86rem; margin: 0 auto; padding: 1.5rem 2rem 1.5rem 4.4rem; background: #ffffff; border-radius: 10rem; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1);}
.search-result .total-search .word {display: flex; align-items: center; gap: 0 2rem;}
.search-result .total-search .word input[type="text"] {border: 0; font-size: 2.4rem; flex: 1 0; min-width: 0;}
.search-result .total-search .word input[type="text"]::placeholder{ color: #777777; }
.search-result .total-search .word input[type="text"]::-webkit-input-placeholder{ color: #777777; }
.search-result .total-search .word input[type="text"]::-ms-input-placeholder{ color: #777777; }
.search-result .total-search .word input[type="text"]:-mos-input-placeholder{ color: #777777; }
.search-result .total-search .word .btn-search {flex: none;}

.search-result .search-cnt {margin-top: 3.5rem; border: 0.1rem solid #DDDDDD; padding: 3rem 0; background: #ffffff; border-radius: 1.5rem;}
.search-result .search-cnt p {text-align: center; font-size: 2.4rem; color: #555555; font-weight: 700;}
.search-result .search-cnt p strong {color: #0A6E23;}

.search-result > .tab-wrap.v2 {margin-top: 3.2rem;}

/* 오프라인 학습 > 수강신청 */
.offline .deco01 {width: 4rem; height: 4rem; background: url('../img/sub/img_offline_deco01.png') no-repeat center/100%;}
.offline .deco02 {width: 4rem; height: 4rem; background: url('../img/sub/img_offline_deco02.png') no-repeat center/100%;}

/* 새싹관장 > 대관신청 > 리스트 */
.square .rent-guide {padding: 3.2rem 3.2rem; background: #ffffff; border-radius: 2rem; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); display: flex; align-items: flex-end; gap: 1.5rem 1.5rem;}
.square .rent-guide .title-area {flex: 1 0}
.square .rent-guide .title-area .title01 {font-size: 2.6rem; font-weight: 700; color: #0A6E23; line-height: 1.193;}
.square .rent-guide .title-area .title02 {font-size: 4rem; font-weight: 700; line-height: 1.5;}
.square .rent-guide .btn-area {display: flex; gap: 0 1.6rem;}
.square .rent-guide .btn-area .btn {flex: none; width: fit-content;}

/* 새싹로그 > 새싹이란? */
.about .intro-visual {padding: 6rem 3rem; background: url('../img/sub/bg_visual_intro.png') no-repeat center; background-size: cover; border-radius: 3rem; overflow: hidden; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1);}
.about .intro-visual p {text-align: center; color: #ffffff; line-height: 1.5;}
.about .intro-visual .headline {font-size: 1.9rem; font-weight: 500;}
.about .intro-visual .headline + .title {margin-top: 0.8rem;}
.about .intro-visual .title {font-size: 4rem; font-weight: 700;}
.about .intro-visual .title + .text {margin-top: 2rem;}
.about .intro-visual .text {font-size: 1.7rem; font-weight: 500;}
.about .pursue-area {margin-top: -3.5rem; padding: 0 4rem;}
.about .pursue-area ul {display: flex; align-items: stretch; gap: 1.6rem 1.6rem;}
.about .pursue-area ul li {display: flex; flex-direction: column; border-radius: 3rem; overflow: hidden; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); flex: 1 0;}
.about .pursue-area ul li .cont-area {padding: 2.4rem 2.4rem; background-color: #ffffff; flex: 1 0;}
.about .pursue-area ul li .cont-area .title {font-size: 2.4rem; font-weight: 700; line-height: 1.5; color: #000000;}
.about .pursue-area ul li .cont-area .title + .text {margin-top: 2rem;}
.about .pursue-area ul li .cont-area .text {font-size: 1.7rem; line-height: 1.5; color: #333333;}
.about .pursue-area ul li .img-area {position: relative; padding-top: 67.493%;}
.about .pursue-area ul li .img-area img {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); object-fit: cover; width: 100%; height: 100%;}
.about .special-area {margin-top: 8rem;}
.about .special-area ul {margin-top: 3rem; display: flex; flex-wrap: wrap; gap: 1.6rem 1.6rem;}
.about .special-area ul li {width: calc(calc(100% - 1.6rem)/2); position: relative; overflow: hidden; background-color: #ffffff; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); border-radius: 3rem; padding: 2.4rem 2.4rem; display: flex; gap: 0 3.2rem; align-items: flex-start;}
.about .special-area ul li .number {width: 14rem; line-height: 15rem; text-align: center; font-size: 10rem; letter-spacing: -0.03em; font-weight: 700; opacity: 0.05; color: #0A6E23; position: absolute; left: -2.6rem; top: -4.4rem;}
.about .special-area ul li .title {font-size: 1.9rem; font-weight: 700; line-height: 1.5;}
.about .special-area ul li .title + .text {margin-top: 1.6rem;}
.about .special-area ul li .text {font-size: 1.7rem; line-height: 1.5;}
.about .special-area ul li img {flex: none; width: 8rem;}

/* 새싹로그 > 교육로드맵 */
.about .roadmap-visual {padding: 6rem 3rem; background: url('../img/sub/bg_visual_roadmap.png') no-repeat center; background-size: cover; border-radius: 3rem; overflow: hidden; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1);}
.about .roadmap-visual p {text-align: center; color: #ffffff; line-height: 1.5;}
.about .roadmap-visual .headline {font-size: 1.9rem; font-weight: 500;}
.about .roadmap-visual .headline + .title {margin-top: 0.8rem;}
.about .roadmap-visual .title {font-size: 4rem; font-weight: 700;}
.about .roadmap-visual .title + .text {margin-top: 2rem;}
.about .roadmap-visual .text {font-size: 1.7rem; font-weight: 500;}
.about .keyword-area {margin-top: 8rem;}
.about .keyword-area > .title {width: 57rem; margin: 0 auto; border: 0.2rem solid #0A6E23; background-color: #E0F0E9; text-align: center; font-weight: 700; font-size: 2.4rem; padding: 2rem 0; color: #0A6E23; border-radius: 7rem; position: relative;}
.about .keyword-area > .title::after {content: ""; width: 0.1rem; height: 2.3rem; background-color: #0A6E23; position: absolute; left: 50%; transform: translate(-50%, 0); top: 100%;}
.about .keyword-area ul {margin-top: 5.2rem; display: flex; gap: 2rem 1.6rem; position: relative;}
.about .keyword-area ul::after {content: ""; width: calc(100% - 35rem); height: 0.1rem; background-color: #0A6E23; position: absolute; left: 50%; transform: translate(-50%, 0); top: -3.2rem;}
.about .keyword-area ul li {width: calc(calc(100% - 3.2rem)/3); position: relative;}
.about .keyword-area ul li::before {content: ""; width: 0.6rem; height: 2.3rem; background: url('../img/sub/img_roadmap_line.png') no-repeat center bottom/100%; position: absolute; left: 50%; top: -0.9rem; transform: translate(-50%, -100%);}
.about .keyword-area ul li .inner {border-radius: 3rem; padding: 2.4rem 2.4rem; display: flex; gap: 0 3.2rem; align-items: flex-start; overflow: hidden; background-color: #ffffff; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); height: 100%; position: relative}
.about .keyword-area ul li .number {width: 14rem; line-height: 15rem; text-align: center; font-size: 10rem; letter-spacing: -0.03em; font-weight: 700; opacity: 0.05; color: #0A6E23; position: absolute; left: -2.6rem; top: -4.4rem;}
.about .keyword-area ul li .text-area {flex: 1 0;}
.about .keyword-area ul li .title {font-size: 1.9rem; font-weight: 700; line-height: 1.5;}
.about .keyword-area ul li .title + .text {margin-top: 1.6rem;}
.about .keyword-area ul li .text {font-size: 1.7rem; line-height: 1.5;}
.about .keyword-area ul li img {flex: none; width: 8rem;}
.about .program-area {margin-top: 8rem;}
.about .program-area ul li {border-radius: 2rem; overflow: hidden; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 3rem 3rem; display: flex; align-items: flex-start; gap: 0.8rem 1.6rem;}
.about .program-area ul li + li {margin-top: 1.6rem;}
.about .program-area ul li .category {flex: none; width: 9.5rem; line-height: 3.5rem; border-radius: 3.5rem; background-color: #E0F0E9; text-align: center; font-size: 1.5rem; font-weight: 700; color: #0A6E23;}
.about .program-area ul li .text-area {flex: 1 0;}
.about .program-area ul li .text-area .title {font-size: 2rem; font-weight: 700; line-height: 1.25; padding: 0.5rem 0;}
.about .program-area ul li .text-area .data-area {margin-top: 1.2rem; display: flex; align-items: flex-start; justify-content: space-between; gap: 0.4rem 0.4rem;}
.about .program-area ul li .text-area .data-area dl {display: flex; align-items: flex-start; justify-content: flex-start; gap: 0 1.8rem;}
.about .program-area ul li .text-area .data-area dl dt {flex: none; font-size: 1.5rem; font-weight: 600; color: #0A6E23;}
.about .program-area ul li .text-area .data-area dl dd {font-size: 1.5rem; font-weight: 600; color: #5A5A5A;}

/* 마이싹 > 학습관리 > 대시보드 */
.my-sac .dash-status {display: grid; grid-template-columns: 28.241% 1fr; grid-template-rows: 1fr 13.5rem; gap: 3rem 3rem;}
.my-sac .dash-status .tile {background-color: #ffffff; border-radius: 3rem; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1);}
.my-sac .dash-status .user-area {grid-column: 1/2; grid-row: 1/3}
.my-sac .dash-status .user-area .tile {height: 100%; padding: 4.5rem 2rem 2.5rem;}
.my-sac .dash-status .user-area .text-rank {color: #0A6E23; font-size: 1.7rem; line-height: 1.177}
.my-sac .dash-status .user-area .name {margin-top: 0.8rem; font-size: 2.6rem; line-height: 1.192; font-weight: 600;}
.my-sac .dash-status .user-area .enter-area {margin-top: 2.4rem; padding: 1.2rem 1.6rem; background-color: #E0F0E9; border-radius: 1rem;}
.my-sac .dash-status .user-area .enter-area .title {font-size: 1.5rem; line-height: 1.8; color: #0A6E23; font-weight: 600;}
.my-sac .dash-status .user-area .enter-area .value {text-align: right; margin-top: 0.4rem; font-size: 2.7rem; font-weight: 600; line-height: 1.185;}
.my-sac .dash-status .user-area .enter-area .value strong {font-weight: 600;}
.my-sac .dash-status .user-area .btn-setting {margin-top: 1.5rem;}
.my-sac .dash-status .offline-area {grid-column: 2/3; grid-row: 1/2}
.my-sac .dash-status .offline-area .tile {padding: 3.2rem 4rem; display: flex; align-items: center;}
.my-sac .dash-status .offline-area .title-area {flex: none;}
.my-sac .dash-status .offline-area .title-area p {font-size: 2.4rem; line-height: 1.25; font-weight: 600;}
.my-sac .dash-status .offline-area .cont-area {flex: 1 0; min-width: 0; display: flex; align-items: stretch;}
.my-sac .dash-status .offline-area .cont-area dl {flex: 1 0; min-width: 0; position: relative}
.my-sac .dash-status .offline-area .cont-area dl + dl::before {content: ""; width: 0.1rem; height: calc(100% - 0.2rem); position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-color: #DDDDDD;}
.my-sac .dash-status .offline-area .cont-area dl dt {text-align: center; font-size: 1.9rem; line-height: 1.211; font-weight: 600; color: #0A6E23;}
.my-sac .dash-status .offline-area .cont-area dl dd {margin-top: 1.5rem; }
.my-sac .dash-status .offline-area .cont-area dl dd a {display: block; width: fit-content; margin: 0 auto; font-size: 4.1rem; line-height: 1.196; text-align: center; font-weight: 900; color: #0A6E23; text-decoration: underline;}
.my-sac .dash-status .blanket-area {grid-column: 2/3; grid-row: 2/3; display: flex; align-items: stretch; gap: 0 2rem}
.my-sac .dash-status .blanket-area .tile {padding: 2.4rem 2.4rem; flex: 1 0; min-width: 0;}
.my-sac .dash-status .blanket-area .title {font-size: 1.9rem; color: #0A6E23; font-weight: 600; line-height: 1.211; height: 3.8rem}
.my-sac .dash-status .blanket-area .value {font-size: 4.1rem; line-height: 1.196; font-weight: 900; text-align: right; display: block; margin-left: auto; width: fit-content; color: #0A6E23; text-decoration: underline;}

.my-sac .dash-offline {margin-top: 4rem;}
.my-sac .dash-offline .list-wrap {margin-top: 2rem;}

.my-sac .dash-rent {margin-top: 4rem;}
.my-sac .dash-rent .list-wrap {margin-top: 2rem;}

.my-sac .dash-help {margin-top: 3.5rem; display: flex; align-items: stretch; gap: 4rem 3rem;}
.my-sac .dash-help .article {flex: 1 0; display: flex; flex-direction: column; min-width: 0;}
.my-sac .dash-help .article .tit-wrap {flex: none;}
.my-sac .dash-help .article .cont-box {flex: 1 0; min-height: 0; border-radius: 2rem; border: 0.1rem solid #DDDDDD; margin-top: 2.5rem; padding: 1.5rem 2rem; display: flex; align-items: center;}
.my-sac .dash-help .article .cont-box .list-wrap {width: 100%;}

/* 강의실 */
.classroom .tab-wrap.v4 {margin-top: 4rem;}

/* 점검 페이지 - 404 error */
.inspect .inner {max-width: 80rem; min-height: 43rem; border-radius: 3rem; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; margin: 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3.6rem 4.5rem}
.inspect .inner > div {width: 100%;}

.inspect .result-area .text-error404 {text-align: center; padding: 1.2rem 0; text-align: center; font-size: 10rem; font-weight: 700; line-height: 1.2;}
.inspect .result-area img {width: 10rem; margin: 0 auto;}
.inspect .result-area .text-result {text-align: center; font-size: 3.2rem; line-height: 1.1875; margin-top: 0.4rem; font-weight: 700; color: #0A6E23}
.inspect .explain-area {margin-top: 1.6rem;}
.inspect .explain-area .text01 {text-align: center; font-size: 2.4rem; line-height: 1.209; font-weight: 700;}
.inspect .notice-area {border: 0.1rem solid #DDDDDD; border-radius: 1.6rem; padding: 2rem 2rem; display: flex; justify-content: center; margin-top: 1.6rem;}
.inspect .notice-area .article {width: fit-content;}
.inspect .notice-area .text01 {font-size: 2.4rem; font-weight: 700; line-height: 1.25; text-align: center;}
.inspect .notice-area .text02 {font-size: 1.9rem; line-height: 1.211; text-align: center; margin-top: 0.8rem;}
.inspect .notice-area .data-area {margin-top: 2rem;}
.inspect .notice-area .data-area ul li {position: relative; padding-left: 1.2rem; line-height: 1.412; font-size: 1.7rem; color: #555555;}
.inspect .notice-area .data-area ul li::before {content: ""; width: 0.4rem; height: 0.4rem; border-radius: 50%; background-color: #1D1D1D; position: absolute; left: 0; top: 1rem;}
.inspect .full-area {min-height: calc(100dvh - 16rem); display: flex; align-items: center; gap: 3rem 10.572%; justify-content: center;}
.inspect .full-area .img-area {flex: none;}
.inspect .full-area .logo {width: 14.1rem; height: 7.4rem; background: url('../img/common/logo.png') no-repeat center / 100%;}
.inspect .full-area .title {color: #0A6E23; font-size: 3.4rem; line-height: 1.412; font-weight: 700; margin-top: 2rem;}
.inspect .full-area .text {font-size: 2rem; line-height: 1.3; font-weight: 600; margin-top: 2rem;}
.inspect .full-area .text-work {color: #0A6E23; font-size: 2rem; line-height: 1.3; font-weight: 700; margin-top: 2rem; letter-spacing: -0.02em;}
.inspect .full-area .text-cs {font-size: 1.8rem; margin-top: 2rem; line-height: 1.5; font-weight: 500;}
.inspect .full-area .text-cs strong {color: #0A6E23;}

/* 회원서비스 > 약관 */
.terms .indent-area {padding-left: 2rem; margin-top: 2rem;}
.terms .text-normal {font-size: 1.7rem; line-height: 1.5; color: #333333; margin-top: 0.8rem;}
.terms .labeling-area {margin-top: 2rem; display: flex; align-items: stretch; flex-wrap: wrap;}
.terms .labeling-area dl {flex: none; width: calc(100%/3); display: flex; flex-direction: column;}
.terms .labeling-area dl dt {flex: none; line-height: 5.6rem; text-align: center; font-size: 1.7rem; background-color: #E0F0E9; font-weight: 600;}
.terms .labeling-area dl dd {flex: 1 0; min-height: 0; padding: 1.5rem 0;}
.terms .labeling-area dl dd img {width: 18.9rem; margin: 0 auto;}
.terms .labeling-area dl dd p {font-size: 1.7rem; line-height: 1.5; margin-top: 1.6rem; text-align: center;}
.terms .index-area {margin-top: 2rem;}
.terms .index-area ul {display: flex; flex-direction: column; flex-wrap: wrap; max-height: 23rem}
.terms .index-area ul li {width: 50%; padding: 0.6rem 2rem; font-size: 1.9rem; line-height: 1.474;}
.terms * + .dot-list.v3 {margin-top: 1.6rem;}
.terms .dot-list.v2 > ul > li > .cont-area > .tit + .dot-list.v4 {margin-top: 1.6rem;}
.terms .dot-list.v3 > ul > li > .cont-area > .tit + .dot-list.v4 {margin-top: 0.4rem;}
.terms .dot-list.v2 > ul > li > .cont-area > .tit + .dot-list.v5 {margin-top: 1.6rem;}
.terms .text-cookie {margin-top: 1.6rem; font-size: 1.9rem; line-height: 1.211;}
.terms .text-cookie + .dot-list.v4 {margin-top: 0.4rem;}
.terms * + .tbl-wrap {margin-top: 1.6rem;}
.terms .tbl-wrap + .dot-list.v2 {margin-top: 1.6rem;}
.terms * + .tit.v4 {margin-top: 3.2rem;}

/*-------------------------------------------------------------------
    @팝업
-------------------------------------------------------------------*/
/* 기술선택 */
.pop-select-technology {max-width: 64rem;}

/* 수강신청안내 */
.pop-guide-apply {max-width: 64rem;}
.pop-guide-apply .guide-area .text {text-align: center; font-size: 2rem; line-height: 1.5; letter-spacing: -0.03em; color: #555555;}
.pop-guide-apply .guide-area .guide-process {display: flex; gap: 3rem 3.2rem; flex-wrap: wrap; max-width: 42rem; margin: 2.4rem auto 0}
.pop-guide-apply .guide-area .guide-process dl {width: calc(calc(100% - 3.2rem)/2); display: flex; align-items: center; height: 6.4rem; border-radius: 0.8rem; padding: 1.6rem 2rem; background-color: #E0F0E9; gap: 0 1rem; position: relative;} 
.pop-guide-apply .guide-area .guide-process dl dt {width: 3.2rem; flex: none; height: 3.2rem; border-radius: 50%; text-align: center; color: #ffffff; background-color: #0A6E23; line-height: 3.2rem; font-size: 1.5rem; font-weight: 700; letter-spacing: -0.03em;}
.pop-guide-apply .guide-area .guide-process dl dd {flex: 1 0; min-width: 0; font-size: 1.8rem; font-weight: 600; letter-spacing: -0.03em;}
.pop-guide-apply .guide-area .guide-process dl:nth-of-type(1) {order: 1; border-top-left-radius: 2rem;}
.pop-guide-apply .guide-area .guide-process dl:nth-of-type(2) {order: 2; border-top-right-radius: 2rem;}
.pop-guide-apply .guide-area .guide-process dl:nth-of-type(3) {order: 4; border-bottom-right-radius: 2rem;}
.pop-guide-apply .guide-area .guide-process dl:nth-of-type(4) {order: 3; border-bottom-left-radius: 2rem;}
.pop-guide-apply .guide-area .guide-process dl + dl::before {content: ""; width: 4rem; height: 4rem; background: url('../img/sub/img_arr_process.png') no-repeat center/100%; position: absolute;}
.pop-guide-apply .guide-area .guide-process dl:nth-of-type(2)::before {left: -3.6rem; top: 50%; transform: translateY(-50%) rotate(-90deg);}
.pop-guide-apply .guide-area .guide-process dl:nth-of-type(3)::before {left: 50%; top: -3.6rem; transform: translateX(-50%);}
.pop-guide-apply .guide-area .guide-process dl:nth-of-type(4)::before {right: -3.6rem; top: 50%; transform: translateY(-50%) rotate(90deg);}
.pop-guide-apply .guide-area .text-careful {margin-top: 2.4rem; text-align: center; font-size: 1.5rem; color: #E32D23; line-height: 1.5; letter-spacing: -0.03em;}

/* 공유하기 */
.pop-share {max-width: 52rem;}
.pop-share .share-area ul {display: flex; align-items: center; justify-content: center; gap: 0 4rem;}
.pop-share .share-area ul li a i {margin: 0 auto;}
.pop-share .share-area ul li a p {text-align: center; font-size: 1.5rem; line-height: 1.5; letter-spacing: -0.03em; margin-top: 0.8rem;}

/* 신청조건 및 방법 안내 */
.pop-guide-rent {max-width: 90rem;}
.pop-guide-rent .guide-area dl {display: flex; align-items: flex-start; gap: 0 1.2rem;}
.pop-guide-rent .guide-area dl + dl {margin-top: 1.6rem;}
.pop-guide-rent .guide-area dl dt {width: 9.6rem; height: 4.5rem; text-align: center; border-radius: 0.8rem; background-color: #E0F0E9;font-size: 1.9rem; line-height: 4.5rem; letter-spacing: -0.07rem; color: #0A6E23; font-weight: 700;}
.pop-guide-rent .guide-area dl dd {flex: 1 0; display: flex; align-items: flex-start; min-height: 4.5rem; min-width: 0; flex-direction: column; justify-content: center;}
.pop-guide-rent .guide-area dl dd p:not(.txt-caution) {font-size: 1.7rem; line-height: 1.5;}
.pop-guide-rent .guide-procedure {margin-top: 2.4rem;}
.pop-guide-rent .guide-procedure > .title {height: 5.6rem; border: 0.1rem solid #DDDDDD; text-align: center; line-height: 5.4rem; font-size: 2.4rem; font-weight: 700; color: #0A6E23; border-radius: 0.8rem;}
.pop-guide-rent .guide-procedure ul {margin-top: 1.6rem; display: flex; gap: 1rem 1rem;}
.pop-guide-rent .guide-procedure ul li {padding: 2rem 0; flex:1 0;}
.pop-guide-rent .guide-procedure ul li .img-area {position: relative; width: 8rem; height: 8rem; display: flex; align-items: center; justify-content: center; border: 0.2rem solid #0A6E23; border-radius: 50%; margin: 0 auto;}
.pop-guide-rent .guide-procedure ul li .img-area .num {position: absolute; width: 3.2rem; height: 3.2rem; border-radius: 50%; background-color: #0A6E23; text-align: center; line-height: 3.2rem; color: #ffffff; font-size: 1.5rem; letter-spacing: -0.03em; font-weight: 700; left: -0.4rem; top: -0.4rem;}
.pop-guide-rent .guide-procedure ul li .img-area img {width: 4.8rem; }
.pop-guide-rent .guide-procedure ul li .title {text-align: center; margin-top: 0.8rem; font-size: 2.2rem; font-weight: 700; line-height: 1.182; color: #0A6E23;}
.pop-guide-rent .guide-procedure ul li .text {margin-top: 0.8rem; text-align: center; font-size: 1.7rem; line-height: 1.177;}

/* 대관신청서 */
.pop-detail-rent {max-width: 140rem;}

/* 새싹 동문회 가입신청 */
.pop-detail-apply {max-width: 140rem;}
.pop-detail-apply .title-area {border: 0.1rem solid #DDDDDD; border-radius: 1.5rem; padding: 3rem 0}
.pop-detail-apply .title-area p {text-align: center; font-weight: 700; font-size: 2.4rem; color: #0A6E23}
.pop-detail-apply .title-area + .greetings-area {margin-top: 3rem;}
.pop-detail-apply .greetings-area {border-radius: 1.5rem; border: 0.1rem solid #DDDDDD; padding: 3rem 3rem;}
.pop-detail-apply .greetings-area p {font-size: 1.9rem; line-height: 1.527; font-weight: 500;}
.pop-detail-apply .greetings-area p a {color: #0A6E23}
.pop-detail-apply .btn-wrap .btn {max-width: 21.5rem; width: 21.5rem !important}

/* 새싹 동문회 가입신청 */
.pop-take-exam {max-width: 140rem;}
.pop-take-exam .title-area {border: 0.1rem solid #DDDDDD; border-radius: 1.5rem; padding: 3rem 0}
.pop-take-exam .title-area p {text-align: center; font-weight: 700; font-size: 2.4rem; color: #0A6E23}

/* 출석부 */
.pop-print-attend {max-width: 140rem;}
.pop-print-attend .attend-data {padding: 3.2rem 3rem; border: 0.1rem solid #DDDDDD; border-radius: 2rem;}
.pop-print-attend .attend-data .data-area {display: flex; align-items: flex-start; gap: 3rem 8rem; flex-wrap: wrap;}
.pop-print-attend .attend-data .data-area dl dt {font-size: 1.7rem; font-weight: 600; color: #0A6E23; line-height: 1.177;}
.pop-print-attend .attend-data .data-area dl dd {font-size: 1.9rem; font-weight: 600; color: #111111; line-height: 1.211; margin-top: 0.6rem;}
.pop-print-attend .attend-data .status-area {margin-top: 1.6rem; }
.pop-print-attend .attend-data .status-area ul {display: flex; gap: 2rem 2rem; flex-wrap: wrap;}
.pop-print-attend .attend-data .status-area ul li {flex: 1 0; height: 6.5rem; border: 0.1rem solid #DDDDDD; border-radius: 2rem; display: flex; align-items: center; justify-content: center;}
.pop-print-attend .attend-data .status-area ul li .inner {display: flex; align-items: center; justify-content: center; gap: 0 9.5rem}
.pop-print-attend .attend-data .status-area ul li .title {font-size: 1.7rem; color: #0A6E23; font-weight: 700;}
.pop-print-attend .attend-data .status-area ul li .value {font-size: 2.6rem; font-weight: 600; color: #111111;}
.pop-print-attend .attend-top {margin-top: 3rem; display: flex; align-items: center; justify-content: flex-start; gap: 0 3.2rem}
.pop-print-attend .attend-top .title {font-size: 1.7rem; font-weight: 600; color: #0A6E23}
.pop-print-attend .attend-top .select {width: 13.5rem;}
.pop-print-attend .attend-area {margin-top: 3rem; padding: 0 2rem;}
.pop-print-attend .attend-area ul {display: flex; flex-wrap: wrap; gap: 3rem 2.5rem; justify-content: flex-start;}
.pop-print-attend .attend-area ul li {width: calc(calc(100% - 12.5rem)/6); border-radius: 3rem; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); padding: 2.4rem 2.5rem 1.8rem;}
.pop-print-attend .attend-area ul li .number {font-size: 1.9rem; font-weight: 600; line-height: 1.211; text-align: center;}
.pop-print-attend .attend-area ul li .state {margin-top: 1.4rem; font-size: 2.5rem; font-weight: 700; line-height: 1.2; text-align: center; border-radius: 1rem; background-color: #F3F3F3; padding: 2rem 0;}
.pop-print-attend .attend-area ul li.on .state {background-color: #E0F0E9; color: #0A6E23;}
.pop-print-attend .attend-area ul li .day {font-size: 1.9rem; font-weight: 600; margin-top: 1.2rem; text-align: center; color: #5A5A5A;}
.pop-print-attend .attend-issue {margin-top: 6.5rem;}
.pop-print-attend .attend-issue dl {display: flex; align-items: center; justify-content: center; gap: 0 2.5rem;}
.pop-print-attend .attend-issue dl dt {font-size: 1.7rem; font-weight: 600; color: #0A6E23; line-height: 1.177;}
.pop-print-attend .attend-issue .sign {position: relative; margin: 1.6rem auto 0; width: fit-content;}
.pop-print-attend .attend-issue .sign::after {content: ""; width: 7.2rem; height: 7.2rem; position: absolute; top: 50%; right: -0.8rem; transform: translate(100%, -50%); background: url('../img/sub/img_sign.png') no-repeat center/100%;}
.pop-print-attend .attend-issue .sign p {text-align: center; font-size: 2.6rem; font-weight: 600; line-height: 1.193;}

/* 출석부 */
.pop-print-certificate {max-width: 140rem;}
.pop-print-certificate .certificate-area {max-width: 78rem; box-sizing: border-box; background: url('../img/sub/bg_complete.png') no-repeat center top/100% !important; font-family: 'SeoulNamsan'; margin: 0 auto; padding: 10rem 0 10.9rem;}
.pop-print-certificate .certificate-area .number {font-size: 1.6rem; text-align: right; padding: 0 10rem;}
.pop-print-certificate .certificate-area .title {font-size: 5.2rem; letter-spacing: 0.65em; text-align: center; padding-top: 14.5rem; background: url('../img/sub/img_complete_logo.png') no-repeat center top/11.5rem; margin-top: 1.2rem; font-weight: 900; text-indent: 0.65em;}
.pop-print-certificate .certificate-area .user-data {padding: 0 13rem; margin-top: 9rem; min-height: 27.8rem; width: 83rem;}
.pop-print-certificate .certificate-area .user-data p {font-size: 2.2rem; line-height: 1.8; display: flex; justify-content: flex-start; gap: 0 1rem;}
.pop-print-certificate .certificate-area .user-data p span {display: block; font-size: 2.2rem; line-height: 1.8;}
.pop-print-certificate .certificate-area .user-data p span:nth-child(1) {width: 7.9rem; text-align: justify; text-align-last: justify;}
.pop-print-certificate .certificate-area .text {font-size: 2.7rem; line-height: 1.5; text-align: center; font-weight: 500; margin-top: 2rem;}
.pop-print-certificate .certificate-area .date {font-size: 2rem; line-height: 1.2; text-align: center; margin-top: 7.5rem;}
.pop-print-certificate .certificate-area .sign {width: fit-content; margin: 0 auto; position: relative; margin-top: 5rem;}
.pop-print-certificate .certificate-area .sign p {position: relative; z-index: 1; text-align: center; font-size: 3.2rem; font-weight: 600;}
.pop-print-certificate .certificate-area .sign::after {content: ""; position: absolute; top: 50%; transform: translateY(-50%); width: 10rem; height: 10rem; background: url('../img/sub/img_sign.png') no-repeat center/100%; right: -7rem}

/* 캠퍼스 오시는 길 설명 지도 */
.pop-guide-map01 {max-width: 90rem;}
.pop-guide-map01 img {width: 100%;}

.pop-guide-map02 {max-width: 90rem;}
.pop-guide-map02 img {width: 100%;}

.pop-guide-map03 {max-width: 90rem;}
.pop-guide-map03 img {width: 100%;}

/* 설문조사 */
.pop-take-survey {max-width: 70rem;}
.pop-take-survey .title-area {border: 0.1rem solid #DDDDDD; border-radius: 1.5rem; padding: 3rem 0}
.pop-take-survey .title-area p {text-align: center; font-weight: 700; font-size: 2.4rem; color: #0A6E23}

/* 출석부 */
.print-attend .attend-data {padding: 3.2rem 3rem; border: 0.1rem solid #DDDDDD; border-radius: 2rem;}
.print-attend .attend-data .data-area {display: flex !important; align-items: flex-start; gap: 3rem 8rem; flex-wrap: wrap;}
.print-attend .attend-data .data-area dl dt {font-size: 1.7rem; font-weight: 600; color: #0A6E23; line-height: 1.177;}
.print-attend .attend-data .data-area dl dd {font-size: 1.9rem; font-weight: 600; color: #111111; line-height: 1.211; margin-top: 0.6rem;}
.print-attend .attend-data .status-area {margin-top: 1.6rem; }
.print-attend .attend-data .status-area ul {display: flex !important; gap: 2rem 2rem; flex-wrap: wrap;}
.print-attend .attend-data .status-area ul li {flex: 1 0; height: 6.5rem; border: 0.1rem solid #DDDDDD; border-radius: 2rem; display: flex !important; align-items: center; justify-content: center;}
.print-attend .attend-data .status-area ul li .inner {display: flex !important; align-items: center; justify-content: center; gap: 0 9.5rem}
.print-attend .attend-data .status-area ul li .title {font-size: 1.7rem; color: #0A6E23; font-weight: 700;}
.print-attend .attend-data .status-area ul li .value {font-size: 2.6rem; font-weight: 600; color: #111111;}
.print-attend .attend-top {margin-top: 3rem; display: flex !important; align-items: center; justify-content: flex-start; gap: 0 1.6rem}
.print-attend .attend-top .title {font-size: 1.7rem; font-weight: 600; color: #0A6E23; flex: none;}
.print-attend .attend-top .select {background: none; box-shadow: none;}
.print-attend .attend-area {margin-top: 3rem; padding: 0 2rem;}
.print-attend .attend-area ul {display: flex !important; flex-wrap: wrap; gap: 3rem 2.5rem; justify-content: flex-start;}
.print-attend .attend-area ul li {width: calc(calc(100% - 10rem)/5); border-radius: 3rem; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); padding: 2.4rem 2.5rem 1.8rem;}
.print-attend .attend-area ul li .number {font-size: 1.9rem; font-weight: 600; line-height: 1.211; text-align: center;}
.print-attend .attend-area ul li .state {margin-top: 1.4rem; font-size: 2.5rem; font-weight: 700; line-height: 1.2; text-align: center; border-radius: 1rem; background-color: #F3F3F3; padding: 2rem 0;}
.print-attend .attend-area ul li.on .state {background-color: #E0F0E9; color: #0A6E23;}
.print-attend .attend-area ul li .day {font-size: 1.9rem; font-weight: 600; margin-top: 1.2rem; text-align: center; color: #5A5A5A;}
.print-attend .attend-issue {margin-top: 6.5rem;}
.print-attend .attend-issue dl {display: flex !important; align-items: center; justify-content: center; gap: 0 2.5rem;}
.print-attend .attend-issue dl dt {font-size: 1.7rem; font-weight: 600; color: #0A6E23; line-height: 1.177;}
.print-attend .attend-issue .sign {position: relative; margin: 1.6rem auto 0; width: fit-content;}
.print-attend .attend-issue .sign::after {content: ""; width: 7.2rem; height: 7.2rem; position: absolute; top: 50%; right: -0.8rem; transform: translate(100%, -50%); background: url('../img/sub/img_sign.png') no-repeat center/100%;}
.print-attend .attend-issue .sign p {text-align: center; font-size: 2.6rem; font-weight: 600; line-height: 1.193;}

/* 수료증, 수강확인증 */
.print-certificate {box-sizing: border-box; background: url('../img/sub/bg_complete.png') no-repeat center top/100% !important; font-family: 'SeoulNamsan';}
.print-certificate .number {font-size: 2.1rem; text-align: right;}
.print-certificate .title {font-size: 8rem; letter-spacing: 0.5em; text-align: center; padding-top: 20rem; background: url('../img/sub/img_complete_logo.png') no-repeat center top/15rem; margin-top: 1rem; font-weight: 900; text-indent: 0.5em;}
.print-certificate .user-data {padding: 0 8rem; margin-top: 13rem; min-height: 39.8rem;}
.print-certificate .user-data p {font-size: 3.2rem; line-height: 1.8; overflow: hidden;}
.print-certificate .user-data p span {display: block; font-size: 3.2rem; line-height: 1.8; float: left;}
.print-certificate .user-data p span + span {margin-left: 1rem;}
.print-certificate .user-data p span:nth-child(1) {width: 11.2rem; text-align: justify; text-align-last: justify;}
.print-certificate .user-data p span:last-of-type {width: calc(100% - 14.6rem);}
.print-certificate .user-data p:last-of-type span:last-of-type {height: 17.1rem;}
.print-certificate .text {font-size: 4rem; line-height: 1.5; text-align: center; font-weight: 500; margin-top: 6rem;}
.print-certificate .date {font-size: 3rem; line-height: 1.2; text-align: center; margin-top: 10rem;}
.print-certificate .sign {width: fit-content; margin: 0 auto; position: relative; margin-top: 7rem;}
.print-certificate .sign p {position: relative; z-index: 1; text-align: center; font-size: 4.2rem; font-weight: 600;}
.print-certificate .sign::after {content: ""; position: absolute; top: 50%; transform: translateY(-50%); width: 17rem; height: 17rem; background: url('../img/sub/img_sign.png') no-repeat center/100%; right: -13.5rem}

@media print {
    /* 수료증 */
    .print-certificate {padding: 13.5rem 10.5rem;}
}

@media screen and (min-width: 1130px) {
    .box-wrap .direction-info .map-guide ul li:hover .cover,
    .box-wrap .direction-info .map-guide ul li:focus .cover {opacity: 1;}
}
/* 작은 PC */
@media screen and (max-width: 1449px) {
    /*-------------------------------------------------------------------
        @메뉴명
    -------------------------------------------------------------------*/
    /* 새싹로그 > 교육로드맵 */
    .about .keyword-area ul {gap: 2rem 0.8rem;}
    .about .keyword-area ul::after {width: 67.26%;}
    .about .keyword-area ul li {gap: 0 1.6rem; width: calc(calc(100% - 1.6rem)/3)}
    .about .keyword-area ul li img {width: 7rem;}

    /* 상세보기 */
    .box-wrap .lecture-data {right: 0}
    .box-wrap .lecture-data.scroll {left: auto; top: 14.5rem; bottom: auto; transform: translateX(0); right: 2.5rem}

    /* 점검 페이지 - 404 error */
    .inspect .full-area {gap: 3rem 10rem;}
    .inspect .full-area .img-area {width: 47rem;}

    /*-------------------------------------------------------------------
        @팝업
    -------------------------------------------------------------------*/
    /* 출석부 */
    .pop-print-attend .attend-area ul li {width: calc(calc(100% - 7.5rem)/4);}
}

/* 태블릿1 */
@media screen and (max-width: 1129px) {
    /*-------------------------------------------------------------------
        @공통
    -------------------------------------------------------------------*/
    .sub .lnb {display: none;}

    .sub .layout .location .tit-area .tit-depth::after {content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 3rem; height: 3rem; background: url('../img/icon/ic_arr_depth.png') no-repeat center/100%; box-shadow: 0 0 2rem 0 rgba(0, 0, 0, 0.1); border-radius: 50%;}
    .sub .layout .location .tit-area .tit-depth p {display: none;}
    .sub .layout .location .tit-area .tit-depth select {display: block; padding-right: 4.6rem;}
    .sub .layout .location .tit-area .tit-depth .depth-dropdown {display: block;}

    /* 상세보기 */
    .box-wrap > .inner {width: 100%; max-width: 100%;}

    .box-wrap .lecture-data {position: static; width: 100%; margin-top: 4.5rem;}

    .box-wrap .scroll-controller .floating {max-width: 100%; width: 100%;}
    .box-wrap .scroll-controller.scroll .floating {width: calc(100% - 5rem);}

    .box-wrap .learn .view-area {width: 50.5rem; flex: none;}

    .box-wrap .headline .procedure-area {flex-direction: column;}
    .box-wrap .headline .procedure-area .progress-area {flex: none; width: 100%;}
    .box-wrap .headline .procedure-area .progress-area dl {max-width: none;}
    .box-wrap .headline .procedure-area .state-area {width: 100%;}
    
    /*-------------------------------------------------------------------
        @메뉴명
    -------------------------------------------------------------------*/    
    /* 로그인 */
    .login .login-form {padding: 4.5rem 4.5rem 3rem;}
    
    /* 새싹로그 > 교육로드맵 */
    .about .keyword-area ul {gap: 2rem 1.6rem;}
    .about .keyword-area ul::after {width: 67.6%;}
    .about .keyword-area ul li {gap: 0 3.2rem; width: calc(calc(100% - 3.2rem)/3)}
    .about .keyword-area ul li img {width: 8rem;}

    /* 점검 페이지 - 404 error */
    .inspect .full-area {flex-direction: column;}
    .inspect .full-area .cont-area {width: 100%;}
}

/* 태블릿2 */
@media screen and (max-width: 959px) {
    /* box 레이아웃 */
    .box-wrap .headline .assist-area .btn-exit {display: block;}
    .box-wrap .headline .title-area .btn-exit {display: none;}

    .box-wrap .rent-info {flex-direction: column;}
    .box-wrap .rent-info .rent-intro {width: 100%;}
    .box-wrap .rent-info .rent-reserve {width: 100%;}

    .box-wrap .rent-data .data-area ul li {width: calc(calc(100% - 1.6rem)/2); flex: none;}

    .box-wrap .direction-info .map-guide ul li {width: calc(calc(100% - 1.6rem)/2); flex: none; padding-top: 35.793%;}

    .box-wrap .learn {flex-direction: column;}
    .box-wrap .learn .view-area {width: 100%;}
    .box-wrap .learn .learn-data {flex: none; width: 100%;}

    .box-wrap .headline .procedure-area .progress-area dl {padding: 1.2rem 1.8rem;}
    .box-wrap .headline .procedure-area .progress-area dl dd {font-size: 2.4rem;}

    .box-wrap .branch-wrap {flex-direction: column;}
    .box-wrap .branch-wrap .map-area {margin: 0 auto; width: 46.5rem; padding-top: 0; height: 40rem;}

    .box-wrap .branch-wrap .info-area {width: 100%;}
    
    .agree-area .agree-cont .agree-table dl {width: 100%; flex: none;}
    .agree-area .agree-cont .agree-table dl + dl {border-left: 0; border-top: 0.1rem solid #DDDDDD;}

    /* 새싹관장 > 대관신청 > 리스트 */
    .square .rent-guide {flex-direction: column; align-items: flex-start;}
    .square .rent-guide .title-area {flex: 1 0}
    .square .rent-guide .title-area .title01 {font-size: 2.6rem; font-weight: 700; color: #0A6E23; line-height: 1.193;}
    .square .rent-guide .title-area .title02 {font-size: 4rem; font-weight: 700; line-height: 1.5;}
    .square .rent-guide .btn-area {width: 100%;}
    .square .rent-guide .btn-area .btn {flex: 1 0;}

    /* 새싹로그 > 새싹이란? */
    .about .intro-visual .text br {display: none}
    .about .pursue-area {padding: 0; margin-top: 4rem; }
    .about .pursue-area ul {flex-direction: column;}
    .about .pursue-area ul li {flex: none; width: 100%;}
    .about .pursue-area ul li .cont-area .title br {display: none;}
    .about .pursue-area ul li .img-area {padding-top: 36.95%;;}
    .about .special-area {margin-top: 4rem;}
    .about .special-area ul li {width: 100%;}
    
    /* 새싹로그 > 교육로드맵 */
    .about .roadmap-visual .text br {display: none}
    .about .keyword-area > .title::after {display: none;}
    .about .keyword-area ul {flex-direction: column; padding: 0 3.2rem; margin-top: 4.8rem;}
    .about .keyword-area ul::after {display: none;}
    .about .keyword-area ul li {width: 100%; flex: none;}
    .about .keyword-area ul li::before {width: 1.2rem; height: 1.8rem; top: -0.2rem;}
    .about .keyword-area ul li:nth-of-type(1)::before {height: 4.8rem;}
    .about .program-area ul li {flex-direction: column;}
    .about .program-area ul li .text-area {flex: none; width: 100%;}
    .about .program-area ul li .text-area .title {padding: 0 0;}
    .about .program-area ul li .text-area .data-area {flex-direction: column; margin-top: 1.5rem;}

    /* 마이싹 > 학습관리 > 대시보드 */
    .my-sac .dash-status {grid-template-columns: none; grid-template-rows: auto auto;}
    .my-sac .dash-status .user-area {grid-column: initial; grid-row: 1 / 2;}
    .my-sac .dash-status .user-area .tile {display: grid; grid-template-columns: auto 1fr 23.5rem; gap: 2rem 2rem; align-items: center;}
    .my-sac .dash-status .user-area .text-rank {grid-column: 1/2; grid-row: 1/2; margin-top: 1.1rem;}
    .my-sac .dash-status .user-area .name {grid-column: 2/3; grid-row: 1/2; margin-top: 0;}
    .my-sac .dash-status .user-area .btn-setting {grid-column: 3/4; grid-row: 1/2; margin-top: 0;}
    .my-sac .dash-status .user-area .enter-area {grid-column: 1/4; grid-row: 2/3; margin-top: 0;}
    .my-sac .dash-status .offline-area {grid-column: initial; grid-row: 2 / 3;}
    .my-sac .dash-status .offline-area .tile {flex-direction: column; justify-content: flex-start; gap: 2rem 0; align-items: flex-start;}
    .my-sac .dash-status .offline-area .cont-area {width: 100%;}
    .my-sac .dash-status .blanket-area {grid-column: initial; grid-row: 3 / 4;}    
    .my-sac .dash-status .blanket-area .tile {padding: 2.4rem 1.2rem;}
    .my-sac .dash-status .blanket-area .title {text-align: center;}
    .my-sac .dash-status .blanket-area .value {margin: 0 auto;}
    
    .my-sac .dash-help {flex-direction: column;}
    .my-sac .dash-help .article .cont-box {min-height: 24rem;}

    /* 회원서비스 > 약관 */
    .terms .index-area ul {max-height: none;}
    .terms .index-area ul li {width: 100%;}

    /*-------------------------------------------------------------------
        @팝업
    -------------------------------------------------------------------*/
    /* 출석부 */
    .pop-print-attend .attend-data .data-area dl {width: 100%;}
    .pop-print-attend .attend-data .status-area ul li {width: 100%; flex: none;}
    .pop-print-attend .attend-data .status-area ul li .inner {width: 23.5rem; justify-content: space-between;}
    .pop-print-attend .attend-area ul li {width: calc(calc(100% - 2.5rem)/2);}
    
    /* 출석부 */
    .pop-print-certificate .certificate-area {max-width: 53rem; padding: 6.7rem 0 11.1rem;}
    .pop-print-certificate .certificate-area .number {font-size: 1.2rem; padding: 0 6.8rem;}
    .pop-print-certificate .certificate-area .title {font-size: 3.6rem; padding-top: 11.5rem; background: url('../img/sub/img_complete_logo.png') no-repeat center top/8rem; margin-top: 1rem;}
    .pop-print-certificate .certificate-area .user-data {padding: 0 9.5rem; margin-top: 2.4rem; min-height: 15.7rem;}
    .pop-print-certificate .certificate-area .user-data p {font-size: 1.4rem; line-height: 1.6; gap: 0 0.7rem;}
    .pop-print-certificate .certificate-area .user-data p span {font-size: 1.4rem; line-height: 1.6;}
    .pop-print-certificate .certificate-area .user-data p span:nth-child(1) {width: 4.9rem;}
    .pop-print-certificate .certificate-area .text {font-size: 2rem;}
    .pop-print-certificate .certificate-area .date {font-size: 1.5rem; margin-top: 7rem;}
    .pop-print-certificate .certificate-area .sign {margin-top: 1.8rem;}
    .pop-print-certificate .certificate-area .sign p {font-size: 2.6rem;}
    .pop-print-certificate .certificate-area .sign::after {width: 6.5rem; height: 6.5rem; right: -3.5rem}
}

@media screen and (max-width: 639px) {
    .sub .layout .contents {padding-top: 3rem; padding-bottom: 3.5rem;}

    /* box 레이아웃 */
    .box-wrap .map-area.big {height: 22rem;}

    .box-wrap .scroll-controller ul li {flex: 1 0;}

    /* 약관동의 */
    .agree-area .agree-cont {max-height: 36rem;}

    /*-------------------------------------------------------------------
        @메뉴명
    -------------------------------------------------------------------*/
    /* 점검 페이지 - 404 error */
    .inspect .inner {min-height: 37.5rem;}

    .inspect .result-area .text-error404 {padding: 0 0; font-size: 8rem; line-height: 1.1875;}
    .inspect .result-area img {width: 8rem;}
    .inspect .result-area .text-result {font-size: 2.2rem; line-height: 1.182;}
    .inspect .explain-area .text01 {font-size: 2.2rem; line-height: 1.182;}
    .inspect .notice-area .text01 {font-size: 2.2rem; line-height: 1.182;}
    .inspect .notice-area .data-area {margin-top: 1.8rem;}
    .inspect .notice-area .data-area ul li {line-height: 1.706;}

    /*-------------------------------------------------------------------
        @팝업
    -------------------------------------------------------------------*/
    /* 수강신청안내 */
    .pop-guide-apply {max-width: 64rem;}
    .pop-guide-apply .guide-area .guide-process {gap: 3.2rem; margin: 2.4rem auto 0; flex-direction: column;}
    .pop-guide-apply .guide-area .guide-process dl {width: 100%; border-radius: 2rem; justify-content: center;} 
    .pop-guide-apply .guide-area .guide-process dl dt {width: 3.2rem; flex: none; height: 3.2rem; border-radius: 50%; text-align: center; color: #ffffff; background-color: #0A6E23; line-height: 3.2rem; font-size: 1.5rem; font-weight: 700; letter-spacing: -0.03em;}
    .pop-guide-apply .guide-area .guide-process dl dd {flex: none; font-size: 1.8rem; font-weight: 600; letter-spacing: -0.03em; width: 11rem;}
    .pop-guide-apply .guide-area .guide-process dl:nth-of-type(3) {order: 3;}
    .pop-guide-apply .guide-area .guide-process dl:nth-of-type(4) {order: 4;}
    .pop-guide-apply .guide-area .guide-process dl + dl::before {content: ""; width: 4rem; height: 4rem; background: url('../img/sub/img_arr_process.png') no-repeat center/100%; position: absolute;}
    .pop-guide-apply .guide-area .guide-process dl:nth-of-type(2)::before {left: 50%; top: -3.6rem; transform: translateX(-50%);}
    .pop-guide-apply .guide-area .guide-process dl:nth-of-type(3)::before {left: 50%; top: -3.6rem; transform: translateX(-50%);}
    .pop-guide-apply .guide-area .guide-process dl:nth-of-type(4)::before {left: 50%; top: -3.6rem; transform: translateX(-50%);}

    /* 공유하기 */
    .pop-share {max-width: 64rem;}

    /* 신청조건 및 방법 안내 */
    .pop-guide-apply {max-width: 64rem;}
    .pop-guide-rent .guide-procedure ul {flex-direction: column;}
    .pop-guide-rent .guide-procedure ul li {padding: 2rem 0; flex:1 0;}
    .pop-guide-rent .guide-procedure ul li .img-area {position: relative; width: 8rem; height: 8rem; display: flex; align-items: center; justify-content: center; border: 0.2rem solid #0A6E23; border-radius: 50%; margin: 0 auto;}
    .pop-guide-rent .guide-procedure ul li .img-area .num {position: absolute; width: 3.2rem; height: 3.2rem; border-radius: 50%; background-color: #0A6E23; text-align: center; line-height: 3.2rem; color: #ffffff; font-size: 1.5rem; letter-spacing: -0.03em; font-weight: 700; left: -0.4rem; top: -0.4rem;}
    .pop-guide-rent .guide-procedure ul li .img-area img {width: 4.8rem; }
    .pop-guide-rent .guide-procedure ul li .title {text-align: center; margin-top: 0.8rem; font-size: 2.2rem; font-weight: 700; line-height: 1.182; color: #0A6E23;}
    .pop-guide-rent .guide-procedure ul li .text {margin-top: 0.8rem; text-align: center; font-size: 1.7rem; line-height: 1.177;}

    /* 캠퍼스 오시는 길 설명 지도 */
    .pop-guide-map01 {max-width: 40rem;}
    
    .pop-guide-map02 {max-width: 40rem;}
    
    .pop-guide-map03 {max-width: 40rem;}

    /* 대관신청서 */
    .pop-detail-rent {max-width: 59.5rem;}

    /* 설문조사 */
    .pop-take-survey {max-width: 59rem;}

    /* 회원서비스 > 약관 */
    .terms .labeling-area dl {width: calc(100% / 2);}
}