﻿:root {
    --container-padding: 30px;
    --primary: #6293ff;
    --red: #DA4D4F;
    --green: #11B511;
    --basic-navy: #000;
    --light-navy: #004381;
    /* --basic-ylw: #FFE500; */
    --basic-ylw: #798CD1;
    --light-ylw: #FBF8DC;
    --sky: #eef7ff;
    --bright: #E5E5E5 ;
    --light-mint: #E6F9FD;
    --light-purple: #F2F1FF;
    --light-pink: #FFEFF4;
    --mint: #2FC6E0;
    --purple: #5651E4;
    --brw: #AD7600;
    --gap: 4px;
    --fc-small-font-size: .85em;
    --fc-page-bg-color: #fff;
    --fc-neutral-bg-color: hsla(0, 0%, 82%, .3);
    --fc-neutral-text-color: grey;
    --fc-border-color: #ddd;
    --fc-button-text-color: #fff;
    --fc-button-bg-color: #2c3e50;
    --fc-button-border-color: #2c3e50;
    --fc-button-hover-bg-color: #1e2b37;
    --fc-button-hover-border-color: #1a252f;
    --fc-button-active-bg-color: #1a252f;
    --fc-button-active-border-color: #151e27;
    --fc-event-bg-color: #3788d8;
    --fc-event-border-color: #3788d8;
    --fc-event-text-color: #fff;
    --fc-event-selected-overlay-color: rgba(0, 0, 0, .25);
    --fc-more-link-bg-color: #d0d0d0;
    --fc-more-link-text-color: inherit;
    --fc-event-resizer-thickness: 8px;
    --fc-event-resizer-dot-total-width: 8px;
    --fc-event-resizer-dot-border-width: 1px;
    --fc-non-business-color: hsla(0, 0%, 84%, .3);
    --fc-bg-event-color: #8fdf82;
    --fc-bg-event-opacity: 0.3;
    --fc-highlight-color: rgba(188, 232, 241, .3);
    --fc-today-bg-color: rgba(255, 220, 40, .15);
    --fc-now-indicator-color: red;
}



@media(max-width: 767.98px) {
    :root {
        --gap: 2px;
        --container-padding: 15px
    }
}

.skip ul {margin:0; padding:0; list-style:none; z-index:100;}
.skip ul a {position:absolute; left:-100%;}
.skip ul a:focus {display:block; width:100%; height:30px; line-height:30px; top:0; left:0; background:#920400; color:#fff; text-align: center; z-index:9999;}
.container{width:100%;max-width: 1740px;margin:0 auto;padding:0 var(--container-padding);}
.bodyFixed {position:fixed; overflow:hidden; width:100%; height:100%;}
.dim {display:none; position:fixed; width:100%; height:100%; left:0; top:0; background: rgba(0, 0, 0, 0.7); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4d000000', endColorstr='#4d000000',GradientType=0); /* IE6-9 */ z-index:101;}

@media (min-width: 1241px){
	.mobile{display: none !important;}
}

@media (max-width: 1240px){
	.pc{display: none !important}
	:root{
		--container-padding: 15px;
	}
}
/* html{font-size: 62.5%;scroll-behavior: smooth;} */
body {padding:0;margin:0;font-family:'SUIT', 'Noto Sans KR', 'Arial', AppleGothic, 'dotum', '돋움', sans-serif;line-height: 1.5;color:#333;-webkit-font-smoothing: antialiased;-webkit-text-size-adjust:100%;letter-spacing: -.02em;font-size: 14px;}


.ico.icoDown02 {
    display: inline-block;
    width: 14px;
    height: 13px;
    margin-right: 9px;
    background: url("../img/pc/common/ico/icoDown02.png") no-repeat center;
    vertical-align: top
}

.ico.arrUp01 {
    background: url("../img/pc/common/ico/icoArr02top.png") no-repeat center
}

.ico.arrDown01 {
    background: url("../img/pc/common/ico/icoArr02down.png") no-repeat center
}

.ico.icoTel {
    background: url("../img/pc/contents/ico/icoTel.png") no-repeat center
}

.ico.icoMail {
    background: url("../img/pc/contents/ico/icoMail.png") no-repeat center
}

.ico.icoTalk {
    background: url("../img/pc/contents/ico/icoTalk01.png") no-repeat center
}

.ico.icoExtend {
    background: url("../img/pc/contents/ico/icoExtend.png") no-repeat center
}

.ico.icoPlay {
    background: url("../img/pc/contents/ico/icoPlay02.png") no-repeat center
}

.ico.icoBrochure {
    background: url("../img/pc/contents/ico/icoBrochure.png") no-repeat center
}

.ico.icoOutsideL {
    background: url("../img/pc/contents/ico/icoOutsideL.png") no-repeat center
}

.ico.icoFacebook {
    background: url("../img/pc/contents/ico/icoFacebook.png") no-repeat center
}

.ico.icoYouTube {
    background: url("../img/pc/contents/ico/YouTube.png") no-repeat center
}

.ico.icosint {
    background: url("../img/pc/contents/ico/icosint.png") no-repeat center
}

.ico.icoBlog {
    background: url("../img/pc/contents/ico/icoBlog.png") no-repeat center
}

.ico.icoInquiry {
    display: inline-block;
    overflow: hidden;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 50%;
    background: #4c61a9 url("../img/pc/contents/ico/icoInquiry.png") no-repeat center;
    background-size: 100%;
    text-indent: 100%;
    outline: none;
    cursor: pointer;
    white-space: nowrap
}

.mobileTit01 {
    display: block;
    font-size: 12px;
    font-size: 1.2rem;
    font-weight: 500;
    color: #555
}


.icon,.ico {
    display: inline-block;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    /*text-indent: -9999px;*/
    vertical-align: middle;
    /* width: 20px;
    height: 20px; */
    overflow: hidden;
    border: 0;
    background-color: rgba(0,0,0,0);
    color: rgba(0,0,0,0)
}
.otherList .icon{
    display: inline-block;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    /*text-indent: -9999px;*/
    vertical-align: middle;
    width: 20px;
    height: 20px;
    overflow: hidden;
    border: 0;
    background-color: rgba(0,0,0,0);
    color: rgba(0,0,0,0)
}


@media (min-width: 768px){
	body{font-size: 16px;}
}

.location {
    display: flex;
    justify-content: center;
    color: #fff;
    margin-bottom: 1em;
    font-weight: 700;
    padding: 0 var(--container-padding);
    flex-wrap: wrap;
    line-height: 1.5em;
}


.location li+li {
    padding-left: 1.25em;
    position: relative;
    line-height: 1.5em
}

.location li+li::before {
    content: "";
    position: absolute;
    width: .25em;
    height: .25em;
    border-radius: 100%;
    background: #fff;
    top: .63em;
    left: .5em
}


.subTopTitWrap {
    height: 350px;
    background: url("/assets/img/sub_img_01.jpg") no-repeat 50% 50%/cover;
    text-align: center;
    display: flex;
    flex-direction: column-reverse;
    justify-content: center;
    align-items: center
}
.subTopTitWrap .subTit {
    font-size: 60px;
    color: #fff;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.05em
}
.contW { margin-top: 100px; }

@media(max-width: 1240.98px) {
    .subTopTitWrap .subTit {
        font-size:40px
    }
}

@media(max-width: 767.98px) {
    .subTopTitWrap {
        height:200px
    }

    .subTopTitWrap .subTit {
        font-size: 30px
    }
}

.subContW {
    position: relative;
    padding-top: 80px;
    padding-bottom: 80px
}

.subContW:has(.univ-history) {
    padding-bottom: 0
}

@media(min-width: 1241px) {
    .subContW {
        display:flex;
        max-width: 1836px;
        align-items: flex-start
    }
}

@media(max-width: 767.98px) {
    .subContW {
        padding-top:40px
    }
}

.subMainW {
    flex: 1;
    max-width: 1240px;
    margin: 0 auto
}

@media(min-width: 1600px) {
    .lnbW~.subMainW {
        margin:0
    }
}

.subMainW-top {
    display: flex;
    align-items: center;
    margin-bottom: 50px
}

@media(max-width: 767.98px) {
    .subMainW-top {
        margin-bottom:25px
    }
}

.subMainW-top .icon {
    width: 36px;
    height: 36px
}

.subMainW-title-area {
    display: flex
}

.subMainW-title {
    font-size: 46px;
    color: #002445;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -.03em
}

.subMainW-info {
    font-size: 18px;
    color: #c43e25;
    letter-spacing: -.03em;
    margin-left: .3em;
    margin-top: .3em
}

@media(max-width: 1240.98px) {
    .subMainW-title {
        font-size:30px
    }

    .subMainW-info {
        font-size: 14px
    }
}

@media(min-width: 1241px) {
    .lnbW {
        flex-shrink:0;
        flex-basis: 270px;
        max-width: 270px;
        margin-right: 30px;
        background: #002445;
        border-radius: 24px;
        color: #fff;
        padding: 24px 16px;
        line-height: 1.5;
        font-size: 18px;
        font-weight: 700;
        position: sticky;
        top: 184px
    }
}

@media(min-width: 1241px)and (min-width: 1600px) {
    .lnbW {
        margin-right:5.5%
    }
}

@media(min-width: 1241px) {
    .lnbTit {
        font-size:24px;
        text-align: center;
        display: block;
        margin-bottom: 16px
    }

    .lnb .depth2 {
        background: rgba(255,255,255,.08);
        padding: 8px;
        border-radius: 16px
    }

    .lnb .depth2>li+li {
        margin-top: 4px
    }

    .lnb .depth2 a {
        display: block;
        padding: 8px 10px;
        border-radius: 8px;
        font-weight: 500
    }

    .lnb .depth2>.on>a {
        font-weight: 700;
        background: var(--primary)
    }

    .lnb>li+li {
        margin-top: 8px
    }

    .lnb>li:not(.on) .depth2 {
        display: none
    }

    .lnb>li:has(.depth2)>a {
        background: none !important
    }

    .lnb>li:has(.depth2)>a::after {
        content: "";
        width: 24px;
        height: 24px;
        background: url(../img/renewal/plus.svg) no-repeat
    }

    .lnb>li>a {
        padding: 8px 12px;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        word-break: keep-all;
        border-radius: 8px;
        font-weight: 600;
        letter-spacing: -0.05em
    }

    .lnb>li.on>a {
        background: var(--primary);
        font-weight: 700
    }

    .lnb>li.on>a::after {
        background-image: url(../img/renewal/minus.svg) !important
    }
}

@media(max-width: 1240.98px) {
    .lnbW {
        display:none
    }
}
.bredcrumb {
    display: flex;
    margin-top: -60px;
    margin-bottom: 60px;
    padding: .5em;
    border-radius: 2em;
    background: var(--basic-navy);
    color: #fff;
    align-items: center;
    position: sticky;
    top: 144px;
    z-index: 50
}

.bredcrumb .icon-home {
    width: 3em;
    height: 3em;
    background-image: url(/assets/img/icon/home.svg);
    border-radius: 100%
}

.bredcrumb .dropdown, .dropdown1 {
    height: 3em
}

.bredcrumb .dropdown:before {
    content: "";
    position: absolute;
    right: 0;
    height: .6em;
    top: 50%;
    margin-top: -0.3em;
    border: 1px solid #b6b6b6
}

.bredcrumb .dropdown:last-child::before {
    display: none
}

.bredcrumb .dropdown-toggle, .dropdown-toggle1 {
    color: #fff;
    font-size: 1.1em;
    padding: 0 1.3em;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .9em
}

.bredcrumb .dropdown-toggle:after {
    content: "";
    width: 1.1em;
    height: 1.1em;
    background: url(/assets/img/icon/arw-dwon.svg) no-repeat 100% 50%;
    border: 0;
    flex-shrink: 0
}

.bredcrumb .dropdown-menu {
    min-width: 100%;
    top: 100% !important;
    left: 0 !important;
    margin-top: 1em;
    transform: none !important;
    font-size: 1em;
    padding: .75em;
    border-radius: 1em;
    border-color: #e5e5e5;
    max-height: 40vh;
    overflow-y: auto
}

.bredcrumb .dropdown-menu a {
    display: block;
    padding: .75em;
    border-radius: .5em;
    color: #555;
    line-height: 1.1;
    white-space: nowrap
}

.bredcrumb .dropdown-menu .active>a {
    background: #f6f6f6;
    color: #111
}

@media(max-width: 1240.98px) {
    .bredcrumb {
        margin-bottom:30px;
        margin-top: -60px;
        top: 136px
    }

    .bredcrumb .icon-home {
        display: none
    }

    .bredcrumb .icon-home+.dropdown:not(:last-child) {
        display: none
    }

    .bredcrumb .dropdown {
        height: 2em
    }

    .bredcrumb .dropdown .dropdown-menu {
        min-width: 200px
    }

    .bredcrumb .dropdown-toggle {
        font-size: 1em;
        padding: 0 1em;
        text-align: left;
        line-height: 1.1
    }

    .bredcrumb .dropdown:last-child .dropdown-toggle,.bredcrumb .dropdown:last-child .dropdown-menu a {
        white-space: normal
    }
}

@media(max-width: 767.98px) {
    .bredcrumb {
        top:96px
    }
}

.tblScrW {
    position: relative
}

.tblScrW+form {
    margin-top: calc(var(--gap)*12)
}

.tblScrW:has(.nav) {
    white-space: nowrap;
    margin-bottom: 3em;
}

@media(max-width: 1240.98px) {
    .tblScrW .tblScr {
        overflow:auto;
        width: 100%
    }

    .tblScrW .nav-tabs {
        white-space: nowrap;
        flex-wrap: nowrap;
        overflow-x: auto
    }
}

@media(max-width: 767.98px) {
    .tblScrW:before {
        content:"";
        position: absolute;
        top: 16px;
        right: 0;
        width: 40px;
        height: 16px;
        background: url("../img/icoScroll.jpg") no-repeat center;
        background-size: 100%;
        pointer-events: none
    }

    .tblScrW:has(.tb-board)::before {
        display: none
    }

    .tblScrW:has(.nav)::before {
        top: 0;
        opacity: .5
    }
}

.nav-tabs {
    border: 0;
    display: flex;
    background: #f4f4f4;
    border-radius: 12px
}

.nav-tabs>li {
    flex: 1;
    margin-bottom: 0;
    float: none;
    position: relative
}

.nav-tabs>li>.nav-link {
    padding: 1em 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    text-align: center;
    font-weight: 700;
    color: #6c6c6c;
    border: 2px solid rgba(0,0,0,0) !important;
    border-radius: 12px;
    margin: 0
}

@media(min-width: 1600px) {
    .nav-tabs>li>.nav-link {
        font-size:1.2rem;
        border-width: 3px !important
    }
}

.nav-tabs>li.active>.nav-link,.nav-tabs>li .nav-link.active {
    background: #fff;
    color: var(--primary) !important;
    border: 2px solid var(--primary) !important;
    position: relative;
    z-index: 1
}

.nav-line {
    gap: 1em
}

.nav-line .nav-link {
    font-size: 1.5em;
    font-weight: 700;
    color: #6c6c6c;
    padding: 0 0 .25em;
    line-height: 1.1;
    border-bottom: 2px solid rgba(0,0,0,0)
}

.nav-line .nav-link.active {
    color: var(--primary);
    border-bottom-color: var(--primary)
}

.modal .nav-line {
    margin: -1em 0 2em
}

.nav-btns {
    gap: 8px
}

.nav-btns .nav-link {
    padding: .75em 1.25em;
    font-size: 1.125em;
    font-weight: 600;
    color: #6c6c6c;
    background-color: #f4f4f4;
    border-radius: 500px
}

.nav-btns .nav-link.active {
    color: #fff;
    background-color: var(--primary)
}

.nav-dotted {
    align-items: start;
    margin-top: 24px;
    gap: 16px
}

.nav-dotted li:first-of-type .nav-link {
    padding-left: 0
}

.nav-dotted li:last-of-type .nav-link::after {
    display: none
}

.nav-dotted .nav-link {
    position: relative;
    padding-left: 0;
    padding-right: 16px;
    padding-bottom: 10px;
    color: #999
}

.nav-dotted .nav-link::after {
    content: "";
    position: absolute;
    display: block;
    background: #ddd;
    width: 1px;
    height: 16px;
    top: 28%;
    right: 0
}

.nav-dotted .nav-link.active {
    color: var(--primary)
}

.nav-dotted .nav-link.active.label {
    color: #fff !important
}

.nav-dotted .nav-link.active::before {
    content: "";
    position: absolute;
    display: block;
    background: var(--primary);
    width: calc(100% - 12px);
    height: 3px;
    left: 0;
    bottom: 0px
}

.nav-dotted .label {
    padding: 4px 6px;
    border-radius: 6px
}

@media(max-width: 767.98px) {
    .nav-dotted .nav-link::after {
        top:22%
    }
}

.sticky {
    position: sticky !important;
    top: 152px;
    z-index: 10
}

.sticky.tblScrW {
    white-space: nowrap
}

@media(max-width: 1240.98px) {
    .sticky {
        top:144px
    }

    .sticky .nav-tabs {
        white-space: nowrap;
        flex-wrap: nowrap;
        overflow-x: auto
    }
}

@media(max-width: 767.98px) {
    .sticky {
        top:106px
    }

    .sticky:before {
        top: 0;
        opacity: .5
    }
}

.nav-top {
    z-index: 10
}

.nav-top .container {
    max-width: calc(1240px + var(--container-padding)*2)
}

@media(min-width: 1241px) {
    .nav-top .nav-pills {
        flex-wrap:wrap
    }
}








.major-spec {
    margin-top: 1.5em
}

.major-spec dl {
    display: flex;
    flex-direction: column;
    height: 100%
}

.major-spec dt,.major-spec dd {
    border-radius: 16px
}

.major-spec .label {
    font-size: 20px;
    padding: 16px 24px;
    text-align: center
}

.major-spec dd {
    margin-top: 8px;
    padding: 1.5em;
    background-color: #f4f4f4;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-weight: 500
}

.major-spec dd ul {
    font-weight: 600;
    width: 100%
}

.major-spec>div {
    margin-bottom: 1rem
}

.major-spec.skills>* {
    font-weight: 500
}

@media(max-width: 991.98px) {
    .major-spec>div {
        margin-bottom:0
    }

    .major-spec .label {
        font-size: 16px;
        padding: 12px
    }
}

@media(max-width: 991.98px) {
    .major-spec {
        gap:16px;
        margin-top: 8px
    }
}

.major-data {
    padding: 0;
    background: rgba(0,0,0,0)
}

.major-data .major-banner-btm {
    margin-top: 0
}

.major-data .bt.radius {
    border-radius: 12px
}

.major-section {
    display: flex;
    gap: 1.5em;
    align-items: flex-start
}

.major-section .img-wrap {
    position: relative;
    flex: 1
}

.major-section .img-wrap img {
    min-height: 100%;
    object-fit: cover
}

.major-section .major-image {
    height: 100%
}

@media(max-width: 1240.98px) {
    .major-section {
        flex-direction:column
    }

    .major-section .major-image {
        height: auto
    }
}

.major-image {
    position: relative
}

.major-image img {
    border-radius: 500px;
    width: 100%
}

@media(max-width: 1599.98px) {
    .major-image img {
        border-radius:4em
    }
}

@media(max-width: 767.98px) {
    .major-image img {
        border-radius:32px
    }
}

.major-image .major-link {
    left: 2em;
    bottom: 2em
}

@media(max-width: 767.98px) {
    .major-image .major-link {
        left:20px;
        bottom: 20px
    }
}

.major-title {
    position: absolute;
    top: 24px;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px
}

.major-title .tit04 {
    padding: .5em 1em;
    min-width: 8.75em;
    background: var(--basic-ylw);
    text-align: center;
    border-radius: 2em;
    position: relative;
    color: #fff
}

.major-title .tit04:after {
    content: "";
    position: absolute;
    width: 14px;
    height: 13px;
    bottom: 0;
    right: 100%;
    background: url(../img/renewal/main/tail.svg) no-repeat 0 0/100% auto
}

@media(max-width: 767.98px) {
    .major-title .tit04 {
        font-size:14px;
        min-width: 0
    }
}

@media(max-width: 1599.98px) {
    .major-title {
        top:-20px
    }

    .major-title .tit04 {
        min-width: unset
    }

    .major-title .label {
        display: none
    }
}

.major-info {
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .5em
}

@media(max-width: 1240.98px) {
    .major-info {
        margin-top:12px;
        position: static
    }
}

.major-info>p {
    line-height: 1.25em;
    color: var(--primary);
    padding: .8em 1em;
    border-radius: 2em;
    background: #eee;
    font-weight: 700
}

@media(max-width: 1599.98px) {
    .major-info>p {
        flex:1;
        display: flex;
        align-items: center;
        border-radius: 3em;
        width: 100%;
        text-align: center;
        justify-content: center
    }
}

.major-text {
    flex: 1
}

.major-text .major-banner {
    --size: 56px;
    margin-bottom: 0;
    background-image: url(../img/renewal/major/bn.png);
    background-size: auto;
    background-position-y: 70%;
    background-position-x: 90%;
    display: flex;
    flex-direction: column
}

.major-text .major-banner .link-wrap {
    margin-top: auto
}

@media(max-width: 767.98px) {
    .major-text .major-banner {
        --size: 24px;
        min-height: 0
    }
}

.major-text .label-wrp {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: .5em;
    padding-top: 2em
}

@media(max-width: 767.98px) {
    .major-text .label-wrp {
        padding-top:1em
    }
}

.major-text .label {
    padding: .5em 1em;
    border-radius: .75em;
    font-size: inherit;
    font-weight: 800 !important;
    color: var(--basic-navy) !important
}

.major-text .desc {
    margin: 1em 0
}

.major-details .icon.window {
    width: 20px;
    height: 20px;
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(100%) hue-rotate(0deg) brightness(100%) contrast(100%)
}

.major-bx {
    height: 100%;
    margin-bottom: 24px
}

.major-bx .tit-bx {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.333em 1.667em;
    border-radius: 12px;
    margin-bottom: 0
}

.major-bx .bubble,.major-bx .bx-gray {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    min-height: 78px
}

.major-bx .bubble.expanded,.major-bx .bx-gray.expanded {
    min-height: 108px
}

.major-bx .bubble {
    border-radius: 12px
}

.major-bx .bx-wrp {
    height: 100%;
    margin-bottom: 0
}

.major-bx .bx-wrp>div+div {
    margin-top: 8px
}

@media(max-width: 991.98px) {
    .major-bx {
        margin:16px 0
    }

    .major-bx .tit-bx {
        padding: 24px;
        width: 100%
    }
}

@media(max-width: 767.98px) {
    .major-bx .bubble,.major-bx .bx-gray {
        min-height:100px;
        font-size: 14px;
        padding: 12px
    }

    .major-bx .bubble.expanded,.major-bx .bx-gray.expanded {
        min-height: 120px
    }
}

.major .link-wrap {
    display: flex;
    align-items: center
}

.major .link-wrap .sns {
    display: flex;
    flex: 1;
    gap: 8px
}

.major .link-wrap .sns .icon {
    width: 2.5em;
    height: 2.5em
}

.major .link-wrap .sns .icon.kakao {
    background-image: url(../img/renewal/major/icon-kakao.svg)
}

.major .link-wrap .sns .icon.ytb {
    background-image: url(../img/renewal/major/icon-ytb.svg)
}

.major .link-wrap .sns .icon.facebook {
    background-image: url(../img/renewal/major/icon-facebook.svg)
}

.major .link-wrap .sns .icon.insta {
    background-image: url(../img/renewal/major/icon-insta.svg)
}

.major .link-wrap .sns .icon.blog {
    background-image: url(../img/renewal/major/icon-blog.svg)
}

@media(max-width: 767.98px) {
    .major .link-wrap {
        flex-direction:column;
        align-items: flex-start;
        gap: 12px
    }

    .major .link-wrap .bt {
        width: 100%
    }
}

.major .nav-pills {
    margin-top: 1.5em
}


.nav-pills {
    display: flex;
    justify-content: start;
    flex-wrap: nowrap;
    gap: .5em;
    overflow-x: auto
}
.nav-pills li a {
    display: block;
    padding: .65em 1.2em;
    color: #6c6c6c;
    font-size: 1rem;
    font-weight: 700;
    background-color: #f4f4f4;
    border-radius: 500px;
    text-wrap: nowrap
}

.nav-pills .nav-link{ border-radius: 5rem   }

.nav-pills li a.active {
    color: #fff;
    background-color: var(--primary)
}

@media(max-width: 767.98px) {
    .nav-pills li a {
        /* font-size:14px;
        padding: .4em 1em */
    }
}


.nav-top .nav-link {
    border-radius: 500px;
}

.nav-top:not(.tblScrW) .nav {
    flex-wrap: wrap
}

.major .bubble-wrap {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2em 1.5em;
    margin-bottom: 1.25em;
    /* background-color: var(--basic-navy); */
    background: #174097!important;
    border-radius: 500px;
    margin-bottom: 2.75em;
    text-align: center
}

.major .bubble-wrap::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 160px;
    height: 100%;
    background: url(../img/renewal/major/bubble-bg.png) no-repeat center/contain;
    opacity: .12
}

.major .bubble-wrap.ylw {
    background-color: var(--basic-ylw) !important
}

.major .bubble-wrap.ylw .bubble {
    background-color: var(--basic-ylw) !important
}

.major .bubble-wrap.ylw::after {
    opacity: .6
}

.major .bubble-wrap.ylw .bubble-tail {
    background-image: url(../img/renewal/major/tail-ylw.png)
}

.major .bubble-wrap.ylw .bubble-body {
    color: #111 !important
}

.major .bubble-wrap.primary {
    background-color: var(--primary)
}

.major .bubble-wrap.primary .bubble-tail {
    background-image: url(../img/renewal/major/tail-primary.png);
    bottom: -20px
}

.major .bubble-wrap.mint {
    background: #2fc6e0 !important
}

.major .bubble-wrap.mint::after {
    opacity: .2
}

.major .bubble-wrap.mint .bubble-body {
    background: #2fc6e0 !important
}

.major .bubble-wrap.mint .bubble-tail {
    background: url(../img/renewal/major/tail-mint.png) no-repeat 0 0/contain
}

.major .bubble-wrap.mint+.goal {
    padding-bottom: 24px;
    background: none
}

.major .bubble-wrap.mint+.goal::after {
    display: none
}

.major .bubble-wrap .bubble {
    padding: 0
}

.major .bubble-wrap .bubble-tail {
    position: absolute;
    width: 34px;
    height: 23px;
    background: url(../img/renewal/major/tail-dark.png) no-repeat 0 0/contain;
    left: 50%;
    bottom: -47px;
    transform: translateX(-50%);
    top: unset
}

.major .bubble-wrap .bubble-tail.top {
    top: -47px;
    transform: translateX(-50%) rotate(180deg)
}

.major .bubble-wrap .bubble-body {
    position: relative;
    color: #fff;
    z-index: 1
}

@media(max-width: 991.98px) {
    .major .bubble-wrap {
        padding:24px 16px;
        margin-bottom: 24px
    }

    .major .bubble-wrap .bubble-tail {
        width: 27px;
        height: 16px;
        bottom: -34px
    }

    .major .bubble-wrap .bubble-tail.top {
        top: -34px
    }
}

@media(max-width: 767.98px) {
    .major .bubble-wrap::after {
        width:90px;
        background-image: url(../img/renewal/major/bubble-bg-mo.png)
    }
}

@media(min-width: 992px) {
    .major .list-wrap {
        padding:1em 0
    }
}

@media(max-width: 1240.98px) {
    .major .list-wrap .major-spec div:nth-of-type(odd) dt {
        background:var(--basic-navy) !important
    }

    .major .list-wrap .major-spec div:nth-of-type(even) dt {
        background: var(--primary) !important
    }
}

.major .page-logo {
    margin: 3em 0;
    text-align: center
}

@media(max-width: 991.98px) {
    .major .page-logo {
        margin:32px 0
    }
}

.major .goal {
    position: relative;
    display: flex;
    padding-bottom: 100px;
    margin-top: 24px
}

.major .goal::after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 320px;
    background: url(/assets/img/bg-goal.png) no-repeat center/contain;
    bottom: 0;
    z-index: -1
}

.major .goal.bg-none {
    padding-bottom: 0;
    background: none
}

.major .goal.bg-none::after {
    background: none
}

.major .goal .bx {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    text-align: center;
    border-radius: 31.25em;
    color: #002445;
    color: #fff;
    min-height: 160px
}

.major .goal .bx.bg-primary {
    background: rgba(0,36,69,.9) !important
}

.major .goal .bx.bg-primary {
    background: rgba(16,135,245,.9) !important
}

.major .goal .bx.bg-yellow {
    background: rgba(255,214,0,.8) !important;
    color: #002445
}

.major .goal .bx:nth-of-type(2) {
    margin: 0 -2.5em
}

@media(max-width: 991.98px) {
    .major .goal {
        margin-top:16px;
        flex-direction: column;
        gap: 4px;
        background: url(/assets/img/bg-goal-mo.png) no-repeat center 100%/100%;
        padding-bottom: 8.125em
    }

    .major .goal::after {
        display: none
    }

    .major .goal .bx {
        padding: 32px 40px;
        min-height: 100px
    }

    .major .goal .bx.bg-primary {
        margin: 0
    }
}

@media(max-width: 767.98px) {
    .major .goal {
        padding-bottom:5em
    }

    .major .goal .bx {
        padding: 29px 40px
    }
}

.major .goal.fusion-goal {
    padding-bottom: 0
}

@media(max-width: 991.98px) {
    .major .goal.fusion-goal {
        padding-bottom:0;
        background: none
    }
}

.major .goal.fusion-goal::after {
    display: none
}

.major .goal.last-mg .bg-primary {
    margin: 0 0 0 -3.5em
}

@media(max-width: 991.98px) {
    .major .goal.last-mg .bg-primary {
        margin:0
    }
}

.major .diagram {
    position: relative;
    background: url(../img/renewal/major/bg-dotted.png) no-repeat center;
    background-color: #f6f6f6;
    margin-bottom: 200px;
    border-radius: 2.5em;
    padding: 3.313em 5em
}

.major .diagram .grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 150px 150px 150px;
    gap: 3em 1.813em
}

.major .diagram .bn-round {
    grid-column: 2/3;
    grid-row: 2/3
}

.major .diagram .text-box {
    padding: 1.5em;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    color: var(--basic-navy)
}

.major .diagram .text-box.top {
    grid-column: 2/3;
    grid-row: 1/2
}

.major .diagram .text-box.left {
    grid-column: 1/2;
    grid-row: 2/3
}

.major .diagram .text-box.right {
    grid-column: 3/4;
    grid-row: 2/3
}

.major .diagram .text-box.lefttop {
    grid-column: 1/2;
    grid-row: 1/2;
    justify-self: center;
    margin-right: -100%
}

.major .diagram .text-box.righttop {
    grid-column: 3/4;
    grid-row: 1/2;
    margin-left: -100%;
    justify-self: center
}

.major .diagram .text-box.leftbtm {
    grid-column: 1/2;
    grid-row: 3/4;
    justify-self: center;
    margin-right: -100%
}

.major .diagram .text-box.rightbtm {
    grid-column: 3/4;
    grid-row: 3/4;
    margin-left: -100%;
    justify-self: center
}

@media(min-width: 992px) {
    .major .diagram .text-box br {
        display:none
    }
}

.major .diagram::after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100px;
    background: url(../img/renewal/major/bg-diag2.png) no-repeat center/contain;
    left: 50%;
    transform: translateX(-50%);
    top: calc(100% + 24px)
}

.major .diagram.athena::after {
    display: none
}

@media(max-width: 1240.98px) {
    .major .diagram {
        background-size:auto,90%
    }
}

@media(max-width: 991.98px) {
    .major .diagram {
        padding:24px;
        padding-bottom: 50px;
        overflow: visible;
        background-image: none
    }

    .major .diagram::after {
        background: url(../img/renewal/major/bg-diag2.png) no-repeat center/contain;
        top: 100%
    }

    .major .diagram .grid {
        position: relative;
        display: flex;
        flex-direction: column;
        gap: 8px;
        z-index: 1
    }

    .major .diagram .grid .text-box {
        padding: 16px;
        min-height: 74px
    }
}

@media(max-width: 991.98px)and (max-width: 767.98px) {
    .major .diagram {
        padding-bottom:100px
    }

    .major .diagram .grid::after {
        bottom: -5em
    }
}

@media(max-width: 991.98px) {
    .major .diagram .text-box.leftbtm,.major .diagram .text-box.lefttop {
        margin-right:0
    }

    .major .diagram .text-box.rightbtm,.major .diagram .text-box.righttop {
        margin-left: 0
    }
}

@media(max-width: 767.98px) {
    .major .diagram {
        background:#f6f6f6;
        padding-bottom: 24px;
        overflow: visible;
        margin-bottom: 100px
    }

    .major .diagram .grid::after {
        display: none
    }

    .major .diagram::after {
        background: url(../img/renewal/major/bg-diag2.png) no-repeat center/contain;
        top: 97%
    }
}

.major .strengths {
    counter-reset: number;
    margin-top: 24px
}

.major .strengths+.tit04 {
    display: block;
    margin: 24px 0
}

@media(max-width: 991.98px) {
    .major .strengths+.tit04 {
        margin:16px 0
    }
}

.major .strengths dl {
    display: flex;
    gap: 6em;
    align-items: center;
    border-bottom: 1px solid #e5e5e5;
    padding: 24px 0
}

.major .strengths dl:first-of-type {
    padding-top: 0
}

.major .strengths dl dt {
    position: relative;
    text-align: center
}

.major .strengths dl dt::after {
    /* counter-increment: number 1; */
    content: attr(data-year);
    /* content: "0" counter(number); */
    display: block;
    line-height: 130%;
    letter-spacing: -1.38px;
    font-size: 46px;
    margin-left: -4px
}

@media(max-width: 1240.98px) {
    .major .strengths dl dt::after {
        font-size:36px
    }
}

@media(max-width: 767.98px) {
    .major .strengths dl dt::after {
        font-size:24px
    }
}

.major .strengths dl dd {
    flex-grow: 1
}

.major .strengths dl dd b {
    display: block;
    margin-bottom: 8px
}

.major .strengths dl dd.media {
    gap: 24px
}

@media(max-width: 991.98px) {
    .major .strengths {
        margin-top:16px
    }

    .major .strengths dl {
        gap: 24px;
        padding: 16px 0
    }

    .major .strengths dd.media {
        display: block
    }

    .major .strengths dd.media img {
        margin-bottom: 8px
    }

    .major .strengths .media-body {
        margin-top: 5px
    }
}

.major .career {
    --gutters-margin: 0;
    --gap: 1em;
    gap: var(--gap)
}

.major .career .bx {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2em;
    margin-bottom: 0
}

@media(min-width: 992px) {
    .major .career .bx.col-lg-4 {
        max-width:calc((100% - var(--gap)*2)/3)
    }

    .major .career .bx.col-lg-6 {
        max-width: calc((100% - var(--gap))/2)
    }

    .major .career .bx.col-lg-3 {
        max-width: calc((100% - var(--gap)*3)/4)
    }
}

.major .career+.bubble-wrap {
    margin-top: 3em
}

@media(max-width: 1599.98px) {
    .major .career {
        --gap: 12px
    }
}

@media(max-width: 991.98px) {
    .major .career {
        --gap: 8px
    }

    .major .career+.bubble-wrap {
        margin-top: 16px
    }
}

.major .sub-major {
    display: flex;
    justify-content: center;
    flex-direction: column;
    margin-bottom: 4.5em
}

.major .sub-major .bn-round {
    position: relative;
    min-width: 340px
}

.major .sub-major .bn-round::before {
    content: "";
    position: absolute;
    display: block;
    height: 100%;
    width: 2px;
    border-left: 2px dotted #ddd;
    top: 100%;
    left: 50%;
    border-right: 0;
    border-bottom: 0
}

.major .sub-major .bn-round::after {
    content: "";
    position: absolute;
    display: block;
    height: 100%;
    width: 16px;
    height: 16px;
    border: 2px solid #fff;
    background: var(--primary);
    border-radius: 50%;
    top: 95%;
    left: 48%
}

.major .sub-major .major-list {
    display: flex;
    gap: 1em;
    padding-top: 8.563em
}

.major .sub-major .major-list li {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 120px;
    flex: 1;
    border-radius: 24px;
    background: #fff;
    text-align: center;
    box-shadow: 0px 4px 40px 0px rgba(17,25,62,.1)
}

.major .sub-major .major-list li.center::before {
    border-left: 0
}

.major .sub-major .major-list li:first-child::before {
    border-top-left-radius: 20px
}

.major .sub-major .major-list li:nth-last-of-type(2)::before {
    border-right: 2px dotted #ddd;
    border-top-right-radius: 20px
}

.major .sub-major .major-list li:last-child::before {
    display: none
}

.major .sub-major .major-list li::before {
    overflow: hidden;
    content: "";
    position: absolute;
    display: block;
    width: calc(100% + 14px);
    height: 50px;
    border: 2px dotted #ddd;
    top: -50px;
    left: 50%;
    border-right: 0;
    border-bottom: 0
}

.major .sub-major.korean {
    margin-bottom: 0
}

.major .sub-major.korean .bn-round {
    background-color: rgba(0,0,0,0);
    background-image: url(../img/renewal/major/korean/bg-tit.jpg);
    background-size: auto;
    height: 170px;
    min-width: 320px
}

.major .sub-major.korean .major-list {
    justify-content: center
}

.major .sub-major.korean .major-list li {
    max-width: 240px
}

@media(min-width: 1241px) {
    .major .sub-major.korean .tit03 {
        margin-top:calc(var(--gap)*3)
    }

    .major .sub-major.korean .major-list {
        padding-top: 6em;
        margin-bottom: calc(var(--gap)*5)
    }
}

@media(max-width: 991.98px) {
    .major .sub-major.korean .bn-round {
        height:140px
    }

    .major .sub-major.korean .major-list li {
        max-width: unset
    }
}

@media(max-width: 1240.98px) {
    .major .sub-major .bn-round {
        width:auto
    }
}

@media(max-width: 991.98px) {
    .major .sub-major .bn-round::before {
        display:none
    }

    .major .sub-major .bn-round::after {
        z-index: 10
    }

    .major .sub-major .major-list {
        position: relative;
        flex-direction: column;
        padding-top: 16px
    }

    .major .sub-major .major-list::before {
        content: "";
        position: absolute;
        display: block;
        height: 100%;
        width: 2px;
        border-left: 2px dotted #ddd;
        top: 0;
        left: 50%;
        border-right: 0;
        border-bottom: 0
    }

    .major .sub-major .major-list li {
        padding: 24px;
        min-height: 72px
    }

    .major .sub-major .major-list li::before {
        display: none
    }
}

@media(max-width: 767.98px) {
    .major .sub-major .bn-round {
        min-width:240px
    }

    .major .sub-major .bn-round::after {
        width: 12px;
        height: 12px
    }
}

@media(max-width: 767.98px) {
    .major .video {
        gap:16px
    }
}

.major .tblScr .icon.window {
    filter: brightness(0) saturate(100%) invert(20%) sepia(0%) saturate(100%) hue-rotate(0deg) brightness(100%) contrast(90%);
    width: 20px;
    height: 20px
}

.major .icon.window {
    background-image: url(../img/renewal/bt-window.svg)
}

.major#sect5 .subContW {
    padding-top: 0;
    padding-bottom: 0
}

.major .history-list {
    width: auto !important
}

.major .history-list>li {
    position: relative
}

.major .history-list>li::before {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    background: var(--primary);
    border: 2px solid #fff;
    border-radius: 50%
}

.major .history-list>li::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border-top: 2px solid var(--primary);
    position: absolute;
    top: 5px;
    left: 12px
}

.major .history-list>li .tit04 {
    display: block;
    margin-bottom: 16px;
    padding-top: 24px
}

.major .history-swiper {
    display: flex;
    width: auto;
    overflow: visible
}

.major .history-swiper .swiper-wrapper {
    display: flex;
    width: auto
}

.major .history-swiper .swiper-slide {
    width: 400px !important
}

@media(max-width: 991.98px) {
    .major .history-swiper .swiper-slide {
        width:344px !important
    }
}

.major .year {
    font-size: 4em;
    display: none;
    color: var(--primary);
    font-weight: 800
}

.major .year-wrap {
    margin-bottom: 24px
}

.major .year-list {
    flex-grow: 1
}

.major .year.acitve {
    display: block
}

@media(max-width: 991.98px) {
    .major .year {
        font-size:24px
    }
}


.major .goal {
    position: relative;
    display: flex;
    padding-bottom: 100px;
    margin-top: 24px
}

.major .goal::after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 320px;
    background: url(/assets/img/bg-goal.png) no-repeat center/contain;
    bottom: 0;
    z-index: -1
}

.major .goal.bg-none {
    padding-bottom: 0;
    background: none
}

.major .goal.bg-none::after {
    background: none
}



@media(max-width: 991.98px) {
    .major .goal {
        margin-top:16px;
        flex-direction: column;
        gap: 4px;
        background: url(/assets/img/bg-goal-mo.png) no-repeat center 100%/100%;
        padding-bottom: 8.125em
    }

    .major .goal::after {
        display: none
    }

    .major .goal .bx {
        padding: 32px 40px;
        min-height: 100px
    }

    .major .goal .bx.bg-primary {
        margin: 0
    }
}

@media(max-width: 767.98px) {
    .major .goal {
        padding-bottom:5em
    }

    .major .goal .bx {
        padding: 29px 40px
    }
}

.major .goal.fusion-goal {
    padding-bottom: 0
}

@media(max-width: 991.98px) {
    .major .goal.fusion-goal {
        padding-bottom:0;
        background: none
    }
}

.major .goal.fusion-goal::after {
    display: none
}

.major .goal.last-mg .bg-primary {
    margin: 0 0 0 -3.5em
}

@media(max-width: 991.98px) {
    .major .goal.last-mg .bg-primary {
        margin:0
    }
}
.major .map-bx {
    margin: 0 auto;
    padding: 22px 0;
    text-align: center
}
.major .pale-ylw {
    background: #fbf8dc
}

.major .pale-blue {
    background: #eef7ff
}



.nav-top {
    z-index: 10
}

.nav-top .container {
    max-width: calc(1240px + var(--container-padding)*2)
}

@media(min-width: 1241px) {
    .nav-top .nav-pills {
        flex-wrap:wrap
    }
}

.nav-top .nav-link {
    border-radius: 500px
}

.nav-top:not(.tblScrW) .nav {
    flex-wrap: wrap
}

/* body {
    overflow-x: hidden
} */

body:not(.is-scroll) .nav-top .container {
    padding: 0;
    margin: 0;
    max-width: 100%
}

body:not(.is-scroll) .nav-top .nav-pills:not(:has(.active)) li:first-child .nav-link {
    color: #fff;
    background: var(--primary)
}

@media(max-width: 767.98px) {
    body:not(.is-scroll) .nav-top .nav-pills {
        white-space:nowrap;
        flex-wrap: nowrap;
        overflow-x: auto
    }

    body:not(.is-scroll) .nav-top .nav-pills .nav-link {
        padding: 14px 16px;
    }
    body:not(.is-scroll) .nav-pills li a.active {
        padding: 14px 16px;
    }
}



.banner-ch {
    display: flex;
    align-items: center;
    gap: 1.5em;
    padding: 1.5em;
    background: #fff8b8 url(../img/renewal/banner-ch-bg.png) no-repeat bottom -4em right .2em;
    background-size: auto 190%;
    border-radius: 24px
}

.banner-ch img {
    max-width: 110px
}

.banner-ch dl {
    margin-right: auto
}

.banner-ch dl dt {
    margin-bottom: 8px;
    font-size: 24px;
    font-weight: 700;
    color: var(--light-navy);
    word-break: keep-all;
    line-height: 1.2
}

.banner-ch dl dd {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.5
}

.banner-ch.blue {
    background: #eef7ff url(../img/renewal/banner-ch-blue-bg.png) no-repeat bottom -4em right .2em
}

@media(max-width: 1240.98px) {
    .banner-ch {
        flex-direction:column;
        align-items: start;
        gap: 1em;
        background-position: bottom -2em right;
        background-size: auto 120%
    }

    .banner-ch img {
        display: none
    }
}

@media(max-width: 767.98px) {
    .banner-ch dl dt {
        font-size:20px
    }

    .banner-ch dl dd {
        font-size: 14px
    }
}

.banner-ic {
    display: flex;
    align-items: start;
    gap: 1.5em;
    padding: 2em;
    background-color: #f6f6f6;
    border-radius: 24px
}

.banner-ic .ic {
    display: flex;
    flex-direction: column;
    text-align: center;
    word-break: keep-all
}

.banner-ic .ic span {
    display: block;
    font-size: 15px
}

.banner-ic .ic b {
    font-size: 18px
}

.banner-ic .ic img {
    margin: 0 auto;
    max-width: 80px
}

@media(max-width: 767.98px) {
    .banner-ic .ic {
        display:none
    }

    .banner-ic .ic span {
        display: block;
        font-size: 14px
    }

    .banner-ic .ic b {
        font-size: 16px
    }
}

@media(min-width: 768px) {
    .banner-ic.process .ic {
        min-width:130px
    }
}

@media(max-width: 767.98px) {
    .banner-ic.process {
        position:relative
    }

    .banner-ic.process .ic {
        display: block;
        position: absolute;
        top: 2em;
        right: 2em
    }

    .banner-ic.process .ic img {
        width: 56px
    }

    .banner-ic.process .ic span,.banner-ic.process .ic b {
        display: none
    }

    .banner-ic.process .desc {
        width: 100%
    }

    .banner-ic.process .desc .label {
        display: inline-block;
        margin: 20px 0 16px
    }

    .banner-ic.process .bt {
        justify-content: space-between;
        width: 100%
    }
    .banner-ic {
        padding: .5em;
    }    
}




.bx {
    padding: 2em;
    border-radius: 1em
}

.bx-gray {
    background-color: #f6f6f6
}

.bx-bd {
    border: 1px solid #e5e5e5;
    margin-top: 3em
}

.bx-sky {
    background-color: var(--sky)
}

.bx-navy {
    background-color: var(--light-navy)
}

.bx-dark {
    background-color: var(--basic-navy)
}

.bx-radius {
    border-radius: 5rem !important
}

.bx.md {
    padding: 2em
}

@media(max-width: 1240.98px) {
    .bx {
        padding:16px;
        border-radius: 16px
    }

    .bx.md {
        padding: 24px
    }
}

.bx-process-wrp {
    display: flex;
    align-items: stretch;
    width: 100%
}

.bx-process-wrp+.bx-process-wrp {
    margin-top: .5em
}

.bx-process-wrp .arr {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 .5em;
    min-width: 20px
}

.bx-process {
    display: flex;
    flex-direction: column;
    gap: 1.5em;
    width: 100%
}

.bx-process .top {
    display: flex;
    justify-content: space-between;
    align-items: start
}

.bx-process .top .label {
    font-weight: 700
}

.bx-process .top img {
    max-width: 64px
}

.bx-process .btm {
    min-height: 54px;
    letter-spacing: -0.6px;
    word-break: keep-all
}

.bx-process .last {
    background-color: var(--basic-navy)
}

.bx-process .last .btm {
    color: #fff
}

.bx-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 8px
}

.bx-wrap .bx {
    min-width: 250px;
    flex-grow: 1
}

.bx-wrap .bx.fixed-height {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100px
}

@media(max-width: 1240.98px) {
    .bx-wrap .bx.fixed-height {
        min-height:unset
    }
}

@media(min-width: 1241px) {
    .bx-process-wrp+.bx-process-wrp {
        margin-top:1.5em
    }

    .bx-process-wrp .bx-process {
        max-width: 280px
    }

    .bx-process-wrp.full .bx-process {
        max-width: none
    }
}

@media(max-width: 1240.98px) {
    .bx-process-wrp {
        display:grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 8px
    }

    .bx-process-wrp .arr {
        display: none
    }

    .bx-process .top img {
        max-width: 40px
    }

    .bx-process .btm {
        min-height: 0px
    }
}


.row {
    --gutters-margin: 4px;
    margin-left: calc(var(--gutters-margin)*-1);
    margin-right: calc(var(--gutters-margin)*-1)
}

@media(min-width: 768px) {
    .row {
        --gutters-margin: 8px
    }
}

@media(min-width: 1600px) {
    .row {
        --gutters-margin: 12px
    }
}

.row>[class*=col] {
    float: none;
    padding-left: var(--gutters-margin);
    padding-right: var(--gutters-margin)
}

.board-professor {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-top: 3em;
    gap: 1.5em
}

.board-professor>div {
    display: flex;
    align-items: flex-start;
    gap: 2em;
    padding: 2em
}

.board-professor>div .thumb {
    position: relative;
    width: 130px;
    border-radius: .5em;
    overflow: hidden;
    flex-shrink: 0
}

.board-professor>div .thumb::before {
    content: "";
    display: block;
    padding-bottom: 127%
}

.board-professor>div .thumb img {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.board-professor>div .detail {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 1em;
    flex: 1
}

@media(max-width: 991.98px) {
    .board-professor {
        grid-template-columns:repeat(1, 1fr);
        gap: 1em
    }

    .board-professor>div {
        padding: 1.5em;
        gap: 1.5em
    }

    .board-professor>div .thumb {
        width: 24%;
        max-width: 130px
    }
}

.bt-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: .5em
}


.bt-wrap.ct {
    justify-content: center;
    margin-top: 3.25em
}

.bt-wrap.ct .bt {
    flex: 1;
    max-width: 13em;
    justify-content: center
}

.bt-wrap.ct.wide .bt {
    flex: 0;
    max-width: none
}

@media(max-width: 767.98px) {
    .bt-wrap.ct {
        margin-top:2em
    }

    .bt-wrap.ct.wide .bt {
        flex: 1;
        justify-content: space-between
    }
}


.bt,.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    border-radius: 5rem;
    white-space: nowrap;
    padding: .75em 1em;
    gap: 8px;
    font-size: 1em;
    line-height: 1.35;
    border: 1px solid rgba(0,0,0,0)
}





.bt .icon,.btn .icon {
    width: 1.5em;
    height: 1.5em
}

.bt .icon.arr,.btn .icon.arr {
    background-image: url(/front/img/bt-arr.svg)
}
.bt-primary,.btn-primary {
    background: var(--primary);
    color: #fff !important
}

.bt-primary:hover,.btn-primary:hover {
    background: #2494fc
}

.bt-primary:active,.btn-primary:active {
    background: #0475de
}

.bt-primary .icon,.btn-primary .icon {
    filter: brightness(0) invert(1)
}

.bt-white,.btn-white {
    background: #fff;
    color: var(--primary) !important
}

.bt-navy,.btn-navy {
    background: var(--basic-navy);
    color: #fff !important
}

.bt-sky,.btn-sky {
    background: #eef7ff;
    color: var(--primary) !important
}

.bt-ylw,.btn-ylw {
    background: var(--basic-ylw);
    color: var(--basic-navy) !important
}

.bt-gray,.btn-gray {
    background: #eee;
    color: var(--primary) !important
}

.bt-outline,.btn-outline {
    border-color: #e5e5e5;
    color: var(--primary) !important
}

.bt.md,.btn.md {
    padding: 1em 1.5em
}

.bt.lg,.btn.lg {
    font-size: 1.15em;
    /* padding: 1em 2em */
}

.bt.disabled,.btn.disabled {
    color: rgba(17,17,17,.2) !important;
    pointer-events: none
}

.bt.radius,.btn.radius {
    border-radius: 1em
}
.board-gallery {
    margin-top: 2em
}

.board-gallery>ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5em
}

.board-gallery .cate {
    font-weight: 700;
    color: var(--primary);
    font-size: .9em;
    margin-bottom: 4px
}

.board-gallery li {
    margin-bottom: 1.5em
}

.board-gallery li .thumb {
    position: relative;
    width: 100%;
    margin-bottom: 1em;
    padding-top: 60.45%;
    border-radius: 1.5em;
    overflow: hidden
}

.board-gallery li .thumb img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.board-gallery li .thumb .icon {
    position: absolute;
    top: 20px;
    left: 20px;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    background-position: center
}

.board-gallery li .cont p {
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: var(--basic-navy) !important;
    line-height: 1.5
}

.board-gallery li .cont .meta {
    display: block;
    margin-top: 1em;
    font-weight: 500;
    color: #6c6c6c
}

.board-gallery.e-promotion>ul {
    grid-template-columns: repeat(4, 1fr)
}

.board-gallery.e-promotion li {
    position: relative;
    overflow: hidden
}

.board-gallery.e-promotion li .thumb {
    padding-top: 122%;
    border-radius: 1.5em;
    border: 1px solid #e5e5e5
}

.board-gallery.e-promotion li .thumb {
    position: relative
}

.board-gallery.e-promotion li .thumb .link {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1em;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s
}

.board-gallery.e-promotion li .thumb .link .icon {
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
    width: 3.5em;
    height: 3.5em;
    border-radius: 0
}

.board-gallery.e-promotion li .thumb .link .icon-doc-read {
    background: url(../img/renewal/icon-doc-read.svg) center/cover
}

.board-gallery.e-promotion li .thumb .link .icon-doc-download {
    background: url(../img/renewal/icon-doc-download.svg) center/cover
}

.board-gallery.e-promotion li .thumb .link::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(0,0,0,.5)
}

.board-gallery.e-promotion li .thumb:hover .link {
    opacity: 1;
    pointer-events: auto
}

.board-gallery.e-promotion .cont {
    text-align: center
}

.board-gallery.size-a4>ul {
    grid-template-columns: repeat(4, 1fr)
}

.board-gallery.size-a4 li {
    position: relative;
    overflow: hidden
}

.board-gallery.size-a4 li .thumb {
    padding-top: 140.8%;
    border-radius: 16px;
    border: 1px solid #e5e5e5
}

@media(max-width: 1240.98px) {
    .board-gallery {
        margin-top:1em
    }

    .board-gallery>ul {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1em
    }

    .board-gallery li {
        margin-bottom: 8px
    }
}

@media(max-width: 767.98px) {
    .board-gallery li .thumb .icon {
        top:10px;
        left: 10px;
        width: 30px;
        height: 30px
    }
}




.gate-gallery li {
    background: #f6f6f6;
    border-radius: 2em
}

.gate-gallery li .thumb {
    padding-top: 60.45%
}

.gate-gallery li .cont {
    position: relative;
    padding: 2em;
    padding-top: 1em
}

.gate-gallery li .cont .flex-fill {
    margin-right: 0em
}

.gate-gallery li .cont .flex-fill .mail,.gate-gallery li .cont .flex-fill .tel {
    font-weight: 500
}

.gate-gallery li .cont .flex-fill .tit05.text-basic-navy {
    line-height: 1.5
}

.gate-gallery li .cont .major-title {
    top: auto;
    bottom: 100%;
    right: unset;
    left: 32px;
    max-width: calc(100% - 64px)
}

.gate-gallery li .cont .major-title strong {
    display: block
}

.gate-gallery li .cont .major-title .tit04::after {
    left: 100%;
    transform: scaleX(-1)
}

.gate-gallery li .cont .icon-arrow {
    cursor: pointer;
    transition: transform .2s
}

.gate-gallery li:hover .icon-arrow {
    transform: rotate(45deg)
}

@media(max-width: 767.98px) {
    .gate-gallery ul {
        grid-template-columns:auto !important
    }

    .gate-gallery li .cont {
        padding: 16px;
        padding-bottom: 24px
    }

    .gate-gallery li .cont .major-title {
        left: 16px;
        max-width: calc(100% - 32px)
    }
}




.university .campus-way .label {
    font-size: 1em;
    font-weight: 700;
    min-width: 6.4rem;
    text-align: center
}

ul[class^=list-] li,ol[class^=list-] li {
    position: relative
}

ul[class^=list-] li::before,ol[class^=list-] li::before {
    position: absolute;
    left: 0;
    top: 0
}

.list-num {
    counter-reset: number 0
}

.list-num>li {
    padding-left: 1.5rem;
    text-align: left;
    line-height: 1.6
}

.list-num>li::before {
    counter-increment: number 1;
    content: counter(number) ". "
}

.list-num-circle {
    counter-reset: number 0
}

.list-num-circle>li {
    padding-left: 3rem
}

.list-num-circle>li::before {
    counter-increment: number 1;
    content: counter(number);
    display: flex;
    justify-content: center;
    align-items: center;
    top: .2em !important;
    font-size: 14px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-color: var(--basic-navy);
    color: #fff;
    font-weight: 700;
    line-height: 1.5
}

.list-num-circle>li.red {
    color: var(--red);
    font-weight: 700
}

.list-num-circle>li.red::before {
    background-color: var(--red)
}

.list-num-circle li+li {
    margin-top: .75em
}

@media(max-width: 767.98px) {
    .list-num-circle>li::before {
        top:.12em !important;
        width: 20px;
        height: 20px;
        font-size: 12px
    }
}
.list-dot li {
    padding-left: calc(.5em + 4px)
}

.list-dot li+li {
    margin-top: 4px
}

.list-dot li::before {
    content: "";
    width: 4px;
    height: 4px;
    top: calc(.75em - 2px) !important;
    left: 0;
    border-radius: 2px;
    background-color: #b6b6b6
}

.input01 {
    padding: 1em;
    background-color: #f6f6f6;
    font-size: 16px;
    border-radius: 16px;
    border: 0;
    outline: 0;
    transition: .4s;
    color: #333
}

.input01.wd100 {
    max-width: none !important
}

.input01::placeholder {
    font-weight: 400;
    color: #b6b6b6
}

.input01:disabled {
    background: #eee;
    color: #999
}

@media(max-width: 767.98px) {
    .input01 {
        padding:.75em;
        border-radius: 8px
    }
}

input[type=checkbox],input[type=radio] {
    width: 24px;
    height: 24px;
    appearance: none;
    border-radius: .5em;
    background: #e5e5e5;
    display: inline-block;
    vertical-align: top;
    margin: 0
}

input[type=checkbox]+span,input[type=radio]+span {
    display: inline-block;
    vertical-align: top;
    line-height: 24px
}

@media(max-width: 767.98px) {
    input[type=checkbox],input[type=radio] {
        width:20px;
        height: 20px
    }

    input[type=checkbox]+span,input[type=radio]+span {
        line-height: 20px
    }
}

input[type=checkbox]:checked {
    background: url(/assets/img/icon/checkbox.svg) no-repeat 0 0/100% auto
}

input[type=radio] {
    border-radius: 100%
}

input[type=radio]:checked {
    background: url(/assets/img/icon/radio.svg) no-repeat 0 0/100% auto
}

.searchBox {
    display: flex;
    justify-content: end;
    gap: .5em;
    width: 100%
}

.searchBox .input01 {
    max-width: 320px;
    width: 100%
}

.searchBox select.input01 {
    max-width: 200px
}

.searchBox select.input01:focus {
    outline: 1px solid #000
}

.searchBox .btnSearch {
    padding: 1em 2em;
    color: #fff;
    font-weight: 700;
    background-color: var(--basic-navy);
    border-radius: 16px;
    text-align: center;
    text-wrap: nowrap;
    display: flex;
    align-items: center
}

@media(max-width: 1240.98px) {
    .searchBox .input01 {
        max-width:none;
        flex: 1
    }

    .searchBox .input01[type=text] {
        min-width: 12em
    }

    .searchBox .btnSearch {
        padding: .5em 1em;
        border-radius: 8px
    }
}

.searchBoxW {
    display: flex;
    align-items: center;
    /* gap: 2em; */
    font-weight: 700
}

.searchBoxW>form {
    flex: 1;
    width: 100%
}

.searchBoxW .total {
    font-weight: 700;
    align-self: flex-end
}

@media(max-width: 1240.98px) {
    .searchBoxW {
        flex-direction:row;
    }

    .searchBoxW:has(.board-nav) {
        flex-direction: column;
        align-items: start;
        gap: .5em
    }

    .searchBoxW .board-nav {
        max-width: 100%;
        overflow-x: auto
    }

    .searchBoxW .board-nav .nav {
        margin-top: 0
    }
}



.searchBoxW:before,.searchBoxW:after {
    display: none
}

.srch-box {
    padding: calc(var(--gap)*10);
    margin-bottom: calc(var(--gap)*10);
    border-radius: 2em;
    background: #f6f6f6
}

.srch-box .searchBox .input01 {
    background: #fff
}

.srch-box .searchBox .input01[type=text] {
    max-width: none
}

@media(max-width: 1240.98px) {
    .srch-box .searchBox .input01[type=text] {
        min-width:9em
    }
}

.srch-box .nav-pills {
    flex-wrap: wrap;
    padding-bottom: 1.5em;
    margin-bottom: 1.5em;
    border-bottom: 1px dashed #999
}

.srch-box .nav-pills li a:not(.active) {
    background: #fff
}


.dashList01 {
    margin-top: .25em
}

table .dashList01 {
    font-size: 15px
}

.dashMark02 {
    position: relative;
    line-height: 1.5em;
    padding-left: 10px;
    text-align: left
}

.dashMark02:before {
    content: "";
    position: absolute;
    min-width: 6px;
    height: 1px;
    top: .8em;
    left: 0;
    margin-top: -2px;
    background: #555
}

.dashMark02+.dashMark02 {
    margin-top: 0
}


.tblScrW+form {
    margin-top: calc(var(--gap)*12)
}

.tblScrW:has(.nav) {
    white-space: nowrap
}

@media(max-width: 1240.98px) {
    .tblScrW .tblScr {
        overflow:auto;
        width: 100%
    }

    .tblScrW .nav-tabs {
        white-space: nowrap;
        flex-wrap: nowrap;
        overflow-x: auto
    }
}

@media(max-width: 767.98px) {
    .tblScrW:before {
        content:"";
        position: absolute;
        top: 16px;
        right: 0;
        width: 40px;
        height: 16px;
        background: url("../img/icoScroll.jpg") no-repeat center;
        background-size: 100%;
        pointer-events: none
    }

    .tblScrW:has(.tb-board)::before {
        display: none
    }

    .tblScrW:has(.nav)::before {
        top: 0;
        opacity: .5
    }
}


.table01,.qna table {
    text-align: center;
    border-top: 2px solid #111;
    border-bottom: 1px solid #111;
    margin-top: 24px
}



.table01 tfoot .blank,.qna table tfoot .blank {
    padding: 4px 0 0 0
}

.table01 th,.table01 td,.qna table th,.qna table td {
    border-right: 1px solid #e5e5e5;
    border-top: 1px solid #e5e5e5;
    text-align: center;
    padding: 1em;
    color: #111;
    word-break: keep-all;
    vertical-align: middle
}

.table01 th:last-child,.table01 td:last-child,.qna table th:last-child,.qna table td:last-child {
    border-right: 0
}

.table01 th.bd-right-1,.table01 td.bd-right-1,.qna table th.bd-right-1,.qna table td.bd-right-1 {
    border-right: 1px solid #e5e5e5
}

.table01 th.bd-left-1,.table01 td.bd-left-1,.qna table th.bd-left-1,.qna table td.bd-left-1 {
    border-left: 1px solid #e5e5e5
}

.table01 th,.qna table th {
    background: #f6f6f6;
    color: #111;
    font-weight: 500
}

.table01 td,.qna table td {
    color: #333
}

.table01 img { border-radius: 10px}

.table01 .bg-ylw,.qna table .bg-ylw {
    font-weight: 500;
    color: #111;
    background-color: #fffde5
}

.table01 .link,.qna table .link {
    border-bottom: 1px solid #333
}

@media(max-width: 767.98px) {
    .table01 th,.table01 td,.qna table th,.qna table td {
        font-size:14px
    }

    .table01 .dashList01,.qna table .dashList01 {
        font-size: 13px
    }
}

.table01.collaspe,.qna table.collaspe {
    border-collapse: collapse
}

.table01.collaspe th.blank.right,.table01.collaspe td.blank.right,.qna table.collaspe th.blank.right,.qna table.collaspe td.blank.right {
    padding: 0 2px 0 0;
    border-top: 0;
    border-bottom: 0;
    width: 2px
}

.pager {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 3em;
    gap: 4px
}

@media(max-width: 767.98px) {
    .pager {
        gap:2px 0
    }
}

.pager .pagerMoBtn,.pager .txtPager,.pager::before,.pager::after {
    display: none
}

.pager .pagerBtn {
    display: block;
    width: 44px;
    height: 44px;
    background-size: auto 8px;
    text-indent: -9999px
}

.pager .pagerBtn.btnFirst {
    background: url(/assets/img/icon/icon-board-first.svg) no-repeat center
}

.pager .pagerBtn.btnPrev {
    background: url(/assets/img/icon/icon-board-prev.svg) no-repeat center
}

.pager .pagerBtn.btnNext {
    background: url(/assets/img/icon/icon-board-prev.svg) no-repeat center;
    transform: scaleX(-1)
}

.pager .pagerBtn.btnLast {
    background: url(/assets/img/icon/icon-board-first.svg) no-repeat center;
    transform: scaleX(-1)
}

.pager ul {
    display: inline-flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px
}

@media(max-width: 767.98px) {
    .pager ul {
        gap:2px 1px;
        margin: 0 4px
    }
}

.pager ul a {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    width: 44px;
    height: 44px;
    overflow: hidden;
    border: 0;
    border-radius: 50px !important;
    color: #111
}

.pager ul a.active {
    background-color: #798CD1;
    font-weight: 700
}

.pager ul a:hover:not(.on) {
    background: #d2daf8 !important;
    color: #111 !important
}

@media(max-width: 767.98px) {
    .pager ul a {
        width:30px;
        height: 30px
    }
}

@media(max-width: 767.98px) {
    .pager {
        margin-top:1.5em
    }

    .pager .pagerBtn {
        width: 30px;
        height: 30px
    }
}


.tb-board {
    margin-top: 2em
}

.tb-board thead * {
    font-size: 0
}

.tb-board td {
    border-right: 0;
    border-left: 0;
    padding: 28px 24px
}

.tb-board td:has(.label),.tb-board td.mHide {
    white-space: nowrap;
    width: 1%
}

.tb-board td>b {
    font-weight: 400
}

.tb-board td a.txtLink02 {
    margin-right: .5em;
    display: inline-block;
    max-width: calc(100% - 24px);
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle
}

.tb-board td .file {
    margin-top: 2px
}

.tb-board .tit {
    font-size: 1em;
    font-weight: 600;
    text-align: left;
    color: #344e85;
    padding-left: 0
}

.tb-board .cate {
    font-size: .7em;
    margin-bottom: .2em
}

.tb-board .new {
    font-size: .7em
}

@media(max-width: 767.98px) {
    .tb-board {
        display:block;
        margin-top: 1em
    }

    .tb-board colgroup,.tb-board .mHide {
        display: none
    }

    .tb-board tbody,.tb-board tr,.tb-board td {
        display: block
    }

    .tb-board td {
        border: 0;
        text-align: left;
        padding: 0 14px
    }

    .tb-board td.tit {
        padding: 0 14px .5em
    }

    .tb-board td.tit>a::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0
    }

    .tb-board td:first-child .label {
        float: left;
        margin: 2px 4px 0 0
    }

    .tb-board td:last-child .label {
        position: absolute;
        bottom: 1em;
        right: 1em
    }

    .tb-board .bd-meta {
        text-align: left !important
    }

    .tb-board tr {
        border-top: 1px solid #ddd;
        padding: 1em 0;
        position: relative;
        height: auto
    }

    .tb-board tr:first-child {
        border-top: 0
    }

    .tb-board .label {
        padding: 2px 8px
    }
}



.tb-roadmap .blank {
    padding: 0 0 4px 0;
    background-color: #fff;
    font-size: 0 !important
}

.tb-roadmap .blank.vertical {
    padding: 0 2px;
    border: 0;
    font-size: 0
}

.tb-roadmap thead th {
    background-color: #f6f6f6
}

.tb-roadmap thead th.empty {
    background-color: #eee
}

.tb-roadmap th.step1 {
    background-color: #eee
}

.tb-roadmap th.step2 {
    background-color: #ddd
}

.tb-roadmap th.step3 {
    background-color: #b6b6b6
}

.tb-roadmap th.step4 {
    background-color: #999
}

.tb-roadmap tbody th {
    white-space: nowrap;
    width: 1%;
    min-width: 100px
}




.table02 {
    padding-top: 2em;
    border-top: 2px solid #222
}

.table02 .tit02 {
    margin: 0 0 .5em
}

.table02 .cate {
    font-weight: 600;
    font-size: 1.1em
}

.table02 .bd-meta {
    text-align: left !important;
    font-size: 1em;
    display: flex;
    align-items: center;
    padding-bottom: 2em;
    border-bottom: 1px solid #ddd
}

.table02 .contents {
    padding: 2em 1.5em
}

.table02 .contents>table {
    display: block !important;
    border: 0 !important;
    overflow-x: auto
}

@media(max-width: 767.98px) {
    .table02 .contents {
        padding-left:0;
        padding-right: 0
    }
}

.table-responsive {
    max-width: 100%
}

.addFile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 1em;
    background: #f6f6f6;
    gap: .5em
}

.addFile:has(a) {
    padding: 1.5em;
    margin-top: 1.5em
}

@media(max-width: 767.98px) {
    .addFile:has(a) {
        padding:1em .5em
    }
}

.addFile a {
    display: inline-flex;
    align-items: flex-start;
    font-size: 1em;
    gap: 4px
}

.addFile a p {
    flex: 1;
    font-weight: 700;
    color: #111
}

.otherList {
    border-top: 1px solid #ddd;
    padding-top: 1.5em
}

.otherList li {
    margin-top: 8px;
    display: flex;
    padding: 1.5em 1em;
    border-radius: 1em;
    background: #f6f6f6;
    position: relative
}

.otherList li:has(a:empty) {
    display: none
}

.otherList li a:empty {
    pointer-events: none
}

.otherList li a:not(:empty):after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.otherList .rightBar {
    flex-shrink: 0;
    color: var(--light-navy);
    line-height: 1.5em;
    font-weight: 700;
    width: 6.25em;
    text-transform: uppercase;
    /*line-height: 2.4rem*/
}

@media(max-width: 767.98px) {
    .otherList .rightBar {
        width:auto;
        margin-right: 4px
    }
}

.otherList .tit {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
    font-size: 1.1em;
    font-weight: 600;
    color: #111
}

.comment-bt {
    border-top: 1px solid #ddd;
    padding-top: 1.5em
}

.comment-bt+.otherList {
    border: 0
}

.qna-q,.qna-a {
    padding: 2em 1.5em;
    text-align: left;
    border-top: 1px solid #ddd
}

@media(max-width: 767.98px) {
    .qna-q,.qna-a {
        padding:1em
    }
}

.qna-q:not(:has(.cate)) {
    display: flex;
    align-items: center
}

.qna .bullet {
    font-size: 1.25em;
    width: 2em;
    height: 2em;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    font-weight: 700;
    background: var(--basic-navy);
    color: #fff;
    margin-right: 1.2em;
    align-self: center
}

@media(max-width: 767.98px) {
    .qna .bullet {
        font-size:1em;
        margin-right: .5em
    }
}

.qna .icon {
    align-self: center;
    background-image: url(../img/renewal/add.svg)
}

.qna[open] .icon {
    background-image: url(../img/renewal/minus-bk.svg)
}

.qna-a {
    background: #f6f6f6;
    border-top-color: #e5e5e5
}

.qna-a .bullet {
    background: var(--primary);
    align-self: flex-start
}

.qna-a .btn {
    margin: 4px 0
}

.reply {
    padding: 2em;
    border-radius: 1.5em;
    background: #f6f6f6
}

@media(max-width: 767.98px) {
    .reply {
        padding:1em
    }
}

.reply .bullet {
    font-size: 1.25em;
    width: 2em;
    height: 2em;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    font-weight: 700;
    background: var(--primary);
    color: #fff;
    margin-right: .6em
}

@media(max-width: 767.98px) {
    .reply .bullet {
        font-size:1em
    }
}

.reply .bd-meta {
    padding-bottom: 1em;
    border: 0;
    flex-wrap: wrap
}

.reply .tit04 {
    color: var(--light-navy);
    margin-right: .6em
}

.reply .addFile {
    background: #fff;
    margin-top: 1em
}

.reply~.otherList {
    border-top: 0
}


.radio01,.chkBox01 {
    display: inline-block;
    vertical-align: top
}

.radio01:not(:last-child),.chkBox01:not(:last-child) {
    margin-right: 1.5em
}

@media(max-width: 767.98px) {
    .radio01:not(:last-child),.chkBox01:not(:last-child) {
        margin-right:.5em
    }
}

.radio01>label,.chkBox01>label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: .5em
}

.radio01>label .txt,.chkBox01>label .txt {
    font-size: 1.1em;
    font-weight: 400;
    color: #111
}

.radio-group,.chkBox-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: .5em 0
}

.radio-box,.chkBox-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px 12px
}

.radio-box .radio01,.chkBox-box .radio01 {
    margin: 0;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.radio-box .radio01.w-100,.radio-box .radio01.w-50,.chkBox-box .radio01.w-100,.chkBox-box .radio01.w-50 {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%
}

@media(min-width: 992px) {
    .radio-box .radio01.w-50,.chkBox-box .radio01.w-50 {
        -ms-flex-preferred-size:calc((100% - 12px)/2);
        flex-basis: calc((100% - 12px)/2);
        max-width: calc((100% - 12px)/2)
    }

    .radio-box .radio01.w-50.mr-auto,.chkBox-box .radio01.w-50.mr-auto {
        margin-right: 50%
    }
}

.radio-box .radio01 label,.chkBox-box .radio01 label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    padding: 24px;
    background: #f6f6f6;
    border-radius: 16px;
    border: 2px solid rgba(0,0,0,0)
}

.radio-box .radio01 label input,.chkBox-box .radio01 label input {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.radio-box .radio01 label:has(input:checked),.chkBox-box .radio01 label:has(input:checked) {
    border-color: var(--primary);
    background: #eef7ff
}

.radio-box .radio01 .txt,.chkBox-box .radio01 .txt {
    font-weight: 600
}

@media(max-width: 991.98px) {
    .radio-box .radio01,.chkBox-box .radio01 {
        -ms-flex-preferred-size:100%;
        flex-basis: 100%;
        max-width: 100%
    }

    .radio-box .radio01 label,.chkBox-box .radio01 label {
        padding: 16px;
        border-radius: 12px
    }
}



.icon.arrUp01 {
    background-image: url(/assets/img/icon/arrUp01.svg)
}

.icon.arrDown01 {
    background-image: url(/assets/img/icon/arrDown01.svg)
}

.icon.download {
    background-image: url(/assets/img/icon/bt-download.svg)
}

.icon-download {
    background-image: url(/assets/img/icon/download.svg);
    width: 1.5em;
    height: 1.5em;
}

.icon-date,.icon-time,.icon-money,.icon-mail-dark {
    width: 1.25em;
    height: 1.25em;
    background-image: url(/assets/img/icon/icon-date.svg)
}

.icon-mail {
    background-image: url(../img/renewal/icon-mail.svg)
}

.icon-time {
    background-image: url(/assets/img/icon/icon-time.svg)
}
.icon-money {
    background-image: url(/assets/img/icon/icon-money.svg)
}
.icon-mail-dark {
    background-image: url(../img/renewal/mail-dark.svg)
}

.icon.twitter {
    background-image: url(../img/renewal/sns_twitter_v2.svg)
}

.icon-url {
    background-image: url(../img/renewal/sns_url_v2.svg)
}

.icon-print {
    background-image: url(../img/renewal/sns_print_v2.svg)
}

.icon-arrow {
    width: 3em;
    height: 3em;
    background-image: url(/assets/img/icon/icon-arrow.svg);
    transition: transform .2s;
    transform-origin: center;
    will-change: transform
}

a:hover .icon-arrow {
    transform: rotate(45deg)
}

.icon-arrow.blue {
    background-image: url(../img/renewal/icon-arrow-blue.svg)
}

@media(max-width: 767.98px) {
    .icon-arrow {
        width:32px;
        height: 32px
    }
}

.icon-ytb {
    background-image: url(../img/renewal/ytb.svg)
}

.icon-ytb-wh {
    background-image: url(../img/renewal/ytb-wh.svg)
}

.icon-blog {
    background-image: url(../img/renewal/icon-blog.svg)
}

.icon-blog-wh {
    background-image: url(../img/renewal/blog-wh.svg)
}

.icon-insta {
    background-image: url(../img/renewal/icon-insta.svg)
}

.icon-insta-wh {
    background-image: url(../img/renewal/insta-wh.svg)
}

.icon-post {
    background-image: url(../img/renewal/icon-post.svg)
}

.icon-tiktok {
    background-image: url(../img/renewal/icon-tiktok.svg)
}

.icon-face {
    background-image: url(../img/renewal/icon-face.svg)
}

.icon-face-wh {
    background-image: url(../img/renewal/face-wh.svg)
}

.icon-ntv {
    background-image: url(../img/renewal/icon-ntv.svg)
}

.icon-flickr {
    background-image: url(../img/renewal/icon-flickr.svg)
}

.icon-minerva {
    background-image: url(../img/renewal/icon-minerva.svg)
}

.icon.arr-ylw-sm {
    background-image: url(../img/renewal/main/inside-arr.svg);
    width: 14px;
    height: 14.327px
}

.icon-arr-right {
    background-image: url(../img/renewal/icon-arr-right.svg)
}

.icon-sns-minerva {
    background-image: url(../img/renewal/icon-sns-minerva.svg)
}

.active .icon-sns-minerva {
    filter: brightness(0) invert(1)
}

.icon-sns-blog {
    background-image: url(../img/renewal/icon-sns-blog.svg)
}

.active .icon-sns-blog {
    filter: brightness(0) invert(1)
}

.icon-sns-post {
    background-image: url(../img/renewal/icon-sns-post.svg)
}

.active .icon-sns-post {
    filter: brightness(0) invert(1)
}

.icon-sns-facebook {
    background-image: url(../img/renewal/icon-sns-facebook.svg)
}

.active .icon-sns-facebook {
    filter: brightness(0) invert(1)
}

.icon-sns-insta {
    background-image: url(../img/renewal/icon-sns-insta.svg)
}

.active .icon-sns-insta {
    filter: brightness(0) invert(1)
}

.icon-sns-youtube {
    background-image: url(../img/renewal/icon-sns-youtube.svg)
}

.active .icon-sns-youtube {
    filter: brightness(0) invert(1)
}

.icon-plus {
    background-image: url(../img/grad/icon-plus.svg)
}

.icon-campus {
    width: 24px;
    height: 24px;
    background-image: url(../img/renewal/campus.svg)
}



.tb-write th,.tb-write td {
    border: 0;
    text-align: left;
    font-size: 1em
}

.tb-write tr+tr {
    border-top: 1px solid #ddd
}

@media(min-width: 768px) {
    .tb-write tr {
        display:-webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }

    .tb-write tr.align-items-center .thW01 {
        line-height: 1.1;
        padding-top: 0 !important
    }

    .tb-write td {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }
}

.tb-write tr:has(.input01) .thW01,.tb-write tr:has(.select01) .thW01 {
    padding-top: 2.2em
}

.tb-write tr:has(div:first-child .radio01) .thW01,.tb-write tr:has(.radio01:first-child) .thW01 {
    padding-top: 1.3em
}

.tb-write .thW01 {
    text-align: left;
    font-size: 1.1em;
    font-weight: 700;
    background: none;
    vertical-align: top;
    padding: 1.3em 0 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    min-width: 120px
}

.tb-write .thW01.blue {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.tb-write .thW01.blue::after {
    content: "";
    display: block;
    background: var(--primary);
    border-radius: 50%;
    width: 8px;
    height: 8px;
    margin-left: 8px
}

@media(min-width: 768px) {
    .tb-write .thW01.middle {
        padding-top:0 !important;
        -ms-flex-item-align: center;
        align-self: center
    }
}

.tb-write .tdW01 {
    padding: 1.5em
}

.tb-write .tdW01>.cont {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tb-write .tdW01.blue {
    -webkit-column-gap: 2em;
    -moz-column-gap: 2em;
    column-gap: 2em
}

.tb-write .tdW01.blue .labelW01 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-bottom: 0
}

.tb-write .tdW01.blue .labelW01 label {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #111;
    font-size: 1.1em;
    font-weight: 600
}

.tb-write .tdW01.blue .labelW01 label::after {
    content: "";
    display: block;
    background: var(--primary);
    border-radius: 50%;
    width: 8px;
    height: 8px;
    margin-left: 8px
}

.tb-write .tdW01.blue .cont {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

@media(max-width: 767.98px) {
    .tb-write .tdW01.blue {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.tb-write .tdW01 .select01 {
    float: none !important
}

.tb-write .tdW01 .radio-group~.radio01 {
    margin-top: .5rem
}

.tb-write .input01 {
    width: 100%;
    max-width: 320px
}

.tb-write .input01.tel {
    max-width: 120px;
    text-align: center
}

.tb-write .select01 {
    width: 100%;
    max-width: 320px;
    margin: 0
}

.tb-write .select01 select {
    font-size: 16px;
    padding: 1em;
    border-radius: 16px;
    border: 0;
    height: auto;
    background: #f6f6f6
}

@media(max-width: 767.98px) {
    .tb-write .select01 select {
        padding:.75em;
        border-radius: 8px
    }
}

@media(max-width: 767.98px) {
    .tb-write {
        display:block
    }

    .tb-write tbody,.tb-write tr,.tb-write th,.tb-write td {
        display: block
    }

    .tb-write .thW01 {
        padding: 1em 0 .5em !important
    }

    .tb-write .thW01:not(:first-child) {
        border-top: 1px solid #ddd
    }

    .tb-write .tdW01 {
        padding: 0 0 1em
    }
}





@media(max-width: 767.98px) {
    .tb-write {
        display:block
    }

    .tb-write tbody,.tb-write tr,.tb-write th,.tb-write td {
        display: block
    }

    .tb-write .thW01 {
        padding: 1em 0 .5em !important
    }

    .tb-write .thW01:not(:first-child) {
        border-top: 1px solid #ddd
    }

    .tb-write .tdW01 {
        padding: 0 0 1em
    }
}

.input-group,.inputW01 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    white-space: nowrap
}

.input-group .bt,.inputW01 .bt {
    margin-left: .5em;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.input-group>span,.input-group>div,.inputW01>span,.inputW01>div {
    -ms-flex-item-align: center;
    align-self: center
}

.input-group input[type=text],.input-group>.select01,.input-group>.input01,.inputW01 input[type=text],.inputW01>.select01,.inputW01>.input01 {
    width: 1%;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}


.required {
    display: inline-block;
    vertical-align: middle;
    margin: -0.2em 0 0 .45em
}



.hidden {
    position: absolute;
    top: -9999em;
    left: -9999em;
    width: 0;
    height: 0;
    font-size: 0;
    text-indent: -9999em
}
.mW600 {
    min-width: 600px !important
}

.mW800 {
    min-width: 800px !important
}

.wP100 {
    width: 100%;
    box-sizing: border-box !important
}

.w250 {
    width: 250px !important
}

.w150 {
    width: 150px !important
}

.w76 {
    width: 76px !important;
    display: inline-block !important
}


.referList01 {
    /* margin-top: 24px; */
    text-align: left
}

.referList01 li+li {
    margin-top: .25em
}

.referMark02 {
    position: relative;
    line-height: 1.5em;
    padding-left: 10px;
    color: #333;
    text-align: left
}

.referMark02.red {
    color: var(--red)
}

.referMark02.red::before {
    background: var(--red)
}

.referMark02.blue {
    color: var(--primary)
}

.referMark02.blue::before {
    background: var(--primary)
}

.referMark02:before {
    content: "";
    position: absolute;
    width: 4px;
    height: 4px;
    top: .75em !important;
    left: 0;
    margin-top: -2px;
    background: #b6b6b6;
    border-radius: 100%
}

.referMark02+.referMark02 {
    margin-top: .25em
}

.referMark02>.info-text {
    margin-top: .25em
}
.info-text {
    padding-left: 1.5em;
    line-height: 1.5em;
    background: url(../img/renewal/info.svg) no-repeat 0 0.15em/auto 1.25em
}

.info-text+.info-text {
    margin-top: .25em
}

.info-text.blue {
    color: var(--primary);
    background-image: url(/front/img/info-blue.svg);
    font-weight: 500
}

.info-text.red {
    color: var(--red);
    background-image: url(/assets/img/icon/info-red.svg);
    font-weight: 500
}

.info-text.pink {
    color: #ff5c90;
    background-image: url(../img/renewal/info-pink.svg)
}

.info-text.i-blue {
    font-weight: 500;
    background-image: url(/front/img/info-blue.svg)
}

.bx,.boxType02 {
    padding: 2em;
    border-radius: 1em
}

.bx-gray,.boxType02-gray {
    background-color: #f6f6f6
}

.bx-bd,.boxType02-bd {
    border: 1px solid #e5e5e5;
    margin-top: 3em
}

@media(max-width: 1240.98px) {
    .bx,.boxType02 {
        padding:16px;
        border-radius: 16px
    }
}

.boxType02 {
    background: #eef7ff
}

.label {
    padding: 6px 8px;
    font-size: 14px;
    color: #fff;
    background-color: var(--primary);
    border-radius: 8px;
    line-height: 1.5
}

.label.gray {
    background: #b6b6b6
}

.label.pink {
    background: #ff3575
}

.label.md {
    font-size: 16px
}

@media(max-width: 767.98px) {
    .label {
        font-size:12px
    }

    .label.md {
        font-size: 14px
    }
}







.chkBox01 {
    padding-left: 32px;
    line-height: 24px
}

.chkBox01 label {
    display: block;
    line-height: 24px
}

.chkBox01 label .txt {
    height: auto;
    line-height: inherit
}

.chkBox01 label .txt:before {
    width: 24px;
    height: 24px
}

.temsRadioW {
    margin-top: 1.5em
}

.bx-term .tit04 {
    color: var(--light-navy);
    margin-bottom: .6em
}

.bx-term .text-blue {
    font-weight: 700;
    margin-top: 1em
}

.labelW01.input-group {
    padding-left: 0;
    font-size: 1em;
    margin-bottom: 1em
}

.labelW01.input-group:last-child {
    margin-bottom: 0
}

.labelW01.input-group label {
    color: #111;
    -ms-flex-item-align: center;
    align-self: center;
    margin-right: 1em;
    min-width: 5em;
    font-weight: 500
}

.labelW01.input-group.flex-wrap {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px 0
}

.labelW01.input-group.flex-wrap .input01 {
    width: 40%
}

.form-modal .ent-apply .tit05 {
    margin-bottom: 16px
}

.form-modal .mw300 {
    max-width: 318px !important
}

.form-modal .tb-write+.tit05 {
    margin-top: 2.5em
}

.form-modal .tb-write tr:last-child {
    border-bottom: 1px solid #ddd
}

.form-modal .tb-write .tdW01 {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding-left: 0;
    padding-right: 0
}

.form-modal .tb-write .tdW01 input {
    max-width: 100%
}

.form-modal .tb-write .tdW01+.thW01 {
    margin-left: 2.5em
}

@media(max-width: 1240.98px) {
    .form-modal .tb-write tr {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }

    .form-modal .tb-write tr br {
        display: none
    }

    .form-modal .tb-write .tdW01 {
        width: 100%
    }

    .form-modal .tb-write .tdW01+.thW01 {
        margin-left: 0
    }

    .form-modal .tb-write .tdW01 input.mw300 {
        max-width: 100% !important
    }
}

.form-modal .file-txt {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4px
}

.form-modal .request {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed #e5e5e5
}

.form-modal .request.disabled label {
    color: rgba(17,17,17,.2)
}

.form-modal .request.disabled .bt {
    background: #eee !important;
    color: rgba(17,17,17,.2) !important
}

.imgTableW01 .imgPerW {
    padding-top: 1.5em;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.imgTableW01 .imgPerW img {
    width: 198px
}

@media(min-width: 992px) {
    .imgTableW01 {
        display:-webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 40px;
        border-top: 2px solid #111;
        margin-top: 24px
    }

    .imgTableW01 .table03 {
        border-top: 0;
        margin-top: 0
    }

    .imgTableW01 .table03 tr {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        max-width: 50%
    }
}

@media(max-width: 991.98px) {
    .imgTableW01 .imgPerW {
        text-align:center
    }
}

select {
    background: #fff
}

.select01 {
    display: inline-block;
    position: relative;
    margin-top: 10px
}

.select01 select {
    display: block;
    width: 100%;
    height: 35px;
    padding: 0 30px 0 8px;
    font-size: 14px;
    font-size: 1.4rem;
    border: 1px solid #ddd;
    border-radius: 0;
    background: #fff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    outline: 0;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-transition: .4s;
    transition: .4s
}

select::-ms-expand {
    display: none
}

.select01 select:focus {
    border-color: #8c93a8
}

.select01 select option {
    border: 1px solid red
}

.select01:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    width: 10px;
    height: 6px;
    margin-top: -3px;
    background: url("/assets/img/icon/icoSelectArr.png") no-repeat right center;
    background-size: 100%;
    z-index: 2;
    pointer-events: none
}

.select02 {
    display: none;
    margin-left: -1px;
    position: absolute;
    padding-bottom: 10px;
    top: 50px;
    left: 0;
    right: 0;
    font-size: 14px;
    font-size: 1.4rem;
    border: 1px solid #aeaeab;
    border-top: none;
    background-color: rgba(249,250,251,.9);
    z-index: 99;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.select02 li {
    position: relative;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.select02 li a {
    display: block;
    padding: 19px 0 15px 15px;
    width: 100%;
    color: #1b253e;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    word-break: keep-all
}

.select02 li a:hover {
    background-color: #ccc
}



.fileBox {
    display: inline-block;
    font-size: 0;
    vertical-align: top
}

.fileBox .fileInput {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    clip: rect(0, 0, 0, 0);
    border: 0
}

.fileBox .fileTxt {
    width: 350px;
    border-right: 0
}

.btnFile {
    display: inline-block;
    height: 35px;
    line-height: 120%;
    padding: 10px 15px 9px;
    margin-top: 10px;
    border: 0;
    font-size: 14px;
    font-size: 1.4rem;
    background: #1f3a93;
    color: #fff;
    text-align: center;
    vertical-align: top;
    cursor: pointer;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.btnFile label {
    cursor: pointer
}

.btnFile .icoFile {
    display: inline-block;
    width: 15px;
    height: 17px;
    margin-right: 9px;
    background: url("../img/mobile/contents/ico/icoFile.png") no-repeat center;
    background-size: 100%;
    vertical-align: middle
}

.securityW {
    position: relative;
    padding-left: 250px
}

.securityW>.securityImg {
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -20px
}

.securityW>.txt {
    margin: 10px 0 0
}

.ico {
    width: 20px;
    height: 20px
}

.ico.file {
    background-image: url(/assets/img/icon/file.svg)
}

.ico.view {
    background-image: url(/assets/img/icon/visibility.svg);
    vertical-align: top
}

.ico.comment {
    display: block;
    margin-right: .6em;
    min-width: 24px;
    height: 24px;
    background-image: url(../img/renewal/comment.svg);
    vertical-align: top
}

.ico.new {
    width: 30px;
    height: 10px;
    background-image: url(../img/renewal/new.svg);
    margin: -0.3em 0 0 .6em
}

.bd-meta {
    /* font-size: 0; */
    color: #6c6c6c;
    text-align: right !important;
    white-space: nowrap;
    /* font-size: 0; */
    line-height: 20px
}


.bd-meta>span {
    font-size: 16px;
    color: #6c6c6c
}

.bd-meta>span+span {
    position: relative;
    padding-left: 1em
}

.bd-meta>span+span:before {
    content: "";
    position: absolute;
    top: 50%;
    height: .5em;
    margin: -0.25em 0 0 -1px;
    left: .5em;
    border-left: 2px solid #ddd
}

@media(max-width: 767.98px) {
    .bd-meta>span {
        font-size:14px
    }
}


.accordion {
    margin: 10px 0 0 0;
    position: relative;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #dcdfe6
}

.accordion li {
    position: relative
}

.accordion li .btnAcco {
    display: block;
    position: relative;
    padding: 20px 10px 19px 55px;
    width: 100%;
    font-size: 1.2rem;
    border-top: 1px solid #dcdfe6;
    color: #344e85;
    cursor: pointer;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.accordion li .btnAcco:after {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    margin-top: -3px;
    width: 9px;
    height: 6px;
    background: url("/assets/img/icon/icoArr02down.png") no-repeat
}

.accordion li.on .btnAcco:after {
    background: url("/assets/img/icon/icoArr02top.png") no-repeat
}

.accordion li:first-child .btnAcco {
    border-top: 1px solid #959aaa
}

.accoCont>p {
    margin-top: 29px
}

.accoCont {
    position: relative;
    display: none;
    padding: 0 30px 30px 85px;
    border-top: 1px solid #dcdfe6;
    line-height: 157%
}

.accoCont .tit04:first-child {
    padding-top: 0
}

.accoCont.bg {
    background: #fafcff
}

.accordion .btnAcco {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.accordion .ico.question {
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 50%;
    margin-top: -12.5px;
    width: 25px;
    height: 25px;
    vertical-align: middle;
    background: url("/assets/img/icon/icoQ01.png") no-repeat center
}

.accordion .ico.answer {
    display: inline-block;
    position: absolute;
    left: 50px;
    top: 32px;
    width: 25px;
    height: 25px;
    vertical-align: middle;
    background: url("/assets/img/icon/icoA01.png") no-repeat center
}
.entranceStepList {
    margin-top: 35px
}

.entranceStepList li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.entranceStepList li+li {
    margin-top: 1.5em
}

.entranceStepList .step {
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 2em;
    color: #fff;
    font-weight: 700;
    background-color: var(--basic-navy);
    border-radius: 16px
}

.entranceStepList .step span {
    font-size: 16px
}

.entranceStepList .step b {
    font-size: 28px
}

.entranceStepList .desc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5rem;
    margin-left: -10px;
    padding: 2em 2em 2em calc(2em + 10px);
    width: 100%;
    background-color: #f6f6f6;
    border-radius: 0 16px 16px 0;
    word-break: keep-all
}

.entranceStepList .desc .d-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: .5rem;
    margin-bottom: .5em
}

.entranceStepList .desc .d-flex i {
    margin-top: .0em
}

.entranceStepList .desc .tit04 {
    font-weight: 700
}

.entranceStepList .desc .tit04::before {
    display: none
}

.entranceStepList .desc p {
    font-size: 16px
}

.entranceStepList .desc .bt-wrap {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

@media(max-width: 1240.98px) {
    .entranceStepList .desc {
        -webkit-box-orient:vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: start;
        gap: 1rem
    }

    .entranceStepList .desc .bt-wrap {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
}

@media(max-width: 767.98px) {
    .entranceStepList .step span {
        font-size:12px
    }

    .entranceStepList .step b {
        font-size: 20px
    }

    .entranceStepList .desc p {
        font-size: 14px
    }
}
.stepIcon {
    display: block;
    min-width: 32px;
    height: 32px;
    background-size: contain !important
}

@media(max-width: 767.98px) {
    .stepIcon {
        min-width:28px;
        height: 28px
    }
}

.stepIcon.entrance1 {
    background: url(../img/renewal/entranceStepIcon1.svg) no-repeat
}

.stepIcon.entrance2 {
    background: url(../img/renewal/entranceStepIcon2.svg) no-repeat
}

.stepIcon.entrance3 {
    background: url(../img/renewal/entranceStepIcon3.svg) no-repeat
}

.stepIcon.entrance4 {
    background: url(../img/renewal/entranceStepIcon4.svg) no-repeat
}

.stepIcon.pass1 {
    background: url(/assets/img/icon/passStepIcon1.svg) no-repeat
}

.stepIcon.pass2 {
    background: url(../img/renewal/passStepIcon2.svg) no-repeat
}

.stepIcon.pass3 {
    background: url(../img/renewal/passStepIcon3.svg) no-repeat
}

.stepIcon.pass4 {
    background: url(../img/renewal/passStepIcon4.svg) no-repeat
}




/* 캘린더 */


.fc {
    display: flex;
    /* flex-direction: column; */
    font-size: 1em;
    justify-content: center;
}

.fc-direction-ltr {
    direction: ltr;
    text-align: left;
}

.fc .fc-button {
    appearance: button;
}


.fc, .fc *, .fc ::after, .fc ::before {
    box-sizing: border-box;
    margin-top: 1rem;
    padding-left: 1rem
}


.fc .fc-button:hover {
    text-decoration: none;
}

.fc .fc-toolbar.fc-header-toolbar {
    margin-bottom: 1.5em;
}
.fc .fc-toolbar {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.fc .fc-button-primary {
    background-color: var(--fc-button-bg-color);
    border-color: var(--fc-button-border-color);
    color: var(--fc-button-text-color);
}
.fc .fc-button {
    /* background-color: transparent; */
    border: 1px solid transparent;
    border-radius: 0.25em;
    display: inline-block;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.5;
    padding: 0.8em 0.65em;
    text-align: center;
    user-select: none;
    vertical-align: middle;
}





.board-calendar .fc-theme-standard th {
    border: 0
}

.board-calendar .fc-theme-standard .fc-scrollgrid {
    border: 0
}

.board-calendar .fc-scrollgrid-section>* {
    border-left-width: 1px;
    border-top-width: 1px
}

.board-calendar .fc-scrollgrid-liquid tbody>tr>td {
    border-radius: .5em;
    border-color: #e5e5e5
}

.board-calendar .fc-col-header-cell {
    padding: .5em 0;
    border-color: var(--basic-navy) !important;
    background-color: var(--basic-navy);
    color: #fff
}

.board-calendar .fc-col-header-cell:nth-of-type(1) .fc-scrollgrid-sync-inner {
    border-radius: .5em 0 0 .5em
}

.board-calendar .fc-col-header-cell.fc-day-sun {
    color: #ff6365;
    border-radius: .5em 0 0 .5em
}

.board-calendar .fc-col-header-cell.fc-day-sat {
    color: var(--primary);
    border-radius: 0 .5em .5em 0
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk>* {
    margin: 0
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk .fc-today-button {
    padding: 1em .5em;
    width: 160px;
    background-color: #eef7ff;
    color: var(--primary);
    font-size: 1em;
    font-weight: 700;
    border: 0;
    outline: 0;
    border-radius: 500px
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk .fc-today-button:before {
    content: "";
    width: 1em;
    height: 1em;
    border-radius: 100%;
    display: inline-block;
    vertical-align: middle;
    background: var(--basic-ylw);
    margin: -2px 4px 0 0
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk .fc-today-button:disabled {
    opacity: 1
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.5em
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-prev-button {
    width: 3.5em;
    height: 3.5em;
    background: url(../img/renewal/calendar-arr.png) no-repeat center/contain;
    border: 0;
    outline: 0
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-prev-button .fc-icon {
    display: none
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-next-button {
    width: 3.5em;
    height: 3.5em;
    background: url(../img/renewal/calendar-arr.png) no-repeat center/contain;
    transform: scaleX(-1);
    border: 0;
    outline: 0
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-next-button .fc-icon {
    display: none
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-toolbar-title {
    font-size: 2.875em;
    font-weight: 800;
    text-align: center;
    height: 1.3em;
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type {
    display: flex;
    gap: .8em
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type>* {
    width: 3em;
    height: 3em;
    /* text-indent: -999px; */
    overflow: hidden;
    border-radius: .5em;
    border: 0;
    outline: 0
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type>*:focus,.board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type>*:active {
    box-shadow: none
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type>*:focus {
    outline: 2px solid #000
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type .fc-moveCalendarBtn-button {
    background: #eee url(../img/renewal/icon-calendar.svg) no-repeat center/1.8em auto
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type .fc-moveCalendarBtn-button.on {
    background: var(--primary) url(../img/renewal/icon-calendar-wh.svg) no-repeat center/1.8em auto
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type .fc-moveListBtn-button {
    background: #eee url(../img/renewal/icon-list.svg) no-repeat center/1.8em auto
}

.board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type .fc-moveListBtn-button.on {
    background: var(--primary) url(../img/renewal/icon-list-wh.svg) no-repeat center/1.8em auto
}

.board-calendar .fc-event-main {
    text-align: center;
    font-size: .93em;
    font-weight: 700
}

.board-calendar .fc-daygrid-day {
    height: auto
}

.board-calendar .fc-daygrid-day-frame {
    padding: 5% 8% 8% 8%
}

.board-calendar .fc-daygrid-day-events {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    min-height: 0
}

.board-calendar .fc-daygrid-day-top .fc-daygrid-day-number {
    position: relative;
    font-weight: 500
}

.board-calendar .fc-daygrid-day-top .fc-daygrid-day-number::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 2em;
    height: 2em;
    border-radius: 500px
}

.board-calendar .fc-day-today {
    background: none !important;
    box-shadow: inset 0 0 0 3px var(--basic-ylw)
}

.board-calendar .fc-day-today .fc-daygrid-day-number::before {
    background-color: var(--basic-ylw)
}

.board-calendar .fc-day-sun .fc-daygrid-day-number {
    color: #da4d4f
}

.board-calendar .fc-day-sat .fc-daygrid-day-number {
    color: var(--primary)
}

.board-calendar .fc-daygrid-more-link {
    float: none;
    position: absolute;
    top: calc(100% + 5px);
    right: 5px;
    color: #555
}

.board-calendar .fc-daygrid-more-link:hover {
    color: #111
}

.board-calendar .fc-popover {
    border-radius: 1rem;
    border: 0;
    padding: 1rem;
    background: #fff !important;
    box-shadow: 0px 8px 24px 0px rgba(17,25,62,.16) !important
}

.board-calendar .fc-popover-header {
    text-align: center;
    font-weight: 700;
    display: block;
    background-color: #fff
}

.board-calendar .fc-popover-title {
    font-size: 2rem;
    color: #002445
}

.board-calendar .fc-popover-close {
    position: absolute;
    top: 10px;
    right: 10px
}

.board-calendar .fc-popover .fc-event {
    background-color: rgba(0,0,0,0) !important;
    border-color: rgba(0,0,0,0) !important
}

.board-calendar .fc-popover .fc-event-main {
    text-align: left;
    font-weight: 400 !important;
    color: #111 !important
}

.board-calendar .fc-popover .fc-event-start {
    margin-left: 0 !important
}

@media(max-width: 1240.98px) {
    .board-calendar .fc-view-harness {
        min-height:800px
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk .fc-today-button {
        width: 120px
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) {
        gap: 1em
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-prev-button,.board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-next-button {
        width: 3em;
        height: 3em
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-toolbar-title {
        font-size: 2.4em
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type {
        gap: .4em
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type>* {
        width: 3em;
        height: 3em
    }
}

@media(max-width: 767.98px) {
    .board-calendar .fc-view-harness {
        min-height:660px
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk .fc-today-button {
        width: 100px
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) {
        gap: .5em
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-prev-button,.board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-next-button {
        width: 2.5em;
        height: 2.5em
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-of-type(2) .fc-toolbar-title {
        font-size: 2em
    }

    .board-calendar .fc-header-toolbar .fc-toolbar-chunk:last-of-type>* {
        width: 2.5em;
        height: 2.5em
    }
}

.board-yearlist .month-list {
    display: flex;
    gap: 3em;
    margin-top: 3em
}

.board-yearlist .month-list+.month-list {
    margin-top: 2em;
    padding-top: 2em;
    border-top: 2px dashed #e5e5e5
}

.board-yearlist .month-list .month {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    width: 120px;
    background-color: #f6f6f6;
    color: var(--primary);
    border-radius: 16px;
    text-align: center;
    padding: 0 5px
}

.board-yearlist .month-list .schedule>div {
    display: flex;
    gap: 1.5em;
    font-size: 1.125em;
    font-weight: 600
}

@media(max-width: 767.98px) {
    .board-yearlist .month-list .schedule>div {
        flex-direction:column;
        gap: 5px
    }
}

.board-yearlist .month-list .schedule>div+div {
    margin-top: 1em
}

.board-yearlist .month-list .schedule>div .period {
    min-width: 220px;
    color: var(--light-navy);
    text-wrap: nowrap;
    font-size: 1em;
}

.board-yearlist .month-list.on .month {
    border: 3px solid #ffe500;
    background: #fff8b8
}

@media(max-width: 991.98px) {
    .board-yearlist .month-list {
        flex-direction:column;
        gap: 2em;
        margin-top: 0
    }

    .board-yearlist .month-list .month {
        width: 100%;
        height: 52px
    }

    .board-yearlist .month-list .schedule>div .period {
        width: 140px;
        min-width: 140px
    }
}

#fc-day {
    display: flex
}

#fc-day .fc-col-header-cell {
    flex: 1;
    text-align: center;
    font-weight: 600;
    line-height: 1.7
}


.login-container {
    max-width: 1300px;
    position: relative;
    z-index: 1;
    padding-bottom: 60px
}

.logo-wrap {
    background: var(--basic-navy);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1em;
    flex-shrink: 0
}

.logo-wrap .tit02 {
    margin: 0
}

.logo-wrap i {
    height: 1.5em;
    margin: 0 1.5em;
    border-left: 1px solid #fff
}

@media(max-width: 1240.98px) {
    .logo-wrap img {
        width:140px
    }

    .logo-wrap .tit02 {
        font-size: 18px
    }

    .logo-wrap i {
        height: 1.2em;
        margin: 0 1.2em
    }
}

.login {
    display: flex;
    flex-direction: column;
    min-height: 100vh
}

.login .banner-ch {
    background-image: none;
    margin: 1.5em 0;
    display: block
}

@media(max-width: 1240.98px) {
    .login .banner-ch {
        padding:20px
    }
}

.login-btm {
    margin-top: auto;
    background: #fbf8dc;
    position: relative
}

.login-btm .text-hide {
    position: absolute;
    bottom: 100%;
    margin-bottom: 1em;
    left: 0;
    right: 0;
    height: 5em;
    background: url(../img/renewal/login/text.png) repeat-x 0 0/auto 100%;
    font-size: 1em
}

@media(max-width: 1240.98px) {
    .login-btm .text-hide {
        height:32px
    }
}

.login-btm .inner {
    display: flex;
    align-items: center;
    padding: 1.5em var(--container-padding);
    max-width: 1340px;
    justify-content: space-between;
    margin: 0 auto
}

@media(max-width: 1240.98px) {
    .login-btm .inner {
        flex-direction:column;
        text-align: center
    }
}

.login-btm .info {
    color: #002445
}

@media(max-width: 1240.98px) {
    .login-btm .info strong {
        display:block
    }
}

.login-btm .copy {
    font-size: .9em;
    color: #999
}

@media(max-width: 1240.98px) {
    .login-btm .copy {
        margin-top:5px
    }
}

.loginWrap .row {
    --gutters-margin: 6px
}

.loginWrap .row>.col-xl-3 {
    margin-bottom: 1.5em;
    display: flex;
    flex-direction: column
}

.loginWrap .form-control {
    font-size: 16px;
    padding: 1em;
    border-radius: 1em !important;
    border: 0;
    background: #fff;
    margin-bottom: 8px;
    height: 56px
}

.loginWrap .btn:not(.btn-link) {
    display: flex;
    align-items: center;
    font-size: 1em;
    padding: 1em 0;
    border-radius: 1em;
    justify-content: center;
    width: 100%;
    gap: 1em;
    color: #fff !important;
    font-weight: 700;
    background: var(--primary) !important;
    border: 0 !important
}

.loginWrap .btn-link {
    color: #333 !important;
    font-size: 1em;
    padding: 0;
    box-shadow: none !important;
    border: 0 !important
}

.loginWrap .btn-link-wrap {
    margin: 1em 0 .5em !important;
    justify-content: center;
    gap: 1em
}

.loginWrap .btn-link-wrap>[class*=col] {
    padding: 0 !important
}

.loginWrap .btn-link-wrap>[class*=col]+[class*=col] {
    position: relative
}

.loginWrap .btn-link-wrap>[class*=col]+[class*=col]:after {
    content: "";
    position: absolute;
    height: 8px;
    border-left: 1px solid #b6b6b6;
    top: 50%;
    left: -0.5em;
    margin-top: -4px
}

.login_box {
    padding: 2em 1.5em 1em;
    background: #f6f6f6;
    border-radius: 1.5em 1.5em 0 0;
    flex: 1
}

.login_box h4 {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    font-weight: 700;
    gap: 8px;
    color: #111;
    margin-bottom: 1.2em
}

.login_staff {
    border-radius: 1.5em;
    background: #f6f6f6 url(../img/renewal/login/staff.png) no-repeat 100% 0/auto 100%
}

.login_staff .form-signin {
    max-width: 400px;
    margin: 0 auto
}

.login-infoText {
    padding: 1em 0;
    text-align: center;
    border-radius: 0 0 1.5em 1.5em;
    background: #eee
}

.support-request {
    display: flex;
    align-items: end;
    gap: 5em;
    padding: 3.5em;
    background: #002445 url(/front/img/renewal/collegelife/support-request-bg.png) no-repeat left center / auto 100%;
    border-radius: 2.5em
}

.support-request .call {
    padding: 2.5em 3.5em;
    text-wrap: nowrap;
    background: #eaeaea;
    border-radius: 35em 35em 35em 0
}

@media(max-width: 1240.98px) {
    .support-request {
        flex-direction:column;
        align-items: start;
        gap: 2em
    }

    .support-request .call {
        width: 100%
        
    }
}

@media(max-width: 1240.98px) {
    .support-request {
        padding:2.2em
    }

    .support-request .call {
        padding: 2em 3em
    }
}
@media(max-width: 760px) {
    .support-request .call img{
        width: 60%
        
    }
}


.banner-ic .desc {
    width: 100%;
}
.banner-ic .desc iframe{
    height: 72vh
}

.board-video {
    display: flex;
    gap: 1em;
    margin: 1.5em 0
}

.board-video .video-wrap {
    width: 100%;
    height: 100%;
    background: var(--basic-navy);
    border-radius: 0 0 1em 1em;
    overflow: hidden
}

.board-video .video-wrap .video {
    position: relative;
    padding-top: 56%;
    width: 100%
}

.board-video .video-wrap .video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.board-video .video-wrap .video-title {
    padding: 1em 1.25em;
    text-align: center;
    color: #fff
}

.board-video .video-list {
    padding-left: 16px;
    padding-right: 8px;
    min-width: 440px;
    width: 440px;
    overflow-y: scroll
}

.board-video .video-list::-webkit-scrollbar {
    width: 8px
}

.board-video .video-list::-webkit-scrollbar-track {
    background-clip: padding-box;
    cursor: pointer
}

.board-video .video-list::-webkit-scrollbar-thumb {
    background: #e5e5e5;
    border-radius: 8px;
    background-clip: padding-box;
    cursor: pointer
}

.board-video .video-list::-webkit-scrollbar-thumb:hover {
    cursor: pointer
}

.board-video .video-list .video-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1em;
    padding: 1em;
    border-radius: 1em;
    cursor: pointer
}

.board-video .video-list .video-item .thumb {
    position: relative;
    min-width: 136px;
    height: 76px;
    overflow: hidden
}

.board-video .video-list .video-item .thumb img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    object-fit: cover
}

.board-video .video-list .video-item dl {
    overflow: hidden
}

.board-video .video-list .video-item dl dt {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5
}

.board-video .video-list .video-item dl dd {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1
}

.board-video .video-list .video-item.active {
    background-color: var(--basic-ylw)
}

@media(min-width: 992px) {
    .board-video .video-list .video-item.active::before {
        content:"";
        display: block;
        position: absolute;
        top: 50%;
        left: -16px;
        transform: translateY(-50%);
        width: 20px;
        height: 22px;
        background: url("../img/renewal/icon-video-list-tail.png") no-repeat center/contain
    }
}

@media(max-width: 991.98px) {
    .board-video {
        flex-direction:column
    }

    .board-video .video-list {
        display: flex;
        gap: 8px;
        overflow-y: hidden;
        overflow-x: scroll;
        padding-left: 0;
        width: 100%
    }

    .board-video .video-list::-webkit-scrollbar {
        display: none
    }

    .board-video .video-list .video-item {
        padding: 3px;
        border-radius: 0
    }

    .board-video .video-list .video-item dl {
        display: none
    }

    .board-video .video-list .video-item.active {
        background: none;
        box-shadow: 0 0 0 3px var(--basic-ylw) inset
    }
}
@media(max-width: 760px) {
    .banner-ic .desc iframe{
        height: 49vh
       }
    .table02 iframe{height: 49vh}
    }
@media(max-width: 430px) {
.banner-ic .desc iframe{
    height: 26vh
   }
.table02 iframe{height: 26vh}
}