/*
Theme Name: ノアTSテニスアカデミー東大阪（Lightning子テーマ）
Theme URI: 
Template: lightning
Description:
Author: タロスカイ株式会社
*/

/**
 * 共通設定
 */

/* 見出し */
h2,h3 {
  color: var(--wp--preset--color--vk-color-custom-2);
}

/* グローバルメニュー（アニメーション） */
.global-nav-list > li:hover > a,
.global-nav-list > li.current-menu-item > a,
.global-nav-list > li.current-page-parent > a{
  color: var(--color-primary-vivid) !important;
}

.global-nav-list > li:hover:before,
.global-nav-list > li[class*='current']:where(:not(.menu-item-anchor)):before {
  width: 0%;
}

.global-nav-list > li::before {
  transition: all 0.2s ease-out;
  content: '';
  display: block;
  padding: 0;
  left: 50%;
  bottom:5px;
  transform: translateX(-50%);
  border: 5px solid transparent;
  z-index: 1000;
  opacity: 0;
  border-bottom-color: var(--vk-color-primary);
}

.global-nav-list > li:hover::before,
.global-nav-list > li.current-menu-item::before,
.global-nav-list > li.current-page-parent::before{
  bottom: 10px;
  opacity: 1;
}

.global-nav-list > li.menu-item-has-children:hover::before{
  opacity: 0;
}

.global-nav-list>li.menu-item-has-children::after {
  bottom: 2px;
}

.device-pc .global-nav-list > li.menu-item-has-children:hover::after,
.global-nav-list > li.acc-parent-open::after {
  bottom: 5px;
}

.vk-men.vk-menu-acc ul.acc-child-close {
  transition: all 0.3s ease-in;
}

.device-pc .global-nav-list > li:focus-within li:focus-within > .sub-menu,
.device-pc .global-nav-list > li:focus-within > .sub-menu,
.device-pc .global-nav-list > li:hover li:focus-within > .sub-menu,
.device-pc .global-nav-list > li:hover > .sub-menu {
  top: 43px;
}

:has(body.header_scrolled) .device-pc .global-nav-list > li:focus-within li:focus-within > .sub-menu,
:has(body.header_scrolled) .device-pc .global-nav-list > li:focus-within > .sub-menu,
:has(body.header_scrolled) .device-pc .global-nav-list > li:hover li:focus-within > .sub-menu,
:has(body.header_scrolled) .device-pc .global-nav-list > li:hover > .sub-menu {
  top: 50px;
}

/* サブメニュー */
.global-nav-list>li>ul.sub-menu {
  background-color: #fff;
  border:2px solid var(--color-primary);
  width:14em;
  left: 50%;
  transform: translateX(-50%);
  margin-left: auto;
  top: 43px;
  transition: all 0.3s ease-in;
}

:has(body.header_scrolled) 
.global-nav-list>li>ul.sub-menu {
  top: 50px;
}

.global-nav-list>li>ul.sub-menu li a{
  color:var(--color-primary);
  text-align:center;
  border-bottom: 1px solid rgba(205 206 207 / .1);
  transition:.2s;
}

.global-nav-list .sub-menu li a, .global-nav-list .sub-menu li a:hover {
  color:var(--color-primary);
}

.global-nav-list .sub-menu li a:focus-within, .global-nav-list .sub-menu li a:hover {
  background-color: var(--color-bg1);
}


/* ボトム固定バナー */
.wp-block-image.noahacad-img-banner-trial.trial-fixed,
.wp-block-image.noahacad-img-banner-trial-sp.trial-fixed {
  position: fixed;
  margin-bottom: 0 !important;
  bottom: 0;
  right: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
  z-index: 10;
}

.wp-block-image.noahacad-img-banner-trial.trial-fixed.visible,
.wp-block-image.noahacad-img-banner-trial-sp.trial-fixed.visible {
  opacity: 1;
  pointer-events: auto;
}

/*トップへ戻るボタン*/
.page_top_btn {
  width: 42px;
  height: 42px;
  border: 2px solid #fff;
  border-radius: 100em;
  background: var(--wp--preset--color--vk-color-custom-2);
  box-shadow: none;
  background-image: var(--ver_page_top_button_url);
  background-size: 80%;
  background-repeat: no-repeat;
  background-position: center 40%;
  transition: opacity 0.3s;
  /*bottom: 7rem;*/  //固定バナー表示時
  bottom: 1rem;  //固定バナー非表示時
  right: 1rem;
}

/* パンくずリスト */
.breadcrumb {
  border-top: none;
  border-bottom: none;
}

.breadcrumb i {
  display: none;
}

.breadcrumb li a {
  text-decoration: none;
  color: var(--color-primary);
}

.breadcrumb li a:hover {
  text-decoration: underline;
  color: var(--color-primary-vivid);
}

/* コンタクトフォーム */
.cf7-item-group {
  display: flex;
  flex-direction: row;
  gap: 1em;
}

@media (width < 768px) {
  .cf7-item-group {
    gap: 0em;
    flex-direction: column;
  }
}

.cf7-item {
  display: flex;
  flex-direction: column;
  margin-bottom: 1.5em;
}

.cf7-q {
  font-weight: bold;
  margin-bottom: 0.5em;
}

.wpcf7 input,
.wpcf7 textarea {
  width: 100%;
  border-color: #c5d9e9;
  border-radius: 0.5em;
}

.wpcf7-form-control.wpcf7-radio {
  text-align: center;
}

.wpcf7 input[type="submit"] {
  background-color: var(--vk-color-primary);
  color: #fff;
  font-weight: bold;
  border-radius: 100em;
  font-size: var(--size-1125);
  border: 1px solid var(--vk-color-primary);
  transition: var(--transition-S);
}

.wpcf7 input[type="submit"]:hover {
  color: var(--vk-color-primary);
  border-color: currentcolor;
  background-color: var(--vk-color-accent);
}

.cf7-req {
  font-size: 0.75em;
  color: #fff;
  line-height: 1;
  padding: 0.5em;
  background: var(--vk-color-primary);
  margin-left: 0.75em;
  display: inline-block;
  border-radius: 0.25em;
}

.wpcf7-not-valid-tip {
  color: #d20b00;
  font-weight: bold;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
  font-weight: bold;
  color: #d20b00;
  border: none;
  background-color: #fcf929;
  border-radius: 0.5em;
}

/* フォーム調整 */
.cf7-notes p {
  font-size: 0.9em;
  color: #d20b00;
}

/* お問い合わせフォーム */
.wp-block-contact-form-7-contact-form-selector {
  max-width: 800px !important;
  display: block;
  margin-inline: auto;
}

/* reCAPTCHA */
.grecaptcha-badge {
  visibility: hidden;
}

/* googleマップ */
.noahacad-map {
  max-width: 1600px;
  aspect-ratio: 2 / 1;  
  position: relative;
  margin-left: auto;
  margin-right: auto;
  margin-block-end: 2rem !important;
}

.noahacad-map iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/**
 * Topページ
 */

/* スクール紹介カラム */
.noahacad-about-columns.noahacad-about-columns-reverse {
  flex-direction: row-reverse;
}