/* common */
.warp {position: relative; box-sizing: border-box; z-index: 10;}
.com_layout {width: 1400px; margin: 0 auto;}
.clear {clear: both;}
.mt30 {margin-top: 30px!important;}
.check input[type="checkbox"]{opacity: 0; position: absolute; left: -9999px;}
.check input[type="checkbox"] + label{position: relative; display:inline-block; padding-left: 25px; cursor: pointer;}
.check input[type="checkbox"] + label::before{ content: ""; position: absolute; left:0; top:50%; width:16px; height:16px; background:url(../images/icon_chk.jpg) no-repeat 0 0; background-size: cover; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.check input[type="checkbox"]:checked + label::before { background:url(../images/icon_chk_on.jpg) no-repeat; background-size: cover;}

.radio input[type="radio"]{opacity: 0; position: absolute; left: -9999px;}
.radio input[type="radio"] + label{position: relative; display:inline-block; padding-left: 25px; cursor: pointer;}
.radio input[type="radio"] + label::before{ content: ""; position: absolute; left:0; top:50%; width:16px; height:16px; background:url(../images/icon_radio.png) no-repeat 0 0; background-size: cover; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.radio input[type="radio"]:checked + label::before { background:url(../images/icon_radio_on.png) no-repeat; background-size: cover;}

.common_button {width: 100%; margin-top: 40px; text-align: center;}
.common_button button {display: inline-block; width: auto; min-width: 140px; height: 50px; padding:0 20px; margin: 0 5px; border: 1px solid #172f55; color: #172f56; font-weight: 700; font-size: 15px; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ;
}
.common_button button.save {border: 1px solid #000; background: #172f55; color: #fff;}
.common_button button.dinner_cancel {border: 1px solid #000; background: #172f55; color: #fff;}
.common_button button.disabled {border: 1px solid #888; color: #888; pointer-events: none; background: #e6e6e6;}
.common_button.right {text-align: right;}
.common_button.right button {margin: 0; margin-left: 5px;}

.phone {display: flex; align-items: center; justify-content: space-between;}
.phone > * {margin-right: 10px;}
.phone > div:last-child {margin-right: 0;}
.phone .select {width: 30%;}
.phone .select select {width: 100%;}

.table_btn {display: flex; justify-content: space-between; margin-top: 10px;}
.table_btn button { width: 48%; height: 40px; border: 1px solid #000; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.table_btn button.on {background:#43728c url('../images/icon_button_check.png') no-repeat 15% center; color: #fff; border: 1px solid #49728c;}


/* header */
header .com_layout {position: relative; display: flex; align-items: center; justify-content: flex-start; height: 105px;}
header .com_layout > * {display: inline-block; vertical-align: middle;}
header .com_layout .info_list {position: relative; display: flex; width: 100%;} 
header .com_layout .menu_list ,
header .com_layout .etc_menu {display: flex; align-items: center; }
header .com_layout .etc_menu { position: absolute; top:50%; right: 0; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
header .com_layout h1 img {margin-right: 30px; max-width: 200px;} 
header .info_list .menu_list ul {display: flex;}
header .info_list .menu_list ul li {padding: 0 10px;}
header .info_list .menu_list ul li a {color: #000; font-size: 18px;}
header .etc_menu .select_area {position: relative; width: 250px; height: 48px; margin-right: 20px; background: #f2f2f2 url('../images/icon_down_arrow.png') no-repeat 90% center;}
header .etc_menu .select_area span {display: block; width: 250px; height: 100%; padding-left: 20px; font-size: 15px; font-weight: 500; line-height: 48px; color: #000;  cursor: pointer;}
header .etc_menu .select_area ul {display: none; position: absolute; top:49px;width: 100%; }
header .etc_menu .select_area ul li {width: 100%; height: 40px; line-height: 40px;  border-bottom: 1px solid #ccc; background: #efefef;}
header .etc_menu .select_area ul li:last-child {border-bottom: 0;}
header .etc_menu .select_area ul li a {display: block; width: 100%; padding-left: 20px;}
header .etc_menu .login {margin-right: 20px; color:#666; font-size: 12px;}
header .etc_menu select {position: relative; top: -1px; padding-right: 20px; border: 0; color:#666; font-size: 12px; font-weight: 600; background: url(../images/icon_tri.png) no-repeat 95% center; 
  -webkit-appearance:none; /* 크롬 화살표 없애기 */
  -moz-appearance:none; /* 파이어폭스 화살표 없애기 */
  appearance:none /* 화살표 없애기 */}

  header .etc_menu .login_area {display: flex; align-items: center;}
  header .mobile_menu { position: absolute; left: 15px; top:50%; transform:translateY(-50%) ; display: block; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
  header .mobile_menu button {display: none; width: 18px; height: 23px; background: url('../images/icon_menu_m.png') no-repeat center; background-size: 18px;}
  header .mobile_menu button.on {width: 16px; height: 32px; background: url('../images/icon_close_m.png') no-repeat center; background-size: 16px;}
/* header */

/* footer */
footer {background:#f3f3f3;}
footer .top_area {background: #ebebeb;}
footer .top_area ul {display: flex; align-items: center; height: 68px;}
footer .top_area ul li{position: relative; padding: 0 9px;}
footer .top_area ul li:after {content: ""; position: absolute; right: 0; top:50%; width: 1px; height: 100%; transform: translateY(-50%); background: #898584;}
footer .top_area ul li:first-child {padding: 0; padding-right: 9px;}
footer .top_area ul li:last-child::after {display: none;}
footer .top_area ul li a {position: relative;font-size: 14px; color: #172f56;}
footer .bottom_area {padding: 23px 0;}
footer .bottom_area ul {border-bottom: 1px solid #ccc; }
footer .bottom_area ul li span {position: relative; font-size: 12px;}
footer .bottom_area ul li p {font-size: 12px; margin-top: 5px; margin-bottom: 10px;}
footer .bottom_area .copyright {font-size: 12px; margin: 10px 0 20px;} 


.top_btn {display: none;}
/* footer */

/* 상단 카테고리 */
section .category_title {display: flex; align-items: center; justify-content: center; width: 100%; height: 60px; background:#e8ecf3;}
section .category_title span {color: #3c465e; font-size: 19px; text-align: center; font-weight: 700;}


/* swiper */
.content .swiper-button-disabled {background: rgba(105,100,91,0.3);}
.swiper_button .swiper-button-next, 
.swiper_button .swiper-button-prev {left: auto; right: auto; width: 50px; height: 50px; margin-top: 0; }
.swiper_button .swiper-button-next {left: auto; right: 0;}
.swiper_button .swiper-button-prev {left: 0; right: auto;}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after,
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {display: none;}
.swiper-button-prev, .layer_area .swiper-button-prev {background: rgba(0,0,0,0.8) url('../images/icon_left_arrow_w.png') no-repeat center;}
.swiper-button-next, .layer_area .swiper-button-next {background: rgba(0,0,0,0.8) url('../images/icon_right_arrow_w.png') no-repeat center;}
.swiper-pagination-fraction, .layer_area .swiper-pagination-fraction {bottom: 0;}
.swiper-pagination, .layer_area .swiper-pagination { display: inline-block; width: auto; right: 24px; left: auto; bottom: 26px; width: 70px; height: 30px; line-height: 30px; border-radius:20px ;  -webkit-border-radius:20px ; -moz-border-radius:20px ; -ms-border-radius:20px ; -o-border-radius:20px ; background: rgba(67,65,65,0.7); color: #fff;}


/* layer */
body.layerBg {position: relative; overflow: hidden;}
body.layerBg::after {content: ""; position: fixed; top:0; left:0; right:0; bottom: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 10;}
.layer_area {position: fixed; top:50%; left:50%; width: 95%; height:500px; max-width: 1200px; transform:translate(-50%,-50%) ; padding: 40px 0 30px; border-radius: 10px; background: #fff; z-index: 100; -webkit-transform:translate(-50%,-50%) ; -moz-transform:translate(-50%,-50%) ; -ms-transform:translate(-50%,-50%) ; -o-transform:translate(-50%,-50%); -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px;}
.layer_area .swiper-pagination {bottom: 33%;}
.layer_area > .top_area {position: relative; padding:0 0 20px; margin: 0 30px; border-bottom: 1px solid #6476a3;}
.layer_area .top_area > .title {font-size: 21px; font-weight: 700; color: #000;}
.layer_area .top_area > button {position: absolute; right: 0; top:30%; width: auto; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.layer_area > .middle_area {position: relative; overflow: hidden auto; height: 350px; margin-top: 30px;  padding: 0 30px;}
.layer_area > .middle_area::after {content: ""; display: block; clear: both;}
/* .layer_area > .middle_area .benefit_area {overflow: auto; height: 600px;} */
.layer_area > .middle_area .benefit_area img {width: 100%;}
.layer_area > .middle_area .img_area {position: relative; overflow: hidden auto;}
.layer_area > .middle_area .img_area.v2 {height: 180px;  padding-bottom:10px; border-bottom: 1px solid #ccc;}
.layer_area .middle_area .img_area.v2 img {width: 100%; max-width: 150px; height: 100px; padding-right: 30px;}
.layer_area .middle_area .img_area img {width: 100%;  padding-right: 30px;}
.layer_area .middle_area .slide_area {position: relative;} 
.layer_area .middle_area .slide_area.flex {display: flex;}
.layer_area .middle_area .slide_area .right {float: right;}
.layer_area .middle_area .slide_area .swiper-button-next, .layer_area .middle_area .slide_area .swiper-button-prev { top:40%; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.layer_area .middle_area .slide_area + .slide_area {margin-top: 15px;}
.layer_area .middle_area .slide_area span {display: block;}
.layer_area .middle_area .slide_area .menu { font-size: 18px; margin-bottom: 10px; color: #000; font-weight: 700;}
/* .layer_area .reservation_wrap { float: right; width: 48%; margin-left: 15px;} */
.layer_area .reservation_area {margin: 0; padding: 20px 30px; border: 1px solid #ccc; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.layer_area .reservation_area span {display:block;}
.layer_area .reservation_area .title {color: #000; font-weight: 700;}
.layer_area .reservation_area .top_area {display: flex; justify-content: space-between; padding-bottom: 20px; border-bottom: 1px solid #ccc;}
.layer_area .reservation_area .top_area .left {width: 45%;}
.layer_area .reservation_area .top_area .name {margin-top: 10px; color: #000; font-weight: 600;}
.layer_area .reservation_area .top_area .right{width: 55%; padding-left: 30px; border-left: 1px solid #ccc; text-align: left;}
.layer_area .reservation_area .top_area .button_area {display: flex; justify-content: space-between; margin-top: 10px;}
.layer_area .reservation_area .top_area .button_area button { width: 48%; height: 40px; border: 1px solid #000; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.layer_area .reservation_area .top_area .button_area button.on {background:#43728c url('../images/icon_button_check.png') no-repeat 15% center; color: #fff; border: 1px solid #49728c;}
.layer_area .reservation_area .middle_area {padding: 20px 0; border-bottom: 1px solid #ccc;}
.layer_area .reservation_area .middle_area .title {margin-bottom: 15px;}
.layer_area .reservation_area .count_box {display: flex; justify-content: space-between; align-items: end;}
.layer_area .reservation_area .number_area {display: flex; align-items: center; justify-content: space-between; width: 130px;}
.layer_area .reservation_area .number_area span {color: #43728c; font-size: 11px; font-weight: 500;}
.layer_area .reservation_area .number_area .count {font-size: 20px; color: #666; font-weight: 700;}
.layer_area .reservation_area .number_area button {width: 30px; height: 30px; line-height: 30px; font-size: 20px; color: #43728c; border: 1px solid #43728c; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.layer_area .reservation_area .count_box .button_area {width: 100px; height: 40px; background: #172f56;}
.layer_area .reservation_area .count_box .button_area button {color: #fff; font-size: 15px;}
.layer_area .reservation_area .bottom_area {display: flex; align-items: center; padding-top: 20px;}
.layer_area .reservation_area .text_input {display: flex; align-items: center; justify-content: space-between;}
.layer_area .reservation_area .bottom_area input {width: 90px; height: 40px; padding: 0 10px 0 20px; text-align: right; border: 1px solid #000; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; background: url(../images/icon_input_calendar.png) no-repeat 10px center;}
.layer_area .reservation_area .bottom_area .select {position: relative; margin-left: 10px; }
.layer_area .reservation_area .bottom_area .select img { position: absolute; top:50%; left: 10px; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; z-index: 10;}
.layer_area .reservation_area .bottom_area select {position: relative; width: 100px; height: 40px; padding:0; border: 1px solid #000;  border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; text-align: center; }
.layer_area .reservation_area .border { border: 1px solid #ccc; padding:15px; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.layer_area .reservation_area .border .middle_area {border-bottom: 0; padding: 20px 0 0;}
.layer_area .reservation_wrap .button_area.find {width: 140px; height: 50px; margin-left: auto; margin-top: 35px; text-align: center; background: #172f55;}
.layer_area .reservation_wrap .button_area.find button {width: auto; color: #fff; font-size: 15px;}

.layer_area .reservation_wrap .text_wrap {padding-bottom: 20px; border-bottom: 1px solid #ccc;}
.layer_area .reservation_wrap .text_area {display: flex; justify-content: space-between;} 
.layer_area .reservation_wrap .text_area .select {display: flex; align-items: center;}
.layer_area .reservation_wrap .text_area .select span {display: inline-block; margin-left: 10px; color: #000; font-weight: 600;}
.layer_area .reservation_wrap .text_area .select select{width: 100%; height: 40px; border: 1px solid #000; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.layer_area .reservation_wrap .text_area:first-child .select {width: 50%;}
.layer_area .reservation_wrap .text_area:first-child .select:last-child {width: 60%;}
.layer_area .reservation_wrap .text_area:first-child .select select {width: 100%; max-width: 130px;}
.layer_area .reservation_wrap .text_area:last-child {margin-top: 20px;}
.layer_area .reservation_wrap .text_area:last-child .select select {width: 35%; padding-left: 0; text-align: center;}
.layer_area .reservation_wrap .text_area:last-child .select:first-child {width: 30%;}
.layer_area .reservation_wrap .text_area:last-child .select:nth-child(2) {width: 60%;}
.layer_area .reservation_wrap .text_area:last-child .button_area {width: 100px; height: 40px; background: #172f55;}
.layer_area .reservation_wrap .text_area:last-child .button_area button {color: #fff; font-weight: 700;}
.layer_area .etc_area {padding: 20px 0 0;}
.layer_area .etc_area a {display: flex; align-items: center; color: #000;}
.layer_area .etc_area a img {margin-left: 10px;}
.layer_area .tab_wrap {position: relative;}
.layer_area .tab_wrap::after {display: block; content: ""; clear: both;}
.layer_area .tab_wrap .left_area {float: left; width: 360px;}
.layer_area .tab_wrap .left_area .img_area {float: none; width: 100%; height: auto;}
.layer_area .tab_wrap .left_area .img_area img {width: 100%; padding-right: 0;}
.layer_area .tab_wrap .left_area p {margin-top: 30px; line-height: 1.5; font-weight: 600; text-align: justify;}
.layer_area .tab_wrap .right_area {float: right; width: calc(100% - 410px);}
.layer_area .tab_wrap .tab_button {display: flex;}
.layer_area .tab_wrap .tab_button li {width: 200px; height: 50px; line-height: 50px; font-size: 15px; border: 1px solid #ccc; text-align: center; cursor: pointer;}
.layer_area .tab_wrap .tab_button li.on, .layer_area .tab_wrap .tab_button li:hover {border: 0; border-top: 1px solid #3c465e; border-left: 1px solid #3c465e; border-right: 1px solid #3c465e; color: #3c465e; font-weight: 600;}
.layer_area .tab_wrap .view_area { overflow: hidden auto; height: 250px; margin-top: 30px;}
.layer_area .tab_wrap .view_area .view {display: none;}
.layer_area .tab_wrap .view_area .view.on {display: block;}
.layer_area .tab_wrap .view_area dl + dl {margin-top: 25px;}
.layer_area .tab_wrap .view_area dl dt {padding-left: 20px; margin-bottom: 10px; font-size: 15px; color: #000; font-weight: 700;}
.layer_area .tab_wrap .view_area dl dt.point {background: url('../images/icon_coin.png') no-repeat left center;}
.layer_area .tab_wrap .view_area dl dt.discount {background: url('../images/icon_index.png') no-repeat left center;}
.layer_area .tab_wrap .view_area dl dt.coupon {background: url('../images/icon_coupon.png') no-repeat left center;}
.layer_area .tab_wrap .view_area dl dt.member {background: url('../images/icon_member.png') no-repeat left center;}
.layer_area .tab_wrap .view_area dl dd {padding-left: 25px; line-height: 1.5;}
.layer_area .benefit_info {display: flex; justify-content: space-between;  margin-top: 23px;}
.layer_area .benefit_info .info_box {width: 25%; padding:0 20px; border-left: 1px solid #ccc;}
.layer_area .benefit_info .info_box:first-child {width: 50%; border-left: 0;}
.layer_area .benefit_info .info_box:nth-of-type(2) {width: 20%;}
.layer_area .benefit_info .info_box .title {display: block; margin-bottom: 15px; color: #000; font-size: 15px; font-weight: 700;}
.layer_area .benefit_info ul li {line-height: 1.6;}
.layer_area .benefit_info ul li span {display: inline-block; color: #666;}
.layer_area .benefit_info ul li span.smalltitle {width: 67px; padding-left: 25px; margin-right: 40px; color: #000; font-weight: 500;}
.layer_area .benefit_info ul li .time {background: url('../images/icon_input_time.png') no-repeat left center;}
.layer_area .benefit_info ul li.seating {padding-left: 25px; background: url('../images/icon_seat.png') no-repeat left center;}
.layer_area .benefit_info ul li.spot {padding-left: 25px; background: url('../images/icon_spot.png') no-repeat left center;}
.layer_area .benefit_info ul li.call {padding-left: 25px; background: url('../images/icon_call.png') no-repeat left center;}
/* .layer_area .pravite_warp {overflow: auto; height: 500px;} */
.layer_area .pravite_warp .title {font-size: 15px; font-weight: 700; color: #000;}
.layer_area .pravite_warp .text_box {margin-top: 25px;}
.layer_area .pravite_warp .text_box span {display: block; margin-bottom: 10px;}
.layer_area .pravite_warp .text_box p {line-height: 1.5;}
.layer_area .pravite_warp .text_box + .text_box {margin-top: 30px;}
.layer_area .pravite_warp .pravite_area + .pravite_area {margin-top: 50px;}
.layer_area .left_area {float: left;}
.layer_area .left_area.review img {width: 300px; height: 200px;}
.layer_area .right_area {float: left; width: calc(100% - 335px); margin-left: 35px;}
.layer_area .right_area.scroll {overflow: auto; height: 300px;}
.layer_area .right_area span {display: inline-block; color: #000;} 
.layer_area .right_area .level {padding: 2px 5px; font-size: 12px; color: #000; background: #cee3ed;}
.layer_area .right_area .title {margin-top: 30px;}
.layer_area .right_area .normal {margin-top: 20px; color: #000; line-height: 1.5;}
.layer_area .right_area .review_text {margin-bottom: 35px; color: #000; font-size: 17px; font-weight: 700;}
.layer_area .right_area .date {margin-top: 10px;}
/* .layer_area .layer_tab_wrap .tab_button {display: flex; align-items: center; justify-content: flex-start;} */
.layer_area .layer_tab_wrap .tab_button button {display: inline-block; position: relative; padding-bottom: 10px; font-size: 13px; letter-spacing: -0.05em; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.layer_area .layer_tab_wrap .tab_button button:hover,
.layer_area .layer_tab_wrap .tab_button button.on {color: #172f55; font-weight: 700;}
.layer_area .layer_tab_wrap .tab_button button:hover::after,
.layer_area .layer_tab_wrap .tab_button button.on::after {content: ""; position: absolute; bottom:0; left: 0; width: 100%; height: 3px; background: #172f55;}
/* .layer_area .layer_tab_wrap .view {overflow: auto; display: none; height: 700px;} */
.layer_area .layer_tab_wrap .view {overflow: auto;}
.layer_area .layer_tab_wrap .view.show {display: block;}
.layer_area .layer_tab_wrap .view .store_show {margin-bottom: 45px;}
/* .layer_area .layer_tab_wrap .view img {width: 100%; height: 260px; object-fit: cover;} */
.layer_area .layer_tab_wrap .view img {width: 100%;}
.layer_area .layer_tab_wrap .view .explain_text {display: block; margin-top: 10px; font-size: 15px; font-weight: 700;}
.layer_area .layer_tab_wrap .view .detail_btn {width: auto; margin: 10px 0; padding: 5px 30px 5px 10px; border: 1px solid #666; background: url('../images/icon_down_arrow.png') no-repeat 90% center; border-radius:20px ; -webkit-border-radius:20px ; -moz-border-radius:20px ; -ms-border-radius:20px ; -o-border-radius:20px ; font-size: 12px; text-align: left; color: #666;}
.layer_area .layer_tab_wrap .view .detail_btn.on { background: url('../images/icon_up_arrow.png') no-repeat 90% center;}
.layer_area .layer_tab_wrap .view .explain_text_list {display: none;}
/* .layer_area .layer_tab_wrap .view .explain_text_list p {margin-top: 10px;} */
.layer_area .layer_tab_wrap .view .explain_text_list.on {display: block;}
.layer_area .layer_tab_wrap .tab_button {overflow:auto;}
.layer_area .layer_tab_wrap .tab_button .mobile_scroll {display: flex; width: 1000px;}
.layer_area .cancel_list {display: flex; justify-content: space-between;}
.layer_area .cancel_list .box {position: relative; width: 24%; height: 100px; padding: 10px; border: 1px solid #ccc; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.layer_area .cancel_list .box span {display: inline-block; color: #000; font-weight: 700; font-size: 13px;}
.layer_area .cancel_list .box .title {margin-bottom: 35px; color: #44728c; font-size: 13px; text-align: left;}
.layer_area .cancel_list .box .bottom {position: absolute; bottom:10px; right: 10px; width: 100%; text-align: right;}
.layer_area .cancel_list .box .blue {color: #172f55;}
.layer_area .cancel_list .box .red {color: #c70b49;}
.layer_area .cancel_list .box .won {color: #000;}
.layer_area .layer_list {margin-top: 20px;}
.layer_area .layer_list li {color: #000; font-weight: 500; font-size: 13px; line-height: 1.5; letter-spacing: -0.05em;}
.layer_area .layer_check {display: flex; align-items: center; justify-content: space-between; margin-top: 35px;}
.layer_area .layer_check .check {width: 400px;}
.layer_area .layer_check .common_button {margin-top: 0;}
.layer_area .layer_check .common_button button {height: 35px; font-size: 12px;}
.layer_area .upload_area {display: inline-block; position: relative; width: 300px; height: 300px; background: #eff4f6;}

.layer_area .upload_area label { position: absolute; top:50%; left:50%; width: 100%; height: 100%; padding-top: 90px; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); cursor: pointer;}
.layer_area .upload_area img {display: block; margin: 0 auto;}
.layer_area .upload_area span {display: block; margin-top: 15px; color: #000; font-weight: 600; text-align: center; line-height: 1.3;}
.layer_area .upload_area input[type=file] {outline: 0; opacity: 0; pointer-events: none; user-select: none;}
.layer_area .write_area {display: inline-block; width: calc(100% - 335px); margin-left: 30px;}
.layer_area .write_area p {font-size: 15px; font-weight: 600; color: #000;}
.layer_area .write_area .text_area {margin-top: 10px; height: 230px;}
.layer_area .write_area .text_area textarea {width: 100%; height: 100%; padding:10px 20px;  border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; resize: none;}
.layer_area .write_area .common_button {margin-top: 15px;}
.layer_area .write_area .common_button button {min-width: 100px; height: 30px; font-size: 12px;}
.layer_area .upload_list { display: inline-block; width: 300px;  vertical-align: top;}
.layer_area .upload_list .upload_box {display: flex; align-items: center; justify-content: space-between; width: 100%; height: 60px; padding: 0 20px; background: #eff4f6;}
.layer_area .upload_list .upload_box img {width: auto; height: auto;}
.layer_area .upload_list .upload_box + .upload_box {margin-top: 10px;}
.layer_area .upload_list .upload_box .file_name {margin-left: 5px; color: #000; font-weight: 600;}
.layer_area .upload_list .upload_box .right > * {display: inline-block; vertical-align: middle;}
.layer_area .upload_list .upload_box .right button {position: relative; width: 12px; height: 12px; margin-left: 5px; background: url('../images/icon_close.png') no-repeat center; background-size: 12px; font-size: 0;}

.layer_area .upload_box { display: inline-block; width: 300px; height: 300px; position: relative; vertical-align: top;}
.layer_area .upload_box img {width: 300px; height: 300px; object-fit: cover;}
.layer_area .upload_box button {position: absolute; top:0; right:0; width: 24px; height: 24px; background: rgba(0,0,0,0.7) url('../images/icon_close.png') no-repeat center; background-size: 12px; z-index: 10; text-indent: -9999px;}
.layer_area .select_calendar {padding: 10px 30px; margin-top: 10px;}
.layer_area .select_calendar .data_select {padding-left: 0;}
.layer_area .select_calendar .title {margin-bottom: 10px;}
.layer_area.v2 {max-width: 500px; height: auto;}
.layer_area.v2 .reservation_wrap {width: 100%; float: none; margin-left: 0;}
.layer_area.v2 .reservation_area { padding: 0; border: 0; margin: 20px 0 0;}
.layer_area.v2 .bottom_area {padding-bottom: 20px;}
.layer_area.v2 .bottom_area .cal_area {width: 100%; text-align: center; border-radius:5px; border: 1px solid #ccc; }
.layer_area.v2 .button_area.find {width: 100px; height: 40px; margin-top: 30px;}
.layer_area.v2 .reservation_area .select_area {width: 100%; margin-top: 10px; padding-right: 30px;}
.layer_area.v2 .reservation_area .select_area select{width: 100%;}
.layer_area.v3 {max-width: 400px;}
.layer_area.v3 > .middle_area {margin-top: 15px;}
.layer_area.v3 .middle_area.weather {overflow: auto; margin: 0; padding: 0 30px; height: 400px;}
.layer_area.v3 .weather_area .resgin_weather {position: relative; padding:15px 20px; background: #f3f3f3; box-sizing: border-box;}
.layer_area.v3 .weather_area .resgin_weather .spot {display: block; color: #000; font-weight: 700;}
.layer_area.v3 .weather_area .resgin_weather .average_area {margin-top: 10px;}
.layer_area.v3 .weather_area .resgin_weather .average_weather {position: absolute; right: 20px; bottom: 15px; font-size: 30px; color: #000; font-weight: 700;}
.layer_area.v3 .weather_area .weather_list {margin-top: 10px; padding: 10px 0; background: #666;}
.layer_area.v3 .weather_area .weather_list .weather_box {display: flex; align-items: center; justify-content: space-between; padding: 10px 20px;}
.layer_area.v3 .weather_area .weather_list .weather_box .title {color: #fff;}

.layer_area.v3 .weather_area .weather_list .weather_box .weather_check {display: flex; align-items: center;}
.layer_area.v3 .weather_area .weather_list .weather_box .weather_check span {color: #fff;}
.layer_area.v3 .weather_area .weather_list .weather_box .weather_check img {width: 39px;margin: 0 3px;}
.layer_area.v3 .weather_area .weather_list .weather_box .weather_area {display: flex; justify-content: space-between;}
.layer_area.v3 .weather_area .weather_list .weather_box .weather_area .weather_check:first-child {margin-right: 15px;}
.layer_area.review {overflow: hidden;}
.layer_area.review .left_area {width: auto;}
.layer_area.review .left_area img {width: 100%;}
.layer_area.review .right_area {height: 350px;}



section .top_banner_info {height: 80px; background:#e8ecf3;}
.top_banner_info .com_layout {display: flex; align-items: center; justify-content: space-between; width: 1380px; height: 100%;}
.top_banner_info .text_area span {display: block; font-size: 18px; font-weight: 700; color: #3c465e; line-height: 1.4;}
.top_banner_info .search_area {display: flex; align-items: center;}
.top_banner_info .search_area button {display: block; width: 40px; height: 40px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; background:#fff url('../images/icon_search.png') no-repeat center;}
.top_banner_info .search_area a {margin-left: 10px; padding-right: 15px; color: #000; background: url('../images/icon_right_arrow.png') no-repeat right center;}

section .content {margin-top: 45px;}
.content .title {font-size: 24px; font-weight: 700; color: #000;}
.content .com_tab_area {margin-top: 20px; }
.content .com_tab_area .tab_button {display: flex; align-items: center;}
.content .com_tab_area .tab_button li {position: relative; padding-bottom: 15px; margin-right: 20px; font-size: 14px; font-weight: 700; cursor: pointer;}
.content .com_tab_area .tab_button li.on, .content .com_tab_area .tab_button li:hover {color: #172f55;}
.content .com_tab_area .tab_button li.on::after, .content .com_tab_area .tab_button li:hover::after {content: ""; position: absolute; left: 0; bottom:0px; width: 100%; height: 3px; background: #172f55;}
.content .com_tab_area .tab_view {overflow: hidden; position: relative;}
.com_banner.main .com_tab_area .swiper_button {position: absolute; bottom:0; right: 0;}
.com_banner.main .swiper-button-next, 
.com_banner.main .swiper-button-prev {position: absolute; right:0; bottom:0; left: auto; top: auto; margin-top: 0; }
.com_banner.main .swiper-button-prev {right: 50px;}

.com_banner.sub {margin-top: 45px;}
.com_banner.sub .tab_button {border-bottom: 1px solid #ccc;}
.com_banner.sub .tab_view {margin-top: 10px;}
.com_banner.sub .tab_view h3 {color: #000; font-size: 13px; font-weight: 700;}
.com_banner.sub .tab_view p {margin-top: 15px; font-size: 12px;}
.com_banner.sub .img_list {margin-top: 15px;}
.com_banner.sub .box { border: 1px solid #ccc; height: 464px;}
.com_banner.sub .box .img_area img {width: 100%;} 
.com_banner.sub .box .content_text{padding: 30px 20px;}
.com_banner.sub .box .content_text p {margin-top: 0; margin-bottom: 25px; height: calc(1.2em * 2); font-size: 20px; color: #000; font-weight: 700; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.com_banner.sub .box .content_text span {display: block; line-height: 1.5;}
.com_banner.sub .box .content_text .list {overflow: hidden; width: 90%; height: calc(1.5em * 2);; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.com_banner.sub .box .content_text .reply {display: flex; align-items: center; margin-top: 30px;}
.com_banner.sub .box .content_text .reply img {position: relative; top: 2px; margin-right: 5px;}
.content .link_area { margin: 50px 0 90px;}
.content .link_area .com_layout {display: flex;} 
.content .link_area .com_layout a {display: flex; align-items: center; width: 100%; height: 70px; padding: 0 20px; margin-right: 20px; border-radius:5px ; background: #f4f4f4 url('../images/icon_right_arrow.png') no-repeat 95% center; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px;}
.content .link_area .com_layout a:last-child {margin-right: 0;}
.content .link_area .com_layout a img {margin-right: 30px;}
.content .link_area .com_layout a p {color: #000;}

/* 로그인 & 회원가입 */
.join_area {margin: 65px auto 100px; width: 740px; min-height: 760px;}
.join_area .login_area {position: relative; }
.join_area .login_area .input_warp {display: flex; align-items: center; justify-content: space-between;}
.join_area .login_area::after {display: block; content: ""; clear: both;}
.join_area .login_area .right{float: right; width: 50%; padding-left: 50px;}
.join_area .login_area .input_area {overflow: hidden; width: 320px; height: 50px;   margin-right: 10px; border-radius:5px ; border: 1px solid #1d1d1d; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.join_area .login_area .input_area input {width: 100%; height: 100%; }
.join_area .login_area .input_area input::placeholder {color: #888;}
.join_area .login_area .button_area { width: 130px; height: 50px; background: #172f56; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.join_area .login_area .button_area button {text-align: center; color: #fff; font-size: 15px;}
.join_area .sns_area {display: flex; align-items: center; justify-content: space-between; margin-top: 60px;} 
.join_area .sns_area a {display: flex; align-items: center; width: 100%; height: 50px; margin-right: 10px; padding: 5px; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; font-weight: 700;}
.join_area .sns_area a img {margin-right: 10px;}
.join_area .sns_area a.kakao {background: #f9e000; color: #000;}
.join_area .sns_area a.naver {background: #00bf18; color: #fff;}
.join_area .sns_area a.google {padding: 10px; background: #fff; color: #000; border: 1px solid #000;}
.join_area .text_area {margin-top: 20px; font-weight: 700; text-align: center;}
.join_area .text_area a {display: inline-block; margin-left: 15px; color: #43728c; text-decoration: underline; }
.join_area .info_area {display: flex; align-items: center; margin-top: 53px; border: 1px solid #ccc; border-radius:20px ; -webkit-border-radius:20px ; -moz-border-radius:20px ; -ms-border-radius:20px ; -o-border-radius:20px ; box-shadow: 5px 0 21px rgba(0,0,0,0.11);}
.join_area .info_area .img_area img.pc{display: block;}
.join_area .info_area .img_area img.mo {display: none;}
.join_area .info_area .info_text {display: flex; align-items: center; padding-left: 33px; width: 700px;}
.join_area .info_area .info_text p {width: 58%; line-height: 1.5; padding-right: 25px; color: #172f56; font-weight: 700; font-size: 20px; }
.join_area .info_area .info_text ul {padding-left: 20px; border-left: 1px solid #ccc;}
.join_area .info_area .info_text ul li {color: #000; margin-bottom: 15px; font-weight: 600;}
.join_area .info_area .info_text ul li:last-child {margin-bottom: 0;}
.member_area {margin: 45px auto 100px; width: 800px; font-size: 16px; line-height: 1.5;}
.member_area .process_box {display: flex; align-items: center; justify-content: space-between;}
.member_area  .process_box span {position: relative; display: block; width: 240px; height: 60px; border: 1px solid #ddd; color: #888; font-size: 15px; font-weight: 700; text-align: center; line-height: 60px; border-radius: 60px; -webkit-border-radius: 60px; -moz-border-radius: 60px; -ms-border-radius: 60px; -o-border-radius: 60px; }
.member_area .process_box span img {display: inline-block; vertical-align: middle; margin-right: 10px;}
.member_area .process_box span.on {border: 1px solid #3c465e; background: #44728c; color: #fff;}
.member_area .process_box span::after { content: ""; position: absolute; right: -41px; top:50%; width: 41px; height: 1px; background: #ccc; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.member_area .process_box span:last-child:after {display: none;}
.member_area .process_box span.on::after {background: #3c465e;}
.member_area .join_processing p {margin-top: 30px; font-size: 15px; color: #888; font-weight: 700; text-align: center;}
.member_area .check_list {margin-top: 60px;}
.member_area .check_list > .check {padding-bottom: 20px; border-bottom: 1px solid #ccc;}
.member_area .check_list > .check label {font-size: 15px; color: #000; font-weight: 700;}
.member_area .check_text + .check_text {margin-top: 20px;}
.member_area .agree_area {margin-top: 20px;}
.member_area .agree_area .check {margin-bottom: 10px;}
.member_area .agree_area label {font-weight: 700;}
.member_area .agree_area .top{display: flex; align-items: center; justify-content: space-between;}
.member_area .agree_area .top .btn_area {text-align: right;}
.member_area .agree_area .top .btn_area button {display: none; width: auto; color: #43728c; font-weight: 700;}
.member_area .agree_area .top .btn_area button.on {display: block;}
.member_area .agree_area .list_box {overflow: auto; padding: 20px; height: 140px; border: 1px solid #ccc;}
.member_area .agree_area .list_box .title {display: block; margin-bottom: 10px; font-weight: 700;}
.member_area .agree_area .list_box p {line-height: 1.5;}
.member_area .agree_area .sms_choice {position: relative; padding-left: 22px;}
.member_area .agree_area .sms_choice::after { content: ""; position: absolute; top:30%; left:0; width:22px; height: 23px; background: url('../images/arrow_relply.png') no-repeat left center; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.member_area .agree_area .sms_choice .check_area { display: flex; align-items: center; height: 50px; margin-top: 20px; background:#f4f4f4; }
.member_area .agree_area .sms_choice .check {margin-bottom: 0; margin-left: 35px;}
.member_area .join_input_area {margin-top: 60px;}
.member_area .join_input_area .input_text {display: flex; align-items: baseline;}
.member_area .join_input_area .input_text.two {justify-content: space-between;}
.member_area .join_input_area .input_text + .input_text {margin-top: 20px;}
.member_area .join_input_area .input_text span {color: #000;}
.member_area .join_input_area .input_text .title {position: relative; display: block; width: 100px; color: #000; font-weight: 700;}
.member_area .join_input_area .input_text .title.red::after {content: "*"; color: #c70b49;}
.member_area .join_input_area .input_text .input_box {width: calc(100% - 100px);}
.member_area .join_input_area .input_box .input_btn  {margin-bottom: 10px;}
.member_area .join_input_area .input_box a { display: inline-block; width: 125px; height: 40px; margin-left: 5px; border: 1px solid #666; border-radius:5px ; text-align: center; line-height: 40px; background: #f2f2f2; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; font-weight: 700;}
.member_area .join_input_area .input_box .input_btn input[type='text'] {display: inline-block; width: calc(100% - 135px);}
.member_area .join_input_area .input_text .left {float: left; width: 49%; display: flex; align-items: center;}
.member_area .join_input_area .input_text .right {float: right; width: 49%; display: flex; align-items: center;}
.member_area .join_input_area .input_text .right .title {padding-left: 40px;}
.member_area .join_input_area .input_text .right .input input[type="text"] {width: calc(100% - 90px);}
.member_area .join_input_area .input_text .right .input a {width: 80px;}
.member_area .join_input_area .select_box {width: calc(100% - 100px);}
.member_area .join_input_area .select_box select {display: inline-block; width: 49.5%; background-position: 95% center;}
.member_area .complete_img {margin-top: 65px;}

.reservation_area {position: relative; margin: 45px 0 70px;}
.reservation_area .table_btn {display: flex; justify-content: space-between; margin-top: 10px;}
.reservation_area .table_btn button { width: 48%; height: 40px; border: 1px solid #000; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.reservation_area .table_btn button.on {background:#43728c url('../images/icon_button_check.png') no-repeat 15% center; color: #fff; border: 1px solid #49728c;}

.reservation_area .count_box {display: flex; justify-content: space-between; align-items: end;}
.reservation_area .number_area {display: flex; align-items: center; justify-content: space-between; width: 130px;}
.reservation_area .number_area span {color: #43728c; font-size: 11px; font-weight: 500;}
.reservation_area .number_area .count {font-size: 20px; color: #666; font-weight: 700;}
.reservation_area .number_area button {width: 30px; height: 30px; line-height: 30px; font-size: 20px; color: #43728c; border: 1px solid #43728c; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.reservation_area .choice_box .button_area {right: 20px; top:auto; bottom:15px; width: 100px; height: 40px; background: #172f56;}
.reservation_area .choice_box .button_area button {color: #fff; font-size: 15px;}

.date_choice_area {position: relative; display: flex; align-items: center; padding: 25px 0 20px 50px; border: 1px solid #ccc;  border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.date_choice_area .choice_box {padding:0 30px; border-right: 1px solid #ccc;}
.date_choice_area .choice_box:first-child {padding: 0; padding-right:30px;}
.date_choice_area .choice_box:last-child {border: 0;}
.date_choice_area .title {display: block; margin-bottom: 15px;  color: #000; font-weight: 700; }
.date_choice_area .select_box select {width: 200px; font-family: auto}
.date_choice_area .table_btn button {width: 80px; font-size: 11px; margin-right: 10px;}
.date_choice_area .table_btn button.on {padding-left: 10px;}
.date_choice_area .number_area {margin-right: 30px;}
.date_choice_area .button_area {position: absolute; right: 30px;}

.text_list_area {display: flex; margin-top: 10px;}
.text_list_area ul {width: 60%; padding-left: 20px;}
.text_list_area ul:first-child {width: 40%; border-right: 1px solid #ccc;}
.text_list_area ul li {line-height: 1.5;}

.select_calendar {position: relative; display: flex; padding: 18px 30px 18px 40px; margin-top: 30px; border: 1px solid #ccc; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.select_calendar .calendar_area {padding-right: 30px; border-right: 1px solid #ccc;}
.select_calendar .title {display: block; margin-bottom: 30px; color: #000; font-weight: 700;}
.select_calendar .data_select {padding-left: 30px;}
.select_calendar .data_select .date_pick button {  width: 80px; margin: 3px; height: 40px; border: 1px solid #888; border-radius:5px ; text-align: center; line-height: 36px; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.select_calendar .data_select .date_pick button:nth-of-type(5) {display: inline-block;}
.select_calendar .data_select .date_pick button.on {padding-left: 10px; background: #43728c url(../images/icon_button_check.png) no-repeat 15% center; color: #fff; border: 1px solid #49728c;}
.select_calendar .info_text {position: absolute; bottom:30px; padding-left: 50px; color: #666; font-size: 11px;}
.select_calendar .info_text::after { content: ""; position: absolute; left:0; top:50%; width: 40px; height: 40px; background: #ebebeb; border-radius:50% ; -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.data_select .btn_area {position: absolute; bottom:20px; right:30px; width: 100px; height: 40px; background: #172f56;}
.data_select .btn_area button {color: #fff; text-align: center; font-size: 15px;}

.resturant_info {display: flex; margin-top: 30px;}
.resturant_info .slide_img {overflow: hidden; position: relative; width: 815px; height: 404px;}

.resturant_info .slide_img .swiper_button .swiper-button-next,
.resturant_info .slide_img .swiper_button .swiper-button-prev { top:45%; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.resturant_info .slide_img .swiper-pagination-fraction {bottom: 80px; right:10px; width: 70px; left: auto;  color: #fff;}
.resturant_info .resturant_text {padding-left: 50px;}
.resturant_info .resturant_text > .title {color: #000; font-size: 21px; font-weight: 700;}
.resturant_info .resturant_text > .title a { position: relative; top: -2px; display: inline-block; width: 100px; height: 30px; margin-left: 10px; border:1px solid #000; color: #000; font-size: 12px; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; line-height: 30px; text-align: center; }
.resturant_info .resturant_text .text {margin-top: 15px; line-height: 1.5;}
.resturant_info .resturant_text .address {padding-left: 20px; margin-top: 18px; background: url('../images/icon_spot.png') no-repeat left center;}
.resturant_info .resturant_text .time_list {margin-top: 15px;}
.resturant_info .resturant_text .time_list li {display: flex; margin-bottom: 10px;}
.resturant_info .resturant_text .time_list li span {padding-left: 22px;}
.resturant_info .resturant_text .time_list li span:first-child {width: 100px; color: #000;}
.resturant_info .resturant_text .time_list li.time span:first-child {background: url('../images/icon_input_time.png') no-repeat left center;}
.resturant_info .resturant_text .title {display: block; margin-bottom: 5px; color: #000; font-size: 15px; font-weight: 700;}
.resturant_info .resturant_text .add_text {margin-top: 15px; padding-bottom: 10px; border-bottom: 1px solid #ccc;}
.resturant_info .resturant_text .parking {margin-top: 20px;}
.resturant_info .resturant_text .parking > p {margin-top: 5px;}

.reservation_info { position: relative; padding: 20px 30px; border-radius:10px ; background:#3c748f; -webkit-border-radius:10px ; -moz-border-radius:10px ; -ms-border-radius:10px ; -o-border-radius:10px ; margin-bottom: 30px;}
.reservation_info::after {content: ""; display: block; clear: both;;}
.reservation_info .info_box {float: left; color: #fff; padding: 0 40px; border-right: 1px solid #ccc;}
.reservation_info .info_box:first-child {padding: 0; padding-right: 40px;}
.reservation_info .info_box.noborer{border-right: 0;}
.reservation_info .info_box .title {display: block; font-weight: 700;}
.reservation_info .info_box P {margin-top: 12px; font-weight: 500;}
.reservation_info .button { position: absolute; right:30px; top:50%;  width: 140px; height: 50px; background: #172f56; color: #fff; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.reservation_info .button button {color: #fff; font-size: 15px; font-weight: 700;}
.reservation_info .button button img {margin-top: 6px; margin-right: 4px;}

.reservation_list {position: relative;}
.reservation_list .list_box {position: relative; padding: 30px; border: 1px solid #ccc; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ;}
.reservation_list .mobile_tab {display: none;}
.reservation_list .list_box + .list_box {margin-top: 30px;}
.reservation_list .list_box::after {display: block; content: ""; clear: both;}
.reservation_list .list_box .reservation_img {float: left; overflow: hidden; position: relative; }
.reservation_list .list_box .reservation_img .swiper-pagination {width: 70px; left: auto; color: #fff;}
.reservation_list .common_button {padding-top: 30px; clear: both;}
.reservation_text {position: relative;}
.reservation_text .title {margin: 0; font-size: 21px; font-weight: 700; color: #000;}
.reservation_text .title .discount {display: inline-block; width: 60px; height: 20px; background: #cee3ed; color: #000; font-size: 11px; vertical-align: middle; text-align: center; line-height: 20px;}
.reservation_text .sub_title {display: block; margin-top: 35px; color: #666; font-weight: 600;}
.reservation_text ul {margin: 20px 0;}
.reservation_text ul li {margin-bottom: 5px;}
.reservation_text ul .list_title {margin-right: 7px; color: #000; font-weight: 600;}
.reservation_text p {margin: 5px 0;}
.reservation_text {float: left; width: calc(100% - 380px); margin-left: 50px;}
.reservation_text .spot {padding-left: 20px; background: url('../images/icon_spot.png') no-repeat left center;}
.reservation_text p.spot {margin-top: 20px;}
.reservation_text .time {padding-left: 20px; background: url('../images/icon_input_time.png') no-repeat left top;}
.reservation_text .time .list_title {display: inline-block; width: 110px;}
.reservation_text .explain_area {padding-bottom: 10px; border-bottom: 1px solid #ccc;}
.reservation_text .explain_area:last-child {border-bottom: 0;}
.reservation_text .explain_area .sub_title {color: #000; font-size: 15px;}


.reservation_list .result_area {display: flex; align-items: baseline; justify-content: space-between; margin-top: 30px; padding-top: 20px; border-top: 1px solid #ccc;}
.reservation_list .result_area.v2 {border-top: 0;}
.reservation_list .result_area .reply {color: #888; font-weight: 600;}
.reservation_list .result_area .reply img {margin-top: 2px;}
.reservation_list .open_button {position: absolute; right: 0; top:0; display: flex; width: 100px;} 
.reservation_list .open_button button {padding: 5px 8px; border: 1px solid #ccc; color: #888; text-align: center; font-size: 11px;}
.reservation_list .open_button button.on {background: #172f55; color: #fff;}
.reservation_list .open_button button.off {background: #ecf0f8; color: #666;}
.reservation_list .list_text {margin-top: 20px;}
.reservation_list .list_text .blue {color: #172f55; font-weight: 700; font-size: 18px;}

.count_area {text-align: right;}
.count_area .text {color: #000; font-weight: 700;}
.count_area .pay {color: #172f55; font-size: 18px; font-weight: 700;}
.count_area .real_pay {margin-top: 5px; font-size: 18px; font-weight: 700;}
.count_area .real_pay .line {text-decoration: line-through;}
.count_area .real_pay .discount {font-size: 12px;}

.com_tab_area.v2 {position: relative; display: flex; width: 100%;}
/* 프로모션 swiper css 추가 */
.com_tab_area.v2 .promDinSwiper {width: 70%;}
.com_tab_area.v2::after {content: ""; position: absolute; bottom:0; left: 0; width: 100%; height: 1px; background: #3c465e;}
.com_tab_area.v2 button {position: relative; display: inline-block; width: 200px; height: 50px; line-height: 50px; border: 1px solid #ccc; color: #888; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 0 10px;}
.com_tab_area.v2 button.on {border: 1px solid #3c465e; border-bottom: 0; color: #3c465e; font-weight: 700;}
.com_tab_area.v2 button.on::after{content: ""; position: absolute; bottom:0; left: 0; width: 100%; height: 1px; background: #fff; z-index: 1;}
.com_tab_area.v2 + .select_area {display: flex; position: absolute; right: 0; top:0; }
.com_tab_area.v2 + .select_area select {width: 130px; background-color: #f2f2f2; border: 0;}
.com_tab_area.v2 + .select_area .top_button { width: 90px; height: 40px; margin-left: 10px; background: #172f55; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.com_tab_area.v2 + .select_area .top_button button {color: #fff;}
/* swiper css 추가 */
.com_tab_area.v2 .swiper-slide::after {content: ""; position: absolute; bottom:0; left: 0; width: 100%; height: 1px; background: #3c465e;}

.product_area {position: relative; margin: 45px 0 100px;}
.product_area .com_layout {position: relative;}
.product_area::after{content: ""; display: block; clear: both;}
.product_area .product_deatil {position: relative; margin-top: 30px; border: 1px solid #ccc;}
.product_area .product_deatil::after {content: ""; display: block; clear: both;}
.product_area .product_deatil .img_area {overflow: hidden; position: relative; float: left; width: 360px;}
.product_area .product_deatil .img_area img {width: 100%;}
.product_area .product_deatil .img_area .swiper-pagination-fraction {color: #fff; width: 70px; left: auto;}
.product_area .reservation_text.v2 {width: calc(100% - 360px); margin-left: 0;}
.product_area .reservation_text {position: relative; width: calc(100% - 410px); padding: 30px 0 30px 0;  border-left: 1px solid #ccc;}
.product_area .reservation_text .text_box {display: flex; align-items: end; justify-content: space-between; overflow: hidden; border-top: 1px solid #ccc; padding: 20px 0;}
.product_area .reservation_text .text_box:first-child {border-top: 0;}
.product_area .reservation_text .left_area {float: left; width: 760px; padding:0 87px 0 30px;}
.product_area .reservation_text .right_area {float: right; display: flex; align-items: end;  width: 250px; padding:0; }
.product_area .reservation_text .right_area.border {height: 254px; padding-left: 70px; border-left: 1px solid #ccc;}
.product_area .reservation_text .right_area img {width: 171px; height: 114px; text-align: left;}
.product_area .reservation_text .pay_area {margin-top: 30px;}
.product_area .reservation_text .pay_area span {font-size: 15px;  color: #000;}
.product_area .reservation_text .pay_area .blue {color: #172f56; font-weight: 700;}
.product_area .reservation_text .pay_area .discount span {color: #888;}
.product_area .reservation_text .text_box.subarea {margin: 0 30px;}
.product_area .reservation_text .text_box.subarea .left_area {padding:0 87px 0 0;}
.product_area .reservation_text .text_box.subarea .right_area {padding-left: 67px;}
.product_area .reservation_text .text_box.subarea:last-child {border-bottom: 0;}

.product_area .number_area {display: flex; align-items: center; justify-content: flex-end; width: 100%; margin-top: 10px;}
.product_area .number_area > * {margin: 0 5px;}
.product_area .number_area span {color: #43728c; font-size: 16px; font-weight: 700; }
.product_area .number_area span > span {color: #000;}
.product_area .number_area .count {font-size: 16px; color: #666; font-weight: 700;}
.product_area .number_area button {width: 20px; height: 20px; line-height: 20px; font-size: 16px; color: #43728c; border: 1px solid #43728c; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.product_area .total_area {display: flex; align-items: center; justify-content: space-between; padding: 30px; background: #f1f3f7; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;}
.product_area .total_area .total_title {font-size: 15px; color: #000; font-weight: 700;}
.product_area .total_area .total_number {color: #c70b49; font-size: 24px; font-weight: 700;}
.product_area .total_area .total_number > strong {color: #000;}
.product_area .etc_list {padding: 30px 30px 0 30px;}
.product_area .etc_list .etc_txt +.etc_txt {margin-top: 30px;}
.product_area .etc_list .title {font-size: 15px;}
.product_area .etc_list ul {margin: 0; margin-top: 10px;}
.product_area .common_button {margin-top: 20px;}
.product_area .reservation_list_wrap {float: left; width: 990px;}
.product_area .tex_result_area {float: right; width: 330px;}
.product_area .tex_result_area .img_area {position: relative; overflow: hidden;}
.product_area .tex_result_area .img_area .swiper-pagination-fraction {bottom: 09; right:10px; width: 70px; left: auto;  color: #fff;}
.product_area .tex_result_area.v2 {margin-top: 0;}
.product_area .tex_result_area.v2 .img_area {width:331px; margin-bottom: 20px;} 
.product_area .tex_result_area.v2 .img_area img {width: 100%; height: 221px;}
.product_area .resturant_info {padding-top: 50px;}

.reservation_list_wrap .reservation_list {margin-top: 0;}
.reservation_list .reservation_box {padding: 45px 50px; background: #f6f6f6;}
.reservation_list .reservation_box + .reservation_box {margin-top: 20px;}
.reservation_list .reservation_box .top {position: relative; padding-bottom: 10px; border-bottom: 1px solid #ccc;;}
.reservation_list .reservation_box .title {display: block; font-size: 19px; font-weight: 700; color: #3c465e;}
.reservation_list .reservation_box .check { position: absolute; top:35%; right:0; padding: 2px 8px; font-size: 13px; color: #000; background: #cee3ed; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; } 
.reservation_list .reservation_box .check.no {background: #ecb8c6;}
.reservation_list .reservation_box .link { position: absolute; right:0; top:50%; padding-right : 10px; color:#3c465e;  transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; background: url('../images/icon_right_arrow.png') no-repeat right center; font-size: 13px;}
.reservation_box .bottom {margin-top: 30px;}
.reservation_box p {font-weight: 700; font-size: 15px; color: #000;}
.reservation_box ul {margin-top: 20px;}
.reservation_box ul li {margin-bottom: 5px;}
.reservation_box ul li span {font-size: 13px; white-space: break-spaces;}
.reservation_box ul li span:first-child {padding-left: 20px; margin-right:10px; color: #000; font-weight: 600;}
.reservation_box ul li .visit {background: url('../images/icon_date.png') no-repeat left center;}
.reservation_box ul li .visit_v2 {background: url('../images/icon_visit.png') no-repeat left center;}
.reservation_box ul li .seat {background: url('../images/icon_table.png') no-repeat left center;}
.reservation_box ul li .human {background: url('../images/icon_people.png') no-repeat left center;}
.reservation_box ul li .call {background: url('../images/icon_call.png') no-repeat left center; background-size: 10px;}
.reservation_box ul li .email {background: url('../images/icon_email.png') no-repeat left center;}
.reservation_box ul li .ask {background: url('../images/icon_ask.png') no-repeat left center; }
.reservation_box ul li .text_area {margin:5px 0 10px 20px;}
.reservation_box ul li .text_area textarea{width: 100%; height: 20px; padding-left: 5px; border-radius:0 ; -webkit-border-radius:0 ; -moz-border-radius:0 ; -ms-border-radius:0 ; -o-border-radius:0 ; font-size: 12px; resize: none;}
.reservation_box ul li .input input[type="text"]::placeholder {font-size: 10px; }
.reservation_box .detail_list span {display: inline-block; width: 115px;}
.reservation_box .inform {position: relative;}
.reservation_box .inform + .inform {margin-top: 20px;}
.reservation_box .inform::after {display: block; content: ''; clear: both;}
.reservation_box .inform span {display: block; margin-bottom: 10px; font-size: 13px; color: #000; font-weight: 700;}
.reservation_box .inform .left {float: left; width: 48%;}
.reservation_box .inform .email {display: flex; align-items: center; justify-content: space-between;}
.reservation_box .inform .email > span {margin: 0 10px;}
.reservation_box .inform .right {float: right; width: 48%;}
.reservation_box .inform .text_area {width: 100%; height: 80px; }
.reservation_box .inform .text_area textarea {width: 100%; height: 100%; resize: none; padding:10px 20px; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.reservation_box .inform .radio_area {display: flex; padding-top: 20px;}
.reservation_box .inform .radio_area .radio {margin-right: 20px;}
.reservation_box .checklist {position: relative;}
.reservation_box .checklist .check { position: static; transform:none ; background: none; -webkit-transform:none ; -moz-transform:none ; -ms-transform:none ; -o-transform:none ; }
.reservation_box .checklist .sub_title {color: #000; font-size: 13px;}
.reservation_box .checklist .table_btn {width: 150px; margin-top: 10px;}
.reservation_box .check_area {display: flex; flex-wrap: wrap; margin-top: 10px;}
.reservation_box .check_area .check {margin-right: 30px;}
.reservation_box .check_area label {font-size: 12px; color: #000; font-weight: 600;}
.reservation_box .check_area .check_input {display: flex; align-items: center; width: 100%; margin-top: 15px;}
.reservation_box .check_area .check_input .check {margin-right: 10px;}
.reservation_box .check_area .check_input .input {width: 380px;}
.reservation_box .text_check {margin-top: 30px;} 
.reservation_box .text_check .sub_title {display: block; margin-bottom: 10px; color: #000; font-weight: 700;}
.reservation_box .text_check .red {color: #c70b49; font-weight: 700; font-size: 12px;}
.reservation_list_wrap .result_box {padding: 50px 0; border-bottom: 1px solid #ccc;}
.reservation_list_wrap .result_box:last-child {border-bottom: 0;}
.reservation_list_wrap .result_box > .title {display: block; margin-bottom: 30px; font-size: 19px; color:#3c465e; font-weight: 700;}
.reservation_list_wrap .result_box .list_number {position: relative;}
.reservation_list_wrap .result_box .list_number::after {display: block; clear: both; content: "";}
.reservation_list_wrap .result_box .number_box {float: left; width: 20%; border-left: 1px solid #ccc;}
.reservation_list_wrap .result_box .number_box:nth-of-type(3),
.reservation_list_wrap .result_box .number_box:nth-of-type(4) {width: 30%;}
.reservation_list_wrap .result_box .number_box span {display: block; padding-left: 10px; padding-bottom:10px;  font-weight: 600;}
.reservation_list_wrap .result_box .number_box .title {margin-bottom: 15px; color: #000; font-weight: 700;}
.reservation_list_wrap .result_box .number_box .count {font-size: 18px; color: #172f55;}
.reservation_list_wrap .result_box .number_box .point {color: #43728c;}
.reservation_list_wrap .result_box .number_box .red {font-size: 18px; color: #c70b49;}
.reservation_list_wrap .result_box .number_box:last-child {border-left: 0;}
.reservation_list_wrap .result_box .number_box:last-child .title {margin-bottom: 0;}
.reservation_list_wrap .result_box .number_box:last-child .table_btn {margin-top: 5px;}
.reservation_list_wrap .result_box .text_list {margin-top: 30px;}
.reservation_list_wrap .result_box .text_list .text {display: block; font-size: 13px; color: #000; font-weight: 700;}
.reservation_list_wrap .result_box .text_list .text {margin-bottom: 10px;}
.reservation_list_wrap .result_box .text_list ul li {line-height: 1.6;}
.reservation_list_wrap .result_box .text_list ul li span {color: #555;}
.reservation_list_wrap .result_box:first-child .text_list ul li {margin-top: 20px;}
.reservation_list_wrap .result_box:first-child .text_list .text {margin-top: 0;}
.reservation_list_wrap .result_box .point_area {display: flex; align-items: center; justify-content: space-between;}
.reservation_list_wrap .result_box .point_area > div {width: 49%;}
.reservation_list_wrap .result_box .point_area .title {display: block; margin-bottom: 10px; color: #000; font-weight: 700;}
.reservation_list_wrap .result_box .point_area .point_content {display: flex; align-items: center; justify-content: space-between;}
.reservation_list_wrap .result_box .point_area .point_content .point_title {color: #43728c; font-weight: 700;}
.reservation_list_wrap .result_box .point_area .point_content .check {margin-left: 50px;}
.reservation_list_wrap .result_box .point_area .point_content .check label {color: #000;}
.reservation_list_wrap .result_box .point_area .point_content .input {width: 30%;}
.reservation_list_wrap .result_box .point_area .select select {width: 100%; background-position: 95% center;}
.reservation_list_wrap .text_list .top {position: relative; width: 100%;}
.reservation_list_wrap .text_list .top button { position: absolute; right: 0; top:50%; width:auto; padding-right: 10px; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; font-size: 13px; background: url('../images/icon_down_arrow.png') no-repeat right 8px; color: #172f55;}
.reservation_list_wrap .text_list .top button.on {background: url('../images/icon_up_arrow.png')  no-repeat right 8px;}
.reservation_list_wrap .text_list .bottom {overflow: hidden; height: 50px; padding: 10px; border: 1px solid #ccc;}
.reservation_list_wrap .text_list .bottom.on {height: auto;}
.reservation_list_wrap .text_list .bottom p {font-size: 11px; color: #555;}
.reservation_list_wrap .final_check {margin-top: 40px;}
.reservation_list_wrap .cancel_title {margin-bottom: 30px; font-size: 17px; color: #172f55; font-weight: 700; }

.tex_result_area {position: relative; padding-bottom: 17px;}
.tex_result_area.v2 {margin-top: 50px;}
/* .tex_result_area::after {content: ''; position: absolute; bottom:3px; width: 100%; height: 17px; background: url('../images/icon_triangle.png') ;} */
.tex_result_area .title {font-size: 19px; color: #3c465e; font-weight: 700;}
.tex_result_area .meun_list { margin-top: 10px; padding: 40px 40px 0 40px; border-radius:5px ; background: #f6f6f6; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.tex_result_area .meun_list p {font-size: 15px; color: #555; font-weight: 700;}
.tex_result_area .meun_list span {display: block; margin-top: 10px; line-height: 1;}
.tex_result_area .meun_list .mobile_area > span {margin-bottom: 20px; font-size: 20px; color: #172f55; font-weight: 700;}
.tex_result_area .meun_list .right {display: block; margin-bottom: 20px; text-align: right; color: #172f55; font-size: 20px; font-weight: 700;}
.tex_result_area .meun_list .won {display: inline-block; color: #000; font-size: 14px;}
.tex_result_area .meun_list ul {padding-bottom: 20px; border-bottom: 1px solid #000;}
.tex_result_area .meun_list ul li {display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;}
.tex_result_area .meun_list ul li span {display: inline-block; margin-top: 0; font-size: 14px;}
.tex_result_area .meun_list ul li .blue {color: #172f55; font-size: 20px; font-weight: 700;}
.tex_result_area .result_menu {display: flex; justify-content: space-between; align-items: center; padding: 20px 0; background:#f6f6f6 ;}
.tex_result_area .result_menu.addpadding {padding: 20px 40px;}
.tex_result_area .result_menu .won {color: #000; font-weight: 700; margin-top: 0;}
.tex_result_area .result_menu .right {font-size: 30px; color: #c70b49; font-weight: 700;}
.tex_result_area .result_menu .right .won {font-size: 14px;} 
.reservation_list_wrap .space_text .normal_text {display: flex; justify-content: space-between; margin: 5px 0;}
.reservation_list_wrap .space_text .normal_text span {font-size: 15px; color: #000; font-weight: 600;}
.reservation_list_wrap .space_text .normal_text span:last-child {color: #172f55;}
.reservation_list_wrap .space_text .first {margin-bottom: 20px;}
.reservation_list_wrap .space_text .last {margin-top: 20px;}
.reservation_list_wrap .space_text .last span:last-child {color: #c70b49;}
.reservation_list_wrap .space_text .normal_text span > .won {color: #000;}

.review_list {position: relative; margin-top: 30px;}
.review_list .review_box {position: relative; padding: 20px 0; border-top: 1px solid #ccc;}
.review_list .review_box:last-child {border-bottom: 1px solid #ccc;}
.review_list .review_box::after {content: ""; display: block; clear: both;}
.review_list .review_box .left {float: left; width: 202px;}
.review_list .review_box .view {padding: 0 10px;background: #cee3ed; font-size: 12px;}
.review_list .review_box span {color: #000;}
.review_list .review_box .right {float: left; width: calc(100% - 202px); padding-left: 30px; border-left: 1px solid #ccc;}
.review_list .review_box .right {display: flex; }
.review_list .review_box .review_img {cursor: pointer; width: 100px; }
.review_list .review_box .review_img img {width: 100%; height: 67px;}
.review_list .review_box .review_img span{display: block; margin-top: 5px; color: #888;} 
.review_list .review_box .view_text {width: calc(100% - 100px); margin-left: 30px;}
.review_list .review_box .view_text .top {margin-bottom: 10px; font-size: 13px; color: #888;}
.review_list .review_box .view_text p {color: #000; font-size: 13px; line-height: 1.5;}

.review_list .review_box .review_btm {margin-top: 20px;}
.review_list .review_box .review_btm button { width: auto; padding: 7px; border: 1px solid #000; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; font-size: 11px;}
.count_btn {display: flex; align-items: center; justify-content: space-between; margin-top: 20px;}
.count_btn .btm_area {display: flex; align-items: center;}
.count_btn .btm_area button {width: 50px; height: 50px; opacity: 0.3;}
.count_btn .btm_area button.left {background: #000 url('../images/icon_left_arrow_w.png') no-repeat center;}
.count_btn .btm_area button.right {background: #000 url('../images/icon_right_arrow_w.png') no-repeat center;}
.count_btn .btm_area button.on {opacity: 1;}

.promotion_wrap {margin-top: 45px;}
.promotion_wrap .promotion_box + .promotion_box {margin-top: 30px;}
.promotion_wrap .promotion_box .top {position: relative; display: flex; align-items: center; justify-content: space-between;}
.promotion_wrap .promotion_box .promotion_title {font-size: 21px; color: #000; font-weight: 700;}
.promotion_wrap .promotion_box .top p {color: #666; font-weight: 700;}
.promotion_wrap .promotion_box .top p span {display: inline-block; margin-left: 5px;}
.promotion_wrap .promotion_box .top p .running { padding: 2px 5px; background: #cee3ed; font-size: 11px; color: #000;}
.promotion_wrap .promotion_box .top p .running.no { background: #ecb8c6; }
.promotion_wrap .promotion_box .bottom {display: flex; justify-content: space-between; margin-top: 10px; border: 1px solid #ccc;}
.promotion_wrap .promotion_box .bottom .left {padding: 40px;}
.promotion_wrap .promotion_box .bottom .left span {display: block;}
.promotion_wrap .promotion_box .bottom .left .title {margin-bottom: 20px; font-size: 15px; color: #000; font-weight: 700;}
.promotion_wrap .promotion_box .bottom .title_btn {display: block;  width: fit-content; max-width: 150px; height: 30px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-top: 30px; padding: 0 5px; border: 1px solid #000; border-radius:5px ; pointer-events: none; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; font-size: 11px;}
.promotion_wrap .promotion_box .view {display: block; padding: 30px 200px; }
.promotion_wrap .promotion_box .view_text {margin-top: 35px;}
.promotion_wrap .promotion_box .view_text .title {color: #000; font-size: 15px; font-weight: 700;}
.promotion_wrap .promotion_box .view_text .text_box {margin-top: 25px;}
.promotion_wrap .promotion_box .view_text .text_box + .text_box {margin-top: 30px;}
.promotion_wrap .promotion_box .view_text .text_box .sub_title {display: block; margin-bottom: 15px; color: #3d738d; font-weight: 700;}
.promotion_wrap .promotion_box .view_text .text_box p {line-height: 1.5;}
.promotion_wrap .promotion_box .view_text .through {text-decoration:line-through;}
.promotion_wrap .promotion_box .mypage {margin-top: 0;}
.promotion_wrap .promotion_box .mypage .left {padding: 0;}
.promotion_wrap .promotion_box .mypage .right {width: calc(100% - 360px); padding:0 40px 10px 30px;}
.promotion_wrap .promotion_box .mypage .top {display: flex; align-items: center; justify-content: space-between; padding: 15px 0 10px; border-bottom: 1px solid #ccc;}
.promotion_wrap .promotion_box .mypage .top span {font-size: 13px; color: #888; font-weight: 600;}
.promotion_wrap .promotion_box .mypage .top .title {color: #000; font-size: 17px;}
.promotion_wrap .promotion_box .mypage .middle {margin-top: 20px;}
.promotion_wrap .promotion_box .mypage .middle span {display: block;}
.promotion_wrap .promotion_box .mypage .middle .top_title {color: #888; font-size: 13px;}
.promotion_wrap .promotion_box .mypage .middle .main_title {margin-top: 20px; font-size: 25px; font-weight: 700; color: #000;}
.promotion_wrap .promotion_box .mypage .text_list {display: flex; margin-top: 15px;}
.promotion_wrap .promotion_box .mypage .text_list .text_box {padding: 0 10px; border-right: 1px solid #ccc;}
.promotion_wrap .promotion_box .mypage .text_list .text_box:first-child {padding: 0; padding-right:10px;}
.promotion_wrap .promotion_box .mypage .text_list .text_box:last-child {border-right: 0;}
.promotion_wrap .promotion_box .mypage .text_list .text_box span {display: inline; font-weight: 700;}
.promotion_wrap .promotion_box .mypage .text_list .text_box .blue {color: #44728c;}
.promotion_wrap .promotion_box .mypage .text_list .text_box .check {margin-left: 5px; padding: 2px 10px; background: #cee3ed; color: #000; font-weight: 600; font-size: 12px;}
.promotion_wrap .promotion_box .mypage .text_list .text_box .check.no {background:#ecb8c6;}
.promotion_wrap .promotion_box .mypage .total_count {display: flex; align-items: center; justify-content: space-between; margin-top: 20px; padding: 10px 30px; border-top:1px solid #ccc; border-bottom: 1px solid #ccc; background: #f1f3f7;}
.promotion_wrap .promotion_box .mypage .total_count .title {font-size: 15px; color: #000; font-weight: 700;}
.promotion_wrap .promotion_box .mypage .total_count span {display: inline-block; font-size: 24px; color:#c70b49; font-weight: 700;}
.promotion_wrap .promotion_box .mypage .total_count span > .won {color: #000;}
.promotion_wrap .promotion_box .mypage .common_button {width: 100%;  padding: 0;}
.promotion_wrap .promotion_box .mypage .common_button button {min-width: 100px; height: 30px; font-size: 11px;}
.promotion_wrap .promotion_box .mypage .left img {width: 360px; height: 296px; object-fit: cover;}
/* 프로모션 페이지 이미지 css 추가 */
.promotion_wrap .promotion_box .right .img_area img {width: 924px; height: 279px; object-fit: cover;}

.quesetion_list {margin-top: 30px;}
.quesetion_list .question_box {position: relative; padding: 30px 0; border-top: 1px solid #ccc;}
.quesetion_list .question_box:last-child {border-bottom: 1px solid #ccc;}
.quesetion_list .question_box span {display: inline-block;}
.quesetion_list .question_box .title {padding-right: 5px; color: #888;}
.quesetion_list .question_box .list {position: relative; padding-left: 8px; color: #000;}
.quesetion_list .question_box .list::after { content: ""; position: absolute; top:50%; left: 0; width: 1px; height: 13px; background: #ccc; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.quesetion_list .question_box p {overflow: hidden; width: 95%; white-space: nowrap; text-overflow: ellipsis; color: #000; font-weight: 600; margin-top: 15px;}
.quesetion_list .question_box .question_btm { position: absolute; top:50%; right: 0; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.quesetion_list .question_box .question_btm .stauts { width: 60px; height: 30px; border: 1px solid #000; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; font-size: 12px; text-align: center; line-height: 30px;}
.quesetion_list .question_box .question_btm.disabled .stauts {border: 1px solid #888; color: #888; pointer-events: none; background: #e6e6e6;}

.qa_list {margin-top: 30px;}
.qa_list .ask_area .top {display: flex; justify-content: space-between; align-items: center; padding: 20px 0; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;}
.qa_list .ask_area .top .title {color: #000; font-size: 17px; font-weight: 700;}
.qa_list .ask_area .bottom {padding: 30px 0;}
.qa_list .ask_area .bottom .subtitle {display: block; margin-bottom: 30px; color: #44728c; font-weight: 600;}
.qa_list .admin_area {position: relative;}
.qa_list .admin_area .top {position: relative; padding: 8px 0;}
.qa_list .admin_area .top .admin_title {font-size: 17px; color: #000; font-weight: 700;}
.qa_list .admin_area .top .answer_btn { position: absolute; right: 0; top:50%; width: auto; height: 30px; padding: 0 10px; border: 1px solid #000; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); color: #888; line-height: 30px;}
.qa_list .admin_area .answer_area {padding: 10px 20px; min-height: 100px; margin-top: 20px; background: #f1f1f1;}
.resgiter_area {padding-top: 20px; margin-top: 30px; border-top: 1px solid #ccc;}
.resgiter_area th, .resgiter_area td {padding: 10px 0;}
.resgiter_area th {color: #000;}
.resgiter_area th.top {vertical-align: top;}
.resgiter_area .select {width: 300px;}
.resgiter_area .select select {width: 100%; background-position: 95% center;}
.resgiter_area .text_area {width: 100%; height: 300px;}
.resgiter_area .text_area textarea { width: 100%; height: 100%; padding: 10px 20px; resize: none; border: 1px solid #000; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }

.product_area .tex_result_area .mobile_btn {display: none;}
.tex_result_area .meun_list .mobile_area {display: block;}

.mo {display: none}
.pc {display: block;}

@media all and (max-width:1400px) {
  .com_layout {width: 100%; padding: 0 15px;}
  .top_banner_info .com_layout {width: 100%; padding: 0 15px;}
  header .etc_menu .select_area {width: 220px; height: 35px;}
  header .etc_menu .select_area span {width: 200px; line-height: 35px; padding-left: 10px; font-size: 14px;}
  header .etc_menu .select_area ul {top: 100%; z-index: 100;}
  header .etc_menu .select_area ul li {height: 35px; line-height: 35px;}
  header .etc_menu .select_area ul li a {padding-left: 10px; font-size: 13px; font-weight: 500;}
  .content .link_area .com_layout a p br {display: none;}
  .content .com_tab_area .tab_view .swiper-slide > img {width: 100%;}

  .date_choice_area {padding: 20px 0 10px 30px;}

  .reservation_text {margin-left: 2%;}
  .reservation_text .title .discount {width: 50px; font-size: 10px;}
  .reservation_list .open_button button {padding: 5px;}
  .reservation_list .list_box {padding: 15px;}
  .reservation_text .sub_title {margin-top: 30px;}

  .product_area .reservation_text .right_area.border {padding-left: 4%;}
  .product_area .reservation_text .text_box.subarea .right_area {padding-left: 4%;}
  .product_area .number_area {justify-content: space-between;}
  .product_area .number_area > * {margin: 0;}

  .com_tab_area.v2 + .select_area {right: 15px;}

  .promotion_wrap .promotion_box .bottom .left {padding: 25px;}
  .com_tab_area.v2 button {width: 15%;}

  .product_area .reservation_list_wrap {float: none; width: 100%;}
  .product_area .tex_result_area {position: fixed; bottom:0; left: 0; float: none; width: 100%; padding:10px  15px;  z-index: 10; border-top-left-radius: 10px; border-top-right-radius: 10px; background: rgba(255,255,255,0.9); box-shadow: 5px 0 21px rgba(0,0,0,0.53);}
  .product_area .tex_result_area .mobile_btn { display: block; width: 100%; height: 25px; border-radius:5px ; background: #e7e7e7; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
  .product_area .tex_result_area .mobile_btn img {vertical-align: middle; width: 17px;}
  .product_area .tex_result_area .mobile_btn.on img { transform:rotate(180deg) ; -webkit-transform:rotate(180deg) ; -moz-transform:rotate(180deg) ; -ms-transform:rotate(180deg) ; -o-transform:rotate(180deg) ; }
  .tex_result_area .meun_list {padding: 0 0 10px 0; background: #fff;}
  .tex_result_area .result_menu {margin-top: 10px;  background: none; padding: 0;}
  .tex_result_area .result_menu.off {border: 0;}
  .tex_result_area .result_menu .won {font-size: 13px;}
  
  .tex_result_area .mobile_area {display: none;  overflow: auto;}
  .tex_result_area .mobile_area.open {display: block;}

  .tex_result_area .result_menu .right {font-size: 28px;}
  
  .reservation_list_wrap .space_text .first {flex-wrap: wrap; margin: 0; margin-bottom: 10px;}
  .reservation_list_wrap .space_text  .normal_text.first span {display: block; width: 100%;}
  .reservation_list_wrap .space_text  .normal_text.first span + span {text-align: right;}
  .reservation_list_wrap .space_text  .normal_text.first span + span .won {display: inline-block; width: auto;}
  .product_area .tex_result_area.v2 .img_area {width: 100%;}
  .product_area .tex_result_area.v2 .mobile_area .img_area {margin-top: 10px;}
  .tex_result_area .result_menu.addpadding {padding: 0;}

}

@media all and (max-width:1200px) {
  header .com_layout h1 img {margin-right: 0; max-width: 150px;}
  header .etc_menu .login {margin-right: 0;}
  header .info_list .menu_list ul li a {font-size: 13px;}
  header .etc_menu .select_area {width: 175px; margin-right: 10px;}
  header .etc_menu .select_area span {width: 100%; font-size: 11px;}
  .content .link_area .com_layout a img {margin-right: 0;}

  .reservation_text {float: none; width: 100%; margin-left: 0; margin-top: 20px;}
  .reservation_info {display: flex; justify-content: space-between; padding: 20px 25px; flex-wrap: wrap;}
  .reservation_info .info_box {width: 50%; padding: 0;  margin-bottom: 10px; text-align: center;}
  .reservation_info .info_box:first-child {padding-right: 0;}
  .reservation_info .info_box:nth-child(2) {border-right: 0;}
  .reservation_info .info_box:nth-child(3) {padding-top: 10px; border-top: 1px solid #ccc;}
  .reservation_info .info_box:nth-child(4) {padding-top: 10px; border-top: 1px solid #ccc;}
  .reservation_info .button { position: static; width: 100%; margin-top: 10px; transform:unset ; -webkit-transform:unset ; -moz-transform:unset ; -ms-transform:unset ; -o-transform:unset ; }
  .reservation_list .list_box {padding: 15px;}
  .reservation_list .list_box .reservation_img {float: none; width: 100%;}
  .reservation_list .list_box .reservation_img img {width: 100%;}
  .reservation_info .info_box P {margin-top: 10px;}

  .reservation_text {padding-top: 40px;}
  .reservation_text .sub_title {margin-top: 20px;}
  .reservation_text p {margin: 0;}
  .reservation_list .result_area {margin-top: 20px; padding-top: 15px;}

  .product_area .product_deatil .img_area {float: none; width: 100%;}
  .product_area .reservation_text {border-left: 0;}
  .product_area .reservation_text.v2 {width: 100%;}

  .promotion_wrap .promotion_box .bottom {flex-wrap: wrap;}
  .promotion_wrap .promotion_box .bottom .left {width: 100%;}
  .promotion_wrap .promotion_box .bottom .right {width: 100%;}
  .promotion_wrap .promotion_box .bottom .right img {width: 100%; height: auto;}

  .promotion_wrap .promotion_box .mypage .middle {padding-bottom: 20px;}
  .promotion_wrap .promotion_box .mypage .left img {width: 100%; object-fit: cover;}

  .layer_area .left_area {float: none; width: 100%;}
  .layer_area .right_area{float: none; width: 100%; margin-left: 0; margin-top: 20px;}
  .layer_area.review {overflow: auto;}
  .layer_area.review .left_area {width: 100%;}
  .layer_area.review .right_area {overflow: visible; width: 100%; height: auto; margin-top: 20px;}


  
  
}

@media all and (max-width:1000px) {
  body {font-size: 13px;}
  select, input {padding-left: 10px;}
  .reservation_box .inform .text_area textarea {padding: 5px 10px;}
  .common_button button {font-size: 13px;}

  .layer_area {height: 500px; padding: 15px 0 20px;}
  .layer_area > .top_area {padding-bottom: 10px;}
  .layer_area .top_area > .title {font-size: 18px;}
  .layer_area > .middle_area {margin-top: 15px;}
  .layer_area > .middle_area .img_area {float: none; width: 100%;}
  .layer_area .middle_area .slide_area .menu {font-size: 18px;}
  .layer_area .reservation_wrap {float: none; width: 100%; margin-top: 25px; margin-left: 0;}

  .layer_area .reservation_area {padding: 20px;}
  .layer_area .reservation_area .top_area {flex-wrap: wrap; padding-bottom: 0;}
  .layer_area .reservation_area .top_area .left,
  .layer_area .reservation_area .top_area .right {width: 100%;}
  .layer_area .reservation_area .top_area .right {padding: 10px 0; margin-top: 10px;  border-left: 0; border-top: 1px solid #ccc;}
  .layer_area .reservation_area .number_area {width: 45%;}
  .layer_area .reservation_area .number_area button {width: 20px; height: 20px; line-height: 20px; font-size: 16px;}
  .layer_area .reservation_area .number_area .count {font-size: 16px;}
  .layer_area .reservation_area .count_box {flex-wrap: wrap;}
  .layer_area .reservation_area .count_box .button_area {width: 100%; margin-top: 10px;}
  .layer_area .reservation_area .middle_area {padding: 10px 0;}
  .layer_area .reservation_area .bottom_area {justify-content: space-between;}
  .layer_area .reservation_area .bottom_area > div {width: 50%;}
  .layer_area .reservation_area .bottom_area input {width: 100%; text-align: center;}
  .layer_area .reservation_area .bottom_area select {width: 100%;}
  .layer_area .reservation_wrap .button_area.find {width: 100%; margin-top: 20px;}
  .layer_area .reservation_area .top_area .button_area button,
  .layer_area .reservation_wrap .button_area.find button,
  .layer_area .reservation_area .count_box .button_area button {font-size: 13px;} 
  .layer_area .reservation_wrap .text_area {flex-wrap: wrap;}
  .layer_area .reservation_wrap .text_area:first-child .select,
  .layer_area .reservation_wrap .text_area:first-child .select:last-child {width: 100%; }
  .layer_area .reservation_wrap .text_area:first-child .select:last-child {margin-top: 10px;}
  .layer_area .reservation_wrap .text_area:last-child .select:first-child {width: 100%;}
  .layer_area .reservation_wrap .text_area:last-child .select:nth-child(2) {width: 100%; margin-top: 10px;}
  .layer_area .reservation_wrap .text_area:last-child {margin-top: 10px;}
  .layer_area .reservation_wrap .text_area:last-child .button_area {width: 100%; margin-top: 10px;}
  .layer_area .tab_wrap .left_area {float: none; width: 100%;}
  .layer_area .tab_wrap .left_area .img_area img {width: 100%;}
  .layer_area .tab_wrap .right_area {float: none; width: 100%; margin-left: 0; margin-top: 25px;}
  
  .layer_area .benefit_info {flex-wrap: wrap;}
  .layer_area .benefit_info .info_box,
  .layer_area .benefit_info .info_box:first-child,
  .layer_area .benefit_info .info_box:nth-of-type(2) {width: 100%; padding: 0; border-left: 0; border:0;}
  .layer_area .benefit_info .info_box + .info_box {margin-top: 10px;}
  .layer_area .benefit_info .info_box .title {margin-bottom: 10px;}
  .layer_area .benefit_info ul li span {float: left; width: 53%;}
  .layer_area .benefit_info ul li span.smalltitle {width: 35%; margin-right: 0;}
  .layer_area.v2 .bottom_area {position: relative;  padding-top: 10px; padding-bottom: 60px;}
  /* .layer_area.v2 .reservation_wrap .button_area.find {position: absolute; bottom:10px; left: 0; width: 100%; margin-top: 0;} */
  .layer_area.v2 .reservation_wrap .button_area.find {position: static; margin-top: 20px;}
  .layer_area.v3 {width: 90%;}
  
  section .category_title {height: 50px; font-size: 18px;}
  .join_area, .member_area {margin: 50px auto 80px;}
  .join_area .info_area {margin-top: 0;}
  .join_area .info_area .info_text p {font-size: 18px;}

  .member_area {width: 100%; padding: 0 15px; font-size: 13px;}
  .member_area .join_processing p {margin-top: 20px;}
  .member_area .check_list {margin-top: 40px;}
  .member_area .check_list > .check {padding-bottom: 10px;}
  .member_area .process_box span {width: 30%; background: #fff;}
  .member_area .process_box span::after {right: -50%; width: 100%; z-index: -1;}
  .member_area .process_box span img {margin-right: 5px;}
  .member_area .complete_img img {width: 100%;}

  .date_choice_area {flex-wrap: wrap; padding: 20px;}
  .date_choice_area .choice_box {width: 50%; padding: 0 0 0 3%;}
  .date_choice_area .choice_box:first-child {padding-right: 3%;}
  .date_choice_area .choice_box:last-child {width: 100%; padding: 0; margin-top: 10px;}
  .date_choice_area .choice_box:nth-of-type(2) {border-right: 0;}
  .date_choice_area .select_box select {width: 100%; background-position: 95% center; font-family:auto}
  .date_choice_area .title {margin-bottom: 10px;}
  .date_choice_area .number_area {margin-right: 5%;}
  .date_choice_area .text_list_area ul {padding-left: 0;}
  .text_list_area ul li {font-size: 13px;}
  .reservation_area .table_btn button {width: 49%;}
  .reservation_area .table_btn button:last-child {margin-right: 0;}
  .reservation_area .choice_box .button_area {position: static;}
  .select_calendar {margin-top: 20px; padding: 15px; flex-wrap: wrap;}
  .select_calendar .title {margin-bottom: 20px;}
  .select_calendar .calendar_area {width: 100%; padding-right: 0; border: 0;}
  .select_calendar .data_select {position: relative; padding-left: 0; padding-bottom: 40px; width: 100%; margin-top: 10px;}
  .select_calendar .info_text {bottom: 5%; padding-left: 35px;}
  .select_calendar .info_text::after {width: 30px; height: 30px;}
  .select_calendar .data_select .date_pick button {width: 10%;}
  .data_select .btn_area {bottom: 5px; right: 0;}
  .reservation_area .choice_box .button_area button, .data_select .btn_area button {font-size: 13px;}

  .product_area .reservation_text.v2 {padding: 0 20px;}
  .product_area .reservation_text .text_box {flex-wrap: wrap; padding: 15px 0;}
  .product_area .reservation_text .left_area {float: none; width: 100%; padding: 0;}
  .product_area .reservation_text .right_area {float: none; width: 100%; border: 0; display: block;}
  .product_area .reservation_text .right_area img {width: 100%; height: 100%;}
  .product_area .reservation_text .right_area.border {padding: 0; height: auto; border: 0;}
  .product_area .reservation_text .right_area .count_area {margin-top: 20px;}
  .product_area .reservation_text .text_box.subarea {display: flex; justify-content: space-between;  align-items: center; margin: 0;}
  .product_area .reservation_text .text_box.subarea .left_area {width: 65%; padding: 0;}
  .product_area .reservation_text .text_box.subarea .right_area {width: calc(100% - 70%); padding-left: 0;}
  .product_area .reservation_text .pay_area {margin-top: 15px;}
  .reservation_text .title  {font-size: 16px;}
  .reservation_text .sub_title {margin-top: 16px; font-size: 12px; line-height: 1.5;}
  .product_area .etc_list {padding: 15px 0;}
  .product_area .reservation_text .pay_area span {font-size: 12px;}
  .product_area .number_area {flex-wrap: wrap;}
  .product_area .number_area span { font-size: 13px;}
  .product_area .number_area > span:first-child {width: 100%; margin-bottom: 10px; text-align: right; font-size: 16px;}
  .product_area .total_area {padding: 15px;}
  .product_area .total_area .total_number {font-size: 18px;}
  .product_area .total_area .total_number > strong {font-size: 18px;}
  .reservation_text ul li {font-size: 13px;}

  .common_button.right {display: flex; text-align: center; justify-content: end;}
  .common_button.right button {margin: 0; margin-left: 5px;}
  
  .promotion_wrap .promotion_box .view {padding: 15px;}
  .promotion_wrap .promotion_box .view img {width: 100%;}
  .promotion_wrap .promotion_box .mypage .text_list .text_box {width: 50%; margin: 5px 0; text-align: center;}
  .quesetion_list .question_box {padding: 20px 0;}
  .quesetion_list .question_box p {width: 80%;}
  .layer_area.v2 .reservation_area .select_area {width: 100%; padding:0;}
  .layer_area.v2 .reservation_area .select_area select {background-position: 95%;}


}

@media all and (max-width:768px) {
  .pc {display: none;}
  .mo {display: block;}
  .content .com_tab_area .tab_button li {font-size: 12px;}

  section .category_title span {font-size: 16px;}
  header .mobile_menu button {display: block;}
  .top_btn {display: block; position: fixed; bottom:15%; right: 20px; width: 60px; height: 60px; z-index: 100;}
  .top_btn img {width: 100%;}
  header {position: relative;}
  header .com_layout {position: relative; height: 60px; padding: 0;}
  header .com_layout h1 img { position: absolute; top:50%; left:50%; transform:translate(-50%, -50%) ; -webkit-transform:translate(-50%, -50%) ; -moz-transform:translate(-50%, -50%) ; -ms-transform:translate(-50%, -50%) ; -o-transform:translate(-50%, -50%) ; }
  header .com_layout .info_list {display: none; position: absolute; width: 100%; top:60px; background: #fff; z-index: 100;} 
  header .com_layout .menu_list, header .com_layout .etc_menu {display: block;}
  header .info_list .menu_list ul {display: block;}
  header .info_list .menu_list ul li {padding: 10px; border-bottom: 1px solid #aaa;}
  header .info_list .menu_list ul li:last-child {border-bottom: 0;}
  header .info_list .menu_list ul li a {font-size: 13px;}
  header .com_layout .etc_menu { position: static; transform:none ; -webkit-transform:none ; -moz-transform:none ; -ms-transform:none ; -o-transform:none ; }
  header .etc_menu .select_area {width: 96.5%; height: 30px; margin:0 auto; background-position: 98% center;}
  header .etc_menu .select_area span {height: 30px; line-height: 30px; font-size: 13px;}
  header .etc_menu .login_area {margin-top: 25px; padding: 0 15px; justify-content: space-between; flex-direction: row-reverse;  background: #3c465e; }
  header .etc_menu select {padding-left: 0; color: #ccc; background: url('../images/icon_triangle.png') no-repeat 95% 17px; background-size: 10px;}
  header .etc_menu .login {color: #fff;}

  section .content {margin-top: 40px;} 
  .content .title {font-size: 20px;}
  section .top_banner_info {height: 60px;}
  .top_banner_info .text_area span {font-size: 16px;}
  .top_banner_info .search_area a {display: none;}
  .com_banner.sub .tab_view p {margin-top: 10px;}
  .content .link_area .com_layout {display: block;}
  .content .link_area .com_layout a {margin-right: 0; padding: 0 30px 0 20px;}
  .content .link_area .com_layout a + a {margin-top: 10px;}
  .content .link_area .com_layout a img {margin-right: 5%;}
  .content .link_area .com_layout a p {font-size: 13px;}
  /* .content .com_tab_area .tab_button li {margin-right: 3%;} */

  .com_banner.sub .box {height: 380px;}
  .com_banner.sub .box .content_text {padding: 15px 10px;}
  .com_banner.sub .box .content_text p {margin-top: 0; margin-bottom: 20px; font-size: 16px;}
  .com_banner.sub .box .content_text .reply {margin-top: 15px;}
  .com_banner.sub .box .content_text span {font-size: 13px;}
  .common_button.right {justify-content: space-between;}
  .common_button button {width: 46.5%; min-width: unset; height: 35px; line-height: 35px; padding: 0 1%; }

  footer .top_area ul {display: inline-block; padding: 10px 0; height: auto;}
  footer .top_area ul li {display: inline-block; padding: 5px 3px;}
  footer .top_area ul li a {padding: 5px 0 ;}
  footer .top_area ul li:nth-child(2):after {display: none;}
  footer .bottom_area ul li strong {display: block;}
  footer .bottom_area ul li span {display: inline-block; padding: 0; padding-right: 7px;}

 .join_area {width: 100%; padding: 0 15px; }
 .join_area .sns_area {flex-wrap: wrap; margin-top: 30px;}
 .join_area .sns_area a {margin-right: 0;}
 .join_area .sns_area a + a {margin-top: 10px;}
 .join_area .info_area { flex-wrap: wrap; border-radius:38px ; -webkit-border-radius:38px ; -moz-border-radius:38px ; -ms-border-radius:38px ; -o-border-radius:38px ; }
 .join_area .info_area .img_area img.pc{display: none;}
 .join_area .info_area .img_area img.mo {display: block;}
 .join_area .info_area .img_area img {width: 100%;}
 .join_area .info_area .info_text {flex-wrap: wrap; padding-left:0; padding: 0 20px; margin: 20px 0;}
 .join_area .info_area .info_text p {width: 100%; padding-right: 0; font-size: 15px;}
 .join_area .info_area .info_text p br {display: none;}
 .join_area .info_area .info_text ul {width: 100%; margin-top: 10px; padding-left: 0; border-left: 0;}
 .join_area .info_area .info_text ul li {margin-bottom: 5px; font-size: 13px;}
 .join_area .text_area span {display: block;}
 .join_area .text_area a {display: block; margin-top: 10px;}
 .member_area .process_box span {width: 30%; height: 40px; line-height: 40px; background: #dcdcdc;  font-size: 13px;}
 .member_area .process_box span img {display: none;}
 .member_area .join_input_area .input_text {display: block;}
 .member_area .join_input_area .input_text + .input_text {margin-top: 10px;}
 .member_area .join_input_area .input_text .title {width: 100%; margin-bottom: 5px;}
 .member_area .join_input_area .input_text .input_box {width: 100%;}
 .member_area .join_input_area .input_text .left, 
 .member_area .join_input_area .input_text .right {float: none; display: block; width: 100%;}
 .member_area .join_input_area .input_text .right {margin-top: 10px;}
 .member_area .join_input_area .input_text .left .title,
 .member_area .join_input_area .input_text .right .title {display: block; width: 100%;padding-left: 0;}
 .member_area .join_input_area .select_box {width: 100%;}
 .member_area .join_input_area .select_box select {width: 100%;}
 .member_area .join_input_area .select_box select + select {margin-top: 5px;}
 .member_area .join_input_area .input_box .input_btn input[type='text'], 
 .member_area .join_input_area .input_text .right .input input[type="text"] {width: 77.9%;}
 .member_area .join_input_area .input_box a, .member_area .join_input_area .input_text .right .input a {width: calc(100% - 80%); margin-left: 1%; font-size: 12px;}
 .member_area .agree_area .check {margin-bottom: 5px;}
 .member_area .agree_area .list_box {padding: 15px;}

 .date_choice_area .choice_box {width: 100%; padding: 0;}
 .date_choice_area .choice_box:first-child {padding: 0; border:0;}
 .date_choice_area .choice_box + .choice_box {margin-top: 10px;}
 .reservation_area .count_box {flex-wrap: wrap;}
 .reservation_area .choice_box .button_area {width: 100%; margin-top: 10px;}
 .text_list_area {flex-wrap: wrap;}
 .text_list_area ul{width: 100%; padding-left: 0;}
 .text_list_area ul:first-child {width: 100%; border: 0;}

 .date_choice_area .number_area {width: 48%; margin-right:0;}

 .reservation_area .number_area .count {font-size: 18px;}
 .reservation_area .number_area button {width: 25px; height: 25px; line-height: 1.2;} 
 .resturant_info {flex-wrap: wrap;}
 .resturant_info .slide_img {width: 100%; height: auto;}
 .resturant_info .slide_img img {width: 100%;}
 .resturant_info .resturant_text {padding-left: 0; margin-top: 20px;}
 .resturant_info .resturant_text .address {margin-top: 10px;}
 .resturant_info .resturant_text .parking {margin-top: 10px;}
 .select_calendar .data_select .date_pick {margin-bottom: 20px;}
 .select_calendar .data_select .date_pick button {width: 30%; }

 .reservation_text p {line-height: 1.6; font-size: 12px;}
 .reservation_list .list_text .blue {font-size: 16px;}
 .reservation_info .info_box {display: flex; align-items: center; width: 100%; border: 0; padding: 15px 0!important; margin-bottom: 0; border-bottom: 1px solid #fff;}
 
 .reservation_info .info_box P {margin-top: 0; margin-left: 5px;}
 .reservation_info .info_box:nth-child(3) {border-top: 0;}
 .reservation_info .info_box:nth-child(4) {border: 0;}
 .reservation_info .info_box .title {display: inline-block; width: 60px; text-align: left;}
 .reservation_text ul li span {font-size: 12px;}

 .product_area .reservation_text .pay_area {text-align: right;}
 .product_area .reservation_text .text_box.subarea .left_area {width: 100%;}
 .product_area .reservation_text .text_box.subarea .right_area {width: 100%; margin-top: 10px;}
 .product_area .number_area {align-items: center; justify-content: end;}
 .product_area .number_area > span {margin: 0 10px;}
 .product_area .number_area > span:first-child {width: auto; margin-bottom: 0; margin-right: 10px;}


 .com_tab_area.v2 button {width: 50%; font-size: 15px;}
 .review_list .review_box {padding: 15px 0;}
 .review_list .review_box .left {position: relative; float: none; width: 100%; height: auto; margin-bottom: 20px;}
 .review_list .review_box .review_btm {position: absolute; right: 0; top:0; margin-top: 0;}
 .review_list .review_box .review_btm button {padding: 5px;}
 .review_list .review_box .right {float: none; width: 100%; padding-left: 0; border: 0;}
 .review_list .review_box .view_text {margin-left: 3%;}

 .count_btn  {align-items: end;}
 .layer_area .left_area {float: none; width: 100%;}
 .layer_area .left_area img {width: 100%;}
 .layer_area .left_area.review img {width: 100%;  height: 100%;}
 .layer_area .right_area.scroll {overflow: visible; float: none; width: 100%; height: auto; margin-top: 20px; margin-left: 0;}
 .layer_area .right_area .review_text {margin-bottom: 20px;}
 .layer_area .right_area .title {margin-top: 15px;}
 .layer_area .upload_area {width: 100%; height: 250px}
.com_banner.main .swiper-button-prev {right: 40px;}
  .swiper_button .swiper-button-next, .swiper_button .swiper-button-prev{width: 40px; height: 40px; top: 45%;} 

  .reservation_list .mobile_tab {display: block; }
  .reservation_list .mobile_tab ul {display: flex; justify-content: center;}
  .reservation_list .mobile_tab ul li {margin-right: 4%; padding-bottom: 10px; color: #888;}
  .reservation_list .mobile_tab ul li.on {color: #172f55; font-weight: 700; border-bottom: 2px solid #172f55;}
  .reservation_list .list_box {border: 0; padding: 0;} /* 탭이 공통부분이다 */
  .reservation_list .list_box.moblie_on {display: block; font-weight: 700;}
  .reservation_list .list_box .reservation_text {padding-top: 0;}
  
  .promotion_wrap {margin-top: 10px;}
  .promotion_wrap .promotion_box .bottom .left {padding: 25px;}
  .promotion_wrap .promotion_box .bottom .left .title {margin-bottom: 10px; font-size: 14px;}
  .promotion_wrap .promotion_box .bottom .left span {font-size: 13px;}
  .promotion_wrap .promotion_box .bottom .title_btn {margin-top: 15px;}
  .promotion_wrap .promotion_box + .promotion_box {margin-top: 20px;}
  .promotion_wrap .promotion_box .view_text {margin-top: 10px;}

  .com_tab_area.mobile {padding-top: 30px;}
  .com_tab_area.v2 + .select_area {margin-top: 0; top: -25px;}
  /* 프로모션 swiper 모바일 css 추가 */
  .com_tab_area.v2.mobile .promDinSwiper {width: 100%;} 

  .promotion_wrap .promotion_box .top {flex-wrap: wrap;}
  .promotion_wrap .promotion_box .top > * {width: 100%; margin-top: 10px;}
  .promotion_wrap .promotion_box .top > span {font-size: 18px;}
  .promotion_wrap .promotion_box .top p {margin-top: 15px; text-align: right;}

  .promotion_wrap .promotion_box .mypage .left {padding: 10px 10px 0 10px;}
  .promotion_wrap .promotion_box .mypage .left img {width: 100%;}
  .promotion_wrap .promotion_box .mypage .top span:last-child {text-align: right;}
  .promotion_wrap .promotion_box .mypage .top .title {margin-top: 0;}
  .promotion_wrap .promotion_box .mypage .middle {margin-top: 10px;}
  .promotion_wrap .promotion_box .mypage .middle .main_title {margin-top: 10px; font-size: 16px;}
  .promotion_wrap .promotion_box .mypage .total_count {margin-top: 10px; padding: 10px 15px;}
  .promotion_wrap .promotion_box .mypage .right {padding: 0 10px;}
  .promotion_wrap .promotion_box .mypage .common_button {justify-content: space-between; padding: 0;}
  .promotion_wrap .promotion_box .mypage .common_button.right button {margin-left: 0; line-height: 30px;}
  .promotion_wrap .promotion_box .mypage .text_list {flex-wrap: wrap;}
  .promotion_wrap .promotion_box .mypage .total_count span {font-size: 16px;}
  .promotion_wrap .promotion_box .mypage .text_list .text_box {width: 100%; margin: 5px 0; text-align: left; padding: 0; border: 0;}
  .promotion_wrap .promotion_box .mypage .text_list .text_box span {font-weight: 600;}

  .reservation_text .time .list_title{width: 70px;}

  .qa_list .ask_area .top {flex-wrap: wrap;}
  .qa_list .ask_area .top .title {width: 100%; font-size: 14px;}
  .qa_list .ask_area .top .date {width: 100%; margin-top: 10px; text-align: right;}
  .qa_list .ask_area .bottom {padding: 10px 0;}
  .qa_list .admin_area .top .admin_title {font-size: 14px;}
  .qa_list .admin_area .top .answer_btn {height: 25px; line-height: 25px; font-size: 10px;}
  .qa_list .admin_area .answer_area {margin-top: 0;}
  .resgiter_area .select {width: 100%;}

  .layer_area .cancel_list {flex-wrap: wrap;}
  .layer_area .cancel_list .box {width: 48%; margin: 0 1% 1% 0;}
  .layer_area .cancel_list .box .title {margin-bottom: 20px;}
  .layer_area .cancel_list .box .bottom {width: 100%;}

  .layer_area .upload_list {width: 100%;}
  .layer_area .write_area {width: 100%; margin-left: 0; margin-top: 20px;}
  .layer_area .write_area .common_button button {height: 40px; min-width: unset;}
  .layer_area > .middle_area .benefit_area {height: auto;}
  .layer_area .tab_wrap .tab_button li {width: 33.333%; height: 30px; line-height: 30px; font-size: 13px;}
  .layer_area .benefit_info ul li span {width: 60%; padding-left: 17px;}
  .layer_area > .middle_area .img_area {height: auto; overflow: visible;}
  .layer_area .top_area > .title {font-size: 16px;}
  .layer_area .pravite_warp .text_box p {font-size: 12px;}
  .reservation_list .reservation_box {padding: 15px 20px;}
  .reservation_list .reservation_box .title {font-size: 16px;}
  .reservation_list .reservation_box .check {padding: 0;}
  .reservation_box .bottom {margin-top: 20px;}
  .reservation_box ul {margin-top: 10px;}
  .reservation_box .inform .left {float: none; width: 100%;}
  .reservation_box .inform .email > span {margin: 0 1%;}
  .reservation_box .inform .right {float: none; width: 100%; margin-top: 10px;}

  .phone .select {width: 75%;}

  .reservation_box .inform .radio_area {flex-wrap: wrap; padding-top: 0;}
  .reservation_box .inform .radio_area .radio {width: 100%; margin-right: 0;}
  .reservation_box .inform .radio_area .radio + .radio {margin-top: 10px;}
  .reservation_box .check_area .check {width: 100%; margin-right:0;}
  .reservation_box .check_area .check + .check {margin-top:10px;}
  .reservation_box .check_area .check_input {flex-wrap: wrap; margin-top: 5px;}
  .reservation_box .check_area .check_input .check {width: 100%; margin-right: 1%;}
  .reservation_box .check_area .check_input .input {width: 100%; margin-top: 10px;}
  .reservation_list_wrap .result_box {padding: 30px 0;}
  .reservation_list_wrap .result_box .point_area {flex-wrap: wrap;}
  .reservation_list_wrap .result_box .point_area > div {float: none; width: 100%;}
  .reservation_list_wrap .result_box .point_area > .right {margin-top: 10px;}
  .reservation_list_wrap .result_box .point_area .point_content {flex-wrap: wrap;}
  .reservation_list_wrap .result_box .point_area .point_content .check {margin-left: 0;}
  .reservation_list_wrap .result_box .point_area .point_content .point_title {display: block; width: 100%; margin-bottom: 10px;}
  .reservation_list_wrap .result_box .point_area .point_content .input {width: 50%;}
  .reservation_list_wrap .result_box .number_box {float: none; width: 100%; border-left: 0; margin-bottom: 10px; border-bottom: 1px solid #ccc;}
  .reservation_list_wrap .result_box .number_box span {padding: 0; margin-bottom: 5px;} 
  .reservation_list_wrap .result_box .number_box:nth-of-type(3), .reservation_list_wrap .result_box .number_box:nth-of-type(4)  {width: 100%;}
  .reservation_list_wrap .result_box .number_box:last-child {border-bottom: 0;}
  .reservation_list_wrap .result_box .number_box .title {margin-bottom: 5px;}
  .reservation_list_wrap .final_check {margin-top: 20px;}
  .reservation_list_wrap .result_box:last-child {padding: 30px 0 0;}
  .reservation_list_wrap .common_button.right {justify-content: center;}
  .reservation_list_wrap .common_button.right button {margin: 0 1%; font-size: 12px;}
  .reservation_list_wrap .result_box > .title {margin-bottom: 15px; font-size: 17px;}
  .reservation_list_wrap .result_box .text_list {margin-top: 15px;}

  .reservation_box .detail_list span {width: 100px; padding-left: 2%; margin-right: 1%;}
  .resturant_info .resturant_text .text, .resturant_info .resturant_text .title {font-size: 13px;}
  .resturant_info .resturant_text .address {background-position: left 0;}
  .resturant_info .resturant_text .time_list li.time span:first-child {background-position: left 0;}

  .resturant_info .slide_img .swiper-pagination-fraction {bottom: 5px; }

  .check input[type="checkbox"] + label {font-size: 12px;}
  .member_area .agree_area .top .btn_area button {font-size: 12px;}
  .member_area .agree_area .list_box p {font-size: 12px;}

  .layer_area .layer_check {flex-wrap: wrap;}
  .layer_area .layer_check .check {width: 100%;}
  .layer_area .layer_check .check + .common_button.right {margin-top: 20px;}

  .product_area .tex_result_area.v2 .img_area {width: 100%;}

  .tex_result_area .title {font-size: 14px;}
  .tex_result_area .meun_list ul li .blue {font-size: 14px;}
  .tex_result_area .meun_list span {margin-top: 0;}
  .tex_result_area .result_menu .right {font-size: 20px; }
  .mt30 {margin-top: 15px!important;}
  .tex_result_area .meun_list ul {padding-bottom: 0;}
  .tex_result_area .meun_list ul li span {font-size: 12px;}
  .quesetion_list {margin-top: 15px;}
  .quesetion_list .question_box {padding: 10px 0;}
  .quesetion_list .question_box p {width: 70%; margin-top: 10px;}
  .com_tab_area.v2 button {width: auto; height: 35px; line-height: 35px; padding: 0; margin-right: 10px; border: 0;}
  .com_tab_area.v2 button.on {border: 0;}
  .com_tab_area.v2 button.on::after {display: none;}
  .resgiter_area th, .resgiter_area td {padding: 5px 0;}
  .count_btn .btm_area button {width: 35px; height: 35px;}
  .layer_area.v3 > .middle_area > div img {width: 100%;}
  .reservation_text .title {margin-top: 10px;}
  .reservation_list .result_area {margin-top: 10px; padding-top: 5px;}
  .reservation_info .button {height: 35px; font-size: 14px;}
  .select_calendar .calendar_area .img_area img {width: 100%;}
  .reservation_list .open_button {position: relative; width: 100%; justify-content: end;}
  .reservation_list .open_button button {width: auto}

  .tex_result_area .meun_list .mobile_area > span {font-size: 16px; margin: 10px 0 5px;}

  .layer_area .layer_tab_wrap .tab_button {display: block;}
  /* swiper css 수정 */
  /* .layer_area .layer_tab_wrap .tab_button button {width: auto; margin-right:3%;} */
  .reservation_area {margin: 25px 0 35px;}
  .reservation_list .common_button {margin-top: 0; padding-top:0;}
  .reservation_list .open_button button {padding: 5px 20px;}


  .layer_area > .middle_area .img_area.v2 {overflow: auto; height: 180px;}
  .layer_area.v2 .bottom_area {display: block; padding-bottom: 10px;}
  .layer_area.v2 .bottom_area .cal_area {overflow: auto;}
  .layer_area.v2 .select_calendar .data_select {padding-bottom: 0;}
  .layer_area.v2 .select_calendar .data_select .date_pick {margin-bottom: 0;}
  /* .layer_area.v2 .reservation_wrap .button_area.find {position: static; margin-top: 20px;} */

  .layer_area.v3 .weather_area .weather_list .weather_box {padding: 5px 10px;}
  .layer_area.v3 .weather_area .weather_list .weather_box + .weather_box {margin-top: 15px;}
  .layer_area.v3 .weather_area .weather_list .weather_box .weather_check img {width: 35px;}
  
  
}

@media all and (max-width:344px)  {
  /* .common_button button {width: 45.5%;} */
  .member_area .join_input_area .input_box .input_btn input[type='text'], .member_area .join_input_area .input_text .right .input input[type="text"] {width: 76.9%;}
}