/* ==========================
   カスタムCSS
========================== */

/* =================================================
   Base
================================================= */
/* FVだけ画面幅いっぱいにする */
.fv-full{
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* ヘッダーを全幅にする */
.siteHeader .container {
max-width:100% !important;
padding-left:40px;
padding-right:40px;
}

/* フッターを全幅にする */
.siteFooter .container {
max-width:100% !important;
padding-left:40px;
padding-right:40px;
}

/* Googleフォントを使う */
body{
font-family: "Zen Kaku Gothic Antique", sans-serif;
}





/* =================================================
   Header
================================================= */
/* ロゴ画像のサイズを強制（Lightning: siteHeader_logo を狙う） */
header.siteHeader .siteHeader_logo img {
  height: 90px !important;   /* ← 好みで 60〜110px で調整 */
  width: auto !important;
  max-height: none !important;
  max-width: none !important;
  display: block !important;
	padding: 0px 20px;
}

/* 中央幅＋左右余白 */
header.siteHeader .siteHeadContainer {
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px 32px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

/* ロゴは左 */
header.siteHeader .navbar-header {
  margin-right: auto;
}

/* メニューは右に寄せる */
#gMenu_outer {
  margin-left: auto;
	padding-right: 42px;
}

/* 文字（strong）を太字にしない */
#gMenu_outer .gMenu_name,
#gMenu_outer strong.gMenu_name {
  font-weight: 500 !important;
  letter-spacing: 0.08em;
	color:#333;
	font-size: 16px;
	padding-top: 8px;
}

/* メニュー下線を削除 */
#gMenu_outer .gMenu li:before{
display:none !important;
}

/* hover時にグレー */
#gMenu_outer .gMenu li a:hover{
color:#888;　/* 好みで #777〜#999 */
transition:color .2s;
}


/* =================================================
   FV
================================================= */
/* FVを少し暗くして文字を見やすくする */
.wp-block-cover::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.15);
z-index:1;
}

/* 文字を前面に出す */
.wp-block-cover .wp-block-cover__inner-container{
position:relative;
z-index:2;
}


/* =================================================
   Concept
================================================= */
.concept-text{
line-height:2;
font-size:17px;
color:#555;
}

.concept-line{
width:100px;
border-top:1px solid #ddd;
margin:10px 0 40px 0;
}


/* コンテンツ幅を広げる */
.siteContent .container {
max-width: 1200px;
}


/* =================================================
   Service
================================================= */
/* 事業セクション全体 */
.service-section{
  width: min(1520px, calc(100vw - 48px));
  margin-left: 50%;
  transform: translateX(-50%);
  padding: 80px 70px;
  background: #f5f7fb;
  border-radius: 24px;
  box-sizing: border-box;
}

/* 事業セクションのカラム */
.service-section .wp-block-columns{
  gap: 32px;
}

/* カード */
.service-card{
  border-radius: 16px;
  height: 100%;
  box-sizing: border-box;
}


/* カード画像 */
.service-card img{
  width: 100%;
  border-radius: 16px;
  display: block;
  margin-top: 16px;
}

.service-section .wp-block-columns{
gap:40px;
}


/* =================================================
   Valueセクション
================================================= */
/* Our Value セクション：背景だけ全幅 */
.value-section{
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 80px 0;
  box-sizing: border-box;
}

/* 中身だけ中央寄せ */
.value-inner{
  max-width: 1520px;
  margin: 0 auto;
  padding: 0 70px;
  box-sizing: border-box;
}

/* カラム */
.value-item .wp-block-columns{
  align-items:center;
  gap:80px;
}

/* 番号 */
.value-number{
  line-height:1;
  font-weight:700;
  margin-bottom:10px;
}

/* 本文 */
.value-item p{
  line-height:1.9;
	max-width: 400px;
}

/* 画像 */
.value-image{
  position: relative;
}

.value-image img{
  width:100%;
  max-width:760px;
  display:block;

  transform: scale(1.18);
  transform-origin: left center;
}


/* =================================================
   Company
================================================= */







/* =================================================
   Footer
================================================= */












/* =================================================
   Responsive
================================================= */
/* =========================
   SP(スマホ) ヘッダー調整
   ロゴ：小さく＆中央寄せ
========================= */
@media (max-width: 768px) {

/* ヘッダー内の横並び（PC用flex）をスマホでは解除して中央寄せ */
  header.siteHeader .siteHeadContainer{
    display: block !important;
    text-align: center !important;
    padding: 10px 16px !important; /* 好みで調整OK */
  }

/* ロゴブロックを中央に */
  header.siteHeader .navbar-header{
    float: none !important;
    display: block !important;
    width: 100% !important;
    margin: 0 auto !important;
		padding-right: 12px;
		padding-bottom: 8px;
  }

  header.siteHeader .siteHeader_logo{
    display: block !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

/* ロゴ画像のサイズ（ここが「大きすぎる」を直す本体） */
  header.siteHeader .siteHeader_logo img{
    max-height: 60px !important;
    width: auto !important;
    height: auto !important;
  }

/* ハンバーガー（メニュー）ボタンは左に残す（中央ロゴと干渉しないように） */
  #vk-mobile-nav-menu-btn{
    position: absolute !important;
    left: 12px !important;
    top: 10px !important;
    z-index: 9999 !important;
  }
}


@media (max-width: 768px){
  .service-section{
    width: calc(100vw - 32px);
    padding: 48px 20px;
    border-radius: 16px;
  }
}


@media (max-width: 768px){
  .value-section{
    padding: 56px 0;
  }

  .value-inner{
    padding: 0 24px;
  }

  .value-item .wp-block-columns{
    gap: 32px;
  }
}


@media (max-width:768px){

.value-image img{
transform:scale(1);
}

}