@charset "utf-8";

/* Scroll reveal with color band */
.reveal-wrap {
  position: relative;
  overflow: hidden;
}
.reveal-wrap > .reveal-band {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background: #00b4a5;
  transform: translateX(-101%);
  z-index: 10;
  pointer-events: none;
}
.reveal-wrap > .reveal-content {
  opacity: 0;
}
.reveal-wrap.is-animated > .reveal-band {
  animation: bandIn 0.5s cubic-bezier(0.4,0,0.2,1) forwards,
             bandFadeOut 0.6s cubic-bezier(0.4,0,0.2,1) 0.45s forwards;
}
.reveal-wrap.is-animated > .reveal-content {
  animation: contentFadeIn 0.6s ease 0.45s forwards;
}
@keyframes bandIn {
  from { transform: translateX(-101%); opacity: 1; }
  to   { transform: translateX(0); opacity: 1; }
}
@keyframes bandFadeOut {
  from { transform: translateX(0); opacity: 1; }
  to   { transform: translateX(0); opacity: 0; }
}
@keyframes contentFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.loading { width: 100%; height: 100%; background: #00aba5;
 position: fixed; top: 0; left: 0; z-index: 20000;
}
.loader_wrap { width: 18%; overflow: hidden;
  position: absolute; top: 50%; left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
@media screen and (max-width: 767px) {
  .loader_wrap { width: 150px;}
}
.loader_wrap .loader { display: block; margin-bottom: 2.5rem;}
.loader_wrap .loader img { width: 100%;}
.loader_wrap .loading_txt { width: 26%; height: 22px; margin: 0 auto; overflow: hidden;}
.loader_wrap .loading_txt img { width: 100%; vertical-align: top;}
.opening { position: relative; width: 100%; height: 68px; }
.opening svg { display: block; width: 100%; height: 100%; }
.opening .opening-bar-fill1,
.opening .opening-bar-fill2,
.opening .opening-bar-fill3 {
  clip-path: inset(0 100% 0 0);
}
.opening-count {
  display: block; margin: 0.5rem 0; text-align: center;
  color: #fff; font-size: 13px; letter-spacing: 0.1em;
}



.ttl { text-align: center;}
.ttl h2 span { display: inline-block; padding: 0 20px; line-height: 1; vertical-align: baseline;}
.ttl h2 span.eng{ color: #00b4a5; font-size: clamp(24px,6.0vw,50px); letter-spacing: 0.08rem;}
.ttl h2 span.jp { font-size: clamp(18px,3.0vw,30px); letter-spacing: 0.15rem;}
@media (max-width: 801px) {
	.ttl { padding: 0 20px; text-align: left;}
	.ttl h2 span { padding: 0 12px;}
}
@media (max-width: 481px) {
	.ttl h2 span { padding: 0 8px;}
	.ttl h2 span.eng{ font-size: 24px; letter-spacing: 0.05rem;}
	.ttl h2 span.jp { font-size: 13px; letter-spacing: 0.1rem;}
}


.btn-more { width: 45%; max-width: 400px; margin: 0 auto;}
.btn-more a { display: block; border: solid 1px #373737;
 color: #373737; font-size: clamp(15px,1.8vw,21px); letter-spacing: 0.15rem; line-height: 1.4; text-align: center; text-decoration: none; transition: 0.3s ease;
}
.btn-more a span { display: block; padding: 15px 0;}
.btn-more a:hover{ background: #373737; color: #fff;}
@media (max-width: 801px) {
	.btn-more a span { padding: 12px 0;}
}
@media (max-width: 481px) {
	.btn-more a { font-size: 13px; letter-spacing: 0.05rem;}
	.btn-more a span { padding: 6px 0;}
}

.slick-arrow{ width: 30px; height: 30px; position: absolute; z-index: 90;
 background: transparent; border: none;
 text-indent: -9999em; outline: none;
}
.slick-arrow:before{ position: absolute; content: ''; display: block; width: 12px; height: 12px; top: 50%;
 transform: translateY(-50%) rotate(45deg);}
.slick-prev:before { left: 30%; border-bottom: solid 2px #191919; border-left: solid 2px #191919;}
.slick-next:before { right: 30%; border-top: solid 2px #191919; border-right: solid 2px #191919;}



#kv .inner-kv { position: relative; background: #191919;}
#kv .ctn { position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
#kv .ctn .inner { position: relative; width: 100%; height: 100%;}
#kv .ctn .txt { position: absolute; left: 0; top: 50%; transform: translateY(-85%); z-index: 2; width: 100%; text-align: center;}
#kv .ctn .txt h1 { text-align: center;}
#kv .ctn .txt h1 img { width: 50%; max-width: 580px; margin: 0 auto;}
#kv .bg { position: relative; width: 100%; padding-top: 100svh; z-index: 1;
 background-position: 50% 50%; background-repeat: no-repeat; background-size: cover;
}

#kv .news { position: absolute; left: 0; bottom: 0; width: 100%; background: linear-gradient(transparent, rgba(0,0,0,0.5)); z-index: 2;}
#kv .news .inner { width: 100%; max-width: 1200px; margin: 0 auto; padding: 80px 40px;}
#kv .news h3.tit { margin-bottom: 20px; line-height: 1;}
#kv .news h3.tit span { display: inline-block; vertical-align: baseline;}
#kv .news h3.tit span.eng{ margin-right: 20px; color: #00b4a5; font-size: clamp(24px,5.0vw,42px); letter-spacing: 0.08rem;}
#kv .news h3.tit span.jp { color: #fff; font-size: clamp(16px,2.0vw,20px); letter-spacing: 0.15rem;}
#kv .news p.more { font-size: clamp(24px,3.0vw,30px);}
#kv .news p.more a { color: #fff; text-decoration: none;}
#kv .news p.more a:hover { text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px;}
#kv .news dl { margin-bottom: 20px;}
#kv .news dl dt,
#kv .news dl dd { color: #fff;}
#kv .news dl dt { margin-bottom: 12px; font-size: clamp(16px,2.1vw,21px); line-height: 1.4; letter-spacing: 0.15rem;}
#kv .news dl dd { font-size: 24px; line-height: 1;}
#kv .news dl dd span.tag,
#kv .news dl dd time { display: inline-block; font-size: 14px;}
#kv .news dl dd span.tag { padding-right: 15px; border-right: solid 1px #969696;}
#kv .news dl dd time { padding: 0 15px;}
#kv .slick-dots { bottom: 30px; z-index: 10;}
#kv .slick-dots li {}
#kv .slick-dots li button { width: 16px; height: 16px; background: #fff; border-radius: 50%;}
#kv .slick-dots li.slick-active button { background: #00b4a5;}
@media (max-width: 801px) {
	#kv .ctn .txt { transform: translateY(-40%);}
	#kv .news .inner { padding: 20px 32px 60px;}
	#kv .news dl dt { font-size: 21px; letter-spacing: 0.1rem;}
	#kv .news dl dd { font-size: 18px;}
	#kv .news dl dd span.tag,
	#kv .news dl dd time { font-size: 16px;}
}
@media (max-width: 481px) {
	#kv .news .inner { padding: 12px 28px 40px;}
	#kv .news p.tit { margin-bottom: 12px;}
	#kv .news p.tit span.eng{ margin-right: 12px; font-size: 24px; letter-spacing: 0.05rem;}
	#kv .news p.tit span.jp { font-size: 13px; letter-spacing: 0.1rem;}

	#kv .news dl dt { margin-bottom: 8px; font-size: 12px;}
	#kv .news dl dd { font-size: 10px;}
	#kv .news dl dd span.tag,
	#kv .news dl dd time { font-size: 10px;}
	#kv .news dl dd span.tag { padding-right: 8px;}
	#kv .news dl dd time { padding: 0 8px;}
	#kv .news p.more { font-size: 14px;}

	#kv .slick-dots { bottom: 20px;}
	#kv .slick-dots li button { width: 12px; height: 12px;}
}


#event .inner-sct { padding: 120px 0px;}
#event .ttl { margin-bottom: 40px;}
#event .ctn { width: 100%; margin-bottom: 80px;}
#event .slider-1 { padding-bottom: 40px;}
#event .box { padding: 0 20px;}
#event .box .box-link { display: block; color: inherit; text-decoration: none;}
#event .box figure { position: relative; display: block; width: 100%; max-width: 450px; margin: 0 auto; padding-top: 100%; overflow: hidden; background: #f5f5f5; text-align: center;}
#event .box figure img { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; height: auto; transition: 0.8s ease;}
#event .box figure img.none { padding: 30px;}
#event .box .box-link:hover figure img { transform: translateY(-50%) scale(1.04); opacity: 0.85;}

#event .box .txt { display: block; width: 100%; max-width: 550px; margin: 0 auto; padding: 40px 15px 30px;}
#event .box .txt p { font-size: clamp(16px,2.0vw,21px); letter-spacing: 0.15rem;}
#event .box ul { width: 100%; max-width: 550px; margin: 0 auto; padding: 20px 15px; border-top: dashed 1px #969696; border-bottom: solid 1px #969696;}
#event .box ul li { position: relative; padding-left: 90px; font-size: clamp(13px,1.4vw,16px); letter-spacing: 0.1rem;}
#event .box ul li span { position: absolute; left: 0;}
#event .slick-num-1 { font-size: 21px; line-height: 1; vertical-align: middle; text-align: center;}
#event .slick-num-1 span { position: relative; display: inline-block; padding: 0 18px;}
#event .slick-num-1 .all-count-1:before { content: ''; display: block; width: 1px; height: 20px; background: #191919;
 position: absolute; left: 0; top: 50%; transform: translateY(-45%) skewX(-20deg);
}
#event .slick-num-1 .now-count-1 { color: #00b4a5;}
#event .slick-arrow{ bottom: -27px; left: 50%; transform: translateX(-50%);}
#event .slick-prev { margin-left: -80px;}
#event .slick-next { margin-left: 80px;}
@media (max-width: 1281px) {
	#event .box .txt { padding: 30px 10px 20px;}
	#event .box ul { padding: 12px 10px;}
}
@media (max-width: 801px) {
	#event .inner-sct { padding: 80px 0px;}
	#event .ttl { margin-bottom: 20px;}
	#event .ctn { margin-bottom: 40px;}
	#event .box { padding: 0 12px;}
	#event .slider-1 { padding-bottom: 40px;}
	#event .slick-num-1 { font-size: 20px;}
	#event .slick-arrow { bottom: -30px;}
}
@media (max-width: 481px) {
	#event .inner-sct { padding: 40px 0px;}
	#event .ctn { margin-bottom: 30px;}
	#event .slider-1 { padding-bottom: 20px;}
	#event .box { padding: 0 8px;}
	#event .box .txt { padding: 12px 10px 8px;}
	#event .box .txt p { font-size: 14px;}
	#event .box ul { padding: 8px 10px;}
	#event .box ul li { padding-left: 60px; font-size: 12px; letter-spacing: 0.05rem;}
	#event .slick-num-1 { font-size: 14px;}
	#event .slick-num-1 .all-count-1:before { width: 1px; height: 18px;}
	#event .slick-arrow { bottom: -23px;}
	#event .slick-prev { margin-left: -60px;}
	#event .slick-next { margin-left: 60px;}
}



#works { background: #373737;}
#works .inner-sct { padding: 100px 0;}
#works .ttl { margin-bottom: 60px;}
#works .ttl h2 span.jp { color: #fff;}
#works .ctn-1 { display: flex; justify-content: space-between; width: 100%; max-width: 1100px; margin: 0 auto 40px;}
#works .box-1 { width: 50%;}
#works .box-1 dl { padding: 30px 20px;}
#works .ctn-2 { display: flex; justify-content: space-between; width: 100%; max-width: 1100px; margin: 0 auto 40px;}
#works .box-2 { width: 33.33334%;}
#works .box-2 dl { padding: 30px 20px;}
#works .box figure { position: relative; width: 100%; background: #fff;}
#works .box figure a { position: relative; display: block; width: 100%; padding-top: 60%; overflow: hidden;}
#works .box figure a img { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; object-fit: cover; transform: translate(-50%,-50%); transition: 0.8s ease;}
#works .box figure a img.none { height: 75%;}
#works .box dl { color: #fff;}
#works .box dl dt { margin-bottom: 20px; font-size: clamp(16px,2.0vw,20px); letter-spacing: 0.1rem;}
#works .box dl dt span.city { display: block; margin-bottom: 12px; font-size: clamp(12px,1.6vw,14px); letter-spacing: 0.2rem;}
#works .box dl dd.txt { margin-bottom: 30px;  font-size: clamp(12px,1.4vw,14px); letter-spacing: 0.15rem;}
#works .box dl dd.more{ font-size: clamp(20px,2.4vw,24px);}
#works .box dl dd.more a { color: #fff; text-decoration: underline; text-decoration-color: #00b4a5; text-underline-offset: 3px; text-decoration-thickness: 1px;}
#works .box dl dd.more a:hover { text-decoration: none;}
#works .btn-more a { border-color: #fff; color: #fff;}
#works .box figure a:hover img { transform: translate(-50%,-50%) scale(1.08); opacity: 0.8;}
#works .btn-more a:hover { background: #fff; color: #191919;}
@media (max-width: 1281px) {
	#works .box-1 dl { padding: 30px 40px;}
	#works .box-2 dl { padding: 20px; padding-left: 30px;}
}
@media (max-width: 801px) {
	#works .inner-sct { padding: 80px 0;}
	#works .ttl { margin-bottom: 52px;}
	#works .ctn-1 { display: block; margin: 0 auto;}
	#works .box-1 { width: 100%;}
	#works .ctn-2 { display: none;}
}
@media (max-width: 481px) {
	#works .inner-sct { padding: 40px 0;}
	#works .ttl { margin-bottom: 12px;}
	#works .box-1 dl { padding: 20px 20px 30px;}
	#works .box dl dt { margin-bottom: 12px; font-size: 14px;}
	#works .box dl dt span.city { margin-bottom: 12px; font-size: 12px;}
	#works .box dl dd.txt { margin-bottom: 20px; font-size: 12px;}
	#works .box dl dd.more{ font-size: 18px;}
}



/* ── YouTube Channel ── */
#youtube-chn { background: #00b4a5; }
#youtube-chn .inner-sct { padding: 90px 0; }
#youtube-chn .ctn { display: flex; align-items: center; gap: 60px; width: 88%; max-width: 1100px; margin: 0 auto; }

/* テキストブロック */
#youtube-chn .yt-txt { flex-shrink: 0; width: 360px; color: #fff; }
#youtube-chn .yt-label { margin-bottom: 16px; font-size: 13px; letter-spacing: 0.2rem; color: #fff; font-weight: 600; opacity: 0.75; }
#youtube-chn .yt-txt h2 { margin-bottom: 24px; font-size: clamp(18px, 2.4vw, 28px); font-weight: 600; letter-spacing: 0.08rem; line-height: 1.5; }
#youtube-chn .yt-desc { font-size: 14px; line-height: 2.0; color: rgba(255,255,255,0.75); margin-bottom: 36px; }
#youtube-chn .yt-btn a { display: inline-block; padding: 14px 36px; border: solid 1px #fff; background: transparent; color: #fff; font-size: 14px; letter-spacing: 0.12rem; text-decoration: none; transition: 0.3s ease; }
#youtube-chn .yt-btn a:hover { background: #fff; color: #00b4a5; }
#youtube-chn .yt-btn a span { display: inline-block; }

/* YouTubeロゴ（サムネイル未設定時のフォールバック） */
#youtube-chn .yt-icon { flex-shrink: 0; width: 200px; }
#youtube-chn .yt-icon img { width: 100%; }

/* サムネイルグリッド */
#youtube-chn .yt-thumbs { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
#youtube-chn .yt-th-item { position: relative; display: block; overflow: hidden; }
#youtube-chn .yt-th-item::before { content: ''; display: block; padding-top: 56.25%; /* 16:9 */ }
#youtube-chn .yt-th-item img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: 0.4s ease; }
#youtube-chn .yt-th-item:hover img { opacity: 0.72; transform: scale(1.04); }

/* 再生ボタン */
#youtube-chn .yt-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 46px; height: 46px; background: rgba(200,0,0,0.85); border-radius: 50%; transition: 0.3s ease; pointer-events: none; }
#youtube-chn .yt-play::after { content: ''; position: absolute; top: 50%; left: 55%;
  transform: translate(-50%, -50%);
  border-style: solid; border-width: 9px 0 9px 17px; border-color: transparent transparent transparent #fff; }
#youtube-chn .yt-th-item:hover .yt-play { background: #ff0000; transform: translate(-50%, -50%) scale(1.12); }

@media (max-width: 1001px) {
	#youtube-chn .yt-txt { width: 300px; }
	#youtube-chn .ctn { gap: 40px; }
}
@media (max-width: 801px) {
	#youtube-chn .inner-sct { padding: 60px 0; }
	#youtube-chn .ctn { flex-direction: column; gap: 40px; text-align: center; }
	#youtube-chn .yt-txt { width: 100%; }
	#youtube-chn .yt-icon { width: 160px; margin: 0 auto; }
	#youtube-chn .yt-thumbs { width: 100%; }
}
@media (max-width: 481px) {
	#youtube-chn .inner-sct { padding: 40px 0; }
	#youtube-chn .yt-icon { width: 120px; }
	#youtube-chn .yt-txt h2 { font-size: 18px; }
	#youtube-chn .yt-desc { font-size: 12px; }
	#youtube-chn .yt-btn a { padding: 12px 28px; font-size: 13px; }
	#youtube-chn .yt-play { width: 36px; height: 36px; }
	#youtube-chn .yt-play::after { border-width: 7px 0 7px 13px; }
}

#voice .inner-sct { padding: 120px 0px;}
#voice .ttl { margin-bottom: 60px;}
#voice .ctn { display: flex; /* justify-content: space-between; */ width: 100%; max-width: 1720px; margin: 0 auto 60px;}
#voice .box { width: 20%; border: solid 0.5px #969696; border-left: 0px;}
/* ---- COMING SOON placeholders ---- */
#voice .box.box-coming { position: relative;}
#voice .box.box-coming .sp-no { display: none;}
#voice .box.box-coming .coming-inner { position: relative; display: block; width: 100%;}
#voice .box.box-coming figure { position: relative; width: 100%; padding-top: 104%; overflow: hidden;}
#voice .box.box-coming figure .coming-icon { position: absolute; left: 50%; top: 42%; transform: translate(-50%,-50%); width: 55%; max-width: 180px; line-height: 0; opacity: 0.72;}
#voice .box.box-coming figure .coming-icon svg { width: 100%; height: auto; display: block;}
#voice .box.box-coming figure .coming-soon { position: absolute; left: 50%; bottom: 18%; transform: translateX(-50%);
  font-size: clamp(15px,1.6vw,20px); letter-spacing: 0.2rem; text-align: center; line-height: 1.3; font-weight: 600;
}
#voice .box.box-coming dl { position: relative; width: 100%; padding: 40px 50px;}
#voice .box.box-coming dl dt { height: 6.5em; color: transparent;}
#voice .box.box-coming dl dd.city { position: relative; margin-bottom: 10px; padding-left: 28px; font-size: clamp(12px,1.4vw,14px); color: transparent;}
#voice .box.box-coming dl dd.city:before { content: ''; display: block; width: 20px; height: 20px; border-radius: 50%; position: absolute; left: 0; top: 0;}
#voice .box.box-coming dl dd.aside { position: relative; padding-left: 16px; font-size: clamp(12px,1.2vw,16px); line-height: 1;}
#voice .box.box-coming dl dd.aside span.no { display: block; width: 20px; height: 20px; border-radius: 50%; color: transparent; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
#voice .box.box-coming dl dd.aside span.tag { display: inline-block; padding: 0 15px; font-size: clamp(12px,1.2vw,16px); border-right: solid 1px currentColor; opacity: 0.8;}
#voice .box.box-coming dl dd.aside time { display: inline-block; padding: 0 15px; font-size: clamp(12px,1.2vw,16px);}

/* Variant 1: Lightest teal */
#voice .box.box-coming-1 { background: linear-gradient(160deg, #f5fcfb 0%, #e0f2ef 100%);}
#voice .box.box-coming-1 .coming-icon { color: #7ec0bb;}
#voice .box.box-coming-1 .coming-soon { color: #5ba39e;}
#voice .box.box-coming-1 dl dd.city:before { background: #7ec0bb; opacity: 0.6;}
#voice .box.box-coming-1 dl dd.aside { color: #5ba39e;}
#voice .box.box-coming-1 dl dd.aside span.no { background: #7ec0bb;}

/* Variant 2: Light teal */
#voice .box.box-coming-2 { background: linear-gradient(160deg, #e8f5f3 0%, #c8e6e1 100%);}
#voice .box.box-coming-2 .coming-icon { color: #52ada6;}
#voice .box.box-coming-2 .coming-soon { color: #358a83;}
#voice .box.box-coming-2 dl dd.city:before { background: #52ada6; opacity: 0.6;}
#voice .box.box-coming-2 dl dd.aside { color: #358a83;}
#voice .box.box-coming-2 dl dd.aside span.no { background: #52ada6;}

/* Variant 3: Medium teal */
#voice .box.box-coming-3 { background: linear-gradient(160deg, #d4ece8 0%, #a8d6ce 100%);}
#voice .box.box-coming-3 .coming-icon { color: #2d9892;}
#voice .box.box-coming-3 .coming-soon { color: #127169;}
#voice .box.box-coming-3 dl dd.city:before { background: #2d9892; opacity: 0.6;}
#voice .box.box-coming-3 dl dd.aside { color: #127169;}
#voice .box.box-coming-3 dl dd.aside span.no { background: #2d9892;}

/* Variant 4: Deep teal */
#voice .box.box-coming-4 { background: linear-gradient(160deg, #b9dcd7 0%, #88c4bc 100%);}
#voice .box.box-coming-4 .coming-icon { color: #006e78;}
#voice .box.box-coming-4 .coming-soon { color: #00525a;}
#voice .box.box-coming-4 dl dd.city:before { background: #006e78; opacity: 0.6;}
#voice .box.box-coming-4 dl dd.aside { color: #00525a;}
#voice .box.box-coming-4 dl dd.aside span.no { background: #006e78;}

@media (max-width: 641px) {
  #voice .box.box-coming .sp-no { display: block; width: 24px; height: 24px; border-radius: 50%; color: #fff; text-align: center; line-height: 24px; position: absolute; right: 20px; top: 20px; z-index: 2;}
  #voice .box.box-coming-1 .sp-no { background: #7ec0bb;}
  #voice .box.box-coming-2 .sp-no { background: #52ada6;}
  #voice .box.box-coming-3 .sp-no { background: #2d9892;}
  #voice .box.box-coming-4 .sp-no { background: #006e78;}
  #voice .box.box-coming .coming-inner { display: flex; justify-content: space-between; align-items: center;}
  #voice .box.box-coming figure { width: 52%; padding-top: 54%;}
  /* スマホ表示では最初の2件のみ表示（お客様の声＋COMING SOON 1件） */
  #voice .ctn .box:nth-child(n+3) { display: none;}
}
#voice .box a { position: relative; display: block; width: 100%; text-decoration: none;}
#voice .box a span.sp-no { display: none; width: 24px; height: 24px;
 position: absolute; right: 20px; top: 20px; background: #00b4a5; border-radius: 50%;
 color: #fff; font-size: 20px; line-height: 24px; text-align: center; text-indent: -0.1em;
}
#voice .box a figure { position: relative; width: 100%; padding-top: 104%; overflow: hidden;}
#voice .box a figure img { position: absolute; left: 50%; top: 50%; width: auto; height: 100%; transform: translate(-50%,-50%);}
#voice .box a figure img.none { width: 80%; height: auto;}
#voice .box a dl { position: relative; width: 100%; padding: 40px 50px;}
#voice .box a dl dt { height: 6.5em; font-size: clamp(14px,1.2vw,18px); line-height: 1.8; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1.5px;}
#voice .box a dl dd.city { position: relative; margin-bottom: 10px; padding-left: 28px; font-size: clamp(12px,1.4vw,14px);}
#voice .box a dl dd.city:before { content: ''; display: block; width: 20px; height: 20px; border-radius: 50%;
	border: solid 5px #006e78; position: absolute; left: 0; top: 0.15em;
}
#voice .box a dl dd.aside { position: relative; padding-left: 16px; font-size: clamp(12px,1.2vw,16px); line-height: 1;}
#voice .box a dl dd.aside span.no { display: block; width: 20px; height: 20px; background: #00b4a5; border-radius: 50%;
 position: absolute; left: 0; top: 0;
 color: #fff; font-size: clamp(12px,1.8vw,18px); line-height: 20px; text-align: center; text-indent: -0.1em;
}
#voice .box a dl dd.aside span.tag,
#voice .box a dl dd.aside time { display: inline-block; padding: 0 15px; font-size: clamp(12px,1.2vw,16px);}
#voice .box a dl dd.aside span.tag { border-right: solid 1px #969696;}

#voice .box a:hover figure img { opacity: 0.8;}
#voice .box a:hover dl dt { text-decoration: none;}
@media (max-width: 1281px) {
	#voice .ctn { flex-wrap: wrap;}
	#voice .box { width: 50%;}
	#voice .box a dl { padding: 20px 30px 40px;}
}
@media (max-width: 801px) {
	#voice .inner-sct { padding: 80px 0px;}
	#voice .ttl { margin-bottom: 60px;}
	#voice .ctn { display: block; margin-bottom: 40px; border-top: solid 0.5px #969696;}
	#voice .box { width: 100%; border: 0px; border-bottom: solid 0.5px #969696;}
	#voice .box a { display: flex; justify-content: space-between; align-items: center;}
	#voice .box a span.sp-no { display: block;}
	#voice .box a figure { width: 52%; padding-top: 54%;}
	#voice .box a dl { width: 48%; height: 100%;}
	#voice .box a dl dt { margin-bottom: 10px; height: auto; font-size: 2.6vw;}
	#voice .box a dl dd.city { margin-bottom: 20px;}
	#voice .box a dl dd.aside { padding-left: 0;}
	#voice .box a dl dd.aside span.no { display: none;}
	#voice .box a dl dd.aside span.tag { padding-left: 0px;}
}
@media (max-width: 481px) {
	#voice .inner-sct { padding: 40px 0px;}
	#voice .ttl { margin-bottom: 12px;}
	#voice .ctn { margin-bottom: 20px;}
	#voice .box a figure { width: 48%; padding-top: 52%;}
	#voice .box a figure img.none { width: 72%;}
	#voice .box a dl { width: 52%; padding: 20px; padding-right: 10px;}
	#voice .box a dl dt { font-size: 12px; text-underline-offset: 3px; text-decoration-thickness: 1px;}
	#voice .box a dl dd.city { margin-bottom: 6px; padding-left: 20px; font-size: 10px;}
	#voice .box a dl dd.city:before { width: 12px; height: 12px; border-width: 3px; top: 0.15em;}
	#voice .box a dl dd.aside { font-size: 10px;}
	#voice .box a dl dd.aside span.tag,
	#voice .box a dl dd.aside time { padding: 0 8px;}
	#voice .box a dl dd.aside span.tag { padding-left: 0px;}
}


#staff { background: #dbf2f0;}
#staff .inner-sct { padding: 120px 0px;}
#staff .ttl { margin-bottom: 60px;}
#staff .ctn { margin-bottom: 60px; overflow: hidden;}
#staff .bloc { overflow: hidden; margin-bottom: 10px; }
#staff .marquee-track {
  display: flex !important;
  width: max-content;
  animation: marqueeLeft 30s linear infinite;
}
#staff .marquee-track.marquee-right {
  animation: marqueeRight 30s linear infinite;
}
#staff .marquee-track > div {
  flex-shrink: 0;
  width: 588px;
  padding: 0 5px;
  box-sizing: border-box;
}
@keyframes marqueeLeft {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
@keyframes marqueeRight {
  0% { transform: translateX(-50%); }
  100% { transform: translateX(0); }
}
@media (max-width: 801px) {
  #staff .marquee-track > div { width: 476px; }
}
@media (max-width: 481px) {
  #staff .marquee-track > div { width: 392px; }
  #staff .marquee-track { animation-duration: 20s; }
}
#staff dl { display: table; width: 100%;}
#staff dl dt,
#staff dl dd { display: table-cell;}
#staff dl.top dt,
#staff dl.top dd { vertical-align: top;}
#staff dl.bottom dt,
#staff dl.bottom dd { vertical-align: bottom;}
#staff dl dt { width: 55%; background: #fff;}
#staff dl dd {}
#staff dl dt img { width: 100%;}
#staff dl dt img.none { padding: 20px;}
#staff dl dd { width: 45%; padding: 20px; font-size: 14px; text-align: left;}
#staff dl dd span { display: block;}
#staff dl dd span.staff-name-jp { font-size: 18px; font-weight: 700; letter-spacing: 0.1rem; margin: 6px 0;}
#staff dl dd span.eng { font-size: 20px; line-height: 1.2;}
@media (max-width: 1001px) {
	#staff .ttl { margin-bottom: 60px;}
}
@media (max-width: 801px) {
	#staff .inner-sct { padding: 80px 0px;}
	#staff .ttl { margin-bottom: 40px;}
}
@media (max-width: 641px) {
	#staff dl dd { padding: 12px; font-size: 14px;}
	#staff dl dd span.eng { font-size: 16px;}
}
@media (max-width: 481px) {
	#staff .inner-sct { padding: 40px 0px;}
	#staff .ttl { margin-bottom: 20px;}
	#staff dl dd { font-size: 10px;}
}



#about .ctn { margin-bottom: 80px;}
@media (max-width: 801px) {
	#about .ctn { margin-bottom: 40px;}
}
@media (max-width: 481px) {
	#about .ctn { margin-bottom: 20px;}
}

#model { background: #cacaca; display: none;}
#model .inner-sct { padding: 120px 0;}
#model .ttl { margin-bottom: 40px;}
#model .ctn { display: flex; justify-content: space-between; width: 92%; max-width: 1200px; margin: 0 auto;}
#model .box { width: 48.5%; padding: 10px 0;}
#model .box a { display: block; color: #fff; text-decoration: none;}
#model .box a dl { position: relative; }
#model .box a dl dt { position: absolute; left: 0; top: 0; width: 100%; padding: 30px; z-index: 2;}
#model .box a dl dt span { display: inline-block; line-height: 1; vertical-align: middle;}
#model .box a dl dt span.eng { margin-right: 20px; font-size: clamp(32px,4.2vw,50px);}
#model .box a dl dt span.jp { font-size: clamp(14px,2.1vw,21px); }
#model .box a dl dd.img { position: relative; width: 100%; z-index: 1;}
#model .box a dl dd.img img { width: 100%;}
#model .box a:hover dl dd.img img { opacity: 0.8;}
@media (max-width: 1001px) {
	#model .box a dl dt { padding: 12px 20px;}
	#model .box a dl dt span.eng { margin-right: 20px;}
}
@media (max-width: 801px) {
	#model .inner-sct { padding: 80px 0px;}
	#model .ttl { margin-bottom: 40px;}
	#model .ctn { display: block;}
	#model .box { width: 100%;}
}
@media (max-width: 481px) {
	#model .inner-sct { padding: 40px 0px;}
	#model .ttl { margin-bottom: 12px;}
	#model .box { padding: 4px 0;}
	#model .box a dl dt { padding: 15px	 20px;}
	#model .box a dl dt span.eng { margin-right: 12px; font-size: 30px;}
	#model .box a dl dt span.jp { font-size: 12px;}
}


#column { background: #e0f2ef;}
#column .inner-sct { padding: 120px 0px;}
#column .ttl { margin-bottom: 40px;}
#column .ctn { width: 100%; margin-bottom: 60px;}
#column .slider-2 { padding-bottom: 40px;}
#column .slick-track { border-top: solid 0.5px #969696; border-bottom: solid 0.5px #969696;}
#column .box { border-right: solid 0.5px #969696;}
#column .box a { display: block; width: 100%; text-decoration: none;}
#column .box a dl dt { position: relative; width: 100%; padding-top: 65%; overflow: hidden;}
#column .box a dl dt img { width: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); transition: 0.8s ease;}
#column .box a dl dt img.none { width: 72%;}
#column .box a dl dd.no { padding: 18px 60px; color: #006e78; font-size: 21px; line-height: 1;}
#column .box a dl dd.tit{ padding: 0px 60px; min-height: 4.5em; font-size: 21px; letter-spacing: 0.15rem; line-height: 1.4; text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px;}
#column .box a dl dd.aside { padding: 18px 40px; line-height: 1; text-align: right;}
#column .box a dl dd.aside span,
#column .box a dl dd.aside time { display: inline-block; padding: 0 12px; font-size: 18px;}
#column .box a dl dd.aside span { border-right: solid 0.8px #969696;}
#column .slick-num-2 { font-size: 21px; line-height: 1; vertical-align: middle; text-align: center;}
#column .slick-num-2 span { position: relative; display: inline-block; padding: 0 18px;}
#column .slick-num-2 .all-count-2:before { content: ''; display: block; width: 1px; height: 20px; background: #191919;
 position: absolute; left: 0; top: 50%; transform: translateY(-45%) skewX(-20deg);
}
#column .slick-num-2 .now-count-2 { color: #00b4a5;}
#column .slick-arrow { bottom: -27px; left: 50%; transform: translateX(-50%);}
#column .slick-prev { margin-left: -80px;}
#column .slick-next { margin-left: 80px;}

#column .box a:hover dl dt img { transform: translate(-50%,-50%) scale(1.06); opacity: 0.85;}
#column .box a:hover dl dd.tit { text-decoration: none;}
@media (max-width: 1281px) {
	#column .box a dl dd.no { padding: 12px 40px;}
	#column .box a dl dd.tit{ padding: 0px 40px; font-size: 1.85vw;}
	#column .box a dl dd.aside { padding: 12px 30px;}
	#column .box a dl dd.aside span,
	#column .box a dl dd.aside time { font-size: 1.4vw;}
}
@media (max-width: 801px) {
	#column .inner-sct { padding: 80px 0;}
	#column .ttl { margin-bottom: 40px;}
	#column .ctn { margin-bottom: 40px;}
	#column .slider-2 { padding-bottom: 40px;}
	#column .slick-num-2 { font-size: 20px;}
	#column .slick-arrow { bottom: -30px;}
}
@media (max-width: 481px) {
	#column .inner-sct { padding: 40px 0px;}
	#column .ttl { margin-bottom: 20px;}
	#column .ctn { margin-bottom: 20px;}
	#column .slider-2 { padding-bottom: 30px;}
	#column .box a dl dd.no { padding: 12px 20px 6px; font-size: 10px;}
	#column .box a dl dd.tit{ padding: 0px 20px; font-size: 13px;}
	#column .box a dl dd.aside { padding: 12px;}
	#column .box a dl dd.aside span,
	#column .box a dl dd.aside time { font-size: 10px;}
	#column .slick-num-2 { font-size: 14px;}
	#column .slick-num-2 .all-count-2:before { width: 1px; height: 18px;}
	#column .slick-arrow { bottom: -23px;}
	#column .slick-prev { margin-left: -60px;}
	#column .slick-next { margin-left: 60px;}
}



#news { background: #f5fcfb;}
#news .inner-sct { padding: 120px 0;}
#news .ttl { margin-bottom: 30px;}
#news .ctn { width: 90%; max-width: 1000px; margin: 0 auto 50px;}
#news .ctn ul li { position: relative; padding: 20px; padding-left: 150px; border-bottom: solid 0.5px #c4c4c4; font-size: 18px;}
#news .ctn ul li:last-child { border-bottom: none;}
#news .ctn ul li time { position: absolute; left: 0;}
#news .ctn ul li a {}
#news .ctn ul li a:hover { text-decoration: none;}
@media (max-width: 1281px) {
	#news .ctn ul li { padding: 20px; padding-left: 150px;}
}
@media (max-width: 801px) {
	#news .inner-sct { padding: 100px 0;}
	#news .ttl { margin-bottom: 40px;}
}
@media (max-width: 641px) {
	#news .ctn ul li { padding: 12px; padding-left: 120px; font-size: 16px;}
}
@media (max-width: 481px) {
	#news .inner-sct { padding: 40px 0;}
	#news .ttl { margin-bottom: 12px;}
	#news .ctn { margin-bottom: 20px;}

	#news .ctn ul li { padding: 8px; padding-left: 80px; font-size: 12px;}
}