@charset "UTF-8";
/* CSS Document */
/* Mobile Layout */
@media (max-width: 667px) {
  body {
    font-size: 1.4rem;
  }
  .sp-br {
    display: block;
  }
  .pc-br {
    display: none;
  }
  /*/////////////sp-footer//////////////*/
  .booking-buttons {
    display: block;
    width: 80%;
    margin: 0 auto 50px;
  }
  footer {
    padding: 10% 5% 10px;
  }
  .btn {
    width: 100%;
    height: 103px;
    &:first-of-type {
      margin-bottom: 20px;
    }
  }
  .btn-label {
    font-size: 1.4rem;
  }
  .line-icon {
    width: 4rem;
    height: 4rem;
    font-size: 1.6rem;
  }
  .info-section {
    flex-direction: column;
    gap: 3rem;
    align-items: center;
    text-align: center;
  }
  .logo-text {
    font-size: 2.8rem;
  }
  .info-row {
    justify-content: center;
    gap: 1.2rem;
    margin: 1.2rem 0;
  }
  .info-label {
    font-size: 1.2rem;
    padding: 0.5rem 1.4rem;
  }
  .info-text {
    font-size: 1.4rem;
  }
  .social-icons {
    justify-content: center;
    margin-top: 3rem;
  }
  .copyright {
    font-size: 1rem;
    margin-top: 3rem;
  }
  .logo {
    padding-right: max(1%, 12px);
    width: clamp(180px, 47.83vw, 230px);
    border-radius: 0 0 30px 0;
  }
  /*/////////////sp-top//////////////*/
  .hero {
    height: 152.9vw;
    min-height: 30px;
    border-radius: 0 0 24.15vw 0;
  }
  .hero-content {
    bottom: 12%;
    width: 90%;
  }
  .hero-title {
    font-size: clamp(2.30rem, 2.40vw + 1.40rem, 3.00rem);
  }
  .hero-subtitle {
    font-size: 1.4rem;
    line-height: 1.5;
    margin-bottom: 15px;
  }
  .hero-badges {
    gap: 5px;
    flex-wrap: wrap;
    white-space: nowrap;
  }
  .badge {
    padding: 1.2rem 1.5rem;
    letter-spacing: 0.03em;
  }
  .concerns-section {
    width: 90%;
  }
  .concerns-title {
    font-size: clamp(2.80rem, 2.40vw + 1.90rem, 3.50rem);
  }
  .section-header {
    text-align: left;
  }
  .section-subtitle {
    font-size: max(2.13vw + 0.52rem, 1.20rem);
    letter-spacing: 0.03em;
  }
  .section-subtitle::before, .section-subtitle::after {
    content: '—';
    margin: 0;
  }
  .concern-item {
    padding: 0
  }
  .concern-item:nth-child(even) {
    padding-left: 0;
  }
  .concern-text {
    padding: 15px 20px;
    border-radius: 1.5rem;
    font-size: 1.6rem;
    min-height: 30px;
  }
  .footer-text {
    text-align: left;
    letter-spacing: 0.02em;
    font-size: max(3.19vw + 0.08rem, 1.10rem);
    &::before, &::after {
      margin: 0;
    }
  }
  .testimonials-section {
    margin-left: 5%;
  }
  .testimonials-title {
    font-size: 2.4rem;
  }
  .section-lineup {
    margin-top: 20px;
  }
  .eyecatch_box {
    aspect-ratio: 1/1;
  }
  .top_work_title {
    padding: 10px;
    line-height: 1.5;
    letter-spacing: 0.03em;
  }
  .top_sym_link {
    border-radius: 10px;
  }
  .section-lineup .slick-nav-arrows {
    bottom: 0px;
    width: 100px;
    height: 40px;
  }
  .section-lineup .slick-next:before {
    background-size: 36px;
    width: 36px;
    height: 36px;
  }
  .section-lineup .slick-prev:before {
    background-size: 36px;
    width: 36px;
    height: 36px;
  }
  .section-lineup .inner {
    margin-bottom: 0;
  }
  .top_tre_title {
    font-size: 2.4rem;
  }
  .top_tre_text {
    font-size: 1.4rem;
  }
  .tob_tre_subtitle {
    font-size: 1.6rem;
  }
  .btn01 {
    min-width: 150px;
    height: 40px;
    border-radius: 8px;
    padding: 0 50px 0 10px;
    &::after {
      background-size: 15px;
      width: 15px;
      height: 15px;
    }
  }
  .top_about_title {
    font-size: 2.4rem;
    margin-right: 0;
  }
  .top_about_text {
    font-size: 1.4rem;
  }
  .top-symptoms-section {
    width: 90%;
  }
  .top-symptoms-title {
    font-size: 2.4rem;
    margin-bottom: 25px;
  }
  .symptom-item {
    flex-direction: column;
    padding: 10px 10px 15px;
  }
  .card-image {
    aspect-ratio: 4/3;
    width: 100%;
    margin-bottom: 15px;
  }
  .card-text {
    margin-left: 0;
    font-size: 1.4rem;
  }
  .symptom-list {
    li {
      display: grid;
      grid-template-rows: subgrid;
    }
  }
  .top-price {
    padding: 12% 7.5%;
  }
  .top-price-title {
    font-size: 1.8rem;
    padding: 10px 20px;
    margin-bottom: 20px;
  }
  .top-price-text01 {
    font-size: 1.4rem;
    margin-bottom: 20px;
  }
  .first-price {
    margin-top: 20px;
  }
  .top-price-text02 {
    font-size: 1.4rem;
    letter-spacing: 0.03em;
  }
  .top-blog {
    width: 90%;
  }
  .top-blog_title {
    font-size: 2.4rem;
  }
  .top-news_ul {
    grid-template-columns: repeat(1, 1fr);
    gap: 30px;
    margin: 0 0 50px;
  }
  .top-newslist_li {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .top_eyecatch {
    width: max(30%, 100px);
    aspect-ratio: 1/1;
    margin-bottom: 0;
    margin-right: 4%;
  }
  .top-newslist_text {
    width: 66%;
  }
  .top-news_date {
    font-size: 1.2rem;
  }
  .top-news_title {
    margin-bottom: 10px;
  }
  .news_cate_label {
    font-size: 1rem;
    padding: 3px 7px;
  }
  /*/////////////sp-当院について//////////////*/
  .sub_title {
    font-size: clamp(2.00rem, 1.15vw + 1.63rem, 2.40rem);
    width: 80%;
    height: clamp(130px, 40vw, 167px);
    border-radius: 0 0 12vw 0;
    padding: 0 8% 5% 0;
  }
  .about_first_text {
    font-size: 1.6rem;
    ;
    margin: 0 5% max(7.3vw, 50px) 5%;
  }
  .sub_hero_pic {
    width: 90%;
  }
  .com_title {
    font-size: 2.4rem;
  }
  .about02 {
    width: 90%;
  }
  .about02_title {
    font-size: 1.6rem;
    margin-bottom: 30px;
    &::after {
      content: '● ● ●';
      position: absolute;
      left: 50%;
      top: calc(100% + 10px);
      font-size: 1rem;
    }
  }
  .about02_sub_title {
    font-size: 2.2rem;
  }
  .about02_inner {
    flex-direction: column;
    gap: 30px;
  }
  .about02_box {
    width: 100%;
    padding: 8% 7%;
  }
  .about03_pic_wrap {
    grid-template-columns: 1fr;
  }
  .about_address {
    margin: 20px 0;
  }
  .access_box {
    padding: 8% 5%;
  }
  .map {
    height: 80vw;
  }
  /*/////////////sp-施術内容//////////////*/
  .treat01_title {
    font-size: 1.4rem;
    margin-bottom: 20px;
    span {
      font-size: 2.4rem;
    }
  }
  .treat01_text {
    font-size: 1.4rem;
    text-align: justify;
  }
  .treat01 {
    width: 90%;
  }
  .answer-list {
    grid-template-columns: repeat(1, 1fr);
    gap: 70px;
    align-items: center;
    max-width: 400px;
    margin: 0 auto clamp(40px, 4vw, 75px);
  }
  .tre_number {
    width: clamp(65px, 18%, 80px);
  }
  .tre_in_text {
    font-size: 1.4rem;
  }
  .treat02_right {
    height: auto;
  }
  .treat02_text {
    font-size: 1.4rem;
  }
  .treat03 {
    width: calc(100% - max(1vw, 10px));
  }
  .treat03_textbox {
    width: 85%;
    p {
      font-size: 1.4rem;
    }
  }
  .flow {
    grid-template-columns: 1fr;
    gap: 50px;
  }
  .flow_title {
    font-size: 1.6rem;
    margin-bottom: 5px;
  }
  .treat04_info {
    width: 90%;
    padding: 0 5% 8%;
    p {
      font-size: 1.4rem;
    }
  }
  .treat06 {
    font-size: 1.4rem;
    width: 90%;
  }
  .accbox label {
    padding: 20px 0px 20px 35px;
  }
  .accbox .accshow {
    padding: 0 0 0 30px;
  }
  .cssacc:checked + label + .accshow {
    padding: 2% 3% 3% 30px;
  }
  .flow_pic {
    img {
      aspect-ratio: 3/2;
      object-fit: cover;
    }
  }
  /*/////////////sp-施術料金//////////////*/
  .fee_content_wrap {
    width: 90%;
  }
  .fee-table th, .fee-table td {
    font-size: 1.4rem;
    padding: 10px 5px;
  }
  .fee-table td {
    width: 47.5%;
    height: 8em;
  }
  th.fee-table_time {
    min-width: 0;
    font-size: 1.2rem;
	padding: 0px;
	text-align: center;
	vertical-align: middle;
	span{
    display: inline-block;
    writing-mode: vertical-rl;
    text-orientation: upright;
    letter-spacing: 0.15em;
    min-height: 6em; 
    white-space: nowrap;
	}
    width: 5%;
  }
  td.fee-table-text {
    font-size: 1.2rem;
  }
  th.fee-table_head {
    font-size: 1.2rem;
    span {
      font-size: 1.2rem;
    }
  }
  .mente_title {
    font-size: 1.6rem;
    margin-bottom: 10px;
  }
  .mente_text {
    font-size: 1.4rem;
  }
  .mente_fee {
    font-size: 1.4rem;
    grid-template-columns: 10.5em 1fr;
  }
  .plan {
    padding: 20px 0px;
  }
  .fee {
    padding: 20px 5px;
  }
  .cancel_title {
    font-size: 1.4rem;
    padding: 7px 12px;
  }
  .fee_info, .mente_info, .cancel_info {
    font-size: 1.2rem;
  }
  /*/////////////sp-症状別一覧//////////////*/
  .sym_post_wrap {
    width: 90%;
  }
  .sym_title {
    min-width: 150px;
  }
  .sym_content h2 {
    font-size: 2rem;
  }
  .sym_content h2:before {
    width: 8px;
  }
  .sym_con_list {
    font-size: 1.4rem;
    li {
      margin-bottom: 1.5em;
      padding-left: 25px;
      &::before {
        top: 1px;
        background-size: 20px;
        width: 20px;
        height: 20px;
      }
    }
  }
  /*/////////////sp-お知らせ一覧//////////////*/
  .news_ul {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .cat_wrap_left {
    font-size: 1.2rem;
    li {
      border-radius: 5px;
    }
  }
  .pagination .page-numbers {
    width: 30px;
    height: 30px;
  }
  /*/////////////sp-お問い合わせ//////////////*/
  .contact_infobox {
    display: block;
    margin-bottom: 20px;
  }
  .contact_tel {
    width: 100%;
    margin-bottom: 20px;
  }
  .mail_title {
    font-size: 1.5rem;
  }
  .formWrap {
    padding: 50px 5% 50px;
  }
  .name_wrap {
    margin-bottom: 35px;
  }
  .eigyo {
    margin-bottom: 50px;
  }
}