@charset "UTF-8";
/* ==================================================
 style.scss
 各scssファイルを定義
================================================== */
/* ==================================================
 baseフォルダ
================================================== */
/* ==================================================
 _base.scss
 全ページ共通のタグスタイル 定義
================================================== */
/* ==================================================
 _variables.scss
 変数 定義
================================================== */
/* ==================================================
 カラー変数定義
================================================== */
/* ==== サイト基本カラー定義 ==== */
/* ==== プランカラー定義 ==== */
/* ==== 白黒カラー定義 ==== */
/* ==== ボタンカラー定義 ==== */
/* ==== ボーダーカラー定義 ==== */
/* ==================================================
 background-imageディレクトリ 変数定義
================================================== */
/* ==================================================
 _font.scss
 フォント・文字サイズ 定義
================================================== */
/* ==================================================
 _function.scss
 関数 定義
================================================== */
/* ==================================================
 _base.scss
 全ページ共通のタグスタイル 定義
================================================== */
/* ==================================================
 _mq.scss
 メディアクエリ 定義
================================================== */
/* ==================================================
 メディアクエリ 基本サイズ
================================================== */
/* ==================================================
 メディアクエリ mixin定義
 ※以下は定義方法
.class {
 width: 50%;
 @include tab {
		width: 100%
 }
}
================================================== */
/* ==================================================
 デバイス非表示・表示
================================================== */
.is-pc {
  display: none;
}

.is-tab {
  display: none;
}

.is-sp {
  display: none;
}

/* ==================================================
 _base.scss
 全ページ共通のタグスタイル 定義
================================================== */
/* ==================================================
 フォントのvw単位計算
 ※定義方法
 p {
	font-size: responsiveFontSizeClamp(最小フォントサイズ,最大フォントサイズ,最小ウィンドウサイズ,最大ウィンドウサイズ);
 }
================================================== */
/* ==================================================
 _base.scss
 全ページ共通のタグスタイル 定義
================================================== */
/* ==================================================
 英字フォント
================================================== */
.font-roboto {
  font-family: "Roboto", sans-serif;
}

/* ==================================================
 見出しフォントサイズ(spサイズ ~ pcサイズ)
 h1: 24 ~ 28px;
 h2: 20 ~ 24px;
 h3: 18 ~ 20px;
 h4: 16 ~ 18px;
================================================== */
/* ==================================================
 フォントサイズ(spサイズ ~ pcサイズ)
 x-small: 10 ~ 12px
 small: 12 ~ 14px
 medium: 14px ~ 16px
 large: 16px ~ 18px
 x-large: 18 ~ 20px 
================================================== */
/* ==================================================
 見出しフォントサイズ (SPサイズ ~ PCサイズ)
 h1: 32 ~ 72px;
 h2: 28 ~ 60px;
 h3: 24 ~ 48px;
 h4: 20 ~ 36px;
================================================== */
.font-h1 {
  font-size: clamp(2.25rem, 1.5rem + 3.75vw, 4.5rem);
}

.font-h2 {
  font-size: clamp(2rem, 1.417rem + 2.92vw, 3.75rem);
}

.font-h3 {
  font-size: clamp(1.75rem, 1.333rem + 2.08vw, 3rem);
}

.font-h4 {
  font-size: clamp(1.5rem, 1.25rem + 1.25vw, 2.25rem);
}

/* ==================================================
 レギュラーサイズ（通常の本文用）
================================================== */
.font-regular {
  font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
}

.font-small {
  font-size: clamp(0.75rem, 0.708rem + 0.21vw, 0.875rem);
}

.font-medium {
  font-size: clamp(1rem, 0.917rem + 0.42vw, 1.25rem);
}

.font-large {
  font-size: clamp(1.25rem, 1.083rem + 0.83vw, 1.75rem);
}

/* ==================================================
 特大フォントサイズ（英字タイトル・特大見出し用）
================================================== */
.font-title {
  font-size: clamp(4rem, 3.333rem + 3.33vw, 6rem);
}

.font-hero {
  font-size: clamp(6rem, 5.292rem + 3.54vw, 8.125rem);
}

.font-display {
  font-size: clamp(8.125rem, 7.292rem + 4.17vw, 10.625rem);
}

/* ==================================================
 フォントウェイト
================================================== */
.font-w300 {
  font-weight: 300;
}

.font-w400 {
  font-weight: 400;
}

.font-w500 {
  font-weight: 500;
}

.font-w600 {
  font-weight: 600;
}

.font-w700 {
  font-weight: 700;
}

.font-w800 {
  font-weight: 800;
}

.font-w900 {
  font-weight: 900;
}

/* ==================================================
 フォントスタイル
================================================== */
.font-italic {
  font-style: italic;
}

.line-h1 {
  line-height: 1;
}

.line-h11 {
  line-height: 1.1;
}

.line-h12 {
  line-height: 1.2;
}

.line-h15 {
  line-height: 1.5;
}

.letter-0 {
  letter-spacing: 0em;
}

.letter-s005 {
  letter-spacing: 0.05em;
}

.letter-s01 {
  letter-spacing: 0.1em;
}

.letter-s02 {
  letter-spacing: 0.2em;
}

.letter-s05 {
  letter-spacing: 0.5em;
}

/* ==================================================
 フォントカラー
================================================== */
.font-white {
  color: white;
}

.font-black {
  color: #2c2c2c;
}

.font-gray {
  color: #7d7d7d;
}

.font-main {
  color: #1ea1a1;
}

.font-accent {
  color: #ffdc0d;
}

.font-sub {
  color: #aed163;
}

/* ==================================================
 テキストシャドウ
================================================== */
/* ベーシックな黒シャドウ（汎用） */
.text-shadow-base {
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

/* くっきり目のシャドウ（強調したいとき） */
.text-shadow-strong {
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.7);
}

/* 柔らかく広がるシャドウ（上品） */
.text-shadow-soft {
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

/* フチどり風（白文字に最適、強力） */
.text-shadow-outline {
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

/* 明るいシャドウ（暗背景用に白い影） */
.text-shadow-light {
  text-shadow: 0 1px 3px rgba(255, 255, 255, 0.6);
}

/* ==================================================
 _function.scss
 関数 定義
================================================== */
/* ==================================================
 _base.scss
 全ページ共通のタグスタイル 定義
================================================== */
/* ==================================================
 _font.scss
 フォント・文字サイズ 定義
================================================== */
/* ==================================================
 _function.scss
 関数 定義
================================================== */
/* ==================================================
 _mixin.scss
 mixinスタイル 定義
================================================== */
/* ==================================================
 _base.scss
 全ページ共通のタグスタイル 定義
================================================== */
/* ==================================================
 _font.scss
 フォント・文字サイズ 定義
================================================== */
/* ==================================================
 _animation.scss
 アニメーションスタイル 定義
================================================== */
/* ==================================================
 animation基本設定
================================================== */
/* ==================================================
 ※以下は他scssファイルでの定義方法
 @mixinで定義した引数のプロパティを書き換えるだけで個別にアニメーションを指定することができる
 @include bounce(
    $name: sk-bouncedelay;
		$duration: 3s;
		$timing-function: ease-in-out,
  );
================================================== */
/* ==================================================
 画面最大幅（PC画面をレスポンシブ対応させないための横幅）
================================================== */
/* ==================================================
 コンテンツ最大幅
================================================== */
/* ==================================================
 内部コンテンツ幅
================================================== */
/* ==================================================
 タグ共通設定
================================================== */
html {
  overflow-y: scroll;
  font-size: 16px;
}

body {
  width: 100%;
  box-sizing: border-box;
  background-color: #f7f7f7;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  line-height: 1.7;
  text-align: justify;
  margin: 0;
  padding: 0;
  color: #2c2c2c;
  background-color: #f7f7f7;
  font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
}

* {
  margin: 0;
  padding: 0;
}

img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
  overflow: hidden;
  border: 0;
}

li {
  list-style: none;
}

p {
  letter-spacing: 0.05em;
}

a {
  text-decoration: none;
}

/* ==================================================
 画面幅
================================================== */
.w-90 {
  width: 90%;
  max-width: 1190px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .w-90 {
    width: 95%;
  }
}

.w-80 {
  width: 80%;
  max-width: 1190px;
  margin: 0 auto;
}

.w-article {
  width: 90%;
  max-width: 880px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .w-article {
    width: 95%;
  }
}

/* ==================================================
 整列
================================================== */
.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-left {
  text-align: left;
}

.align-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}

.vertical-middle {
  vertical-align: middle;
}

/* ==================================================
 余白
================================================== */
.mb-xs {
  margin-bottom: clamp(0.25rem, 2.5vw, 0.5rem);
}

.mb-sm {
  margin-bottom: clamp(1.25rem, 3.5vw, 1.875rem);
}

.mb-rg {
  margin-bottom: clamp(1.875rem, 5vw, 2.5rem);
}

.mb-md {
  margin-bottom: clamp(2.5rem, 6vw, 3.125rem);
}

.mb-lg {
  margin-bottom: clamp(3.125rem, 7vw, 3.75rem);
}

.mb-xl {
  margin-bottom: clamp(3.75rem, 8vw, 4.375rem);
}

.mb-xxl {
  margin-bottom: clamp(4.375rem, 9vw, 5rem);
}

/* ==================================================
 ページレイアウト
================================================== */
@media screen and (min-width: 1025px) {
  .container {
    min-width: 1400px;
  }
}

@media screen and (max-width: 767px) {
  .pc-none {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .sp-none {
    display: none;
  }
}

.sp-on {
  display: none;
}
@media screen and (max-width: 767px) {
  .sp-on {
    display: block;
  }
}

/* ==================================================
 装飾
================================================== */
.highlight-yellow {
  background: linear-gradient(transparent 60%, #fff36b 60%);
}

/* ==================================================
 下線
================================================== */
.border-bt-white {
  border-bottom: 1px solid white;
}

.border-bt-main {
  border-bottom: 1px solid #1ea1a1;
}

.border-bt-black {
  border-bottom: 1px solid #2c2c2c;
}

.border-main {
  border-color: #1ea1a1 !important;
}

.border-p1 {
  border-color: #90be6d !important;
}

.border-p2 {
  border-color: #e9c46a !important;
}

.border-p3 {
  border-color: #f4a261 !important;
}

.border-p4 {
  border-color: #e76f51 !important;
}

.border-p5 {
  border-color: #264653 !important;
}

.border-p6 {
  border-color: #032e6d !important;
}

/* ==================================================
 塗りつぶし
================================================== */
.bgcolor-main {
  background-color: #1ea1a1;
}

.bgcolor-base {
  background-color: #f7f7f7;
}

.bgcolor-accent {
  background-color: #ffdc0d;
}

.bgcolor-p1 {
  background-color: #90be6d;
}

.bgcolor-p2 {
  background-color: #e9c46a;
}

.bgcolor-p3 {
  background-color: #f4a261;
}

.bgcolor-p4 {
  background-color: #e76f51;
}

.bgcolor-p5 {
  background-color: #264653;
}

.bgcolor-p6 {
  background-color: #032e6d;
}

/* ==================================================
 _reset.scss
 リセットcss
================================================== */
/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.min.css */
*, ::before, ::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
}

html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

body {
  margin: 0;
}

main {
  display: block;
}

p, table, blockquote, address, pre, iframe, form, figure, dl {
  margin: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

dt {
  font-weight: 700;
}

dd {
  margin-left: 0;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit;
}

pre {
  font-family: monospace, monospace;
  font-size: inherit;
}

address {
  font-style: inherit;
}

a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}

abbr[title] {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp {
  font-family: monospace, monospace;
  font-size: inherit;
}

small {
  font-size: 80%;
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

svg, img, embed, object, iframe {
  vertical-align: bottom;
}

button, input, optgroup, select, textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  border-radius: 0;
  text-align: inherit;
  text-transform: inherit;
}

button, [type=button], [type=reset], [type=submit] {
  cursor: pointer;
}

button:disabled, [type=button]:disabled, [type=reset]:disabled, [type=submit]:disabled {
  cursor: default;
}

:-moz-focusring {
  outline: auto;
}

select:disabled {
  opacity: inherit;
}

option {
  padding: 0;
}

fieldset {
  margin: 0;
  padding: 0;
  min-width: 0;
}

legend {
  padding: 0;
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
  height: auto;
}

[type=search] {
  outline-offset: -2px;
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

[type=number] {
  -moz-appearance: textfield;
}

label[for] {
  cursor: pointer;
}

details {
  display: block;
}

summary {
  display: list-item;
}

[contenteditable]:focus {
  outline: auto;
}

table {
  border-color: inherit;
  border-collapse: collapse;
}

caption {
  text-align: left;
}

td, th {
  vertical-align: top;
  padding: 0;
}

th {
  text-align: left;
  font-weight: 700;
}

/* ==================================================
 mixinフォルダ
================================================== */
/* ==================================================
 configフォルダ
================================================== */
/*
@use "config/setting";
*/
/* ==================================================
 moduleフォルダ
================================================== */
/* ==================================================
 _header.scss
 ヘッダーのスタイル定義
================================================== */
/* ==================================================
 ヘッダー
================================================== */
.header {
  width: 100%;
  height: 76px;
  padding: 0 1.5rem;
  background-color: white;
  color: #2c2c2c;
  position: fixed;
  z-index: 99;
}
.header.menu-open {
  background-color: transparent;
}
.header.menu-open .header__logo {
  visibility: hidden;
}
.header__container {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header__logo {
  height: 100%;
  width: auto;
}
.header__logo a {
  height: 100%;
  display: flex;
  align-items: center;
}
.header__logo a img {
  height: 55%;
  width: auto;
}
.header__nav {
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .header__nav {
    display: none;
  }
}
.header__nav ul.menu {
  height: 100%;
  font-weight: 700;
  display: flex;
  justify-content: space-between;
  align-items: center;
  -moz-column-gap: 3rem;
       column-gap: 3rem;
}
.header__nav li {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
  transition: 0.2s;
}
.header__nav li:hover {
  color: #1ea1a1;
}
.header__nav li:hover .sub-menu {
  height: auto;
  transform: translateY(0);
  opacity: 1;
}
.header__nav .sub-menu {
  position: absolute;
  top: 76px;
  left: 0;
  overflow: hidden;
  width: 15rem;
  height: 0;
  transition: 0.8s;
  transform: translateY(-8%);
  opacity: 0;
}
.header__nav .sub-menu li {
  color: white;
  display: block;
  margin-left: 0;
  padding: 0.5rem;
  background-color: #2c2c2c;
  transition: 0.8s;
}
.header__nav .sub-menu li:hover {
  background-color: #1ea1a1;
}
.header__nav .sub-menu li a {
  padding: 1em;
}
.header__button {
  border: solid 1px #2c2c2c;
  font-weight: 700;
  padding: 12px 36px;
  border-radius: 46px;
  display: flex;
  align-items: center;
  font-size: 16px;
  transition: 0.2s;
}
.header__button::before {
  content: "";
  width: 1.5rem;
  height: 1.5rem;
  background-size: contain;
  background-image: url("../../images/icon_person.svg");
  background-repeat: no-repeat;
  background-position: center center;
}
@media screen and (max-width: 1024px) {
  .header__button {
    display: none;
  }
}
.header__button span {
  margin-right: 3px;
}
.header__button:hover {
  background-color: #1ea1a1;
  border: solid 1px white;
  color: white;
}
.header__button:hover::before {
  background-image: url("../../images/icon_person_white.svg");
}
.header__menu {
  display: none;
  align-items: center;
  justify-content: flex-end;
  width: 60px;
  height: 60px;
}
@media screen and (max-width: 1024px) {
  .header__menu {
    display: flex;
  }
}
.header__menu-btn {
  z-index: 999;
}
.header__menu-btn > span {
  display: block;
  background-color: #1ea1a1;
  width: 30px;
  height: 2px;
  margin-bottom: 9px;
  transition: transform 0.7s;
}
.header__menu-btn > span:last-child {
  margin-bottom: 0;
}

/* ==================================================
 _footer.scss
 フッターのスタイル定義
================================================== */
/* ==================================================
 グローバルフッター
================================================== */
.footer {
  padding-bottom: 1rem;
  background: #2c2c2c;
}
.footer__container {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
.footer__wrap {
  width: 100%;
  height: 45px;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .footer__wrap {
    flex-direction: column;
    align-items: flex-start;
    row-gap: 0.6rem;
    height: 100%;
  }
}
.footer__wrap-logo {
  height: 100%;
}
@media screen and (max-width: 767px) {
  .footer__wrap-logo {
    height: 45px;
  }
}
.footer__wrap-logo img {
  height: 100%;
}
.footer__wrap-sns {
  display: flex;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  align-items: flex-end;
}
.footer__wrap-sns li {
  transition: 0.4s;
}
.footer__wrap-sns li:hover {
  opacity: 0.8;
}
.footer__menu ul {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1024px) {
  .footer__menu ul {
    flex-direction: column;
    row-gap: 1.5rem;
  }
}
.footer__menu ul a {
  font-weight: 700;
  font-size: 1.2rem;
  transition: 0.4s;
}
.footer__menu ul a:hover {
  color: #1ea1a1;
}
.footer__menu ul .sub-menu {
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 1024px) {
  .footer__menu ul .sub-menu {
    row-gap: 0;
    padding-left: 1rem;
  }
}
.footer__menu ul .sub-menu li {
  margin-bottom: 0.6rem;
}
.footer__menu ul .sub-menu a {
  font-weight: 400;
  font-size: 1rem;
}

/* ==================================================
 _mobileMenu.scss
 モバイルメニューのスタイル定義
================================================== */
.mobileMenu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #1ea1a1;
  visibility: hidden;
  z-index: 98;
  overflow-y: scroll;
}
@media screen and (max-width: 767px) {
  .mobileMenu {
    width: 100%;
  }
}
.mobileMenu__container {
  padding: 5rem;
}
@media screen and (max-width: 767px) {
  .mobileMenu__container {
    padding: 2rem;
  }
}
.mobileMenu__logo {
  width: 100%;
  max-width: 300px;
  margin: 0 auto;
}
.mobileMenu__nav {
  height: 100%;
  color: white;
}
.mobileMenu__nav ul.menu {
  font-weight: 700;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  row-gap: 1.5rem;
}
.mobileMenu__nav ul.menu > li {
  width: 100%;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid white;
}
.mobileMenu__nav ul.menu > li > a {
  position: relative;
  letter-spacing: 0.48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mobileMenu__nav ul.menu > li > a::after {
  content: "";
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: white url("../../images/icon-right_main.svg") no-repeat 50%/10px auto;
  transform: translateY(-5px);
}
.mobileMenu__nav .sub-menu {
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
  padding-left: 1rem;
}
.mobileMenu__nav .sub-menu li {
  margin-bottom: 0.6rem;
}
.mobileMenu__nav .sub-menu a {
  font-weight: 400;
  font-size: 1rem;
}
.mobileMenu__button {
  padding-top: 3rem;
  width: 100%;
  margin: 0 auto;
}
.mobileMenu__mypage {
  padding-top: 3rem;
  margin-bottom: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 700;
  color: white;
  width: 100%;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid white;
  position: relative;
  letter-spacing: 0.48px;
}
.mobileMenu__mypage::after {
  content: "";
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: white url("../../images/icon-right_main.svg") no-repeat 50%/10px auto;
  transform: translateY(-5px);
}
.mobileMenu__mypage div {
  position: relative;
}
.mobileMenu__mypage div::before {
  content: "";
  width: 2rem;
  height: 2rem;
  padding-right: 0.5rem;
  background-size: contain;
  background-image: url("../../images/icon_person_white.svg");
  background-repeat: no-repeat;
  background-position: center center;
}
.mobileMenu__mypage div {
  display: flex;
  align-items: center;
}

.menu-open.mobileMenu {
  visibility: visible;
}
.menu-open.header__menu-btn > span {
  background-color: white;
}
.menu-open.header__menu-btn > span:nth-child(1) {
  transition-delay: 70ms;
  transform: translateY(11px) rotate(135deg);
}
.menu-open.header__menu-btn > span:nth-child(2) {
  transition-delay: 0s;
  transform: translateX(-18px) scaleX(0);
}
.menu-open.header__menu-btn > span:nth-child(3) {
  transition-delay: 140ms;
  transform: translateY(-11px) rotate(-135deg);
}
.menu-open.mask {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
  z-index: 2;
  cursor: pointer;
}

/* ==================================================
 _global-nav.scss
 グローバルナビゲーションのスタイル定義
================================================== */
.global-nav__list {
  display: flex;
  gap: 24px;
}

/* ==================================================
 _hero.scss
 ヒーローエリアのスタイル定義
================================================== */
.hero {
  width: 100%;
  height: 100vh;
}
@media screen and (max-width: 1024px) {
  .hero {
    height: auto;
  }
}
.hero__container {
  padding-top: 80px;
  height: 100%;
  width: 100%;
  position: relative;
}
.hero__container h2 {
  text-align: right;
  color: white;
  margin-right: 1rem;
}
@media screen and (max-width: 767px) {
  .hero__container h2 {
    margin-right: 0.25rem;
  }
}
.hero__subcopy {
  position: absolute;
  top: 100px;
  right: 0;
  z-index: 3;
}
@media screen and (max-width: 767px) {
  .hero__subcopy {
    top: 90px;
  }
}
.hero__copy-pc {
  position: absolute;
  top: 120px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  width: 100%;
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .hero__copy-pc {
    display: none;
  }
}
.hero__copy-pc h3 {
  letter-spacing: 2px;
}
.hero__copy-pc img {
  width: 35%;
}
@media screen and (max-width: 1024px) {
  .hero__copy-pc img {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .hero__copy-pc img {
    width: 80%;
  }
}
.hero__copy-sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .hero__copy-sp {
    display: block;
    position: absolute;
    top: 130px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: 90%;
    z-index: 2;
  }
}
.hero__mark {
  width: 15%;
  min-width: 200px;
  position: absolute;
  bottom: 0%;
  left: 50%;
  transform: translate(-50%, -5%);
  z-index: 4;
}
@media screen and (max-width: 1024px) {
  .hero__mark {
    bottom: 210px;
    transform: translate(-50%, 0);
  }
}
@media screen and (max-width: 767px) {
  .hero__mark {
    width: 40%;
    min-width: 150px;
  }
}
.hero__reserve {
  width: 490px;
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  padding: 2.5rem 3rem 2rem 5rem;
  border-radius: 4rem 0 0 0;
  position: absolute;
  right: 0;
  bottom: 0;
  background-image: linear-gradient(45deg, #1fa2a1, #aed163);
  text-align: center;
  z-index: 3;
}
@media screen and (max-width: 1024px) {
  .hero__reserve {
    position: relative;
    width: 100%;
    border-radius: 0;
  }
}
@media screen and (max-width: 767px) {
  .hero__reserve {
    padding: 2.5rem 1rem 2rem 1rem;
  }
}
.hero__slider {
  width: 100%;
  height: 100%;
}
.hero__slider-pc {
  height: 100%;
  display: block;
}
@media screen and (max-width: 1024px) {
  .hero__slider-pc {
    display: none;
  }
}
.hero__slider-pc .swiper-slide {
  height: 100%;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.hero__slider-pc .swiper-slide img {
  transition: 10s linear 0.5s;
  transform: scale(1.2);
}
.hero__slider-pc .swiper-slide-active img {
  transition-delay: 0;
  transform: scale(1);
}
.hero__slider-pc-img {
  overflow: hidden;
  aspect-ratio: 360/403;
}
.hero__slider-sp {
  display: none;
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .hero__slider-sp {
    display: block;
  }
}
.hero__slider-sp .swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}
.hero__slider-sp .swiper-wrapper img {
  width: 100%;
  height: auto;
  display: block;
  vertical-align: middle;
  aspect-ratio: auto 375/593;
}
.hero__slider-sp .swiper-slide {
  max-width: 500px !important;
}
.hero__slider-bottom {
  display: flex;
  align-items: flex-end;
  height: 100%;
  width: 100%;
}

/* ==================================================
 _about.scss
 アバウトエリアのスタイル定義
================================================== */
.about {
  position: relative;
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.about__container {
  display: flex;
  -moz-column-gap: 3rem;
       column-gap: 3rem;
  justify-content: flex-end;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .about__container {
    flex-direction: column;
    row-gap: 2rem;
  }
}
.about__copy {
  width: 40%;
}
@media screen and (max-width: 767px) {
  .about__copy {
    width: 100%;
    text-align: center;
  }
}
.about__copy h2 {
  line-height: 1.5;
  letter-spacing: 2px;
}
.about__copy img {
  width: 50%;
}
.about__text {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .about__text {
    width: 100%;
  }
}
.about__text p {
  line-height: 2.5;
}
@media screen and (max-width: 767px) {
  .about__text p {
    line-height: 2;
  }
}
.about__back {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 150px;
}
.about__back-text {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  opacity: 0.08;
}
.about__loop {
  display: flex;
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  height: auto;
}
.about__loop li:nth-child(2n) {
  padding-top: 2rem;
}
.about__message {
  position: absolute;
  top: -2rem;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  opacity: 0.1;
}
@media screen and (max-width: 767px) {
  .about__message {
    top: -3rem;
  }
}

/* ==================================================
 _sysstem.scss
 アイエイト利用エリアのスタイル定義
================================================== */
.system {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .system {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.system__lead p {
  text-align: center;
}
@media screen and (max-width: 767px) {
  .system__lead p {
    text-align: justify;
  }
}
.system__list__item {
  display: flex;
  justify-content: center;
  flex-direction: column;
  row-gap: 0.5rem;
}
@media screen and (max-width: 767px) {
  .system__list__item {
    justify-content: flex-start;
    align-items: center;
  }
}
.system__list__item.-reserve {
  background-image: url("../../images//system-1.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 36vw;
}
@media screen and (max-width: 767px) {
  .system__list__item.-reserve {
    background-image: url("../../images//system-1-sp.png");
    height: 146.6666666667vw;
  }
}
.system__list__item.-play {
  background-image: url("../../images//system-2.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 36vw;
}
@media screen and (max-width: 767px) {
  .system__list__item.-play {
    justify-content: flex-end;
  }
}
@media screen and (max-width: 767px) {
  .system__list__item.-play {
    background-image: url("../../images//system-2-sp.png");
    height: 146.6666666667vw;
  }
}
.system__list__item.-lesson {
  background-image: url("../../images//system-3.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 36vw;
}
@media screen and (max-width: 767px) {
  .system__list__item.-lesson {
    background-image: url("../../images//system-3-sp.png");
    height: 146.6666666667vw;
  }
}
.system__list__item.-right {
  box-sizing: border-box;
  padding-left: 24vw;
  background-position: right top;
}
@media screen and (max-width: 767px) {
  .system__list__item.-right {
    padding: 2rem 1.5rem 0rem 2rem;
  }
}
.system__list__item.-left {
  box-sizing: border-box;
  padding-left: 40vw;
  background-position: left top;
}
@media screen and (max-width: 767px) {
  .system__list__item.-left {
    padding: 0rem 2rem 4rem 1.5rem;
  }
}
.system__list__item p {
  width: 40vw;
}
@media screen and (max-width: 767px) {
  .system__list__item p {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .system__list__item h3 {
    width: 100%;
  }
}
.system__list__tag {
  border-radius: 0.5rem;
  padding: 0.5rem 1rem;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.5);
  display: inline-block;
}

/* ==================================================
 _news-list.scss
 ニュースエリアのスタイル定義
================================================== */
.newslist {
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-image: linear-gradient(45deg, #1fa2a1, #aed163);
}
@media screen and (max-width: 767px) {
  .newslist {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.newslist__headding {
  display: flex;
  align-items: baseline;
  line-height: 1;
  -moz-column-gap: 1.2rem;
       column-gap: 1.2rem;
  letter-spacing: 0.1rem;
}
.newslist__item {
  border-bottom: 0.5px solid #f7f7f7;
  position: relative;
}
.newslist__item:first-child {
  border-top: 0.5px solid #f7f7f7;
}
.newslist__item::after {
  content: "";
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 2rem;
  bottom: 0;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .newslist__item::after {
    right: 6px;
  }
}
.newslist__item-wrap {
  padding: 1rem 2rem;
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
  -moz-column-gap: 2rem;
       column-gap: 2rem;
  transition: 0.8s;
}
@media screen and (max-width: 1024px) {
  .newslist__item-wrap {
    flex-direction: column;
    row-gap: 0.5rem;
  }
}
@media screen and (max-width: 767px) {
  .newslist__item-wrap {
    padding: 1rem 0;
  }
}
.newslist__item-wrap:hover {
  background-color: #1ea1a1;
}
.newslist__item-group {
  display: flex;
  justify-content: flex-start;
  -moz-column-gap: 2rem;
       column-gap: 2rem;
  align-items: baseline;
}
@media screen and (max-width: 767px) {
  .newslist__item-group {
    -moz-column-gap: 1rem;
         column-gap: 1rem;
  }
}
.newslist__item-group span {
  background-color: #2c2c2c;
  padding: 0.2rem 0.6rem;
  border-radius: 0.5rem;
}
.newslist__button {
  width: 40%;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .newslist__button {
    width: 100%;
  }
}

/* ==================================================
 _simg.scss
 シミュレーションゴルフのスタイル定義
================================================== */
.simg {
  padding-top: 15rem;
  padding-bottom: 8rem;
  position: relative;
  z-index: 1;
  overflow-y: hidden;
  overflow-x: hidden;
}
@media screen and (max-width: 767px) {
  .simg {
    padding-top: 7.5rem;
    padding-bottom: 4rem;
  }
}
.simg:before {
  content: "";
  position: absolute;
  top: 0;
  left: -50%;
  right: -50%;
  aspect-ratio: 1/1;
  background-color: #2c2c2c;
  border-radius: 50%;
  z-index: -2;
}
.simg:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 25.64103vw;
  bottom: 0;
  background-color: #2c2c2c;
  z-index: -1;
}
.simg__lead {
  display: flex;
  justify-content: space-between;
  -moz-column-gap: 4rem;
       column-gap: 4rem;
}
@media screen and (max-width: 767px) {
  .simg__lead {
    flex-direction: column;
    row-gap: 1.5rem;
  }
}
.simg__lead-img {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .simg__lead-img {
    width: 100%;
  }
}
.simg__lead-img img {
  border-radius: 1rem;
}
.simg__lead-wrap {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  row-gap: 1rem;
}
@media screen and (max-width: 767px) {
  .simg__lead-wrap {
    width: 100%;
    row-gap: 1.5rem;
  }
}
.simg__list {
  display: flex;
}
@media screen and (max-width: 767px) {
  .simg__list {
    flex-direction: column;
    row-gap: 1.5rem;
  }
}
.simg__item {
  width: 50%;
  transition: transform 0.3s;
}
@media screen and (max-width: 767px) {
  .simg__item {
    width: 100%;
  }
}
.simg__item:hover {
  transform: translateY(-4px);
}
.simg__item-wrap {
  width: 80%;
  margin: 0 auto;
}
.simg__item-wrap span {
  background-color: white;
  padding: 0.1rem 0.8rem;
  border-radius: 0.5rem;
}
.simg__item-wrap ul {
  margin-top: 1rem;
  margin-bottom: 2rem;
  list-style-type: disc;
  padding-left: 1.5em;
}
.simg__item-wrap li {
  list-style: disc;
  margin-bottom: 0.5em;
}
.simg__item-button {
  width: 80%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .simg__item-button {
    width: 90%;
  }
}
.simg__practice-head {
  background-color: #1ea1a1;
  border-radius: 1rem 0 0 0;
  padding: 3rem 0;
}
@media screen and (max-width: 767px) {
  .simg__practice-head {
    border-radius: 1rem 1rem 0 0;
  }
}
.simg__practice-body {
  background-color: #53bcbc;
  border-radius: 0 0 0 1rem;
  padding-top: 60%;
  padding-bottom: 4rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .simg__practice-body {
    border-radius: 0 0 1rem 1rem;
  }
}
.simg__practice-body img {
  position: absolute;
  top: -1.5rem;
  left: 50%;
  transform: translateX(-50%);
  width: 80%;
  aspect-ratio: 4/3;
}
.simg__round-head {
  background-color: #aed163;
  border-radius: 0 1rem 0 0;
  padding: 3rem 0;
}
@media screen and (max-width: 767px) {
  .simg__round-head {
    border-radius: 1rem 1rem 0 0;
  }
}
.simg__round-body {
  background-color: #c6eb7f;
  border-radius: 0 0 1rem 0;
  padding-top: 60%;
  padding-bottom: 4rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .simg__round-body {
    border-radius: 0 0 1rem 1rem;
  }
}
.simg__round-body img {
  position: absolute;
  top: -1.5rem;
  left: 50%;
  transform: translateX(-50%);
  width: 80%;
  aspect-ratio: 4/3;
}
.simg__button {
  width: 80%;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .simg__button {
    width: 100%;
  }
}

/* ==================================================
 _price.scss
 料金エリアのスタイル定義
================================================== */
.price {
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-image: linear-gradient(45deg, #1fa2a1, #aed163);
}
@media screen and (max-width: 767px) {
  .price {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.price__wrap {
  display: flex;
  -moz-column-gap: 4rem;
       column-gap: 4rem;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .price__wrap {
    flex-direction: column;
    row-gap: 2rem;
  }
}
.price__wrap-block {
  width: 50%;
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
@media screen and (max-width: 767px) {
  .price__wrap-block {
    width: 100%;
  }
}
.price__tag {
  background-color: #ffdc0d;
  padding: 0.1rem 0.8rem;
  border-radius: 0.5rem;
}
.price__list li {
  margin-bottom: 0.5rem;
}
.price__list li div {
  padding: 0.1rem 1rem;
  display: inline-block;
  background-color: white;
}

/* ==================================================
 _lesson.scss
 レッスンエリアのスタイル定義
================================================== */
.lesson {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .lesson {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.lesson__lead {
  display: flex;
  justify-content: space-between;
  -moz-column-gap: 4rem;
       column-gap: 4rem;
}
@media screen and (max-width: 767px) {
  .lesson__lead {
    flex-direction: column-reverse;
    row-gap: 1rem;
  }
}
.lesson__lead-img {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .lesson__lead-img {
    width: 100%;
  }
}
.lesson__lead-img img {
  border-radius: 1rem;
}
.lesson__lead-wrap {
  width: 50%;
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
@media screen and (max-width: 767px) {
  .lesson__lead-wrap {
    width: 100%;
  }
}
.lesson__profList {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 2rem;
  padding: 0;
  margin: 0;
  list-style: none;
}
@media screen and (max-width: 767px) {
  .lesson__profList {
    gap: 1rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
.lesson__profList li {
  border-radius: 8px;
  transition: transform 0.3s;
}
.lesson__profList li:hover {
  transform: translateY(-4px);
}

/* ==================================================
 _flow.scss
 フローのスタイル定義
================================================== */
.flow {
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-image: linear-gradient(45deg, #1fa2a1, #aed163);
}
@media screen and (max-width: 767px) {
  .flow {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.flow__list {
  display: flex;
  justify-content: space-between;
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
}
@media screen and (max-width: 767px) {
  .flow__list {
    flex-direction: column;
    row-gap: 1.5rem;
  }
}
.flow__wrap {
  width: 33%;
  position: relative;
  margin: 1em auto;
  padding: 3em 1.5em;
  border-radius: 30px;
  background-color: white;
  border: 4px solid #2c2c2c;
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}
@media screen and (max-width: 767px) {
  .flow__wrap {
    width: 100%;
  }
}
.flow__wrap::before {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -1.2em;
  left: 50%;
  transform: translateX(-50%);
  width: 2.2em;
  height: 2.2em;
  border-radius: 50%;
  background-color: white;
  color: #2c2c2c;
  border: 4px solid #2c2c2c;
  font-weight: 600;
  font-size: clamp(1.5rem, 1.25rem + 1.25vw, 2.25rem);
  content: attr(data-number);
}
@media screen and (max-width: 767px) {
  .flow__wrap img {
    width: 60%;
    margin: 0 auto;
  }
}
.flow__button {
  width: 80%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .flow__button {
    width: 100%;
  }
}

/* ==================================================
 _studio.scss
 スタジオエリアのスタイル定義
================================================== */
.studio {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .studio {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.studio__headding {
  display: flex;
  align-items: baseline;
  line-height: 1;
  -moz-column-gap: 1.2rem;
       column-gap: 1.2rem;
  letter-spacing: 0.1rem;
}
.studio__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  gap: 2rem;
  padding: 0;
  margin: 0;
  list-style: none;
}
@media screen and (max-width: 767px) {
  .studio__list {
    grid-template-columns: 1fr;
  }
}
.studio__list li {
  border-radius: 1rem;
  transition: transform 0.3s;
}
.studio__list li:hover {
  transform: translateY(-4px);
}

/* ==================================================
 _faq.scss
 FAQのスタイル定義
================================================== */
.faq {
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-color: #1ea1a1;
}
@media screen and (max-width: 767px) {
  .faq {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}

/* ==================================================
 _support.scss
 サポートエリアのスタイル定義
================================================== */
.support {
  background-image: linear-gradient(45deg, #1fa2a1, #aed163);
  overflow-y: visible;
}
@media screen and (max-width: 767px) {
  .support {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.support__container {
  display: flex;
  -moz-column-gap: 4rem;
       column-gap: 4rem;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .support__container {
    flex-direction: column;
  }
}
.support__wrap {
  width: 50%;
  display: flex;
  flex-direction: column;
  row-gap: 2.5rem;
}
@media screen and (max-width: 767px) {
  .support__wrap {
    width: 100%;
  }
}
.support__img {
  width: 50%;
  margin-top: -60px;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .support__img {
    display: none;
  }
}
.support__img img {
  width: 80%;
}

/* ==================================================
 _etc.scss
 その他のスタイル定義
================================================== */
.etc {
  width: 100%;
}
.etc__container {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .etc__container {
    flex-direction: column;
  }
}
.etc__wrap {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .etc__wrap {
    width: 100%;
  }
}

/* ==================================================
 _news-list.scss
 ニュースエリアのスタイル定義
================================================== */
.newsblock {
  padding-top: 4rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .newsblock {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }
}
.newsblock__headding {
  text-align: center;
}
.newsblock__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
  row-gap: 2rem;
}
@media screen and (max-width: 767px) {
  .newsblock__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
.newsblock__item-wrap {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  transition: all 0.3s;
}
.newsblock__item-wrap:hover {
  transform: translateY(-4px);
  opacity: 0.8;
}
.newsblock__item span {
  background-color: #2c2c2c;
  padding: 0.2rem 0.6rem;
  border-radius: 0.5rem;
}
.newsblock__button {
  width: 40%;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .newsblock__button {
    width: 100%;
  }
}

/* ==================================================
 _news-list.scss
 ニュースエリアのスタイル定義
================================================== */
.columnblock {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .columnblock {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.columnblock__headding {
  text-align: center;
}
.columnblock__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
  row-gap: 2rem;
}
@media screen and (max-width: 767px) {
  .columnblock__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
.columnblock__item-wrap {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  transition: all 0.3s;
}
.columnblock__item-wrap:hover {
  transform: translateY(-4px);
  opacity: 0.8;
}
.columnblock__item span {
  background-color: #2c2c2c;
  padding: 0.2rem 0.6rem;
  border-radius: 0.5rem;
}
.columnblock__button {
  width: 40%;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .columnblock__button {
    width: 100%;
  }
}

/* ==================================================
 _subHero.scss
スタジオページひろーのスタイル定義
================================================== */
.subHero {
  width: 100%;
  padding-top: 76px;
  background-image: linear-gradient(45deg, #1fa2a1, #aed163);
}
.subHero__wrap {
  padding: 4rem 0;
}
@media screen and (max-width: 767px) {
  .subHero__wrap {
    padding: 2rem 0;
  }
}

/* ==================================================
 _archive.scss
 アバウトエリアのスタイル定義
================================================== */
.archive {
  padding-top: 2rem;
  padding-bottom: 4rem;
}

/* 
@use "module/sidenav";
*/
/* ==================================================
 studioフォルダ
================================================== */
/* ==================================================
 _studioHero.scss
スタジオページひろーのスタイル定義
================================================== */
.studioHero {
  width: 100%;
  padding-top: 76px;
  background-image: linear-gradient(45deg, #1fa2a1, #aed163);
  position: relative;
}
.studioHero__subcopy {
  position: absolute;
  top: 100px;
  right: 0;
  z-index: 3;
}
@media screen and (max-width: 767px) {
  .studioHero__subcopy {
    top: 80px;
  }
}
.studioHero__tag {
  padding: 2rem;
}
@media screen and (max-width: 767px) {
  .studioHero__tag {
    padding: 1.25rem 0 1rem 0;
  }
}
.studioHero__img-pc {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .studioHero__img-pc {
    display: none;
  }
}
.studioHero__img-sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .studioHero__img-sp {
    display: block;
    width: 100%;
  }
}
.studioHero__wrap {
  padding-top: 1rem;
  padding-bottom: 3rem;
  display: flex;
  flex-direction: column;
  row-gap: 0.25rem;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .studioHero__wrap {
    padding-top: 1rem;
    padding-bottom: 2rem;
  }
}

/* ==================================================
 _studioHero.scss
スタジオページひろーのスタイル定義
================================================== */
.studioPoint {
  padding-top: 15rem;
  padding-bottom: 8rem;
  position: relative;
  z-index: 1;
  overflow-y: hidden;
  overflow-x: hidden;
}
@media screen and (max-width: 767px) {
  .studioPoint {
    padding-top: 7.5rem;
    padding-bottom: 4rem;
  }
}
.studioPoint:before {
  content: "";
  position: absolute;
  top: 0;
  left: -50%;
  right: -50%;
  aspect-ratio: 1/1;
  background-color: #1ea1a1;
  border-radius: 50%;
  z-index: -2;
}
.studioPoint:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 25.64103vw;
  bottom: 0;
  background-color: #1ea1a1;
  z-index: -1;
}
.studioPoint__container {
  background-color: #f7f7f7;
  padding: 4rem 4rem;
  border-radius: 1rem;
  display: flex;
  flex-direction: column;
  width: 90%;
  max-width: 1190px;
  margin: 0 auto 3rem auto;
}
@media screen and (max-width: 767px) {
  .studioPoint__container {
    padding: 1rem 1rem;
    width: 100%;
  }
}
.studioPoint__headding {
  padding: 2rem 0;
  margin: 0 auto;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .studioPoint__headding {
    padding: 2rem 0 0 0;
  }
}
.studioPoint__headding-subcopy {
  display: inline-block;
  background-color: #1ea1a1;
  padding: 0.25rem 1.5rem;
  border-radius: 1rem;
}
.studioPoint__button {
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
  justify-content: center;
}

/* ==================================================
 _studioHero.scss
スタジオページひろーのスタイル定義
================================================== */
.studioLesson {
  padding-top: 8rem;
  padding-bottom: 8rem;
  position: relative;
  background-image: linear-gradient(180deg, #1ea1a1, #aed163);
}
@media screen and (max-width: 767px) {
  .studioLesson {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.studioLesson__card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: 3rem;
}

/* ==================================================
 _studioPrice.scss
スタジオページひろーのスタイル定義
================================================== */
.studioPrice {
  padding-top: 8rem;
  padding-bottom: 8rem;
  position: relative;
  background-color: #f7f7f7;
  overflow-x: hidden;
}
@media screen and (max-width: 767px) {
  .studioPrice {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.studioPrice__h3 {
  position: relative;
  display: flex;
  align-items: flex-end;
}
.studioPrice__h3::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 120px;
  -o-border-image: linear-gradient(45deg, #1fa2a1, #aed163) 1;
     border-image: linear-gradient(45deg, #1fa2a1, #aed163) 1;
  border-bottom: 10px solid #1ea1a1;
}
.studioPrice__h3 h3 {
  padding-left: 0.5rem;
}
.studioPrice__list {
  position: relative;
  padding: 0 5vw;
  overflow: visible;
}
.studioPrice__list-swiper {
  display: flex;
  -moz-column-gap: 3rem;
       column-gap: 3rem;
}
@media screen and (max-width: 767px) {
  .studioPrice__list-swiper {
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }
}
.studioPrice__list .swiper-slide {
  width: auto;
}
.studioPrice__list .swiper-button-next::after,
.studioPrice__list .swiper-button-prev::after {
  display: none;
}
.studioPrice .swiper-button-prev,
.studioPrice .swiper-button-next {
  content: "";
  position: absolute;
  top: -60px;
  width: 62px;
  height: 62px;
  min-width: 62px;
  min-height: 62px;
  margin-left: auto;
  background-size: 15px auto;
  border-radius: 50%;
  background-color: #1ea1a1;
  background-repeat: no-repeat;
  background-position: center center;
  transition: background-color 0.4s, background-position 0.4s;
}
@media screen and (max-width: 767px) {
  .studioPrice .swiper-button-prev,
  .studioPrice .swiper-button-next {
    top: -40px;
    width: 48px;
    height: 48px;
    min-width: 48px;
    min-height: 48px;
  }
}
.studioPrice .swiper-button-next {
  right: 20px;
  background-image: url("../../images/icon-right.svg");
}
@media screen and (max-width: 767px) {
  .studioPrice .swiper-button-next {
    right: 10px;
  }
}
.studioPrice .swiper-button-prev {
  right: 90px;
  background-image: url("../../images/icon-left.svg");
}
@media screen and (max-width: 767px) {
  .studioPrice .swiper-button-prev {
    right: 62px;
  }
}
.studioPrice__card-wrap {
  display: flex;
  flex-direction: column;
  row-gap: 4rem;
}
@media screen and (max-width: 767px) {
  .studioPrice__card-wrap {
    row-gap: 3rem;
  }
}
.studioPrice__table {
  width: 90%;
  max-width: 1190px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .studioPrice__table {
    width: 95%;
  }
}

/* ==================================================
 _studioFlow.scss
スタジオページひろーのスタイル定義
================================================== */
.studioFlow {
  padding-top: 8rem;
  padding-bottom: 4rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioFlow {
    padding-top: 4rem;
    padding-bottom: 2rem;
  }
}
.studioFlow__list {
  position: relative;
}
.studioFlow__list::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 25px;
  width: 2px;
  height: 100%;
  background-color: #1ea1a1;
}
@media screen and (max-width: 767px) {
  .studioFlow__list::before {
    display: none;
  }
}
.studioFlow li:last-child {
  background-color: #f7f7f7;
}

/* ==================================================
 _studioFlow.scss
スタジオページひろーのスタイル定義
================================================== */
.studioReserve {
  padding-top: 6rem;
  padding-bottom: 6rem;
  background-image: linear-gradient(180deg, #1ea1a1, #aed163);
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioReserve {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
}
.studioReserve__container {
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
.studioReserve__button {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
}

/* ==================================================
 _studioFlow.scss
スタジオページひろーのスタイル定義
================================================== */
.studioSlider {
  padding-top: 4rem;
  padding-bottom: 4rem;
  background-color: #2c2c2c;
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioSlider {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
.studioSlider__container {
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}

/* ==================================================
 _studioFlow.scss
スタジオページひろーのスタイル定義
================================================== */
.studioAcsess {
  padding-top: 8rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioAcsess {
    padding-top: 4rem;
  }
}
.studioAcsess__headding {
  display: flex;
  align-items: baseline;
  line-height: 1;
  -moz-column-gap: 1.2rem;
       column-gap: 1.2rem;
  letter-spacing: 0.1rem;
}
.studioAcsess__map {
  width: 100%;
  height: 400px;
}
@media screen and (max-width: 767px) {
  .studioAcsess__map {
    height: 200px;
  }
}

/* ==================================================
 _studioTopix.scss
スタジオページひろーのスタイル定義
================================================== */
.studioTopix {
  padding-top: 8rem;
  padding-bottom: 4rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioTopix {
    padding-top: 4rem;
    padding-bottom: 2rem;
  }
}
.studioTopix__item {
  border-bottom: 0.5px solid #2c2c2c;
  position: relative;
}
.studioTopix__item:first-child {
  border-top: 0.5px solid #2c2c2c;
}
.studioTopix__item::after {
  content: "";
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px #2c2c2c;
  border-right: solid 2px #2c2c2c;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 2rem;
  bottom: 0;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .studioTopix__item::after {
    right: 6px;
  }
}
.studioTopix__item-wrap {
  padding: 1rem 2rem;
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
  -moz-column-gap: 2rem;
       column-gap: 2rem;
  transition: 0.8s;
}
@media screen and (max-width: 1024px) {
  .studioTopix__item-wrap {
    flex-direction: column;
    row-gap: 0.5rem;
  }
}
@media screen and (max-width: 767px) {
  .studioTopix__item-wrap {
    padding: 1rem 0;
  }
}
.studioTopix__item-wrap:hover {
  background-color: #1ea1a1;
}

/* ==================================================
 _studioFlow.scss
スタジオページひろーのスタイル定義
================================================== */
.studioAddline {
  padding-top: 0rem;
  padding-bottom: 4rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioAddline {
    padding-top: 0rem;
    padding-bottom: 2rem;
  }
}

/* ==================================================
 _studioFlow.scss
スタジオページひろーのスタイル定義
================================================== */
.studioFaq {
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-color: #1ea1a1;
}
@media screen and (max-width: 767px) {
  .studioFaq {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}

/* ==================================================
 _studioProf.scss
スタジオページひろーのスタイル定義
================================================== */
.studioProf {
  padding-top: 4rem;
  padding-bottom: 8rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioProf {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }
}

/* ==================================================
 _studioCorp.scss
スタジオページひろーのスタイル定義
================================================== */
.studioCorp__lead {
  padding-top: 4rem;
  padding-bottom: 4rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioCorp__lead {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
.studioCorp__point {
  padding-top: 4rem;
  padding-bottom: 4rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioCorp__point {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
.studioCorp__price {
  padding-top: 4rem;
  padding-bottom: 4rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioCorp__price {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
.studioCorp__price-container {
  display: flex;
  flex-direction: column;
  row-gap: 4rem;
}
.studioCorp__price-wrap {
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}
.studioCorp__price-list {
  display: flex;
  justify-content: center;
  -moz-column-gap: 2rem;
       column-gap: 2rem;
}
@media screen and (max-width: 767px) {
  .studioCorp__price-list {
    flex-direction: column;
    row-gap: 2rem;
    align-items: center;
  }
}
.studioCorp__scroll {
  overflow-x: auto;
}
.studioCorp__table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.studioCorp__table th,
.studioCorp__table td {
  padding: 0.75rem 1rem;
  border-right: 1px solid #ccc;
  word-break: break-word;
  vertical-align: middle;
}
.studioCorp__table tr > th:last-child,
.studioCorp__table tr > td:last-child {
  border-right: none;
}
.studioCorp__table thead tr:first-child {
  background-color: #1ea1a1 !important;
}
.studioCorp__table tr:nth-child(n):nth-child(odd) {
  background-color: #e4e4e4;
}
.studioCorp__table tr:nth-child(n+1):nth-child(even) {
  background-color: #ffffff;
}
.studioCorp__table-scroll {
  min-width: 600px;
}
.studioCorp__flow {
  padding-top: 4rem;
  padding-bottom: 8rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .studioCorp__flow {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }
}
.studioCorp__flow li:last-child {
  background-color: #f7f7f7;
}

/* ==================================================
 pageフォルダ
================================================== */
/* ==================================================
 _flowPage.scss
 レッスンエリアのスタイル定義
================================================== */
.flowPage__lead {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .flowPage__lead {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
.flowPage__list {
  padding-top: 4rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .flowPage__list {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }
}
.flowPage__list ul {
  display: flex;
  flex-direction: column;
  row-gap: 3rem;
}
.flowPage__list li {
  position: relative;
}
.flowPage__list li:not(:last-child)::after {
  content: "";
  position: absolute;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent;
  border-top: 30px solid #7d7d7d;
}
@media screen and (max-width: 767px) {
  .flowPage__list li:not(:last-child)::after {
    bottom: -25px;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #7d7d7d;
  }
}
.flowPage__faq {
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-color: #1ea1a1;
}
@media screen and (max-width: 767px) {
  .flowPage__faq {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}

/* ==================================================
 _simgPage.scss
 レッスンエリアのスタイル定義
================================================== */
.simgPage__lead {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .simgPage__lead {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
.simgPage__driving {
  padding-top: 4rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .simgPage__driving {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }
}
.simgPage__driving ul {
  display: flex;
  flex-direction: column;
  row-gap: 3rem;
}
.simgPage__round {
  padding-top: 4rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .simgPage__round {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }
}
.simgPage__round ul {
  display: flex;
  flex-direction: column;
  row-gap: 3rem;
}
.simgPage__round-movie {
  position: relative;
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
  aspect-ratio: 16/9;
}
.simgPage__round-movie iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}
.simgPage__faq {
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-color: #1ea1a1;
}
@media screen and (max-width: 767px) {
  .simgPage__faq {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}

/* ==================================================
 _coachPage.scss
 レッスンエリアのスタイル定義
================================================== */
.coachPage__lead {
  padding-top: 4rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .coachPage__lead {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }
}
.coachPage__prof {
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-color: #f4f0eb;
}
@media screen and (max-width: 767px) {
  .coachPage__prof {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.coachPage__lesson {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .coachPage__lesson {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.coachPage__schedule {
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
.coachPage__price {
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
.coachPage__card-wrap {
  display: flex;
  flex-direction: column;
  row-gap: 4rem;
}
@media screen and (max-width: 767px) {
  .coachPage__card-wrap {
    row-gap: 3rem;
  }
}
.coachPage__studio {
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
.coachPage__studio-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 480px));
  gap: 2rem;
  padding: 0;
  margin: 0;
  list-style: none;
}
.coachPage__studio-list li {
  border-radius: 1rem;
  transition: transform 0.3s;
}
.coachPage__studio-list li:hover {
  transform: translateY(-4px);
}
.coachPage__reserve {
  padding-top: 6rem;
  padding-bottom: 6rem;
  background-image: linear-gradient(180deg, #1ea1a1, #aed163);
  position: relative;
}
@media screen and (max-width: 767px) {
  .coachPage__reserve {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
}
.coachPage__reserve-container {
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
.coachPage__reserve-table {
  max-width: 800px;
  margin: 0 auto;
}
.coachPage__reserve-button {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
}
.coachPage__flow {
  padding-top: 8rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .coachPage__flow {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.coachPage__flow ul li:last-child {
  background-color: #f7f7f7;
}
.coachPage__faq {
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-color: #1ea1a1;
}
@media screen and (max-width: 767px) {
  .coachPage__faq {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.coachPage__line {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

/* ==================================================
 _flowPage.scss
 レッスンエリアのスタイル定義
================================================== */
.supportPage {
  padding-top: 4rem;
  padding-bottom: 8rem;
}
@media screen and (max-width: 767px) {
  .supportPage {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }
}
.supportPage__lead {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .supportPage__lead {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
.supportPage__list ul {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
  padding: 0;
  margin: 0;
  list-style: none;
}
.supportPage__list li {
  border-radius: 1rem;
  transition: transform 0.3s;
}
.supportPage__list li img {
  border-radius: 1rem 1rem 0 0;
}
.supportPage__list li:hover {
  transform: translateY(-4px);
}

/* ==================================================
 singleフォルダ
================================================== */
/* ==================================================
 _single.scss
 投稿のスタイル定義
================================================== */
.single {
  padding-bottom: 8em;
}
.single__breadcrumb {
  background-color: #f7f7f7;
  padding-top: 70px;
}
.single__hero {
  width: 100%;
}
.single__hero-inner {
  padding-top: 4rem;
  padding-bottom: 2rem;
  margin: 0 auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 0.25rem;
}
.single__meta {
  display: flex;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  justify-content: flex-start;
  align-items: center;
}
.single__meta-tag {
  display: flex;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  justify-content: flex-start;
  align-items: center;
}
.single__article {
  padding-bottom: 2rem;
}
.single__article-thumbnail img {
  width: 100% !important;
  max-height: 700px;
}
.single p,
.single ul,
.single ol,
.single table,
.single dl,
.single blockquote,
.single pre,
.single code,
.single img,
.single picture img,
.single figure,
.single iframe,
.single object,
.single hr,
.single video,
.single audio {
  margin-bottom: 1.2rem;
}
.single p code,
.single p img,
.single p iframe,
.single p object {
  margin-bottom: 0;
}
.single figure {
  max-width: 100%;
}
.single figure img,
.single figure iframe,
.single figure video,
.single figure audio {
  margin-bottom: 0;
}
.single table {
  width: 100%;
}
.single table thead {
  border: none;
}
.single table th,
.single table td {
  box-sizing: border-box;
  padding: 0.625em;
  text-align: left;
  vertical-align: middle;
  border: 1px solid #2c2c2c;
}
.single img,
.single iframe,
.single object,
.single video,
.single audio {
  line-height: 1;
}
.single img {
  max-width: 100%;
  width: auto;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}
.single blockquote {
  line-height: 1.5;
  position: relative;
  padding: 3.125em 1.875em 0.625em;
}
.single blockquote::before {
  font-family: "Material Symbols Outlined";
  font-size: 1.875em;
  font-weight: 900;
  position: absolute;
  top: 0.3125em;
  left: 0.9375em;
  content: "\e244";
}
.single blockquote p,
.single blockquote cite {
  margin-bottom: 1.1rem;
}
.single blockquote p cite {
  margin-bottom: 0;
}
.single blockquote cite {
  font-size: 0.6125em;
  display: block;
  text-align: right;
}
.single h2,
.single h3,
.single h4,
.single h5 {
  margin-top: 1rem;
  margin-bottom: 1.2rem;
  letter-spacing: 1px;
}
.single h2 {
  font-size: 1.2em;
  line-height: 1.5;
  font-weight: 700;
}
.single h3 {
  font-size: 1.1em;
  line-height: 1.3;
  font-weight: 700;
}
.single h1.has-background,
.single h2.has-background,
.single h3.has-background,
.single h4.has-background,
.single h5.has-background,
.single h6.has-background {
  padding: 0.6em 1em;
}
.single b,
.single strong {
  font-weight: bold;
}
.single a {
  text-decoration: underline;
}
.single ul:not([class]) {
  padding-left: 1.25em;
  list-style: disc;
}
.single ol:not([class]) {
  padding-left: 1.875em;
  list-style: decimal;
}
.single .wp-block-media-text__media img {
  width: 100%;
}

/* ==================================================
 _singleColumn.scss
 投稿のスタイル定義
================================================== */
.singleColumn__article h2 {
  background-color: #1ea1a1;
  color: white;
  padding: 0.6em 1em;
  margin-top: 2rem;
}
.singleColumn__article h3 {
  padding: 0.8em 1.2em;
  border-left: 6px solid #1ea1a1;
  background-color: rgba(30, 161, 161, 0.1);
  margin-top: 1.5rem;
}
.singleColumn__article h4 {
  margin-top: 1rem;
  padding: 0.2em 0 0.2em 1em;
  position: relative;
  font-weight: 700;
}
.singleColumn__article h4::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.3em;
  width: 0.2em;
  height: calc(100% - 0.6em);
  background-color: #1ea1a1;
  border-radius: 2em;
}

/* ==================================================
 contactForm7フォルダ
================================================== */
/* ==================================================
 _contactForm7.scss
 アバウトエリアのスタイル定義
================================================== */
.wpcf7-form {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.wpcf7-form p {
  margin-bottom: 0;
  line-height: 1;
}
.wpcf7-form input[type=text],
.wpcf7-form input[type=email],
.wpcf7-form input[type=tel],
.wpcf7-form textarea {
  background-color: white;
  width: 100%;
  padding: 1rem;
  border: 1px solid #ccc;
  border-radius: 0.5rem;
  box-sizing: border-box;
  transition: border-color 0.3s ease;
}
.wpcf7-form input[type=text]:focus,
.wpcf7-form input[type=email]:focus,
.wpcf7-form input[type=tel]:focus,
.wpcf7-form textarea:focus {
  border-color: #0073aa;
  outline: none;
}
.wpcf7-form textarea {
  min-height: 150px;
  resize: vertical;
}
.wpcf7-form .wpcf7-checkbox label,
.wpcf7-form .wpcf7-radio label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.4rem;
}
.wpcf7-form .wpcf7-validates-as-required::after {
  content: " *";
  color: red;
}
.wpcf7-form input[type=submit] {
  width: 100%;
  text-align: center;
  margin: 0 auto;
  padding: 1rem 2rem;
  font-size: 1.6rem;
  background-color: #0073aa;
  color: #fff;
  border: none;
  border-radius: 0.5rem;
  cursor: pointer;
  transition: background-color 0.3s ease;
}
.wpcf7-form input[type=submit]:hover {
  background-color: #005f8d;
}
.wpcf7-form .wpcf7-not-valid-tip {
  color: #d00;
  font-size: 1.4rem;
  margin-top: 0.3rem;
}
.wpcf7-form .wpcf7-response-output {
  margin-top: 2rem;
  padding: 1rem;
  border: 1px solid #ccc;
  border-radius: 0.5rem;
  font-size: 1.4rem;
}
.wpcf7-form .wpcf7-response-output.wpcf7-mail-sent-ok {
  color: #155724;
  background-color: #d4edda;
  border-color: #c3e6cb;
}
.wpcf7-form .wpcf7-response-output.wpcf7-validation-errors, .wpcf7-form .wpcf7-response-output.wpcf7-mail-sent-ng {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}
.wpcf7-form select {
  width: 100%;
  padding: 1rem;
  border: 1px solid #ccc;
  border-radius: 0.5rem;
  background-color: #fff;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg fill='gray' height='16' viewBox='0 0 24 24' width='16' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 1rem;
  cursor: pointer;
}
.wpcf7-form select:focus {
  border-color: #0073aa;
  outline: none;
}
.wpcf7-form select::-ms-expand {
  display: none;
}
.wpcf7-form label {
  display: block;
  font-weight: 600;
  margin-bottom: 0.1rem;
  color: #333;
}
.wpcf7-form label br {
  display: none;
}
.wpcf7-form .wpcf7-form-control-wrap {
  display: block;
  margin-top: 0.5rem;
  margin-bottom: 1.5rem;
}
.wpcf7-form input[type=date] {
  width: 100%;
  padding: 1rem;
  border: 1px solid #ccc;
  border-radius: 0.5rem;
  background-color: #fff;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
}
.wpcf7-form input[type=date]:focus {
  border-color: #0073aa;
  outline: none;
}
.wpcf7-form select {
  width: 100%;
  padding: 1rem;
  border: 1px solid #ccc;
  border-radius: 0.5rem;
  background-color: #fff;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg fill='gray' height='16' viewBox='0 0 24 24' width='16' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 1rem;
  cursor: pointer;
}
.wpcf7-form select:focus {
  border-color: #0073aa;
  outline: none;
}
.wpcf7-form .date-time-group {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  flex-wrap: wrap;
}
.wpcf7-form .date-time-group > div {
  flex: 1 1 45%;
}
@media (max-width: 600px) {
  .wpcf7-form .date-time-group {
    flex-direction: column;
  }
}

/* ==================================================
 componentフォルダ
================================================== */
/* ==================================================
 _c-button.scss
 ボタンのスタイル定義
================================================== */
.button {
  margin: 0 auto;
  font-size: 1.2rem;
  font-weight: 700;
  height: 88px;
  padding-left: 3rem;
  padding-right: 1.5rem;
  max-width: 465px;
  width: 100%;
  border-radius: 100px;
  display: flex;
  align-items: center;
  color: #1ea1a1;
  background-color: white;
  transition: color 0.4s, background-color 0.4s, border 0.4s;
}
@media screen and (max-width: 767px) {
  .button {
    height: 70px;
    padding-left: 1.5rem;
    padding-right: 0.5rem;
  }
}
.button::after {
  content: "";
  width: 62px;
  height: 62px;
  min-width: 62px;
  min-height: 62px;
  margin-left: auto;
  background-size: 15px auto;
  border-radius: 50%;
  background-color: #1ea1a1;
  background-image: url("../../images/icon-right.svg");
  background-repeat: no-repeat;
  background-position: center center;
  transition: background-color 0.4s, background-position 0.4s;
}
@media screen and (max-width: 767px) {
  .button::after {
    width: 48px;
    height: 48px;
    min-width: 48px;
    min-height: 48px;
  }
}
.button:hover {
  background-color: #1ea1a1;
  color: white;
}
.button:hover::after {
  background-position: center right;
}
.button__border {
  border: 2px solid #1ea1a1;
}
.button__min {
  height: 60px;
  padding-left: 1.5rem;
  padding-right: 1rem;
}
.button__min::after {
  content: "";
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
}
.button__small {
  height: 70px;
  padding-left: 2rem;
  padding-right: 1.2rem;
}
.button__small::after {
  content: "";
  width: 50px;
  height: 50px;
  min-width: 50px;
  min-height: 50px;
}
.button__line {
  background-color: #06c755 !important;
}
.button__accent {
  background-color: #ffdc0d !important;
}

.buttonBlack {
  color: #2c2c2c;
}
.buttonBlack::after {
  background-color: #2c2c2c;
}
.buttonBlack:hover {
  background-color: #2c2c2c;
}

.buttonLine {
  color: #06c755;
  border: 2px solid #06c755;
}
.buttonLine::after {
  background-color: #06c755;
}
.buttonLine:hover {
  background-color: #06c755;
}

.icon-before-line::before {
  content: "";
  display: inline-block;
  width: 1.5em;
  height: 1.5rem;
  background-image: url(../../images/line_icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 0.5em;
  vertical-align: middle;
}
@media screen and (max-width: 767px) {
  .icon-before-line::before {
    margin-right: 0.2em;
  }
}

.icon-before-tel::before {
  content: "";
  display: inline-block;
  width: 1.3em;
  height: 1.3em;
  background-image: url(../../images/icon_tel_black.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 0.5em;
  vertical-align: middle;
}

/* ==================================================
 _c-profCard.scss
 カードのスタイル定義
================================================== */
.profCard {
  width: 100%;
  position: relative;
}
.profCard:after {
  content: "";
  position: absolute;
  top: 20%;
  left: 0;
  width: 100%;
  height: 80%;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
  pointer-events: none;
  z-index: -1;
}
.profCard__img {
  width: 100%;
}
.profCard__wrap {
  padding: 2rem 1.5rem;
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
  background-color: white;
}
@media screen and (max-width: 767px) {
  .profCard__wrap {
    padding: 1rem 0.5rem;
  }
}
.profCard__wrap-name {
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #1ea1a1;
}
.profCard__wrap-name-group {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.profCard__sns {
  display: flex !important;
  justify-content: flex-end;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}
.profCard__tag {
  background-color: #ffdc0d;
  padding: 0.1rem 1.2rem;
  border-radius: 1rem;
  margin-right: 0.5rem;
}
@media screen and (max-width: 767px) {
  .profCard__tag {
    padding: 0.1rem 0.6rem;
  }
}
.profCard__button {
  width: 100%;
}

/* ==================================================
 _c-studioCard.scss
 カードのスタイル定義
================================================== */
.studioCard {
  width: 100%;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
  border-radius: 1rem;
}
.studioCard__img {
  width: 100%;
}
.studioCard__img img {
  border-radius: 1rem 1rem 0 0;
}
.studioCard__wrap {
  padding: 2rem 1.5rem;
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
  background-color: white;
  border-radius: 1rem;
}
.studioCard__wrap-name {
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #1ea1a1;
}
.studioCard__tag {
  background-color: #ffdc0d;
  padding: 0.1rem 1.2rem;
  border-radius: 1rem;
  margin-right: 0.5rem;
}
.studioCard__button {
  width: 100%;
}

/* ==================================================
 _c-faqDrower.scss
 カードのスタイル定義
================================================== */
.faqDrower {
  border-radius: 0.5rem;
  margin-bottom: 1.5rem;
  overflow: hidden;
  background-color: #2c2c2c;
}
.faqDrower summary {
  cursor: pointer;
  padding: 2rem 3rem 2rem 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  position: relative;
}
.faqDrower summary::marker {
  display: none;
  content: "";
}
.faqDrower summary::after {
  content: "＋";
  font-size: 1.2rem;
  position: absolute;
  right: 1.5rem;
  transition: transform 0.3s ease;
}
.faqDrower[open] summary::after {
  content: "－";
  transform: rotate(0deg);
}
.faqDrower summary span {
  flex-shrink: 0;
}
.faqDrower div {
  padding: 2rem 1.5rem 2.5rem;
  background-color: #f7f7f7;
}
.faqDrower div span {
  display: inline-block;
  margin-bottom: 0.5rem;
}

/* ==================================================
 _c-recruit.scss
 採用のスタイル定義
================================================== */
.recruit {
  width: 100%;
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-image: linear-gradient(90deg, rgb(246, 50, 42), rgb(238, 195, 45));
}
@media screen and (max-width: 767px) {
  .recruit {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.recruit__container {
  display: flex;
  flex-direction: column;
  row-gap: 2.5rem;
}
.recruit__button {
  width: 80%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .recruit__button {
    width: 100%;
  }
}

/* ==================================================
 _c-recruit.scss
 採用のスタイル定義
================================================== */
.franchise {
  width: 100%;
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-image: linear-gradient(90deg, rgb(64, 149, 198), rgb(102, 194, 188));
}
@media screen and (max-width: 767px) {
  .franchise {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.franchise__container {
  display: flex;
  flex-direction: column;
  row-gap: 2.5rem;
}
.franchise__button {
  width: 80%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .franchise__button {
    width: 100%;
  }
}

/* ==================================================
 _c-sns.scss
 SNSアイコンのスタイル定義
================================================== */
.sns__icon {
  height: 100%;
  width: auto;
  background-size: contain;
  background-repeat: no-repeat;
  aspect-ratio: 1/1;
  display: block;
}
.sns__icon-x {
  background-image: url("../../images/icon-x.svg");
}
.sns__icon-fb {
  background-image: url("../../images/icon-fb.svg");
}
.sns__icon-ig {
  background-image: url("../../images/icon-ig.svg");
}
.sns__icon-ig-black {
  background-image: url("../../images/icon-ig-black.svg");
}
.sns__icon-line {
  background-image: url("../../images/icon-line.svg");
}
.sns__icon-line-black {
  background-image: url("../../images/icon-line-black.svg");
}
.sns__icon-small {
  width: 1rem;
  height: 1rem;
}
.sns__icon-regular {
  width: 1.5rem;
  height: 1.5rem;
}
@media screen and (max-width: 767px) {
  .sns__icon-regular {
    width: 1rem;
    height: 1rem;
  }
}
.sns__icon-medium {
  width: 2rem;
  height: 2rem;
}
@media screen and (max-width: 767px) {
  .sns__icon-medium {
    width: 1.5rem;
    height: 1.5rem;
  }
}

/* ==================================================
 _c-fixButton.scss
 ボタンのスタイル定義
================================================== */
.fixButton {
  margin-right: 1rem;
  width: 360px;
  position: sticky;
  z-index: 10;
  top: 85%;
  left: 100%;
}
@media screen and (max-width: 767px) {
  .fixButton {
    width: 90%;
    margin: 0 auto;
    left: 0;
  }
}

/* ==================================================
 _c-studioCard.scss
 カードのスタイル定義
================================================== */
.numCard {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 48px 0 0 0;
}
@media screen and (max-width: 1024px) {
  .numCard {
    flex-direction: column;
    row-gap: 1rem;
  }
}
@media screen and (max-width: 1024px) {
  .numCard {
    padding: 32px 0 0 0;
  }
}
.numCard__txt {
  width: 55%;
  display: flex;
  flex-direction: column;
  row-gap: 1.2rem;
}
@media screen and (max-width: 1024px) {
  .numCard__txt {
    width: 100%;
    row-gap: 1rem;
  }
}
.numCard__txt-wrap {
  display: flex;
  -moz-column-gap: 1.2rem;
       column-gap: 1.2rem;
  align-items: center;
}
.numCard__txt-num {
  font-size: calc(clamp(1.25rem, 1.083rem + 0.83vw, 1.75rem) * 2.4);
  line-height: 1;
  letter-spacing: -0.01em;
  color: #1ea1a1;
}
.numCard__img {
  width: 40%;
}
@media screen and (max-width: 1024px) {
  .numCard__img {
    width: 100%;
  }
}
.numCard__img img {
  border-radius: 1rem;
}
.numCard__wrap {
  padding: 2rem 1.5rem;
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
  background-color: white;
  border-radius: 1rem;
}
.numCard__wrap-name {
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #1ea1a1;
}
.numCard__tag {
  background-color: #ffdc0d;
  padding: 0.1rem 1.2rem;
  border-radius: 1rem;
  margin-right: 0.5rem;
}
.numCard__button {
  width: 100%;
}

/* ==================================================
 _c-linkButton.scss
 ボタンのスタイル定義
================================================== */
.linkButton {
  transition: all 0.3s;
}
.linkButton:hover {
  opacity: 0.6;
}
.linkButton p {
  display: inline-block;
  padding-bottom: 0.2rem;
}

/* ==================================================
 _c-lessonCard.scss
 カードのスタイル定義
================================================== */
.lessonCard {
  width: 100%;
  background-color: white;
  padding: 2rem 4rem;
  border-radius: 1rem;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 767px) {
  .lessonCard {
    padding: 3rem 0.5rem;
  }
}
.lessonCard__container {
  display: flex;
  justify-content: space-between;
  -moz-column-gap: 3rem;
       column-gap: 3rem;
}
@media screen and (max-width: 1024px) {
  .lessonCard__container {
    flex-direction: column-reverse;
    row-gap: 1rem;
  }
}
.lessonCard__txt {
  width: 50%;
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
@media screen and (max-width: 1024px) {
  .lessonCard__txt {
    width: 100%;
  }
}
.lessonCard__title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding-bottom: 0.5rem;
}
@media screen and (max-width: 767px) {
  .lessonCard__title {
    flex-direction: column-reverse;
    align-items: flex-start;
    row-gap: 0.4rem;
  }
}
.lessonCard__title::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 200px;
  -o-border-image: linear-gradient(45deg, #1fa2a1, #aed163) 1;
     border-image: linear-gradient(45deg, #1fa2a1, #aed163) 1;
  border-bottom: 10px solid #1ea1a1;
}
.lessonCard__img {
  width: 50%;
}
@media screen and (max-width: 1024px) {
  .lessonCard__img {
    width: 100%;
  }
}
.lessonCard__img img {
  border-radius: 1rem;
}
.lessonCard__price-inner {
  padding: 1.5rem 0;
  border: 2px solid #aed163;
  border-radius: 0 0 1rem 1rem;
}
.lessonCard__price-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}
.lessonCard__price h4 {
  background-color: #aed163;
  border-radius: 1rem 1rem 0 0;
  padding: 1rem 0;
}
.lessonCard__tag {
  background-color: #ffdc0d;
  padding: 0.1rem 1.2rem;
  border-radius: 1rem;
  margin-right: 0.5rem;
}
.lessonCard__button {
  width: 90%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .lessonCard__button {
    width: 100%;
  }
}

/* ==================================================
 _c-priceListCard.scss
 カードのスタイル定義
================================================== */
.priceListCard {
  max-width: 368px;
  min-width: 250px;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
}
.priceListCard__batch {
  position: relative;
}
.priceListCard__batch::before {
  position: absolute;
  content: "";
  width: 80px;
  height: 80px;
  background-image: url("../../images/icon-recommend.svg");
  background-repeat: no-repeat;
  top: -15px;
  left: -20px;
}
@media screen and (max-width: 767px) {
  .priceListCard__batch::before {
    width: 80px;
    height: 80px;
    left: -10px;
    top: -15px;
  }
}
.priceListCard__batchCorp {
  position: relative;
}
.priceListCard__batchCorp::before {
  position: absolute;
  content: "";
  width: 80px;
  height: 80px;
  background-image: url("../../images/icon-corp.svg");
  background-repeat: no-repeat;
  top: -15px;
  left: -20px;
}
@media screen and (max-width: 767px) {
  .priceListCard__batchCorp::before {
    width: 80px;
    height: 80px;
    left: -10px;
    top: -15px;
  }
}
.priceListCard__head {
  padding: 1.5rem 0;
  border-radius: 0.2rem 0.2rem 0 0;
  text-align: center;
}
.priceListCard__inner {
  background-color: #f4f0eb;
  padding: 2rem 2rem 3rem 2rem;
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
.priceListCard__price {
  display: flex;
  flex-direction: column;
  row-gap: 0.25rem;
}
.priceListCard__button a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 80%;
  height: 50px;
  color: #fff;
  border-radius: 3px;
  letter-spacing: 0.05em;
  transition: all 0.3s;
}
.priceListCard__button a:hover {
  opacity: 0.8;
}
.priceListCard__dl {
  border-top: 1px solid #2c2c2c;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .priceListCard__dl {
    flex-direction: column;
    text-align: center;
  }
}
.priceListCard__dl dt {
  width: 50%;
  padding-top: 1.5rem;
}
@media screen and (max-width: 767px) {
  .priceListCard__dl dt {
    width: 100%;
  }
}
.priceListCard__dl dd {
  width: 50%;
  padding-top: 1.5rem;
}
@media screen and (max-width: 767px) {
  .priceListCard__dl dd {
    width: 100%;
    padding-top: 0.2rem;
  }
}

/* ==================================================
 _c-priceCard.scss
 カードのスタイル定義
================================================== */
.priceCard {
  padding: 3rem 4rem;
  background-color: #f4f0eb;
  border-left: 10px solid;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 1024px) {
  .priceCard {
    padding: 2rem 3rem;
  }
}
@media screen and (max-width: 767px) {
  .priceCard {
    border-top: 10px solid;
    border-left: none;
    padding: 2rem 1rem;
  }
}
.priceCard__batch {
  position: relative;
}
.priceCard__batch::before {
  position: absolute;
  content: "";
  width: 100px;
  height: 100px;
  background-image: url("../../images/icon-recommend.svg");
  background-repeat: no-repeat;
  top: -15px;
  left: -30px;
}
@media screen and (max-width: 767px) {
  .priceCard__batch::before {
    width: 80px;
    height: 80px;
    left: 0;
    top: 0;
  }
}
.priceCard__wrap {
  display: flex;
  justify-content: space-between;
  -moz-column-gap: 4rem;
       column-gap: 4rem;
}
@media screen and (max-width: 1024px) {
  .priceCard__wrap {
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .priceCard__wrap {
    flex-direction: column;
    row-gap: 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  .priceCard__wrap h3 {
    text-align: center;
  }
}
.priceCard__head {
  width: 50%;
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}
@media screen and (max-width: 767px) {
  .priceCard__head {
    width: 100%;
  }
}
.priceCard__head-time {
  padding: 0.25rem 1rem;
  border-radius: 0.2rem;
}
.priceCard__head-description {
  line-height: 1.5;
}
.priceCard__head-recommend {
  border: 2px solid #2c2c2c;
}
.priceCard__head-recommend h4 {
  background-color: #2c2c2c;
  padding: 0.25rem 0;
}
.priceCard__head-recommend ul {
  padding: 0.5rem 1rem;
}
.priceCard__head-recommend li {
  list-style-type: disc;
  margin-left: 1rem;
  padding: 0.2rem;
}
.priceCard__head-recommend li::marker {
  color: #2c2c2c;
}
.priceCard__txt {
  width: 50%;
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}
@media screen and (max-width: 767px) {
  .priceCard__txt {
    width: 100%;
  }
}
.priceCard__txt-wrap {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .priceCard__txt-wrap {
    justify-content: center;
  }
}
.priceCard__dl {
  border-top: 1px solid #2c2c2c;
  display: flex;
  flex-wrap: wrap;
}
.priceCard__dl dt {
  width: 40%;
  padding-top: 1.5rem;
}
.priceCard__dl dd {
  width: 60%;
  padding-top: 1.5rem;
}
.priceCard__tag {
  background-color: #aed163;
  padding: 0.1rem 1rem;
  border-radius: 1rem;
  margin-right: 0.5rem;
}
.priceCard__table {
  padding-top: 1.5rem;
}
.priceCard__table summary {
  cursor: pointer;
  padding: 1rem 3rem 1rem 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  position: relative;
  background-color: white;
  justify-content: center;
}
.priceCard__table summary::marker {
  display: none;
  content: "";
}
.priceCard__table summary::after {
  content: "＋";
  font-size: 1.2rem;
  position: absolute;
  right: 1.5rem;
  transition: transform 0.3s ease;
}
.priceCard__table[open] summary::after {
  content: "－";
  transform: rotate(0deg);
}
.priceCard__table-body {
  padding-top: 1rem;
}
.priceCard__img {
  padding-top: 2rem;
  width: 100%;
  margin: 0 auto;
}

/* ==================================================
 _c-profCard.scss
 カードのスタイル定義
================================================== */
.priceTable {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.priceTable th,
.priceTable td {
  padding: 0.75rem 1rem;
  border-right: 1px solid #ccc;
  word-break: break-word;
}
@media screen and (max-width: 767px) {
  .priceTable th {
    display: none;
  }
}
.priceTable tr > th:last-child,
.priceTable tr > td:last-child {
  border-right: none;
}
.priceTable tr:first-child {
  background-color: #1ea1a1;
}
.priceTable tr:nth-child(n+2):nth-child(odd) {
  background-color: #e4e4e4;
}
.priceTable tr:nth-child(n+2):nth-child(even) {
  background-color: #ffffff;
}
@media screen and (max-width: 767px) {
  .priceTable td {
    padding: 1rem 2rem;
    display: block;
    text-align: right;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .priceTable td::before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
    margin-right: 10px;
  }
}
@media screen and (max-width: 767px) {
  .priceTable td:first-child {
    color: white;
    background: #1ea1a1;
    font-weight: bold;
    text-align: center;
  }
}
.priceTable__head-ticket {
  width: 40%;
}
.priceTable__head-count {
  width: 10%;
}
.priceTable__head-price {
  width: 25%;
}

/* ==================================================
 _c-flowItem.scss
 カードのスタイル定義
================================================== */
.flowItem {
  display: flex;
  -moz-column-gap: 2rem;
       column-gap: 2rem;
  margin-top: 100px;
}
@media screen and (max-width: 1024px) {
  .flowItem {
    -moz-column-gap: 1rem;
         column-gap: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .flowItem {
    flex-direction: column;
    align-items: center;
    row-gap: 1rem;
    margin-top: 50px;
  }
}
.flowItem__number-circle {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #1ea1a1;
}
.flowItem__wrap {
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
@media screen and (max-width: 767px) {
  .flowItem__wrap {
    align-items: center;
    row-gap: 1rem;
  }
}
.flowItem__button {
  text-align: left;
  width: 100%;
}
.flowItem__button a {
  margin: auto 0 0 0;
}
@media screen and (max-width: 767px) {
  .flowItem__button a {
    margin: 0 auto;
  }
}

/* ==================================================
 _c-slideImage.scss
 カードのスタイル定義
================================================== */
.slideImage img {
  border-radius: 1rem;
}
.slideImage .swiper-wrapper {
  transition-timing-function: linear;
  transition-duration: 5000ms;
}

/* ==================================================
 _c-acsessBlock.scss
 カードのスタイル定義
================================================== */
.acsessBlock__wrap {
  display: flex;
  justify-content: space-between;
  -moz-column-gap: 2rem;
       column-gap: 2rem;
}
@media screen and (max-width: 1024px) {
  .acsessBlock__wrap {
    flex-direction: column-reverse;
    row-gap: 2rem;
  }
}
.acsessBlock__table {
  width: 45%;
}
@media screen and (max-width: 1024px) {
  .acsessBlock__table {
    width: 100%;
  }
}
.acsessBlock__table tr {
  padding: 1rem 0;
  display: flex;
  border-bottom: 0.5px solid #2c2c2c;
  width: 100%;
}
.acsessBlock__table tr:first-child {
  padding: 0 0 1rem 0;
}
.acsessBlock__table tr:last-child {
  border-bottom: none;
  padding: 1rem 0 0 0;
}
.acsessBlock__table th {
  width: 35%;
}
.acsessBlock__table td {
  width: 65%;
}
.acsessBlock__img {
  width: 55%;
}
@media screen and (max-width: 1024px) {
  .acsessBlock__img {
    width: 100%;
  }
}
.acsessBlock__img img {
  border-radius: 1rem;
}
.acsessBlock__sns {
  display: flex;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  align-items: flex-end;
  justify-content: flex-end;
}
.acsessBlock__sns li {
  transition: 0.4s;
}
.acsessBlock__sns li:hover {
  opacity: 0.8;
}

/* ==================================================
 _breadcrumb.scss
 パンくずリストのスタイル定義
================================================== */
.breadcrumb {
  background-color: #f7f7f7;
  padding: 1rem 0;
}
.breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  gap: 0.5em;
  padding: 0;
}
.breadcrumb__item {
  position: relative;
}
.breadcrumb__item::after {
  content: ">";
  margin: 0 0.5em;
  color: #aaa;
}
.breadcrumb__item:last-child::after {
  content: "";
  margin: 0;
}
.breadcrumb__item a {
  color: #1ea1a1;
  text-decoration: none;
}
.breadcrumb__item a:hover {
  text-decoration: underline;
}

/* ==================================================
 _c-studioCard.scss
 カードのスタイル定義
================================================== */
.commonCard {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: space-between;
  -moz-column-gap: 3rem;
       column-gap: 3rem;
}
@media screen and (max-width: 1024px) {
  .commonCard {
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .commonCard {
    flex-direction: column-reverse;
    row-gap: 1rem;
  }
}
.commonCard__txt {
  width: 55%;
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}
@media screen and (max-width: 1024px) {
  .commonCard__txt {
    width: 100%;
    row-gap: 1rem;
  }
}
.commonCard__img {
  width: 45%;
}
@media screen and (max-width: 1024px) {
  .commonCard__img {
    width: 100%;
  }
}
.commonCard__img img {
  border-radius: 1rem;
}

/* ==================================================
 _shotdataTable.scss
 カードのスタイル定義
================================================== */
.shotdataTable {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  max-height: 200px;
  overflow: hidden;
  position: relative;
  overflow-x: scroll !important;
}
.shotdataTable.--is-active {
  height: -moz-fit-content;
  height: fit-content;
  max-height: -moz-fit-content;
  max-height: fit-content;
}
.shotdataTable__table {
  width: 100%;
  margin: 0 auto;
}
.shotdataTable th,
.shotdataTable td {
  padding: 1rem;
  border-bottom: 2px solid white;
}
.shotdataTable th {
  width: 30%;
  background-color: #1ea1a1;
  color: white;
}
.shotdataTable td {
  width: 70%;
  background-color: #53bcbc;
  color: white;
}

/* ==================================================
 _courseTable
 カードのスタイル定義
================================================== */
.courseTable th,
.courseTable td {
  vertical-align: middle;
}
.courseTable__box {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  max-height: 484px;
  overflow: hidden;
  position: relative;
  overflow-x: scroll !important;
}
.courseTable__box.--is-active {
  height: -moz-fit-content;
  height: fit-content;
  max-height: -moz-fit-content;
  max-height: fit-content;
}
.courseTable__table {
  width: 100%;
  border-collapse: collapse;
  white-space: nowrap;
}
.courseTable__table-country img {
  width: 48px;
}
.courseTable__table-ratebox {
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  -moz-column-gap: 8px;
       column-gap: 8px;
}
.courseTable__table-starsbox {
  display: flex;
  align-items: center;
}
.courseTable thead tr th {
  text-align: center;
  padding: 20px 0 17px 0;
  color: white;
  font-weight: 700;
  border-right: 1px solid white;
}
.courseTable thead tr th:first-of-type {
  border-radius: 12px 0 0 12px;
}
.courseTable thead tr th:last-of-type {
  border-radius: 0 12px 12px 0;
}
.courseTable tbody tr:nth-of-type(2n) {
  background-color: #e7e7e7;
}
.courseTable tbody td {
  padding: 1rem 1.5rem;
  color: #000;
  text-align: center;
  letter-spacing: 1.28px;
}
.courseTable tbody td:nth-of-type(3) {
  text-align: left;
}
.courseTable tbody .star {
  width: 16px;
  height: 16px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../../images/icon-star-green.svg");
}
.courseTable tbody .star.--gray {
  background-image: url("../../images/icon-star-gray.svg");
}

/* ==================================================
 _modeTable.scss
 カードのスタイル定義
================================================== */
.modeTable__wrap {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  max-height: 400px;
  overflow: hidden;
  position: relative;
  overflow-x: scroll !important;
}
.modeTable__wrap.--is-active {
  height: -moz-fit-content;
  height: fit-content;
  max-height: -moz-fit-content;
  max-height: fit-content;
}
.modeTable__imgList {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1rem;
}
.modeTable__imgList img {
  border-radius: 1rem;
}

/* ==================================================
 _c-priceCard.scss
 カードのスタイル定義
================================================== */
/* ==================================================
 _c-coachCard.scss
 カードのスタイル定義
================================================== */
.coachCard__wrap {
  display: flex;
  justify-content: space-between;
  -moz-column-gap: 3rem;
       column-gap: 3rem;
}
@media screen and (max-width: 1024px) {
  .coachCard__wrap {
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .coachCard__wrap {
    flex-direction: column-reverse;
    row-gap: 1.5rem;
  }
}
.coachCard__txt {
  width: 55%;
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}
@media screen and (max-width: 767px) {
  .coachCard__txt {
    width: 100%;
    row-gap: 1rem;
  }
}
.coachCard__txt-group {
  padding-bottom: 1rem;
  border-bottom: 2px solid #1ea1a1;
}
.coachCard__name {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}
.coachCard__sns {
  display: flex;
  justify-content: flex-start;
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}
.coachCard__img {
  width: 45%;
}
.coachCard__img img {
  border-radius: 1rem;
}
@media screen and (max-width: 767px) {
  .coachCard__img {
    width: 100%;
  }
}

/* ==================================================
 _scheduleTable.scss
スケジュールエリア定義
================================================== */
.scheduleTable {
  width: 100%;
  border-collapse: collapse;
  overflow: auto;
}
.scheduleTable thead {
  width: 100%;
}
.scheduleTable thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  text-align: center;
  padding: 0.75rem;
  border: 1px solid #ccc;
  text-align: center;
  background-color: #1ea1a1;
  color: white;
}
.scheduleTable tbody {
  width: 100%;
}
.scheduleTable tbody th {
  padding: 1rem 1rem;
  border-bottom: 1px solid #ddd;
  border-left: 1px solid #ddd;
  position: sticky;
  left: 0;
  z-index: 1;
  text-align: left;
  padding: 0.75rem;
  vertical-align: middle;
  background-color: #f7f7f7;
  min-width: 5rem;
}
@media screen and (max-width: 767px) {
  .scheduleTable tbody th {
    padding: 0.5rem;
  }
}
.scheduleTable tbody td {
  border-bottom: 1px solid #ddd;
  border-left: 1px solid #ddd;
  padding-bottom: 1rem;
  padding-top: 1rem;
  vertical-align: middle;
  min-width: 2.5rem;
  text-align: center;
  background-color: #f7f7f7;
}
.scheduleTable tbody td:last-of-type {
  border-right: 1px solid #ddd;
}
.scheduleTable__img {
  width: 2rem;
  height: 2rem;
}
@media screen and (max-width: 767px) {
  .scheduleTable__img {
    width: 1.5rem;
    height: 1.5rem;
  }
}
.scheduleTable__scroll {
  width: 100%;
  overflow-x: auto;
}

/* ==================================================
 _c-contactStudio.scss
 カードのスタイル定義
================================================== */
.contactStudio {
  padding-top: 8rem;
  padding-bottom: 8rem;
  background-color: #2c2c2c;
}
@media screen and (max-width: 767px) {
  .contactStudio {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.contactStudio__wrap {
  display: flex;
  justify-content: center;
  -moz-column-gap: 2rem;
       column-gap: 2rem;
}
@media screen and (max-width: 767px) {
  .contactStudio__wrap {
    flex-direction: column;
    row-gap: 1rem;
  }
}

/* ==================================================
 _c-addLine.scss
 カードのスタイル定義
================================================== */
.addLine {
  max-width: 800px;
  margin: 0 auto;
  transition: all 0.3s;
}
.addLine:hover {
  opacity: 0.8;
}
.addLine__wrap {
  background-color: white;
  border: 3px solid #06c755;
  padding: 1rem 1.5rem;
  position: relative;
  display: flex;
  justify-content: flex-start;
  -moz-column-gap: 2rem;
       column-gap: 2rem;
}
@media screen and (max-width: 1024px) {
  .addLine__wrap {
    -moz-column-gap: 1rem;
         column-gap: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .addLine__wrap {
    padding: 0.5rem 1rem;
  }
}
.addLine__wrap-img {
  width: 66px;
  height: 87px;
  -o-object-fit: contain;
     object-fit: contain;
}
.addLine__link {
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 5px 60px;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .addLine__link {
    padding: 5px 40px;
  }
}
.addLine__link span {
  position: relative;
}
.addLine__link:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  border-bottom: 50px solid #06c755;
  border-left: 40px solid transparent;
  z-index: 0;
}
.addLine__link::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 12px;
  border-top: 6px solid transparent;
  border-left: 12px solid #fff;
  border-bottom: 6px solid transparent;
}

/* ==================================================
 _c-commonCard.scss
 カードのスタイル定義
================================================== */
.commonTable {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.commonTable th,
.commonTable td {
  padding: 0.75rem 1rem;
  border-right: 1px solid #ccc;
  word-break: break-word;
}
@media screen and (max-width: 767px) {
  .commonTable th {
    display: none;
  }
}
.commonTable tr > th:last-child,
.commonTable tr > td:last-child {
  border-right: none;
}
.commonTable tr:first-child {
  background-color: #1ea1a1;
}
.commonTable tr:nth-child(n+2):nth-child(odd) {
  background-color: #e4e4e4;
}
.commonTable tr:nth-child(n+2):nth-child(even) {
  background-color: #ffffff;
}
@media screen and (max-width: 767px) {
  .commonTable td {
    padding: 1rem 2rem;
    display: block;
    text-align: right;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .commonTable td::before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
    margin-right: 10px;
  }
}
@media screen and (max-width: 767px) {
  .commonTable td:first-child {
    color: white;
    background: #1ea1a1;
    font-weight: bold;
    text-align: center;
  }
}

/* ==================================================
 _c-slideInterior.scss
 カードのスタイル定義
================================================== */
.slideInterior {
  width: 100%;
}
.slideInterior .swiper-slide img {
  border-radius: 1rem;
  max-height: 400px;
  width: 100%;
  height: 100%;
}
.slideInterior__button {
  padding-top: 2rem;
  padding-bottom: 2rem;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  -moz-column-gap: 4rem;
       column-gap: 4rem;
}
@media screen and (max-width: 767px) {
  .slideInterior__button {
    -moz-column-gap: 1rem;
         column-gap: 1rem;
  }
}
.slideInterior__button .swiper-pagination {
  position: relative;
  display: inline-block;
  width: auto;
  height: 3px;
  bottom: auto;
  top: auto;
  left: auto;
  line-height: 1;
}
.slideInterior__button .swiper-pagination-bullet {
  width: 1.6rem;
  height: 3px;
  cursor: pointer;
  vertical-align: top;
  background-color: white;
  border-radius: 0;
}
.slideInterior__button .swiper-pagination-bullet-active {
  width: 4rem;
  background-color: white;
}
.slideInterior__button .swiper-button-next::after,
.slideInterior__button .swiper-button-prev::after {
  display: none;
}
.slideInterior__button .swiper-button-prev,
.slideInterior__button .swiper-button-next {
  content: "";
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  width: 62px;
  height: 62px;
  min-width: 62px;
  min-height: 62px;
  background-size: 15px auto;
  border-radius: 50%;
  border: 1.5px solid white;
  background-repeat: no-repeat;
  background-position: center center;
  transition: background-color 0.4s, background-position 0.4s;
}
.slideInterior__button .swiper-button-prev:hover,
.slideInterior__button .swiper-button-next:hover {
  background-color: white;
}
@media screen and (max-width: 767px) {
  .slideInterior__button .swiper-button-prev,
  .slideInterior__button .swiper-button-next {
    width: 48px;
    height: 48px;
    min-width: 48px;
    min-height: 48px;
  }
}
.slideInterior__button .swiper-button-next {
  background-image: url("../../images/icon-right.svg");
  margin: 0 auto 0 0;
}
.slideInterior__button .swiper-button-next:hover {
  background-image: url("../../images/icon-right_main.svg");
}
.slideInterior__button .swiper-button-prev {
  background-image: url("../../images/icon-left.svg");
  margin: 0 0 0 auto;
}
.slideInterior__button .swiper-button-prev:hover {
  background-image: url("../../images/icon-left_main.svg");
}

/* ==================================================
 _c-nextpostButton.scss
 カードのスタイル定義
================================================== */
.nextpostButton {
  width: 80%;
  display: flex;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  justify-content: center;
  align-items: center;
  list-style: none;
  padding: 0;
  margin: 2rem auto;
}
@media screen and (max-width: 1024px) {
  .nextpostButton {
    width: 80%;
  }
}
@media screen and (max-width: 767px) {
  .nextpostButton {
    width: 90%;
  }
}
.nextpostButton li {
  width: 100%;
  text-align: center;
}
.nextpostButton a {
  text-align: center;
  display: inline-block;
  width: 100%;
  height: 100%;
  padding: 1rem 0;
  font-size: 1.2rem;
  font-weight: 600;
  color: #2c2c2c;
  background-color: white;
  border: 1px solid #2c2c2c;
  border-radius: 5px;
  text-decoration: none;
  transition: background-color 0.3s ease-in-out;
  position: relative;
}
.nextpostButton a:hover {
  background-color: #2c2c2c;
  color: white;
}
.nextpostButton__next::after {
  content: "";
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px;
  border-right: solid 2px;
  border-color: #2c2c2c;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  left: 90%;
  bottom: 0;
  margin: auto;
}
.nextpostButton__next:hover::after {
  border-color: white;
}
.nextpostButton__prev::after {
  content: "";
  width: 6px;
  height: 6px;
  border: 0;
  border-bottom: solid 2px;
  border-left: solid 2px;
  border-color: #2c2c2c;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 90%;
  bottom: 0;
  margin: auto;
}
.nextpostButton__prev:hover::after {
  border-color: white;
}

/* ==================================================
 _c-studioCard.scss
 カードのスタイル定義
================================================== */
.pagination {
  text-align: center;
  margin: 2em 0;
}
.pagination ul {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.5em;
  padding: 0;
  list-style: none;
}
.pagination li a,
.pagination li span {
  display: inline-block;
  padding: 0.5em 0.9em;
  border: 1px solid #ccc;
  color: #333;
  text-decoration: none;
  font-weight: 500;
  border-radius: 4px;
  transition: all 0.2s ease-in-out;
}
.pagination li a:hover,
.pagination li span:hover {
  background-color: #333;
  color: #fff;
  border-color: #333;
}
.pagination li .current {
  background-color: #000;
  color: #fff;
  pointer-events: none;
}

/* ==================================================
 _c-pace.scss
 ローディングのスタイル定義
================================================== */
.pace {
  -webkit-pointer-events: none;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.pace::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: white;
  position: fixed;
  z-index: 999;
  opacity: 1;
}

.pace-inactive {
  position: relative;
  z-index: 999;
  display: block !important;
  animation: opacity_animation 0.5s ease 0s forwards;
}

@keyframes opacity_animation {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.pace .pace-progress {
  display: none;
}

.pace .pace-progress-inner {
  display: none;
  /* display: block;
  position: absolute;
     top: 50%;
  left: 50%;
  width: 100px;
  height: 100%;
  box-shadow: 0 0 10px #061b28, 0 0 5px #061b28;
  opacity: 1.0;
  -webkit-transform: rotate(3deg) translate(0px, -4px);
  -moz-transform: rotate(3deg) translate(0px, -4px);
  -ms-transform: rotate(3deg) translate(0px, -4px);
  -o-transform: rotate(3deg) translate(0px, -4px);
  transform: rotate(3deg) translate(0px, -4px); */
}

.pace .pace-activity {
  display: block;
  position: fixed;
  z-index: 2000;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 14px;
  border: solid 2px transparent;
  border-top-color: #061b28;
  border-left-color: #061b28;
  border-radius: 10px;
  animation: pace-spinner 400ms linear infinite;
}
@keyframes pace-spinner {
  0% {
    transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
/* ==================================================
 _c-acsessBlock.scss
 カードのスタイル定義
================================================== */
.authorCard p {
  margin-bottom: 0;
}
.authorCard__container {
  background-color: white;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
}
.authorCard__title {
  background-color: #aed163;
  padding: 1rem 2rem;
}
.authorCard__title h3 {
  padding: 0;
  margin-top: 0;
  border-left: none;
  margin-bottom: 0;
  background-color: #aed163;
}
.authorCard__wrap {
  display: flex;
  gap: 1.5rem;
  padding: 1rem 2rem;
}
@media screen and (max-width: 767px) {
  .authorCard__wrap {
    flex-direction: column;
    align-items: center;
  }
}
.authorCard__wrap-img {
  width: 150px;
  height: 150px;
}
.authorCard__wrap-img img {
  min-width: 150px;
  min-height: 150px;
  border-radius: 100%;
  margin-bottom: 0;
  border: 3px solid #aed163;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 50%;
     object-position: 50% 50%;
}
.authorCard__wrap-txt {
  width: auto;
}

/*
@use "component/table";
@use "component/link";
@use "component/description";
@use "component/card";
@use "component/blog-card";
*//*# sourceMappingURL=style.css.map */