/* ==================== 화면 아래 고정된 광동 간편예약 버튼 ==================== */

#btnAskLogo {
  position: fixed;
  right: 65px;
  bottom: 50px;
  z-index: 9999;
  transition: bottom .2s;
}
@media screen and (max-width: 1700px) {
  #btnAskLogo {
    right: 5%;
  }
}
@media screen and (max-width: 991.98px) {
  #btnAskLogo {
    right: 20px;
    bottom: 50px;
  }
}
@media screen and (max-width: 680px) {
  #btnAskLogo {
     bottom: 106px;
  }
}
#btnAskLogo.on .item-wrap {
  pointer-events: auto;
}
#btnAskLogo.on .item-wrap a {
  margin-top: 0;
  opacity: 1;
  transition: all 0.3s;
}
#btnAskLogo.on .ask-msg {
  opacity: 0;
  right: 60px;
}
#btnAskLogo.is-reservation {
  bottom: 135px;
}
@media screen and (max-width: 1300px) {
  #btnAskLogo.is-reservation {
     bottom: 180px;
  }
}
@media screen and (max-width: 680px) {
  #btnAskLogo.is-reservation {
     bottom: 116px;
  }
}
#btnAskLogo .topBtn {
	display: none;
   box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.05);
}
@media screen and (max-width: 680px) {
  #btnAskLogo .topBtn {
	display: block;
  }
}
@media screen and (max-width: 680px) {
  #btnAskLogo .topBtn a {
     width: 48px;
     height: 48px;
  }
  #btnAskLogo .topBtn a:after {
     font-size: 30px;
  }
}
#btnAskLogo .logo {
  position: relative;
  width: 60px;
  height: 60px;
  z-index: 1000;
  background: url("/img/btn_ask_logo.png") no-repeat center/contain;
  border-radius: 50%;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
  cursor: pointer;
}
@media screen and (max-width: 991.98px) {
  #btnAskLogo .logo {
    width: 40px;
    height: 40px;
  }
}
@media screen and (max-width: 680px) {
  #btnAskLogo .logo {
   	display: none;
  }
}
#btnAskLogo .ask-msg {
  position: absolute;
  right: 80px;
  bottom: 10px;
  padding: 9px 30px 10px;
  font-size: 14px;
  text-align: center;
  background: #fff;
  border-radius: 22px;
  color: #333;
  overflow: hidden;
  z-index: 500;
  white-space: nowrap;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.15);
  transition: all 0.3s;
}
@media screen and (max-width: 991.98px) {
  #btnAskLogo .ask-msg {
    right: 50px;
    bottom: 4px;
    padding: 7px 10px 8px 15px;
    font-size: 13px;
  }
}
@media screen and (max-width: 680px) {
  #btnAskLogo .ask-msg {
   	display: none;
  }
}
#btnAskLogo .item-wrap {
  position: absolute;
  right: 0;
  bottom: 70px;
  display: flex;
  flex-wrap: wrap;
  width: 250px;
  gap: 7px;
  pointer-events:none;
}
@media screen and (max-width: 680px) {
  #btnAskLogo .item-wrap {
   	display: none;
  }
}
#btnAskLogo .item-wrap a {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: -15px;
  width: 250px;
  height: 60px;
  padding: 0 10px;
  gap: 10px;
  background-color: #fff;
  border-radius: 5px;
  opacity: 0;
  transition: none;
  cursor: pointer;
  box-shadow: 0 0 7px 0px rgba(0, 0, 0, 0.1);
}
#btnAskLogo .item-wrap .icon {
  width: 40px;
  height: 30px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
#btnAskLogo .item-wrap .icon.location {
  background-image: url("/img/ask_icon_1.png");
}
#btnAskLogo .item-wrap .icon.kakao {
  background-image: url("/img/ask_icon_2.png");
}
#btnAskLogo .item-wrap .icon.call {
  background-image: url("/img/ask_icon_3.png");
}
#btnAskLogo .item-wrap .content {
  flex: 1;
}
#btnAskLogo .item-wrap .title {
  margin-bottom: 3px;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.2;
  color: #111;
}
#btnAskLogo .item-wrap .desc {
  font-size: 12px;
  line-height: 1.2;
  color: #555;
}





/* ========================== Quick  ==================== */
#quick {
  position: fixed; left:0; bottom: -91px; width:100%; z-index:999; transition:all 0.3s;
}
@media all and (max-width: 1199.98px){
  #quick {
    bottom: 79px;
  }
}
@media all and (max-width: 680px){
  #quick {

  }
}
#quick.on { bottom: 0; transition:all 0.5s;}
@media all and (max-width: 1199.98px){
  #quick.on {bottom: 75px;}
}
@media all and (max-width: 767.98px){
  #quick.on {bottom: 75px;}
}
@media all and (max-width: 680px){
  #quick.on {bottom: 75px;}
}


#quick .top {
  cursor: pointer;
  width: fit-content;
  background-color: #fff;
  border: 2px solid #eb6215;
  border-bottom: 3px solid #fff;
  border-radius: 10px 10px 0 0;
  padding: 18px 35px;
  display: flex;
  gap: 15px;
  align-items: center;
  justify-content: center;
  margin: 0 auto -3px;
  z-index: 2;
  position: relative;
}
@media screen and (max-width: 1199.98px) {
  #quick .top {
    display: none;
  }
}
#quick .top .quick-logo {
  width: 133px;
}
#quick .top p {
  font-size: 28px;
  font-weight: 600;
  color: #eb6215;
}
#quick .top .quick-btn {
  width: 31px;
  transition: transform 0.3s ease;
}
#quick .top .quick-btn.rotate {
  transform: rotate(180deg);
}






#quick .quick_in{
    display: flex;
    gap: 31px;
    background-color: #fff;
    border: 2px solid #eb6215;
    padding: 18px 35px;
    border-radius: 10px;
    align-items: center;
}

@media all and (max-width: 1199.98px){
   #quick .quick_in{
        flex-wrap: wrap;
        border: 0px solid;
        border-radius: 20px 20px 0 0;
        width: 100%;

        position: relative;

        transition: all 0.5s;
        flex-direction: column;
        gap: 20px;
        box-shadow: 0 0 7px 10px rgba(0, 0, 0, 0.05);
    }
}

@media all and (max-width: 680px){
  #quick .quick_in { padding: 10px;}
}

#quick .quick_in form { width: 100%; }

#quick .quick_in .form_wrap { column-gap: 30px; flex-wrap: nowrap; max-width:none; }
@media all and (max-width: 991.98px) {
  #quick .quick_in .form_wrap { flex-wrap: wrap; column-gap: 10px; row-gap: 10px;}
}

#quick .quick_in .form_list { gap: 10px; justify-content: center; }
@media all and (max-width: 1399.98px){
#quick .quick_in .form_list {
  width: 55%;
}
}

@media all and (max-width: 991.98px){
#quick .quick_in .form_list {
 width: 100%;
}
#quick .form_list dl {
  width: 48% !important;
  margin: 0 !important;
}
#quick .form_list dl:nth-child(3) {
  width: 98% !important;  
}
}



#quick .quick_in input {
    height: 50px;
    background-color: #fff1e8;
    border-radius: 9px;
    border: 1px solid #c5c4c2;
    padding: 15px;
	font-size: 16px;
    font-weight: 500;
    color: #333;
}
@media all and (max-width: 767.98px) {
  #quick .quick_in input {
     height: 30px;
  }
}
#quick .quick_in input[type="checkbox"] {
  -webkit-appearance: none;
    width: 20px;
    height: 20px;
    padding: 0;
    border-radius: 0;
    background: #fff;
}





#quick .topBtn { position: absolute; right:40px; top:50%; margin-top: -25px;}
@media all and (max-width:1500px){
   #quick .topBtn {right:5%;}
}
@media all and (max-width:1300px){
  #quick .topBtn {right: 5%; top:auto; margin-top: 0; bottom: 20px;}
}
@media all and (max-width: 680px){
  #quick .topBtn { display:none; bottom: 65px; }
}

.topBtn.topBtn2.pc{}
@media all and (max-width:768px){
  .topBtn.topBtn2.pc{display: none;}
}
#quick .topBtn.topBtn2.mo {
  display: none;
}
@media all and (max-width:768px){
  .topBtn.topBtn2.mo{display: block;}
}


.topBtn a { display:block; width:50px; height:50px; background:var(--sub); position: relative; transition:all .3s linear; font-size:0;}
@media all and (max-width: 680px){
  .topBtn a { width:40px; height:40px;}
}
@media all and (min-width: 680px){
  .topBtn a:hover { background:var(--main);}
}
.topBtn a:after{content:'\e25a'; display:block; font-size:28px; color:var(--white); position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-family:var(--icon);}
@media all and (max-width: 680px){
  .topBtn a:after{font-size:22px;}
}


#quick .form_btn button {
	background-color: #eb6215;
    border-radius: 9px;
    padding: 0 10px;
    color: #ffeaea;
    font-size: 17px;
    font-weight: 600;
	line-height: 1.1;
	letter-spacing: 0;
}
@media (max-width: 1199.98px) {
  #quick .form_btn button {
     width: 120px;
  }
}
@media (max-width: 767.98px) {
  #quick .form_btn button {
     height: 35px; font-size: 15px;
  }
}
#quick .form_btn button:before { margin-right: 6px; }

@media (max-width: 680px) {
  .form_btn {
    margin-left: auto;
  }
  .form_btn .btn_confirm {
     width: 100px;
  }
}

@media (max-width: 680px) {
#quick .agree_con {
  width: 48%;
}
}
#quick .privacy_agree { 
	padding: 20px 24px 0;
    border: 1px solid #ddd;
    border-radius: 10px;
    background: #fff;
    z-index: 9;
    bottom: 63px;
}
#quick .privacy_agree .btnClose {
	display: flex;
  justify-content: flex-end;
  cursor: pointer;
}
#quick .privacy_agree .btnClose img {
  width: 30px;
}
@media screen and (max-width: 991.98px) {
   #quick .privacy_agree .btnClose img {
    width: 20px;
  }
}
#quick .privacy_agree textarea {
    border: none;
    z-index: 998;
    resize : none;
    position: relative;
}


/* 	붙이기 */
#quick {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;
}
@media screen and (max-width: 1199.98px) {
  #quick {
    width: 100%;
    bottom: -150px;
  }
}
@media screen and (max-width: 991.98px) {
  #quick {
    z-index: 99;
  }
}
#quick.on {
 z-index: 9991;
}
#quick .down {
  display: none;
}
@media screen and (max-width: 1199.98px) {
  #quick .down {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    width: 100%;
    background-color: #fff;
    cursor: pointer;
    padding-bottom: 17px;
  }
}
@media screen and (max-width: 370px) {
#quick .down  {
    gap: 16px;
}
}
#quick .down > div {
  display: flex;
  gap: 5px;
  align-items: center;
}
@media screen and (max-width: 1199.98px) {
#quick .down > div p {
	font-size:20px;
    font-weight: 600;
}
}
@media screen and (max-width: 370px) {
#quick .down > div p {
	font-size: 18px;
}
}
#quick .down .line {
  width: 0.5px;
  height: 18px;
  background-color: #eb6215;
}
@media screen and (max-width: 1199.98px) {
  #quick .down .line {
    display: block !important;
  }
}
#quick .down img {
  transform: rotate(90deg);
  width: 23px;
}
#quick .top {
  cursor: pointer;
  width: fit-content;
  background-color: #fff;
  border: 2px solid #eb6215;
  border-bottom: 2px solid #fff;
  border-radius: 10px 10px 0 0;
  padding: 18px 35px;
  display: flex;
  gap: 25.5px;
  align-items: center;
  justify-content: center;
  margin: 0 auto -2px;
  z-index: 2;
  position: relative;
    bottom: -0.5px;
}
@media screen and (max-width: 1199.98px) {
  #quick .top {
    display: none;
  }
}
#quick .top > div {
  display: flex;
  gap: 8px;
}
#quick .top .quick-logo {
  width: 133px;
  margin-right: 7.5px;
}
#quick .top p {
  font-size: 28px;
  font-weight: 600;
  color: #eb6215;
}
#quick .top .quick-btn,
#quick .top .quick-btn1 {
  width: 31px;
  transition: transform 0.3s ease;
}
#quick .top .quick-btn.rotate,
#quick .top .quick-btn1.rotate {
  transform: rotate(180deg);
}
#quick .top .line {
  width: 0.5px;
  height: 26px;
  background-color: #eb6215;
}
#quick .bottom {
  display: flex;
  gap: 31px;
  background-color: #fff;
  border: 2px solid #eb6215;
  padding: 18px 35px;
  border-radius: 10px;
  align-items: center;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom {
    flex-wrap: wrap;
    border: 0px solid;
    border-radius: 0;
    width: 100%;
    padding: 17px 20px;
    position: relative;
    bottom: -1px;
    transition: all 0.5s;
    flex-direction: column;
    gap: 20px;
  border-radius: 20px 20px 0 0;
    box-shadow: 0px -7px 7px 0px rgba(0, 0, 0, 0.1);
  }
}
#quick .bottom .input-area {
  display: flex;
  gap: 31px;
  line-height: 1;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .input-area {
    gap: 10px 1%;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
  }
}
#quick .bottom .input-area input {
  height: 50px;
  background-color: #fff1e8;
  border-radius: 9px;
  border: 1px solid #c5c4c2;
  padding: 15px;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .input-area input {
    padding: 10px 14px;
    height: 30px;
    border-radius: 6px;
  }
}
#quick .bottom .input-area input::placeholder {
  color: #eb6215;
  font-weight: 600;
  font-size: 15px;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .input-area input::placeholder {
    font-size: 11px;
  }
}
#quick .bottom .input-area input:nth-child(1) {
  width: 150px;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .input-area input:nth-child(1) {
    width: 49%;
  }
}
#quick .bottom .input-area input:nth-child(2) {
  width: 200px;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .input-area input:nth-child(2) {
    width: 49%;
  }
}
#quick .bottom .input-area input:nth-child(3) {
  width: 300px;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .input-area input:nth-child(3) {
    width: 82%;
  }
}
@media screen and (max-width: 991.98px) {
  #quick .bottom .input-area input:nth-child(3) {
    width: 80%;
  }
}
@media screen and (max-width: 543.98px) {
  #quick .bottom .input-area input:nth-child(3) {
    width: 70%;
  }
}
@media screen and (max-width: 349.98px) {
  #quick .bottom .input-area input:nth-child(3) {
    width: 60%;
  }
}
#quick .bottom .input-area .pc {
  display: none;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .input-area .pc {
    display: block;
    font-size: 11px;
    padding: 9px 15px;
    border-radius: 6px;
    width: 16%;
    text-align: center;
  }
}
@media screen and (max-width: 991.98px) {
  #quick .bottom .input-area .pc {
    width: 18%;
  }
}
@media screen and (max-width: 543.98px) {
  #quick .bottom .input-area .pc {
    width: 29%;
  }
}
@media screen and (max-width: 349.98px) {
  #quick .bottom .input-area .pc {
    width: 39%;
  }
}
#quick .bottom .line {
  width: 1px;
  height: 18px;
  background-color: #eb6215;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .line {
    display: none;
  }
}
#quick .bottom .agree {
  cursor: pointer;
  display: flex;
  gap: 8px;
  align-items: center;
  color: #4b4b4b;
  font-size: 14px;
  white-space: nowrap;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .agree {
    font-size: 11px;
  }
}
#quick .bottom .agree input[type=checkbox] {
  width: 18px;
  height: 18px;
  border: 1px solid #ddd;
  cursor: pointer;
}
#quick .bottom .agree input[type=checkbox]:checked {
  background-color: #eb6215;
  box-shadow: inset 0px 0px 0px 3px #fff;
}
#quick .bottom .agree img {
  width: 15px;
  height: 12px;
}
#quick .bottom .agree .button {
  color: #4b4b4b;
  font-size: 13px;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .agree .button {
    font-size: 11px;
  }
}
#quick .bottom .button {
  background-color: #eb6215;
  border-radius: 9px;
  padding: 19px 31px;
  color: #ffeaea;
  font-size: 15px;
  font-weight: 600;
}
@media screen and (max-width: 1199.98px) {
  #quick .bottom .button {
    display: none;
  }
}
@media screen and (max-width: 1199.98px) {
  #quick .h #quick-input.on {
    position: relative;
    bottom: 180px !important;
    transition: all 0.5s;
  }
  #quick .h #quick-input.on .down:after {
    transform: rotate(0);
  }
}
#quick .health-input {
  background-color: #fff;
  border: 2px solid #eb6215;
  padding: 15px 43px 15px 55px;
  border-radius: 10px;
  align-items: center;
    width: fit-content;
    margin: 0 auto;
}
@media screen and (max-width: 1199.98px) {
#quick .health-input {
    width: 100%;
  border-radius: 0;
  border: 0px solid ;
  padding: 17px 0;
    flex-direction: column;
        border-radius: 20px 20px 0 0;
        box-shadow: 0px -7px 7px 0px rgba(0, 0, 0, 0.1);
}
}
#quick .health-input .flex-area {
  display: flex;
  gap: 40px;
}
@media screen and (max-width: 1199.98px) {
#quick .health-input .flex-area {
  gap: 22px;
}
}
#quick .health-input .flex-area .icon {
  max-width: 54px;
}
@media screen and (max-width: 1199.98px) {
#quick .health-input .flex-area .icon {
  max-width: 40px;
}
}
#quick .health-input .flex-area .arr {
  width: 23px;
}
@media screen and (max-width: 1199.98px) {
#quick .health-input .flex-area .arr {
  width: 100px;
}
}
#quick .health-input .flex-area > a {
  display: flex;
  gap: 12px;
  align-items: center;
}
@media screen and (max-width: 1199.98px) {
#quick .health-input .flex-area > a {
flex-direction: column;
    align-items: center;
gap:8px;
}
}
#quick .health-input .flex-area > a dl {
  text-align: left;
}
#quick .health-input .flex-area > a dl dt {
  font-size: 22px;
  font-weight: 500;
}
@media screen and (max-width: 1199.98px) {
#quick .health-input .flex-area > a dl dt {
  font-size: 16px;
    text-align: center;
}
}
#quick .health-input .flex-area > a dl dd {
  color: #818080;
  font-size: 18px;
  font-weight: 400;
}
@media screen and (max-width: 1199.98px) {
#quick .health-input .flex-area > a dl dd {
  font-size: 14px;
    text-align: center;
padding:5px 0;
}
}
#quick .health-input .flex-area .line {
  width: 0.5px;
  height: 54px;
  background-color: #eb6215;
}
@media screen and (max-width: 1199.98px) {
#quick .health-input .flex-area .line {
  height: 127px;
}
}
#quick .gray_btn {
  opacity: 0.6;
}

#quick .gray_btn p {
  color: #676767;
}
#quick .gray_btn img {
  content: url("/tcrews_img/home/q-button_n.png");
}

#quick-bottom-mo {
  background-color: #eb6215;
  display: none;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  z-index: 9992;
  height: 80px;
}
@media screen and (max-width: 1199.98px) {
  #quick-bottom-mo {
    display: block;
  }
}
#quick-bottom-mo img {
  max-width: 26px;
}
#quick-bottom-mo .main-tap {
  display: flex;
  justify-content: space-between;
}
#quick-bottom-mo .main-tap a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 68px;
  height: 80px;
  width: 25%;
}
@media screen and (max-width: 543.98px) {
  #quick-bottom-mo .main-tap a {
    min-width: 55px;
  }
}
#quick-bottom-mo .main-tap a p {
  font-size: 10px;
  color: #fff;
  margin-top: 12px;
  font-weight: 600;
}
