@charset "UTF-8;"

/* text color */
.text-red {color: #c82448 !important;}
.text-orange {color: #f04837 !important;}
.text-blue {color: #434343 !important;}
.text-blue::before {color: #045ed9 !important;}
.text-navy {color: #045ed9 !important;}
.text-gray {color: #585c70 !important;}

/* keyword color */
.k-green {color: #27afd3;}
.k-sky {color: #2a8dcc;}
.k-blue {color: #2464ab;}
.k-navy {color: #17509a;}
.k-purple {color: #786dae;}

strong.text-blue {color: #045ed9 !important;}

/* cate color */
/* .cate-blue {background-color: #003594; color:#fff;}
.cate-red {background-color: #881538; color:#fff;}
.cate-yellow {background-color: #f1b434; color:#fff;}
.cate-green {background-color: #007a33; color:#fff;}
.cate-brown {background-color: #877669; color:#fff;} */

/* button style */
/* button */
.cont-btn {padding: 0 15px; height: 40px; font-size: 17px; display: flex; align-items: center; justify-content: center; border-radius: 5px; transition: all 0.3s ease-in-out; width: fit-content;}
.cont-btn i {margin-left: 12px; font-size: 14px; display: flex; align-items: center; justify-content: center; color: inherit;}
.btn {padding: 6px 12px; font-size: 17px; border-radius: 5px;}

.btn-gray {background-color: #9098a8; border-color: #9098a8; color: #fff;}
.btn-gray:hover {background-color: #858c9b; border-color: #858c9b; color: #fff;}
.btn-gray:focus,.btn-gray.focus {background-color: #9098a8 !important; color: #fff !important; border-color: #9098a8 !important;}
.btn-gray:active,.btn-gray.active,.show > .btn-gray.dropdown-toggle {background-color: #858c9b !important; color: #fff !important; border-color: #858c9b !important;}

.btn-blue {background-color: #045ed9; color: #fff;}
.btn-blue:hover {background-color: #0354c5; color: #fff;}
.btn-sky {background-color: #8599be; color: #fff;}
.btn-sky:hover {background-color: #7c8eb1; color: #fff;}
.btn-navy {background-color: #2a4aac; color: #fff;}
.btn-navy:hover {background-color: #233f92; color: #fff;}
.btn-dark-navy {background-color: #1b224e; color: #fff;}
.btn-dark-navy i {color: #95c1ea !important;}
.btn-dark-navy:hover {background-color: #29326e; color: #fff;}
.btn-green {background-color: #20919b; color: #fff;}
.btn-green:hover {background-color: #1c7e86; color: #fff;}

.btn-outline-black {border: 1px solid #222; color: #222;}
.btn-outline-black:hover {background-color: #222; color: #fff;}
.btn-outline-blue {border: 1px solid #045ed9; color: #3f66dd;}
.btn-outline-blue:hover {background-color: #0354c5; color: #fff;}
.btn-outline-navy {border:1px solid #2a4aac; color: #2a4aac;}
.btn-outline-navy:hover {background-color: #26449c; color: #fff;}

/* ----- 버튼, 인풋 등 ----- */
button {overflow: hidden;}
input[type="radio"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
input[type="radio"]+label{padding-left:29px !important;padding-right:5px;min-height:22px;line-height:22px;display:inline-block;position:relative;vertical-align:top;margin-bottom:0;cursor:pointer;}
input[type="radio"]+label:before{content:"";display:inline-block; position:absolute; width:22px;height:22px;border:1px solid #D3CFC8;border-radius:50%;margin-left:-29px}
input[type="radio"]:checked+label:before{background:#0d6efd;border-color:#0d6efd;}
input[type="radio"]:checked+label:after{content:"";display:inline-block;position:absolute;top:0;left:0;width:7px;height:10px;border:2px solid #fff;border-left:none;border-top:none;transform:translate(7.75px,4.5px)rotate(45deg);-ms-transform:translate(7.75px,4.5px)rotate(45deg)}
.form-check {line-height: 1.6;}


/* ----- 타이틀, 컨텐츠 폰트 등 ----- */
.p-total {font-size: 19px;font-weight: bold;margin-bottom: 10px;margin-left: 8px;margin-top: 50px;}
.p-total span {font-weight: 600;}
.p-total .num1{color: #333;}
.p-total .num2{color: #e13c14;}

.cont-box {margin-bottom: 120px;}
.cont-box .title {font-weight: bold; font-size: 23px; color: var(--main-color); margin-bottom: 8px;}
.cont-box .con-title {font-weight: bold; margin-bottom: 15px; font-size: 33px; color: var(--main-color);}
.cont-box .con-detail {margin-bottom: 100px; margin-left: 5px; font-size: 20px;}
.cont-box .con-detail:last-child {margin-bottom:0}
.cont-box .con-detail > * {margin-bottom:20px}
.cont-box .con-detail > *:last-child {margin-bottom:0}

@media (max-width:1024px) {
    .cont-box .title {font-size: 21px;}
}
@media (max-width:768px) {
  	.cont-box {margin-bottom: 48px;}
    .cont-box .con-title {font-size: 30px !important;}
    .cont-box .con-detail {margin-left: 5px;}
}
@media (max-width:550px) {
    .cont-box .con-title {font-size: 24px !important;}
    .cont-box .con-detail {margin-left: 0px;}
}


/* ----- 모달 공통 ----- */
.modal {padding: 20px !important;}
.modal .modal-header {padding: 15px 20px !important;}
.modal .modal-title {font-size: 25px !important;}
.modal .modal-content {padding: 0 !important;}
.modal .modal-body {padding: 15px !important;}
.modal .cont-btn {border-radius: 100px; height: 45px; width: 180px; font-size: 19px;}

@media(max-width: 575px) {
    .modal {padding: 5px !important;}
    .modal .modal-title {font-size: 21px !important;}
    .modal .modal-header {padding: 10px 15px !important;}

    .modal .cont-btn {width: 150px; height: 40px; font-size: 17px;}
}
@media (max-width: 450px) {
    .modal .cont-btn {width: 120px; height: 38px;}
}


/* ----- 바로가기 버튼 ----- */
.board .btn-wrap {display: block;}
.board-view .btn-wrap {display: block;}
#fwrite .btn-wrap {display: block;}

.btn-wrap {display: flex; justify-content: center; overflow: visible; margin-top: 0; padding-bottom: 0; flex-wrap: wrap;}
.btn-wrap .go-btn {margin: 15px 5px ;}
.info-wrap .btn-wrap {justify-content: flex-start; margin-top: 30px;}
.info-wrap .btn-wrap > *:first-child {margin-left: 0; }
.info-wrap .btn-wrap .go-btn .btn p {padding: 10px 30px;}

.go-btn {text-align: center; margin: 50px auto;}
.go-btn .btn {border: none; padding: 0; position: relative; overflow: visible;}
.go-btn .btn:before {content:''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #aed5fc; border-radius: 50px; animation: btn-ani 1.0s cubic-bezier(0.26, 0.03, 0.56, 1.03) both alternate infinite;}
.go-btn .btn p {font-weight: bold; text-align: center; position: relative; overflow: hidden; z-index: 0; transition: 0.5s; padding: 15px 35px; font-size: 20px; background: #307ccf; border-radius: 500px; color: #fff;}
.go-btn .btn span {position: absolute; width: 25%; height: 100%; background-color: #ffffff; transform: translateY(150%); border-radius: 50%; left: calc((var(--n) - 1) * 25%); transition: 0.5s; transition-delay: calc((var(--n) - 1) * 0.1s); z-index: -1;}
.go-btn .btn:hover p {color: #307ccf; box-shadow: 0px 0px 15px #5e9fe763; background: #fff;}
.go-btn .btn:hover p span {transform: translateY(-20px) scale(2);}
.go-btn span:nth-child(1) {--n: 1;}
.go-btn span:nth-child(2) {--n: 2;}
.go-btn span:nth-child(3) {--n: 3;}
.go-btn span:nth-child(4) {--n: 4;}

.go-btn.aninone .btn:before {display: none;}

.go-btn.ver02 .btn p {background: #fff; color: #307ccf; border: 1px solid #307ccf;}
.go-btn.ver02 .btn p span {background:#307ccf}
.go-btn.ver02 .btn p:hover {color: #fff !important;}

.go-btn.ver03 .btn p {background: #373737; box-shadow: 0px 0px 15px #8d8d8d4f;}
.go-btn.ver03 .btn p span {background:#fff}
.go-btn.ver03 .btn p:hover {color: #000 !important; background: #fff;}

@keyframes btn-ani {
    0% {width: 100%; height: 100%; opacity: 1;}
    100% {width: calc(100% + 40px); height: calc(100% + 30px); opacity: 0;}
}
@keyframes btn-ani-m {
    0% {width: 100%; height: 100%; opacity: 1;}
    100% {width: calc(100% + 30px); height: calc(100% + 20px); opacity: 0;}
}
@media (max-width:768px) {
    .go-btn .btn:before {animation: btn-ani-m 1.0s cubic-bezier(0.26, 0.03, 0.56, 1.03) both alternate infinite;}
    .go-btn .btn p {padding: 10px 30px; font-size: 18px;}
    .info-wrap .btn-wrap > * {margin-top: 20px; margin-right: 5px;}
    .info-wrap .btn-wrap .go-btn .btn p {padding: 8px 20px;}
}
@media (max-width:550px) {
    .go-btn {margin: 20px auto;}
    .go-btn .btn p {padding: 8px 20px;font-size: 16px;}

    .btn-wrap .go-btn {margin: 5px 3px;}
    .go-btn.ver03 .btn p {box-shadow: 0px 0px 5px #8d8d8d4f;}
    .go-btn .btn:hover p {box-shadow: 0px 0px 5px #5e9fe763;}
    .info-wrap .btn-wrap {margin-top: 0;}
    .info-wrap .btn-wrap > * {margin-top: 10px;}
    .info-wrap .btn-wrap .go-btn .btn p {font-size: 16px;}
}
@media(max-width:1400px) {
	.tbl-wrap {overflow-x: auto;}
}


/* ----- 검색 필터, 토탈 박스 ----- */
.basic_box {display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; border: 1px solid #e7e7e7; border-radius: 8px; background: #fbfbfb; margin-bottom: 30px;}
.basic_box .basic_box_fr, .basic_box .basic_box_fr form{display:flex; gap:5px;}
.basic_box .basic_box_fl {display: flex; align-items: center; justify-content: center; height: 100%; font-size: 17px;}
.board-total span strong {color:#e5503a; font-weight:700; display: inline-block;}
.board-total .total {position: relative; padding-left: 20px; display: inline-block; margin-right: 10px;}
.board-total .total:before {position: absolute; content: '\F38B'; font-family: 'bootstrap-icons'; font-size: 17px; top: 50%; transform: translateY(-50%); ; left: 0; width: 17px;}

.basic_box input, .basic_box select {height: 42px;}
.basic_box .basic_box_fr select{max-width: 175px; min-width: 130px;}
.basic_box .basic_box_fr input{max-width: 200px; min-width: 200px;}
/* .basic_box .basic_box_fr .search-input-group{position:relative;} */
/* .basic_box .basic_box_fr .search-input-group input{padding-right: 50px; height:42px; min-width: 250px;} */
/* .basic_box .basic_box_fr .search-input-group button{height: calc(100% - 2px); padding: 0 12px; border-left: 1px solid #e7e7e7; position: absolute; top: 50%; transform: translateY(-50%); right: 0; display: flex; align-items: center; justify-content: center;} */
/* .basic_box .basic_box_fr .search-input-group button i{color: #212529;} */
.basic_box .basic_box_fr .basic-btn-wrap {display: flex; gap: 5px;}
.basic_box .basic_box_fr button {max-width: 110px; min-width: 110px; height: 42px; padding: 0;}
.basic_box .basic_box_fr .search-btn {max-width: 80px; min-width: 80px;}
.basic_box .basic_box_fr button i {font-size: 18px; margin-left: 10px;}

/* 필터 상세검색 */
.filter-detail-wrap {width: 100%; max-height: 0; background-color: #f8f9fb; border-radius: 10px; overflow: hidden; transition: all 0.3s ease-in-out; margin-bottom: 0 !important;}
.filter-detail-wrap.active {max-height: 999px; margin-bottom: 30px !important;}
.filter-detail-wrap input, .filter-detail-wrap select {height: 42px;}

.filter-detail-box {width: 100%; height: 100%; padding: 25px 30px 20px; display: flex; flex-wrap: wrap; width: 100%; gap: 10px 20px;}
.filter-detail-box .filter-detail-row {width: calc(50% - 10px); display: flex;}
.filter-detail-box .filter-detail-row .tit {width: 100px; display: flex; align-items: center; justify-content: flex-start; font-size: 18px; font-weight: bold;}
.filter-detail-box .filter-detail-row .filter-cont {width: 100%; flex: 1; display: flex; gap: 5px; padding: 3px; align-items: center;}
.filter-detail-box .row-100 {width: 100%;}

.filter-detail-box .filter-detail-row .filter-search-box {width: 100%; display: flex; gap: 5px; align-items: center;}
.filter-detail-box .filter-detail-row .filter-search-box input {width:100%;}
.filter-detail-box .filter-detail-row .filter-search-box span {display: flex; align-items: center; justify-content: center; white-space: nowrap; height: 100%; font-size: 16px;}

.filter-btn-wrap {width: 100%; display: flex; gap: 10px; align-items: center; justify-content: center; margin-bottom: 25px;}
.filter-btn-wrap button {height: 45px; padding: 0 22px; border-radius: 22.5px; font-size: 18px;}
.filter-btn-wrap button i {font-size: 18px; margin-left: 10px;}

@media (max-width:1024px) {
    .basic_box {flex-direction: column; gap: 10px; align-items: flex-start; padding: 10px; margin-bottom: 20px;}
    .filter-detail-wrap.active {margin-bottom: 20px !important;}
}
@media (max-width:1280px) {
    .filter-detail-box .filter-detail-row {width: 100%;}
}
@media (max-width: 768px) {
    .basic_box .basic_box_fr input {min-width: 140px;}
    .basic_box input, .basic_box select {height: 38px;}
    .basic_box .basic_box_fr button {height: 38px;}

    .filter-detail-wrap input, .filter-detail-wrap select {height: 38px;}
    .filter-detail-box {padding: 20px 10px 15px; gap: 5px;}
    /* .filter-detail-box > table tbody {gap: 5px;} */
    .filter-btn-wrap {margin-bottom: 20px;}
    .filter-btn-wrap button {height: 40px; padding: 0 18px;}
}
@media (max-width:720px) {
    .basic_box .basic_box_fr, .basic_box .basic_box_fr form {flex-direction: column; width: 100%;}
    .basic_box .basic_box_fr select, .basic_box .basic_box_fr input {width: 100%; max-width: 100%; min-width: 100%;}
    .basic_box .basic_box_fr .basic-btn-wrap {align-items: center; justify-content: center; margin-top: 5px;}

    .filter-detail-box {gap: 10px;}
    .filter-detail-box .filter-detail-row {flex-direction: column;}
    .filter-detail-box .filter-detail-row .tit {align-items: flex-start; padding:0; font-size: 17px; margin-bottom: 5px; padding-left: 5px;}
}
@media (max-width:530px) {
    .filter-detail-box .filter-detail-row .filter-cont {flex-direction: column; width: 100%;}
    .filter-detail-box .filter-detail-row .filter-cont select, .filter-detail-box .filter-detail-row input {width: 100% !important;}
}


/* ----- 서브 컨텐츠 테이블 모바일 ----- */
@media all and (max-width:1200px) {
  .table_responsive:before {z-index: 2;}
  .table_responsive > thead,
  .table_responsive > tfoot {display: none;}
  .table_responsive > tbody {display:block;}
  .table_responsive > tbody > tr {display: block;border-bottom: 1px solid #d7d7d7;z-index: 1;position: relative;}
  .table_responsive > tbody > tr > td[data-title]:before,
  .table_responsive > thead > tr > td[data-title]:before {content:attr(data-title);color: #232222;font-size: 17px;position: absolute;left: 10px;top: 50%;transform: translateY(-50%); z-index: 9;max-width: 100px;font-weight: 600; }
  .table_responsive > thead > tr > th,
  .table_responsive > tbody > tr > th,
  .table_responsive > thead > tr > td,
  .table_responsive > tbody > tr > td {display: block;vertical-align: middle;position: relative;box-sizing: border-box;text-align: left;border: 0;min-height: 30px !important;height: auto;overflow: visible;padding: 10px 0;padding-left: 135px;font-size: 18px;}
  .table_responsive > tbody > tr > th {display:none}
  .table_responsive tr::before {content: "";display: block;width: 120px;height: 100%;background: #fafafa;position: absolute;left: 0px;top: 0;z-index: 1;}
  #txt_minCareerM {padding: 5px 12px;}
  #txt_maxCareerM {padding: 5px 12px;}
}
@media (max-width: 768px) {
  .recruit {margin-bottom: 48px}
  .recruit .search-box {padding: 20px;}

  .table_responsive > tbody > tr > td[data-title]:before,
  .table_responsive > thead > tr > td[data-title]:before {font-size: 16px; }
  .table_responsive > thead > tr > th,
  .table_responsive > tbody > tr > th,
  .table_responsive > thead > tr > td,
  .table_responsive > tbody > tr > td {padding: 8px 0;padding-left: 128px;font-size: 17px;}
  .table_responsive tr::before {width: 115px;}
}
@media (max-width: 550px) {
  .table_responsive tr::before {width: 100px;}
  .table_responsive > tbody > tr > td[data-title]:before,
  .table_responsive > thead > tr > td[data-title]:before {/*top: 12px;*/max-width: 80px;}
  .table_responsive > thead > tr > th,
  .table_responsive > tbody > tr > th,
  .table_responsive > thead > tr > td,
  .table_responsive > tbody > tr > td {padding-left: 110px;/* max-width: calc(100% - 80px); */}
}
/* --- 20250730 테이블 모바일 잘림 현상 수정 --- */
@media (max-width: 480px) {
    .table_responsive > thead > tr > th, .table_responsive > tbody > tr > th, .table_responsive > thead > tr > td, .table_responsive > tbody > tr > td {padding-left: 30%;}
}
@media (max-width: 400px) {
    .table_responsive > thead > tr > th, .table_responsive > tbody > tr > th, .table_responsive > thead > tr > td, .table_responsive > tbody > tr > td {padding-left: 35%;}
}
/* @media (max-width: 430px) {
    .table_responsive > thead > tr > th, .table_responsive > tbody > tr > th, .table_responsive > thead > tr > td, .table_responsive > tbody > tr > td {padding-left: 0; display: flex; flex-direction: column; gap: 3px; background-color: transparent;}
    .table_responsive tr::before {display: none;}
    .table_responsive > tbody > tr > td[data-title]:before, .table_responsive > thead > tr > td[data-title]:before {position: static; max-width: 100%; font-size: 18px;}
    .table_responsive > tbody > tr:nth-child(even) {background-color: #fafafa;}
} */




/* ----- 개방 강좌 ----- */
.online .list {display: flex; flex-wrap: wrap; gap: 30px;}
.online .list > li {width: calc(25% - 22.5px);}
.online .list li a {box-shadow: 0px 0px 10px #30303021; border-radius: 15px; overflow: hidden; transition: 0.3s; height: 100%; display: block; position: relative;}
.online .img-wrap {width: 100%; height: 220px; overflow: hidden; background: #f4f4f4 url('../images/sub/notice-logo.png') no-repeat center center / 60%;}
.online .img-wrap img {padding: 0; width: 100%; height: 100%; object-fit: cover;}
.online .txt-wrap {padding: 30px 25px 25px; height: calc(100% - 220px); display: flex; flex-direction: column; justify-content: flex-end;}

.online .cate {display: flex; justify-content: center; gap: 5px;}
.online .cate span {border-radius: 50px; line-height: 1.2; font-size: 15px; font-weight: 500; text-align: center; margin-bottom: 10px; padding: 4px 15px; display: flex; align-items: center; justify-content: center; position: relative;}
.online .cate span.green{border: 1px solid #1a9438; color: #1a9438;}
.online .cate span.orange{border: 1px solid #e28103; color: #e28103;}
.online .cate span.blue{border: 1px solid #0a4b90; color: #044294;}
.online .list .title {font-size: 23px; font-weight: 600; margin-bottom: 25px; position: relative; line-height: 1.2; text-align: center; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; height: 100%;}
.online .info {border-top: 1px dashed #ccc; padding-top: 13px;}
.online .info li {display: flex; margin: 10px 0; color: #666666; padding-left: 12px; position: relative;}
.online .info li:before {content: ''; position: absolute; width: 4px; height: 4px; background: #5b5b5b; left: 0; top: 8px; border-radius: 50px;}
.online .info li span {font-size: 18px; line-height: 22px;}
.online .info li .txt1 {font-weight: 600; margin-right: 15px; min-width: 72px; color: #292929;}
.online .info li .txt2 {width: 100%; font-weight: 300; max-width: calc(100% - 70px);}
.online .info li .txt2 .amount {max-width: 350px; height: 23px; width: 99%; top: -1px; position: relative;}
.online .state {background: #888; transition: 0.3s; color: #fff; line-height: 1; text-align: center; border-radius: 50px; padding: 10px; margin-top: 25px; font-size: 20px; position: relative;}
.online .state:before {content:'\F138'; position:absolute; top: 4px; right: 0; font-family: 'bootstrap-icons'; font-size: 30px; width: 100%; opacity: 0; transition: 0.3s; transform: translateX(-20px); color: #fff;}
.online .d-day {background: #fff; color:#327dec; border-radius: 40px; font-weight: bold; padding: 3px 10px; margin-left: 8px; font-size: 16px; position: relative; top: -1px; transition: 0.3s;}

/* .online .ready:hover > a {box-shadow: 0px 0px 15px #00aea93d !important;} */
.online .ready .state {background:#00aea9;}
.online .ready .state span {display: none;}

/* .online .ing:hover > a {box-shadow: 0px 0px 15px #327dec3d !important;} */
.online .ing .state {background:#327dec}

.online .end .state:before {display:none;}
.online .end .state span {display: none;}

.online .list .irs span {top: 0; height: 100%; line-height: 1;}
.online .list .irs .irs-min, .online .list .irs .irs-max {max-width: 50px; font-size: 13px; line-height: 1; padding: 0; background: none; display: flex; flex-direction: column; justify-content: center; width: 100%; margin-left: 5px; cursor: pointer;}
.online .list .irs .irs-min {left: 100%; display: none;}
.online .list .irs .irs-max {right: 8px; text-align: right;}
.online .list .irs--flat {height: 100%;}
.online .list .irs--flat .irs-handle {display: none;}
.online .list .irs--flat .irs-single {font-size: 12px; line-height: 1; padding: 0px 8px; z-index: 1; display: flex; flex-direction: column; justify-content: center; left: 0% !important;}
.online .list .irs--flat .irs-single:before {display:none}

.online .list > li:hover a {/*transform: translateY(-20px);*/ transition: 0.3s; box-shadow: 0px 0px 15px #3939393d;}
.online .list > li:not(.end):hover .state {color: transparent;}
.online .list > li:hover .state:before {opacity: 1; transform: translateX(0); transition: 0.3s;}
.online .list > li:hover .state span {opacity:0; transition:0.3s}

@media (max-width:1300px) {
    .online .list > li {width: calc(33.333% - 20px);}
}
@media (max-width:1024px) {
    .online .list {gap: 20px;}
    .online .list > li {width: calc(50% - 10px);}
    .online .info li {padding-left: 13px;}
    .online .info li:before {top: 9px;}
    .online .txt-wrap {padding: 20px 18px 20px;}
}
@media (max-width:768px) {
    .online .info {padding-top:5px}
    .online .info li {padding-left: 10px;}
    .online .info li:before {width: 3px; height: 3px;}
    .online .list .title {font-size: 20px;}
    .online .info li span {font-size: 17px;}
    .online .info li .txt1 {margin-right: 5px;}
    .online .txt-wrap {padding: 20px 18px 20px;}
    .online .state {margin-top:10px; font-size: 18px;}

    .online .list > li {width: 100%; max-width: 400px; margin: 0 auto;}
}

/* 개방 강좌 상세 */
.online .view .head {border-top: 2px solid #878787; padding: 20px 30px 20px; border-bottom: 1px solid #ccc;}
.online .view .head .top {display: flex;}
.online .view .cate {gap: 0;}
.online .view .state, .online .view .cate span {margin: 0 8px 0 0 !important; border-radius: 35px; font-size: 20px; padding: 10px 20px; line-height: 1; transform: translateX(0); position: initial; display: flex; align-items: center; justify-content: center; height: 38px;}
.online .view .state .d-day {margin-right: -10px; margin-left: 5px; top: 0;}
.online .view .head .title {margin-top: 15px; font-size: 32px; text-align: left; padding-left: 5px; font-weight: bold; margin-bottom: 20px;}
.online .view .body {border-bottom: 1px solid #ccc; margin-bottom: 60px;}
.online .view .body .cont {padding: 50px 30px; height: 100%; min-height: 500px;}
.online .view .info li .txt1 {margin-right: 25px;}
.online .view .file-wrap {margin-top: 20px; background: #f8f9fb; padding: 25px;}
.online .view .file-wrap strong {font-size: 20px; line-height: 1;}
.online .view .file-wrap ul {width: 100%; padding: 8px 5px 0; display: flex; flex-wrap: wrap; flex-direction: column;}
.online .view .file-wrap ul li {margin: 5px 0; margin-right: 100px; font-size: 18px;}
.online .view .file-wrap ul li a {display: inline-block;}
.online .view .file-wrap ul li a .size {font-size: 16px; color: #6b6b6b; font-weight: 300;}
.online .view .file-wrap ul li a:hover {text-decoration: underline !important;}
.online .cont-box .title {margin-bottom: 10px;}

@media (max-width:1300px) {
    .online .view .head {padding: 20px;}
    .online .view .head .title {font-size: 30px; margin-top: 10px;}
    /* .online .view .state, .online .view .cate span {font-size: 19px;} */
}
@media (max-width:1024px) {
    .online .view .head {padding: 15px;}
    .online .view .head .title {font-size: 28px; margin-bottom: 15px;}
    .online .view .state, .online .view .cate span {font-size: 18px; height: 36px;}
    .online .view .state .d-day {font-size: 16px; top: 0;}
    .online .view .file-wrap {margin-top: 10px; padding: 20px;}
    .online .view .file-wrap strong {font-size: 19px;}
    .online .view .file-wrap ul {padding: 10px 8px 0;}
    .online .view .file-wrap ul li {margin: 3px 0; margin-right: 50px;}
    .online .cont-box .title {margin-bottom: 10px;}
}
@media (max-width:768px) {
    .online .view .head {padding: 15px 10px;}
    .online .view .state, .online .view .cate span {font-size: 16px; padding: 8px 18px 8px; margin-right: 8px; height: 32px;}
    .online .view .state .d-day {font-size: 13px;}
    .online .view .head .title {font-size: 25px;}
    .online .view .body .cont {padding: 20px 20px;}
    .online .view .file-wrap {padding: 15px 15px 15px;}
    .online .view .file-wrap ul li {margin-right: 0; width: 100%; height: 23px;}
    .online .view .file-wrap ul li a {max-width: 400px; text-overflow: ellipsis; overflow: hidden; text-wrap: nowrap; display: inline-block; font-size: 17px;}
}
@media (max-width:550px) {
    .online .view .head {padding: 15px 5px;}
    .online .view .head .top {flex-wrap:wrap; gap: 5px 0;}
    .online .view .head .title {font-size: 22px;}
    .online .view .state, .online .view .cate span {margin-right: 5px;}
    /* .online .view .state .d-day {padding: 2px 10px;} */
    .online .view .body .cont {padding: 15px 15px;}
    .online .view .file-wrap {padding: 13px 13px 13px;}
    .online .view .file-wrap strong {font-size: 18px;}
    .online .view .file-wrap ul {padding: 5px 5px 0;}
    .online .view .file-wrap ul li {height: 20px;}
    .online .view .file-wrap ul li a {max-width: 100%; font-size: 16px;}
}


/* 신청 폼 테이블 */
.mo-table > tbody > tr > th span {font-weight: 500;}
.mo-table {overflow: hidden;}
.mo-table {min-width: unset;}

/* 필수선택 여부 */
.required {position: relative; color: #ea0303; font-size: 16px; font-weight: bold; margin-left: 3px}
.required-star {position: relative; padding: 0;}
.required-star::before {content: '*'; position: absolute; color: #ea0303; font-size: 16px; font-weight: bold; left: -9px; top: -4px;}
.badge {/*border: 1px solid rgba(var(--bs-primary-rgb));*/ font-size: 11px; position: relative; /*top: -3px; margin-left: 4px;*/}
.badge.text-danger {border-color: rgba(var(--bs-danger-rgb));}

.input-inline {display: flex; width:100%}
.input-inline span {display: flex; flex-direction: column; justify-content: center;}
.input-inline span.txt {padding-left: 5px;}
.input-inline span.hypen {padding: 0 8px;}

.check-wrap {display: flex; flex-wrap:wrap}
.check-wrap li {display: flex; margin: 10px 0px; margin-right: 1%;}
.check-wrap li > * {margin: 0; line-height: 1;}
.check-wrap li input {margin-right: 5px;}
.check-wrap li.etc-txt {min-width: 400px; height: 19px; margin-right: 0;}
.check-wrap li.etc-txt input[type="text"] {line-height: 1; border-radius: var(--bs-border-radius) !important; top: -6px;}

.check-wrap.col3 li {width: 32%;}
.check-wrap.col4 li {width: 24%;}
.check-wrap.col5 li {width: 19%;}

/* 데이트피커 */
.ui-datepicker-trigger {display: none;}
.ui-datepicker .ui-datepicker-title {margin: 0 33px;}
.ui-datepicker .ui-datepicker-title select {padding: 5px 5px; border-radius: 6px; margin: 0 2px; -webkit-appearance: auto !important;}

#ui-datepicker-div {z-index: 10 !important; width: fit-content !important;}

@media (max-width:1024px) {
    .required-star::before {left: 50%; transform: translateX(-50%); top: -10px;}
    .mo-table:before {z-index:1}
    .mo-table col {width:auto}
    .mo-table > tbody > tr {display: flex; flex-wrap: wrap; width: 100%;}
    .mo-table > tbody > tr > th, .mo-table > tbody > tr > td {height:auto}
    .mo-table > tbody > tr > th {width: 180px; position: relative; display: flex; flex-direction: column; justify-content: center;}
    .mo-table > tbody > tr > td {width: calc(100% - 180px);}
    .mo-table > tbody > tr > th span.required-star {transform: translateY(3px);}

    .check-wrap li {margin-right: 3%; width:auto !important;}
    .check-wrap li.etc-txt {min-width:300px;}
}
@media (max-width:768px) {
    .mo-table > tbody > tr > th {width: 150px;}
    .mo-table > tbody > tr > td {width: calc(100% - 150px);}

    .check-wrap li {margin: 5px 0px; width: 50% !important;}
}
@media (max-width:550px) {
    .required-star::before {top: -3px; left: -4px;}
    .mo-table > tbody > tr {flex-direction: column;}
    .mo-table > tbody > tr > th, .mo-table > tbody > tr > td {width: 100% !important;}
    .mo-table > tbody > tr > th {display: inline-block; line-height: 1; padding: 10px;}

    .check-wrap li {width: 100% !important;}
    .check-wrap li input {margin-top: -2px;}
    .check-wrap li.etc-txt {width:100%; min-width:1px;}
    /* .badge {top: -2px; margin-left: 4px;} */
}


/* ----- 공유 시설 ----- */
.online .cate span.fac{position: absolute; top: 15px; right: 15px;}
.online .cate span.purple{border: 1px solid #952fb4; color: #952fb4;}
.online .cate span.red-fill{background-color: #fff; border: 1px solid #dd496c; color: #dd496c; position: relative;}
.online .cate span.red-fill.pay{background-color: #dd496c; color: #fff;}
.online .cate span.red-fill.pay::before{content: ''; width: 20px; height: 20px; background:url('../images/sub/coin.svg')no-repeat center center / cover; position: absolute; top:-15px; left: 50%; transform: translateX(-50%);}
.online .cate span.blue-fill{background-color: #327dec; color: #fff;}
.online .cate span.green-fill{background:#00aea9; color: #fff;}
.online .cate span.gray-fill{background-color: #9ea2a9; color: #fff;}

/* 라디오, 체크박스 버튼 */
.online input[type="radio"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.online input[type="radio"]+label{padding-left:29px !important;padding-right:5px;min-height:22px;line-height:22px;display:inline-block;position:relative;vertical-align:top;margin-bottom:0;cursor:pointer;}
.online input[type="radio"]+label:before{content:"";display:inline-block; position:absolute; width:22px;height:22px;border:1px solid #D3CFC8;border-radius:50%;margin-left:-29px;}
.online input[type="radio"]:checked+label:before{background:#0d6efd;border-color:#0d6efd;}
.online input[type="radio"]:checked+label:after{content:"";display:inline-block;position:absolute;top:0px;left:0px;width:7px;height:10px;border:2px solid #fff;border-left:none;border-top:none;transform:translate(7.75px,4.5px)rotate(45deg);-ms-transform:translate(7.75px,4.5px)rotate(45deg);}
.online .form-check {line-height: 1.6;}

.online input[type="checkbox"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.online input[type="checkbox"]+label{padding-left:29px !important;padding-right:5px;min-height:22px;line-height:22px;display:inline-block;position:relative;vertical-align:top;margin-bottom:0;cursor:pointer;}
.online input[type="checkbox"]+label:before{content:"";display:inline-block; position:absolute; width:22px;height:22px;border:1px solid #D3CFC8;border-radius:50%;margin-left:-29px}
.online input[type="checkbox"]:checked+label:before{background:#0d6efd;border-color:#0d6efd;}
.online input[type="checkbox"]:checked+label:after{content:"";display:inline-block;position:absolute;top:0px;left:0px;width:7px;height:10px;border:2px solid #fff;border-left:none;border-top:none;transform:translate(7.75px,4.5px)rotate(45deg);-ms-transform:translate(7.75px,4.5px)rotate(45deg);}

/* 캘린더 */
 .calendar {padding: 0 16px 12px; text-align: center;}
 .calendar_top {position: relative; padding: 34px 0 32px;}
 .calendar_sub {color: #1f1f1f; font-size: 22px; font-weight: 700;}
 .calendar_top a {position: absolute; width: 30px; height: 30px; font-size: 0; line-height: 0;}
 .calendar_top a:before {content: ''; display: block; width: 12px; height: 12px; margin: auto; border-color: #4e5166; transform: rotate(45deg); position: relative; top: calc(50% - 6px);}
 .calendar_top .cal_prev {left: 0;}
 .calendar_top .cal_next {right: 0;}
 .calendar_top .cal_prev:before {border-bottom: 3px solid; border-left: 3px solid;}
 .calendar_top .cal_next:before {border-top: 3px solid; border-right: 3px solid;}
 .calendar_table col {width: calc(100%/7);}
 .calendar_table th {color: #808080; height: 40px; line-height: 40px; font-size: 19px; font-weight: 500; background-color: #f8f9fb;}
 .calendar_table th:first-child {border-radius: 40px 0 0 40px;}
 .calendar_table th:last-child {border-radius: 0 40px 40px 0}
 .calendar_table td {position: relative; height: 80px; color: #808080; font-size: 19px; font-weight: 400; vertical-align: middle;}
 .calendar_table td.prev {color: #ccc;}

.reservation {display: block ;margin-top: 0; padding: 24px 40px; border-radius: 30px; border: 1px solid #ccc; font-size: 0; line-height: normal; position: relative;}
.reservation .calendar_form {display: inline-block;width: calc(100% - 540px);margin-right: 60px; vertical-align: top;}
.reservation.facility_reservation .calendar_form {display: block; width: 100%;} 
.reservation .calendar_form .calendar {padding: 0;}
.reservation .calendar_form .calendar_top {padding: 30px 0 30px; /*border-bottom: 2px solid #1f1f1f;*/}
.reservation .calendar_form .calendar_sub {line-height: 30px;}
.reservation .calendar_form .calendar_table {margin-bottom: 30px;}
.reservation .calendar_form .calendar_table button {display: block; position: relative; margin: 0 auto; width: 100%; height: 100%;}
.reservation .calendar_form .calendar_table .abled {color: #1f1f1f; position: relative;}
.reservation .calendar_form .calendar_table .abled button {max-width: 100px; height: 70px; padding-bottom: 20px; border: 1px solid #ccc; border-radius: 15px;}
.reservation .calendar_form .calendar_table .abled button:focus {border: 1px solid #3f65d9;}
.reservation .calendar_form .calendar_table .abled button::after{content: '가능'; background-color: #f5f8fb; color: #1f1f1f; font-size: 16px; width: 100%; padding: 2px 0; position: absolute; bottom: 0; left: 0;}
.reservation .calendar_form .calendar_table .abled button:focus::after{content: '선택'; background-color: #3f65d9; color: #fff;}
.reservation .calendar_form .calendar_table .disabled {color: #ccc; position: relative;}
.reservation .calendar_form .calendar_table .disabled button {max-width: 100px; padding-bottom: 20px;}
.reservation .calendar_form .calendar_table .disabled button::after {content: '불가'; display: block; width: 100%; font-size: 16px; position: absolute; bottom: 15px; left: 50%; transform: translateX(-50%);}

.reservation .timeselect {display: inline-block;width: 480px; vertical-align: top;}
.reservation .timeselect .timeselect_top {padding: 30px 0 30px;border-bottom: 2px solid #1f1f1f;}
.reservation .timeselect .timeselect_top span {color: #1f1f1f; font-size: 22px; font-weight: 700;}
.reservation .timeselect .timeselect_title {margin-top: 15px; font-size: 20px; font-weight: 700; color: #1f1f1f;}
.reservation .timeselect .timeslots_list {margin: 5px -5px 30px;}
.reservation .timeselect .timeslots_item {line-height: 0; display: inline-block; overflow: hidden;width: calc((100% - (10px * 3))/3); margin: 5px; text-align: center;}
.reservation .timeselect .timeslots_list .form-check {display: flex; align-items: center; justify-content: center; padding: 0 6px; height: 46px; background-color: #fff;  border: 1px solid #ccc; border-radius: 25px; font-size: 17px; font-weight: 400;}
.reservation .timeselect .timeslots_item.disabled .form-check {background-color: #f5f8fb; color: #ccc;}
.reservation .reservation_btn {display: flex; align-items: center; justify-content: flex-end;}
.reservation .reservation_btn button {width:150px; height: 45px; font-size: 17px; border-radius: 30px;}

@media (max-width: 1080px) {
    .reservation .calendar_form {display: block; width: 100%;}
    .reservation .timeselect {display: block; width: 100%;}
    .reservation .timeselect .timeslots_item {width: calc((100% - (10px*4))/4);}
}
@media (max-width: 768px) {
    .reservation {padding: 0 20px 20px 20px;}
    .reservation .timeselect .timeslots_item {width: calc((100% - (10px*3))/3);}
}
@media (max-width: 600px) {
    .reservation .timeselect .timeslots_item {width: calc((100% - (10px*2))/2);}
}
@media (max-width: 500px) {
    .calendar_table th {font-size: 16px;}
    .reservation .calendar_table td {height: 60px; font-size: 16px;}
    .reservation .calendar_form .calendar_table .abled button {height: 50px; border-radius: 10px;}
    .reservation .calendar_form .calendar_table .abled button::after {font-size: 14px;}
    .reservation .calendar_form .calendar_table .disabled button::after {font-size: 14px;}

    .reservation .timeselect .timeslots_list .form-check {font-size: 16px; height: 40px;}
}
@media (max-width: 400px) {
    .reservation .timeselect .timeslots_item {width: 100%;}
    .reservation {border-radius: 20px;}
}

/* 공유 시설 상세 */
.online.facility .view .head {border-top: 0; display: flex; flex-wrap: wrap; gap: 40px; padding: 0 0 50px;}

.online.facility .view .head .facility-view-left {width: 570px; border-radius: 30px; box-shadow: 3px 3px 8px 0px rgba(0,0,0,0.15); position: relative; height: 380px;}
.online.facility .view .head .facility-view-right {width: calc(100% - 610px); flex: 1;}

.online.facility .view .head .info {border-top: 2px solid #1f1f1f; padding-top: 10px;}
.online.facility .view .head .info li {align-items: flex-start; gap: 15px; padding-left: 10px; margin: 15px 0;}
.online.facility .view .head .info li span {font-size: 19px;}
.online.facility .view .head .info li .txt1 {display: flex; align-items: center; flex: 1;}
.online.facility .view .head .info li .txt1 i {background-color: #f8f9fb; padding: 3px 5px; border-radius: 5px; margin-right: 5px;}
.online.facility .view .head .info li .txt2 {font-weight: 400; line-height: 1.5;}
.online.facility .view .head .info li::before {display: none;}

.online.facility .facility-swiper {width: 100%; height: 100%; position: relative; border-radius: 30px;}
.online.facility .facility-swiper .swiper-slide img {width: 100%; height: 100%; object-fit: cover;}
.online.facility .facility-swiper .swiper-controls {position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 8px; z-index: 1; background-color: rgba(0,0,0,.7); padding: 5px 20px; color: #fff; border-radius: 50px;}
.online.facility .facility-swiper .swiper-controls .swiper-pagination {position: static !important; font-size: 17px;}
.online.facility .facility-swiper .swiper-play-pause {display: flex; align-items: center; justify-content: center; font-size: 23px; margin-top: 4px;}

.online.facility .swiper-button-prev, .online.facility .swiper-button-next {top: auto !important; bottom: -30px !important; left: auto !important; right: 30px !important; width: 60px; height: 60px; border-radius: 50%;}
.online.facility .swiper-button-prev {background-color: #2a4aac; right: 97px !important;}
.online.facility .swiper-button-next {background-color: #2e7dd5;}
.online.facility .swiper-button-prev::after, .online.facility .swiper-button-next::after {font-size: 18px; font-weight: bold; color: #fff;}

@media (max-width:1440px) {
    .online.facility .view .head .facility-view-left {width: 500px;}
    .online.facility .view .head .facility-view-right {width: calc(100% - 540px);}
}
@media (max-width:1300px) {
    .online.facility .view .head {gap: 30px;}
    .online.facility .view .head .facility-view-right {width: calc(100% - 530px);}
}
@media (max-width:1080px) {
    .online.facility .view .head {flex-direction: column; padding: 0 0 20px;}
    .online.facility .view .head .facility-view-left {width: 100%; height: 400px; box-shadow: none; background-color: #f8f9fb;}
    .online.facility .view .head .facility-view-right {width: 100%;}

    .online.facility .facility-swiper .swiper-slide {display: flex; align-items: center; justify-content: center;}
    .online.facility .facility-swiper .swiper-slide img {max-width: 600px;}

    .online.facility .swiper-button-prev, .online.facility .swiper-button-next {top: 50% !important; transform: translateY(-50%) !important; bottom: auto !important; margin-top: 0 !important;}
    .online.facility .swiper-button-prev {left: -15px !important;}
    .online.facility .swiper-button-next {right: -15px !important;}
}
@media (max-width:768px) {
    .online.facility .view .head {padding: 0 0 10px;}
    .online.facility .view .head .info {padding-top: 5px;}
    .online.facility .view .head .info li {margin: 10px 0;}
    .online.facility .view .head .info li .txt2 {margin: 2px 0;}
    .online.facility .view .head .info li span {font-size: 17px;}
    .online.facility .view .head .facility-view-left {height: 320px;}

    .online.facility .facility-swiper .swiper-slide img {max-width: 480px;}
    .online.facility .swiper-button-prev, .online.facility .swiper-button-next {width: 50px; height: 50px;}
    .online.facility .swiper-button-prev::after, .online.facility .swiper-button-next::after {font-size: 14px;}
    .online.facility .facility-swiper .swiper-controls {padding: 4px 15px;}
    .online.facility .facility-swiper .swiper-controls .swiper-pagination {font-size: 16px;}
    .online.facility .facility-swiper .swiper-play-pause {font-size: 20px; margin-top: 1px;}
}
@media (max-width:500px) {
    .online.facility .view .head .info li {flex-direction: column; gap: 0;}
}
@media (max-width:400px) {
    .online.facility .view .head .info li {flex-direction: column; align-items: flex-start; gap: 2px; padding-left: 7px;}
    .online.facility .view .head .facility-view-left {border-radius: 20px; height: 280px;}
    
    .online.facility .facility-swiper {border-radius: 20px;}
    .online.facility .facility-swiper .swiper-slide img {max-width: 450px;}
}


/* ----- 비교과 프로그램 ----- */
.program-wrap > ul > li {display:flex; flex-wrap:wrap; padding:24px; margin-top:30px; border:1px solid #ebebeb; border-radius:15px; line-height: 33px; transition: box-shadow 0.3s ease-in-out;}
.program-wrap > ul > li:first-child {margin-top: 0;}
.program-wrap > ul > li:hover {box-shadow: 0px 0px 10px #30303021;}
.program-wrap .program-gp{width:calc(100% - 185px); padding-right:50px}
.program-wrap .program-etc{display:flex; flex-wrap:wrap; align-items:flex-end; align-content:flex-end; width:185px;}

.program-wrap .program-cont{display:flex; flex-wrap:wrap;}
.program-wrap .img-wrap{display:flex; align-items:center; justify-content:center; overflow:hidden; width:260px; height: 230px; border-radius:10px; border: 1px solid #ebebeb;}
.program-wrap .img-wrap img{width:100%; height:100%; object-fit: cover; max-width: 300px;}

.program-wrap .cdDiv{display:inline;word-break:keep-all; background-color: #eee;}
.program-wrap .desc-wrap{width:calc(100% - 260px); padding-left:40px}
.program-wrap .text-wrap .label-box,
.program-wrap .text-wrap .major-type,
.program-wrap .text-wrap .major-type li{display:inline-block;vertical-align:middle;font-weight:500;font-size:17px;color:#327dec;line-height: normal;}
.program-wrap .text-wrap .major-type li + li::before{content:'';display:inline-block;position:relative;top:-4px;width:3px;height:3px;border-radius:50%;margin:0 8px;background:#327dec;}
.program-wrap .text-wrap .label-box{margin-right:10px;}
.program-wrap .text-wrap .label-box > span,
.program-wrap .text-wrap .label-box .p-btn {display:inline-block; margin-right:4px; padding:8px 15px; border-radius:50px; font-weight:400; line-height:1; font-size:17px; vertical-align:top; border:2px solid #327dec; cursor: auto;}
.program-wrap .text-wrap .label-box .ing {background:#327dec !important; color:#fff;}
.program-wrap .text-wrap .label-box .dday{border:2px solid #327dec; color:#327dec;}
.program-wrap .text-wrap .tit a {width: fit-content; display:block;margin-top:12px;font-size:25px;font-weight:bold;color:#222; display: block; line-height: 1.4;}
.program-wrap .text-wrap .tit a:hover {text-decoration: underline !important;}
.program-wrap .text-wrap .desc a {width: fit-content; font-size:18px; margin-bottom: 10px; color:#666; display: block;}
.program-wrap .text-wrap .desc a:hover {text-decoration: underline !important;}

.skill-list-wrap .keyword-list {display: flex; gap: 5px 0; margin-bottom: 20px; flex-wrap: wrap; gap: 5px;}
.skill-list-wrap .keyword-list li{padding:0;}
.skill-list-wrap .check .txt {padding:6px 10px;display:block;border:1px solid #e7eef5;border-radius:50px;font-size:17px;color:#5d657a;line-height:1;background:#e7eef5;}
.skill-list-wrap .keyword-list .uncheck .txt{height:auto;display:block;padding:6px 10px;border:1px solid #ebebeb;border-radius:50px;font-size:17px;color:#777;line-height:1;}

.program-wrap .etc-wrap{display:flex;}
.program-wrap .etc-wrap .etc-cont{display:flex; width:100%; flex-wrap: wrap; gap: 20px;}
.program-wrap .etc-wrap .etc-cont dl{width: calc(25% - 15px);}
.program-wrap .etc-wrap dl{position:relative; line-height: 1.5;}
/* .program-wrap .etc-wrap dl::before{content:'\F194'; font-size: 20px; font-family: 'bootstrap-icons'; display:flex; align-items: center; justify-content: center; position:absolute; top: 0; left:0; width: 42px; height: 42px; border-radius:7px; background:#F4F6FC;} */
.program-wrap .etc-wrap dt{font-weight:600;color:#333; font-size: 17px;}
.program-wrap .etc-wrap dd{font-size: 17px;}
.program-wrap .etc-wrap dt i {background-color: #f8f9fb; padding: 3px 5px; border-radius: 5px; margin-right: 5px;}

.program-etc{position:relative;}
.program-wrap .count-box{display:flex;justify-content:center;width:100%;}
.program-wrap .count-box li{position:relative;padding:0 12px;text-align:center;font-size:17px;color:#999;white-space:nowrap}
.program-wrap .count-box li + li::before{content:'';display:block;position:absolute;top:50%;left:-1px;width:1px;height:24px;margin-top:-12px;background:#E6E6E6}
.program-wrap .count-box strong{display:block;font-weight:700;font-size:32px;color:#000;line-height:1.2}
.program-wrap .count-box strong.blue{color:#327dec;}
/* .program-wrap .count-box strong.green{color:#00aea9;} */

.program-wrap .apply-btn,.program-detail .apply-btn {position:relative;width:100%;margin-top:30px;padding:5px 15px;border-radius:5px;font-weight:500;color:#fff;background:#327dec;}
.program-wrap .apply-btn .txt,.program-detail .apply-btn .txt {display: flex; align-items: center; justify-content: space-between; width:100%;}
.program-wrap .apply-btn .txt i,.program-detail .apply-btn .txt i {color: #fff; font-size: 18px;}

.program-wrap > ul > li .cancel-btn {background-color: #dd496c;}
.program-detail .cancel-btn {background-color: #dd496c;}

.program-wrap > ul > li.ready .text-wrap .label-box .p-btn {border: 2px solid #00aea9; color: #fff;}
.program-wrap > ul > li.ready .text-wrap .major-type li + li::before {background-color: #00aea9;}
.program-wrap .text-wrap .label-box .ready {background-color:#00aea9;}
.program-wrap > ul > li.ready .text-wrap .label-box .dday {border: 2px solid #00aea9; color: #00aea9;}
.program-wrap > ul > li.ready .text-wrap .major-type li {color: #00aea9;}
.program-wrap > ul > li.ready .apply-btn {background-color: #00aea9;}

.program-wrap > ul > li.end .text-wrap .label-box .p-btn {border: 2px solid #888; color: #fff;}
.program-wrap > ul > li.end .text-wrap .major-type li + li::before {background-color: #888;}
.program-wrap .text-wrap .label-box .end {background-color:#888;}
.program-wrap > ul > li.end .text-wrap .label-box .dday {display: none;;}
.program-wrap > ul > li.end .text-wrap .major-type li {color: #888;}
.program-wrap > ul > li.end .text-wrap .tit a {color: #888;}
.program-wrap > ul > li.end .apply-btn {background-color: #f7f7f7; border: 1px solid #E6E6E6; color: #b2b2b2;}
.program-wrap > ul > li.end .apply-btn .txt i{color: #b2b2b2;}

@media (max-width: 1440px) {
    .program-wrap .apply-btn {font-size: 18px;}
}
@media (max-width: 1400px) {
    .program-wrap .etc-wrap .etc-cont{gap: 20px;}
    .program-wrap .etc-wrap .etc-cont dl{width: calc(50% - 10px);}
}
@media (max-width: 1024px) {
    .program-wrap > ul > li {flex-direction: column;}
    .program-wrap .img-wrap {width:100%; height: 100%; height: 300px;}
    .program-wrap .img-wrap img {object-fit: contain;}
    .program-wrap .program-gp {width: 100%; padding:0;}
    .program-wrap .text-wrap {padding-top: 20px;}
    .program-wrap .desc-wrap {width: 100%; padding:0;}
    .program-wrap .program-etc {width: 100%; margin-top: 30px;}
}
@media (max-width: 768px) {
    .program-wrap .text-wrap {padding-top: 15px;}
    .program-wrap .text-wrap .label-box > span, .program-wrap .text-wrap .label-box .p-btn {font-size: 16px; padding: 5px 12px;}
    .program-wrap .text-wrap .label-box, .program-wrap .text-wrap .major-type, .program-wrap .text-wrap .major-type li {font-size: 16px; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; margin: 4px 0;}
    .program-wrap .text-wrap .tit a, .program-detail .text-wrap .tit {font-size: 20px; margin-top: 0;}
    .program-wrap .text-wrap .major-type li + li::before {top:0;}
    .skill-list-wrap .keyword-list .uncheck .txt {font-size: 16px;}
    .program-wrap .text-wrap .desc {font-size: 17px;}
    .program-wrap .etc-wrap dl {font-size: 16px;}
    .program-wrap .count-box strong {font-size: 28px;}
    .program-wrap .count-box li {font-size: 16px;}
    .program-wrap .apply-btn {font-size: 17px; margin-top: 20px;}
}
@media (max-width: 500px) {
    .program-wrap > ul > li {padding: 15px;}
    .program-wrap .img-wrap {height: 200px;}
    .program-wrap .etc-wrap .etc-cont{gap: 10px 0;}
    .program-wrap .etc-wrap .etc-cont dl{width: 100%;}
    .program-wrap .program-etc {margin-top: 20px;}
}

/* 비교과 프로그램 상세 */
.program-detail .program-gp {width: 100%; padding-right: 0;}
.program-detail .text-wrap {padding-top: 0; position: relative; padding-bottom: 30px;}
.program-detail .text-wrap::before {content: ''; width: 100%; height: 1px; background-color: #ebebeb; position: absolute; bottom: 0;}
.program-detail .tit {width: fit-content; display:block; margin: 15px 0; font-size:24px; font-weight:bold; color:#222; display: block; line-height: 1.4;}

.program-detail .program-etc {margin-left: auto; display: flex; flex-wrap: nowrap; align-items: center; width: fit-content; margin-top: 30px;}
.program-detail .apply-btn {display: block; margin-top: 0; height: 100%; padding: 10px 15px; width: 185px; height: 43px; margin-left: 10px;}
.program-detail .count-box {width: auto;}
.program-detail .count-box li {display: flex; flex-direction: row-reverse; align-items: center; justify-content: center; gap: 10px;}

.program-detail .file-wrap {background: #f8f9fb; padding: 20px; margin-top: 20px; font-size: 17px;}
.program-detail .file-wrap strong {font-size: 19px; margin-bottom: 5px; display: block;}
.program-detail .file-wrap li {overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}

.program-detail .program-desc {font-size: 17px; line-height: 1.4; word-break: keep-all; margin-top: 30px;}

.program-detail .end .tit {color: #888;}
.program-detail .end .label-box .p-btn {border-color: #888; background-color: #888 !important; color: #fff;}
.program-detail .end .text-wrap .label-box, .program-detail .end .text-wrap .major-type, .program-detail .end .text-wrap .major-type li {color: #888;}
.program-detail .end .text-wrap .major-type li + li::before {background-color: #888;}
.program-detail .end .text-wrap .label-box .dday {border-color: #888; color: #888;}
.program-detail .end .apply-btn {background-color: #f7f7f7; border: 1px solid #E6E6E6; color: #b2b2b2;}
.program-detail .end .apply-btn i {color: #b2b2b2;}

.program-detail .ready .label-box .p-btn {border-color: #00aea9; background-color: #00aea9 !important; color: #fff;}
.program-detail .ready .text-wrap .label-box, .program-detail .ready .text-wrap .major-type, .program-detail .ready .text-wrap .major-type li {color: #00aea9;}
.program-detail .ready .text-wrap .major-type li + li::before {background-color: #00aea9;}
.program-detail .ready .text-wrap .label-box .dday {border-color: #00aea9; color: #00aea9;}
.program-detail .ready .apply-btn {background-color: #00aea9;}

@media (max-width: 1024px) {
    .program-detail .img-wrap {margin-bottom: 20px;}
    .program-detail .text-wrap {padding-bottom: 20px;}
    .program-detail .program-desc {margin-top: 20px;}
    .program-detail .program-etc {margin-top: 20px;}
}
@media (max-width: 768px) {
    .program-detail .img-wrap {margin-bottom: 15px;}
}
@media (max-width: 500px) {
    .program-detail .program-etc {flex-direction: column; margin: 0 auto; margin-top: 20px;}
    .program-detail .apply-btn {margin: 10px 0 0 0;}

    .program-detail .file-wrap {padding: 15px; font-size: 16px;}
    .program-detail .file-wrap strong {font-size: 18px;}
}


/* ----- 가족회사 채용 정보 ----- */
.program-wrap.matching .img-wrap{background: none; border: 1px solid #E6E6E6;}
.program-wrap.matching .img-wrap img {object-fit: contain; max-width: 200px; max-height: 120px;}
.program-wrap.matching .img-wrap span {font-size: 21px; font-weight: 600; color: #6a6d73;}
.program-wrap.matching .etc-wrap .etc-cont {gap: 15px 0;}
.program-wrap.matching .etc-wrap .etc-cont dl {width: 50%;}

.program-wrap.matching .text-wrap .tit {
    margin-bottom: 30px;
}
.program-wrap.matching > ul > li {position: relative;}
.program-wrap.matching .bookmark {display: block; position: absolute; top: 30px; right: 28px; z-index: 1;}
.program-wrap.matching .bookmark i {font-size: 28px; color: #c9c8cd; display: block;}
.program-wrap.matching .bookmark .bi-bookmark-fill {animation: pop 0.3s ease-in-out}
@keyframes pop {
    0% {transform: scale(1);}
    50% {transform: scale(1.2);}
    0% {transform: scale(1);}
}
@media (max-width: 1024px) {
    .program-wrap.matching .img-wrap {min-height: 180px;}
    .program-wrap.matching .text-wrap .tit {margin-bottom: 20px;}
    .program-wrap.matching .program-etc {margin-top: 0;}
    .program-wrap.matching .desc-wrap {position: relative;}
    .program-wrap.matching .bookmark {position: absolute; top: 20px; right: 0;}
}
@media (max-width: 500px) {
    .program-wrap.matching .etc-wrap .etc-cont dl{width: 100%;}
}


/* ----- R&D 과제 공모 정보 ----- */
.program-wrap.develope > ul > li {padding: 20px 30px; position: relative; transition: all 0.3s ease-in-out;}
.program-wrap.develope > ul > li:hover {box-shadow: 0px 0px 12px #30303021;}
.program-wrap.develope > ul > li:hover .program-btn a {border-color: #9da3ac;}
.program-wrap.develope > ul > li:hover .program-btn i {color: #9da3ac;}
.program-wrap.develope .program-gp {padding: 0;}
.program-wrap.develope .desc-wrap {padding: 0; width: 100%;}
.program-wrap.develope .text-wrap {padding: 0;}
.program-wrap.develope .text-wrap .tit a {margin-bottom: 20px;}
.program-wrap.develope .etc-wrap .etc-cont {gap: 10px 0;}
.program-wrap.develope .etc-wrap .etc-cont dl {width: 50%; display: flex;}
.program-wrap.develope .etc-wrap .etc-cont dl dt {margin-right: 20px;}
.program-wrap.develope .program-btn a {transition: all 0.3s ease-in-out; width: 65px; height: 65px; border-radius: 32.5px; border: 1px solid #ddd; display: flex; align-items: center; justify-content: center; position: absolute; top: 50%; right: 30px; transform: translateY(-50%); display: flex; align-items: center; justify-content: center;}
.program-wrap.develope .program-btn i {transition: all 0.3s ease-in-out; font-size: 28px; color: #ddd; display: flex; align-items: center; justify-content: center; margin-left: 2px;}

@media (max-width: 768px) {
    .program-wrap.develope .program-btn a {width: 50px; height: 50px; border-radius: 25px; position: absolute; top: 20px; right: 20px; transform: translateY(0);}
    .program-wrap.develope .program-btn i {font-size: 24px;}
}
@media (max-width: 500px) {
    .program-wrap.develope .etc-wrap .etc-cont {flex-direction: column;}
    .program-wrap.develope .program-gp {width: 85%;}
    .program-wrap.develope .etc-wrap .etc-cont dl {width: 100%;}
}


/* ----- 취업 멘토링 ----- */
.mento-wrap {width: 100%; line-height: 33px;}
.mento-wrap .mento {display: flex; flex-wrap: wrap; gap: 30px;}
.mento-wrap .mento > li {width: calc(50% - 15px); border: 1px solid #ebebeb; border-radius: 20px; overflow: hidden; position: relative; transition: box-shadow 0.3s ease-in-out;}
.mento-wrap .mento > li:hover {box-shadow: 0px 0px 12px #30303021;}

.mento-box {display: flex; width: 100%; gap: 30px; padding: 40px 30px 100px; align-items: flex-start; justify-content: center;}
.mento-box .thumb-box {width: 120px; flex-shrink: 0;}
.mento-box .thumb-box .img-wrap {width: 120px; height: 120px; border-radius: 60px; background: #f3f6fa url(../images/sub/profile-none.svg) no-repeat center center / 50%; overflow: hidden;}
.mento-box .thumb-box .img-wrap img {width:100%; height:100%; object-fit: cover;}
.mento-box .profile-box {width: calc(100% - 150px); flex: 1;}
.mento-box .profile-box .profile-cont {margin-bottom: 20px;}

.mento .bookmark {display: block; position: absolute; top: 30px; right: 28px;}
.mento .bookmark i {font-size: 28px; color: #c9c8cd; display: block;}
.mento .bookmark .bi-bookmark-fill {animation: pop 0.3s ease-in-out}
@keyframes pop {
    0% {transform: scale(1);}
    50% {transform: scale(1.2);}
    0% {transform: scale(1);}
}

.mento-box .profile-box .profile-top ul {display: flex; flex-wrap: wrap; width: 90%; gap: 0px 7px;}
.profile-top ul li {font-size: 18px; font-weight: 500;}
.profile-top ul li:last-child::before {content: '/'; color: #d3d2d6; margin-right: 10px;}
.profile-top ul li span {font-weight: bold;}
.profile-top ul .name {font-size: 26px; font-weight: bold; margin-right: 7px;}
.profile-top ul .career .job {margin-left: 3px;}
.profile-top ul .project {color: #e76c7d;}
.profile-top ul .type {width: 100%; line-height: 36px; display: flex; align-items: center; justify-content: flex-start; margin-bottom: 10px;}
.profile-top ul .type span {display: flex; align-items: center; justify-content: center; background-color: #f8f9fb; color: #6083d9; padding: 0 20px; border-radius: 20px; font-size: 18px; font-weight: 500;}
.profile-top ul .type span i {font-size: 19px; color: #6083d9; display: flex; align-items: center; justify-content: center;}

.mento-box .profile-box .profile-desc {line-height: 1.6;}
.mento-box .profile-box .profile-desc dt a {font-weight: bold; font-size: 21px; margin-bottom: 5px; display: block;}
.mento-box .profile-box .profile-desc dt a:hover {text-decoration: underline !important;}
.mento-box .profile-box .profile-desc dd a {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; word-break: break-word; font-size: 17px; font-weight: 500;}
.mento-box .profile-box .profile-desc dd a:hover {text-decoration: underline !important;}

.mento-box .profile-box .profile-bottom {margin-bottom: 0;}
.mento-box .profile-box .profile-bottom ul {display: flex; gap: 4px; flex-wrap: wrap;}
.mento-box .profile-box .profile-bottom ul li {/* background-color: #f2f3f4; */font-weight: 500;font-size: 16px;color: #8b8b8b;padding: 0px 14px;border-radius: 20px;border: 1px solid #d3d3d3;}
.mento-box .profile-box .profile-bottom ul .skill-etc {background: none; color: inherit; padding: 0; border-radius: 0;}

.mento-wrap .apply-btn {display: flex; align-items: center; justify-content: center; background-color: #327dec; width: fit-content; font-size: 18px; color: #fff; padding: 5px 20px; border-radius: 30px; position: absolute; bottom: 30px; right: 28px;}
.mento-wrap .apply-btn i {color: #fff; margin-left: 7px; font-size: 21px; display: flex; align-items: center; justify-content: center;}

@media (max-width: 1200px) {
    .mento-wrap .mento {gap: 20px;}
    .mento-wrap .mento > li {width: 100%;}
}
@media (max-width: 1024px) {
    .mento-box .profile-box .profile-desc dd a {font-size: 17px;}
    .mento-box .profile-box .profile-bottom ul li {font-size: 17px;}
}
@media (max-width: 768px) {
    .mento .bookmark {display: block; position: absolute; top: 20px; right: 20px;}

    .mento-box {padding: 30px 20px 80px; gap: 20px;}
    .mento-box {flex-direction: column; align-items: center;}
    .mento-box .thumb-box {width: 100%; display: flex; align-items: center; justify-content: center;}
    .mento-box .thumb-box .img-wrap {width: 100px; height: 100px; border-radius: 50px;}
    .mento-box .profile-box {width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;}
    
    .mento-box .profile-box .profile-top ul {width: 100%; text-align: center; display: flex; align-items: center; justify-content: center; gap: 4px 7px;}
    .profile-top ul li {font-size: 17px; line-height: normal;}
    .profile-top ul .name {font-size: 21px; margin-right: 5px;}
    .profile-top ul .type {justify-content: center;}

    .mento-box .profile-box .profile-desc {text-align: center;}
    .mento-box .profile-box .profile-desc dt a {font-size: 19px;}
    .mento-wrap .apply-btn {bottom: 20px; right: 20px; font-size: 17px; padding: 2px 20px;}
}





/* ----- 재직자교육 ----- */
.edu .list {display: flex; flex-wrap: wrap; gap: 30px;}
.edu .list i {color: #292929;}
.edu .list > li {width: calc(25% - 22.5px);}
.edu .list li a {box-shadow: 0px 0px 10px #30303021; border-radius: 15px; overflow: hidden; transition: 0.3s; height: 100%; display: block;}
.edu .list li a:hover {box-shadow: 0px 0px 15px #3939393d; /*transform: translateY(-20px);*/}
.edu .cate {background: #eb2f2e;color: #fff !important;border-radius: 50px;display: inline-block;padding: 10px 15px;font-size: 21px;margin-left: 5px;line-height: 1;position: relative;top: -3px;}
.edu .img-wrap {aspect-ratio: 16/9; width: 100%; background: #f4f4f4 url('../images/sub/notice-logo.png') no-repeat center center / 60%}
.edu .img-wrap img {object-fit: cover; width: 100%; height: 100%;}
.edu .txt-wrap {padding: 40px 25px 25px;display: flex;flex-direction: column;position: relative;}
.edu .txt-wrap p {font-size: 18px;color: #666;position: relative;letter-spacing: 0.1px;}
.edu .txt-wrap .cate {position: absolute;right: 20px;top: -30px;width: 60px;height: 60px;box-shadow: 0px 0px 8px #ec3232e6;display: flex;flex-direction: column;justify-content: center;text-align: center;line-height: 0;font-size: 15px;margin: 0;padding: 0;}
.edu .txt-wrap .title {font-weight: bold;font-size: 22px;margin-bottom: 30px;color: #000;word-break: break-all;display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.edu .txt-wrap .etc {margin-bottom: 3px;}
.edu .txt-wrap .etc:last-child {margin-bottom:0}
/* .edu .txt-wrap .etc:before {content: ''; position: absolute; left: 0; font-family: 'bootstrap-icons';font-size: 13px;}  */
.edu .txt-wrap .etc i {min-width: 20px; display: inline-block;font-size: 17px;}

.edu .complete .cate {background: #494949;}
.edu .complete .txt-wrap .cate {box-shadow: 0px 0px 8px #535353e6;}
.edu .complete .text-danger {color: #666666 !important;}

.search-box .edu-select {display: flex; width: calc(50% - 10px);}
.search-box .edu-search-area {display: flex; gap: 20px;}

@media (max-width:1300px) {
    .edu .list > li {width: calc(33.333% - 20px);}
}
@media (max-width:1024px) {
    .edu .list {gap: 20px;}
    .edu .list > li {width: calc(50% - 10px);}
    .edu .info li {padding-left: 13px;}
    .edu .info li:before {top: 7px;}
    .edu .txt-wrap {padding: 35px 18px 20px;}
}
@media (max-width:768px) {
    .edu .txt-wrap {padding: 35px 18px 20px;}
    .edu .txt-wrap .title {font-size: 20px; margin-bottom: 20px;}
    .edu .txt-wrap .etc {margin-bottom:1px}
    .edu .txt-wrap .etc i {min-width: 18px;}
    .search-box .edu-search-area {gap: 10px;}
    .search-box .edu-select {width: 100%;}
}
@media (max-width:550px) {
    .edu .list > li {width:100%}
}

.edu .view .head {border-top: 2px solid #878787;padding: 23px 20px 23px;border-bottom: 1px solid #ccc;}
.edu .view .title {font-size: 30px;text-align: left;padding-left: 5px;font-weight: bold;margin-bottom: 15px;}
.edu .view .cont {padding: 50px 30px;height: 100%;min-height: 500px;border-bottom: 1px solid #ccc;}
.edu .view .video-wrap {aspect-ratio: 16/9;max-width: 1280px;margin: 0 auto;}
.edu .view .video-wrap > * {max-width: 100%; width:100%; height: 100%;}

.edu .info {border-top: 1px dashed #ccc; padding-top: 13px; padding-left: 5px;}
.edu .info li {display: flex; margin: 10px 0; color: #666666; padding-left: 18px; position: relative;}
.edu .info li:before {content: ''; position: absolute; width: 4px; height: 4px; background: #5b5b5b; left: 0; top: 8px; border-radius: 50px;}
.edu .info li span {font-size: 18px; line-height: 1.1;}
.edu .info li .txt1 {font-weight: 600; width: 80px; color: #292929;}
.edu .info li .txt2 {width: 100%; font-weight: 300; flex: 1; letter-spacing: 0.2px; word-break: break-all;}
.edu .info li .txt2 .amount {max-width: 350px; height: 23px; width: 99%; top: -1px; position: relative;}

@media (max-width:1024px) {
    .edu .info li {padding-left: 13px;}
    .edu .info li:before {top: 7px;}
    .edu .view .head {padding: 20px 18px 15px;}
    .edu .view .title {font-size: 25px; word-break: break-all;}
    .edu .view .cont {padding:30px 20px}
    .edu .cate {padding: 7px 12px 6px;font-size: 16px;top: -2px;margin-left: 3px;}
}
@media (max-width:768px) {
    .edu .info {padding-top:5px}
    .edu .info li {padding-left: 10px;}
    .edu .info li:before {width: 3px; height: 3px;}
    .edu .info li span {font-size: 17px;}
    .edu .info li .txt1 {width: 70px;}
    .edu .view .head {padding: 15px 5px 10px;}
    .edu .view .title {font-size: 22px;}
    .edu .view .cont {padding:20px 15px;min-height: 300px;}
    .edu .cate {padding: 6px 10px 6px; font-size: 14px; top: -2px;}
}

/* 재직자 교육 상세 */
.employee .info {border: none}
.employee .emp-info-wrap {display: flex; width: 100%; border-top: 1px dashed #ccc;}
.employee .emp-info-wrap ul {width: 50%;}

.employee .emp-info-wrap ul li:first-child {padding-left: 0; font-size: 24px; font-weight: bold; color: #292929; margin-bottom: 15px;}
.employee .emp-info-wrap ul li:first-child::before {display: none;}

@media (max-width:1024px) {
    .employee .emp-info-wrap ul li:first-child {font-size: 20px; margin-bottom: 10px;}
}
@media (max-width:768px) {
    .employee .emp-info-wrap ul li:first-child {font-size: 19px; margin-bottom: 15px;}
}
@media (max-width:650px) {
    .employee .emp-info-wrap {flex-direction: column;}
    .employee .emp-info-wrap ul {width: 100%;}
}





/* ----- 서브 기타 ----- */
.board-info {padding: 50px;border-radius: 20px;margin-bottom: 100px;background: #f5f8fb;}
.board-info .title {font-weight:bold;font-size: 22px;margin-bottom: 20px;color: #000;}
.board-info p {color: #4a5263;line-height: 1.4;}
.board-info hr {border-color:#a1a1a1;border-width:1px;}
.board-info hr.dashed {border-style:dashed}

.info-wrap {margin-bottom: 50px !important;}

/* 개인정보 수집 */
.write-wrap .write-perinfo {margin-bottom: 50px;}
.write-wrap .write-perinfo strong {font-size: 22px;}
.write-wrap .write-perinfo .per-cont {border: 5px solid #f1f1f1;border-radius: 20px;padding: 30px 40px;padding-right: 30px;line-height: 1.5;margin: 20px 5px;}
.write-wrap .write-perinfo .per-cont p {max-height: 230px;overflow: auto;padding-right: 25px;}
.write-wrap .write-perinfo .per-chkbox {margin-left: 20px;}
.write-wrap .write-perinfo .per-chkbox label {margin-left:5px;margin-top: 3px;font-size: 17px;}

@media all and (max-width:768px) {
    .write-wrap .write-perinfo .per-cont {padding: 25px 30px; padding-right: 25px; margin: 15px 5px;}
    .write-wrap .write-perinfo .per-cont p {font-size: 18px;}
    .write-wrap .write-perinfo .per-chkbox {margin-left:10px}
}
@media all and (max-width:550px) {
    .write-wrap .write-perinfo .per-cont {padding: 18px 23px;padding-right: 15px;margin: 10px 0px; line-height: 1.3;}
    .write-wrap .write-perinfo .per-cont p {font-size: 16px;}
}

.webzine-list {border-top: 2px solid #8e8e8e;display: flex;flex-wrap: wrap;}
.webzine-list > li {border-bottom: 1px solid #e2e2e2; transition: 0.3s;width: 100%;}
.webzine-list li a {display: flex;padding: 30px 10px; position: relative;}
.webzine-list li a .text { width: 100%;padding: 8px 0;}
.webzine-list li a .text .top {display: flex;margin-left: 2px;}
.webzine-list li a .text .top p {margin-right: 8px; padding: 8px 12px;border-radius: 5px;line-height: 1;margin-bottom: 15px;font-size: 18px;margin-left: 0;color: #fff;display: flex;flex-direction: column;justify-content: center;}
.webzine-list li a .text .top .year {border: 1px solid #034285;color: #034285;}
.webzine-list li a .text .top .cate.item {background:#2e82ff;}
.webzine-list li a .text .top .cate.iprs {background:#00aea9}
.webzine-list li a .text .title {font-size: 25px;margin-bottom: 13px;transition: 0.3s;font-weight: bold;}
.webzine-list li a .text .cont {margin-bottom: 15px;color: #484848;font-size: 19px;word-break: break-all;display: -webkit-box;overflow: hidden;line-height: 1.35;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 1;}

.webzine-list li a .text .etc {display: flex; flex-wrap: wrap;}
.webzine-list li a .text .etc span {margin: 1px 0;margin-right: 13px; padding-right: 12px;color: #757575;font-size: 17px;font-weight: 300; position: relative; }
.webzine-list li a .text .etc span:before {content:'';position:absolute;right: -2px;border: 2px solid #ccc;border-radius: 50px;top: 9px;}
.webzine-list li a .text .etc span i{margin-right: 3px; font-size: 15px; display: none;}
.webzine-list li a .text .etc span:last-child {margin-right:0; padding-right:0}
.webzine-list li a .text .etc span:last-child:before {display:none}
.webzine-list li a .img-wrap {min-width: 200px;max-width: 230px;aspect-ratio: 7/5;border: 1px solid #eee; margin-right: 40px;width: 100%;border-radius: 10px; background: #eee url('../images/sub/notice-logo.png') no-repeat center center / 60%;}
.webzine-list li a .img-wrap img {width: 100%; height: 100%; object-fit: cover;}
.webzine-list li:hover a .text .title {text-decoration: underline; transition: 0.3s;}
.webzine-list li:hover a .text .title::before {width: 100%; transition: 0.3s;}

.comment-num {background: #11ad66; color:#ffffff; font-size: 20px; position: relative; top: 0px; left: 3px; padding: 1px 7px; border-radius: 5px;}

@media (max-width:1024px) {
    .webzine-list li a .text .title {font-size: 23px; margin-bottom: 15px;}
    .webzine-list li a .text .cont {margin-bottom: 18px; font-size: 17px;}
    .webzine-list li a .text .etc span {font-size: 16px;}
    .webzine-list li a .text .etc span:before {top: 7px;}
    .webzine-list li a .img-wrap {margin-right: 30px;}
}
@media (max-width:768px) {
    /* .webzine-list li a {padding: 15px 10px;} */
    .webzine-list li a .text {padding: 5px 0;}
    .webzine-list li a .text .title {font-size: 21px;margin-bottom: 10px;}
    .webzine-list li a .text .cont {margin-bottom: 10px;}
    .webzine-list li a .text .etc span {font-size: 15px;}
    .webzine-list li a .text .etc span:before {top: 6px;}
    .webzine-list li a .text .etc .user {margin-right: 5px;}
    .webzine-list li a .img-wrap {max-width: 200px;margin-right: 25px;}
}
@media (max-width:550px) {
    .webzine-list .top > * {margin-bottom: 0 !important;}
    .webzine-list li a .text .top {margin:0;}
    .webzine-list li >input[type="checkbox"] {position: absolute; right: 10px; top: 20px;}
    .webzine-list li a {padding: 30px 10px;flex-direction: column;}
    .webzine-list li a .img-wrap {margin-right: 0;max-width: 100%; max-height: 300px; margin-bottom: 20px;}
    .webzine-list li a .text .title {font-size: 21px;margin-top: 8px;}
    .webzine-list li a .text .etc span {margin-right: 10px;padding-right: 8px;}
    .webzine-list li a .text .etc span i {font-size:13px}
}

/* 게시판 등록, 글쓰기 등 */
.board-view .view-head .view-info-wrap {display: flex;}
.board-view .view-head .view-info-wrap > .view-info{padding: 0;}
.board-view .view-head .view-info {font-size:17px;border-bottom: 1px solid #d5d5d5;display: flex;width: 100%;padding: 0;}
.board-view .view-head .view-info span:after {right: -2px;}
.board-view .view-head .view-info > strong {min-width: 150px;padding: 15px 5px;text-align:center;background:#f8f9fb;font-size: 18px;}
.board-view .view-head .view-info > strong i {font-size: 17px;margin-right: 3px;}
.board-view .view-head .view-info-wrap .view-info > span {width: 100%;display: flex;flex-direction: column;justify-content: center;padding: 15px;}
.board-view .view-head .view-info input[type=checkbox] {margin-right:5px; margin-top:10px}

.board-view .view-head > .view-info {width: auto;}
.board-view .view-head > .view-info > span {flex-direction: row;justify-content: flex-start;width: auto;}
.board-view .view-head .view-info_file span {flex-direction: row;justify-content: flex-start;}

.board-view .view-head .modal .btn-wrap {justify-content: center;margin-top: 0;}
.board-view .view-head .modal .view-head .view-info {padding: 0;}

.board-comment .comment-write {border-bottom:0}
.board-comment .comment-write .write-body {display:block;overflow: hidden;padding: 15px 8px 20px;border-top: 2px solid #595959;border-bottom: 1px solid #ccc;}
.board-comment .comment-write .write-body > input {margin-top: 10px; float: right;}
.board-comment .comment-write .write-body > div {width:100%; }
.board-comment .comment-write .write-body textarea { border-color: #e9e9e9;}

.board-comment  .comment-view .comment-write .write-body{padding: 0 10px 20px; border-top: none}

.board-comment .comment-write ul.file {margin-top: 10px;}
.board-comment .comment-write ul.file li {margin: 5px 0;display: flex;position: relative;border-radius: 8px;overflow: hidden;background: #fcfcfc;border: 1px solid #ededed;}
.board-comment .comment-write ul.file li strong {display:inline-block;font-size:17px;width: 140px;padding: 16px 10px;text-align:center;/* background: #f9f9f9; */min-width: 140px;}
.board-comment .comment-write ul.file li strong i{font-size:18px;color:#444;transform: rotate(45deg);display: inline-block;}
.board-comment .comment-write ul.file li > div {width:100%;display: flex;justify-content: space-between;}
.board-comment .comment-write ul.file li span {padding: 10px;display: flex;text-align: center;}
.board-comment .comment-write ul.file li span.tip{color: #8f8f8f;font-size: 16px;line-height: 1;display: flex;flex-direction: column;justify-content: center;width: 100%;text-align: left;}
.board-comment .comment-write ul.file li span.check {padding: 18px 8px;padding-right: 20px;}
.board-comment .comment-write ul.file li span.check * {margin-left: 5px;}
.board-comment .comment-write ul.file li span.check *:first-child {margin-left:0}
.board-comment .comment-write ul.file li span.check input {margin-top: 1px;}
.board-comment .comment-write ul.file li span.check a {display: flex;}
.board-comment .comment-write ul.file li span.check a span {padding: 0 !important;width: auto;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;max-width: 130px;display: inline-block;word-break: break-all;font-size: 16px;}
.board-comment .comment-write ul.file li span.check a span.file_size {color: #5b5b5b;margin-top: 2px;font-size: 15px;}
.board-comment .comment-write ul.file li span.check .file_delete {margin-left: 8px;padding: 0 !important;width: auto;display: inline;color: #eb0f00;font-size: 17px;text-align: center;font-weight: 500; cursor: pointer;}
.board-comment .comment-write ul.file li span.check .file_delete:hover {text-decoration:underline !important;}
.board-comment .comment-write ul.file .upload {align-items: center;}
.board-comment .comment-write ul.file input {height: fit-content;}

.board-comment .comment-view button.result {pointer-events: none; cursor: default;}
.board-comment .comment-view .view-head .view-info_file {padding: 0;width: 100%;}
.board-comment .comment-view .view-head .view-info_file .file_info {font-size: 15px;margin-top: 2px;margin-left: 3px;}
.board-comment .comment-view .view-head .view-info_file > span {width: 100%;}
.board-comment .comment-view .view-body {    padding: 15px 10px 15px 20px}
.board-comment .comment-view .view-body .btn-wrap {justify-content: flex-end;margin-top: 30px }

@media (max-width:1024px){
    .board-comment .comment-write ul.file li > div {flex-direction:column}
    .board-comment .comment-write ul.file li span.check {padding: 0px 13px 15px;}
}
@media (max-width:768px){
    .board-view .view-head .view-info-wrap{flex-direction: column;}
    .board-view .view-head .view-info > strong {padding: 10px 5px;min-width: 130px;font-size: 16px;font-weight: 500;text-align: left;padding-left: 13px;}
    .board-view .view-head .view-info > strong i {font-size: 15px;}
    .board-view .view-head .view-info-wrap .view-info > span {padding: 8px;}
    .board-view .view-head .view-info span strong {margin-bottom: 0;font-size: 16px;}
    .board-view .view-head > .view-info{flex-direction:column;padding: 8px 0;}
    .board-view .view-head > .view-info > span {padding: 5px 8px;}

    .board-comment .comment-write ul.file li strong {padding: 35px 10px;}
    .board-comment .comment-write ul.file li .upload {flex-direction: column;width: 100%;padding-bottom: 0;}
    .board-comment .comment-write ul.file li span.tip {padding-left: 3px;padding-right: 0px;}
    .board-comment .comment-write ul.file li > div {flex-direction:column;}
    .board-comment .comment-write .write-body {padding: 13px 5px;}

    .board-comment .comment-view .view-head .view-info_file .file_info {font-size:14px}
    .board-comment .comment-view .view-body {padding: 10px ;}
}
@media (max-width:550px){
    .board-comment .comment-write ul.file li {flex-direction:column}
    .board-comment .comment-write ul.file li >* {width: 100% !important;}
    .board-comment .comment-write ul.file li strong {padding: 10px;padding-bottom: 0;}
}


.write-wrap .write-info input {border-color: #dee2e6; margin-top: 0;}
.write-wrap .write-info .input-wrap {display: flex;width: 100%;}
.write-wrap .write-info .input-wrap span {padding: 7px;}
.write-wrap .write-info .gender {width:auto;}
.write-wrap .write-info .gender input {margin: 0 5px; margin-top: 10px;}
.write-wrap .write-info .gender label {margin-right: 10px;}

@media all and (max-width:550px) {
    .write-wrap .write-info .input-wrap {justify-content: center;}
}

.btn-wrap {width: 100%; margin: 0 auto; text-align: center; overflow: hidden; margin-top: 20px;}
.btn-wrap .btn {font-size:17px;}
.btn-wrap .fl {float: left;}
.btn-wrap .fr {float: right;}
.btn-wrap .fl .btn, .btn-wrap .fr .btn{border:transparent; padding:10px 25px; color:#fff; transition:.3s; vertical-align:middle}
.btn-wrap .fl i, .btn-wrap .fr i {color:#fff; transition:.3s;}
.btn-wrap .list_go_btn{background:#4b595f; color: #fff !important;}
.btn-wrap .list_go_btn i{color:#fff}
.btn-wrap .list_go_btn:hover{background:#3d474b}
.btn-wrap .write_btn{background:#255e86; color:#fff !important;}
.btn-wrap .write_btn:hover{background:#1b4c6e}
.btn-wrap .re_btn{background:#787878; color:#fff !important;}
.btn-wrap .re_btn:hover{background:#646363}
.btn-wrap .delete_btn{background:#616060; color:#fff !important;}
.btn-wrap .delete_btn:hover{background:#494848}
.btn-wrap .save_btn{background:#255e86; color:#fff !important;}
.btn-wrap .save_btn i{color:#fff}
.btn-wrap .save_btn:hover{background:#1b4c6e}

@media (max-width: 768px) {
	.btn-wrap .fl .btn, .btn-wrap .fr .btn {padding: 8px 18px; min-height: auto;}
	.btn-wrap .btn {font-size: 17px}
}

@media (max-width: 550px) {
	.btn-wrap .fl, .btn-wrap .fr {/* float: initial; */}
	.btn-wrap .fl {/* margin-bottom:10px; */}
	.btn-wrap .btn {font-size: 15px}
}

.border-list-wrap table {width:100%; border-collapse: separate; border-spacing: 0; font-size:17px; position: relative;}
.border-list-wrap table:before {content: ''; position: absolute; top:0; left:0; width:100%; border-top: #969696 solid 2px;}
.border-list-wrap table:after {content: ''; position: absolute; top:0; right: 0; height: 100%; border: 1px solid #fff;}
.border-list-wrap table tr th {background: #edf1f7;font-weight: 500;}
.border-list-wrap table th, .border-list-wrap table td {border-bottom:#ddd solid 1px;padding: 13px 13px;text-align:center;font-size: 19px;vertical-align: middle;border-right: 1px solid #ddd;line-height: 1.2;}
.border-list-wrap table th:last-child, .border-list-wrap table td:last-child {}
.border-list-wrap table td.num {}
.border-list-wrap table td a {color: #212529;}
.border-list-wrap table td.title {text-align:left;}
.border-list-wrap table td.title a {text-align:left; display: flex;}
.border-list-wrap table td.title a p {line-height: 1.7;word-break: break-all;display: -webkit-box;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 1;width: 100%;width: auto;}
.border-list-wrap table td.title a span {margin-left: 8px;}
.border-list-wrap table td.name {overflow: hidden; text-overflow: ellipsis; word-break: keep-all; max-width: 120px; white-space: nowrap;}
.border-list-wrap table td.answer {color: #2c4ca9 !important;}
.border-list-wrap table td.answer:not(.yes) {color: #e11010 !important;}
.border-list-wrap table td .secret > i {color: #f1b137;margin-top: 6px;}
.border-list-wrap table td .notice {background: #646464; color: #fff; padding: 8px 10px; border-radius: 8px; font-size: 15px;}
.border-list-wrap table td .notice i {margin-right: 1px;}
.border-list-wrap table td .label {font-size: 15px; padding: 3px 6px; font-weight:500; border-radius:4px; color: #707070; color:#fff; background:#666}
.border-list-wrap table td .cate {padding: 8px 13px; border-radius: 23px; font-size: 14px; background: #fff; border: 2px solid #ccc; display: inline-block;}
.border-list-wrap table td .comment-num{background: #11ad66;color:#ffffff;font-size:12px;height: 23px;position: relative;top: 5px;display: flex;flex-direction: column;justify-content: center;text-align: center;padding: 0 7px;}
.border-list-wrap table td .new {position: relative;min-width: 22px;height: 22px;background-color: #f9a30e;border-radius: 50px;color: #fff;top: 5px;}
.border-list-wrap table td .new span {display: block; width: 100%;    height: 100%}
.border-list-wrap table td .new::after {position:absolute;content:'N';font-size: 11px;top: 50%;left: 50%;transform: translate(-50%, -50%);line-height: 1;}
.border-list-wrap table tr:hover{transition:.3s; background:#fbfbfb}

.border-list-wrap .line-none tr th, .border-list-wrap .line-none tr td {border-right: none;}

@media all and (max-width:768px){
    .border-list-wrap table colgroup col {width:auto !important;}
    .border-list-wrap table tr {padding: 8px 8px 5px; border-bottom:1px solid #ddd; display:block}
    .border-list-wrap table tr:first-child {border-top:#393939 solid 2px;}
    .border-list-wrap table thead{display:none}
    .border-list-wrap table th {display:none;}
    .border-list-wrap table td {display:inline-block; border-bottom:none; padding:  00; text-align:left;}
    .border-list-wrap table td.title {display:block; padding:0 0;}
    .border-list-wrap table td.title a {margin-top: 7px;}
    .border-list-wrap table td.title a p {line-height: 1.3;font-size: 17px;height: 25px;}
    .border-list-wrap table td.title a span {margin-left: 5px;}
    .border-list-wrap table td.under {color:#999; font-size:14px; margin-bottom: 0; padding-right: 5px;}
    .border-list-wrap table td.under:last-child {border-right:0}
    .border-list-wrap table td.name {overflow: inherit;}
    .border-list-wrap table td span {font-size: 17px;}
    .border-list-wrap table td .notice {padding: 4px 8px 4px; border-radius: 6px; display: block;}
    .border-list-wrap table td .notice i {margin-right: 2px;}
    .border-list-wrap table td .cate {padding: 5px 10px;}
    .border-list-wrap table td .secret  {line-height: 1;}
    .border-list-wrap table td .secret i {margin-top: 2px;}
    .border-list-wrap table td .new {top: 1px;min-width: 20px;height: 20px;}
    .border-list-wrap table td .comment-num {top: 1px; padding: 0 5px; height: 20px;}
}

.border-alert {}
.border-alert p {text-align: center; padding: 30px 0; font-size: 21px;}
.border-alert p > i {font-size:60px; color: #f2a90a;}
.border-alert .btn {margin-top: 13px;}

.board-view .view-head {border-top: 2px solid #595959; position: relative;}
.board-view .view-head h3 {position:relative;margin:0 !important;padding: 20px 20px 20px 18px;border-bottom: 1px solid #d5d5d5;font-size:26px !important;background:#f8f9fb;font-weight:500 !important;text-align: left !important;}
.board-view .view-head h3:after {content:''; clear:both; display:block; overflow:hidden; height:0; font-size:0; line-height:0;}
.board-view .view-head h3 span {word-break: break-all;font-weight: bold;}
.board-view .view-head h3 span.tit_label_red{font-size:17px; background:#de2336; color:#fff; border-radius:30px; padding:0 15px; margin-right:10px; display:inline-block; height:32px; line-height:32px; margin-top:-3px; vertical-align:middle}
.board-view .view-head h3 span.tit_label_green{font-size:17px; background:#239609; color:#fff; border-radius:30px; padding:0 15px; margin-right:10px; display:inline-block; height:32px; line-height:32px; margin-top:-3px; vertical-align:middle}
.board-view .view-head h3 span.tit_label_blue{font-size:17px; background:#2c4ca9; color:#fff; border-radius:30px; padding:0 15px; margin-right:10px; display:inline-block; height:32px; line-height:32px; margin-top:-3px; vertical-align:middle}
.board-view .view-head .btn-wrap {margin:0;overflow: initial;position: absolute;right: 8px;text-align: right;}
.board-view .view-head .btn-wrap input {margin-top: -8px;border: 1px solid #7d7d7d;border-radius: 5px;padding: 3px 10px 3px;transition: .3s;background: transparent;color: #333;font-size: 17px;}
.board-view .view-head .view-info {padding: 15px 20px;font-size: 17px;border-bottom: 1px solid #d5d5d5;}
.board-view .view-head .view-info span {padding:0 30px 0 0; color: #777; position:relative}
.board-view .view-head .view-info span i {padding-right:3px}

.board-view .view-head .view-info span:after {content:""; position:absolute; top: 50%; transform: translateY(-50%); right:13px; width:1px; height: 13px; background:#aaa}
.board-view .view-head .view-info span:last-child:after {display:none}

.board-view .view-head .view-info span strong {margin-right: 3px;color: #111;font-weight: 600;}
.board-view .view-head .view-info span strong i {/* color: #000; */}

.board-view .view-head .view-info_file span, .board-view .view-head .view-info-link span{/* display: flex; */padding: 0;flex-wrap: wrap;}
.board-view .view-head .view-info_file span strong, .board-view .view-head .view-info-link span strong{font-size:17px;position:relative;margin-right: 15px;padding-right: 15px;}
.board-view .view-head .view-info_file span strong i, .board-view .view-head .view-info-link span strong i{padding-left:3px;color: #000;padding-right: 0;display: inline-block;}
/* .board-view .view-head .view-info_file span strong i {transform: rotate(45deg);} */
.board-view .view-head .view-info_file span strong:after, .board-view .view-head .view-info-link span strong:after{content:""; position:absolute; top: 4px; right: 0; width:1px; height: 14px; background:#aaa}
.board-view .view-head .view-info_file span:after, .board-view .view-head .view-info-link span:after{display:none}
.board-view .view-head .view-info span a{font-size:17px;font-weight: 400;word-break: break-all;color: #000; }
.board-view .view-head .view-info span a:hover {text-decoration:underline !important;}

.board-view .view-body {border-bottom: 1px solid #d5d5d5; padding: 15px 20px; position: relative; overflow-x: auto; letter-spacing:-0.034em; word-spacing: 0.02em; line-height:1.5;}
.board-view .view-body .con {padding:5px; min-height:450px;}
.board-view .view-body .con p {white-space:pre-line;}
.board-view .view-body .con img {max-width:100%; height: auto !important;}

.board-view .view-head .view-info .preview_btn{border:1px solid #707070;border-radius:5px;color:#707070;font-size:15px;transition:.3s;padding: 6px 10px;margin-left: 10px;line-height: 1;display: inline;}
.board-view .view-head .view-info .preview_btn:hover{background:#707070; color:#fff;}
.board-view .view-head .view-info .preview_btn:hover i{color:#fff}

@media (max-width:1300px){
    .board-view .view-head .view-info span a{max-width: 690px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: inline-block;}
    .board-view .view-head .view-info .preview_btn {white-space: normal;text-overflow: initial;overflow: initial;max-width: max-content;/* top: -4px; */position: relative;}
}
@media (max-width:1024px){
    .board-view .view-head h3 {font-size: 22px !important; padding:20px;}
    .board-view .view-head .view-info{padding: 10px 10px;}
    .board-view .view-head .view-info span{padding:0; display:block !important; line-height:1.5; font-weight: 400; color: #696363;}
    .board-view .view-head .view-info span strong {margin-right:5px; color: #333; margin-bottom: 5px; padding: 0 !important;}
    .board-view .view-head .view-info span:after{display:none}
    .board-view .view-head .view-info_file span, .board-view .view-head .view-info-link span{display: flex !important;}
    .board-view .view-head .view-info_file span strong, .board-view .view-head .view-info-link span strong{display:block;min-width: 95px;font-size: 15px;margin: 0;}
    .board-view .view-head .view-info_file span strong:after, .board-view .view-head .view-info-link span strong:after{display:none}
    .board-view .view-head .view-info_file span strong i, .board-view .view-head .view-info-link span strong i {font-size: 13px;}
    .board-view .view-head .view-info span a{font-size: 15px;max-width: 72%;width: auto;margin-right: 5px;}
    .board-view .view-head .view-info .preview_btn{padding: 4px 7px;font-size: 14px;margin: 0;}
    .board-view .view-head .btn-wrap input {margin-top: 0px; z-index: 1; position: relative;}
}
@media (max-width:768px){
    .board-view .view-head .view-info span a {max-width: 62%;}
    .board-view .view-head h3 span.tit_label_red{font-size:17px; background:#de2336; color:#fff; border-radius:30px; padding:0 13px; margin-right:10px; display:inline-block; height:28px; line-height:28px; margin-top:-3px; vertical-align:middle}
    .board-view .view-head h3 span.tit_label_green{font-size:17px; background:#239609; color:#fff; border-radius:30px; padding:0 13px; margin-right:10px; display:inline-block; height:28px; line-height:28px; margin-top:-3px; vertical-align:middle}
    .board-view .view-head h3 span.tit_label_blue{font-size:17px; background:#2c4ca9; color:#fff; border-radius:30px; padding:0 13px; margin-right:10px; display:inline-block; height:28px; line-height:28px; margin-top:-3px; vertical-align:middle}
    .board-view .view-body {padding: 10px 0;}
    /* .board-view .view-body .con img {width: 100% !important;} */
}
@media (max-width:550px) {
    .board-view .view-head h3 {padding: 12px 15px; font-size: 21px !important;}
    .board-view .view-head h3 P{font-size: 19px; padding: 15px 18px}
    .board-view .view-head .btn-wrap input {font-size: 14px; padding: 2px 8px;}
    .board-view .view-head .view-info span a {max-width: 33%;}
    /* .board-view .view-head .view-info_file span, .board-view .view-head .view-info-link span { flex-direction: column;  }
    .board-view .view-head .view-info_file span a { width: calc(100%); max-width: 100%;  margin-right: 0; }
    .board-view .view-head .view-info_file span strong {} */
    .board-view .view-head .view-info_file .file_info {font-size:14px}
}

.write-wrap input[type='text'],
.write-wrap input[type='password'] {padding: 6px 30px 6px 10px; border: 1px solid #ccc; vertical-align: middle; background-color: #fff; box-sizing: border-box; margin-top:-4px;}
.write-wrap select {margin-right:10px; max-width: 600px;}
.write-wrap input[type='file'] {width:auto !important; font-size:17px;}
.write-wrap .title {display:block; font-size: 25px; padding: 0 0 10px 0; font-weight:bold; color: #287797;}
.write-wrap .write-head {border-top: 2px solid #393939; position: relative;}
.write-wrap .write-head > div:last-child {border-bottom: none;}
.write-wrap .write-info-wrap {display: flex;}
.write-wrap .write-info-wrap > .write-info{}
.write-wrap .write-info {font-size:17px; border-bottom: 1px solid #d5d5d5; display: flex; width: 100%;}
.write-wrap .write-info > strong {min-width: 130px; padding: 17px 5px; text-align:center; background:#f8f9fb; font-size: 18px;}
.write-wrap .write-info > span {width: 100%; display: flex; padding: 10px;}
.write-wrap .write-info input[type=checkbox] {margin-right:5px; margin-top:10px}
.write-wrap .write-info label {margin-top:9px}
.write-wrap .write-body textarea {padding:10px; height:400px; z-index: 1; position: relative;}
.write-wrap .write-footer ul.file li {margin:0;border-bottom: 1px solid #d5d5d5;display: flex;position: relative;}
.write-wrap .write-footer ul.file li strong {display:inline-block;font-size:17px;width: 140px;padding: 18px 10px;text-align:center;background: #f8f9fb;min-width: 140px;}
.write-wrap .write-footer ul.file li strong i{font-size:18px;color:#444;transform: rotate(45deg);display: inline-block;}
.write-wrap .write-footer ul.file li > div {width:100%;display: flex;justify-content: space-between;}
.write-wrap .write-footer ul.file li span {padding: 10px;padding-right: 0;display: flex;text-align: center;}
.write-wrap .write-footer ul.file li span.tip{color: #8f8f8f;font-size: 16px;line-height: 1;display: flex;flex-direction: column;justify-content: center;}
.write-wrap .write-footer ul.file li span.check {padding: 18px 8px;padding-right: 20px;}
.write-wrap .write-footer ul.file li span.check * {margin-left: 5px;}
.write-wrap .write-footer ul.file li span.check *:first-child {margin-left:0}
.write-wrap .write-footer ul.file li span.check input {margin-top: 1px;}
.write-wrap .write-footer ul.file li span.check a {display: flex;}
.write-wrap .write-footer ul.file li span.check a span {padding: 0 !important;width: auto;}
.write-wrap .write-footer ul.file li span.check a span.file_size {margin-top: 2px;}
.write-wrap .write-footer ul.file li span.check .file_delete {margin-left: 8px;padding: 0 !important;/* position: absolute; *//* right: 5px; */width: auto;display: inline;}

.write-wrap .write-footer ul.file li .file_title {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;max-width: 100px !important;display: inline-block;word-break: break-all;font-size: 16px;/* margin: 0 auto; */}
.write-wrap .write-footer ul.file li .file_size {font-size: 15px;}
.write-wrap .write-footer ul.file li .file_delete {color: #eb0f00;font-size: 17px;text-align: center;font-weight: 500; cursor: pointer;}
.write-wrap .write-footer ul.file li .file_delete:hover {text-decoration:underline !important;}

.write-wrap .write-footer ul.file li.editor_files {}
.write-wrap .write-footer ul.file li.editor_files strong {display: flex; flex-direction: column; justify-content: center;}
.write-wrap .write-footer ul.file li.editor_files ul {display: flex;padding: 10px;flex-wrap: wrap;width: 100%;}
.write-wrap .write-footer ul.file li.editor_files ul li {min-width: 120px;border-bottom: 0;margin: 3px 0px;margin-right: 15px;max-width: 150px;width: 100%;display: block;}
.write-wrap .write-footer ul.file li.editor_files ul li .img-wrap {display: flex; flex-direction: column;}
.write-wrap .write-footer ul.file li.editor_files ul li img {aspect-ratio: 4/3;height: 100%;max-height: 100px;border: 1px solid #dee2e6;border-radius: 7px;object-fit: contain;padding: 4px;width: 100%;}
.write-wrap .write-footer ul.file li.editor_files ul li span {padding: 0 5px !important;line-height: 1; height: 20px;margin-top: 5px;display: inline-block;width: 100%; max-width: 150px !important;}
.write-wrap .write-footer ul.file li.editor_files ul li .file_delete {margin-top: 5px;position: absolute;right: -5px;top: -10px;background: #464646;aspect-ratio: 1/1;border-radius: 50px;color: #fff;line-height: 1;padding: 3px;height: 20px;width: 20px;font-size: 14px;}

@media all and (max-width:1024px) {
    .write-wrap .write-footer ul.file li strong {min-width: 130px;width: 130px;}
    .write-wrap .write-footer ul.file li span.check a span.file_title {max-width: 120px !important;}
    .write-wrap .write-footer ul.file li > div {flex-direction: column;}
    .write-wrap .write-footer ul.file li span.check {padding-top: 0 !important;padding-bottom: 10px;width: auto !important;max-width: initial !important;}
}
@media all and (max-width:768px) {
    .write-wrap input[type='file'] {width: 100% !important;}
    .write-wrap select {max-width: 350px;}
    .write-wrap .write-info > strong {min-width: 100px; width: 100px;}
    .write-wrap .write-footer ul li strong {width:90%; padding: 5px 5%; border-bottom: 1px dashed #d5d5d5;}
    .write-wrap .write-footer ul li span {display:block;width:100%;padding: 10px 5%;text-align: center;max-width: 100% !important;}
    .write-wrap .write-footer ul.file li {flex-direction: column;}
    .write-wrap .write-footer ul.file li strong{width:100%; position:relative; padding: 10px;}
    .write-wrap .write-footer ul.file li span {padding: 8px !important;}
    .write-wrap .write-footer ul.file li span.tip {text-align: left;padding-left: 5px;padding-bottom: 0;}
    .write-wrap .write-footer ul.file li span.check a span.file_title {}
    .write-wrap .write-footer ul.file li.editor_files ul {/* justify-content: space-between; */padding: 15px 10px;}
    .write-wrap .write-footer ul.file li.editor_files ul li {margin: 0;min-width: 1px;width: 30%;max-width: 100%;margin-bottom: 7px;margin-right: 5%;}
    .write-wrap .write-footer ul.file li.editor_files ul li:nth-of-type(3n) {margin-right:0}
    .write-wrap .write-footer ul.file li.editor_files ul li span {max-width : 100% !important;}
}
@media all and (max-width:550px) {
    .write-wrap select{max-width: 100%;}
    .write-wrap .write-info-wrap {flex-direction: column;}
    .write-wrap .write-info {flex-direction:column}
    .write-wrap .write-info strong {width:100%; padding: 10px; font-size: 17px;}
    .write-wrap .write-info > span {display: block; width:100%; padding: 10px 0;}
    .write-wrap .write-info span input[type="text"] {width:100%; max-width: 100%;}
    .write-wrap .write-info.write-info_title span input {width:100%;}
    .write-wrap .write-footer ul.file li span.upload {flex-direction:column;padding-right: 8px;}
    .write-wrap .write-footer ul.file li span.tip {padding-bottom: 0 !important; padding-left: 0 !important;}
    .write-wrap .write-footer ul.file li span.check a span.file_title {max-width: 110px !important;}
    .write-wrap .write-footer ul.file li.editor_files ul {justify-content: space-between;padding: 15px 10px;}
    .write-wrap .write-footer ul.file li.editor_files ul li {width: 48%;margin-right: 0;margin-bottom: 5px;}
    .write-wrap .write-footer ul.file li.editor_files ul li span {line-height: normal;margin: 0 auto;margin-top: 1px;}
    .write-wrap .write-footer ul.file li.editor_files ul li img {max-height: 90px;}
}

.board-comment strong.title {display:block; font-style:normal; font-size:22px; margin:30px 0 0 0; padding:0 0 10px 0; }

.board-comment .comment-write {margin-top:20px; border-bottom: 1px solid #d5d5d5;}
.board-comment .comment-write .write-head {padding:10px 15px; font-weight:bold; border-top: 2px solid #393939; line-height:35px;}
.board-comment .comment-write .write-head strong {margin-right:15px;font-weight: 600;color: #111;}
.board-comment .comment-write .write-head input{border-radius: .375rem !important;margin-right: 15px;}
.board-comment .comment-write .write-head input:last-child {margin-right:0}
/* .board-comment .comment-write .write-body {padding:0 0 10px 0; display: flex;} */
.board-comment .comment-write .write-body textarea {padding:10px; height:100px; font-size:15px; margin-right: 5px}

.board-comment .comment-view .view-head .view-info {padding:10px 10px; font-size:18px; border-bottom: 1px solid #d5d5d5; display: flex; justify-content: space-between;}
.board-comment .comment-view .view-head .view-info li {display: table;}
.board-comment .comment-view .view-head .view-info li span {display: table-cell; vertical-align: middle;}
.board-comment .comment-view .view-head .view-info li span:last-child {padding-right: 0;}
.board-comment .comment-view .view-head .view-info li button, .board-comment .comment-view .view-head .view-info li a {margin-left:5px}
.board-comment .comment-view .view-head .view-info span strong{padding:0 7px 0 0;}
.board-comment .comment-view .view-body .con {font-size:17px; min-height: auto;padding: 0;}

@media all and (max-width:550px) {
    .board-comment .comment-view .view-head .view-info {flex-direction: column;}
    .board-comment .comment-view .view-head .view-info li button, .board-comment .comment-view .view-head .view-info li a {font-size: 14px;padding: 3px 8px;margin-top: 8px;margin-left: 0;margin-right: 5px;}

    .board-comment .comment-write .write-head {padding: 10px 0;}
    .board-comment .comment-write .write-head strong {width: 90px;font-size: 17px;padding: 1px 5px;}
    .board-comment .comment-write .write-head input {margin-right: 0;width: 100%;max-width: calc(100% - 105px);margin-bottom: 10px;}
    .board-comment .comment-write .write-head input:last-child {margin-bottom:0}
}

.pw-wrap {max-width: 1000px; margin-top: 130px;}
.password {position:relative;padding: 70px 25px;background:#fff;border:1px solid #d9d9d9;text-align: center; }
.password:before {content:"";position:absolute;bottom:-4px;left:-1px;display:block;width:100%;height:3px;background: #f7f7f7;}
.password .info-box { }
.password .info-box > * {display: block;line-height: 1;margin-bottom: 13px;}
.password .info-box span {font-size: 31px;color: #f2a90a;}
.password .info-box span i { }
.password .info-box strong {font-size: 30px;}
.password .info-box p{font-size: 21px;}
.password .input-group {position:relative; margin:0 auto;margin-top: 30px;}

@media (max-width:550px){
    .password .info-box strong {font-size: 23px;}
    .password .info-box p{font-size: 18px;}
}

.content-head .label {display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 20px; font-size: 20px; font-weight: 600; padding: 4px 20px; border-radius: 25px; color: #179145; border: 3px solid #179145; display: none;}
.content-head .title {position: relative; font-size: 33px; font-weight: 700; line-height: 1.3; margin-bottom: 40px; word-break: break-all;}
.content-body {margin-top: 30px}
.content-body .content-info {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; padding: 23px 10px; border-top: 2px solid #777; border-bottom: 1px solid #777}
.content-body .content-info .date {display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items:baseline; font-size: 17px; color: #999}
.content-body .content-info .date strong {display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; font-size: 17px; color: #373535}
.content-body .content-info .date strong::after {content: ""; width: 1px; height: 12px; background: #aaa; margin: 0 15px}
.content-body .content-info .date i {font-size: 15px; margin-right:5px;}
.content-body .content-info .content-count {display: -webkit-box; display: -ms-flexbox; display: flex; position: relative}
.content-body .content-info .content-count span {display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; padding-left: 20px; color: #8a8a8a;}
.content-body .content-info .content-count span + span {margin-left: 20px}
.content-body .content-info .content-count span a {cursor: pointer; color: #8a8a8a;}
.content-body .content-info .content-count span a:hover {color: #d92d14;}
.content-body .content-info .content-count .ico-view {background: url(../images/board/ico-view.png) 0 center no-repeat}
.content-body .content-info .content-count .ico-like {background: url(../images/board/ico-like.png) 0 center no-repeat}
.content-body .content-info .content-count .ico-accu {background: url(../images/board/ico-accu.png) 0 center no-repeat}
.content-body .content-info .content-count .ico-text {background: url(../images/board/ico-text.png) left no-repeat; opacity: 0.6;}
.content-body .content-info .content-count button {font-size: 19px; width: 24px; border: 1px solid #ccc; line-height: 1; margin-left: 5px; }
.content-body .content-info .content-count button:hover {background: #e9e9e9; transition: 0.3s;}
.content-body .content-detail {margin: 70px 0; line-height: 1.6; font-size: 18px;}
.content-body .content-detail h3 {margin-bottom: 50px; font-size: 24px; font-weight: 600; color: #313131}
.content-body .content-detail * {word-break: break-all;}
.content-body .content-detail figure {margin-bottom: 60px}
.content-body .content-detail figcaption {text-align: center; margin-top: 20px; color: #818181; font-size: 17px}
.content-body .content-detail img {display: block; margin: 0 auto; max-width: 100%; height: auto;}
.content-body .content-detail .content-copyright {margin-top: 70px; color: #686868}

@media (max-width:1300px) {
    .content-body .content-detail img {margin: 0 !important;}
}
@media (max-width:1024px) {
    .content-head .label {margin-bottom: 20px; font-size: 20px; height: auto; line-height: initial; padding: 8px 20px;}
    .content-head .title {font-size: 28px; margin-bottom: 30px;}
    .content-body .content-info {padding: 15px 10px;}
    .content-body .content-info .date, .content-body .content-info .date strong {font-size: 17px}
    .content-body .content-detail {margin: 50px 0}
    .content-body .content-detail h3 {font-size: 20px; margin-bottom: 40px}
    .content-body .content-detail figcaption {font-size: 15px}
    .content-body .content-detail figure {margin-bottom: 40px}
    .content-body .content-detail .content-copyright {margin-top: 40px}
    .content-body .content-detail img {}
    .content-body .content-detail table {width: auto!important; height: auto !important;}
}
@media (max-width:768px) {
    .content-head .label {margin-bottom: 8px; font-size: 17px; padding: 6px 20px; border-width: 2px;}
    .content-head .title {font-size: 25px; margin-bottom: 0; margin-top: 25px;}
    .content-body {margin-top: 20px;}
    .content-body .content-info {padding: 12px 0; flex-wrap: wrap;}
    .content-body .content-info .date {margin: 5px 0;}
    .content-body .content-info .date, .content-body .content-info .date strong {font-size: 15px;}
    .content-body .content-info .date strong::after {height: 8px; margin: 0 7px}
    .content-body .content-info .content-count span {font-size: 15px}
    .content-body .content-info .content-count span + span {margin-left: 10px}
    .content-body .content-detail {margin: 30px 0; font-size: 17px;}
    .content-body .content-detail h3 {font-size: 17px; margin-bottom: 30px}
}
@media (max-width:550px) {
    .content-head .label {font-size: 15px; padding: 4px 15px;}
    .content-head .title {font-size: 22px; margin-top: 20px;}
    .content-body .content-info {padding: 10px 3px;}
    .content-body .content-detail {font-size: 17px;}
    .content-body .content-detail img {max-width: 100% !important; width: 100% !important; padding: 0 !important; height: auto !important;}
}

.content-share {display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 70px 0 60px;}
.content-share a {display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border: 1px solid #ddd; width: 150px; height: 45px; margin: 0 7px; background-size: 20px !important;}
.content-share .ico-like {background: url(../images/board/heart-regular.svg) center no-repeat;}
.content-share .ico-like.on {background: url(../images/board/heart-solid.svg) center no-repeat;}
.content-share .ico-share {background: url(../images/board/share.svg) center center no-repeat; background-size: 18px !important;}
.content-share .ico-print {background: url(../images/board/printer.svg) center center no-repeat;}

@media (max-width:768px) {
    .content-share {margin: 40px 0 30px}
}

.tag-list {display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 80px; margin-bottom: 30px;}
.tag-list li {margin-bottom: 10px; margin-right: 10px;}
.tag-list li a {display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border: 1px solid #dbdbdb; border-radius: 25px; padding: 7px 14px; color: #666; font-size: 14px; font-weight: 500; transition: 0.3s;}
.tag-list li a:hover {-webkit-box-shadow: 3px 3px 4px rgba(0,0,0,.15); box-shadow: 3px 3px 4px rgba(0,0,0,.15); border: 1px solid #179145; transition: 0.3s;}

@media (max-width:550px) {
    .tag-list {margin-top: 50px; margin-bottom: 20px}
}

.content-other {display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 50px 0; border-top: 1px solid #d5d5d5; border-bottom: 1px solid #eee}
.content-other .divider {-ms-flex-negative: 0; flex-shrink: 0; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; margin: 0 20px; width: 33px; height: 30px; background: url(../images/board/ico-divider.png) center center no-repeat}
.content-other a {display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%}
.content-other a span {display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-negative: 0; flex-shrink: 0; width: 57px; height: 57px; border-radius: 50%; background: url(../images/board/sub-other-arrow.png) center center no-repeat; margin-right: 15px; transition: 0.3s;}
.content-other a span.ico-next {margin-right: 0; margin-left: 15px; -webkit-transform: rotate(-180deg); transform: rotate(-180deg)}
.content-other a:hover span {background-color: #eee; transition: 0.3s;}
.content-other a:hover strong {color: #179145; text-decoration: underline; transition: 0.3s;}
.content-other a:nth-of-type(2) {-webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; text-align: right}
.content-other a > div p {font-size: 15px; color: #666}
.content-other a > div strong {display: block; font-size: 18px; margin-bottom: 12px; font-weight: 500; word-break: break-all; display: -webkit-box; overflow: hidden; line-height: 1.35; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 1}

@media (max-width:1400px) {
    .content-other a > div p {font-size: 14px}
    .content-other a > div strong {font-size: 17px}
}
@media (max-width:1000px) {
    .content-other {padding: 30px 0}
}
@media (max-width:768px) {
    .content-other .divider {width: 20px; height: 20px; background-size: 100%; margin: 0 25px;}
    .content-other a span {width: 36px; height: 36px; background-size: 100%; margin-right: 10px}
    .content-other a span.ico-next {margin-right: 0; margin-left: 10px}
}

.comment {margin: 80px 0}
.comment .comment-write{}
.comment .comment-write .title {font-size: 22px; font-weight: 500; margin-bottom: 13px !important; position: relative}
.comment .comment-write .title i {margin-right: 5px;}
.comment .comment-write .title span {font-weight: bold}
.comment .comment-write input {min-width:100px; margin-left: 5px !important;}

.comment .comment-view {border-top: 2px solid #ccc; margin-top: 40px}
.comment .comment-view > li {border-bottom: 1px solid #ccc; padding: 25px 0 20px; position: relative;}
.comment .comment-view > li .view-head {display: flex; justify-content: space-between; margin-bottom: 5px;}
.comment .comment-view > li .view-head .left {}
.comment .comment-view > li .view-head .left .user {font-size: 18px; font-weight: 600; text-overflow: ellipsis; overflow: hidden; max-width: 230px; white-space: nowrap; display: inline-block;}
.comment .comment-view > li .view-head .left .user i {font-size: 15px; margin-right: 5px; position: relative; top: -1px;}
.comment .comment-view > li .view-head .right {}
.comment .comment-view > li .view-head .right .time {color: #909090;}
.comment .comment-view > li .view-head .right .more-btn {}
.comment .comment-view > li .view-head .right .more-btn i {color: #c2c2c2; font-size: 14px; margin-left: 15px;}
.comment .comment-view > li .view-head .right .more-cont {display: flex; flex-direction: column; position: absolute; right: 0; top: -35px;}
.comment .comment-view > li .view-head .right .more-cont input {background: #fff; border: 1px solid #ccc; border-bottom:0; padding: 6px;}
.comment .comment-view > li .view-head .right .more-cont input:last-child {border-bottom: 1px solid #ccc;}
.comment .comment-view > li .view-body {clear: both; overflow: hidden; margin-top: 10px;}
.comment .comment-view > li .view-body span {}
.comment .comment-view > li .view-body .like {float: right; margin-top: 10px; border: 1px solid #ccc; padding: 4px 10px 3px; border-radius: 10px;}

@media (max-width:768px) {
    .comment {margin: 50px 0;}
}
@media (max-width:550px) {
    .comment .comment-view > li .view-head {flex-wrap: wrap;}
    .comment .comment-view > li .view-head .left .user {max-width: 150px;}
}


/* ----- 마이페이지 ----- */
.mypage-wrap {width: 100%;position:relative;}

.mypage-top {width: 100%; height: 260px; background-color: var(--sub-color); /*background: url('../images/main/research-bg.jpg')no-repeat center center/100%;*/ border-radius: 30px; margin-bottom: 50px; display: flex; flex-wrap: wrap; gap: 30px; padding: 30px 40px; color: #fff;}
.mypage-top .profile {display: flex; align-items: center; gap: 40px; flex-wrap: wrap; width: 600px;}
.mypage-top .profile .img-wrap {width: 130px; height: 130px; border-radius: 50%; background-color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0px 2px 10px 4px rgb(50 75 152);}
.mypage-top .profile .img-wrap img {width: 100%; height: 100%; object-fit: contain; max-width: 50px;}

.mypage-top .profile .user-wrap {width: calc(100% - 170px); height: 100%; display: flex; flex-direction: column; justify-content: center;}
.mypage-top .profile .user-wrap .user-login {background-color: #ffffff33; width: fit-content; border-radius: 100px; font-size: 17px; color: #ffffffaa; padding: 9px 16px; display: flex; align-items: center; justify-content: center; gap: 5px; margin-bottom: 20px;}
.mypage-top .profile .user-wrap .user-login span {font-size: 16px; color: #ffffffaa;}
.mypage-top .profile .user-wrap .mp-ment {font-size: 22px; color: #ffffffaa; margin-bottom: 20px;}
.mypage-top .profile .user-wrap .name-wrap {display: flex; flex-direction: column; gap: 12px; font-size: 22px;}
.mypage-top .profile .user-wrap .name-wrap .name {font-size: 28px; font-weight: 600; word-break: break-all;}

.mypage-top .user-quick {position: relative; width: calc(100% - 630px); display: flex; flex-direction: column; justify-content: space-between; border-left: 2px solid #ffffff33; padding-left: 30px;}
.mypage-top .user-quick .swiper-wrapper {box-sizing: border-box;}
.mypage-top .user-quick .quick-slider {width: 100%; height: calc(100% - 60px); overflow: hidden;}

.mypage-top .user-quick .swiper-slide a {background-color: #ffffff33; padding: 0 10px; height: 100%; display: flex; align-items: center; justify-content: center; border-radius: 20px; -webkit-transition: .15s ease-out; transition: .15s ease-out; color: #fff; font-size: 17px; line-height: 1.5; word-break: keep-all; text-align: center; position: relative;}
.mypage-top .user-quick .swiper-slide.slide-none a {border: 2px dashed #ffffff33; background-color: transparent;}

.mypage-top .user-quick .swiper-slide .quick-close {opacity: 0; transition: 0.2s ease-in-out; width: 22px; height: 22px; border-radius: 50%; background-color: #093c7a; position: absolute; top: 7px; right: 7px; z-index: 100; color: #ffffffaa;}
.mypage-top .user-quick .swiper-slide .quick-close i {display: flex; align-items: center; justify-content: center;}
.mypage-top .user-quick .swiper-slide .quick-close.active {opacity: 1;}

.mypage-top .user-quick .user-quick-btn-wrap {height: 60px; display: flex; gap: 5px; align-items: flex-start; justify-content: space-between;}
.user-quick-btn-wrap .quick-left, .user-quick-btn-wrap .quick-right {display: flex; align-items: center; justify-content: center;}

.mypage-top .user-quick .btn-quick-prev, .mypage-top .user-quick .btn-quick-next, .mypage-top .user-quick .quick-setting {color: #a0a9ba; display: flex; width: 30px; height: 30px; align-items: center; justify-content: center; transition: 0.2s ease-in-out; font-size: 24px; color: #ffffffaa;}
.mypage-top .user-quick .btn-quick-prev span,.mypage-top .user-quick .btn-quick-next span {font-weight: 400; font-size: 20px; color: #ffffffaa;}

.user-quick-btn-wrap .quick-left .tit {font-size: 26px; font-weight: 600;}
.mypage-top .user-quick .quick-setting {margin-left: 7px; background-color: #093c79; border-radius: 50%;}
.mypage-top .user-quick .quick-setting i {display: flex; align-items: center; font-size: 18px;}

/* 마이페이지 맞춤 추천 서비스 */
.mypage-service {display: flex; flex-wrap: wrap; gap: 80px; margin: 80px 0;}
.mypage-service .service-link-wrap {width: calc(100% - 480px); flex: 1;}

.mypage-service .service-tit-wrap  {font-size: 24px; font-weight: 400; word-break: keep-all; line-height: 1.5; width: 400px; position: relative; display: flex; align-items: flex-start; justify-content: center; flex-direction: column;}
.mypage-service .service-tit-wrap .section-title {display: block; font-family: "STUNNING"; font-size: 35px; margin-bottom: 20px;}
.mypage-service .service-tit-wrap .section-title.title-eng {color: var(--main-color); font-size: 24px;;}

.mypage-service .service-link-wrap > ul {display:flex; justify-content: space-between; flex-wrap: wrap; z-index:0;}
.mypage-service .service-link-wrap > ul li a {display: flex; align-items: center; justify-content: center; flex-direction: column; transition: 0.3s ease-in-out;}
.mypage-service .service-link-wrap > ul li a:hover {transform: translateY(-10px);}
.mypage-service .service-link-wrap > ul li a p {width: 135px; height: 135px; background-color:#f5f7fb !important; border-radius:50%; margin-bottom: 30px;}
.mypage-service .service-link-wrap > ul li a span {display: flex; align-items: center; justify-content: center; text-align: center; position: relative; font-size: 20px; font-weight: 600;}
.mypage-service .service-link-wrap > ul .link01 a p {background: url(../images/main/ico-service01.png) no-repeat center center/50%; transition: 0.3s ease-in-out;}
.mypage-service .service-link-wrap > ul .link02 a p {background: url(../images/main/ico-service02.png) no-repeat center center/50%;}
.mypage-service .service-link-wrap > ul .link03 a p {background: url(../images/main/ico-service03.png) no-repeat center center/50%;}
.mypage-service .service-link-wrap > ul .link04 a p {background: url(../images/main/ico-service04.png) no-repeat center center/50%;}
.mypage-service .service-link-wrap > ul .link05 a p {background: url(../images/main/ico-service05.png) no-repeat center center/50%;}
.mypage-service .service-link-wrap > ul .link06 a p {background: url(../images/main/ico-service06.png) no-repeat center center/50%;}
.mypage-service .service-link-wrap > ul .link07 a p {background: url(../images/main/ico-service07.png) no-repeat center center/50%;}
.mypage-service .service-link-wrap > ul .link08 a p {background: url(../images/main/ico-service08.png) no-repeat center center/50%;}

/* 마이페이지 나의 신청 리스트 */
.mypage-list-wrap {width: 100%; border-radius: 30px; /*padding: 30px;*/ line-height: 33px; margin-top: 20px; /*background-color: #f5f7fb;*/}
.mypage-list {display: flex; flex-wrap: wrap; gap: 30px;}
.mypage-list > li {width: calc(33.3% - 20px); min-height: 400px; padding: 10px 20px; background-color: #fff; border-radius: 30px; box-shadow: 0px 0px 12px #152d7121; overflow: hidden;}
.mypage-list > li .list-top {width: 100%; height: 75px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #babac8;}
.mypage-list > li .list-top .title-wrap {display: flex; gap: 10px; align-items: center; justify-content: center;}
.mypage-list > li .list-top .account {background-color: #e8e9fd; font-size: 17px; font-weight: 500; color: #485595; display: flex; padding: 0 10px; border-radius: 5px;}
.mypage-list > li .list-top .account .num {font-weight: bold; font-size: 20px; margin-right: 2px;}
.mypage-list > li .list-top .tit {font-size: 23px; font-weight: bold; color: #333; display: flex; align-items: center; justify-content: center;}
.mypage-list > li .list-top .tit i {font-size: 22px; color: #333; margin-right: 7px; background-color: #f2f3f7; border-radius: 8px; width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center;}
.mypage-list > li .list-top .quick {width: 50px; height: 50px; border-radius: 25px; background-color: #eeeff1; display: flex; align-items: center; justify-content: center;}
.mypage-list > li .list-top .quick i {display: flex; align-items: center; justify-content: center; font-size: 26px; color: #8d8d8e;}

.mypage-list > li .list-cont {width: 100%; max-height: 300px; height: 100%; overflow: auto; margin-top: 20px;}
.mypage-list > li .list-cont .cont-detail {position: relative;}
.mypage-list > li .list-cont .cont-detail > li {position: relative; padding: 0 50px 20px; font-size: 18px;}
.mypage-list > li .list-cont .cont-detail > li::before {content: '\F26E'; font-family: 'bootstrap-icons'; font-size: 15px; color: #fff; width: 20px; height: 20px; background-color: var(--main-color); border-radius: 10px; position: absolute; top: 8px; left: 10px; display: flex; align-items: center; justify-content: center; z-index: 2;}
.mypage-list > li .list-cont .cont-detail > li:not(:last-child)::after {content: ''; width: 2px; height: calc(100% - 35px); background-color: #cbdbfa; position: absolute; bottom: 0; left: 18px;}
.mypage-list > li .list-cont .cont-detail .tit {font-size: 20px; font-weight: 600; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.mypage-list > li .list-cont .cont-detail .tit-wrap {display: flex; align-items: center; justify-content: space-between;}
.mypage-list > li .list-cont .cont-detail .tit-wrap .answer {font-size: 16px; padding: 9px 12px; margin-left: 15px;}
.mypage-list > li .list-cont .cont-detail .desc li {font-size: 18px; font-weight: 500; color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.mypage-list .ai-subject{position:relative;}
/*.mypage-list .ai-subject::before {content: ''; position:absolute; width: 100px; height: 76px; /*background: url(../images/sub/mypage/mypage-subject.png) no-repeat center center / contain; right:30px; top:13px;}*/
.mypage-list .ai-subject::before {z-index:999; content: "Rise with AI"; position: absolute; top: 95%; left: 62%; transform: translate(-50%, -50%);font-size: 60px; font-weight: 800; color: rgb(93 163 206 / 20%); white-space: nowrap; pointer-events: none; user-select: none;}

.mypage-list .ai-online{position:relative;}
.mypage-list .ai-online::before {content: ''; position:absolute; width: 170px; height: 70px; background: url(../images/sub/mypage/mypage-online.png) no-repeat center center / contain; right:20px; top:10px;}

/* 마이페이지 북마크 */
.mypage-list > li.bookmark .cont-detail .tit {display: flex; align-items: center;}
.mypage-list > li.bookmark .cont-detail .tit .btn-secondary {display: flex; align-items: center; justify-content: center; padding: 1px 7px; font-size: 16px; margin-left: 7px; --bs-btn-bg: #eeeff1; --bs-btn-border-color: #eeeff1; --bs-btn-hover-bg: #e2e5e9; --bs-btn-hover-border-color: #e2e5e9; --bs-btn-active-bg: #e2e5e9; --bs-btn-active-border-color: #e2e5e9; color: #8d8d8e;}
.mypage-list > li.bookmark .cont-detail .tit .btn-secondary i {display: flex; align-items: center; justify-content: center; margin-left: 5px;}
.mypage-list > li.bookmark a {font-weight: 500;}
.mypage-list > li.bookmark a:hover {text-decoration: underline !important;}

/* 스크롤바 */
.mypage-list > li ::-webkit-scrollbar {width: 4px;height: 5px;}
.mypage-list > li ::-webkit-scrollbar-track {background: #e2e2e2;border-radius: 8px;}
.mypage-list > li ::-webkit-scrollbar-thumb {background: #f7ba5d;border-radius: 8px;}
.mypage-list > li ::-webkit-scrollbar-thumb:hover {background:#f1a737;}

@media (max-width: 1400px) {
    .mypage-right .mypage-count-wrap .mypage-count {gap: 30px 20px;}
    .mypage-right .mypage-count-wrap .mypage-count li {width: calc(50% - 10px);}

    .mypage-list > li {width: 100%; min-height: 320px;}

    .mypage-list .ai-subject::before {left: auto; top: 93%; right: 35px; transform: translate(0, -50%);}
}
@media (max-width: 1200px) {
    .mypage-wrap {display: flex; width: 100%; gap: 30px;}
    .mypage-right {width: calc(100% - 310px);}

    .mypage-right .mypage-count-wrap {padding: 30px 25px 20px 25px;}
    .mypage-right .mypage-count-wrap::before {display: none;}
    .mypage-right .mypage-count-wrap h2 {margin-bottom: 40px; margin-left: 10px;}

    /* .mypage-list-wrap {padding: 20px 25px;} */
    .mypage-list {gap: 20px;}
    .mypage-list > li .list-top {height: 65px;}
    .mypage-list > li .list-top .tit {font-size: 22px;}
    .mypage-list > li .list-top .tit i {font-size: 22px;}
    .mypage-list > li .list-top .account {font-size: 16px;}
    .mypage-list > li .list-top .account .num {font-size: 20px;}
    .mypage-list > li .list-top .quick {width: 44px; height: 44px; border-radius: 22px;}
    .mypage-list > li .list-cont .cont-detail .tit {font-size: 19px;}
    .mypage-list > li .list-cont .cont-detail .desc li {font-size: 17px; line-height: 25px;}
}
@media (max-width: 1000px) {
    .mypage-wrap {gap: 0;}
    .mypage-left {display: none;}
    .mypage-right {width: 100%;}

    /* .mypage-list > li{min-height: 250px;} */
}
@media (max-width: 768px) {
    .mypage-list > li .list-cont .cont-detail .tit-wrap .answer {font-size: 14px; padding: 6px 10px;}
}
@media (max-width: 600px) {
    .mypage-right .mypage-count-wrap .mypage-count li {width: 100%;}

    /* .mypage-list .ai-subject::before {width: 80px; height: 56px;} */
    .mypage-list .ai-online::before {width: 120px; height: 60px;}
}
@media (max-width: 550px) {
    .mypage-right .mypage-count-wrap {padding: 30px 15px 15px;}
    
    /* .mypage-list-wrap {border-radius: 20px;} */
    .mypage-list > li {border-radius: 20px; padding: 10px 15px;}
    .mypage-list > li .list-top {height: auto; padding: 10px 0;}
    .mypage-list > li .list-top .tit {font-size: 20px; line-height: 35px;}
    .mypage-list > li .list-top .tit i {font-size: 20px;}
    .mypage-list > li .list-top .quick {width: 36px; height: 36px; border-radius: 18px;}
    .mypage-list > li .list-cont .cont-detail > li {padding: 0 30px 20px}
    .mypage-list > li .list-cont .cont-detail > li::before {left: 0;}
    .mypage-list > li .list-cont .cont-detail > li:not(:last-child)::after {left: 8px;}

    .mypage-top .profile .user-wrap .name-wrap .name {font-size: 21px;}
    .user-quick-btn-wrap .quick-left .tit {font-size: 20px;}
}
@media (max-width: 450px) {
    .mypage-list .ai-subject::before {display: none;}
    .mypage-list .ai-online::before {display: none;}
}
@media (max-width: 400px) {
    .mypage-list > li .list-top .title-wrap {flex-direction: column; align-items: flex-start;}
}

/* 마이페이지 프로필 카드 반응형 */
@media (max-width: 1600px) {
    .mypage-top {padding: 30px; gap: 0px;}
    .mypage-top .profile {gap: 30px;}
    .mypage-top .profile .user-wrap {width: calc(100% - 150px);}
    .mypage-top .profile .img-wrap {width: 120px; height: 120px;}

    .mypage-top .user-quick {width: calc(100% - 600px);}
}
@media (max-width: 1440px) {
    .mypage-top {flex-direction: column; height: fit-content; gap: 40px;}
    .mypage-top .profile {width: 100%; align-items: flex-start;}
    .mypage-top .profile .user-wrap .user-login {margin-bottom: 15px;}
    .mypage-top .profile .user-wrap .mp-ment {margin-bottom: 15px; font-size: 20px;}
    .mypage-top .profile .user-wrap .name-wrap {flex-direction: row; flex-wrap: wrap; align-items: center; font-size: 20px;}
    .mypage-top .profile .user-wrap .name-wrap .name {font-size: 25px;}

    .mypage-top .user-quick {width: 100%; padding-left: 0; border-left: none;}
    .mypage-top .user-quick .user-quick-btn-wrap {height: fit-content; margin-bottom: 15px;}
    .user-quick-btn-wrap .quick-left .tit {font-size: 23px;}
    .mypage-top .user-quick .swiper-slide a {height: 140px; padding: 0 20px;}
}
@media (max-width: 1200px) {
    .mypage-top {margin-bottom: 30px;}
}
@media (max-width: 1024px) {
    .mypage-top .user-quick .swiper-slide a {padding: 0 10px;}
}
@media (max-width: 768px) {
    .mypage-top {padding: 25px;}

    .mypage-top .profile {gap: 20px;}
    .mypage-top .profile .user-wrap{width: calc(100% - 120px);}
    .mypage-top .profile .user-wrap .user-login {padding: 7px 14px;}
    .mypage-top .profile .user-wrap .mp-ment {font-size: 19px;}
    .mypage-top .profile .user-wrap .name-wrap {font-size: 19px;}
    .mypage-top .profile .user-wrap .name-wrap .name {font-size: 23px;}
    .mypage-top .profile .img-wrap {width: 100px; height: 100px;}

    .user-quick-btn-wrap .quick-left .tit {font-size: 21px;}
}
@media (max-width: 550px) {
    .mypage-top {padding: 20px; gap: 30px;}
    .mypage-top .profile {flex-direction: column; align-items: center; text-align: center;}
    .mypage-top .profile .user-wrap {width: 100%;}
    .mypage-top .profile .user-wrap .user-login {margin: 0 auto; margin-bottom: 15px;}
    .mypage-top .profile .user-wrap .name-wrap {justify-content: center;}
    .mypage-top .profile .img-wrap {width: 90px; height: 90px;}
}
@media (max-width: 400px) {
    .mypage-top .profile .user-wrap .mp-ment {display: none;}
}




/* ----- 검색결과 없음 ----- */
.no-result-wrap.sub {display: flex; align-items: center; justify-content: center; margin: 100px 0;}
.no-result-wrap.sub .list-dot {margin-bottom: 0;}

.no-result-wrap.sub .result-box {display: flex; align-items: center; gap: 30px;}

.no-result-wrap.sub .result-box .result-img-box {width: 320px; height: 220px; background: url('../images/sub/no-search-img.png')no-repeat center center/contain;}

.no-result-wrap.sub .result-box .result-text-box > i {display: block; width: fit-content; font-size: 60px; color: #9badda;}
.no-result-wrap.sub .result-box .result-text-box .tit {font-size: 32px; font-weight: 600; margin-bottom: 10px; position: relative;}
.no-result-wrap.sub .result-box .result-text-box .tit span {font-weight: bold; color: var(--main-color); margin-right: 5px;}

@media (max-width: 1200px) {
    .no-result-wrap.sub .result-box {gap: 10px;}

    .no-result-wrap.sub .result-box .result-img-box {width: 300px; height: 200px;}

    .no-result-wrap.sub .result-box .result-text-box i {font-size: 55px;}
    .no-result-wrap.sub .result-box .result-text-box .tit {font-size: 28px;}
}
@media (max-width: 900px) {
    .no-result-wrap.sub {margin: 50px 0;}
    .no-result-wrap.sub .result-box {flex-direction: column; gap: 10px;}

    .no-result-wrap.sub .result-box .result-text-box i {display: none;}
    .no-result-wrap.sub .result-box .result-text-box .tit {text-align: center; margin-bottom: 15px; font-size: 25px;}
}
@media (max-width: 500px) {
    .no-result-wrap.sub {margin: 30px 0;}

    .no-result-wrap.sub .result-box .result-img-box {width: 280px; height: 180px;}
    
    .no-result-wrap.sub .result-box .result-text-box .tit {font-size: 22px;}
}

/* 가족회사 결과없음 */
.no-result-wrap.f-company {width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 50px 0;}
.no-result-wrap.f-company .result-img-box {width: 460px; height: 300px; background: url('../images/sub/family-inc-img.png') no-repeat center center/contain; margin-bottom: 10px;}
.no-result-wrap.f-company p {font-size: 20px;}

@media (max-width: 1024px) {
    .no-result-wrap.f-company .result-img-box {width: 360px; height: 200px;}
}
@media (max-width: 500px) {
    .no-result-wrap.f-company {margin: 50px 0;}
    .no-result-wrap.f-company .result-img-box {width: 320px; height: 160px;}
    .no-result-wrap.f-company p {font-size: 18px;}
}


/* ----- 차트 ----- */
.cont-chart-wrap {display: flex; flex-wrap: wrap; width: 100%; gap: 20px; margin-bottom: 30px;}
.cont-chart-wrap .cont-chart-box {width: calc(25% - 15px); display: flex; flex-direction: column; height: 280px;}
.cont-chart-wrap .chart-tit {border: 1px solid #e7e7e7; border-radius: 10px 10px 0 0; padding: 12px 14px 18px; font-size: 18px; font-weight: 600; background-color: #fbfbfb;}
.cont-chart-wrap .chart-tit .fa-chart-line {margin-right: 10px;}
.cont-chart-wrap .cont-chart {height: 100%; border:1px solid #e7e7e7; padding: 5px; border-radius: 10px; margin-top: -10px; background-color: #fff;text-align:center;display:flex; align-items: center;justify-content: center;}
.cont-chart-wrap .cont-chart canvas{width:100%;max-height:210px !important;}

@media(max-width:1200px) {
    .cont-chart-wrap {gap: 15px;}
    .cont-chart-wrap .cont-chart-box {width: calc(50% - 7.5px);}
}
@media(max-width:650px) {
    .cont-chart-wrap .cont-chart-box {width: 100%;}
}


/* ----- 상담문의 버튼, 모달 ----- */
.consult-btn {border-radius: 100px !important;}
.consult-btn i {margin: 0 5px 0 0 !important;}

.consult-modal {
--radius-xl: 1.25rem;
border-radius: var(--radius-xl) !important;
overflow: hidden;
}
.consult-modal .modal-header{padding-bottom:10px;}
.consult-modal .modal-header h4{font-size:18px;}
.consult-modal .modal-header,
.consult-modal .modal-footer {
background: #fafbfc;
}
.consult-modal .form-control,
.consult-modal .form-select {
border-radius: 0.9rem;
}
.consult-modal .form-control:focus,
.consult-modal .form-select:focus {
box-shadow: 0 0 0 .25rem rgba(13,110,253,.15);
border-color: rgba(13,110,253,.35);
}
.consult-modal .form-control{font-size:14px;}


/* ----- 부트스트랩 툴팁 ----- */
.tooltip {font-size: 14px; z-index: 10;}
.tooltip .tooltip-inner {padding: 3px 9px;}

@media(max-width: 768px) {
    .tooltip {display: none;}
}


/* ----- 신청페이지 ----- */
.apply-page-wrap .apply-cont-wrap {border: 1px solid #b9b9b9; border-radius: 20px; padding: 30px;}
.apply-page-wrap .apply-check {display: flex; align-items: center; justify-content: center; margin: 40px 0;}
.apply-page-wrap .apply-check p {font-size: 18px; color: var(--main-color); font-weight: 500; text-align: center;}
.apply-page-wrap .apply-check .form-check {display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 18px;}

/* @media(max-width:1200px) {
    .apply-page-wrap .apply-cont-wrap {border: none; border-radius: 0; padding: 0;}
} */
@media(max-width:768px) {
    .apply-page-wrap .apply-check {flex-direction: column; gap: 15px 0;}
    .apply-page-wrap .apply-check p {font-size: 17px;}
    .apply-page-wrap .apply-check .form-check {padding-left: 0; font-size: 17px;}
}

/* 신청페이지 20250905 모달 변경 */
.apply-page-wrap .apply-cont-wrap {display: flex; gap: 30px; max-height: 300px; overflow: auto; position: relative;}

.apply-page-wrap .apply-cont-wrap::-webkit-scrollbar {width: 5px;height: 5px;}
.apply-page-wrap .apply-cont-wrap::-webkit-scrollbar-track {background: transparent; border-radius: 8px; margin: 10px;}
.apply-page-wrap .apply-cont-wrap::-webkit-scrollbar-thumb {background: #8b8b8b; border-radius: 8px;}
.apply-page-wrap .apply-cont-wrap::-webkit-scrollbar-thumb:hover {background:#636363;}

.apply-page-wrap .apply-cont-wrap .sub-tit {font-size: 23px; margin-bottom: 20px;}

.apply-page-wrap .apply-cont-wrap .apply-table {width: 46%; height: fit-content; position: relative; padding-right: 30px;}
.apply-page-wrap .apply-cont-wrap .apply-table::before {content: ''; width: 1px; height: 100%; background-color: #d9d9d9; position: absolute; top: 50%; transform: translateY(-50%); right: 0;}
.apply-page-wrap .apply-cont-wrap .apply-notice {width: 54%;}
.apply-page-wrap .apply-cont-wrap .apply-notice .list-dot li {color: #555; font-weight: 400;}
.apply-page-wrap .apply-cont-wrap .apply-notice .list-dot li strong {color: #212529;}
.apply-page-wrap .apply-cont-wrap .apply-notice .cont-notice {font-size: 18px; margin-bottom: 0;}

.apply-page-wrap .apply-cont-wrap .apply-table table .input-group {display: flex; align-items: center; justify-content: center;}
.apply-page-wrap .apply-cont-wrap .apply-table table .input-group span {margin-left: 5px !important; font-size: 17px; color: #555;}

#applyModal .modal-dialog {max-width: 1400px;}

@media (max-width: 1440px) {
    .apply-page-wrap .apply-cont-wrap {padding: 25px;}
    .apply-page-wrap .apply-cont-wrap .sub-tit {font-size: 21px;}
}
@media (max-width: 1024px) {
    .apply-page-wrap .apply-cont-wrap {flex-direction: column; gap: 30px;}
    .apply-page-wrap .apply-cont-wrap .apply-table {width: 100%; padding-right: 0;}
    .apply-page-wrap .apply-cont-wrap .apply-table::before {display: none;}
    .apply-page-wrap .apply-cont-wrap .apply-notice {width: 100%;}
    .apply-page-wrap .apply-cont-wrap .apply-notice .list-dot {margin-bottom: 20px;}
}
@media (max-width: 768px) {
    .apply-page-wrap .apply-cont-wrap {padding: 20px 15px; border-radius: 15px;}
    .apply-page-wrap .apply-cont-wrap .sub-tit {font-size: 19px; margin-bottom: 15px;}
    .apply-page-wrap .apply-cont-wrap .apply-notice .list-dot {margin-bottom: 15px;}
    .apply-page-wrap .apply-cont-wrap .apply-notice .cont-notice {font-size: 17px;}

    .apply-page-wrap .apply-check {margin: 30px 0;}
}
@media (max-width: 480px) {
    .apply-page-wrap .apply-cont-wrap .table_responsive > thead > tr > th,
    .apply-page-wrap .apply-cont-wrap .table_responsive > tbody > tr > th,
    .apply-page-wrap .apply-cont-wrap .table_responsive > thead > tr > td,
    .apply-page-wrap .apply-cont-wrap .table_responsive > tbody > tr > td {padding-left: 40%;}
}
@media (max-width: 400px) {
    #applyModal .table_responsive tr::before {width: 90px;}

    .apply-page-wrap .apply-cont-wrap .table_responsive > thead > tr > th,
    .apply-page-wrap .apply-cont-wrap .table_responsive > tbody > tr > th,
    .apply-page-wrap .apply-cont-wrap .table_responsive > thead > tr > td,
    .apply-page-wrap .apply-cont-wrap .table_responsive > tbody > tr > td {padding-left: 50%;}
}


/* ----- 회원탈퇴 모달 ----- */
#deleteAccountModal .modal-dialog {max-width: 1000px;}
#deleteAccountModal .modal-dialog-scrollable .modal-body {overflow-x: hidden;}

#deleteAccountModal input[type="checkbox"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
#deleteAccountModal input[type="checkbox"]+label{padding-left:29px !important;padding-right:5px;min-height:22px;line-height:22px;display:inline-block;position:relative;vertical-align:top;margin-bottom:0;cursor:pointer;}
#deleteAccountModal input[type="checkbox"]+label:before{content:"";display:inline-block; position:absolute; width:22px;height:22px;border:1px solid #D3CFC8;border-radius:50%;margin-left:-29px;margin-top: 3px;}
#deleteAccountModal input[type="checkbox"]:checked+label:before{background:#0d6efd;border-color:#0d6efd;}
#deleteAccountModal input[type="checkbox"]:checked+label:after{content:"";display:inline-block;position:absolute;top:3px;left:0;width:7px;height:10px;border:2px solid #fff;border-left:none;border-top:none;transform:translate(7.75px,4.5px)rotate(45deg);-ms-transform:translate(7.75px,4.5px)rotate(45deg)}

#deleteAccountModal .modal-list-wrap {padding: 15px; border: 1px solid #dee2e6; border-radius: 20px; margin-bottom: 15px; background-color: #f8f9fb;}
#deleteAccountModal .list-dot {margin-bottom: 0;}

#deleteAccountModal .account-warning-box {margin: 34px 0px;}
#deleteAccountModal .account-warning-box p {line-height: 1.5; text-align: center; margin: 0 auto; font-weight: 600; font-size: 19px;}

#deleteAccountModal .agree-check-box {margin: 0 auto; text-align: center; margin-bottom: 34px;}
#deleteAccountModal .agree-check-box .check {display: flex; align-items: center; justify-content: center;}
#deleteAccountModal .agree-check-box .check span {font-size: 18px; line-height: 1.5; cursor: pointer;}
#deleteAccountModal .agree-check-box .check span br {display: none;}

#deleteAccountModal .btn-wrap {gap: 10px;}

@media (max-width: 575px) {
    #deleteAccountModal .modal-list-wrap {border-radius: 15px; padding: 10px; margin-bottom: 10px;}
    #deleteAccountModal .account-warning-box {margin: 30px 0;}
    #deleteAccountModal .account-warning-box p {font-size: 18px;}
    #deleteAccountModal .agree-check-box {margin-bottom: 30px;}
    #deleteAccountModal .agree-check-box .check span {font-size: 17px;}

    #deleteAccountModal .btn-wrap {gap: 7px;}

    #deleteAccountModal input[type="checkbox"]+label:before{margin-top: 2px;}
    #deleteAccountModal input[type="checkbox"]:checked+label:after{top:2px;}
}
@media (max-width: 450px) {
    #deleteAccountModal .custom-check[type="checkbox"] {margin-top: 2px;}
    #deleteAccountModal .agree-check-box .check {align-items: flex-start;}
    #deleteAccountModal .agree-check-box .check span br {display: block;}
}


/* ----- 대학알리미 ----- */

/* 대학알리미 테이블 */
/* .univ-noti-table {overflow-x: scroll; width: 100%; max-height: 800px;} */
/* .univ-noti-table .cont-table {width: max-content;} */
/* .univ-noti-table .table-scroll {display: block;} */
.univ-noti-table table::before {display: none;}
.univ-noti-table table > thead {position: sticky; top: 0; z-index: 20;}
.univ-noti-table table > thead::before {content: ''; width: 100%; height: 2px; background-color: #858585; position: absolute; top: 0; z-index: 20;}
.univ-noti-table .table>thead>tr>th, .univ-noti-table .table>tbody>tr>th, .univ-noti-table .table>thead>tr>td, .univ-noti-table .table>tbody>tr>td {padding: 15px 20px;}
.univ-noti-table table .fix-th {position: sticky; left: 0;}

.univ-info-wrap {display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 15px;}
.univ-noti-table .cont-table > tbody > tr {cursor: pointer;}
.univ-noti-table td > i {font-size: 16px; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background-color: #1d1738; color: #fff;}

.univ-noti-table .table {--bs-table-hover-bg: #c9d4eb4a !important;}

@media(max-width: 768px) {
    .univ-info-wrap {flex-direction: column; align-items: flex-start;}
    .univ-info-wrap .cont-btn {margin-top: 10px;}
}

/* 대학알리미 모달 */
#univModal .modal-dialog {max-width: 1200px;}
#univModal .univ-modal-cont {display: flex; align-items: center; justify-content: center; gap: 20px; margin-bottom: 15px;}

#univModal .univ-modal-cont .univ-cont-left {width: 260px; display: flex; align-items: center; justify-content: center;}
#univModal .univ-modal-cont .univ-cont-left img {max-width: 190px;}

#univModal .univ-modal-cont .univ-cont-right {flex: 1;}
#univModal .univ-modal-cont .univ-cont-right .cont-right-box {padding: 20px; border: 1px solid #d5d7dd; border-radius: 15px;}
#univModal .univ-modal-cont .cont-right-box .univ-cate {margin-bottom: 15px; display: flex; gap: 7px;}
#univModal .univ-modal-cont .cont-right-box .univ-cate span {font-size: 16px; padding: 4px 8px; border-radius: 5px; color: #fff;}
/* #univModal .univ-modal-cont .cont-right-box .univ-list {margin-bottom: 10px;} */
/* #univModal .univ-modal-cont .cont-right-box .univ-list:last-of-type {margin-bottom: 0;} */

#univModal .info {display: flex; flex-wrap: wrap; gap: 12px 0;}
#univModal .info li {display: flex; width: 50%; padding-left: 18px; position: relative;}
#univModal .info li:before {content: ''; position: absolute; width: 4px; height: 4px; background: #5b5b5b; left: 0; top: 8px; border-radius: 50px;}
#univModal .info li span {font-size: 18px; line-height: 1.1;}
#univModal .info li .txt1 {font-weight: 600; width: 80px; color: #292929;}
#univModal .info li .txt2 {width: 100%; flex: 1;}

#univModal .info li span .bi-box-arrow-up-right {font-size: 16px; margin-left: 7px;}

#univModal table {min-width: 1100px;}

@media (max-width:1200px) {
    #univModal .univ-modal-cont {flex-direction: column; gap: 10px;}
    #univModal .univ-modal-cont .univ-cont-left {height: 80px;}

    #univModal .univ-modal-cont .cont-right-box .univ-cate {justify-content: center; margin-bottom: 20px;}
}
@media (max-width:768px) {
    #univModal .info li {width: 100%;}
}
@media (max-width:500px) {
    #univModal .univ-modal-cont .univ-cont-right .cont-right-box {padding: 15px;}
    #univModal .univ-modal-cont .cont-right-box .univ-cate {gap: 5px; margin-bottom: 15px;}
    #univModal .univ-modal-cont .cont-right-box .univ-cate span {padding: 3px 6px;}
}


/* ----- 대학관리자 매뉴얼 슬라이드 ----- */
.cont_title .manual_btn, .cont_title .manual_down_btn {position: relative;}
.cont_title .manual_btn::before, .cont_title .manual_down_btn::before {content: '매뉴얼'; width: 50px; height: 27px; background-color: #191919; position: absolute; top: -33.5px; left: 50%; transform: translateX(-50%); color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; border-radius: 3.75px; z-index: 10; pointer-events: none;}
.cont_title .manual_btn::after, .cont_title .manual_down_btn::after {content: ''; position: absolute; top: -7.5px; left: 50%; transform: translateX(-50%); width: 7.5px; height: 4px; background-color: #191919; clip-path: polygon(0% 0%, 100% 0%, 50% 100%);}
.cont_title .manual_down_btn::before {content: '매뉴얼 보기'; width: 80px;}

@media(max-width: 768px) {
    .cont_title .manual_btn::before, .cont_title .manual_down_btn::before {display: none;}
    .cont_title .manual_btn::after, .cont_title .manual_down_btn::after {display: none;}
}

.manual-slide {width: 100%; height: 100vh; background-color: rgba(0, 0, 0, .9); position: fixed; top:0; left: 0; z-index: 99999; opacity: 0; visibility: hidden; pointer-events: none; transition: 0.3s ease-in-out; overflow-y: auto;}
.manual-slide.active {opacity: 1; visibility: visible; pointer-events: auto;}
.manual-slide .manual-wrap {max-width: 1400px; padding: 0 50px; width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.manual-head {display: flex; align-items: center; justify-content: flex-end; position: relative; color: #fff; padding: 0 155px; margin-bottom: 15px;}
.manual-head .manual-tit {font-size: 50px; font-weight: bold;}

.manual-body {position: relative; display: flex; align-items: center; max-width: 1550px; height: 100%; min-height: 30vh;}
.swiper-inner {flex: 1; padding: 0 150px; overflow: hidden; height: 100%;}
.manual-body .manual-swiper {width: 100%;}
.manual-body .manual-swiper .swiper-slide {text-align: center; font-size: 20px; overflow: hidden;}
.manual-body .manual-swiper .swiper-slide img {display: block; width: 100%; height: 100%; max-height: 700px; object-fit: contain;}
.manual-body .pagination-wrap {width: 100%; display: flex; align-items: center; justify-content: center; margin-top: 20px;}
.manual-body .manual-pagination {position: static; width: fit-content !important;}
/* .manual-body .manual-pagination {width: fit-content !important; left:50% !important; bottom:-50px !important; transform: translateX(calc(-50% - 35px));} */
.manual-body .swiper-pagination-bullet {width: 10px; height: 10px; border-radius: 5px; transition: all 0.3s; background-color: #fff !important; opacity: 0.4 !important;}
.manual-body .swiper-pagination-bullet-active {background: #fff !important; opacity: 1 !important; width: 30px;}
.manual-swiper-toggle {width: 25px; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.manual-swiper-toggle i {font-size: 28px; color: #fff;}
.manual-body .manual-button-prev,
.manual-body .manual-button-next {width: 80px; height: 80px; background-color: rgba(0, 0, 0, .7); border-radius: 40px; color: #fff; position: absolute; top:50%; transform: translateY(calc(-50% + 22px)); display: flex; align-items: center; justify-content: center;}
.manual-body .manual-button-prev {left:0;}
.manual-body .manual-button-next {right:0;}
.manual-body .manual-button-prev i, 
.manual-body .manual-button-next i {color: #fff; font-size: 24px; display: flex; align-items: center; justify-content: center;}
.manual-body .swiper-button-prev::after,
.manual-body .swiper-button-next::after {display: none;}

/* 닫기 버튼 */
.manual-wrap .btn-box button {width: 60px; height: 60px; border-radius: 30px; background-color: rgba(255, 255, 255, 0.3); position: relative; display: flex; justify-content: center; align-items: center;}
.manual-wrap .btn-box button i {color: #000; background-color: #fff; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 20px; font-size: 30px;}

@media(max-width:1400px) {
    .manual-head {padding: 0 120px;}

    .manual-body .swiper-inner {padding: 0 120px;}
    .manual-body .manual-button-prev,
    .manual-body .manual-button-next {width: 70px; height: 70px;}

    .manual-body .manual-swiper .swiper-slide img {max-height: fit-content;}
}

@media(max-width:950px) {
    .manual-head {padding: 0 80px;}

    .manual-body .swiper-inner {padding: 0 80px;}
    .manual-body .manual-button-prev,
    .manual-body .manual-button-next {width: 50px; height: 50px;}
    .manual-body .manual-button-prev i, 
    .manual-body .manual-button-next i {font-size: 18px;}

    .manual-wrap .btn-box button {width: 50px; height: 50px;}
    .manual-wrap .btn-box button i {width: 34px; height: 34px;}
}
@media(max-width:768px) {
    .manual-slide .manual-wrap {padding: 0 20px;}
}
@media(max-width:600px) {
    .manual-head {padding: 0;}
    .manual-wrap .btn-box button {width: 40px; height: 40px;}
    .manual-wrap .btn-box button i {width: 26px; height: 26px; font-size: 22px;}

    .manual-body .swiper-inner {padding: 0;}
    .manual-body .manual-button-prev,
    .manual-body .manual-button-next {width: 40px; height: 40px; border-radius: 20px; font-size: 10px; top: -40px;}
    .manual-body .manual-button-prev {left: 0; left: auto;}
    .manual-body .manual-button-next {left: 45px;}
    .manual-body .manual-button-prev i, 
    .manual-body .manual-button-next i {font-size: 14px;}
}