@charset "utf-8";





h2 { font-size:18px; color:#B3212B; }

.contents_wrap.top { width:100%; height:100%;background:#000; margin-bottom:80px; position:relative; padding-bottom:0; }
.contents_wrap.top .top_message.inline_sp { width:100%; font-size:40px; text-align:center; display:inline-block; margin:100px 0 30px 5%; line-height:1.7em; }
.contents_wrap.top .top_message.inline_pc { display:none; }
@media screen and (min-width:768px) {
  .contents_wrap.top { height: calc(100vh - 80px); padding-bottom:initial; }
  .contents_wrap.top .top_message.inline_sp { display:none; }
  .contents_wrap.top .top_message.inline_pc { width:auto; text-align:right; position:absolute; bottom:64px; right:0; margin:0; line-height:1.1em; z-index:3; margin-top:initial; display:inline-block; }
}

.inline_sp.headline-lg.text_center.text-animation { display:inline-block; }
.inline_pc.headline-lg.text_center.text-animation { display:none; }
@media screen and (min-width:768px) {
  .inline_sp.headline-lg.text_center.text-animation { display:none; }
  .inline_pc.headline-lg.text_center.text-animation { display:inline-block; }

}

/*ceo*/
.section--ceo { height:110vh; display:block; position:relative; z-index:1; }
@media screen and (min-width:375px) {
  .title_copy { font-size:29px; }
  .ceo_text_wrap_sp { top:35vw; }
}
@media screen and (min-width:414px) {
  .section--ceo { height:120vh; }
  .title_copy { font-size:32px; }
}
@media screen and (min-width:768px) {
  .title_copy { font-size:60px; }
  .section--data .map_wrap { top:10vw; }
  .section.section--ceo  { z-index:1; }

}

.contents_wrap.ceo .inline_pc.headline-lg  { display:none; }
.contents_wrap.ceo .inline_sp.headline-lg { display:block; }
@media screen and (min-width:768px) {
  .section--ceo { height:auto;}
  .contents_wrap.ceo { height:auto; padding-bottom:0 }
  .contents_wrap.ceo .inline_pc.headline-lg { display:block; }
  .contents_wrap.ceo .inline_sp.headline-lg { display:none; }
  .contents_wrap.ceo { display:block; }
  .contents_wrap.ceo .contents { height:100vh; position:relative; margin-top:100px; }
}



@media screen and (max-width:768px) {
.photo_members_wrap { height:500px; position:relative; }
.photo_members_wrap .areyouleader.inline_sp { position:absolute; bottom:0; z-index:2; opacity:0.9;}
.photo_members.inline_sp {
  width: 100%;
  display: flex;
  gap: 6px; /* ← 左右の隙間 */
}

.photo_members.inline_sp li {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 6px; /* ← 上下の隙間 */
}

.photo_members.inline_sp li.left,
.photo_members.inline_sp li.right {
  height: 410px;
}

.photo_members.inline_sp li.left div,
.photo_members.inline_sp li.right div {
  overflow: hidden;
  flex: none;
}

.photo_members.inline_sp li.left div {
  height: 200px;
}

.photo_members.inline_sp li.right div {
  height: calc((410px - 2 * 6px) / 3); /* ← 3等分＋間に6px×2 */
}

.photo_members.inline_sp img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/*アニメーション*/
/* 基本アニメーション（早く＆シャープに） */
.photo_members_wrap img {
  opacity: 0;
  transform: translateY(20px) scale(0.96);
  animation: fadeInUpZoom 0.5s ease-out forwards;
}

/* アニメーション順序（テンポ良く） */
.photo_members_wrap li.left div:nth-child(1) img {
  animation-delay: 0.1s;
}
.photo_members_wrap li.left div:nth-child(2) img {
  animation-delay: 0.2s;
}
.photo_members_wrap li.right div:nth-child(1) img {
  animation-delay: 0.3s;
}
.photo_members_wrap li.right div:nth-child(2) img {
  animation-delay: 0.4s;
}
.photo_members_wrap li.right div:nth-child(3) img {
  animation-delay: 0.5s;
}

/* areyouleader（最後に登場） */
.photo_members_wrap .areyouleader {
  opacity: 0;
  transform: translateY(20px) scale(0.96);
  animation: fadeInUpZoom 0.5s ease-out forwards;
  animation-delay: 0.6s;
}

/* アニメーション定義 */
@keyframes fadeInUpZoom {
  0% {
    opacity: 0;
    transform: translateY(20px) scale(0.96);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}




}






/*インタビュー*/
.contents_wrap.interview { background:#000; color:#fff; padding-bottom:20px; }

.contents_wrap.interview .headline-xl.inline_sp { display:block; margin:50px 0 50px 0;}
.contents_wrap.interview .headline-xl.inline_pc { display:none; }
.contents p { text-align:initial;}
.contents_wrap.interview p { width:100%; text-align:left; margin-bottom:50px; font-family:"Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN","メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;font-weight: 400;}
@media screen and (min-width:768px) {
    .header_wrap { position:initial; }
    .contents_wrap.interview .headline-xl.inline_sp { display:none; }
    .contents_wrap.interview .headline-xl.inline_pc { display:block; margin:50px 0 0 0;}

    .contents_wrap.interview p { text-align:center; margin:40px 0 80px 0; font-size:18px; }
    
    .top_message { width:100%; text-align:right; }
    .contents_wrap.top .leader_animation { position:absolute; bottom:80px; z-index:2; opacity:0.9; }
    .staff_list .button_with_arrow { margin-left:0; }

}




.photo_members.inline_pc { display:none; }
@media screen and (min-width:768px) {
  .photo_members.inline_pc {width: calc(100% - 60px);display: flex;flex-wrap: wrap;gap:4px;padding: 0;margin: 0 auto;list-style: none;}
  .photo_members.inline_pc li {width: calc((100% - 18px) / 5);}
}

.mask-container {position: relative;overflow: hidden;}
.mask-container img {display: block;width: 100%;height: auto; vertical-align: bottom;}

/* マスクのスタイル */
.mask-container::before {content: "";position: absolute;bottom: 0;left: 0; width: 100%;height: 100%;background:#000; z-index: 2; transform: translateY(0%);transition: transform 1s ease-out;}



/* 表示アニメーション */
.mask-container.revealed::before {transform: translateY(-100%);}
.title_english.text_center { width:100%; text-align:center; display:inline-block; line-height:1.3em; }
@media screen and (min-width:768px) {
  .title_english { margin-top:-35px; }
}

.staff_wrap:nth-child(1) { margin-top:50px; }
@media screen and (min-width:768px) {
  .staff_wrap:nth-child(1) { margin-top:80px; }
}
.staff_wrap { margin-bottom:0; }

.areyouleader.inline_pc { display:none; }
.areyouleader.inline_sp { width:100%; margin:50px 0; }
@media screen and (min-width:768px) {
  .areyouleader.inline_sp { display:none; }
  .areyouleader.inline_pc { display:block; }
}

/*スライダーの位置*/
@media screen and (min-width:768px) {
  
  .slider-container { position:absolute; bottom:5vw;  }
 
}


.contents_wrap.data { padding-bottom:50px; }
@media screen and (min-width:768px) {
  .contents_wrap.data { height:160vh; display:block; }
}