/* Breakpoints */
/* Percentages Default Value */
/* Font Family */
/* Font Weights */
/* Breakpoints */
/* Percentages Default Value */
/* Font Family */
/* Font Weights */
/* Media Queries */
/* Breakpoints */
/* Percentages Default Value */
/* Font Family */
/* Font Weights */
header {
  position: fixed;
  top: 0;
  z-index: 99;
  width: 100%;
  box-shadow: clamp(0.1rem, 0.0925925926vw + 0.0555555556rem, 0.125rem) clamp(0.5rem, 0.462962963vw + 0.2777777778rem, 0.625rem) clamp(1rem, 0.9259259259vw + 0.5555555556rem, 1.25rem) 0 rgba(44, 44, 44, 0.5);
  -webkit-box-shadow: clamp(0.1rem, 0.0925925926vw + 0.0555555556rem, 0.125rem) clamp(0.5rem, 0.462962963vw + 0.2777777778rem, 0.625rem) clamp(1rem, 0.9259259259vw + 0.5555555556rem, 1.25rem) 0 rgba(44, 44, 44, 0.5);
  -moz-box-shadow: clamp(0.1rem, 0.0925925926vw + 0.0555555556rem, 0.125rem) clamp(0.5rem, 0.462962963vw + 0.2777777778rem, 0.625rem) clamp(1rem, 0.9259259259vw + 0.5555555556rem, 1.25rem) 0 rgba(44, 44, 44, 0.5);
  background-color: #ffffff;
  border-radius: 0 0 clamp(3.25rem, 3.0092592593vw + 1.8055555556rem, 4.0625rem) clamp(3.25rem, 3.0092592593vw + 1.8055555556rem, 4.0625rem);
}
header .header_inner {
  position: relative;
  width: 85%;
  margin: 0 auto;
  padding: clamp(0.65rem, 0.6018518519vw + 0.3611111111rem, 0.8125rem) 0 clamp(0.9rem, 0.8333333333vw + 0.5rem, 1.125rem);
  max-width: 1000px;
}
header .header_inner .header_logo {
  width: 35.7%;
  margin-bottom: clamp(1.5rem, 1.3888888889vw + 0.8333333333rem, 1.875rem);
  max-width: clamp(17.85rem, 16.5277777778vw + 9.9166666667rem, 22.3125rem);
}
header .header_inner .header_menu .list_menu li {
  margin-right: clamp(1.1rem, 1.0185185185vw + 0.6111111111rem, 1.375rem);
}
header .header_inner .header_menu .list_menu li:last-child {
  margin-right: 0;
}
header .header_inner .header_menu .list_menu li a {
  color: #333333;
  font-size: clamp(0.7rem, 0.6481481481vw + 0.3888888889rem, 0.875rem);
  font-weight: 500;
}
header .header_inner .header_menu .list_menu li a.active {
  padding-bottom: clamp(0.4rem, 0.3703703704vw + 0.2222222222rem, 0.5rem);
  color: #e34e23;
  border-bottom: clamp(0.15rem, 0.1388888889vw + 0.0833333333rem, 0.1875rem) solid #e34e23;
}
header .header_inner .header_menu .list_menu li a:hover {
  padding-bottom: clamp(0.4rem, 0.3703703704vw + 0.2222222222rem, 0.5rem);
  color: #e34e23;
  border-bottom: clamp(0.15rem, 0.1388888889vw + 0.0833333333rem, 0.1875rem) solid #e34e23;
}
header .header_inner .header_menu .header_info_wrap {
  position: absolute;
  top: clamp(0.2rem, 0.1851851852vw + 0.1111111111rem, 0.25rem);
  right: 0;
  flex-direction: row-reverse;
  align-items: center;
}
header .header_inner .header_menu .header_info_wrap .header_contact {
  max-height: clamp(1.9rem, 1.7592592593vw + 1.0555555556rem, 2.375rem);
}
header .header_inner .header_menu .header_info_wrap .header_contact .link_btn {
  line-height: 1;
  padding: clamp(0.7rem, 0.6481481481vw + 0.3888888889rem, 0.875rem);
  color: #ffffff;
  font-size: clamp(0.6rem, 0.5555555556vw + 0.3333333333rem, 0.75rem);
  font-weight: 700;
  text-align: center;
  min-width: clamp(6.75rem, 6.25vw + 3.75rem, 8.4375rem);
}
header .header_inner .header_menu .header_info_wrap .header_contact .link_btn.link_btn_tour {
  background-color: #e34e23;
  border-radius: clamp(0.95rem, 0.8796296296vw + 0.5277777778rem, 1.1875rem) 0 0 clamp(0.95rem, 0.8796296296vw + 0.5277777778rem, 1.1875rem);
}
header .header_inner .header_menu .header_info_wrap .header_contact .link_btn.link_btn_contact {
  background-color: #fbbb3b;
  border-radius: 0 clamp(0.95rem, 0.8796296296vw + 0.5277777778rem, 1.1875rem) clamp(0.95rem, 0.8796296296vw + 0.5277777778rem, 1.1875rem) 0;
}
header .header_inner .header_menu .header_info_wrap .header_ph_info {
  margin-right: clamp(2.05rem, 1.8981481481vw + 1.1388888889rem, 2.5625rem);
  text-align: center;
  line-height: 1;
}
header .header_inner .header_menu .header_info_wrap .header_ph_info .text_base {
  font-weight: 500;
  font-size: clamp(0.7rem, 0.6481481481vw + 0.3888888889rem, 0.875rem);
}
header .header_inner .header_menu .header_info_wrap .header_ph_info .link_tel {
  line-height: 1;
  margin: 0 auto;
  padding-left: clamp(1.7rem, 1.5740740741vw + 0.9444444444rem, 2.125rem);
  background: url("/casabonita/assets/images/common/icon_phone.png") no-repeat center left;
  background-size: clamp(1.6rem, 1.4814814815vw + 0.8888888889rem, 2rem) auto;
  color: #3f961c;
  font-size: clamp(1.3rem, 1.2037037037vw + 0.7222222222rem, 1.625rem);
  letter-spacing: 0.05rem;
}
header::before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  width: clamp(5rem, 4.6296296296vw + 2.7777777778rem, 6.25rem);
  height: clamp(6.75rem, 6.25vw + 3.75rem, 8.4375rem);
  background: url("/casabonita/assets/images/common/header_icon_flower.png") no-repeat center left;
  background-size: clamp(5rem, 4.6296296296vw + 2.7777777778rem, 6.25rem) auto;
  content: "";
}

/* For Tablet */
@media only screen and (min-width: 768px) and (max-width: 1200px) {
  header .header_inner {
    width: 90.5%;
  }
  header .header_inner .header_logo {
    margin-left: clamp(0.7rem, 0.6481481481vw + 0.3888888889rem, 0.875rem);
  }
  header .header_inner .header_menu .list_menu {
    justify-content: space-between;
  }
  header .header_inner .header_menu .list_menu li {
    margin-right: clamp(0.5rem, 0.462962963vw + 0.2777777778rem, 0.625rem);
  }
  header .header_inner .header_menu .list_menu li a {
    font-size: clamp(0.65rem, 0.6018518519vw + 0.3611111111rem, 0.8125rem);
  }
  header::before {
    width: clamp(4rem, 3.7037037037vw + 2.2222222222rem, 5rem);
    height: clamp(6.25rem, 5.787037037vw + 3.4722222222rem, 7.8125rem);
    background-size: clamp(4rem, 3.7037037037vw + 2.2222222222rem, 5rem) auto;
    background-position: top left;
  }
}
/* For Mobile */
@media (max-width: 767.9px) {
  header {
    box-shadow: 0.0222222222rem 0.1111111111rem 0.2222222222rem 0 rgba(44, 44, 44, 0.5);
    -webkit-box-shadow: 0.0222222222rem 0.1111111111rem 0.2222222222rem 0 rgba(44, 44, 44, 0.5);
    -moz-box-shadow: 0.0222222222rem 0.1111111111rem 0.2222222222rem 0 rgba(44, 44, 44, 0.5);
    background-color: #ffffff;
    border-radius: 0 0 0.7222222222rem 0.7222222222rem;
  }
  header .header_inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0 auto;
    padding: 0.1666666667rem 0 0.3888888889rem;
  }
  header .header_inner .header_logo {
    width: 3.8888888889rem;
    margin: 0 auto;
    font-size: 0;
    max-width: 357px;
  }
  header .header_inner .header_hanbuger {
    position: relative;
    z-index: 99999;
    width: 0.6222222222rem;
    height: 0.6222222222rem;
    margin-right: 0.2444444444rem;
    padding: 0.2222222222rem 0.1111111111rem;
    background: #e34e23;
    border-radius: 50%;
  }
  header .header_inner .header_hanbuger .header_hanbuger_icon {
    display: inline-block;
    position: absolute;
    top: 50%;
    width: 0.3888888889rem;
    height: 0.2888888889rem;
    transform: translateY(-50%);
  }
  header .header_inner .header_hanbuger .header_hanbuger_icon:after,
  header .header_inner .header_hanbuger .header_hanbuger_icon span, header .header_inner .header_hanbuger .header_hanbuger_icon:before {
    position: absolute;
    right: 0;
    width: 100%;
    height: 0.0444444444rem;
    background: #ffffff;
    content: "";
    -webkit-transition: all 0.1s ease;
    -moz-transition: all 0.1s ease;
    -ms-transition: all 0.1s ease;
    -o-transition: all 0.1s ease;
    transition: all 0.1s ease;
  }
  header .header_inner .header_hanbuger .header_hanbuger_icon::after {
    bottom: 0;
  }
  header .header_inner .header_hanbuger .header_hanbuger_icon span {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  header .header_inner .header_hanbuger .header_hanbuger_icon:before {
    top: 0;
  }
  header .header_inner .header_hanbuger .header_hanbuger_icon.is_active:before {
    top: 0.1111111111rem;
    width: 100%;
    background: #ffffff;
    transform: rotate(45deg);
  }
  header .header_inner .header_hanbuger .header_hanbuger_icon.is_active span {
    opacity: 0;
  }
  header .header_inner .header_hanbuger .header_hanbuger_icon.is_active:after {
    bottom: 0.1444444444rem;
    background: #ffffff;
    transform: rotate(-45deg);
  }
  header .header_inner .header_menu {
    display: none;
    position: fixed;
    top: 0;
    z-index: 9999;
    border: 0.0555555556rem solid #fbbb3b;
    background-color: #ffffff;
  }
  header .header_inner .header_menu.is_opened {
    display: block;
  }
  header .header_inner .header_menu .list_menu li {
    width: 96%;
    margin: 0 auto;
    border-bottom: 1px solid #e8e8e8;
  }
  header .header_inner .header_menu .list_menu li a {
    display: block;
    font-size: 0.2666666667rem;
    padding: 0.2777777778rem 0.3888888889rem;
  }
  header .header_inner .header_menu .list_menu li a.active {
    border-bottom: 0;
  }
  header .header_inner .header_menu .list_menu li a:hover {
    padding-bottom: 0;
    border-bottom: 0;
  }
  header .header_inner .header_menu .list_menu li:first-child a {
    padding-top: 0.7222222222rem;
  }
  header .header_inner .header_menu .list_menu li:last-child {
    margin: 0 auto 0.3333333333rem;
    border-bottom: none;
  }
  header .header_inner .header_menu .header_info_wrap {
    position: relative;
    top: auto;
    right: auto;
    flex-direction: row;
  }
  header .header_inner .header_menu .header_info_wrap .header_contact {
    justify-content: center;
    width: 100%;
    margin-bottom: 0.4444444444rem;
    max-height: 0.7111111111rem;
  }
  header .header_inner .header_menu .header_info_wrap .header_contact .link_btn {
    width: 3.4888888889rem;
    padding: 0.2rem 0.2222222222rem;
    font-size: 0.2666666667rem;
    text-align: center;
    min-width: auto;
  }
  header .header_inner .header_menu .header_info_wrap .header_contact .link_btn.link_btn_tour {
    border-radius: 0.2111111111rem 0 0 0.2111111111rem;
  }
  header .header_inner .header_menu .header_info_wrap .header_contact .link_btn.link_btn_contact {
    background-color: #fbbb3b;
    border-radius: 0 0.2111111111rem 0.2111111111rem 0;
  }
  header .header_inner .header_menu .header_info_wrap .header_ph_info {
    width: 100%;
    margin: 0 0 0.4444444444rem;
  }
  header .header_inner .header_menu .header_info_wrap .header_ph_info .text_base {
    font-size: 0.2777777778rem;
  }
  header .header_inner .header_menu .header_info_wrap .header_ph_info .link_tel {
    margin: 0.1111111111rem auto;
    padding-left: 0.9111111111rem;
    background-size: 0.7333333333rem auto;
    font-size: 0.5888888889rem;
  }
  header::before {
    position: fixed;
    width: 1.1111111111rem;
    height: 1.5rem;
    background-size: 1.1111111111rem auto;
  }
}

/*# sourceMappingURL=header.css.map */
