/*
Theme Name: SORALIS Child
Template: solaris_tcd088
*/

@charset "UTF-8";

/* =========================================================
   1. 基本・フォント設定
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;700&display=swap');

:root {
  --tcd-font-type1: "Barlow", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif !important;
}

html, body {
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--tcd-font-type1) !important;
}

body input, body textarea, .rich_font, .rich_font_1 {
  font-family: var(--tcd-font-type1) !important;
}

/* =========================================================
   2. ヘッダー基本構造（PC）
   ========================================================= */
html body #header {
  position: fixed !important;
  top: 0 !important;
  margin-top: 0 !important;
  height: 84px !important;
  background-color: transparent !important;
  transition: height 0.4s ease, background-color 0.4s ease, box-shadow 0.4s ease !important;
  z-index: 9999 !important;
  border: none !important;
  box-shadow: none !important;
  transform: none !important;
}

/* ヘッダー内側レイアウト */
#header_inner {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  height: 100% !important;
  max-width: 1250px !important;
  margin: 0 auto !important;
  background: transparent !important;
}

/* メニュー文字：初期は白 */
#global_menu ul li a {
  color: #ffffff !important;
  font-weight: bold !important;
  text-shadow: 0px 0px 8px rgba(0,0,0,0.4) !important;
  transition: color 0.3s !important;
}

/* ロゴ */
#header_logo, #header_logo a {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
}

#header_logo img {
  height: 75px !important;
  width: auto !important;
padding:0 10px !important;
  max-width: none !important;
}

/* =========================================================
   3. スクロール・Active時（PC）
   ========================================================= */
#header.is-fixed,
#header.active,
#header.scrolled,
#header.header_on_hover {
  background-color: rgba(255, 255, 255, 0.98) !important;
  height: 80px !important; /* 初期値と統一してリサイズ防止 */
  box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
}


#header.is-fixed #global_menu ul li a,
#header.active #global_menu ul li a,
#header.scrolled #global_menu ul li a,
#header.header_on_hover #global_menu ul li a {
 color: #0058a4 !important;
  text-shadow: none !important;
}

#header.is-fixed #header_logo img,
#header.active #header_logo img,
#header.header_on_hover #header_logo img {
  height: 55px !important;
}

/* =========================================================
   4. V6ヒーローセクション
   ========================================================= */
#hero-animation-section {
  margin-top: 0 !important;
  padding-top: 0 !important;
  top: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

/* =========================================================
   5. SP版ヘッダー（1200px以下）
   ========================================================= */
@media screen and (max-width: 1200px) {

  /* bodyの余白をリセット */
  html, body, body[style] {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

/*
  html body #header {
    position: fixed !important;
  }
*/

/* ヘッダー高さ統一（初期・active・hover全て同じ高さ）＋白バー消去 */
  html body #header,
  #header.is-fixed,
  #header.active,
  #header.scrolled,
  #header.header_on_hover {
    height: 70px !important;
    top: 0 !important;
    margin-top: 0 !important;
    background-color: transparent !important; /* ← これを追加：常に背景を透明にする */
    box-shadow: none !important;              /* ← これを追加：スクロール時の影を消す */
    border: none !important;
  }

  #header_inner {
    padding: 0 15px !important;
  }

  #header_logo, #mobile_header_logo {
 /*   height: 65px !important;*/
    display: flex !important;
    align-items: center !important;
  }

/*TCD打ち消し　ロゴ*/
    #header_logo a {
height:80px !important;
}

#header_logo 1 {
position:static;
}

/*ここまで*/

  #header_logo img, #mobile_header_logo img {
    height: 100% !important;
    width: auto !important;
  }

  /* 三本線ボタン：常にヘッダー右端の上下中央に固定 */
  #global_menu_button,
  #header.active #global_menu_button,
  #header.header_on_hover #global_menu_button {
    position: absolute !important;
    right: 15px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
padding: 0 !important;
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
  }

  #hero-animation-section {
    height: 100vh !important;
  }

#header_logo img {
padding:0 0px !important;
}

}
@media screen and (max-width: 960px) {
  #header,
  #header.is-fixed,
  #header.active,
  #header.scrolled,
  #header.header_on_hover {
    box-shadow: none !important;
  }
}
@media screen and (max-width: 1200px) {
  html body #header,
  #header.is-fixed,
  #header.active,
  #header.scrolled,
  #header.header_on_hover {
    position: fixed !important;
    height: 70px !important;
    overflow: visible !important;
  }

  /* heightを指定しない（親のflexに任せる）
  #header_logo,
  #mobile_header_logo {
    height: auto !important;
    display: flex !important;
    align-items: center !important;
  }
 */
  #header_logo img,
  #mobile_header_logo img {
    height: 65px !important;
    width: auto !important;
  }



}


/* =========================================================
   6. 検索ボックス・言語ボタン・その他パーツ
   ========================================================= */
.wrap {
  margin: 0 auto;
  padding: 10px;
  background: #0058a4;
}.Box {
  position: relative;
  margin: 0 auto;
  display: flex;
  flex-wrap: nowrap; /* wrap → nowrap に変更 */
  align-items: center;
  width: 100%;
}

.Box-SearchInput {
  border-radius: 4px 0 0 4px; /* 右側の角を消す */
  border: none;
  width: 100%;
  height: 55px;
  padding: 0 10px 0 15px;
  background: #fff;
  color: #000;
  font-size: 14px;
  flex: 1; /* 残りの幅を全部使う */
  min-width: 0; /* flexではみ出し防止 */
}

.Box-Btn {
  position: static; /* absolute → static に変更 */
  flex-shrink: 0; /* ボタンが縮まないように */
  width: 80px;
  height: 55px;
  line-height: 55px;
  background: #f0c105;
  border: none;
  border-radius: 0 4px 4px 0;
  font-weight: bold;
  text-align: center;
}

@media screen and (max-width: 648px) {
  .Box-SearchInput { height: 45px; font-size: 12px; }
  .Box-Btn { width: 80px; height: 45px; line-height: 45px; font-size: 90%; }
}

.lang__btn {
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 999;
  animation: fade 4s;
}

@keyframes fade { 0% { opacity: 0; } 100% { opacity: 1; } }

.lang__link {
  display: flex;
  height: 30px;
  margin: 0 auto;
  background-color: #fff;
  justify-content: center;
  align-items: center;
  font-size: 13px;
  color: #333;
  text-decoration: none;
}

.lang__btn li { margin-left: 30px; list-style: none; }
.lang__btn li a { padding: 5px; color: #333; text-decoration: none; }
.lang__btn li a:hover { color: #fff; background: rgba(0,88,164,1); }

@media (max-width: 767px) { .lang__btn { display: none; } }



/* =========================================================
   ボタン調整　フッター３つ
   ========================================================= */
.q_custom_button1 {
    margin-bottom:6px !important;

}

/* =========================================================
   ロゴのモアレ・ジャギ・ぼやけ軽減
   ========================================================= */
#header_logo img,
#mobile_header_logo img,
.logo_image {
  transform: translateZ(0) !important; /* GPU（ハードウェアアクセラレーション）を有効化 */
  backface-visibility: hidden !important; /* 輪郭を滑らかにする */
  -webkit-font-smoothing: antialiased !important;
}

/* =========================================================
   下層ページ（トップページ以外）のコンテンツ被り防止
   ========================================================= */
/* トップページ以外(.homeが付いていないページ)の中身を、ヘッダーの高さ分下げる */
body:not(.home) #container {
  /* padding-top: 90px !important; PC版ヘッダーの高さ(90px)分、隙間をあける */
}

@media screen and (max-width: 1200px) {
  body:not(.home) #container {
    padding-top: 70px !important; /* タブレット・スマホ版ヘッダーの高さ(70px)分 */
  }
}

/*調整*/
/* =========================================================
   「現在見ているページ（HOME等）」のメニュー色を修正
   ========================================================= */
/* 初期状態（透明ヘッダー）：カレントメニューも強制的に「白」にする */
html body #header #global_menu > ul > li.current-menu-item > a {
  color: #ffffff !important;
}

/* スクロール後（白ヘッダー）：カレントメニューは「青」に戻す */
html body #header.is-fixed #global_menu > ul > li.current-menu-item > a,
html body #header.active #global_menu > ul > li.current-menu-item > a,
html body #header.scrolled #global_menu > ul > li.current-menu-item > a,
html body #header.header_on_hover #global_menu > ul > li.current-menu-item > a {
  color: #0058a4 !important;
}

/* マウスオーバー時（ホバー）：色を青にする */
html body #header #global_menu > ul > li.current-menu-item > a:hover {
  color: #0058a4 !important; 
}


/* =========================================================
   下層ページ（トップページ以外）のヘッダー表示修正
   ========================================================= */
/* 1. ヘッダーを最初から「白背景」にして影をつける */
body:not(.home) #header {
  background-color: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
}

/* 2. メニュー文字を最初から「青色」にする（絶対に見えなくさせない） */
html body:not(.home) #header #global_menu > ul > li > a,
html body:not(.home) #header #global_menu > ul > li > a:link,
html body:not(.home) #header #global_menu > ul > li > a:visited,
html body:not(.home) #header #global_menu > ul > li.current-menu-item > a,
html body:not(.home) #header #global_menu > ul > li.current-menu-item > a:visited {
  color: #0058a4 !important;
  text-shadow: none !important;
}

/* 3. コンテンツの被りを確実に防ぐ（パンくずリストごと押し下げる） */
body:not(.home) {
  padding-top: 80px !important;
}

/* 4. SP版の被り防止（70px） */
@media screen and (max-width: 1200px) {
  body:not(.home) {
    padding-top: 70px !important;
  }
}