.box-shadow {
box-shadow: 0 0px 15px rgba(0, 0, 0, 0.15);
}
/* 1. 리스트 전체 (ul)의 모든 강제 여백 제거 */
ul.custom-bullet-list {
    list-style: none !important;
    list-style-type: none !important;
    padding: 0 !important;       /* 상하좌우 모든 패딩 제거 */
    margin: 0 !important;        /* 모든 외부 마진 제거 */
    text-indent: 0 !important;   /* 들여쓰기 제거 */
}
.custom-bullet-list li {
    position: relative !important;
    /* 왼쪽 여백을 28px에서 22px로 줄여 아이콘을 왼쪽 벽에 더 붙입니다 */
    padding-left: 22px !important; 
    list-style-type: none !important;
    background: none !important; 
    margin-bottom: 10px;
    display: block !important;
}

.custom-bullet-list li::before {
    content: "" !important;
    position: absolute !important;
    /* 아이콘 자체의 위치도 왼쪽 끝(0)에 딱 붙입니다 */
    left: 0 !important;
    top: 16px !important; 
    transform: translateY(-50%) !important; 
    width: 18px !important; 
    height: 18px !important;
    background-image: url('files/チェックボックスアイコン１.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
}

/* 표 전체 설정 */
.step-process-table table {
    width: 100% !important;
    table-layout: fixed !important; 
    border-collapse: collapse !important;
}

/* 1, 3, 5, 7열 너비 설정 (19%) 및 상단 정렬 */
.step-process-table td:nth-child(1),
.step-process-table td:nth-child(3),
.step-process-table td:nth-child(5),
.step-process-table td:nth-child(7) {
    width: 19% !important;
    /* 수직 정렬을 상단으로 변경 */
    vertical-align: top !important; 
    /* 상단 여백을 20px 정도로 주어 자연스럽게 배치 */
    padding: 20px 10px 15px 10px !important; 
    text-align: center !important;
}

/* 2, 4, 6열 화살표 너비 설정 (8%) 및 중앙 정렬 유지 */
.step-process-table td:nth-child(2),
.step-process-table td:nth-child(4),
.step-process-table td:nth-child(6) {
    width: 8% !important;
    /* 화살표는 중간에 있는 것이 보기 좋으므로 middle 유지 */
    vertical-align: middle !important; 
    padding: 0 !important;
    text-align: center !important;
}

/* 1. 표 기본 구조 및 테두리 완전 제거 */
.comparison-style-v2 table {
    border-collapse: collapse !important;
    border: none !important;
    width: 100% !important;
    table-layout: fixed !important;
}

.comparison-style-v2 td {
    border: none !important; /* 모든 선 제거 */
    vertical-align: top !important;
    padding: 15px 10px !important;
    background-color: transparent !important;
}

/* 2. BEFORE / AFTER 헤더 박스 만들기 */
/* 셀 안에 글자를 적고 드래그해서 '제목'이나 '굵게'를 적용하면 이 스타일이 먹힙니다 */
.comparison-style-v2 td strong, 
.comparison-style-v2 td b {
    display: block !important;
    text-align: center !important;
    padding: 12px !important;
    margin: -15px -10px 20px -10px !important; /* 셀 끝까지 색상 채우기 */
    font-size: 20px !important;
    color: #ffffff !important; /* 글자색 흰색 강제 */
}

/* BEFORE (1열) 헤더 색상 */
.comparison-style-v2 td:nth-child(1) strong,
.comparison-style-v2 td:nth-child(1) b {
    background-color: #9da6b0 !important;
}

/* AFTER (3열) 헤더 색상 */
.comparison-style-v2 td:nth-child(3) strong,
.comparison-style-v2 td:nth-child(3) b {
    background-color: #c93a3a !important;
}

/* 3. 셀 병합 효과 (3열과 4열을 하나의 배경색으로 묶기) */
.comparison-style-v2 td:nth-child(3),
.comparison-style-v2 td:nth-child(4) {
    background-color: #ffffff !important; /* 배경을 흰색으로 통일 */
}

/* 4. 불릿 리스트 (custom-bullet-list) 강제 적용 */
/* Zoho 리스트 아이콘이 겹치지 않도록 강제 설정 */
.comparison-style-v2 ul {
    list-style: none !important;
    padding-left: 0 !important;
}

/* 이미 작성하신 custom-bullet-list의 스타일을 이 표 안의 li에도 강제 부여 */
.comparison-style-v2 li {
    position: relative !important;
    padding-left: 25px !important;
    margin-bottom: 8px !important;
    list-style: none !important;
}

/* 체크 아이콘 위치 및 크기 */
.comparison-style-v2 li::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 5px !important;
    width: 18px !important;
    height: 18px !important;
    background-image: url('files/チェックボックスアイコン１.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
}

/* 5. 화살표 열 (2열) */
.comparison-style-v2 td:nth-child(2) {
    width: 50px !important;
    vertical-align: middle !important;
    font-size: 24px !important;
    color: #92d0ef !important;
}

/* 그림자 제거 */
.comparison-style-v2 img {
    box-shadow: none !important;
    max-width: 100% !important;
}

/* --- 대형 불릿 리스트: 여백 최소화 및 높이 조정 버전 --- */

ul.large-bullet-list {
    list-style: none !important;
    padding: 0 !important;       /* 왼쪽 여백 완전 제거 */
    margin: 15px 0 !important;
    text-indent: 0 !important;
}

.large-bullet-list li {
    position: relative !important;
    /* 왼쪽 벽(아이콘)으로부터 텍스트가 시작되는 거리만 확보 */
    /* 24px 아이콘 + 8px 여백 = 총 32px */
    padding-left: 32px !important; 
    list-style-type: none !important;
    background: none !important; 
    margin-bottom: 14px !important;
    display: block !important;
    line-height: 1.6 !important;
}

.large-bullet-list li::before {
    content: "" !important;
    position: absolute !important;
    /* 왼쪽 끝에 딱 붙임 */
    left: 0 !important;
    /* 기존 4px에서 3px 더 내려서 7px로 조정 */
    top: 8px !important; 
    width: 24px !important; 
    height: 24px !important;
    background-image: url('files/チェックボックスアイコン１.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
}

/* --- 대형 불릿 리스트: 행간 및 간격 축소 버전 (Half) --- */

ul.large-bullet-list-half {
    list-style: none !important;
    padding: 0 !important;       
    margin: 10px 0 !important;   /* 전체 위아래 여백도 살짝 줄임 */
    text-indent: 0 !important;
}

.large-bullet-list-half li {
    position: relative !important;
    padding-left: 32px !important; 
    list-style-type: none !important;
    background: none !important; 
    /* 항목과 항목 사이의 간격을 기존 14px에서 6px로 대폭 축소 */
    margin-bottom: 6px !important;
    display: block !important;
    /* 텍스트 자체의 줄 간격을 기존 1.6에서 1.3으로 축소 */
    line-height: 1.3 !important;
}

.large-bullet-list-half li::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    /* 줄 간격이 줄어듦에 따라 아이콘 위치를 미세 조정 (기존 8px -> 4px) */
    top: 4px !important; 
    width: 24px !important; 
    height: 24px !important;
    background-image: url('files/チェックボックスアイコン１.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
}
/* --- 1. メニューを横いっぱいに広げ、1行に収める --- */
@media all and (min-width: 992px) {
    /* 1行に収まるよう余白とサイズを調整 */
    .theme-navigation-and-icons .theme-menu-area .theme-menu ul li a {
        font-size: 13px !important;      /* 文字を小さく */
        padding-inline-start: 12px !important; /* 左右余白を詰める */
        padding-inline-end: 12px !important;
        color: #0054a6 !important;      /* 青色（1枚目風） */
        font-weight: bold !important;
        border-radius: 0px !important;
    }

    /* メニュー間の縦の仕切り線（1枚目の再現） */
    .theme-navigation-and-icons .theme-menu-area .theme-menu ul li {
        border-left: 1px solid #e0e0e0 !important;
    }
    .theme-navigation-and-icons .theme-menu-area .theme-menu ul li:first-child {
        border-left: none !important;
    }

    /* --- 2. 「お問い合わせ」だけを青いボタンにする --- */
    /* メニューの一番右端の項目を特定 */
    .theme-navigation-and-icons .theme-menu-area .theme-menu ul li:last-child {
        background-color: #0054a6 !important; /* 濃い青 */
        border-left: none !important;
        margin-left: 10px !important;
    }

    .theme-navigation-and-icons .theme-menu-area .theme-menu ul li:last-child a {
        color: #ffffff !important; /* 文字を白に */
        padding-inline-start: 20px !important;
        padding-inline-end: 20px !important;
    }

    /* マウスを乗せた時の色（ホバー） */
    .theme-navigation-and-icons .theme-menu-area .theme-menu ul li:last-child:hover {
        background-color: #003d7a !important;
    }
}

/* --- 3. 「さらに表示」を消して、無理やり全部並べる --- */
.zpmenu-more-item, .theme-sub-li-menu.theme-non-responsive-menu {
    display: none !important;
}
.theme-navigation-and-icons .theme-menu-area .theme-menu ul {
    display: flex !important;
    flex-wrap: nowrap !important; /* 折り返しを禁止 */
}
/* --- 1. 背景色を完全に消す（通常時・ホバー時・選択時すべて） --- */
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li a,
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li.theme-menu-selected > a,
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li:hover > a {
    background: transparent !important; /* 背景を透明に */
    background-color: transparent !important;
}

/* --- 2. マウスが重なった時（ホバー）の文字色を調整 --- */
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li a:hover {
    color: #000000 !important; /* 黒にする（お好みで #333333 など） */
    text-decoration: underline; /* 変化がわかりにくい場合は下線を引く */
}

/* --- 3. 現在表示しているページのメニュー文字色 --- */
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li.theme-menu-selected > a {
    color: #0054a6 !important; /* 選択中は元の青色のまま、背景だけ消す */
}

/* --- 4. ただし、一番右の「問合わせ」ボタンだけは背景色を維持する --- */
/* ※これがないと「問合わせ」ボタンまで透明になってしまいます */
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li:last-child {
    background-color: #0054a6 !important;
}
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li:last-child a {
    color: #ffffff !important; /* ボタンの文字は白のまま */
}
.theme-navigation-and-icons .theme-menu-area .theme-menu ul li:last-child a:hover {
    color: #ffffff !important; /* ボタンはホバーしても白文字 */
    background-color: #003d7a !important; /* ボタンだけは少し濃い青に */
}

/* --- フッターメニューのオレンジ色・背景色もまとめて修正 --- */

/* フッター全体のリンクとメニューを制御 */
.theme-footer-area a,
.theme-footer-area a:visited,
.theme-footer-area a:hover,
.theme-footer-area .theme-menu ul li a {
    color: #0054a6 !important;    /* ヘッダーと同じ青に（黒なら #000000） */
    background: transparent !important;
    background-color: transparent !important;
    text-decoration: none !important; /* 下線を消す */
}

/* フッターのホバー時（マウスを乗せた時）の設定 */
.theme-footer-area a:hover {
    color: #000000 !important;    /* ホバー時は黒に */
    text-decoration: underline !important; /* ホバー時のみ下線 */
}

/* フッターメニューが横並びの場合の区切り線（お好みで） */
.theme-footer-area .theme-menu ul li {
    border-left: 1px solid #e0e0e0 !important;
    padding: 0 10px !important;
    list-style: none !important;
}
.theme-footer-area .theme-menu ul li:first-child {
    border-left: none !important;
}

/* --- ページタイトルの消し込み（念のため追加） --- */
.theme-breadcrumb-area, 
.zpbreadcrumb-container, 
.zpbreadcrumb {
    display: none !important;
}