@charset "UTF-8";

/*
 * ==========================================================================
 *  改修日時: 2026年8月23日 (JST)
 *  担当: 岸野 健寿
 *  概要: 全統合
 *  対象: racersnavi.com, skydoctor.html_skydoor.jp, account.html_skydoor.jp
 * ==========================================================================
 */

/* ***********************************************************************************************************
    1. 変数
*********************************************************************************************************** */
:root {
    /* テーマ色 */
    --sd-theme-bg-rn: #D00;
    --sd-theme-text-rn: #FFF;
    --sd-theme-bg-sd: #0094ea;
    --sd-theme-text-sd: #FFF;
    --sd-theme-strong-sd: #00598e;

    --sd-theme-bg-rn-dark: #D00;
    --sd-theme-text-rn-dark: #DDD;
    --sd-theme-bg-sd-dark: #004872;
    --sd-theme-text-sd-dark: #DDD;
    
    /* 標準色 */
    --sd-white-blight: #FFF;
    --sd-white-light: #EEE;
    --sd-white-default: #DDD;
    --sd-white-deep: #CCC;

    --sd-gray-blight: #AAA;
    --sd-gray-light: #999;
    --sd-gray-default: #888;
    --sd-gray-deep: #777;

    --sd-black-blight: #555;
    --sd-black-light: #444;
    --sd-black-default: #333;
    --sd-black-deep: #222;

    --sd-red-blight: #ffbbcc;
    --sd-red-light: #FF6699;
    --sd-red-default: #B22;
    --sd-red-deep: #722;

    --sd-green-blight: #98daa5;
    --sd-green-light: #33CC66;
    --sd-green-default: #292;
    --sd-green-deep: #272;

    --sd-blue-blight: #88ccff;
    --sd-blue-light: #0099FF;
    --sd-blue-default: #22D;
    --sd-blue-deep: #227;

    --sd-purple-blight: #aa99aa;
    --sd-purple-light: #774477;
    --sd-purple-default: #800080;
    --sd-purple-deep: #550055;

    --sd-orange-blight: #ffeecc;
    --sd-orange-light: #FFDD99;
    --sd-orange-default: #ffa500;
    --sd-orange-deep: #B72;

    --sd-yellow-blight: #f5efc7;
    --sd-yellow-light: #FFEE88;
    --sd-yellow-default: #dbbb05;
    --sd-yellow-deep: #c2a500;
    
    /* 罫線 */
    --sd-border-main: var(--sd-white-deep);
    --sd-border-main-dark: var(--sd-black-blight);

    /* 色セット */
    --sd-bg-main: var(--sd-white-light);
    --sd-text-main: var(--sd-black-blight);
    --sd-bg-main-strong: var(--sd-white-deep);
    --sd-text-main-strong: var(--sd-black-blight);

    --sd-bg-red: var(--sd-red-blight);
    --sd-text-red: var(--sd-red-default);
    --sd-bg-red-strong: var(--sd-red-default);
    --sd-text-red-strong: var(--sd-white-default);

    --sd-bg-green: var(--sd-green-blight);
    --sd-text-green: var(--sd-green-default);
    --sd-bg-green-strong: var(--sd-green-default);
    --sd-text-green-strong: var(--sd-white-default);

    --sd-bg-blue: var(--sd-blue-blight);
    --sd-text-blue: var(--sd-blue-default);
    --sd-bg-blue-strong: var(--sd-blue-default);
    --sd-text-blue-strong: var(--sd-white-default);

    --sd-bg-purple: var(--sd-purple-blight);
    --sd-text-purple: var(--sd-purple-default);
    --sd-bg-purple-strong: var(--sd-purple-default);
    --sd-text-purple-strong: var(--sd-white-default);
    
    --sd-bg-orange: var(--sd-orange-blight);
    --sd-text-orange: var(--sd-orange-default);
    --sd-bg-orange-strong: var(--sd-orange-default);
    --sd-text-orange-strong: var(--sd-black-default);
    
    --sd-bg-yellow: var(--sd-yellow-blight);
    --sd-text-yellow: var(--sd-yellow-default);
    --sd-bg-yellow-strong: var(--sd-yellow-default);
    --sd-text-yellow-strong: var(--sd-black-default);
    
    /* 色セット（ダークモード） */
    --sd-bg-main-dark: var(--sd-black-deep);
    --sd-text-main-dark: var(--sd-white-default);
    --sd-bg-main-strong-dark: var(--sd-black-light);
    --sd-text-main-strong-dark: var(--sd-white-light);

    --sd-bg-red-dark: var(--sd-red-deep);
    --sd-text-red-dark: var(--sd-white-deep);
    --sd-bg-red-strong-dark: var(--sd-red-default);
    --sd-text-red-strong-dark: var(--sd-white-deep);

    --sd-bg-green-dark: var(--sd-green-deep);
    --sd-text-green-dark: var(--sd-white-deep);
    --sd-bg-green-strong-dark: var(--sd-green-default);
    --sd-text-green-strong-dark: var(--sd-white-deep);

    --sd-bg-blue-dark: var(--sd-blue-deep);
    --sd-text-blue-dark: var(--sd-white-deep);
    --sd-bg-blue-strong-dark: var(--sd-blue-default);
    --sd-text-blue-strong-dark: var(--sd-white-deep);

    --sd-bg-purple-dark: var(--sd-purple-deep);
    --sd-text-purple-dark: var(--sd-white-blight);
    --sd-bg-purple-strong-dark: var(--sd-purple-default);
    --sd-text-purple-strong-dark: var(--sd-white-blight);

    --sd-bg-orange-dark: var(--sd-orange-deep);
    --sd-text-orange-dark: var(--sd-black-light);
    --sd-bg-orange-strong-dark: var(--sd-orange-default);
    --sd-text-orange-strong-dark: var(--sd-black-light);

    --sd-bg-yellow-dark: var(--sd-yellow-deep);
    --sd-text-yellow-dark: var(--sd-black-light);
    --sd-bg-yellow-strong-dark: var(--sd-yellow-default);
    --sd-text-yellow-strong-dark: var(--sd-black-light);

    
    /* 曜日・営業日・当日 */
    --sd-week-bg-sunday: var(--sd-bg-red);
    --sd-week-text-sunday: var(--sd-text-red);
    --sd-week-bg-sunday-strong: var(--sd-bg-red-strong);
    --sd-week-text-sunday-strong: var(--sd-text-red-strong);

    --sd-week-bg-holiday: var(--sd-week-bg-sunday);
    --sd-week-text-holiday: var(--sd-week-text-sunday);
    --sd-week-bg-holiday-strong: var(--sd-week-bg-sunday-strong);
    --sd-week-text-holiday-strong: var(--sd-week-text-sunday-strong);

    --sd-week-bg-saturday: var(--sd-bg-blue);
    --sd-week-text-saturday: var(--sd-text-blue);
    --sd-week-bg-saturday-strong: var(--sd-bg-blue-strong);
    --sd-week-text-saturday-strong: var(--sd-text-blue-strong);

    --sd-week-bg-closed: var(--sd-bg-green);
    --sd-week-text-closed: var(--sd-text-green);
    --sd-week-bg-closed-strong: var(--sd-bg-green-strong);
    --sd-week-text-closed-strong: var(--sd-text-green-strong);

    --sd-week-bg-today: var(--sd-bg-yellow);
    --sd-week-text-today: var(--sd-text-yellow);
    --sd-week-bg-today-strong: var(--sd-bg-yellow-strong);
    --sd-week-text-today-strong: var(--sd-text-yellow-strong);
    
    /* 曜日・営業日・当日（ダークモード） */
    --sd-week-bg-sunday-dark: var(--sd-bg-red-dark);
    --sd-week-text-sunday-dark: var(--sd-text-red-dark);
    --sd-week-bg-sunday-strong-dark: var(--sd-bg-red-strong-dark);
    --sd-week-text-sunday-strong-dark: var(--sd-text-red-strong-dark);

    --sd-week-bg-holiday-dark: var(--sd-week-bg-sunday-dark);
    --sd-week-text-holiday-dark: var(--sd-week-text-sunday-dark);
    --sd-week-bg-holiday-strong-dark: var(--sd-week-bg-sunday-strong-dark);
    --sd-week-text-holiday-strong-dark: var(--sd-week-text-sunday-strong-dark);

    --sd-week-bg-saturday-dark: var(--sd-bg-blue-dark);
    --sd-week-text-saturday-dark: var(--sd-text-blue-dark);
    --sd-week-bg-saturday-strong-dark: var(--sd-bg-blue-strong-dark);
    --sd-week-text-saturday-strong-dark: var(--sd-text-blue-strong-dark);

    --sd-week-bg-closed-dark: var(--sd-bg-green-dark);
    --sd-week-text-closed-dark: var(--sd-text-green-dark);
    --sd-week-bg-closed-strong-dark: var(--sd-bg-green-strong-dark);
    --sd-week-text-closed-strong-dark: var(--sd-text-green-strong-dark);

    --sd-week-bg-today-dark: var(--sd-bg-orange-dark);
    --sd-week-text-today-dark: var(--sd-text-orange-dark);
    --sd-week-bg-today-strong-dark: var(--sd-bg-orange-strong-dark);
    --sd-week-text-today-strong-dark: var(--sd-text-orange-strong-dark);
}

/* ***********************************************************************************************************
    2. ブライト・ダーク混合記載
*********************************************************************************************************** */
/* ==========================================================================
1. #wrap_all の外部で有効
========================================================================== */
* {
    box-sizing: border-box;
}
html {
    background-color: transparent;
    /* datepicker */
    #top {
        & #ui-datepicker-div {
            & .ui-datepicker-title {
                display: flex;
                justify-content: space-between;
                align-items: center;
                & select:is(.ui-datepicker-year, .ui-datepicker-month) {
                    margin-bottom: 0px;
                }
            }
            & .ui-datepicker-calendar {
                & td.ui-datepicker-current-day {
                    & a {
                        background: none;
                        background-color: var(--sd-week-bg-closed);   /* 背景色 */
                        color: var(--sd-week-text-closed);       /* 文字色 */
                    }
                }
                & td.ui-datepicker-today {
                    & a {
                        background: none;
                        background-color: var(--sd-week-bg-today);   /* 背景色 */
                        color: var(--sd-week-text-today);       /* 文字色 */
                    }
                }
                & td.ui-datepicker-week-end {
                    /* 日曜 */
                    &:last-child a.ui-state-default {
                        background: none;
                        background-color: var(--sd-week-bg-sunday);   /* 背景色 */
                        color: var(--sd-week-text-sunday);       /* 文字色 */
                    }
                    /* 土曜*/
                    &:nth-child(6) a.ui-state-default {
                        background: none;
                        background-color: var(--sd-week-bg-saturday);   /* 背景色 */
                        color: var(--sd-week-text-saturday);       /* 文字色 */
                    }
                }
            }
        }
        & :is(.ui-datepicker-trigger, .dateclear) {
            cursor: pointer;
        }
    }
}

/* ==========================================================================
2. #wrap_all の内部で有効
========================================================================== */
/* ---------------------------------------------
2-1. テーマ連動のベース背景・テキスト
--------------------------------------------- */
body#top #wrap_all {
    & .sd-red               { color: var(--sd-text-red); }
    & .sd-green             { color: var(--sd-text-green); }
    & .sd-blue              { color: var(--sd-text-blue); }
    & .sd-orange            { color: var(--sd-text-orange); }
    & .sd-yellow            { color: var(--sd-text-yellow); }
    
    & .sd-red-strong        { color: var(--sd-text-red-strong); }
    & .sd-green-strong      { color: var(--sd-text-green-strong); }
    & .sd-blue-strong       { color: var(--sd-text-blue-strong); }
    & .sd-orange-strong     { color: var(--sd-text-orange-strong); }
    & .sd-yellow-strong     { color: var(--sd-text-yellow-strong); }
            
    & .sd-bg-red            { background-color: var(--sd-bg-red); }
    & .sd-bg-green          { background-color: var(--sd-bg-green); }
    & .sd-bg-blue           { background-color: var(--sd-bg-blue); }
    & .sd-bg-orange         { background-color: var(--sd-bg-orange); }
    & .sd-bg-yellow         { background-color: var(--sd-bg-yellow); }

    .html_sd-dark & {
        .html_skydoor & {
            & .sd-red      { color: var(--sd-text-red-dark); }
            & .sd-green    { color: var(--sd-text-green-dark); }
            & .sd-blue     { color: var(--sd-text-blue-dark); }
            & .sd-orange   { color: var(--sd-text-orange-dark); }
            & .sd-yellow   { color: var(--sd-text-yellow-dark); }
            
            & .sd-red-strong      { color: var(--sd-text-red-dark); }
            & .sd-green-strong    { color: var(--sd-text-green-dark); }
            & .sd-blue-strong     { color: var(--sd-text-blue-dark); }
            & .sd-orange-strong   { color: var(--sd-text-orange-dark); }
            & .sd-yellow-strong   { color: var(--sd-text-yellow-dark); }
            
            & .sd-bg-red        { background-color: var(--sd-bg-red-dark); }
            & .sd-bg-green      { background-color: var(--sd-bg-green-dark); }
            & .sd-bg-blue       { background-color: var(--sd-bg-blue-dark); }
            & .sd-bg-orange     { background-color: var(--sd-bg-orange-dark); }
            & .sd-bg-yellow     { background-color: var(--sd-bg-yellow-dark); }
        }
    }

    color: var(--sd-text-main);
    box-sizing: border-box;
    text-align: left;
    background-color: transparent;
    text-transform: none;

    & #scroll-top-link{
        background-color: rgb(230,0,82);
        &:hover {
            color: rgb(230,0,82);
            border: 1px solid rgb(230,0,82);
        }
    }

    &, 
    & div.main_color, 
    & header#header, 
    & header#header .header_bg, 
    & .sdl-wrap {
        background-color: var(--sd-bg-main);
        color: var(--sd-text-main);
        border: none;
        .html_sd-dark & {
            .html_skydoor & {
                background-color: var(--sd-bg-main-dark);
                color: var(--sd-text-main-dark);
            }
        }
    }

    & :is(h1, h2, h3, h4, h5, h6, h7, #top .title_container .main-title) {
        font-family: helvetica, arial, 'hiragino kaku gothic pro', meiryo, 'ms pgothic', sans-serif;
    }

    /* ---------------------------------------------
    2-1-1. 開発モード表示
    --------------------------------------------- */
    & .sdl-development-view-bg {
        background-image: url('/img/bg_test.png');
    }

    /* **************************************************************************
        Avia
    ************************************************************************** */
    /* 共通見出し */
    & h2 {
        @media (min-width: 768px) {
            font-size: 32px;
            line-height: 40px;
        }
        @media (max-width: 767px) {
            font-size: 25px;
            line-height: 35px;
        }
    }
    /* 検索フォーム（複数設置） */
    & #searchform {
        & input#s {
            border: 1px solid #fc6035;
            border-radius: 3px;
        }
        /* & #searchsubmit {} (空のため省略) */
    }

    /* AddtoAny シェアボタン（複数設置*/
    & .a2a_kit {

        & .a2a_full_footer {
            display: none;
        }

        & .a2a_menu .a2a_menu_find_container {
            padding-right: 40px;
            
            & input#a2apage_find {
                border: none;
                width: 100%;
                margin: 0px 38px;
                padding: 2px 0;
                left: 0px;
                
                &:focus {
                    box-shadow: none;
                }
            }
        }
        :is(.html_sdl-salespage, .html_sdl-maintenancepage) & {
            &,
            & .addtoany_share_save_container {
                display: none;
            }
        }
    }

    /* ????? */
    & .ui-state-focus {
        white-space: nowrap;
    }

    & :is(
        .avia-caption-title,
        .avia-caption-content,
        .widgettitle,
        .post-entry .entry-content-wrapper .post_title,
        #main .av-special-heading .av-special-heading-tag
    ) {
        text-transform: none;
    }
    /* 各所に多数あり */
    & .container {
        padding: 0 20px;
    }

    & .content {
        padding-bottom: 20px;
        padding-top: 20px;
    }

    /* ---------------------------------------------
    2-1-3. 別ウインドウオープンのリンクアイコン付与
    --------------------------------------------- */
    & :is(
        #header_main_alternate .menu-item-top-level .sub-menu a,
        .sdl-button-mini,
        a.sdl-external-link
    )[target="_blank"]::after { 
        content: url('/img/jump_12_black.png'); 
        padding-left: 3px; 
        vertical-align: middle; 
    }
    & :is(
        #header_main_alternate .menu-item-top-level a,
        #footer .textwidget a,
        .sdl-button-pdf,
        .sdl-button-xls,
        a.avia-button
    )[target="_blank"]::after { 
        content: url('/img/jump_12_white.png'); 
        padding-left: 3px; 
        vertical-align: middle; 
    }

    /* ---------------------------------------------
    2-1-4. 見出し下部の罫線を消去
    --------------------------------------------- */
    & .special-heading-border{
        display:none;
    }

    /* ---------------------------------------------
    2-1-4. テーマ出力文字のダークモード
    --------------------------------------------- */
    .html_sd-dark & {
        .html_skydoor & {
            & h2 {
                color: var(--sd-text-main-dark);
                & a{
                    color: var(--sd-text-main-dark);
                }
            }
        }
    }

    /* **************************************************************************
        テーマのCSS（非SDL）
    ************************************************************************** */
    /* **************************************************************************
        ヘッダー（テーマ）
    ************************************************************************** */
    .html_header_top.html_header_sticky & {
        & #main {
            padding-top: 99px;
        }
    }
    & #header {
        /* ヘッダー全体（ロゴ含む） */
        & #header_main {
            border: none; 
            border-bottom-width: 0px;
            
            /* ロゴ周り */
            & .logo {
                margin-top: 5px;
                & img{
                    height: 40px;
                }
                .responsive & img {
                    @media (max-width: 479px) {
                        max-width: 150px;
                    }
                }
                @media (max-width: 767px) {
                    display: none;
                }
            }

            & .social_bookmarks {
                @media (max-width: 479px) {
                    display: none;
                }
            }
            /*  二段目のヘッダー（メニュー等） */
            & #header_main_alternate {
                border: none; 
                background: linear-gradient(to bottom, rgba(236, 0, 0, 1) 0%, rgba(200, 0, 0, 1) 100%);

                .skydoor & {
                    background: none;
                    background-color: var(--sd-theme-bg-sd); 
                }
                .html_sd-dark & {
                    .html_skydoor & {
                        background: none;
                        background-color: var(--sd-theme-bg-sd-dark); 
                        color: var(--sd-theme-text-sd-dark); 
                    }
                }
                .html_sdl-salespage & {
                    background: linear-gradient(to bottom, rgba(20, 0, 0, 1) 0%, rgba(50, 0, 0, 1) 100%);
                }
                
                .html_sdl-maintenancepage & {
                    background: linear-gradient(to bottom, rgba(0, 0, 150, 1) 0%, rgba(0, 0, 120, 1) 100%);
                }
                /* メニュー */
                & ul#avia-menu {
                    & li.menu-item-top-level {
                        & > a {
                            color: #FFF;
                            & .avia-menu-fx {
                                height: 5px;
                                .html_sd-dark & {
                                    .html_skydoor & {
                                        background-color: var(--sd-theme-bg-sd-dark);     
                                    }
                                }
                            }
                        }
                        /* メニュー矢印 */
                        &.menu-item-has-children {
                            & > a .avia-menu-text {
                                background-image: url("/img/avia-arrow.png");
                                background-position: center bottom;
                                background-repeat: no-repeat;
                                padding-bottom: 6px;
                            }
                            & .menu-item-has-children > a {
                                background-image: url("/img/avia-arrow_right.png");
                                background-position: right center;
                                background-repeat: no-repeat;
                                padding-bottom: 6px;
                            }
                        }
                    }
                    & .sub-menu {
                        width: 250px;
                        border: 8px solid #faeded;
                        border-radius: 3px;
                    }
                    /* メインメニュー右寄せ対応 */
                    & li.menu-float-right {
                        float: right;
                    }
                }
            }
        }
    }
    
    /* **************************************************************************
        メインコンテンツ（テーマ）（ヘッダーより下（フッター含む）
    ************************************************************************** */
    & #main {
        & .container img{
            border-width: 1px;
            border-style: solid;
        }

        /* 目次 */
        & #skydoor-wp-page #ez-toc-container {
            margin-left: 0px;
        }
        & table.avia-table.avia-data-table {
            & .avia-highlight-col
            {
                background-color:#0094ea;
                color:#FFF;
                font-weight:bold;
            }
        }

        /* **************************************************************************
            テンプレートビルダーエリア
        ************************************************************************** */
        & #skydoor-wp-page {
            /* トップヘッダースライダー */
            & #full_slider_1 {
                & li {
                    &:is(.slide-1, .slide-2, .slide-3, .slide-4, .slide-5) a img {
                        vertical-align: middle;
                        top: 50%;
                        transform: translateY(-50%);
                        cursor: default;
                    }
                    
                    & a {
                        @media (min-width: 768px) { height: 550px; }
                        @media (max-width: 767px) { height: 400px; }
                        @media (max-width: 479px) { height: 220px; }
                    }
                }
            }

            /* **************************************************************************
                メインコンテンツ（左エリア）
            ************************************************************************** */
            & .template-page {
                
                /* シャドウとエフェクト */
                & :is(.small-preview, .slide-image, .avia-button) {
                    box-shadow: 3px 3px 4px #CCC;
                }

                /* Text Block */
                & .avia_textblock {
                    & h3 {
                        padding-bottom: 3px;
                        border-bottom: solid 2px #b00;
                    }
                    & h5 {
                        font-size: 15px;
                        line-height: 15px;
                        color: #444;
                    }
                }
                /* コンテンツスライダー（主にトップ画面 */
                & .avia-content-slider {
                    & article {
                        border: 1px solid #DDD;
                        border-bottom: 3px solid #D00;
                        border-radius: 3px;
                        
                        &.post-entry {
                            margin-bottom: 15px;
                            & .slide-image {
                                box-shadow: none;
                                margin-bottom: 0px;
                                border-radius: 0px;
                                
                                & img {
                                    border: none;
                                    border-radius: 0px;
                                }
                                &:hover .image-overlay {
                                    opacity: 0.3;
                                }
                            }
                            & .slide-content {
                                background-color: #FAFAFA;
                                padding: 0px;
                                width: 100%;
                                min-height: 50px;
                                
                                @media (max-width: 989px) { min-height: 48px; }
                                @media (min-width: 768px) and (max-width: 989px) { min-height: 46px; }
                                @media (max-width: 767px) { min-height: 48px; }

                                & h3 {
                                    &, &:visited, &:active {
                                        line-height: 1.2em;
                                        background-color: transparent;
                                        color: #444;
                                        
                                        @media (max-width: 989px) { font-size: 12px; }
                                        @media (min-width: 768px) and (max-width: 989px) { font-size: 11px; }
                                        @media (max-width: 767px) { font-size: 13px; }
                                    }
                                }
                                & .slide-meta time {
                                    color: #777;
                                }
                                
                                & .entry-content-header {
                                    padding: 2%;
                                }
                                
                                & .rn-cf-post-box,
                                & .slide-entry-excerpt {
                                    padding-left: 2%;
                                    padding-right: 2%;
                                }
                                & .rn-cf-post-box {
                                    font-size: 90%;
                                    line-height: 1.5em;
                                }
                            }
                        }
                    }
                }

                /* Masonry Load More */
                & .av-masonry-load-more {
                    background: linear-gradient(to bottom, rgba(236, 0, 0, 1) 0%, rgba(200, 0, 0, 1) 100%);
                    color: #FFF;
                    border-radius: 3px;
                    margin-top: 1em;
                    
                    &:link {
                        color: #FFF;
                    }
                }

                /* ========================================================
                以下は、各エリアに共通のパーツ
                ======================================================== */
                /* 投稿 */
                & .post-entry {
                    & .entry-content-wrapper {
                        padding-right: 20px;

                        & p {
                            font-size: 16px;
                            line-height: 1.8em;
                            margin-bottom: 1.8em;
                        }

                        /* 投稿のタイトル */
                        & .post_title {
                            /* 投稿の開催日とサーキット */
                            & #main .rn-event-info li {
                                list-style-type: none;
                                float: left;
                                margin-left: 1em;
                                
                                & .rn-event-info-value {
                                    font-weight: bold;
                                    color: #F30;
                                    font-size: 120%;
                                    margin-left: 0.5em;
                                }
                            }
                        }
                    }
                }
                
                /* **************************************************************************
                    5. Blog & Posts
                ************************************************************************** */
                & .flex_column .template-blog .post_delimiter {
                    margin: 0 0 10px;
                    padding: 0;
                }
                & .template-blog {
                    & .blog-meta {
                        margin-right: 20px;
                    }
                    
                    & .post-meta-infos {
                        display: none;
                    }
                    
                    & .entry-content {
                        line-height: 17px;
                        
                        & p {
                            margin-top: 3px;
                        }
                    }
                    
                    & .post-title {
                        padding-bottom: 3px;
                        margin-bottom: 3px;
                        border-bottom: dashed 2px #DDD;
                    }
                }
                
                /* **************************************************************************
                    7. Contact Form (WPForms / CF7)
                ************************************************************************** */
                & .wpc7 {
                    & .contact {
                        & .wpcf7-form-control-wrap {
                            margin-bottom: 15px;
                            & :is(.input-text, input[type="text"], input[type="email"], input[type="tel"], select, textarea) {
                                border: solid 1px #0b3a66;
                                border-radius: 3px;
                                background-color: #fcfcfc;
                                color: #444;
                                margin-bottom: 5px;
                                
                                &:focus {
                                    background-color: #ffd;
                                }
                            }
                            
                            & input {
                                width: 100%;    
                                & input[type="submit"] {
                                    font-size: 115%;
                                    font-weight: bold;
                                    border-radius: 3px;
                                    margin-top: 20px;
                                }            
                            }
                            & select {
                                width: auto;
                            }
                            
                            & :is(input, select) {
                                & .wpcf7-validates-as-required {
                                    border: solid 3px;
                                }
                                
                                & .wpcf7-not-valid {
                                    border: solid 3px #F66;
                                }
                            }

                            & h5 {
                                margin-top: 3em;
                            }
                            
                            & .contact_section {
                                margin-left: 2em;
                                margin-right: 2em;
                            }
                                
                            & .wpcf7-response-output {
                                color: #FFF;
                                background-color: #F33;
                                font-weight: bold;
                                margin-top: 1em;
                                margin-bottom: 1em;
                                border: none;
                                
                                &.wpcf7-mail-sent-ok {
                                    background-color: #00cc00;
                                }
                            }
                            & .wpcf7-not-valid-tip {
                                color: #F33;
                                margin-top: 5px;
                                margin-bottom: 1em;
                                font-weight: bold;
                                font-size: 110%;
                            }

                            & .wpcf7-validation-errors {
                                font-size: 120%;
                                font-weight: bold;
                                margin-top: 5px;
                                margin-bottom: 5px;
                                color: #F66;
                            }
                        }
                    }
                }
    
                /* 下部区切り */
                & .sd-separator-lower-content {
                    margin-top: 5em;
                    margin-bottom: 5em;
                }
            }
            /* **************************************************************************
                サイドバー
            ************************************************************************** */
            & aside.sidebar {
                padding-top: 10px;
                padding-bottom: 20px;
                & :is(.comments-link, .nocomments, .blog-author) {
                    display: none;
                }
                & .inner_sidebar {
                    margin-left: 0px;
                    & .widget {
                        padding-bottom: 0px;
                    }
                    /* Combo Widget */
                    & .avia_combo_widget .tabcontainer {
                        border: 1px solid #DDD;
                        
                        & .tab_titles {
                            border-bottom: 1px solid #DDD;
                            
                            & .tab {
                                border-left: 1px solid #DDD;
                                border-right: 1px solid #DDD;
                                
                                &.active_tab {
                                    background-color: #EEE;
                                }
                            }
                        }
                        
                        & .tab_content li.news-content {
                            border-bottom: 1px solid #DDD;
                        }
                    }
                }
            }
            /* **************************************************************************
                フッター
            ************************************************************************** */
            & #footer {
                background-color: var(--sd-theme-bg-sd-dark); 
                color: var(--sd-theme-text-sd-dark); 
                border: none; 
                & .container {
                    font-size: 90%;
                    line-height: 1.1em;
                    
                    & a {
                        &:is(:link, :visited, :active) {
                            color: #CCC;
                        }
                    }
                    
                    & .current-menu-item {
                        background-color: transparent;
                    }
                }
            }

            & footer#socket {
                border: none; 
                padding-bottom: 4em;
            }
        }
    }
    /* ==========================================================================
    5. サイドバー（テーマ）
    ========================================================================== */
    & aside {
        & #sdl-userdata { 
            border: 1px solid var(--sd-border-main); 
            padding: 15px; 
            background-color: var(--sd-bg-main); 
            font-size: 0.9rem; 
            line-height: 1.4; 
            
            & ul { 
                display: flex; 
                flex-wrap: wrap; 
                gap: 5px; 
                
                & li { 
                    line-height: 2.3; 
                }
            }
        }
    }

    /* **************************************************************************
        レスポンシブ（テーマ）
    ************************************************************************** */
    & .responsive {
        & #top #wrap_all .container {
            @media (max-width: 767px) {
                max-width: 95%;
                width: 95%;
            }
        }
        
        &.html_sdl-salespage .container {
            max-width: 100%;
        }
    }
    /* #################################################################
    2-1-4. MAPL アプリケーション・コア・ラッパー
    ################################################################# */
    & .sdl-wrap {
        & :is(div, ul, ol, li) {
            margin: 0px;
            padding: 0px;
            float: none;
        }
        & :is(ul, ol) {
            display: flex; 
            flex-wrap: wrap; 
            gap: 5px; 
            & li {
                list-style: none;
            }
        }

        /* ---------------------------------------------
        2-1-4-3-2. 基本設定（.sdl-wrap以下）
        --------------------------------------------- */
        & .bold        { font-weight: bold; }
        & .left        { text-align: left; }
        & .right       { text-align: right; }
        & .center      { text-align: center; }
        & .top         { vertical-align: top; }
        & .middle      { vertical-align: middle; }
        & .bottom      { vertical-align: bottom; }
        & .visibility  { visibility: hidden; }
        & .nowrap      { white-space: nowrap; }
        & .pointer, 
        & .sdl-click-box { cursor: pointer; }
        & .notDisplay  { display: none; }
        & .closeup { font-size: 120%; }

        & .sdl-clipboard-copy {
            margin-left:5px;
            cursor: pointer;
        }

        & .boxMax {  
            width: 100%; 
            min-width: 0; 
        }

        & a:link {
            text-decoration: none;
        }
        & a:hover {
            color: #F40;
        }

        & pre {
            background-color: var(--sd-bg-main);
            color: var(--sd-text-main);
        }
        & img {
            border: none;
            border-width: 0px;
            border-color: transparent;
            vertical-align: text-bottom;
            width: auto; 
            max-width: stretch;
            transition: opacity 0.2s ease; 
            
            &:hover { 
                opacity: 0.6; 
            }
        }            
        & form { 
            margin: 0; 
        }

        /* ---------------------------------------------
        2-1-4-3-3. 見出し（.sdl-wrap以下）
        --------------------------------------------- */
        & :is(h3, h4) { 
            margin-block: 10px; 
        }
        & :is(h3, h4, h5, h6) { 
            white-space: normal;
            font-weight: bold;
            color: var(--sd-black-light); 
            vertical-align: text-bottom;
            .html_sd-dark & {
                color: var(--sd-theme-strong-sd);
                .html_skydoor & {
                    border-color: var(--sd-theme-bg-sd-dark);
                }
            }
        }
        
        & h3 {
            font-size: 1.3rem;
            margin: 0 0 40px 0;
            padding: 0.4em 0.4em 0.4em 40px;
            background: url("/img/checker_30.png") left center no-repeat, linear-gradient(var(--sd-white-blight),  var(--sd-white-deep));

            .html_sd-dark & {
                color: var(--sd-theme-strong-sd);
                border: 1px solid var(--sd-border-main);
                .html_skydoor & {
                    background-image: url(/img/checker_30.png), linear-gradient(var(--sd-white-deep) 0%, var(--sd-gray-light) 75%);
                    border-left-color: var(--sd-theme-bg-sd-dark);
                }
            }
            &.sdl-page-title {
                .html_skydoor & {
                    color: var(--sd-theme-strong-sd);
                    border: 1px solid var(--sd-border-main);
                }
            }
        }

        & h4 {
            background: none left center no-repeat, linear-gradient(var(--sd-white-blight),  var(--sd-white-deep));
            margin: 30px 0 10px 0;
            padding: 0.4em 0.4em 0.3em 1em;
            color: var(--sd-text-main); 
            font-weight: bold; 
            border-bottom: 1px solid var(--sd-theme-bg-rn); 
            
            .html_sd-dark & {
                color: var(--sd-theme-strong-sd);
                border: 1px solid var(--sd-border-main);
                border-left: 10px solid var(--sd-theme-strong-sd);
                .html_skydoor & {
                    border-left-color: var(--sd-theme-bg-sd-dark);
                    background-image: none, linear-gradient(var(--sd-white-deep) 0%, var(--sd-gray-light) 75%);
                }
            }
        }

        & h5 {
            margin: 30px 0 10px 0;      
            padding: 0.4em 0.4em;
            
            background: none left center no-repeat, linear-gradient(var(--sd-white-blight),  var(--sd-white-deep));
            border: 1px solid var(--sd-border-main);
            .html_sd-dark & {
                .html_skydoor & {
                    background-image: none, linear-gradient(var(--sd-white-deep) 0%, var(--sd-gray-light) 75%);
                    border-left-color: var(--sd-theme-bg-sd-dark);
                }
            }
            
            &.av-special-heading-tag {
                .html_skydoor & {
                    background: url("/img/trophy_35.png") left center no-repeat, linear-gradient(var(--sd-white-blight),  var(--sd-white-deep));
                    border-left: 20px solid var(--sd-theme-strong-sd);
                    border-bottom: 1px solid var(--sd-theme-strong-sd);
                }
            }

            /* サイドバー見出し */
            & .sd-sidebar-header-wrap  {
                display: flex;
                justify-content: flex-start;
                align-items: center;
                
                /* 見出し内ボタンコンテナ */
                & .sd-button-container-wrap {
                    margin-left: auto;
                    font-weight: normal;
                    & .sd-button-container {
                        display: flex;
                        justify-content: flex-end;
                        gap:3px;
                    }
                }
            }
        }

        & h6 {
            font-size: 1rem;
            margin: 1.5em 0 1em 0.5em;
            padding: 0 0 0 0.3em;
            border-left: 1.2em solid var(--sd-theme-bg-rn);
            width: auto;
            .html_sd-dark & {
                border-left: 1.2em solid var(--sd-theme-bg-sd);
                .html_skydoor & {
                    color: var(--sd-text-main-dark); 
                    border-color: var(--sd-theme-bg-sd-dark);
                }
            }
        }

        /* ---------------------------------------------
        2-1-4-3-9. アイコン・バッジ（.sdl-wrap以下）
        --------------------------------------------- */
        /* グランプリ */
        & .rn-gp-img-box-wrap {
            position:relative;
            border:1px solid #CCC;
            border-bottom: 3px solid #D00;
            margin-right: 3px;
            float:left;
            & .rn-gp-img-box {
                clear: both;
                float: left;
                width: 40px;
                height: 40px;
                & .rn-gp-img {
                    height:40px;
                    background-position:center center;
                    background-repeat:no-repeat;
                    -moz-background-size:cover;
                    background-size:cover;
                }
            }
        }

        /* 自動車 */
        & .rn-car-img-box-wrap {
            border:1px solid #CCC;
            border-bottom: 3px solid #D00;
            & .rn-car-img-box {
                width: 53px;
                height: 40px;
            }
            & .rn-car-img {
                height:40px;
                background-position:center center;
                background-repeat:no-repeat;
                background-size:cover;
                pointer-events: all;
            }
        }
        
        /* ---------------------------------------------
        2-1-4-3-11. イベントカウントダウン（.sdl-wrap以下）
        --------------------------------------------- */
        & .rn-event-countdown { 
            display: inline-block; 
            border: 1px solid var(--sd-black-default); 
            border-radius: 3px; 
            padding: 2px 5px; 
            background: linear-gradient(to bottom, var(--sd-white-default), var(--sd-gray-light)); 
            font-size: 0.9em; 
            & .rn-event-countdowndays { 
                font-weight: bold; 
                font-size: 1.4em; 
                padding: 0 4px; 
            }
        }

        /* ---------------------------------------------
        2-1-4-3-7. 入力フォームコントロール（.sdl-wrap以下）
        --------------------------------------------- */
        & :is(input, select, textarea) {
            display: inline-block;
            width: auto;
            min-width: 0;
            color: var(--sd-text-main-strong); 
            border: 1px solid var(--sd-gray-blight);
            border-radius: 3px;
            margin: 1px;
            font-size: 1rem;
            height: 1.8em;
            padding: 0.1em;
            box-sizing: border-box;
            .html_sd-dark & {
                .html_skydoor & {
                    background-color: var(--sd-bg-main-strong-dark);
                    color: var(--sd-text-main-dark); 
                    &.sd-required { 
                        background-color: var(--sd-bg-red-dark); 
                        color: var(--sd-text-red-dark); 
                    }                    
                    &:focus { 
                        background-color: var(--sd-bg-blue-dark);
                        color: var(--sd-text-main-dark); 
                    }
                }
            }
        }
        
        & input {
            &[type="file"] { 
                border: none; 
                height: auto; 
            }
            
            &[type="submit"] { 
                color:  var(--sd-gray-light); 
            }

            /* チェックボックス/ラジオ */
            &:is([type="checkbox"], [type="radio"]) { 
                width: 20px; 
                height: 20px; 
                vertical-align: middle; 
                border: none; 
                outline: none; 
                cursor: pointer;
            }
            
            &[type="radio"] { 
                background-color: transparent; 
            }
            
            &.sd-focus { 
                background-color: var(--sd-red-blight); 
                border: 1px solid var(--sd-theme-bg-rn); 
            }

            &::placeholder { 
                color: var(--sd-gray-default); 
                text-align: right; 
            }

            &[name="search_q"] {
                width: 300px;
                max-width: 100%;
                font-size: 1.2rem;
                padding: 0 1em;
                border: 1px solid var(--sd-border-main); 
                border-radius: 3px 0 0 3px;
                height: 40px;
            }

            &.readonly { 
                border: none; 
                background: transparent;   
                .html_sd-dark & {
                    .html_skydoor & {
                        color: var(--sd-text-main-dark); 
                        &.sd-red-strong {
                            color: var(--sd-red-light); 
                            font-weight: bold; 
                        }
                    }
                }
            }
            
            &.required { 
                border: 1px solid var(--sd-red-default); 
            }
            &.timepicker {
                width: 5em;
            }
            &.datepicker {
                width: 8em;
            }
        }
        
        & textarea { 
            overflow: auto; 
            padding-right: 1.5em; 
            height: 15em; 
        }
        
        & select { 
            cursor: pointer; 
            padding-right: 25px; 
        }
            
        /* ---------------------------------------------
        2-1-4-3-8. ボタン（.sdl-wrap以下）
        --------------------------------------------- */
        & :is(a, li, input, span) {
            
            /* ボタンサイズ */
            /* 標準ボタン */
            &.sdl-button { 
                font-size: 1.2rem; 
                padding: 7px 10px; 
                    
                &.sdl-button-pdf::after { 
                    content: url('/img/jump_pdf_20_white.png'); 
                    vertical-align: middle; 
                }
                
                &.sdl-button-xls::after { 
                    content: url('/img/jump_xls_20_white.png'); 
                    vertical-align: middle; 
                }
            }
            /* ミドルボタン */
            &.sdl-button-middle { 
                line-height: 1.3; 
                font-size: 14px; 
                padding: 3px 6px; 
            }                
            /* ミニボタン */
            &.sdl-button-mini { 
                line-height: 1.5; 
                font-size: 12px; 
                padding: 1px 2px; 
                white-space: nowrap; 
                margin: 0; 
                height: auto; 
            }

            /* 基本装飾 */
            &:is(.sdl-button, .sdl-button-middle, .sdl-button-mini) {
                display: inline-block; 
                color: var(--sd-black-default); 
                background: linear-gradient(to bottom, var(--sd-white-default)  50%, var(--sd-gray-light) ); 
                border: 1px solid var(--sd-border-main); 
                border-radius: 3px; 
                box-sizing: border-box; 
                text-decoration: none; 
                vertical-align: text-bottom;
                transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease;              
                cursor: pointer;       
                .html_sd-dark & {
                    .html_skydoor & {
                        border: 1px solid var(--sd-border-main-dark); 
                        color: var(--sd-black-default);
                    }
                }

                /* イベント */
                &:focus { 
                    outline: none; 
                }                    
                &:focus-visible { 
                    outline: 2px solid var(--sd-theme-bg-sd); 
                    outline-offset: 2px; 
                }                    
                &:hover { 
                    color: var(--sd-text-main-strong); 
                    background: linear-gradient(to bottom, var(--sd-gray-light) 50%, var(--sd-white-default) ); 
                }

                /* ボタンバリエーション */
                &.sdl-button-disabled { 
                    color: var(--sd-white-default); 
                    background: linear-gradient(to bottom, var(--sd-gray-deep) 50%, var(--sd-black-blight)); 
                    cursor: not-allowed; 
                    .html_sd-dark & {
                        .html_skydoor & {
                            color: var(--sd-white-light); 
                        }
                    }
                }                    
                &.sdl-button-disuse { 
                    background: linear-gradient(to bottom, var(--sd-white-deep) 50%, var(--sd-gray-light)); 
                    &:hover { background: linear-gradient(to bottom, var(--sd-gray-light) 50%, var(--sd-white-deep)); }
                }                    
                &.sdl-button-cancel { 
                    background: linear-gradient(to bottom, var(--sd-white-blight) 50%, var(--sd-white-default) ); 
                    &:hover { background: var(--sd-white-blight); }
                }                    
                &.sdl-button-save { 
                    padding-inline: 50px; 
                    background: linear-gradient(to bottom, #33ff66 50%, #33ff33); 
                    &:hover { background: linear-gradient(to top, #33ff66 50%, #33ff33); }
                }                    
                &.sdl-button-edit { 
                    background: linear-gradient(to bottom, #ffff66 50%, #ffff33); 
                    &:hover { background: linear-gradient(to top, #ffff66 50%, #ffff33); }
                }                    
                &.sdl-button-view { 
                    color: var(--sd-white-default); 
                    background-color: #FF66BB; 
                    border: 1px solid #FF66BB; 
                    &:hover { background-color: #FF3399; border: 1px solid #FF3399; }
                }                    
                &.sdl-button-new { 
                    background: linear-gradient(to bottom, #ffd700 50%, #ffbe00); 
                    &:hover { background: linear-gradient(to top, #ffd700 50%, #ffbe00); }
                }                    
                &.sdl-button-pdf { 
                    color: var(--sd-white-light); 
                    background: linear-gradient(to bottom, #A00 50%, #800); 
                    border: 1px solid #B00; 
                    &:hover { background: linear-gradient(to top, #A00 50%, #800); }
                    .html_sd-dark & {
                        .html_skydoor & {
                            color: var(--sd-white-light); 
                            &[type='submit'] {
                                color: var(--sd-white-light); 
                            }
                        }
                    }
                }                    
                &.sdl-button-xls { 
                    color: var(--sd-white-light); 
                    background: linear-gradient(to bottom, #006666 50%, #003300); 
                    border: 1px solid #003300; 
                    &:hover { background: #006666; }
                    .html_sd-dark & {
                        .html_skydoor & {
                            color: var(--sd-white-light); 
                            &[type='submit'] {
                                color: var(--sd-white-light); 
                            }
                        }
                    }
                }                    
                &.sdl-button-link { 
                    background: linear-gradient(to bottom, #add8e6 50%, #87ceeb); 
                    &:hover { background: linear-gradient(to top, #add8e6 50%, #87ceeb); }
                }                    
                &.sdl-button-action { 
                    background: linear-gradient(to bottom, #ffdead 50%, #ffdab9); 
                    &:hover { background: linear-gradient(to top, #ffdead 50%, #ffdab9); }
                }                    
                &.sdl-button-entry { 
                    line-height: 3; 
                    font-size: 1.4rem; 
                    color: var(--sd-white-default); 
                    padding: 10px 30px; 
                    background: linear-gradient(to bottom, #F00 50%, #C00); 
                    border: 1px solid #F30; 
                    &:hover { background: #F00; }
                }
            }
        }

        
        /* ---------------------------------------------
        2-1-4-1. dibボックス（.sdl-wrap以下）
        --------------------------------------------- */
        & .sd-div-box-wrap {
            display: flex;
            gap: 10px;
            justify-content: flex-start;
            flex-wrap: wrap;
            & .sd-div-box-3 {
                flex: 1 1 350px;
            }
            & .sd-div-box-2 {
                flex: 1 1 500px;
            }
        }

        /* ---------------------------------------------
        2-1-4-1. ヘッダー　#sdl-header（.sdl-wrap以下）
        --------------------------------------------- */
        & #sdl-header { 
            display: block; 
            
            & .sd-loginbar { 
                display: flex; 
                gap: 5px; 
                justify-content: flex-end;

                & .sd-loginbar-list { 
                    gap: 5px; 
                    padding-inline: 3px; 
                    font-size: 92%; 
                }
            }
            & li { 
                border: none; 
            }
        }    
        & #sdl-header-mobile { 
            display: none; 
            
            & .show-login { 
                position: absolute; 
                top: 50%; 
                right: 90px; 
                transform: translateY(-50%); 
                border: 1px solid #CCC; 
                border-radius: 3px; 
                cursor: pointer; 
                padding: 5px 8px; 
                line-height: 1; 
                z-index: 99999; 
            }
        }
        
        /* ---------------------------------------------
        2-1-4-2. サイドバー　#sdl-sidebar（.sdl-wrap以下）
        --------------------------------------------- */
        & :is(#sdl-sidebar) {
            & h5 {
                margin-top: 15px;
            }
            & .sdl_seibi_button { 
                display: flex; 
                flex-wrap: wrap; 
                gap: 5px; 
            }
            
            & table.sdl-navi-car { 
                margin-bottom: 5px; 
                width: 100%; 
                
                & tbody th { 
                    min-width: 9em; 
                    white-space: nowrap; 
                    padding: 0 0.5em; 
                }
                
                & tbody td { 
                    width: 100%; 
                    padding: 0 0.5em; 
                }
            }
            
            /* サイドバーの検索入力ボックス */
            & .sd-sidebar-search-list-container { 
                display: flex;
                justify-content: flex-start;
                gap: 3px;
                align-items: center;
                & .sd-sidebar-search-list {
                    flex: 1 1;
                    & input {
                        width: 100%;
                    }
                    &:last-of-type {
                        flex: 0 0 35px;
                    }
                    &.sd-sidebar-search-list-customer input { border: 1px solid var(--sd-text-red) }
                    &.sd-sidebar-search-list-car input      { border: 1px solid var(--sd-text-blue); }
                    &.sd-sidebar-search-list-slip input     { border: 1px solid var(--sd-text-green); }
                }
            }
                        
            & #sdl-sidebar-gp .sdl-sidebar-gp-content
            {
                border: 1px solid #DDD;
                border-radius: 3px;
                padding: 1em;
                margin-bottom:1em;
                
                & a {
                    margin-left: 2px;
                    line-height: 2.2em;
                }
                & select {
                    margin-bottom: 0px;
                }
            }
        }
        & aside.sidebar {
            /* ---------------------------------------------
            5-1. サイドバー・ウィジェット
            --------------------------------------------- */
            /* リザルト */
            & #sdl-total-result { 
                border: 1px solid var(--sd-border-main); 
                padding: 15px; 
                background-color: var(--sd-bg-main); 
                text-align: center; 
                
                & .sdl-total-result-count { 
                    font-size: 2rem; 
                    color: var(--sd-theme-bg-rn); 
                    font-weight: bold; 
                }
            }
        }

        /* ---------------------------------------------
        2-1-4-3-33. コンテンツボックス（広告・イベントなど）（#sdl-main, #sdl-header, #sdl-sidebar以下）
        --------------------------------------------- */ 
        & .sd-box-container {
            display: grid;
            gap: 5px;
            flex-wrap: wrap;
            &.sd-box-container-2 {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
            &.sd-box-container-4 {
                grid-template-columns: repeat(4, minmax(0, 1fr));
            }
            
            & .rn-event-box { 
                padding: 4px; 
                border: 1px solid var(--sd-border-main); 
                border-bottom: 3px solid var(--sd-theme-bg-rn); 
                background: var(--sd-bg-main); 

                & .rn-event-box-header { 
                    & .rn-event-box-gp {
                        color: #333;
                        font-weight: bold;
                        font-size: 120%;
                        padding: 3px;
                        background-color: #CCC;
                        border: none;
                        height: 3em;
                    }
                    & .rn-event-box-event {
                        color: #333;
                        font-weight: bold;
                        font-size: 110%;
                        padding: 3px;
                        background-color: #eee;
                        background-image: none;
                        border: none;
                    }
                    & .rn-event-box-circuit {
                        background-color: #F6F6F6;
                        text-align: right;
                        padding: 3px;
                    }
                }
                & .rn-event-box-main { 
                    min-height: 130px;
                    &  .rn-event-box-img {
                        width: 100px;
                        height: 100px;
                        & .rn-event-box-img-box {
                            height:100px;
                            background-position:center center;
                            background-repeat:no-repeat;
                            background-size:cover;
                        }
                    }
                }            
                & .rn-event-box-footer { 
                    padding: 4px; 
                    text-align: right; 
                    background: var(--sd-bg-main); 
                }
            }
        }

        /* =========================================
        Rakuten Ads
        ========================================= */
        & .rakuten_ad_box {
            display: flex; 
            gap: 8px;
        }
        & .rn-ad-wrap.rn-ad, 
        & .rakuten_one_ad { 
            font-family: "Hiragino Kaku Gothic Pro", Meiryo, sans-serif; 
            min-width:250px; 
            & .rn-ad-content { 
                flex: 0 0 250px;
                min-width:250px; 
                display: flex; 
                flex-direction: column; 
                min-height: 262px; 
                padding: 4px; 
                background-color: var(--sd-white-default); 
                border: 2px solid var(--sd-border-main); 
                border-bottom: 3px solid var(--sd-theme-bg-rn); 
                & a {
                    text-decoration: none;
                    color: #555;
                }
                
                & .rn-ad-img-box {
                    width: 128px;
                    height: 128px;
                    display: table-cell;
                    vertical-align: middle;
                    text-align: center;
                    & img {
                        max-width: 128px;
                        max-height: 128px;
                        box-shadow: 3px 3px #EEE;
                        vertical-align: middle;
                    }
                }
                & .rn-ad-price {
                    font-weight: bold;
                    font-size: 150%;
                    margin-top: 10px;
                    color: #666;
                }
                & .rn-ad-point {
                    background: linear-gradient(transparent 60%, #FFFF66 60%);
                }
                & .rn-ad-text {
                    color: #fa4619;
                    line-height: 1.2em;
                    font-size: 92%;
                    padding-top: 0.4em;
                    height: 2.2em;                    
                    &:hover {
                    color: #0022bb;
                    }
                }
            }
        }

        /* ---------------------------------------------
        2-1-4-3. #sdl-main, #sdl-header, #sdl-sidebar（.sdl-wrap以下）
        --------------------------------------------- */
        & :is(#sdl-main, #sdl-header, #sdl-sidebar) {
            /* ---------------------------------------------
            2-1-4-3-1-1. イージー・クラス
            --------------------------------------------- */
            /*++++++++++++++++++++++++++++++++++++++++
            送信判定
            ++++++++++++++++++++++++++++++++++++++++*/
            /*エラー*/
            & .error {
                text-align:left;
                margin:10px;
                font-weight: bold;
                color: #FF6666;
            }
            /*成功*/
            & .success {
                text-align:left;
                margin:10px;
                font-weight: bold;
            }

            /* ---------------------------------------------
            2-1-4-3-4. 上部メッセージバー（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & .sdl-message { 
                font-weight: bold; 
                padding: 5px 10px; 
                margin: 5px 0; 
                border-radius: 3px; 
                
                &:is(.sdl-message-error, .sdl-message-development) { 
                    background-color: var(--sd-bg-red-strong);
                    color: var(--sd-text-red-strong);
                    font-size: 1.2em; 
                    padding: 10px; 
                    
                    & a { 
                        color: var(--sd-text-red-strong);
                    } 
                }
                
                &:is(.sdl-message-announce, .sdl-message-success, .sdl-message-warning) { 
                    text-align: center; 
                    font-size: 1.2em; 
                    padding: 10px; 
                    margin-bottom: 10px; 
                }
                
                &.sdl-message-announce { 
                    background-color: var(--sd-bg-blue-strong);
                    color: var(--sd-text-red-strong);
                }
                
                &.sdl-message-success { 
                    background-color: var(--sd-bg-green-strong);
                    color: var(--sd-text-green-strong);
                }
                
                &.sdl-message-warning { 
                    background-color: var(--sd-bg-yellow-strong);
                    color: var(--sd-text-yellow-strong);
                }
            }

            /* ---------------------------------------------
            2-1-4-3-5. パンくず（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & #sdl-breadcrumbs { 
                padding-bottom: 10px; 
                
                & ul { 
                    display: flex; 
                    flex-wrap: wrap; 
                    gap: 3px; 
                    
                    & li { 
                        font-size: 90%; 
                        background: linear-gradient(var(--sd-gray-blight) 0%, var(--sd-gray-deep) 75%); 
                        padding: 0.1em 0.4em; 
                        border-radius: 3px; 
                        color: var(--sd-text-main-strong); 
                        
                        &.sdl-breadcrumbs-link { 
                            background: linear-gradient(var(--sd-black-blight) 0%, var(--sd-black-deep) 75%); 
                            & a { color:  var(--sd-white-default);  }
                        }
                        
                        & a:hover { color:  var(--sd-gray-light); }
                    }
                }
            }

            /*++++++++++++++++++++++++++++++++++++++++
            div共通ボックス
            ++++++++++++++++++++++++++++++++++++++++*/
            & .divBoxWrap {
                margin:10px auto;
                text-align:center;
                & .divBox {
                    margin:10px auto;
                    padding:30px;
                    max-width:400px;
                    border-radius:6px;
                    color: var(--sd-text-main);
                    background-color: var(--sd-bg-main);
                    border: 1px solid var(--sd-border-main);
                    /*++++++++++++++++++++++++++++++++++++++++
                    送信ボタン
                    ++++++++++++++++++++++++++++++++++++++++*/
                    /*送信ボタン*/
                    & :is(input[type="submit"], input[type="button"]) {
                        width: 100%;
                        height: auto;
                        padding: 20px;
                        margin-top:20px;
                        font-size: 150%;
                        font-weight: bold;
                        color: var(--sd-text-main-strong);
                        background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
                        border: 1px solid var(--sd-border-main);
                        border-radius: 6px;
                        box-shadow: 3px 3px 4px var(--sd-border-main);
                    }
                    & :is(input[type="text"], input[type="password"], input[type="number"], input[type="text"], select, textarea) {
                        font-size:120%;
                        width:100%;
                        margin:3px;
                    }
                    /*++++++++++++++++++++++++++++++++++++++++
                    ログイン
                    ++++++++++++++++++++++++++++++++++++++++*/
                    & :is(input[name="sdl_id"], input[name="sdl_login_id"], input[name="sdl_email"], input[name="sdl_password"], input[name="sdl_password_again"]) {
                        ime-mode:disabled;
                    }

                    & [name="sdl_remember"] {
                        margin-top: 1em;;
                    }

                    & h3 {
                        text-align:left;
                    }
                    .html_sd-dark.html_skydoor & h6 {
                        color: var(--sd-text-main);
                    }
                    & ul {
                        margin:0px;
                        & li {
                            width: 100%;
                            padding: 20px;
                            margin: 0px;
                            margin-top:20px;
                            color: #333;
                            font-size: 150%;
                            font-weight:bold;
                            background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
                            border: 1px solid #CCC;
                            border-radius: 5px;
                            border-radius: 6px;
                            box-shadow: 3px 3px 4px #CCC;
                            & :is(a, a:visited) {
                                color: #333;
                            }
                        }
                    }
                    & input[type="button"] {
                        cursor:pointer;
                    }
                    & .sdl-birthday-container select {
                        width:auto;
                    }
                } 
            }

            /* ---------------------------------------------
            2-1-4-3-6 検索（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            /* 検索ボタン  */
            & .sdl-search-button {
                height: 40px;
                border-radius: 0 3px 3px 0;
                cursor: pointer;
                vertical-align: top;
                margin-left: -2px;

                color: var(--sd-theme-text-rn); 
                background-color: var(--sd-theme-bg-rn); 
                border: 1px solid var(--sd-theme-bg-rn); 

                .html_skydoor & {
                    color: var(--sd-theme-text-sd); 
                    background-color: var(--sd-theme-bg-sd); 
                    border: 1px solid var(--sd-theme-bg-sd); 
                    .html_sd-dark& { 
                        color: var(--sd-theme-text-sd-dark); 
                        background-color: var(--sd-theme-bg-sd-dark); 
                        border: 1px solid var(--sd-theme-text-sd-dark); 
                    }
                }
                .html_racersnavi & {
                    color: var(--sd-theme-text-rn); 
                    background-color: var(--sd-theme-bg-rn); 
                    border: 1px solid var(--sd-theme-bg-rn); 
                }
            }


            /* 検索条件 */
            & .sd-search-condition {
                display: flex;
                align-items: center;
                & table {
                    width: auto;
                    & tr {
                        & :is(th,td) {
                            padding: 2px 5px;
                        }
                    }
                }
            }

            & .sd-button-wrap { 
                margin-bottom: 10px;        
                & .sd-button-area { 
                    & ul {
                        display: flex;
                        justify-content: flex-end;
                        align-items: center; 
                        gap: 5px; 
                    }        
                }
            }
            
            /* 検索結果のページネート（右寄せ） */
            & ul.sd-search-paginate-wrap {
                display: flex;
                flex-wrap: wrap;
                align-items: center;
                justify-content: flex-end;
                gap: 5px;

                & li.sd-search-paginate { 
                    & ol.paginate {
                        display: flex; 
                        flex-wrap: wrap; 
                        justify-content: flex-end;
                        gap: 5px; 

                        & li {
                            font-size: 90%; 
                            text-align: center; 
                            border: 1px solid var(--sd-gray-blight); 
                            border-radius: 2px; 
                            padding: 0px 5px; 
                            cursor: pointer; 
                            transition: background-color 0.2s, color 0.2s; 
                            &:hover { 
                                background-color: var(--sd-gray-light); 
                                color: var(--sd-white-default); 
                            }
                            &.current { 
                                background-color: var(--sd-gray-default); 
                                color: var(--sd-white-default);  
                                font-weight: bold; 
                            }
                            &.dot { 
                                border: none; 
                                font-weight: bold; 
                                pointer-events: none; 
                            }
                            .html_sd-dark & {
                                .html_skydoor & {
                                    color: var(--sd-text-main-dark);
                                    &:hover { 
                                        background-color: var(--sd-gray-light); 
                                    }
                                    &.current { 
                                        background-color: var(--sd-gray-default); 
                                    }
                                }
                            }
                        }
                    }
                }
            }

            /* ---------------------------------------------
            2-1-4-3-10. フォームコントロール（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */            
            /* インプット（トグルスイッチ） */
            & :is(input.sdl-checkbox-sw, input.sdl-checkbox-sw-reverse) { 
                display: none; 
            }
            /* ラベル */
            & :is(label.sdl-checkbox-sw, label.sdl-checkbox-sw-reverse) {
                display: inline-flex;
                align-items: center;
                padding: 8px 5px;
                font-size: 12px;
                font-weight: bold;
                cursor: pointer;
                
                &::before, 
                &::after {
                    padding: 4px;
                    transition: background 0.2s, opacity 0.2s, color 0.2s;
                }
            }

            & label.sdl-checkbox-sw {
                &::before { 
                    content: 'ON'; 
                    border-radius: 6px 0 0 6px; 
                    background: linear-gradient(var(--sd-white-blight), var(--sd-white-default)); 
                    color: var(--sd-gray-default); 
                }
                &::after { 
                    content: 'OFF'; 
                    border-radius: 0 6px 6px 0; 
                    background: var(--sd-red-light); 
                    color: var(--sd-white-default); 
                }
            }
            
            & input.sdl-checkbox-sw:checked + label.sdl-checkbox-sw {
                &::before { 
                    color: var(--sd-theme-text-sd); 
                    background: var(--sd-theme-bg-sd); 
                    opacity: 1; 
                }
                &::after { 
                    background: linear-gradient( var(--sd-white-default), var(--sd-gray-light) ); 
                    color: var(--sd-gray-default); 
                }
            }

            & label.sdl-checkbox-sw-reverse {
                &::before { 
                    content: 'ON'; 
                    border-radius: 6px 0 0 6px; 
                    color: var(--sd-theme-text-sd); 
                    background: var(--sd-theme-bg-sd); 
                }
                &::after { 
                    content: 'OFF'; 
                    border-radius: 0 6px 6px 0; 
                    background: linear-gradient( var(--sd-white-default), var(--sd-gray-light) ); 
                    color:  var(--sd-gray-default); 
                }
            }
            
            & input.sdl-checkbox-sw-reverse:checked + label.sdl-checkbox-sw-reverse {
                &::before { 
                    background: linear-gradient( var(--sd-white-default), var(--sd-gray-light) ); 
                    color: var(--sd-gray-default); 
                }
                &::after { 
                    background: var(--sd-red-light); 
                    color: var(--sd-white-default); 
                    opacity: 1; 
                }
            }

            & input.sdl-checkbox-sw:not(:checked) + label.sdl-checkbox-sw:hover::before,
            & input.sdl-checkbox-sw:checked + label.sdl-checkbox-sw:hover::after,
            & input.sdl-checkbox-sw-reverse:not(:checked) + label.sdl-checkbox-sw-reverse:hover::before,
            & input.sdl-checkbox-sw-reverse:checked + label.sdl-checkbox-sw-reverse:hover::after { 
                opacity: 0.5; 
            }

            /* ---------------------------------------------
            2-1-4-3-12. 車両ステータス（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & .sd-car-status { 
                font-size: 14px;
                line-height: 1.5em;
                font-weight: bold; 
                border: 1px solid var(--sd-black-blight);  
                border-radius: 3px; 
                padding: 0px 4px; 
                &.sd-car-takumi {
                    color: var(--sd-red-light);
                    background-color: var(--sd-black-default);
                    border: 1px solid var(--sd-black-default);
                }
                &.sd-k-car {
                    color: var(--sd-black-default);
                    background-color: var(--sd-yellow-default);
                    border: 1px solid var(--sd-black-default);
                }
            }

            /* ---------------------------------------------
            2-1-4-3-13. 伝票ステータス（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & .rn-slip-status { 
                display: inline-block; 
                color: var(--sd-white-default);  
                line-height: 1.5; 
                padding: 3px 5px; 
                margin: 0; 
                border: 1px solid transparent; 
                border-radius: 3px; 
                text-decoration: none; 
                white-space: nowrap; 
            }
            & .rn-slip-in-progress { background: linear-gradient(to bottom, #32CD32 50%, #00AA00); border: 1px solid #00AA00; }
            & .rn-slip-completed { background: linear-gradient(to bottom, #0094ea 50%, #0066CC); border: 1px solid #0066CC; }
            & .rn-slip-estimate-in-progress { background: linear-gradient(to bottom, #FF9900 50%, #FF6600); border: 1px solid #FF6600; }
            & .rn-slip-estimate-completed { background: linear-gradient(to bottom, #EE2255 50%, #CC0033); border: 1px solid #CC0033; }
            & .rn-slip-estimate-template { background: linear-gradient(to bottom, #000088 50%, #000055); border: 1px solid #000055; }

            /* ---------------------------------------------
            2-1-4-3-14. ローダー（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            /* ローディング */
            & .sdl-loading { 
                position: fixed; 
                inset: 0; 
                z-index: 999999999; 
                background-color: rgba(0,0,0,0.1); 
                display: grid; 
                place-items: center; 
            }

            /* ---------------------------------------------
            2-1-4-3-15. コンテンツ下部（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            /* 区切り線 */
            & .sd-separator-lower-content { 
                margin-block: 50px; 
            }
            
            /* ---------------------------------------------
            2-1-4-3-17. リンクボタンボックス（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */                
            & .sdl-primary-table-link-box { 
                display: flex; 
                justify-content: flex-end; 
                gap: 4px; 
                font-size: 12px; 
                list-style: none; 
                margin: 0; 
                padding: 0; 
                & li {
                    pointer-events: all;
                }
            }
            
            /* ---------------------------------------------
            2-1-4-3-18. 整備情報リンクボタンボックス（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & .sd-table-work-info td { 
                width: 33%; 
                min-width: 300px; 
                padding: 3px; 

                & div {
                    min-height: 15em; 
                }
            }
                
            & .sd-slip-seibi-result .sd-slip-seibi-result-box { 
                width: 350px; 
                border: 1px solid var(--sd-border-main);  
                border-radius: 3px; 
            }

            /* ---------------------------------------------
            2-1-4-3-19. タブ（使用中・ゴミ箱）（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & .sdl-table-tabArea { 
                & ul {
                    display: flex;
                    justify-content: flex-start;
                    .html_sd-dark.html_skydoor &{
                        color: var(--sd-text-main-dark);
                    }
                    & a {
                        font-size: 85%; 
                        line-height: 2; 
                        padding: 0.3em 1em; 
                        color: var(--sd-text-main);
                        background-color: var(--sd-bg-main); 
                        border: 1px solid var(--sd-border-main); 
                        border-radius: 3px 3px 0 0; 
                        cursor: pointer;       
                        &.sdl-tab-currently { 
                            color: var(--sd-theme-text-sd); 
                            background-color: var(--sd-theme-bg-sd); 
                            border: 1px solid var(--sd-theme-bg-sd); 
                            .html_sd-dark & {
                                .html_skydoor & { 
                                    color: var(--sd-theme-text-sd-dark); 
                                    background-color: var(--sd-theme-bg-sd-dark); 
                                    border: 1px solid var(--sd-theme-bg-sd-dark); 
                                }
                            }
                        }
                    } 
                }  
            }

            /* ==========================================================================
            ページ専用処理
            ========================================================================== */
            /* ---------------------------------------------
            2-1-4-3-21. OCRシート印刷（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & #ocr {
                .number_box {
                    margin-left: 1em;
                    padding-top:8px;
                }
                & span#shiyousya_honkyo_address_onaji_label {
                    border: 1px solid #DDD;
                    border-radius:2px;
                    padding: 2px 8px;
                    cursor: pointer;
                    &:hover{
                        background-color: #FF9933;
                    }
                }
                & ul.youshi_select li {
                    & a{
                        line-height: 3em;
                    }
                    &:is(.setumei,.kinyuurei) {
                        display: none;
                    }
                }
            }

            /* ---------------------------------------------
            2-1-4-3-22. オイルラベル印刷（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & #oil_label .number_box {
                margin-left: 1em;
                padding-top:8px;
                & span {
                    border: 1px solid #DDD;
                    border-radius:2px;
                    padding: 2px 8px;
                    cursor: pointer;
                    & span:hover {
                        background-color: #FF9933;
                    }
                }
            }
            
            /* ---------------------------------------------
            2-1-4-3-23. レーサーズナビ・ショッピング（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & #rn-ad-count {
                &.rn-ad-count input[type="radio"] {
                    margin-left:0.5em;
                }
                & .search_error {
                    margin:1em;
                    color: #D00;
                    font-weight:bold;
                }
            }

            /* ---------------------------------------------
            32-1-4-3-24. 追加ドライバー（申込）（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & #sd-table-driver {
                &,
                & tbody {
                    padding:0px;
                    margin:0px;
                    & td{
                        padding:0px;
                        border:none;
                    }
                }
            }
            
            /* ---------------------------------------------
            2-1-4-3-25. 主催者の規約（誓約書）（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & ul.org_agreement {
                padding-left:30px;
                &  li{
                    list-style-type:decimal;
                }
            }

            /* ---------------------------------------------
            2-1-4-3-26. フォーム送信情報（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & h6.rn_send_header {
                margin-top:20px;
            }

            /* ---------------------------------------------
            2-1-4-3-27. 支払関連ページ（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & #payjp_box #payjp_checkout_box input[type="button"] {
                background: #0088f4;
                color: #FFFFFF;
                border: none;
                &:hover {
                    opacity: 0.8;
                }
                &:active {
                    background: #0088f4;
                }
            }

            /* ---------------------------------------------
            2-1-4-3-28. 送信メッセージ（メンテナンス用ページ）（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */
            & span.sdl-sending-message {
                line-height:2.2em;
                padding:3px;
                border-radius:3px;
                border:1px solid #DDD;

                &.sdl-sending-message-user {
                    background-color:#FEE;
                }
                &.sdl-sending-message-org {
                    background-color:#EFE;
                }
                &.sdl-sending-message-rn {
                    background-color:#EEF;
                }
                &.sdl-sending-message-guest {
                    background-color:#EEE;
                }
            }

            /* ==========================================================================
            テーブルのコンテンツ以下（（#sdl-main, #sdl-header, #sdl-sidebar以下）
            ========================================================================== */
            /* ---------------------------------------------
            2-1-4-3-29. テーブル （#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */ 
            & table {                
                /* -------------------------
                2-1-4-3-29-1. 基本設定
                ------------------------- */ 
                border: 1px solid var(--sd-border-main);
                border-collapse: collapse; 
                border-radius: 3px; 
                background-color: var(--sd-bg-main); 
                color: var(--sd-text-main);
                width: 100%; 
                word-wrap: break-word;
                margin-bottom: 15px; 
                .html_sd-dark & {
                    .html_skydoor & {
                        border: 1px solid var(--sd-border-main-dark); 
                    }
                }
                & tr {
                    & th {
                        padding: 5px; 
                        font-weight: bold; 
                    }
                    & td {
                        padding: 5px;
                    }
                }
                
                & thead {
                    & tr {
                        background: linear-gradient(to bottom, var(--sd-black-default), var(--sd-black-deep)); 
                        color: var(--sd-white-default); 
                        & th { 
                            font-weight: bold; 
                            white-space: nowrap; 
                        }
                        .html_skydoor & {
                            background: var(--sd-white-light);
                            color: var(--sd-text-main); 
                        }
                        .html_sd-dark & {
                            .html_skydoor & {
                                background-color: var(--sd-black-default); 
                                color: var(--sd-text-main-strong-dark); 
                                border: 1px solid var(--sd-border-main-dark); 
                                & th {
                                    border: 1px solid var(--sd-border-main-dark); 
                                }
                            }
                        }
                    }
                }
                & tbody {
                    & tr {
                        color: var(--sd-text-main); 
                        &.sdl-even { 
                            background-color: #F0F0F0; 
                        }
                        &.sdl-odd { 
                            background-color: var(--sd-bg-main); 
                        }
                        & th { 
                            background-color: var(--sd-bg-main);  
                            color: var(--sd-text-main);
                        }    
                        & td { 
                            vertical-align: middle; 
                            border: 1px solid var(--sd-border-main);
                            &:first-child {
                                width:10em;
                            }
                        }
                        .html_sd-dark & {
                            .html_skydoor & { 
                                background: var(--sd-bg-main-dark); 
                                color: var(--sd-text-main-dark); 
                                border: 1px solid var(--sd-border-main-dark); 
                                /* ストライプ行 */
                                &:is(.sdl-even, :nth-child(2n)) {
                                    background-color: var(--sd-bg-main-dark);
                                }                    
                                &.sdl-odd {
                                    background-color: #223; 
                                }                        
                                & :is(th, td) { 
                                    border: 1px solid var(--sd-border-main-dark); 
                                }
                                & :is(thead th, th) { 
                                    background: #333; 
                                    color: var(--sd-text-main-dark); 
                                    border: 1px solid var(--sd-border-main-dark); 
                                }
                            }      
                        }
                    }
                }
                    
                /* -------------------------
                2-1-4-3-29-2. 行を拡大して情報の追加表示
                ------------------------- */
                &.sd-footable-mobile {
                    &.footable {
                        & tbody {
                            & tr {
                                & :is(div, ul) {
                                    pointer-events: none;
                                }
                                &.footable-row-detail {
                                    & :is(div, ul) {
                                        pointer-events: all;
                                    }
                                }
                                &:not(.footable-row-detail):hover { 
                                    background:  var(--sd-white-default); 
                                    .html_sd-dark & {
                                        .html_skydoor & { 
                                            background: #225; 
                                        }
                                    }
                                }

                            }
                        }
                    }
                }

                /* ---------------------------------------------
                2-1-4-3-20. 伝票（#sdl-main, #sdl-header, #sdl-sidebar以下）
                --------------------------------------------- */
                &#slipDetail { 
                    & #slipDetailTbody {
                        & td {
                            padding: 2px;
                            & textarea {
                                height: 4.5em;
                                line-height: 1.2em;
                            }
                            & > ul {
                                flex-direction: column;
                                align-items: flex-end; 
                                gap: 1px;
                                height: 5.5em;
                                pointer-events: none;
                                & > li {
                                    & :is(input, select) { 
                                        height: 1.3em; 
                                        padding: 0 0.1em;
                                    }
                                    & > ul {
                                        & > li.sd-quantity-ctrl-wrap {
                                            & > ul.sd-quantity-ctrl {
                                                gap: 0px;
                                                pointer-events: all;
                                                & > li {
                                                    & img {
                                                        cursor: pointer;
                                                        width: 12px;
                                                    }
                                                }
                                            }
                                        }
                                    }
                                }
                                & :is(a, input, textarea) {
                                    pointer-events: all;
                                }
                                &:not(.sd-slip-detail-row-insert) {
                                    & > li {
                                        &:first-of-type {
                                            margin-top: auto;
                                        }
                                    }
                                }
                                &.sd-slip-detail-row-insert {
                                    justify-content:space-around ;
                                }
                            }
                        }
                    }
                }

                /* ==========================================================================
                ライブラリ基本テーブル
                ========================================================================== */
                /* -------------------------
                2-1-4-3-29-3. ライブラリ基本テーブル
                ------------------------- */
                &.sdl-table {
                    /* -------------------------
                    2-1-4-3-29-3-1. 基本
                    ------------------------- */
                    line-height: 1.2em;
                            
                    & thead {
                        .html_sd-dark & {
                            .html_skydoor & {
                                & tr {
                                    background: var(--sd-black-default);
                                    color: var(--sd-text-main-dark);
                                }
                                & td {
                                    border: 1px solid var(--sd-border-main-dark); 
                                }
                            }
                        }
                    }
                    & tbody {
                        & tr { 
                            border-bottom: 1px solid  var(--sd-white-default); 
                            
                            &.sd-car-loned { 
                                background-color: var(--sd-bg-red); 
                            }
                            &.rowDisable { 
                                background-color: var(--sd-white-default); 
                                &:hover { 
                                    background-color: var(--sd-white-default); 
                                }
                            }
                            & .sdl-row-control { 
                                font-size: 12px;
                                pointer-events: all;
                            }
                            /* テーブル行ドラッグアイコン */
                            & td.showDragHandle {
                                background-image: url({%$baseUrl%}/img/updown2.gif);
                                background-repeat: no-repeat;
                                background-position: center center;
                                cursor: move;
                            }
                        }
                        .html_sd-dark & {
                            .html_skydoor & {
                                & tr.sdl-row-select-detail { 
                                    background-color: var(--sd-black-light);
                                    border: none; 
                                }
                                & tr {
                                    &:hover {
                                        background-color: var(--sd-bg-blue-dark);
                                    }
                                    &:nth-child(10n) td { 
                                        border-bottom-color: #944; 
                                    }
                                }
                            }
                        }
                    }

                    /* -------------------------
                    2-1-4-3-29-3-2. バッジ
                    ------------------------- */
                    /* ◯　✕ */
                    & :is(.sd-badge-maru, .sd-badge-batsu) { 
                        color: var(--sd-text-red-strong);
                        font-weight: bold; 
                        font-size: 1.1rem; 
                        padding: 2px 6px; 
                        border-radius: 4px; 
                        display: inline-block; 
                    }
                    & .sd-badge-maru { background-color: var(--sd-bg-blue-strong); }
                    & .sd-badge-batsu { background-color: var(--sd-bg-red-strong); }
                    /* 新着（タイムランキング） */
                    & .sd-badge-new {
                        font-size:80%;
                        font-weight:bold;
                        color:#FFFFFF;
                        background-color:#FF0000;
                        padding: 1px 2px;
                        margin-right:1px;
                    }
                    /* 更新（タイムランキング） */
                    & .sd-badge-update {
                        font-size:80%;
                        font-weight:bold;
                        color:#FFFFFF;
                        background-color:#0000FF;
                        padding: 1px 2px;
                        margin-right:1px;
                    }

                    /* -------------------------
                    2-1-4-3-29-3-3. 縦のテーブル
                    ------------------------- */
                    &:is(.sdl-view-record, .sdl-edit-record) {
                        & tbody {
                            border: 1px solid var(--sd-border-main);
                            & th {
                                background-color: var(--sd-bg-red-strong);
                                color:var(--sd-text-red-strong);
                                white-space: nowrap;
                                min-width:10em;

                                & .required {
                                    font-size: 75%;
                                }
                                .html_skydoor & {
                                    background-color: var(--sd-theme-strong-sd);
                                }
                            }
                            & td {                        
                                border: 1px solid var(--sd-border-main);
                                width: 100%;
                            }
                        }
                    }
 
                    /* -------------------------
                    2-1-4-3-29-3-4. 検索結果のテーブル
                    ------------------------- */
                    &.sdl-search-table {
                        /* 特殊テーブル (月次・年次) */
                        &.sd-settlement-table {
                            & tr.sum { 
                                background-color: var(--sd-theme-bg-sd); 
                                color: var(--sd-theme-text-sd); 
                            }

                            & tr.category { 
                                background-color: var(--sd-bg-blue);
                                color: var(--sd-text-main); 
                            }

                            & tr:is(.kaitori, .mycost) {
                                background-color: var(--sd-bg-red); 
                            }
                            .html_sd-dark & {
                                .html_skydoor & {
                                    & tr.sum { 
                                        background-color: var(--sd-theme-bg-sd-dark); 
                                        color: var(--sd-theme-text-sd-dark); 
                                    }

                                    & tr.category { 
                                        background-color: var(--sd-bg-blue-dark);
                                        color: var(--sd-theme-text-sd-dark); 
                                    }

                                    & tr:is(.kaitori, .mycost) {
                                        background-color: var(--sd-bg-red-dark); 
                                        color: var(--sd-theme-text-sd-dark); 
                                    }
                                }
                            }
                        }
                        &.sd-transition-table {
                            & thead {
                                & th.sd-transition-cat {
                                    background-color: var(--sd-gray-blight); 
                                }
                                & th.sd-transition-event {
                                    background-color: var(--sd-gray-light); 
                                }
                            }
                            & .sd-transition-gain {
                                color: var(--sd-orange-deep);                                 
                            }
                            & .sd-transition-total-amount {
                                color: var(--sd-blue-deep); 
                            }
                            & .sd-transition-cat-amount {
                                color: var(--sd-green-deep);                                 
                            }
                            & .sd-transition-event-amount {
                                color: var(--sd-red-default);                                 
                            }
                            .html_sd-dark & {
                                .html_skydoor & {
                                    & thead {
                                        & th.sd-transition-cat {
                                            background-color: var(--sd-gray-deep); 
                                        }
                                        & th.sd-transition-event {
                                            background-color: var(--sd-black-blight); 
                                        }
                                    }
                                    & .sd-transition-gain {
                                        color: var(--sd-orange-light);                                 
                                    }
                                    & .sd-transition-total-amount {
                                        color: var(--sd-blue-light); 
                                    }
                                    & .sd-transition-cat-amount {
                                        color: var(--sd-green-light);                                 
                                    }
                                    & .sd-transition-event-amount {
                                        color: var(--sd-red-light);                                 
                                    }
                                }
                            }
                        }

                        /* 残高 */
                        &.sd-balance .sd-balance-negative {
                            background-color: var(--sd-bg-red); 
                            .html_sd-dark & {
                                .html_skydoor & {
                                    background-color: var(--sd-bg-red-dark); 
                                }
                            }
                        }
                    }

                    /* -------------------------
                    2-1-4-3-29-3-5. 日報のテーブル（diary）
                    ------------------------- */
                    &.sd-diary {
                        & tr.sd-diary-sunday { 
                            background-color: var(--sd-week-bg-sunday); 
                            color: var(--sd-week-text-sunday); 
                            .html_sd-dark & {
                                .html_skydoor & { 
                                    background-color: var(--sd-week-bg-sunday-dark); 
                                    color: var(--sd-week-text-sunday-dark); 
                                }
                            }                    
                        }                    
                        & tr.sd-diary-saturday { 
                            background-color: var(--sd-week-bg-saturday); 
                            color: var(--sd-week-text-saturday); 
                            .html_sd-dark & {
                                .html_skydoor & { 
                                    background-color: var(--sd-week-bg-saturday-dark); 
                                    color: var(--sd-week-text-saturday-dark); 
                                }
                            }     
                        }                    
                        & tr.sd-diary-today { 
                            background-color: var(--sd-week-bg-today); 
                            color: var(--sd-week-text-today); 
                            .html_sd-dark & {
                                .html_skydoor & { 
                                    background-color: var(--sd-week-bg-today-dark); 
                                    color: var(--sd-week-text-today-dark); 
                                }
                            }
                        }
                    }

                    /* -------------------------
                    2-1-4-3-29-3-6. 代車
                    ------------------------- */
                    &.sd-loaner-history {
                        & tr.sd-loaner-expired { 
                            background-color: var(--sd-bg-red); 
                        }                    
                        & tr.sd-loaner-longused { 
                            background-color: var(--sd-bg-orange); 
                        }
                        .html_sd-dark & {
                            .html_skydoor & {
                                & tr.sd-loaner-expired { 
                                    background-color: var(--sd-bg-red-dark); 
                                }                    
                                & tr.sd-loaner-longused { 
                                    background-color: var(--sd-bg-orange-dark); 
                                }
                            }
                        }
                    }
                }            
            }

            /* ==========================================================================
            テーブル外
            ========================================================================== */
            /* ---------------------------------------------
            2-1-4-3-30. ファイルアップロード（ドラッグ＆ドロップ（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */ 
            & .sd-upload-wrapper {
                /* トロップエリア*/
                & .sd-upload-drop-zone { 
                    display: none; 
                    width: 100%; 
                    height: 250px; 
                    border: 3px dashed var(--sd-border-main);
                    font-size: 18px; 
                    color: var(--sd-gray-default); 
                    background-color: var(--sd-bg-main);  
                    transition: all 0.3s ease; 
                    position: relative; /* サムネイル絶対配置のため */
                    overflow: hidden; /* サムネイルがはみ出さないように */
                    margin-bottom: 20px; 
                    cursor: pointer; 
                    justify-content: center; /*左右中央揃え*/
                    align-items: center;     /*上下中央揃え*/
                    &.dragover { 
                        border: 1px solid #007bff; 
                        background-color: #e6f2ff; 
                        color: #007bff; 
                    }
                }
                /* イメージコンテナ*/
                & .sd-tile-container { 
                    display: flex; 
                    flex-wrap: wrap; 
                    gap: 15px;         
                    color: var(--sd-text-main-dark);     
                    & .sd-tile-item { 
                        position: relative; 
                        width: 150px; 
                        height: 150px; 
                        border: 1px solid var(--sd-border-main); 
                        border-radius: 4px; 
                        overflow: hidden; 
                        background-color: var(--sd-bg-main);  
                        display: flex; 
                        justify-content: center; 
                        align-items: center; 

                        &.sd-tile-button {
                            color: var(--sd-text-main);
                            padding: 60px 0px;
                            cursor: pointer;
                            &.sd-tile-button-on {
                                color: var(--sd-theme-text-sd);
                                background-color: var(--sd-theme-bg-sd);
                            }
                            &:hover {
                                color: var(--sd-text-main);
                                background-color: var(--sd-bg-main); 
                            }
                        }

                        & .sd-button-delete-image {
                            position: absolute;
                            display: none;
                            top: 5px;
                            right: 5px;
                            background: rgba(255, 0, 0, 0.7);
                            color: var(--sd-white-default);
                            border: 1px solid var(--sd-border-main);
                            border-radius: 3px;
                            padding: 2px 6px;
                            line-height: 1.4em;
                            text-align: center;
                            cursor: pointer;
                            font-size: 12px;
                            font-weight: bold;
                            z-index: 501;
                            &:hover {
                                background: #ff0000e6;
                            }
                        }

                        & img {
                            width: 100%;
                            max-width: 100%;
                            height: 100%;
                            object-fit: cover;
                        }
                        
                        & .sd-tile-logo-pdf{
                            background-color: #f03a3b;
                            border: 1px solid var(--sd-border-main);
                            position: absolute;
                            color: var(--sd-white-default); 
                            padding: 0 4px;
                            border-radius: 2px;
                            margin: 2px;
                        }

                        & .sd-tile-item-date{
                            color: var(--sd-theme-text-sd);
                            background-color: var(--sd-theme-bg-sd);
                            border: 1px solid var(--sd-theme-text-sd);
                            position: absolute;
                            left: 0px;
                            bottom: 0px;
                            padding: 0 4px;
                            border-radius: 2px;
                            width: auto;
                            z-index: 1;
                        }
                    }
                }        
                /* プログレスバー*/
                & .sd-upload-progress-container {
                    display: none;
                    width: 100%;
                    background-color: var(--sd-bg-main); 
                    border-radius: 4px;
                    margin-bottom: 20px;
                    overflow: hidden;
                    border: 1px solid var(--sd-border-main);
                    & .sd-upload-progress-bar {
                        width: 0%;
                        height: 25px;
                        background-color: #28a745;
                        text-align: center;
                        line-height: 25px;
                        color: var(--sd-white-default); 
                        font-weight: bold;
                        transition: width 0.1s ease;
                    }
                }
                /* プレビューコンテナ（ドラッグ中） */
                & .sd-upload-drag-preview-container { 
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%);
                    width: 120px; /* サムネイルのサイズ */
                    height: 120px;
                    border-radius: 6px;
                    overflow: hidden;
                    pointer-events: none; /* ★重要: ドラッグ操作を妨げないように */
                    z-index: 10;
                    background: var(--sd-white-default); /* 画像が透明な場合のため */
                    display: none; /* 初期状態は非表示 */
                    & img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }
                }
            }

            /* ---------------------------------------------
            2-1-4-3-31. カレンダー (Calendar) ※スケジュールページ（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */ 
            & #sd-calendar { 
                display: grid; 
                grid-template-columns: repeat(7, minmax(0, 1fr)); 
                gap: 0; 

                & .sd-calendar-cell {
                    display: flex; 
                    flex-direction: column; 
                    flex-wrap: wrap; 
                    min-width: 0; 
                    min-height: 150px; 
                    border: 1px solid var(--sd-border-main); 
                    border-collapse: collapse;
                    word-break: break-all; 
                    overflow-wrap: anywhere;
                    .html_sd-dark & {
                        .html_skydoor & {
                            &:not(.sd-calendar-cell-noframe) {
                                border: 1px solid var(--sd-border-main-dark);    
                            }
                        }                 
                    }
                    
                    &.sd-calendar-cell-noframe {
                        border: none;
                    }
                    & .sdl-date {
                        display: flex;
                        justify-content: flex-start;
                        padding: 1px; 
                        line-height: 1.3em;
                        background-image: none;
                        background-color: var(--sd-bg-main-strong);
                        color: var(--sd-text-main-strong); 
                        .html_sd-dark & {
                            .html_skydoor & {
                                background-color: var(--sd-bg-main-strong-dark);
                                color: var(--sd-text-main-strong-dark); 
                            }
                        }

                        & li:last-of-type {
                            margin-left: auto;
                            margin-right: 0.5em;
                        }

                        & .sdl-date-edit {
                            padding: 0px 2px;
                            margin: 0px;
                            font-size: 80%;
                            border: 1px solid var(--sd-text-main-strong);
                            border-radius: 3px;
                            color: var(--sd-text-main-strong);
                            .html_sd-dark & {
                                .html_skydoor & {
                                    border: 1px solid var(--sd-text-main-strong-dark); 
                                    color: var(--sd-text-main-strong-dark); 
                                }
                            }
                        }
                    }
                    /* 土曜日 */
                    &.sd-calendar-saturday {
                        background-color: var(--sd-week-bg-saturday);
                        & .sdl-date{
                            background-color: var(--sd-week-bg-saturday-strong);
                            color: var(--sd-week-text-saturday-strong);
                            & .sdl-date-edit {
                                border: 1px solid var(--sd-week-text-saturday-strong);
                                color: var(--sd-week-text-saturday-strong);
                            }
                        }
                        .html_sd-dark & {
                            .html_skydoor & {
                                background-color: var(--sd-week-bg-saturday-dark);
                                & .sdl-date {
                                    background-color: var(--sd-week-bg-saturday-strong-dark);
                                    & .sdl-date-edit {
                                        border: 1px solid var(--sd-week-text-saturday-strong-dark); 
                                        color: var(--sd-week-text-saturday-strong-dark); 
                                    }
                                }
                            }
                        }      
                    }
                    /* 日曜日 */
                    &.sd-calendar-sunday,
                    &.sd-calendar-holiday {
                        background-color: var(--sd-week-bg-sunday);
                        & .sdl-date {
                            background-color: var(--sd-week-bg-sunday-strong);
                            color: var(--sd-week-text-sunday-strong);
                            & .sdl-date-edit {
                                border: 1px solid var(--sd-week-text-sunday-strong);
                                color: var(--sd-week-text-sunday-strong);
                            }
                        }
                        .html_sd-dark & {
                            .html_skydoor & {
                                background-color: var(--sd-week-bg-sunday-dark);
                                & .sdl-date {
                                    background-color: var(--sd-week-bg-sunday-strong-dark);
                                    & .sdl-date-edit {
                                        border: 1px solid var(--sd-week-text-sunday-strong-dark); 
                                        color: var(--sd-week-text-sunday-strong-dark); 
                                    }
                                }
                            }
                        }        
                    }
                    /* 休業日 */
                    &.sd-calendar-closed {
                        background-color: var(--sd-week-bg-closed);
                        & .sdl-date {
                            background-color: var(--sd-week-bg-closed-strong);
                            color: var(--sd-week-text-closed-strong);
                            & .sdl-date-edit {
                                border: 1px solid var(--sd-week-text-closed-strong);
                                color: var(--sd-week-text-closed-strong);
                            }
                        }
                        .html_sd-dark & {
                            .html_skydoor & {
                                background-color: var(--sd-week-bg-closed-dark);
                                & .sdl-date {
                                    background-color: var(--sd-week-bg-closed-strong-dark);
                                    & .sdl-date-edit {
                                        border: 1px solid var(--sd-week-text-closed-strong-dark); 
                                        color: var(--sd-week-text-closed-strong-dark); 
                                    }
                                }
                            }
                        }
                    }
                    /* 今日 */
                    &.sd-calendar-today {
                        border: 5px solid var(--sd-week-bg-today-strong);
                        background-color: var(--sd-week-bg-today);
                        & .sdl-date {
                            background-color: var(--sd-week-bg-today-strong);
                            color: var(--sd-week-text-today-strong);
                            & .sdl-date-edit {
                                border: 1px solid var(--sd-week-text-today-strong);
                                color: var(--sd-week-text-today-strong);
                            }
                        }
                        .html_sd-dark & {
                            .html_skydoor & {
                                border: 5px solid var(--sd-week-bg-today-strong-dark);
                                background-color: var(--sd-week-bg-today-dark);
                                & .sdl-date {
                                    background-color: var(--sd-week-bg-today-strong-dark);
                                    & .sdl-date-edit {
                                        border: 1px solid var(--sd-week-text-today-strong-dark); 
                                        color: var(--sd-week-text-today-strong-dark); 
                                    }
                                }
                            }
                        }
                    }
                    &:is(.sd-calendar-saturday,.sd-calendar-sunday,.sd-calendar-holiday,.sd-calendar-closed) .sdl-date-edit {
                        border: 1px solid var(--sd-border-main);
                    }

                    & img.sd-button-show-calender { 
                        border: none; 
                        cursor: pointer; 
                    }

                    & .sd-calendar-cell-body {
                        padding: 3px; 
                        display: flex; 
                        flex-direction: column; 
                        gap: 2px; 
                        flex: 1; 
                        margin: 0; 
                        list-style: none;
                        
                        & li { 
                            width: 100%; 
                            min-width: 0; 
                        }
                        
                        & .schedule,
                        & .schedule:hover { 
                            background: #FFF8DC; 
                            color: var(--sd-text-main); 
                        }
                        
                        & .inspection,
                        & .inspection:hover { 
                            background: linear-gradient(to bottom, #EFE, #DFD); 
                            color: var(--sd-text-main); 
                        }
                        
                        & .insurance,
                        & .insurance:hover { 
                            background: linear-gradient(to bottom, #EEF, #DDF); 
                            color: var(--sd-text-main); 
                        }
                        
                        & .task_to,
                        & .task_to:hover { 
                            background: #FFEBEE; 
                            color: var(--sd-text-main); 
                        }
                        
                        & .task_from,
                        & .task_from:hover { 
                            background: #E0F7FA; 
                            color: var(--sd-text-main); 
                        }
                        
                        & .schedule.schedule-secret { 
                            border: 1px solid var(--sd-theme-bg-rn); 
                        }

                        /* スケジュールボタン設定（自動改行許可とレイアウト調整） */
                        & a.sdl-button-mini {
                            display: block;
                            white-space: normal;
                            word-break: break-all;
                            overflow-wrap: anywhere;
                            text-align: left;
                            line-height: 1.4;
                            height: auto;
                            
                            &:hover {
                                background-image: none; 
                                border: 1px solid rgba(0,0,0,0.1); 
                            }
                        }
                        & .sd-loaner-schedule {
                            & tr {
                                & .sd-loaner-name {
                                    background-color: var(--sd-bg-red-strong); 
                                    color: var(--sd-text-red-strong); 
                                }
                                & .sd-loaner-schedule-car-img {
                                    max-width: 58px;
                                }
                                .html_sd-dark & {
                                    .html_skydoor & {
                                        & .sd-loaner-name {
                                            background-color: var(--sd-bg-red-strong-dark); 
                                            color: var(--sd-text-red-strong-dark); 
                                        }
                                    }
                                    & .sd-loaner-schedule-car-img {
                                        max-width: 58px;
                                    }
                                    &.sd-loaner-schedule-loaned {
                                        background-color: var(--sd-bg-red); 
                                        .html_sd-dark & {
                                            .html_skydoor & {
                                                background-color: var(--sd-bg-red-strong-dark); 
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                    
                    @media (max-width: 768px) { 
                        grid-template-columns: minmax(0, 1fr); 
                        gap: 5px; 
                    }
                }
            }

            /* ---------------------------------------------
            2-1-4-3-32. EC MOLE（商品一括検索）（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */ 
            & #ec_mole {
                & #mole li img {
                    height:20px;
                    vertical-align:middle;
                }
                & #mole-group-wrap {
                    display: flex; 
                    flex-wrap: wrap; 
                    justify-content: flex-start;
                    gap: 5px;                    
                    & .mole_group {
                        flex: 1 1 250px;
                        background-color:var(--sd-bg-main-strong);
                        color: var(--sd-black-default); 
                        border:1px solid var(--sd-border-main);
                        border-radius:3px;
                        margin:15px 15px 15px 0px;
                        padding:15px;
                        & ul {
                            flex-direction: column;
                            align-items: flex-start;
                            & img {
                            cursor: pointer;
                            }
                        }
                        .html_sd-dark & {
                            .html_skydoor & {
                                & h6 {
                                    color: var(--sd-theme-bg-sd-dark); 
                                    margin-top: 0px;
                                }
                            }
                        }
                        & ol.sd-ec-note {
                            display: block;
                            & li {
                                list-style: decimal;
                                margin-left: 20px;
                            }
                        }
                    }
                }
            }
                        
            /* ******************************************* */
            /* チューニングパーツ一覧検索 */
            /* ******************************************* */
            /* 上部の検索ボックス */    
            & #rn-parts-search-query-wrap {
                & #rn-parts-search-query {
                    text-align: center;
                }
            }
            /* 下部のメインボックス */
            & #rn-parts-search-main-wrap {
                margin-top: 20px;
                display: flex;
                flex-wrap: wrap;
                gap:10px;

                /* 左ペイン */
                & #rn-parts-search-left {
                    flex: 0 0 300px; 
                    border-color: var(--sd-border-main);
                    & .rn-parts-search-box {
                        border: 1px solid #DDD;
                        margin-bottom:1em;
                        & .rn-parts-search-box-title {
                            padding:5px;
                            background-color: #EEE;
                            color:#333;
                        }
                        & .rn-parts-search-box-content {
                            padding:5px;
                        }
                    }
                }
                    
                /* 右の検索結果 */
                & #rn-parts-search-right {
                    flex: 1; 
                }
            }

            @media only screen and (max-width: 767px) {
                #rn-parts-search-left-wrap {
                    position: relative;
                    width:100%;
                    float:left;
                    padding-bottom:2em;
                    z-index: 1;
                    & #rn-parts-search-left {
                        position: relative;
                        z-index: 2;
                    }
                }
                #rn-parts-search-right-wrap {
                    & #rn-parts-search-right {
                        position: relative;
                        margin-left: 0;
                        width: 100%;
                        padding:0px;
                    }
                }
            }
            /*
            イベントステータスのリスト表示
            ==========================================*/
            & .rn-event-list-status {
                font-size: 90%;
                padding: 1px 5px;
                margin-left: 0.5em;
                color: #444;
                border: 1px solid #444;
                border-radius:1px;
                line-height:1.5em;
            }
            & .rn-event-list-status-requruitment-period {
                background-color: #2C7CFF;
                color: #FFF;
            }
            & .rn-event-list-status-discount-period {
                background-color: #00F9A9;
            }
            & .rn-event-list-status-before-requruitment {
                background-color: #00FF3B;
            }
            & .rn-event-list-status-unpublished {
                background-color: #FF3366;
                color: #FFF;
            }

            /*
            イベント画像
            ==========================================*/
            & .rn-image-preview {
                box-shadow: 3px 3px 4px #CCC;
            }
            /*
            フェードアウトダイアログ  // 2015-03-29 Kishino
            ==========================================*/
            & .sdl-fadeout-dialog {
                position: fixed;
                z-index:999999;
                top: 50%;
                left: 50%;
                margin-top: -75px;
                margin-left: -125px;
                height:150px;
                width:250px;
                background-color:#FFF;;
                color:#444;
                font-weight: bold;
                text-align: center;
                font-size: 110%;
                text-shadow: 3px 3px 3px #CCC;
                padding: 20px;
                padding-top:30px;
                border: 1px solid #CCC;
                box-shadow: 0px 0px 20px 20px #EEE;
            }
            & .submit_lock_msg {
                margin-top:15px;
            }
            & .favorite_star {
                color:#FFD700;
            }

            /* ---------------------------------------------
            2-1-4-3-34. モバイル・レスポンシブ (Responsive)（#sdl-main, #sdl-header, #sdl-sidebar以下）
            --------------------------------------------- */ 
            @media (max-width: 800px) {
                .sdl-list-convert {
                    &,
                    & tbody,
                    & tr { 
                        display: block; 
                        width: 100%; 
                    }    
                    & thead { 
                        display: none; 
                    }                    
                    & tr { 
                        margin-bottom: 1.5rem; 
                        border: 1px solid var(--sd-white-default); 
                    }
                    & :is(th, td) { 
                        display: block; 
                        padding: 10px; 
                        border: none; 
                    }                    
                    & td { 
                        border-top: 1px solid var(--sd-white-default); 
                    }
                }     
                & .sdl-table-transform {
                    writing-mode: vertical-lr;
                    & tbody {
                        width: 100%;
                        & tr {
                            margin-bottom: 0;
                            padding: 0;
                            writing-mode: horizontal-tb;    
                            & th,
                            & td {
                                writing-mode: horizontal-tb;
                                padding: 7px;
                                border-bottom: 1px solid #DDD;
                                min-height: 3em;
                            }
                            & th {
                                min-width: 10em;
                            }
                            & td {
                                min-width: 180px;
                            }
                        }    
                    }
                }           
            }
            
            /*スクロール時に上部固定（jsでコントロール）*/
            @media only screen and (min-height: 830px) {
                .sdl-sidebar-fixed{
                    position: fixed;
                    z-index: 9999;
                }
            }

        }

        /* ==========================================================================
        6. メディアクエリ・外側コンテナ (Responsive)
        ========================================================================== */
        @media (min-width: 768px) {
        }

        @media (max-width: 767px) { 
            #rn-parts-search-left-wrap, 
            #rn-parts-search-right-wrap { 
                width: 100%; 
            } 
            
            #sdl-header {
                &.notloggedin { 
                    display: none; 
                } 
                
                & .loggedin { 
                    right: 5px; 
                } 
            }
            #sdl-header-mobile { 
                display: block; 
                right: 5px; 
            }                 
        }

        @media (max-width: 479px) { 
            #sdl-header-mobile .show-login { 
                right: 45px; 
            } 
        }
    }    
}

/* ***********************************************************************************************************
    4 . 印刷時に適用するCSS
*********************************************************************************************************** */
@media print {
    #top {
        & #wrap_all {
            & a[href]:after {
                content: "";
            }
            & iframe, & #wpadminbar, & .wp_social_bookmarking_light, & #footer, & #header,
            & .social_bookmarks, & #scroll-top-link,
            & #sdl-breadcrumbs, & #main & aside, & #main & .sidebar, & #sdlMakerLink,   
            & .sdl-button, & .sdl-button-middle, & .sdl-button-mini, & .sdl-message-development, & .sdl-table-tabArea, & .sdl-primary-table-link-box,
            & .sd-search-paginate-wrap, & .sd-search-condition, & .sd-button-wrap,
            & .footable-toggle, & .footable-toggle, & .footable-last-column,   
            & & .rn-ad, & .rn-main-lower-pr, & .rnSnsShare, & .addtoany_share_save_container, & .ssba,
            .not-print, & .favoritresult
            {
                display:none;
            }

            html.html_header_top.html_header_sticky & #main,
            #main,
            main,
            footer,
            .container,
            .entry-content-wrapper
            {
                margin: 0px;
                padding: 0px;
            }
            & main
            {
                padding-top:0px;
                padding-bottom:0px;
                float: none;
                clear: both;
                width:250mm;
            }
            & #main {
                & h3.sdl-page-title {
                margin-top:0px;
                margin-bottom:0px;
                    & :is(footer#socket, aside.sidebar) {
                        border:none;
                        border-color:none;
                        border-width:0px;
                    }
                }
            }
        }
    }
}

/* ***********************************************************************************************************
    5 . トップページ専用
    <html id="sdl-toppage">をsdlのfunction.phpで出力している。
    先頭に#sdl-toppage #top を付加することでトップページのみにCSSを適用できる
*********************************************************************************************************** */
#sdl-toppage #top #wrap_all {
    /*----------------------------------
    2015-09-29 Kishino
    各投稿カテゴリーの枠線
    ----------------------------------*/
    & .flex_column .flex_column {
        margin-top:0px;
    }
    & .blog-categories {
        display:none;
    }
    /*----------------------------------
    2015-12-17 Kishino
    石積み投稿の設定
    ----------------------------------*/
    & .main_color {
        & div .av_one_full {
            border:1px solid #CCC;
            padding:10px 5px;
        }
        & .av-inner-masonry {
            border:1px solid #999;
        }
        & .av-masonry-entry {
            & .av-inner-masonry-content {
                padding:3px;
                background-color:#fee;
            }
            & .av-masonry-entry .avia-arrow {
                background-color:#fee;
            }
        }
    }
    & .av-fixed-size .av-masonry-entry .av-inner-masonry-sizer {
        padding-bottom:100%;
    }

    /*----------------------------------
    スライダー
    ----------------------------------*/
    & .avia-content-slider {
        margin-top:10px;
        & .slide-entry-wrap {
            margin-bottom: 0px;
        }
    }

    /*----------------------------------
    見出し
    ----------------------------------*/
    & .av-special-heading {
        margin-top: 3px;
        z-index: 400;
    }
    & h2.av-special-heading-tag {
        margin-bottom: 0px;
        float:none;
        padding:0 0 0 1em;        
        opacity:0.7;
        background: url(/img/checker_35.png) right no-repeat, rgba(0, 0, 0, 0) linear-gradient(#fff, #bfbfbf);
        border:1px solid #999;
        text-shadow: none;
        font-size: 1.5em;
    }

    & .custom-color-heading h2.av-special-heading-tag {
        color:#222;
    }

    /*----------------------------------
    2015-09-29 Kishino
    各カテゴリーの1個目の投稿の書式設定（大きな画像）
    ----------------------------------*/
    & .entry-content-wrapper {
        & :is(.el_after_av_heading:not(.av_one_full), .flex_column .flex_column:first-child) {
            & .slide-entry-wrap {
                & > article:first-child {
                    & .slide-content {
                        background: linear-gradient(rgba(176, 0, 0, 0.6), rgba(176, 0, 0, 0.8));
                        padding: 2%;
                        /*position: static;*/
                        text-shadow: 1px 1px 1px #000;
                        min-height: 30%;
                        color:#FFF;
                        
                        & h3 a {
                            font-size: 28px;
                            line-height: 28px;
                            color: #fff;
                        }
                        & .slide-meta {
                            color: #ccc;
                        }
                        & .slide-meta time{
                            color: #ccc;
                        }
                        & .slide-entry-excerpt {
                            color: #eee;
                        }
                    }
                }
            }
        }
    }
}