@charset "UTF-8";

.second-hero { height: 80vw; }
.second-hero-title{ margin-bottom: 10vw; }
.second-hero-title .en { font-size: 18vw; }
.second-hero-title small.en { margin-bottom: 10vw; display: block; font-size: 5vw; }
.second-hero-title small { display: block; font-size: 4.2vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; line-height: 1.4; }
.inner { width: 80vw; margin: 0 auto;}

.top-info { padding: 20vw 0; background: #f6f1ef; }
.top-info-title { margin: 0 auto 12vw; text-align: center; position: relative; display: table; }
.top-info-title:before { content: ''; width: 2.8vw; height: 2.8vw; background: url(../images/deco01@2x.png) no-repeat center; background-size: 100%; position: absolute; top: -5vw; left: -5vw; }
.top-info-title .en { margin-bottom: 4vw; font-size: 10vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; letter-spacing: 0.6vw; display: block; }
.top-info-title .jp { font-size: 3.68vw; font-family: var(--mincho); display: block; }
.top-info-content { width: 90vw; margin: 0 auto; }
.top-info-text { padding: 10vw 5vw; background: var(--white); border-radius: 2vw; box-shadow: 0 2vw 4vw rgba(0, 0, 0, 0.1); }
.top-info-text p { font-size: 3.68vw; text-align: left; line-height: 1.8; letter-spacing: 0.04em; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; }
.top-info-text p .sub-title { font-weight: 600; color: var(--red); font-size: 4.6vw; display: block; margin-bottom: 4vw; padding-bottom: 2vw; text-align: center; border-bottom: 2px solid var(--red); font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; }
.top-info-map { margin: 2vw 0; padding: 1vw 0; color: var(--red); text-decoration: underline; font-weight: 600; text-align: center; border: 1px solid var(--red); border-radius: 50px; }

.first-top { margin-bottom: 20vw; }
.first-top .parallax-box { margin-bottom: 10vw; }
.first-top img { width: 100%; }
.top-first-title { margin-bottom: 10vw; font-size: 8vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; line-height: 1.4; }
.first-top p { font-size: 5vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; line-height: 2; }

.first-therapist { width: 80vw; margin: 0 auto 10vw; }
.first-therapist .parallax-box { margin-bottom: 10vw; }
.first-therapist img { width: 100%; }
.first-therapist p { margin-bottom: 6vw; font-size: 5vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; line-height: 2; }
.first-therapist .more { margin: 0; }

.first-pair { margin-bottom: 10vw; padding-top: 10vw; }
.first-pair .parallax-box { margin-bottom: 10vw; }
.first-pair img { width: 100%; }
.first-pair p { font-size: 5vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; line-height: 2; }

.top-faq-gallery-items { width: 100%; }
.top-faq-gallery-item { width: 435vw; font-size: 21.05vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; opacity: 0.2; }

.first-message { width: 80vw; margin: 0 auto 20vw; padding-top: 10vw; }
.first-message .parallax-box { margin-bottom: 10vw; }
.first-message img { width: 100%; }
.first-message p { margin-bottom: 6vw; font-size: 5vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; line-height: 2; }
.first-message .more { margin: 0 0 20vw; }

.menu .midashi01 { width: 100%; margin: 0 auto 6vw; color: var(--navy); text-align: center; }
.menu .midashi01 .en { line-height: 1.2; }
.menu .tab-text { text-align: center; font-size: 5vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; line-height: 2; }
.menu .tab { margin-bottom: 0; }
.menu .tab a { font-size: 3.8vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; }
.menu .panel { padding-top: 10vw; }
.menu dl { margin-bottom: 4vw; padding: 5%; background: url(images/top-campaign-bg.jpg) no-repeat top center; background-size: cover; }
.menu dt { margin-bottom: 4vw; }
.menu dt img { width: 100%; }
.menu .menu-title { margin-bottom: 2vw; font-size: 5vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; line-height: 1.4; }
.menu .menu-title small { display: block; font-size: 4vw; }
.menu .menu-price { color: var(--red); margin-bottom: 4vw; padding: 1vw 0 4vw; font-size: 9vw; font-family: "Cormorant Garamond"; font-weight: 400; line-height: 1.4; letter-spacing: 0.4vw; line-height: 1; margin-right: 2vw; border-bottom: 1px solid var(--red); }
.menu .menu-price span { width: fit-content; margin-bottom: 2vw; display: block; font-size: 70%; text-align: center; background: var(--red); border-radius: 8px; color: var(--white); padding: 1.5vw 2.5vw; font-family: "Cormorant Garamond"; font-weight: 400; letter-spacing: 0.04rem; line-height: 1; }
.menu .menu-price small { font-size: 60%; }
.menu .menu-text { text-align: justify; }
.menu .menu-text p { font-size: 4vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; text-align: left; letter-spacing: 0.02rem; }

.menu .more { padding: 4vw 0; }

.salon .midashi01 { display: block; }
.salon .midashi01 .en { width: 100%; display: block; text-align: center; }
.salon-image { width: 100%; margin-bottom: 6vw; }
.salon dl { margin-bottom: 6vw; padding-bottom: 4vw; border-bottom: 1px solid #f1f1f1; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; letter-spacing: 0.02rem; }
.salon dl:last-of-type { margin-bottom: 12vw; }
.salon dt { margin-bottom: 2vw; font-size: 5vw; font-weight: bold; line-height: 1.6; }
.salon dd { font-size: 4vw; line-height: 1.6; }
.salon .time dd { margin-bottom: 2vw; font-size: 4.8vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; letter-spacing: 0.02rem; }
.salon .time dd span,.access-text span { margin-right: 2vw; padding: 1vw 4vw; color: #fff; font-size: 5vw; background: var(--red); border-radius: 6px; }
.salon dd .en { font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; letter-spacing: 0.02rem; }
.salon dd a { position: relative; }
.salon dd a.tel { margin-bottom: 2vw; font-size: 8vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; letter-spacing: 0.02rem; }
.salon dd a.more { width: 80vw; padding: 4vw 0; }
.salon dd a.more:after { right: 5vw; }
.salon dd .address { font-size: 3.68vw; line-height: 1.6; }
.salon dd .access-text { margin-bottom: 4vw; font-size: 4vw; text-align: justify; }
.salon dd .access-text span { width: fit-content; display: block; margin-bottom: 2vw; }
.salon dd .access-text b { margin-bottom: 2vw; padding-bottom: 2vw; display: block; font-size: 4vw; border-bottom: 1px solid var(--black); }
.salon .google { width: fit-content; margin-bottom: 6vw; font-size: 4.2vw; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; letter-spacing: 0.05rem; text-decoration: underline; position: relative; }
.salon .google::after { content: ''; width: 100%; height: 100%; background: url(../images/arrow01.png) no-repeat right; background-size: auto 60%; position: absolute; top: 0; right: -5vw; }
.salon .map-image-area { margin-bottom: 12vw; font-size: 4vw; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; letter-spacing: 0.02rem; }
.salon .map-image-area p { text-align: center; }
.salon .map-image { width: 100%; margin-bottom: 2vw; }
.salon .map { filter: saturate(0%); }

.header-logo { left: 8vw; }
.header-logo img { width: 100%; }
.header-navi-button { display: none; }
.header-tel { right: 5vw; }

.footer-content { padding: 12vw 0 10vw; }
.footer-content p { color: var(--white); font-size: 10vw; font-family: "Cormorant Garamond"; font-weight: 400; text-align: center; letter-spacing: 0.04rem; line-height: 1; }
.footer-content small { display: block; font-size: 40%; text-align: center; }
.pagetop { top: 6vw; }

.footer-fixed-items li { width: 100%; }
.footer-fixed-items a { padding: 4vw 0; }
.footer-fixed-items .title { font-size: 7vw; }

/* =============================================
    pc
================================================*/

@media screen and (min-width: 736px) {

.second-hero { height: 450px; }
.second-hero-title .en { font-size: 90px; }
.second-hero-title small.en { margin-bottom: 60px; font-size: 24px; }
.second-hero-title small { font-size: 24px; }

.top-info { margin: 40px 0 120px; padding: 120px 0; }
.top-info-title { margin-bottom: 60px; }
.top-info-title:before { width: 14px; height: 14px; top: -30px; left: -30px; }
.top-info-title .en { margin-bottom: 20px; font-size: 60px; letter-spacing: 6px; }
.top-info-title .jp { font-size: 16px; }
.top-info-content { width: 900px; margin: 0 auto; }
.top-info-text { padding: 40px; border-radius: 10px; }
.top-info-text p { font-size: 16px; text-align: center; line-height: 1.8; font-family: "Jost"; font-optical-sizing: auto; font-weight: 300; }
.top-info-text p .sub-title { font-size: 30px; margin-bottom: 20px; padding-bottom: 10px; font-family: "Cormorant Garamond"; font-optical-sizing: auto; font-weight: 500; }
.top-info-map { width: fit-content; margin: 10px auto; padding: 4px 40px; }

.inner { width: 100%; margin: 0; }

.first-top { width: 90%; max-width: 900px; margin: 0 auto 100px; }
.first-top .parallax-box { margin-bottom: 80px }
.top-first-title {margin-bottom: 50px;padding-left: 40px;font-size: 40px;}
.first-top p { padding: 0 40px; font-size: 20px; }

.first-therapist { width: 90%; max-width: 900px; margin: 0 auto 100px; padding-left: 40px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.first-therapist .parallax-box { width: 40%; margin-bottom: 0; }
.first-therapist .flex-inner { width: 46%; }
.first-therapist .top-first-title {margin-bottom: 50px;padding-left: 0;}
.first-therapist p { margin-bottom: 60px; font-size: 20px; }
.first-therapist .more { margin: 0; }

.first-pair { width: 90%; max-width: 900px; margin: 0 auto 80px; padding-top: 0; }
.first-pair .parallax-box { margin-bottom: 80px; font-size: 20px; }
.first-pair p {padding: 0 40px;font-size: 20px;}

.top-faq-gallery-items { height: 180px; margin-bottom: -100px; overflow: hidden; }
.top-faq-gallery-item { width: 2480px; font-size: 180px; letter-spacing: 10px; }

.first-message { width: 90%; max-width: 900px; margin: 0 auto 100px; padding: 180px 0 0 40px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.first-message .parallax-box { width: 40%; margin-bottom: 0; }
.first-message .flex-inner { width: 46%; }
.first-message .top-first-title {margin-bottom: 50px;padding-left: 0;font-size: 40px;}
.first-message p {margin-bottom: 60px;font-size: 20px;}
.first-message .more { margin: 0; }

.menu .midashi01 { margin: 0 auto 30px; }
.menu .midashi01 .en { font-size: 50px; }
.menu .tab-text { font-size: 24px; }
.menu .tab li { width: 30%; }
.menu .tab a { font-size: 14px; }
.menu .tab a::after { right: 14px; }
.menu .panel { padding-top: 100px; }
.menu dl { padding: 40px 20px; margin-bottom: 20px; background: url(images/top-campaign-bg-pc@2x.jpg) no-repeat top center; background-size: cover; }
.menu dt { margin-bottom: 40px; }
.menu .menu-title { margin-bottom: 10px; font-size: 24px; }
.menu .menu-title small { font-size: 20px; }
.menu .menu-price { margin-bottom: 20px; padding: 4px 0 20px; font-size: 40px; margin-right: 8px; letter-spacing: 2px;  }
.menu .menu-price span { padding: 4px 10px 4px 14px; line-height: 1; margin: 0 8px 0 0; display: inline-block; letter-spacing: 2px; vertical-align: top; }
.menu .menu-text p {margin-bottom: 30px;font-size: 20px;}
.menu .more { margin: 0; padding: 20px 0; }

.salon-image { margin-bottom: 60px; }
.salon dl { margin-bottom: 30px; padding-bottom: 20px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.salon dl:last-of-type { margin-bottom: 60px; }
.salon dt { width: 200px; margin-bottom: 0; font-size: 20px; }
.salon dd { width: 68%; font-size: 20px; }
.salon .time dd {width: 100%;margin-bottom: 10px;font-size: 24px;}
.salon .time dd span,.access-text span { margin-right: 10px; padding: 4px 20px; font-size: 14px; }
.salon dd .line { margin-bottom: 10px; padding: 4px 40px 4px 20px; }
.salon dd a::after { right: 20px; transition: all .6s; }
.salon dd a:hover::after { right: 14px; }
.salon dd a.tel { margin-bottom: 0; font-size: 40px; }
.salon dd .address {font-size: 19px;}
.salon dd a.more { width: 400px; margin: 0; padding: 20px 0 18px; font-size: 16px; }
.salon dd a.more:after { right: 30px; }
.salon dd .access-text { font-size: 20px; }
.salon dd .access-text span { margin-bottom: 10px; font-size: 20px; }
.salon dd .access-text b {margin-bottom: 10px;padding-bottom: 10px;font-size: 20px;}
.salon .google { margin: 0 auto 40px; font-size: 20px; }
.salon .google::after { right: -18px; transition: all .6s; }
.salon .google:hover::after { right: -24px; }
.salon .map-image-area { margin-bottom: 60px; }
.salon .map-image { margin-bottom: 0; }
.salon iframe { height: 250px; }

.header-tel { right: 0; }
.header-tel .title { font-size: 18px; }

.footer-content { max-width: 900px; padding: 80px 0 30px; }
.footer-content p { font-size: 160px; }
.footer-content small { font-size: 40%; }
.pagetop { top: 50px; }
}

@media screen and (min-width: 900px) {
.salon .flex { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.salon .flex > div { width: 48%; }
.salon iframe { height: 570px; }
.salon .map-image-area { margin-bottom: 0; }
}

@media screen and (min-width: 1000px) {
.menu dl { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: flex-start; align-items: flex-start; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.menu dl div { width: 64%; margin-bottom: 0; }
.menu dt { width: 30%; margin-bottom: 0; }
}

@media screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 736px) and (min-resolution: 2dppx) {
.menu dl { background: url(images/top-campaign-bg-pc@2x.jpg) no-repeat top center; background-size: cover; }
.google a::after { background: url(../images/arrow01@2x.png) no-repeat right; background-size: auto 52%; position: absolute; top: 0; right: 20px; }
.google::after { background: url(../images/arrow01@2x.png) no-repeat right; background-size: auto 52%; position: absolute; top: 0; right: -26px; }
}