@charset "UTF-8";

/*
 * Generated from CommFunctionWeb.GenerateCssByDomain by scripts/Build-ThemeCss.ps1.
 * Shared selectors only. Domain values must come from theme-base-color.css.
 */
@font-face {
    font-family: "SCDream4";
    src: url("/Content/webfonts/scdream4.woff") format("woff");
    font-style: normal;
    font-weight: normal;
    font-display: swap;
}
body * {
    	font-family: var(--FontFamily); 
    	font-size: var(--FontSize);
    	letter-spacing: var(--LetterSpace);
    }


    .headerLogoDark {
    background : var(--HeaderLogo);
    width: var(--HeaderLogoWidth);
    height: var(--HeaderLogoHeight);
    background-size: var(--HeaderLogoBackgroundSize);
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
}

    .headerLogoBright {
    background : var(--HeaderLogoBright);
    width: var(--HeaderLogoWidth);
    height: var(--HeaderLogoBrightHeight);
    background-size: var(--HeaderLogoBackgroundSize);
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
}

    .LoginRight {
    background : var(--HeaderLogoBright);
    width: var(--LoginLogoWidth);
    height: var(--LoginLogoHeight);
    background-size: var(--LoginLogoBackgroundSize);
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    }

    a {
        color: var(--theme-color-text-primary);
    }

    /* common */

    .input_wrap.type1 h5 .dot {
        background-color: var(--theme-color-brand);
    }

    .input_wrap.type2 h5 {
        background-color: var(--theme-color-bg-field-subtle);
            font-size: var(--FontS05);
    }

    .input_wrap.type3 h5 .dot {
        background-color: var(--theme-color-brand);
    }

    .input_wrap.type4 h5 {
            font-size: var(--FontS06);
    }
    .input_wrap.type4 h5 .dot {
        background-color: var(--theme-color-brand);
    }

    .input_wrap input {
        color: var(--theme-color-text-primary);
        font-size: var(--FontS05);
    }

    .input_wrap select {
        font-size: var(--FontS05);
        color: var(--theme-color-text-primary);
    }

    .input_wrap textarea {
        color: var(--theme-color-text-primary);
        font-size: var(--FontS05);
    }

.btn button,
.btn a {
    font-size: var(--FontS07);
}

    .btn_wrap.grey a:hover,
    .btn_wrap.grey button:hover {
        border: 1px solid #c2c2c2;
    }

    .btn_wrap.green a,
    .btn_wrap.green button {
        border: 1px solid var(--theme-color-brand);
        background: var(--theme-color-brand);
    }

        .btn_wrap.green a:hover,
        .btn_wrap.green button:hover {
            border: 1px solid var(--theme-color-action-primary-hover);
            background: var(--theme-color-action-primary-hover);
        }

    .btn_wrap.bottom a,
    .btn_wrap.bottom button {
        color: #fff;
        background-color: var(--theme-color-brand);
        border: solid 1px var(--theme-color-brand);
    }

        .btn_wrap.bottom a:hover,
        .btn_wrap.bottom button:hover {
            background-color: var(--theme-color-action-primary-hover);
        }

    .btn_wrap a.check_all,
    .btn_wrap button.check_all,
    .btn_wrap a.check_page,
    .btn_wrap .check_page button {
        border: solid 1px var(--theme-color-border-action);
        font-size: var(--FontS05);
    }

        .btn_wrap a.check_all:hover,
        .btn_wrap button.check_all:hover,
        .btn_wrap a.check_page:hover,
        .btn_wrap button.check_page:hover {
            border: 1px solid var(--theme-color-action-primary);
        }

            .btn_wrap a.check_all:hover p,
            .btn_wrap button.check_all:hover p,
            .btn_wrap a.check_page:hover p,
            .btn_wrap button.check_page:hover p {
                color: var(--theme-color-border-action);
            }

        .btn_wrap a.check_all.active,
        .btn_wrap button.check_all.active,
        .btn_wrap a.check_page.active,
        .btn_wrap button.check_page.active {
            border: 1px solid var(--theme-color-brand);
            background: var(--theme-color-brand);
            color: white;
        }

            .btn_wrap a.check_all.active:hover p,
            .btn_wrap button.check_all.active:hover p,
            .btn_wrap a.check_page.active:hover p,
            .btn_wrap button.check_page.active:hover p {
                color: white;
            }


    .btn_wrap a,
    .btn_wrap button {
        border: solid 1px var(--theme-color-border-action);
        font-size: var(--FontS05);
    }

        .btn_wrap a:hover,
        .btn_wrap button:hover {
            border: 1px solid var(--theme-color-action-primary-hover);
            background: var(--theme-color-action-primary-hover);
        }

        .btn_wrap a p,
        .btn_wrap button p {
            color: var(--theme-color-border-action);
        }

    .modal .btn_wrap button {
        border: solid 1px var(--theme-color-border-action);
        color: var(--theme-color-border-action);
        background: white;
        font-size: var(--FontS05);
    }

        .modal .btn_wrap a:hover,
        .modal .btn_wrap button:hover {
            border: 1px solid var(--theme-color-action-primary-hover);
            background: var(--theme-color-action-primary-hover);
        }

        .modal .btn_wrap a p,
        .modal .btn_wrap button p {
            color: var(--theme-color-border-action);
        }

    .modal .btn_wrap.btn_gray_line button {
        color: #424242;
        border-color: #424242;
        background: white;
    }

        .modal .btn_wrap.btn_gray_line a p,
        .modal .btn_wrap.btn_gray_line button p {
            color: #424242;
        }

    .modal .btn_wrap.btn_gray_line:hover button {
        color: #424242;
        border-color: #424242;
        background: whitesmoke;
    }

    .modal_head {
        font-size: var(--FontS06);
    }
    .modal_md .modal_con {
        font-size: var(--FontS06);
    }

    .modal_sm .modal_con {
        font-size: var(--FontS06);
    }

    .modal_btn button {
        font-size: var(--FontS06);
    }

    .modal_btn button.confirm:hover {
        font-size: var(--FontS06);
    }

    .modal_btn button.cancle:hover {
        font-size: var(--FontS06);
    }

    .btn_wrap button.btn_gray_line, .btn_wrap a.btn_gray_line {
        color: #424242;
        border-color: #424242;
        background: white;
    }

        .btn_wrap button.btn_gray_line:hover, .btn_wrap a.btn_gray_line:hover {
            color: #424242;
            border-color: #424242;
            background: whitesmoke;
        }

    .btn_wrap.red a,
    .btn_wrap.red button {
        border: 1px solid #CD0C22;
        background: white;
        color: #CD0C22;
    }

        .btn_wrap.red a p,
        .btn_wrap.red button p {
            color: #CD0C22;
        }

.btn_wrap a:hover p,
.btn_wrap button:hover p {
color: #fff;
}

        .btn_wrap.red a:hover,
        .btn_wrap.red button:hover {
            border: 1px solid #CD0C22;
            background: #CD0C22;
            color: white
        }


    ul.tabs li {
        color: var(--theme-color-text-secondary);
        font-size: var(--FontM01);
    }

        ul.tabs li:hover {
            color: var(--theme-color-action-primary-hover);
        }

        ul.tabs li.current {
            color: var(--theme-color-brand);
            border-bottom: 2px solid var(--theme-color-brand);
        }

.content .nav ul.depth1_wrap li.depth1.on > a i{
filter: var(--LeftPanelIcon)
}

.content .nav ul.depth1_wrap li.depth1:hover > a,
.content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2.on.arrow > a,
.content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2:hover.arrow > a,
.content .nav ul.depth1_wrap li.depth1.on.arrow > a, 
.content .nav ul.depth1_wrap li.depth1:hover.arrow > a, 
.content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2:hover > a p,
.content .popup .popup-content ul.deli_process li:nth-child(2n-1) .img,
.content .con_wrap .con .BrightIcon{
        filter: var(--theme-filter-icon-on-accent)
    }

.content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2.active:hover > a p{
filter: none;
}

    .content .con_wrap .con .con_box ul.noti_list li a .txt p {
       font-size: var(--FontS06);
    }

.header_left .menu_btn button img,
.content .con_wrap header .header_left .menu_btn button:hover,
.content .con_wrap .con .con_box ul.delivery_list li img, 
.content .con_wrap .con .con_box ul.delivery_list_storage li img,
.content .con_wrap .con .con_box ul.confirm_list li a .txt img, 
.content .con_wrap .con .con_box ul.noti_list li a .txt img,
.content .con_wrap .con .ColorIcon,
.content .con_wrap .ColorIcon,
.content .table-icon {
        filter: var(--theme-filter-icon-accent)
}

.dxgvCommandColumn_Office365.allCheckActive, 
.dxWeb_edtCheckBoxChecked_Office365,
input[type=checkbox]:checked + label.check_style1::before,
input[type=radio]:checked + label.radio_style1:before,
.dxWeb_edtCheckBoxGrayed_Office365{
        filter: var(--theme-filter-control-checked)
}

    input[type=radio] + label.radio_style1 {
        font-size: var(--FontS05);
}

    input[type=checkbox] + label.check_style1 {
        font-size: var(--FontS03);
}
    .content .nav ul.depth1_wrap li.depth1.active > a {
        background: var(--theme-color-brand);
    }

    .content .nav ul.depth1_wrap li.depth1 > a p {
        color: var(--theme-color-text-primary);
        font-size: var(--FontS07);
    }

    .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2 > a {
        font-size: var(--FontS06);
    }

    .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2 > a p {
        color: var(--theme-color-text-primary);
    }

    .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2.on > a p {
        color: var(--theme-color-brand);
    }

    .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2.active > a {
        background: var(--theme-color-brand);
    }


        .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2.active > a:hover {
            background: var(--theme-color-action-primary-hover);
        }


    .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2.on > a p {
        color: var(--theme-color-brand);
    }

    .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2 ul.depth3_wrap li.depth3 > a {
       font-size: var(--FontS05);
    }

    .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2 ul.depth3_wrap li.depth3 > a p {
        color: var(--theme-color-text-primary);
    }

.content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2 ul.depth3_wrap li.depth3:hover > a p{
        color: var(--theme-color-brand);
}


    .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2 ul.depth3_wrap li.depth3.active > a {
        background: var(--theme-color-brand);
    }

        .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2 ul.depth3_wrap li.depth3.active > a:hover {
            background: var(--theme-color-action-primary-hover);
    }

    .content .nav ul.depth1_wrap li.depth1 ul.depth2_wrap li.depth2:hover > a p {
        color: var(--theme-color-brand);
    }


    .content .con_wrap header.header2 {
        background-color: var(--theme-color-bg-header);
    }

        .content .con_wrap header.header2 .header_right ul.snb_list li.lang_list a {
            color: var(--theme-color-text-primary);
        }

    .content .con_wrap header .header_right .cash p {
        color: var(--theme-color-text-secondary);
    }

    .content .con_wrap header .header_right .cash h5 {
        color: var(--theme-color-brand);
        font-size: var(--FontS10);
    }

    .content .con_wrap header .header_right .cash a {
        background-color: var(--theme-color-brand);
    font-size: var(--FontS05);
    }

        .content .con_wrap header .header_right .cash a:hover {
            background: var(--theme-color-action-primary-hover);
        }

    .content .con_wrap.login header .header_right ul.snb_list a p,
.content .con_wrap.login header .header_right ul.snb_list  > li.lang.login > button p{
        color: var(--theme-color-text-on-brand);
    }

    .content .con_wrap.login header .header_right ul.snb_list a:hover p,
.content .con_wrap.login header .header_right ul.snb_list  > li.lang.login > button:hover p{
        color: var(--theme-color-text-on-brand-hover);
    }

    .content .con_wrap.login header .header_right ul.snb_list a i ,
.content .con_wrap.login header .header_right ul.snb_list  > li.lang.login > button i{
        filter: var(--LoginHeaderIconColor);
    }

    .content .con_wrap.login header .header_right ul.snb_list a:hover i ,
.content .con_wrap.login header .header_right ul.snb_list  > li.lang.login > button:hover i {
        filter: var(--LoginHeaderIconColorHover);
    }


    .content .con_wrap header .header_right ul.snb_list > li select {
       font-size: var(--FontS07);
    }
    .content .con_wrap header .header_right ul.snb_list > li > button,
    .content .con_wrap header .header_right ul.snb_list > li > a {
        font-size: var(--FontS06);
    }

    .content .con_wrap header .header_right ul.snb_list > li > button .num,
    .content .con_wrap header .header_right ul.snb_list > li > a .num {
        font-size: var(--FontS05);
    }

    .content .con_wrap header .header_right ul.snb_list > li .gnb_box1 > h5 {
        background: var(--theme-color-brand);
    }

    .content .con_wrap header .header_right ul.snb_list > li .gnb_box1 ul.gnb_list li a h5 {
        font-size: var(--FontS10);
        background: var(--theme-color-brand);
    }

    .content .con_wrap header .header_right ul.snb_list > li .gnb_box1 ul.gnb_list li a:hover,
    .content .con_wrap header .header_right ul.snb_list > li .gnb_box2 ul.gnb_list li a:hover{
        background: var(--theme-color-bg-hover) 
    }

    .content .con_wrap header .header_right ul.snb_list > li .gnb_box3 ul.gnb_list li a:hover{
        background: var(--theme-color-bg-hover) 
    }
    
    .content .con_wrap header .header_right ul.snb_list > li .gnb_box2 ul.gnb_list li a p {
        font-size: var(--FontS05);
    }

    .content .con_wrap header .header_right ul.snb_list > li .gnb_box3 ul.gnb_list li a p {
        font-size: var(--FontS05);
    }

    .content .con_wrap header .header_right ul.snb_list > li .gnb_box2 .my_info {
        background: var(--theme-color-brand);
    }

    .content .con_wrap header .header_right ul.snb_list > li .gnb_box2 .my_info .txt h5 {
        font-size: var(--FontS08);
    }

    .content .con_wrap header .header_right ul.snb_list > li .gnb_box2 .my_info .txt p {
        font-size: var(--FontS05);
    }

    .content .con_wrap header .header_right ul.snb_list > li.active > button,
    .content .con_wrap header .header_right ul.snb_list > li.active > a {
        background: var(--theme-color-bg-navigation-active);
    }

    .table table tr th {
        background: var(--theme-color-bg-table-header);
        font-size: var(--FontS05);
    }

        .table table tr th .table_flex .dot {
            background-color: var(--theme-color-brand);
        }

    .table table tr td {
        font-size: var(--FontS05);
    }

    .table_bottom .txt > span {
        font-size: var(--FontS03);
    }

    .table table tr td.green {
        color: var(--theme-color-brand);
    }

    .table_bottom .txt p span {
        color: var(--theme-color-brand);
    }

    .table_bottom ul.pager li a {
        font-size: var(--FontS09);
    }

    .table_bottom ul.pager li.on a {
        border: 1px solid var(--theme-color-brand);
        color: var(--theme-color-brand);
    }

    .dxpLite_Office365 .dxp-button:not(.dxp-disabledButton):hover {
        background-color: var(--theme-color-brand);
    }

    .dxpLite_Office365:not(.dxpLiteDisabled_Office365) .dxp-current.dxp-num:hover {
        border: 1px solid var(--theme-color-brand);
        color: white;
    }

    .dxpLite_Office365 .dxp-current {
        border: 1px solid var(--theme-color-brand);
        color: white;
    }

    dxpLite_Office365 .dxp-button.dxp-bi, .dxpLite_Office365 .dxp-num{
       font-size: var(--FontS03);
    }
    .dxgvHeader_Office365 {
        background: var(--theme-color-bg-table-header) !important;
    }

    .dxp-comboBox {
        font-size: var(--FontS07);
        color: var(--theme-color-text-primary);
    }

    .dxpLite_Office365 .dxp-comboBox {
         font-size: var(--FontS05);
    }

    .dxgvControl_Office365 .dxgvHSDC {
        background-color: var(--theme-color-bg-table-header);
    }

    .dxgvTable_Office365 td.dxgvHeader_Office365 {
        border-top: 1px solid var(--theme-color-bg-table-header) !important;
        border-bottom: 1px solid var(--theme-color-bg-table-header);
    }

    .input_wrap.type1 h5 {
        font-size: var(--FontS05);
    }

    .input_wrap.type1 h5 .que .que_box {
        border: 1px solid var(--theme-color-brand);
    }

        .input_wrap.type1 h5 .que .que_box h5 {
            font-size: var(--FontS08);
        }

        .input_wrap.type1 h5 .que .que_box p {
            color: var(--theme-color-text-primary);
        }

    .dxbButton_Office365 {
        background-color: var(--theme-color-text-link);
    }

    .dxgvHeader_Office365 td {
        color: var(--theme-color-text-table-header);
        font-size: var(--FontS04)!important;
    }

    .dropdown {
        color: var(--theme-color-text-primary);
        font-size: var(--FontS05);
    }

    .checkRowCountNumber {
        color: var(--theme-color-text-link);
        font-size: var(--FontS06);
    }

    .terms-of-use h3, .privacy-policy h3 {
        background: var(--theme-color-text-link);
    }

    #div_update_result {
        color: var(--theme-color-text-link);
       font-size: var(--FontS07);
    }

    input[type=file]::file-selector-button {
         font-size: var(--FontS03);
         border: 1px solid var(--theme-color-brand);
         color: var(--theme-color-brand);
    }

        input[type=file]::file-selector-button:hover {
            background: var(--theme-color-brand);
        }

    .dxmLite_Office365 .dxm-item.dxm-checked, .dxmLite_Office365 .dxm-item.dxm-selected {
        background-color: var(--theme-color-brand);
        color: white;
    }

        .dxmLite_Office365 .dxm-item.dxm-selected:hover {
            background-color: var(--theme-color-action-primary-hover);
        }

    .modal .btn_wrap.green button {
        border: solid 1px var(--theme-color-brand);
        background-color: var(--theme-color-brand);
    }

        .modal .btn_wrap.green button:hover {
            border: solid 1px var(--theme-color-action-primary-hover);
            background-color: var(--theme-color-action-primary-hover);
        }

    .content .con_wrap .con .con_box .filter_selectbox .optionList_wrap .filter_tit {
        color: var(--theme-color-text-primary);
    }
    
    .content .con_wrap .con .con_box .filter_selectbox .optionList_wrap .filter_tit h5 {
        font-size: var(--FontS02);
    }

    .content .con_wrap .con .con_box .filter_selectbox .optionList_wrap .filter_confirm button {
        color: var(--theme-color-action-primary-hover);
        border: 1px solid var(--theme-color-action-primary-hover);
        font-size: var(--FontS03);
     }

    .content .con_wrap .con .con_box .filter_selectbox .optionList_wrap .calendar .week table.date_table.thead tr th {
        font-size: var(--FontS05);
    }

    .content .con_wrap .con .con_box .filter_selectbox .optionList_wrap .calendar table.date_table tr td {
         font-size: var(--FontS05);
    }
    .content .con_wrap .con .con_box .filter_selectbox .optionList_wrap .calendar .cal_con .date_box .date_tit h5 {
         font-size: var(--FontS05);
    }


    .content .con_wrap .con .con_box .filter_selectbox .optionList_wrap .calendar .cal_head input {
        font-size: var(--FontS05);
    }

    .content .con_wrap .con .con_box .filter_selectbox .optionItem {
        font-size: var(--FontS05);
        color: var(--theme-color-text-primary);
    }

        .content .con_wrap .con .con_box ul.more_list li p {
            font-size: var(--FontS05);
        }


    .content .con_wrap .con .con_box ul.more_list li a {
        font-size: var(--FontS05);
        color: var(--theme-color-text-muted);
    }


    .content .con_wrap .con .con_box ul.more_list li input + label {
        font-size: var(--FontS05);
    }
    .content .con_wrap .con .con_box ul.more_list li input:checked + label {
        background: var(--theme-color-brand);
    }

    .content .con_wrap .con .con_box .box_head h5 {
        font-size: var(--FontS10);
    }

    .content .con_wrap .con .con_box .box_head h5 span {
        color: var(--theme-color-text-muted);
        font-size: var(--FontS07);
    }

    content .con_wrap .con .con_box .cs_wrap .cs_list ul li a p {
        font-size: var(--FontS06);
    }

    .content .con_wrap .con .con_box .cs_wrap .cs_list ul li a h5 {
        font-size: var(--FontS05);
    }

    .content .con_wrap .con .con_box .cs_wrap .cs_list ul li a h5 span {
        font-size: var(--FontS05);
    }

    .content .con_wrap .con .con_box ul.delivery_list li h5 {
        font-size: var(--FontM06);
    }
    .content .con_wrap .con .con_box ul.delivery_list li:hover {
        background: var(--theme-color-bg-hover);
    }

    .content .con_wrap .con .con_box ul.delivery_list li p {
        color: var(--theme-color-text-muted);
    }

    .content .con_wrap .con .con_box ul.delivery_list_storage li h5 {
        font-size: var(--FontM06);
    }

    .content .con_wrap .con .con_box ul.delivery_list_storage li:hover {
        background: var(--theme-color-bg-hover);
    }

    .content .con_wrap .con .con_box ul.delivery_list_storage li p {
        color: var(--theme-color-text-muted);
    }

    .content .con_wrap .con .con_box .cs_wrap .cs_total .cs_box.active a {
        background-color: var(--theme-color-bg-selected);
    }

    .content .con_wrap .con .con_box .cs_wrap .cs_total .cs_box a h5 {
        font-size: var(--FontM04);
    }

        .content .con_wrap .con .con_box .cs_wrap .cs_total .cs_box a p {    
        font-size: var(--FontS07);
    }

    .content .con_wrap .con .con_box .cs_wrap .cs_total .cs_box a {
        background-color: var(--theme-color-bg-hover);
    }

    .content .con_wrap .con .con_box ul.barogagi_list li a .txt {
       font-size: var(--FontS06);
    }

    .content .con_wrap .con .con_box ul.barogagi_list li a:hover {
        background-color: var(--theme-color-bg-hover);
    }

    .content .con_wrap .con .con_box ul.noti_list li a:hover {
        background-color: var(--theme-color-bg-hover);
    }

    .content .con_wrap .con .con_box ul.noti_list li a .txt {
        font-size: var(--FontS09);
    }

    .content .con_wrap .con .con_box ul.noti_list li a .txt h5 {
        color: var(--theme-color-text-muted);
        font-size: var(--FontS05);
    }

    .content .con_wrap .con .con_box ul.noti_list li a .number {
        color: var(--theme-color-text-muted);
        font-size: var(--FontS05);
    }


    .content .con_wrap .con .con_box ul.confirm_list li a h5 {
        font-size: var(--FontS09);
/*        background: var(--theme-color-bg-warning-subtle);
        color:#fff
*/    }

    .content .con_wrap .con .con_box ul.confirm_list li a .txt p {
        color: var(--theme-color-text-muted);
        font-size: var(--FontS07);
    }

        .content .con_wrap .con .con_box ul.confirm_list li a .txt p:hover {
            color: var(--theme-color-text-link);
        }

    .content .con_wrap .con .con_box ul.notice_list li.last a {
        background-color: var(--theme-color-bg-table-header);
    }

    .content .con_wrap .con .con_box ul.notice_list li a:hover {
        background-color: var(--theme-color-bg-highlight);
    }

    .content .con_wrap .con .con_box ul.notice_list li a h5 {
        font-size: var(--FontS07);
    }

    .content .con_wrap .con .con_box ul.notice_list li a h4 {
        font-size: var(--FontS07);
        color: var(--theme-color-text-primary);
    }

    .content .con_wrap .con .con_box ul.notice_list li a h3 {
       font-size: var(--FontM01);   
        color: var(--theme-color-text-primary);
    }

    .content .con_wrap .con .con_box ul.notice_list li a p {
        font-size: var(--FontS09);
        color: var(--theme-color-text-muted);
    }

    .content .con_wrap .con .con_box ul.info_list li {
        font-size: var(--FontS05);
        color: var(--theme-color-text-primary);
    }

    .content .con_wrap .con .con_box .filter_selectbox .optionList_wrap .filter_tit {
        color: var(--theme-color-text-primary);
    }

    .content .con_wrap .con .con_box .filter_selectbox .optionList_wrap .filter_confirm button {
        font-size: var(--FontS03);
        color: var(--theme-color-action-primary-hover);
        border: 1px solid var(--theme-color-action-primary-hover);
    }

    .content .con_wrap .con .con_box .filter_selectbox .optionItem {
        color: var(--theme-color-text-primary);
    }

.content .con_wrap .con .login{
    background: var(--LoginBackground);
    height: calc(100vh - 61px);
    overflow: hidden;
    background-size: cover;
}

    .content .con_wrap .con .login .login_wrap .login_logo {
        background: var(--theme-color-bg-brand);
    }

    .content .popup .popup-header h2 {
        font-size: var(--FontM02);
    }

    .content .popup .popup-content .number_list{
        background: var(--theme-color-bg-table-header);
    }

    .content .popup .popup-content .number_list li h5{
       font-size: var(--FontS07);
    }
    content .popup .popup-content .number_list li p {
        font-size: var(--FontS07);
    }
    .content .popup .popup-content p {
        font-size: var(--FontS06);
    }

    .content .popup .popup-content .table small {
        color: var(--theme-color-text-primary);
    }

    .content .popup .popup-content ul.info_list li {
        font-size: var(--FontS05);
        color: var(--theme-color-text-primary);
    }

    .content .popup .popup-content ul.default_list li.ing {
        background: var(--theme-color-brand);
    }

        .content .popup .popup-content ul.default_list li span {
       font-size: var(--FontS01);
    }
    .content .popup .track_content.active {
        border-bottom: solid 4px var(--theme-color-text-link);
    }

    .content .popup .popup-buttons button {
        font-size: var(--FontS07);
    }

    .content .popup .popup-content .table td a {
        color: var(--theme-color-text-link);
    }

    .content .popup .popup-content ul.deli_process li.active p {
        background: var(--theme-color-brand);
    }

    .content .popup .popup-content ul.deli_process li p {
        color: var(--theme-color-brand);
        font-size: var(--FontS05);
    }

    .content .popup .popup_flex .popup_left .txt_info p {
        font-size: var(--FontS07);
    }

    .content .popup .popup_flex .popup_left .txt_info h5 {
        font-size: var(--FontS07);
    }

    .content .popup .popup_flex .popup_left .chat_box_wrap .date p {
        font-size: var(--FontS05);
    }

    .content .popup .popup_flex .popup_left .chat_box_wrap .customer .checkTime {
        font-size: var(--FontS03);
    }

    .content .popup .popup_flex .popup_left .chat_box_wrap .customer h5 {
        font-size: var(--FontS05);
    }

    .content .popup .popup_flex .popup_left .chat_box_wrap .customer .chat small {
        color: var(--theme-color-text-muted);
        font-size: var(--FontS05);
    }

    .content .popup .popup_flex .popup_left .chat_box_wrap .customer .chat p {
        font-size: var(--FontS05);
    }

    .content .popup .popup_flex .popup_left .chat_box_wrap .cs .chat p {
        background-color: var(--theme-color-brand);
        font-size: var(--FontS05);
    }

    .content .popup .popup_flex .popup_left .chat_box_wrap .cs .checkTime {
        font-size: var(--FontS03);
    }
    
    .content .popup .popup_flex .popup_left .chat_box_wrap .cs h5 {
        font-size: var(--FontS05);
    }

    .content .popup .popup_flex .popup_left .chat_box_wrap .cs .chat small {
        color: var(--theme-color-text-muted);
        font-size: var(--FontS05);
    }

    .content .con_wrap .con .con_box ul.inquiry_info.infoSum li a.active {
        background: var(--theme-color-bg-emphasis);
    }

    .handsontable th {
        background-color: var(--theme-color-bg-table-header);
    }

    .dropdown-icon-menu > ul > li .btn:hover,
    .header-btn:hover {
        border-color: var(--theme-color-brand);
        background: var(--theme-color-brand);
    }

    .header-icon:not(.btn) > [class*='fa-']:first-child,
    .header-icon:not(.btn) > .ni:first-child {
        color: var(--theme-color-brand);
    }

    .page-logo-1 {
        background-color: var(--theme-color-brand);
    }

    .page-logo-2 {
        background-color: var(--theme-color-brand);
    }

    .app-list-item:active {
        border-color: var(--theme-color-brand);
    }

    .nav-filter input[type='text']:focus {
        border-color: var(--theme-color-brand);
    }

    .nav-function-top .page-sidebar .primary-nav .nav-menu > li.active > a:before {
        color: var(--theme-color-brand);
    }

    .nav-function-hidden:not(.nav-function-top) .page-header [data-class='nav-function-hidden'] {
        background-color: var(--theme-color-brand);
        border: 2px solid var(--theme-color-brand);
    }

    .nav-function-minify:not(.nav-function-top) .page-sidebar .primary-nav .nav-menu li.active.open > a:before {
        color: var(--theme-color-brand);
    }

    .badge.badge-icon {
        background-color: var(--theme-color-brand);
    }

    .dropdown-menu .dropdown-multilevel:hover > .dropdown-item:not(.disabled) {
        color: var(--theme-color-brand);
    }

    .pagination .page-link:hover {
        background-color: var(--theme-color-brand);
    }

    .panel-tag {
        border-left: 3px solid var(--theme-color-brand);
    }

    .panel-notice {
        border: 2px solid var(--theme-color-brand);
    }

    .menu-item:hover,
    label.menu-open-button:hover {
        background: var(--theme-color-brand);
    }

    .nav-tabs .nav-link.active,
    .nav-tabs .nav-item.show .nav-link {
        color: var(--theme-color-brand);
    }

    .flex-1 > .row {
        background-color: var(--theme-color-brand);
    }

    .bg-trans-gradient {
        background: var(--theme-color-brand);
    }

    .form-content-editable[contenteditable='true']::-moz-selection {
        background: var(--theme-color-brand);
    }

    .form-content-editable[contenteditable='true']::selection {
        background: var(--theme-color-brand);
    }

    .form-content-editable[contenteditable='true']::-moz-selection {
        background: var(--theme-color-brand);
    }

    .form-control:focus ~ .input-group-prepend {
        background: var(--theme-color-brand);
    }

    .has-length .input-group-text {
        background-color: #fff;
    }

        .has-length .input-group-text:not([class^='bg-']):not([class*=' bg-']) {
            background-color: var(--theme-color-brand);
        }

    body:not(.mod-pace-custom) .pace .pace-progress {
        background: var(--theme-color-brand);
    }

    .tab-head .tab-button {
        border: solid 1px var(--theme-color-brand);
    }

    .tab-head .selected {
        background: var(--theme-color-brand) !important;
    }

    .dxpLite_Office365:not(.dxpLiteDisabled_Office365) .dxp-current.dxp-num:hover {
        background: var(--theme-color-brand);
    }

    .dxpLite_Office365 .dxp-current {
        background: var(--theme-color-brand) !important;
    }

    .dxpLite_Office365 .dxp-button:not(.dxp-disabledButton):hover {
        background: var(--theme-color-brand);
        background: var(--theme-color-brand);
    }

    .dxeButtonEditButtonHover_Office365,
    .dxeSpin IncButtonHover_Office365, .dxeSpinDecButtonHover_Office365,
    .dxeSpinLarge IncButtonHover_Office365,
    .dxeSpinLargeDecButtonHover_Office365 {
        color: white !important;
    }

    .dxeCalendarButtonPressed_Office365, .dxeButtonEditButtonPressed_Office365,
    .dxeSpin IncButtonPressed_Office365, .dxeSpinDecButtonPressed_Office365, .dxeSpinLargeIncButtonPressed_Office365, dxeSpinLargeDecButtonPressed_Office365, .dxeColorEditButton_Office365:active {
        color: white;
    }

    .mission-circle {
        background-color: var(--theme-color-brand);
    }

    .header-td {
        background-color: var(--theme-color-brand);
    }

    .tab-find > li.on,
    .tab-pagination > li.on {
        background-color: var(--theme-color-brand);
    }

    .row .logo_message {
        color: var(--theme-color-brand);
    }

    .table-dark.table-hover tbody tr:hover {
        background-color: var(--theme-color-brand);
    }

    .form-control:focus,
    .form-control-search:focus {
        border-color: var(--theme-color-brand);
    }

    .necessary {
        color: var(--theme-color-brand);
    }

    .was-validated .form-control:valid,
    .form-control.is-valid {
        border-color: var(--theme-color-brand);
    }

        .was-validated .form-control:valid:focus,
        .form-control.is-valid:focus {
            border-color: var(--theme-color-brand);
        }

    .was-validated .custom-select:valid:focus,
    .custom-select.is-valid:focus {
        border-color: var(--theme-color-brand);
    }

    .was-validated .form-check-input:valid ~ .form-check-label,
    .form-check-input.is-valid ~ .form-check-label {
        color: var(--theme-color-brand);
    }

    .MobileAlert h5 {
        color: var(--theme-color-brand);
    }

    .MobileAlert p {
        font-size: var(--FontS03);
    }

    .handsontable span.colHeader {
       font-size: var(--FontS04)!important;
       color: var(--theme-color-text-table-header);
    }

    .handsontable tbody th.ht__highlight, .handsontable thead th.ht__highlight {
        background-color: var(--theme-color-bg-subtle) !important;
    }

    .page__numbers {
    font-size: var(--FontS03);
    }

    .page__numbers.active {
        border: 1px solid var(--theme-color-brand);
        color: var(--theme-color-brand);
    }

    .searchTimeLong {
        border-bottom: 4px solid var(--theme-color-bg-table-header);
    }
    .searchTimeLong p {
        font-size: var(--FontS07);
    }

    .searchTimeLong p.detail {
        color: var(--theme-color-text-link);
        font-size: var(--FontS07);
        margin: 20px 0 30px 0;
    }

    .panel-notice h3 {
        color: var(--theme-color-text-link);
    }

    .devDownLoad {
        background: var(--theme-color-brand);
        color: white !important;
    }

    .on-progress {
        background: var(--theme-color-brand);
        font-size: var(--FontS03);
    }

    .done-pregress {
        color: var(--theme-color-brand);
    }

    .modal .highlight, span.highlight, p.highlight, h5.highlight, th.highlight, td.highlight {
        color: var(--theme-color-brand) !important;
    }

    .statusDetailContent .statusDetailList span {
        font-size: var(--FontS03);
    }
    .statusDetailContent .statusDetailList span.statusDetailDate {
        color: var(--theme-color-brand);
    }

    .dlvProgressBefore {
        background: #dbdbdb;
    }

    .dlvProgressAfter {
        background: var(--theme-color-brand);
    }

    .dlvSearchTextArea {
      font-size: var(--FontS05);
      color: var(--theme-color-text-primary);
    }

    .dropdown.active {
        background: var(--theme-color-bg-active);
    }

    .content .con_wrap header .header_right ul.snb_list > li .gnb_box3 ul.gnb_list li a p {
        color: black;
    }

    .content .login header .header_right ul.snb_list > li > button:hover,
    .content .login header .header_right ul.snb_list > li > a:hover {
        background: var(--theme-color-action-primary-hover);
    }

    .content .con_wrap.login header .header_right ul.snb_list > li.lang > button i, .content .con_wrap.login header .header_right ul.snb_list > li.lang > a i {
        filter: brightness(10);
    }

    .dropdown .dropdown-menu a:hover {
        background: var(--theme-color-action-secondary-hover);
    }

    .spinner-border {
        color: var(--theme-color-indicator-loading);
    }

    .content .popup .popup-content ul.default_list {
        background: var(--theme-color-bg-info-subtle);
    }                

    .content .con_wrap .con .con_box ul.inquiry_info li a {
        font-size: var(--FontL07);
        background-color: var(--theme-color-bg-subtle);  
    }

    .content .con_wrap .con .con_box ul.inquiry_info li a.active {
        font-size: var(--FontL07);
        background-color: var(--theme-color-bg-selected);  
    }

    .content .con_wrap header .header_left .notice .swiper-container .swiper-wrapper .swiper-slide a {
       font-size: var(--FontS06);
    }

    .explain_pop {
        font-size: var(--FontS06);
    }

    .content .con_wrap .con .con_box ul.inquiry_info.infoSum li a p {
        font-size: var(--FontS05);
    }
    
    .content .con_wrap .con .con_box ul.inquiry_info.infoSum li a .num {
        font-size: var(--FontM08);
    }

    #changeShippingTypeP #changeShippingTypeC #changeShipService div:hover, #changeInvoiceStatusTypeP #changeInvoiceStatusTypeC #changeInvoiceStatus div:hover {
        background: var(--theme-color-action-secondary-hover);
        color: white;
    }

    #otherTransDataP #otherTransDataC #otherTransData div:hover {
        background: var(--theme-color-action-secondary-hover);
        color: white;
    }

    #changeShippingTypeP:hover, #changeInvoiceStatusTypeP:hover {
        background: var(--theme-color-action-secondary-hover);
        color: white;
    }

    #otherTransDataP:hover {
        background: var(--theme-color-action-secondary-hover);
        color: white;
    }

.DropDept2TypeP:hover:hover {
        background: var(--theme-color-action-secondary-hover);
        color: white;
    }

        .DropDept2TypeP.active .DropDept2TypeC .DropDept2 div:hover {
        background: var(--theme-color-action-secondary-hover);
        color: white;
    }

/* Rules present in the newest generated domain files but not in the C# template. */
.input_wrap.search select {
    background-color: var(--theme-color-bg-field-subtle);
    font-size: var(--FontS05);
}

.content .con_wrap .con .con_box .box_head_sub h5 {
    font-size: var(--FontS08);
}

.content .con_wrap .con .con_box .box_head_sub h5 span {
    color: var(--theme-color-text-secondary);
    font-size: var(--FontS05);
}

.add-tab .file-drop-wrap {
    background-color: var(--theme-color-bg-dropzone);
    background-image: var(--theme-image-border-dropzone);
}

.add-tab .file-drop-wrap:hover {
    background-color: var(--theme-color-bg-dropzone-hover);
    background-image: var(--theme-image-border-dropzone-hover);
}

.add-tab .file-drop-icon {
    border: 1px solid var(--theme-color-border-subtle);
    font-size: var(--theme-size-dropzone-icon);
}

.add-tab .file-drop-title {
    font-size: var(--theme-size-dropzone-title);
}

.add-tab .file-drop-complete {
    font-size: var(--theme-size-dropzone-complete);
}

.btn.primary {
    background: var(--theme-color-action-primary);
    border-color: var(--theme-color-action-primary);
}

.btn.primary:hover,
.btn.primary.pressed {
    background: var(--theme-color-action-primary-hover);
    border-color: var(--theme-color-action-primary-hover);
}

.btn.secondary {
    border-color: var(--theme-color-action-primary);
    color: var(--theme-color-action-primary);
}

.btn.secondary:hover,
.btn.secondary.pressed,
.btn.tertiary:hover,
.btn.tertiary.pressed {
    background: var(--theme-color-action-primary-hover);
    border-color: var(--theme-color-action-primary-hover);
}

.common.dropdown .dropdown-menu .dropdown-item:hover,
.common.dropdown .dropdown-menu .dropdown-bottom .dropdown-item:hover {
    background: var(--theme-color-brand);
}
