/******************************** inner ********************************/
.inner { max-width: 1560px; width: 100%; margin: 0 auto; padding: 0 30px; } 
@media only screen and (max-width: 767px){
 .inner { padding: 0 20px; } 
 }

/******************************** search filter ********************************/
.search-filter { border-bottom: 1px solid var(--gray-e9); } 
.search-filter > ul { display: flex; flex-wrap: wrap; padding: 25px; gap: 5px; background: #fff; } 
.search-filter > ul > li .btn-title { display: flex; align-items: center; line-height: 3.2rem; padding: 0 14px; font-weight: 500; font-size: 14px; border: 1px solid var(--gray-e5); border-radius: 50px; } 
.search-filter > ul > li .btn-title > span { display: block; margin-left: 3px; } 
.search-filter > ul > li.active .btn-title { font-weight: 600; color: var(--main-color); border-color: var(--main-color); } 
@media only screen and (max-width: 1023px){
 .search-filter > ul { padding: 15px; } 
 }
/******************************** 검색필터 팝업 ********************************/
.filter-ch-list { position: absolute; bottom: -80vh; left: 0; z-index: 1; width: 360px; height: 72vh; background: #fff; box-shadow: 0 0 30px rgba(0,0,0,0.2); border-top-left-radius: 20px; border-top-right-radius: 20px; transition: bottom 0.6s; } 
.filter-ch-list.active { bottom: 0; transition: bottom 0.6s; } 
.filter-ch-list .top { position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 20px 25px; border-bottom: 1px solid var(--gray-e5); } 
.filter-ch-list .top > strong { display: flex; font-family: var(--point-fc); font-size: 1.7rem; } 
.filter-ch-list .top > .close { display: block; width: 12px; height: 12px; font-size: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42.06 42.06'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23333; stroke-linecap: round; stroke-linejoin: round; stroke-width: 6px; %7D %3C/style%3E%3C/defs%3E%3Cg id='icon'%3E%3Cline class='cls-1' x1='3' y1='3' x2='39.06' y2='39.06'/%3E%3Cline class='cls-1' x1='39.06' y1='3' x2='3' y2='39.06'/%3E%3C/g%3E%3C/svg%3E"); } 
.filter-ch-list .bottom { height: 65vh; margin-top: 60px; padding: 25px 20px 25px; overflow: scroll; } 
.filter-ch-list .bottom .filter-box { margin-bottom: 40px; } 
.filter-ch-list .bottom .filter-box:last-child { margin-bottom: 0; } 
.filter-ch-list .bottom .filter-box > strong { display: block; margin-bottom: 8px; font-family: var(--point-fc); font-size: 1.5rem; } 
.filter-ch-list .bottom .filter-box > ul { display: flex; flex-wrap: wrap; gap: 5px; } 
.filter-ch-list .bottom .filter-box > ul > li { position: relative; height: 30px; } 
.filter-ch-list .bottom .filter-box > ul > li input { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; border: none; background: transparent; appearance: none; -webkit-appearance: none; } 
.filter-ch-list .bottom .filter-box > ul > li input + label { position: relative; top: 5px; display: block; height: 30px; line-height: 28px; padding: 0 12px; font-size: 14px; border: 1px solid var(--gray-e9); border-radius: 50px; cursor: pointer; } 
.filter-ch-list .bottom .filter-box > ul > li input:checked + label { font-weight: 600; color: var(--main-color); border-color: var(--main-color); } 
@media only screen and (max-width: 1023px){
 .filter-ch-list { width: 100%; height: 45vh; } 
.filter-ch-list .bottom { height: 38vh; } 
 }

/******************************** board filter1 ********************************/
.filter1 { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; } 
.filter1 .total { flex-shrink: 0; display: block; font-size: 1.5rem; color: var(--gray-55); } 
.filter1 .filter-search { display: flex; gap: 5px; } 
.filter1 .filter-search select { width: 120px; } 
.filter1 .filter-search input { width: 300px; } 
.filter1 .filter-search button { width: 80px; } 
@media only screen and (max-width: 767px){
 .filter1 { flex-wrap: wrap; } 
.filter1 .total { width: 100%; } 
.filter1 .filter-search { flex-wrap: wrap; width: 100%; margin-top: 20px; } 
.filter1 .filter-search select,
.filter1 .filter-search input,
.filter1 .filter-search button { width: 100%; } 
 }

/* 게시판 리스트*/
.board-top { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin: 10px 0 10px; } 
.board-top .lf { display: flex; align-items: center; gap: 15px; font-size: 1.5rem; color: #757575; } 
.board-top .lf em { position: relative; } 
.board-top .lf em:first-child::after { content: ""; position: absolute; right: -8px; top: 50%; transform: translateY(-50%); display: block; width: 1px; height: 10px; background-color: var(--gray-75); } 
.board-top .lf strong { color: var(--main-color); } 
.board-top .rg { display: flex; align-items: center; gap: 5px; } 

/******************************** board filter2 (상세검색) ********************************/
.filter2.detail { margin: 0 0 40px; } 
.filter2 { display: flex; flex-wrap: wrap; gap: 10px; padding: 40px; background: var(--gray-f9); border-bottom: 1px solid var(--gray-e5); border-top: 1px solid var(--gray-e5); justify-content: center; } 
.filter2.flex1 .box { flex: 1 1 100%; } 
.filter2 .box { flex: 1 1 49%; display: flex; align-items: center; } 
.filter2 .box label { flex-shrink: 0; width: 120px; font-weight: 600; font-size: 14px; } 
.filter2 .box select { background-color: #fff; } 
.filter2 .inp-flex { display: flex; align-items: center; gap: 5px; width: 100%; } 
@media only screen and (max-width: 1023px){
 .filter2 { padding: 25px 30px; } 
.filter2 .box label { width: 100px; } 
 }
@media only screen and (max-width: 767px){
 .filter2 { padding: 20px; } 
.filter2 .box { flex: 1 1 100%; padding-right: 0; } 
.filter2 .box label { width: 90px; } 
 }
.filter2 .filter-search { display: flex; align-items: center; width: 100%; } 
.filter2 .filter-search select { width: 120px; } 
.filter2 .filter-search button { width: 80px; } 
@media only screen and (max-width: 767px){
 .filter2 .filter-search { width: 100%; } 
.filter2 .filter-search select,
.filter2 .filter-search input,
.filter2 .filter-search button { width: 100%; } 
 }
 @media only screen and (max-width: 570px){
 .filter2 .inp-flex {flex-direction: column; align-items: baseline; gap: 10px;} 
/*  .filter2 .inp-flex {display: block;}  */
 }
/******************************** board-style1 ********************************/
.board-style1 .board-btn { margin: 10px 0 -20px; } 
/******************************** board-list-style1 ********************************/
.board-list-style1 { width: 100%; border-collapse: collapse; border-top: 2px solid var(--gray-66); } 
.board-list-style1 thead tr { border-bottom: 1px solid var(--gray-dd); } 
.board-list-style1 thead tr th { position: relative; padding: 20px 10px; font-weight: 600; } 
.board-list-style1 thead tr th::after { content: ""; position: absolute; top: 50%; right: 0; width: 1px; height: 16px; background: var(--gray-e9); transform: translateY(-50%); } 
.board-list-style1 thead tr th:last-child::after { display: none; } 
.board-list-style1 tbody tr { border-bottom: 1px solid var(--gray-dd); } 
.board-list-style1 tbody tr:hover { background: var(--gray-f9); } 
.board-list-style1 tbody tr td { padding: 18px 10px; font-size: 1.5rem; color: var(--gray-66); text-align: center; } 
.board-list-style1 tbody tr td.title { padding: 0; } 
.board-list-style1 tbody tr td.title { display: block; padding: 18px 10px; font-weight: 600; color: var(--gray-33); text-align: left; } 
.board-list-style1 tbody tr.secret td.title a { padding-left: 22px; background-position: left center; background-repeat: no-repeat; background-size: 13px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 56'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-miterlimit: 10; stroke-width: 8px; %7D .cls-2 %7B fill: %23444; stroke-width: 0px; %7D %3C/style%3E%3C/defs%3E%3Cg id='Icons'%3E%3Cg%3E%3Cpath class='cls-2' d='M23.13,8c8.2,0,14.87,6.67,14.87,14.87v5.13H8v-5.13c0-8.2,6.67-14.87,14.87-14.87h.26ZM23.13,0h-.26C10.24,0,0,10.24,0,22.87v13.13h46v-13.13C46,10.24,35.76,0,23.13,0h0Z'/%3E%3Cpath class='cls-2' d='M0,26h46v18.21c0,6.51-5.28,11.79-11.79,11.79H11.79c-6.51,0-11.79-5.28-11.79-11.79v-18.21h0Z'/%3E%3Cline class='cls-1' x1='23' y1='36' x2='23' y2='42'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } 
.board-list-style1 tbody tr td.file span { display: block; width: 30px; height: 14px; margin: 0 auto; background-repeat: no-repeat; background-position: center center; } 
/* .board-list-style1 tbody tr td.file span { display: block; width: 14px; height: 14px; margin: 0 auto; background-repeat: no-repeat; background-position: center center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72.47 75'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23666; stroke-linecap: round; stroke-linejoin: round; stroke-width: 6px; %7D %3C/style%3E%3C/defs%3E%3Cg id='icon'%3E%3Cpolyline class='cls-1' points='3 47.65 3 72 69.47 72 69.47 47.65'/%3E%3Cline class='cls-1' x1='36.24' y1='3' x2='36.24' y2='54'/%3E%3Cpolyline class='cls-1' points='57.24 36.08 36.24 54.08 15.24 36.08'/%3E%3C/g%3E%3C/svg%3E"); } */

@media only screen and (max-width: 1023px){
 .board-list-style1 colgroup { display: none; } 
.board-list-style1 thead { display: none; } 
.board-list-style1 tbody tr { display: flex; flex-wrap: wrap; gap: 0 20px; width: 100%; padding: 20px 5px; } 
.board-list-style1 tbody tr td { position: relative; padding: 0; font-size: 13px; } 
.board-list-style1 tbody tr td::after { content: ""; position: absolute; top: 3px; right: -11px; width: 1px; height: 9px; background: var(--gray-e5); } 
.board-list-style1 tbody tr td:last-child::after { display: none; } 
.board-list-style1 tbody tr td.title { display: block; width: 100%; margin-bottom: 12px; font-size: 1.7rem; } 
.board-list-style1 tbody tr td.title::after { display: none; } 
.board-list-style1 tbody tr td.title { padding: 0; } 
.board-list-style1 tbody tr td.num { display: none; } 
/* .board-list-style1 tbody tr td.file { display: none; } */ } 
/****** 첨부파일 보기 ******/
 .file-pop-wrap { position: relative; } 
 .file .file-pop-wrap > a { color: var(--main-color); } 
 .file .file-pop-wrap a:hover { text-decoration: underline; } 
 .file-pop-wrap .file-pop-toast-wrap { display: none; position: absolute; right: -10px; top: 35px; z-index: 10; min-width: 450px; padding: 30px; background: #fff; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.07); border-radius: 5px; } 
 .file-pop-wrap.show .file-pop-toast-wrap { display: block; } 
 .file-pop-wrap .file-pop-toast-wrap::before { content:""; position: absolute; bottom: 100%; right: 40px; margin-left: -5px; border-width: 8px; border-style: solid; border-color: transparent transparent #ffffff transparent; } 
 .file-pop-wrap .file-pop-toast-wrap .toast-con ul li { margin-bottom: 0; font-size: 14px; margin-top: 8px; } 
 .file-pop-wrap .file-pop-toast-wrap .toast-con ul li:first-child { margin-top: 0; } 
 .file-pop-wrap .file-pop-toast-wrap .toast-con ul li::before { font-size: 14px; } 
 .file-pop-wrap .file-pop-toast-wrap .toast-close { position: absolute; top: 10px; right: 10px; width: 15px; height: 15px; font-size: 0; background-repeat: no-repeat; background-position: center; background-size: 8px auto; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42.06 42.06' width='20px' height='20px'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23555; stroke-linecap: round; stroke-linejoin: round; stroke-width: 6px; %7D %3C/style%3E%3C/defs%3E%3Cg id='icon'%3E%3Cline class='cls-1' x1='3' y1='3' x2='39.06' y2='39.06'/%3E%3Cline class='cls-1' x1='39.06' y1='3' x2='3' y2='39.06'/%3E%3C/g%3E%3C/svg%3E"); } 
 @media only screen and (max-width: 1023px){
 .file-pop-wrap .file-pop-toast-wrap::before { left: 20px; right: unset; } 
.file-pop-wrap .file-pop-toast-wrap { left: -10px; min-width: 300px; } 
 }
 @media only screen and (max-width: 500px){
 .file-pop-wrap .file-pop-toast-wrap { left: unset; right: -70px; min-width: 290px; } 
.file-pop-wrap .file-pop-toast-wrap::before { left: 200px; } 
 }

/******************************** board-list-style2 ********************************/
.board-list-style2 { width: 100%; } 
.board-list-style2 > ul > li { margin-bottom: 10px; border: 1px solid var(--gray-e9); border-radius: 10px; } 
.board-list-style2 li:last-child { margin-bottom: 0; } 
.board-list-style2 li > a { position: relative; display: flex; align-items: center; gap: 20px; padding: 25px 50px 25px 30px; } 
.board-list-style2 li > a::after { content: ""; position: absolute; top: 38px; right: 30px; width: 18px; height: 10px; display: block; background-repeat: no-repeat; background-position: center center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 57.28 30.17' width='17'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23666; stroke-linecap: round; stroke-linejoin: round; stroke-width: 6px; %7D %3C/style%3E%3C/defs%3E%3Cg id='icon'%3E%3Cpolyline class='cls-1' points='54.28 3 28.64 27.17 3 3'/%3E%3C/g%3E%3C/svg%3E"); } 
.board-list-style2 li > a strong { display: block; font-family: var(--point-fc); font-weight: 500; font-size: 1.8rem;; } 
.board-list-style2 li .eng { display: block; flex-shrink: 0; width: 34px; height: 34px; line-height: 34px; font-family: var(--point-fc); font-weight: 500; font-size: 1.6rem; color: #fff; text-align: center; background: var(--gray-66); border-radius: 3px; } 
.board-list-style2 li .answer-box { display: none; } 
.board-list-style2 li .answer-box .answer { display: flex; gap: 20px; padding: 25px 30px 20px 30px; } 
.board-list-style2 li .answer-box .answer .rg p { line-height: 2.4rem; font-family: var(--point-fc); word-break: keep-all; } 
.board-list-style2 li .answer-box .answer .rg .inqy-note { display: flex; align-items: center; justify-content: space-between; gap: 15px; width: 100%; margin-top: 12px; padding: 15px; background: var(--gray-f9); border-radius: 5px; } 
.board-list-style2 li .answer-box .answer .rg .inqy-note em { font-size: 14px; color: var(--gray-77); } 
.board-list-style2 li .answer-box .answer .rg .inqy-note a { flex-shrink: 0; font-weight: 500; font-size: 14px; text-decoration: underline; } 
.board-list-style2 li.active { border-color: var(--main-color); } 
.board-list-style2 li.active > a::after { transform: rotate(180deg); } 
.board-list-style2 li.active .eng { background: var(--main-color); transition: background 0.6s; } 
.board-list-style2 li.active .answer .eng { background: #6bb232; transition: background 0.6s; } 
@media only screen and (max-width: 767px){
 .board-list-style2 li > a { padding: 20px 50px 20px 25px; } 
.board-list-style2 li > a::after { top: 32px; right: 25px; } 
.board-list-style2 li .answer-box .answer { padding: 15px 25px 20px 25px; } 
 }
/******************************** board-list-style3 ********************************/
.board-list-style3 { display: flex; flex-wrap: wrap; gap: 40px 30px; } 
.board-list-style3 > li { width: 23%; } 
.board-list-style3 > li .img { width: 100%; height: 13.021vw; border-radius: 5px; background: #ddd; overflow: hidden; } 
.board-list-style3 > li .ti { display: block; line-height: 2.6rem; margin-top: 16px; font-family: var(--point-fc); font-size: 1.7rem; } 
.board-list-style3 > li .date { display: block; margin-top: 15px; font-size: 14px; color: var(--gray-77); } 
@media only screen and (max-width: 1199px){
 .board-list-style3 { gap: 20px; } 
 }
@media only screen and (max-width: 1023px){
 .board-list-style3 > li { width: 48%; } 
.board-list-style3 > li .img { height: 21.505vw; } 
 }
@media only screen and (max-width: 560px){
 .board-list-style3 > li { width: 100%; } 
.board-list-style3 > li .img { height: 57.143vw; } 
 }
/******************************** board-list-style4 ********************************/
.board-list-style4 { border-top: 2px solid var(--gray-66); } 
.board-list-style4 > li { border-bottom: 1px solid var(--gray-e5); } 
.board-list-style4 > li { display: block; padding: 25px 20px 25px 20px; } 
.board-list-style4 > li .flex { gap: 7px; } 
.board-list-style4 > li .top { display: flex; align-items: center; justify-content: space-between; gap: 40px; } 
.top .baro-wrap { display: flex; gap: 20px; } 
.top .baro-wrap > a { display: inline-block; padding: 10px 20px; background-color: var(--main-light-color); border-radius: 20px; color: var(--main-color); font-weight: 500; font-size: 1.5rem; white-space: nowrap; text-align: center; } 
.top .baro-wrap > a.none {background-color: var(--gray-e5);color: var(--gray-66); }
.board-list-style4 > li .ti { display: block; margin: 12px 0 13px; font-family: var(--point-fc); font-size: 2.2rem; } 
/* .board-list-style4 > li .arro { display: block; position: absolute; top: 50%; right: 20px; width: 40px; height: 40px; border-radius: 100%; transform: translateY(-50%); background-position: center center; background-repeat: no-repeat; background-size: 6px; background-color: var(--gray-f5); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4.74 9'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23666; stroke-linecap: round; stroke-linejoin: round; stroke-width: .94px; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cg id='icon'%3E%3Cpolyline class='cls-1' points='.47 .47 4.27 4.5 .47 8.53'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } */
.board-list-style4 > li ul { display: flex; flex-wrap: wrap; gap: 10px 15px; } 
.board-list-style4 > li ul li { position: relative; display: flex; align-items: center; gap: 5px; font-size: 1.5rem; } 
.board-list-style4 > li ul li::after { content: ""; position: absolute; top: 4px; right: -8px; width: 1px; height: 10px; background: var(--gray-e5); } 
.board-list-style4 > li ul li:last-child::after { display: none; } 
.area { color: #777; font-weight: 700; background-repeat: no-repeat; background-size: 11px; padding-left: 15px; background-position: left 2px; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 62'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23777; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2px; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cline class='cls-1' x1='14.04' y1='39' x2='34.04' y2='39'/%3E%3Cline class='cls-1' x1='14.04' y1='31' x2='34.04' y2='31'/%3E%3Cline class='cls-1' x1='14.04' y1='23' x2='34.04' y2='23'/%3E%3Cpolyline class='cls-1' points='34.71 6 42.04 6 42.04 55 6.04 55 6.04 6 13.37 6'/%3E%3C/g%3E%3Crect class='cls-1' x='1' y='1' width='46' height='60' rx='1' ry='1'/%3E%3Cpath class='cls-1' d='M34.5,1v6c0,2.21-1.79,4-4,4h-13c-2.21,0-4-1.79-4-4V1'/%3E%3C/svg%3E"); } 
.board-list-style4 > li ul li strong { font-weight: 600; } 
.board-list-style4 .bottom { display: flex; flex-wrap: wrap; margin-top: 20px; } 
.board-list-style4 .bottom .bottom-tit { position: relative; display: inline-block; width: 70px; margin-right: 20px; font-weight: 500; color: var(--gray-77); flex-shrink: 0; } 
.board-list-style4 .bottom .bottom-tit::after { content: ""; position: absolute; top: 2px; right: -30px; width: 1px; height: 9px; margin-right: 20px; background-color: #ddd; } 
.board-list-style4 .bottom .bottom-list { display: flex; font-size: 1.5rem; color: #555; word-break: keep-all; margin-top: 5px; flex: 1 1 50%; } 
@media only screen and (max-width: 767px){
 .board-list-style4 > li .top { flex-direction: column; gap: 0; justify-content: unset; align-items: unset; } 
.board-list-style4 > li .top .baro-wrap { gap: 10px; } 
 }
@media only screen and (max-width: 530px){
 .board-list-style4 .bottom { display: block; } 
 }

/******************************** pagination ********************************/
.pagination { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 30px; } 
.pagination a { display: block; margin: 0 5px; font-weight: 600; font-size: 15px; color: var(--gray-66); } 
.pagination a.active { color: var(--main-color); text-decoration: underline; } 
.pagination a.arr { display: block; margin: 0; font-size: 0; border: 1px solid var(--gray-e5); border-radius: 50px; background-repeat: no-repeat; background-position: center center; } 
.pagination a.prev-page { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4.74 9' width='4px'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23666; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1px; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cg id='icon'%3E%3Cpolyline class='cls-1' points='4.27 8.53 .47 4.5 4.27 .47'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } 
.pagination a.next-page { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4.74 9' width='4px'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23666; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1px; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cg id='icon'%3E%3Cpolyline class='cls-1' points='.47 .47 4.27 4.5 .47 8.53'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } 
.pagination a.last-page { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7.62 9' width='8px'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23666; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1px; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cg id='icon'%3E%3Cpolyline class='cls-1' points='.47 .47 4.27 4.5 .47 8.53'/%3E%3C/g%3E%3Cline class='cls-1' x1='7.15' y1='.51' x2='7.15' y2='8.51'/%3E%3C/g%3E%3C/svg%3E"); } 
.pagination a.first-page { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7.62 9' width='8px'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23666; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1px; %7D %3C/style%3E%3C/defs%3E%3Cg %3E%3Cg id='icon'%3E%3Cpolyline class='cls-1' points='7.15 8.53 3.35 4.5 7.15 .47'/%3E%3C/g%3E%3Cline class='cls-1' x1='.47' y1='8.49' x2='.47' y2='.49'/%3E%3C/g%3E%3C/svg%3E"); } 
.pagination a.prev-page, .pagination a.next-page { width: 28px; height: 28px; } 
.pagination a.first-page, .pagination a.last-page { width: 40px; height: 28px; } 
@media only screen and (max-width: 430px){
 .pagination { gap: 5px; } 
 .pagination a { font-size: 1.5rem; } 
 .pagination a.prev-page, .pagination a.next-page { width: 25px; height: 25px; } 
.pagination a.first-page, .pagination a.last-page { width: 30px; height: 25px; } 
 }
/******************************** board detail ********************************/
.board-detail-top { padding: 30px 20px; border-top: 2px solid var(--gray-66); border-bottom: 1px dashed var(--gray-e5); } 
.board-detail-top > strong { display: block; margin-bottom: 25px; font-family: var(--point-fc); font-size: 2.4rem; } 
.board-detail-top .bottom { display: flex; justify-content: space-between; } 
.board-detail-top .bottom .info { display: flex; flex-wrap: wrap; gap: 10px 20px; } 
.board-detail-top .bottom .info li { display: flex; font-size: 1.58rem; } 
.board-detail-top .bottom .info li strong { flex-shrink: 0; position: relative; display: block; padding-right: 15px; font-weight: 600; } 
.board-detail-top .bottom .info li strong:after { content: ""; position: absolute; top: 4px; right: 7px; width: 1px; height: 9px; background: var(--gray-dd); } 
.board-detail-top .bottom .writer { display: block; padding-left: 16px; font-weight: 500; font-size: 1.5rem; color: var(--gray-77); background-position: 0 2px; background-repeat: no-repeat; background-size: 9px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28.52 40.96' %3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23555; %7D .cls-1, .cls-2 %7B fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px; %7D .cls-2 %7B stroke: %23555; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cpath class='cls-2' d='M27.02,36.65v-5.17c0-5.36-3.31-9.94-8-11.83'/%3E%3Cg%3E%3Cpath class='cls-1' d='M14.26,1.5c-5.35,0-9.7,4.34-9.7,9.7,0,3.62,1.99,6.78,4.94,8.44,1.41.8,3.03,1.25,4.76,1.25s3.35-.46,4.76-1.25c2.95-1.66,4.94-4.82,4.94-8.44,0-5.36-4.34-9.7-9.7-9.7Z'/%3E%3Cpath class='cls-1' d='M9.5,19.64c-4.69,1.89-8,6.47-8,11.83v5.17c0,1.55,1.25,2.81,2.8,2.81h19.91c1.55,0,2.81-1.26,2.81-2.81'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } 
.board-detail-top .bottom .view-date { flex-shrink: 0; display: flex; align-items: center; gap: 20px; } 
.board-detail-top .bottom .view-date li { position: relative; font-weight: 500; font-size: 1.5rem; color: var(--gray-77); } 
.board-detail-top .bottom .view-date li::after { content: ""; position: absolute; top: 5px; right: -11px; width: 1px; height: 9px; background: var(--gray-dd); } 
.board-detail-top .bottom .view-date li:last-child::after { display: none; } 
.board-detail-top .bottom .view-date .view { padding-left: 22px; background-repeat: no-repeat; background-position: left center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 41.85 27.89' width='16'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23555; %7D .cls-1, .cls-2 %7B fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.7px; %7D .cls-2 %7B stroke: %23555; %7D %3C/style%3E%3C/defs%3E%3Cg id='Layer_5' data-name='Layer 5'%3E%3Cpath class='cls-2' d='M20.93,26.39c9.08,0,16.77-5.22,19.43-12.45C37.69,6.73,30.01,1.5,20.93,1.5S4.16,6.73,1.5,13.95c2.66,7.22,10.35,12.45,19.43,12.45Z'/%3E%3Cpath class='cls-1' d='M26.32,13.95c0,2.98-2.41,5.39-5.39,5.39s-5.39-2.41-5.39-5.39,2.41-5.39,5.39-5.39,5.39,2.42,5.39,5.39Z'/%3E%3C/g%3E%3C/svg%3E"); } 
.board-detail-file-list { padding: 20px; background: var(--gray-f9); border-bottom: 1px solid var(--gray-dd); } 
.board-detail-file-list li { position: relative; margin-bottom: 8px; padding-left: 10px; font-size: 14px; letter-spacing: 0; } 
.board-detail-file-list li::after { content: ""; position: absolute; top: 6px; left: 0; width: 3px; height: 3px; background: var(--gray-66); border-radius: 100%; } 
.board-detail-file-list li:last-child { margin-bottom: 0; } 
.board-detail-file-list li a { display: block; padding-left: 16px; background-repeat: no-repeat; background-position: left center; background-size: 11px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 37.3 40.61'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23444; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cpath class='cls-1' d='M35.8,21.66l-13.97,13.97c-4.65,4.65-12.19,4.65-16.84,0h0c-4.65-4.65-4.66-12.19,0-16.85l.02-.03L19.97,3.78c3.04-3.04,7.98-3.04,11.03,0h0c3.04,3.05,3.04,7.99,0,11.03l-14.96,14.96-.04.03c-1.6,1.6-4.2,1.6-5.81,0h0c-1.61-1.6-1.61-4.21,0-5.81l12.83-12.83'/%3E%3C/g%3E%3C/svg%3E"); } 
.board-detail-content { min-height: 300px; padding: 30px 20px; border-bottom: 1px solid var(--gray-e5); } 
@media only screen and (max-width: 420px){
 .board-detail-top .bottom { flex-wrap: wrap; gap: 5px; } 
.board-detail-top .bottom .view-date { width: 100%; justify-content: flex-end; } 
 }
.no-list { display: flex !important; justify-content: center; } 
.no-list span { text-align: center; color: #777; } 
/******************************** board comment ********************************/
.board-comment-wrap { padding: 25px 20px; border-bottom: 1px solid var(--gray-e5); background: var(--main-light-color); } 
.board-comment-wrap p { line-height: 2.3rem; padding-left: 20px; font-weight: 500; font-size: 1.5rem; color: var(--gray-66); background-repeat: no-repeat; background-position: 0 5px; background-size: 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 23.37 18.53'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23666; fill: %23666; stroke-miterlimit: 10; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='22.52 11.31 14.09 5.08 14.09 17.54 22.52 11.31'/%3E%3Cpolygon class='cls-1' points='3 .5 .5 .5 .59 12.56 15.42 12.56 15.42 10.06 3.09 10.06 3 .5'/%3E%3C/svg%3E"); } 
.board-comment-wrap.no-comment p { padding: 0; text-align: center; background-image: none; } 
/******************************** form ********************************/
/* 필수 */
.esent-text { margin-bottom: 10px; font-size: 1.5rem; color: #757575; text-align: right; } 
.esent { display: inline-block; color: #fb0000; } 
/* .form-wrap { border-top: 2px solid #333; } */
.form-wrap .title { display: flex; justify-content: space-between; padding-bottom: 12px; border-bottom: 2px solid var(--gray-44); } 
.form-wrap .title strong { position: relative; font-family: var(--point-fc); font-size: 2.0rem; z-index: 10; } 
.form-wrap .title .esn { font-weight: 500; font-size: 14px; } 
.form-wrap .title .esn b { font-size: 1.3rem; color: #ed4b2c; } 
.form-wrap .form-group { display: flex; gap: 20px; padding: 25px 10px 20px 10px; border-bottom: 1px solid var(--gray-e5); } 
.form-wrap .form-group .label-wrap { flex-shrink: 0; width: 150px; padding-top: 10px; } 
.form-wrap .form-group .label-wrap .label { position: relative; display: inline-block; line-height: 1.2; padding-left: 12px; font-weight: 500; font-size: 1.5rem; word-break: keep-all; } 
.form-wrap .form-group .label-wrap .label .esent { position: absolute; top: 3px; left: 0; } 
.form-wrap .form-group .inp-wrap { width: calc(100% - 170px); } 
.form-wrap .form-group .inp-wrap .inp-flex { display: flex; align-items: center; gap: 5px; min-height: 40px; } 
.form-wrap .form-group .inp-wrap .inp-flex .inp-email { display: flex; align-items: center; gap: 5px; } 
@media only screen and (max-width: 767px) {
	.email-wrap {flex-wrap: wrap;}
}
@media only screen and (max-width: 379px) {
	.flex-col {flex-direction: column;}
	.flex-col > button {width: 100%;}
}
.form-wrap1 { padding-bottom: 25px; border-bottom: 1px solid var(--gray-e5); } 
.form-wrap1:last-child { margin-bottom: 0; } 
.form-wrap1 .title { display: flex; justify-content: space-between; padding-bottom: 12px; border-bottom: 2px solid var(--gray-44); align-items: baseline;} 
.form-wrap1 .title.nobd {border-bottom:0;}
/* .form-wrap1 .title strong { display: block; font-family: var(--point-fc); font-size: 2.0rem; } */
.form-wrap1 .title strong { font-family: var(--point-fc); font-size: 2.0rem; } 
.con-box .title strong { font-family: var(--point-fc); font-size: 2.0rem; } 
.form-wrap1 .title .esn { font-weight: 500; font-size: 14px; } 
.form-wrap1 .title .esn b { font-size: 1.3rem; color: #c80726; } 
.form-wrap1 .form-col { display: flex; align-items: center; } 
.form-wrap1 .form-col .col-5 { width: 50%; align-items: center; } 
.form-wrap1 .form-col .col-5:first-child { padding-right: 30px; } 
.form-wrap1 .form-group { display: flex; align-items: flex-start; padding: 25px 10px 0 10px; gap: 10px;} 
/* .form-wrap1 .form-group .label { display: flex; align-items: center; gap: 5px; flex-shrink: 0; width: 140px; line-height: 40px; font-weight: 600; font-size: 1.5rem; z-index: -1; } */
.form-wrap1 .form-group .label { display: flex; align-items: center; gap: 5px; flex-shrink: 0; width: 160px; line-height: 1.3; font-weight: 600; font-size: 1.6rem; z-index: -1; white-space: nowrap; } 
.form-wrap1 .form-group .label .esn, .esn { font-weight: 700; font-size: 1.5rem; color: #c80726; } 
.form-wrap1 .form-group .inp-box { width: 100%; } 
.form-wrap1 .form-group .inp-box .input, .input { width: 100%; height: 40px; padding: 0 12px; font-family: var(--basic-fc); border: 1px solid #f2f2f2; color: #333;} 
.form-wrap1 .form-group .inp-box textarea.input { height: 300px; padding: 12px; font-family: var(--basic-fc); resize: none; } 

@media only screen and (max-width: 767px){
 .form-table { table-layout: unset; } 
.form-table col { width: unset !important; } 
.form-table > tbody > tr { display: flex; flex-wrap: wrap; border-bottom: 0; } 
.form-table > tbody > tr > th { width: 150px; } 
.form-table > tbody > tr > td { width: calc(100% - 150px); border-right: 0; } 
 .form-wrap .form-group { gap: 10px; padding: 10px 0; } 
.form-wrap .form-group .label-wrap { width: 100px; padding-top: 5px; } 
.form-wrap .form-group .label-wrap .label { padding-left: 10px; } 
.form-wrap .form-group .inp-wrap { width: calc(100% - 110px); } 

.form-table > tbody > tr > th { width: 100px; } 
.form-table > tbody > tr > td { width: calc(100% - 100px); } 
 }

.tool { position: relative; z-index: 10; } 
.guide-wrap { position: relative; } 
.guide-wrap .guide-icn { display: block; width: 20px; height: 20px; line-height: 20px; font-size: 10px; text-align: center; color: #333; background: var(--gray-fa); border: 1px solid var(--gray-e5); border-radius: 100%; box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.1); cursor: pointer; } 
.guide-wrap .guide-icn:hover { background: #fff0fe; border: 1px solid var(--pink4); box-shadow: 0 0 14px 0 rgba(255, 188, 227, 0.1); } 
.guide-wrap .guide-toast-wrap { display: none; position: absolute; left: -40px; top: 31px; min-width: 270px; padding: 20px; background: #fff; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.07); border-radius: 5px; } 
.guide-wrap .guide-toast-wrap.long { min-width: 710px; } 
.guide-wrap .guide-toast-wrap.long .overflow-y-scroll { max-height: 400px; overflow-y: scroll; } 
.guide-wrap.show .guide-toast-wrap { display: block; z-index: 1;} 
.guide-wrap .guide-toast-wrap::before { content:""; position: absolute; bottom: 100%; left: 46px; margin-left: -5px; border-width: 8px; border-style: solid; border-color: transparent transparent #ffffff transparent; } 
.guide-wrap .guide-toast-wrap .toast-header { width: calc(100% - 15px); margin-bottom: 10px; word-break: keep-all; } 
.guide-wrap .guide-toast-wrap .toast-header strong { font-size: 1.6rem; color: #444; } 
.guide-wrap .guide-toast-wrap .toast-con { } 
.guide-wrap .guide-toast-wrap .toast-con ul li { margin: 3px 0; padding-left: 14px; font-size: 1.5rem; word-break: keep-all; } 
.guide-wrap .guide-toast-wrap .toast-con ul li::before { font-size: 14px; } 
.guide-wrap .guide-toast-wrap .toast-close { position: absolute; top: 10px; right: 10px; width: 15px; height: 15px; font-size: 0; background-repeat: no-repeat; background-position: center; background-size: 8px auto; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42.06 42.06' width='20px' height='20px'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23555; stroke-linecap: round; stroke-linejoin: round; stroke-width: 6px; %7D %3C/style%3E%3C/defs%3E%3Cg id='icon'%3E%3Cline class='cls-1' x1='3' y1='3' x2='39.06' y2='39.06'/%3E%3Cline class='cls-1' x1='39.06' y1='3' x2='3' y2='39.06'/%3E%3C/g%3E%3C/svg%3E"); } 
@media only screen and (max-width: 830px){
 .guide-wrap .guide-toast-wrap.long { min-width: 370px; } 
 }
@media only screen and (max-width: 470px){
 .guide-wrap .guide-toast-wrap.long { min-width: 225px; } 
 }
@media only screen and (max-width: 370px){
 .guide-wrap .guide-toast-wrap { min-width: 210px; } 
 }

/******* 첨부파일 *******/
.file-box { display: flex; gap: 5px } 
.file-box input[type="file"] { position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0; } 
.file-box label { flex-shrink: 0; display: inline-block; height: 40px; line-height: 40px; padding: 0 18px; font-weight: 500; font-size: 14px; color: #fff; background: var(--gray-66); vertical-align: middle; cursor: pointer; } 
.file-box .upload-name { width: 100%; font-family: var(--basic-fc) !important; } 
/******* 버튼 *******/
.form-btn1 { margin-top: -40px; } 
@media only screen and (max-width: 1023px){
 .form-wrap1 { margin-bottom: 40px; } 
.form-wrap1 .form-col { flex-wrap: wrap; } 
.form-wrap1 .form-col .col-5 { width: 100%; } 
.form-wrap1 .form-col .col-5:first-child { padding-right: 10px; } 
/******* 버튼 *******/
.form-btn1 { margin-top: 0; } 
 }
@media only screen and (max-width: 767px){
 .form-wrap .form-group { gap: 10px; padding: 10px 0; } 
.form-wrap .form-group .label-wrap { width: 100px; padding-top: 5px; } 
.form-wrap .form-group .label-wrap .label { padding-left: 10px; } 
.form-wrap .form-group .inp-wrap { width: calc(100% - 110px); } 
.form-wrap1 .form-group .label { margin-bottom: 20px; } 
 }
 @media only screen and (max-width: 560px){
 .form-wrap .form-group .inp-wrap .inp-flex { flex-wrap: wrap; } 
.form-wrap .form-group .inp-wrap .inp-flex .input-st2 { width: 100%; } 
.form-wrap .form-group .inp-wrap .inp-flex .btn-bace5 { width: 100%; } 
 }
 @media only screen and (max-width: 480px){
 .form-wrap .form-group .inp-wrap .inp-flex .inp-email { flex-wrap: wrap; justify-content: center; } 
.form-wrap .form-group .label-wrap { width: 80px; } 
.form-wrap .form-group .inp-wrap { width: calc(100% - 90px); } 
.form-wrap .form-group .inp-wrap .inp-flex { min-height: 40px; } 
.form-wrap1 .form-group .label { width: 150px; } 
 }
@media only screen and (max-width: 490px) { /* .form-wrap1 .form-group { display: block; padding: 10px 10px 0 10px; } */
 .form-wrap1 .form-group { display: block; } 
 .form-wrap1 .form-group .label br { display: none; } 
 }

/************************* 공동인증서 로그인 *************************/
.login-wrap { margin-top: 20px; } 
.login-box { max-width: 800px; width: 100%; margin: 0 auto; padding: 70px 90px; border: 1px solid var(--gray-e5); } 
.login-box .text { text-align: center; } 
.login-box .text .logo { position: relative; z-index: 0; margin-bottom: 30px; } 
.login-box .text > p { line-height: 2.4rem; font-weight: 300; font-size: 1.5rem; color: #777; word-break: keep-all; } 
.login-box .tit { font-size: 1.7rem; font-weight: 600; } 
.login-box .login-inp { display: flex; gap: 10px; align-items: center; margin: 30px 0 30px; } 
.login-box .login-inp input { display: block; width: 100%; height: 46px; margin-bottom: 14px; border: 0; border-bottom: 1px solid #a6a6a6; } 
.login-box .login-inp input::placeholder { font-weight: 300; font-size: 1.6rem; } 
.login-box .login-save-find { display: flex; justify-content: space-between; align-items: center; } 
.login-box .login-save-find .login-find { display: block; padding-left: 23px; font-weight: 300; font-size: 1.6rem; color: #555; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35.85 35.85' width='15px' height='15px'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23555555; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3px; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cg%3E%3Cg%3E%3Cpath class='cls-1' d='m24.58,24.58c5.28-5.28,5.28-13.84,0-19.12s-13.84-5.28-19.12,0c-5.28,5.28-5.28,13.84,0,19.12,5.28,5.28,13.84,5.28,19.12,0Z'/%3E%3Cpath class='cls-1' d='m24.58,24.58c5.28-5.28,5.28-13.84,0-19.12s-13.84-5.28-19.12,0c-5.28,5.28-5.28,13.84,0,19.12,5.28,5.28,13.84,5.28,19.12,0Z'/%3E%3C/g%3E%3Cline class='cls-1' x1='25.38' y1='25.38' x2='34.35' y2='34.35'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: left center; } 
.login-box .or { position: relative; margin: 20px 0; font-size: 14px; color: #777; text-align: center; } 
.login-box .or:before { content: ""; position: absolute; top: 11px; left: 0; width: 41%; height: 1px; background: var(--gray-e5); } 
.login-box .or:after { content: ""; position: absolute; top: 11px; right: 0; width: 41%; height: 1px; background: var(--gray-e5); } 
.login-box .text2 { display: flex; gap: 30px; align-items: center; justify-content: center; } 
.login-box .text2 .img img { width: 50px; height: 50px; } 
.login-box .text2 strong { display: block; margin-bottom: 10px; } 
.login-box .text2 > p { line-height: 2.4rem; font-weight: 300; font-size: 1.5rem; color: #777; word-break: keep-all; } 
@media only screen and (max-width: 800px){
 .login-box { border: 0; } 
 }
@media only screen and (max-width: 767px){
 .login-wrap { margin-top: 0; } 
 .login-box { padding: 0 40px; } 
 .login-box .login-inp { margin: 20px 0; } 
 }
@media only screen and (max-width: 500px){
 .login-box .or:before { width: 35%; } 
.login-box .or:after { width: 35%; } 
 }
@media only screen and (max-width: 420px){
 .login-box { padding: 0 10px; } 
 }

/************************* 회원정보 수정 *************************/
.join-wrap { max-width: 1118px; width: 100%; margin: 0 auto; } 
/************************* 알림설정 *************************/
.info-box { display: flex; align-items: center; justify-content: flex-start; gap: 20px; width: 100%; margin-bottom: 60px; padding: 20px; border: 1px solid var(--gray-e9); border-top: 3px solid var(--main-color); } 

.switch-box { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; } 
.switch-box .switch { position: relative; width: 60px; height: 32px; background: #ccc; border-radius: 999px; transition: all 300ms ease; cursor: pointer; margin-top: 11px; } 
.switch-box .switch .handle { position: absolute; width: 24px; height: 24px; top: 50%; left: 4px; transform: translateY(-50%); background: #fff; border-radius: 50%; transition: all 300ms ease; } 
.switch-box .switch.on { background-color: var(--main-color); } 
.switch-box .switch.on .handle { left: 32px; } 
.switch-box-cont { display: none; border-top: 2px solid var(--gray-44);} 

.selected-list { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; } 
.selected-list li { display: flex; align-items: center; gap: 8px; height: 33px; line-height: 33px; padding: 0 8px; border: 1px solid #9c00004a; border-radius: 3px; } 
.selected-list li span { font-size: 14px; color: var(--main-color) } 
.selected-list li .delete { font-size: 0; width: 14px; height: 14px; background-repeat: no-repeat; background-size: 8px 8px; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42.06 42.06' width='20px' height='20px'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23c80726; stroke-linecap: round; stroke-linejoin: round; stroke-width: 6px; %7D %3C/style%3E%3C/defs%3E%3Cg id='icon'%3E%3Cline class='cls-1' x1='3' y1='3' x2='39.06' y2='39.06'/%3E%3Cline class='cls-1' x1='39.06' y1='3' x2='3' y2='39.06'/%3E%3C/g%3E%3C/svg%3E"); } 


/******************************** 청약공고조회-상세 ********************************/
.board-detail-wrap1 .title-info { padding: 25px 0; border-top: 2px solid var(--gray-66); border-bottom: 1px solid var(--gray-e5); } 
.board-detail-wrap1 .title-info .flex { gap: 5px; } 
.board-detail-wrap1 .title-info strong { display: block; margin: 12px 0 10px; font-family: var(--point-fc); font-size: 2.2rem; } 
.board-detail-wrap1 .title-info .address { font-size: 1.5rem; color: var(--gray-66); } 
.board-detail-wrap1 .board-info { margin-top: 50px; } 
.board-detail-wrap1 .board-gallery { margin-top: 50px; } 
.board-detail-wrap1 .board-gallery .gallery-list { display: flex; gap: 15px; margin-top: 20px; } 
.board-detail-wrap1 .board-gallery .gallery-list li { flex: 1; height: 363px; overflow: hidden; } 
.board-detail-wrap1 .board-gallery .gallery-list li.last { position: relative; } 
.board-detail-wrap1 .board-gallery .gallery-list li.last::after { content: "MORE"; position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-weight: 500; font-family: var(--eng-fc); font-size: 1.7rem; color: #fff;; background: rgba(0,0,0,0.6); } 
.board-detail-wrap1 .board-gallery .gallery-list li a { display: block; height: 100%; } 
.board-detail-wrap1 .board-gallery .gallery-list li a img { height: 100%; } 
.board-detail-wrap1 .btn-ce { margin-top: 40px; padding-top: 20px; } 
@media only screen and (max-width: 1560px){
 .board-detail-wrap1 .board-gallery .gallery-list li { height: 23.269vw; } 
 }
@media only screen and (max-width: 600px){
 .board-detail-wrap1 .board-gallery .gallery-list { flex-wrap: wrap; } 
.board-detail-wrap1 .board-gallery .gallery-list li { flex: 1 1 47%; height: 41vw; } 
 }

/************************* 인터넷 청약절차 *************************/
.num-icn-list { display: flex; flex-wrap: wrap; margin: 0 -20px; } 
.num-icn-list > li { display: flex; flex-direction: column; justify-content: space-between; gap: 20px; width: 33.3%; padding: 20px; } 
.num-icn-list > li span { display: block; margin-bottom: 20px; font-weight: 500; color: var(--main-color) } 
.num-icn-list > li .bottom { padding-bottom: 50px; border-bottom: 2px solid #e5e5e5; } 
.num-icn-list > li .bottom strong { position: relative; display: block; line-height: 1.5; font-size: 2.2rem; word-break: keep-all; padding-bottom: 10px; } 
.num-icn-list > li .bottom p { color: #555; } 
.num-icn-list > li .icn { display: block; width: 30px; height: 30px; font-size: 0; background-position: center; background-repeat: no-repeat; background-size: auto 30px; } 
.num-icn-list > li .icn1 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 62.38 62.02'%3E%3Cdefs%3E%3Cstyle%3E .cls-1, .cls-2, .cls-3 %7B fill: none; stroke-linejoin: round; stroke-width: 4px; %7D .cls-1, .cls-3 %7B stroke: %23434756; %7D .cls-2 %7B stroke: %23c80726; %7D .cls-3 %7B stroke-linecap: round; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-2' d='M31.19,2h0c3.49,0,6.32,2.83,6.32,6.32v5.27h-12.64v-5.27c0-3.49,2.83-6.32,6.32-6.32Z'/%3E%3Crect class='cls-3' x='20.32' y='13.59' width='21.74' height='20.93'/%3E%3Cline class='cls-1' x1='31.19' y1='21.56' x2='31.19' y2='26.54'/%3E%3Cline class='cls-1' x1='12.82' y1='50.96' x2='17.41' y2='50.96'/%3E%3Cline class='cls-1' x1='23.54' y1='50.96' x2='28.13' y2='50.96'/%3E%3Cline class='cls-1' x1='34.25' y1='50.96' x2='38.84' y2='50.96'/%3E%3Cline class='cls-1' x1='44.97' y1='50.96' x2='49.56' y2='50.96'/%3E%3Crect class='cls-1' x='2' y='41.89' width='58.38' height='18.13' rx='9.07' ry='9.07'/%3E%3C/svg%3E"); } 
.num-icn-list > li .icn2 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 49.12 53.91'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23c80726; %7D .cls-1, .cls-2 %7B fill: none; stroke-linejoin: round; stroke-width: 4px; %7D .cls-2 %7B stroke: %23434756; stroke-linecap: round; %7D %3C/style%3E%3C/defs%3E%3Crect class='cls-1' x='19.34' y='36.69' width='10.44' height='15.22'/%3E%3Cpolygon class='cls-2' points='47.12 51.91 2 51.91 2 25.35 24.56 2 47.12 25.35 47.12 51.91'/%3E%3C/svg%3E"); } 
.num-icn-list > li .icn3 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54.25 57.14'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23434756; %7D .cls-1, .cls-2 %7B fill: none; stroke-linejoin: round; stroke-width: 4px; %7D .cls-2 %7B stroke: %23c80726; %7D %3C/style%3E%3C/defs%3E%3Cpolyline class='cls-1' points='2 55.14 27.12 37.05 52.25 55.14'/%3E%3Cpolygon class='cls-1' points='27.12 2 2 20.09 2 55.14 52.25 55.14 52.25 20.09 27.12 2'/%3E%3Cpolyline class='cls-1' points='2 20.09 27.12 37.05 52.25 20.09'/%3E%3Cline class='cls-2' x1='27.12' y1='12.23' x2='27.12' y2='20.88'/%3E%3Cline class='cls-2' x1='27.12' y1='23.85' x2='27.12' y2='27.19'/%3E%3C/svg%3E"); } 
.num-icn-list > li .icn4 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 51.18 59.4'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23c80726; %7D .cls-1, .cls-2, .cls-3 %7B fill: none; stroke-linejoin: round; stroke-width: 3.4px; %7D .cls-1, .cls-3 %7B stroke-linecap: round; %7D .cls-2, .cls-3 %7B stroke: %23434756; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cline class='cls-3' x1='10.2' y1='57.7' x2='36.49' y2='57.7'/%3E%3Cpath class='cls-2' d='M22.8,12.84H7.88c-3.42,0-6.18,2.77-6.18,6.18v24.12c0,3.41,2.77,6.18,6.18,6.18h30.92c3.42,0,6.18-2.77,6.18-6.18v-18.76'/%3E%3Cg%3E%3Cpath class='cls-1' d='M49.48,14.55c0,7.09-5.75,12.85-12.85,12.85s-12.85-5.75-12.85-12.85S29.53,1.7,36.63,1.7s12.85,5.75,12.85,12.85Z'/%3E%3Cpolyline class='cls-1' points='31.04 14.65 35.39 19 42.22 10.1'/%3E%3C/g%3E%3C/g%3E%3Crect class='cls-1' x='7.67' y='20.39' width='6.94' height='6.94'/%3E%3Crect class='cls-2' x='7.67' y='33.63' width='6.94' height='6.94'/%3E%3C/svg%3E"); } 
.num-icn-list > li .icn5 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 45.49 53.04'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23434756; %7D .cls-1, .cls-2 %7B fill: none; stroke-linejoin: round; stroke-width: 4px; %7D .cls-2 %7B stroke: %23c80726; %7D %3C/style%3E%3C/defs%3E%3Cline class='cls-1' x1='25.48' y1='20.01' x2='44.07' y2='1.41'/%3E%3Cpolyline class='cls-1' points='31.09 5.91 2 5.91 2 51.04 39.57 51.04 39.57 14.4'/%3E%3Cline class='cls-2' x1='9.67' y1='26.98' x2='31.9' y2='26.98'/%3E%3Cline class='cls-2' x1='9.67' y1='34.58' x2='31.9' y2='34.58'/%3E%3Cline class='cls-2' x1='9.67' y1='42.18' x2='31.9' y2='42.18'/%3E%3C/svg%3E"); } 
.num-icn-list > li .icn6 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 47.34 53.92'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23c80726; stroke-width: 4.26px; %7D .cls-1, .cls-2 %7B fill: none; stroke-linecap: round; stroke-linejoin: round; %7D .cls-2 %7B stroke: %23434756; stroke-width: 4px; %7D .cls-3 %7B fill: %23c80726; stroke-width: 0px; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-2' points='15.37 42.68 2.13 45.21 4.66 31.97 29.35 7.29 40.06 18 15.37 42.68'/%3E%3Cpath class='cls-3' d='M34.48,4.06h11.18c1.99,0,3.6,1.61,3.6,3.6v2.83h-18.37v-2.83c0-1.99,1.61-3.6,3.6-3.6Z' transform='translate(16.88 -26.2) rotate(45)'/%3E%3Cline class='cls-1' x1='2.13' y1='51.79' x2='36.63' y2='51.79'/%3E%3C/svg%3E"); } 
.num-icn-list > li .icn7 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 53.24 53.24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23434756; %7D .cls-1, .cls-2 %7B fill: none; stroke-linejoin: round; stroke-width: 4px; %7D .cls-2 %7B stroke: %23c80726; %7D %3C/style%3E%3C/defs%3E%3Ccircle class='cls-1' cx='26.62' cy='26.62' r='24.62'/%3E%3Cpolyline class='cls-2' points='40.01 19 22.81 36.2 13.23 26.62'/%3E%3C/svg%3E"); } 
.num-icn-list > li .icn8 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 41.84 53.88'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23434756; %7D .cls-1, .cls-2 %7B fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3.5px; %7D .cls-2 %7B stroke: %23c80726; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M31.13,3.64h5.16c.52,0,1.02.11,1.48.3.45.19.86.47,1.2.81.34.34.62.75.81,1.2.19.46.3.95.3,1.48v40.91c0,.52-.11,1.02-.3,1.48-.19.45-.47.86-.81,1.2-.34.34-.75.62-1.2.81-.45.19-.95.3-1.48.3H5.54c-.53,0-1.02-.11-1.48-.3-.45-.19-.86-.47-1.2-.81-.34-.34-.62-.75-.81-1.2-.19-.45-.3-.95-.3-1.48V7.43c0-.52.11-1.02.3-1.48.19-.45.47-.86.81-1.2.34-.34.75-.62,1.2-.81.45-.19.95-.3,1.48-.3h5.16'/%3E%3Cpath class='cls-1' d='M26.09,5.78c0,1.05-.96,1.91-2.14,1.91h-6.07c-1.18,0-2.14-.85-2.14-1.91v-2.12c0-1.05.96-1.91,2.14-1.91h6.07c1.18,0,2.14.85,2.14,1.91v2.12Z'/%3E%3Cg%3E%3Cline class='cls-2' x1='15.36' y1='23.03' x2='26.47' y2='23.03'/%3E%3Cline class='cls-2' x1='15.36' y1='29.85' x2='26.47' y2='29.85'/%3E%3Cline class='cls-2' x1='15.36' y1='36.68' x2='26.47' y2='36.68'/%3E%3C/g%3E%3C/svg%3E"); } 
.num-icn-list > li .icn9 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 58.64 43.34'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23b31e28; stroke-width: 0px; %7D .cls-2 %7B fill: none; stroke: %23434756; stroke-linejoin: round; stroke-width: 4px; %7D %3C/style%3E%3C/defs%3E%3Crect class='cls-2' x='2' y='7.16' width='54.64' height='34.18'/%3E%3Crect class='cls-1' x='14.97' y='14.13' width='5.92' height='8.11' rx='2.96' ry='2.96'/%3E%3Cpath class='cls-1' d='M15.94,23.72h3.98c3.36,0,6.08,2.73,6.08,6.08v4.56H9.86v-4.56c0-3.36,2.73-6.08,6.08-6.08Z'/%3E%3Cline class='cls-2' x1='32.33' y1='19.4' x2='48.36' y2='19.4'/%3E%3Cline class='cls-2' x1='32.33' y1='27.65' x2='48.36' y2='27.65'/%3E%3Cline class='cls-2' x1='29.32' y1='7.16' x2='29.32'/%3E%3C/svg%3E"); } 
.num-icn-list > li .icn10 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 39.98 57.98'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23c80726; %7D .cls-1, .cls-2 %7B fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3.7px; %7D .cls-2 %7B stroke: %23434756; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-2' d='M38.13,19.87c.07,10.02-8.01,18.19-18.02,18.26-10.02.06-18.19-8-18.26-18.02C1.79,10.08,9.86,1.91,19.88,1.85c10.02-.06,18.19,8,18.26,18.02Z'/%3E%3Cpolyline class='cls-2' points='29.49 42.22 29.57 56.01 20.18 47.93 10.88 56.13 10.79 42.34'/%3E%3Cpolygon class='cls-1' points='19.92 9.39 23.14 15.79 30.24 16.78 25.14 21.81 26.39 28.87 20.03 25.58 13.7 28.95 14.87 21.88 9.71 16.91 16.79 15.83 19.92 9.39'/%3E%3C/svg%3E"); } 
.num-icn-list > li .icn11 { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48.05 55.62'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke: %23434756; %7D .cls-1, .cls-2 %7B fill: none; stroke-linejoin: round; stroke-width: 4.26px; %7D .cls-2 %7B stroke: %23c80726; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='32.48 29.44 2.13 40.04 2.13 5.4 32.48 16 32.48 29.44'/%3E%3Cpath class='cls-1' d='M32.48,16h6.72c3.71,0,6.72,3.01,6.72,6.72h0c0,3.71-3.01,6.72-6.72,6.72h-6.72v-13.44h0Z'/%3E%3Cline class='cls-2' x1='2.13' x2='2.13' y2='45.44'/%3E%3Cpath class='cls-1' d='M40.11,34.27v13.42c0,3.2-2.6,5.8-5.8,5.8h0c-3.2,0-5.8-2.6-5.8-5.8v-11.02'/%3E%3C/svg%3E"); } 

@media only screen and (max-width: 1023px){
 .num-icn-list { flex-wrap: wrap; } 
.num-icn-list > li { width: 50%; } 
 }
@media only screen and (max-width: 767px){
 .num-icn-list > li { padding: 15px; } 
 .num-icn-list > li strong { padding-bottom: 30px; font-size: 1.9rem;} 
 }
@media only screen and (max-width: 490px){
 .num-icn-list > li { width: 100%; } 
 }

/************************* 팝업 공통 *************************/
.popup-wrap { display: none; position: fixed; top: 0; left: 0; z-index: 999; width: 100%; height: 100%; background: rgba(0,0,0,0.3); } 
.popup-wrap.active { display: block; } 
/* .popup-wrap .popup-box { position: absolute; top: 50%; left: 50%; max-width: 1100px; width: 90%; background: #fff; transform: translate(-50%, -50%); overflow: hidden; }  */
.popup-wrap .popup-box { position: absolute; top: 50%; left: 50%; max-width: 1100px; width: 90%; background: #fff; transform: translate(-50%, -50%);  max-height: 90vh;} 
.popup-wrap .popup-box.box500 { max-width: 500px; } 
.popup-wrap .popup-box.box800 { max-width: 800px; } 
.popup-box .popup-title { padding: 40px; text-align: left; padding-bottom: 0; } 
.popup-box .popup-title > span { display: inline-block; padding: 4px 11px; font-weight: 600; font-size: 14px; color: #fff; text-align: center; background: var(--main-color); border-radius: 5px; } 
.popup-box .popup-title > strong { display: block; line-height: 1.3; font-weight: 600; font-size: 2.2rem; } 
.popup-box .popup-title > p { display: block; line-height: 2.2rem; margin-top: 5px; font-family: 'The Jamsil'; font-weight: 300; font-size: 1.5rem; color: #777; } 
.popup-box .popup-title .inp-flex { border-bottom: 1px solid var(--gray-e5); border-top: 1px solid var(--gray-e5); background: #f9f9f9; padding: 20px; } 
.popup-box .popup-cont { padding: 0 40px 40px; max-height: 70vh; overflow-y: scroll; } 
/* .popup-box .popup-cont { padding: 0 40px 40px; }  */
.popup-box .popup-btn { display: flex; } 
.popup-box .popup-btn .btn { display: block; width: 100%; height: 59px; line-height: 59px; text-align: center; } 

.popup-wrap .popup-box1 { position: absolute; top: 50%; left: 50%; max-width: 400px; width: 90%; padding: 28px 25px; background: #fff; transform: translate(-50%, -50%); border-radius: 15px; overflow: hidden; } 
.popup-box1 .popup-text > strong { display: block; font-family: 'The Jamsil'; font-weight: 500; font-size: 1.8rem; } 
.popup-box1 .popup-text > p { margin-top: 8px; font-family: 'The Jamsil'; font-weight: 300; font-size: 1.5rem; color: #777; } 
.popup-box1 .popup-btn { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 20px; } 
.popup-box1 .popup-btn .btn { flex: 1; border-radius: 8px; } 

.popup-box .popup-cont .inp-flex .label { flex-shrink: 0; width: 120px; font-weight: 600; font-size: 14px; text-align: left; } 
 

@media only screen and (max-width: 767px){
 .popup-box { padding: 20px; } 
 .popup-box .popup-title {padding: 0;}
 .popup-box .popup-cont { padding: 0; } 
 }
 @media only screen and (max-width: 400px){
 .popup-box .popup-cont .inp-flex { flex-direction: column; align-items: inherit; gap: 10px; } 
 }

/******************************** 청약신청서작성-절차 ********************************/
.apform-wrap { max-width: 1118px; width: 100%; margin: 0 auto; } 
/* 단계 */
.step-list1 { display: flex; justify-content: center; flex-wrap: wrap; row-gap: 10px; width: 100%; margin-bottom: 40px; } 
.step-list1 li { flex-shrink: 0; flex: 1 1 25%; min-width: fit-content; position: relative; box-shadow: 1px 0 0 0 var(--gray-e5), 0 1px 0 0 var(--gray-e5), 1px 1px 0 0 var(--gray-e5), 1px 0 0 0 var(--gray-e5) inset, 0 1px 0 0 var(--gray-e5) inset; } 
.step-list1 li::after { content:""; position: absolute; top: 50%; transform: translateY(-50%); right: -12px; z-index: 1; width: 23px; height: 23px; background-color: #fff; border: 1px solid var(--gray-e5); border-radius: 100%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='9.5px' height='15.5px'%3E%3Cpath fill-rule='evenodd' stroke='rgb(102, 102, 102)' stroke-width='1px' stroke-linecap='butt' stroke-linejoin='miter' fill='none' d='M7.140,7.658 L1.754,13.044 L1.331,12.621 L6.505,7.446 L1.331,2.271 L1.754,1.848 L7.140,7.235 L6.929,7.446 L7.140,7.658 Z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: 6px auto; background-position: center center; } 
.step-list1 li:last-child::after { display: none; } 
.step-list1 li > strong { display: block; padding: 20px 10px; font-weight: 600; font-size: 1.6rem; color: #999; text-align: center; white-space: nowrap; line-height: 1.3; } 
.step-list1 li.on > strong { background: var(--main-color); color: #fff; } 

@media only screen and (max-width: 1023px){
 .step-list1 { margin-bottom: 30px; } 
 }
@media only screen and (max-width: 767px){
 .step-list1 { margin-bottom: 20px; } 
.step-list1 li > strong { padding: 15px 20px; } 
 }
@media only screen and (max-width: 440px){
 .step-list1 li { display: none; } 
.step-list1 li.on { display: block; } 
.step-list1 li::after { display: none; } 
 }
.con-box .top { display: flex; justify-content: right; } 
@media screen and (max-width: 767px){
 .top .baro-wrap { gap: 5px; } 
 }
 @media screen and (max-width: 400px){
 .baro-wrap {flex-wrap: wrap; justify-content: end;}
 }
.inp-flex { display: flex; align-items: center; gap: 5px; min-height: 40px; } 

/* 약관동의 */
.all-agree-box { padding: 20px; background: var(--gray-f9); } 
/* .trms-list { width: 1084px; margin: 0 auto; } */
.trms-list .trms { margin-top: 15px; } 
.trms-list .trms .top { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 18px; border: 1px solid var(--gray-e5); border-bottom: 0;} 
.trms-list .trms .top strong { font-size: 1.6rem; } 
.trms-list .trms .top.on .btn-arrow { transform: rotate(90deg); } 
.trms-list .trms .con { padding: 10px 0; overflow: hidden; border: 1px solid var(--gray-e5); } 
.trms-list .trms .padding-box { width: 100%; height: 300px; padding: 20px; border-top: 0; overflow-y: scroll; } 
.trms-list .trms .bottom { display: flex; justify-content: space-between; width: 100%; padding: 15px; background: var(--gray-f9); border: 1px solid var(--gray-e5); border-top: 0; } 
.trms-list .trms .bottom strong { font-weight: 500; font-size: 1.5rem; } 
.agr-all-chk { display: flex; justify-content: center; margin-bottom: 30px; padding-top: 30px; border-top: 1px dashed var(--gray-e5); } 
.agree p { font-weight: 400; font-size: 13px; letter-spacing: -0.05em; line-height: 1.4615; color: #58585A; } 
.agree p + p { margin-top: 10px; } 
.agree p b { font-weight: 700; font-size: 14px; letter-spacing: inherit; line-height: 1.4286; color: inherit; } 

@media only screen and (max-width: 767px){
 .all-agree-box { padding: 15px; } 
.trms-list .trms { margin-top: 10px; } 
.trms-list .trms .top { padding: 12px; } 
.trms-list .trms .con { padding: 12px; } 
.trms-list .trms .bottom { padding: 12px; } 
 }
@media only screen and (max-width: 470px){
 .trms-list .trms .bottom { gap: 5px; } 
 .trms-list .trms .bottom {flex-direction: column;} 
 .trms-list .trms .bottom .checkbox-list1 { justify-content: end; }
 }
 /* STEP2- 삭제 추가 버튼 */
.btn-rg a { display: inline-block; padding: 10px 35px 10px 20px; font-weight: 600; font-size: 14px; color: #fff; text-align: center; word-break: keep-all; } 
.btn-rg .add { position: relative; border-radius: 5px; flex: unset; } 
.btn-rg .add::after { content: ""; position:absolute; right: 18px; top: 50%; transform: translateY(-50%); width: 12px; height: 12px; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21.78 21.78'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-linejoin: round; stroke-width: 4px; %7D %3C/style%3E%3C/defs%3E%3Cline class='cls-1' x1='2' y1='10.89' x2='19.78' y2='10.89'/%3E%3Cline class='cls-1' x1='10.89' y1='19.78' x2='10.89' y2='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; } 
.btn-rg .delete { position: relative; border-radius: 5px; flex: unset; } 
.btn-rg .load {position: relative; border-radius: 5px; padding-right: 20px; color: var(--main-color);}
.btn-rg .load:hover {color: #fff; background: var(--main-color);}
.btn-rg .delete::after { content: ""; position:absolute; right: 18px; top: 50%; transform: translateY(-50%); width: 12px; height: 2px; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21.78 4'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23fff; stroke-linecap: round; stroke-linejoin: round; stroke-width: 4px; %7D %3C/style%3E%3C/defs%3E%3Cline class='cls-1' x1='2' y1='2' x2='19.78' y2='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; } 
 /* 제출서류등록 */
.tableC tbody tr td .esn { font-weight: 700; font-size: 1.5rem; color: #ed4b2c; margin-left: 5px; } 
/*** 완료 ***/
/* 스크롤 애니메이션 */
.trans-text { overflow: hidden; } 
.trans-text [data-aos=fade-up] { display: block; -webkit-transform: translate3d(0, 104%, 0); transform: translate3d(0, 104%, 0); } 
.icntxt-wrap1 { padding: 50px 0; text-align: center; overflow: hidden; } 
.icntxt-wrap1 .txt-wrap { position: relative; padding-top: 70px; } 
.icntxt-wrap1 .icn { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 40px; height: 40px; background-repeat: no-repeat; background-position: center; background-size: 40px auto; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22.64 16.16'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B stroke-width: 0px; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='0 7.91 1.77 6.14 8.25 12.62 20.87 0 22.64 1.77 8.25 16.16 0 7.91'/%3E%3C/svg%3E"); } 
.icntxt-wrap1 .house { display: block; line-height: 1.3; font-size: 2.4rem; color: var(--main-color); margin-bottom: 15px; height: 34px; } 
.icntxt-wrap1 strong { display: block; line-height: 1.3; font-size: 2.4rem; color: #333; height: 80px; } 
.icntxt-wrap1 em { display: block; margin-top: 20px; font-size: 1.8rem; color: #888; } 
.icntxt-wrap1 .notice { font-size: 14px; } 
.icntxt-wrap1 .input-wrap { max-width: 400px; margin: 0 auto; } 
.icntxt-wrap1 .input-wrap .input-st1 { width: 100%; } 
.icntxt-wrap1 .input-wrap .btn-bace1 { max-width: 100%; } 
@media only screen and (max-width: 767px){
 .st-app-wrap .st-app-list .st-app-item { align-items: center; gap: 40px; padding: 20px; } 
.st-app-wrap .st-app-list .st-app-item .txt-wrap { width: 90px; padding-top: 35px; } 
.st-app-wrap .st-app-list .st-app-item .icn { width: 25px; height: 25px; background-size: 25px 25px; } 
.st-app-wrap .st-app-list .st-app-item .tit { font-size: 1.8rem; } 
.st-app-wrap + .btn-ce { margin-top: 20px; } 
 }
@media only screen and (max-width: 470px){
 .st-app-wrap .st-app-list .st-app-item { flex-direction: column; align-items: baseline; gap: 20px; } 
 }

 /******************************** 사이버모델하우스 ********************************/
.button-box { } 
.button-box > ul { display: flex; flex-wrap: wrap; gap: 20px; } 
.button-box > ul > li { flex: 1 1 31.3%; background: transparent; min-height: 250px; } 
.button-box > ul > li > a:hover { box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); transition: box-shadow 0.3s ease; } 
.button-box > ul > li > a { position: relative; display: block; border-radius: 10px; overflow: hidden;} 
.button-box > ul > li > a .border-box {width: 100%; height: 100%; }
.button-box > ul > li:nth-child(1) > a { width: 100%; height: 100%; background: url(../img/content/cyber_btn1.png); background-repeat: no-repeat; background-size: cover; background-position: center center; } 
.button-box > ul > li > a::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); backdrop-filter: blur(5px); transition: backdrop-filter 0.3s ease; } 
.button-box > ul > li:hover > a::after { backdrop-filter: blur(0px); } 
.button-box > ul > li:nth-child(2) > a { width: 100%; height: 100%; background: url(../img/content/cyber_btn2.png); background-repeat: no-repeat; background-size: cover; background-position: center center; } 
.button-box > ul > li:nth-child(3) > a { width: 100%; height: 100%; background: url(../img/content/cyber_btn3.png); background-repeat: no-repeat; background-size: cover; background-position: center center; } 
.button-box > ul > li:nth-child(4) > a { width: 100%; height: 100%; background: url(../img/content/cyber_btn4.png); background-repeat: no-repeat; background-size: cover; background-position: center center; } 
.button-box > ul > li:nth-child(5) > a { width: 100%; height: 100%; background: url(../img/content/cyber_btn5.png); background-repeat: no-repeat; background-size: cover; background-position: center center; } 
.button-box > ul > li:nth-child(6) > a { width: 100%; height: 100%; background: url(../img/content/cyber_btn6.png); background-repeat: no-repeat; background-size: cover; background-position: center center; } 
.button-box > ul > li > a > .text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-size: 2.0rem; font-family: var(--point-fc); z-index: 1; } 

@media only screen and (max-width: 1023px){
 .button-box > ul > li { flex: 1 1 40%; min-height: 250px; } 
 }
@media only screen and (max-width: 767px){
 .button-box > ul > li { flex: 1 1 100%; min-height: 180px; } 
 }