/* ============================================================
   成約事例 詳細ページ LP風レスポンシブデザイン
   ============================================================ */

body {
    font-family: "Noto Sans JP", sans-serif;
    color: #1a1a1a;
    background: #f7f6f3;
    -webkit-font-smoothing: antialiased;
}

main section {
    margin: 0 !important;
    font-size: 14px !important;
}

input { display: block !important; }

.sp_only { display: inline; }
@media screen and (min-width: 600px) { .sp_only { display: none; } }

/* ============================================================
   コンテナ
   ============================================================ */

.pd_container {
    margin: auto;
    padding: 0 20px;
    max-width: 800px;
}

@media screen and (min-width: 600px) { .pd_container { padding: 0 32px; } }

/* ============================================================
   ヘッダー
   ============================================================ */

.pd_header {
    padding: 100px 0 40px;
    background: #2c241e;
    text-align: center;
    margin: 0 !important;
}

@media screen and (min-width: 600px) { .pd_header { padding: 120px 0 48px; } }

.pd_header_label {
    font-family: "Noto Serif JP", serif;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.3em;
    color: #c08b30;
    margin-bottom: 8px;
}

.pd_header_title {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #fff;
    margin-bottom: 12px;
    line-height: 1.4;
}

.pd_header_title::after {
    content: "";
    display: block;
    width: 40px;
    height: 2px;
    background: #c08b30;
    margin: 12px auto 0;
}

@media screen and (min-width: 600px) { .pd_header_title { font-size: 32px; } }

.pd_header_meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 8px;
    margin-top: 16px;
}

.pd_header_date {
    font-size: 13px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.6);
    letter-spacing: 0.06em;
}

.pd_header_badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #2c241e;
    background: linear-gradient(135deg, #c08b30, #d4a84b);
    padding: 2px 10px;
    border-radius: 20px;
}

.pd_header_address {
    font-size: 13px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.45);
    letter-spacing: 0.04em;
}

/* ============================================================
   パンくず
   ============================================================ */

.pd_breadcrumb {
    padding: 14px 0;
    background: #eae6df;
    font-size: 12px;
    color: #999;
}

.pd_breadcrumb a {
    color: #8a6d2e;
    text-decoration: none;
    transition: color 0.2s;
}

.pd_breadcrumb a:hover {
    color: #c08b30;
}

.pd_breadcrumb_sep {
    margin: 0 6px;
    color: #ccc;
}

/* ============================================================
   セクション共通
   ============================================================ */

.pd_section {
    padding: 0 0 24px;
    background: #f7f6f3;
}

.pd_section--gallery {
    padding-top: 32px;
}

@media screen and (min-width: 600px) {
    .pd_section { padding-bottom: 32px; }
    .pd_section--gallery { padding-top: 48px; }
}

/* セクション見出し */
.pd_section_heading {
    font-size: 20px;
    font-weight: 700;
    color: #2c241e;
    letter-spacing: 0.06em;
    margin-bottom: 24px;
    padding-bottom: 12px;
    border-bottom: 2px solid #eae6df;
    position: relative;
}

.pd_section_heading::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 60px;
    height: 2px;
    background: #c08b30;
}

.pd_section_heading_en {
    display: block;
    font-family: "Noto Serif JP", serif;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0.2em;
    color: #c08b30;
    margin-bottom: 4px;
}

/* ============================================================
   画像1枚: シンプル表示
   ============================================================ */

.pd_single_image {
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.pd_single_image img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 500px;
    object-fit: contain;
    background: #f7f6f3;
}

@media screen and (min-width: 600px) {
    .pd_single_image img { max-height: 560px; }
}

/* ============================================================
   画像ギャラリー（複数枚）
   ============================================================ */

.pd_gallery {
    background: #2c241e;
    border-radius: 12px;
    overflow: hidden;
    padding: 12px;
    display: flex;
    flex-direction: column;
    /* SP: メイン260 + gap10 + サムネ80 + padding上下24 = 374 */
    height: 374px;
}

@media screen and (min-width: 600px) {
    .pd_gallery {
        padding: 16px;
        /* PC: メイン450 + gap10 + サムネ100 + padding上下32 = 592 */
        height: 592px;
    }
}

@media screen and (min-width: 1001px) {
    .pd_gallery {
        /* 大PC: メイン500 + gap10 + サムネ100 + padding上下32 = 642 */
        height: 642px;
    }
}

/* メインスライダー */
.pd_gallery_main {
    width: 100%;
    flex: 1;
    min-height: 0;
    border-radius: 8px;
    overflow: hidden;
}

.pd_gallery_main .swiper-wrapper {
    display: flex !important;
    height: 100% !important;
}

.pd_gallery_slide {
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: #1a1612;
    width: 100% !important;
    height: 100% !important;
    flex-shrink: 0;
}

.pd_gallery_slide img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    margin: auto;
}

/* サムネイル */
.pd_gallery_thumbs {
    margin-top: 10px;
    overflow: hidden;
    flex-shrink: 0;
    height: 80px;
}

@media screen and (min-width: 600px) { .pd_gallery_thumbs { height: 100px; } }

.pd_gallery_thumbs .swiper-wrapper {
    display: flex !important;
    flex-direction: row !important;
    gap: 8px;
}

.pd_gallery_thumb {
    width: 80px !important;
    height: 80px !important;
    min-width: 80px;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.25s ease;
    border: 2px solid transparent;
    box-sizing: border-box;
}

@media screen and (min-width: 600px) {
    .pd_gallery_thumb {
        width: 100px !important;
        height: 100px !important;
        min-width: 100px;
    }
}

.pd_gallery_thumb.swiper-slide-thumb-active {
    opacity: 1;
    border-color: #c08b30;
}

.pd_gallery_thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ナビゲーション矢印 */
.pd_gallery_prev,
.pd_gallery_next {
    color: #fff !important;
    width: 36px !important;
    height: 36px !important;
    background: rgba(0, 0, 0, 0.45);
    border-radius: 50%;
    transition: background 0.2s;
}

.pd_gallery_prev:hover,
.pd_gallery_next:hover {
    background: rgba(192, 139, 48, 0.8);
}

.pd_gallery_prev::after,
.pd_gallery_next::after {
    font-size: 16px !important;
}

/* ============================================================
   コメントカード
   ============================================================ */

.pd_comment_card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #fff;
    border-radius: 10px;
    padding: 20px;
    border-left: 4px solid #c08b30;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.pd_comment_icon {
    flex-shrink: 0;
    margin-top: 2px;
}

.pd_comment_text {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.7;
    color: #2c241e;
    letter-spacing: 0.02em;
}

@media screen and (min-width: 600px) { .pd_comment_text { font-size: 16px; } }

/* ============================================================
   情報カード
   ============================================================ */

.pd_info_card {
    background: #fff;
    border-radius: 10px;
    padding: 28px 24px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

@media screen and (min-width: 600px) { .pd_info_card { padding: 36px 32px; } }

/* テーブル */
.pd_info_table {
    width: 100%;
    border-collapse: collapse;
}

.pd_info_table th,
.pd_info_table td {
    padding: 14px 0;
    border-bottom: 1px solid #eee;
    text-align: left;
    vertical-align: top;
    font-size: 14px;
    line-height: 1.6;
}

.pd_info_table th {
    width: 90px;
    font-weight: 600;
    color: #2c241e;
    white-space: nowrap;
    padding-right: 16px;
}

@media screen and (min-width: 600px) {
    .pd_info_table th { width: 120px; }
    .pd_info_table th,
    .pd_info_table td { font-size: 15px; }
}

.pd_info_table td {
    color: #555;
}

.pd_info_table tr:last-child th,
.pd_info_table tr:last-child td {
    border-bottom: none;
}

.pd_new_open_badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #fff;
    background: linear-gradient(135deg, #c08b30, #d4a84b);
    padding: 2px 8px;
    border-radius: 4px;
    margin-left: 6px;
    vertical-align: middle;
}

.pd_link {
    color: #8a6d2e;
    text-decoration: none;
    word-break: break-all;
    transition: color 0.2s;
}

.pd_link:hover {
    color: #c08b30;
    text-decoration: underline;
}

/* ============================================================
   店舗PR
   ============================================================ */

.pd_description {
    font-size: 14px;
    line-height: 1.9;
    color: #555;
    letter-spacing: 0.02em;
}

@media screen and (min-width: 600px) { .pd_description { font-size: 15px; } }

/* ============================================================
   マップ
   ============================================================ */

.pd_map_wrap {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    border-radius: 8px;
    overflow: hidden;
}

.pd_map {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* ============================================================
   前後ナビ
   ============================================================ */

.pd_section--nav {
    padding-top: 8px;
}

.pd_nav {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pd_nav > * {
    flex: 1;
    display: flex;
    justify-content: center;
}

.pd_nav_link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    background: #fff;
    border: 1.5px solid #ddd7cd;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    color: #2c241e;
    text-decoration: none;
    transition: all 0.25s ease;
    white-space: nowrap;
}

.pd_nav_link:hover {
    background: #c08b30;
    color: #fff;
    border-color: #c08b30;
}

.pd_nav_arrow {
    font-size: 16px;
}

.pd_nav_list {
    color: #8a6d2e;
}

.pd_nav_list svg {
    width: 14px;
    height: 14px;
}

@media screen and (max-width: 599px) {
    .pd_nav_label { display: none; }
    .pd_nav_link { padding: 10px 12px; font-size: 12px; }
}

/* ============================================================
   CTA
   ============================================================ */

.pd_section--cta {
    padding-top: 16px;
    padding-bottom: 0;
    margin-bottom: 48px !important;
}

@media screen and (min-width: 600px) {
    .pd_section--cta { margin-bottom: 64px !important; }
}

.pd_cta_card {
    background: #2c241e;
    border-radius: 12px;
    padding: 48px 24px;
    text-align: center;
}

@media screen and (min-width: 600px) { .pd_cta_card { padding: 64px 40px; } }

.pd_cta_label {
    font-family: "Noto Serif JP", serif;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0.3em;
    color: #c08b30;
    margin-bottom: 8px;
}

.pd_cta_title {
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.06em;
    margin-bottom: 12px;
    line-height: 1.5;
}

@media screen and (min-width: 600px) { .pd_cta_title { font-size: 26px; } }

.pd_cta_text {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.6);
    line-height: 1.8;
    margin-bottom: 28px;
}

.pd_cta_buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

@media screen and (min-width: 600px) {
    .pd_cta_buttons { flex-direction: row; justify-content: center; }
}

.pd_cta_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 32px;
    border-radius: 50px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-decoration: none;
    transition: all 0.3s ease;
    min-width: 220px;
}

.pd_cta_btn--tel {
    color: #c08b30;
    border: 2px solid #c08b30;
    background: transparent;
}

.pd_cta_btn--tel:hover {
    background: #c08b30;
    color: #fff;
}

.pd_cta_btn--signup {
    color: #2c241e;
    background: linear-gradient(135deg, #c08b30, #d4a84b);
    border: 2px solid transparent;
}

.pd_cta_btn--signup:hover {
    background: linear-gradient(135deg, #d4a84b, #e0be6a);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(192, 139, 48, 0.3);
}

.pd_cta_note {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.35);
}

/* ============================================================
   フッターCTA非表示
   ============================================================ */

.footer_cta { display: none !important; }

/* ============================================================
   Swiper ローダー
   ============================================================ */

.swiper-lazy-preloader {
    border-color: rgba(192, 139, 48, 0.3) !important;
    border-top-color: #c08b30 !important;
}