 @charset "utf-8";

 #top-head a { color:#fff; }
 #nav-toggle span { background-color: #fff;}

@media (max-width:768px) {
.contents_wrap { margin-top:0; }
.top_wrap { padding-bottom:0; }

}

.bg-fixed.ono { width:100%; height:100vh; position:absolute; top:0; left:0;  background:url("../img/bglist_ono_sp.jpg") center/cover no-repeat; z-index:-1; }
@media (min-width:768px) {
  .bg-fixed.ono { height:101vh;  background:url("../img/bg_ono.jpg") center/cover no-repeat; }
}

.bg-fixed.katsuhara { width:100%; height:84vh; position:absolute; top:0; left:0; background:url("../img/bglist_katuhara_sp.jpg") center/cover no-repeat; z-index:-1; }
/* .bg-fixed.katsuhara .sp { height:70vh; } */
@media (min-width:768px) {
  .bg-fixed.katsuhara { height:101vh;background:url("../img/bg_katsuhara.jpg") center/cover no-repeat; }
}

.bg-fixed.ideguchi { width:100%; height:90vh; position:absolute; top:0; left:0; background:url("../img/bglist_ideguchi_sp.jpg") center/cover no-repeat; z-index:-1; }
/* .bg-fixed.ideguchi .sp { left:-30%; } */
@media (min-width:768px) {
  .bg-fixed.ideguchi { height:101vh; background:url("../img/bg_ideguchi.jpg") center/cover no-repeat; }
}

.bg-fixed.ono,
.bg-fixed.katsuhara,
.bg-fixed.ideguchi {
  overflow: hidden;
}

.bg-fixed .sp { width:auto; height:65vh; display:block; position:absolute; bottom:0; }
.bg-fixed.ono .sp { left: -26vw; height: 63 vh; bottom: 5vh;}
.bg-fixed.ideguchi .sp { height: 68vh; left: -16vw; }
.bg-fixed .pc { display:none; }
/* .bg-fixed .message { width:90%; font-size:39px; display:block; line-height:1.2em; margin-left:5%; position:absolute; bottom:10vh; z-index:999; text-shadow: 0 10px 30px rgba(0,0,0,0.15);} */
.bg-fixed .message { font-size:14vw; display:block; line-height:1.2em; position:absolute; bottom: 0; z-index:999; text-shadow: 0 10px 30px rgba(0,0,0,0.15); white-space:nowrap;}
@media (min-width:768px) {
  .bg-fixed .person { width:70vw; right:-1vw;  position:absolute; bottom:0; z-index:3; }
  .bg-fixed .person_kage { width:70vw; right:0;  position:absolute; bottom:0; z-index:2; }
  .bg-fixed .ideguchi.person_kage { width: 60vw !important; }
  .bg-fixed .sp { display:none; }
  .bg-fixed .pc { display:block; }
  .bg-fixed .message {font-size:90px; bottom:50px; }
}


.top_wrap { min-height:83vh; position:relative; padding:50px 0; color:#fff; }
.top_wrap div { width:100%; display:flex; }
@media (min-width:768px) {
.top_wrap { min-height: 82vh; height: auto;}
.top_wrap div { height:auto; }
}



.top_wrap.box1 { position:relative; }
.top_wrap div.info { width:90%; display:flex; flex-direction: column; margin:10vw 0 0 5%; }

/*黒帯*/
.top_wrap div.info .nyusya { font-size:24px; display:inline-block; position:relative; overflow:hidden; z-index:0; width: fit-content; padding:0 10px; }
.top_wrap div.info .nyusya::before { content:""; position:absolute; left:0; bottom:0; height:100%; width:0%; background:rgba(0,0,0,1); z-index:-1; animation:nyusyaBar 0.6s ease forwards; }

.top_wrap div.info h1.name { font-size:50px; display:inline-block; margin-bottom:10px; position:relative; overflow:hidden; z-index:0; width: fit-content; padding:0 10px; }
.top_wrap div.info h1.name::before { content:""; position:absolute; left:0; bottom:0; height:100%; width:0%; background:rgba(0,0,0,1); z-index:-1; animation:nameBar 0.6s ease 0.3s forwards; }
@media (min-width:768px) {
.top_wrap div.info h1.name { font-size:64px;}
}

@keyframes nyusyaBar { 0%{width:0%;} 100%{width:100%;} }
@keyframes nameBar { 0%{width:0%;} 100%{width:100%;} }


.top_wrap div.info small { font-size:14px; display:inline-block; -webkit-text-stroke:0; line-height:1.7em; transform: scaleY(1.0); }

.text_en_wrap { width:100%; overflow:hidden; margin-bottom:40px; }
.text_en_wrap .text_en { font-size:50px; white-space: nowrap; opacity:0.4;
line-height:1.2em; font-style: normal; display:inline-block; transform: scaleY(0.8);transform-origin: center; letter-spacing:-0.05em; font-weight:bold; color:#fff;  -webkit-text-stroke:5px; }
@media (min-width:768px){
  .text_en_wrap .text_en { font-size:125px; margin-bottom:150px; }
  .top_wrap div.info small { font-size:18px; }
}


.marquee {
  display: inline-block;
  white-space: nowrap;
  animation: marquee 30s linear infinite;
  width:100%;
  overflow:visible;
}

.text_en {display: inline-block;margin-right: 50px;line-height:1.2em; font-style: normal; display:inline; transform: scaleY(0.8);transform-origin: center; letter-spacing:-0.05em; font-weight:bold; color:#fff;  -webkit-text-stroke:1px; }

/* 無限スクロールアニメーション */
@keyframes marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

 .main { height:40vh; }
@media (min-width:768px){
  .main { width:100%; height:auto; width: 100%; height: 56vh; object-fit: cover; display: block; }
  .main_katsuhara { height:68vh;}
  .main_ideguchi { height:78vh;}
  .main_ono { height:78vh;}

}


.contents_wrap { /*background: rgba(0, 0, 0, 0.8);*/background:url(../img/bg.jpg);background-repeat:no-repeat;background-size:cover; display:flex; justify-content:center; align-items:center; flex-wrap:wrap; }
.contents { width:90%; display:flex; color:#fff; flex-wrap:wrap; margin-bottom:100px; }
@media (min-width:768px){
.contents { margin-bottom:initial; }
}
.contents p { line-height:1.83em; text-align: justify;}
h2 { margin-bottom:40px; }
h2 img { width:100%; }
@media (min-width:768px){
    .contents { width:80%; justify-content:space-between; margin-bottom:12vw; }
    .contents.marginbottom { margin-bottom:200px; }
    .contents div { width:50%; }
    .contents div p { width:100%; font-size:18px; }
    .contents div p .ceo { width:100%; margin-top:100px; }
    h2 { font-size:54px; }
    h2 img { width:34vw; }
}




/*小野さんの背景色*/
.contents_wrap.bg.ono {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;

  /* ベースのうごめくグラデーション */
  background: radial-gradient(circle at 40% 30%,
      #003BD9 0%,
      #e35c6b 70%,
      #FF5800 100%
  );
  background-size: 200% 200%;
  animation: mushimushi 10s ease-in-out infinite;
}

/* ノイズレイヤー */
.bg.ono::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;

  /* ★ここを1行＆URLエンコードした版にする */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23noise)'/%3E%3C/svg%3E");

  opacity: 0.12;
  mix-blend-mode: overlay;
  animation: noiseMove 1s steps(2) infinite;
}

@keyframes mushimushi {
  0% {
    background-size: 180% 180%;
    background-position: 40% 30%;
  }
  50% {
    background-size: 230% 230%;
    background-position: 60% 70%;
  }
  100% {
    background-size: 180% 180%;
    background-position: 40% 30%;
  }
}

@keyframes noiseMove {
  0% { transform: translate(0,0); }
  100% { transform: translate(-2%, 2%); }
}


/*勝原さんの背景色*/
.contents_wrap.bg.katsuhara {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;

  /* ベースのうごめくグラデーション */
  background: radial-gradient(circle at 40% 30%,
      #00EFA5 0%,
      #ff5a36 70%,
      #ffaa19 100%
  );
  background-size: 200% 200%;
  animation: mushimushi 10s ease-in-out infinite;
}

/* ノイズレイヤー */
.bg.katsuhara::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;

  /* ★ここを1行＆URLエンコードした版にする */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23noise)'/%3E%3C/svg%3E");

  opacity: 0.12;
  mix-blend-mode: overlay;
  animation: noiseMove 1s steps(2) infinite;
}

@keyframes mushimushi {
  0% {
    background-size: 180% 180%;
    background-position: 40% 30%;
  }
  50% {
    background-size: 230% 230%;
    background-position: 60% 70%;
  }
  100% {
    background-size: 180% 180%;
    background-position: 40% 30%;
  }
}

@keyframes noiseMove {
  0% { transform: translate(0,0); }
  100% { transform: translate(-2%, 2%); }
}




/*出口さんの背景色*/
.contents_wrap.bg.ideguchi {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;

  /* ベースのうごめくグラデーション */
  /* background: radial-gradient(circle at 40% 30%,
      #ff184e 0%,
      #ff5a36 70%,
      #ffaa19 100%
  ); */
   background: radial-gradient(circle at 40% 30%, #c82b50 0%, #eed573 70%, #ffc477 100% );
  background-size: 200% 200%;
  animation: mushimushi 10s ease-in-out infinite;
}


.masked-image {
  position: relative;
}

/* より濃く、広い範囲にかかるマスク */
.masked-image.fade-mask::after {
  content: "";
  position: absolute;
  inset: 0;

  /* マスクを強めに → 白から透明までのグラデ範囲を大きく */
  background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 30%, transparent 90%);

  /* 動きをゆっくり＆大袈裟に */
  transition: opacity 1.5s cubic-bezier(0.25, 0.8, 0.25, 1.4);
  /* ↑ overshoot 気味で“ふわっ”と強調される */

  pointer-events: none;
  opacity: 1;
}

/* マスクが消えるときの効果を強める */
.masked-image.visible::after {
  opacity: 0;
}



.member_wrap_box { width:100%; background:url(../img/bg_other.jpg); background-size:cover; background-repeat:no-repeat; text-align:center; padding:80px 0;
box-shadow: 0 -4px 8px rgba(0,0,0,0.2);}
.member_wrap_box h2 { width:100%; text-align:center; color:#fff; font-size:16px; }
.member_wrap_box .member_title { font-size:50px; width:100%; text-align:center; color:#fff; }
.member_wrap { width:90%; justify-content: space-between; margin:0 auto; display: flex; gap: 24px;}
.member_wrap li {  color:#fff; display:block;margin-bottom: 60px; }
.member_wrap li a {
  width: 100%;
  height: 100%;
  transition: opacity 0.3s ease;
}

.member_wrap li a .button_arrow {
  transition:
    transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.member_wrap li a:hover {
  opacity: 0.7;
}

.member_wrap li a:hover .button_arrow {
  transform: translateX(8px);
}

.member_wrap li a span { width:auto; text-align:left; float:left; display:flex; align-items:center; padding-bottom:5px; }
.member_wrap li img { width:100%; margin-bottom:20px; }
.member_wrap li strong { width:100%; text-align:left; }

.bg-fixed.ideguchi .message { bottom: 4vh; }
.bg-fixed.ono .message { bottom: 14vh; }

@media (min-width:768px){
  .masked-image {
    position: relative;
    width: 100%;
    height: 65vh;
    overflow: hidden;
  }
  
  .member_wrap { width:100%; display:flex; }
  .member_wrap li { width:100%; color:#fff; }
  .member_wrap_box { padding:120px 0;}
  .member_wrap_box h2  { font-size:30px; }
  .member_wrap_box .member_title  { font-size:110px; }
  .member_wrap { width:90%; max-width:900px; display:flex; justify-content: space-between; margin:0 auto; }
  .member_wrap li { width:47%; }
}
.member_wrap li img.button_arrow { width:20px; margin-bottom:0; margin-left:10px; }
