/* コンテンツ
   ============================================ */

.child-contents-area>section {
  margin-top: 50px;
}

/* 各部活共通
   ============================================ */

.club-list {
  margin-top: 10px;
}

.club-list.flex-box {
  align-items: flex-start;
}

/* コンポーネントの例外スタイル */
.club-list .club-btn {
  width: 30%;
  margin-top: 20px;
}

.club-list .club-btn>.c-btn.base {
  width: 100%;
}

.club-table li a {
  border-bottom: 1px solid #333;
}

.club-table li a:hover {
  border-bottom: none;
  opacity: 0.8;
}

/* 個人の活動実績
   ============================================ */

section .year {
  margin-top: 30px;
}

/* history
   ----------------------------------------- */
ul.history time {
  width: 80px;
}

ul.history time+p {
  width: calc(100% - 85px);
}

/* 各部活動ページ
   ============================================ */

/* 部活共通テーブル（レスポンシブの都合上tableタグは使用しない）
   ----------------------------------------- */

.club-table {
  margin-top: 30px;
}

.club-table.flex-box {
  align-items: flex-start;
}

.club-table .table-head {
  min-width: 20%;
  text-align: center;
  font-weight: bold;
  background: #f7f7f7;
}

.club-table .table-head.lg {
  padding: 52px 0;
  background: #fdc2b6;
}

.club-table .people {
  width: 80%;
}

.club-table .people .type {
  width: 100%;
  background: #ffdbd3;
  font-weight: bold;
}

.club-table .people ul[class] li {
  width: 25%;
  padding: 20px 0;
  text-align: center;
}

.club-table .about {
  display: flex;
  width: 100%;
  border-bottom: 1px solid #dedede;
}

.club-table .about:first-of-type {
  border-top: 1px solid #dedede;
}

.club-table .about li {
  padding: 20px;
}

/* 部活について
   ----------------------------------------- */

.detail-club .img-box-area.flex-box {
  align-items: flex-start;
}

.detail-club .img-box-area.flex-box::after {
  content: "";
  display: block;
  width: 31%;
}

.detail-club .topic-content-box {
  margin-top: 40px;
}

/* 部活動ページ下部のボタンエリア
   ----------------------------------------- */

.official-site-area {
  margin-top: 40px;
}

.official-site-area .c-btn.base .c-tag.pdf {
  color: #fff;
  border: 1px solid #fff;
}

/* ============================================
   タブレット
   ============================================ */

@media screen and (max-width: 1000px) {

  .club-list .club-btn {
    width: 46%;
  }

  .club-list .club-btn .c-btn.base {
    min-width: 45%;
  }

  /* 各部活動ページ
       ============================================ */

  /* 部活共通テーブル
       ----------------------------------------- */
  .club-table .table-head.lg {
    width: 100%;
    padding: 15px 10px;
    text-align: center;
  }

  .club-table .people ul[class] li {
    padding: 15px 10px;
  }

  .club-table .people {
    width: 100%;
  }

  .club-table .table-head {
    width: 30%;
    min-width: 30%;
  }

  .club-table .about li {
    padding: 15px 10px;
  }
}

/* ============================================
   スマートフォン
   ============================================ */

@media screen and (max-width: 560px) {

  /* history
   ----------------------------------------- */
  ul.history time {
    width: 50px;
  }

  ul.history time+p {
    width: calc(100% - 55px);
  }

  .club-list {
    justify-content: center;
  }

  .club-list .club-btn {
    width: 275px;
    margin-left: 0;
  }

  /* 部活共通テーブル
       ----------------------------------------- */
  .club-table .table-head.lg {
    padding: 10px;
  }

  .club-table .people ul[class] li {
    padding: 10px;
  }

  .club-table .about li {
    padding: 10px;
  }

}