@charset "UTF-8";
/*
Theme Name: 株式会社タイコー オリジナルテーマ
Theme URI: https://kk-taikoh.jp/
Description: 株式会社タイコーのHTMLサイトをベースにしたオリジナルWordPressテーマです。Local × Cursorで開発中。
Version: 1.0.0
Author: 株式会社タイコー
Author URI: https://kk-taikoh.jp/
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: taiko-theme
*/

/* 今回のサイトはTailwind CSSをCDN経由で読み込んでいるため、
   ここには追加のカスタムCSSが必要になった場合のみ記述します。
*/

/* メインビジュアルスライドショー（Tailwind CDN 読み込み前でも安定動作させる） */
#hero-slider {
  --hero-slide-duration: 700ms;
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  width: 100%;
}

@media (min-width: 640px) {
  #hero-slider {
    aspect-ratio: 1440 / 500;
  }
}

#hero-slider .hero-slider__track {
  position: absolute;
  inset: 0;
  display: flex;
  width: 100%;
  height: 100%;
  -webkit-transition: -webkit-transform var(--hero-slide-duration) ease-in-out;
  transition: transform var(--hero-slide-duration) ease-in-out;
  will-change: transform;
}

#hero-slider .hero-slider__slide {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  min-width: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#hero-slider .hero-slider__dot {
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 9999px;
  background-color: rgb(255 255 255 / 0.35);
  transition: background-color 0.3s;
}

#hero-slider .hero-slider__dot:hover {
  background-color: rgb(255 255 255 / 0.55);
}

#hero-slider .hero-slider__dot[aria-selected="true"] {
  background-color: rgb(255 255 255 / 0.75);
}

#hero-slider.is-initializing .hero-slider__track {
  transition: none;
}