Code - yangart/sejongOn

<!DOCTYPE html> <html lang="ko"> <head> <title>온세종학교</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <meta name="format-detection" content="telephone=no"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0"> <link href="/resources/front/site/SITE_00000/css/style.css" rel="stylesheet">  <script src="/resources/front/site/SITE_00000/js/common/jquery/jquery-3.6.0.min.js"></script> <script src="/resources/front/site/SITE_00000/js/common/jquery/jquery-ui.min.js"></script>   <script src="/resources/front/site/SITE_00000/js/common/vendor/swiper/swiper-bundle.js"></script> <script src="/resources/front/site/SITE_00000/js/common/vendor/etc/jQuery.tagify.min.js"></script>  <script src="/resources/front/site/SITE_00000/js/common/vendor/chart/chart4.3.0.js"></script> <script src="/resources/front/site/SITE_00000/js/common/vendor/chart/chartjs-plugin-datalabels@2.0.js"></script>    <script src="/resources/front/site/SITE_00000/js/_layout.js"></script>     <script src="/resources/front/site/SITE_00000/js/common.js"></script> <script src="/resources/front/site/SITE_00000/js/common-custom.js"></script>  </head> <body> <div class="accessibility"> <a href="#skipToContents" title="콘텐츠를 바로 볼 수 있도록 건너뛰기합니다.">콘텐츠 바로가기</a> </div>  <div class="container">  <header class="site-header"></header> <div class="site-body" id="skipToContents"> <div class="wrap"> <ul class="breadcrumb"> <li><a href="#none" class="home">홈</a></li> <li><a href="#none">1depth</a></li> <li><a href="#none">2depth</a></li> </ul> <div class="page-tit-area"> <div class="l-area"> <h2 class="title-xlg">시설예약 상세</h2> </div> <div class="r-area"> <a href="#none" class="btn">예약 취소</a> <a href="#none" class="btn">예약 수정</a> </div> </div> <div class="img-swiper-area"> <div class="img-area"> <div class="swiper img-swiper"> <div class="swiper-wrapper"> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> </div> </div> <div class="swiper-fnc"> <button type="button" class="swiper-button-prev">이전</button> <button type="button" class="swiper-button-next">다음</button> </div> </div> <div class="img-thumb-area"> <div class="swiper img-thumb-swiper"> <div class="swiper-wrapper"> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> <div class="swiper-slide"> <figure> <img src="/resources/front/site/SITE_00000/images/temp/img_space.png" alt="시설 이미지"> </figure> </div> </div> </div> <div class="swiper-fnc vertical"> <button type="button" class="swiper-button-prev sm">이전</button> <button type="button" class="swiper-button-next sm">다음</button> </div> </div> </div> <section class="section"> <header class="section-tit-area"> <div class="l-area"> <h3 class="title-lg">시설이용 정보</h3> </div> </header> <div class="write-type"> <table> <caption>시설이용 정보</caption> <colgroup> <col style="width: 240px;"> <col> <col style="width: 240px;"> <col> </colgroup> <tbody> <tr> <th scope="row">시설위치</th> <td colspan="3"> <ul class="info-inline-list"> <li> <div class="txt-area">온세종학교</div> </li> <li> <div class="txt-area">세종특별자치시 산울3로 140, 온세종학교 (산울동)</div> </li> </ul> </td> </tr> <tr> <th scope="row">시설명</th> <td>스튜디오1</td> <th scope="row">상태</th> <td>신청</td> </tr> <tr> <th scope="row">담당자</th> <td>김담당</td> <th scope="row">이용날짜</th> <td>2025월 8월 29일 (금)</td> </tr> <tr> <th scope="row">이용시간<i class="required">필수</i></th> <td colspan="3">09:00 ~ 10:00 , 10:00 ~ 11:00 , 11:00 ~ 12:00</td> </tr> <tr> <th scope="row">이용인원<i class="required">필수</i></th> <td colspan="3">2명</td> </tr> <tr> <th scope="row">시설이용 목적<i class="required">필수</i></th> <td colspan="3">수업</td> </tr> <tr> <th scope="row">첨부파일</th> <td colspan="3"> <div class="item-list-box order-front"> <div class="item"> <div class="txt-area"> <i class="ico-attach"></i> <p class="txt"> 첨부파일명.pdf </p> <small>124kb</small> </div> <div class="item-fnc-area"> <a href="#none" class="ico-download">다운로드</a> </div> </div> <div class="item"> <div class="txt-area"> <i class="ico-attach"></i> <p class="txt"> 첨부파일명.pdf </p> <small>124kb</small> </div> <div class="item-fnc-area"> <a href="#none" class="ico-download">다운로드</a> </div> </div> </div> </td> </tr> </tbody> </table> </div> </section> <section class="section"> <header class="section-tit-area"> <div class="l-area"> <h3 class="title-lg">반려사유</h3> </div> </header> <div class="write-type"> <table> <caption>반려사유</caption> <colgroup> <col style="width: 240px;"> <col> </colgroup> <tbody> <tr> <th scope="row">반려 사유</th> <td>해당 시설은 관리 점검 일정으로 사용이 제한되어 이번 예약은 승인되지 않았습니다. 불편을 드려 죄송하며 추후 가능 일정을 참고해 주시기 바랍니다</td> </tr> </tbody> </table> </div> </section> <section class="section"> <header class="section-tit-area"> <div class="l-area"> <h3 class="title-lg">예약자정보</h3> </div> </header> <div class="write-type"> <table> <caption>예약자정보</caption> <colgroup> <col style="width: 240px;"> <col> <col style="width: 240px;"> <col> </colgroup> <tbody> <tr> <th scope="row">이름</th> <td>홍길동</td> <th scope="row">소속</th> <td>온세종학교</td> </tr> <tr> <th scope="row">휴대전화번호<i class="required">필수</i></th> <td colspan="3">010 - **** - 4563</td> </tr> <tr> <th scope="row">이메일<i class="required">필수</i></th> <td colspan="3">z112344@naver.com</td> </tr> </tbody> </table> </div> </section> <section class="section"> <header class="section-tit-area"> <div class="l-area"> <h3 class="title-lg">시설물 사용 유의사항</h3> </div> </header> <div class="bg-box"> <ul class="bullet font-color-default-secondary"> <li>관리자를 통해 등록된 유의사항 표시</li> <li>시설물 및 장비 보호 : 시설물을 임의로 변경하거나 파손하는 행위는 금지되며, 사용한 기물은 깨끗하게 정리해야 합니다.</li> <li>사용 금지 행위 : 흡연, 음주, 폭죽놀이 등 화기 사용은 금지됩니다. 고성방가나 주류 반입, 애완동물 동반 등 다른 이용자에게 피해를 주는 행위도 금지될 수 있습니다.</li> <li>사용 목적 준수 : 허가된 사용 목적 범위 내에서만 시설을 이용해야 하며, 정치·종교적 행사 등 특정 단체의 이익을 위한 사용은 제한될 수 있습니다.</li> <li>안전 수칙 준수 : 안전 사고 예방을 위해 비상구 위치를 파악하고, 무리한 행동이나 장난은 삼가야 합니다. 안전 장비가 있다면 올바르게 착용하고, 자신의 체력 상태에 맞는 운동을 해야 합니다.</li> <li>정리정돈 : 시설물 사용을 마친 후에는 사용한 장비를 제자리에 정리하고, 흘린 땀이나 이물질을 닦아 다음 사용자를 위해 깨끗하게 정리해야 합니다.</li> <li>해당 시설의 이용 규정 : 각 시설마다 고유의 이용 규정, 운영 수칙, 안전 수칙이 있으므로, 이용 전에 반드시 확인해야 합니다.</li> <li>안전 점검 결과 : 시설물의 안전 상태를 파악하기 위해 정기적으로 실시되는 안전 점검 및 진단 결과를 확인하는 것이 중요합니다.</li> <li>비상 연락망 및 비상구 : 위급 상황 발생 시 신속하게 대처할 수 있도록 비상 연락망과 비상구의 위치를 미리 파악해 두어야 합니다.</li> </ul> </div> </section> <div class="btn-cont"><a href="#none" class="btn lg">확인</a></div> </div> </div> <footer class="site-footer"></footer> </div>  <div class="toast"></div>  <div class="dim"></div> </body> </html>