@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}

/* 記事ページの「上部メタ情報（投稿日/更新日）」だけ非表示 */
.date-tags{
  display: none !important;
}

/* 投稿一覧のプレビュー数非表示 */
.entry-card .admin-pv {
	display: none;
}

/* h3デザイン */
.article h3{border-left:7px solid #c8c606}

/* サイト全体 */
/* ここから */


/* ユーザー名非表示 */
.footer-meta {
	display: none;
}

/*エントリー・アーカイブの見出し*/
.entry-title,
.archive-title {
  font-size: 2em;
  margin-top: 2em;
  margin-bottom: 20px;
  line-height: 1.3;
}

/* 固定ページタイトル帯 */
.page .entry-title {
  display: none;
}

.page-hero {
  position: relative;
  width: 100%;
  min-height: 220px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

.page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
}

.page-hero__inner {
  position: relative;
  z-index: 1;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.page-hero__title {
  margin: 0;
  color: #fff;
  font-size: 42px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.hero-futsu {
  background-image: url("http://inashin.xsimirai.com/wp-content/uploads/2026/03/title_1.png");
}

.hero-futsu-p2 {
  background-image: url("http://inashin.xsimirai.com/wp-content/uploads/2026/03/title_2.png");
}

@media (max-width: 768px) {
  .page-hero,
  .page-hero__inner {
    min-height: 150px;
  }

  .page-hero__title {
    font-size: 28px;
  }
}
.page-hero__title {
  text-shadow: 0 3px 10px rgba(0,0,0,0.4);
}

/* 本文余白 */
.entry-content p{
  margin-left:10px;
}
.entry-content h3,
.entry-content h4{
  margin:30px 20px 15px 10px;
}

/* ここまで */

/* フッター　ここから */
/* フッター問い合わせエリア */
.footer-contact-area {
  background-color: #c02b6f; /* ← 画像に近いピンク */
  color: #ffffff;
  width: 100%;
}

.footer-contact-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 30px 20px;
  text-align: left;
  line-height: 2;
}

.footer-contact-title {
  font-weight: bold;
  margin-bottom: 10px;
}

.footer-contact-item {
  margin-left: 1em;
}

/* モバイル対応 */
@media (max-width: 768px) {
  .footer-contact-inner {
    text-align: center;
  }
  .footer-contact-item {
    margin-left: 0;
  }
}

/* content-bottom 内の問い合わせエリアだけ全幅にする */
#content-bottom-in {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

/* 念押し：問い合わせエリアを画面幅いっぱいに */
.footer-contact-area {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background-color: #c02b6f;
  color: #fff;
}
/* content-bottom の上下余白と背景色を消す */
.content-bottom {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  background: transparent;
}
/* content-bottom の下を完全に詰める */
.content-bottom {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* footer 上の余白を消す（灰色帯の正体） */
#footer {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* footer の背景が灰色なら透明に */
.footer,
.footer-container {
  background: transparent;
}


/* フッター用 Google Map 全幅 */
.footer-map-area {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  line-height: 0; /* iframe下の謎余白対策 */
}

.footer-map-area iframe {
  width: 100%;
  height: 450px; /* 高さは好みで調整 */
  border: 0;
  display: block;
}
/* フッター　ここまで */


/* ヘッダー　ここから */
/* ヘッダーメニュー直下の余白を消す */
#header-container {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* メインコンテンツ上の余白を消す */
#content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
/* ヘッダー直下の最初の要素の余白を消す */
#content > *:first-child {
  margin-top: 0 !important;
}

.el-header-menu ul {
  display: flex;
  justify-content: flex-end;
  gap: 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.el-header-menu a {
  color: #1f2a44;
  text-decoration: none;
  font-size: 15px;
}

.el-header-menu a:hover {
  text-decoration: underline;
}

.main{
	padding:0 !important
}

/* ヘッダーメニューの文字サイズ・余白変更 */
/* 通常 */
#navi .navi-in a {
  font-size: 17px;
}

/* 広い画面だけ18px */
@media screen and (min-width: 1200px) {
  #navi .navi-in a {
    font-size: 18px;
  }
}

#navi .navi-in > ul > li > a {
  padding-left: 14px;
  padding-right: 14px;
}

/* ヘッダー　ここまで */



/* 記事一覧　ここから */
/* =========================================================
   全幅版：学校からのお知らせ / ブログ（安定版・全文）
   - セクションは全幅（区切り線も全幅）
   - 中身は「コンテンツ幅」で統一（左右の重心が安定）
   - new_list / 自作リスト両方で崩れにくい
   - ★お知らせのカテゴリ2行目（HTML側）をCSSで消して二重表示を防止
   ========================================================= */

/* -------------------------
   共通：全幅セクション＋コンテンツ幅グリッド
   ------------------------- */
.nb-school-notice,
.nb-blog{
  width: 100%;
  border-top: 1px solid #e6e6ee;
  padding: 30px 0;

  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 40px;
  align-items: start;

  max-width: 1100px;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

/* 左カラム */
.nb-school-notice .nb-left,
.nb-blog .nb-left{
  text-align: left;
}

.nb-school-notice .nb-title,
.nb-blog .nb-title{
  font-size: 24px;
  font-weight: 700;
  color: #1f2f6e;
  margin: 0 0 14px;
  letter-spacing: .02em;
  line-height: 1.3;
}

/* ボタン */
.nb-school-notice .nb-btn,
.nb-blog .nb-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 260px;
  padding: 12px 14px;
  background: #384a9a;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  border-radius: 2px;
}
.nb-school-notice .nb-btn:hover,
.nb-blog .nb-btn:hover{ opacity: .9; }

/* 右カラム */
.nb-school-notice .nb-right,
.nb-blog .nb-right{
  text-align: left;
}

/* 右の一覧ブロック */
.nb-school-notice .nb-newslist,
.nb-blog .nb-newslist{
  max-width: none;
  margin: 0;
}

/* new_list wrapper */
.nb-school-notice .new-entry-cards,
.nb-blog .new-entry-cards{
  margin: 0 !important;
  padding: 0 !important;
}

/* 行全体リンク */
.nb-school-notice a.new-entry-card-link,
.nb-blog a.new-entry-card-link{
  display: block !important;
  text-decoration: none !important;
  color: inherit !important;
  border-radius: 6px;
}

/* 各行カード */
.nb-school-notice .new-entry-card,
.nb-blog .new-entry-card{
  padding: 14px 0 !important;
  border-top: 1px solid #e6e6ee !important;
}
.nb-school-notice .new-entry-card:first-child,
.nb-blog .new-entry-card:first-child{
  border-top: none !important;
}

/* サムネ完全OFF（影響範囲はこのセクション内だけ） */
.nb-school-notice .new-entry-card-thumb,
.nb-school-notice .new-entry-card-thumb-wrap,
.nb-school-notice .new-entry-card-thumb img,
.nb-blog .new-entry-card-thumb,
.nb-blog .new-entry-card-thumb-wrap,
.nb-blog .new-entry-card-thumb img{
  display: none !important;
}

/* display-none解除（日付だけ） */
.nb-school-notice .new-entry-card-date.display-none,
.nb-blog .new-entry-card-date.display-none{
  display: block !important;
}

/* 念のため：日付は常に表示扱い（Cocoon側の強いdisplay:none対策） */
.nb-school-notice .new-entry-card-date,
.nb-blog .new-entry-card-date{
  display: block !important;
}

/* 時計アイコン非表示（幅ブレ防止） */
.nb-school-notice .fa-clock,
.nb-blog .fa-clock{
  display: none !important;
}

/* =========================================================
   ★ここが重要：お知らせの「HTML側カテゴリ表示（2行目）」を消す
   - show_category="1" のままでも二重表示にならない
   - Cocoon側のclass揺れ対策で複数候補をまとめて潰す
   ========================================================= */
.nb-school-notice .new-entry-card-category,
.nb-school-notice .new-entry-card-categories,
.nb-school-notice .post-categories,
.nb-school-notice .cat-label,
.nb-school-notice .category-label{
  display: none !important;
}

/* -------------------------
   3列を固定（絶対配置）※崩れにくい安定版
   ------------------------- */
.nb-school-notice .new-entry-card-content,
.nb-blog .new-entry-card-content{
  position: relative;
  padding-left: 220px;    /* 日付100 + gap10 + ラベル100 + gap10 */
  min-height: 2.0em;      /* ★ 1.7emだと環境によって詰まるので余裕を持たせる */
}

/* 日付（1列目） */
.nb-school-notice .new-entry-card-date,
.nb-blog .new-entry-card-date{
  position: absolute;
  left: 0;
  top: 0;
  width: 100px;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.4;
}

.nb-school-notice .entry-date,
.nb-blog .entry-date{
  display: inline-block;
  font-size: 13px !important;
  color: #777 !important;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  line-height: 1.4;
}

/* 学校：カテゴリラベル（2列目：CSS生成） */
.nb-school-notice .new-entry-card-content::before{
  content: "お知らせ";
  position: absolute;
  left: 110px;
  top: 0;
  width: 100px;
  box-sizing: border-box;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 700;
  color: #5a66a8;
  background: #f7f8fc;
  border: 1px solid #cfd3e6;
  border-radius: 2px;
  white-space: nowrap;
  text-align: center;
  line-height: 1.2;
}

/* ブログ：カテゴリ（2列目：実データ）
   ★崩れ防止：display:block / margin:0 を追加 */
.nb-blog .nb-cat-real{
  position: absolute;
  left: 110px;
  top: 0;
  width: 100px;
  box-sizing: border-box;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 700;
  color: #5a66a8;
  background: #f7f8fc;
  border: 1px solid #cfd3e6;
  border-radius: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;

  margin: 0 !important;
  display: block;
  line-height: 1.2;
}

/* タイトル（3列目）
   ★崩れ防止：block化 + padding強制0 */
.nb-school-notice .new-entry-card-title,
.nb-blog .new-entry-card-title{
  display: block;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
  color: #222 !important;
}

/* hover */
.nb-school-notice a.new-entry-card-link:hover,
.nb-blog a.new-entry-card-link:hover{
  background: rgba(56,74,154,.03);
}
.nb-school-notice a.new-entry-card-link:hover .new-entry-card-title,
.nb-blog a.new-entry-card-link:hover .new-entry-card-title{
  text-decoration: underline;
}

/* NEWバッジ */
.nb-school-notice .new-icon,
.nb-school-notice .new-entry,
.nb-school-notice .new,
.nb-blog .new-icon,
.nb-blog .new-entry,
.nb-blog .new{
  display: inline-block !important;
  margin-left: 8px;
  padding: 3px 7px;
  font-size: 10px;
  font-weight: 800;
  border-radius: 999px;
  background: #384a9a;
  color: #fff;
  vertical-align: middle;
}

.nb-school-notice .nb-sub{
  margin: 6px 0 12px;
  font-size: 13px;
  line-height: 1.4;
  color: rgba(31,42,68,.75); /* ネイビー系を薄く */
  letter-spacing: .04em;
}
@media (max-width: 767px){
  .nb-school-notice .nb-sub{
    font-size: 12px;
    margin: 4px 0 10px;
  }
}
.nb-school-notice .nb-sub{
  margin-bottom: 16px;
}



/* -------------------------
   スマホ
   ------------------------- */
@media (max-width: 900px){
  .nb-school-notice,
  .nb-blog{
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 24px 16px;
    max-width: none;
    margin: 0;
  }

  .nb-school-notice .nb-btn,
  .nb-blog .nb-btn{
    max-width: 100%;
  }

  /* 縦積み */
  .nb-school-notice .new-entry-card-content,
  .nb-blog .new-entry-card-content{
    padding-left: 0;
    min-height: 0;
  }

  .nb-school-notice .new-entry-card-date,
  .nb-blog .new-entry-card-date{
    position: static;
    width: auto;
    margin-bottom: 4px !important;
  }

  .nb-school-notice .new-entry-card-content::before{
    position: static;
    width: auto;
    display: inline-block;
    margin-right: 8px;
    text-align: left;
  }

  .nb-blog .nb-cat-real{
    position: static;
    width: auto;
    display: inline-block;
    margin-right: 8px;
    text-align: left;
  }

  .nb-school-notice .new-entry-card-title,
  .nb-blog .new-entry-card-title{
    display: inline;
  }
}
/* ★追加：お知らせ側は固定ラベル(::before)を使うので nb-cat-real を消す */
.nb-school-notice .nb-cat-real{
  display: none !important;
}

/* 記事一覧　ここまで */



/* 問い合わせフォーム */
/* ここから */

/* 必須の文字色 */
.required{
  color:#e1421f;
  font-weight:600;
}
/* フォームの幅 */
.wpcf7{
  max-width:700px;
  margin:40px auto;
}

.wpcf7 input,
.wpcf7 select,
.wpcf7 textarea{
  width:100%;
  box-sizing:border-box;
}

.wpcf7 input,
.wpcf7 select{
  height:44px;
}

/* ここまで */

/* PDF表示サイズ */
/* ここから */
.pdfemb-viewer,
.pdfemb-the-canvas{
  width: calc(100% - 32px) !important;
  max-width: 1280px !important;
  margin: 0 auto 0 !important;
  box-sizing: border-box;
}
/* ここまで */