@charset "UTF-8";
/* CSS Document */

/* ========================================
   共通: ベースカラー（トップ・未指定ページ用）
======================================== */
body:not([data-faculty]),
body[data-faculty=""] {
  --main-color: #004080;   /* 深い青：共通トーン */
  --accent-color: #b8cbe6; /* 淡い青アクセント */
  background-color: #fff;
  color: #222;
}

/* ========================================
   システム理工学部 (Fc_sci)
   ※ メイン：淡青、アクセント：濃青に変更
======================================== */
body[data-faculty="fc_sci"] {
  --main-color: #a00050;   /* メインを濃い赤に */
  --accent-color: #f2c3d8; /* アクセントを淡いピンクに */
}

/* ========================================
   環境都市工学部 (Fc_env)
======================================== */
body[data-faculty="fc_env"] {
  --main-color: #008040;
  --accent-color: #b6e6c2;
}

/* ========================================
   化学生命工学部 (Fc_che)
   ※ メイン：濃赤、アクセント：淡赤に変更
======================================== */
body[data-faculty="fc_che"] {
--main-color: #0033cc;   /* メインを淡い青にaabbee */
  --accent-color: #aabbee; /* アクセントを濃い青に 0033cc*/
}

/* ========================================
   大学院 (grad)
======================================== */
body[data-faculty="grad"] {
  --main-color: #8b7500 !important;
  --accent-color: #8b7500 !important;
}

/* ========================================
   各部共通で使える色指定
   ※ ボタン、リンク、ナビなどに変数を活用
======================================== */

/* メイン背景・アクセント */
.header,
.footer {
  background-color: var(--main-color);
  color: #fff;
}

a,
button,
.nav a:hover {
  color: var(--main-color);
}

/* ボタン例 */
.btn-primary {
  background-color: var(--main-color);
  border-color: var(--main-color);
  color: #fff;
}
.btn-primary:hover {
  background-color: var(--accent-color);
  border-color: var(--accent-color);
  color: #fff;
}

/* 強調見出しなど */
h1, h2, h3 {
  color: var(--main-color);
}

.mark {
  background-color: var(--accent-color);
  color: #fff;
  padding: 0.2em 0.4em;
  border-radius: 0.2em;
}

/* ページごとのアクセント帯 */
.page-header {
  border-left: 6px solid var(--accent-color);
  padding-left: 1em;
}

/* ----------------------------------------
   例: グローバルナビのhover強調
---------------------------------------- */
.gnavi__list a:hover,
.gnavi__list a.active {
  color: var(--accent-color);
  /*border-bottom: 2px solid var(--accent-color);*/
}




/* ヒーローセクション */
body.page .hero-visual {
  position: relative;
  width: 100vw !important;max-width:1920px !important;
  min-height: 400px;
  /*background: linear-gradient(135deg, var(--main-color) 0%, var(--accent-color) 100%);*/background:#000;
  color: #fff;
  /*margin-top: 100px;*/
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

body.page .hero-content {
  /*position: relative;*/
  z-index: 2;
  /*max-width: 1920px;*/width:100%;height:100%;
  /*padding: 60px 40px;*/
  /*text-align: center;*/
}

body.page .hero-title {
  /*font-size: 7.68rem;*/font-size:4.0rem;margin-left:20px;color:#fff;
  margin-bottom: 20px;
	font-weight: 600;
/*text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
              -1px 1px 0 #FFF, 1px -1px 0 #FFF,
              0px 1px 0 #FFF,  0-1px 0 #FFF,
              -1px 0 0 #FFF, 1px 0 0 #FFF;*/
}

body.page .hero-subtitle {
  /*font-size: 3.84rem;*/font-size:5.0rem;font-weight:300;
  /*margin-bottom: 30px;*/bottom:0;right:1.6rem;position:absolute;text-align:right;max-width:900px;
  opacity: 0.7;
}

body.page .hero-description {
  font-size: 2.88rem;
  line-height: 1.8;
  max-width: 800px;
  /*margin: 0 auto;*/margin-left:20px;
}

body.page .hero-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.5;
  z-index: 1;
}

body.page .hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (max-width: 1180px) {
body.page .hero-subtitle {
    font-size: 3.4rem;
  }
}



@media screen and (max-width: 768px) {
body.page .hero-visual {
    margin-top: 125px;
    min-height: 260px;
  }

body.page .hero-content {
    padding: 40px 20px;
  }

body.page .hero-title {
    font-size: 3.8rem;
  }

body.page .hero-subtitle {
    font-size: 2.0rem;
  }

body.page .hero-description {
    font-size: 2.24rem;
  }
}

body.page .breadcrumbs {display:none;}
body.page article.page header.page-hero {display:none;}