/* Tablet */
/* 키오스크 */
@media (max-width:1100px) {
/******************************* 입퇴실확인 ***********************************/
/* top */
.top_ckio_area{background:#171819;}
.top_ckio_box{display: flex; justify-content: space-between; align-items: center; width:auto; height:100px; margin:0 20px;}
.top_ckio_box a.logo{display:flex; align-items: center; color:#fff; font-weight:700;}
.top_ckio_box .logo .logo_img img{display:block; transform: translateY(-11px);}
.top_ckio_box .logo .logo_txt{margin-left:20px; font-size:24px;}
.top_ckio_box .logo .logo_txt span{font-size:18px; color:#878d98;}
.top_ckio_box .home{display: flex; align-items: center; color:#fff; font-size:18px; font-weight:500;}
.top_ckio_box .home::before{content:''; width:25px; height:25px; background:url(../images/ic_home.png) no-repeat; padding-right: 20px;}

/* 본문 */
.contents_area{}
.contents_box{width:auto; margin:0px 20px; padding:50px 0;}



/* 푸터 */
.footer_area{clear:both; border-top:1px solid #ddd; font-size:14px; font-weight:500; color:#091731; padding:0; margin:0;}
.footer_info{padding:14px 0; background:#f4f4f4;}
.footer_area ul{width:auto; margin:0 auto 0 auto; padding:0 20px;}
.footer_area ul li a{color:#1c2e4d;}
.footer_area ul li a:hover {color:#091731;}
.footer_box{width:auto; margin:0 auto; padding:24px 20px;}

.main_footer .footer_area ul{width:1000px;}
.main_footer .footer_box{width:1000px;}




}







@media (max-width:1023px) {


/* 푸터 */
.footer_area ul{width:auto; }
.footer_box{width:auto;}
.main_footer .footer_area ul{width:auto;}
.main_footer .footer_box{width:auto;}


/******************************* 예약시스템 ***********************************/
/* top */
.top_rsvt_area{background:#15233d;}
.top_rsvt_box{width:auto; height:100px; margin:0 20px; position:relative;}
.top_rsvt_box a.logo{display:block; padding:16px 0 0 0;color:#fff; font-weight:700;}
.top_rsvt_box .logo .logo_img{float:left;}
.top_rsvt_box .logo .logo_txt{float:left; margin:2px 0 0 20px; font-size:24px;}
.top_rsvt_box .logo .logo_txt span{font-size:18px; color:#878d98;}
.top_rsvt_box .home{position:absolute; top:38px; right:0px; color:#fff; font-size:18px;}
.top_rsvt_box .home::before{content:''; width:25px; height:25px; background:url(../images/ic_home.png) no-repeat; position:absolute; top:-2px; left:-35px;}





/******************************* 입퇴실확인 ***********************************/
/* top */
.top_ckio_area{background:#171819;}
.top_ckio_box{display: flex; justify-content: space-between; align-items: center; width:auto; height:100px; margin:0 20px;}
.top_ckio_box a.logo{display:flex; align-items: center; color:#fff; font-weight:700;}
.top_ckio_box .logo .logo_img img{display:block; transform: translateY(-11px);}
.top_ckio_box .logo .logo_txt{margin-left:20px; font-size:24px;}
.top_ckio_box .logo .logo_txt span{font-size:18px; color:#878d98;}
.top_ckio_box .home{display: flex; align-items: center; color:#fff; font-size:18px; font-weight:500;}
.top_ckio_box .home::before{content:''; width:25px; height:25px; background:url(../images/ic_home.png) no-repeat; padding-right: 20px;}




/* 본문 */
.contents_area{}
.contents_box{width:auto; margin:0px 20px; padding:50px 0;}







/* 예약시스템 메인 */
.main_area{height:auto; background:url(../images/bg_main.png) no-repeat center; background-size:cover;}
.main_box{width:auto; margin:0 auto; padding:0 20px; overflow:hidden;}

a.logo_main{display:inline-block; margin-top:50px;}
.main_tit{margin:30px 0 0 0; color:#fff; font-size:38px; font-weight:700; text-align:center;}
.main_tit span{font-size:33px;}
.main_bar{margin:40px auto; height:1px; background:#444f65; width:80px;}

.center_list{width:auto; float:none; margin-right:0px; margin-bottom:20px;}
.center_list li{}
.center_gangnam{height:152px; padding:28px 23px 0 67px; background:#2abbb2; color:#fff; border-radius:24px 24px 0 0;}
.center_gangnam .tit{position:relative; font-size:30px; padding:0; font-weight:700; color:#fff;}
.center_gangnam .tit::before{content:''; width:23px; height:31px; position:absolute; top:3px; left:-30px; background:url(../images/ic_map.png) no-repeat;}
.center_gangnam .address{padding:3px 0; font-size:16px; font-weight:300;}
.center_gangnam .tel{font-size:22px; font-weight:500;}
.center_gangnam a.booking{display:block; float:right; width:130px; height:34px; line-height:34px; text-align:center; border-radius:38px; border:2px solid #c0ebe8; font-size:18px; color:#fff;}

.center_yeouido{height:152px; padding:28px 23px 0 67px; background:#3595b6; color:#fff; border-radius:0 0 24px 24px;}
.center_yeouido .tit{position:relative; font-size:30px; padding:0; font-weight:700; color:#fff;}
.center_yeouido .tit::before{content:''; width:23px; height:31px; position:absolute; top:3px; left:-30px; background:url(../images/ic_map.png) no-repeat;}
.center_yeouido .address{padding:3px 0; font-size:16px; font-weight:300;}
.center_yeouido .tel{font-size:22px; font-weight:500;}
.center_yeouido a.booking{display:block; float:right; width:130px; height:34px; line-height:34px; text-align:center; border-radius:38px; border:2px solid #c3dfe9; font-size:18px; color:#fff;}

.center_gangnam a.booking:hover, .center_yeouido a.booking:hover{border:2px solid #fff;}


.mybooking{width:auto; height:300px; padding:30px; margin-bottom:10px; float:none; border-radius:24px; background:#f4f4f4;}
.mybooking .tit{position:relative; font-size:22px; color:#000; padding:0 0 12px 38px;}
.mybooking .tit::before{content:''; width:30px; height:28px; position:absolute; top:0px; left:0px; background:url(../images/ic_calendar2.png) no-repeat;}

.tb4{display:flex; border-bottom:1px solid #ddd; align-items:center; padding:5px 0;}
.tb4 label{flex:1; text-align:center;}
.tb4 span{flex:3;}
.tb4 span select{margin-bottom:3px;}
.tb4 span input{width:93%;}

/* 연락처 입력 필드 - 3:4:4 비율 */
.tb4 span input#areaMbpnNo{width:50px; max-width:27%;}
.tb4 span input#middleMbpnNo{width:70px; max-width:36%;}
.tb4 span input#endMbpnNo{width:70px; max-width:36%;}
.tb4 span span.etc{display:inline-block; padding:0 5px;}




.contents_box .ui-datepicker td span, .contents_box .ui-datepicker td a{padding:5px 5px 30px 5px;}


 /* 메인페이지 수정 및 공지사항 추가 20230613 */
.center_list{width:auto; height:auto; float:auto; margin-right:0px; border-radius: 24px;}
.center_list li{border-top:1px solid rgba(255,255,255,0.2); margin:auto 30px;}
.center_list li:first-child{border-top:none;}

.center_list .center_item{height:auto; padding:28px 0 0 37px;  color:#fff;}
.center_list .center_item .tit{position:relative; font-size:30px; padding:0; font-weight:700; color:#fff;}
.center_list .center_item .tit::before{content:''; width:23px; height:31px; position:absolute; top:3px; left:-30px; background:url(../images/ic_map.png) no-repeat;}
.center_list .center_item .address{padding:3px 0; font-size:16px; font-weight:300;}
.center_list .center_item .tel{font-size:22px; font-weight:500;}
.center_list .center_item a.booking{display:block; float:right; width:130px; height:34px; line-height:34px; text-align:center; border-radius:38px; border:2px solid rgba(255, 255, 255, 0.7); font-size:18px; color:#fff;}
.center_list .center_item a.booking:hover{border:2px solid #fff;}


.center_list_1{background:none; background-color:#2abbb2;}
.center_list_1 li{height:180px;}
.center_list_1 li:nth-child(2){display:none;}
.center_list_1 li:nth-child(3){display:none;}

.center_list_2{background-color:#2abbb2;}
.center_list_2 li{height:180px;}
.center_list_2 li:nth-child(3){display:none;}

.center_list_3{background-color:#2abbb2;}
.center_list_3 li{height:180px;}


} /* 끝 */