@charset "UTF-8";
@import url(all.css);
/* ###################### */
/* ######## 変数 ######## */
/* ###################### */
/* カラー */
/* パターン */
/* 書式 */
/* ###################### */
/* ######## 関数 ######## */
/* ###################### */
/*===============================================
  切り替え用
===============================================*/
.sp-none {
  display: none !important;
}

.com-table table,
.com-table table tbody,
.com-table table th,
.com-table table tr,
.com-table table td {
  display: block !important;
  width: 100% !important;
}

/*===============================================
  ページネーション
===============================================*/
.pagenation {
  margin-top: clamp(24px, 7.5vw, 30px);
}
.pagenation li {
  width: 2em;
  font-size: 1em;
  line-height: 2em;
  margin: 5px 4px 0;
}

/*===============================================
  詳細ページ前後
===============================================*/
.paginated-link {
  margin-top: clamp(24px, 7.5vw, 30px);
}
.paginated-link li {
  width: 7.5em;
}
.paginated-link li a {
  font-size: 0.8em;
}
.paginated-link li.prev-link a:before {
  margin-right: 0.5em;
}
.paginated-link li.next-link a::after {
  margin-left: 0.5em;
}

/*===============================================
  wrapper
===============================================*/
#wrapper {
  min-width: 320px;
}

/*===============================================
  header
===============================================*/
#header .h-inner {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  width: 90%;
  height: 80px;
}
#header .h-logo {
  width: 100px;
  margin-top: 10px;
  filter: drop-shadow(0 0 32px #fff) drop-shadow(0 0 32px #fff) drop-shadow(0 0 16px #fff) drop-shadow(0 0 16px #fff);
}

/*===============================================
  footer
===============================================*/
#footer {
  padding: 50px 0 60px;
}
#footer .f-inner {
  width: 90%;
}
#footer .f-logo {
  width: 150px;
  filter: drop-shadow(0 0 32px #fff) drop-shadow(0 0 32px #fff) drop-shadow(0 0 16px #fff) drop-shadow(0 0 16px #fff);
  margin: 0 auto 30px;
}
#footer .f-oth > * {
  margin-bottom: 30px;
}
#footer .f-oth > *:last-child {
  margin-bottom: 0;
}
#footer .f-info {
  font-size: clamp(1.3rem, 4.0540540541vw, 1.5rem);
  line-height: 2;
  letter-spacing: 0.05em;
}
#footer .f-info dl {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin-bottom: 2em;
}
#footer .f-info dl dt {
  width: 100%;
  margin-bottom: 1em;
}
#footer .f-info dl dd {
  line-height: 1.5;
}

/*フッターナビ
-----------------------------*/
.fnav {
  padding-top: 40px;
}
.fnav .fnav-list {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
  margin-top: -10px;
}
.fnav .fnav-list-item {
  width: 48%;
  border-bottom: solid 1px #bc7882;
  margin-top: 10px;
}
.fnav .fnav-list-item:nth-last-of-type(2n + 1):first-of-type {
  width: 100%;
}
.fnav .fnav-list-item a {
  font-size: clamp(1.3rem, 4.0540540541vw, 1.5rem);
  line-height: 2;
  padding: 1em 0;
}
.fnav .fnav-sub-list {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  padding-top: 20px;
}
.fnav .fnav-sub-item {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: clamp(1rem, 3vw, 1.2rem);
  line-height: 2;
}
.fnav .fnav-sub-item::after {
  content: "｜";
  margin: 0 0.5em;
}
.fnav .fnav-sub-item:last-child::after {
  display: none;
}
.fnav .fnav-sub-item a {
  padding: 0.5em;
}

/*コピーライト
-----------------------------*/
.copy {
  padding: 20px 0 10px;
}

/*===============================================
  fixed固定
===============================================*/
/*ページトップ
-----------------------------*/
#pagetop {
  width: 50px;
  height: 50px;
  right: 8px;
  bottom: 8px;
}
#pagetop a {
  font-size: 1.2rem;
  letter-spacing: 0.1em;
  padding-left: 0.1em;
}

/*===============================================
  visual
===============================================*/
/*メインビジュアル
-----------------------------*/
.main-visual {
  height: 112.5vw;
  padding-bottom: 15vw;
  background-size: 64%;
}
.main-visual::before {
  width: 90%;
  height: clamp(80px, 25vw, 160px);
  left: 50%;
  bottom: 0;
  transform: translateX(-50%) scale(-1, 1);
}
.main-visual .catch {
  width: 90%;
}
.main-visual .catch img {
  width: clamp(152px, 47.5vw, 304px);
  filter: drop-shadow(0 0 24px #fff) drop-shadow(0 0 12px #fff) drop-shadow(0 0 12px #fff);
}
.main-visual .mv-imgs {
  width: 64%;
  height: 96%;
}
.main-visual .mv-imgs .back {
  width: 80%;
  height: 86%;
  border-top-left-radius: 30vw;
}
.main-visual .mv-imgs .front {
  width: 50%;
  height: 100%;
}

/*サブビジュアル
-----------------------------*/
.sub-visual {
  height: 75vw;
  max-height: 480px;
  background-size: 64%;
}
.sub-visual::before {
  width: 72%;
  height: 83.3333334%;
  border-top-left-radius: 20vw;
}
.sub-visual .catch {
  min-width: 65%;
  padding: min(32px, 5vw);
  margin-left: 5%;
  border-width: 1px;
}
.sub-visual .catch .ja {
  font-size: min(4rem, 6.25vw);
  letter-spacing: 0.1em;
  margin-bottom: 0.5em;
}
.sub-visual .catch .en {
  font-size: min(2rem, 3.125vw);
  letter-spacing: 0.05em;
}

/*===============================================
  main#container
===============================================*/
#container {
  font-size: clamp(1.3rem, 4.0540540541vw, 1.5rem);
  line-height: 2;
  letter-spacing: 0.05em;
}

/*===============================================
  パンくずリスト
===============================================*/
.bread {
  padding-top: 0.8em;
}
.bread .breadcrumbs {
  width: 90%;
}
.bread .breadcrumbs li {
  font-size: 0.8em;
  line-height: 1.66667;
  letter-spacing: 0em;
}

/*===============================================
  main共通
===============================================*/
.inbox {
  width: 90%;
}

/*SNS
-----------------------------*/
.com-sns li {
  width: 40px;
  margin-right: 30px;
}

/*ボタン
-----------------------------*/
.com-btn {
  width: min(320px, 75vw);
  max-width: 100%;
  height: 60px;
  margin: 0 auto;
}
.com-btn a {
  font-size: 1em;
  letter-spacing: 0.06em;
  line-height: 1.5;
}
.com-btn.mail {
  width: min(360px, 83.3333333333vw);
  height: 80px;
}
.com-btn.mail a {
  font-size: max(1.5rem, 1.2em - 1px);
  padding-right: 0.5em;
}
.com-btn.mail a::before {
  width: 2em;
  height: 2em;
  margin-right: 1em;
}
.com-btn.line {
  width: min(360px, 83.3333333333vw);
  height: 80px;
}
.com-btn.line a {
  font-size: max(1.5rem, 1.2em - 1px);
  padding-right: 0.5em;
}
.com-btn.line a::before {
  width: 40px;
  height: 40px;
  margin-right: 20px;
}
.com-btn.target {
  width: min(360px, 100%);
  height: 80px;
}
.com-btn.target a {
  font-size: clamp(1.5rem, 4.5945945946vw, 1.7rem);
}
.com-btn.target a::before {
  width: 1.5em;
  height: 1.5em;
  margin-right: 1em;
}

/*テーブル
-----------------------------*/
.com-table tr {
  margin-bottom: 1em;
}
.com-table tr:last-of-type {
  margin-bottom: 0;
}
.com-table tr th {
  padding: 1em 1.5em;
  background: #fff;
}
.com-table tr td {
  padding: 1em 1.5em;
}

/*テキストボックス
-----------------------------*/
.com-text-box .mb {
  margin-bottom: 1em;
}
.com-text-box br {
  display: none;
}

/*SB未記入テキスト
-----------------------------*/
.com-no-txt {
  font-size: clamp(1.6rem, 5vw, 2rem);
  line-height: 1.5;
  padding: 2em 0;
}

/*ボックス装飾
-----------------------------*/
.com-box::before {
  width: calc(100% + 24px);
  height: calc(100% + 56px);
  top: -16px;
  background-size: 80px;
}

/*===============================================
  タイトル
===============================================*/
/*大タイトル
-----------------------------*/
.com-ttl01 {
  margin-bottom: clamp(32px, 10vw, 40px);
}
.com-ttl01 .ja {
  font-size: clamp(2rem, 6vw, 2.4rem);
  line-height: 1.5;
  letter-spacing: 0.06em;
  margin-right: -0.06em;
}
.com-ttl01 .ja:first-child {
  margin-top: -0.25em;
}
.com-ttl01 .ja:last-child, .com-ttl01 .ja:has(+ .en) {
  margin-bottom: -0.25em;
}
.com-ttl01 .en {
  font-size: clamp(1rem, 3vw, 1.2rem);
  letter-spacing: 0.05em;
  line-height: 2;
  padding: 0 1em;
  margin-top: 1.5em;
}

/*中タイトル
-----------------------------*/
.com-ttl02 {
  margin-bottom: clamp(20px, 6.25vw, 25px);
}
.com-ttl02 > span {
  font-size: clamp(2rem, 6vw, 2.4rem);
  line-height: 1.5;
  letter-spacing: 0.06em;
  margin-right: -0.06em;
}
.com-ttl02 > span:first-child {
  margin-top: -0.25em;
}
.com-ttl02 > span:last-child {
  margin-bottom: -0.25em;
}
.com-ttl02 > span .br {
  display: inline-block;
}

/*小タイトル
-----------------------------*/
.com-ttl03 {
  margin-bottom: 20px;
}
.com-ttl03 > span {
  font-size: clamp(1.6rem, 5vw, 2rem);
  line-height: 1.5;
  letter-spacing: 0.06em;
  margin-right: -0.06em;
}
.com-ttl03 > span:first-child {
  margin-top: -0.25em;
}
.com-ttl03 > span:last-child {
  margin-bottom: -0.25em;
}

/*===============================================
  共通セクション
===============================================*/
/*ご予約・お問い合わせ
-----------------------------*/
.com-contact-sec {
  padding: clamp(64px, 20vw, 80px) 0;
  background-size: 82%, 64%;
}
.com-contact-sec::before {
  width: 96.25%;
  max-width: 1848px;
  min-width: 1320px;
  height: clamp(210px, 25vw - 130px, 350px);
  bottom: clamp(10px, 10vw - 132px, 60px);
}
.com-contact-sec .contact-text {
  text-align: center;
}
.com-contact-sec .contact-text .br {
  display: inline-block;
}
.com-contact-sec .contact-text p {
  margin-right: -0.5em;
}
.com-contact-sec .contact-btn-wrap {
  padding-top: 30px;
}
.com-contact-sec .contact-btn {
  margin: 0 auto 20px;
}
.com-contact-sec .contact-btn:last-child {
  margin-bottom: 0;
}

/*セクション名
-----------------------------*/
/*===============================================
  トップページ
===============================================*/
/*こんなお悩みはありませんか？
-----------------------------*/
.top-worries {
  padding: 50px 0 0;
}
.top-worries::before {
  height: clamp(64px, 20vw, 80px);
  top: 12px;
}
.top-worries .worries-ttl > span {
  margin-right: -0.5em;
}
.top-worries .worries-ttl::before {
  width: 160px;
  height: 52px;
  margin-bottom: 12px;
}
.top-worries .worries-ttl::after {
  width: 400px;
  height: 64px;
  top: -15px;
}
.top-worries .worries-list-wrap {
  padding: 30px 20px;
}
.top-worries .worries-list-wrap::after {
  width: 1060px;
  height: 292px;
}
.top-worries .worries-list {
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  margin-bottom: 1em;
}
.top-worries .worries-list:last-of-type {
  margin-bottom: 0;
}
.top-worries .worries-list:last-of-type::after {
  height: 32px;
  bottom: -20px;
}
.top-worries .worries-list-item {
  line-height: 1.5;
  padding-left: 2.5em;
  margin-bottom: 1em;
}
.top-worries .worries-list-item br {
  display: none;
}
.top-worries .worries-list-item::before {
  width: 1.5em;
  height: 1.5em;
}

/*そのお悩み
自然派婦人科サロン enaの至福 に
ご相談ください！
-----------------------------*/
.top-about {
  padding: clamp(64px, 20vw, 80px) 0;
}
.top-about::before {
  height: calc(100% + 90px);
  background-size: 56%, cover;
}
.top-about .about-ttl .ja {
  font-size: clamp(1.8rem, 5.3333333333vw, 2.4rem);
  white-space: nowrap;
}
.top-about .about-ttl .b {
  padding: 0 0.25em;
  margin-right: 0.25em;
}
.top-about .about-box::after {
  width: clamp(112px, 35vw, 224px);
  height: clamp(80px, 25vw, 160px);
  right: 2.5%;
  bottom: -48px;
  z-index: 0;
}
.top-about .about-box .box-ttl > span {
  font-size: clamp(1.8rem, 5.3333333333vw, 2.4rem);
}
.top-about .about-box .box-btn {
  margin-top: 30px;
}
.top-about .about-box .box-imgs {
  padding-top: 40px;
}
.top-about .about-box .box-imgs li {
  width: 52%;
}
.top-about .about-box .box-imgs li:nth-of-type(1) {
  width: 44%;
}
.top-about .about-box .box-imgs li:nth-of-type(1) div {
  border-top-right-radius: 20vw;
  width: 100%;
  height: 0;
  padding-top: 125%;
  position: relative;
  z-index: 0;
}
.top-about .about-box .box-imgs li:nth-of-type(1) div img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}
.top-about .about-box .box-imgs li:nth-of-type(2) {
  margin-top: 12%;
}
.top-about .about-box .box-imgs li:nth-of-type(2) div {
  border-top-left-radius: 20vw;
  width: 100%;
  height: 0;
  padding-top: 150%;
  position: relative;
  z-index: 0;
}
.top-about .about-box .box-imgs li:nth-of-type(2) div img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

/*バナーリンクセクション
-----------------------------*/
.top-bnrs .bnrs-list-item {
  height: clamp(160px, 50vw, 200px);
  margin-bottom: 2px;
}
.top-bnrs .bnrs-list-item:last-of-type {
  margin-bottom: 0;
}
.top-bnrs .bnrs-list-item .item-in {
  width: clamp(256px, 80vw, 400px);
  height: clamp(90px, 28vw, 140px);
  background-size: 100% 100%;
}
.top-bnrs .bnrs-list-item .item-in::after {
  width: 16%;
  padding-top: 23%;
  right: -5%;
  bottom: -5%;
}
.top-bnrs .bnrs-list-item .item-ttl {
  justify-content: center;
  align-items: flex-end;
  flex-direction: row;
  margin-bottom: clamp(8px, 2.5vw, 10px);
}
.top-bnrs .bnrs-list-item .item-ttl .en {
  margin-right: 0.5em;
}
.top-bnrs .bnrs-list-item .item-text {
  font-size: clamp(1rem, 3.25vw, 1.3rem);
  padding: 0 0.5em;
}

/*初めての方へ
-----------------------------*/
.top-beginner {
  padding: clamp(64px, 20vw, 80px) 0 clamp(96px, 30vw, 120px);
}
.top-beginner::before {
  width: clamp(70px, 22vw, 88px);
  height: clamp(72px, 22.5vw, 90px);
  left: 5%;
  bottom: clamp(12px, 3.75vw, 15px);
}
.top-beginner::after {
  width: clamp(120px, 37.5vw, 150px);
  height: clamp(86px, 27vw, 108px);
  right: -5%;
  bottom: clamp(12px, 3.75vw, 15px);
}
.top-beginner .beginner-text {
  text-align: center;
}
.top-beginner .beginner-text .br {
  display: inline-block;
}
.top-beginner .beginner-btn {
  margin-top: 30px;
}

/*お知らせ
-----------------------------*/
.top-news {
  margin-top: 50vw;
}
.top-news::before {
  height: 100%;
}
.top-news .news-box {
  width: 100%;
  padding: clamp(64px, 20vw, 80px) 5%;
}
.top-news .news-box::before {
  width: 100%;
  background-size: 12%;
}
.top-news .news-box::after {
  width: calc(100vw - 160px);
  max-width: 1280px;
  min-width: 1120px;
  height: clamp(70px, 5.4vw, 81px);
  top: 62px;
}
.top-news .news-list-item {
  font-size: 0.8em;
  margin-bottom: 15px;
}
.top-news .news-list-item a {
  padding: 15px;
}
.top-news .news-list-item .date {
  width: 7em;
}
.top-news .news-list-item .tag {
  margin-left: 7em;
  margin-top: -2em;
}
.top-news .news-list-item .item-ttl {
  font-size: 1.25em;
  margin-top: 0.5em;
}
.top-news .news-btn {
  margin-top: 30px;
}

/*ご予約状況
-----------------------------*/
.top-reserve {
  padding: clamp(64px, 20vw, 80px) 0;
}
.top-reserve::before {
  display: none;
}
.top-reserve::after {
  width: 98%;
  padding-top: min(176px, 40%);
  top: 0;
}
.top-reserve .reserve-box {
  height: clamp(320px, 100vw, 400px);
}
.top-reserve .reserve-box::before {
  display: none;
}
.top-reserve .reserve-link {
  padding-top: 30px;
}
.top-reserve .reserve-link a {
  font-size: 1em;
  letter-spacing: 0.04em;
  line-height: 1;
  padding: 10px 0;
  margin-top: -10px;
}

/*===============================================
  enaの至福について
===============================================*/
/*enaの至福の想い
-----------------------------*/
.about-thoughts {
  padding: clamp(64px, 20vw, 80px) 0;
  background-size: 56%, cover;
}
.about-thoughts::before {
  width: 98%;
  background: url(../img/common/dryflower_rt.png) no-repeat right top/clamp(32px, 16vw, 64px);
}
.about-thoughts .thoughts-box .box-img {
  width: 150px;
  filter: drop-shadow(0 0 32px #fff) drop-shadow(0 0 32px #fff) drop-shadow(0 0 16px #fff) drop-shadow(0 0 16px #fff);
  padding-top: 10px;
  margin: 0 auto 20px;
}

/*代表紹介
-----------------------------*/
.about-greeting {
  padding: clamp(64px, 20vw, 80px) 0;
}
.about-greeting .greeting-img {
  width: 76.389%;
  max-width: 330px;
  margin: 0 auto 30px;
}
.about-greeting .greeting-img figcaption {
  font-size: clamp(2rem, 6vw, 2.4rem);
  line-height: 1.5;
  letter-spacing: 0.04em;
  padding: 0.5em 0;
}
.about-greeting .greeting-img figcaption .min {
  display: block;
  font-size: 0.75em;
  margin-right: -0.04em;
}
.about-greeting .greeting-license {
  padding: 30px 20px 60px;
}
.about-greeting .greeting-license::before {
  height: 32px;
  top: -16px;
}
.about-greeting .greeting-license::after {
  width: calc(100% + 30px);
  height: 96px;
  bottom: -64px;
  transform: translateX(-50%) scale(-1, 1);
}
.about-greeting .greeting-license .license-list-item {
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  letter-spacing: 0.06em;
  margin-bottom: 1em;
}
.about-greeting .greeting-box {
  padding-top: clamp(64px, 10vw, 40px);
}

/*enaの至福でできる事
-----------------------------*/
.about-feature {
  padding: clamp(64px, 20vw, 80px) 0 clamp(64px + 25vw, 45vw, 80px + 25vw);
}
.about-feature::before {
  width: clamp(260px, 81.25vw, 325px);
  height: clamp(80px, 25vw, 100px);
  top: clamp(80px, 25vw, 100px);
}
.about-feature::after {
  height: 25vw;
}
.about-feature .feature-box {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 60px 5vw 30px;
}
.about-feature .feature-box::after {
  content: "";
  width: 92vw;
  height: clamp(80px, 25vw, 100px);
  background: url(../img/common/cat_walk.png) no-repeat right bottom/contain;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -32px;
  z-index: -1;
}
.about-feature .feature-box > * {
  margin-bottom: 20px;
}
.about-feature .feature-box > *:last-child {
  margin-bottom: 0;
}
.about-feature .feature-box .box-list-item {
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  line-height: 1.5;
  padding-left: 2.5em;
  margin-bottom: 1em;
}
.about-feature .feature-box .box-list-item::before {
  width: 1.5em;
  height: 1.5em;
}

/*サロン情報
-----------------------------*/
.about-info {
  padding: clamp(64px, 20vw, 80px) 0;
}
.about-info .info-map {
  height: 320px;
  margin-top: 30px;
}

/*===============================================
  メニュー・料金
===============================================*/
/*コースメニュー
-----------------------------*/
.menu-course {
  padding: clamp(64px, 20vw, 80px) 0;
}
.menu-course .course-text {
  text-align: center;
  font-weight: 500;
}
.menu-course .course-text .br {
  display: inline-block;
}
.menu-course .course-list {
  padding-top: 30px;
}
.menu-course .course-list::before {
  margin-bottom: 1em;
}
.menu-course .course-list-box {
  padding: 24px 20px;
  margin-bottom: 30px;
}
.menu-course .course-list-box .box-price {
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  line-height: 1.5;
  padding: 0.5em 1em;
}
.menu-course .course-list-box .box-price:has(+ .box-text) {
  margin-bottom: 15px;
}

/*オーダーメニュー
-----------------------------*/
.menu-order {
  padding: clamp(64px, 20vw, 80px) 0;
}
.menu-order::before {
  width: 96%;
  max-width: 510px;
  height: 120px;
  bottom: 20px;
  background-size: clamp(58px, 18vw, 72px);
}
.menu-order .order-text {
  text-align: center;
  font-weight: 500;
}
.menu-order .order-text .br {
  display: inline-block;
}
.menu-order .order-list {
  padding-top: 30px;
}
.menu-order .order-list::before {
  margin-bottom: 1em;
}
.menu-order .order-list-item {
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  line-height: 1.5;
  padding: 0 1em calc(15px - 0.25em);
  margin: -0.25em 0 30px;
}
.menu-order .order-list-item dt {
  font-size: calc(1em - 2px);
}
.menu-order .order-list-item .oth {
  font-size: clamp(1.3rem, 4.0540540541vw, 1.5rem);
  padding: 0.75em 0 1em;
}
.menu-order .order-sub-txt {
  padding-top: clamp(32px, 10vw, 40px);
}
.menu-order .order-sub-txt p::after {
  height: clamp(6px, 2vw, 8px);
  margin-top: 20px;
}

/*===============================================
  初めての方へ
===============================================*/
/*ご予約方法
-----------------------------*/
.beginner-guide {
  padding: clamp(64px, 20vw, 80px) 0;
}
.beginner-guide::before {
  width: 92%;
  height: clamp(144px, 45vw, 180px);
  bottom: 20px;
}
.beginner-guide::after {
  display: block;
  width: clamp(192px, 60vw, 240px);
  height: clamp(128px, 40vw, 160px);
  background-size: 68%, 100%;
  background-position: left 50% top, left bottom;
  margin-top: 30px;
  margin-left: auto;
}
.beginner-guide .guide-box {
  margin-bottom: clamp(64px, 20vw, 80px);
}
.beginner-guide .guide-box .box-ttl:has(+ .box-txt) {
  margin-bottom: 30px;
}
.beginner-guide .guide-box .box-list-item {
  margin-bottom: clamp(64px, 20vw, 80px);
}
.beginner-guide .guide-box .box-list-item::after {
  height: clamp(44px, 20vw - 20px, 60px);
  top: calc(100% + 10px);
}
.beginner-guide .guide-box .box-list-item .item-img img {
  width: 100%;
}
.beginner-guide .guide-box .box-list-item .item-in {
  padding: 20px;
}
.beginner-guide .guide-box .box-list-item .item-in::before {
  font-size: 1.6em;
  letter-spacing: 0.1em;
  margin-bottom: 0.5em;
}
.beginner-guide .guide-box .box-list-item .item-line {
  width: 40px;
  margin-top: 20px;
}
.beginner-guide .guide-box .box-txt {
  margin-bottom: 20px;
}

/*施術の流れ
-----------------------------*/
.beginner-flow {
  padding: clamp(64px, 20vw, 80px) 0;
  background-size: 56%;
}
.beginner-flow .flow-list {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-top: -40px;
}
.beginner-flow .flow-list-item {
  width: 48%;
  margin-top: 40px;
}
.beginner-flow .flow-list-item::before {
  width: 2em;
  height: 2em;
  font-size: clamp(2rem, 6vw, 2.4rem);
  letter-spacing: 0.1em;
  padding-left: 0.1em;
  top: 0.25em;
  left: 0.25em;
}
.beginner-flow .flow-list-item .item-img {
  margin-bottom: 15px;
  position: relative;
}
.beginner-flow .flow-list-item .item-img div {
  border-radius: 12px;
  width: 100%;
  height: 0;
  padding-top: 66.6666666667%;
  position: relative;
  z-index: 0;
}
.beginner-flow .flow-list-item .item-img div img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}
.beginner-flow .flow-list-item .item-img div::before {
  border-radius: 12px;
}
.beginner-flow .flow-list-item .item-txt {
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  line-height: 1.5;
  letter-spacing: 0.06em;
  margin: -0.25em 0;
}

/*禁忌事項
-----------------------------*/
.beginner-caution {
  padding: clamp(64px, 20vw, 80px) 0;
}
.beginner-caution .caution-list-item {
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  line-height: 1.5;
  padding-left: 2.5em;
  margin-bottom: 1em;
}
.beginner-caution .caution-list-item::before {
  width: 1.5em;
  height: 1.5em;
}
.beginner-caution .caution-box {
  padding-top: clamp(64px, 20vw, 80px);
}
.beginner-caution .caution-box .box-list {
  margin: -0.5em 0;
}
.beginner-caution .caution-box .box-list-item {
  padding-left: 1.05em;
}

/*よくある質問
-----------------------------*/
.beginner-faq {
  padding: clamp(64px, 20vw, 80px) 0;
}
.beginner-faq .faq-list-item {
  margin-bottom: 40px;
}
.beginner-faq .faq-list-item .item-ttl {
  margin-bottom: 20px;
}
.beginner-faq .faq-list-item .item-ttl::before {
  width: 2em;
  font-size: clamp(2rem, 6vw, 2.4rem);
  line-height: calc(2em - 2px);
  padding-bottom: 2px;
}
.beginner-faq .faq-list-item .item-ttl > span {
  width: calc(100% - 3.5em);
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  line-height: 1.5;
  padding: clamp(8px, 2.5vw, 10px) 0;
}
.beginner-faq .faq-list-item .item-text::before {
  display: none;
}

/*===============================================
  お客様の声
===============================================*/
.voice-contents {
  padding: clamp(64px, 20vw, 80px) 0;
}
.voice-contents .voice-ttl > span {
  margin-right: -0.5em;
}
.voice-contents .voice-list-box {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap;
  padding-bottom: 40px;
  margin-bottom: 40px;
}
.voice-contents .voice-list-box .box-name {
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  line-height: 1.5;
  letter-spacing: 0.06em;
  padding-left: 2em;
  margin: -0.25em 0 calc(20px - 0.25em) auto;
}
.voice-contents .voice-list-box .box-trouble {
  width: 100%;
  padding: 20px;
}
.voice-contents .voice-list-box .box-trouble .trouble-ttl {
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  line-height: 1.5;
  letter-spacing: 0.06em;
  margin: -0.25em 0 calc(20px - 0.25em) 0;
}
.voice-contents .voice-list-box .box-trouble .trouble-text {
  line-height: 1.75;
  margin: -0.375em 0;
}
.voice-contents .voice-list-box .box-imgs {
  width: 100%;
  padding-top: 30px;
}
.voice-contents .voice-list-box .box-imgs figure {
  width: 54%;
}
.voice-contents .voice-list-box .box-imgs figure figcaption {
  width: 6em;
  font-size: clamp(1.5rem, 4.5vw, 1.8rem);
  letter-spacing: 0.06em;
  line-height: 2;
  border-radius: 10px 10px 0 0;
}
.voice-contents .voice-list-box .box-imgs figure.before {
  width: 42%;
}
.voice-contents .voice-list-box .box-imgs figure.before::after {
  display: none;
}
.voice-contents .voice-list-box .box-comment {
  margin-top: 30px;
}

/*==================================================
 ニュース一覧
================================================== */
.news-contents {
  padding: clamp(64px, 20vw, 80px) 0;
}
.news-contents::before {
  width: 98%;
  height: clamp(80px, 25vw, 100px);
  bottom: clamp(-30px, -7.5vw, -24px);
}
.news-contents .news-list-item {
  font-size: 0.8em;
  margin-bottom: 15px;
}
.news-contents .news-list-item a {
  padding: 15px;
}
.news-contents .news-list-item .date {
  width: 7em;
}
.news-contents .news-list-item .tag {
  margin-left: 7em;
  margin-top: -2em;
}
.news-contents .news-list-item .item-ttl {
  font-size: 1.25em;
  margin-top: 0.5em;
}

/*タグリスト
-----------------------------*/
.tag-select-box-wrap {
  margin-bottom: 40px;
}
.tag-select-box-wrap .tag-select-box {
  min-width: 160px;
}
.tag-select-box-wrap .tag-select-box::after {
  right: 12px;
}
.tag-select-box-wrap .tag-select-box select {
  font-size: 0.8em;
  line-height: 1.33334;
  padding: 12px 32px 12px 12px;
}

/*==================================================
 ニュース詳細
================================================== */
.news-detail {
  padding: clamp(64px, 20vw, 80px) 0;
}
.news-detail::before {
  width: 98%;
  height: clamp(80px, 25vw, 100px);
  bottom: clamp(-30px, -7.5vw, -24px);
}
.news-detail .post-data {
  font-size: 0.8em;
  line-height: 1.66667;
  margin-bottom: 16px;
}
.news-detail .news-box {
  padding: 30px 20px;
}

/*==================================================
 お問い合わせ
================================================== */
/*ご予約状況
-----------------------------*/
.contact-reserve {
  padding: clamp(64px, 20vw, 80px) 0;
  background-size: min(810px, 42.1875%), cover;
}
.contact-reserve .reserve-box {
  height: clamp(320px, 100vw, 400px);
}
.contact-reserve .reserve-link {
  padding-top: 30px;
}
.contact-reserve .reserve-link a {
  font-size: 1em;
  letter-spacing: 0.04em;
  line-height: 1;
  padding: 10px 0;
  margin-top: -10px;
}

/*お問い合わせフォーム
-----------------------------*/
.contact-contents {
  padding: clamp(64px, 20vw, 80px) 0 clamp(80px, 25vw, 100px);
}
.contact-contents::before {
  width: 96%;
  max-width: 510px;
  height: 120px;
  bottom: 20px;
  background-size: clamp(58px, 18vw, 72px);
}
.contact-contents .contact-table {
  margin-bottom: 40px;
}
.contact-contents .contact-table th .optional-mark,
.contact-contents .contact-table th .required-mark {
  font-size: 0.8em;
  line-height: 2;
  padding: 0 8px;
  margin-top: 2px;
}
.contact-contents .contact-table th .remarks-txt {
  font-size: 0.8em;
  line-height: 2;
  margin-top: 0.25em;
}
.contact-contents .contact-table th .remarks-txt br {
  display: none;
}
.contact-contents .contact-table td {
  padding: 1em 0.5em;
}
.contact-contents .contact-table td select,
.contact-contents .contact-table td textarea,
.contact-contents .contact-table td input[type=tel],
.contact-contents .contact-table td input[type=num],
.contact-contents .contact-table td input[type=text],
.contact-contents .contact-table td input[type=email],
.contact-contents .contact-table td input[type=url] {
  font-size: clamp(1.3rem, 4.0540540541vw, 1.5rem);
  line-height: 2;
  padding: 0.5em;
}
.contact-contents .contact-submits-wrap {
  padding-top: 16px;
}
.contact-contents .contact-submits-wrap > * {
  width: 75vw;
  max-width: 320px;
  height: 60px;
  margin: 0 auto 20px;
}
.contact-contents .contact-submits-wrap > *:last-child {
  margin-bottom: 0;
}

/*==================================================
 お問い合わせ完了
================================================== */
.complete-contents {
  padding: clamp(64px, 20vw, 80px) 0 clamp(80px, 25vw, 100px);
}
.complete-contents::before {
  width: 96%;
  max-width: 510px;
  height: 120px;
  bottom: 20px;
  background-size: clamp(58px, 18vw, 72px);
}
/*===============================================
  プライバシーポリシー
===============================================*/
.privacy-contents {
  padding: clamp(64px, 20vw, 80px) 0;
}
.privacy-contents::before {
  width: 98%;
  height: clamp(96px, 30vw, 120px);
  bottom: -16px;
}
.privacy-contents .item-box {
  padding: 30px 20px;
  margin-bottom: 30px;
}

/*==================================================
 サイトマップ
================================================== */
.site-contents {
  padding: clamp(64px, 20vw, 80px) 0;
}
.site-contents::before {
  width: 98%;
  height: clamp(96px, 30vw, 120px);
  bottom: -16px;
}
.site-contents .site-list-wrap {
  padding: 20px;
}
.site-contents .site-list-item {
  margin-bottom: 10px;
}
.site-contents .site-list-item:last-of-type {
  margin-bottom: 0;
}
.site-contents .site-list-item a {
  padding: 1em;
}
.site-contents .site-sub-list {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
  padding-top: 10px;
}
.site-contents .site-sub-item {
  width: 48%;
  margin-top: 10px;
}
.site-contents .site-sub-item a {
  font-size: 0.8em;
  padding: 1em 0;
}

/*===============================================
  404エラー
===============================================*/
.error-contents {
  padding: clamp(64px, 20vw, 80px) 0;
}