@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){
  /*必要ならばここにコードを書く*/
}


/* ─── 「お知らせ」見出し ───────────────────────────── */
.notice-section {
  text-align: center;
  margin-bottom: 1.5em;
}
.notice-title {
  display: inline-block;
  position: relative;
  font-size: 1.4em;
  font-weight: bold;
  color: #052b49;
  padding: 0 1em;
}
/* 左右のライン */
.notice-title::before,
.notice-title::after {
  content: '';
  position: absolute;
  top: 50%;
  width: 80px;
  height: 1px;
  background: #ccc;
}
.notice-title::before {
  left: -90px;
}
.notice-title::after {
  right: -90px;
}

/* ─── アコーディオン全体 ───────────────────────────── */
.my-accordion {
  margin: 0 auto;
  max-width: 600px;
}

/* ─── ヘッダー部分 ───────────────────────────────────── */
.accordion-header {
  /* ヘッダー全体をブロック＋中央揃え */
  position: relative;
  display: block;
  text-align: center;
  cursor: pointer;
  padding: 0.75em 1em;
  border-bottom: 1px dashed #ddd;
  background-color: #fff;    /* ヘッダー背景を白に */
}
.accordion-header .accordion-date {
  /* 左側に固定 */
  position: absolute;
  left: 1em;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.9em;
  color: #666;
}
.accordion-header .accordion-title {
  /* 真ん中に表示されるテキスト */
  display: inline-block;
}
.accordion-header .accordion-icon {
  /* 右側に固定 */
  position: absolute;
  right: 1em;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.2em;
  transition: transform 0.2s;
}
.accordion-header.active .accordion-icon {
  /* 開いたら回転 */
  transform: translateY(-50%) rotate(45deg);
}

/* ─── コンテンツ部分 ─────────────────────────────────── */
.accordion-content {
  padding: 1em;
  background-color: #fff;
  /* 下の破線はヘッダーのボーダーと重ならないよう余裕を */
  border-bottom: 1px dashed #ddd;
}

/* ─── 「お知らせ一覧へ」ボタン ───────────────────── */
.notice-button {
  text-align: center;
  margin-top: 2em;
}
.notice-button .btn-more {
  display: inline-block;
  padding: 0.75em 1.5em;
  background-color: #052b49;
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
  font-weight: bold;
}
.notice-button .btn-more:hover {
  background-color: #041e33;
}

/* 「開催概要」見出しの上に余白を追加 */
.announcement-heading {
    margin-top: 4rem; /* ↑ お好みの値に変更してください */
}

/* ─── 開催概要セクション全体 ───────────────────────── */
.announcement {
  margin: 3em auto;
  max-width: 900px;
}
.announcement-content {
  display: flex;
  flex-wrap: wrap;
  gap: 2em;
}

/* ── 左カラム：開催日 ─────────────────────────────── */
.announce-left {
  flex: 0 0 200px;
}
.announce-date-block {
  border-left: 4px solid #052b49;
  padding-left: 1em;
  text-align: center;
}
.announce-year {
  display: block;
  font-size: 1em;
  color: #666;
}
.announce-day {
  display: block;
  font-size: 3em;
  line-height: 1;
  margin: 0.1em 0;
}
.announce-weekday {
  display: block;
  font-size: 0.9em;
  color: #666;
  margin-bottom: 0.5em;
}
.announce-arrow {
  display: block;
  font-size: 1.2em;
  color: #052b49;
  margin-bottom: 0.5em;
}

/* ── 右カラム：スケジュール ───────────────────────── */
.announce-right {
  flex: 1;
}
.announce-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.announce-list li {
  display: flex;
  align-items: flex-start;
  border-bottom: 1px dashed #ddd;
  padding: 0.75em 0;
}
.announce-list li:nth-child(odd) {
  background-color: #e6f7ff;
}
.announce-list li:last-child {
  border-bottom: none;
}
.announce-list .date {
  flex: 0 0 140px;
  font-weight: bold;
  line-height: 1.4;
}
.announce-list .date del {
  color: #999;
}
.announce-list .extended {
  font-weight: normal;
  color: #d3201e;
}
.announce-list .text {
  flex: 1;
  margin-left: 1em;
  line-height: 1.4;
}

/* ── 見出し（開催概要）のスタイル再利用 ────────── */
.notice-section {
  text-align: center;
  margin-bottom: 1.5em;
}
.notice-title {
  display: inline-block;
  position: relative;
  font-size: 1.4em;
  font-weight: bold;
  color: #052b49;
  padding: 0 1em;
}
.notice-title::before,
.notice-title::after {
  content: '';
  position: absolute;
  top: 50%;
  width: 80px;
  height: 1px;
  background: #ccc;
}
.notice-title::before { left: -90px; }
.notice-title::after  { right: -90px; }

/* 開催概要以下 */
.overview-section .container {
  max-width: 900px;
  margin: 0 auto;
  padding: 2em 1em;
  background-color: #fff;
}

/* セクション見出し */
.section-header {
  text-align: center;
  margin-bottom: 1.5em;
}
.section-header h2 {
  display: inline-block;
  position: relative;
  font-size: 1.6em;
  font-weight: bold;
  color: #052b49;
  padding: 0 1em;
}
.section-header h2::before,
.section-header h2::after {
  content: '';
  position: absolute;
  top: 50%;
  width: 60px;
  height: 1px;
  background: #ccc;
}
.section-header h2::before { left: -70px; }
.section-header h2::after  { right: -70px; }

/* ─── カード、発表内容を包む親コンテナ ────────────────────── */
.event-overview-wrapper {
  max-width: 900px;       /* お好みで「720px」→「80%」などに */
  margin: 0 auto;         /* 中央寄せ */
  padding: 2em 1em;       /* 横余白＋上下余白 */
}

/* 各パート間の余白調整 */
.event-overview-wrapper > .announcement {
  margin-bottom: 3em;
}
.event-overview-wrapper > .info-section {
  margin-bottom: 3em;
}
.event-overview-wrapper > .presentation-fields {
  margin-bottom: 3em;
}


/* ─── info-section 全体 ───────────────────────────────── */
.info-section {
  max-width: 720px;       /* 親コンテナの幅に合わせる */
  margin: 0 auto 3em;
  padding: 0 1em;
}

/* ─── ３列グリッドレイアウト ───────────────────────── */
.info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.5em 2em;
}

/* ─── 各カード共通 ───────────────────────────────── */
.info-item {
  background-color: #fafafa;
  border-radius: 8px;
  padding: 1.2em;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}
.item-icon {
  font-size: 2em;
  color: #052b49;
  margin-bottom: 0.5em;
}
.item-title {
  font-size: 1.1em;
  font-weight: bold;
  margin-bottom: 0.5em;
  color: #052b49;
}
.item-text {
  font-size: 0.95em;
  line-height: 1.4;
  color: #333;
}

/* ─── 費用リスト ───────────────────────────────────── */
.fee-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.fee-list li {
  font-size: 0.95em;
  margin-bottom: 0.5em;
  line-height: 1.4;
}
.fee-list li small {
  font-size: 0.8em;
  color: #666;
}

/* ─── レスポンシブ調整（必要に応じて） ───────────────── */
@media screen and (max-width: 480px) {
  .info-grid {
    grid-template-columns: 1fr;
  }
}

/* 発表分野 */
.presentation-section .section-header {
  margin-top: 0; /* カード群の下マージンは overview-grid 側 */
  margin-bottom: 1em;
}
.fields-list {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.5em 1em;
  padding: 0;
  margin: 0;
}
.fields-list li {
  position: relative;
  padding-left: 1.2em;
  font-size: 0.95rem;
  line-height: 1.6;
}
.fields-list li::before {
  content: '•';
  position: absolute;
  left: 0;
  color: #052b49;
  font-size: 1em;
  line-height: 1.6;
}

/* レスポンシブ調整 */
@media screen and (max-width: 480px) {
  .overview-grid {
    grid-template-columns: 1fr;
  }
  .fields-list {
    grid-template-columns: 1fr 1fr;
  }
}

/* ─── 固定ページ本文エリアを最大幅720pxに ───────────────── */
.page #body-in,
.page #main,
.page .entry-content {
  max-width: 900px;
  margin: 0 auto;
  padding-left: 1em;   /* 必要に応じて左右の余白 */
  padding-right: 1em;
  box-sizing: border-box;
}

/* ─── 固定ページヘッダー下の帯画像（タイトルとか書く） ────────────────────────────── */
.page-header-band {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  height: 150px;
  overflow: hidden;
  z-index: 1;
}
.page-header-band__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 固定ページのタイトルを非表示に */
.page .entry-header {
  display: none !important;
}





/* ── 全体グリッド ───────────────────────── */
.research-schedule {
  max-width: 800px;       /* 全体の最大幅（お好みで） */
  margin: 0 auto 3em;
  padding: 0 1em;
}
.rs-heading {
  text-align: center;
  font-size: 1.6em;
  font-weight: bold;
  color: #052b49;
  margin-bottom: 1em;
  position: relative;
}
.rs-heading::before,
.rs-heading::after {
  content: '';
  position: absolute;
  top: 50%;
  width: 60px;
  height: 1px;
  background: #ccc;
}
.rs-heading::before { left: -80px; }
.rs-heading::after  { right: -80px; }

.rs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px,1fr));
  gap: 2em;
}

/* ── 日付見出し ────────────────────────── */
.rs-day {}

.rs-date {
  font-size: 2em;
  font-weight: bold;
  color: #000;
  border-bottom: 3px solid #f2b01e;
  display: inline-block;
  margin-bottom: 1em;
}
.rs-date span {
  font-size: 0.9em;
  margin-left: 0.5em;
}

/* ── タイムライン ────────────────────────── */
.rs-timeline {
  position: relative;
  padding-left: 3.1em;
}
.rs-timeline::before {
  content: '';
  position: absolute;
  left: 4.5em;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #b0dee6;
}

/* ── 各イベント ────────────────────────── */
.rs-item {
  position: relative;
  margin-bottom: 1em;
}
.rs-item:last-child {
  margin-bottom: 0;
}
.rs-item::before {
  content: '';
  position: absolute;
  left: 1.5em;
  top: 0.3em;
  transform: translateX(-50%);
  width: 0.8em;
  height: 0.8em;
  border-radius: 50%;
  background: #b0dee6;
}
.rs-time {
  position: absolute;
  left: -2em;
  top: 0;
  font-weight: bold;
  width: 3em;
  text-align: reft;
}
.rs-card {
  background: #e0f3fc;
  padding: 0.8em 1em;
  border-radius: 4px;
  margin-left: 2.5em;
  line-height: 1.4;
}

/* ─── 講演詳細テーブル ───────────────────────── */
.lecture-detail {
  max-width: 720px;
  margin: 0 auto 2em;
  padding: 0 1em;
  color: #333;
}

/* 各行をフレックスで左ラベル＋右コンテンツ */
.lecture-detail .ld-row {
  display: flex;
  align-items: flex-start;
  padding: 1em 0;
}

/* ラベル部分 */
.lecture-detail .ld-label {
  flex: 0 0 80px;       /* 固定幅 */
  font-weight: bold;
  margin-right: 1em;
}

/* コンテンツ部分 */
.lecture-detail .ld-content {
  flex: 1;
}

/* ─ 講演者 名前 ─ */
.lecture-detail .ld-name {
  margin: 0;
  font-size: 1.2em;
  font-weight: bold;
  color: #052b49;
}
.lecture-detail .ld-furigana {
  font-size: 0.9em;
  font-weight: normal;
  color: #666;
  margin-left: 0.5em;
}
.lecture-detail .ld-position {
  margin: 0.5em 0 0;
  font-size: 0.95em;
  line-height: 1.4;
}

/* ─ 日時 ─ */
.lecture-detail .ld-date {
  margin: 0;
  font-size: 1em;
}
.lecture-detail .ld-date small {
  font-size: 0.9em;
  color: #666;
  margin-left: 0.3em;
}
.lecture-detail .ld-time {
  margin: 0.3em 0 0;
  font-size: 1.4em;
  font-weight: bold;
}

/* ─ 講演題目 ─ */
.lecture-detail .ld-title {
  margin: 0;
  font-size: 1.05em;
  font-weight: bold;
  color: #052b49;
}

/* ─ 行の区切り（破線） ─ */
.lecture-detail .ld-sep {
  border-bottom: 1px dashed #ccc;
  margin: 0;
}
/* ─ 技術交流会 名前 ─ */
.lecture-detail .ld-name-g {
  margin: 0;
  font-size: 1.5em;
  font-weight: bold;
}