/* ==========================================
   株式会社優京 カスタムスタイル
   ========================================== */

/* ------------------------------------------
   共通: 概要テーブル（物件・施工）
------------------------------------------ */
.property-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 2rem;
}
.property-table th,
.property-table td {
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,0.15);
    font-size: 14px;
    vertical-align: top;
}
.property-table th {
    background: rgba(255,255,255,0.06);
    color: #007dbb;
    font-weight: 500;
    width: 35%;
    white-space: nowrap;
}
.property-table td {
    color: #ccc;
}

/* ------------------------------------------
   共通: メイン画像・サムネイルカルーセル
------------------------------------------ */
.property-main-img {
    width: 100%;
    margin-bottom: 10px;
    border-radius: 4px;
    overflow: hidden;
    background: #000;
}
.property-main-img img {
    width: 100%;
    display: block;
    transition: opacity 0.25s ease;
}
.property-thumbs {
    margin-bottom: 2rem;
}
.property-thumbs .owl-item {
    cursor: pointer;
}
.property-thumbs .owl-item img {
    border-radius: 4px;
    aspect-ratio: 4/3;
    object-fit: cover;
    border: 2px solid transparent;
    opacity: 0.55;
    transition: opacity 0.2s ease, border-color 0.2s ease;
}
.property-thumbs .owl-item:hover img {
    opacity: 0.85;
}
.property-thumbs .owl-item.is-active-thumb img {
    border-color: #007dbb;
    opacity: 1;
}

/* ------------------------------------------
   物件詳細: 価格表示
------------------------------------------ */
.property-price {
    font-size: 28px;
    font-weight: 700;
    color: #007dbb;
    margin-bottom: 0.25rem;
}

/* ------------------------------------------
   共通: サイドバー お問い合わせボックス
------------------------------------------ */
.sidebar-contact-box {
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 6px;
    padding: 24px;
    margin-bottom: 2rem;
}

/* ------------------------------------------
   リフォーム事例詳細: Before / After
------------------------------------------ */
.before-after {
    display: flex;
    gap: 12px;
    margin-bottom: 2rem;
}
.before-after .ba-block {
    flex: 1;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
}
.before-after .ba-block img {
    width: 100%;
    display: block;
    aspect-ratio: 4/3;
    object-fit: cover;
}
.before-after .ba-label {
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(0,0,0,0.65);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 3px;
    letter-spacing: 0.05em;
}
.before-after .ba-label.after {
    background: rgba(0, 125, 187, 0.8);
}

/* ------------------------------------------
   最新情報: ニュースリスト
------------------------------------------ */
.news-item {
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding: 2rem 0;
}
.news-item:first-child {
    border-top: 1px solid rgba(255,255,255,0.1);
}
.news-date {
    font-size: 13px;
    color: #007dbb;
    font-family: 'Lato', sans-serif;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}
.news-item h4 a {
    color: #fff;
    text-decoration: none;
    transition: color 0.2s ease;
    font-size: 17px;
}
.news-item h4 a:hover {
    color: #007dbb;
}
.news-item p {
    color: #aaa;
    font-size: 14px;
    margin-top: 0.6rem;
    margin-bottom: 1rem;
    line-height: 1.75;
}
.news-cat {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    padding: 2px 10px;
    border: 1px solid #007dbb;
    color: #007dbb;
    border-radius: 2px;
    margin-bottom: 0.6rem;
}

/* ------------------------------------------
   お問い合わせ: 会社情報ボックス
------------------------------------------ */
.contact-info-box {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 6px;
    padding: 2rem;
    text-align: center;
    height: 100%;
}
.contact-info-box i {
    font-size: 2rem;
    color: #007dbb;
    margin-bottom: 1rem;
    display: block;
}
.contact-info-box h5 {
    color: #007dbb;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 0.75rem;
    letter-spacing: 0.05em;
}
.contact-info-box p {
    color: #ccc;
    font-size: 14px;
    line-height: 1.8;
    margin: 0;
}

/* ------------------------------------------
   お問い合わせ: フォーム
------------------------------------------ */
.contact-form-wrap {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 6px;
    padding: 2.5rem;
}
.contact-form-wrap .form-label {
    color: #ccc;
    font-size: 14px;
    margin-bottom: 0.4rem;
    display: block;
}
.contact-form-wrap .form-label .required {
    color: #007dbb;
    font-size: 11px;
    font-weight: 700;
    margin-left: 6px;
    border: 1px solid #007dbb;
    padding: 1px 5px;
    border-radius: 2px;
    vertical-align: middle;
}
.contact-form-wrap .form-control {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.18);
    color: #fff;
    border-radius: 4px;
    font-size: 14px;
}
.contact-form-wrap .form-control:focus {
    background: rgba(255,255,255,0.08);
    border-color: #007dbb;
    color: #fff;
    box-shadow: 0 0 0 2px rgba(0,125,187,0.2);
}
.contact-form-wrap .form-control::placeholder {
    color: rgba(255,255,255,0.3);
}
.contact-form-wrap select.form-control option {
    background: #1a1a2e;
    color: #fff;
}
.privacy-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 1.5rem;
    margin-bottom: 2rem;
}
.privacy-check input[type="checkbox"] {
    margin-top: 3px;
    flex-shrink: 0;
    accent-color: #007dbb;
    width: 16px;
    height: 16px;
    cursor: pointer;
}
.privacy-check label {
    color: #aaa;
    font-size: 13px;
    line-height: 1.6;
    cursor: pointer;
}
.privacy-check label a {
    color: #007dbb;
    text-decoration: underline;
}
#form-result {
    display: none;
    margin-bottom: 1rem;
}

/* ==========================================
   大道埠頭株式会社 追加スタイル
   ========================================== */

/* ------------------------------------------
   TOP: 事業内容アイコンボックス
------------------------------------------ */
.service-icon-box {
    display: block;
    text-decoration: none;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    overflow: hidden;
    transition: border-color 0.25s ease, transform 0.25s ease;
}
.service-icon-box:hover {
    border-color: #007dbb;
    transform: translateY(-4px);
    text-decoration: none;
}
.service-icon-box .service-icon-img {
    aspect-ratio: 1/1;
    overflow: hidden;
}
.service-icon-box .service-icon-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}
.service-icon-box:hover .service-icon-img img {
    transform: scale(1.08);
}
.service-icon-box .service-icon-label {
    padding: 14px 10px;
    text-align: center;
    color: #fff;
    font-size: 14px;
    line-height: 1.5;
}

/* ------------------------------------------
   共通: 事業内容 詳細セクション
------------------------------------------ */
.biz-section:not(:last-child) {
    margin-bottom: 4rem;
    padding-bottom: 4rem;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.biz-section .biz-eng {
    color: #007dbb;
    font-family: 'Lato', sans-serif;
    letter-spacing: 0.08em;
    font-size: 14px;
    margin-bottom: 4px;
}
.biz-section .biz-jp {
    color: #fff;
    font-size: 22px;
    font-weight: 500;
    margin-bottom: 18px;
}
.biz-section .biz-lead {
    color: #007dbb;
    font-size: 16px;
    margin-bottom: 14px;
}
.biz-section p {
    color: #ccc;
    font-size: 14px;
    line-height: 2;
}
.biz-section img {
    width: 100%;
    border-radius: 4px;
    object-fit: cover;
}

/* ------------------------------------------
   事業所紹介: メイン拠点（鶴町作業所）
------------------------------------------ */
.workshop-main {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(0,125,187,0.3);
    border-radius: 6px;
    padding: 2.5rem;
    margin-bottom: 4rem;
}
.workshop-main .workshop-tag {
    display: inline-block;
    background: #007dbb;
    color: #fff;
    font-size: 12px;
    letter-spacing: 0.05em;
    padding: 4px 14px;
    border-radius: 2px;
    margin-bottom: 14px;
}
.workshop-main h3 {
    color: #fff;
    font-size: 26px;
    margin-bottom: 6px;
}
.workshop-main .workshop-addr {
    color: #999;
    font-size: 14px;
    margin-bottom: 20px;
}
.workshop-main img {
    width: 100%;
    border-radius: 4px;
    object-fit: cover;
    aspect-ratio: 4/3;
    margin-bottom: 20px;
}
.workshop-spec-table {
    width: 100%;
}
.workshop-spec-table th {
    color: #007dbb;
    font-weight: 400;
    font-size: 14px;
    padding: 8px 14px 8px 0;
    vertical-align: top;
    white-space: nowrap;
    width: 1%;
}
.workshop-spec-table td {
    color: #ccc;
    font-size: 14px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    line-height: 1.8;
}

/* ------------------------------------------
   事業所紹介: その他拠点リスト
------------------------------------------ */
.workshop-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    overflow: hidden;
    height: 100%;
}
.workshop-card img {
    width: 100%;
    aspect-ratio: 3/2;
    object-fit: cover;
}
.workshop-card .workshop-card-body {
    padding: 20px;
}
.workshop-card h4 {
    color: #fff;
    font-size: 17px;
    margin-bottom: 4px;
}
.workshop-card .workshop-card-addr {
    color: #007dbb;
    font-size: 13px;
    margin-bottom: 12px;
}
.workshop-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.workshop-card ul li {
    color: #ccc;
    font-size: 13px;
    line-height: 1.9;
    padding-left: 1em;
    text-indent: -1em;
}
.workshop-card ul li::before {
    content: "・";
    color: #007dbb;
}

/* ------------------------------------------
   設備内容: 設備カード
------------------------------------------ */
.equip-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px;
    overflow: hidden;
    height: 100%;
}
.equip-card img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
}
.equip-card .equip-card-body {
    padding: 20px;
}
.equip-card .equip-eng {
    color: #007dbb;
    font-family: 'Lato', sans-serif;
    font-size: 12px;
    letter-spacing: 0.06em;
}
.equip-card h4 {
    color: #fff;
    font-size: 17px;
    margin: 2px 0 12px;
}
.equip-card p {
    color: #ccc;
    font-size: 13px;
    line-height: 1.9;
    margin: 0;
}

/* ------------------------------------------
   会社概要: 沿革テーブル
------------------------------------------ */
.history-table {
    width: 100%;
    border-collapse: collapse;
}
.history-table tr {
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.history-table th {
    width: 140px;
    padding: 14px 16px;
    color: #007dbb;
    font-weight: 400;
    font-size: 14px;
    white-space: nowrap;
    vertical-align: top;
}
.history-table td {
    padding: 14px 16px 14px 0;
    color: #ccc;
    font-size: 14px;
    line-height: 1.8;
    vertical-align: top;
}

/* ------------------------------------------
   会社概要: 主要取引先タグ
------------------------------------------ */
.client-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.client-tags span {
    display: inline-block;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.15);
    color: #ccc;
    font-size: 13px;
    padding: 6px 14px;
    border-radius: 3px;
}

/* ------------------------------------------
   WORKSHOPS: TOPページ カルーセル用キャプション
------------------------------------------ */
.top-carousel-caption {
    padding: 14px 4px 0;
    color: #ccc;
    font-size: 13px;
    text-align: center;
}

/* ------------------------------------------
   優京テンプレート由来の背景写真を無効化し
   ダークトーンの単色背景に統一
------------------------------------------ */
.blog-bg {
    background-image: none !important;
    background-color: #111111;
}
.contact-sec {
    background-image: none !important;
    background-color: #0d0d0d;
}
.footer {
    background-image: none !important;
    background-color: #0a0a0a;
    border-top: 1px solid rgba(255,255,255,0.08);
}

/* ------------------------------------------
   メインビジュアル: 暗いオーバーレイを解除
------------------------------------------ */
.slider-section .slider-overlay {
    background-color: transparent !important;
}

/* ------------------------------------------
   ロゴ(svg)のサイズ調整
------------------------------------------ */
header a.logo img,
.side-menu .logo img {
    height: 32px;
    width: auto;
    max-width: none;
}
@media screen and (max-width: 768px) {
    header a.logo img {
        height: 26px;
        max-width: none;
    }
}

/* ------------------------------------------
   事業内容: フロー図（産業廃棄物リサイクル）
------------------------------------------ */
.flow-diagram {
    display: flex;
    flex-direction: column;
}
.flow-step {
    background: #232323;
    border-left: 4px solid #007dbb;
    padding: 20px 24px;
    text-align: center;
}
.flow-step:nth-child(odd) { background: #262626; }
.flow-step h5 {
    color: #fff;
    font-size: 18px;
    margin-bottom: 6px;
}
.flow-step p {
    color: #999;
    font-size: 12.5px;
    margin: 2px 0 0;
    line-height: 1.6;
}
.flow-arrow {
    text-align: center;
    color: #007dbb;
    font-size: 18px;
    line-height: 1;
    padding: 4px 0;
    background: #1a1a1a;
}

/* ------------------------------------------
   事業内容: データ・許可情報テーブル
------------------------------------------ */
.report-table-wrap {
    overflow-x: auto;
    margin-bottom: 1.5rem;
}
.report-table {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
}
.report-table th,
.report-table td {
    border: 1px solid rgba(255,255,255,0.15);
    padding: 10px 12px;
    font-size: 13.5px;
    vertical-align: middle;
    text-align: center;
}
.report-table thead th {
    background: rgba(0,125,187,0.18);
    color: #fff;
    font-weight: 500;
}
.report-table td {
    color: #ccc;
}
.report-table tfoot td {
    color: #fff;
    font-weight: 600;
    background: rgba(255,255,255,0.05);
}
.license-note {
    color: #ccc;
    font-size: 14px;
    line-height: 1.9;
}
.license-note h5 {
    color: #007dbb;
    font-size: 15px;
    margin: 1.6rem 0 0.6rem;
}
.license-note h5:first-child { margin-top: 0; }
.license-note ul, .license-note ol {
    padding-left: 1.4em;
    margin-bottom: 0.6rem;
}
.license-note li { margin-bottom: 4px; }
.font-13 { font-size: 13px !important; }

/* ------------------------------------------
   下層ページ見出し（h2化にあわせてサイズ調整）
------------------------------------------ */
.standalone-detail .heading {
    font-size: 35px;
}

/* ------------------------------------------
   お問い合わせ: STEPインジケーター
------------------------------------------ */
.form-steps {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 2rem;
}
.form-steps .step-item {
    color: #777;
    font-size: 13px;
    font-weight: 600;
    padding: 7px 18px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 20px;
    letter-spacing: 0.03em;
}
.form-steps .step-item.active {
    color: #fff;
    border-color: #007dbb;
    background: rgba(0,125,187,0.18);
}
.form-steps .step-sep {
    color: #444;
}

/* ------------------------------------------
   お問い合わせ: 確認画面テーブルの折り返し崩れ対策
------------------------------------------ */
#form-step-2 .company-table {
    table-layout: fixed;
}
#form-step-2 .company-table-th {
    width: 160px;
    white-space: nowrap;
}
#form-step-2 .company-table-td {
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: pre-wrap;
}