main {
  width: 80%;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px; 
  box-sizing: border-box; 
}

@media (max-width: 767px) {
  main {
    width: 100%;       /* スマホでは横幅いっぱいにする */
    padding: 0 15px;   /* 文字が画面の端に張り付かないようにする余白 */
  }
}


/* h2.gmo_style
========================================================= */
h2.gmo_style {
    margin-bottom: 0.2rem;
    padding: 1rem;
    background-color: #353535;
    color: #89c3eb;
    font-weight: bold;
    font-size: 22px;
    margin: 0 auto;
}

h2.gmo_style:before {
    content: '';
    border-left: 10px double #89c3eb;
    margin-right: 0.5rem;
}

.h2_waku{
    position: relative;
    text-align:center;
    color:#FFF;
    padding: 10px;
    background-color: #203744;
    box-shadow: 0px 0px 0px 6px #203744;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}





/* スマホ用768px以下 */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
@media screen and (max-width: 767px) {

	/* スマホ画面でははみ出しを解除し、画面幅（92%）にぴったり合わせる */
	h2.gmo {
		width: 100%;
		max-width: none;
		margin-left: 0 !important;
		transform: none;
		font-size: 1.2em; /* スマホ用に文字とロゴのサイズをバランスよく縮小 */
	}

} /* END */
/*メインバナー画像*/


.waku-4 .c-head-mv {
    background-color: #333;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    box-sizing: border-box;
    color: #fff;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: end;
    font-weight: bold;
    height: 270px;
    line-height: 1.4;
    max-width: 900px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    width: 100%;
}


.waku-4 .c-head-mv h2 {background: rgba(000,000,000,.4);border-bottom: none !important;color: #fff;font-size: 20px;text-align: left;margin: 0 !important;padding: .5em;position: relative;width: 100%;}
@media screen and (max-width: 767px) {
.waku-4 .c-head-mv {height: auto;padding: 4.5em 0 0;}
.waku-4 .c-head-mv h2 {font-size: 16px;}
}
/*間隔 共通*/
.u-m0 {margin: 0 !important;}
.u-mt10 {margin-top: 10px !important;}
.u-mt15 {margin-top: 15px !important;}
.u-mt20 {margin-top: 20px !important;}
.u-mt30 {margin-top: 30px !important;}
.u-mt40 {margin-top: 40px !important;}
.u-mt50 {margin-top: 50px !important;}
.u-mt60 {margin-top: 60px !important;}
.u-mt1em {margin-top: 1em !important;}
.u-mb10 {margin-bottom: 10px !important;}
.u-mb15 {margin-bottom: 15px !important;}
.u-mb20 {margin-bottom: 20px !important;}
.u-mb30 {margin-bottom: 30px !important;}
.u-mb40 {margin-bottom: 40px !important;}
.u-mb50 {margin-bottom: 50px !important;}
.u-mb60 {margin-bottom: 60px !important;}
.u-mb1em {margin-bottom: 1em !important;}
.u-p0 {padding: 0 !important;}
.u-p10 {padding: 10px !important;}
.u-p15 {padding: 15px !important;}
.u-p20 {padding: 20px !important;}
.u-pt10 {padding-top: 10px !important;}
.u-pt20 {padding-top: 20px !important;}
.u-pt30 {padding-top: 30px !important;}
.u-pt40 {padding-top: 40px !important;}
.u-pt50 {padding-top: 50px !important;}
.u-pt60 {padding-top: 60px !important;}
.u-pt1em {padding-top: 1em !important;}
.u-pb10 {padding-bottom: 10px !important;}
.u-pb20 {padding-bottom: 20px !important;}
.u-pb30 {padding-bottom: 30px !important;}
.u-pb40 {padding-bottom: 40px !important;}
.u-pb50 {padding-bottom: 50px !important;}
.u-pb60 {padding-bottom: 60px !important;}
.u-pb1em {padding-bottom: 1em !important;}
#breadcrumbs {font-size: 90%;margin: 0 auto 20px;text-align: left;width: var(--narrow);}
.l-section {border: 1px solid #2589d0;}
.l-container {word-break: normal;}
.l-container {}
.l-container .waku-4 {padding: 0 18px;}
.l-container .waku-4 .c-block {background: #fff;display: block;font-weight: normal;}
.l-container .waku-4:first-child .c-block {padding: 0;}
.l-container .waku-4 p {padding: 0;text-align: left;}
/*改行 共通*/
.h2_waku,.c-head-mv h2,.l-container .l-heading-primary,.l-container .l-heading-secondary,.l-container .l-tertiary,.l-container .l-quaternary,.c-linkblock h2,.c-nap h3 {line-height: 1.5;word-break: auto-phrase;}
/*タイトル 共通*/
.l-container .l-heading-primary {}
.l-container .l-heading-secondary {background: #0f4c81;border-radius: 10px;color: #fff;font-size: 22px;padding: 12px 14px;}
.l-container .l-tertiary {color: #0f4c81;}
.l-container .l-quaternary {color: #ff4500;font-size: 18px;}
/*コンテンツ内リンク 共通*/
.l-container a {color: #08375d;}
.l-container a:hover {opacity: 0.7;}
/*テキストブロック 共通*/
.c-block {overflow: hidden;}
/*小見出しブロック 共通*/
.c-s-block {}
/*リスト 共通*/
.c-block ul,.c-block ol {margin: 0.8em 1em 1.1em 0;padding: 0 0 0 30px;vertical-align: top;}
.c-block ul li,.c-block ol li {margin-bottom: 10px;}
.c-block ul li {list-style: disc;}
.c-block ol li {list-style: decimal;}
.c-block ul li:last-of-type,.c-block ol li:last-of-type {}
.c-block ul li::marker,.c-block ol li::marker {}
.l-container dl {}
.l-container dl dt,.l-container dl dd {background: #fffdf7;font-size: 17px;font-weight: bold;}
.l-container dl dt {border-color: #e5d6ae;border-style: solid;border-width: 2px 2px 0 2px;border-radius: 12px 12px 0 0;padding: 0 20px;}
.l-container dl dd {border-color: #e5d6ae;border-style: solid;border-width: 0 2px 2px 2px;border-radius: 0 0 12px 12px;color: #8b0000;padding: 0 20px;}
/*テーブル 共通*/
.c-s-table {border-collapse: collapse;border: 1px solid #2589d0;text-align: left;line-height: 1.5;margin: 20px 0 40px !important;width: 100%;}
.c-s-table tr {border: 1px solid #2589d0;display: table-row;position: initial;width: 100%;}
.c-s-table tr:after {content: none;}
.c-s-table tr:nth-child(1) {font-weight: bold;}
.c-s-table td:nth-child(1) {font-weight: bold;}
.c-s-table th {background: #e8f4fd;border: 1px solid #2589d0;color: #004d99;display: table-cell;font-weight: bold;padding: 10px !important;text-align: left;vertical-align: middle;width: auto !important;}
.c-s-table td {border: 1px solid #2589d0;display: table-cell;padding: 10px !important;vertical-align: middle;}
.c-s-table tr:nth-child(odd) {background: #e8f4fd;}
.c-s-table ul li:last-child,.c-s-table ol li:last-child {margin-bottom: 0;}
.c-block .c-s-table ul,.c-block .c-s-table ol {margin: 0.2em 1em 0.2em 0;padding-left: 20px;vertical-align: top;}
/*アンカーテキスト 共通*/
.c-block a {}
/*末尾分 共通*/
.c-endblock {background: #eee;border: 1px solid #ddd;padding: 18px 18px 2px;}
/*画像 共通*/
.img-left-s {float: left;margin: 0 4% 4% 0;width: 35%;}
.img-right-s {float: right;margin: 0 0 4% 4%;width: 35%;}
.img-left-l {float: left;margin: 0 4% 4% 0;width: 30%;}
.img-right-l {float: right;margin: 0 0 4% 4%;width: 30%;}
.img-left-s img,.img-right-s img,.img-left-l img,.img-right-l img {vertical-align: middle;height: auto;width: 100%;}
/*リンク一覧 共通*/
.c-linkblock {
    background: #f5f8fb;
    border: 2px solid #9dc2ea;
    border-radius: 12px;
    max-width: 900px;
    margin: 0 auto;
    padding: 30px;
}
.c-linkblock h2 {background: #0f4c81;border-radius: 10px;color: #fff;font-size: 22px;padding: 12px 14px;margin-top: 0;}
.c-pagelink {counter-reset: number;margin: 0 1em 0 1em;}
.c-pagelink li {border-bottom: 1px dashed #7ca9da;font-size: 16px;list-style: none !important;padding: 1.5em 0.5em 1.5em 3.5em;position: relative;}
.c-pagelink li:before {background: #5e93d0;border-radius: 50%;content: counter(number);counter-increment: number;color: #fff;display: inline-block;font-family: 'Avenir','Arial Black','Arial',sans-serif;font-size: 15px;font-weight: bold;left: 0;line-height: 35px;text-align: center;top: 50%;position: absolute;  transform: translateY(-50%);width: 35px;height: auto;-webkit-transform: translateY(-50%);}
.c-pagelink li a {text-decoration: none;}
.c-pagelink li:last-child {margin-bottom: 0;}
.c-pagelink li a:hover {}
.u-c-a {}
.u-c-a h3 {}
.u-c-a li {}
.u-c-a a {}
.u-c-a a:hover {}
/*NAP表 共通*/
.c-nap section {padding: 20px 0 52px;}
.c-nap h3 {color: #0f4c81;margin: 0 auto;width: var(--narrow);}
.c-table {border-collapse: collapse;border: 1px solid #ddd;text-align: left;width: 100%;}
.c-table th {background: #f7f7f7;border: 1px solid #ddd;text-align: left;vertical-align: middle;width: 25%;}
.c-table td {border: 1px solid #ddd;vertical-align: middle;}
.c-table a {}
.c-table a:hover {}
/*ボタン 共通*/
.c-btn {text-align: center;}
.c-btn-anchor {background: #0f4c81;border-radius: 30px;color: #fff !important;display: inline-block;font-weight: bold;padding: 15px 20px;position: relative;text-decoration: none;transition: 0.2s;max-width: 500px;width: 45%;word-break: auto-phrase;}
.c-btn-anchor:hover {background: #08375d;opacity: 1 !important;text-decoration: none;}
p + .c-btn {margin-top: 30px;}
@media (max-width: 767px) {
#breadcrumbs {font-size: 15px;}
/*タイトル スマホのみ*/
.l-container .l-heading-primary {}
.l-container .l-heading-secondary {font-size: 20px;}
.l-container .l-tertiary {font-size: 19px;}
.l-container .l-quaternary {font-size: 18px;}
/*リスト スマホのみ*/
.l-container dl dt,.l-container dl dd {font-size: 16px;}
/*リンク一覧 スマホのみ*/
.c-linkblock {padding: 20px 15px;}
.c-linkblock h2 {font-size: 20px;}
.c-pagelink {margin: 0 0.2em 0 0.5em;}
.c-pagelink li {padding: 1.5em 0 1.5em 3em}
.c-pagelink li:before {font-size: 13px;line-height: 30px;width: 30px;}
/*NAP表 スマホのみ*/
.c-nap h3 {font-size: 19px;}
.c-table th,.c-table td {display: block;}
.c-table th {width: auto;}
/*画像 スマホのみ*/
.img-left-s,.img-right-s,.img-left-l,.img-right-l {float: none;width: 100%;margin: 0 0 4%;}
/*ボタン スマホのみ*/
.c-btn-anchor {font-size: 17px;width: 95%;}
}
@media (min-width: 767px) {
}

/* =================================================
   NAP情報（会社概要）ブロック専用カスタムCSS
================================================= */
.c-nap {
  max-width: 900px;
  margin: 50px auto 0 auto;
  padding: 0 1rem;
  box-sizing: border-box;
}

/* 上部の中見出し(h3) */
.c-nap h3 {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.4;
  color: #1e3a1a; /* 落ち着きのある深いグリーン */
  margin-bottom: 1.5rem;
  padding-left: 10px;
  border-left: 5px solid #5b824a; /* アクセントの左縦線 */
}

/* テーブル全体の基本設定 */
.c-nap .f_table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 1rem;
  background: #fff;
  border-radius: 8px;
  overflow: hidden; /* 角丸を効かせる */
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
  border: 1px solid #5383c3;
}

/* キャプション（表の上の補足テキスト） */
.c-nap .f_table caption {
  text-align: left;
  font-size: 1.05rem;
  font-weight: 600;
  color: #444;
  margin-bottom: 1rem;
  padding-left: 5px;
}

/* 行・セルの共通設定 */
.c-nap .f_table tr {
  border-bottom: 1px solid #5383c3;
}

.c-nap .f_table tr:last-child {
  border-bottom: none; /* 最後の行の線は消す */
}

/* 左側：ヘッダーセル(th) ★スクショの雰囲気をベースに品よく調整 */
.c-nap .f_table th {
  width: 25%; /* 左側の幅をバランスよく固定 */
  background: #f7f9fa; /* 上品な極薄グレー */
  color: #333;
  font-size: 1rem;
  font-weight: 700;
  text-align: center;
  padding: 1.2rem 1rem;
  vertical-align: middle;
  border-right: 1px solid #5383c3;
  white-space: nowrap; /* 勝手に変なところで改行させない */
}

/* 右側：データセル(td) */
.c-nap .f_table td {
  padding: 1.2rem 1.5rem;
  font-size: 1rem;
  line-height: 1.6;
  color: #444;
  text-align: left;
  vertical-align: middle;
}

/* リンク色（電話・メール・URL）の調整 */
.c-nap .f_table td a {
  color: #3165b5;
  text-decoration: none;
  font-weight: 600;
  transition: color 0.2s;
}

.c-nap .f_table td a:hover {
  color: #5b824a;
  text-decoration: underline;
}

/* Googleマップのレスポンシブコンテナ */
.c-nap .f_table td iframe {
  width: 100% !important; /* テーブルの幅いっぱいに自動フィット */
  max-width: 100%;
  border-radius: 6px;
  display: block;
}

/* =================================================
   レスポンシブ（スマホ・タブレット対応 768px以下）
================================================= */
@media screen and (max-width: 768px) {
  .c-nap h3 {
    font-size: 1.2rem;
  }

  .c-nap .f_table caption {
    font-size: 0.95rem;
  }

  /* スマホ時はthの横幅を少し狭めてテキスト領域を広く */
  .c-nap .f_table th {
    width: 30%;
    padding: 1rem 0.5rem;
    font-size: 0.9rem;
  }

  .c-nap .f_table td {
    padding: 1rem;
    font-size: 0.92rem;
    line-height: 1.5;
  }

  /* 業務内容など長いテキストや番号が潰れないよう自動改行を強化 */
  .c-nap .f_table td {
    word-break: break-all; 
  }
  
  /* スマホで地図が小さくなりすぎないよう縦幅を少しコンパクトに調整 */
  .c-nap .f_table td iframe {
    height: 220px !important;
  }
}


/* =================================================
   info-card
================================================= */
.info-card {
  max-width: 900px;         /* 枠の最大横幅（お好みで調整してください） */
  margin: 20px auto;        /* 画面中央に配置 */
  background-color: #fff;   /* 本文の背景色 */
  border: 2px solid #506d2f;/* leaves */
  border-radius: 12px;      /* 角丸の具合 */
  overflow: hidden;         /* ヘッダーの角丸がはみ出さないようにするマジック */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05); /* ほんのり優しい影（画像に合わせた立体感） */
}

/* 上部の青いヘッダー部分 */
.info-card-header {
  background-color: #506d2f;/* leaves */
  color: #ffffff;           /* 文字色（白） */
  font-weight: bold;        /* 太字 */
  font-size: 1.15rem;       /* 文字の大きさ */
  text-align: center;       /* 文字を中央寄せ */
  padding: 15px 20px;       /* 上下・左右の余白 */
  letter-spacing: 0.05em;   /* 文字の間隔を少し広げて読みやすく */
}

/* 下部の白い本文部分 */
.info-card-body {
  padding: 30px;            /* 内側の余白（画像のようにゆったり広め） */
  color: #333333;           /* 文字色（真っ黒にせず濃いグレーにすると上品になります） */
  font-size: 1.2rem;          /* 本文の文字サイズ */
  line-height: 1.8;         /* 行間（読みやすさ重視） */
}

/* 本文内の段落同士のすき間 */
.info-card-body p {
  margin-bottom: 1.5em;     /* 段落の下にスペースを空ける */
}

/* 最後の段落だけは下に余白を作らない */
.info-card-body p:last-child {
  margin-bottom: 0;
}


/* このh2だけをピンポイントで小さく調整（文字量が多いので1.3rem?1.5remあたりが綺麗です） */
.ai_logo_sub {
  font-size: 1.4rem !important; 
}

/* スマホ用768px以下 */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
@media screen and (max-width: 767px) {
  .ai_logo_sub {
    font-size: 1.15rem !important;
  }

} /* END */


/* =========================================================
   CTAエリア：全体コンテナ（画面全体の90%・最大1100px・中央配置）
   ========================================================= */
.aim-cta-wrap {
    width: 90%;          /* 画面幅の90%に制限 */
    max-width: 1100px;   /* PCで広がりすぎないように安全弁を設定（サービス一覧と同期） */
    margin: 40px auto;   /* 左右autoで中央配置 */
    box-sizing: border-box;
}

/* ヘッダーテキストエリア */
.tworow-cta-header {
    text-align: center;
    margin-bottom: 20px;
}

.cta-banner-container {
    display: flex;
    flex-direction: row;  /* 標準で横並び */
    justify-content: space-between;
    gap: 16px;            /* バナー間の左右の隙間 */
    width: 100%;
}

/* 各バナー（リンク要素） */
.cta-banner-item {
    display: block;
    flex: 1;              /* 3つのバナーを完全に均等幅にする */
    text-decoration: none;
    transition: transform 0.2s ease;
}

/* 画像のレスポンシブ設定 */
.cta-banner-item img {
    display: block;
    width: 100%;          /* バナー幅いっぱいにピタッと表示 */
    height: auto;         /* 画像の比率を崩さない */
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.2s ease;
}

/* マウスホバー時の浮き上がり演出 */
.cta-banner-item:hover {
    transform: translateY(-3px);
}

.cta-banner-item:hover img {
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.12);
}


@media (max-width: 767px) {
    .cta-banner-container {
        flex-direction: column;   /* 縦並びに上書き */
        gap: 12px;                /* スマホ用の上下の隙間に調整 */
    }

    .cta-banner-item {
        flex: none;               /* 均等幅設定を解除 */
        width: 100%;
    }
}


/* =================================================
   コラム一覧
================================================= */
.btn-center {
    text-align: center;
    margin-top: 3rem;
}

/* クラス名を他と絶対に被らない名称に変更 */
.amsv-column-btn {
    display: inline-block;
    padding: 15px 40px;
    background: #506d2f;
    color: #fff;
    width: min(94%, 420px);
    text-decoration: none;
    border-radius: 999px;
    font-weight: 700;
    transition: 0.2s;
    box-sizing: border-box; /* 【追加】横幅指定（width）があるため、paddingやborderを含める指定 */
    border: 2px solid transparent; /* 【追加】最初から透明な枠線を引いておくことでホバー時のガタつきを防ぐ */
}

.amsv-column-btn:hover {
    background: #fff;
    border-color: #506d2f; /* 【修正】枠線の色だけを変えるようにしてサイズ変更を防ぐ */
    color: #506d2f;
}