:root {
  --accent-color:#4574c4 !important;
  --sub-accent-color:#05B63B !important;
  --sub-green-color: #0D967E;
  --bg-green-color:#2fbe2f;
}


/* ================================================================================================================================ 
 * 全体
 * ================================================================================================================================ */

/* [spbr]/[pcbr] 用のレスポンシブ改行 */
br.cbr-sp,
br.cbr-pc { display: inline; }

/* スマホ幅では PC 用改行を無効化 */
@media (max-width: 767.98px) {
	br.cbr-pc { 
	  display: none; 
	}
	.s-spbr h2 br{
		display:none;
	}
}


@media (min-width: 768px) {
	br.cbr-sp { 
		display: none; /* タブレット/PC幅では スマホ用改行を無効化 */
	}
	.pc-txtCenter{
		text-align:center;
	}
}



/* ヘッダー ------------------------------------------------------------------ */
h1.c-site-branding__title {
    padding-top: 16px;
    padding-bottom: 16px;
}
.home .l-header{
	background-color: rgba(255,255,255,0.8) !important;
/*     border-radius: 5px; */
    margin-top: 10px;
    margin-right: 15px;
    margin-left: 15px;
    box-shadow: 0px 0px 10px 1px rgb(0 0 0 / 20%);
}
.p-global-nav .c-navbar__item.sm-nav-menu-item-highlight{
	background:var(--sub-accent-color);
}

/* 背景を黒 */
/* .page-template-one-column .l-header,
.post-template-default .l-header,
.blog .l-header{
  background-color: #141414;
}
.page-template-one-column .l-header li a,
.post-template-default .l-header li a,
.blog .l-header li a{
  color: #fff !important;
}

[data-scrolled=true] .l-header--sticky-overlay-colored-sm{
	 background-color: #141414 !important;
}

[data-scrolled=true] .l-header--sticky-overlay-colored-sm li a{
  color: #fff !important;
}
*/

/* フッター ------------------------------------------------------------------*/
footer .l-footer-widget-area {
    padding: 0 !important;
}
footer .c-fluid-container {
    padding: 0;
}
.l-footer--default .c-copyright{
	background-color: var(--sub-green-color);
}

@media (max-width: 639px) {
	.footer-banners .c-row .c-row__col:nth-of-type(3) { order: 4; }
	.footer-banners .c-row .c-row__col:nth-of-type(4) { order: 3; }
}


/* フッターメニュー ------------------------------------------------------------------*/
@media (max-width: 1023px){

  .c-sub-nav .c-navbar{
    justify-content: center !important;
  }
}
.p-footer-sub-nav {
  background-color:var(--sub-green-color);
}
.p-footer-sub-nav li{
  padding-left: 20px;
  padding-right: 15px;
}
.p-footer-sub-nav .c-navbar__item a{
  font-size: 14px;
  color: #fff !important;
}

/* ボタン ------------------------------------------------------------------*/
a.smb-btn{
  padding-top: 15px;
  padding-bottom: 15px;
}

/* .top-news {
  margin-top: -100px !important;
  color: #fff;
  display: flex;
}
.top-news .smb-container__body{
  display: inline-block;
}
.top-news .smb-recent-posts {
  padding: 10px 40px;
  background-color: rgba(0, 0, 0, 0.3);
}
.top-news ul{
  border-top: none;
}
.top-news li{
  border-bottom: none !important;
} */

.btn-position{
	justify-content:center;
	margin-top:24px;
}

/* 下層ページ */
.c-page-header{
  height: clamp(200px,62.5vw,300px) !important;
}
.c-page-header__bgimage>img{
  filter: brightness(0.5);
}

/* インタビューページ */
.interview-top{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.smb-section__title:after{
	height:3px;
	border-radius:50%;
}

/* ================================================================================================================================ 
 * TOP
 * ================================================================================================================================ */

/* FV ------------------------------------------------------------------*/
#fv .smb-section__subtitle{
	font-size:18px;
}
#fv h2.smb-section__title{
	font-size:48px;
	text-shadow:
		0 0 10px rgba(0, 0, 0, 0.55),
		0 0 15px rgba(0, 0, 0, 0.4),
		0 0 20px  rgba(0, 0, 0, 0.35),
		0 0 25px rgba(0, 0, 0, 0.25)
}
#fv .smb-section__lede{
	font-size:20px;
	text-shadow:
		0 0 10px rgba(0, 0, 0, 0.5),
		0 0 15px rgba(0, 0, 0, 0.4),
		0 0 20px  rgba(0, 0, 0, 0.35),
		0 0 25px rgba(0, 0, 0, 0.25)
}
@media(max-width:639px){
	#fv .smb-section__subtitle{
		font-size:16px;
	}
	#fv h2.smb-section__title{
		font-size:28px;		
	}
	#fv .smb-section__lede{
		font-size:18px;
	}

}
/* FV　装飾txt------------------------------------------------------------------ */
#fv .smb-section__background-text{
    display: flex;
    align-items: flex-end;
}
:root{
  --marquee-duration: 100s; /* 小さいほど速い */
  --marquee-gap: 4rem;     /* 文の間隔 */
  --marquee-text: "Create a comfortable and safe sanitary environment Create a comfortable and safe sanitary environment Create a comfortable and safe sanitary environment";
}

/* ビューをはみ出した分を隠す */
#fv .smb-section__background-text{
  overflow: hidden;
  /* 端を少しフェードさせたい場合（任意） */
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
}


#fv .smb-section__background-text__text{
  position: relative;
  display: flex;   
  align-items: center;
  white-space: nowrap;
  /* 元テキストは視覚的に隠す（疑似要素だけを見せる）*/
}

#fv .smb-section__background-text__text::before{
  content: var(--marquee-text);
  flex: 0 0 auto;
  display: inline-block;
  white-space: nowrap;
  padding-right: var(--marquee-gap);
  font-size:8rem;
  will-change: transform;
  animation: marquee var(--marquee-duration) linear infinite;
}


/* 低速ポリシー尊重（ユーザーがアニメ無効化時） */
@media (prefers-reduced-motion: reduce){
  #fv .smb-section__background-text__text::before{
    animation: none !important;
    transform: none !important;
  }
}

/* 左方向に流すアニメーション */
@keyframes marquee{
  from{ transform: translateX(0); }
  to  { transform: translateX(-100%); } /* 自身の幅ぶん左へ */
}

@media(max-width:639px){
	#fv .smb-section__background-text__text::before{
		font-size:6rem;
	}
}

/* about ------------------------------------------------------------------*/
.p-3col-imgBox .c-row .wp-block-image {
  aspect-ratio:4/3;
  width: 100%;
  display: block;
  overflow: hidden;
}

.p-3col-imgBox .c-row .wp-block-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;   /* アスペクト比保持＋トリミング */
  object-position: center; /* 中央でトリミング */
  display: block;
}

/* ================================================================================================================================ 
 * お問い合わせフォーム
 * ================================================================================================================================ */
div#autozip {
    display: none !important;
}

/* ================================================================================================================================ 
 * 各サービスのサービス紹介コンテンツ
 * ================================================================================================================================ */

.page-service-panel .smb-panels__item {
  color: #fff;
}

/* 1・3番目（奇数）= accent */
.page-service-panel .c-row__col:nth-of-type(odd) .smb-panels__item {
  background: var(--accent-color);
}

/* 2・4番目（偶数）= bg-green */
.page-service-panel .c-row__col:nth-of-type(even) .smb-panels__item {
  background: var(--sub-green-color);
}
/* PC：1・4=accent／2・3=bg-green に上書き */
@media (min-width: 1024px) {
  .page-service-panel .c-row__col:nth-of-type(1) .smb-panels__item,
  .page-service-panel .c-row__col:nth-of-type(4) .smb-panels__item {
    background: var(--accent-color);
  }
  .page-service-panel .c-row__col:nth-of-type(2) .smb-panels__item,
  .page-service-panel .c-row__col:nth-of-type(3) .smb-panels__item {
    background: var(--sub-green-color);
  }
}
/* 画像の比率を揃える */
.page-service-panel .wp-block-image {
  aspect-ratio: 2 / 1;
  width: 100%;
  margin: 0;
  overflow: hidden;
}

.page-service-panel .wp-block-image img {
  display: block;
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  object-position: 50% 50%; 
}