.b{color: #ce171f;}
.d-flex{display: flex;align-items: center;}
.h4 + .text-right {margin-top: -36px;margin-bottom: 9px;font-size: 14px;}
.list-1st li > .list-3st li{font-size: 15px;}
.fw {font-weight: bold;font-family: 'KHNPHD';}
.mt_50{margin-top: 50px;}

/*예약신청 소개 및 안내*/

.pass-intro .txtwrap .b{display: block; margin-bottom: 10px;}
.pass-intro .txtwrap .point{display: block; margin-top: 10px;}
.pass-intro .ui-list__bodo.type1 .obj .item .inner{padding: 50px 20px;padding-left: 115px;}
.pass-intro .ui-list__bodo.type1 .obj .item .inner .circle{left: 0;top: 30px;}
.media--popup{overflow: hidden;}
.media--popup .modal--body {z-index: 9999;background-color: #fff;}
.media--popup .modal:before {content: '';display: inline-block;height: 100%;width: 0;margin-left: -1em;vertical-align: middle}
.media--popup .modal--open {overflow: hidden;height: 100%}
.media--popup .modal--open .modal {overflow-x: hidden;overflow-y: auto;z-index: 99999}
.media--popup .modal--backdrop {position: absolute;top: 0;right: 0;left: 0;background-color: rgba(0, 0, 0, .6)}
.media--popup .modal--body {position: fixed;top: 50%;left: 50%;display: inline-block;max-width: 600px;width: 100%; margin: -1% auto 0;background: #fff;box-shadow: 0 0 24px rgba(0, 0, 0, .5);transform: translate(-50%, -50%);transition: all .4s ease-out;vertical-align: middle;text-align: left;}
.media--popup .modal--header {padding: 10px;background-color: #042557;}
.media--popup .modal--header strong{font-size: 25px;color: #fff;}
.media--popup .modal .modalTitle,
.media--popup .modal--title {font-size: 1.2em;color: #000}
.media--popup .modal--content {position: relative;padding: 20px;overflow-y: auto}
.media--popup .modal--footer {padding: 8px 15px;border-top: 1px solid #e6e6e6;background: #fafafa;text-align: center}
.media--popup .modal--close {position: absolute;top: 0;right: 0;font-size: 0}
.media--popup .modal--close-button span {display: inline-block;width: 60px;height: 60px;}
.media--popup .modal--close-button span:after,
.media--popup .modal--close-button span:before {display: inline-block;position: absolute;top: 50%;left: 50%;background-color: #fff;vertical-align: middle;transform: rotate(-45deg);content: '';}
.media--popup .modal--close-button span:before {    left: 50%;width: 38px;height: 1px;margin-top: 0;margin-left: -19px;}
.media--popup .modal--close-button span:after {    width: 1px;height: 38px;margin-top: -19px;}
.media--popup .modal.fade .modal--backdrop {opacity: 0;transition: opacity 1s}
.media--popup .modal.fade.active .modal--backdrop {opacity: .75;transition: opacity 1s}

.media--popup .btn-wrap {border-top: 1px solid #042557;font-size: 0;line-height: 0;}
.media--popup .btn-wrap .btn{margin: 0; padding: 10px 0;border: none;border-radius: 0;font-weight: bold;}
.media--popup .btn-wrap .btn-y{width: 45%; border-right: 1px solid #042557;}
.media--popup .btn-wrap .btn-n{width: 55%;}

@media only screen and (max-width:770px) {
    .media--popup .modal--header strong{font-size: 20px;}
    .media--popup .modal--close-button span {width: 50px;height: 50px}
    .media--popup .modal--close-button span:before {left: 50%;width: 28px;height: 1px;margin-top: 0;margin-left: -14px}
    .media--popup .modal--close-button span:after {width: 1px;height: 28px;margin-top: -14px}
}
@media(max-width:767px){
    .pass-intro .ui-list__bodo.type1 .obj .item .inner,.ui-list__bodo.type1 .obj.col3 .item .inner{min-height: auto;padding:25px 0;text-align:center;}
    .pass-intro .ui-list__bodo.type1 .obj .item .inner .circle{position:relative;top:auto;left:auto;;margin:0 auto 10px;}
    .pass-intro .ui-list__bodo.type1 .obj.col2{margin: 0;}
    .pass-intro .ui-list__bodo.type1 .obj.col2 .item{width:100%;margin:0 0 15px}
    .pass-intro .ui-list__bodo.type1.title .obj .item .inner .tit{display: block;position: relative;;left:auto;top:auto;width:auto;}
    .pass-intro .ui-list__bodo.type1.title .obj .item .inner{padding:25px;min-height:auto;}
}

@media only screen and (max-width:690px) {
    .media--popup .modal--body{max-width: 100%; width: 80%;}
}
@media only screen and (max-width:570px) {
    .media--popup .btn-wrap .btn-y,
    .media--popup .btn-wrap .btn-n{width: 100%;}
    .media--popup .btn-wrap .btn-y{border-right: none;border-bottom: 1px solid #042557;}
}

/*예약신청(예약정보 입력)*/
.pass-write .ui_subscription--form{margin-bottom: 30px;}
.pass-write .media--popup .btn-wrap .btn-y{width: 100%;border: none;}
.pass-write .form-inline .form-control{width: auto;}
.pass-write .pilsu:after{position: relative;top: -7px;}
.pass-write .help-block i{position: relative;top: -4px;}
.pass-write .radio-inline input[type=radio]{margin-top: -6px;}
.pass-write .form-horizontal .radio-inline{padding-top: 0;}
.pass-write .form-horizontal.bucket-form>.form-group.select .col-sm-4 {padding: 0;}   
.pass-write .form-horizontal.bucket-form>.form-group.select .col-sm-4:first-child{padding-right: 10px;}
.pass-write .form-horizontal.bucket-form>.form-group.tel span {margin: 0 2px ;}
@media only screen and (max-width:767px) {
.pass-write .form-control{display: inline-block;}
}
@media only screen and (max-width:452px) {
    .pass-write .ui_radio--custom label{margin-left: 0;margin-bottom: 3px;}
}
@media only screen and (max-width:380px) {
.pass-intro .btn,.pass-write .btn{display: block;width: 100%;}
.pass-intro .ir-arrow,.pass-write .ir-arrow{display: none;}
.pass-intro .btn-lg.btn-icon,
.pass-write .btn-lg.btn-icon{padding: 10px;}
}

/*-예약신청(날짜 및 시간 선택)*/
.ui-calendar.fe .col2>*,.ui-calendar.fe .row-cols-2>* {-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%}
.ui-calendar.fe .calendar-area{max-width: 55%;}
.ui-calendar.fe .time-area{max-width: 45%;}
.ui-calendar.fe .calendar-area .calendar{padding: 0;}
.ui-calendar.fe .calendar-area,
.ui-calendar.fe .time-area {width: 100%; min-height: 654px; padding: 30px;}

.ui-calendar.fe {position: relative; margin-top: 30px; overflow: hidden; border-top: 3px solid #000; border-bottom: 1px solid #DDD;}
.ui-calendar.fe:before {display: none;}
.ui-calendar.fe .obj {display: block; width: 100%;}
.ui-calendar.fe .obj .col {padding: 0; margin: 0; width: 100%; height: 100%;}
.ui-calendar.fe .calendar-area .calendar .calHeader .calBtn{top: -2px;}
.ui-calendar.fe .calendar-area {float: left;padding-right: 15px;}
.ui-calendar.fe .calendar-area .info {    display: flex;justify-content: flex-start;flex-wrap: wrap; margin: 23px 0 0 0;}
.ui-calendar.fe .calendar-area .info span {position: relative; display: inline-block;margin-right: 10px; padding: 0 0 0 20px; border: none; font-weight: 400; font-size: 14px; color: #444;background: none;}
.ui-calendar.fe .calendar-area .info span:last-child {margin-right: 0;}
.ui-calendar.fe .calendar-area .info span::before {position: absolute; left: 0; top: 2px; width: 14px; height: 14px; content: '';}
.ui-calendar.fe .calendar-area .info .today::before {border: 1px solid #002078; background-color: #fff;}
.ui-calendar.fe .calendar-area .info .select::before {background-color: #DD1227; border: 1px solid #DD1227;}
.ui-calendar.fe .calendar-area .info .off::before,
.ui-calendar.fe .calendar-area .info .holiday::before {border: 1px solid #DDD; background-color: #ddd;}
.ui-calendar.fe .calendar-area .info .on::before {border: 1px solid #DDD; background-color: #FFF;}

.ui-calendar.fe .schcal-tbl {width: 100%; border-top: 1px solid #DDD; margin: 30px 0 0 0;}
.ui-calendar.fe .schcal-tbl th {border: none; padding: 18px 0; border-bottom: 1px solid #DDD; font-weight: 700; text-align: center; color: #222; font-size: 16px; letter-spacing: -0.045rem; background-color: #fff; line-height: 100%;}
.ui-calendar.fe .schcal-tbl td {position: relative; display: table-cell; vertical-align: middle; border: 1px solid #DDD;}
.ui-calendar.fe .schcal-tbl .cal-inner {position: relative; display: block; width: 100%; height: 100%;}
.ui-calendar.fe .schcal-tbl .cal-inner .day {display: flex; align-items: flex-start; justify-content: center; width: 100%; height: 100%; min-height: 78px; padding: 10px; font-size: 15px; font-weight: 700; line-height: 100%;}
.ui-calendar.fe .schcal-tbl .cal-inner .holiday-text {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 15px; font-weight: 700; line-height: 100%; color: #DD1227;}
.ui-calendar.fe .schcal-tbl th.sun,
.ui-calendar.fe .schcal-tbl td.sun .day {color: #BB201C;}
.ui-calendar.fe .schcal-tbl td.sun {border-left: none;}
.ui-calendar.fe .schcal-tbl th.sat,
.ui-calendar.fe .schcal-tbl td.sat .day {color: #267ECF;}
.ui-calendar.fe .schcal-tbl td.sat {border-right: none;}
.ui-calendar.fe .schcal-tbl td.off .cal-inner .day,
.ui-calendar.fe .schcal-tbl td.holiday .cal-inner .day {background-color: #F8F8F8;}
.ui-calendar.fe .schcal-tbl td.select .cal-inner .day {background-color: #DD1227; color: #FFF;}
.ui-calendar.fe .schcal-tbl td.today {background: none;}
.ui-calendar.fe .schcal-tbl td.today .cal-inner .day {border: 2px solid #002078;}

.ui-calendar.fe .time-area {float: right;padding-left: 15px;}
.ui-calendar.fe .time-area .date-tit {display: block; color: #000; font-size: 32px; font-weight: 700; line-height: 40px; text-align: center;}
.ui-calendar.fe .time-area .date-tit .point {display: inline-block; font-size: 32px; font-weight: 700; line-height: 40px; text-align: center; color: #002078;}
.ui-calendar.fe .time-area .time-box {display: block;padding-top: 32px;}

.ui-calendar.fe .calendar-table,
.ui-calendar.fe .calendar-table thead,
.ui-calendar.fe .calendar-table tbody {display: block; width: 100%;}
.ui-calendar.fe .calendar-table tr {display: flex; width: 100%;}
.ui-calendar.fe .calendar-table th,
.ui-calendar.fe .calendar-table td {display: inline-block;}
.ui-calendar.fe .calendar-table .num {width: 15%;}
.ui-calendar.fe .calendar-table .time {width: 30%;}
.ui-calendar.fe .calendar-table .pay {width: 20%;}
.ui-calendar.fe .calendar-table .apply {width: 35%;}
.ui-calendar.fe .calendar-table tbody {height: 100%; overflow-y: auto;}
.ui-calendar.fe .calendar-table th,
.ui-calendar.fe .calendar-table td {border: transparent; text-align: center;}
.ui-calendar.fe .calendar-table thead th {height: 79px; background: transparent; border-bottom: 1px solid #DDD; display: inline-flex; align-items: center; justify-content: center; line-height: 1.2;}
.ui-calendar.fe .calendar-table td {font-size: 17px; color: #222; padding: 15px 10px; display: inline-flex; align-items: center; justify-content: center; line-height: 1.3;}
.ui-calendar.fe .calendar-table .button-box {display: block; width: 100%; height: 46px;}
.ui-calendar.fe .calendar-table .button-box .res-button {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background-color: #FFF; border-radius: 5px; transition: all 0.3s;}
.ui-calendar.fe .calendar-table .button-box .res-button .td-text {display: inline-block; width: 100%; vertical-align: middle; font-size: 15px; font-weight: 400; line-height: 120%;}
.ui-calendar.fe .calendar-table .button-box .res-button.res1 {border: 1px solid #002078;}
.ui-calendar.fe .calendar-table .button-box .res-button.res2 {border: 1px solid #BB201C;}
.ui-calendar.fe .calendar-table .button-box .res-button.res1 .re-point {color: #002078;}
.ui-calendar.fe .calendar-table .button-box .res-button.res2 .re-point {color: #BB201C;}
.ui-calendar.fe .calendar-table .button-box .res-button.res1:checked,
.ui-calendar.fe .calendar-table .button-box .res-button.res1:focus,
.ui-calendar.fe .calendar-table .button-box .res-button.res1:hover,
.ui-calendar.fe .calendar-table .button-box .res-button.res1:active,
.ui-calendar.fe .calendar-table .button-box .res-button.res1.on {background-color: #002078; color: #FFF;}
.ui-calendar.fe .calendar-table .button-box .res-button.res1:checked .re-point,
.ui-calendar.fe .calendar-table .button-box .res-button.res1:focus .re-point,
.ui-calendar.fe .calendar-table .button-box .res-button.res1:hover .re-point,
.ui-calendar.fe .calendar-table .button-box .res-button.res1:active .re-point {color: #FFF;}

/* nodata : S */
.ui-calendar.fe .time-area .calendar-nodata {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border: 1px solid #DDD; background-color: #F8F8F8; padding: 30px;}
.ui-calendar.fe .time-area .calendar-nodata .no-data-title {display: block; text-align: center; color: #666; font-size: 20px; font-weight: 700; line-height: 130%; letter-spacing: 0.0375rem;}
/* nodata : E */


.ui-calendar.fe.type3 .time-area .tb-title {display: block; width: 100%; font-size: 22px; font-weight: 700; line-height: 120%; color: #000;}
.ui-calendar.fe.type3 .time-area .tb-btn-group {width: 100%;margin: 2px 0 38px; border-collapse: collapse;}
.ui-calendar.fe.type3 .time-area .tb-btn-group:after {display: block; visibility: hidden; clear: both; content: '';}
.ui-calendar.fe.type3 .time-area .tb-btn-group li {display: table; float: left; width: 25%; height: auto ;margin-left: -1px; margin-top: -1px; vertical-align: middle;}
.ui-calendar.fe.type3 .time-area .tb-btn-group .tb-btn {display: table-cell; position: relative; width: 100%; padding: 20px 0; border: 1px solid #DDD; font-size: 15px; font-weight: 600; background-color: transparent;}
.ui-calendar.fe.type3 .time-area .tb-btn-group .tb-btn span{display:block;margin-top:3px;text-align:center}
.ui-calendar.fe.type3 .time-area .tb-btn-group .tb-btn span:first-child{margin-top:0}
.ui-calendar.fe.type3 .time-area .tb-btn-group .tb-btn span.ampm1{color:#293855}
.ui-calendar.fe.type3 .time-area .tb-btn-group .tb-btn span.ampm2{color:#5e3a46}
.ui-calendar.fe.type3 .time-area .tb-btn-group .tb-btn .check{position:absolute;top:0;left:50%;width:100%;height:100%;margin:0;margin-left:-50%;opacity:0;border:5px solid #117bc9}
.ui-calendar.fe.type3 .time-area .tb-btn-group .tb-btn.select .check{opacity:1}
.ui-calendar.fe.type3 .time-area .tb-btn-group .tb-btn.off{background-color: #ddd;}
.ui-calendar.fe.type3 .time-area .tb-btn-group .tb-btn.off .check{display:none}
.ui-calendar.fe.type3 .time-area .tb-result-group{    overflow: hidden;margin-top: 5px;padding: 30px 0;border: 1px solid #ddd;}
.ui-calendar.fe.type3 .time-area .tb-result-group .tb-result {float:left;width:50%;font-size:15px;font-weight:500;color:#635c56;text-align:center}
.ui-calendar.fe.type3 .time-area .tb-result-group .tb-result.time {border-left: 1px solid #DDD;}
.ui-calendar.fe.type3 .time-area .tb-result-group .tb-result.date:before{display:inline-block;width:18px;height:18px;margin-right:5px;margin-top:-6px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M17 3h4a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h4V1h2v2h6V1h2v2zm3 8H4v8h16v-8zm-5-6H9v2H7V5H4v4h16V5h-3v2h-2V5zm-9 8h2v2H6v-2zm5 0h2v2h-2v-2zm5 0h2v2h-2v-2z' fill='rgba(149,164,166,1)'/%3E%3C/svg%3E");background-size:100%;vertical-align:middle;content:''}
.ui-calendar.fe.type3 .time-area .tb-result-group .tb-result.time{margin-top:5px;font-size:15px;font-weight:500;color:#635c56;text-align:center}
.ui-calendar.fe.type3 .time-area .tb-result-group .tb-result.time:first-child{margin-top:0}
.ui-calendar.fe.type3 .time-area .tb-result-group .tb-result.time:before{display:inline-block;width:18px;height:18px;margin-top:-4px;margin-right:5px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm1-8h4v2h-6V7h2v5z' fill='rgba(149,164,166,1)'/%3E%3C/svg%3E");background-size:100%;vertical-align:middle;content:''}
.ui-calendar.fe.type3 .time-area .fe-btn{width:100%;height:68px;margin-top:32px;font-weight:bold;font-size:18px;transition:all 0.3s}


.pass-cal .btn-wrap{display: flex;justify-content: space-between;margin-top: 24px;}
.pass-cal .btn-wrap .btn{margin: 0;    margin: 0; width: calc(50% - 2px);}
.pass-cal .btn-wrap .btn:first-child{margin-right: 5px;}
.ui-calendar.fe.type3 .time-area .tb-result-group .tb-result{float: none;width: 100%;}
.ui-calendar.fe.type3 .time-area .tb-result-group .tb-result.time {border-left: 0;}

/*예약신청 내역조회*/
.pass-view .status{display: block;}
.pass-view .status1 {color: #ce171f;}
.pass-view .table .btn {padding: 8.5px 22px;}
.btn-delete, .btn-delete:link, .btn-delete:visited{background-color: #ce171f;border-color: #ce171f;color: #fff;border-radius: 5px;font-size: 15px;line-height: 20px;}
.btn-delete:active, .btn-delete:focus, .btn-delete:hover {border-color: #ce171f;background-color: #fff;color: #ce171f;}
@media only screen and (max-width:1250px) {
    .pass-cal .btn-wrap .btn{padding: 8.5px 16px;text-align: center;}
}

@media only screen and (max-width:767px) {
.pass-view .status{display: inline-block;}
}
@media only screen and (max-width:720px) {
    .ui-calendar.fe .calendar-area{float: none;border-bottom: 1px solid #ddd;}
    .ui-calendar.fe .calendar-area,.ui-calendar.fe .time-area{max-width: 100%;padding: 30px;min-height: 10px;}
    .ui-calendar.fe .calendar-area .info{margin-top: 10PX;}
    .ui-calendar.fe .time-area .time-box{padding-top: 0;}
    .ui-calendar.fe.type3 .time-area .tb-btn-group{margin: 0 0 20px;}
}
@media only screen and (max-width:440px) {
    .ui-calendar.fe .schcal-tbl{margin: 16px 0 0;}
    .ui-calendar.fe .calendar-area .calendar .calHeader .calDate{font-size: 27px;}
    .ui-calendar.fe .calendar-area, .ui-calendar.fe .time-area{padding: 20px;}
    .ui-calendar.fe.type3 .time-area .tb-title{font-size: 19px;}
    .ui-calendar.fe .schcal-tbl .cal-inner .day{min-height: 65px;}
    .ui-calendar.fe .schcal-tbl .cal-inner .holiday-text{font-size: 13px;letter-spacing: -1px;}
}

@media only screen and (max-width:390px) {
.ui-calendar.fe .calendar-area .info span{margin: 0 10px 0 0;font-size: 13px;}
}

@media only screen and (max-width:340px) {
    .pass-cal .btn-wrap{flex-wrap: wrap;}
    .pass-cal .btn-wrap .btn{width: 100%;}
    .pass-cal .btn-wrap .btn:first-child{margin-right: 0;margin-bottom: 3px;}
}