/*
Theme Name: 京産大起業部
Author: 東田蒼人
Description: 京都産業大学 起業部 公式サイト用テーマ。Claude Design のデザインをそのまま WordPress 化したもの。
Version: 5.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: kigyobu
*/

html{scroll-behavior:smooth}
body{margin:0;background:#F6F5F1;color:#1A1B1E;font-family:'Zen Kaku Gothic New',sans-serif;-webkit-font-smoothing:antialiased;font-feature-settings:"palt"}
a{color:#1A1B1E;text-decoration:none;transition:color .3s cubic-bezier(.16,1,.3,1)}
a:hover{color:#14489F}
a:focus-visible,button:focus-visible{outline:1.5px solid #14489F;outline-offset:3px}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}
::selection{background:#14489F;color:#fff}
img{user-select:none;-webkit-user-drag:none}
@keyframes omRise{from{transform:translateY(112%)}to{transform:none}}
@keyframes omMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes omFadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media (max-width:820px){[data-col2]{grid-template-columns:minmax(0,1fr) !important}[data-card]{grid-column:span 12 !important}}

/* hover states */
.hv1:hover{color:#14489F}
.hv2:hover{background:#14489F;color:#fff}
.hv3:hover{color:#fff}
.hv4:hover{animation-play-state:paused}
.hv5:hover{background:#fff;color:#1A1B1E}


/* ------------------------------------------------------------------
   お知らせ一覧・詳細・固定ページ（トップにはないパーツ）
   ---------------------------------------------------------------- */
.kgb-page{max-width:900px;margin:0 auto;padding:clamp(64px,9vw,112px) clamp(20px,4vw,40px) clamp(80px,10vw,128px)}
.kgb-page__eyebrow{font-family:'Schibsted Grotesk',sans-serif;font-size:12px;font-weight:500;letter-spacing:.2em;color:#14489F}
.kgb-page__title{margin:14px 0 0;font-weight:300;font-size:clamp(28px,3.6vw,46px);line-height:1.5;letter-spacing:.04em}
.kgb-page__meta{display:flex;align-items:baseline;gap:16px;margin-top:18px;font-size:12.5px;color:#8C897D;font-family:'Schibsted Grotesk',sans-serif;letter-spacing:.08em}
.kgb-page__cat{color:#14489F;font-family:'Zen Kaku Gothic New',sans-serif;font-size:11px;letter-spacing:.1em}
.kgb-page__body{margin-top:clamp(32px,5vw,48px);font-size:15.5px;line-height:2.15;color:#3A3931}
.kgb-page__body h2{font-weight:400;font-size:22px;line-height:1.7;letter-spacing:.04em;margin:2.2em 0 .8em}
.kgb-page__body h3{font-weight:500;font-size:17px;line-height:1.7;letter-spacing:.04em;margin:2em 0 .6em}
.kgb-page__body img{max-width:100%;height:auto;border-radius:2px}
.kgb-page__body a{color:#14489F;text-decoration:underline;text-underline-offset:3px}
.kgb-list{display:flex;flex-direction:column;border-top:1px solid #E3E0D6;margin-top:clamp(32px,5vw,48px)}
.kgb-list__item{display:flex;align-items:baseline;gap:22px;padding:22px 6px;border-bottom:1px solid #E3E0D6;transition:background .3s cubic-bezier(.16,1,.3,1)}
.kgb-list__item:hover{background:#FFFDF8}
.kgb-list__date{font-family:'Schibsted Grotesk',sans-serif;font-size:12.5px;letter-spacing:.08em;flex:none;width:84px;color:#8C897D}
.kgb-list__cat{flex:none;font-size:11px;letter-spacing:.1em;color:#14489F;width:58px}
.kgb-list__title{font-size:14.5px;line-height:1.85}
.kgb-back{display:inline-flex;align-items:center;gap:10px;margin-top:clamp(40px,6vw,64px);font-size:13px;letter-spacing:.06em;color:#55534A}
.kgb-back:hover{color:#14489F}
.kgb-pagination{margin-top:40px;display:flex;gap:10px;font-size:13px}
.kgb-pagination .page-numbers{padding:8px 14px;border:1px solid #E3E0D6;border-radius:2px}
.kgb-pagination .current{background:#14489F;color:#fff;border-color:#14489F}

@media (max-width:860px){
  [data-col2]{grid-template-columns:minmax(0,1fr) !important}
}

/* ------------------------------------------------------------------
   ヘッダーのロゴ
   img は inline 既定だとベースライン分の余白が下に出るため block にする。
   高さだけ指定し、幅は元画像の比率（600x287）に任せる。
   ---------------------------------------------------------------- */
.kgb-logo{display:block;flex:none;line-height:0}
.kgb-logo picture{display:block;line-height:0}
.kgb-logo img{
  display:block;
  height:40px;
  width:auto;
  transition:height .35s cubic-bezier(.16,1,.3,1);
}

/* ------------------------------------------------------------------
   メンバーカルーセル
   触っていないときは自動で流れ、触ると止まって指・マウスで動かせる。
   実際の動きは assets/main.js が担当する。
   .is-live は JS が付けるので、JSが動かない環境では
   従来どおり CSS アニメーションの帯（overflow:hidden）のまま。
   ---------------------------------------------------------------- */
.kgb-mcarousel.is-live{
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -ms-overflow-style:none;
  cursor:grab;
}
.kgb-mcarousel.is-live::-webkit-scrollbar{display:none}
.kgb-mcarousel.is-dragging{cursor:grabbing}
.kgb-mcarousel.is-dragging .kgb-mtrack{user-select:none;-webkit-user-select:none}
.kgb-mtrack > div{flex-shrink:0}

/* ------------------------------------------------------------------
   スマートフォン最適化
   PC表示は変更しない。実際の指定はすべて @media (max-width:768px) 内。
   （.sp-only の初期値だけは、PCで改行を出さないための土台として外に置く）
   ---------------------------------------------------------------- */

.sp-only{display:none}

@media (max-width:768px){

  .sp-only{display:inline}

  /* --- ヘッダー ---------------------------------------------------
     375px ではナビ6項目が3段に折り返し、固定ヘッダーが139pxになる。
     「入部について」を1段目の右に出し、残り5項目を2段目にまとめる。 */
  header > div{
    position:relative;
    flex-wrap:wrap !important;
    row-gap:9px !important;
    column-gap:12px !important;
    padding:11px 16px !important;
  }
  header > div > a:first-child{
    display:inline-flex;
    align-items:center;
    min-height:34px;
  }
  header nav{
    order:2;
    flex:0 0 100% !important;
    margin-left:0 !important;
    flex-wrap:nowrap !important;
    gap:14px !important;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  header nav::-webkit-scrollbar{display:none}
  header nav > a{flex:0 0 auto}
  header nav > a:last-child{
    position:absolute;
    top:11px;
    right:16px;
    padding:9px 17px !important;
    font-size:11.5px !important;
  }

  /* --- 改行位置 ---------------------------------------------------
     本文中の <wbr>（文節境界）だけで折り返す。
     keep-all で語中の分断を禁止し、<wbr> と句読点のみを改行位置にする。
     これは iOS Safari を含む全ブラウザで動く。
     overflow-wrap は break-word を使う。anywhere は min-content 幅まで
     変えてしまい、flex 内の短い英単語（MONTHLY 等）が1文字ずつ折れる。 */
  .kgb-logo img{height:32px}

  /* --- メンバーカルーセル：スマホ幅では左右に余白を入れる ----------
     端でカードが画面にくっつかないようにする。PCは従来どおり全幅。 */
  .kgb-mcarousel{
    padding-left:20px;
    padding-right:20px;
  }

  body{
    word-break:keep-all;
    overflow-wrap:break-word;
  }
  h1,h2,h3,p{
    text-wrap:pretty;
  }
}