@charset "UTF-8";
@media (min-width: 1025px) {
    .headerimg-img img {
        height: 70px;
    }
}

@media (min-width: 1025px) {
    [data-main-header*="wide"] .headerimg-inner {
        padding: 0px;
    }
}

.cat {
    display: none;
}

/* ベース（そのままでOK） */
a.service-btn {
    display: block;
    background: #dbdbdb;
    padding: 0px 50px;
    border-radius: 15px;
    color: #3d4e6d;
    font-weight: bold;
    font-size: 2rem;
    text-decoration: none;
    margin: 1% 9%;
    border-bottom: 4px solid #c9bfa8;
    transition: transform 0.12s ease;
}
a.service-btn:hover {
    transform: translateY(-1px);
    background-color: #d3d3d3;      /* #dbdbdb より僅かに濃い単色 */
    color: #2f3a4a;                 /* 文字色を少し濃く（任意） */
    border-bottom-color: #b7ae96;   /* 影色を1段濃く */
}

/* 押下（クリック中）：沈み込む＆影さらに濃く */
a.service-btn:active {
    transform: translateY(1px);
    background-color: #cdcdcd;      /* さらに僅かに濃い単色 */
    border-bottom-color: #a69d85;   /* 影色をもう1段濃く */
}

/* キーボードフォーカスの可視化（アクセシビリティ） */
a.service-btn:focus-visible {
    outline: 3px solid #9aa7b2;     /* 見やすいアウトライン */
    outline-offset: 3px;
}

/* 動きが苦手なユーザーへの配慮 */
@media (prefers-reduced-motion: reduce) {
    a.service-btn {
        transition: none;
    }
}
        background-color 0.12s ease,
        color 0.12s ease,
        border-bottom-color 0.12s ease;
}



h2:not([class*="topic"]) {
    border-radius: 20px;
}

h2:not([class*="topic"])::before {
    border-radius: 20px;
}
h2:not([class*="topic"]) {
    border-radius: 20px;
}
h2:not([class*="topic"])::before {
    border-top: 0px solid var(--clr-articletitle-bg, #c4b691);
}









/* ===== 土台 ===== */
.netmap-wrap{
  position: relative;
  display: inline-block;
  z-index: 0;
}

.netmap-base img{
  display: block;
  max-width: 100%;
  height: auto;
}

/* ===== ボタンの共通挙動（★ここが一本化★） ===== */
.netmap-btn{
  position: absolute;
  z-index: 10;
  display: block;
  pointer-events: auto;
}

/* 画像を親(a)の幅に合わせる */
.netmap-btn img{
  display: block;
  width: 100%;
  height: auto;
  transition: transform .2s ease, opacity .2s ease;
}

/* ホバー挙動（全ボタン共通） */
.netmap-btn:hover img{
  transform: scale(1.05);
  opacity: 0.8;
}

/* FLEXボタンの位置だけ */
.netmap-flex{
  left: 72%;
  top: 20%;
  width: 18%;
}


/* NETINボタンの位置だけ */
.netmap-netin {
    left: 67%;
    top: 34%;
    width: 18%;
}

/* ネット構築ボタンの位置だけ */
.netbirud-netin {
    left: 57.5%;
    top: 52.5%;
    width: 18%;
}

/* --- 既存デザインはそのまま --- */
section.sol-map {
    background: #eae6db;
}
h2#sol-map-heading {
    text-align: center;
    background: #fff;
}
h3.sol-title {
    background: #5b483d;
    color: #fff;
    border-radius: 10px;
    padding: 7px;
    margin-bottom: 2px;
    margin-top: 0px;
    display: flex;
    align-items: center;
    gap: 12px;
}
section.sol-card {
    background: #fff;
}

/* アイコン */
.sol-ico {
    width: 40px;
    height: 40px;
    fill: currentColor;
    flex: 0 0 40px;
    transition: transform 0.2s ease;
}

/* --- リンク制御だけ別管理 --- */
.sol-a{
    display:block;
    text-decoration:none;
    color:inherit;
    cursor:pointer;
}

.sol-a .sol-title{
    transition: transform 0.15s ease, box-shadow 0.2s ease;
}

.sol-a:hover .sol-title{
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(0,0,0,0.25);
}

.sol-a:active .sol-title{
    transform: translateY(0) scale(0.97);
}

.sol-a:hover .sol-ico{
    transform: scale(1.08);
}


.sol-ico{
  width:32px;
  height:32px;
  transition:transform 0.2s ease;
}

.sol-a:hover .sol-ico{
  transform:scale(1.1);
}

.sol-a{
  display:block;
  text-decoration:none;
  color:inherit;
  cursor:pointer;
}

.sol-a .sol-title{
  transition:transform 0.15s ease, box-shadow 0.2s ease;
}

.sol-a:hover .sol-title{
  transform:translateY(-2px);
  box-shadow:0 6px 14px rgba(0,0,0,0.25);
}

.sol-a:active .sol-title{
  transform:translateY(0) scale(0.97);
}
.sol-title-inner{
  display:flex;
  align-items:center;
  gap:12px;
  width: 100%;
}

ul.sol-list {
    margin-bottom: 30px;
}
li.sol-licontent {
    font-weight: bold;
    font-size: 1.5rem;
    color: rgb(91, 72, 61);
    background: rgb(225, 204, 191);
    padding: 3px 10px;
    border-radius: 10px;
    margin: 10px 0px 0px 30px;
}

/* liの中のリンク */
.sol-li-link{
  display:block;
  text-decoration:none;
  color:inherit;
  cursor:pointer;
  transition: transform 0.15s ease, box-shadow 0.2s ease;
}

/* ホバー */
.sol-licontent:hover{
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0,0,0,0.25);
}

/* クリック */
.sol-licontent:active{
  transform: translateY(0) scale(0.97);
}

#main section.sol-card {
    padding: 40px !important;
}

section.sol-map {
    padding: 22px !important;
}

section.sol-card-c {
    background: #fff;
    padding-bottom: 28px !important;
}
a.c-in-link {
    text-decoration: none;
    color: #5b483d;
}




/* ブロック間余白 */
.zigzag-block{
  margin-bottom: 80px;
}

/* 2カラム部分だけ制御 */
.zigzag-item{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

/* 偶数ブロックだけ反転 */
.zigzag-block:nth-of-type(even) .zigzag-item{
  direction: rtl;
}

.zigzag-block:nth-of-type(even) .zigzag-item > *{
  direction: ltr;
}

/* レスポンシブ */
@media (max-width:768px){
  .zigzag-item{
    grid-template-columns: 1fr;
  }
}

section.zigzag {
    padding: 0px !important;
}

a.sol-map-heading {
    text-decoration: none;
}