@charset "UTF-8";
/*
Theme Name: Kinbue English
Version: 1.0
*/
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');
body {
  color: #1F1E47;
  font-family: "Libre Baskerville", serif;
  font-style: normal;
  background: url("img/bg.jpg") center;
  padding-top: env(safe-area-inset-top); /* iPhone ノッチを避ける */
}
h1 {
  font-family: "Libre Baskerville", serif;
  font-weight: normal;
  /*letter-spacing: 0.1em;*/
}
h2 {
  font-family: "Libre Baskerville", serif;
  font-weight: 400;
  font-style: normal;
  /* letter-spacing: 0.1em;*/
}
h3 {
  font-size: 1.250rem;
  /*letter-spacing: 0.1em;*/
}
p {
  line-height: 1.8;
  /*letter-spacing: 0.1em;*/
}
/*p:last-of-type { margin-bottom: 0 !important; }*/
address, i {
  font-style: normal;
}
.clearfix:after {
  content: '';
  display: block;
  clear: both;
}
img {
  border: none;
  max-width: 100%;
  height: auto;
}
ol, ul {
  list-style: none;
}
.pc_view {
  display: block !important;
}
.sp_view {
  display: none !important;
}
@media only screen and (max-width: 768px) {
  .pc_view {
    display: none !important;
  }
  .sp_view {
    display: block !important;
  }
}
@media screen and (min-width: 1024px) {
  .br-pc {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .br-sp {
    display: none;
  }
}
@media (max-width: 1020px) and (min-width: 768px) {
  .br-tb {
    display: none;
  }
}
/*スマホのみタップ*/
@media(min-width: 768px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}
/*--- スマホ改行 --*/
@media screen and (max-width: 480px) {
  .pc-br {
    display: none;
  }
  .tb-br {
    display: none;
  }
  .sp-br {
    display: block;
  }
}
/*--- タブレット改行 --*/
@media screen and (min-width:481px) and (max-width: 1020px) {
  .pc-br {
    display: none;
  }
  .tb-br {
    display: block;
  }
  .sp-br {
    display: none;
  }
}
/*--- PC改行 --*/
@media screen and (min-width:1021px) {
  .pc-br {
    display: block;
  }
  .tb-br {
    display: none;
  }
  .sp-br {
    display: none;
  }
}
/* link
------------------------------------*/
a {
  text-decoration: none;
  color: #1F1E47;
}
a:hover {
  color: #d96d00;
}
a:hover img {
  opacity: 0.8;
}
.wrap {
  text-align: left;
  clear: both;
}
.inner {
  max-width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .inner {
    padding-top: 15px;
    padding-bottom: 15px;
  }
}
@media (max-width:1040px) {
  .main-column, .side-column {
    max-width: 100%;
    width: 730px;
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
}
.page-template-page-full .inner {
  max-width: 100%;
}
/*.page-default {
	max-width: 1040px;
	margin-left: auto;
	margin-right: auto;
	float: none;
}*/
.side {
  overflow: hidden;
}
.archive-widget {
  margin-top: 60px
}
/*ヘッダー*/
.pc {
  display: block !important;
}
.sp {
  display: none !important;
}
@media (min-width: 0px) and (max-width: 1180px) {
  .pc {
    display: none !important;
  }
  .sp {
    display: block !important;
  }
}
.menu {
  display: flex;
  align-items: center;
}
.menu li {
  list-style: none;
  margin-left: 2rem;
}
.menu li a {
  text-decoration: none;
  color: #fff;
  font-style: normal;
}
.menu li a:hover {
  color: #fff;
  transition: .5s;
}
/*20250616
.pc-submenu-change li a {
  color: #fff;
  transition: color 0.3s ease;
}*/
/* スクロールで .invert クラスが付いたら黒 */
.pc-submenu-change.invert li a {
  color: #000;
}
/*toggle*/
/* ==== 共通設定 ==== */
.togglebtn {
  position: fixed;
  z-index: 9999;
  top: 24px;
  right: 24px;
  cursor: pointer;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  transition: background-color 0.3s ease;
}
/* 棒の共通スタイル（初期は紺色） */
.togglebtn span {
  position: absolute;
  left: 25%;
  width: 50%;
  height: 2px;
  background-color: #fff; /* 初期棒色（紺） */
  border-radius: 2px;
  transition: all 0.4s ease;
}
/* 棒の位置 */
.togglebtn span:nth-of-type(1) {
  top: 16px;
}
.togglebtn span:nth-of-type(2) {
  top: 24px;
}
.togglebtn span:nth-of-type(3) {
  top: 32px;
}
/* ==== クリック時（×に変形） ==== */
.togglebtn.active span:nth-of-type(1) {
  transform: rotate(45deg);
  top: 24px;
}
.togglebtn.active span:nth-of-type(2) {
  opacity: 0;
}
.togglebtn.active span:nth-of-type(3) {
  transform: rotate(-45deg);
  top: 24px;
}
.sp-header {
  /* position: fixed;
  height: 70px;*/
  width: 100%;
  top: 0;
}
.sp-logo {
  position: fixed;
  top: 18px;
  left: 4%;
  opacity: 0; /* 初期は透明（PC用） */
  transition: opacity 0.3s;
  z-index: 1000;
}
/* PCでのみスクロール判定用 */
body.top .sp-logo.show {
  opacity: 1;
}
/* スマホは常に表示 */
@media screen and (max-width: 767px) {
  .sp-logo {
    opacity: 1;
    transition: none; /* スクロール演出なし */
  }
}
.sp-logo a {
  text-decoration: none;
  color: #000000;
  font-family: 'Shippori Mincho', serif;
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  letter-spacing: 3px;
}
/* ハンバーガーが閉じているとき */
#sp-gnav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  overflow-y: auto; /* スクロールできるようにする */
  background-image: url(img/back-b.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover; /* 画面全体に拡大 */
  transition: all 0.3s;
}
#sp-gnav.panelactive {
  height: 100vh;
  z-index: 1001;
}
/* 言語切替メニューの初期状態 */
.sp .lang-switch {
  display: none;
}
/* ハンバーガーが開いたときのみ表示 */
#sp-gnav.panelactive .lang-switch {
  display: flex;
  /* justify-content: center;*/
  margin-top: 20px;
}
#sp-gnav.panelactive .sp-gnav-box {
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  overflow: auto;
  padding: 4rem;
}
.sp-gnav-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#sp-gnav ul {
  display: none;
  z-index: 999;
}
#sp-gnav.panelactive ul {
  display: block;
}
#sp-gnav li {
  list-style: none;
}
@media (min-width: 768px) and (max-width: 1024px) {
  #sp-gnav.panelactive ul {
    max-width: 350px; /* 元の幅を指定してください */
    margin-left: auto; /* 左マージン自動 */
    margin-right: auto; /* 右マージン自動 */
    padding-left: 0; /* 必要に応じて調整 */
    padding-right: 0;
  }
}
.sp-menu-logo {
  margin: 3rem auto 1rem;
  text-align: left
}
.sp-menu-logo img {
  max-width: 200px;
}
.sp-menu-logo a {
  text-decoration: none;
  color: #000000;
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  letter-spacing: 3px;
}
.sp-menu-list li {
  padding-bottom: 1.250rem;
}
.sp-menu-list li a span {
  letter-spacing: 1px;
  margin-bottom: 16px;
  display: inline-block;
}
.sp-menu-list li a:hover {
  color: #0000005b;
  transition: .5s;
}
/*.sp-menu-info p {
    font-size: 10px;
  }*/
.sp-menu-info p a {
  font-size: 2.0rem;
  color: #000000;
  text-decoration: none;
  font-weight: bold;
  line-height: 1;
}
.sp-menu-info p a:hover {
  color: #0000005b;
  transition: .5s;
}
.sp-menu-list {
  display: block;
}
@media (max-width:834px) {
  .header_left {
    float: none;
  }
  .link_area {
    display: none;
  }
  .site-title {
    margin: 14px 40px;
    text-align: center;
    display: block;
  }
  .site-description {
    text-align: center;
  }
  .tel_box {
    text-align: center;
  }
  .contact_box {
    padding: 13px 2em;
  }
}
@media screen and (max-width: 834px) {
  /* スマホ・タブレット共通スタイル */
  .sp-menu-list li {
    padding-bottom: 0.5rem;
    font-size: 16px;
  }
  .sp_site_title {
    font-weight: bold;
    color: #fff;
    padding: 2rem 0 1rem 0rem;
  }
}
/*content*/
.top-widget .widget-title, .archive-widget .widget-title, .entry-title, .archive-title {
  font-size: 1.750em;
  border-top: 1px solid #999;
  border-bottom: 1px solid #999;
  line-height: 1.4;
  padding: 10px 0;
  font-weight: bold;
  text-align: center;
}
@media (max-width:477px) {
  .top-widget .widget-title, .archive-widget .widget-title, .entry-title, .archive-title {
    margin-left: -10px;
    margin-right: -10px;
  }
}
/*archive*/
.category-header {
  margin-bottom: 20px;
}
.category-header p {
  font-size: 0.750rem;
}
/*pagenavi*/
.navigation {
  clear: both;
  padding: 0;
  font-size: 0.813rem;
  line-height: 20px;
  text-align: center;
  overflow: hidden;
  margin: 20px 0;
}
.navigation a, .navigation span {
  color: #fff;
  padding: 5px 10px;
  background-color: #999;
  text-decoration: none;
  border-radius: 3px;
  margin: 2px;
  display: inline-block;
}
.navigation a:hover {
  background-color: #aaa;
}
.navigation div.alignleft {
  float: left;
}
.navigation div.alignright {
  float: right;
}
.navigation div.alignleft a, .navigation div.alignright a {
  margin: 0;
}
.navigation span.current {
  background-color: #333;
}
.navigation span.pages {
  background-color: #ccc;
  padding: 5px 20px;
}
/*image*/
.thumbnail-align img {
  float: left;
  padding: 7px;
  margin: 0 20px 20px 0;
  background-color: #eee;
  border-radius: 3px
}
.wp-caption .wp-caption-text {
  color: #333;
  font-size: 0.750rem;
  margin: 7px 0 0;
}
/*効果*/
.fadeIn {
  opacity: 0;
  transition: 2s;
  animation-delay: 0.5s;
}
.fadeIn.is-show {
  opacity: 1;
}
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/*ボタン*/
a.enbtn_ore {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 300px;
  height: 50px;
  position: relative;
  background: #D96D00;
  border: 1px solid #D96D00;
  box-sizing: border-box;
  padding: 0 45px 0 25px;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-align: left;
  text-decoration: none;
  transition-duration: 0.3s;
}
a.enbtn_ore:before {
  content: '';
  width: 8px;
  height: 8px;
  border: 0;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 25px;
  margin-top: -6px;
}
a.enbtn_ore:hover {
  background: #fff;
  color: #D96D00;
}
a.enbtn_ore:hover:before {
  border-top: 2px solid #D96D00;
  border-right: 2px solid #D96D00;
}
a.enbtn_white {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 300px;
  height: 50px;
  position: relative;
  background: #4F48BA;
  border: 1px solid #4F48BA;
  box-sizing: border-box;
  padding: 0 45px 0 25px;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-align: left;
  text-decoration: none;
  transition-duration: 0.3s;
}
a.enbtn_white:before {
  content: '';
  width: 8px;
  height: 8px;
  border: 0;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 25px;
  margin-top: -6px;
}
a.enbtn_white:hover {
  background: #fff;
  color: #4F48BA;
}
a.enbtn_white:hover:before {
  border-top: 2px solid #4F48BA;
  border-right: 2px solid #4F48BA;
}
@media (max-width: 736px) {
  a.enbtn_ore, a.enbtn_white {
    max-width: 320px;
  }
}
/* ボタン本体 */
.btn-blue a {
  display: inline-flex; /* 内容量に自動でフィット */
  align-items: center;
  justify-content: center;
  padding: 0 40px; /* テキスト量に左右されない余白 */
  height: 50px; /* ボタン高さ固定 */
  border: 1px solid #454466;
  background-color: #454466;
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  position: relative;
  transition: background-color .3s;
}
/* 矢印 */
.btn-blue a::after {
  content: "";
  width: 7px;
  height: 7px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  margin-left: 12px;
  transition: transform .3s;
}
/* ホバー時 */
.btn-blue a:hover {
  background-color: #fff; /* お好みで */
  color: #1F1E47;
  border-color: #1F1E47;
}
.btn-blue a:hover::after {
  border-color: #1F1E47;
  transform: translateX(3px) rotate(45deg);
}
/* ボタン本体 */
.btn-orange a {
  display: inline-flex; /* 内容量に自動でフィット */
  align-items: center;
  justify-content: center;
  padding: 0 40px; /* テキスト量に左右されない余白 */
  height: 50px; /* ボタン高さ固定 */
  border: 1px solid #D96D00;
  background-color: #D96D00;
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  position: relative;
  transition: background-color .3s;
}
/* 矢印 */
.btn-orange a::after {
  content: "";
  width: 7px;
  height: 7px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  margin-left: 12px;
  transition: transform .3s;
}
/* ホバー時 */
.btn-orange a:hover {
  background-color: #fff; /* お好みで */
  color: #D96D00;
  border-color: #D96D00;
}
.btn-orange a:hover::after {
  border-color: #D96D00;
  transform: translateX(3px) rotate(45deg);
}
/* ボタン本体 */
.btn-white a {
  display: inline-flex; /* 内容量に自動でフィット */
  align-items: center;
  justify-content: center;
  padding: 2rem 40px; /* テキスト量に左右されない余白 */
  height: 50px; /* ボタン高さ固定 */
  border: 1px solid #D96D00;
  background-color: #fff;
  color: #D96D00;
  text-decoration: none;
  font-weight: 500;
  position: relative;
  transition: background-color .3s;
}
/* 矢印 */
.btn-white a::after {
  content: "";
  width: 7px;
  height: 7px;
  border-top: 2px solid #D96D00;
  border-right: 2px solid #D96D00;
  transform: rotate(45deg);
  margin-left: 12px;
  transition: transform .3s;
}
/* ホバー時 */
.btn-white a:hover {
  background-color: #D96D00; /* お好みで */
  color: #fff;
  border-color: #D96D00;
}
.btn-white a:hover::after {
  border-color: #fff;
  transform: translateX(3px) rotate(45deg);
}
/*フッター*/
#footer {
  background: url("img/footer_bg.png")left top repeat;
  color: #fff;
  padding: 4rem 15px;
  object-fit: cover;
}
#footer .inner {
  max-width: 1200px;
  text-align: center;
}
.footer_btnbox {
  margin: 1rem auto;
}
.footer_btnbox li {
  width: 50%; /* ← 横幅を明確に */
  max-width: 300px; /* ← 必要なら上限だけ設ける */
  list-style: none;
}
/* 768px以下は縦積み */
@media screen and (max-width: 767px) {
  #footer .inner {
    max-width: 100%;
    padding: 0 15px;
    flex-direction: column; /* 縦並び */
    gap: 10px;
  }
  .footer_btnbox {
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }
  .footer_btnbox li {
    width: 100%;
    max-width: 350px; /* ボタン幅の上限。任意 */
  }
}
/*20250716*/
/* ヘッダー */
.main-menu {
  display: flex;
  /*  align-items: center;
*/
}
.main-menu li {
  list-style: none;
  margin-left: 2rem;
  font-weight: bold;
  letter-spacing: -0.05em /*font-size: 0.875rem;*/
}
/*スマホ用メニュー*/
#menu-footer_navi li {
  text-align: left;
  font-size: 1.5rem;
}
#menu-footer_navi li a {
  text-align: left;
  color: #fff;
}
.sp-menu-list li {
  position: relative;
  display: flex;
  align-items: center; /* 縦方向に中央揃え */
  padding: 1em;
}
.sp-menu-list li::before {
  content: '';
  position: absolute;
  left: 0;
  width: 8px;
  height: 1px;
  background-color: #fff; /* 棒の色 */
}
/* 下層ページヘッダー初期状態 */
.pc-en-header {
  position: fixed;
  width: 100%;
  top: 0;
  background: url(img/footer_bg.png) left top repeat;
  color: #fff; /* 文字色白 */
  z-index: 888;
  transition: background-color 0.6s ease, color 0.6s ease;
}
/* スクロール後に背景白・文字紺 */
.pc-header-sub.solid {
  background-color: rgba(255, 255, 255, 1); /* 背景白 */
  color: #1F1E47; /* 文字紺 */
}
/* ヘッダー内リンクも色を変える */
.pc-header-sub.solid a {
  color: #1F1E47;
}
/* ナビ全般 */
.pc-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 8px 8% 8px 8%;
}
/* ヘッダー内リンク初期状態 */
.pc-header-sub a {
  color: #fff; /* 初期文字色は白 */
  transition: color 0.3s ease;
}
/* スクロール後の文字色 */
.pc-header-sub.solid a {
  color: #1F1E47; /* 背景白の時は紺 */
}
/* マウスオーバー時は常にオレンジ */
.pc-header-sub a:hover {
  color: #d96d00;
}
/*JP-ENスイッチ*/
.pc-nav {
  position: relative; /* 言語切替の基準にする */
}
.lang-switch a {
  color: #fff;
}
.lang-switch {
  display: flex;
  /* align-items: center;
        justify-content: center;
        width: 180px;*/
}
.lang-switch li:first-child {
  border-right: 1px solid #fff;
  /*border-right: 1px solid #1F1E47;*/
}
.lang-switch li {
  padding: 0 15px;
  text-align: center;
  line-height: 1;
  font-size: 0.875rem;
}
.lang-switch li.is-current span, .lang-switch li.is-current a {
  color: #aaa; /* グレー */
  pointer-events: none; /* クリック不可にしてもOK */
}
@media screen and (max-width: 1180px) {
  /* スマホでも表示させる */
  .sp .lang-switch {
    display: flex !important;
    justify-content: flex-start; /* 左寄せ */
    margin-bottom: 1.250rem;
    margin-top: 4rem;
  }
  .sp .lang-switch li:first-child {
    border-right: 1px solid #fff; /* 縦棒色を白に */
  }
  .sp .lang-switch li {
    padding: 0 10px;
    font-size: 1rem;
  }
  .sp .lang-switch li.is-current span, .sp .lang-switch li.is-current a {
    color: #aaa;
    pointer-events: none;
  }
  .sp .lang-switch a {
    color: #fff; /* 必要に応じて */
  }
}
.pc-header-top .lang-switch a {
  color: #1F1E47;
}
/*header*/
.en-global-nav ul {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 24px;
  color: #fff;
}
.en-global-nav ul li a {
  color: #fff;
  letter-spacing: 0.1rem
}
/* スマホサイズでグローバルメニューを非表示 */
@media screen and (max-width: 768px) {
  .lang-switch {
    margin-right: 3rem;
  }
}
/* スマホ＋iPad縦では消す */
@media screen and (max-width: 1024px) and (orientation: portrait) {
  .en-global-nav {
    display: none;
  }
}
/* iPad横以上で表示 */
@media screen and (min-width: 1025px), screen and (min-width: 1024px) and (orientation: landscape) {
  .en-global-nav {
    display: block;
  }
}
@media screen and (min-width: 1024px) and (orientation: landscape) {
  .togglebtn {
    display: none !important;
  }
}
/*footer*/
#footer .footer_btnbox .btn-orange a {
  width: 300px;
}
#footer .map-btn-wrapper {
  padding-top: 0.5rem;
}
#footer .map-btn-subtle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #1f1e47; /* 控えめブルー */
  color: #fff;
  font-size: 13px;
  font-weight: 400; /* やや細め */
  text-decoration: none;
  padding: 0 14px;
  height: 32px;
  border-radius: 6px;
  transition: background-color 0.3s, transform 0.2s;
  border: 1px solid #454466;
}
#footer .map-btn-subtle svg {
  margin-right: 6px; /* アイコンと文字の間隔 */
}
#footer .map-btn-subtle:hover {
  background-color: #D96D00; /* 少し濃く */
  transform: translateY(-1px); /* 軽く浮く演出 */
  color: #fff;
}