/*
Theme Name: theme-2025
Version: 1.0.0
*/

/* グローバル見出しスタイル */
body {
  background-color: #fafafa;
  font-family: 'Noto Sans JP', sans-serif;
}

h2, .wp-block-heading h2 {
  font-size: clamp(22px, 2.4vw, 28px);
  font-weight: medium;
  color: #000041;
  margin-bottom: 1em;
}
  
h3, .wp-block-heading h3 {
  font-size: clamp(18px, 2vw, 20px);
  font-weight: medium;
  color: #333;
  margin-bottom: 1.25em;
}

h4, .wp-block-heading h4 {
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: bold;
  color: #333;
  margin-top: 3em;
  margin-bottom: 0.25em;
}
  
p, .wp-block-paragraph {
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: regular;
  line-height: 1.8;
  color: #333;
  margin-bottom: 1.75em;
  text-align: justify;
}

.wp-block-preformatted {
  font-family: 'Figtree', sans-serif;
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: normal;
  line-height: 1.8;
  color: #5ba2d9;
  margin-bottom: 1.75em;
}


/*--------------------------------
Gutenberg ボタン用カスタムスタイル
--------------------------------*/
/* Gutenberg ボタン用カスタムスタイル .is-style-icon-btn */
.is-style-icon-btn .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  padding: 0 !important;
  background: transparent !important;
  text-decoration: none;
  font-family: 'Figtree', sans-serif;
  font-size: 13px;
  color: #333333;
  position: relative;
  overflow: hidden;
}

/* 下線アニメーション */
.is-style-icon-btn .wp-block-button__link::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 1em; /* フォントサイズに応じた位置調整 */
  height: 1px;
  width: 0;
  background-color: #333333;
  transition: width 0.3s ease;
  transform: scaleY(1); /* 端のギザギザを防ぐ */
  transform-origin: left center;
  will-change: width;
}

.is-style-icon-btn .wp-block-button__link:hover::before {
  width: 55%;
}

/* 左の矢印部分 */
.is-style-icon-btn .wp-block-button__link::after {
  content: "→";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: #333333;
  color: #ffffff;
  border-radius: 1.5rem;
  font-size: 18px;
  margin-left: 0.5em;
  transition: transform 0.3s ease;
}

/* ホバー時に縮小 */
.is-style-icon-btn .wp-block-button__link:hover::after {
  transform: scale(0.75);
}

.is-style-icon-btn .wp-block-button__link {
  position: relative;
  display: inline-block;
  line-height: 1.2;
  padding-bottom: 2px; /* 下線との間隔 */
}

/*--------------------------------
ブロックエディタの横並び・グループ化スタイル
--------------------------------*/
/* ブロックエディタコンテンツの基本スタイル */
.wp-block-content {
  max-width: 100%;
}

/* コンテンツ内のリンクスタイル */
.wp-block-content a,
.wp-block-paragraph a,
.wp-block-heading a,
.entry-content a {
  color: #5ba2d9; /* リンクの色を指定 */
  text-decoration: underline;
  transition: color 0.3s ease;
}

.wp-block-content a:hover,
.wp-block-paragraph a:hover,
.wp-block-heading a:hover,
.entry-content a:hover {
  color: #007CD9; /* ホバー時の色 */
  text-decoration: underline;
}

/* グループブロックのスタイル（横並びレイアウト） */
.wp-block-group {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 4rem;
  width: 100%;
  flex: 1;
  gap: 0;
  min-width: 0;
}

.wp-block-group h2, .wp-block-group h3, .wp-block-group h4 {
  margin-bottom: 1em;
}
.wp-block-group p {
  margin-bottom: 0;
}

/* 2カラムの自動比率設定（左30%、右70%） */
.wp-block-group .wp-block-group:nth-child(1) {
  flex: 0 0 30%;
}

.wp-block-group .wp-block-group:nth-child(2) {
  flex: 0 0 70%;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
  .wp-block-group {
    flex-direction: column;
    gap: 1rem;
  }
  
  .wp-block-group .wp-block-group:nth-child(1),
  .wp-block-group .wp-block-group:nth-child(2) {
    flex: 1;
    width: 100%;
  }
}


.wp-block-group__inner-container {
  border-radius: 8px;
}

/* カバーブロックのスタイル */
.wp-block-cover {
  margin-bottom: 2rem;
  border-radius: 8px;
  overflow: hidden;
}

/* ギャラリーブロックのスタイル */
.wp-block-gallery {
  margin-bottom: 2rem;
}

.wp-block-gallery .wp-block-image {
  margin-bottom: 1rem;
}

/* ボタンブロックのスタイル */
.wp-block-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 2rem;
}

.wp-block-button {
  margin: 0;
}

/* リストブロックのスタイル */
.wp-block-list {
  margin-bottom: 2rem;
}

.wp-block-list ul,
.wp-block-list ol {
  list-style: revert;
  padding-left: 1.5em;
}

.wp-block-list ul {
  list-style-type: disc;
}

.wp-block-list ol {
  list-style-type: decimal;
}

.wp-block-list li {
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: regular;
  line-height: 1.8;
  color: #333;
  margin-bottom: 0.5rem;
}

/* ブロックエディタコンテンツ内のリストも対象 */
.wp-block-content ul,
.wp-block-content ol {
  list-style: revert;
  padding-left: 1.5em;
  margin-bottom: 1.75em;
}

.wp-block-content ul {
  list-style-type: disc;
}

.wp-block-content ol {
  list-style-type: decimal;
}

.wp-block-content li,
.wp-block-content ul li,
.wp-block-content ol li {
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: regular;
  line-height: 1.8;
  color: #333;
  margin-bottom: 0.5rem;
}

/* 引用ブロックのスタイル */
.wp-block-quote {
  border-left: 4px solid #333;
  padding-left: 1.5rem;
  margin: 2rem 0;
  font-style: italic;
}

/* テーブルブロックのスタイル */
.wp-block-table {
  margin-bottom: 2rem;
  overflow-x: auto;
}

.wp-block-table table {
  width: 100%;
  border-collapse: collapse;
}

.wp-block-table th,
.wp-block-table td {
  padding: 0.75rem;
  border: 1px solid #ddd;
  text-align: left;
}

.wp-block-table th {
  background-color: #f5f5f5;
  font-weight: bold;
}

/* スマートフォン（768px以下） */
@media (max-width: 768px) {
  h2, .wp-block-heading h2 {
    font-size: 22px;
  }
  
  h3, .wp-block-heading h3 {
    font-size: 18px;
  }
  
  /* 会社概要ページのh2とh3のサイズ調整 */
  section h2.text-fluid-xl,
  .text-fluid-xl {
    font-size: 22px !important;
  }
  
  section h3.text-fluid-lg,
  .text-fluid-lg {
    font-size: 18px !important;
  }
  
  /* text-xlクラスが適用されているh3を調整 */
  section h3.text-xl,
  h3.text-xl {
    font-size: 18px !important;
  }
  
  /* lg:text-2xl text-xl のようなレスポンシブクラスが使われている場合 */
  section h3.lg\:text-2xl.text-xl {
    font-size: 18px !important;
  }
  
  .wp-block-columns {
    flex-direction: column;
    gap: 1rem;
  }
  
  .wp-block-column {
    flex: none;
    width: 100%;
  }
  
  .wp-block-buttons {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* カスタム比率クラス */
/* タイトル:コンテンツ = 1:2 の比率 */
.wp-block-columns.ratio-1-2 .wp-block-column:nth-child(1) {
  flex: 0 0 33.333%;
}
.wp-block-columns.ratio-1-2 .wp-block-column:nth-child(2) {
  flex: 0 0 66.667%;
}

/* タイトル:コンテンツ = 1:3 の比率 */
.wp-block-columns.ratio-1-3 .wp-block-column:nth-child(1) {
  flex: 0 0 25%;
}
.wp-block-columns.ratio-1-3 .wp-block-column:nth-child(2) {
  flex: 0 0 75%;
}

/* タイトル:コンテンツ = 2:3 の比率 */
.wp-block-columns.ratio-2-3 .wp-block-column:nth-child(1) {
  flex: 0 0 40%;
}
.wp-block-columns.ratio-2-3 .wp-block-column:nth-child(2) {
  flex: 0 0 60%;
}

/* レスポンシブ対応のカスタム比率 */
@media (max-width: 1023px) {
  .wp-block-columns.ratio-1-2 .wp-block-column:nth-child(1) {
    flex: 0 0 40%;
  }
  .wp-block-columns.ratio-1-2 .wp-block-column:nth-child(2) {
    flex: 0 0 60%;
  }
  
  .wp-block-columns.ratio-1-3 .wp-block-column:nth-child(1) {
    flex: 0 0 30%;
  }
  .wp-block-columns.ratio-1-3 .wp-block-column:nth-child(2) {
    flex: 0 0 70%;
  }
  
  .wp-block-columns.ratio-2-3 .wp-block-column:nth-child(1) {
    flex: 0 0 45%;
  }
  .wp-block-columns.ratio-2-3 .wp-block-column:nth-child(2) {
    flex: 0 0 55%;
  }
}

/* ----------------------------
   共通フェードインアニメーション
-----------------------------*/
.js-fadein {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(.39,.575,.565,1), transform 0.8s cubic-bezier(.39,.575,.565,1);
}
.is-fadein {
  opacity: 1 !important;
  transform: translateY(0) !important;
}