/*
Theme Name: Lightning
Text Domain: lightning
Theme URI: https://lightning.vektor-inc.co.jp/en/
Description: Lightning is a very simple & easy to customize theme which is based on the Bootstrap. It is also very friendly with custom post types and custom taxonomies. When you add a new one, the breadcrumbs will be adjusted and posts will look beautifully without editing or adding a template files.
Author: Vektor,Inc.
Author URI: https://www.vektor-inc.co.jp
Version: 15.34.1
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 7.4
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

Lightning WordPress theme, Copyright (C) 2015-2026 Vektor,Inc.
Lightning WordPress theme is licensed under the GPL.

Lightning WordPress Theme bundles the following third-party resources:

Font Awesome icon font, Copyright 2012 Fonticons, Inc.
its fonts are licensed under the terms of the SIL OFL License 1.1, and its code is licensed under the terms of the MIT license
Source: https://fontawesome.com/

Bootstrap framework, Copyright 2011 Bootstrap Authors and Twitter, Inc.
Bootstrap is licensed under the terms of the MIT license
Source: https://getbootstrap.com/

CSS Simple Tree Shaking
CSS Simple Tree Shaking is licensed under the terms of the GNU General Public License v2 license
Source: https://celtislab.net/

/* ===== あなたのカスタム ===== */
/* =========================
   HEADER
========================= */
.header {
  background: rgba(0,0,0,0.7);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
}

.header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 40px;
}

/* ロゴ */
.logo img {
  height: 40px;
}

/* ナビ */
.nav {
  display: flex;
  gap: 30px;
  align-items: center;
}

.nav a {
  color: #fff;
  font-size: 13px;
  letter-spacing: 2px;
}

/* CONTACTボタン */
.nav a.contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 6px 24px;   /* ←高さを低く・横を長く */
  border: 1px solid #fff;

  font-size: 12px;
  letter-spacing: 2px;

  height: 32px;        /* ←高さ固定（細く） */
}
/* ハンバーガー */
.menu-btn {
  display: none;
  flex-direction: column;
  gap: 5px;
}

.menu-btn span {
  width: 25px;
  height: 2px;
  background: #fff;
}

.menu-btn {
  display: flex;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
}

.menu-btn span {
  display: block !important;
  width: 40px !important;
  height: 1px !important;
  background: #fff !important;
}
/* ===== ヘッダー補正（追加だけ） ===== */

.nav a {
  position: relative;
  display: inline-block;
}

/* 下線 */
.nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;

  width: 0;
  height: 1px;
  background: #fff;

  transition: 0.3s;
}

/* ホバーで伸びる */
.nav a:hover::after {
  width: 100%;
}

/* CONTACTは下線なし */
.nav a.contact::after {
  display: none;
}

/* CONTACTは色変化 */
..nav a.contact {
  background: rgba(255,255,255,0.15);
  border: 1px solid #fff;
  color: #fff;
  transition: 0.3s;
}

.nav a.contact:hover {
  background: #fff;
  color: #2b2b2b;
}
.nav {
  display: flex;
  align-items: center; /* ← これが超重要 */
}

.nav a {
  display: flex;
  align-items: center; /* ← 縦中央 */
}


/* =========================
   フッター全体
========================= */
.footer {
  background: #2b2b2b;
  color: #fff;
  padding: 100px 0 40px;
  position: relative;
}

/* 横幅 */
.footer-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
}

/* ナビ */
.footer-nav {
  display: flex;
  justify-content: center;
  gap: 80px;
  align-items: flex-start;
}

/* カラム */
.footer-col {
  width: auto;
}

/* 左（TOPとか） */
.footer-col:first-child p {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 3px;
  margin-bottom: 10px;
  color: #fff;
}

/* 見出し */
.footer-col h4 {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 3px;
  margin-bottom: 16px;
  border-bottom: 1px solid #aaa;
  display: inline-block;
  padding-bottom: 6px;
}

/* リンク */
.footer-col a {
  display: block;
  font-size: 14px;
  color: #ddd;
  margin-bottom: 6px;
  text-decoration: none;
}

/* ロゴ */
.footer-logo {
  position: absolute;
  top: 60px;
  right: 0;
  transform: translateX(-120px);
}

.footer-logo img {
  height: 50px;
}

/* SNS */
.footer-sns {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin: 40px 0 20px;
}

/* コピー */
.copyright {
  font-size: 10px;
  color: #aaa;
  text-align: center;
}

/* ===== メディア ===== */
.page-header .breadcrumb {
  position: relative;
  display: inline-block;
  padding: 0 20px;
}

.page-header .breadcrumb::before,
.page-header .breadcrumb::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 80px;
  height: 1px;
  background: #ddd;
}

.page-header .breadcrumb::before {
  left: -80px;
}

.page-header .breadcrumb::after {
  right: -80px;
}
.page-header .title {
  font-size: 56px;
  letter-spacing: 6px;
  margin-bottom: 20px;
}
.media-inner {
max-width: 1100px; 
  margin: 0 auto;

  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 40px;
}
.media-item img {
  aspect-ratio: 3 / 4;
  object-fit: cover;
  width: 100%;
  box-sizing: border-box;
  background: #fff;
  padding: 20px;
  border: 1px solid #eee;
  max-width: 260px; 
  margin: 0 auto;
  height: auto;
}
.media-inner {
  max-width: 980px;
  gap: 60px;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.page-header img {
  width: auto;
}
.media-list .media-inner {
  max-width: 1100px;
  margin: 0 auto;

  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 60px !important;

  justify-items: start !important; /* ←横揃え */
  align-items: start !important;   /* ←縦揃え */
}

/* カード */
.media-item {
  width: 100%;
  margin: 0 !important;
  text-align: left !important;
}

/* 画像 */
.media-item img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
  margin-bottom: 15px;

}

/* タイトル */
.media-title {
  font-size: 16px;
  margin-top: 10px;
}

/* テキスト */
.media-text {
  line-height: 1.7;
}.media-inner {
  align-items: start;
}
.media-list .media-item {
  margin: 0 !important;
  width: 100% !important;
}
.page-header {
  background: #ffffff !important;
  padding: 80px 0 60px !important;
}

.page-header-inner {
  max-width: 1100px;
  margin: 0;
}

/* 小タイトル */
.page-header .sub {
  font-size: 13px;
  color: #777777;
  margin-bottom: 8px;
  letter-spacing: 2px;
}

/* MEDIA */
.page-header .title {
  font-size: 50px;
  font-weight: 300;
  letter-spacing: 8px;
  color: #777777;
  padding: 100px 0 60px;
}

/* 説明文 */
.page-header .desc {
  text-align: center;
  font-size: 14px;
  color: #777777;
  letter-spacing: 1px;
}
.page-header .title {
  letter-spacing: 10px;
}
.breadcrumb {
  margin-top: 0;
  font-size: 12px;
  color: #777777;
  margin-bottom: 20px;
}

.breadcrumb a {
  color: #777777;
  text-decoration: none;
}

.breadcrumb span {
  margin: 0 5px;
}
.page-header .desc {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  margin: 40px auto 0 !important;
}
/* 線は消す */
.page-header .breadcrumb::before,
.page-header .breadcrumb::after {
  display: none !important;
  content: none !important;
}
.breadcrumb::before,
.breadcrumb::after {
  display: none !important;
  content: none !important;
}
.page-header-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.page-header .breadcrumb{
  border: none !important;
}/* 雑誌掲載 */
.page-header .sub {
  margin: 0 !important;
  line-height: 1 !important;
}

.page-header .title {
  margin: 0 !important;
  line-height: 1 !important;
}
.page-header .title {
  margin-top: -10px !important;
}