:root{
--headerH:66px;
--gap:0px;
--btnW:260px;
--btnH:auto;
--btnTop:60px;
--btnBottom:48px;
--btnLeft:48px;
--btnRight:48px;
/* 追加：動きと暗さ */
--hoverScale:1.05;
--hoverDim:0.90;        /* 1より小さいと暗くなる */
--hoverOverlay:0.14;    /* 0〜0.22くらいで調整 */
--ease:cubic-bezier(.22,.61,.36,1);
--dur:1.2s;
--ease:cubic-bezier(.22,.61,.36,1);
--baseDim:0.75;     /* 初期はしっかり暗く */
--hoverDim:1.02;    /* 少しだけ明るく */
--hoverScale:1.06;  /* 拡大 */
--baseOverlay:0.30; /* 初期の黒レイヤー強め */
--hoverOverlay:0.08;
}

.header{
header:var(--headerH);
background:#fff;
border-bottom:1px solid rgba(0,0,0,.08);
display:flex;
align-items:center;
box-shadow:0 6px 16px rgba(0,0,0,.08);
position:relative;
z-index:10;
}

.header_inner{
  width: 100%;
height:var(--headerH);
display:flex;
justify-content:center;
align-items:center;
padding:0 16px;
}

.logo_img{
height:50px;
width:auto;
display:block;
}

.main{
display:grid;
grid-template-columns:1fr 1fr;
gap:var(--gap);
height:calc(100vh - var(--headerH));
}

.panel{
position:relative;
min-height:0;
overflow:hidden;
transition:filter var(--dur) var(--ease);
}

.panel_link{
position:absolute;
inset:0;
display:block;
text-decoration:none;
color:inherit;
}

/* 背景（画像） */
.panel_bg{
position:absolute;
inset:0;
background-size:cover;
background-position:center;
background-repeat:no-repeat;
transform:scale(1.02);
transition:
  transform var(--dur) var(--ease),
  filter var(--dur) var(--ease);
will-change:transform, filter;

filter:brightness(var(--baseDim));
}

/* 画像指定 */
.panel_a .panel_bg{background-image:url("/img_portal/bg_avenue.jpg")}
.panel_ac .panel_bg{background-image:url("/img_portal/bg_cell.jpg")}

/* オーバーレイ（通常時） */
.panel_link::before{
content:"";
position:absolute;
inset:0;
background:rgba(0,0,0,var(--baseOverlay));
transition:background var(--dur) var(--ease);
pointer-events:none;
}

/* ボタン */
.panel_btn{
position:absolute;
height:72px;           /* 高さ固定 */
width:auto;            /* 幅はSVG比率で自動 */
bottom:var(--btnBottom);
z-index:2;
display:block;
filter:drop-shadow(0 18px 40px rgba(0,0,0,.25));
}
.panel_btn.btn_cell{
bottom:auto;
top:var(--btnTop);
}

.panel_a .panel_btn{left:var(--btnLeft)}
.panel_ac .panel_btn{right:var(--btnRight)}

/* ホバー：拡大＋暗くする（眩しさ対策） */
.panel_link:hover .panel_bg{
transform:scale(1.05);
filter:brightness(var(--hoverDim)) blur(var(--hoverBlur));
}

/* ===== 追加：片方hover時にもう片方を暗くする ===== */

/* main内のどれかにhoverしている間 */
.main:hover .panel{
  filter:brightness(.35);
}

/* 今hoverしているパネルは明るく */
.main:hover .panel:hover{
  filter:brightness(1);
}



/* ホバー：オーバーレイも少し濃く（必要なら） */
.panel_link:hover::before{
opacity:var(--hoverOverlay);
}

.panel_link:focus-visible{
outline:3px solid rgba(200,168,106,.55);
outline-offset:-3px;
}

@media (max-width:991px){
  .panel_btn{
  height:58px;           /* 高さ固定 */
  }
}



/*スマホ
---------------------------------------------------------------------------------------------------*/
@media (max-width:767px){
  /* パネルは隙間ゼロで上下2分割 */
.main{
position:relative;
grid-template-columns:1fr;
gap:0;
height:calc(100vh - var(--headerH));
}
.panel{
height:calc((100vh - var(--headerH))/2);
position:relative;
}
.panel:first-of-type{
  /* border-bottom: 3px solid #000010; */
  box-shadow: 0 8px 20px rgba(0,0,0,.3);
  z-index: 2;
}
.panel:first-of-type .panel_bg{
  background-position:center calc(50% - 10px);
}

/* ボタンは下中央 */
.panel_btn{
left:50%;
right:auto;
transform:translateX(-50%);
bottom:28px;
}
.panel_btn.btn_cell{
top:auto;
bottom:28px;
}
.panel{
position:relative;
height:calc((100vh - var(--headerH))/2);
width: 100%;
}

.panel_a .panel_btn{
left:50%;
right:auto;
transform:translateX(-50%);
bottom:28px;
height:56px;
width:auto;
}

.panel_bg{
transform:scale(1.01);
filter:none;
transition:
  transform 1s cubic-bezier(.22,.61,.36,1),
  filter 1s cubic-bezier(.22,.61,.36,1);
}

/* 初期の暗いオーバーレイを無効化（SPのみ） */
.panel_link::before{
background:linear-gradient(180deg,rgba(255,255,255,.06) 0%, rgba(0,0,0,.08) 60%, rgba(0,0,0,.14) 100%);
transition:background 1s cubic-bezier(.22,.61,.36,1);
}

/* SPでもホバー演出を残すなら（タップ環境では効きにくいので控えめ推奨） */
.panel_link:hover .panel_bg{
transform:scale(1.03);
}
}