@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* =========================================================
   ZenLogi top: Additional CSS（整理版・等価動作 + 背景位置指定）
   目的: 重複排除 / セクション化 / メディアクエリ整理
   注記: 既存の見た目を維持しつつ、背景画像は
         - .custom-bg = 上端寄せ（top center）
         - .bg-tr     = 下端寄せ（bottom center）
   ========================================================= */

/* ========== 0) Reset/Utility (最小) ========== */
.c-pageTitle { text-shadow: 1px 1px 2px black; }

/* ========== 1) Header / Logo ========== */
.l-header__logo img { max-height: 40px; height: auto; width: auto; }
.c-gnav { display: flex; justify-content: center; align-items: center; }

/* 追従ロゴの置換（img を隠し、背景画像に差し替え） */
.l-fixHeader__logo img { display: none !important; }
.l-fixHeader__logo {
  background-image: url('/wp-content/uploads/2025/07/logo-sub.png');
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  width: 180px;
  height: 50px;
}

@media (min-width: 960px){
	.c-gnav>.menu-item>a .ttl{
		font-size:18px;
	}
}

/* ========== 2) Main Visual（背景グラデ & テキストレイヤ） ========== */
/* 背景画像そのものは非表示にし、グラデを ::before でかぶせる */
.p-mainVisual__img { opacity: 0 !important; visibility: hidden !important; }
.p-mainVisual__imgLayer { position: relative !important; background: none !important; }
.p-mainVisual__imgLayer::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(45deg, #E02112, #DD8113, #999999);
  background-size: 200% 100%;
  animation: bg-gradient 5s linear infinite alternate;
  z-index: 1;
}
@keyframes bg-gradient { 0% { background-position: 0 0; } 100% { background-position: 100% 0; } }

/* テキストレイヤ（左下寄せ） */
.p-mainVisual__slide { position: relative; }
.p-mainVisual__textLayer,
.p-mainVisual__textLayer.l-container {
  position: absolute !important; inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start;
  gap: .3em; padding: clamp(16px, 3vw, 48px); margin: 0 !important;
  transform: none !important; top: auto !important; max-width: none !important; width: 100% !important;
  z-index: 2; text-shadow: none !important;
}

/* 見出し（上） */
.p-mainVisual__slideTitle {
  order: 0; color: #1E1E1E !important; font-weight: 600 !important;
  font-size: clamp(18px, 2.2vw, 40px) !important; line-height: 1.3;
  width: auto !important; height: auto !important; font-family: Noto Serif JP;
}
/* メインコピー（下） */
.p-mainVisual__slideText {
  order: 1; color: #1E1E1E !important; font-weight: 500 !important;
  font-size: clamp(28px, 6vw, 88px) !important; line-height: 1.15; margin-top: .2em;
  width: auto !important; height: auto !important; font-family: Noto Serif JP;
}

/* 大きなグラデ文字 */
.large-font {
  line-height: 58px;
  background: linear-gradient(to right, #E02112 30%, #DD8113 90%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
  display: inline-block; box-decoration-break: clone; -webkit-box-decoration-break: clone;
}

/* PC only */
@media (min-width: 960px){
	.large-font {
		font-weight: 600; font-size: 48px; }
}
/* SP only */
@media (max-width: 781px){
		.large-font {
		font-weight: 600; font-size: 28px; }
}

/* ========== 3) FullWide 共通レイアウト ========== */
.swell-block-fullWide.alignfull > .swell-block-fullWide__inner {
  max-width: 1200px !important; margin-inline: auto; padding-inline: clamp(16px, 4vw, 32px);
}

/* トップページの背景は該当クラスに限定して指定 */
/* 背景画像 */
.custom-bg {
  background-image: url('./wp-content/uploads/2025/08/bg.png');
  background-size: contain;       /* 全体表示 */
  background-repeat: no-repeat;   /* 繰り返しなし */
  background-position: center bottom; /* 中央揃え＋下端寄せ */
}
/* 右上に背景画像（装飾用） */
/* クラスを追加した例（bg-tr） */
.swell-block-fullWide.alignfull.bg-tr {
  background-image: url('./wp-content/uploads/2025/08/d50c8fc0f42e89294ca5871a30b0ef06ce660e0c-3-e1755058557776.png');
  background-repeat: no-repeat;
  background-position: right top; /* 右上寄せ */
  background-size: 100% auto;      /* 幅をブロックの約半分に */
}


/* ========== 4) About/共通タイポ & 構成 ========== */
/* サブ見出しグラデテキスト */
.about-title { margin: 0 0 12px; text-align: center; line-height: 1.25; }
.about-title .about-sub { display: inline-block; font-size: clamp(12px, 1.6vw, 20px); font-weight: 600;
  background: linear-gradient(to right, #E02112 0%, #DD8113 100%);
  background-size: 100% 100%; background-position: left center; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; color: transparent; }

/* SWELLの見出し装飾をキャンセルして任意デザインへ */
.about-title h2.about-main,
.about-title .wp-block-heading.about-main,
.about-title h2.about-main.is-style-section_ttl,
.about-title h2.about-main[class*="is-style-"] {
  all: unset; display: block; color: #1E1E1E !important; font-weight: 600 !important;
  font-size: clamp(28px, 4.5vw, 36px) !important; line-height: 1.25 !important; letter-spacing: .02em;
  margin: clamp(2px, 0.8vw, 6px) 0 0 !important;
}
.about-title h2.about-main::before,
.about-title h2.about-main::after { content: none !important; }
.about-title br { display: none; }

/* リード文 */
.about-lead { margin: 0 auto clamp(28px, 5vw, 48px); max-width: 820px; color: #666; font-size: clamp(14px, 1.8vw, 16px); line-height: 1.9; }

/* 画像共通 */
.swell-block-fullWide.alignfull .swell-block-column figure img {
  width: 100%; height: auto; display: block; border-radius: 10px; 
}

/* カラム見出し（各カラム最初のセンター見出し） */
.swell-block-fullWide.alignfull .swell-block-column .has-text-align-center:first-of-type {
  margin: clamp(12px, 2.2vw, 20px) 0 8px; font-weight: 700; color: #1E1E1E; font-size: clamp(16px, 2.4vw, 22px); letter-spacing: .03em; line-height: 1.45;
}
/* カラム本文 */
.swell-block-fullWide.alignfull .swell-block-column .has-text-align-center:first-of-type + p {
  color: #666; font-size: 14px; line-height: 1.9; margin: 0; text-align: left;
}

/* 見出し縦中央揃え補助 */
.vc-title { display: flex; align-items: center; justify-content: center; text-align: center; min-height: clamp(48px, 5.2vw, 72px); margin: clamp(12px, 2.2vw, 20px) 0 8px; line-height: 1.45; }

/* ========== 5) Buttons（共通とヘッダー） ========== */
/* 共通ボタン（.btn-gradient） */
.wp-block-button__link.btn-gradient,
.wp-element-button.btn-gradient {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 240px; height: 56px; padding: 0 !important; border-radius: 28px; text-decoration: none;
  font-weight: 700; font-size: 16px; letter-spacing: .08em;
  background: linear-gradient(180deg, #3E5475 0%, #1F3A5F 100%) !important; color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 8px 20px rgba(0,0,0,.12);
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease; overflow: hidden; z-index: 0;
}
.wp-block-button__link.btn-gradient::before,
.wp-element-button.btn-gradient::before {
  content: ""; position: absolute; top: -14px; left: -60px; width: calc(100% + 120px); height: 44px;
  background: rgba(255,255,255,.30); border-radius: 60%; pointer-events: none; z-index: 0;
}
.wp-block-button__link.btn-gradient:hover,
.wp-element-button.btn-gradient:hover { transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 12px 26px rgba(0,0,0,.18); opacity: .95; }


/* ========== 6) Solve セクション（3カラム） ========== */
.sec-solve .h2-small { font-size: 36px; line-height: 1.3; }
.sec-solve .swell-block-column {
  background: #fff; border-radius: 8px; box-shadow: 0 10px 28px rgba(0,0,0,.06);
  padding: 40px 28px 32px; text-align: center; position: relative;
}
/* ① 列の1つ目p（小見出し）*/
.sec-solve .swell-block-columns .swell-block-column > p.has-text-align-center:not(:empty):first-of-type {
  font-size: 16px !important; line-height: 1.7; color: #1e1e1e; letter-spacing: .04em; margin: 6px 0 4px; display: block;
}
/* ② 1つめ figure の余白 */
.sec-solve .swell-block-column figure.wp-block-image:first-of-type { margin: 6px auto 18px; }
/* ③ 見出し太さ */
.k-head { font-weight: 500 !important; }
/* 赤いアンダーラインの大見出し（列内2つ目の p） */
.sec-solve .swell-block-column p.has-text-align-center:nth-of-type(2) {
  font-size: 28px; line-height: 1.35; font-weight: 700; letter-spacing: .04em;
  margin: 0 auto 14px; display: inline-block; position: relative; padding-bottom: 0; z-index: 0;
}
.sec-solve .swell-block-column p.has-text-align-center:nth-of-type(2)::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 8px;
  background: linear-gradient(to right, #E02112 20%, #DD8113 80%); border-radius: 1px; z-index: -1;
}
/* ④ 2つめの figure */
.sec-solve .swell-block-column figure.wp-block-image:nth-of-type(2) { margin: 16px auto 14px; }
/* ⑤ 最後の段落 */
.sec-solve .swell-block-column p.has-text-align-center:last-of-type { font-size: 15px; line-height: 1.9; color: #4a5568; letter-spacing: .02em; margin-top: 6px; }
/* Hover Lift */
@media (hover: hover){
  .sec-solve .swell-block-column { transition: transform .25s ease, box-shadow .25s ease; }
  .sec-solve .swell-block-column:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(0,0,0,.08); }
}

@media (max-width: 781px){
	.sec-solve .h2-small { font-size: 28px; line-height: 1.3; }
}

/* ========== 7) Achievements セクション ========== */
.achievements-title, .contact-title { text-align: left; }
.achievements-sub {
  display: block; font-size: clamp(12px, 1.6vw, 20px); font-weight: 600;
  background: linear-gradient(to right, #E02112 0%, #DD8113 30%);
  background-size: 100% 100%; background-position: left center; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; color: transparent;
}
/* 右カラム幅（PC） */
@media (min-width: 960px){ .swell-block-columns__inner > .swell-block-column.achiev-block { max-width: 40%; margin-left: auto; margin-right: auto; } }

/* 画像比率調整 */
@media (min-width: 782px){ figure.Achieve-ime img { height: 800px; } }
@media (max-width: 781px){ figure.Achieve-ime img { height: auto; } }

/* サービス画像 hover */
.sec-solve .swell-block-column p.has-text-align-center:last-of-type {
    font-size: 28px;
    line-height: 1.4;
}

.ser-img img{
    display: block;
    transition: all .3s ease-in-out;
    transform: translateY(0);
    box-shadow: 0 5px 5px rgba(0,0,0,.1);
}
.ser-img img{
    width: 100%;
    vertical-align: middle;
}
.ser-img img:hover{
    transform: translateY(-5px);
    box-shadow: 0 10px 10px rgba(0,0,0,.2);
}




/* ========== 8) Contact セクション（ボックス背景） ========== */
.swell-block-columns.contact-section { background-color: #f5f7f6; border-radius: 12px; padding: 40px; }
@media (max-width: 768px){ .swell-block-columns.contact-section { padding: 20px; } }

/* ---- Contact セクション幅：グレー領域を含めて 1200px ----
   親 .swell-block-fullWide__inner に padding-inline: clamp(16px,4vw,32px) があるため、
   その分を相殺して “実測 1200px” に合わせる。 */
.alignwide.swell-block-columns.contact-section{
  box-sizing: border-box;
  /* 親内側余白ぶんを打ち消して外側に広げる */
  margin-left: calc(-1 * clamp(16px, 4vw, 32px));
  margin-right: calc(-1 * clamp(16px, 4vw, 32px));
  /* 画面が広い時は 1200px に、狭い時は親幅＋左右paddingぶんにフィット */
  width: min(1200px, calc(100% + 2 * clamp(16px, 4vw, 32px)));
  max-width: none; /* WPの alignwide 既定の max-width を無効化 */
  margin-inline: auto; /* 中央寄せ */
}
@media (max-width: 768px){
  .alignwide.swell-block-columns.contact-section{
    /* SPは親の左右paddingを打ち消してフルに広げる（paddingは下の20pxが内側に入る） */
    width: calc(100% + 2 * clamp(16px, 4vw, 32px));
  }
	
}


/* TOP（home）では before_footer_widget を消す */
.home #before_footer_widget,.page-id-61 #before_footer_widget,.id_59 #before_footer_widget { 
  display: none !important;
}

/* 念のため下層では表示に戻す */
body:not(.home) #before_footer_widget { 
  display: block;
}

/* ========== 9) Footer ========== */
.l-footer__widgetArea { display: flex; justify-content: center; padding: 0 40px; box-sizing: border-box; }
.l-container.w-footer.-col3 { width: 1336px; max-width: 100%; }
.tel-footer { font-size: 36px; }
.c-widget widget_text { width: 600px; }


/* Footer 3カラム：PC幅で1200pxに */
/* Footer 3カラム：PC幅でグレー背景込み1200pxに */
.l-container.w-footer.-col3 {
  max-width: 1200px;       /* 最大幅を1200pxに */
  width: 100%;             /* 幅は全体に広げる */
  margin-left: auto;       /* 中央寄せ */
  margin-right: auto;
  padding-left: 0;         /* 左右の余白をリセット */
  padding-right: 0;
  box-sizing: border-box;  /* パディング込みで幅計算 */
}

@media (max-width: 1200px) {
  .l-container.w-footer.-col3 {
    padding-left: clamp(16px, 4vw, 32px); /* 画面が狭いときだけ余白 */
    padding-right: clamp(16px, 4vw, 32px);
  }
	
}
/* PC only */
@media (min-width: 960px){
	.w-footer__box { border-bottom: solid 1px; padding-left: 0; padding-right: 0; }
	.f-text { padding-left: 240px; }
}
/* sp only */
@media (max-width: 781px){
	.w-footer__box+.w-footer__box {
        margin-top: 0px
}
}

/* ========== 10) Snow Monkey Forms（ボタン共通） ========== */
.smf-button-control__control { margin-top: 50px; }
.snow-monkey-form .smf-action .smf-button-control__control {
  position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
  width: 240px !important; height: 56px !important; padding: 0 !important; appearance: none !important; -webkit-appearance: none !important; border: none !important; outline: none !important; text-decoration: none !important; cursor: pointer !important; border-radius: 28px !important;
  font-weight: 700 !important; font-size: 16px !important; letter-spacing: .08em !important;
  background: linear-gradient(180deg, #3E5475 0%, #1F3A5F 100%) !important; color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 8px 20px rgba(0,0,0,.12) !important;
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease !important; overflow: hidden !important; z-index: 0;
}
.snow-monkey-form .smf-action .smf-button-control__control::before {
  content: ""; position: absolute; top: -14px; left: -60px; width: calc(100% + 120px); height: 44px; background: rgba(255,255,255,.30); border-radius: 60%; pointer-events: none; z-index: 0;
}
.snow-monkey-form .smf-action .smf-button-control__control:hover,
.snow-monkey-form .smf-action .smf-button-control__control:focus-visible {
  transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 12px 26px rgba(0,0,0,.18) !important; opacity: .95;
}
.snow-monkey-form .smf-action .smf-button-control__control .smf-sending { position: relative; z-index: 1; }

/* ========== 11) Responsive Tweaks ========== */
/* SP: MVの順序入れ替え & 余白調整 */
@media (max-width: 767px){
  .p-mainVisual__textLayer { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); padding-bottom: max(18px, env(safe-area-inset-bottom)); gap: 0 !important; text-align: left; }
  .p-mainVisual__slideTitle { font-size: 18px !important; line-height: 1.35; letter-spacing: .01em; max-width: 90vw; color: #1E1E1E !important; font-weight: 600 !important; }
  .p-mainVisual__slideText  { order: 0 !important; margin-top: 0 !important; font-size: 34px !important; line-height: 1.22; letter-spacing: .005em; max-width: 92vw; color: #1E1E1E !important; font-weight: 500 !important; }
  .p-mainVisual__slideTitle { order: 1 !important; margin-top: .35em !important; }
}

/* SP: 3カラム（Solve）最適化 */
@media (max-width: 767.98px){
  .sec-solve .swell-block-columns__inner { gap: 18px; }
  .sec-solve .swell-block-column { padding: 28px 20px; border-radius: 14px; }
  .sec-solve .swell-block-column p.has-text-align-center:first-of-type { font-size: 14px; }
  .sec-solve .swell-block-column p.has-text-align-center:nth-of-type(2) { font-size: 20px; padding-bottom: 8px; margin-bottom: 14px; }
  .sec-solve .swell-block-column p.has-text-align-center:nth-of-type(2)::after { height: 4px; width: 100%; }
	#body_wrap .sec-solve .swell-block-column p.has-text-align-center:last-of-type {
    line-height: 0.8;
}
  .sec-solve .swell-block-column p.has-text-align-center:last-of-type { font-size: 26px; line-height: 1.8; }
  .swell-block-fullWide.alignfull .swell-block-column .has-text-align-center:first-of-type + p { text-align: center; }
}

/* PC-only 微調整 */
@media (min-width: 960px){
  .mvb { font-size: 35px; }
  .strong { font-size: 20px; }
  .spa-sp { display: none; }
  .case-margin > .aligncenter { margin-left: 0 !important; }
  .case-h5 { font-size: 15px !important; }
  /* ヘッダー内 .contact-btn のダブり防止（等価指定）*/
  .contact-btn { padding: 0; border: none; overflow: hidden; pointer-events: auto; position: relative; }
/* キャッチコピー左下固定	 */
	.p-mainVisual__textLayer,
  .p-mainVisual__textLayer.l-container{
    padding: 0.5vw 0.5vw 0.5vw 0.5vw !important; /* 四隅 0.5vw */
  }
/* お問い合わせセクションの微調整	 */
.contact-section{
		margin-left: 58px !important;
	}
#before_footer_widget{
		margin-left: 62px !important;
	}
	
	/* ヘッダー内 お問い合わせメニュー（.contact-btn） */
.contact-btn { position: relative; background: #1F3A5F; color: #fff; font-size: 24px; border: none; border-radius: 15px; cursor: pointer; overflow: hidden; width: 173px; height: 56px !important; }
.contact-btn::before { content: ""; position: absolute; top: -10px; left: -59px; width: 280px; height: 40px; background: rgba(255,255,255, .3); border-radius: 50%; z-index: 0; }
.contact-btn a { padding: 0 !important; display: block; text-decoration: none; }
.contact-btn span { position: relative; z-index: 1; font-weight: 800; }

.service-height{
height:70px;		
overflow: hidden;
	}
	.menu-item-233{
		margin-left:12px;
	}
}

/* 汎用: SPのみ非表示にするクラス */
@media (max-width: 781px){ .spa-pc { display: none; } 

.contact-section{
		width:100% !important;
	}
.swell-block-columns__inner>.achiev-block{
		padding: 0 var(--swl-fw_inner_pad, 0);
	}
}

/* グラデ SP調整 */
/* ===== SP実機：背景グラデは #main_visual::before、文字は absolute で前面 ===== */
@media (max-width: 781px){

  /* 1) 競合源を停止（PC用の imgLayer::before はSPでは使わない） */
  .p-mainVisual__imgLayer::before{
    content: none !important;
    display: none !important;
  }

  /* 2) 親でグラデを描画（iOSで安定） */
  #main_visual.p-mainVisual{
    position: relative !important;
    isolation: isolate !important;
    min-height: var(--swl-mv-height, 100dvh) !important; /* テーマ値が無ければ 100dvh */
    background: #E06A2A !important; /* 白潰れ防止の下地 */
  }
  #main_visual.p-mainVisual::before{
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(45deg, #E02112, #DD8113, #999999);
    background-size: 200% 100%;
    background-position: 0 0;
    animation: bg-gradient 5s linear infinite alternate;
    z-index: 0 !important;
    pointer-events: none;
    transform: translateZ(0); /* iOS描画安定 */
    -webkit-transform: translate3d(0,0,0);
  }

  /* 3) 内側は高さ継承（ゼロ高さ防止） */
  #main_visual .p-mainVisual__inner,
  #main_visual .p-mainVisual__slide{
    position: relative !important;
    z-index: 1 !important;
    min-height: inherit !important;
  }

  /* 4) テキストは必ず absolute + 最前面（←ここが肝） */
  #main_visual .p-mainVisual__textLayer{
    position: absolute !important;   /* relative にしない */
    inset: 0 !important;
    z-index: 10 !important;
    mix-blend-mode: normal !important;
  }

  /* 5) 白被りしがちなレイヤを透明化 */
  #main_visual .c-filterLayer,
  #main_visual .c-filterLayer::before,
  #main_visual .c-filterLayer::after,
  #main_visual .p-mainVisual__imgLayer{
    background: transparent !important;
  }
  #main_visual .p-mainVisual__img{
    opacity: 0 !important;
    visibility: hidden !important;
  }
}

/* グラデのアニメ（重複は削除してこれ1本に） */
@keyframes bg-gradient{
  0%{ background-position: 0 0; }
  100%{ background-position: 100% 0; }
}

/* 省エネ：動きに弱い人向けにSPはアニメ停止（任意） */
@media (max-width: 781px) and (prefers-reduced-motion: reduce){
  #main_visual.p-mainVisual::before{ animation: none !important; }
}

