#sub{
    font-family: var(--Pretendard);
}
#sub section{
    padding:100px 0;
}
.sub-header{
    height: 425px;
    position: relative;
    text-align: center;
    color: var(--white);
    padding:0 !important;
    box-sizing: border-box;
}
.sub-header .inner-md{
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.sub-header .bg{
    position: absolute;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.sub-header h2{
    font-weight: 700;
    font-size: 3.75rem;
    line-height: 1.3em;
}
.sub-header p{
    margin-top: 1.25rem;
    font-size: 1.5rem;
    line-height: 1.3em;
    font-weight: 500;
}

.favorit-icon-wrapper{
	position: relative;
	width: 36px;
    height: 36px;
    background-color: var(--highlight-color-quinary);
    border: 0;
    cursor: pointer;
    text-indent: -9999px;
    overflow: hidden;
    border-radius: 100%;
    margin: 0;
}

.favorit-icon-wrapper .btn{
	position: absolute;
	left: 10px;
	top: 10px;
}

#sub .sec-header{
    text-align: center;
    margin-bottom: 80px;
}
#sub .sec-header h3{
    display: block;
    font-size: 2.25rem;
    line-height: 1.19em;
    font-weight: 700;
}
#sub .sec-header p{
    margin-top: 1.11em;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 500;
}
#sub .page-title{
    margin-bottom: 60px;
    margin-top: 100px;
    position: relative;
}
#sub .page-title h3{
    display: block;
    font-weight: 700;
    line-height: 1.33em;
    font-size: 3.375rem;
}
#sub .page-title .btn-link{
    position: absolute;
    right:0;
    top:50%;
    transform: translate(0,-50%);
    gap:5px;
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 500;
}
#sub .page-title .btn-link i{
    width: 15px;
    height: 15px;
}
#sub .underline{
    display: inline-block;
    position: relative;
}
#sub .underline span{
    position: relative;
    z-index: 2;
}
#sub .underline::after{
    content:'';
    position: absolute;
    z-index: 1;
    background-color: var(--underline-bg2);
    height: 15px;
    left:0;
    right:0;
    bottom:0;
    transform: translate(0,-5px);
}
#sub .underline.sm::after,
#sub .professor-detail  .underline::after,
#sub .professor-item  .underline::after{
	height: 7px;
}

#step-header{
    position: relative;
    margin-top: 100px;
}
#step-header h3{
    display: block;
    font-size: 2.25rem;
    line-height: 1.19em;
    font-weight: 700;
}
#step-header>p{
    font-weight: 500;
    font-size: 1.125rem;
    line-height: 1.5em;
    margin-top: 1.1em;
}
#step-header .step-box{
    position: absolute;
    right:0;
    top:0;
    transform: translate(0,9.5px);
}
#step-header .step-box ul{
    display: flex;
}
#step-header .step-box ul li{
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5em;
    display: flex;
    align-items: center;
    gap:5px;
    color: var(--gray-dark);
}
#step-header .step-box ul li+li{
    margin-left: 17px;
    padding-left: 17px;
    position: relative;
}
#step-header .step-box ul li+li::before{
    content:'';
    position: absolute;
    left:0%;
    top:50%;
    width: 14px;
    height: 14px;
    background: url(../svg/ico_arrow_right.svg) center center / cover no-repeat;
    transform: translate(-50%,-50%);
}
#step-header .step-box ul li .num{
    width: 20px;
    line-height: 20px;
    border-radius: 100%;
    text-align: center;
    background-color: var(--gray-dark);
    color: var(--white);
    font-size: 0.875rem;
    font-weight: 500;
}
#step-header .step-box ul li.cur{
    color: var(--primary-color);
}
#step-header .step-box ul li.cur .num{
    background-color: var(--primary-color);
}

/* sub_01 */
.about-suho-wrap .suho-service{
    position: relative;
    overflow: hidden;
    padding-top: 0 !important;
}
.about-suho-wrap .suho-service .inner-md{
    z-index: 2;
}
.about-suho-wrap .suho-service .bg{
    font-size: 7.5rem;
    font-weight: 700;
    line-height: 1.2em;
    color: var(--black);
    opacity: 0.05;
    position: absolute;
    z-index: 0;
    white-space: nowrap;
}
@keyframes marquee1 {
    0% {
      transform: translateX(-100%);
    }
    100% {
      transform: translateX(100vw);
    }
  }

  @keyframes marquee2 {
    0% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(-100vw);
    }
  }
.about-suho-wrap .suho-service .bg-1{
    top:45%;
    left:0;
    transform: translate(-15%,0);
    animation: marquee1 60s linear infinite;
}
.about-suho-wrap .suho-service .bg-2{
    right:0;
    top:0;
    transform: translate(15%,0);
    animation: marquee2 60s linear infinite;
}
.about-suho-wrap .suho-service .about-suho>span{
    display: block;
    color:var(--primary-color);
    font-size: 1rem;
    line-height: 1.1875em;
    font-weight: 700;
}
.about-suho-wrap .suho-service .about-suho>h4{
    display: block;
    font-weight: 700;
    font-size: 2.25rem;
    line-height: 1.19em;
    margin-top: 0.27em;
}
.about-suho-wrap .suho-service .about-suho .banner::after{
    content:'';
    background: #00000080;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
}
.about-suho-wrap .suho-service .about-suho .banner{
    margin-top: 40px;
    height: 500px;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    padding:3.78%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    background: url(../images/about_suho_bg.webp) center center / cover no-repeat;
}
.about-suho-wrap .suho-service .about-suho .banner strong{
    color: var(--white);
    font-weight: 700;
    font-size: 2.875rem;
    line-height: 1.21em;
    position: relative;
    z-index: 2;
}
.about-suho-wrap .suho-service .about-suho>p{
    font-weight: 500;
    font-size: 1.125rem;
    line-height: 1.5em;
    margin-top: 1.66em;
}
.about-suho-wrap .suho-service .major-list{
    display: flex;
    justify-content: space-between;
    gap:6%;
    margin-top: 100px;
}
.about-suho-wrap .suho-service .major-item{
    width: 100%;
}
.about-suho-wrap .suho-service .major-item .img img{
    display: block;
}
.about-suho-wrap .suho-service .major-item .title{
    display: block;
    font-weight: 800;
    line-height: 1.2em;
    font-size: 1.875rem;
    margin-top: 0.66em;
}
.about-suho-wrap .suho-service .major-item p{
    font-size: 1.125rem;
    line-height: 1.5em;
    margin-top: 1.1em;
}
.about-suho-wrap .suho-service .major-item .tag{
    display: flex;
    flex-wrap: wrap;
    margin-top: 20px;
    gap:10px;
}
.about-suho-wrap .suho-service .major-item .tag li{
    background: var(--highlight-color-quaternary);
    padding: 10px 15px;
    font-size: 1rem;
    font-weight: 500;
    border-radius: 5px;
    font-size: 1rem;
    line-height: 1.5em;
    color:var(--primary-color)
}
.about-suho-wrap .main-feature{
    background-color: #F2F3F8;
}
.about-suho-wrap .main-feature .feature{
    display: flex;
    align-items: stretch;
    gap:20px;
}
.about-suho-wrap .main-feature .feature-list{
    display: flex;
    flex-wrap: wrap;
    gap:20px;
    width: calc((100% - 20px) / 2);
}
.about-suho-wrap .main-feature .feature-item{
    width: calc((100% - 20px) / 2);
    background: var(--white);
    border-radius: 20px;
    box-sizing: border-box;
    padding:9.2% 4.6%;
    aspect-ratio: 1 / 1;
}
.about-suho-wrap .main-feature .feature-item strong{
    display: block;
    font-weight: 800;
    font-size: 1.5rem;
    line-height: 1.5em;
}
.about-suho-wrap .main-feature .feature-item .dot{
    margin:20px 0;
    width: 10px;
    height: 10px;
    background-color: var(--primary-color);
}
.about-suho-wrap .main-feature .feature-item p{
    font-size: 1rem;
    line-height: 1.5em;
}
.about-suho-wrap .main-feature .feature-current{
    background-color: var(--white);
    border-radius: 20px;
    width: calc((100% - 20px) / 2);
}
.about-suho-wrap .main-feature .feature-current .thumb{
    overflow: hidden;
}
.about-suho-wrap .main-feature .feature-current .thumb img{
    display: block;
    width: 100%;
    transition: transform 0.4s var(--transition-easing);
}
.about-suho-wrap .main-feature .feature-current:hover .thumb img{
    transform: scale(1.04);
}
.about-suho-wrap .main-feature .feature-current .info{
    padding:4.6% 6.1%;
    box-sizing: border-box;
}
.about-suho-wrap .main-feature .feature-current .info strong{
    display: block;
    font-weight: 800;
    font-size: 1.875rem;
    line-height: 1.2em;
}
.about-suho-wrap .main-feature .feature-current .info p{
    font-size: 1.125rem;
    line-height: 1.5em;
    margin-top: 1.1em;
}
.about-suho-wrap .main-feature .feature-current .info .btn{
    width: 103px;
    height: 41px;
    background-color: var(--primary-color);
    color: var(--white);
    margin-top: 50px;
    border-radius: 20.5px;
    gap:2px;
}
.about-suho-wrap .service-note{
    position: relative;
    padding-bottom: 150px;
    overflow: hidden;
}
.about-suho-wrap .service-note .circle{
    position: absolute;
    z-index: 1;
}
.about-suho-wrap .service-note .circle.cir-1{
    width: 169px;
    height: 169px;
    border-radius: 100%;
    box-sizing: border-box;
    border:50px solid var(--underline-bg2) ;
    left:50%;
    top:271px;
    margin-left: -660px;
    transform: translate(-50.8%,0);
    background-color: var(--white);
}
.about-suho-wrap .service-note .circle.cir-2{
    right:0;
    bottom:317px;
    transform: translate(50%,0);
}
.about-suho-wrap .service-note .circle.cir-2::before{
    content:'';
    display: block;
    width: 240px;
    height: 240px;
    border-radius: 100%;
    box-sizing: border-box;
    border:50px solid var(--primary-color);
    background-color: var(--white);
}
.about-suho-wrap .service-note .circle.cir-2::after{
    content:'';
    position: absolute;
    left:0;
    bottom:0;
    width: 90px;
    height: 90px;
    border-radius: 100%;
    box-sizing: border-box;
    border:30px solid var(--underline-bg2) ;
    background-color: var(--white);
    transform: translate(-33%,33%);
}
.about-suho-wrap .service-note .circle.cir-3{
    width: 102px;
    height: 102px;
    border-radius: 100%;
    box-sizing: border-box;
    border:20px solid var(--primary-color);
    left:0;
    bottom:48px;
    transform: translate(-50%,0);
    background-color: var(--white);
}
.about-suho-wrap .service-note .inner-md{
    z-index: 2;
}
.about-suho-wrap .service-note .banner{
    position: relative;
    overflow: hidden;
    margin-bottom: 150px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: url(../images/suho_note_banner_bg.png) center center / cover no-repeat;
    min-height: 240px;
    border-radius: 20px;
    padding:5.6% 7.5%;
}
.about-suho-wrap .service-note .banner>*{
    position: relative;
    z-index: 2;
}
.about-suho-wrap .service-note .banner p{
    color: var(--white);
    font-size: 1.875rem;
    line-height: 1.5em;
    font-weight: 700;
}
.about-suho-wrap .service-note .banner .btns{
    display: flex;
    align-items: center;
    gap:15px;
}
.about-suho-wrap .service-note .banner .btn:first-child{
    background-color: var(--primary-color);
    color: var(--white);
}
.about-suho-wrap .service-note .banner .btn{
    width: 199px;
    height: 60px;
    background-color: var(--white);
    font-weight: 700;
    font-size: 1.125rem;
    justify-content: space-between;
    padding:0 30px;
    border-radius: 10px;
    box-sizing: border-box;
}
.about-suho-wrap .service-note .banner .btn i{
    width: 26px;
    height: 26px;
    border-radius: 100%;
    background-color: var(--text-color);
    background-size: 69% auto;
}
.about-suho-wrap .service-note .banner .btn:first-child i{
    background-color: var(--white);
}
.about-suho-wrap .service-note .note-list{
    display: flex;
    align-items: stretch;
    gap:2.2%;
}
.about-suho-wrap .service-note .note-list li{
    width: calc(95.6% / 3);
    background-color: var(--white);
    box-shadow: 0px 5px 20px 0px #0000000D;
    border-radius: 20px;
    box-sizing: border-box;
    padding:2.2% 3%;
    min-height: 234px;
    box-sizing: border-box;
}
.about-suho-wrap .service-note .note-list li .num{
    position: relative;
}
.about-suho-wrap .service-note .note-list li .num span{
    position: relative;
    font-weight: 700;
    font-size: 2.25rem;
    line-height: 1.19em;
    display: block;
    z-index: 2;
}
.about-suho-wrap .service-note .note-list li .num::before{
    content:'';
    position: absolute;
    left:0;
    top:0;
    transform: translate(-20px,-10px);
    width: 50px;
    aspect-ratio: 1 / 1;
    background: url(../svg/num_line.svg) center center / cover no-repeat;
}
.about-suho-wrap .service-note .note-list li p{
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 500;
    margin-top: 1.66em;
}

/* sub_03 */
.select-major-item{
    width: 100%;
    display: flex;
    align-items: stretch;
    background: var(--gray-light2);
    border-radius: 20px;
    box-sizing: border-box;
    overflow: hidden;
}
.select-major-item .thumb{
    width: 17.5%;
    aspect-ratio: 1 / 1;
}
.select-major-item .thumb .bg{
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.select-major-item .info{
    padding:31px 90px 31px 40px;
    box-sizing: border-box;
    position: relative;
    width: calc(100% - 172px);
}
.select-major-item .info .title{
    font-weight: 800;
    font-size: 1.25rem;
    line-height: 1.2em;
    display: flex;
    gap:5px;
    flex-wrap: wrap;
    align-items: center;
}
.select-major-item .info .title span{
    background: var(--primary-color);
    color:#fff;
    border-radius: 5px;
    padding:4px 10px;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.46em;
}
.select-major-item .info .tag{
    display: flex;
    flex-wrap: wrap;
    gap:5px;
    margin-top: 20px;
}
.select-major-item .info .tag li{
    padding:4px 8px;
    font-size: 0.8125rem;
    line-height: 1.615em;
    border-radius: 5px;
}
.select-major-item .info .summary{
    margin-top: 0.625em;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5em;
    color: var(--gray-dark);
}
.select-major-item .info .department-site{
    align-items: center;
    color:var(--primary-color);
    font-size: 0.875rem;
    line-height: 1.5em;
    font-weight: 700;
    gap:5px;
    margin-top: 2.14em;
    display: inline-flex;
}
.select-major-item .info .department-site .arrow-forward-white{
    background-color: var(--primary-color);
    width: 15px;
    height: 15px;
    border-radius: 100%;
    background-size: 73% auto;
}
.select-major-item .info .select{
    position: absolute;
    right:40px;
    top:31px;
    display: flex;
    align-items: center;
    color:var(--primary-color);
    font-size: 1.125rem;
    font-weight: 700;
    gap:10px;
    line-height: 1.22em;
}
.select-major-item .info .select i{
    background-color: var(--primary-color);
    width: 24px;
    height: 24px;
    border-radius: 100%;
    background-size: 50% auto;
}
.curriculum-note{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 60px;
}
.curriculum-note .text p{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap:5px;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.5em;
}
.curriculum-note .text span{
    display: block;
    font-weight: 500;
    font-size: 0.875rem;
    line-height: 1.2em;
    color:var(--gray-dark);
    margin-top: 0.7em;
}
.curriculum-note .btns{
    display: flex;
    align-items: center;
    gap:10px;
}
.curriculum-note .btns .btn{
    gap:5px;
    align-items: center;
    border:1px solid var(--gray-light);
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.1875em;
    width: 180px;
    height: 50px;
    box-sizing: border-box;
    transition: background var(--transition-duration) var(--transition-easing);
}
.curriculum-note .btns .btn:hover{
    background-color: var(--gray-light2);
}

.major-inform .box-title{
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--gray-light);
}
.major-inform .credit-box{
    border:1px solid var(--gray-light);
    box-sizing: border-box;
    background: transparent;
    padding:30px 40px;
}
.major-inform .credit-box .per{
    color:var(--primary-color) !important
}
.major-inform .content-box{
    padding:30px 40px;
    border-radius: 20px;
    background-color: var(--gray-bg);
    border:1px solid var(--gray-light);
    margin-top: 20px;
}
.major-inform .content-box .box-tit{
    display: block;
    font-weight: 800;
    font-size: 1.25rem;
    line-height: 1.2em;
    display: flex;
    gap:5px;
    align-items: center;
    flex-wrap: wrap;
}
.major-inform .content-box .box-content{
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5em;
    color:var(--gray-dark);
    margin-top: 0.625em;
}

/* sub_04 */
.ai-guide-wrap .suho-service{
    padding-top: 0 !important;
}
.ai-guide-wrap .ai-guide>span{
    display: block;
    color:var(--primary-color);
    font-size: 1rem;
    line-height: 1.1875em;
    font-weight: 700;
}
.ai-guide-wrap .ai-guide>h4{
    display: block;
    font-weight: 700;
    font-size: 2.25rem;
    line-height: 1.19em;
    margin-top: 0.27em;
}
.ai-guide-wrap .ai-guide .banner::after{
    content:'';
    background: #00000080;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
}
.ai-guide-wrap .ai-guide .banner{
    margin-top: 40px;
    height: 500px;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    padding:3.78%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    background: url(../images/ai_guide_banner_bg.webp) center center / cover no-repeat;
}
.ai-guide-wrap .ai-guide .service-desc{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:5.9%;
    margin-top: 2.5rem;
}
.ai-guide-wrap .ai-guide .service-desc .title{
    display: block;
    font-size: 2.875rem;
    line-height: 1.19em;
    color:#999;
    font-weight: 700;
    white-space: nowrap;
}
.ai-guide-wrap .ai-guide .service-desc .title span{
    color:var(--text-color)
}
.ai-guide-wrap .ai-guide .service-desc .desc p{
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 1.5em;
}
.ai-guide-wrap .ai-guide .service-desc .desc .btns{
    margin-top: 30px;
    display: flex;
    align-items: center;
    gap:10px;
}
.ai-guide-wrap .ai-guide .service-desc .desc .btn{
    color: var(--white);
    box-shadow: 0px 3px 20px 0px #002C7626;
    height: 41px;
    border-radius: 20.5px;
    padding:0 20px;
    gap:2px;
    background-color: var(--tertiary-color);
}
.ai-guide-wrap .ai-guide .service-desc .desc .btn:first-child{
    background-color: var(--primary-color);
}
.ai-guide-wrap .suho-step{
    margin-top: 200px;
    display: flex;
    flex-direction: column;
    gap:150px;
    position: relative;
    overflow: hidden;
    margin-bottom: 100px;
}
.suho-step .step-item{
    position: relative;
}
.suho-step .step-item .inner-md{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:6%;
    min-height: 500px;
    position: static;
}
.suho-step .step-item:nth-child(even) .inner-md{
    flex-direction: row-reverse;
}
.suho-step .step-item .text{
    width: 44%;
}
.suho-step .step-item .text>p{
    color:var(--primary-color);
    font-weight: 700;
    line-height: 1rem;
    line-height: 1.1875em;
}
.suho-step .step-item .text>.step-title{
    display: flex;
    align-items: center;
    margin-top: 5px;
    gap:20px;
    flex-wrap: wrap;
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 1.5em;
}
.suho-step .step-item .text>.step-title em{
    background: linear-gradient(90deg, #00AFEC 0%, #002C76 100%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}
.suho-step .step-item .text>.step-desc{
    margin-top: 40px;
}
.suho-step .step-item .text>.step-desc strong{
    display: block;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.5em;
}
.suho-step .step-item .text>.step-desc p{
    font-weight: 500;
    margin-top: 0.75em;
    font-size: 1.25rem;
    line-height: 1.5em;
    color: var(--gray-dark);
}
.suho-step .step-item .text .btn{
    color: var(--white);
    height: 41px;
    border-radius: 20.5px;
    background-color: var(--primary-color);
    gap:2px;
    padding:0 20px;
    display: inline-flex;
    margin-top: 40px;
    box-shadow: 0px 3px 20px 0px #002C7626;
}
.suho-step .step-item .img{
    overflow: hidden;
    height: 500px;
    width: 50%;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 200px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    position: absolute;
    right:0;
    top:50%;
    transform: translate(0,-50%);
}
.suho-step .step-item:nth-child(even) .img{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 200px;
    right:initial;
    left:0;
}
.design-major{
    background: #F2F3F8
}

/* 설계전공 섹션 */
.design-major-slide .swiper-slide a{
    display: block;
    background-color: var(--white);
    box-shadow: 0px 5px 20px 0px #0000000D;
    padding:30px;
    border-radius: 20px;
}
.design-major-slide .swiper-slide .type{
    background: var(--highlight-color-quaternary);
    display: inline-block;
    padding:8px 16px;
    border-radius: 5px;
    color:var(--primary-color);
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.5em;
}
.design-major-slide .swiper-slide .nm{
    display: block;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.5em;
    margin-top: 0.625em;
}
.design-major-slide .swiper-slide .student{
    display: flex;
    align-items: center;
    gap:15px;
    margin-top: 30px;
}
.design-major-slide .swiper-slide .student .thumb{
    overflow: hidden;
    border-radius: 100%;
    width: 49px;
    height: 49px;
}
.design-major-slide .swiper-slide .student .thumb img{
    display: block;
    width: 100%;
}
.design-major-slide .swiper-slide .student .info{
    font-size: 1rem;
    line-height: 1.1875rem;
}
.design-major-slide .swiper-slide .student .info .name{
    display: block;
    font-weight: 500;
}
.design-major-slide .swiper-slide .student .info .credit{
    display: block;
    margin-top: 4px;
    color:#969696;
}
.design-major-slide .swiper-slide .more{
    display: flex;
    align-items: center;
    gap:2px;
    color:var(--primary-color);
    margin-top: 40px;
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.4em;
}
.design-major-wrap{
    position: relative;
}
.design-major-wrap+.slide-pagination{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 80px;
}
.design-major-wrap+.slide-pagination .swiper-pagination-bullet{
    margin:0 !important;
    width: 30px;
    height: 5px;
    border-radius: 0;
    opacity: 1;
    background-color: var(--white);
    transition: background var(--transition-duration) var(--transition-easing);
}
.design-major-wrap+.slide-pagination .swiper-pagination-bullet-active{
    background-color: var(--primary-color);
}
.design-major-wrap .slide-prev{
    width: 36px;
    height: 36px;
    text-indent: -9999px;
    cursor: pointer;
    border:0;
    position: absolute;
    top:50%;
    left:0;
    transform:translate(calc(-100% - 26px),-50%);
    background: url(../svg/ico_back.svg) center center / cover no-repeat;
}
.design-major-wrap .slide-next{
    width: 36px;
    height: 36px;
    text-indent: -9999px;
    cursor: pointer;
    border:0;
    position: absolute;
    top:50%;
    right:0;
    transform:translate(calc(100% + 26px),-50%);
    background: url(../svg/ico_next.svg) center center / cover no-repeat;
}

/* sub_05 */
.ai-analyze .test-type{
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap:40px;
}
.ai-analyze .test-type li{
    width: 480px;
    border-radius: 20px;
    box-shadow: 0px 5px 20px 0px #0000000D;
    box-sizing: border-box;
    padding:40px 50px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    transition: background var(--transition-duration) var(--transition-easing);
    aspect-ratio: 480 / 496;
}
.ai-analyze .test-type li:hover{
    background-color: #F2F3F8;
}
.ai-analyze .test-type li .img img{
    display: block;
    margin:0 auto;
    width: 100px;
}
.ai-analyze .test-type li .test-nm{
    display: block;
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 1.5em;
    margin-top: 1em;
}
.ai-analyze .test-type li .test-summary{
    font-size: 1.5rem;
    line-height: 1.5em;
    margin-top: 0.2em;
}
.ai-analyze .test-type li .test-desc{
    font-weight: 500;
    font-size: 1.125rem;
    line-height: 1.5em;
    color: var(--gray-dark);
    margin-top: 2.22em;
}
.ai-analyze .test-type li .btn{
    margin:40px auto 0;
    background-color: var(--primary-color);
    color: var(--white);
    gap:2px;
    box-shadow: 0px 3px 20px 0px #002C7626;
    width: 85px;
    height: 41px;
    border-radius: 20.5px;
}

/* sub_06 */
.ai-analysis-complete section{
    padding-top: 60px !important;
}
.planner-text-box strong{
    display: inline-block;
    font-weight: 700;
    font-size:2.875rem;
    line-height: 1.19em;
    background: linear-gradient(90deg, #00AFEC 0%, #002C76 100%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}
.planner-text-box p{
    font-size: 1.25rem;
    margin-top: 1em;
    line-height: 1.5em;
}

.planner-text-box2{
    padding-top: 30px;
    margin-top: 30px;
    border-top:1px solid var(--gray-light);
}
.planner-text-box2 .planner-text-slide{
    height: calc(5.625rem + 20px);
}
.planner-text-box2 .swiper-slide{
    display: flex;
    width: 100%;
}
.planner-text-box2 p{
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.5em;
    color:#999;
    transition: opacity 1.7s, font 1.7s;
    opacity: 0.2;
}
.planner-text-box2 p+p{
    margin-top: 1.25rem;
}
.planner-text-box2 p span{
    color:var(--text-color)
}
.planner-text-box2 .swiper-slide-active p{
    opacity: 1;
    font-size: 1.5rem;
    line-height: 1.25em;
}
.planner-text-box2 .swiper-slide-active+.swiper-slide p{
    opacity: 0.6;
}
.planner-text-box2 .swiper-slide-active+.swiper-slide+.swiper-slide p{
    opacity: 0.2;
}

.ai-analysis-complete .select-summary{
    margin-top: 41.5px;
    padding-top: 41.5px;
}
.select-summary{
    position: relative;
    border-top: 1px solid var(--gray-light);
}
.select-summary .summary-text{
    position: absolute;
    left:50%;
    top:0;
    background-color: #fff;
    transform: translate(-50%,-50%);
    padding:0 10px;
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5em;
    color:var(--gray-dark)
}
.select-summary ul{
    display: flex;
    gap:1.5%;
}
.select-summary ul li{
    width: 100%;
    padding:3% 2%;
    margin:0;
}
.select-summary ul li span{
    display: block;
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1.2em;
    margin-bottom: 1em;
}
.select-summary ul li p{
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.19em;
}
.select-summary ul li a{
    display: block;
    transition: color var(--transition-duration) var(--transition-easing);
}
.select-summary.summary-2 ul li:nth-child(1){
    background-color: var(--primary-color);
}
.select-summary.summary-2 ul li:nth-child(2){
    background-color: var(--tertiary-color);
}
.select-summary.summary-2 ul li:nth-child(3){
    background-color: var(--secondary-color);
}
.select-summary.summary-2 ul li:nth-child(4){
    background-color: var(--text-color);
}
.select-summary.summary-2{
    margin-top: 30px;
    padding-top: 30px;
    color:#fff;
}
.select-summary.summary-2 ul li p{
    line-height: 1.5em;
    font-size: 1.125rem;
    font-weight: 700;
    margin-top: 1.1em;
    margin-top: 0;
}

.round-shadow-box:first-child{
    margin-top: 0;
}
.round-shadow-box{
    padding:3%;
    border-radius: 20px;
    box-shadow: 0 5px 20px var(--shadow-color-light);
    margin:50px auto;
}
.round-shadow-box .box-title{
    font-size: 1.875rem;
    font-weight: 700;
    line-height: 1.2em;
    margin-bottom: 1.33em;
}
.analysis-result{
    display: flex;
    flex-wrap: wrap;
    gap:40px;
}
.analysis-result .result-box{
    width: calc((100% - 40px) / 2);
    box-sizing: border-box;
    padding:20px 40px 40px;
    border-radius: 20px;
    border:1px solid var(--gray-light);
}
.analysis-result .result-box .img{
    width: 75px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.analysis-result .result-box .img img{
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.analysis-result .result-box .analysis-type{
    display: block;
    margin-top: 5px;
    font-size: 1.25rem;
    color:var(--gray-dark);
    font-weight: 700;
    line-height: 1.5em;
}
.analysis-result .result-box ul{
    display: flex;
    flex-wrap: wrap;
    gap:20px;
    flex-direction: column;
    margin-top: 20px;
}
.analysis-result .result-box ul li{
    width: 100%;
}
.analysis-result .result-box ul li strong{
    display: block;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.5em;
}
.analysis-result .result-box ul li p{
    margin-top: 10px;
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5em;
    color:var(--gray-dark)
}

.recommend-major{
    display: flex;
    flex-direction: column;
    gap:20px;
}
.recommend-major-item{
    width: 100%;
    display: flex;
    align-items: stretch;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    box-sizing: border-box;
    overflow: hidden;
}
.recommend-major-item .thumb{
    width: 172px;
    aspect-ratio: 1 / 1;
}
.recommend-major-item .thumb .bg{
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.recommend-major-item .info{
    padding:31px 90px 31px 40px;
    box-sizing: border-box;
    position: relative;
    width: calc(100% - 172px);
}
.recommend-major-item .info .title{
    font-weight: 800;
    font-size: 1.25rem;
    line-height: 1.2em;
    display: flex;
    gap:5px;
    flex-wrap: wrap;
    align-items: center;
}
.recommend-major-item .info .title span{
    background: var(--primary-color);
    color:#fff;
    border-radius: 5px;
    padding:4px 10px;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.46em;
}
.recommend-major-item .info .tag{
    display: flex;
    flex-wrap: wrap;
    gap:5px;
    margin-top: 20px;
}
.recommend-major-item .info .tag li{
    padding:4px 8px;
    font-size: 0.8125rem;
    line-height: 1.615em;
    border-radius: 5px;
}
.recommend-major-item .info .summary{
    margin-top: 0.625em;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5em;
    color: var(--gray-dark);
}
.recommend-major-item .info .btn-like{
    position: absolute;
    right:40px;
    top:50%;
    width: 44px;
    height: 44px;
    background-color: var(--highlight-color-quinary);
    border:0;
    cursor: pointer;
    text-indent: -9999px;
    overflow: hidden;
    border-radius: 100%;
    margin:0;
    transform: translate(0,-50%);
}

.recommend-major-item .info .btn-ai{
    position: absolute;
    right:90px;
    top:50%;
    width: 44px;
    height: 44px;
    background-color: var(--highlight-color-quinary);
    border:0;
    cursor: pointer;
    overflow: hidden;
    border-radius: 100%;
    margin:0;
    transform: translate(0,-50%);
}

.recommend-module{
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap:20px;
}
.recommend-module .module-item{
    width: calc((100% - 40px) / 3);
    box-shadow: none;
    box-sizing: border-box;
    border:1px solid var(--gray-light)
}
.explore-major .plan-detail-wrap{
    margin-top: 30px;
}
.plan-detail-wrap{
    position: relative;
    display: flex;
    gap:2.2%;
    align-items: flex-start;
}
.plan-detail-wrap .detail-left{
    width: 34%;
}
.plan-detail-wrap .detail-left .list-header{
    position: relative;
}
.plan-detail-wrap .detail-left .list-header .more{
    gap:2px;
    position: absolute;
    right:0;
    top:50%;
    transform: translate(0,-50%);
    color:var(--primary-color);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.16em;
}
.plan-detail-wrap .detail-left .list-tab{
    margin-bottom: 20px;
}
.plan-detail-wrap .detail-left .list-tab #tab .tab-list .tab-btn{
    padding:10px;
}


.plan-detail-wrap .detail-left .list-items>*+*{
    margin-top: 20px;
}
.plan-detail-wrap .detail-left .department-item .thumb .bg{
    padding-bottom: 54%;
}
.plan-detail-wrap .plan-detail{
    width: 63.8%;
    position: relative;
    margin-top: 0;
}
.plan-detail-wrap .plan-detail .college{
    position: absolute;
    right:calc(var(--inner-md-size) * 0.03);
    top:calc(var(--inner-md-size) * 0.03);
}
.major-view .major-img img{
    display: block;
    width: 100%;
}
.major-view .major-info{
    margin-top: 30px;
    position: relative;
}
.major-view .major-info .tit{
    display: block;
    font-size: 1.5rem;
    line-height: 1.5em;
    font-weight: 800;
    padding-right: 150px;
}
.major-view .major-info .desc{
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 500;
    color:var(--gray-dark);
    margin-top: 0.625em;
}
.major-view .major-info .tag{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap:5px;
    margin-top: 20px;
}
.major-view .major-info .tag li{
    padding:4px 8px;
    font-weight: 500;
    line-height: 1.6em;
    font-size: 0.8125rem;
}
.major-view .major-info .major-site .arrow-forward-white{
    background-color: var(--primary-color);
    width: 15px;
    height: 15px;
    border-radius: 100%;
    background-size: 73% auto;
}
.major-view .major-info .major-site{
    display: inline-flex;
    margin-top: 30px;
    font-size: 0.875rem;
    line-height: 1.5em;
    color:var(--primary-color);
    font-weight: 700;
    gap:5px;
    align-items: center;
}
.major-view .major-info .btn-zzim{
    position: absolute;
    right:0;
    top:-0.3125em;
    background-color: rgba(109,110,104,0.1);
    border-radius: 50px;
    padding:10px 20px;
    gap:2px;
    color:var(--gray-dark);
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.3125em;
}
.plan-detail .module-list{
    margin-top: 40px;
    display: flex;
    flex-wrap: wrap;
    gap:20px;
}
.plan-detail .module-list .module-item{
    width: calc((100% - 20px) / 2);
    box-shadow: unset;
    border:1px solid var(--gray-light);
    box-sizing: border-box;
}
.plan-detail .major-content{
    margin-top: 40px;
    font-size: 1rem;
    line-height: 1.5em;
    color:var(--gray-dark);   
}
.major-content .content-box .box-tit{
    display: block;
    font-size: 1.25rem;
    line-height: 1.2em;
    font-weight: 800;
    color:var(--text-color);
    margin-bottom: 1em;
}
.major-content .content-box .box-tit2{
    display: block;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 800;
    color:var(--gray-dark);
    margin-bottom: 1em;
}
.table{
    width: 100%;
    box-sizing: border-box;
    background-color: #fff;
    border:1px solid var(--gray-light);
    border-radius: 20px;
}
.table table{
    width: 100%;
    border-radius: 20px;
}
.table thead tr>*{
    background-color: var(--gray-light);
}
.table thead tr>*:first-child{
    border-top-left-radius: 20px;
}
.table thead tr>*:last-child{
    border-top-right-radius: 20px;
}
.table thead th{
    text-align: center;
    vertical-align: middle;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.5em;
    padding:18px 10px;
    color:var(--text-color)
}
.table tbody td{
    text-align: center;
    vertical-align: middle;
    padding:15px 10px;
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5em;
    color:var(--gray-dark)
}

.table-td-left tbody td{
    text-align: left !important;
}
.table tbody td a{
    color:var(--gray-dark)
}
.table tbody td:last-child{
    border-right: 0;
}
.table tbody td[rowspan]{
    border-right:1px solid var(--gray-light)
}
.table tbody td[rowspan]:last-child{
    border-left: 1px solid var(--gray-light);
}
.table tbody tr+tr td{
    border-top: 1px solid var(--gray-light);
}
.major-curriculum .box-tit2{
    margin-bottom: 20px;
}
.major-curriculum .curriculum-tb{
    margin-top: 20px;
}
.curriculum-tb+.box-tit2{
    margin-top: 20px;
}
.curriculum-tb .col-1{
    width: auto;
}
.curriculum-tb .col-2{
    width: 100px;
}
.curriculum-tb .col-3{
    width: 120px;
}
.curriculum-tb td a{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap:2px;
    padding:0 20px;
}
.major-content .content-box .main-subjects li+li{
    font-size: 1rem;
    margin-top: 1.5em;
}
.major-content .content-box .list-txt li{
    position: relative;
    font-size: 1rem;
    padding-left: 1.5em;
    font-weight: 400;
}
.major-content .content-box .list-txt li::before{
    content:'';
    width: 3px;
    height: 3px;
    border-radius: 100%;
    background-color: var(--gray-dark);
    position: absolute;
    font-size: 1rem;
    left:0.75em;
    top:0.75em;
    transform: translate(-50%,-50%);    
}
.major-view .major-tab#tab{
    gap:5px;
}
.major-view .major-tab#tab li .tab-btn{
    padding:10px;
}
.major-view .major-tab-item{
    display: none;
    border:1px solid vaR(--gray-light);
    box-sizing: border-box;
    padding:40px;
    border-radius: 20px;
    margin-top: 20px;
    flex-direction: column;
    gap:40px;
}
.major-view .major-tab-item>*{
    width: 100%;
}
.major-view .major-tab-item.cur{
    display: flex;
}

/* 전공설계 상세 */
.design-view .major-select{
    display: flex;
    align-items: stretch;
    gap:40px;
}
.design-view .major-select .sel-box{
    width: calc((100% - 40px) / 2);
    box-sizing: border-box;
    min-height: 100%;
}
.design-view .major-select .sel-box .department-item .thumb .bg{
    padding-bottom: 55%;
}
.design-view .major-select .sel-box.empty{
    border-radius: 20px;
    border:1px dashed rgba(109,110,104,0.4);
    background-color: var(--gray-bg);
    display: flex;
    align-items: center;
    justify-content: center;
}
.design-view .major-select .sel-box.empty .empty-text{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap:10px;
}
.design-view .major-select .sel-box.empty .empty-text i{
    width: 44px;
    height: 44px;
    border-radius: 100%;
    background-color: rgba(109,110,104,0.1);
    background-size: 54.5% auto;
}
.design-view .major-select .sel-box.empty .empty-text span{
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 500;
    color:var(--gray-dark)
}
.design-view .content-box{
    margin-top: 40px;
    font-size: 1rem;
    color:var(--gray-dark);
    line-height: 1.5em;
    font-weight: 500;
}
.design-view .content-box .box-tit{
    display: block;
    font-weight: 800;
    font-size: 1.5rem;
    line-height: 1.5em;
    color:var(--text-color);
    margin-bottom: 0.83em;
}
.design-view .design-note{
    position: relative;
    box-sizing: border-box;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    padding:36px 20px 36px 52px;
    gap:8px;
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5em;
}
.design-view .design-note i{
    position: absolute;
    left:20px;
    top:50%;
    transform: translate(0,-50%);
}
.design-view .module-list{
    margin-top: 0;
}

.check-list{
    color:var(--gray-dark);
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 500;
}
.check-list li{
    position: relative;
    padding-left: 28px;
}
.check-list li i{
    position: absolute;
    left:0;
    width: 1.125rem;
    height: 1.125rem;
    top:0.1875rem;
}
.check-list li+li{
    margin-top: 10px;
}

.planner-btm-btns{
    margin-top: 50px;
    padding-top: 50px;
    border-top: 1px solid var(--gray-light);
    display: flex;
    align-items: center;
    justify-content: center;
    gap:20px;
}
.planner-btm-btns .btn-left,
.planner-btm-btns .btn-right{
    gap:20px;
}
.planner-btm-btns .btn:not(.bg-light2){
    color:#fff;
}
.planner-btm-btns .btn{
    border-radius: 10px;
    width: 199px;
    height: 60px;
    background: var(--primary-color);
    border:0;
    cursor: pointer;
    font-weight: 700;
    font-size: 1.125rem;
    line-height: 1.22em;
    gap:2px;
    transition: color var(--transition-duration) var(--transition-easing), background var(--transition-duration) var(--transition-easing);
}
.planner-btm-btns .btn-retest:hover{
    background: var(--tertiary-color-hover);
}
.planner-btm-btns .btn-retest{
    background: var(--tertiary-color);
    color:#fff !important;
    transition: background var(--transition-duration) var(--transition-easing);
}
.planner-btm-btns .btn-back:hover{
    background: var(--text-color);
}
.planner-btm-btns .btn-back{
    background: var(--gray-dark);
    color:#fff !important;
    transition: background var(--transition-duration) var(--transition-easing);
}
.planner-btm-btns .btn.bg-light2:hover{
    color:var(--text-color) !important;
    background: var(--gray-light2-hover) !important;
}
.planner-btm-btns .btn.bg-tertiary:hover{
    background-color: var(--tertiary-color-hover) !important;
    color:#fff;
}

.planner-btm-banner{
    margin-top: 100px;
    display: flex;
    align-items: stretch;
    gap:40px;
}
.planner-btm-banner .banner-item{
    min-height: 100%;
    width: 100%;
}
.planner-btm-banner .banner-item:nth-child(1){
    background-image: url(../images/plan_banner_01.png);
}
.planner-btm-banner .banner-item:nth-child(2){
    background-image: url(../images/plan_banner_02.png);
}
.planner-btm-banner .banner-item a{
    display: flex;
    flex-direction: column;
    align-self: flex-start;
    justify-content: center;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    color:#fff;
    height: 100%;
    overflow: hidden;
    border-radius: 20px;
    padding:50px 40px;
    box-sizing: border-box;
}
.planner-btm-banner .banner-item a strong{
    display: block;
    font-weight: 700;
    font-size: 1.875rem;
    line-height: 1.33em;
}
.planner-btm-banner .banner-item a p{
    font-size: 1.125rem;
    line-height: 1.5em;
    margin-top: 1.1em;
}

/* sub_10 */
.design-major-wrap .plan-detail-wrap{
    margin-top: -40px;
}

/* 전공 세부설계 */
.design-detail-wrap #step-header+section {
    margin-top: -40px;
}
.design-detail-wrap .planner-text-box{
    margin-bottom: 60px;
}
.design-detail{
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 40px;
}
.design-detail .major-box{
    box-sizing: border-box;
    border-radius: 20px;
    background-color: var(--gray-bg);
    border:1px solid var(--gray-light);
    padding:30px;
    flex:1 1 0;
}
.design-detail .major-item{
    display: flex;
    align-items: flex-start;
    gap:20px;
}
.design-detail .major-item .thumb{
    width: 120px;
}
.design-detail .major-item .thumb .bg{
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.design-detail .major-item .info{
    width: calc(100% - 160px);
}
.design-detail .major-item .info .title{
    display: flex;
    align-items: center;
    gap:5px;
    font-weight: 800;
    font-size: 1.25rem;
    line-height: 1.2em;
}
.design-detail .major-item .info .title span{
    background: var(--primary-color);
    color:#fff;
    font-weight:500;
    padding:4px 10px;
    border-radius: 5px;
    font-size: 0.8125rem;
    line-height: 1.6em;
}
.design-detail .major-item .info .summary{
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 500;
    color:var(--gray-dark);
    word-break: keep-all;
    margin-top: 0.625em;
}
.design-detail .major-item .info .tag{
    gap:5px;
    margin-top: 20px;
    font-size: 0.8125rem;
    line-height: 1.6em;
}
.design-detail .major-item .info .tag li{
    padding:4px 8px;
    border-radius: 5px;
}

.plan-mangement-text{
    border:1px solid var(--gray-light);
    display: flex;
    align-items: center;
    border-radius: 20px;
    padding:2.5rem;
    background: var(--gray-bg) url(../images/img_book.png) right 9% center / auto auto no-repeat;
}
.plan-mangement-text p{
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 500;
    color:var(--text-color)
}
.planner-mid-tit{
    display: flex;
    align-items: center;
    gap:10px;
    font-size: 2.25rem;
    line-height: 1.19em;
    font-weight: 700;
    margin:100px 0 -10px;
}
.semester-creidt-design{
    display: flex;
    align-items: stretch;
    gap:40px;
    justify-content: space-between;
}
.semester-creidt-design .semester-box{
    width: 100%;
}
.semester-tit{
    display: block;
    margin-top: 50px;
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 30px;
    color:var(--black);
}

.semester-box .semester-tit{
    margin-top:10px;
    margin-bottom: 30px;
    font-weight: 800;
    font-size: 1.25rem;
    line-height: 1.2em;
    
}
.table.semester-tb .col-1{
    width: auto;
}
.table.semester-tb .col-2{
    width: 82px;
}
.table.semester-tb .col-3{
    width: 100px;
}
.table.semester-tb .col-4{
    width: 115px;
}
.table.semester-tb tr{
    position: relative;
}
.table.semester-tb tr::after{
    content:'';
    height: 1px;
    background: var(--gray-light);
    position: absolute;
    left:40px;
    right:40px;
    bottom:0;
}
.table.semester-tb tr+tr td{
    border-top: 0;
}
.table.semester-tb thead tr th:first-child,
.table.semester-tb tr td:first-child{
    padding-left: 40px;
}
.table.semester-tb tr td:first-child p{
    font-weight: 500;
}
.table.semester-tb tr.changing>td:first-child>p{
    color:var(--primary-color);
    font-weight: 700;
}
.table.semester-tb tr td:nth-child(2) [class^=btn]{
    font-size: 0.8125rem;
    padding:4px 8px;
    line-height: 1.61em;
}
.table.semester-tb tr td:nth-child(4){
    padding-right: 40px;
}
.table.semester-tb tr td:nth-child(4) .btn{
    font-size:0.875rem;
    line-height:1.7em;
    color:var(--primary-color)
}
.table.semester-tb .subject-popup-wrap{
    position: relative;
    display: inline-block;
}
.table.semester-tb .subject-popup{
    position: absolute;
    left:100%;
    top:0;
    background-color: #fff;
    width: 450px;
    overflow: hidden;
    border-radius: 20px;
    box-shadow: 0 5px 20px rgba(109,110,104,0.1);
    z-index: 2;
    transform: translate(0,-15px);
}

.semester-creidt-design .semester-box:last-child .subject-popup{
    left: initial;
    right:100%;
}
.subject-popup .table.semester-tb thead tr>*{
    background-color: #fff;
}
.subject-popup .table.semester-tb thead tr th:first-child, 
.subject-popup .table.semester-tb tr td:first-child{
    padding-left: 30px;
}
.subject-popup .table.semester-tb{
    overflow: auto;
    max-height: 326px;
    position: relative;
}
.subject-popup .table.semester-tb table thead{
    position: sticky;
    top:0;
    left:0;
    right:0;
    z-index: 2;
}
.subject-popup .table.semester-tb .col-3{
    width: 90px;
}
.subject-popup .table.semester-tb .col-4{
    width: 92px;
}
.subject-popup .table.semester-tb tr td:nth-child(4){
    padding-right: 30px;
}
.subject-popup .table.semester-tb thead tr::after{
    left:0;
    right:0;
}
.subject-popup  .table.semester-tb tr::after{
    left:30px;
    right:30px;
}

.credit-box{
    border:1px solid var(--gray-light);
    background-color: var(--gray-bg);
    padding:20px 40px;
    border-radius: 20px;
}
.credit-box .credit-status{
    display: block;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.5em;
    color:var(--primary-color)
}
.credit-box .credit-completion-graph{
    display: flex;
    align-items: center;
    gap:40px;
}
.credit-box .credit-completion-graph .graph{
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    width: 100%;
}
.credit-box .credit-completion-graph .graph .graph-track{
    background-color: #F2F3F8;
    height: 14px;
}
.credit-box .credit-completion-graph .graph .graph-thumb{
    position: absolute;
    left:0;
    top:0;
    bottom:0;
    background: linear-gradient(90deg, #58B7C6 0%, #4A8AED 100%);
}
.credit-box .credit-completion-graph .per{
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.5em;
    color:var(--primary-color);
}
.credit-detail{
    margin-top: 10px;
}
.credit-detail ul{
    display: inline-flex;
    align-items: center;
    background: var(--gray-light);
    padding:8px 20px;
    font-size: 0.875rem;
    line-height: 1.35em;
    font-weight: 700;
    border-radius: 20px;
}
.credit-detail ul li{
    white-space: nowrap;
}
.credit-detail ul li span{
    font-weight: 400;
    color:var(--primary-color)
}
.credit-detail ul li+li{
    position: relative;
    margin-left: 12.5px;
    padding-left: 12.5px;
}
.credit-detail ul li+li::before{
    content:'|';
    position: absolute;
    left:0;
    top:50%;
    transform: translate(-50%,-50%);
    font-weight: 500;
    color:0.8125rem;
    color:#ccc;
}
.design-detail .major-box .credit-box{
    margin-top: 25px;
    background-color: #fff;
    padding:25px 20px;
}
.design-detail .major-box .credit-box .credit-status{
    font-size: 0.8125rem;
    line-height: 1.46em;
    color:var(--text-color)
}
.design-detail .major-box .credit-detail ul{
    font-size: 0.8125rem;
    display: flex;
    justify-content: center;
}
.design-detail .major-box .credit-detail{
    margin-top: 10px;
}
.design-detail .major-box .credit-box .credit-completion-graph{
    gap:20px;
}
.design-detail .major-box .credit-box .credit-completion-graph .graph .graph-thumb{
    background: #17BED8;
}
.credit-box .credit-completion-graph .per{
    font-size: 1.125rem;
    color:var(--tertiary-color);
}

.expand-header{
    position: relative;
    padding-right: 80px;
}
.grade-credit{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.grade-credit .grade{
    display: flex;
    align-items: center;
    gap:40px;
}
.grade-credit .grade>strong{
    font-size: 1.875rem;
    font-weight: 700;
    line-height: 1.2em;
}
.grade-credit .grade .credit-detail{
    margin-top: 0;
}
.grade-credit .credit{
    display: flex;
    align-items: center;
}
.grade-credit .credit span{
    font-size: 1.5rem;
    line-height: 1.5em;
    font-weight: 700;
}
.grade-credit .credit span+span{
    color: var(--primary-color);
    padding-left: 12.5px;
    margin-left: 12.5px;
    position: relative;
}
.grade-credit .credit span+span::after{
    content:'|';
    position: absolute;
    left:0;
    top:50%;
    transform: translate(0,-50%);
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 1.46em;
}
.expand-header .expand-btn{
    position: absolute;
    right:0;
    top:50%;
    transform: translate(0,-50%);
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background-color: var(--gray-light);
    border:0;
    cursor: pointer;
    transition: background var(--transition-duration) var(--transition-easing);
}
.expand-header .expand-btn:hover{
    background-color: var(--gray-light2-hover);
}
.expand-header .expand-btn i{
    width: 20px;
    height: 20px;
    transition: transform var(--transition-duration) var(--transition-easing);
}
.expand-header .expand-btn.active i{
    transform: rotate(180deg);
}
.expand-content{
    display: none;
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid var(--gray-light);
}
.course-content{
    display: flex;
    align-items: stretch;
    gap:40px;
    margin-top: 50px;
}
.course-content .round-shadow-box{
    width: 100%;
    margin:0;
}
.course-content .box-content{
    margin-top: 30px;
    border-radius: 20px;
    background: var(--gray-bg);
    border:1px solid var(--gray-light);
    padding:30px;
}
.course-content .box-content strong{
    display: block;
    font-size: 1.25rem;
    line-height: 1.2em;
    font-weight: 700;
}
.course-content .box-content p{
    margin-top: 0.625em;
    color:var(--gray-dark);
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5em;
}

.matching-analysis{
    margin-top: 30px;
}
.matching-analysis .analysis-result{
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 500;
    margin-top: -0.5em;
    padding-top: 1.5em;
    border-top: 1px solid var(--gray-light);
}
.matching-analysis .analysis-list{
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap:30px;
    margin-top: -20px;
}
.matching-analysis .analysis-list>div{
    width: 100%;
    margin:0;
}
.matching-analysis .analysis-list .box-title{
    margin-bottom: 1em;
}
.matching-analysis .analysis-info{
    display: flex;
    align-items: center;
    gap:15px;
}
.matching-analysis .analysis-info .circle-graph{
    position: relative;
    width: 72px;
    height: 72px;
}
.matching-analysis .analysis-info .circle-graph canvas{
    width: 72px !important;
    height: 100% !important;
}
.matching-analysis .analysis-info .circle-graph span{
    position: absolute;
    left: 50%;
    top:50%;
    transform:translate(-50%,-50%);
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.5em;
}
.matching-analysis .round-shadow-box:nth-child(1) .analysis-info .circle-graph span{
    color:var(--primary-color);
}
.matching-analysis .round-shadow-box:nth-child(2) .analysis-info .circle-graph span{
    color:var(--secondary-color);
}
.matching-analysis .round-shadow-box:nth-child(3) .analysis-info .circle-graph span{
    color:var(--tertiary-color);
}
.matching-analysis .analysis-info p{
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: normal;
}


/* sub_14 */
.planner-wrap{
    padding-top: 0;
}
.planner-complete{
    text-align: center;
    padding-top: 0 !important;
}
.planner-complete .complete-content .img{
    margin:120px 0;
}
.planner-complete .complete-content .img img{
    display: block;
    margin:0 auto;
}
.planner-complete .complete-content .complete-text strong{
    display: block;
    background: linear-gradient(90deg, #00AFEC 0%, #002C76 100%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    font-weight: 700;
    font-size: 2.875rem;
    line-height: 1.19em;
}
.planner-complete .complete-content .complete-text p{
    margin-top: 1em;
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 1.5em;
}
.my-plan .my-plan-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px
}
.my-plan .my-plan-header .plan-header-left{
    display: flex;
    align-items: center;
    gap:20px;
}
.my-plan .my-plan-header .plan-header-left h3{
    font-weight: 700;
    line-height: 1.19em;
    font-size: 2.25rem;
    display: flex;
    align-items: center;
    gap:10px;
}
.my-plan .my-plan-header .plan-header-left .btn{
    color:var(--primary-color);
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 500;
    gap:2px;
}
.my-plan .my-plan-header .plan-header-right{
    display: flex;
    gap:10px;
    align-items: center;
}
.my-plan .my-plan-header .plan-header-right .btn{
    border:1px solid var(--gray-light);
    width: 180px;
    height: 50px;
    box-sizing: border-box;
    border-radius: 10px;
    gap:5px;
    font-size: 1rem;
    font-weight: 500;
    background-color: var(--white);
    transition: background var(--transition-duration) var(--transition-easing);
}
.my-plan .my-plan-header .plan-header-right .btn:hover{
    background-color: #efefef;
}
.my-plan .my-plan-list{
    display: flex;
    flex-wrap: wrap;
    gap:2.2%;
}
.my-plan .my-plan-item{
    width: calc(95.6% / 3);
    box-sizing: border-box;
    box-shadow: 0px 5px 20px 0px #0000000D;
    padding:2.2%;
    border-radius: 20px;
}
.my-plan .my-plan-item .plan-title{
    display: flex;
    flex-wrap: wrap;
    gap:5px;
    align-items: center;
}
.my-plan .my-plan-item .plan-title strong{
    margin-right: 5px;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.5em;
}
.my-plan .my-plan-item .plan-title span{
    padding:4px 8px;
    border-radius: 5px;
    background: #38382E1A;
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 1.615em;
}
.my-plan .my-plan-item .plan-title span.final-plan{
    color: var(--highlight-color-danger);
    background: var(--highlight-color-dark-bg);
}
.my-plan .my-plan-item .plan-info{
    margin-top: 30px;
}
.my-plan .my-plan-item .plan-info table{
    width: 100%;
    table-layout: fixed;
}
.my-plan .my-plan-item .plan-info table th{
    vertical-align: middle;
    width: 50%;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5em;
    color: var(--gray-dark);
    padding:6px 0;
}
.my-plan .my-plan-item .plan-info table td{
    text-align: right;
    vertical-align: middle;
    width: 50%;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5em;
    color:#38382E;
    padding:6px 0;
}
.my-plan .my-plan-item .item-btns{
    padding-top: 24px;
    margin-top: 30px;
    border-top: 1px solid var(--gray-light);
    display: flex;
    align-items: center;
    gap:10px;
}
.my-plan .my-plan-item .item-btns .btn{
    padding:10px 20px;
    gap:2px;
    border-radius: 50px;
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.3125em;
    display: inline-flex;
    background: #F2F3F8;
}
.my-plan .my-plan-item .item-btns .btn.btn-select{
    background: var(--highlight-color);
}
.my-plan .my-plan-info{
    text-align: center;
    font-size: 1.125rem;
    line-height: 1.5em;
    margin-top: 50px;
}
.my-plan .my-plan-info i{
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
}
.my-plan .my-plan-btns{
    margin-top: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap:20px;
}
.my-plan .my-plan-btns .btn{
    color: var(--white);
    width: 199px;
    height: 60px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 1.125rem;
    background-color: var(--tertiary-color);
    transition: background var(--transition-duration) var(--transition-easing);
}
.my-plan .my-plan-btns .btn:hover{
    background-color: var(--tertiary-color-hover);
}
.my-plan  .my-plan-btns .btn-new{
    background-color: var(--primary-color);
}


/* 검색 상단 헤더 */
.list-header{
    position: relative;
    margin-bottom: 40px;
	display: flex;
	justify-content: space-between;
}

/* 탭 */
#tab .tab-list{
    display: flex;
    flex-wrap: wrap;
    gap:10px;
    width: 100%;
}
#tab .tab-list.grid-1 li{
    width: 100%;
}
#tab .tab-list.grid-2 li{
    width: calc((100% - 10px) / 2);
}
#tab .tab-list.grid-3 li{
    width: calc((100% - 20px) / 3);
}
#tab .tab-list.grid-4 li{
    width: calc((100% - 30px) / 4);
}
#tab .tab-list.grid-5 li{
    width: calc((100% - 40px) / 5);
}
#tab .tab-list.grid-6 li{
    width: calc((100% - 50px) / 6);
}
#tab .tab-list.grid-7 li{
    width: calc((100% - 60px) / 7);
}
#tab .tab-list.grid-8 li{
    width: calc((100% - 70px) / 8);
}
#tab .tab-list .tab-btn{
    box-sizing: border-box;
    width: 100%;
    display: flex;
    border:0;
    justify-content: center;
    cursor: pointer;
    background-color: var(--gray-light);
    border-radius: 10px;
    padding:15px;
    box-sizing: border-box;
    font-size: 1.125rem;   
    line-height: 1.5em;
    color: var(--gray-dark);
    transition: background var(--transition-duration) var(--transition-easing);
}
#tab .tab-list .tab-btn:hover{
    background: #e0e0e0;
}

.page-id-68 #tab .tab-list .tab-btn{
    padding: 10px;
}

#kboard-default-list .kboard-list table td{
    padding: 18px 0 !important;

}

.kboard-list table td > a > div > span{
    color: var(--primary-color);
}

.kboard-control .left a.btn-gray{
    display: none;
}
#tab .tab-list .tab-btn.cur{
    font-weight: 700;
    color: var(--white);
    background-color: var(--primary-color);
    transition: color var(--transition-duration) var(--transition-easing);
}
#tab .tab-list .tab-btn.cur:hover{
    color: var(--secondary-color2);
}

/* 전공상세정보 교수진 */
.professor-list{
    display: flex;
    padding: 2rem;
    justify-content: space-between;
    align-items: flex-start;
    align-content: flex-start;
    row-gap: 3.5rem;
    align-self: stretch;
    flex-wrap: wrap;
    gap:3rem;
}

.professor-list .professor-item{
    display: flex;
    align-items: center;
    gap: 2.8rem;
    border-radius: 1.5rem;
    background: #FFF;
    box-shadow: 0px 5px 15px 0px rgba(0, 44, 118, 0.05);
    width: 45%;
    border:1px solid #fff;
    transition: 0.3s;
    overflow: hidden;
	padding-right: 1rem;
	padding-left:1rem;
	
}
.professor-list .professor-item:hover{
   
    background: #f1f1f1;
    border:1px solid #000;
	
    
}
.professor-list .professor-item .thumb{
    width: 150px;       
    height: auto;
    overflow: hidden;
    padding-top:15px;
    padding-bottom: 10px;
}

.professor-list .professor-item .thumb img{
    width: 100%;
    max-width: 100%;
    border-radius: 20px;
    min-height: 150px;
}

.professor-list .professor-item .info-wrap{
    display: flex;
    
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 1rem;
    align-self: stretch;
    flex-grow: 1;
    
	padding-top:1rem;
	padding-bottom:1rem;
		
}

.professor-list .professor-item .info-wrap .name-wrap{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;
}

.professor-list .professor-item .info-wrap .name-wrap h2{
    font-size: 1.2rem;
    font-weight: 800;
    line-height: 1.2em;
    color:#333;
}

.professor-list .professor-item .info-wrap .name-wrap h2 p.underline{
    line-height: 1.8em;
}

.professor-list .professor-item .info-wrap .name-wrap h2 span+span{
    font-weight: 300;
}
.professor-list .professor-item .info-wrap .name-wrap a{
    font-size: 32px;
    font-weight: bold;
}

.professor-list .professor-item .info-wrap .detail-info{
   

}

.professor-list .professor-item .info-wrap .detail-info .detail-info-list li{
    text-align: left;
    font-size: 14px;
}


.professor-list .detail-info .detail-info-list .info-title{
    display: inline-block;
    width: 75px;
    font-weight: bold;
    color: #333;

}

.professor-list .detail-info .detail-info-list .info-content{
    display: inline-block;
    font-weight: normal;
}
.modal-sm{
	max-width: 700px;
}
.modal-inner-content{
	padding: 4%;
}

.suho-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* 반투명 검정 배경 */
    z-index: 1000;
}

.suho-modal .modal-content {
    position: relative;
    background-color: #fff;
    margin: 20vh auto;
    padding: 20px;
    
    
    border-radius: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.suho-modal .close {
    position: absolute;
    right: 20px;
    top: 30px;
    font-size: 28px;
    font-weight: bold;
    color: #666;
    cursor: pointer;
}

.suho-modal .close:hover {
    color: #000;
}
.professor-detail .info-top{
	display: flex;
	gap:2rem;
	padding: 4%;
	
}

.professor-detail .professor-dept{
	color: #ccc;
	font-size: 2.5rem;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	text-transform: uppercase;
	
}
.professor-detail .thumb{
    width: 150px;       
    height: auto;
    overflow: hidden;
}

.professor-detail .thumb img{
    max-width: 100%;
}

.professor-detail .info-wrap{
    display: flex;
    
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 1rem;
    align-self: stretch;
    flex-grow: 1;
    
	padding-top:1rem;
	padding-bottom:1rem;
		
}

.professor-detail .info-wrap .name-wrap{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;
}

.professor-detail .info-wrap .name-wrap h2{
    font-size: 1.75rem;
    font-weight: 800;
    line-height: 1.2em;
    color:#333;
}

.professor-detail .info-wrap .name-wrap h2 span+span{
    font-weight: 300;
}
.professor-detail .info-wrap .name-wrap a{
    font-size: 32px;
    font-weight: bold;
}

.professor-detail .info-wrap .detail-info{
   

}

.professor-detail .info-wrap .detail-info .detail-info-list{
	display: flex; 
	gap:1rem;
}
.professor-detail .info-wrap .detail-info .detail-info-list li{
    text-align: left;
    font-size: 14px;
	margin-bottom: 10px;
}


.professor-detail .detail-info-list .info-title{
    display: inline-block;
    padding-right: 10px;
    font-weight: bold;
    color: #333;

}

.professor-detail .detail-info-list .info-content{
    display: inline-block;
    font-weight: normal;
}



#order .select-styled{
    background-color: var(--gray-light);
    height: 40px;
    border-radius: 50px;
    font-size: 1rem;
    color: var(--gray-dark);
}

/* 검색 */
.list-header #list-search{
    margin-top: 40px;
}
#list-search .search-inner{
    display: flex;
    align-items: center;
    gap:10px;
}
#list-search .search-box{
    position: relative;
    width: 300px;
}
#list-search .search-box i{
    position: absolute;
    left:20px;
    top:50%;
    transform: translate(0,-50%);
}
#list-search .search-box input::placeholder{
    color:#999;
}
#list-search .search-box input{
    display: block;
    width: 100%;
    border:1px solid var(--gray-light);
    border-radius: 10px;
    height: 50px;
    box-sizing: border-box;
    padding:0 20px 0 45px;
    font-weight: 500;
    font-size: 1rem;
}
#list-search .filter-select{
    display: flex;
    align-items: center;
    gap:10px;
    width: calc(100% - 310px);
}
#list-search .filter-select .search-filter{
    width: 100%;
}

/* 게시판 목록 */
.board-list{
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 100px;
	justify-content: space-between;
}
.relation-module .board-list{
    justify-content: flex-start;
}
.board-list>*{
    width: 100%;
}
.board-list.grid-1{
    gap:30px;
}
.board-list.grid-1>*{
    width: 100%;
}
.board-list.grid-2{
    gap:30px;
}
.board-list.grid-2>*{
    width: calc((100% - 30px) / 2);
}
.board-list.grid-3{
    gap:30px;
}
.board-list.grid-3>*{
    width: calc((100% - 60px) / 3);
}
.board-list.grid-4{
    gap:20px;
}
.board-list.grid-4>*{
    width: calc((100% - 60px) / 4);
}

.board-list .list-table{
    margin-top: 40px;
}
.board-list .list-table.inquiry-tb .col-1{
    width: 90px;
}
.board-list .list-table.inquiry-tb .col-2{
    width: 130px;
}
.board-list .list-table table{
    width: 100%;
    border-radius: 20px;
    border:1px solid var(--gray-light);
    overflow: hidden;
    box-sizing: border-box;
}
.board-list .list-table table input[type=checkbox]{
    width: 14px;
    height: 14px;
    box-sizing: border-box;
    border:2px solid #000;
    display: inline-block;
}
.board-list .list-table table thead tr>*{
    text-align: center;
    vertical-align: middle;
    background: var(--gray-light);
    padding:1.125rem 0;
    color:var(--text-color);
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 700;
}
.board-list .list-table table tbody tr>*{
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid var(--gray-light);
    padding:0.9375rem 0;
    color:var(--text-color);
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 500;
}
.board-list .list-table table tbody tr:last-child>*{
    border-bottom: 0;
}
.board-list .list-table .btn-link{
    color:var(--primary-color);
    gap:2px;
}
.board-list .search-wrap{
    margin-top: 40px;
}
.board-list .search-wrap form{
    display: flex;
    align-items: center;
    justify-content: center;
}
.board-list .search-box{
    position: relative;
}
.board-list .search-box i{
    position: absolute;
    top:50%;
    left:20px;
    transform: translate(0,-50%);
    z-index: 1;
}
.board-list .search-box input{
    display: block;
    width: 300px;
    height: 50px;
    border:1px solid var(--gray-light);
    box-sizing: border-box;
    border-radius: 10px;
    padding:0 20px 0 45px;
    font-size: 1rem;
    color:var(--text-color)
}
.board-list .search-box input:placeholder{
    color:#999;
}
.board-list .search-wrap .btn{
    margin-left: 10px;
    border-radius: 10px;
    background-color: var(--gray-light2);
    width: 100px;
    height: 50px;
    line-height: 1.3125em;
    color:var(--text-color);
    font-weight: 500;
    font-size: 1rem;
    transition:background var(--transition-duration);
}
.board-list .search-wrap .btn:hover{
    background: var(--gray-light2-hover);
}

/* 페이징 */
.pagination{
    display: flex;
    align-items: center;
    justify-content: center;
    gap:6.5px;
    margin-top: 60px;
}
.pagination .num{
    width: 40px;
    line-height: 40px;
    border-radius: 100%;
    text-align: center;
    font-size: 1.125rem;
    font-weight: 500;
    color:var(--text-color);
    transition:background var(--transition-duration), color var(--transition-duration);
}
.pagination .num:hover,
.pagination .cur{
    background-color: var(--primary-color);
    color:#fff;
}
.pagination .prev{
    margin:0 33.5px 0 13.5px;
}
.pagination .next{
    margin:0 13.5px 0 33.5px;
}

/* 학과 목록 아이템 */
.department-item{
    border-radius: 20px;    
    overflow: hidden;
    background-color: var(--white);
    box-shadow: 0px 5px 20px 0px #0000000D;
}
.department-item .thumb{
    overflow: hidden;
}
.department-item .thumb .bg{
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    height: 0;
    padding-bottom: 47%;
    transition: transform 0.5s var(--transition-easing);
}
.department-item:hover .thumb .bg{
    transform: scale(1.14);
}
.department-item .info{
    padding:5% 7% 7%;
    position: relative;
}
.department-item .info .title{
    font-weight: 800;
    font-size: 1.25rem;
    line-height: 1.2em;
    display: block;
}
.department-item .info .tag{
    display: flex;
    flex-wrap: wrap;
    gap:5px;
    margin-top: 10px;
}
.department-item .info .tag li{
    padding:4px 8px;
    font-size: 0.75rem;
    line-height: 1.5em;
    border-radius: 5px;
}
.department-item .info .summary{
    margin-top: 15px;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5em;
    color: var(--gray-dark);
}
.department-item .info .ai{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 15px;
    gap:5px;
}
.department-item .info .ai li{
    display: flex;
    align-items: center;
    justify-content: center;
    border:1px solid var(--gray-light);
    border-radius: 10px;
    padding:5px 20px 5px 10px;
    font-size: 0.875rem;
    line-height: 1.2em;
    color: var(--gray-dark);
    gap:3px;
}
.department-item .info .ai li span{
    margin-left: 2px;
    font-weight: 500;
    color:var(--text-color);
}
.department-item .info .btn{
    margin-top: 20px;
    gap:2px;
    color:var(--primary-color);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.3125em;
    display: inline-flex;
}
.department-item .info .btn-like{
    position: absolute;
    right:7%;
    top:5%;
    width: 36px;
    height: 36px;
    background-color: var(--highlight-color-quinary);
    border:0;
    cursor: pointer;
    text-indent: -9999px;
    overflow: hidden;
    border-radius: 100%;
    margin:0;
}

.module-item .info .btn-ai,
.department-item .info .btn-ai{
    position: absolute;
    right:18%;
    top:5%;
    width: 36px;
    height: 36px;
    background-color: var(--highlight-color-quinary);
    border:0;
    cursor: pointer;
    overflow: hidden;
    border-radius: 100%;
    margin:0;
}

.module-item .info .btn-ai{
    top:11%;
    
    
}


/* Planner item hover effect */
.planner-item {
    transition: background-color var(--transition-duration) var(--transition-easing);
    height: 100%;
}

.planner-item:hover {
    
    border-color: #e1e1e1 !important;
}


/* 인적성검사 매칭진단 섹션 스타일 */
.personality-match .match-rate {
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
}

.personality-match .circle {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.personality-match .percent {
    font-size: 20px;
    font-weight: 700;
    color: #333;
    display: inline-block;
    width: 80px;
    height: 80px;
    background: var(--gray-light2);
    border-radius: 80px;
    line-height: 80px;
    text-align: center;
}

.personality-match .module-item {
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    padding: 20px;
    transition: all 0.3s ease;
}

.personality-match .module-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.personality-match .title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
    display: block;
    text-align: center;
}

.personality-match .summary {
    color: #777;
    font-size: 16px;
    line-height: 1.5;
}


/* 모듈 목록 아이템 */
.module-item{
    border-radius: 20px;    
    overflow: hidden;
    background-color: var(--white);
    box-shadow: 0px 5px 20px 0px #0000000D;
}
.module-item .info{
    padding:7% 6%;
    position: relative;
}
.module-item .info .major{
    margin-bottom: 5px;
    display: block;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--gray-dark);
    line-height: 1.5em;
}
.module-item .info .title{
    font-weight: 700;
    font-size: 1.3rem;
    line-height: 1.5em;
    display: block;
}
.module-item .info .tag{
    display: flex;
    flex-wrap: wrap;
    gap:5px;
    margin-top: 10px;
}
.module-item .info .tag li{
    padding:4px 8px;
    font-size: 0.8125rem;
    line-height: 1.615em;
    border-radius: 5px;
}
.module-item .info .summary{
    margin-top: 15px;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5em;
    color: var(--gray-dark);
}
.module-item .info .btn{
    margin-top: 20px;
    gap:2px;
    color:var(--primary-color);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.3125em;
    display: inline-flex;
}
.module-item .info .btn-like{
    position: absolute;
    right:6%;
    top:7%;
    transform: translate(0,32px);
    width: 36px;
    height: 36px;
    background-color: var(--highlight-color-quinary);
    border:0;
    cursor: pointer;
    text-indent: -9999px;
    overflow: hidden;
    border-radius: 100%;
    margin:0;
}

/* 학과소개 상세 */
.department-view{
    padding-top: 0 !important;
}
.department-view .department-info{
    display: flex;
    gap:3%;
}
.department-view .department-video{
    width: 49%;
    position: relative;
    /* aspect-ratio: 650 / 450; */
    overflow: hidden;
    border-radius: 20px;
    background-color: #ccc;
}

.department-view .department-video img{
    width: 100%;
}
.department-view .department-video video{
    position: absolute;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.department-view .department-info .info-text{
    width: 48%;
}
.department-view .department-info .info-text .tit{
    display: block;
    font-size: 3rem;
    font-weight: 800;
    line-height: 1.2em;
}
.department-view .department-info .info-text .desc{
    margin-top: 1em;
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 500;
    color: var(--gray-dark);
}
.department-view .department-info .info-text .tag{
    display: flex;
    gap:10px;
    margin-top:20px;
}
.department-view .department-info .info-text .tag li{
    padding:10px 15px;
}
.department-view .department-info .info-text .department-site{
    display: flex;
    align-items: center;
    gap:5px;
    margin-top: 40px;
    color:var(--primary-color);
    font-weight: 700;
    font-size: 1.125rem;
    line-height: 1.5em;
}
.department-view .department-info .info-text .department-site i{
    background-color: var(--primary-color);
    width: 18px;
    height: 18px;
    border-radius: 100%;
    background-size: 77% auto;
}
.department-view .department-content{
    margin-top: 60px;
}
.department-view .department-tab-items{
    margin-top: 40px;
}
.department-view .department-tab-item{
    display: none;
    padding:3%;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 500;
    color: var(--gray-dark);
    text-align: center;
}
.department-view .department-tab-item.cur{
    display: block;
}

.department-view .department-tab-item .board-list{
    justify-content: flex-start;
}

.tab-content{

}

.tab-content .tab-content-items{
    margin-top: 40px;
}

.tab-content .tab-content-item{
    display: none;
    padding:3%;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 500;
    color: var(--gray-dark);
    
}

.tab-content .tab-content-item.cur{
    display: block;;
}

.department-review{
    background-color: #F2F3F8;
}
.department-review-slide .swiper-slide a{
    display: block;
    background-color: var(--white);
    box-shadow: 0px 5px 20px 0px #0000000D;
    padding:30px;
    border-radius: 20px;
}
.department-review-slide .swiper-slide .star{
    position: relative;
    display: inline-block;
}
.department-review-slide .swiper-slide .star::before{
    content:'';
    display: block;
    width: 90px;
    aspect-ratio: 90 / 18;
    background: url(../svg/ico_star_off.svg) center center / cover no-repeat;
}
.department-review-slide .swiper-slide .star .score{
    position: absolute;
    left:0;
    top:0;
    height: 100%;
    z-index: 2;
    background: url(../svg/ico_star_on.svg) left center / cover no-repeat;
}
.department-review-slide .swiper-slide .nm{
    display: block;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.5em;
    margin-top: 0.625em;
}
.department-review-slide .swiper-slide .student{
    display: flex;
    align-items: center;
    gap:15px;
    margin-top: 30px;
}
.department-review-slide .swiper-slide .student .thumb{
    overflow: hidden;
    border-radius: 100%;
    width: 49px;
    height: 49px;
}
.department-review-slide .swiper-slide .student .thumb img{
    display: block;
    width: 100%;
}
.department-review-slide .swiper-slide .student .info{
    font-size: 1rem;
    line-height: 1.1875rem;
}
.department-review-slide .swiper-slide .student .info .name{
    display: block;
    font-weight: 500;
}
.department-review-slide .swiper-slide .student .info .credit{
    display: block;
    margin-top: 4px;
    color:#969696;
}
.department-review-wrap{
    position: relative;
    margin-top: -20px;
}
.department-review-wrap+.slide-pagination{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 80px;
}
.department-review-wrap+.slide-pagination .swiper-pagination-bullet{
    margin:0 !important;
    width: 30px;
    height: 5px;
    border-radius: 0;
    opacity: 1;
    background-color: var(--white);
    transition: background var(--transition-duration) var(--transition-easing);
}
.department-review-wrap+.slide-pagination .swiper-pagination-bullet-active{
    background-color: var(--primary-color);
}
.department-review-wrap .slide-prev{
    width: 36px;
    height: 36px;
    text-indent: -9999px;
    cursor: pointer;
    border:0;
    position: absolute;
    top:50%;
    left:0;
    transform:translate(calc(-100% - 26px),-50%);
    background: url(../svg/ico_back.svg) center center / cover no-repeat;
}
.department-review-wrap .slide-next{
    width: 36px;
    height: 36px;
    text-indent: -9999px;
    cursor: pointer;
    border:0;
    position: absolute;
    top:50%;
    right:0;
    transform:translate(calc(100% + 26px),-50%);
    background: url(../svg/ico_next.svg) center center / cover no-repeat;
}

/* 모듈소개 상세 */
.module-view{
    padding-top: 0 !important;
}
.module-view .module-info{
    border:1px solid var(--gray-light);
    background-color: var(--gray-bg);
    border-radius: 20px;
    padding:3%;
    box-sizing: border-box;
}
.module-view .module-info .info-text .tit{
    display: block;
    font-size: 1.875rem;
    font-weight: 700;
    line-height: 1.2em;
}
.module-view .module-info .info-text .desc{
    margin-top: 0.75em;
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 500;
    color: var(--gray-dark);
}
.module-view .module-info .info-text .credit{
    font-size: 1rem;
    line-height: 1.5em;
    color: var(--gray-dark);
    font-weight: 500;
    margin-top: 1.25em;
}
.module-view .module-info .info-text .tag{
    display: flex;
    gap:10px;
    margin-top:30px;
}
.module-view .module-info .info-text .tag li{
    padding:10px 15px;
}
.module-view .module-content{
    margin-top: 30px;
    padding:3%;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 500;
    color: var(--gray-dark);
    text-align: center;
}

.aptitude-test-wrap{
    position: relative;
    background: url(../images/aptitude_test_bg.png) center top / cover no-repeat;
    overflow: hidden;
}
.aptitude-test-wrap div[class^=bg] img{
    display: block;
    max-width: 100%;
}
.aptitude-test-wrap .bg-1{
    position: absolute;
    right:0;
    top:56px;
    width: 270px;
    transform: translate(44%,0);
}
.aptitude-test-wrap .bg-2{
    position: absolute;
    left:0;
    top:50%;
    width: 102px;
    transform: translate(-25%,-50%);
}
.aptitude-test {
    padding-top: 0 !important;
}
.aptitude-test .test-desc{
    border-radius: 20px;
    box-shadow: 0px 5px 20px 0px #0000000D;
    padding:60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:11%;
}
.aptitude-test .test-desc .text{
    padding-top: 14px;
}
.aptitude-test .test-desc .text strong{
    display: block;
    font-size: 2.875rem;
    line-height: 1.19em;
    font-weight: 700;
    color:var(--text-color);
}
.aptitude-test .test-desc .text strong span{
    display: inline;
    background: linear-gradient(90deg, #00AFEC 0%, #002C76 100%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}
.aptitude-test .test-desc .text>span{
    display: block;
    margin-top: 0.66em;
    color:#999;
    font-size: 1.875rem;
    line-height: 1.2em;
    font-weight: 700;
}
.aptitude-test .test-desc .text p{
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 500;
    margin-top: 2em;
    color:var(--text-color);
}
.aptitude-test .test-desc .img{
    width: 22.5%;
}
.aptitude-test .test-desc .img img{
    display: block;
    margin:0 auto 0 0;
    max-width: 100%;
}
.aptitude-test .test-list{
    margin-top: 100px;
    display: flex;
    align-items: stretch;
    gap:30px;
}
.aptitude-test .test-item{
    width: calc((100% - 60px) / 3);
    background-color: #fff;
    border-radius: 20px;
    box-shadow: 0px 5px 20px 0px #0000000D;
    box-sizing: border-box;
    padding:40px;
    display: flex;
    flex-direction: column;
    transition:  var(--transition-duration);
    position: relative;
}
.aptitude-test .test-item:hover{
    background-color: var(--gray-light);
}
.aptitude-test .test-item::after{
    content: '';
    position: absolute;
    border-radius: 20px;
    border:2px solid var(--primary-color);
    pointer-events: none;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity var(--transition-duration);
}
.aptitude-test .test-item:hover::after{
    opacity: 1;
}
.aptitude-test .test-item>*{
    width: 100%;
}
.aptitude-test .test-item .img{
    width: 44%;
    margin:0 auto;
}
.aptitude-test .test-item .img img{
    display: block;
    margin:0 auto;
}
.aptitude-test .test-item .tag{
    display: flex;
    flex-wrap: wrap;
    gap:5px;
    margin-top: 30px;
}
.aptitude-test .test-item .tag span{
    border-radius: 5px;
    background: #38382E1A;
    padding:4px 8px;
    font-size: 0.8125rem;
    line-height: 1.61em;
    color:var(--text-color);
}
.aptitude-test .test-item .subject{
    margin-top: 10px;
    font-size: 1.875rem;
    line-height: 1.33em;
    font-weight: 700;
}
.aptitude-test .test-item .summary{
    margin-top: 10px;
    font-size: 1rem;
    line-height: 1.1875em;
    color:var(--gray-dark);
    font-weight: 500;
}
.aptitude-test .test-item .test-info{
    margin-top: 30px;
}
.aptitude-test .test-item .test-info ul{
    display: flex;
    flex-direction: column;
    gap:12px;
}
.aptitude-test .test-item .test-info ul li{
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    font-size: 1rem;
    line-height: 1.5em;
}
.aptitude-test .test-item .test-info ul li span{
    width: 50%;
    color:var(--gray-dark);
}
.aptitude-test .test-item .test-info ul li p{
    width: 50%;
    font-weight: 500;
    color:var(--text-color);
    text-align: right;
}
.aptitude-test .test-item .btn{
    margin-top: 30px;
    display: inline-flex;
    gap:2px;
    color:#fff;
    background-color: var(--primary-color);
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.3125em;
    width: 113px;
    height: 41px;
    border-radius: 20px;
}

/* sub_19 */
.ai-propensity .banner-wrap{
    margin-bottom: 50px;
}
.ai-propensity .banner{
    margin-top: 40px;
    height: 500px;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    padding:3.78%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    background: url(../images/ai_propensity_banner.webp) center center / cover no-repeat;
}
.ai-propensity .banner-wrap .service-desc{
    display: flex;
    justify-content: space-between;
    gap:5.9%;
    margin-top: 2.5rem;
}
.ai-propensity .banner-wrap .service-desc .title{
    display: block;
    font-size: 2.875rem;
    line-height: 1.19em;
    color:#999;
    font-weight: 700;
    white-space: nowrap;
}
.ai-propensity .banner-wrap .service-desc .title span{
    color:var(--text-color)
}
.ai-propensity .banner-wrap .service-desc .desc p{
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 1.5em;
}
.ai-propensity .analysis-survey{
    display: flex;
    flex-direction: column;
    gap:100px;
}
.ai-propensity .analysis-survey .survey-box{
    display: flex;
    flex-direction: column;
    gap:30px;
}
.ai-propensity .analysis-survey .survey-box .box-title{
    margin-bottom: 10px;
}
.ai-propensity .analysis-survey .survey-box .box-title h3{
    display: flex;
    align-items: center;
    gap:10px;
    font-size: 2.25rem;
    line-height: 1.19em;
    font-weight: 700;
    color:var(--text-color);
}
.ai-propensity .analysis-survey .survey-box .box-title h3 i{
    width: 39px;
    height: 39px;
}
.ai-propensity .analysis-survey .survey-item.next-question{
    border:2px solid var(--secondary-color)
}
.ai-propensity .analysis-survey .survey-item:not([disabled]){
    
}
.ai-propensity .analysis-survey .survey-item{
    padding:40px;
    box-sizing: border-box;
    width: 100%;
    margin:0;
}
.ai-propensity .analysis-survey .survey-item .question{
    font-size: 1.5rem;
    line-height: 1.5em;
    font-weight: 700;
    color:var(--text-color);
}
.ai-propensity .analysis-survey .survey-item .options{
    margin-top: 1.875rem;
}
.ai-propensity .analysis-survey .survey-item[disabled] .options label{
    pointer-events: none;
}
.ai-propensity .analysis-survey .survey-item[disabled]{
    cursor: not-allowed;
}
.ai-propensity .analysis-survey .survey-item .options ul{
    display: flex;
    flex-wrap: wrap;
    gap:1.25rem;
}
.ai-propensity .analysis-survey .survey-item .options li{
    position: relative;
}
.ai-propensity .analysis-survey .survey-item .options input{
    position: absolute;
    lefT:0;
    top:0;
    visibility: hidden;
    pointer-events: none;
}
.ai-propensity .analysis-survey .survey-item .options input+label{
    display: flex;
    align-items: center;
    gap:15px;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.2em;
    color:var(--text-color)
}
.ai-propensity .analysis-survey .survey-item .options input+label::before{
    content:'';
    display: block;
    width: 24px;
    height: 24px;
    background: transparent url(../svg/ico_check_nor.svg) center center / cover no-repeat;
}
.ai-propensity .analysis-survey .survey-item .options input:checked+label::before{
    background: transparent url(../svg/ico_check_sel.svg) center center / cover no-repeat;
}
.ai-propensity .planner-btm-btns{
    margin-top: -50px;
}

/* sub_21 */
.mypage-wrap{
    padding-bottom: 100px;
    display: flex;
    align-items: stretch;
    gap:30px;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.mypage-wrap .mypage-box{
    width: calc((100% - 30px) / 2);
    margin:0;
    box-sizing: border-box;
    padding:40px;
    position: relative;
}
.mypage-wrap .mypage-box .box-header{
    margin-bottom: 30px;
    padding-right: 20%;
}
.mypage-wrap .mypage-box .box-header h4{
    display: block;
    font-size: 1.875rem;
    font-weight: 700;
    color:var(--text-color);
    line-height: 1.2em;
}
.mypage-wrap .mypage-box .box-header p{
    margin-top: 10px;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 500;
    color:var(--gray-dark)
}
.mypage-wrap .mypage-box .box-header .img{
    position: absolute;
    right:0;
    top:0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 27%;
}
.mypage-wrap .mypage-box .box-header .img img{
    display: block;
}
.mypage-wrap .mypage-box .btns{
    display: flex;
    align-items: stretch;
    gap:10px;
    margin-top: 30px;
}
.mypage-wrap .mypage-box .btns>*{
    width: 100%;
    height: 41px;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.3125em;
}
.mypage-wrap .mypage-box .btns>*.bg-gray-light2{
    transition: background var(--transition-duration);
}
.mypage-wrap .mypage-box .btns>*.bg-gray-light2:hover{
    background: var(--gray-light2-hover) !important;
}

.mypage-wrap .mypage-box .kboard-latest-date{
    display: none;
}

.mypage-plan .my-plan-item{
    padding:30px;
    border:1px solid var(--gray-light);
    border-radius: 20px;;
    min-height: 232px;
    box-sizing: border-box;
}
.mypage-plan .my-plan-item .plan-title{
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}

.mypage-plan .my-plan-item .plan-title strong{
    margin-right: 5px;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.5em;
}
.mypage-plan .my-plan-item .plan-title span{
    padding:4px 8px;
    border-radius: 5px;
    background: #38382E1A;
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 1.615em;
}
.mypage-plan .my-plan-item .plan-title span.final-plan{
    color: var(--highlight-color-danger);
    background: var(--highlight-color-dark-bg);
}
.mypage-plan .my-plan-item .plan-info table{
    width: 100%;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5em;
}
.mypage-plan .my-plan-item .plan-info table th{
    vertical-align: middle;
    padding:6px 0;
    color:var(--gray-dark);
}
.mypage-plan .my-plan-item .plan-info table td{
    vertical-align: middle;
    text-align: right;
    color:var(--text-color);
}
.mypage-analysis .analysis-box{
    padding:30px;
    border:1px solid var(--gray-light);
    border-radius: 20px;;
    min-height: 232px;
    box-sizing: border-box;
}
.mypage-analysis .analysis-box strong{
    display: block;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.5em;
    margin-bottom: 30px;
}
.mypage-analysis .analysis-box table{
    width: 100%;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5em;
}
.mypage-analysis .analysis-box table th{
    vertical-align: middle;
    padding:6px 0;
    color:var(--gray-dark);
}
.mypage-analysis .analysis-box table td{
    vertical-align: middle;
    text-align: right;
    color:var(--text-color);
}

.inquiry-list,
.activity-list{
    padding:30px;
    border:1px solid var(--gray-light);
    border-radius: 20px;;
    min-height: 232px;
    box-sizing: border-box;
}

.inquiry-list table,
.activity-list table{
    width: 100%;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5em;
    table-layout: fixed;
}
.inquiry-list table td{
    padding:6px 0;
    vertical-align: middle;
    text-align: right;
}
.inquiry-list table td:first-child{
    text-align: left;
    width: auto;
}
.inquiry-list table td:last-child{
    color:var(--gray-dark);
    width: 80px;
}
.inquiry-list table td .btn{
    display: inline-flex;
}
.activity-list table td {
    vertical-align: middle;
    padding:6px 0;
    width: auto;
}
.activity-list table td a{
    display: block;
    color:var(--text-color);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.activity-list table td:last-child{
    text-align: right;
    color:var(--gray-dark);
    vertical-align: middle;
    width: 80px;
}
.mypage-zzim .zzim-list{
    display: flex;
    align-items: stretch;
    gap:15px;
}
.mypage-zzim .zzim-box{
    width: 100%;
    box-sizing: border-box;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    padding:30px 30px 13px;
    min-height: 232px;
}
.mypage-zzim .zzim-box span{
    display: block;
    font-weight: 700;
    color:var(--text-color);
    font-size: 1.125rem;
    line-height: 1.5em;
    margin-bottom: 10px;
}
.mypage-zzim .zzim-box ul{
    display: flex;
    gap:8px;
    flex-direction: column;
}
.mypage-zzim .zzim-box li{
    position: relative;
    width: 100%;
    padding-left: 1rem;
}
.mypage-zzim .zzim-box li a{
    display: block;
    color:var(--gray-dark);
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 500;
}
.mypage-zzim .zzim-box li::before{
    content:'';
    width: 3px;
    height: 3px;
    background-color: var(--gray-dark);
    border-radius: 100%;
    font-size: 1rem;
    position: absolute;
    left:0.5em;
    top:0.75em;
    transform: translate(-50%,-50%);
}
.mypage-graduation .req-list{
    display: flex;
    flex-direction: column;
    gap:15px;
}
.mypage-graduation .req-list .req-item{
    box-sizing: border-box;
    display: flex;
    align-items: center;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    padding:20px 25px 17px;
    gap:20px;
}
.mypage-graduation .req-list .req-item .graph{
    position: relative;
    width: 54px;
    height: 54px;
}
.mypage-graduation .req-list .req-item .graph span{
    font-size: 0.8125rem;
    line-height: 1.38em;
    font-weight: 700;
    color:var(--tertiary-color);
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%,-50%);
    white-space: nowrap;
}
.mypage-graduation .req-list .req-item .graph.complete span{
    color:#59B100;
}
.mypage-graduation .req-list .req-item .text span{
    display: block;
    font-weight: 700;
    font-size: 1.125rem;
    line-height: 1.5em;
    color:var(--text-color);
}
.mypage-graduation .req-list .req-item .text p{
    margin-top: 5px;
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 500;
    color:var(--gray-dark);
}

/* sub_23 */
.plan-compare{
    padding-bottom: 100px;
}
.plan-compare .select-plan{
    display: flex;
    align-items: stretch;
    gap:30px;
    justify-content: flex-end;
    margin-bottom: 30px;
}
.plan-compare .select-plan .plan-item{
    width: calc((100% - 60px) / 3);
    box-sizing: border-box;
    padding:30px;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    background: var(--gray-bg);
}
.plan-compare .select-plan .plan-item strong{
    display: block;
    font-size: 1.5rem;
    line-height: 1.5em;
    font-weight: 700;
    color:var(--text-color)
}
.plan-compare .select-plan .plan-item .tag{
    display: flex;
    gap:5px;
    margin-top: 10px;
}
.plan-compare .select-plan .plan-item .tag span{
    padding:4px 8px;
    font-size: 0.8125rem;
    line-height: 1.61em;
    font-weight: 500;
    color:var(--text-color);
    background: rgba(56, 56, 46, 0.1);
    border-radius: 5px;
}
.plan-compare .select-plan .plan-item .tag span.final-plan{
    color: var(--highlight-color-danger);
    background: var(--highlight-color-dark-bg);
}
.plan-compare .select-plan .plan-item .btn{
    margin-top: 30px;
    height: 50px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 1.125rem;
    line-height: 1.16em;
}
.compare-section{
    margin-bottom: 60px;
}
.compare-section .section-header{
    background-color: var(--gray-light);
    border-radius: 10px;
}
.compare-section .section-header strong{
    display: block;
    padding:1.25rem;
    font-size: 1.25rem;
    left: 1.2em;;
    color:var(--text-color);
    font-weight: 700;
}
.compare-section .row{
    position: relative;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap:30px;
}
.compare-section .row::after{
    content:'';
    position: absolute;
    left:20px;
    right:20px;
    bottom:0;
    height: 1px;
    background-color: var(--gray-light);
}
.compare-section .compare-column{
    position: relative;
    width: calc((100% - 60px) / 3);
    box-sizing: border-box;
    padding:20px;
    font-size: 1.125rem;
    line-height: 1.22em;
    font-weight: 700;
    color:var(--text-color);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap:15px;
}
.compare-section .compare-column .title{
    display: block;
    color:var(--gray-dark);
    text-align: left;
    font-weight: 500;
}
.compare-section .compare-column:nth-child(1){
    align-items: flex-start;
}
.compare-section .compare-column:nth-child(2)::before{
    content:'';
    background: var(--footer-text);
    height: 15px;
    width: 1px;
    position: absolute;
    left:0;
    top:50%;
    transform: translate(-50%,-50%);
}
.compare-section .compare-column:nth-child(2)::after{
    content:'';
    background: var(--footer-text);
    height: 15px;
    width: 1px;
    position: absolute;
    right:0;
    top:50%;
    transform: translate(-50%,-50%);
}
.compare-section .btn{
    gap:5px;
}
.compare-section .credit-warning{
    color:var(--danger-color);
    border:1px solid var(--danger-color);
    font-size: 1rem;
    line-height: 1.1875em;
    padding:4px 10px;
    border-radius:20px;
    margin-left: 10px;
}
.compare-section .credit-pass{
    color:#59B100;
    border:1px solid #59B100;
    font-size: 1rem;
    line-height: 1.1875em;
    padding:4px 10px;
    border-radius:20px;
    margin-left: 10px;
}
.compare-btn .row::after,
.compare-btn .compare-column::before,
.compare-btn .compare-column::after{
    content: none !important;
}
.compare-btn .compare-column{
    padding:0;
}
.compare-btn .btns{
    gap:10px;
    width: 100%;
}
.compare-btn .btn{
    height: 61px;
    border-radius: 10px;
    font-size: 1.125rem;
    font-weight: 700;
    width: 100%;
    padding:0;
    box-sizing: border-box;
}
.plan-compare .my-plan{
    margin-top: 100px;
    box-sizing: border-box;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    padding:30px 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.plan-compare .my-plan .text{
    color:var(--text-color);
}
.plan-compare .my-plan .text strong{
    display: flex;
    align-items: center;
    gap:10px;
    font-weight: 700;
    font-size: 1.875rem;
    line-height: 1.2em;
}
.plan-compare .my-plan .text p{
    margin-top: 20px;
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 500;
}
.plan-compare .my-plan .btn{
    width: 199px;
    border-radius: 10px;
    height: 61px;
    font-weight: 700;
    font-size: 1.125rem;
}
/* sub_24 */
.propensity-analysis{
    padding-bottom: 100px;
}
.propensity-analysis .analysis-section{
    margin:0;
    padding:40px;
}
.propensity-analysis .analysis-section+.analysis-section{
    margin-top: 30px;
}
.propensity-analysis .analysis-section .section-header{
    margin-bottom: 30px;
}
.propensity-analysis .analysis-section .section-header strong{
    display: block;
    font-size: 1.875rem;
    line-height: 1.12em;
    color:var(--text-color);
    font-weight: 700;
}
.propensity-analysis .analysis-section .section-header p{
    margin-top: 15px;
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 500;
    color:var(--gray-dark);
}
.propensity-analysis .analysis-section .section-header p .name{
    color:var(--text-color);
    font-weight: 700;
}
.propensity-analysis .analysis-section .my-info{
    margin-bottom: 20px;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    padding:30px 0;
}
.propensity-analysis .analysis-section .my-info ul{
    display: flex;
    align-items: center;
    justify-content: center;
}
.propensity-analysis .analysis-section .my-info ul li{
    width: calc(100% / 3);
    position: relative;
    display: flex;
    align-items: center;
    padding:0 40px;
    box-sizing: border-box;
    gap:15px;
    color:var(--text-color);
    font-size: 1.125rem;
    line-height: 1.5em;
}
.propensity-analysis .analysis-section .my-info ul li:first-child{
    padding-left: 20px;
}
.propensity-analysis .analysis-section .my-info ul li:last-child{
    padding-right: 30px;
}
.propensity-analysis .analysis-section .my-info ul li:nth-child(2)::before{
    content:'';
    width: 1px;
    height: 15px;
    background-color: var(--footer-text);
    position:absolute;
    top:50%;
    left:0;
    transform:translate(-50%,-50%);
}
.propensity-analysis .analysis-section .my-info ul li:nth-child(2)::after{
    content:'';
    width: 1px;
    height: 15px;
    background-color: var(--footer-text);
    position:absolute;
    top:50%;
    right:0;
    transform:translate(50%,-50%);
}
.propensity-analysis .analysis-section .my-info ul li span{
    font-weight: 500;
}
.propensity-analysis .analysis-section .my-info ul li p{
    font-weight: 700;
}
.propensity-analysis .analysis-section .box-list{
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap:20px;
}
.propensity-analysis .analysis-section .box-list>li{
    box-sizing: border-box;
    width: calc((100% - 40px) / 3);
    background: var(--gray-bg);
    border:1px solid var(--gray-light);
    border-radius: 20px;
    padding:40px 30px;
    position: relative;
}
.propensity-analysis .analysis-section .box-list>li span:not(.btn){
    display: block;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 700;
    color:var(--gray-dark);
}
.propensity-analysis .analysis-section .box-list>li p{
    margin-top: 15px;
    font-size: 1.5rem;
    line-height: 1.5em;
    font-weight: 700;
    color:var(--text-color);
}
.propensity-analysis .analysis-section .box-list>li img{
    display: block;
    margin-bottom: 15px;
}
.propensity-analysis .analysis-section .box-list>li .btn{
    border:0;
    cursor: pointer;
    position: absolute;
    top:15px;
    right:15px;
    width: 36px;
    height: 36px;
    background-color: transparent;
}
.propensity-analysis .analysis-section .box-list>li .check-on{
    background: url(../svg/ico_check_on.svg) center center / cover no-repeat;
}
.propensity-analysis .analysis-section .box-list>li .check-off{
    background: url(../svg/ico_check_off.svg) center center / cover no-repeat;
}
.propensity-analysis .analysis-section .btns{
    align-items: center;
    gap:10px;
    margin-top: 30px;
}
.propensity-analysis .analysis-section .btns .btn{
    height: 61px;
    border-radius: 10px;
    font-size: 1.125rem;
    font-weight: 700;
    width: 199px;
}
.propensity-analysis .analysis-summary{
    margin-top: 30px;
}
.summary-wrap{
    display: flex;
    align-items: stretch;
    gap:2%;
}
.propensity-analysis .analysis-summary .summary-graph{
    width: 29%;
    border-radius: 20px;
    border:1px solid var(--gray-light);
    padding:20px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
}
.propensity-analysis .analysis-summary .summary-graph canvas{
    width: 100%;
}
.propensity-analysis .analysis-summary .summary-text{
    width: 69%;
    flex-wrap: wrap;
    align-items: stretch;
    gap:30px 20px;
}
.propensity-analysis .summary-text .summary-box{
    border:1px solid var(--gray-light);
    background: var(--gray-bg);
    border-radius: 20px;
    padding:30px;
    box-sizing: border-box;
    width: calc((100% - 40px) / 3);
}
.propensity-analysis .summary-text .summary-box span{
    display: block;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 700;
    color: var(--gray-dark);
}
.propensity-analysis .summary-text .summary-box p{
    margin-top: 15px;
    font-size: 1.5rem;
    line-height: 1.5em;
    font-weight: 700;
    color: var(--text-color);
}
.propensity-analysis .summary-text .summary-box .line-graph{
    border-radius: 20px;
    height: 8px;
    background-color: var(--gray-light2);
    margin-top: 10px;
    overflow: hidden;
    position: relative;
}
.propensity-analysis .summary-text .summary-box .line-graph span{
    position: absolute;
    left:0;
    top:0;
    bottom:0;
    border-radius: 20px;
}
.propensity-analysis .result-2{
    align-items: stretch;
    gap:30px;
}
.propensity-analysis .result-2 .result-box{
    margin:0;
    width: 100%;
    box-sizing: border-box;
    padding:40px;
}
.propensity-analysis .result-2 .result-box>strong{
    display: block;
    font-size: 1.875rem;
    line-height: 1.2em;
    font-weight: 700;
    color:var(--text-color);
}
.propensity-analysis .result-2 .result-box>p{
    margin-top: 15px;
    font-size: 1.25rem;
    line-height: 1.5em;
    color:var(--gray-dark);
    font-weight: 500;
}
.propensity-analysis .result-2 .result-box ul{
    display: flex;
    flex-direction: column;
    gap:20px;
    margin-top: 30px;
}
.propensity-analysis .result-2 .result-box ul li{
    background-color: var(--gray-bg);
    border:1px solid var(--gray-light);
    border-radius: 20px;
    box-sizing: border-box;
    padding:30px;
    width: 100%;
    min-height: 166px;
}
.propensity-analysis .result-2 .result-box ul li span{
    display: flex;
    align-items: center;
    position: relative;
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1.2em;
    color:var(--text-color);
}
.propensity-analysis .result-2 .result-box ul li span::before{
    
}
.propensity-analysis .result-2 .result-box ul li p{
    margin-top: 10px;
    font-size: 1rem;
    line-height: 1.5em;
    color:var(--gray-dark);
    
}
.propensity-analysis .analysis-section .course{
    align-items: stretch;
    gap:30px;
}
.propensity-analysis .analysis-section .course-column{
    width: calc((100% - 60px) / 3);
    box-sizing: border-box;
}
.propensity-analysis .course-title{
    border-radius: 20px;
    background: url(../images/course_title_bg.png) center center / cover no-repeat;
    padding:40px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color:#fff;
    height: 100%;
    box-sizing: border-box;
    box-shadow: 0 5px 20px var(--shadow-color-light);
}
.propensity-analysis .course-title strong{
    font-size: 1.875rem;   
    line-height: 1.33em;
    font-weight: 700;
}
.propensity-analysis .course-title p{
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 500;
}
.propensity-analysis .course-box{
    margin:0;
    border-radius: 20px;
    padding:40px;
    height: 100%;
    box-sizing: border-box;
}
.propensity-analysis .course-box .title{
    position: relative;
    display: block;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.5em;
    color:var(--text-color);
}
.propensity-analysis .course-box .title span{
    position: relative;
    z-index: 2;
    display: block;
}
.propensity-analysis .course-box .title::before{
    content:'';
    position: absolute;
    left:0;
    top:0;
    transform: translate(-30px,-20px);
    width: 52px;
    aspect-ratio: 1 / 1;
    background: url(../svg/title_line.svg) center center / cover no-repeat;
}
.propensity-analysis .course-box .summary{
    margin-bottom: 24px;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 500;
    color:var(--gray-dark);
    margin-top: 10px;
}
.propensity-analysis .course-box .course-tb{
    width: 100%;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 500;
}
.propensity-analysis .course-box .course-tb th{
    vertical-align: middle;
    padding:6px 0;
    color:var(--gray-dark);
}
.propensity-analysis .course-box .course-tb td{
    text-align: right;
    vertical-align: middle;
    padding:6px 0;
    color:var(--text-color);
}
.propensity-analysis .course-box .btn-detail{
    align-items: center;
    border-radius: 20px;
    gap:5px;
    margin-top: 26px;
    background: var(--highlight-color);
    padding:10px 20px;
    font-size: 1rem;
    line-height: 1.3125em;
    font-weight: 500;
    color:var(--text-color);
    display: inline-flex;
}

/* sub_26 */
.propensity-analysis .analysis-detail{
    margin-top: 60px;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    gap:30px;
    padding:30px 40px;
    box-sizing: border-box;
}
.analysis-detail .detail-title{
    display: flex;
    align-items: center;
    gap:10px;
}
.analysis-detail .detail-title img{
    display: block;
    width: 54px;
}
.analysis-detail .detail-title h3{
    display: block;
    margin-top: 10px;
    font-weight: 700;
    font-size: 2.25rem;
    line-height: 1.19em;
    color:var(--text-color);
}
.analysis-detail .detail-box{
    border:1px solid var(--gray-light);
    border-radius: 20px;
    padding:30px;
}
.analysis-detail .detail-box .box-title{
    margin-bottom: 30px;
}
.analysis-detail .detail-box .box-title h4{
    display: block;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.5em;
    color:var(--text-color);
}
.analysis-detail .detail-box .box-title p{
    font-size: 0.875rem;
    line-height: 1.5em;
    color:var(--text-color);
    font-weight: 500;
    margin-top: 5px;
}
.analysis-detail .detail-box table{
    width: 100%;
    border:1px solid var(--gray-light);
    box-sizing: border-box;
    border-radius: 20px;
    overflow: hidden;
}
.analysis-detail .detail-box table thead tr{
    background-color: var(--gray-light);
}
.analysis-detail .detail-box table thead tr>*{
    padding:18px;
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 700;
    color:var(--text-color);
    text-align: center;
    vertical-align: middle;
}

.analysis-detail .detail-box table tbody th{
    background-color: var(--gray-light);
}

.analysis-detail .detail-box table tbody th,
.analysis-detail .detail-box table tbody td{
    vertical-align: middle;
    text-align: center;
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 400;
    color:var(--text-color);
    padding:0.9375rem 2rem;
    word-break: keep-all;
    border-bottom: 1px solid var(--gray-light);
}
.analysis-detail .detail-box table tbody tr:last-child td{
    border-bottom: 0 !important;
}
.analysis-detail .detail-box .tb-desc{
    margin-top: 20px;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.5em;
    color:var(--gray-dark);
}
.analysis-detail .detail-box.job-interest .text{
    margin:30px 0;
}
.analysis-detail .detail-box.job-interest .text span{
    display: block;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 700;
    color:var(--gray-dark);
}
.analysis-detail .detail-box.job-interest .text p{
    margin-top: 5px;
    font-size: 1.25rem;
    line-height: 1.5em;
    font-weight: 700;
    color:#3F80FF;
}
.analysis-detail .detail-box.job-interest table th:first-child{
    padding-left: 2rem;
}
.analysis-detail .detail-box .interest-chart{
    display: flex;
    align-items:flex-start;
    gap:2%;
}
.analysis-detail .interest-chart .graph{
    width: 29%;
    box-sizing: border-box;
    border:1px solid var(--gray-light);
    border-radius: 20px;
    padding:38px 14px;
}
.analysis-detail .interest-chart .graph canvas{
    width: 100%;
}
.analysis-detail .interest-chart .text{
    width: 69%;
    box-sizing: border-box;
    color:var(--text-color);
}
.analysis-detail .interest-chart .text>strong{
    display: block;
    font-size: 1.125rem;
    line-height: 1.5em;
    font-weight: 700;
}
.analysis-detail .interest-chart .text>p{
    margin-top: 5px;
    font-weight: 500;
    font-size: 0.875rem;
    line-height: 1.5em;
    margin-bottom: 30px;
}
.analysis-detail .interest-chart table thead th{
    padding:18px 2rem
}

.analysis-detail .aptitude-score .graph{
    margin-bottom: 46px;
}
.analysis-detail .aptitude-score .graph canvas{
    width: 100%;
}
.analysis-detail .aptitude-score table thead th{
    word-break: keep-all;
}
.analysis-detail .aptitude-score table thead th:first-child{
    padding-left: 1.5rem;
}
.analysis-detail .aptitude-score table tbody td{
    padding:0.9375rem 1rem;
}
.analysis-detail .aptitude-score table tbody td:first-child{
    padding-left: 1.5rem;
}
.analysis-detail .aptitude-score-2 .graph{
    margin-bottom: 46px;
}
.analysis-detail .aptitude-score-2 .graph canvas{
    width: 100%;
}
.analysis-detail .career-assessment .graph{
    margin-bottom: 46px;
}
.analysis-detail .career-assessment .graph canvas{
    width: 100%;
}
.analysis-detail .career-assessment table{
    table-layout: auto;
}
.analysis-detail .career-assessment table th,
.analysis-detail .career-assessment table td{
    padding-left: 0 !important;
    padding-right: 0 !important;
    font-size: 0.8125rem !important;
}
.analysis-detail .career-assessment table th{
    padding:11px 0 !important;
}
.analysis-detail .career-assessment table th:first-child,
.analysis-detail .career-assessment table td:first-child{
    padding-left: 1rem !important;
}
.analysis-detail .main-test-result{
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap:30px;
}
.analysis-detail .main-test-result .result-box{
    box-sizing: border-box;
    width: calc((100% - 30px) / 2);
    border-radius: 20px;
    padding:30px;
    border:1px solid var(--gray-light);
}
.analysis-detail .main-test-result .result-box canvas{
    width: 100%;
    display: block;
    height: 208px;
}

/* 로그인 폼 */ 

.login-form{
    position: relative;
    padding-top:100px;
}
.login-form form >h4{
    display: none;
}
.login-form form .row{
    margin: 0 !important;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding-bottom: 30px;
    border-bottom: 1px solid #efefef;
}
.login-form form .row a{
    width: 100%;
}
.login-form form .row a .mo_oauth_login_button{
    content: '로그인';
    width: 100%;
    background-color: #002c76;
    border-radius: 5px;
    color: #fff;
    padding: 0.9rem 0;
    text-align: center;
    font-weight: normal;
    height: auto;
}
.login-form form .row a .mo_oauth_login_button:hover{
    background-color: #002c76;
}


.login-form form .row a .mo_oauth_login_button i{
    display: none;
}



.mo_oauth_login_button_text {
    font-size: 0; /* 기존 텍스트 숨기기 */
}

.mo_oauth_login_button_text::after {
    content: "학생 로그인"; /* 새로운 텍스트 추가 */
    font-size: 14px; /* 적절한 폰트 크기로 복원 */
    color: inherit; /* 부모 요소의 색상 상속 */
}


/* 비밀번호 분실 메시지 삭제 */
.tml-submit-wrap{
    margin-top:-55px;
}
.tml-submit-wrap button{
    cursor: pointer;
    border:0;
    
}
.tml-rememberme-wrap,
.tml-links{
    display: none;
}

/* 1320px 이하 */
@media (max-width:1320px){
    .sub-header{
        height: 350px;
    }
    #sub section{
        padding:80px 0;
    }
    #sub .sec-header{
        margin-bottom: 60px;
    }
    #sub .page-title{
        margin:80px auto 40px;
    }

    /* sub_02 */
    .about-suho-wrap .suho-service .about-suho .banner{
        height: auto;
        aspect-ratio: 1320 / 500;
    }
    .about-suho-wrap .suho-service .about-suho>p{
        word-break: keep-all;
    }
    .about-suho-wrap .suho-service .major-item p,
    .about-suho-wrap .main-feature .feature-item p,
    .about-suho-wrap .service-note .note-list li p{
        word-break: keep-all;
    }
    .about-suho-wrap .suho-service .major-item p br,
    .about-suho-wrap .main-feature .feature-item p br,
    .about-suho-wrap .service-note .note-list li p br{
        display: none;
    }
    .about-suho-wrap .suho-service .about-suho .banner strong{
        font-size: 2.5rem;
    }

    /* sub_03 */
    .select-major-item .thumb{
        width: 24%;
    }
}

/* 1024px 이하 */
@media (max-width:1024px){

    .board-list.grid-3>*{
        width: calc((100% - 60px) / 2);
    }


    .sub-header{
        height: 300px;
    }
    .sub-header h2{
        font-size: 3rem;
    }
    .sub-header p{
        font-size: 1.125rem;
    }

    /* sub_02 */
    .about-suho-wrap .suho-service .about-suho .banner strong{
        font-size: 2.25rem;
    }
    .about-suho-wrap .suho-service .major-list{
        margin-top: 80px;
    }
    .about-suho-wrap .suho-service .bg{
        font-size: 5rem;
    }
    .about-suho-wrap .suho-service .bg-1{
        top:35%;
    }
    .about-suho-wrap .suho-service .bg-2{
        top:4%;
    }
    .about-suho-wrap .main-feature .feature{
        flex-direction: column;
    }
    .about-suho-wrap .main-feature .feature-list{
        width: 100%;
    }
    .about-suho-wrap .main-feature .feature-item{
        aspect-ratio: unset;
    }
    .about-suho-wrap .main-feature .feature-current{
        width: 100%;
    }
    .about-suho-wrap .service-note .banner{
        padding:20px;
        flex-direction: column;
        align-items: flex-start;
        gap:40px;
        justify-content: center;
        margin-bottom: 80px;
    }
 
    
    #step-header{
        margin-top: 80px;
    }
    .round-shadow-box{
        padding:20px;
    }

    /* sub_03 */
    .grade-credit .grade{
        gap:20px;
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
    }
    .grade-credit .credit{
        position: absolute;
        right:60px;
        top:0;
    }
    .expand-header{
        padding-right: 0;
    }
    .expand-header .expand-btn{
        top:0;
        transform: translate(0,-4.25px);
    }
    .planner-btm-btns .btn-left, .planner-btm-btns .btn-right{
        gap:10px;
    }
    .planner-btm-btns .btn{
        width: 150px;
        height: 50px;
    }

    .professor-list{
        padding:20px;
    }
    .professor-list .professor-item{
        width:43%;
    }

    /* 마이페이지 */
    .mypage-zzim .zzim-list{
        flex-direction: column;
    }

    /* 마이페이지 - 플래너 */
    .design-detail .major-box{
        
        width: calc(50% - 20px);
    }
    .design-detail .major-item .info .tag li{
        margin-bottom: 5px;
    }

    .aptitude-test .test-item{
        padding:25px;
    }
    .aptitude-test .test-item .subject{
        font-size: 1.5rem;
    }
}

@media ( min-width:768px){
    #kboard-default-list .kboard-list tbody tr td > div{
        display: none;
    }
}

/* 768px 이하 */
@media (max-width:768px){

    /* 모바일 폰트사이즈 */
    .m-h1,
    .department-view .department-info .info-text .tit{
        font-size:2.25rem !important;
        font-weight: 700 !important;
        line-height: 1.5 !important;
    }

    .m-h2,
    .mypage-wrap .mypage-box .box-header h4,
    .aptitude-test .test-item .subject,
    .aptitude-test .test-desc .text strong,
    .major-content-title h3,
    .major-card-title h3,
    .ai-guide-wrap .ai-guide>h4,
    .ai-guide-wrap .ai-guide .service-desc .title,
    .suho-step .step-item .text>.step-title,
    .semester-tit{
        font-size:1.85rem !important;
        font-weight: 700 !important;
        line-height: 1.5 !important;
    }

    .m-h3,
    .professor-list .professor-item .info-wrap .name-wrap h2,
    .personality-match .title,
    .analysis-detail .detail-box .box-title h4,
    .propensity-analysis .analysis-section .section-header strong,
    .aptitude-test .test-desc .text>span,
    .major-card-title p,
    .semester-box .semester-tit{
        font-size:1.54rem !important;
        font-weight: 700 !important;
        line-height: 1.3 !important;
    }

    .m-h4,
    .mypage-plan .my-plan-item .plan-title strong{
        font-size:1.35rem !important;
        font-weight: 700 !important;
        line-height: 1.3 !important;
    }

    .m-h5{
        font-size:1.2rem !important;
        font-weight: 700 !important;
        line-height: 1.3 !important;
    }

    .m-h6{
        font-size:1rem !important;
        font-weight: 700 !important;
        line-height: 1.3 !important;
    }

    .m-p,
    .mypage-wrap .mypage-box .box-header p,
    .department-view .department-info .info-text .desc,
    .aptitude-test .test-desc .text p,
    .major-table-cell,
    .major-card-desc,
    .major-content p,
    .suho-step .step-item .text>.step-desc p,
    .ai-guide-wrap .ai-guide .service-desc .desc p{
        font-size:1rem !important;
        line-height: 1.5 !important;
        color: #444 ;
    }

    .propensity-analysis .analysis-section .my-info{
        padding:20px 0;
    }
    .ai-guide-wrap .ai-guide .banner{
        height: 300px;
    }
    #kboard-default-document .kboard-detail .detail-attr:first-child{
        padding-left:0 !important;
    }

    .planner-wrap > .bg-gray-light2{
        flex-direction: column;
    }

    .planner-wrap > .bg-gray-light2 img{
        width:50%;
        margin:auto;
    }

    .inquiry-list, .activity-list,
    .mypage-zzim .zzim-box,
    .mypage-analysis .analysis-box,
    .mypage-plan .my-plan-item{
        min-height: 200px;
    }
    .mypage-plan .my-plan-item .plan-title{
        gap: 10px;
    }
    .inquiry-list, .activity-list,
    .mypage-zzim .zzim-box,
    .mypage-analysis .analysis-box,
    .mypage-plan .my-plan-item{
        padding:20px;
    }
    .department-view .department-info .info-text .tag{
        margin-top:10px;
    }
    .department-view .department-info .info-text .department-site{
        margin-top:20px;
    }
    #professorModal .modal-content, #majorInfoModal .modal-content{
        border-radius: 5px !important;
        padding-bottom:30px;
        padding-top:30px;
    }
    .professor-detail .info-wrap .detail-info .detail-info-list{
        flex-direction: column;
        gap:0;
        
    }
    .professor-detail .professor-dept{
        display: none;;
    }
    .modal-content.inner-md{
        width: auto !important;
    }
    .department-content{
        padding-bottom:10px !important;
    }

    .propensity-analysis .analysis-detail{
        margin-top:40px;
    }
    .major-card-title{
        margin-bottom: 20px !important;
    }
    .major-card-title h3,
    .major-content-title{
        margin-bottom: 10px !important;
    }

    .ai-analysis-complete .round-shadow-box{
        padding:0;
        box-shadow: none;
    }
    .ai-guide-wrap .suho-step,
    .suho-step .step-item .text>.step-title{
        gap: 10px;
    }

    .propensity-analysis .analysis-section .btns .btn{
        width: 100%;
        height: 50px;
    }

    /* 마이페이지 */

    .mypage-wrap .mypage-analysis .analysis-box{
        padding:20px;
    }

    /* 적성검사 선택형검사 */
    .ai-propensity .banner-wrap .service-desc{
        flex-direction: column;
    }

    

    .ai-propensity .analysis-survey{
        margin-top:0px;
        gap:50px;
    }
    .ai-propensity .analysis-survey .survey-item{
        padding:25px;
    }
    .ai-propensity .analysis-survey .survey-box{
        gap:25px;
    }
    
    /* 적성검사 3종 선택 */
    .aptitude-test .test-desc{
        flex-direction: column;
        padding:25px;

    }

    .aptitude-test .test-desc .img{
        display: none;
    }

    .aptitude-test .test-list{
        flex-direction: column;
    }

    .aptitude-test .test-item{
        width: 100%;
    }

    /* 검사안내 */
    .ai-analyze .test-type{
        flex-direction: column;
    }
    .ai-analyze .test-type li{
        width: 100%;
        padding: 20px;
    }
    .ai-analyze .test-type li .test-summary{
        font-size: 1.3rem;
    }
    .ai-analyze .test-type li .test-desc{
        font-size: 1rem;
        margin-top: 1rem;
    }
    .propensity-analysis .analysis-section .my-info ul li:nth-child(2)::before,
    .propensity-analysis .analysis-section .my-info ul li:nth-child(2)::after{
        display: none;
    }
    .propensity-analysis .analysis-section{
        padding:20px;
    }
    .propensity-analysis .analysis-detail{
        padding:0px;
        border:none;
    }
    .analysis-detail .detail-title h3{
        font-size:1.8rem;
    }
    .analysis-detail .detail-title img{
        display: none;
    }

    .analysis-detail .detail-box{
        padding:20px;
    }
    .analysis-detail .detail-box table{}

    .analysis-detail .detail-box.job-interest .text{
        margin:25px 0;
    }

    .analysis-detail .detail-box .interest-chart{
        flex-direction: column;
    }
    .analysis-detail .interest-chart .graph{
        width: 100%;
    }
    .analysis-detail .interest-chart .text{
        width: 100%;
    }

    .analysis-detail .main-test-result{
        flex-direction: column;
    }
    .analysis-detail .main-test-result .result-box{
        width: 100%;
    }
    .analysis-detail .main-test-result .result-box:first-child{
        margin-bottom: 20px;
    }

    /* 선택형 검사결과 */
    .analysis-result{
        flex-direction: column;
        gap:20px;
    }

    .analysis-result .result-box{
        width: 100%;
        padding:20px;

    }

    .recommend-major-item{
        flex-direction: column;
    }
    .recommend-major-item .thumb{
        width: 100%;
        height: 150px;
    }
    .recommend-major-item .info{
        width: 100%;
        padding:20px;
    }

    .recommend-major-item{
        border-radius: 0px;
    }

    .recommend-module{
        flex-direction: column;
    }
    .recommend-module .module-item{
        width: 100%;
    }
    
    .planner-btm-banner{
        flex-direction: column;
    }

    .planner-btm-banner .banner-item{
        background-size: cover;
    }

    /* 학과소개 */
    .list-header{
        flex-direction: column;
    }

    #supreme-filter-form{
        margin-top:25px;
    }

    #tab .tab-list .tab-btn{
        margin-bottom: 0px;
    }

    .board-list.grid-3>*{
        width: 100%;
    }

    /*전공학과 상세보기 */
    .department-view .department-info{
        flex-direction: column;
    }
    .department-view .department-video{
        width: 100%;
    }
    .department-view .department-info .info-text{
        width: 100%;
    }

    .department-view .department-info .info-text .tit{
        margin-top: 25px;
    }

    #tab .tab-list{
        display: flex;
        flex-wrap: wrap;
        gap:10px;
    }

    #tab .tab-list.grid-2 li,
    #tab .tab-list.grid-3 li,
    #tab .tab-list.grid-4 li{
        width: 100%;
    }

    #tab .tab-list li{
        flex: 0 0 calc(50% - 5px);
    }


    .professor-list{
        padding:20px;
    }

    .professor-list .professor-item{
        width:100%;
        flex-direction: column;
        gap:10px;
        box-shadow: none;
        padding: 0;
    }
    .professor-list .professor-item:hover{
        background-color: transparent;
        border:none;
    }
    .table.semester-tb .subject-popup{
        left: 0;
        width: 320px;
    }
    .professor-list .professor-item .thumb{
        width:100%;
    }
    
    /* 직업가치관 검사 */
    .propensity-analysis .analysis-section .my-info ul{
        flex-direction: column;
    }
    .propensity-analysis .analysis-section .my-info ul li{
        align-items: flex-start;
        width: 100%;
        padding:5px 20px;
    }
    .propensity-analysis .analysis-section .my-info ul li .info{}


    .department-tab-item > div> .semester-tit{
        margin-top:25px;
        margin-bottom:10px;
    }
    .department-tab-item .semester-tit{
        text-align:left;
    }

    .subject-popup-wrap .major-title{
        margin-bottom:0px;
    }

    .list-header #sort-form{
        margin-top: 25px;;
    }

    /* 모듈 */

    #list-search .search-box{
        width: 100%;
    }
    #list-search .search-inner{
        flex-direction: column;
    }

    #list-search .filter-select{
        width: 100%;
        flex-wrap: wrap;
        gap:10px;
    }

    #list-search .filter-select .search-filter{
        flex: 0 0 calc(50% - 5px);
    }

    #list-search .filter-select .select-item{
        width:100%;
    }

    
    /* 게시판 */
    #kboard-default-list .kboard-list tbody tr td{
        display: none;
    }

    #kboard-default-list .kboard-list tbody tr td:nth-child(2){
        display: block;
        text-align: left;
        padding-left: 20px;
    }

    .grade-credit .grade .credit-detail h5{
        text-align: left;
    }

    #faq-wrap .faq-item{
        padding:20px 25px;
    }

    /* 마이페이지 */
    .mypage-wrap .mypage-box{

    }

    .mypage-wrap .mypage-box{
        width:100%;
        padding:20px;
    }

    .mypage-wrap .no-result img{
        margin:30px auto 0;
        width: 50%;
    }

    

    /* 마이페이지 - 플래너 */
    .planner-item{
        padding:20px;
    }
    
    .planner-item .ai-matching{
        padding:5px 10px;
        margin-right:8px;
    }

    
    /* 마이페이지 - 플래너 상세 */

    .design-detail{
        flex-direction: column;
    }
    .design-detail .major-box{
        width: 100%;
        padding:20px;
    }
    .design-detail .major-item .info .tag li{
        
    }

    .design-detail .major-item{
        flex-direction: column;
    }
    .design-detail .major-item .thumb{
        width: 100%;
        height: 150px;
        overflow: hidden;
    }
    .design-detail .major-item .thumb .bg{
        object-fit: cover;
        aspect-ratio: none;
    }
    .design-detail .major-item .info{
        width:100%;
    }

    .matching-analysis .analysis-list{
        flex-direction: column;
        margin-top:20px;
    }
    
    .course-content{
        flex-direction: column;
    }
    .course-content .box-content{
        padding:20px;
    }

    .plan-mangement-text {
        background-image: none;
    }

    .compare-btn .btns{
        flex-direction: column;
    }
    .compare-section .compare-column{
        
    }

    .plan-compare {
        width: 100%;
        overflow-x: auto !important;
        overflow-y: visible; /* 세로 스크롤은 상위 요소에 의해 처리되도록 함 */
        -webkit-overflow-scrolling: touch; /* iOS에서 부드러운 스크롤 */
        scrollbar-width: none; /* Firefox에서 스크롤바 숨기기 */
        -ms-overflow-style: none; /* IE와 Edge에서 스크롤바 숨기기 */
        touch-action: pan-x pan-y; /* 수평 및 수직 스와이프 모두 활성화 */
        cursor: grab; /* 마우스 커서를 grab으로 변경하여 스와이프 가능함을 표시 */
    }
    
    .plan-compare::-webkit-scrollbar {
        display: none; /* Chrome, Safari, Opera에서 스크롤바 숨기기 */
    }

    .plan-compare .plan-compare-inner{
        width: 100%;
        min-width: 600px;
        border-collapse: collapse;
    }

    .plan-compare .select-plan .plan-item{
        padding: 0;
        border: 0;
        background-color: transparent;
    }
    .plan-compare .select-plan .plan-item .tag{
        flex-direction: column;
    }

    .plan-compare .my-plan{
        margin-top:50px;
        padding:20px;
        flex-direction: column;
        gap:20px;
    }

    /*직업3종 검사결과 */
    .analysis-detail .main-test-result .result-box{
        padding:20px;
    }
    .analysis-detail .main-test-result .result-box canvas{
        min-height: 300px;
    }


    /* 전공가이드 */
    .major-table-cell{
        padding:10px 20px !important;

    }
    

    /* 이용안내 */
    .ai-guide-wrap .ai-guide .service-desc{
        flex-direction: column;
    }
    .ai-guide-wrap .ai-guide .service-desc .title{
        width: 100%;
        font-size: 2rem;
        margin-bottom: 1rem;
    }
    .ai-guide-wrap .suho-step{
        margin-top:5rem;
        margin-bottom:0rem;
    }
    .suho-step .step-item .text>.step-desc{
        margin-top:1.5rem;
    }
    .suho-step .step-item .text{
        width: 100%;
    }
    .suho-step .step-item .img{
        display: none;
    }

    .ai-guide-wrap .suho-step{
        gap: 2rem;
    }

    .suho-step .step-item .inner-md{
        align-items: start;
        margin-bottom:4rem;
        min-height: 0;
    }

    .sub-header{
        height: calc((150 / 375) * 100vw);
    }
    .sub-header h2{
        font-size: 24px;
    }
    .sub-header p{
        font-size: 16px;
        line-height: 1.5em;
        margin-top: 10px;
    }
    #sub .page-title{
        margin:40px auto 30px;
    }
    #sub .page-title h3{
        font-size: 30px;
        line-height: 40px;
    }
    #sub section{
        padding:calc((60 / 375) * 100vw) 0;
    }
    
    /* sub_01 */
    .about-suho-wrap .suho-service .about-suho>span{
        font-size: 1rem;
        line-height: 1.46rem;
    }
    .about-suho-wrap .suho-service .about-suho>h4{
        font-size: 1.85rem;
        line-height: 1.5em;
        margin-top: 0.38rem;
    }
    .about-suho-wrap .suho-service .about-suho .banner{
        aspect-ratio: 339 / 150;
        border-radius: 0.77rem;
        padding: 1.54rem;
    }
    .about-suho-wrap .suho-service .about-suho .banner strong{
        font-size: 1.38rem;
        line-height: 1.5em;
    }
    .about-suho-wrap .suho-service .about-suho>p{
        font-size: 1rem;
        line-height: 1.46rem;
        margin-top: 1.54rem;
    }
    .about-suho-wrap .suho-service .bg{
        display: none;
    }
    .about-suho-wrap .suho-service .major-list{
        margin-top: 3.08rem;
        flex-direction: column;
        gap: 3.08rem;
    }
    .about-suho-wrap .suho-service .major-item .img img{
        height: calc((60 / 375) * 100vw);
    }
    .about-suho-wrap .suho-service .major-item .title{
        margin-top: 0.77rem;
        font-size: 1.54rem;
        line-height: 1.2em;
    }
    .about-suho-wrap .suho-service .major-item p{
        margin-top: 1.54rem;
        font-size: 1rem;
        line-height: 1.46rem;
    }
    .about-suho-wrap .suho-service .major-item .tag{
        margin-top: 1.54rem;
        gap: 0.38rem;
    }
    .about-suho-wrap .suho-service .major-item .tag li{
        font-size: 1rem;
        line-height: 1.85rem;
        padding: 0.38rem 0.77rem;
    }
    #sub .sec-header h3{
        font-size: 1.85rem;
        line-height: 1.5em;
    }
    #sub .sec-header p{
        font-size: 1rem;
        line-height: 1.46rem;
        margin-top: 0.77rem;
    }
    .about-suho-wrap .main-feature .sec-header{
        margin-bottom: 3.08rem !important;
    }
    .about-suho-wrap .main-feature .feature-list{
        gap: 1.54rem;
    }
    .about-suho-wrap .main-feature .feature-item{
        width: 100%;
        padding: 1.92rem;
    }
    .about-suho-wrap .main-feature .feature-item strong{
        font-size: 1.54rem;
    }
    .about-suho-wrap .main-feature .feature-item .dot{
        margin: 1.15rem 0;
    }
    .about-suho-wrap .main-feature .feature-item p{
        font-size: 1rem;
        line-height: 1.46rem;
    }
    .about-suho-wrap .main-feature .feature-current .info{
        padding: 1.92rem;
    }
    .about-suho-wrap .main-feature .feature-current .info strong{
        font-size: 1.54rem;
    }
    .about-suho-wrap .main-feature .feature-current .info p{
        font-size: 1rem;
        line-height: 1.46rem;
        margin-top: 0.77rem;
    }
    .about-suho-wrap .main-feature .feature-current .info .btn{
        padding: 0.38rem 1.15rem;
        margin-top: 2.31rem;
        font-size: 1rem;
        line-height: 1.46rem;
        width: auto;
        height: auto;
        display: inline-flex;
    }
    .about-suho-wrap .service-note{
        padding: 0 0 calc((60 / 375) * 100vw) !important;
    }
    .about-suho-wrap .service-note .banner{
        margin: 0 -4.8vw;
        border-radius: 0;
        padding: calc((60 / 375) * 100vw) 6.4vw;
        height: auto;
        gap: calc((60 / 375) * 100vw);
        margin-bottom: calc((60 / 375) * 100vw);
    }
    .about-suho-wrap .service-note .banner p{
        font-size: 1.85rem;
        line-height: 1.5em;
    }
    .about-suho-wrap .service-note .banner .btns{
        gap: 1.15rem;
        width: 100%;
    }
    .about-suho-wrap .service-note .banner .btn{
        width: 100%;
        height: auto;
        padding: 1.15rem;
        font-size: 1.23rem;
        gap: 0;
        line-height: 1.5em;
    }
    .about-suho-wrap .service-note .banner .btn i{
        width: 1.69rem;
        height: 1.69rem;
    }
    .about-suho-wrap .service-note .note-list{
        flex-direction: column;
        align-items: stretch;
        gap: 1.54rem;
    }
    .about-suho-wrap .service-note .note-list li{
        width: 100%;
        border-radius: 1.54rem;
        padding: 2.31rem;
        min-height: 100%;
        box-shadow: 0 0.38rem 1.54rem rgba(0,0,0,0.05);
    }
    .about-suho-wrap .service-note .note-list li .num span{
        font-size: 2.31rem;
        line-height: 1.5em;
    }
    .about-suho-wrap .service-note .note-list li .num::before{
        width: 3.08rem;
        transform: translate(-1.15rem, -0.38rem);
    }
    .about-suho-wrap .service-note .note-list li p{
        font-size: 1.23rem;
        line-height: 1.5em;
        margin-top: 1.25em;
    }
    .about-suho-wrap .service-note .circle.cir-1{
        display: none;
    }
    .about-suho-wrap .service-note .circle.cir-2{
        top: calc((304 / 375) * 100vw);
        bottom: initial;
    }
    .about-suho-wrap .service-note .circle.cir-2::before{
        border-width: calc((23 / 375) * 100vw);
        width: calc((112 / 375) * 100vw);
        height: calc((112 / 375) * 100vw);
    }
    .about-suho-wrap .service-note .circle.cir-2::after{
        border-width: calc((14 / 375) * 100vw);
        width: calc((42 / 375) * 100vw);
        height: calc((42 / 375) * 100vw);
    }
    .about-suho-wrap .service-note .circle.cir-3{
        width: calc((102 / 375) * 100vw);
        height: calc((102 / 375) * 100vw);
        bottom: 0;
    }
    
    
    .table thead th{
        font-size: 1rem;
        line-height: 1.45em;
        padding: 1.15rem 0.77rem;
    }
    .table tbody td{
        padding: 0.77rem;
        line-height: 1.46em;
    }
    
    .round-shadow-box{
        width: auto !important;
        margin: 1.54rem auto;
    }

    .round-shadow-box .box-title{
        font-size: 1.54rem;
        line-height: 1.2em;
    }
    #step-header{
        margin-top: 1.54rem;
        padding-top: 3.75rem;
    }
    #step-header .step-box{
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        transform: translate(0,0);
    }
    #step-header .step-box ul li{
        font-size: 1rem;
        line-height: 1.46em;
        gap: 0.38rem;
    }
    #step-header .step-box ul li+li{
        margin-left: 0.58rem;
        padding-left: 0.58rem;
        position: relative;
    }
    #step-header .step-box ul li+li::before{
        width: 1.08rem;
        height: 1.08rem;
    }
    #step-header .step-box ul li .num{
        width: 1.38rem;
        line-height: 1.38rem;
        font-size: 1rem;
    }
    #step-header h3{
        font-size: 1.85rem;
        line-height: 1.5em;
    }
    #step-header>p{
        font-size: 1rem;
        line-height: 1.46rem;
        margin-top: 0.38rem;
    }
    .select-major-item{
        display: block;
    }
    .select-major-item .thumb{
        width: 100%;
        aspect-ratio: 339 / 180;
        border: 0;
    }
    .select-major-item .info{
        width: 100%;
        padding: 1.54rem;
    }
    .select-major-item .info .title{
        font-size: 1.38rem;
        line-height: 1.69rem;
    }
    .select-major-item .info .tag{
        gap: 0.38rem;
        margin-top: 1.15rem;
    }
    .select-major-item .info .tag li{
        padding: 0.31rem 0.62rem;
        font-size: 0.92rem;
        line-height: 1.5em;
        border-radius: 0.38rem;
    }
    .select-major-item .info .summary{
        font-size: 1rem;
        line-height: 1.46em;
        margin-top: 1.15rem;
    }
    .select-major-item .info .department-site{
        font-size: 1rem;
        line-height: 1.46em;
        gap: 0.38rem;
        margin-top: 1.54rem;
    }
    .select-major-item .info .department-site .arrow-forward-white{
        width: 1.15rem;
        height: 1.15rem;
    }
    .select-major-item .info .select{
        right: 1.54rem;
        top: 1.54rem;
        font-size: 1.23rem;
        gap: 0.38rem;
        line-height: 1.46rem;
    }
    .select-major-item .info .select i{
        width: 1.23rem;
        height: 1.23rem;
    }
    
    .credit-detail{
        text-align: center;
    }
    .credit-detail ul{
        flex-wrap: wrap;
        font-size: 0.92rem;
        line-height: 1.5em;
        gap:5px 0;
    }
    .credit-detail ul li{
        width: 50%;
        box-sizing: border-box;
    }
    .credit-detail ul li:nth-child(odd){
        text-align: right;
        padding-right: 0.58rem;
    }
    .credit-detail ul li:nth-child(even){
        text-align: left;
        padding-left: 0.58rem;
    }
    .credit-detail ul li+li{
        margin-left: 0;
        padding-left: 0;
    }
    .credit-detail ul li:nth-child(2n+1){
        padding-left: 0;
        margin-left: 0;
    }
    .credit-detail ul li:nth-child(2n+1)::before{
        content: none;
    }
    .grade-credit .credit{
        right: 2.31rem;
    }
    .grade-credit .credit span{
        font-size: 1.08rem;
    }
    .expand-header .expand-btn{
        width: 1.54rem;
        height: 1.54rem;
        padding: 0 !important;
        transform: translate(0,0);
    }
    .expand-header .expand-btn i{
        width: 100%;
        height: 100%;
    }
    .expand-content{
        margin-top: 1.54rem;
        padding-top: 1.54rem;
    }
    
    /* sub_03 */
    .design-detail-wrap #step-header+section{
        margin-top: calc((-30 / 375) * 100vw);
    }
    .semester-creidt-design{
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 1.54rem;
    }
    .semester-box .semester-tit{
        margin-bottom: 1.54rem;
        font-size: 1.23rem;
        line-height: 1.5em;
        flex-direction: column;
    gap: 15px;
    }
    .table.semester-tb thead tr th:first-child, .table.semester-tb tr td:first-child{
        padding-left: 1.54rem;
    }
    .table.semester-tb .col-2{
        width: 25%;
    }
    .table.semester-tb .col-3{
        width: 20%;
    }
    .grade-credit .grade{
        gap: 1.54rem;
    }
    .grade-credit .grade>strong{
        font-size: 1.54rem;
    }
    .major-inform .credit-box{
        border: 0;
        padding: 0;
        margin-bottom: 1.54rem;
    }
    .credit-box .credit-completion-graph .graph .graph-track{
        height: 0.77rem;
    }
    .credit-box .credit-completion-graph{
        gap: 1.15rem;
    }
    .credit-box .credit-completion-graph .per{
        font-size: 1.54rem;
    }
    .major-inform .box-title{
        margin-bottom: 1.54rem;
        padding-bottom: 1.54rem;
    }
    .major-inform .content-box{
        margin-top: 0.77rem;
        padding: 1.54rem 1.15rem;
    }
    .major-inform .content-box .box-tit{
        gap: 0.38rem;
        font-size: 1.23rem;
        line-height: 1.46rem;
    }
    .major-inform .content-box .box-tit i{
        width: 1.23rem;
        height: 1.23rem;
    }
    .major-inform .content-box .box-content{
        line-height: 1.46em;
        margin-top: 0.58em;
    }
    .curriculum-note{
        flex-direction: column;
        text-align: center;
        margin-top: 3.08rem;
    }
    .curriculum-note .text p{
        flex-direction: column;
        font-size: 1.23rem;
    }
    .curriculum-note .btns{
        margin-top: 1.54rem;
        gap: 1.15rem;
        width: 100%;
    }
    .curriculum-note .btns .btn{
        height: 3.46rem;
        width: 100%;
        gap: 0.38rem;
        font-size: 1.08rem;
    }
    .curriculum-note .btns .btn i{
        width: 1.54rem;
        height: 1.54rem;
    }
    .planner-btm-btns{
        flex-direction: column;
        gap: 0.77rem;
        padding-top: 1.53rem;
        margin-top: 1.53rem;
    }
    .planner-btm-btns .btn{
        height: 3.46rem;
        font-size: 1.08rem;
        border-radius: 0.77rem;
    }
    .planner-btm-btns .btn-left, .planner-btm-btns .btn-right{
        flex-wrap: wrap;
        width: 100%;
    }
    .planner-btm-btns .btn-left{
        gap: 1.54rem 1.15rem;
    }
    .planner-btm-btns .btn-left .btn{
        width: calc((100% - 1.15rem) / 2);
    }
    .planner-btm-btns .btn-left .btn:last-child{
        width: 100%;
    }
    .planner-btm-btns .btn-right .btn{
        width: 100%;
    }
    
}

/* 2556줄부터 */
.tab-container .tab-list {
    display: flex;
    margin-bottom: 40px;
}

.tab-container .tab-list li {
    flex: 1;
}

.tab-container .tab-btn {
    display: block;
    width: 100%;
    height: 60px;
    line-height: 58px;
    border: 1px solid #ddd;
    font-size: 18px;
    color: #666;
    text-align: center;
    background: #fff;
    transition: all 0.3s;
}

.tab-container .tab-btn.cur {
    background: #043285;
    border-color: #043285;
    color: #fff;
}

.tab-container .tab-item {
    display: none;
}

.tab-container .tab-item.cur {
    display: block;
}

/* 반응형 스타일 */
@media screen and (max-width: 1024px) {
    .tab-container .tab-btn {
        height: 50px;
        line-height: 48px;
        font-size: 16px;
    }
}

@media screen and (max-width: 768px) {
    .tab-container .tab-list {
        margin-bottom: 30px;
    }
    
    .tab-container .tab-btn {
        height: 45px;
        line-height: 43px;
        font-size: 15px;
    }
}


/* AI 매칭 스타일 */
.ai-matching {
    display: inline-flex;
    align-items: center;
    padding: 5px 15px;
    background-color: #fff;
    border: 1px solid #e1e1e1;
    border-radius: 30px;
    color: #777;
    font-size: 0.875rem;
    margin-right: 10px;
}

.ai-matching em {
    font-weight: 700;
    font-style: normal;
    margin-left: 5px;
}

.department-item .info .btn{
    margin-top: 20px;
    gap:2px;
    color:var(--primary-color);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.3125em;
    display: inline-flex;
}

/* 교수 상세정보 모달 */
#professorModal {
  display: none;
  position: fixed;
  z-index: 2000;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0,0,0,0.5); /* 검정 반투명 */
  justify-content: center;
  align-items: center;
}
#professorModal .modal-content {
  position: relative;
  background: #fff;
  border-radius: 50px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.18);
  margin: 0 auto;
  top: 10%;
  
  min-width: 320px;
  max-width: 1140px;
  padding: 0;
  
}
#professorModal .close {
  position: absolute;
  top: -12px;
  right: -12px;
  width: 44px;
  height: 44px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: #222;
  cursor: pointer;
  border: none;
  z-index: 10;
  transition: box-shadow 0.2s;
}
#professorModal .close:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.22);
  background: #f5f5f5;
  color: #000;
}

/* 교수/교과목/FAQ 상세정보 모달 (공통) */
#professorModal,
#majorInfoModal,
#faqQnaModal {
  display: none;
  position: fixed;
  z-index: 2000;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0,0,0,0.5); /* 검정 반투명 */
  justify-content: center;
  align-items: center;
}
#professorModal .modal-content,
#majorInfoModal .modal-content,
#faqQnaModal .modal-content {
  position: relative;
  background: #fff;
  border-radius: 50px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.18);
  margin: 0 auto;
  top: 10%;
  min-width: 320px;
  max-width: 1140px;
  padding: 0;
}
#professorModal .close,
#majorInfoModal .close,
#faqQnaModal .close {
  position: absolute;
  top: -12px;
  right: -12px;
  width: 44px;
  height: 44px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: #222;
  cursor: pointer;
  border: none;
  z-index: 10;
  transition: box-shadow 0.2s;
}
#professorModal .close:hover,
#majorInfoModal .close:hover,
#faqQnaModal .close:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.22);
  background: #f5f5f5;
  color: #000;
}

#faq-wrap .faq-item{
    border:1px solid #e1e1e1;
    padding:30px 40px;
    margin-bottom: 30px;
}

#kboard-default-document .kboard-content .content-view {
    font-size: 1.125rem;
    line-height: 1.7;
    color: var(--text-color);
    word-break: keep-all;
}

#kboard-default-document .kboard-content .content-view p {
    margin: 1.2em 0;
    font-size: 1.125rem;
    line-height: 1.7;
    color: var(--text-color);
}

#kboard-default-document .kboard-content .content-view h3 {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 2em 0 1em 0;
    color: var(--primary-color);
    line-height: 1.3;
    border-left: 4px solid var(--primary-color);
    padding-left: 0.7em;
}

#kboard-default-document .kboard-content .content-view strong{
    font-weight: bold;
}

#kboard-default-document .kboard-content .content-view ul {
    margin: 1.2em 0 1.2em 1.2em;
    padding: 0;
    list-style: disc inside;
}

#kboard-default-document .kboard-content .content-view ul li {
    margin-bottom: 0.5em;
    font-size: 1.125rem;
    line-height: 1.7;
    color: var(--gray-dark);
    position: relative;
    padding-left: 0.5em;
}

#kboard-default-document .kboard-content .content-view table {
    width: 100%;
    border-collapse: collapse;
    margin: 2em 0;
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0px 5px 20px 0px #0000000D;
    font-size: 1rem;
}

#kboard-default-document .kboard-content .content-view table th,
#kboard-default-document .kboard-content .content-view table td {
    border: 1px solid var(--gray-light);
    padding: 1em 0.7em;
    text-align: center;
    vertical-align: middle;
    font-size: 1rem;
    line-height: 1.5em;
}

#kboard-default-document .kboard-content .content-view table th {
    background: var(--gray-light);
    font-weight: 700;
    color: var(--text-color);
}

#kboard-default-document .kboard-content .content-view table tr:nth-child(even) td {
    background: #f9f9fb;
}

@media (max-width: 768px) {
    #kboard-default-document .kboard-content .content-view h3 {
        font-size: 1.2rem;
        padding-left: 0.5em;
    }
    #kboard-default-document .kboard-content .content-view table,
    #kboard-default-document .kboard-content .content-view table th,
    #kboard-default-document .kboard-content .content-view table td {
        font-size: 0.95rem;
        padding: 0.7em 0.4em;
    }
}