@charset "UTF-8";

#wrap {
    width:100%;
    min-height:100%;
    height:auto !important;
    height:100%;
    display:block;
    clear:both;
    overflow:hidden;
    padding:0px;
    margin:0px;
}
#contents {
    display:block;
    clear:both;
    overflow:hidden;
    word-wrap:break-word;
    width:100%;
    padding:0;
    margin:0px auto 30px;
}
@media print, screen and (min-width: 1024px){
#contents {margin:0px auto 30px;}
}

#main {
    width:100%;
    height: 100%;
    display:block;
    clear:both;
    overflow:hidden;
    word-wrap:break-word;
    margin:0px auto 0;
    padding:0 0 0em;
}
#sidebar {display:none;}

section{width:100%; margin:0 auto; padding:2.5em 0 1em; display:block; overflow:hidden;}

/*================================================================================================
 inner
 ================================================================================================*/
@media only screen and (max-width:834px){
.inner, .inners, .innerss{width:90%; margin: 0 auto; display: block; overflow: hidden; clear: both;}
}
@media print, screen and (min-width:834.1px){
.inner{width:70%; max-width:1024px; margin: 0 auto; display: block; overflow: hidden; clear: both;}
.inners{width:70%; max-width:834px; margin: 0 auto; display: block; overflow: hidden; clear: both;}
.innerss{width:70%; max-width:540px; margin: 0 auto; display: block; overflow: hidden; clear: both;}
}
main + section, h1 + section, h2 + section, h3 + section, h4 + section, h5 + section, h6 + section,
.breadcrumb + section, section..mainboxbox{padding-top:0 !important; margin-top:0 !important;}

.fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
}
.z2{z-index: 2; position: sticky;}


/* =========================================================
   Header 完全版CSS（修正版）
   PC ? 834px : 高さ80px（ロゴ左／メニュー中央／問合せボタン右端）
   SP ? 833.9px : 高さ60px（全画面ドロワー・2階層アコーディオン）
   HTML前提：
     - #header .h_logo .nav-pc .nav-mb .h_mail
     - PCナビ: #g-menu-pc / SPナビ: #g-menu-sp
     - WP UL: .navmenu（2階層まで）  ※menu_class="navmenu fitlink olul"
   ========================================================= */

.stroke-text{
 --stroke-color:red;
 --stroke-width:1px;
 color:white;
 text-shadow: var(--stroke-width)  0 0 var(--stroke-color),
   calc(var(--stroke-width) * -1) 0 0 var(--stroke-color),
   0 var(--stroke-width) 0 var(--stroke-color),
   0 calc(var(--stroke-width) * -1) 0 var(--stroke-color);
}

/* --- base --- */
#header{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
  padding: 0 10px;
  background:var(--color-c);
  transition: background 0.4s ease;
}
#header a{ color:#fff; text-decoration:none; }
#header .h_logo a{ line-height:0; } /* 画像下の隙間防止 */

/* ロゴ */
#header .h_logo{
  display:flex; align-items:center;
  height:80px; /* PC基準。SPで上書き */
}
#header .h_logo img{
  display:block; height:80px; width:auto;
 /*  filter: brightness(0) invert(1);  画像の中の透過以外の部分を白色に変換 */
}

/* 問い合わせボタン（共通見た目） */
#header .h_mail a{
  display:inline-flex; align-items:center; gap:.5em;
  padding:6px 8px;
  border-radius:5px;
  font-weight:700; letter-spacing:.02em;
  transition:opacity .2s ease;
  font-size:14px;
background:var(--color-c); border:1px solid #fff; color:#fff;
}

#header .h_mail a:hover{ opacity:.88; }

/* ---------------- PC（834px以上） ---------------- */
@media (min-width: 1024px){
  #header{
    height:80px;
    display:flex; align-items:center; gap:24px;
  }

  /* ロゴは左固定 */
  #header .h_logo{ margin-right:0; }

  /* メニューを中央寄せ（中央カラムを伸縮） */
  #header .nav-pc{
    flex:1;
    display:flex; justify-content:center; align-items:center;
  }

  /* 問い合わせボタンは一番右 */
  #header .h_mail{ margin-left:auto; }

  /* SP用は非表示 */
  #header .nav-mb{ display:none; }

  /* PCナビの器 */
  #g-menu-pc{ height:80px; display:flex; align-items:center; }

  /* 第一階層 */
  #g-menu-pc .navmenu{
    list-style:none; margin:0; padding:0;
    display:flex; gap:32px; font-weight:500;
  }
  #g-menu-pc .navmenu > li{ position:relative; }
  #g-menu-pc .navmenu > li > a{
    display:block; padding:0 2px; line-height:80px; font-size:14px; font-weight:500;
  }
  #g-menu-pc .navmenu > li.menu-item-has-children > a::after{
    content:"▼"; font-size:.8em; margin-left:.4em;
  }
  #g-menu-pc .navmenu > li > a:hover,
  #g-menu-pc .navmenu > li.current-menu-item > a{
    color:var(--color-a);
    font-weight:bold;
  }

  /* 第二階層（ドロップダウン） */
  #g-menu-pc .navmenu > li .sub-menu{
    position:absolute; left:50%; top:60px;
    transform:translateX(-50%) translateY(6px);
    max-width: fit-content;
    opacity:0; visibility:hidden; transition: all .18s ease;
    list-style:none; margin:0; padding:0; background:#fff;
  }
  #g-menu-pc .navmenu > li:hover > .sub-menu{
    opacity:1; visibility:visible; transform:translateX(-50%) translateY(0);
  }
  #g-menu-pc .sub-menu > li > a{
    display:block; padding:10px 14px; line-height:1.4; font-size:14px; font-weight:500;
    white-space:nowrap; color:var(--color-c);
  }
  #g-menu-pc .sub-menu > li > a:hover{ background:var(--color-g);}

}

/* ---------------- SP（833.9px以下） ---------------- */
@media (max-width: 1023.9px){
#header{
        height: 60px;
        padding: 0 8px 0 0px;
        display: block;
        background:var(--color-c);
}
#header .h_logo{
        height: 60px;
        display: block;
        position: absolute;
        top: 0px;
        left: 0px;
}
#header .h_logo img{ height:58px; }
#header .nav-mb {
        display: block;
        position: absolute;
        top: 8px;
        right: 8px;
}
#header .h_mail {
        display: block;
        position: absolute;
        top: 12px;
        right: 58px;
}
#header .h_mail a{font-size:12px;}
#header .nav-pc{ display:none; }

  /* ハンバーガー（チェックボックス制御） */
  .nav-mb .nav-unshown{ display:none; } /* input/不要label非表示 */

  #nav-open{
    display:flex; align-items:center; justify-content:center;
    width:44px; height:44px; border-radius:6px; cursor:pointer; position:relative;
  }
  #nav-open span,
  #nav-open span::before,
  #nav-open span::after{
    display:block; position:absolute; width:22px; height:2px;
    background:#fff; content:"";
    transition:transform .2s ease, opacity .2s ease, background .2s ease;
  }
  #nav-open span::before{ transform: translateY(-7px); }
  #nav-open span::after{  transform: translateY(7px); }

  /* チェック時 → × へ */
  #nav-input:checked + #nav-open span{ background:transparent; }
  #nav-input:checked + #nav-open span::before{ transform: rotate(45deg); }
  #nav-input:checked + #nav-open span::after{  transform: rotate(-45deg); }

  /* ドロワー */
  #nav-content{
    position:fixed; inset:0; background:#fff;
    transform: translateX(100%);
    transition: transform .25s ease;
    padding-top:60px; overflow:auto;
  }
  #nav-input:checked ~ #nav-content{ transform: translateX(0); }

  /* ドロワー上部（MENUと×） */
  .hamburger-top{
    position:fixed; top:0; left:0; right:0; height:60px;
    display:flex; align-items:center; justify-content:space-between;
    padding:0 8px 0 16px; font-weight:700; border-bottom:1px solid #eee; background:#fff;
  }
  .hamburger-top .cancel{
    width:44px; height:44px; cursor:pointer; position:relative;
  }
  .hamburger-top .cancel::before,
  .hamburger-top .cancel::after{
    content:""; position:absolute; top:50%; left:50%; width:22px; height:2px;
    background:var(--color-d); transform-origin:center;
  }
  .hamburger-top .cancel::before{ transform: translate(-50%,-50%) rotate(45deg); }
  .hamburger-top .cancel::after{  transform: translate(-50%,-50%) rotate(-45deg); }

  /* SPメニュー本体 */
  #g-menu-sp{ padding: 0px 0 32px; }
  #g-menu-sp .navmenu{
    list-style:none; margin:0; padding:0; border-top:1px solid #eee;
  }
  #g-menu-sp .navmenu > li{
    border-bottom:1px solid #eee; position:relative;
  }
  #g-menu-sp .navmenu > li > a{
    display:flex; align-items:center; justify-content:space-between;
    padding:10px 18px; font-weight:500; font-size:14px; color:var(--color-d);
  }

  /* 2階層（アコーディオン：.is-openで開閉。親リンクはJSで無効化済み） */
  #g-menu-sp .navmenu > li.menu-item-has-children > a::after{
    content:"＋"; font-weight:700; margin-left:8px;
  }
  #g-menu-sp .navmenu > li.is-open > a::after{ content:"－"; }

  #g-menu-sp .navmenu > li > .sub-menu{
    list-style:none; margin:0; padding:0 0 8px 0;
    max-height:0; overflow:hidden; transition:max-height .25s ease;
    background:#fafafa;
    padding-left: 1.25rem;  /* インデント */
  }
  #g-menu-sp .navmenu > li.is-open > .sub-menu{
    max-height:1200px; /* 十分に大きければOK */
  }

  #g-menu-sp .sub-menu > li > a{
    display:block; padding:8px 14px; font-size:14px; font-weight:500;
    border-top:1px dashed #e5e5e5; color:var(--color-c);
  }
}

@media (max-width: 375px){
#header{padding: 0 8px 0 6px;}
#header .h_logo{ top: 6px; left: 0px; }
#header .h_logo img{ height:46px; }
}


/* スクロールで色変更 */
.scbody #header{background:#fff;}
.scbody #header a{ color:var(--color-c); }
.scbody #header .h_logo img{ filter: unset; } 
.scbody #header .h_mail a{ background:var(--color-c); border:1px solid var(--color-c); color:#fff;}
.scbody #g-menu-pc .navmenu > li > a:hover,
.scbody #g-menu-pc .navmenu > li.current-menu-item > a{color:var(--color-a);}
.scbody #nav-open span,
.scbody #nav-open span::before,
.scbody #nav-open span::after{background:var(--color-c);}

.onsc{display:none !important;}
.nosc{display:block !important;}
.scbody .onsc{display:block !important;}
.scbody .nosc{display:none !important;}


/*================================================
 *  footmenu
 ================================================*/
footer{background-color:var(--color-d); font-size:0.9em; width: 100%;}
.footmenu { 
    width: 100%;
    margin: 0 auto;
    display: block;
    clear: both;
    overflow: hidden;
    border-top: 1px groove rgb(255 255 255 / 50%);
    background: var(--color-d);
}
.footmenu .menu{
    padding-left: 0;
    list-style-type: none;
    margin: 0;
    width: 100%;
    height: 100%;
}
.footmenu li{
	position: relative;
	display: inline-block;
	background-color: var(--color-d);
        text-align: center;
	text-decoration: none;
	transition: all 1.5s;
        width:100%;
        height:100%;
        float:left;
        margin:0;
}
.footmenu li::after {
	position: absolute;
	top: 50%;
	right: -0.1em;
	content: '';
	margin-top: -0.4em;
	border: 0.4em solid transparent;
	border-top-width: 0.4em;
	border-bottom-width: 0.4em;
	border-left-color: #fff;
	transition: all 1.5s;
}
.footmenu li a{color:#fff; font-weight:400; text-decoration:none; display:block; line-height:3em; height:100%; border-bottom:2px groove rgb(255 255 255 / 50%);}
.footmenu li:hover {opacity:.88;}
.footmenu li:hover::after {border-left-color:#fff;}
.footmenu li:nth-child(2n){border-left:none;}
@media only screen and (min-width: 834px) and (max-width: 1023.9px)
{
.footmenu ul li{width:50%; float:left;}
.footmenu ul li:nth-child(1n){border-right: 1px groove rgb(255 255 255 / 50%);}
}
@media print, screen and (min-width: 1024px)
{
.footmenu ul li{width:auto; padding-left:0.8em; padding-right:1.2em; float:left; margin-top:1px;}
.footmenu ul li:nth-child(1n){border-right: none;}
.footmenu li a{border: none;}
/*.footmenu, .footmenu li{background-color:var(--color-f);}
.footmenu li:hover {background-color:var(--color-f);}*/
}
.copyright{background-color:var(--color-d); color:#fff; text-align: center; padding-bottom: 2em; padding-top: 1.5em; clear:both;}
.copyright a {color: #fff; text-decoration:none;}
.copyright a:hover {opacity:.88;}
