@charset "utf-8";


/* ==========================================================================
   #aboutus（hamonについて）
   ========================================================================== */
/* SPカンプ（Slice 2.png）準拠 */
@media screen and (max-width: 640px) {
  #aboutus .page-title {
    padding: 110px 36px 0;
  }

  #aboutus .page-title h1 {
    margin-bottom: 5px;
    font-size: 2rem;
  }

  #aboutus .page-title .en {
    font-size: 1rem;
  }

  #aboutus .title-wave {
    top: 162px !important;
    width: 110% !important;
    min-width: 0;
  }

  #aboutus .about-lead {
    padding-top: 235px;
  }

  #aboutus .about-lead .about-text {
    margin-top: 38px;
  }

  #aboutus .about-catch {
    font-size: 1.5rem;
    line-height: 2.15;
    letter-spacing: 0.15em;
  }

  #aboutus .about-text {
    max-width: none;
    padding: 0 18px;
    font-size: 1.1rem;
    line-height: 2.65;
    letter-spacing: 0.14em;
    text-align: center;
  }

  #aboutus .about-faces {
    justify-content: flex-start;
    gap: 30px;
    margin: 44px -14px 45px;
  }

  #aboutus .about-faces img {
    flex: 0 0 86px;
    width: 86px;
  }

  #aboutus .about-worry {
    margin-bottom: 164px;
  }

  #aboutus .about-worry .about-catch {
    margin: 26px 0 22px;
  }

  #aboutus .about-courses_ttl {
    margin: 0 0 42px;
    padding: 0 24px;
  }

  #aboutus .about-heading {
    margin-bottom: 0;
    font-size: 1.4rem;
    line-height: 2.2;
    letter-spacing: 0.12em;
  }

  #aboutus .about-blob {
    width: 100%;
    margin-left: 0;
    border-radius: 0 220px 220px 0;
    min-height: 0;
    padding: 45px 20px 45px 24px;
    overflow: visible;
  }

  #aboutus .about-blob-inner {
    width: auto;
    max-width: none;
  }

  #aboutus .about-blob-heading {
    font-size: 1.3rem;
    line-height: 2.1;
    letter-spacing: 0.1em;
  }

  #aboutus .about-blob-text {
    max-width: none;
    margin-top: 30px;
    font-size: 1.2rem;
    line-height: 2.2;
    letter-spacing: 0.05em;
  }

  #aboutus .about-blob-circle {
    position: absolute;
    display: block;
    top: calc(100% + 36px);
    left: 50%;
    width: min(calc(100vw - 48px), 354px);
    margin: 0;
    transform: translateX(-50%);
  }

  #aboutus .about-blob-approach {
    margin-bottom: 500px;
  }

  #aboutus .about-blob-course {
    padding-bottom: 83px;
  }

  #aboutus .about-blob-relax {
    margin-bottom: 520px;
    padding-top: 66px;
    padding-bottom: 138px;
  }

  #aboutus .about-blob-relax .about-blob-circle {
    top: calc(100% - 88px);
  }

  #aboutus .about-total {
    margin: 0 0 105px;
    padding: 0 24px;
  }

  #aboutus .about-heading-center {
    font-size: 2.2rem;
    line-height: 1.75;
    letter-spacing: 0.15em;
  }

  #aboutus .about-sub {
    margin: 22px 0 28px;
    font-size: 1.35rem;
    line-height: 2.3;
    letter-spacing: 0.08em;
  }

  #aboutus .about-total .about-text {
    padding: 0;
    font-size: 1.15rem;
    line-height: 2.65;
    letter-spacing: 0.12em;
  }

  #aboutus .about-btn {
    margin-top: 38px;
  }

  #aboutus .about-btn .btn-pill {
    max-width: 354px;
    padding: 18px 28px;
    font-size: 1.2rem;
  }

  #aboutus .about-btn-label-pc {
    display: none;
  }

  #aboutus .about-btn-label-sp {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
  }

  #aboutus .about-btn-label-sp strong {
    font-size: 1.45rem;
    font-weight: 400;
  }

  #aboutus .about-btn-label-sp small {
    font-size: 1rem;
    white-space: nowrap;
  }

  #aboutus .about-photo {
    width: 100%;
    height: 190px;
    margin-top: 44px;
    border-radius: 12px;
    object-fit: cover;
    object-position: center;
  }

  #aboutus .about-courses {
    flex-direction: column;
    align-items: center;
    gap: 72px;
    margin: 78px 20px 128px;
  }

  #aboutus .about-course-photo {
    width: min(calc(100vw - 48px), 354px);
    margin-bottom: 28px;
  }

  #aboutus .about-course-photo::after {
    display: none;
  }

  #aboutus .about-course-ja {
    font-size: 1.8rem;
  }

  #aboutus .about-course-en {
    margin-top: 5px;
    font-size: 1.2rem;
  }

  #aboutus #footer {
    padding-top: 0;
    padding-bottom: 190px;
  }

  #aboutus #footer .footer-top {
    flex-direction: column-reverse;
    gap: 62px;
    padding: 0;
  }

  #aboutus #footer .footer-info {
    width: calc(100% - 48px);
    margin: 0 auto;
    padding: 0;
  }

  #aboutus #footer .footer-logo {
    display: block;
    width: 210px;
    margin: 0 auto 28px;
  }

  #aboutus #footer .footer-address,
  #aboutus #footer .footer-table {
    font-size: 1.2rem;
  }

  #aboutus #footer .footer-table dt {
    width: 70px;
  }

  #aboutus #footer .footer-photo {
    width: calc(100% - 24px);
    margin-left: 24px;
  }

  #aboutus #footer .footer-cta {
    gap: 30px;
    margin-top: 62px;
    padding: 0 24px;
  }

  #aboutus #footer .footer-cta > div {
    flex: 0 0 auto;
    width: min(calc(100vw - 48px), 354px);
    max-width: none;
  }

  #aboutus #footer .footer-cta .cta-label {
    font-size: 1.4rem;
  }

  #aboutus #footer .footer-cta .tel-num {
    font-size: 3rem;
  }

  #aboutus #footer .footer-cta .btn-pill-fill {
    width: 280px;
    padding: 17px 24px;
    font-size: 1.1rem;
  }
}

/* ==========================================================================
   #concept（首上トータルケア）
   ========================================================================== */
/* SP用（SPカンプなし・PC比按分） */
@media screen and (max-width: 640px) {
  #concept .page-title {
    padding: 110px 32px 0;
  }

  #concept .page-title h1 {
    margin-bottom: 5px;
    font-size: 2rem;
  }

  #concept .page-title .en {
    font-size: 1rem;
    letter-spacing: 0.18em;
  }

  #concept .title-wave {
    top: 162px !important;
    width: 110% !important;
    min-width: 0 !important;
  }

  #concept .concept-wave {
    top: 200px;
    min-width: 900px;
  }

  #concept .concept-lead {
    padding: 215px 20px 0;
  }

  #concept .concept-catch {
    font-size: 1.7rem;
    line-height: 1.95;
  }

  #concept .concept-sub {
    margin-top: 29px;
    font-size: 1.3rem;
    line-height: 2.25;
  }

  #concept .concept-hero {
    margin-top: 36px;
  }

  #concept .concept-intro {
    max-width: 402px;
    margin-top: 42px;
    padding: 0 20px;
  }

  #concept .concept-intro p {
    font-size: 1.25rem;
    line-height: 2.5;
    letter-spacing: 0.05em;
  }

  #concept .concept-diagram {
    margin: 58px auto 150px;
    padding: 0 20px;
  }

  #concept .concept-diagram figcaption {
    font-size: 1.6rem;
    letter-spacing: 0.12em;
  }

  #concept .concept-diagram img {
    margin-top: 32px;
  }

  #concept .concept-section {
    margin-bottom: 115px;
  }

  #concept .concept-heading {
    margin-bottom: 96px;
    font-size: 1.8rem;
    line-height: 2;
    letter-spacing: 0.14em;
  }

  #concept .concept-heading::after {
    top: 27px;
    width: min(calc(100vw - 62px), 342px);
    height: 66px;
    border-bottom: 1px solid var(--color-accent);
    border-radius: 0 0 50% 50% / 0 0 100% 100%;
    background: none;
  }

  #concept .concept-split,
  #concept .concept-split.reverse {
    flex-direction: column;
    gap: 38px;
    padding: 0 20px;
  }

  #concept .concept-split p {
    font-size: 1.35rem;
    line-height: 2.5;
    letter-spacing: 0.05em;
  }

  #concept .concept-split img {
    order: -1;
    width: min(calc(100vw - 62px), 342px);
    max-width: 100%;
    margin: 0 auto;
  }

  #concept .concept-conclusion {
    margin: 125px 0 110px;
  }

  #concept .concept-circle {
    width: 1059px;
    max-width: none;
    aspect-ratio: 1 / 1;
    margin-left: 50%;
    padding: 48px 0 0;
    border-radius: 50%;
    transform: translateX(-50%);
  }

  #concept .concept-circle h2,
  #concept .concept-circle-text,
  #concept .concept-circle-strong {
    width: min(calc(100vw - 40px), 362px);
    margin-right: auto;
    margin-left: auto;
  }

  #concept .concept-circle h2 {
    font-size: 1.9rem;
    line-height: 1.7;
    letter-spacing: 0.1em;
  }

  #concept .concept-circle-text {
    margin-top: 28px;
    font-size: 1.25rem;
    line-height: 2.55;
    letter-spacing: 0.08em;
  }

  #concept .concept-circle-strong {
    margin-top: 42px;
    font-size: 1.9rem;
    line-height: 2;
    letter-spacing: 0.1em;
  }

  #concept .concept-courses {
    flex-direction: column;
    align-items: center;
    gap: 50px;
    margin: -580px 20px 0;
  }

  #concept .concept-course img {
    width: min(calc(100vw - 48px), 354px);
  }

  #concept .concept-course-ja {
    margin-top: 28px;
    font-size: 1.8rem;
  }

  #concept .concept-course-en {
    margin-top: 5px;
    font-size: 1.2rem;
  }

  #concept #footer {
    padding-top: 0;
    padding-bottom: 190px;
  }

  #concept #footer .footer-top {
    flex-direction: column-reverse;
    gap: 62px;
    padding: 0;
  }

  #concept #footer .footer-info {
    width: calc(100% - 48px);
    margin: 0 auto;
    padding: 0;
  }

  #concept #footer .footer-logo {
    display: block;
    width: 210px;
    margin: 0 auto 28px;
  }

  #concept #footer .footer-address,
  #concept #footer .footer-table {
    font-size: 1.2rem;
  }

  #concept #footer .footer-table dt {
    width: 70px;
  }

  #concept #footer .footer-photo {
    width: calc(100% - 24px);
    margin-left: 24px;
  }

  #concept #footer .footer-cta {
    gap: 30px;
    margin-top: 62px;
    padding: 0 24px;
  }

  #concept #footer .footer-cta > div {
    flex: 0 0 auto;
    width: min(calc(100vw - 48px), 354px);
    max-width: none;
  }

  #concept #footer .footer-cta .cta-label {
    font-size: 1.4rem;
  }

  #concept #footer .footer-cta .tel-num {
    font-size: 3rem;
  }

  #concept #footer .footer-cta .btn-pill-fill {
    width: 280px;
    padding: 17px 24px;
    font-size: 1.1rem;
  }
}

/* ==========================================================================
   #course（コース案内）
   ========================================================================== */
/* SPカンプ: Slice 5（402x4462） */
@media screen and (max-width: 640px) {
  #course #header {
    padding: 20px 8px 0 23px;
  }

  #course #header .logo a {
    width: 120px;
  }

  #course .header-menu-btn {
    height: 29px;
  }

  #course .reserve-tab {
    display: none;
  }

  #course .page-title {
    padding: 104px 30px 0;
  }

  #course .page-title h1 {
    margin-bottom: 2px;
    font-size: 1.9rem;
    line-height: 1.45;
  }

  #course .page-title .en {
    font-size: 0.9rem;
    letter-spacing: 0.2em;
  }

  #course .title-wave {
    top: 140px !important;
  }

  #course .course-lead {
    padding: 224px 20px 0;
  }

  #course .course-catch {
    font-size: 1.6rem;
    line-height: 2;
    letter-spacing: 0.15em;
  }

  #course .course-intro {
    margin-top: 36px;
    padding: 0 16px;
  }

  #course .course-intro p {
    font-size: 1.3rem;
    line-height: 2.6;
    letter-spacing: 0.05em;
  }

  #course .course-list-section {
    margin: 54px 0 131px;
    padding: 0 24px;
  }

  #course .course-cards {
    gap: 100px;
  }

  #course .course-card {
    width: 100%;
  }

  #course .course-card-photo {
    width: min(100%, 354px);
    margin: 0 auto 38px;
  }

  #course .course-card-ja {
    font-size: 1.6rem;
    letter-spacing: 0.15em;
  }

  #course .course-card-en {
    margin-top: 5px;
    font-size: 1.2rem;
    letter-spacing: 0.2em;
  }

  #course .course-card-copy {
    margin-top: 22px;
    font-size: 1.6rem;
    line-height: 2.2;
    letter-spacing: 0.08em;
  }

  #course .course-card-text {
    width: 100%;
    margin: 31px 0 24px;
    font-size: 1.4rem;
    line-height: 2.6;
    letter-spacing: 0.08em;
  }

  #course .course-card:nth-child(2) .course-card-photo {
    margin-bottom: 27px;
  }

  #course .course-card:nth-child(2) .course-card-text {
    margin-top: 25px;
  }

  #course .course-card-btn {
    width: 100%;
    max-width: 354px;
    min-height: 74px;
    margin-top: 0;
    padding: 0 22px;
    font-size: 1.4rem;
  }

  #course #footer {
    padding-top: 0;
    padding-bottom: 360px;
  }

  #course #footer .footer-top {
    flex-direction: column-reverse;
    gap: 57px;
    padding: 0;
  }

  #course #footer .footer-info {
    width: calc(100% - 48px);
    margin: 0 auto;
    padding: 0;
  }

  #course #footer .footer-logo {
    display: block;
    width: 210px;
    margin: 0 auto 28px;
  }

  #course #footer .footer-address,
  #course #footer .footer-table {
    font-size: 1.2rem;
  }

  #course #footer .footer-table dt {
    width: 70px;
  }

  #course #footer .footer-table > div:last-child {
    padding: 9px 0;
  }

  #course #footer .footer-photo {
    width: calc(100% - 24px);
    margin-left: 24px;
  }

  #course #footer .footer-cta {
    gap: 23px;
    margin-top: 42px;
    padding: 0 24px;
  }

  #course #footer .footer-cta > div {
    flex: 0 0 auto;
    width: min(calc(100vw - 48px), 354px);
    max-width: none;
  }

  #course #footer .footer-cta .cta-label {
    font-size: 1.4rem;
  }

  #course #footer .footer-cta .tel-num {
    font-size: 3rem;
  }

  #course #footer .footer-cta .btn-pill-fill {
    width: 280px;
    padding: 17px 24px;
    font-size: 1.1rem;
  }
}

/* ==========================================================================
   #coursehead（ヘッドスパコース）
   ========================================================================== */
/* SPカンプ: Slice 7（400x7136） */
@media screen and (max-width: 640px) {
  #coursehead #header {
    padding: 20px 8px 0 23px;
  }

  #coursehead #header .logo a {
    width: 120px;
  }

  #coursehead .header-menu-btn {
    height: 29px;
  }

  #coursehead .reserve-tab {
    display: none;
  }

  #coursehead .page-title {
    padding: 104px 30px 0;
  }

  #coursehead .page-title h1 {
    margin-bottom: 2px;
    font-size: 1.9rem;
    line-height: 1.45;
  }

  #coursehead .page-title .en {
    font-size: 0.9rem;
    letter-spacing: 0.2em;
  }

  #coursehead .title-wave {
    top: 140px !important;
  }

  #coursehead .coursehead-title {
    padding-top: 235px;
    margin-bottom: 46px;
  }

  #coursehead .coursehead-title h2 {
    font-size: 2.2rem;
    line-height: 1.5;
    letter-spacing: 0.25em;
  }

  #coursehead .coursehead-title span {
    margin-top: 13px;
    font-size: 1.6rem;
  }

  #coursehead .article-lead {
    margin-bottom: 28px;
    padding: 0 20px;
    font-size: 1.6rem;
    line-height: 2;
    letter-spacing: 0.2em;
  }

  #coursehead .intro-block {
    max-width: none;
    margin: 0 auto 48px;
    padding: 0 17px;
  }

  #coursehead .intro-block p {
    font-size: 1.3rem;
    line-height: 2.55;
    letter-spacing: 0.06em;
    text-align: center;
  }

  #coursehead .coursehead-hero {
    width: calc(100% - 34px);
    max-width: none;
    margin: 0 auto;
    border-radius: 14px;
  }

  #coursehead .order-block,
  #coursehead .order-block.reverse {
    position: relative;
    display: block;
    height: auto;
    margin: 91px auto 0;
    padding: 0 24px;
    overflow: visible;
  }

  #coursehead .order-block.reverse {
    margin-top: 66px;
  }

  #coursehead .order-block > img:not(.order-block-blob),
  #coursehead .order-block.reverse > img:not(.order-block-blob),
  #coursehead .order-block:not(.reverse) > img:not(.order-block-blob) {
    position: absolute;
    z-index: 2;
    top: 100px;
    left: 50%;
    width: min(calc(100vw - 50px), 350px);
    height: min(calc(100vw - 50px), 350px);
    margin: 0 auto;
    transform: translateX(-50%);
    border-radius: 50%;
    object-fit: cover;
  }

  #coursehead .order-block.reverse > img:not(.order-block-blob) {
    top: 128px;
  }

  #coursehead .order-block > div,
  #coursehead .order-block.reverse > div,
  #coursehead .order-block:not(.reverse) > div {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
  }

  #coursehead .order-block-blob {
    position: absolute;
    z-index: 0;
    top: 16px;
    left: calc(50% + 50px);
    width: 800px;
    height: 789px;
    max-width: none;
    transform: translateX(-50%);
    object-fit: fill;
  }

  #coursehead .split-heading,
  #coursehead .order-block p,
  #coursehead .order-block:not(.reverse) .split-heading,
  #coursehead .order-block:not(.reverse) p {
    width: auto;
    margin-left: 0;
  }

  #coursehead .split-heading,
  #coursehead .order-block:not(.reverse) .split-heading {
    padding-top: 0;
    margin-bottom: 0;
    white-space: normal;
    font-size: 1.8rem;
    line-height: 1.8;
    letter-spacing: 0.13em;
  }

  #coursehead .order-block p {
    margin-top: calc(min(100vw - 50px, 350px) + 61px);
    font-size: 1.3rem;
    line-height: 2.85;
    letter-spacing: 0.08em;
  }

  #coursehead .article-subheading {
    margin-bottom: 87px;
    font-size: 1.6rem;
    line-height: 1.5;
    letter-spacing: 0.2em;
  }

  #coursehead .article-subheading::after {
    top: 24px;
    width: min(368px, 92vw);
    height: 70px;
  }

  #coursehead .care-items {
    margin: 113px 0 0;
    padding: 0 14px;
  }

  #coursehead .care-items > .article-photo,
  #coursehead .care-items > .article-photo:first-of-type {
    width: 100%;
    max-width: none;
    margin-right: auto;
    margin-left: auto;
  }

  #coursehead .care-items p {
    margin: 29px 11px 19px;
    font-size: 1.3rem;
    line-height: 2.85;
    letter-spacing: 0.08em;
  }

  #coursehead .care-diagrams {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 23px;
  }

  #coursehead .care-diagram {
    display: block;
    overflow: hidden;
  }

  #coursehead .care-diagram img {
    display: block;
    width: auto;
    max-width: none;
    height: 100%;
  }

  #coursehead .care-diagram-flora {
    width: min(324px, 100%);
    aspect-ratio: 360 / 416;
  }

  #coursehead .care-diagram-balance {
    width: min(372px, 100%);
    aspect-ratio: 643 / 416;
  }

  #coursehead .care-diagram-balance img {
    transform: translateX(-35.9%);
  }

  #coursehead .synergy-block {
    margin: 71px auto 63px;
    padding: 0 25px;
  }

  #coursehead .synergy-block .article-subheading {
    margin-bottom: 86px;
  }

  #coursehead .synergy-block p {
    font-size: 1.3rem;
    line-height: 2.85;
    letter-spacing: 0.08em;
  }

  #coursehead .course-list-section {
    margin: 0 0 76px;
    padding: 0 18px;
  }

  #coursehead .course-cards {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 52px minmax(0, 1fr);
    align-items: start;
    width: 364px;
    max-width: 100%;
    gap: 0;
    margin: 0 auto;
  }

  #coursehead .course-card {
    width: 100%;
  }

  #coursehead .course-card > img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    margin-bottom: 20px;
  }

  #coursehead .course-card-plus {
    margin: max(20px, calc((100vw - 188px) / 4)) 0 0;
    font-size: 5rem;
  }

  #coursehead .course-card-ja {
    margin: 0 0 6px;
    font-size: 1.4rem;
  }

  #coursehead .course-card-en {
    font-size: 0.9rem;
  }

  #coursehead #footer {
    padding-top: 0;
    padding-bottom: 18px;
  }

  #coursehead #footer .footer-top {
    flex-direction: column-reverse;
    gap: 57px;
    padding: 0;
  }

  #coursehead #footer .footer-info {
    width: calc(100% - 48px);
    margin: 0 auto;
    padding: 0;
  }

  #coursehead #footer .footer-logo {
    display: block;
    width: 210px;
    margin: 0 auto 28px;
  }

  #coursehead #footer .footer-address,
  #coursehead #footer .footer-table {
    font-size: 1.2rem;
  }

  #coursehead #footer .footer-table dt {
    width: 70px;
  }

  #coursehead #footer .footer-table > div:last-child {
    padding: 9px 0;
  }

  #coursehead #footer .footer-photo {
    width: calc(100% - 24px);
    margin-left: 24px;
  }

  #coursehead #footer .footer-cta {
    gap: 23px;
    margin-top: 42px;
    padding: 0 23px;
  }

  #coursehead #footer .footer-cta > div {
    flex: 0 0 auto;
    width: min(calc(100vw - 46px), 354px);
    max-width: none;
  }

  #coursehead #footer .footer-cta .cta-label {
    font-size: 1.4rem;
  }

  #coursehead #footer .footer-cta .tel-num {
    font-size: 3rem;
  }

  #coursehead #footer .footer-cta .btn-pill-fill {
    width: 280px;
    padding: 17px 24px;
    font-size: 1.1rem;
  }

  #coursehead #footer .footer-wave {
    /* display: none; */
  }

}

/* ==========================================================================
   #coursehair（髪質改善コース）
   ========================================================================== */
/* SPカンプ: Slice 8（coursehead と同じレイアウト構成） */
@media screen and (max-width: 640px) {
  #coursehair #header {
    padding: 20px 8px 0 23px;
  }

  #coursehair #header .logo a {
    width: 120px;
  }

  #coursehair .header-menu-btn {
    height: 29px;
  }

  #coursehair .reserve-tab {
    display: none;
  }

  #coursehair .page-title {
    padding: 104px 30px 0;
  }

  #coursehair .page-title h1 {
    margin-bottom: 2px;
    font-size: 1.9rem;
    line-height: 1.45;
  }

  #coursehair .page-title .en {
    font-size: 0.9rem;
    letter-spacing: 0.2em;
  }

  #coursehair .title-wave {
    top: 140px !important;
  }

  #coursehair .coursehair-title {
    padding-top: 235px;
    margin-bottom: 46px;
  }

  #coursehair .coursehair-title h2 {
    font-size: 2.2rem;
    line-height: 1.5;
    letter-spacing: 0.25em;
  }

  #coursehair .coursehair-title span {
    margin-top: 13px;
    font-size: 1.6rem;
  }

  #coursehair .article-lead {
    margin-bottom: 28px;
    padding: 0 20px;
    font-size: 1.6rem;
    line-height: 2;
    letter-spacing: 0.2em;
  }

  #coursehair .intro-block {
    max-width: none;
    margin: 0 auto 48px;
    padding: 0 17px;
  }

  #coursehair .intro-block p {
    font-size: 1.3rem;
    line-height: 2.55;
    letter-spacing: 0.06em;
    text-align: center;
  }

  #coursehair .coursehair-hero {
    width: calc(100% - 34px);
    max-width: none;
    margin: 0 auto;
    border-radius: 14px;
  }

  #coursehair .order-block,
  #coursehair .order-block.reverse {
    position: relative;
    display: block;
    height: auto;
    margin: 91px auto 0;
    padding: 0 24px;
    overflow: visible;
  }

  #coursehair .order-block.reverse {
    margin-top: 66px;
  }

  #coursehair .order-block > img:not(.order-block-blob),
  #coursehair .order-block.reverse > img:not(.order-block-blob),
  #coursehair .order-block:not(.reverse) > img:not(.order-block-blob) {
    position: absolute;
    z-index: 2;
    top: 100px;
    left: 50%;
    width: min(calc(100vw - 50px), 350px);
    height: min(calc(100vw - 50px), 350px);
    margin: 0 auto;
    transform: translateX(-50%);
    border-radius: 50%;
    object-fit: cover;
  }

  #coursehair .order-block.reverse > img:not(.order-block-blob) {
    top: 128px;
  }

  #coursehair .order-block > div,
  #coursehair .order-block.reverse > div,
  #coursehair .order-block:not(.reverse) > div {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
  }

  #coursehair .order-block-blob {
    position: absolute;
    z-index: 0;
    top: 16px;
    left: calc(50% + 50px);
    width: 800px;
    height: 789px;
    max-width: none;
    transform: translateX(-50%);
    object-fit: fill;
  }

  #coursehair .split-heading,
  #coursehair .order-block p,
  #coursehair .order-block:not(.reverse) .split-heading,
  #coursehair .order-block:not(.reverse) p {
    width: auto;
    margin-left: 0;
  }

  #coursehair .split-heading,
  #coursehair .order-block:not(.reverse) .split-heading {
    padding-top: 0;
    margin-bottom: 0;
    white-space: normal;
    font-size: 1.8rem;
    line-height: 1.8;
    letter-spacing: 0.13em;
  }

  #coursehair .order-block p {
    margin-top: calc(min(100vw - 50px, 350px) + 75px);
    font-size: 1.3rem;
    line-height: 2.85;
    letter-spacing: 0.08em;
  }

  #coursehair .article-subheading {
    margin-bottom: 87px;
    font-size: 1.6rem;
    line-height: 1.5;
    letter-spacing: 0.2em;
  }

  #coursehair .article-subheading::after {
    top: 24px;
    width: min(368px, 92vw);
    height: 70px;
  }

  #coursehair .synergy-block {
    margin: 71px auto 63px;
    padding: 0 25px;
  }

  #coursehair .synergy-block .article-subheading {
    margin-bottom: 86px;
  }

  #coursehair .synergy-block p {
    font-size: 1.3rem;
    line-height: 2.85;
    letter-spacing: 0.08em;
  }

  #coursehair .course-list-section {
    margin: 0 0 76px;
    padding: 0 18px;
  }

  #coursehair .course-cards {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 52px minmax(0, 1fr);
    align-items: start;
    width: 364px;
    max-width: 100%;
    gap: 0;
    margin: 0 auto;
  }

  #coursehair .course-card {
    width: 100%;
  }

  #coursehair .course-card > img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    margin-bottom: 20px;
  }

  #coursehair .course-card-plus {
    margin: max(20px, calc((100vw - 188px) / 4)) 0 0;
    font-size: 5rem;
  }

  #coursehair .course-card-ja {
    margin: 0 0 6px;
    font-size: 1.4rem;
  }

  #coursehair .course-card-en {
    font-size: 0.9rem;
  }

  #coursehair #footer {
    padding-top: 0;
    padding-bottom: 18px;
  }

  #coursehair #footer .footer-top {
    flex-direction: column-reverse;
    gap: 57px;
    padding: 0;
  }

  #coursehair #footer .footer-info {
    width: calc(100% - 48px);
    margin: 0 auto;
    padding: 0;
  }

  #coursehair #footer .footer-logo {
    display: block;
    width: 210px;
    margin: 0 auto 28px;
  }

  #coursehair #footer .footer-address,
  #coursehair #footer .footer-table {
    font-size: 1.2rem;
  }

  #coursehair #footer .footer-table dt {
    width: 70px;
  }

  #coursehair #footer .footer-table > div:last-child {
    padding: 9px 0;
  }

  #coursehair #footer .footer-photo {
    width: calc(100% - 24px);
    margin-left: 24px;
  }

  #coursehair #footer .footer-cta {
    gap: 23px;
    margin-top: 42px;
    padding: 0 23px;
  }

  #coursehair #footer .footer-cta > div {
    flex: 0 0 auto;
    width: min(calc(100vw - 46px), 354px);
    max-width: none;
  }

  #coursehair #footer .footer-cta .cta-label {
    font-size: 1.4rem;
  }

  #coursehair #footer .footer-cta .tel-num {
    font-size: 3rem;
  }

  #coursehair #footer .footer-cta .btn-pill-fill {
    width: 280px;
    padding: 17px 24px;
    font-size: 1.1rem;
  }

  #coursehair #footer .footer-wave {
  }
}

/* ==========================================================================
   #salon（サロン紹介）
   ========================================================================== */
/* SPカンプ: Slice 9（画像は現行素材を使用） */
@media screen and (max-width: 640px) {
  #salon #header {
    padding: 20px 8px 0 23px;
  }

  #salon #header .logo a {
    width: 120px;
  }

  #salon .header-menu-btn {
    height: 29px;
  }

  #salon .reserve-tab {
    display: none;
  }

  #salon .page-title {
    padding: 104px 30px 0;
  }

  #salon .page-title h1 {
    margin-bottom: 2px;
    font-size: 1.9rem;
    line-height: 1.45;
  }

  #salon .page-title .en {
    font-size: 0.9rem;
    letter-spacing: 0.2em;
  }

  #salon .title-wave {
    top: 140px !important;
  }

  #salon .salon-gallery {
    width: calc(100% - 48px);
    max-width: none;
    margin: 235px auto 0;
  }

  #salon .salon-hero-photo {
    width: 100%;
    border-radius: 10px;
  }

  #salon .gallery-grid {
    grid-template-columns: 1fr;
    row-gap: 14px;
    width: 100%;
    margin-top: 16px;
  }

  #salon .gallery-grid figure img {
    width: 100%;
    border-radius: 10px;
  }

  #salon .gallery-grid figcaption {
    margin-top: 5px;
    font-size: 0.9rem;
    line-height: 1.5;
  }

  #salon .staff-section {
    display: flex;
    flex-direction: column;
    width: calc(100% - 48px);
    max-width: none;
    margin: 86px auto 0;
  }

  #salon .staff-section h2,
  #salon .access-section h2 {
    font-size: 3rem;
  }

  #salon .staff-photo {
    order: 2;
    width: 100%;
    max-width: none;
    margin: 30px auto 0;
  }

  #salon .staff-copy {
    order: 3;
    margin-top: 31px;
    font-size: 1.3rem;
    line-height: 2.55;
    letter-spacing: 0.04em;
  }

  #salon .staff-signature {
    order: 4;
    align-self: flex-end;
    margin-top: 28px;
  }

  #salon .staff-signature span {
    margin-right: 25px;
    font-size: 1rem;
  }

  #salon .staff-signature strong {
    font-size: 1.4rem;
  }

  #salon .access-section {
    display: block;
    width: 100%;
    max-width: none;
    margin: 103px auto 74px;
  }

  #salon .access-section h2 {
    width: calc(100% - 48px);
    margin: 0 auto;
  }

  #salon .access-content {
    width: 100%;
    margin-top: 29px;
  }

  #salon .access-content iframe,
  #salon .access-map {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
  }

  #salon .access-details {
    width: calc(100% - 48px);
    margin: 27px auto 0;
  }

  #salon .access-address {
    font-size: 1.2rem;
    line-height: 2;
  }

  #salon .access-tel {
    margin-top: 13px;
  }

  #salon .access-tel a {
    font-size: 3rem;
  }

  #salon .access-details h3 {
    margin-top: 35px;
    font-size: 1.3rem;
  }

  #salon .access-parking {
    margin-top: 17px;
    font-size: 1.2rem;
    line-height: 2.4;
  }

  #salon .access-parking br {
    display: none;
  }

  #salon #footer {
    padding-top: 0;
  }

  #salon #footer .footer-top {
    flex-direction: column-reverse;
    gap: 57px;
    padding: 0;
  }

  #salon #footer .footer-info {
    width: calc(100% - 48px);
    margin: 0 auto;
    padding: 0;
  }

  #salon #footer .footer-logo {
    display: block;
    width: 210px;
    margin: 0 auto 28px;
  }

  #salon #footer .footer-address,
  #salon #footer .footer-table {
    font-size: 1.2rem;
  }

  #salon #footer .footer-table dt {
    width: 70px;
  }

  #salon #footer .footer-table > div:last-child {
    padding: 9px 0;
  }

  #salon #footer .footer-photo {
    width: calc(100% - 24px);
    margin-left: 24px;
  }

  #salon #footer .footer-cta {
    gap: 23px;
    margin-top: 42px;
    padding: 0 23px;
  }

  #salon #footer .footer-cta > div {
    flex: 0 0 auto;
    width: min(calc(100vw - 46px), 354px);
    max-width: none;
  }

  #salon #footer .footer-cta .cta-label {
    font-size: 1.4rem;
  }

  #salon #footer .footer-cta .tel-num {
    font-size: 3rem;
  }

  #salon #footer .footer-cta .btn-pill-fill {
    width: min(280px, calc(100% - 8px));
    padding: 17px 24px;
    font-size: 1.1rem;
  }
}

/* ==========================================================================
   #contact（お問い合わせ・FAQ）
   ========================================================================== */
/* SP用（SPカンプなし・PC比按分） */
@media screen and (max-width: 640px) {
  #contact #header {
    padding: 15px 20px 0;
  }

  #contact #header .logo a {
    width: 130px;
  }

  #contact .header-menu-btn img {
    width: 25px;
  }

  #contact .reserve-tab {
    top: auto;
    bottom: 16px;
    right: 50%;
    width: min(330px, calc(100% - 105px));
    height: 54px;
    transform: translateX(50%);
  }

  #contact .page-title {
    padding: 90px 20px 0;
  }

  #contact .page-title h1 {
    font-size: 2.4rem;
  }

  #contact .page-title .en {
    font-size: 1.4rem;
  }

  #contact .title-wave {
    top: 30px;
    min-width: 640px;
  }

  #contact .faq-section,
  #contact .contact-form-section {
    display: block;
    width: calc(100% - 40px);
    max-width: none;
  }

  #contact .faq-section {
    margin-top: 165px;
  }

  #contact .contact-form-section {
    margin-top: 85px;
    padding-bottom: 20px;
  }

  #contact .contact-section-heading {
    margin-bottom: 35px;
    font-size: 3.5rem;
  }

  #contact .faq-question {
    gap: 14px;
    min-height: 54px;
    padding: 13px 16px;
    font-size: 1.3rem;
  }

  #contact .faq-item .a {
    margin: 18px 5px 22px;
    font-size: 1.3rem;
    line-height: 1.9;
  }

  #contact .faq-item .a br {
    display: none;
  }

  #contact .form-note {
    margin-bottom: 18px;
    font-size: 1.3rem;
  }

  #contact .contact-form dl {
    display: block;
    margin-bottom: 18px;
  }

  #contact .contact-form dt {
    width: 100%;
    min-height: 46px;
    margin-bottom: 8px;
    padding: 10px 15px;
    font-size: 1.3rem;
  }

  #contact .contact-form input[type="text"],
  #contact .contact-form input[type="tel"],
  #contact .contact-form input[type="email"] {
    height: 54px;
  }

  #contact .contact-form .confirm-label {
    margin-top: 18px;
    font-size: 1.3rem;
  }

  #contact .contact-form .message-row {
    margin-top: 0;
  }

  #contact .contact-form textarea {
    height: 200px;
    min-height: 200px;
  }

  #contact .contact-form .form-submit {
    margin-top: 35px;
  }

  #contact .contact-form .form-submit input {
    width: 210px;
    height: 60px;
    transform: none;
  }

  #contact #footer {
    padding-top: 90px;
  }

  #contact #footer .footer-top {
    flex-direction: column;
    gap: 45px;
    padding: 0 20px;
  }

  #contact #footer .footer-info {
    width: 100%;
    margin-left: 0;
    padding: 0;
  }

  #contact #footer .footer-logo {
    width: min(260px, 80vw);
  }

  #contact #footer .footer-address,
  #contact #footer .footer-table {
    font-size: 1.4rem;
  }

  #contact #footer .footer-table dt {
    width: 85px;
  }

  #contact #footer .footer-photo {
    width: 100%;
  }

  #contact #footer .footer-wave {
    bottom: 0;
  }

  #contact #footer .footer-cta {
    gap: 30px;
    margin-top: 50px;
  }

  #contact #footer .footer-cta > div {
    max-width: 320px;
  }
}

/*SP用*/
@media screen and (max-width:640px) {

  /* 全ページ共通の下層ページタイトル */
  .page-title h1 {
    letter-spacing: 0.15em;
  }

  .eyebrow {
    font-size: 3rem;
  }

  #footer .footer-cta .tel-num {
    font-size: 3rem;
  }

  .article-lead {
    font-size: 1.7rem;
  }

  .article-block p,
  .split-block p {
    font-size: 1.4rem;
    line-height: 1.9;
  }

  .gallery-grid {
    grid-template-columns: 1fr;
  }

  .course-cards {
    gap: 30px;
  }

  .course-card-plus {
    margin: 0;
  }

  .faq-item .q,
  .faq-item .a {
    font-size: 1.4rem;
  }

  .cta-card {
    flex-direction: column;
    text-align: center;
  }

  /* #top */
  #top .top-course-en {
    font-size: 2.6rem;
  }

  #top .top-neck-heading {
    padding-right: 10px;
  }

  #top #footer .footer-top {
    flex-direction: column-reverse;
    gap: 30px;
  }

  #top #footer .footer-photo {
    max-width: none;
  }

  /* #salon */
  #salon .staff-name {
    font-size: 1.9rem;
  }

  #salon .access-block dd a[href^="tel:"] {
    font-size: 3rem;
  }

  /* #contact */
  #contact .contact-form dt {
    font-size: 1.4rem;
  }
}

/* TOP mobile layout */
@media screen and (max-width:640px) {
  #top .top-hero {
    padding: 230px 20px 0;
  }

  #top .hero-wave {
    top: 390px;
    width: 100%;
    max-width: none;
    opacity: 0.42;
  }

  #top .top-hero-logo {
    width: 205px;
    margin-bottom: 30px;
  }

  #top .top-hero-catch {
    font-size: 1.2rem;
    line-height: 1.9;
    letter-spacing: 0.28em;
  }

  #top .top-hero-catch span:last-child {
    margin-top: 5px;
    font-size: 1.75rem;
    letter-spacing: 0.22em;
  }

  #top .top-hero-visual {
    width: 96px;
    margin-top: 210px;
  }

  #top .top-lead {
    padding: 85px 20px 95px;
  }

  #top .top-lead-heading {
    margin-bottom: 58px;
    font-size: 1.55rem;
    line-height: 2.25;
    letter-spacing: 0.13em;
  }

  #top .top-lead-grid {
    gap: 50px;
  }

  #top .top-lead-photos {
    align-self: flex-end;
    width: min(100vw, 402px);
    max-width: none;
    margin: 0 -20px 0 0;
    gap: 0;
  }

  #top .top-lead-photos .photo-main {
    width: 71.24%;
    margin: 0 4.85% 0 23.91%;
    border-radius: 8px;
    aspect-ratio: 587 / 495;
  }

  #top .top-lead-photos .photo-sub2 {
    width: 32.28%;
    margin: 10.2% 0 0 6.31%;
    border-radius: 8px;
    aspect-ratio: 1 / 1;
  }

  #top .top-lead-photos .photo-sub1 {
    width: 50.85%;
    flex: none;
    margin: 10.2% 0 0 7.77%;
    border-radius: 8px;
    aspect-ratio: 1 / 1;
  }

  #top .top-lead-copy {
    width: 100%;
    max-width: 350px;
    margin: 0 auto;
  }

  #top .top-lead-text {
    margin-bottom: 30px;
    font-size: 1.25rem;
    line-height: 2.25;
    letter-spacing: 0.06em;
  }

  #top .top-lead-btn {
    margin-top: 42px;
    text-align: center;
  }

  #top .btn-pill,
  #top .btn-pill-fill {
    max-width: 350px;
    padding: 17px 24px;
    font-size: 1.2rem;
  }

  #top .btn-pill-double > span:first-child {
    font-size: 1.35rem;
  }

  #top .btn-pill-double .pill-link {
    gap: 10px;
    font-size: 1.1rem;
  }

  #top .top-concept {
    padding: 95px 12px 120px;
  }

  #top .mid-wave {
    display: block;
    top: -115px;
    left: 50%;
    width: 900px;
    max-width: none;
    transform: translateX(-50%);
    opacity: 0.35;
  }

  #top .top-concept-heading {
    max-width: 345px;
    margin: 0 auto;
    font-size: 1.3rem;
    line-height: 2.65;
    letter-spacing: 0.08em;
  }

  #top .top-headspa {
    padding: 0 0 65px;
  }

  #top .headspa-intro-photo {
    aspect-ratio: 1 / 1.08;
    object-position: center;
  }

  #top .headspa-intro-card {
    max-width: 370px;
    margin: 0 auto;
    padding: 52px 28px 0;
  }

  #top .headspa-intro-text {
    margin-bottom: 32px;
    font-size: 1.25rem;
    line-height: 2.3;
    letter-spacing: 0.05em;
  }

  #top .headspa-intro-catch {
    font-size: 1.75rem;
    line-height: 1.9;
    letter-spacing: 0.1em;
  }

  #top .top-headspa-photos {
    width: max-content;
    margin-left: 50%;
    padding: 72px 0 0;
    gap: 12px;
    overflow: visible;
    transform: translateX(-50%);
  }

  #top .top-headspa-photos img {
    width: 150px;
    border-radius: 10px;
  }

  #top .headspa-private {
    margin-top: 82px;
    padding: 72px 28px 125px;
  }

  #top .headspa-private::before {
    right: 0;
    bottom: 27px;
    width: min(80vw, 322px);
    height: min(73vw, 294px);
    border-radius: 160px 0 0 160px;
  }

  #top .headspa-private-text {
    max-width: 345px;
    margin: 0 auto 50px;
  }

  #top .headspa-private-text h3 {
    margin-bottom: 30px;
    font-size: 1.65rem;
    line-height: 2;
    letter-spacing: 0.1em;
  }

  #top .headspa-private-text p {
    font-size: 1.25rem;
    line-height: 3;
    letter-spacing: 0.05em;
  }

  #top .headspa-private-links {
    width: 100%;
    gap: 14px;
  }

  #top .headspa-private-links .btn-pill-fill {
    min-height: 71px;
    padding: 18px 30px;
    border: 1px solid var(--color-accent);
    box-shadow: none;
  }

  #top .headspa-private-links .btn-pill-double > span:first-child {
    font-size: 1.5rem;
  }

  #top .top-course {
    padding: 0px 26px 115px;
    position: relative;
    z-index: 1000;
    overflow: initial;
  }

  #top .top-course::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: -130px;
    left: 50%;
    width: 160%;
    height: 310px;
    border-radius: 0 0 50% 50%;
    background: var(--color-accent-pale);
    transform: translateX(-50%);
    pointer-events: none;
    display: none;
  }

  #top .course-wave {
    display: block;
    top: -163px;
    left: 50%;
    width: 100%;
    max-width: none;
    transform: translateX(-50%);
    opacity: 0.36;
    /* display: none; */
    z-index: 100;
    position: absolute;
    z-index: 100;
  }

  #top .top-course-en {
    font-size: 2.6rem;
    letter-spacing: 0.18em;
  }

  #top .top-course-heading {
    margin: 8px 0 58px;
    font-size: 1.6rem;
    letter-spacing: 0.22em;
  }

  #top .course-cards {
    gap: 100px;
    max-width: 350px;
  }

  #top .course-card {
    width: 100%;
  }

  #top .course-card-photo {
    width: min(270px, 76vw);
    height: min(270px, 76vw);
    margin-bottom: 30px;
  }

  #top .course-card-ja {
    font-size: 1.7rem;
  }

  #top .course-card-en {
    margin-bottom: 22px;
    font-size: 1.1rem;
  }

  #top .course-card-copy {
    margin-bottom: 26px;
    font-size: 1.35rem;
  }

  #top .course-card-text {
    max-width: 340px;
    margin: 0 auto 30px;
    font-size: 1.2rem;
    line-height: 2.25;
    letter-spacing: 0.04em;
  }

  #top .course-card-btn {
    max-width: 330px;
    margin: 0 auto;
  }

  #top .top-neck {
    padding: 12px 0 4px;
  }

  #top .top-neck-bg {
    /* opacity: 0.2; */
    object-fit: contain;
  }

  #top .top-neck-inner {
    width: 100%;
    max-width: 430px;
    padding: 0 26px;
  }

  #top .top-neck-heading {
    max-width: 340px;
    margin: 0 0 48px auto;
    padding-right: 10px;
    font-size: 1.8rem;
    line-height: 2.05;
    letter-spacing: 0.13em;
  }

  #top .top-neck-top {
    gap: 38px;
    margin-bottom: 78px;
  }

  #top .top-neck-illust {
    width: min(330px, 96%);
    margin-left: -8px;
  }

  #top .top-neck-lead {
    max-width: 340px;
    margin: 0 auto;
    font-size: 1.25rem;
    line-height: 2.35;
    letter-spacing: 0.05em;
  }

  #top .top-neck-columns {
    max-width: 340px;
    margin: 0 auto 72px;
    gap: 68px;
  }

  #top .neck-col-title {
    max-width: 300px;
    margin: 0 auto 35px;
    padding: 36px 0;
  }

  #top .neck-col-title span {
    font-size: 1.4rem;
    letter-spacing: 0.06em;
  }

  #top .neck-col-title::before,
  #top .neck-col-title::after {
    width: 46px;
  }

  #top .neck-col p {
    font-size: 1.2rem;
    line-height: 2.25;
    letter-spacing: 0.04em;
  }

  #top .top-neck-btn a {
    max-width: 330px;
  }

  #top #footer {
    padding-top: 95px;
    padding-bottom: 0;
  }

  #top #footer .footer-top {
    gap: 48px;
    padding: 0;
  }

  #top #footer .footer-photo {
    width: 100%;
    max-width: none;
  }

  #top #footer .footer-photo img {
    display: block;
    width: 100%;
    padding: 0 0 0 23px;
  }

  #top #footer .footer-info {
    width: calc(100% - 48px);
    max-width: 360px;
    margin: 0 auto;
    padding: 0;
  }

  #top #footer .footer-logo {
    display: block;
    width: 185px;
    margin: 0 auto 25px;
  }

  #top #footer .footer-address {
    font-size: 1.2rem;
    line-height: 2;
    letter-spacing: 0.08em;
  }

  #top #footer .footer-table {
    font-size: 1.2rem;
  }

  #top #footer .footer-table dt {
    width: 88px;
  }

  #top #footer .footer-cta {
    gap: 24px;
    margin-top: 65px;
  }

  #top #footer .footer-cta > div {
    flex: none;
    width: min(300px, calc(100vw - 72px));
    max-width: 300px;
  }

  #top #footer .footer-cta .icon-circle {
    width: 46px;
    height: 46px;
    margin-bottom: 13px;
  }

  #top #footer .footer-cta-tel .icon-circle img {
    width: 46px;
  }

  #top #footer .footer-cta .cta-label {
    font-size: 1.2rem;
  }

  #top #footer .footer-cta .tel-num {
    font-size: 2.3rem;
  }

  #top #footer .footer-cta .btn-pill-fill {
    width: 230px;
    padding: 15px 20px;
    font-size: 1rem;
    letter-spacing: 0.14em;
  }

  #top #footer .footer-wave {
    /* left: 50%; */
    /* width: 100%; */
    /* transform: translateX(-50%); */
    /* position: initial; */
  }

  #top #footer .footer-wave img {
    min-width: 100%;
  }
}

@media screen and (max-width:374px) {
  #top .top-hero {
    padding-top: 200px;
  }

  #top .top-lead,
  #top .top-concept,
  #top .headspa-intro-card,
  #top .headspa-private,
  #top .top-course,
  #top .top-neck-inner {
    padding-right: 20px;
    padding-left: 20px;
  }

  #top .btn-pill,
  #top .btn-pill-fill {
    padding-right: 20px;
    padding-left: 20px;
  }

  #top .btn-pill-double > span:first-child {
    font-size: 1.2rem;
  }

  #top .btn-pill-double .pill-link {
    font-size: 1rem;
  }
}