@charset 'utf-8';

/*共通*/
main { padding-bottom:0; }
.contents_link { width:100%; display:none; flex-wrap:wrap;justify-content: space-between;  border-top:1px solid #707070;}
.contents_link li { text-align:center; }
.contents_link li { width:50%; padding:13px 10px; border-bottom:1px solid #707070; }
.contents_link li:nth-child(odd) {border-right: 1px solid #707070; }
.contents_link li a { width:100%; color:#646462; text-align:center; font-size:14px; position:relative; display:inline-block; }
.contents_link li a::after { content:""; position:absolute; top:50%; right:5%; width:7px; height:7px; background:url("../img/arrow_right.svg") no-repeat center/contain; transform:translateY(-50%); }
.contents_link li a.active
.contents_inner .h1_wrap { width:100%;  position: relative; }

.image_top { width:100%; height:25vh; margin-bottom:60px; }
.image_top img { width:100%; height:100%; object-fit:cover; border:1px solid #707070; animation: none;}
.lead { line-height:2em; margin-bottom:80px;}
.contents_wrap { padding-bottom:0px; }
.contents_wrap.top { padding-bottom:0px; }
.contents_wrap.toplink { display:flex; flex-wrap:wrap; flex-direction: column-reverse;}
.contents_wrap.toplink .contents_inner.margintop0 { margin-top:0; }
.contents_wrap .image_top { margin-bottom:30px; }
@media screen and (min-width:768px) {
  .contents_link { width:auto; justify-content: initial; margin-bottom:56px; margin-bottom:initial; border-top:0; display:flex; }
  .contents_link li { width:auto; padding:0 20px; /*border-right:1px solid #646462;*/ border-top:none; border-left:none; border-bottom:none; margin-bottom:initial; margin-bottom:10px; }
  .contents_link li a { position:relative; display:inline-block; text-align:left; font-size:16px; text-decoration:none; }
  .contents_link li a::after { content:""; position:absolute; top:initial; left:0; bottom:0; width:0%; height:1px; background-color:currentColor; transition:width 0.3s ease; }
  .contents_link li a:hover::after { width:100%; }
  .contents_link li a.active { text-decoration:underline;}
  .contents_link li a.active:hover::after { content:none; }
  
  .contents_inner .h1_wrap { margin-bottom:50px; }
  .contents_link { width:90%; margin:0 auto 56px auto; }
  .image_top { height:480px; display:block;  }
  .contents_wrap { padding-bottom:120px; }
  .contents_inner.margintop0 { margin-top:0; }
  .contents_wrap.toplink { flex-direction: initial;}

}

@media (max-width: 768px) {
  .contents_link li:has(a.active) {
    display: none;
  }
}
.contents_link li:nth-child(odd) {
  border-left: 1px solid #707070;
}




/*ページ下部共通リンク*/
.contents_link_bottom { width:90%; display:flex; flex-wrap:wrap; margin:40px auto 0 auto;justify-content: space-between; }
.contents_link_bottom li { width:47.5%; }
.contents_link_bottom li .arch {width:clamp(100%,28vw,100%);aspect-ratio:320/350;border-radius:9999px 9999px 0 0;overflow:hidden;margin-bottom:16px;display:flex;align-items:center;justify-content:center;  position:relative; border:1px solid #434343;}
.contents_link_bottom li .arch::after {content:"";position:absolute;inset:0; /* top, right, bottom, leftすべて0 */background:rgba(0,0,0,0.34); /* 黒の34%透過 */z-index:1; /* 画像より上 */pointer-events:none; /* クリック透過 */}
.contents_link_bottom li .arch img {width:100%;height:100%;object-fit:cover;object-position:center;display:block;  transition: transform 0.6s ease; transform: scale(1); }
.contents_link_bottom li .arch strong { width:100%; font-size:24px; text-align:center; position:absolute; z-index:1; color:rgba(255,255,255,0.8); line-height:1.1em; z-index:2; padding-top:50px; }
.contents_link_bottom li .arch strong span.gothic {font-size:14px; font-weight:bold; color:rgba(255,255,255,1);}
.contents_link_bottom li a:hover .arch img { transform: scale(1.08);  }
@media screen and (min-width:768px) {
  .contents_link_bottom {  margin:0 auto; gap:54px; display:flex; }
  .contents_link_bottom li { width:28%; }
  .contents_link_bottom li .arch strong { font-size:4vw; }
  .contents_link_bottom li .arch strong span.gothic { font-size:18px; }
}
@media screen and (min-width:1120px) {
  .contents_link_bottom { width:1080px;  margin:80px auto 0 auto;}
  .contents_link_bottom li { width:320px; }
    .contents_link_bottom li .arch strong { font-size:39px; }
}

.contents_link_bottom li .arch {
  position: relative;
  overflow: hidden;
}

/* ===== 黒幕の左右分割 ===== */
/* アーチ本体を基準にする＆はみ出し隠し */
.contents_link_bottom li .arch{
  position: relative;
  overflow: hidden;
  z-index: 0;
}

/* ===== 黒幕の左右分割（そのままでOK） ===== */
.contents_link_bottom li .arch::before,
.contents_link_bottom li .arch::after{
  content:"";
  position:absolute;
  top:0;
  height:100%;
  width:50%;
  background:rgba(0,0,0,0.34);
  z-index:1;
  pointer-events:none;
  transition:transform .6s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}

/* 左半分：左端から中央へ */
.contents_link_bottom li .arch::before{
  left:0;              /* ← 左端起点 */
  transform:translateX(0);
  transform-origin:right center;
}

/* 右半分：必ず中央(左:50%)から配置するのがコツ */
.contents_link_bottom li .arch::after{
  left:50%;            /* ← ここを right:0 ではなく left:50% に */
  transform:translateX(0);
  transform-origin:left center;
}

/* ===== ホバー時：中央→左右へ開く ===== */
.contents_link_bottom li:hover .arch::before{ transform:translateX(-100%); }
.contents_link_bottom li:hover .arch::after{  transform:translateX(100%);  }



.contents_wrap.contentslink { width:100%; padding:80px 0; }
@media screen and (min-width:768px) {
  .contents_wrap.contentslink { width:100%; padding:100px 0 120px 0; }
  .contents_wrap.contentslink h2 { width:100%; text-align:center; font-size:20px; display:inline-block; margin-bottom:20px; }
}


.contents_wrap.contentslink .title_en { width:100%; text-align:center; font-size:40px; display:inline-block;letter-spacing: 0.16em;margin-bottom: 20px; }
.contents_wrap.contentslink h2 {width:100%; text-align:center; display:inline-block;  }

/*ブランドページ*/
.contents.bgborder .logo { width:70%; margin:0 auto 50px auto; display:block;  }


@media screen and (min-width:768px) {



}


/*カルチャー*/
.contents_inner.culture .h1_wrap::after{content:"";position:absolute;top:0px;right:0;width:128px;height:160px;background:url("../img/culture/kirakira_animation.png") no-repeat center/contain;z-index:2}