/* LOADER STYLE */
#content_loading {display: block; position: absolute; z-index: 9999; top: 0; left: 0; width: 100%; height: 100%; top: 0; left: 0; background: rgba(255,255,255,0.55) url("../images/loading/loading-ring-grey.gif") no-repeat center center; background-size: 46px;}

/* LOADER PROGRESS */
#page_loading {display: none; position: fixed; z-index: 9999; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,0.7);}
#page_loading .progress_wrap {position: relative; top: 50%; left: 50%; float: left; width: 500px; padding: 0 20px; background: linear-gradient(to top, rgba(233, 243, 253, 1) 0%, rgba(255, 255, 255, 1) 100%); box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; transition: 0.25s; transform: translate(-50%,-50%);}
#page_loading .p_header {position: relative; float: left; width: 100%; padding: 15px 0;}
#page_loading .p_header .l_header {position: relative; float: left; font: 500 18px/22px 'Noto Sans SC', sans-serif; color: #001847;}
#page_loading .p_header .l_header em {font-weight: 700; color: #0f5ef7;}
#page_loading .p_header .l_header small {font: 500 10px/14px 'Noto Sans SC', sans-serif; color: #6D6F6F;}
#page_loading .p_header .r_header {position: relative; float: right;}
#page_loading .p_header .r_header img {height: 40px;}
#page_loading .p_content {position: relative; float: left; width: 100%; margin: 5px 0 20px 0; padding: 15px 0;}
#page_loading .p_content .p_list {position: relative; float: left; width: 100%;}
#page_loading .p_content .p_item {position: relative; float: left; width: 100%; margin-bottom: 15px;}
#page_loading .p_content .l_img {float: left; width: 25%; height: 30px; padding-right: 10px;}
#page_loading .p_content .l_img img {float: right; margin: 5px 0; height: 20px; background-color: #0f5ef7;}
#page_loading .p_content .l_img .img_red {background-color: #e12925;}
#page_loading .p_content .l_img .img_yellow {background-color: #fbbc2f;}
#page_loading .p_content .r_txt {position: relative; float: left; width: 75%; padding-left: 10px; font: 700 12px/16px 'Noto Sans SC', sans-serif; color: #001847;}
#page_loading .p_content .r_txt small {float: left; width: 100%; font: 500 10px/14px 'Noto Sans SC', sans-serif; color: #6D6F6F;}
#page_loading .p_panel {display: none; position: relative; float: left; width: 100%; padding: 15px 0;}
#page_loading .p_panel a.err_close {position: absolute; left: 0; bottom: 15px; width: 215px; height: 30px; background: #e7e9e9; font: 400 16px/30px 'Noto Sans SC', sans-serif; color: #161c28; text-align: center;}
#page_loading .p_panel a.err_close:hover {background-color: #b4b6bc;}
#page_loading .p_panel a.err_view {position: absolute; right: 0; bottom: 15px; width: 215px; height: 30px; background: #7fa8f8; font: 400 16px/30px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
#page_loading .p_panel a.err_view:hover {background-color: #3c78f2;}

/*** SWITCH BUTTON ***/
.switch {position: relative; display: inline-block; width: 38px; height: 20px;}
.switch input {opacity: 0; width: 0; height: 0;}
.switch .slider {position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #bcbcbc; -webkit-transition: .4s; transition: .4s;}
.switch .slider:before {position: absolute; content: ""; height: 14px; width: 14px; left: 3px; bottom: 3px; background-color: white; -webkit-transition: .4s; transition: .4s;}
.switch input:checked + .slider {background-color: #0f5ef7;}
.switch input:focus + .slider {box-shadow: 0 0 1px #0f5ef7;}
.switch input:checked + .slider:before {-webkit-transform: translateX(18px); -ms-transform: translateX(18px); transform: translateX(18px);}
/* Rounded sliders */
.switch .slider.round {border-radius: 34px;}
.switch .slider.round:before {border-radius: 50%;}
.switch .slider_txt {position: absolute; width: max-content; margin: 0 0 0 46px; font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #bcbcbc;}
.switch input:checked ~ .slider_txt {color: #0f5ef7;}

/*** CHECK BUTTON V2 ***/
.cart_card .card_panel {position: absolute; top: -10px; right: -10px; padding: 10px; background: rgba(255,255,255,0.3);}
.cart_card .card_panel a.btn_del {position: relative !important; float: right;}
.cart_card .card_panel a.btn_edit {position: relative !important; float: right; right: 10px !important;}

span.v2_checklist { position: relative; z-index: 2; float: right; top: 2px !important; right: 0px !important; width: 110px; margin: 0; }
span.v2_r_checklist {float: left;}
span.v2_checklist .switch .slider {background-color: #ABABAB;}
span.v2_checklist .switch .slider_txt {color: #ABABAB;}
span.v2_checklist .switch input:checked + .slider {background-color: #1C9997;}
span.v2_checklist .switch input:focus + .slider {box-shadow: 0 0 1px #1C9997;}
span.v2_checklist .switch input:checked ~ .slider_txt {color: #1C9997;}

/*** CHECK BUTTON SETTINGS V2 ***/
span.v2_settings { position: relative; z-index: 2; float: left; top: 0px !important; left: 0px !important; width: 45px; margin: 0; }
span.v2_r_settings {float: left;}
span.v2_settings .switch .slider {background-color: #ABABAB;}
span.v2_settings .switch .slider_txt {color: #ABABAB;}
span.v2_settings .switch input:checked + .slider {background-color: #1C9997;}
span.v2_settings .switch input:focus + .slider {box-shadow: 0 0 1px #1C9997;}
span.v2_settings .switch input:checked ~ .slider_txt {color: #1C9997;}
span.v2_settings .switch .slider_txt {margin: 0 0 0 12px;}

/*** PAYMENT ITEMS ***/
.s_item .f_pay_bg {position: relative; z-index: 2; float: left; width: 100%; padding: 20px; background: #1b1b1b; box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px;}
.s_item .f_bg_checked { background: rgb(13,29,26); background: linear-gradient(0deg, rgba(13,29,26,1) 0%, rgba(20,47,42,1) 100%); }
.s_item .f_pay_bg .f_pay_key {position: absolute; top: 0; left: 0; padding: 10px 20px; background: rgba(255,255,255,0.3); font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #afacb0;}
.s_item .f_pay_bg .f_pay_top {position: relative; float: left; width: 100%; margin: 40px 0 100px 0;}
.s_item .f_pay_bg .f_pay_top p {position: relative; float: left; width: 100%; font: 500 12px/16px 'Noto Sans SC', sans-serif; color: #fff;}
.s_item .f_pay_bg .f_pay_mid {position: relative; float: left; width: 100%; margin: 0 0 40px 0;}
.s_item .f_pay_bg .f_pay_mid span {position: relative; float: left; width: 100%;}
.s_item .f_pay_bg .f_pay_mid span.p_refund {font: 500 10px/14px 'Noto Sans SC', sans-serif; color: #b3344f;}
.s_item .f_pay_bg .f_pay_mid span.p_amount {font: 700 34px/38px 'Noto Sans SC', sans-serif; color: #fff;}
.s_item .f_pay_bg .f_pay_mid span.p_date {font: 500 10px/14px 'Noto Sans SC', sans-serif; color: #cdcdcd;}
.s_item .f_pay_bg .f_pay_panel {position: relative; float: left; width: 100%;}
.s_item .f_pay_bg .f_pay_panel a.btn_del {position: relative; float: left; width: 20px; height: 20px; margin: 0 10px 0 0; background-color: #6D6F6F; padding: 3px;}
.s_item .f_pay_bg .f_pay_panel a.btn_del:hover {background-color: #323333;}
.s_item .f_pay_bg .f_pay_panel a.btn_del img {width: 100%;}
.s_item .f_pay_bg .f_pay_panel a.btn_edit {position: relative; float: left; width: 20px; height: 20px; margin: 0 10px 0 0; background-color: #3975f1; padding: 3px;}
.s_item .f_pay_bg .f_pay_panel a.btn_edit:hover {background-color: #2643f7;}
.s_item .f_pay_bg .f_pay_panel a.btn_edit img {width: 100%;}
.s_item .f_pay_bg .f_pay_panel span.f_pay_checked {position: absolute; top: 0; right: 0; font: 500 9px/11px 'Noto Sans SC', sans-serif; color: #fff; text-align: right;}
.s_item .f_pay_bg .f_pay_ico {position: absolute; width: 50%; top: -5px; right: -5px; transform: rotate(-35deg);}
.s_item .f_pay_bg .f_pay_ico img {width: 100%;}

.s_item .f_pay_remark {position: relative; z-index: 1; float: left; width: 90%; margin: -10px 0 0 0; padding: 20px 20px 10px 20px; background: #e3e3e3;}
.s_item .f_pay_remark span.f_pay_content {position: relative; float: left; width: 100%; font: 500 10px/14px 'Noto Sans SC', sans-serif; color: #1b1b1b;}
.s_item .f_pay_remark span.f_pay_content small {font: 700 8px/12px 'Noto Sans SC', sans-serif; color: #6D6F6F;}
/* Colouring */
.grey {color: #878cac;}

.new_global_content {padding-left: 60px !important;}
.new_app_header {box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.new_app_header a.a_logo {position: relative; float: left; width: 84px; height: 40px; padding: 10px 15px; border-right: 1px solid #e3e3e3; background: url("../images/logo_1000x479.png") no-repeat center center; background-size: 74px auto;}
.new_app_header h2.a_title {position: relative; float: left; padding: 10px 15px; font: 700 22px/40px 'Noto Sans SC', sans-serif; color: #262626;}
.new_app_header ul.user_list li {margin-left: 15px !important;}
.new_app_header ul.user_list li:last-child {padding-left: 15px; border-left: 1px solid #e3e3e3;}
.new_app_header ul.user_list a.m_item {font: 500 11px/18px 'Noto Sans SC', sans-serif !important; color: #262626 !important;}
.new_app_header ul.user_list a.m_item small {font: 500 9px/12px 'Noto Sans SC', sans-serif; color: #777;}
.new_app_header ul.user_list a.m_setting img {height: 30px;}

.new_app_header ul.user_list li.in_selection {text-align: center;}
.new_app_header ul.user_list .col_selection {position: relative; float: left;}
.new_app_header ul.user_list .col_selection span.in_title {float: left; width: 100%; margin: 15px 0 0 0; font: 500 11px/18px 'Noto Sans SC', sans-serif; color: #262626;}
.new_app_header ul.user_list .col_selection span.in_divider {float: left; margin: 25px 0 0 0; font: 500 11px/18px 'Noto Sans SC', sans-serif; color: #262626;}
.new_app_header ul.user_list .col_selection input[type=date] {border: none;}

.new_app_header ul.user_list .selection {position: relative; float: left; min-width: 150px; margin: 15px 0 0 0;}
.new_app_header ul.user_list .selection .opt_btn {position: relative; float: left; width: auto; min-width: 150px; height: 28px; border-radius: 4px; background: rgba(235,238,247,1) url(../images/icon/ico_down_b.png) 98% center no-repeat; background-size: 12px; border: 1px solid rgba(235,238,247,1); padding: 0 10px; font: 500 12px/26px 'Noto Sans SC', sans-serif; color: #1a1a1a; text-align: left; overflow: hidden !important;}
.new_app_header ul.user_list .selection ul.opt_items {border-color: rgba(235,238,247,1);}
.new_app_header ul.user_list .selection ul.opt_items li {margin: 0px !important;}
.new_app_header ul.user_list .selection ul.opt_items li:last-child {border: none; padding: 0px;}

.new_app_header .search_wrap {position: relative; float: left; width: auto; height: 40px; margin: 10px 0 0 15px; padding-right: 5px;}
.new_app_header .search_wrap a.btn_search {position: relative; float: left; width: 20px; height: 20px; margin: 10px 0; background: url("../images/icon/ico_search.png") 5px center no-repeat; background-size: 20px;}
.new_app_header .search_wrap a.btn_clear {position: relative; float: right; width: 20px; height: 20px; margin: 10px 0; background: url("../images/icon/ico_clear1.png") right center no-repeat; background-size: 20px;}
.new_app_header .search_wrap input[name=keyword] {float: left; width: 200px; margin-top: 5px; padding: 5px 15px 5px 10px; background: none; border: none; font: 500 12px/20px 'Noto Sans SC', sans-serif; color: #262626;}
.new_app_header .search_wrap input[name=keyword]::-webkit-input-placeholder { /* Edge */ color: #b3bac8;}
.new_app_header .search_wrap input[name=keyword]:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #b3bac8;}
.new_app_header .search_wrap input[name=keyword]::placeholder {color: #b3bac8;}

#global_footer { display: none; position: fixed; z-index: 30; left: 0; bottom: 0; width: 100%; height: 75px; background: transparent;}
#global_footer .new_app_footer {position: relative; float: left; width: 100%; height: 75px; background: transparent;}
#global_footer .new_app_footer span.f_btn {position: absolute; z-index: 2; top: -5px; left: 50%; width: 50px; height: 50px; transform: translateX(-50%);}
#global_footer .new_app_footer span.f_btn a.f_add {position: relative; float: left; width: 100%; height: 100%; background: #0f5ef7; border: 5px solid rgba(243,245,249,1); font: 400 30px/45px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
#global_footer .new_app_footer span.f_btn a.f_add {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0f5ef7+0,627eea+100 */
    background: #0f5ef7; /* Old browsers */
    background: -moz-linear-gradient(-45deg,  #0f5ef7 0%, #627eea 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  #0f5ef7 0%,#627eea 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  #0f5ef7 0%,#627eea 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0f5ef7', endColorstr='#627eea',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#global_footer .new_app_footer ul.f_menu {position: relative; z-index: 1; float: left; width: 100%; height: 50px; margin: 25px 0 0 0; -webkit-box-shadow: 0px -2px 6px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px -2px 6px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px -2px 6px 0px rgba(0, 0, 0, 0.1); overflow: hidden;}
#global_footer .new_app_footer ul.f_menu {-webkit-border-top-left-radius: 25px; -webkit-border-top-right-radius: 25px; -moz-border-radius-topleft: 25px; -moz-border-radius-topright: 25px; border-top-left-radius: 25px; border-top-right-radius: 25px;}
#global_footer .new_app_footer ul.f_menu li {position: relative; float: left; width: 20%; height: 100%; background: #fff;}
#global_footer .new_app_footer ul.f_menu a.f_item {position: relative; float: left; width: 100%; height: 100%; padding: 0;}
#global_footer .new_app_footer ul.f_menu a.f_dashboard { background: url("../images/icon/ico_dashboard.png") no-repeat center; background-size: 30%; }
#global_footer .new_app_footer ul.f_menu a.f_inventory { background: url("../images/icon/ico_inventory.png") no-repeat center; background-size: 30%; }
#global_footer .new_app_footer ul.f_menu a.f_customers { background: url("../images/icon/ico_customers.png") no-repeat center; background-size: 30%; }
#global_footer .new_app_footer ul.f_menu a.f_settings { background: url("../images/icon/ico_settings.png") no-repeat center; background-size: 30%; }

.new_frame_header_mb {display: none;}
.new_main_frame {background:rgba(243,245,249,1);}
.new_frame_header {position: relative; z-index: 2; top: 0; left: 0; width: 100%; height: 80px; padding: 0;}
.new_frame_header .header_col_left {position: relative; float: left; width: 30%; height: 80px; padding: 0 0 0 20px;}
.new_frame_header .header_col_left h3 {float: left; font: 500 22px/75px 'Noto Sans SC', sans-serif; color: #262626;}
.new_frame_header .header_col_left .col_left_items {position: relative; float: left; height: 24px; margin: 30px 0 0 30px;}
.new_frame_header .header_col_right {position: relative; float: right; width: 70%; height: 80px; padding: 0 20px 0 0;}
.new_frame_header .header_col_right a.btn_new {position: relative; float: right; width: max-content; margin: 22px 0 0 10px; padding: 6px 10px 8px 30px; background: #0f5ef7; box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px; font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #f2f5fd; letter-spacing: .1em; text-align: center; transition: all 0.7s;}
.new_frame_header .header_col_right a.btn_new:hover {color: #fff;}
.new_frame_header .header_col_right a.btn_new span.t_img {position: absolute; top: 5px; left: 5px; width: 20px; height: 20px; padding: 2px; overflow: hidden; transition: all 0.7s;}
.new_frame_header .header_col_right a.btn_new span.t_img img {width: 100%;}
.new_frame_header .header_col_right a.btn_new:hover span.t_img { transform: rotate(360deg); }
.new_frame_header .header_col_right a.btn_delete {background: #e12925 !important;}
.new_frame_header .header_col_right a.btn_refresh {background: #f7941d !important;}
.new_frame_header .header_col_right a.btn_report {background: #1a1649 !important;}
.new_frame_header .header_col_right a.btn_upload {background: #f7941d !important;}

.new_frame_middle {position: relative; z-index: 2; float: left; width: 100%; padding: 0 20px;}
.new_frame_middle .middle_wrap {position: relative; float: left; width: 100%; background-color: white; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.new_frame_middle .middle_wrap .middle_top_wrap {position: relative; float: left; width: 100%; border-bottom: 1px solid #e3e3e3;}
.new_frame_middle .middle_wrap .middle_btm_wrap {position: relative; float: left; width: 100%;}
.new_frame_middle .middle_wrap .middle_footer_wrap {position: relative; float: left; width: 100%; background: rgba(235, 238, 247, 0.9);}

.new_frame_middle .middle_wrap .category_wrap {position: relative; float: left; margin-left: 20px;}
.new_frame_middle .middle_wrap .category_wrap ul.category_list {position: relative; float: left; margin: 0;}
.new_frame_middle .middle_wrap .category_wrap ul.category_list li {position: relative; float: left; margin: 0 20px 0 0;}
.new_frame_middle .middle_wrap .category_wrap ul.category_list li a.m_item {position: relative; float: left; font: 700 10px/40px 'Noto Sans SC', sans-serif; color: #262626;}
.new_frame_middle .middle_wrap .category_wrap ul.category_list li a.m_item span.status_dot {position: relative; float: left; width: 8px; height: 8px; margin: 16px 5px 0 0;}
.new_frame_middle .middle_wrap .category_wrap ul.category_list li a.m_item em {font: 700 10px/40px 'Noto Sans SC', sans-serif; color: #777;}
.new_frame_middle .middle_wrap .category_wrap ul.category_list li span.m_item_line {position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background-color: white; transition: background-color 0.3s;}
.new_frame_middle .middle_wrap .category_wrap ul.category_list li span.m_item_line.active {background-color: #0f5ef7;}
.new_frame_middle .middle_wrap .category_wrap ul.category_list li:hover span.m_item_line {background-color: #0f5ef7;}

.new_frame_middle .middle_wrap .nav_wrap {position: relative; float: right; right: 0; margin-right: 20px;}
.new_frame_middle .middle_wrap .nav_wrap span.title_nav {float: left; font: 500 10px/40px 'Noto Sans SC', sans-serif; color: #666;}
.new_frame_middle .middle_wrap .nav_wrap ul.header_nav {position: relative; float: left; margin: 10px 0 0 10px;}
.new_frame_middle .middle_wrap .nav_wrap ul.header_nav a.nav {position: relative; float: left; width: 20px; height: 20px; margin-left: 10px;}
.new_frame_middle .middle_wrap .nav_wrap ul.header_nav a.no_prev {background: #dbdfe5 url("../images/icon/ico_prev_g.png") center no-repeat; background-size: 16px;}
.new_frame_middle .middle_wrap .nav_wrap ul.header_nav a.no_next {background: #dbdfe5 url("../images/icon/ico_next_g.png") center no-repeat; background-size: 16px;}
.new_frame_middle .middle_wrap .nav_wrap ul.header_nav a.prev {background: #7987a2 url("../images/icon/ico_prev_w.png") center no-repeat; background-size: 16px;}
.new_frame_middle .middle_wrap .nav_wrap ul.header_nav a.next {background: #7987a2 url("../images/icon/ico_next_w.png") center no-repeat; background-size: 16px;}
.new_frame_middle .middle_wrap .nav_wrap ul.header_nav a.prev:hover {background-color: #0f5ef7;}
.new_frame_middle .middle_wrap .nav_wrap ul.header_nav a.next:hover {background-color: #0f5ef7;}
.new_frame_middle .middle_wrap .nav_wrap .page_list {width: auto !important; min-width: 80px; margin-left: 10px;}
.new_frame_middle .middle_wrap .nav_wrap .page_list .opt_btn {margin: 6px 0; padding: 0 10%; background: url(../images/icon/ico_down_sb.png) 95% center no-repeat; background-size: 12px; border: none; color: #001847;}
.new_frame_middle .middle_wrap .nav_wrap .page_list .opt_menu {top: 40px;}
.new_frame_middle .middle_wrap .nav_wrap .page_list .opt_items {background-color: rgba(235,238,247,0.9); border-color: rgba(235,238,247,0.9);}
.new_frame_middle .middle_wrap .nav_wrap .page_list .opt_items a.s_item {width: 100%; padding: 0 10%; color: #001847;}
.new_frame_middle .middle_wrap .nav_wrap .page_list .opt_items a.s_item:hover {color: #fff;}

.new_frame_middle .middle_wrap .filter_wrap {position: relative; float: left; left: 0; margin-left: 20px; padding: 20px 0;}
.new_frame_middle .middle_wrap .filter_wrap .date_wrap {position: relative; float: left; margin-right: 10px; padding: 7px 10px; border: 1px solid #e3e3e3;}
.new_frame_middle .middle_wrap .filter_wrap .date_wrap .date_title {float: left; margin-right: 5px; font: 500 10px/26px 'Noto Sans SC', sans-serif; color: #262626;}
.new_frame_middle .middle_wrap .filter_wrap .date_wrap .date_opt {position: relative; float: left;}
.new_frame_middle .middle_wrap .filter_wrap .date_wrap .date_opt .opt_sep { float: left; margin: 0 5px; font: 500 10px/26px 'Noto Sans SC', sans-serif; color: #262626;}
.new_frame_middle .middle_wrap .filter_wrap .date_wrap .date_opt input[type=date] {float: left; margin-top: 4px; border: none;}
.new_frame_middle .middle_wrap .filter_wrap .date_wrap .date_opt a.btn_go {position: relative; float: left; width: 20px; height: 20px; margin: 3px 0 0 10px; border: 1px solid #0f5ef7; background: #0f5ef7 url(../images/icon/ico_next_w.png) center no-repeat; background-size: 16px;}
.new_frame_middle .middle_wrap .filter_wrap .date_wrap .date_opt a.btn_go:hover {background-color: #0c4dc9;}

.new_frame_middle .middle_wrap .filter_wrap .filter_list {width: auto !important; min-width: 150px; border: 1px solid #e3e3e3;}
.new_frame_middle .middle_wrap .filter_wrap .filter_list .opt_btn {margin: 6px 0; padding: 0 10%; background: url(../images/icon/ico_down_sb.png) 95% center no-repeat; background-size: 12px; border: none; font: 500 10px/26px 'Noto Sans SC', sans-serif; color: #262626;}
.new_frame_middle .middle_wrap .filter_wrap .filter_list .opt_menu {top: 40px;}
.new_frame_middle .middle_wrap .filter_wrap .filter_list .opt_items {background-color: rgba(235,238,247,0.9); border-color: rgba(235,238,247,0.9);}
.new_frame_middle .middle_wrap .filter_wrap .filter_list .opt_items a.s_item {width: 100%; padding: 0 10%; font-size: 10px; color: #001847;}
.new_frame_middle .middle_wrap .filter_wrap .filter_list .opt_items a.s_item:hover {color: #fff;}

.new_frame_middle .middle_wrap .filter_wrap ul.filtered_sel {position: relative; float: left; margin: 5px 0 0 0;}
.new_frame_middle .middle_wrap .filter_wrap ul.filtered_sel li.s_item {position: relative; float: left; margin: 0 0 0 10px; font: 700 8px/30px 'Noto Sans SC', sans-serif; color: #262626;}
.new_frame_middle .middle_wrap .filter_wrap ul.filtered_sel li.s_item a.clear_filtered {position: relative; float: left; width: 30px; height: 30px; background: url(../images/icon/ico_del.png) center no-repeat; background-size: 24px;}
.new_frame_middle .middle_wrap .filter_wrap ul.filtered_sel li.s_item a.clear_filtered:hover {background-color:#ebeef7;}
.new_frame_middle .middle_wrap .filter_wrap ul.filtered_sel li.s_item div.filtered_item {position: relative; float: left; padding: 0 10px; background-color:#ebeef7;}
.new_frame_middle .middle_wrap .filter_wrap ul.filtered_sel li.s_item div.filtered_item span.filtered_name {float: left; padding: 0 20px; background: url(../images/icon/ico_filter.png) left center no-repeat; background-size: 12px; font: 700 8px/30px 'Noto Sans SC', sans-serif; color: #262626; text-align: center;}
.new_frame_middle .middle_wrap .filter_wrap ul.filtered_sel li.s_item div.filtered_item a.del_filtered {position: absolute; right: 0; width: 30px; height: 30px; background: url(../images/icon/ico_cross.png) center no-repeat; background-size: 12px;}

.new_frame_middle .middle_wrap .sort_wrap {position: relative; float: right; right: 0; margin-right: 20px; padding: 20px 0;}
.new_frame_middle .middle_wrap .sort_wrap .sort_list {width: auto !important; min-width: 150px; border: 1px solid #e3e3e3;}
.new_frame_middle .middle_wrap .sort_wrap .sort_list .opt_btn {margin: 6px 0; padding: 0 10%; background: url(../images/icon/ico_down_sb.png) 95% center no-repeat; background-size: 12px; border: none; font: 500 10px/26px 'Noto Sans SC', sans-serif; color: #262626;}
.new_frame_middle .middle_wrap .sort_wrap .sort_list .opt_menu {top: 40px;}
.new_frame_middle .middle_wrap .sort_wrap .sort_list .opt_items {background-color: rgba(235,238,247,0.9); border-color: rgba(235,238,247,0.9);}
.new_frame_middle .middle_wrap .sort_wrap .sort_list .opt_items a.s_item {width: 100%; padding: 0 10%; font-size: 10px; color: #001847;}
.new_frame_middle .middle_wrap .sort_wrap .sort_list .opt_items a.s_item:hover {color: #fff;}

.new_frame_middle .middle_wrap .filter_sales_wrap ul.filter_sales {position: relative; float: left; margin: 10px 0 10px 20px;}
.new_frame_middle .middle_wrap .filter_sales_wrap ul.filter_sales li.s_item {position: relative; float: left; margin: 0 10px 0 0;}
.new_frame_middle .middle_wrap .filter_sales_wrap ul.filter_sales li.s_item a.m_full {background: url(../images/icon/ico_folder_with_item.png) 10px center no-repeat;}
.new_frame_middle .middle_wrap .filter_sales_wrap ul.filter_sales li.s_item a.m_empty {background: url(../images/icon/ico_folder_no_item.png) 10px center no-repeat;}
.new_frame_middle .middle_wrap .filter_sales_wrap ul.filter_sales li.s_item a.m_item {position: relative; float: left; padding: 5px 10px 5px 45px; background-size: 24px; font: 700 10px/16px 'Noto Sans SC', sans-serif; color: #262626; transition: background-color 0.3s;}
.new_frame_middle .middle_wrap .filter_sales_wrap ul.filter_sales li.s_item a.m_item:hover {background-color:rgba(0, 3, 92, 0.24);}
.new_frame_middle .middle_wrap .filter_sales_wrap ul.filter_sales li.s_item a.m_item strong {float: left;}
.new_frame_middle .middle_wrap .filter_sales_wrap ul.filter_sales li.s_item a.m_item small {float: left; font: 700 8px/8px 'Noto Sans SC', sans-serif; color: #777;}
.new_frame_middle .middle_wrap .filter_sales_wrap ul.filter_sales li.s_item a.m_item.active {background-color:rgba(0, 3, 92, 0.12);}

/*** CUSTOM ***/
.new_frame_middle .middle_btm_wrap .filter_sales_wrap ul.filter_sales {margin: 25px 0 10px 20px;}

/*** LANDING ***/
.new_frame_header .header_landing_left { padding: 0 0 0 80px; }
.new_frame_header .header_landing_left .dash_img { position: absolute; top: 15px; left: 20px; width: 50px; }
.new_frame_header .header_landing_left h3 {float: left; margin-top: 15px; font: 500 22px/30px 'Noto Sans SC', sans-serif; color: #262626;}
.new_frame_header .header_landing_left h3 small {font: 500 14px/20px 'Noto Sans SC', sans-serif; color: #777;}
.new_frame_header .header_landing_right {text-align: right; font: 500 10px/80px 'Noto Sans SC', sans-serif; color: #777;}

.new_frame_middle .landing_top_wrap {position: relative; float: left; width: 100%; height: auto; display: grid; grid-gap: 20px; margin: 0 0 40px 0; padding: 0;}
.grid-layout-landing {
    grid-template-columns: repeat(5, 1fr);
    align-items: flex-start;
}
.new_frame_middle .landing_stats {position: relative; float: left; width: 100%; padding: 20px; background-color: white; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; overflow: hidden;}
.new_frame_middle .landing_stats span.s_title {position: relative; float: left; width: 100%; font: 500 12px/20px 'Noto Sans SC', sans-serif; color: #27306a;}
.new_frame_middle .landing_stats span.t_title {position: relative; float: left; width: 100%; margin: 30px 0 0 0; font: 700 20px/40px 'Noto Sans SC', sans-serif; color: #878cac;}
.new_frame_middle .landing_stats span.t_title strong {font: 700 30px/40px 'Noto Sans SC', sans-serif; color: #1a2461;}
.new_frame_middle .landing_stats img.t_img {position: absolute; right: -10px; bottom: -10px; width: 72px;}

.new_frame_middle .landing_middle_wrap {position: relative; float: left; width: 100%; padding: 0 0 40px 0;}
.new_frame_middle .landing_middle_wrap .middle_landing_header {position: relative; float: left; width: 100%; margin: 0 0 20px 0;}
.new_frame_middle .landing_middle_wrap .middle_landing_header h3 {position: relative; font: 500 12px/20px 'Noto Sans SC', sans-serif; color: #262626;}
.new_frame_middle .landing_middle_wrap .middle_landing_header a.all_item {float: right; margin: 0; font: 500 12px/20px 'Noto Sans SC', sans-serif; }
.new_frame_middle .landing_middle_wrap .middle_landing_header .b_list {float: right; width: 200px;}
.new_frame_middle .landing_middle_wrap .middle_landing_header .opt_btn {background-color: rgba(235,238,247,0.9); border: 1px solid #cecef9; padding: 0 10px;}

.new_frame_middle .landing_middle_wrap .dash_items {position: relative; float: left; width: 100%;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_note {position: relative; float: left; width: 100%; height: 200px; margin-bottom: 15px; background-color: #fff; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; padding: 15px 20px;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_note_full {padding: 15px 20px;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_title {position: relative; float: left; width: 100%; margin-bottom: 10px; padding: 5px 0 5px 10px;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_title.warn_normal {border-left: 3px solid #2643f7;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_title.warn_yellow {border-left: 3px solid #f9812a;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_title.warn_red {border-left: 3px solid #f66257;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_title h4.s_title {float: left; width: 100%; margin: 0 0 10px 0; font: 500 20px/20px 'Noto Sans SC', sans-serif; color: #001847;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_title span.s_subtitle {position: relative; float: left; margin: 0 5px 0 0; padding: 4px 12px; background: rgba(235,238,247,0.9); font: 500 10px/10px 'Noto Sans SC', sans-serif; color:#27306a;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_note p.s_content {float: left; width: 100%; margin-bottom: 5px; font: 400 12px/20px 'Noto Sans SC', sans-serif;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_note span.s_checked {float: left; width: 100%; font: 400 10px/14px 'Noto Sans SC', sans-serif; color: #686868;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_note span.s_date {position: absolute; left: 20px; bottom: 20px; padding-left: 30px; background: url(../images/icon/ico_calendar.png) left center no-repeat; background-size: 24px; font: 500 10px/20px 'Noto Sans SC', sans-serif; color: #686868;}
.new_frame_middle .landing_middle_wrap .dash_items .dash_note a.s_btn {position: absolute; right: 20px; bottom: 20px; min-width: 50px; padding: 2px 20px; background: #2643f7; font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #e3e3e3; text-align: center; }
.new_frame_middle .landing_middle_wrap .dash_items .dash_note a.s_btn:hover {color: #fff;}

.new_frame_middle .landing_middle_wrap .bar_content_wrap {position: relative; float: left; width: 100%; background: #fff; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; padding: 20px 30px;}
.new_frame_middle .landing_middle_wrap ul.bar_panel {position: absolute; z-index: 20; top: 30px; right: 20px; background: rgba(235,238,247,0.9);}
.new_frame_middle .landing_middle_wrap ul.bar_panel li {position: relative; float: left;}
.new_frame_middle .landing_middle_wrap ul.bar_panel a.btn_menu {position: relative; float: left; padding: 5px 20px; font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #001847;}
.new_frame_middle .landing_middle_wrap ul.bar_panel a.btn_menu:hover {color: #ffb800;}
.new_frame_middle .landing_middle_wrap ul.bar_panel a.active {background: #2643f7; color: #fff;}

.new_frame_middle .landing_middle_wrap .bar_header {position: relative; float: left; width: 100%; margin: 0 0 30px 0;}
.new_frame_middle .landing_middle_wrap .bar_header .bar_header_menu {position: relative; float: left; width: 100%;}
.new_frame_middle .landing_middle_wrap .bar_header .bar_header_menu h3.b_title {position: relative; float: left; margin: 10px 0 0 0; padding-bottom: 15px; border-bottom: 3px solid #ffb800; font: 700 16px/26px 'Noto Sans SC', sans-serif; color: #001847;}
.new_frame_middle .landing_middle_wrap .bar_header .bar_header_val {position: relative; float: left; margin: 0 30px 0 0; border-top: 3px solid #fff; padding-top: 10px;}
.new_frame_middle .landing_middle_wrap .bar_header h4.s_bar_title {float: left; width: 100%; margin: 0; font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #777;}
.new_frame_middle .landing_middle_wrap .bar_header span.s_bar_val {float: left; width: 100%; margin: 0 0 10px 0; font: 500 20px/30px 'Noto Sans SC', sans-serif; color: #001847;}
.new_frame_middle .landing_middle_wrap .bar_header span.s_bar_val small {font-size: 12px;}

.new_frame_middle .landing_middle_wrap .bar_items {position: relative; float: left; width: 100%; height: 390px; background: #fff; padding: 20px 100px 70px 0;}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list {position: relative; z-index: 20; float: left; width: 100%; height: 100%; border-bottom: 1px solid rgba(0, 3, 92, 0.35);}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .s_bar_outer {position: relative; float: left; height: 100%;}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .s_bar_inner {position: absolute; z-index: 1; left: 0; bottom: 0; background: rgba(180, 184, 217, 0.8);}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .single_inner_bar {width: 90%;}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .dual_inner_bar {width: 45%;}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list li:nth-child(odd) .s_bar_inner {background: rgba(233, 236, 248, 0.8);}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .s_bar_date {position: absolute; z-index: 10; bottom: 25px; left: -55%; width: 200%; font: 400 8px/8px 'Noto Sans SC', sans-serif; text-align: center; transform: rotate(-90deg);}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .s_bar_date_val {color: #57647d;}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .s_bar_chargeback {position: absolute; z-index: 2; left: 0; bottom: 0; width: 90%; background: #ff365f;}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .single_chargeback_bar {width: 90%;}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .dual_chargeback_bar {left: 45%; width: 45%;}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .s_bar_val {position: absolute; z-index: 10; bottom: -40px; left: -50%; width: 200%; font: 400 8px/10px 'Noto Sans SC', sans-serif; color: #001847; text-align: center; transform: rotate(-90deg);}
.new_frame_middle .landing_middle_wrap .bar_items ul.bar_list .s_chargeback {color: #ff365f;}

.new_frame_middle .bar_pointer {position: absolute; z-index: 10; bottom: 0; left: 0; width: 100%; height: 100%;}
.new_frame_middle .bar_pointer ul.s_bar_point {position: absolute; top: 21px; right: 0; width: 100%; height: 100%;}
.new_frame_middle .bar_pointer ul.s_bar_point li {position: relative; float: right; width: 100%; height: 60px; border-bottom: 1px dashed #e3e3e3; font: 500 10px/20px 'Noto Sans SC', sans-serif; color: #001847; text-align: right;}
.new_frame_middle .bar_pointer ul.s_bar_point li:first-child {border-top: 1px dashed #e3e3e3;}
.new_frame_middle .bar_pointer ul.s_bar_point li:last-child {border-bottom: none;}

.new_frame_middle .landing_middle_wrap .bar_yesterday {margin: 10px 0 40px 0; padding: 50px 30px 50px 300px;}
.new_frame_middle .landing_middle_wrap .bar_yesterday {
    background: #112D60; /* Old browsers */
    background: -moz-linear-gradient(-45deg, #112D60 0%, #551138 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #112D60 0%,#551138 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, #112D60 0%,#551138 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#112D60', endColorstr='#551138',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.new_frame_middle .bar_yesterday img.ytd_img {position: absolute; left: 40px; bottom: -5px; height: 200px;}
.new_frame_middle .bar_yesterday ul.bar_s_items {position: absolute; z-index: 2; top: 50px; left: 0; float: left; width: 100%; padding: 0 0 0 300px;}
.new_frame_middle .bar_yesterday ul.bar_s_items li {position: relative; float: left; width: 20%;}
.new_frame_middle .bar_yesterday ul.bar_s_items li:first-child {width: 100%; margin: 0 0 30px 0;}
.new_frame_middle .bar_yesterday ul.bar_s_items h3 {float: left; width: 100%; font: 500 20px/30px 'Noto Sans SC', sans-serif; color: #EBEEF7;}
.new_frame_middle .bar_yesterday ul.bar_s_items h3 small {font: 500 12px/20px 'Noto Sans SC', sans-serif; color: #878cac;}
.new_frame_middle .bar_yesterday ul.bar_s_items h4 {float: left; width: 100%; font: 500 16px/26px 'Noto Sans SC', sans-serif; color: #EBEEF7;}
.new_frame_middle .bar_yesterday ul.bar_s_items h4 span {padding-right: 5px; font: 500 12px/26px 'Noto Sans SC', sans-serif;}
.new_frame_middle .bar_yesterday ul.bar_s_items h4 small {font: 500 10px/16px 'Noto Sans SC', sans-serif; color: #878cac;}

.area {background: transparent; background: -webkit-linear-gradient(to left, #8f94fb, #4e54c8); width: 100%; height: 20vh;}
.circles {position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden;}
.circles li {position: absolute; display: block; list-style: none; width: 20px; height: 20px; background: rgba(255, 255, 255, 0.2); animation: animate 25s linear infinite; bottom: -150px;}
.circles li:nth-child(1) {left: 25%; width: 80px; height: 80px; animation-delay: 0s;}
.circles li:nth-child(2) {left: 10%; width: 20px; height: 20px; animation-delay: 2s; animation-duration: 12s;}
.circles li:nth-child(3) {left: 70%; width: 20px; height: 20px; animation-delay: 4s;}
.circles li:nth-child(4) {left: 40%; width: 60px; height: 60px; animation-delay: 0s; animation-duration: 18s;}
.circles li:nth-child(5) {left: 65%; width: 20px; height: 20px; animation-delay: 0s;}
.circles li:nth-child(6) {left: 75%; width: 110px; height: 110px; animation-delay: 3s;}
.circles li:nth-child(7) {left: 35%; width: 150px; height: 150px; animation-delay: 7s;}
.circles li:nth-child(8) {left: 50%; width: 25px; height: 25px; animation-delay: 15s; animation-duration: 45s;}
.circles li:nth-child(9) {left: 20%; width: 15px; height: 15px; animation-delay: 2s; animation-duration: 35s;}
.circles li:nth-child(10) {left: 85%; width: 150px; height: 150px; animation-delay: 0s; animation-duration: 11s;}

@keyframes animate {
    0%{transform: translateY(0) rotate(0deg); opacity: 1; border-radius: 0;}
    100%{transform: translateY(-1000px) rotate(720deg); opacity: 0; border-radius: 50%;}
}

/*** ACCOUNT ***/
.new_frame_header .header_acc_wrap {position: relative; float: left; width: 100%; margin: 0; padding: 0 20px 20px 20px;}
.new_frame_header .panel_acc_wrap {position: relative; z-index: 1; float: right; width: auto; margin: -20px 0 0 0; padding: 35px 20px 0 20px; background: #fff; border: 1px solid #e3e3e3;}
.new_frame_header .panel_acc_wrap a.btn_new {position: relative; float: right; width: auto; margin: 0 10px 15px 10px; padding: 0 20px 0 45px; background: rgba(15, 94, 247, 0.85); font: 700 12px/40px 'Noto Sans SC', sans-serif; color: #fff; transition: 0.5s;}
.new_frame_header .panel_acc_wrap a.btn_location {background: rgba(124, 133, 148, 0.85);}
.new_frame_header .panel_acc_wrap a.btn_new:hover {background: rgba(15, 94, 247, 1); -webkit-box-shadow: 0 8px 6px -6px #9ca5b7; -moz-box-shadow: 0 8px 6px -6px #9ca5b7; box-shadow: 0 8px 6px -6px #9ca5b7;}
.new_frame_header .panel_acc_wrap a.btn_location:hover {background: rgba(124, 133, 148, 1);}
.new_frame_header .panel_acc_wrap span.t_img {position: absolute; top: 5px; left: 5px; width: 30px; height: 30px; background-color: #0E1035; background-size: 20px; background-position: center; background-repeat: no-repeat;}
.new_frame_header .panel_acc_wrap span.t_img img {width: 100%;}

.new_frame_header .header_acc_wrap .acc_wrap_inner {position: relative; z-index: 2; float: left; width: 100%; margin: 0; padding: 20px 0; background: #fff; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; padding: 15px 20px;}
.new_frame_header .header_acc_wrap .acc_hlwrap {position: relative; float: left; width: 50%; margin: 0; padding: 20px 40px;}
.new_frame_header .header_acc_wrap .acc_hrwrap {position: relative; float: left; width: 50%; margin: 0; padding: 20px 40px; border-left:1px solid #e3e3e3;}
.new_frame_header .acc_hlwrap p.s_descp {float: left; width: 100%; margin: 0; font: 500 12px/12px 'Noto Sans SC', sans-serif; color: #2B3D5B;}
.new_frame_header .acc_hlwrap p.b_sales_amt {position: relative; float: left; width: 100%; margin: 30px 0; font: 700 26px/36px 'Noto Sans SC', sans-serif; color: #1b1b1b;}
.new_frame_header .acc_hlwrap p.b_sales_amt small {position: relative; float: left; width: 100%; font: 400 12px/18px 'Noto Sans SC', sans-serif; color: #7C8594;}
.new_frame_header .acc_hlwrap .sub_wrap {position: relative; float: left; width: 100%; margin: 10px 0; padding: 20px; border: 1px solid #e3e3e3;}
.new_frame_header .acc_hlwrap .w_sub_title {position: absolute; z-index: 2; top: -12px; left: 30px; padding: 5px 10px; background: #fff; font: 500 12px/12px 'Noto Sans SC', sans-serif; color: #7C8594;}
.new_frame_header .acc_hlwrap .w_gross_sales {position: relative; float: left; width: 40%; padding: 0 0 0 40px; font: 700 12px/22px 'Noto Sans SC', sans-serif; color: #15253F;}
.new_frame_header .acc_hlwrap .w_expenses {position: relative; float: left; width: 30%; padding: 0 0 0 40px; font: 700 12px/22px 'Noto Sans SC', sans-serif; color: #15253F;}
.new_frame_header .acc_hlwrap .w_expenses small, .new_frame_header .acc_hlwrap .w_gross_sales small {font: 400 10px/16px 'Noto Sans SC', sans-serif; color: #7C8594;}
.new_frame_header .acc_hlwrap .w_expenses {background: url(../images/icon/account/ico_expenses_red.png) left center no-repeat; background-size: auto 30px;}
.new_frame_header .acc_hlwrap .w_gross_sales {background: url(../images/icon/account/ico_gross_blue.png) left center no-repeat; background-size: auto 30px;}

.new_frame_header .acc_circle_overlays {position: absolute; z-index: 2; top: 20px; left: 40px;}
.new_frame_header .acc_overview {position: relative; float: left; width: 100%; padding: 0 0 0 280px;}
.new_frame_header .acc_overview ul.list_overview {position: relative; float: left; width: 100%; margin: 15px 0 0 0;}
.new_frame_header .acc_overview ul.list_overview li.s_item {position: relative; float: left; width: 100%; margin: 0 0 15px 0; padding: 0 20px 0 45px; background: rgba(235,238,247,0.9); transition: 0.5s;}
.new_frame_header .acc_overview ul.list_overview li.s_item:hover {-webkit-box-shadow: 0 8px 6px -6px #9ca5b7; -moz-box-shadow: 0 8px 6px -6px #9ca5b7; box-shadow: 0 8px 6px -6px #9ca5b7;}
.new_frame_header .acc_overview ul.list_overview a.s_item {float: left; width: 100%;}
.new_frame_header .acc_overview ul.list_overview span.m_img {position: absolute; top: 5px; left: 5px; width: 30px; height: 30px; background-color: #dddee5; background-size: 20px; background-position: center; background-repeat: no-repeat;}
.new_frame_header .acc_overview ul.list_overview h2.m_title {position: relative; float: left; font: 500 13px/40px 'Noto Sans SC', sans-serif; color: #15253F;}
.new_frame_header .acc_overview ul.list_overview h3.t_title {position: relative; float: right; padding: 4px 0; font: 700 16px/20px 'Noto Sans SC', sans-serif; color: #262626; text-align: right;}
.new_frame_header .acc_overview ul.list_overview h3.t_title small {font: 500 10px/12px 'Noto Sans SC', sans-serif;}

/*** NEW ACCOUNT OVERVIEW ***/
.new_frame_header .body_acc_wrap {position: relative; float: left; width: 100%; margin: 0; padding: 20px;}
.new_frame_header .body_acc_wrap .overview_list {position: relative; float: left; width: 94%; margin: 30px 0 30px 3%; padding: 0;}
.new_frame_header .body_acc_wrap .overview_list ul.list_item {position: relative; float: left; width: 100%;}
.new_frame_header .body_acc_wrap .overview_list ul.list_item li {position: relative; float: left; width: 15%; margin-right: 2%; border: 1px solid #eee; padding: 15px; background: #fff; transition: 0.5s;}
.new_frame_header .body_acc_wrap .overview_list ul.list_item li:hover {-webkit-box-shadow: 0 8px 6px -6px #9ca5b7; -moz-box-shadow: 0 8px 6px -6px #9ca5b7; box-shadow: 0 8px 6px -6px #9ca5b7;}
.new_frame_header .body_acc_wrap .overview_list ul.list_item li:last-child {margin-right: 0;}
.new_frame_header .body_acc_wrap .overview_list ul.list_item a.s_item {position: relative; float: left; width: 100%; height: 160px;}
.new_frame_header .body_acc_wrap .overview_list a.s_item h3.m_title {position: relative; float: left; width: 70%; padding-right: 30%; font: 700 14px/16px 'Noto Sans SC', sans-serif;}
.new_frame_header .body_acc_wrap .overview_list a.s_item span.m_percent {position: absolute; top: 3px; right: 0; font: 500 10px/12px 'Noto Sans SC', sans-serif;}
.new_frame_header .body_acc_wrap .overview_list a.s_item h2.t_title {position: absolute; bottom: 0; left: 0; width: 100%; font: 500 32px/52px 'Noto Sans SC', sans-serif; color: #06014b;}
.new_frame_header .body_acc_wrap .overview_list a.s_item h2.t_title small {font: 500 12px/16px 'Noto Sans SC', sans-serif; color: #808ca3;}
.new_frame_header .body_acc_wrap .overview_summary {position: relative; float: left; width: 100%; margin: 30px 0; padding: 20px; background: #fff; overflow: hidden;}

.new_frame_header .body_acc_wrap .summary_btm {position: relative; float: left; width: 100%;}
.new_frame_header .body_acc_wrap .summary_btm .left_header {position: relative; float: left; width: 100%; height: 50px;}
.new_frame_header .body_acc_wrap .summary_btm .left_header h3.b_title {float: left; font: 700 14px/30px 'Noto Sans SC', sans-serif;}
.new_frame_header .body_acc_wrap .summary_btm .left_header a.b_select {float: right; margin-left: 15px; font: 500 11px/30px 'Noto Sans SC', sans-serif; color: #7c8aa5;}
.new_frame_header .body_acc_wrap .summary_btm .left_header a.b_select:hover {color: #0070c9;}
.new_frame_header .body_acc_wrap .summary_btm .left_header a.b_select.active {color: #0070c9;}
.new_frame_header .body_acc_wrap .summary_btm .left_body {position: relative; float: left; width: 100%; height: 270px;}
.new_frame_header .body_acc_wrap .summary_btm .left_body .body_header {position: relative; z-index: 2; float: left; width: 10%; height: 250px;}
.new_frame_header .body_acc_wrap .summary_btm .left_body .body_header span.h_item {position: relative; float: left; width: 100%; height: 20%; font: 700 10px/10px 'Noto Sans SC', sans-serif; color: #7c8aa5;}
.new_frame_header .body_acc_wrap .summary_btm .left_body .body_item {position: relative; z-index: 2; float: left; width: 6.425%; height: 200px;}
.new_frame_header .body_acc_wrap .summary_btm .left_body .body_item span.h_val {position: absolute; z-index: 2; top: 100%; left: 0px; width: 100%; height: 10px; padding: 0 10px; font: 700 10px/10px 'Noto Sans SC', sans-serif; color: #06014b; text-align: center; transform: rotate(-90deg) translate(0, 25%); transform-origin: 0 0;}
.new_frame_header .body_acc_wrap .summary_btm .left_body .body_item span.h_bar {position: absolute; left: 0; bottom: -2px; width: 20%; background-color: rgba(180, 184, 217, 0.8);}
.new_frame_header .body_acc_wrap .summary_btm .left_body .body_item span.h_axis {position: absolute; left: 0; bottom: -40px; width: 20%; font: 700 10px/14px 'Noto Sans SC', sans-serif; color: #06014b; text-align: center;}
.new_frame_header .body_acc_wrap .summary_btm .left_body .body_item span.h_axis_short {position: absolute; left: 0; bottom: -60px; width: 50px; font: 500 8px/8px 'Noto Sans SC', sans-serif; color: #06014b; transform: rotate(-90deg) translate(0, 25%); transform-origin: 0 0;}
.new_frame_header .body_acc_wrap .summary_btm .left_body .body_line {position: absolute; z-index: 1; top: 0; left: 0; width: 90%; height: 250px; padding-left: 10%;}
.new_frame_header .body_acc_wrap .summary_btm .left_body .body_line span.h_line {position: relative; float: left; width: 100%; height: 20%; border-top: 1px dashed #ddd;}
.new_frame_header .body_acc_wrap .summary_btm .left_footer {position: relative; float: left; width: 100%; margin: 20px 0 0 0;}
.new_frame_header .body_acc_wrap .summary_btm .left_footer a.s_item {position: relative; float: left; width: 100%; height: 90px; background-color: #e9f0fe; padding: 0 0 0 80px;}
.new_frame_header .body_acc_wrap .summary_btm .left_footer a.s_item span.m_img {position: absolute; top: 50%; left: 15px; width: 48px; height: 48px; background-color: #b7cefc; background-position: center; background-repeat: no-repeat; background-size: 24px; transform: translateY(-50%);}
.new_frame_header .body_acc_wrap .summary_btm .left_footer a.s_item h3.m_title {position: relative; float: left; width: 50%; margin: 28px 0 0 0; font: 700 22px/32px 'Noto Sans SC', sans-serif; color: #06014b;}
.new_frame_header .body_acc_wrap .summary_btm .left_footer a.s_item h2.t_title {position: relative; float: left; width: 50%; margin: 10px 0 0 0; padding: 0 20px 0 0; font: 700 32px/42px 'Noto Sans SC', sans-serif; color: #06014b; text-align: right;}
.new_frame_header .body_acc_wrap .summary_btm .left_footer a.s_item h2.t_title small {font: 500 12px/16px 'Noto Sans SC', sans-serif; color: #0070c9;}

/*** CONTENT ***/
ul.sort_sel {position: relative; float: left; margin: 5px 0 0 0;}
ul.sort_sel li.s_item {position: relative; float: left; margin: 0 10px 0 0; font: 700 8px/40px 'Noto Sans SC', sans-serif; color: #262626;}

.app_list {position: relative; float: left; width: 100%; padding:10px;}
.app_list h3.new_t_title {float: left; width: 100%; padding: 0 0 0 20px; font: 500 16px/60px 'Noto Sans SC', sans-serif; color: #262626;}
.app_list .new_t_list {display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); grid-gap: 15px; padding: 0 15px;}
.app_list .new_t_list .m_item {position: relative; float: left; width: 100%; padding: 0;}
.app_list .new_t_list .m_item .no_item {float: left; width: 100%; text-align: center;}
.app_list .new_t_list .m_item:hover .cts_wrap {box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;}
.app_list .new_t_list .m_item:hover .ncs_wrap {box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;}
.app_list .new_t_list .m_item img.f_img {position: absolute; z-index: 10; top: -5px; left: -5px; width: 80px;}

.app_list .horiz_t_list {display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); grid-gap: 15px; padding: 0 15px;}
.app_list .horiz_t_list .m_item {position: relative; float: left; width: 100%; padding: 0; word-wrap: break-word;}
.app_list .horiz_t_list .m_item .cts_wrap {box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.app_list .horiz_t_list .m_item:hover .cts_wrap {box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;}
.app_list .horiz_t_list .m_item:hover .ncs_wrap {box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;}
.app_list .horiz_t_list .m_item img.f_img {position: absolute; z-index: 10; top: -5px; left: -5px; width: 80px;}

/*** NEW VERSION 3 ***/
.more_item {position: relative; float: left; width: 144px; height: 144px;}
.more_item a {position: relative; float: left; width: 100%; height: 100%; padding: 10px; background: #d9dff0; transition: 0.3s;}
.more_item img {position: absolute; top: 10px; left: 10px; width: 24px; height: 24px; padding: 5px; background: #15253f; transition: 0.3s;}
.more_item h3 {float: left; width: 100%; margin: 40px 0 0 0; font: 500 16px/22px 'Noto Sans SC', sans-serif; color: #262626; word-wrap: break-word; white-space: normal;}
.more_item small {position: relative; float: left; width: 100%; margin: 10px 0 0 0; font: 400 9px/10px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.more_item a:hover {box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}
.more_item a:hover img {background: #0f5ef7;}

/*** TASK VERSION 3 ***/
.nts_wrap {position: relative; float: left; width: 100%; padding: 0;}
.nts_wrap .hts_wrap {position: relative; float: left; width: 100%; padding: 20px;}
.nts_wrap .hts_wrap span.hts_title {position: relative; float: left; width: 100%; padding: 0 90px 0 0;}
.nts_wrap .hts_wrap span.hts_title a.t_link_item {position: relative; float: left; width: 100%; font: 500 24px/28px 'Noto Sans SC', sans-serif; color: #fff;}
.nts_wrap .hts_wrap span.hts_subtitle_s, .nts_wrap .hts_wrap span.hts_subtitle_m {position: relative; float: left; width: 100%; margin: 5px 0 15px 0;}
.nts_wrap .hts_wrap span.hts_subtitle_s a.t_body_item, .nts_wrap .hts_wrap span.hts_subtitle_m a.t_body_item {position: relative; float: left; width: 100%; font: 400 12px/18px 'Noto Sans SC', sans-serif; color: #fafafa;}

.nts_wrap .hts_wrap .hts_items {position: absolute; top: 20px; right: 0;}
.nts_wrap .hts_wrap .hts_items img {height: 34px; border: 3px solid white; background:#e3e3e3; transition: all 0.3s;}
.nts_wrap .hts_wrap .hts_items img.img_checked {border-color: rgba(46, 139, 87, 0.75);}
.nts_wrap .hts_wrap .hts_items img.img_a {position: absolute; z-index: 1; right: 15px;}
.nts_wrap .hts_wrap .hts_items img.img_b {position: absolute; z-index: 2; right: 32px;}
.nts_wrap .hts_wrap .hts_items img.img_c {position: absolute; z-index: 3; right: 49px;}
.nts_wrap .hts_wrap .hts_items img:hover { z-index: 4; transform: scale(1.3) rotate(5deg); }
.nts_wrap .hts_wrap .hts_items a.t_items_more {position: absolute; z-index: 4; right: 66px; width: 34px; height: 34px; border: 3px solid white; background: rgba(0, 24, 71, 0.65); font: 700 7px/28px 'Noto Sans SC', sans-serif; letter-spacing: .1em; color: #fff; text-align: center;}
.nts_wrap span.cart_img {position: relative; float: left; width: 23%; margin: 5px 1%; border: 2px solid rgba(219, 223, 229, 1); overflow: hidden;}
.nts_wrap span.cart_img span.item_sku {position: absolute; top: 50%; left: 0; width: 100%; background-color: rgba(153, 157, 160, 0.75); font: 700 8px/14px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.nts_wrap span.cart_img span.checked {background-color: rgba(46, 139, 87, 0.75);}
.nts_wrap span.cart_img img.m_img {float: left; width: 100%; background-color: #f2f2f2;}

.nts_wrap .hts_wrap ul.hts_list {position: absolute; right: 20px; bottom: 0px;}
.nts_wrap .hts_wrap ul.hts_list li {position: relative; float: left; width: auto; margin: 0 0 0 5px;}
.nts_wrap .hts_wrap ul.hts_list a.hts_type {position: relative; float: right; width: auto; height: 24px; padding: 0 10px; background: #0f5ef7; font: 500 9px/24px 'Noto Sans SC', sans-serif; color: #fff;}
.nts_wrap .hts_wrap ul.hts_list a.hts_type img {height: 14px; padding: 5px 0;}
.nts_wrap .hts_wrap ul.hts_list a.t_courier {background-color: #00a54f;}
.nts_wrap .hts_wrap ul.hts_list a.t_locker {background-color: #15253f;}

.nts_wrap .nts_lock {position: absolute; z-index: 10; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.4);}
.nts_wrap .nts_lock a.t_hold {position: absolute; z-index: 10; top: 0; left: 0; width: 100%; height: 100%; margin: 0; background: url(../images/icon/ico_pass_r.png) center center no-repeat; background-size: auto 40px;}

.cts_wrap {position: relative; float: left; width: 100%; margin: 15px 0 0 0; padding: 15px; background:rgba(255,255,255,0.99); box-shadow: none; transition: 0.25s;}
.cts_wrap span.t_line {position: relative; float: left; width: 100%; height: 1px; margin:5px 0; padding:0 15px; background:#e3e3e3;}
.cts_wrap span.t_space {position: relative; float: left; width: 100%; height: 10px;}
.cts_wrap img.t_icon {width: 90%; padding: 5%; background-color: #ebeef7;}
.cts_wrap a.t_other_item {position: relative; display: inline-block; width: 32px; height: 32px;}
.cts_wrap a.t_other_item:hover {background: #e3e3e3;}
.cts_wrap img.t_other_icon {height: 90%; margin: 5%;}
.cts_wrap span.t_item_dot {position: absolute; top: 0; right: -2px; width: 14px; height: 14px; background-color: #0f5ef7; font: 500 8px/14px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.cts_wrap span.t_item_dot.red {background-color: #990000;}
.cts_wrap .t_footer_item {position: relative; float: left; width: 100%; font: 400 12px/16px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.cts_wrap .t_footer_item strong {font: 700 14px/20px 'Noto Sans SC', sans-serif;}
.cts_wrap .t_footer_subitem {position: relative; float: left; width: 100%; font: 400 8px/10px 'Noto Sans SC', sans-serif; color: #666;}
.cts_wrap .t_footer_bitem {position: relative; float: left; width: 100%; font: 700 12px/16px 'Noto Sans SC', sans-serif; color: #666; text-align: center;}
.cts_wrap .t_red {color:#990000;}
.cts_wrap .t_bold {font-size: 16px; color:#000;}

.cts_wrap .cts_subheader {position: relative; float: left; width: 100%; margin: 15px 0 0 0; padding: 0;}
.cts_wrap .cts_subheader h3.hts_subtitle {position: relative; float: left; width: 100%; margin: 5px 0; font: 700 14px/20px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.cts_wrap .cts_subheader .t_subheader_item {position: relative; float: left; width: 100%; font: 400 9px/16px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.cts_wrap .cts_subheader .t_subheader_item strong {font: 500 12px/20px 'Noto Sans SC', sans-serif; color: #3a4659;}
.cts_wrap .cts_subheader .t_subheader_item a {position: relative; float: left; width: 100%; font: 500 12px/20px 'Noto Sans SC', sans-serif; color: #3a4659;}
.cts_wrap .cts_subheader .t_subheader_item a.t_item {float: left; width: 100%; font: 700 12px/18px 'Noto Sans SC', sans-serif;}
.cts_wrap .cts_subheader .t_subheader_item a.t_checked {position: relative; float: left; width: 90%; height: 20px; margin: 5px 10% 0 0; background: #7c8594; text-align: center; overflow: hidden;}
.cts_wrap .cts_subheader .t_subheader_item span.t_checked_text {position: relative; z-index: 2; font: 500 8px/20px 'Noto Sans SC', sans-serif; color: #fff;}
.cts_wrap .cts_subheader .t_subheader_item span.t_checked_shade {position: absolute; z-index: 1; top: 0; left: 0; float: left; width: 100%; height: 20px; background: #15253f;}
.cts_wrap .cts_subheader .t_subheader_item img.t_icon {background-color: transparent !important;}
.cts_wrap .cts_subheader .t_subheader_item img.t_copy_icon {position:absolute; z-index:2; top:0; right:0; width: 10px; height: 10px; padding: 4px; background-color:#0f5ef7;}

.cts_wrap .cts_subheader .t_body_word {position: relative; float: left; width: 100%; font: 400 12px/18px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.cts_wrap .cts_subheader .t_body_remarks {max-height: 128px; overflow: hidden;}
.cts_wrap .cts_subheader .t_full_remarks {max-height: auto; overflow: hidden;}
.cts_wrap .cts_subheader .t_body_word p {float: left; width: 100%;}
.cts_wrap .cts_subheader small {position: relative; float: left; width: 100%; font: 400 9px/10px 'Noto Sans SC', sans-serif; color: #777;}
.cts_wrap .cts_subheader a.s_more {position: relative; float: left; width: 100%; margin: 5px 0; padding-left: 20px; font: 500 12px/20px 'Noto Sans SC', sans-serif; color: #3975f1;}
.cts_wrap .cts_subheader a.s_down { background: url(../images/icon/ico_down_sb.png) left center no-repeat; background-size: 16px;}
.cts_wrap .cts_subheader a.s_up { background: url(../images/icon/ico_up_sb.png) left center no-repeat; background-size: 16px;}

.cts_wrap .cts_subheader .t_panel {position: relative; float: left; width: 100%; height: 32px; margin: 10px 0 0 0; padding: 0;}
.cts_wrap .cts_subheader .t_panel a.ico {position: relative; float: left; width: 32px; height: 32px; margin-right: 6px;}
.cts_wrap .cts_subheader .t_panel a.ico.payment {background: url("../images/icon/ico_payment.png") center no-repeat;}
.cts_wrap .cts_subheader .t_panel a.ico.receipt {background: url("../images/icon/ico_receipt.png") center no-repeat;}
.cts_wrap .cts_subheader .t_panel a.ico.edit {background: url(../images/icon/ico_edit.png) center no-repeat;}
.cts_wrap .cts_subheader .t_panel a.ico.mail {background: url("../images/icon/ico_email.png") center no-repeat;}
.cts_wrap .cts_subheader .t_panel a.ico.trash {background: url(../images/icon/ico_del.png) center no-repeat;}
.cts_wrap .cts_subheader .t_panel a.ico.restored {background: #ff968a url(../images/icon/ico_clear.png) center no-repeat; float:right;}
.cts_wrap .cts_subheader .t_panel a.ico.link {background: url(../images/icon/ico_forward.png) center no-repeat;}
.cts_wrap .cts_subheader .t_panel a.ico.print {background: url(../images/icon/ico_print.png) center no-repeat;}
.cts_wrap .cts_subheader .t_panel a.ico.completed {float: right !important; margin-right: 0px !important; background: #39945B url(../images/icon/ico_tick_w.png) center no-repeat;}
.cts_wrap .cts_subheader .t_panel a.ico {background-size: 24px !important;}
.cts_wrap .cts_subheader .t_panel a.ico:hover {background-color: #e7e7e7 !important;}
.cts_wrap .cts_subheader .t_panel a.ico.completed:hover {background-color: #27673F !important;}

/*** INVENTORY VERSION 3 ***/
.inv_wrap {position: relative; float: left; width: 100%; padding: 0;}
.inv_wrap .hts_wrap {position: relative; z-index: 1; float: left; width: 100%; height: 180px; background-color: #1a1649; overflow: hidden;}
.inv_wrap .hts_wrap .img_wrap {position: relative; float: left; background-position: center; background-repeat: no-repeat; background-size: contain;}
.inv_wrap .hts_wrap .img_center {width: 70%; height: 90px; margin: 20px 0 0 15%; background-position: center; background-repeat: no-repeat; background-size: 80%;}

.inv_wrap .hts_wrap .img_header {position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden;}
.inv_wrap .hts_wrap .img_full {position: absolute; top: 0; left: 0; width: 100%; transform: translateY(-35%); transition: transform 0.15s;}

.inv_wrap .hts_img_full {}
.inv_wrap .hts_img_full:hover {height: 100%;}
.inv_wrap .hts_img_full:hover .img_header {position: relative;}
.inv_wrap .hts_img_full:hover .img_full {position: relative; transform: translateY(0%); float: left;}

.inv_wrap .content_wrap {position: relative; z-index: 2; float: left; width: 100%; margin: -50px 0 0 0; padding: 20px; background: #fff; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; transition: 0.15s;}
.inv_wrap:hover .content_wrap {box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;}
.inv_wrap .content_header .hcs_title {position: relative; float: left; width: 100%;}
.inv_wrap .content_header .hcs_title .b_title {position: relative; float: left; width: 100%; font: 700 13px/19px 'Noto Sans SC', sans-serif; color: #2b2b2b; word-wrap: break-word;}
.inv_wrap .content_header .hcs_title .b_title small {font: 400 11px/14px 'Noto Sans SC', sans-serif; color: #777;}
.inv_wrap .content_header .hcs_id {position: relative; float: left; width: 100%; margin: 10px 0 0 0;}
.inv_wrap .content_header .hcs_id .id_content {float: left; margin: 5px 5px 0 0; padding: 0 10px; background: #6B3779; font: 700 11px/23px 'Noto Sans SC', sans-serif; color: #fff;}
.inv_wrap .content_header .hcs_id .id_stock {position: relative; float: right; margin: 5px 0 0 5px; background: #0f5ef7; padding: 0 10px; font: 700 10px/23px 'Noto Sans SC', sans-serif; color: #fff;}
.inv_wrap .content_header .hcs_id .id_publish {position: relative; float: right; margin: 5px 0 0 0; padding: 0 10px; font: 700 10px/23px 'Noto Sans SC', sans-serif; color: #fff;}
.inv_wrap .content_header .hcs_id .t_offline {background: #fd8f8d;}
.inv_wrap .content_header .hcs_id .t_online {background: #f7941d;}

/* CARD STYLE
.inv_wrap .stock_card {position: relative; float: left; width: 100%; margin: 0; background: rgba(65, 59, 138, 1); padding: 20px 20px 60px 20px;}
.inv_wrap .stock_card .stock_bar {position: absolute; z-index: 2; bottom: 50px; left: 20px; width: 5px; height: 100px;}
.inv_wrap .stock_card .stock_bar .s_item {position: absolute; z-index: 2; bottom: 50px; left: 0; width: 5px;}
.inv_wrap .stock_card .stock_list {position: relative; float: left; width: 100%; padding: 0 0 0 45px;}
.inv_wrap .stock_card .stock_c {position: relative; z-index: 1; float: left; width: 31%; margin: 0 3.5% 10px 0; padding: 5px 5px 5px 15px;}
.inv_wrap .stock_card .stock_c:nth-child(3n+3) {margin: 0 0 5px 0;}
.inv_wrap .stock_card .stock_c span.s_tag {position: absolute; z-index: 2; top: 8px; left: 0; width: 5px; height: 12px;}
.inv_wrap .stock_card .stock_c small {position: relative; float: left; width: 100%; font: 400 10px/12px 'Noto Sans SC', sans-serif; color: #cecece;}
.inv_wrap .stock_card .stock_c strong {position: relative; float: left; width: 100%; margin-top: 5px; font: 700 18px/22px 'Noto Sans SC', sans-serif; color: #fff;}
*/

.inv_wrap .bar_header {position: relative; float: left; width: 100%; margin: 20px 0 0 0;}
.inv_wrap .bar_header h3 {font: 400 14px/20px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.inv_wrap .bar_header strong {font: 700 20px/20px 'Noto Sans SC', sans-serif; color: #0f5ef7 !important;}
.inv_wrap .bar_header strong small {font: 400 14px/20px 'Noto Sans SC', sans-serif;}
.inv_wrap .bar_header strong.red {color: #ff365f !important;}
.inv_wrap .bar_header em {font-weight: 700;}
.inv_wrap .bar_wrap {position: relative; float: left; width: 100%; margin: 10px 0 0 0;}
.inv_wrap .bar_wrap .bar_items {position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 6px; overflow: hidden;}
.inv_wrap .bar_wrap .bar_items li.s_item {position: relative; float: left; height: 6px; margin: 0;}
.inv_wrap .bar_wrap .bar_bg {position: relative; z-index: 1; float: left; width: 100%; height: 6px; background-color: #dbdfe5;}
.inv_wrap .bar_content {position: relative; float: left; width: 100%; margin: 10px 0 0 0;}
.inv_wrap .bar_content .bar_list {position: relative; float: left; width: 100%;}
.inv_wrap .bar_content .s_content {position: relative; z-index: 1; float: left; margin: 0 5px 5px 0; padding: 5px;}
.inv_wrap .bar_content .s_content em {position: relative; float: left; width: auto; min-width: 16px; height: 16px; padding: 0 5px; background: #1a1649; font: 700 9px/16px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.inv_wrap .bar_content .s_content strong {position: relative; float: left; margin: 0 5px; font: 500 10px/16px 'Noto Sans SC', sans-serif; color: #000;}
.inv_wrap .bar_content .s_content:first-child em {background: #ebeef7; color: #1a1649;}
.inv_wrap .bar_content .s_content:first-child strong {color: #fff;}

.inv_wrap .details_wrap {position: relative; float: left; width: 100%;}
.inv_wrap .details_wrap .t_details {position: relative; float: left; width: 100%; margin: 20px 0 0 0;}
.inv_wrap .details_wrap .t_details .s_item {position: relative; float: left; width: 33.33%; margin: 0 0 10px 0;}
.inv_wrap .details_wrap .t_details .t_item {float: left; width: 100%; font: 700 13px/19px 'Noto Sans SC', sans-serif; color: #2b2b2b; text-align: center;}
.inv_wrap .details_wrap .t_details small {float: left; width: 100%; font: 400 10px/14px 'Noto Sans SC', sans-serif; color: #777; text-align: center;}
.inv_wrap .details_wrap .s_line {position: relative; float: left; width: 100%; margin: 5px 0 0 0; border-bottom: 1px solid #e3e3e3; padding: 0 0 5px 0;}

.inv_wrap .details_wrap .remark_wrap {position: relative; float: left; width: 100%; margin: 20px 0 0 0;}
.inv_wrap .details_wrap .remark_wrap h2 {font: 700 15px/20px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.inv_wrap .details_wrap .remark_wrap p {position: relative; float: left; width: 100%; max-height: 128px; font: 500 12px/18px 'Noto Sans SC', sans-serif; color: #20355e; overflow: hidden;}
.inv_wrap .details_wrap .remark_wrap a.s_more {position: relative; float: left; width: 100%; margin-top: 10px; padding-left: 20px; font: 500 12px/20px 'Noto Sans SC', sans-serif; color: #3975f1;}
.inv_wrap .details_wrap .remark_wrap a.s_down {background: url(../images/icon/ico_down_sb.png) left center no-repeat; background-size: 16px;}
.inv_wrap .details_wrap .remark_wrap a.s_up {background: url(../images/icon/ico_up_sb.png) left center no-repeat; background-size: 16px;}

.inv_wrap .hold_wrap {position: relative; z-index: 0; float: left; width: 100%; max-height: 196px; overflow: hidden; margin: 20px 0 0 0;}
.inv_wrap .hold_wrap .ccs_list {position: relative; float: left; width: 100%;}
.inv_wrap .hold_wrap .ccs_list li.s_full {position: relative; float: left; width: 100%; margin: 5px 0 0 0; border-bottom: 1px solid #e3e3e3; padding: 0 0 5px 0;}
.inv_wrap .hold_wrap .ccs_list li.s_full strong {font: 700 13px/20px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.inv_wrap .hold_wrap .ccs_list li.s_full span.c_item {float: left; margin-right: 15px; font: 500 10px/11px 'Noto Sans SC', sans-serif; color: #666;}
.inv_wrap .hold_wrap .ccs_list li.s_full span.c_num {min-width: 20px; margin-right: 5px;}
.inv_wrap .hold_wrap .ccs_list li.s_full span.c_task {float: right; max-width: 30%; margin-right: 20px; padding: 5px 15px; font: 700 10px/11px 'Noto Sans SC', sans-serif; color: #2b2b2b; text-align: right;}
.inv_wrap .hold_wrap .ccs_list li.s_full span.c_remark {float: left; width: 100%; margin-top: 5px; padding: 0 25px; font: 500 10px/11px 'Noto Sans SC', sans-serif; color: #666;}
.inv_wrap .hold_wrap .ccs_list li.s_full .ico {width: 20px; height: 20px;}
.inv_wrap .hold_wrap .ccs_list li.s_full .c_del {position: absolute; top: 0; right: 0; background: url(../images/icon/ico_cross.png) center no-repeat; background-size: 16px;}
.inv_wrap .hold_wrap .ccs_list li.s_full .c_del:hover {background-color: #fd8f8d;}

.inv_wrap .s_panel {position: relative; float: left; width: 100%;}
.inv_wrap .s_panel .hold_control {position: relative; float: left; width: 100%;}
.inv_wrap .s_panel .hold_control a.s_more {position: relative; float: left; width: 100%; margin-top: 10px; padding-left: 20px; font: 500 12px/20px 'Noto Sans SC', sans-serif; color: #3975f1;}
.inv_wrap .s_panel .hold_control a.s_down {background: url(../images/icon/ico_down_sb.png) left center no-repeat; background-size: 16px;}
.inv_wrap .s_panel .hold_control a.s_up {background: url(../images/icon/ico_up_sb.png) left center no-repeat; background-size: 16px;}
.inv_wrap .s_panel span.c_dtime {float: left; margin: 15px 0 0 0; font: 400 9px/12px 'Noto Sans SC', sans-serif; color: #666;}
.inv_wrap .s_panel a.ico.trash {position: absolute; bottom: -5px; right: 0; width: 32px; height: 32px; background: #ff365f url(../images/icon/ico_del_w.png) center no-repeat; background-size: 28px !important;}
.inv_wrap .s_panel a.ico.trash:hover {background-color: #e9002f !important; color: #fff !important;}

/*** INVENTORY HOLD VERSION 3 ***/
.nhold_wrap {position: relative; z-index: 0; float: left; width: 100%; padding: 0; background: linear-gradient(to top, rgba(223, 233, 243, 0.15) 0%, rgba(255, 255, 255, 0.85) 100%); box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; transition: 0.25s; overflow: hidden;}
.nhold_wrap:hover {box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;}
.nhold_wrap .head_wrap {position: relative; z-index: 0; float: left; width: 100%; padding: 15px;}
.nhold_wrap .head_wrap .hcs_title {position: relative; float: left; width: 100%;}
.nhold_wrap .head_wrap .hcs_title .img_wrap {position: relative; z-index: 2; float: left; width: 64px; height: 64px; background: #ebeef7; padding: 10px;}
.nhold_wrap .head_wrap .hcs_title .img_wrap img {width: 44px;}
.nhold_wrap .head_wrap .hcs_title .title_wrap {position: absolute; z-index: 1; top: 50%; left: 0; width: 100%; padding: 0 0 0 80px; transform: translateY(-50%);}
.nhold_wrap .head_wrap .hcs_title .b_title {position: relative; float: left; width: 100%; font: 700 13px/19px 'Noto Sans SC', sans-serif; color: #2b2b2b; word-wrap: break-word;}
.nhold_wrap .head_wrap .hcs_title .b_title small {font: 400 11px/14px 'Noto Sans SC', sans-serif; color: #777;}
.nhold_wrap .head_wrap .hcs_id {position: relative; float: left; width: 100%; margin: 15px 0 0 0;}
.nhold_wrap .head_wrap .hcs_id .id_content {float: left; margin: 0 5px 0 0; padding: 0 10px; background: #15253f; font: 700 10px/24px 'Noto Sans SC', sans-serif; color: #fff;}
.nhold_wrap .head_wrap .hcs_id .id_user {position: absolute; top: 0; right: 0; z-index: 2; background: #0f5ef7; padding: 0 10px; font: 700 10px/24px 'Noto Sans SC', sans-serif; color: #fff;}

.nhold_wrap .content_wrap {position: relative; z-index: 0; float: left; width: 100%; margin: 0; padding: 15px;}
.nhold_wrap .content_wrap .ccs_list {position: relative; float: left; width: 100%;}
.nhold_wrap .content_wrap .ccs_list li.s_full {position: relative; float: left; width: 100%; margin: 5px 0 0 0; border-bottom: 1px solid #e3e3e3; padding: 0 0 5px 0;}
.nhold_wrap .content_wrap .ccs_list li.s_full strong {font: 700 13px/20px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.nhold_wrap .content_wrap .ccs_list li.s_full span.c_item {float: left; margin-right: 15px; font: 500 11px/20px 'Noto Sans SC', sans-serif; color: #666;}
.nhold_wrap .content_wrap .ccs_list li.s_full span.c_num {min-width: 20px; margin-right: 5px;}
.nhold_wrap .content_wrap .ccs_list li.s_full span.c_task {float: left; background: #ebeef7; padding: 5px 15px; font: 700 10px/10px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.nhold_wrap .content_wrap .ccs_list li.s_full span.c_remark {float: left; width: 100%; padding: 0 25px; font: 500 11px/20px 'Noto Sans SC', sans-serif; color: #666;}
.nhold_wrap .content_wrap .ccs_list li.s_full .ico {width: 20px; height: 20px;}
.nhold_wrap .content_wrap .ccs_list li.s_full .c_del {position: absolute; top: 0; right: 0; background: url(../images/icon/ico_cross.png) center no-repeat; background-size: 16px;}
.nhold_wrap .content_wrap .ccs_list li.s_full .c_del:hover {background-color: #fd8f8d;}

.nhold_wrap .content_wrap .ccs_list li.s_panel {position: relative; float: left; width: 100%; margin: 15px 0 0 0;}
.nhold_wrap .content_wrap .ccs_list li.s_panel span.c_dtime {float: left; margin: 5px 0; font: 400 9px/24px 'Noto Sans SC', sans-serif; color: #666;}
.nhold_wrap .content_wrap .ccs_list li.s_panel a.ico.trash {position: absolute; top: 0; right: 0; width: 32px; height: 32px; background: #ff365f url(../images/icon/ico_del_w.png) center no-repeat; background-size: 28px !important;}
.nhold_wrap .content_wrap .ccs_list li.s_panel a.ico.trash:hover {background-color: #e9002f !important; color: #fff !important;}

/*** CUSTOMER VERSION 3 ***/
.ncs_wrap {position: relative; z-index: 0; float: left; width: 100%; padding: 0; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; transition: 0.25s; overflow: hidden;}
.ncs_wrap_0 {background-color: #5368c5;}
.ncs_wrap_1 {background-color: #977864;}
.ncs_wrap_2 {background-color: #333333;}

.ncs_wrap .hcs_wrap {position: relative; z-index: 0; float: left; width: 100%; padding: 15px;}
.ncs_wrap .hcs_wrap .hcs_title {position: relative; float: left; width: 100%;}
.ncs_wrap .hcs_wrap .hcs_title .img_wrap {position: relative; z-index: 2; float: left; width: 64px; height: 64px; background: #fff; padding: 10px;}
.ncs_wrap .hcs_wrap .hcs_title .img_wrap img {width: 44px;}
.ncs_wrap .hcs_wrap .hcs_title .title_wrap {position: absolute; z-index: 1; top: 50%; left: 0; width: 100%; padding: 0 0 0 80px; transform: translateY(-50%);}
.ncs_wrap .hcs_wrap .hcs_title .b_title {position: relative; float: left; width: 100%; font: 700 14px/22px 'Noto Sans SC', sans-serif; color: #fff; word-wrap: break-word;}
.ncs_wrap .hcs_wrap .hcs_title .b_title small {font: 300 12px/18px 'Noto Sans SC', sans-serif;}
.ncs_wrap .hcs_wrap .hcs_id {position: relative; float: left; width: 100%; margin: 15px 0 0 0; background: url(../images/icon/v2/ico_customer_id_w.png) left center no-repeat; background-size: 24px; padding: 0 0 0 30px;}
.ncs_wrap .hcs_wrap .hcs_id .id_title {float: left; width: 100%; font: 300 12px/22px 'Noto Sans SC', sans-serif; color: #fff;}
.ncs_wrap .hcs_wrap .hcs_id .id_content {position: absolute; top: 0; right: 0; z-index: 2; background: #fff; padding: 5px 20px; font: 700 12px/12px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.ncs_wrap .hcs_wrap .hcs_amount {position: relative; float: left; width: 100%; margin: 15px 0 0 0;}
.ncs_wrap .hcs_wrap .hcs_amount .amt_title {float: left; width: 27%; margin: 0 0 0 5%; font: 700 11px/16px 'Noto Sans SC', sans-serif; color: #fff;}
.ncs_wrap .hcs_wrap .hcs_amount .amt_title em {font-size: 9px;}
.ncs_wrap .hcs_wrap .hcs_amount .amt_title:first-child {width: 31%; margin: 0 5% 0 0; border-right: 1px solid #fff;}
.ncs_wrap .hcs_wrap .hcs_amount .amt_title small {font: 300 12px/18px 'Noto Sans SC', sans-serif;}

.ncs_wrap .ccs_wrap {position: relative; z-index: 0; float: left; width: 100%; margin: 10px 0 0 0; padding: 15px 15px 45px 15px;}
.ncs_wrap_0 .ccs_wrap {background-color: #2549a1;}
.ncs_wrap_1 .ccs_wrap {background-color: #815e4a;}
.ncs_wrap_2 .ccs_wrap {background-color: #242424;}
.ncs_wrap .ccs_wrap .ccs_list {position: relative; float: left; width: 100%;}
.ncs_wrap .ccs_wrap .ccs_list li.s_item {position: relative; float: left; width: 46%; margin: 5px 0; padding: 0 4% 0 20px; font: 700 11px/14px 'Noto Sans SC', sans-serif; color: #fff; word-wrap: break-word;}
.ncs_wrap .ccs_wrap .ccs_list li.s_item:nth-child(odd) {/*clear: left;*/}
.ncs_wrap .ccs_wrap .ccs_list li.s_item small {font: 400 9px/16px 'Noto Sans SC', sans-serif;}
.ncs_wrap .ccs_wrap .ccs_list li.s_full {width: 100%; padding: 0 0 0 20px;}
.ncs_wrap .ccs_wrap .ccs_list .s_mail {background: url(../images/icon/v2/ico_customer_mail_w.png) left 3px no-repeat; background-size: 16px;}
.ncs_wrap .ccs_wrap .ccs_list .s_fb {background: url(../images/icon/v2/ico_customer_fb_w.png) left 3px no-repeat; background-size: 16px;}
.ncs_wrap .ccs_wrap .ccs_list .s_gid {background: url(../images/icon/v2/ico_customer_gid_w.png) left 3px no-repeat; background-size: 16px;}
.ncs_wrap .ccs_wrap .ccs_list .s_member {background: url(../images/icon/v2/ico_customer_member_w.png) left 3px no-repeat; background-size: 16px;}
.ncs_wrap .ccs_wrap .ccs_list .s_creator {background: url(../images/icon/v2/ico_customer_create_w.png) left 3px no-repeat; background-size: 16px;}
.ncs_wrap .ccs_wrap .ccs_list .s_cdate {background: url(../images/icon/v2/ico_customer_date_w.png) left 3px no-repeat; background-size: 16px;}

.ncs_wrap .ccs_wrap .pcs_wrap {position: relative; float: left; width: 100%; margin: 15px 0 20px 0;}
.ncs_wrap .ccs_wrap .pcs_wrap .ico {position: relative; float: left; width: 32px; height: 32px; margin: 0 15px 0 0; font: 700 11px/32px 'Noto Sans SC', sans-serif; color: #2b2b2b; text-align: center;}
.ncs_wrap .ccs_wrap .pcs_wrap .ico small {position: absolute; top: 36px; left: 0; width: 100%; font: 500 7px/14px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.ncs_wrap .ccs_wrap .pcs_wrap .tasks {background: #ffdb7d;}
.ncs_wrap .ccs_wrap .pcs_wrap .invoices {background: #8ee3f7;}
.ncs_wrap .ccs_wrap .pcs_wrap .trash {float: right; margin: 0; background: #fccac9 url(../images/icon/v2/ico_customer_delete.png) center no-repeat; background-size: 18px;}
.ncs_wrap .ccs_wrap .pcs_wrap .trash:hover {background-color: #fd8f8d;}

.ncs_wrap .mcs_wrap {position: relative; z-index: 0; float: left; width: 100%; margin: -30px 0 0 0; padding: 15px; background-color: #fff;}
.ncs_wrap .mcs_wrap .mcs_addr {position: relative; z-index: 0; float: left; width: 100%; height: auto; padding: 0 0 0 70px;}
.ncs_wrap .mcs_wrap .mcs_addr .mcs_ico {position: absolute; z-index: 2; top: 0; left: 0; width: 34px; height: 100%; background: url(../images/icon/v2/ico_customer_map_bg.png) center no-repeat; background-size: cover;}
.ncs_wrap .mcs_wrap .mcs_addr .img_wrap {position: absolute; z-index: 2; top: 15%; left: 17px; width: 34px; height: 34px; background: #d9dff0; padding: 7px;}
.ncs_wrap .mcs_wrap .mcs_addr .img_wrap img {width: 20px;}
.ncs_wrap .mcs_wrap .mcs_addr p {position: relative; float: left; width: 100%; margin: 0 0 10px 0; font: 700 11px/14px 'Noto Sans SC', sans-serif; color: #2b2b2b; word-wrap: break-word; white-space: normal;}
.ncs_wrap .mcs_wrap .mcs_addr small {position: relative; float: left; width: 100%; font: 700 9px/14px 'Noto Sans SC', sans-serif; color: #7c8594;}

.wrap_info .info_content ul.c_form li.c_pts {margin-bottom: 20px; background-color: #fff; overflow: hidden;}
.wrap_info .info_content ul.c_form li.c_pts:nth-child(5n+1) {clear: left;}
.s_item .c_pts_bg {position: relative; z-index: 2; float: left; width: 100%; padding: 20px 20px 0 20px; background: #fff; box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px;}
.s_item .bg_no_expired {}
.s_item .bg_expired {background: #d9dff0 !important;}

.s_item .c_pts_bg .c_pts_key {position: absolute; top: 0; left: 0; padding: 10px 20px; background: rgba(255,255,255,0.55); font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #1a1649;}
.s_item .c_pts_bg .c_pts_top {position: relative; float: left; width: 100%; margin: 30px 0 10px 0;}
.s_item .c_pts_bg .c_pts_top p {position: relative; float: left; width: 100%; font: 500 12px/16px 'Noto Sans SC', sans-serif; color: #777;}
.s_item .c_pts_bg .c_pts_mid {position: relative; float: left; width: 100%; margin: 30px 0 15px 0;}
.s_item .c_pts_bg .c_pts_mid span.p_amount {position: relative; float: left; width: 100%; font: 700 24px/28px 'Noto Sans SC', sans-serif; color: #1b1b1b;}
.s_item .c_pts_bg .c_pts_mid span.p_amount em {float: left;}
.s_item .c_pts_bg .c_pts_mid span.p_date {position: relative; float: left; margin: 10px 0 0 5px; font: 500 10px/14px 'Noto Sans SC', sans-serif; color: #15253f;}
.s_item .c_pts_bg .c_pts_panel {position: absolute; top: 60px; right: 0;}
.s_item .c_pts_bg .c_pts_panel a.btn_del {position: relative; float: left; width: 20px; height: 20px; margin: 0 10px 0 0; background-color: #6D6F6F; padding: 3px;}
.s_item .c_pts_bg .c_pts_panel a.btn_del:hover {background-color: #323333;}
.s_item .c_pts_bg .c_pts_panel a.btn_del img {width: 100%;}
.s_item .c_pts_bg .c_pts_panel a.btn_edit {position: relative; float: left; width: 20px; height: 20px; margin: 0 10px 0 0; background-color: #3975f1; padding: 3px;}
.s_item .c_pts_bg .c_pts_panel a.btn_edit:hover {background-color: #2643f7;}
.s_item .c_pts_bg .c_pts_panel a.btn_edit img {width: 100%;}
.s_item .c_pts_bg .c_pts_panel span.c_pts_checked {position: absolute; top: 0; right: 0; font: 500 9px/11px 'Noto Sans SC', sans-serif; color: #777; text-align: right;}
.s_item .c_pts_bg .c_pts_ico {position: absolute; width: 15%; top: 5px; right: 5px; transform: rotate(-15deg);}
.s_item .c_pts_bg .c_pts_ico img {width: 100%;}

/*** NEW VERSION 3 ***/
.new_task_wrap {position: relative; float: left; width: 100%; padding: 0 0 0 3px;}
.new_task_wrap .task_wrapper {position: relative; z-index: 2; float: left; width: 100%; background: white; border:1px solid #e3e3e3; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; overflow: hidden;}
.t_header_line {position: absolute; z-index: 1; top: 0; left: -3px; width: 100%; height: 100%;}
.t_header_line.warn_red { background-color: #fa6684 !important; }

.new_t_head {position: relative; float: left; width: 100%; padding:15px;}
.new_t_head a { margin: 0 0 0 5px; }
.new_t_head a.t_head {position: relative; float: left; width: auto; height:24px; padding:0 10px; font: 500 9px/24px 'Noto Sans SC', sans-serif; color: #fff;}
.new_t_head a.t_type {background-color: #0f5ef7;}
.new_t_head a.t_courier {background-color: #00a54f;}
.new_t_head a.t_locker {background-color: #15253f;}
.new_t_head a.t_locker img {position:relative; top:50%; height: 13px; margin-top: -6.5px;}
.new_t_head a.t_hold {position:absolute; z-index:10; top:0; left:0; width:100%; height:100px; margin:0; background:rgba(255, 255, 255, 0.4) url(../images/icon/ico_pass_r.png) center 30px no-repeat; background-size: auto 40px;}

.new_t_head .t_items {float: right;}
.new_t_head .t_items img {height: 34px; border: 3px solid white; background:#e3e3e3; transition: all 0.3s;}
.new_t_head .t_items img.img_a {position: absolute; z-index: 1; right: 15px;}
.new_t_head .t_items img.img_b {position: absolute; z-index: 2; right: 32px;}
.new_t_head .t_items img.img_c {position: absolute; z-index: 3; right: 49px;}
.new_t_head .t_items img:hover { z-index: 4; transform: scale(1.3) rotate(5deg); }
.new_t_head .t_items a.t_items_more {position: absolute; z-index: 4; right: 66px; width: 34px; height: 34px; border: 3px solid white; background: rgba(0, 24, 71, 0.65); font: 700 7px/28px 'Noto Sans SC', sans-serif; letter-spacing: .1em; color: #fff; text-align: center;}

.new_task_wrap span.cart_img {position: relative; float: left; width: 18%; margin: 5px 1%; border: 2px solid rgba(219, 223, 229, 1); overflow: hidden;}
.new_task_wrap span.cart_img span.item_sku {position: absolute; top: 50%; left: 0; width: 100%; background-color: rgba(153, 157, 160, 0.75); font: 700 8px/14px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.new_task_wrap span.cart_img span.checked {background-color: rgba(46, 139, 87, 0.75);}
.new_task_wrap span.cart_img img.m_img {float: left; width: 100%; background-color: #f2f2f2;}

.new_t_subhead {position: relative; float: left; width: 100%; margin:15px 0 0 0;}
.new_t_subhead a.t_subhead {position: relative; float: left; width: auto; margin:0 10px 0 0; padding: 0 0 0 22px; background: url(../images/icon/ico_invoices.png) left center no-repeat; background-size: 18px; font: 500 10px/28px 'Noto Sans SC', sans-serif; color: #3a4659;}

.new_t_body {position: relative; float: left; width: 100%; margin:0; padding:15px;}
.new_t_body a.t_body_item {position: relative; float: left; width: 100%; font: 700 12px/20px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.new_t_body p.t_body_word {position: relative; float: left; width: 100%; font: 700 12px/20px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.new_t_body p.t_body_remarks {max-height: 100px; overflow: hidden;}
.new_t_body small {position: relative; float: left; width: 100%; font: 400 9px/10px 'Noto Sans SC', sans-serif; color: #777;}
.new_t_body a.s_more {position: relative; float: left; width: 100%; margin: 5px 0; padding-left: 20px; font: 500 12px/20px 'Noto Sans SC', sans-serif; color: #3975f1;}
.new_t_body a.s_down { background: url(../images/icon/ico_down_sb.png) left center no-repeat; background-size: 16px;}
.new_t_body a.s_up { background: url(../images/icon/ico_up_sb.png) left center no-repeat; background-size: 16px;}

.new_t_tags {position: relative; float: left; width: 100%; margin:10px 0 0 0; padding:0 15px;}
.new_t_tags a { margin: 5px 0 0 5px; }
.new_t_tags a.t_tags {position: relative; float: left; width: auto; height:24px; padding:0 10px; font: 700 8px/24px 'Noto Sans SC', sans-serif; color: #262626;}
.new_t_tags a.t_checked {background-color: #627eea; overflow: hidden;}
.new_t_tags a.t_checked span.t_checked_text {position: relative; z-index: 2; top: 0; left: 0; width: 100%; height: 24px; text-align: center; font: 700 8px/24px 'Noto Sans SC', sans-serif; color: #fff;}
.new_t_tags a.t_checked span.t_checked_shade {position: absolute; z-index: 1; top: 0; left: 0; width: 89%; height: 24px; margin-left: -2px; padding-left: 5px; background: #15253f; transform: skew(-30deg);}

.new_t_footer {position: relative; float: left; width: 100%; margin:15px 0 0 0; padding:15px;}
.new_t_footer span.t_line {position: relative; float: left; width: 100%; height: 1px; margin:5px 0; padding:0 15px; background:#e3e3e3;}
.new_t_footer img.t_icon {width: 100%;}
.new_t_footer a.t_other_item {position: relative; display: inline-block; width: 32px; height: 32px;}
.new_t_footer a.t_other_item:hover {background: #e3e3e3;}
.new_t_footer img.t_other_icon {height: 90%; margin: 5%;}
.new_t_footer span.t_item_dot {position: absolute; top: 0; right: -2px; width: 14px; height: 14px; background-color: #0f5ef7; font: 500 8px/14px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.new_t_footer span.t_item_dot.red {background-color: #990000;}
.new_t_footer .t_footer_item {position: relative; float: left; width: 100%; font: 700 12px/16px 'Noto Sans SC', sans-serif; color: #666;}
.new_t_footer .t_footer_subitem {position: relative; float: left; width: 100%; font: 500 8px/10px 'Noto Sans SC', sans-serif; color: #666;}
.new_t_footer .t_footer_bitem {position: relative; float: left; width: 100%; font: 700 12px/16px 'Noto Sans SC', sans-serif; color: #666; text-align: center;}
.new_t_footer .t_red {color:#990000;}
.new_t_footer .t_bold {font-size: 16px; color:#000;}
.new_t_footer .t_panel {position: relative; float: left; width: 100%; height: 32px; margin: 10px 0 0 0; padding: 0;}
.new_t_footer .t_panel a.ico {position: relative; float: left; width: 32px; height: 32px; margin-right: 6px;}
.new_t_footer .t_panel a.ico.payment {background: url("../images/icon/ico_payment.png") center no-repeat;}
.new_t_footer .t_panel a.ico.receipt {background: url("../images/icon/ico_receipt.png") center no-repeat;}
.new_t_footer .t_panel a.ico.edit {background: url(../images/icon/ico_edit.png) center no-repeat;}
.new_t_footer .t_panel a.ico.mail {background: url("../images/icon/ico_email.png") center no-repeat;}
.new_t_footer .t_panel a.ico.trash {background: url(../images/icon/ico_del.png) center no-repeat;}
.new_t_footer .t_panel a.ico.link {background: url(../images/icon/ico_forward.png) center no-repeat;}
.new_t_footer .t_panel a.ico.print {background: url(../images/icon/ico_print.png) center no-repeat;}
.new_t_footer .t_panel a.ico.completed {float: right !important; margin-right: 0px !important; background: #39945B url(../images/icon/ico_tick_w.png) center no-repeat;}
.new_t_footer .t_panel a.ico {background-size: 24px !important;}
.new_t_footer .t_panel a.ico:hover {background-color: #cedcd1 !important;}
.new_t_footer .t_panel a.ico.completed:hover {background-color: #27673F !important;}

.new_t_sync {position: relative; float: left; width: 100%; margin: 0; padding: 8px 15px 5px 15px; background: rgba(0, 3, 92, 0.12);}
.new_t_sync a {float: left; width: 100%; font: 700 8px/8px 'Nunito', 'Noto Sans SC', sans-serif; font-style: italic !important; color: #000; text-align: right;}

.dialog-box { display: none; }
.dialog-box p {position: relative; float: left; width: 100%; font: 700 14px/18px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.dialog-box small {position: relative; float: left; width: 100%; font: 400 8px/18px 'Noto Sans SC', sans-serif; color: #777;}
.dialog-box-ships img.t_icon {width: 100%;}
.dialog-box-ships small {position: relative; float: left; width: 100%; margin: 5px 0 10px 0; font: 400 9px/10px 'Noto Sans SC', sans-serif; color: #777;}
.dialog-box-pay img.t_icon {width: 100%;}
.dialog-box-pay small {position: relative; float: left; width: 100%; font: 400 9px/10px 'Noto Sans SC', sans-serif; color: #777;}

/*** APP HEADER DIALOG BOX ***/
.app_header .ui-dialog {box-sizing: border-box; margin: 1%; padding: 0 !important; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px; overflow: hidden;}
.app_header .ui-dialog .ui-dialog-content {padding: 5px !important; background: #fff !important;}
.app_header .ui-dialog .ui-dialog-buttonpane {display: none;}
.app_header .ui-dialog .ui-dialog-buttonpane button {padding: 5px 10px !important; font: 400 9px/12px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.app_header .ui-dialog .ui-dialog-titlebar-close {border-radius: 50%; border: 1px solid #e3e3e3; background-image: url(../images/icon/ico_cross.png); background-position: center; background-repeat: no-repeat;  background-size: contain; background-color: rgba(180, 184, 217, 0.8) !important;}
.app_header .ui-dialog a {outline: none !important;}
.app_header .ui-dialog a.t_item {float: left; width: 100%; font: 700 12px/18px 'Noto Sans SC', sans-serif;}
.app_header .ui-dialog-title {font: 700 10px/18px 'Noto Sans SC', sans-serif; color: #1b1b1b;}
.app_header .ui-widget .ui-widget {font-size:0.8em;}
.app_header .ui-widget.ui-widget-content, .ui-widget-content {border-color: rgba(235,238,247,0.9) !important;}
.app_header .ui-widget-header {border: none !important; background: #fff !important;}

.app_header .dialog_settings_wrap {postion: relative; float: left; width: 100%; padding: 5px; background: rgba(180, 184, 217, 0.2); -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;}
.app_header .dialog_settings_wrap .set_sitem {postion: relative; float: left; width: 100%; margin: 0 0 5px 0; background: #fff; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;}
.app_header .dialog_settings_wrap .set_sitem:last-child {margin: 0;}
.app_header .dialog_settings_wrap .td_left {float: left; width: 65%; padding: 5px 5px 5px 15px;}
.app_header .dialog_settings_wrap .td_right {float: left; width: 35%; padding: 5px 15px 5px 5px; text-align: right;}
.app_header .dialog_settings_wrap span.s_font {position: relative; float: left; width: 100%; font: 700 9px/18px 'Noto Sans SC', sans-serif; color: #2b2b2b;}

.app_list .ui-dialog {box-sizing: border-box; margin: 5%; padding: 0 !important; top: 50% !important; transform: translateY(-50%); box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px;}
.app_list .ui-dialog .ui-dialog-content {padding: 5px !important;}
.app_list .ui-dialog .ui-dialog-buttonpane {padding: .3em .5em;}
.app_list .ui-dialog .ui-dialog-buttonpane button {padding: 5px 10px !important; font: 400 9px/12px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.app_list .ui-dialog .ui-dialog-titlebar-close {border-radius: 50%; border: 1px solid #e3e3e3; background-image: url(../images/icon/ico_cross.png); background-position: center; background-repeat: no-repeat;  background-size: contain; background-color: rgba(180, 184, 217, 0.8) !important;}
.app_list .ui-dialog a {outline: none !important;}
.app_list .ui-dialog a.t_item {float: left; width: 100%; font: 700 12px/18px 'Noto Sans SC', sans-serif;}
.app_list .ui-dialog-title {font: 700 10px/18px 'Noto Sans SC', sans-serif;}
.app_list .ui-widget .ui-widget {font-size:0.8em;}
.app_list .ui-widget.ui-widget-content, .ui-widget-content {border-color: rgba(235,238,247,0.9) !important;}
.app_list .ui-widget-header {border: none !important; background: rgba(235,238,247,0.9) !important;}

/*** LANDING DIALOG BOX ***/
.bar_content_wrap .ui-dialog {box-sizing: border-box; margin: 1%; padding: 0 !important; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; overflow: hidden;}
.bar_content_wrap .ui-dialog .ui-dialog-content {padding: 5px !important; background: #fff !important;}
.bar_content_wrap .ui-dialog .ui-dialog-buttonpane button {padding: 5px 10px !important; font: 400 9px/12px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.bar_content_wrap .ui-dialog .ui-dialog-titlebar-close {visibility: hidden; border-radius: 50%; border: 1px solid #e3e3e3; background-image: url(../images/icon/ico_cross.png); background-position: center; background-repeat: no-repeat;  background-size: contain; background-color: rgba(180, 184, 217, 0.8) !important;}
.bar_content_wrap .ui-dialog a {outline: none !important;}
.bar_content_wrap .ui-dialog a.t_item {float: left; width: 100%; font: 700 12px/18px 'Noto Sans SC', sans-serif;}
.bar_content_wrap .ui-dialog-title {font: 700 10px/18px 'Noto Sans SC', sans-serif;}
.bar_content_wrap .ui-widget .ui-widget {font-size:0.8em;}
.bar_content_wrap .ui-widget.ui-widget-content, .ui-widget-content {border-color: rgba(180, 184, 217, 0.4) !important;}
.bar_content_wrap .ui-widget-header {border: none !important; background: #fff !important;}

.bar_content_wrap .dialog_sales_wrap {postion: relative; float: left; width: 100%; padding: 5px; background: rgba(180, 184, 217, 0.2); -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;}
.bar_content_wrap .dialog_sales_wrap .sales_sitem {postion: relative; float: left; width: 100%; margin: 0 0 5px 0; background: #fff; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px;}
.bar_content_wrap .dialog_sales_wrap .sales_sitem:last-child {margin: 0;}
.bar_content_wrap .dialog_sales_wrap .td_left {float: left; width: 50%; padding: 5px 5px 5px 15px;}
.bar_content_wrap .dialog_sales_wrap .td_right {float: left; width: 50%; padding: 5px 15px 5px 5px; text-align: right;}
.bar_content_wrap .dialog_sales_wrap span.s_font {position: relative; float: left; width: 100%; font: 700 10px/18px 'Noto Sans SC', sans-serif; color: #2b2b2b;}

/*** POPUP FEEDBACK FORM ***/
.info_new_content {position: fixed; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; background: rgba(235,238,247,1); padding-top: 50px; overflow: hidden !important;}
.info_left_bar {position: relative; z-index: 1; float: left; width: 18%; height: 94%; margin: 2%; background: #fff; overflow: hidden;}
.info_left_bar .info_left_wrap {position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 20px;}
.info_left_bar .info_left_wrap .info_customer {position: relative; float: left; width: 100%; padding-bottom: 20px; border-bottom: 1px solid #e3e3e3;}
.info_left_bar .info_left_wrap .info_customer img.t_pic {position: relative; float: left; width: 35%;}
.info_left_bar .info_left_wrap .info_customer a.t_title {position: relative; float: left; width: 100%; margin: 5px 0; font: 400 20px/20px 'Noto Sans SC', sans-serif; color: #15253f;}
.info_left_bar .info_left_wrap .info_customer a.t_item {position: relative; float: left; width: 100%; font: 500 12px/18px 'Noto Sans SC', sans-serif; color: #666;}
.info_left_bar .info_left_wrap .info_customer a.t_edit {position: absolute; top: 0; right: 0; width: 24px; height: 24px; padding: 5px; background: #f3f7ff url(../images/icon/ico_edit.png) center no-repeat; background-size: 24px;}
.info_left_bar .info_left_wrap .info_customer a.t_edit:hover {background-color: #ebeef7;}
.info_left_bar .info_left_wrap .info_customer small {position: relative; float: left; width: 100%; font: 400 9px/12px 'Noto Sans SC', sans-serif; color: #fff;}

.info_left_bar .info_left_wrap ul.info_list {position: relative; float: left; width: 100%; margin: 0;}
.info_left_bar .info_left_wrap ul.info_list li.s_item {position: relative; float: left; width: 100%; margin: 15px 0 0 0;}
.info_left_bar .info_left_wrap ul.info_list li.s_item:first-child {margin: 0;}
.info_left_bar .info_left_wrap ul.info_list li.s_item h4.b_title {float: left; width: 100%; margin-bottom: 5px; font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #fff;}
.info_left_bar .info_left_wrap ul.info_list li.s_item .b_img_wrapper {position: relative; float: left; width: 100%; padding-left: 50px;}
.info_left_bar .info_left_wrap ul.info_list li.s_item .b_wrapper {position: relative; float: left; width: 100%;}
.info_left_bar .info_left_wrap ul.info_list li.s_item img.b_img {position: absolute; top: 0; left: 0; width: 32px; background: #BCBEC6;}
.info_left_bar .info_left_wrap ul.info_list li.s_item p.b_item {float: left; width: 100%; font: 500 12px/18px 'Noto Sans SC', sans-serif; color: #666;}
.info_left_bar .info_left_wrap ul.info_list li.s_item p.b_item small {font: 400 9px/18px 'Noto Sans SC', sans-serif; color: #777;}

.info_right_bar {position: relative; z-index: 1; float: left; width: 76%; height: 94%; max-height: 94%; margin: 2% 2% 2% 0; background: #fff; overflow:auto;}
.info_right_bar .info_right_wrap {position: relative; float: left; width: 100%; padding: 20px;}
.info_right_bar .info_right_bar_menu {position: relative; float: left; width: 100%; height: 50px; margin: 10px 0;}
.info_right_bar ul.list_menu {top: -50px !important; left: 50%; width: max-content; height: 30px; border-radius: 20px; background: #e6edf5; padding: 0; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; transform: translateX(-50%);}
.info_right_bar ul.list_menu li {position: relative; float: left; margin: 0;}
.info_right_bar ul.list_menu li button.splide__pagination__page {width: auto; height: 30px; margin: 0; border-radius: 20px; padding: 0 20px; background: none; font: 700 10px/30px 'Noto Sans SC', sans-serif; color: #262626;}
.info_right_bar ul.list_menu li button.splide__pagination__page small.m_count { position: absolute; top: 50%; right: 14px; width: 14px; height: 14px; margin: -7px 0 0 0; background-color: #15253f; font: 400 6.5px/13px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.info_right_bar ul.list_menu li a.m_sub {padding: 0 38px 0 20px;}
.info_right_bar ul.list_menu li button.is-active {
    transform: scale(1);
    background: #6199ed; /* Old browsers */
    background: -moz-linear-gradient(left,  #6199ed 0%, #0f5ef7 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #6199ed 0%,#0f5ef7 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #6199ed 0%,#0f5ef7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6199ed', endColorstr='#0f5ef7',GradientType=1 ); /* IE6-9 */
    color: #fff;
}

.info_right_bar .slide_item {overflow: auto;}
.info_right_bar .info_slide_content {position: relative; float: left; width: 100%;}
.info_right_bar .info_right_content {position: relative; float: left; width: 100%; height: auto; display: grid; grid-gap: 20px; margin: 0; padding: 0 20px; overflow: scroll;}
.grid-layout-one {
    grid-template-columns: repeat(3, 1fr);
	grid-template-areas:
	'header header ships_hold'
    'ships_type ships_option ships_from'
    'ships_tracking ships_date blank_grid'
    'ships_timeframe ships_timeframe ships_timeframe'
    'subheader subheader ships_auto'
    'ships_cost ships_cost ships_cost'
    'addrheader addrheader addrheader'
    'client_details client_contacts client_addr';
    align-items: flex-start;
}
.grid-layout-one .col1 { grid-area: header; }
.grid-layout-one .col2 { grid-area: ships_hold; justify-self: end; }
.grid-layout-one .col3 { grid-area: ships_type; }
.grid-layout-one .col4 { grid-area: ships_option; }
.grid-layout-one .col5 { grid-area: ships_from; }
.grid-layout-one .col6 { grid-area: blank_grid; }
.grid-layout-one .col7 { grid-area: ships_tracking; }
.grid-layout-one .col8 { grid-area: ships_date; }
.grid-layout-one .col9 { grid-area: ships_timeframe; }
.grid-layout-one .col10 { grid-area: subheader; }
.grid-layout-one .col11 { grid-area: ships_auto; justify-self: end; }
.grid-layout-one .col12 { grid-area: ships_cost; }
.grid-layout-one .col13 { grid-area: addrheader; }
.grid-layout-one .col14 { grid-area: client_details; }
.grid-layout-one .col15 { grid-area: client_contacts; justify-self: start; }
.grid-layout-one .col16 { grid-area: client_addr; justify-self: start; }

.grid-layout-one .col_grey { padding: 10px; background: #f3f7ff; }
.grid-layout-one span.b_saved {position: fixed; top: 50px; left: 50%; width: auto; padding: 5px 15px; background: #0f5ef7; font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #fff; transform: translateX(-50%); }
.grid-layout-one span.b_saved {
    -webkit-border-bottom-right-radius: 8px;
    -webkit-border-bottom-left-radius: 8px;
    -moz-border-radius-bottomright: 8px;
    -moz-border-radius-bottomleft: 8px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}

.grid-layout-one h4.b_title {float: left; width: 100%; margin-bottom: 5px; font: 700 12px/20px 'Noto Sans SC', sans-serif; color: #000;}
.grid-layout-one span.b_item {position: relative; float: left; width: 100%; font: 500 10px/20px 'Noto Sans SC', sans-serif; color: #666;}
.grid-layout-one span.b_select {position: relative; float: left; width: 100%;}
.grid-layout-one img.b_ico {position: absolute; top: 3px; right: 0; width: 18px; height: 18px;}
.grid-layout-one input.b_input {position: relative; float: left; width: 100%; border: none; border-bottom: 1px solid #d6e0ef; background: none; font: 500 12px/26px 'Noto Sans SC', sans-serif; color: #1a1a1a;}
.grid-layout-one input[readonly] {padding: 0 10px; background: #f3f7ff; border-bottom-color: #f8fafb;}
.grid-layout-one textarea.b_input {position: relative; float: left; width: 100%; border: none; border-bottom: 1px solid #d6e0ef; background: none; font: 500 12px/26px 'Noto Sans SC', sans-serif; color: #1a1a1a; resize: none;}
.grid-layout-one .opt_btn {border-bottom: 1px solid rgba(0, 3, 92, 0.24) !important;}

.grid-layout-third {position: relative; float: left; width: 100%; padding: 20px; display: grid; grid-gap: 20px; margin: 5px 0 20px 0; background: #f3f7ff;}
.grid-layout-third {
    grid-template-columns: repeat(3, 1fr);
	grid-template-areas:
	'header header header'
    'sales_host sales_item sales_qty'
    'sales_type sales_remarks sales_price'
    'sales_add_btn sales_add_btn sales_add_btn';
    align-items: start;
}
.grid-layout-third .col1 { grid-area: header; }
.grid-layout-third .col2 { grid-area: sales_host; }
.grid-layout-third .col3 { grid-area: sales_item; }
.grid-layout-third .col4 { grid-area: sales_qty; }
.grid-layout-third .col5 { grid-area: sales_type; }
.grid-layout-third .col6 { grid-area: sales_remarks; }
.grid-layout-third .col7 { grid-area: sales_price; }
.grid-layout-third .col8 { grid-area: sales_add_btn; }

.grid-layout-third label {position: relative; float: left; width: 100%; margin: 0 0 15px 0;}
.grid-layout-third h4.b_title {float: left; width: 100%; margin-bottom: 5px; font: 700 12px/20px 'Noto Sans SC', sans-serif; color: #000;}
.grid-layout-third span.b_item {position: relative; float: left; width: 100%; font: 500 10px/20px 'Noto Sans SC', sans-serif; color: #666;}
.grid-layout-third span.b_item small {color: #0f5ef7;}
.grid-layout-third span.b_select {position: relative; float: left; width: 100%;}
.grid-layout-third span.b_label {font: 400 9px/18px 'Noto Sans SC', sans-serif; color: #0f5ef7;}
.grid-layout-third img.b_ico {position: absolute; top: 3px; right: 0; width: 18px; height: 18px;}
.grid-layout-third img.b_small {top: 6px; width: 12px; height: 12px;}
.grid-layout-third input.b_input {position: relative; float: left; width: 100%; border: none; border-bottom: 1px solid #d6e0ef; background: none; font: 500 12px/26px 'Noto Sans SC', sans-serif; color: #1a1a1a;}
.grid-layout-third input[readonly] {padding: 0 10px; background: #f3f7ff; border-bottom-color: #f8fafb;}
.grid-layout-third textarea.b_input {position: relative; float: left; width: 100%; border: none; border-bottom: 1px solid #d6e0ef; background: none; font: 500 12px/26px 'Noto Sans SC', sans-serif; color: #1a1a1a; resize: none;}
.grid-layout-third .opt_btn {border-bottom: 1px solid #d6e0ef !important;}
.grid-layout-third a.btn_add_center {position: absolute; bottom: -11px; left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); padding: 3px 20px 3px 25px; background: #2643f7 url("../images/icon/ico_add_w.png") 5px center no-repeat; background-size: 16px; font: 700 11px/18px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.grid-layout-third a.btn_add_center:hover {background-color: #21387c;}

.grid-layout-fourth {position: relative; float: left; width: 100%; padding: 20px; display: grid; grid-gap: 20px; margin: 5px 0 20px 0;}
.grid-layout-fourth {
    grid-template-columns: repeat(3, 1fr);
	grid-template-areas:
	'header header header';
    align-items: start;
}
.grid-layout-fourth > div {
  text-align: center;
  padding: 10px 0;
  font-size: 30px;
}
.grid-layout-fourth .col1 {grid-area: header;}
.grid-layout-fourth h4.b_title { font: 700 12px/20px 'Noto Sans SC', sans-serif; color: #000}
.grid-layout-fourth .f_cart_card {position: relative; float: left; width: 100%; margin-bottom: 20px !important; padding: 15px; border: 1px solid #d6e0ef; background-color: #f3f7ff;}
.grid-layout-fourth .bg_checked {
    background: rgb(184,213,205); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(184,213,205,1) 0%, rgba(255,255,255,1) 37%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(184,213,205,1) 0%,rgba(255,255,255,1) 37%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(184,213,205,1) 0%,rgba(255,255,255,1) 37%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b8d5cd', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

.grid-layout-fourth .bg_unchecked {
    background: rgb(243,247,255); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(243,247,255,1) 0%, rgba(255,255,255,1) 37%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(243,247,255,1) 0%,rgba(255,255,255,1) 37%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(243,247,255,1) 0%,rgba(255,255,255,1) 37%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3f7ff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

.grid-layout-fourth .bg_returned {
    background: rgb(239,154,154); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(239,154,154,1) 0%, rgba(255,255,255,1) 37%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(239,154,154,1) 0%,rgba(255,255,255,1) 37%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(239,154,154,1) 0%,rgba(255,255,255,1) 37%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ef9a9a', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

.grid-layout-fourth .cart_card {position: relative; float: left; width: 100%;}
.grid-layout-fourth .cart_card .card_header {position: relative; float: left; width: 100%; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #e3e3e5;}
.grid-layout-fourth .cart_card .card_header .card_img {position: relative; left: 50%; float: left; width: 25%; margin: 0 0 10px 0; padding: 2px; background-color: #3975f1; transform: translateX(-50%); overflow: hidden;}
.grid-layout-fourth .cart_card .card_header img.f_img {position: absolute; top: -20px; left: -20px; width: 25%;}
.grid-layout-fourth .cart_card .card_header .card_img img.m_img {float: left; width: 100%; background-color: #06014b;}
.grid-layout-fourth .cart_card .card_header a.btn_del {position: absolute; top: 0; right: 0; width: 20px; height: 20px; background-color: #C15F68; padding: 3px;}
.grid-layout-fourth .cart_card .card_header a.btn_del:hover {background-color: #A5414A;}
.grid-layout-fourth .cart_card .card_header a.btn_del img {width: 100%;}
.grid-layout-fourth .cart_card .card_header a.btn_edit {position: absolute; top: 0px; right: 33px; width: 20px; height: 20px; background-color: #3975f1; padding: 3px;}
.grid-layout-fourth .cart_card .card_header a.btn_edit:hover {background-color: #2643f7;}
.grid-layout-fourth .cart_card .card_header a.btn_edit img {width: 100%;}
.grid-layout-fourth .cart_card .card_header .btn_check {top: 0; right: 69px;}
.grid-layout-fourth .cart_card .card_header h3.card_title {float: left; width: 100%; font: 700 14px/28px 'Noto Sans SC', sans-serif; color: #1a1649;}
.grid-layout-fourth .cart_card .card_header h3.card_title small {float: left; width: 100%; height: 36px; font: 500 10px/18px 'Noto Sans SC', sans-serif; color: #686868;}
.grid-layout-fourth .cart_card .card_header .card_tags {position: relative; left: 50%; float: left; width: auto; margin: 0 0 5px 0; transform: translateX(-50%); overflow: hidden;}
.grid-layout-fourth .cart_card .card_header .card_tags span.tags_name {float: left; margin: 0 5px; padding: 5px 15px; border: 1px solid #777; font: 700 9px/9px 'Noto Sans SC', sans-serif; color: #777;}
.grid-layout-fourth .cart_card .card_content {position: relative; float: left; width: 100%; margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px solid #e3e3e5;}
.grid-layout-fourth .cart_card .card_content span.card_subtitle {float: left; width: 100%; margin-bottom: 5px; font: 700 10px/16px 'Noto Sans SC', sans-serif; color: #111;}
.grid-layout-fourth .cart_card .card_content span.card_subtitle small {font: 500 10px/16px 'Noto Sans SC', sans-serif; color: #afacb0;}
.grid-layout-fourth .cart_card .card_content span.card_subtitle big {font: 700 16px/20px 'Noto Sans SC', sans-serif;}

.grid-layout-simple {position: relative; float: left; width: 100%; background: #fff; padding: 5px; border: 1px solid #e8ecf6; overflow: hidden;}
.grid-layout-simple .grid-header {position: relative; float: left; width: 100%; background: #ebeef7; padding: 5px;}
.grid-layout-simple .grid-header .grid-img {position: relative; left: 50%; float: left; width: 80px; margin: 10px 0 10px -40px; border: 1px solid #0f5ef7; background: #fff;}
.grid-layout-simple .grid-header h3.b_title {float: left; width: 100%; font: 700 14px/20px 'Noto Sans SC', sans-serif; color: #1a1649; text-align: center;}
.grid-layout-simple .grid-header h3.b_title small {float: left; width: 100%; font: 500 10px/16px 'Noto Sans SC', sans-serif; color: #686868; text-align: center;}
.grid-layout-simple .grid-header .grid-tags {position: relative; left: 50%; float: left; width: 100%; margin: 10px 0 15px 0; transform: translateX(-50%); text-align: center;}
.grid-layout-simple .grid-header .grid-tags span.s_tags {position: relative; margin: 0 5px 0 0; padding: 4px 12px; border: 1px solid #585858; font: 500 9px/9px 'Noto Sans SC', sans-serif; color:#585858;}
.grid-layout-simple .grid-content {position: relative; float: left; width: 100%; margin: 10px 5px 0 15px;}
.grid-layout-simple .grid-content strong {float: left; width: 100%; font: 700 12px/16px 'Noto Sans SC', sans-serif; color: #1a1649;}
.grid-layout-simple .grid-content small {float: left; width: 100%; margin-bottom: 15px; font: 500 10px/10px 'Noto Sans SC', sans-serif; color: #686868;}
.grid-layout-simple .grid-content a.ico {position: relative; left: 50%; float: left; width: 32px; height: 32px; margin: 0 0 0 -16px; background-color: #f2f5fd; text-align: center;}
.grid-layout-simple .grid-content a.ico.trash {background: #ff365f url(../images/icon/ico_del_w.png) center no-repeat;}
.grid-layout-simple .grid-content a.ico {background-size: 28px !important;}
.grid-layout-simple .grid-content a.ico.trash:hover {background-color: #e9002f !important; color: #fff !important;}

.grid-layout-search {position: relative; float: left; width: 100%; box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;}
.grid-layout-search .search_content {position: relative; float: left; width: 100%; background: #f3f7ff;}
.grid-layout-search .search_content input[type=search] {position: relative; float: left; width: 100%; padding: 11px 10px; background: none; border: none; font: 500 12px/18px 'Noto Sans SC', sans-serif; color: #111;}
.grid-layout-search .search_content .search_header {position: relative; float: left; width: 20%; border-right: 1px solid #dde1e7;}
.grid-layout-search .search_content .search_body {position: relative; float: left; width: 80%;}
.grid-layout-search .search_content .opt_btn {height: 40px !important; padding: 0 20px !important; line-height: 40px !important; border: none !important;}
.grid-layout-search .search_content .opt_menu {top: 40px !important;}
.grid-layout-search .search_content img.b_ico {position: absolute; top: 11px; right: 10px; width: 18px; height: 18px;}

.opt_search_menu {display: block; position: absolute; z-index: 100; top: 42px; left: 0px; width: 100%; background: #fff; padding: 20px 20px 0 20px; box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;}
.opt_search_menu ul.search_items {position: relative; float: left; width: 100%;}
.opt_search_menu ul.search_items li.s_item {position: relative; float: left; width: 100%; margin: 0 0 10px 0;}
.opt_search_menu ul.search_items li.s_item:last-child {border-top: 1px solid #d6e0ef; margin: 10px 0 20px 0; padding: 20px 0 0 0;}
.opt_search_menu ul.search_items .s_header {position: relative; float: left; width: 20%; font: 700 10px/40px 'Noto Sans SC', sans-serif; color: #1a1649;}
.opt_search_menu ul.search_items .s_header small {color: #0f5ef7;}
.opt_search_menu ul.search_items .s_input {position: relative; float: left; width: 80%;}
.opt_search_menu ul.search_items .s_input input.b_input {position: relative; float: left; width: 100%; padding: 5px 10px; border: 1px solid #d6e0ef; background: none; font: 500 12px/26px 'Noto Sans SC', sans-serif; color: #1a1a1a;}
.opt_search_menu ul.search_items .s_input textarea.b_input {position: relative; float: left; width: 100%; border: none; border-bottom: 1px solid #d6e0ef; background: none; font: 500 12px/26px 'Noto Sans SC', sans-serif; color: #1a1a1a; resize: none;}
.opt_search_menu ul.search_items a.btn_add {position: relative; float: right; width: max-content; margin: 0; padding: 6px 10px 8px 30px; background: #0f5ef7; box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px; font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #f2f5fd; letter-spacing: .1em; text-align: center; transition: all 0.7s;}
.opt_search_menu ul.search_items a.btn_add:hover {color: #fff;}
.opt_search_menu ul.search_items a.btn_add span.t_img {position: absolute; top: 5px; left: 5px; width: 20px; height: 20px; padding: 2px; overflow: hidden; transition: all 0.7s;}
.opt_search_menu ul.search_items a.btn_add span.t_img img {width: 100%;}
.opt_search_menu ul.search_items a.btn_add:hover span.t_img { transform: rotate(360deg); }
.opt_search_menu ul.search_items a.btn_cancel {position: relative; float: right; width: max-content; margin: 0 10px 0 0; padding: 6px 10px 8px 30px; background: #e12925; box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px; font: 700 10px/20px 'Noto Sans SC', sans-serif; color: #f2f5fd; letter-spacing: .1em; text-align: center; transition: all 0.7s;}
.opt_search_menu ul.search_items a.btn_cancel:hover {color: #fff;}
.opt_search_menu ul.search_items a.btn_cancel span.t_img {position: absolute; top: 5px; left: 5px; width: 20px; height: 20px; padding: 2px; overflow: hidden; transition: all 0.7s;}
.opt_search_menu ul.search_items a.btn_cancel span.t_img img {width: 100%;}
.opt_search_menu ul.search_items a.btn_cancel:hover span.t_img { transform: rotate(360deg); }

/*** PAGING VERSION 2 ***/
.frame_content .app_paging {position: relative; float: left; width: 100%; margin: 10px 0 20px 0;}
.frame_content .app_paging ul.page_list {position: relative; float: left; left: 50%; transform: translateX(-50%);}
.frame_content .app_paging ul.page_list li {float: left; margin: 0 5px;}
.frame_content .app_paging ul.page_list a.p_item {float: left; width: 40px; height: 40px; font: 700 11px/40px 'Noto Sans SC', sans-serif; color: #7c8594; text-align: center;}
.frame_content .app_paging ul.page_list a.p_item:hover {font-weight: 700; color: #0f5ef7;}
.frame_content .app_paging ul.page_list a.active {background: #fff; font-weight: 400; color: #0f5ef7;}

/*** SELECTION ***/
.b_list {position: relative;}
.b_list .selection .opt_btn {border: none; border-bottom: 1px solid #d6e0ef; border-radius: 0; padding: 0;}
.b_list ul.opt_items {border: 1px solid #d6e0ef;}
.b_list .opt_menu {top: 25px;}

.m_list {position: relative;}
.m_list .selection .opt_btn {border: none; border-bottom: 1px solid #d6e0ef; border-radius: 0; padding: 0; background: none;}
.m_list ul.opt_items {border: 1px solid #d6e0ef;}
.m_list .opt_menu {top: 25px;}

/*** POP UP FEEDBACK 2 ***/
.wrap_info .v2_info_header {position: fixed; top: 0; left: 0; z-index: 10; width: 100%; height: 100px; background-color: rgba(255,255,255,0.95);}
.wrap_info .v2_info_header .header_top {position: relative; float: left; width: 100%; height: 50px; padding: 0 2%;}
.wrap_info .v2_info_header .header_top a.btn_back {position: relative; float: left; width: 30px; height: 30px; margin: 10px 0; padding: 0; background: #eff1f4;}
.wrap_info .v2_info_header .header_top a.btn_back:hover {background: #c9c9c9;}
.wrap_info .v2_info_header .header_top a.btn_back img {width: 80%; margin: 10%;}
.wrap_info .v2_info_header .header_top .b_title {position: relative; float: left; margin: 10px 0;}
.wrap_info .v2_info_header .header_top .sub_top {position: relative; float: left; width: 100%; font: 500 12px/15px 'Noto Sans SC', sans-serif; color: #1a2461;}
.wrap_info .v2_info_header .header_top .sub_btm {position: relative; float: left; width: 100%; font: 400 10px/15px 'Noto Sans SC', sans-serif; color: #878cac;}
.wrap_info .v2_info_header .header_top .sub_line {position: relative; float: left; width: 1px; height: 20px; margin: 15px 20px; background: #e7e9ee;}
.wrap_info .v2_info_header .header_top .b_logo {position: relative; float: right; height: 30px; margin: 10px 0;}
.wrap_info .v2_info_header .header_top .b_logo img {height: 100%;}

.wrap_info .v2_info_header .header_btm {position: relative; float: left; width: 100%; height: 50px; border: solid #e7e9ee; border-width: 1px 0; background: #eff1f4; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; overflow: hidden;}
.wrap_info .v2_info_header .header_btm .sub_line {position: relative; float: left; width: 1px; height: 20px; margin: 15px 20px; background: #d2d4d9;}
.wrap_info .v2_info_header .header_btm .btm_left {position: relative; float: left; width: 70%; height: 50px; padding: 0 2%;}
.wrap_info .v2_info_header .header_btm .btm_left .sub_item {position: relative; float: left; margin: 10px 0; font: 500 12px/30px 'Noto Sans SC', sans-serif; color: #7c8594;}
.wrap_info .v2_info_header .header_btm .btm_left .sub_item strong {font: 700 12px/30px 'Noto Sans SC', sans-serif; color: #1a2461;}

.wrap_info .v2_info_header .header_btm .btm_right {position: relative; float: left; width: 30%; height: 50px; padding: 0 2%; border-left: 1px solid #d2d4d9;}
.wrap_info .v2_info_header .header_btm .btm_right .b_item {position: relative; float: left; width: 100%; height: 100%;}
.wrap_info .v2_info_header .header_btm .btm_right .b_ico {position: absolute; z-index: 5; top: 15px; left: 0; width: 20px; height: 20px;}
.wrap_info .v2_info_header .header_btm .btm_right .b_ico img {height: 100%;}
.wrap_info .v2_info_header .header_btm .btm_right .f_search {position: relative; float: left; width: 100%; height: 50px; border: none; background-color: #eff1f4; padding: 10px 10px 10px 30px; font: 700 12px/50px 'Noto Sans SC', sans-serif; color: #1a2461;}
.wrap_info .v2_info_header .header_btm .btm_right span.opt_loader {display: none; position: absolute; top: 50%; right: -20px; width: 34px; height: 34px; background: url(../images/loader_water.gif) center no-repeat; background-size: 24px; transform: translateY(-50%);}

.wrap_info .v2_info_content {position: fixed; top: 0; left: 0; z-index: 2; width: 100%; height: 100%; padding-top: 100px; background-color: rgba(255,255,255,0.95);}
.wrap_info .v2_info_content .content_left {position: relative; float: left; width: 70%; height: 100%; padding: 20px 2%; overflow: auto;}
.wrap_info .v2_info_content .content_left .new_h_list {display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); grid-gap: 20px; padding: 0 15px;}
.wrap_info .v2_info_content .content_left .new_h_list .m_item {position: relative; float: left; width: 100%;}
.wrap_info .v2_info_content .content_left .new_h_list .m_item_wrap {position: relative; float: left; width: 100%; padding: 15px; border: 1px solid #eff1f4; background: rgba(243,245,249,1);}
.wrap_info .v2_info_content .content_left .new_h_list .m_item h3 {position: relative; float: left; width: 100%; margin-bottom: 15px; font: 700 12px/12px 'Noto Sans SC', sans-serif; color: #1a2461; text-align: center;}
.wrap_info .v2_info_content .content_left .new_h_list .d_item {position: relative; z-index: 2; float: left; width: 100%; min-height: 50px; padding: 15px; border: 1px dashed #0f5ef7; background: rgba(255,255,255,0.15); font: 500 12px/18px 'Noto Sans SC', sans-serif; color: #7c8594; text-align: center;}
.wrap_info .v2_info_content .content_left .new_h_list .d_item_inner {position: absolute; z-index: 1; top: 60px; left: 0; width: 100%; font: 400 12px/12px 'Noto Sans SC', sans-serif; color: #0f5ef7; text-align: center;}
.wrap_info .v2_info_content .content_left .new_h_list .s_item {position: relative; float: left; width: 100%; padding: 15px; font: 500 12px/18px 'Noto Sans SC', sans-serif; color: #333; text-align: center;}
.wrap_info .v2_info_content .content_left .new_h_list .s_item strong {font-weight: 500; color: #333;}

.wrap_info .v2_info_content .content_left .new_h_list .m_item .ccs_list {position: relative; float: left; width: 100%; margin: 15px 0 10px 0;}
.wrap_info .v2_info_content .content_left .new_h_list .m_item .ccs_list li.s_full {position: relative; float: left; width: 100%; margin: 5px 0 0 0; border-bottom: 1px solid #e3e3e3; padding: 0 0 5px 0;}
.wrap_info .v2_info_content .content_left .new_h_list .m_item .ccs_list li.s_full strong {font: 700 13px/20px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.wrap_info .v2_info_content .content_left .new_h_list .m_item .ccs_list li.s_full span.c_stock {float: left; margin-right: 15px; background: #15253f; padding: 5px 15px; font: 700 10px/10px 'Noto Sans SC', sans-serif; color: #fff;}
.wrap_info .v2_info_content .content_left .new_h_list .m_item .ccs_list li.s_full span.c_item {float: left; margin-right: 15px; font: 500 11px/20px 'Noto Sans SC', sans-serif; color: #666;}
.wrap_info .v2_info_content .content_left .new_h_list .m_item .ccs_list li.s_full span.c_right {float: right; font: 500 11px/20px 'Noto Sans SC', sans-serif; color: #666;}
.wrap_info .v2_info_content .content_left .new_h_list .m_item .ccs_list li.s_full span.no_item {float: left; width: 100%; font: 400 11px/20px 'Noto Sans SC', sans-serif; color: #7c8594; text-align: center;}
.wrap_info .v2_info_content .content_left .new_h_list .m_item .ccs_list li.s_panel {position: relative; float: left; width: 100%; margin: 15px 0 0 0;}
.wrap_info .v2_info_content .content_left .new_h_list .m_item .ccs_list li.s_panel span.c_dtime {float: left; margin: 5px 0; font: 400 9px/24px 'Noto Sans SC', sans-serif; color: #666;}

.wrap_info .v2_info_content .content_right {position: relative; float: left; width: 30%; height: 100%; padding: 20px 2%; border-left: 1px solid #d2d4d9; overflow: hidden;}
.wrap_info .v2_info_content .content_right span.search_loader {display: none; position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; background: rgba(239, 241, 244, 0.35) url(../images/loader_water.gif) center no-repeat; background-size: 36px;}
.wrap_info .v2_info_content .content_right_wrap {position: relative; float: left; width: 100%; height: 100%; padding: 0; overflow: auto;}
.wrap_info .v2_info_content .content_right_wrap ul.list_items {position: relative; z-index: 1; float: left; width: 100%;}
.wrap_info .v2_info_content .content_right_wrap ul.list_items li {position: relative; float: left; width: 100%;}
.wrap_info .v2_info_content .content_right_wrap ul.list_items .s_item {position: relative; float: left; width: 100%; padding: 10px 0; border-bottom: 1px solid #e7e9ee; font: 500 10px/30px 'Noto Sans SC', sans-serif; color: #666;}
.wrap_info .v2_info_content .content_right_wrap ul.list_items span.c_item {float: left; width: 8%; padding: 4px 15px 16px 0; font: 700 10px/10px 'Noto Sans SC', sans-serif; color: #1a2461;}
.wrap_info .v2_info_content .content_right_wrap ul.list_items span.c_content {float: left; width: 77%; padding: 3px 15px 3px 0; font: 500 10px/12px 'Noto Sans SC', sans-serif; color: #1a2461;}
.wrap_info .v2_info_content .content_right_wrap ul.list_items span.c_content strong {float: left; width: 100%;}
.wrap_info .v2_info_content .content_right_wrap ul.list_items span.c_content small {float: left; width: 100%;}
.wrap_info .v2_info_content .content_right_wrap ul.list_items span.c_right {position: absolute; top: 50%; right: 0; width: 15%; font: 500 10px/12px 'Noto Sans SC', sans-serif; color: #666; text-align: right; transform: translateY(-50%);}

/*** POS SYSTEM ***/
.pos_container {position: absolute !important; min-height: 100% !important; padding: 0 0 30px 0;}
.new_global_pos {position: absolute !important; top: 0; left: 0; width: 100%; height: 100%; padding-left: 60px !important; background-color: #fff; overflow: hidden;}
#pos_frame {position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding-top: 60px; background: rgba(243, 245, 249, 1); overflow: hidden;}
.input_pos_search {text-transform: uppercase;}

/*** POS LEFT COLUMN ***/
.pos_left {position: absolute; top: 0; left: 0; width: 75%; height: 100%; padding: 60px 0 0 60px; border-right: 1px solid #dbdfe5;}
.pos_left .pos_left_header {position: absolute; z-index: 2; top: 60px; left: 0; width: 100%; height: 80px; padding: 0 0 0 60px; background: #fff; border-bottom: 1px solid #dbdfe5;}
.pos_left .pos_left_header .submenu_wrap {position: relative; float: left; width: 100%; padding: 0;}
.pos_left .pos_left_header .submenu_wrap .list_menu {position: relative; float: left; width: 100%; padding: 20px 0; white-space: nowrap; overflow: auto !important;}
.pos_left .pos_left_header .submenu_wrap .list_menu a.b_link {display: inline-block; position: relative; float: none; margin: 0 0 0 10px; padding: 10px 20px 12px 20px; border: 1px solid #dbdfe5; background: none; font: 500 14px/14px 'Noto Sans SC', sans-serif; color: #262626;}
.pos_left .pos_left_header .submenu_wrap .list_menu a.b_link:first-child {margin-left: 20px;}
.pos_left .pos_left_header .submenu_wrap .list_menu a.b_link:last-child {margin-right: 20px;}
.pos_left .pos_left_header .submenu_wrap .list_menu a.b_link:hover {background: #0f5ef7; color: #fff;}
.pos_left .pos_left_header .submenu_wrap .list_menu a.active {background: #0f5ef7; color: #fff;}

.pos_search_wrap {position: relative; float: left; width: 100%; height: 100%; padding: 15px 0;}
.pos_search_wrap .b_ico {position: absolute; top: 5px; left: 0; width: 70px; height: 40px; padding: 5px;}
.pos_search_wrap .b_ico img {float: left; width: 60%; margin: 0 20%;}

.pos_search_wrap .search_left {position: relative; float: left; width: 60%; height: 100%; padding: 0 20px 0 70px; border-right: 2px solid #c9c9c9;}
.pos_search_wrap .search_left input[type=text] {float: left; width: 100%; padding: 5px 0; background: none; border: none; font: 500 14px/40px 'Noto Sans SC', sans-serif; color: #262626; text-transform: uppercase;}
.pos_search_wrap .search_left input[type=text]::-webkit-input-placeholder { /* Edge */ color: #b3bac8;}
.pos_search_wrap .search_left input[type=text]:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #b3bac8;}
.pos_search_wrap .search_left input[type=text]::placeholder {color: #b3bac8;}

.pos_search_wrap .search_right {position: relative; float: left; width: 40%; padding-right: 85px;}
.pos_search_wrap .full_width {position: relative; float: left; width: 100%; margin: 5px 0 0 0;}
.pos_search_wrap .pos_selection {position: relative; float: left; width: 100%; margin: 0; padding: 0 20px 0 70px;}
.pos_search_wrap .pos_selection .pos_opt_btn {position: relative; float: left; width: 100%; height: 40px; padding: 0 30px 0 0; background: #fff url(../images/icon/ico_down_b.png) 98% center no-repeat; background-size: 24px; border: none; font: 700 16px/40px 'Noto Sans SC', sans-serif; color: #1a1a1a; text-align: left; overflow: hidden !important;}
.pos_search_wrap .pos_selection .pos_opt_btn.active {background-color: #fff;}
.pos_search_wrap .pos_opt_menu {display: none; position: absolute; z-index: 100; top: 60px; left: 0px; width: 100%; padding-top: 0px;}
.pos_search_wrap .pos_opt_menu ul.pos_opt_items {position: relative; float: left; width: 100%; max-height: 150px; padding: 5px 0; border: 1px solid #c9c9c9; border-top: none; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; background: #fff; overflow: auto; overflow-x: hidden !important;}
.pos_search_wrap .pos_opt_menu ul.pos_opt_items {
    -webkit-border-bottom-right-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}
.pos_search_wrap .pos_opt_menu ul.pos_opt_items li {float: left; width: 100%; margin: 0px !important; text-align: left; overflow: auto; white-space: nowrap;}
.pos_search_wrap .pos_opt_menu ul.pos_opt_items a.s_item {display: inline-block; position: relative; float: left; width: 100%; padding: 0 10px; box-sizing: border-box; font: 700 11px/30px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.pos_search_wrap .pos_opt_menu ul.pos_opt_items a.s_item:hover {background-color: #418cfa; color: #fff;}
.pos_search_wrap .pos_opt_menu ul.pos_opt_items a.s_item span.s_descp {position: absolute; top: 0; right: 3%; font: 700 8px/30px 'Noto Sans SC', sans-serif; color: #9c9c9c;}
.pos_search_wrap .pos_opt_menu ul.pos_opt_items a.s_select {color: #9c9c9c;}
.pos_search_wrap .pos_opt_menu ul.pos_opt_items a.s_select:hover {color: #9c9c9c; background-color: transparent;}

.pos_search_wrap a.btn_del {position: absolute; z-index: 2; top: 50%; right: 16px; padding: 5px 12px 7px 28px; background: #ff365f url(../images/icon/ico_cross_w.png) 8px center no-repeat; background-size: 16px; font: 500 12px/12px 'Noto Sans SC', sans-serif; color: #fff; transform: translateY(-50%);}
.pos_search_wrap a.btn_del:hover {background-color: #e9002f;}

.pos_left_content {position: relative; float: left; width: 100%; height: 100%; padding: 80px 0 0 0;}
.pos_left_content .pos_list {position: relative; float: left; width: 100%; height: 100%; padding: 20px 0; overflow: auto;}
.pos_left_content .pos_list .new_no_list {position: relative; float: left; width: 100%; padding: 15px;}
.pos_left_content .pos_list .new_no_list .pos_no_item {position: relative; float: left; width: 100%; padding: 200px 0 0 0; background: url(../images/icon/v3/ico_bill.png) center 30px no-repeat; background-size: 138px; font: 400 16px/16px 'Noto Sans SC', sans-serif; color: #9c9c9c; text-align: center;}
.pos_left_content .pos_list .new_no_list .pos_no_item strong { float: left; width: 100%; font: 400 30px/40px 'Noto Sans SC', sans-serif; color: #666; text-align: center;}
.pos_left_content .pos_list .new_no_list .pos_no_item small { float: left; width: 100%; font: 400 14px/30px 'Noto Sans SC', sans-serif; color: #9c9c9c; text-align: center;}
.pos_left_content .pos_list .new_no_list .pos_no_item a.btn_search {position: relative; left: 50%; float: left; width: auto; margin: 10px 0 0 0; padding: 10px 20px 12px 34px; border: 1px solid #0f5ef7; background: #0f5ef7 url(../images/icon/ico_double_up_w.png) 12px center no-repeat; background-size: 14px; font: 500 14px/14px 'Noto Sans SC', sans-serif; color: #fff; text-align: center; transform: translateX(-50%);}
.pos_left_content .pos_list .new_no_list .pos_no_item a.btn_search:hover {background-color: #0c4dc9;}

.pos_left_content .pos_list .new_t_list {display: grid; grid-template-columns: repeat(auto-fill, minmax(1fr)); grid-gap: 15px; padding: 0 15px;}
.pos_left_content .pos_wrap {position: relative; float: left; width: 100%; padding: 20px; background: #fff;}
.pos_left_content .pos_wrap .pos_cola {width: 25%;}
.pos_left_content .pos_wrap .pos_colb {width: 75%;}

.pos_left_content .pos_wrap .pos_img_wrap {position: relative; z-index: 1; float: left; width: 90%; height: 100%; margin: 0 10% 20px 0; background-color: #ebeef7; overflow: hidden;}
.pos_left_content .pos_wrap .pos_img_wrap .img_wrap {position: relative; float: left; background-position: center; background-repeat: no-repeat; background-size: contain;}
.pos_left_content .pos_wrap .pos_img_wrap .img_center {width: 100%; height: 108px; background-position: center; background-repeat: no-repeat; background-size: 70%;}
.pos_left_content .pos_wrap .pos_img_wrap .img_header {position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden;}
.pos_left_content .pos_wrap .pos_img_wrap .img_full {position: absolute; top: 0; left: 50%; width: auto; height: 100%; transform: translateX(-50%);}

.pos_left_content .pos_wrap .pos_details {position: relative; float: left; width: 100%; margin-bottom: 20px;}
.pos_left_content .pos_wrap .pos_details .b_title {position: relative; float: left; width: 100%; font: 700 12px/16px 'Noto Sans SC', sans-serif; color: #2b2b2b; word-wrap: break-word;}
.pos_left_content .pos_wrap .pos_details .b_title .b_header {position: relative; float: left; width: 100%; padding-right: 90px; }
.pos_left_content .pos_wrap .pos_details .b_title small {float: left; width: 100%; font: 500 11px/16px 'Noto Sans SC', sans-serif; color: #666;}
.pos_left_content .pos_wrap .pos_details .b_id {float: left; margin: 10px 5px 0 0; padding: 0 10px; background: #2b2b2b; font: 700 11px/23px 'Noto Sans SC', sans-serif; color: #fff;}
.pos_left_content .pos_wrap .pos_details .b_price {position: absolute; top: 0; right: 20px; font: 700 14px/18px 'Noto Sans SC', sans-serif; color: #0f5ef7; text-align: right;}
.pos_left_content .pos_wrap .pos_details .b_price em {text-decoration: line-through; font-weight: 400; color: #666;}

.pos_left_content .pos_wrap .pos_qty {position: relative; z-index: 2; float: left; width: 90%; margin-right: 10%;}
.pos_left_content .pos_wrap .pos_qty a.btn_qty {position: relative;  z-index: 2; float: left; width: 15%; height: auto; border: 1px solid #dbdfe5;}
.pos_left_content .pos_wrap .pos_qty a.btn_qty:hover {background-color: #ebeef7;}
.pos_left_content .pos_wrap .pos_qty a.btn_minus {margin-right: 35%;}
.pos_left_content .pos_wrap .pos_qty a.btn_minus img {width: 100%;}
.pos_left_content .pos_wrap .pos_qty a.btn_plus {margin-left: 35%;}
.pos_left_content .pos_wrap .pos_qty a.btn_plus img {width: 100%;}
.pos_left_content .pos_wrap .pos_qty .pos_input {position: absolute; z-index: 1; top: 50%; left: 20%; margin: 0; width: 60%; height: 100%; background: #0f5ef7; text-align: center; transform: translateY(-50%);}
.pos_left_content .pos_wrap .pos_qty .pos_input span {position: absolute; z-index: 1; top: 50%; left: 0; width: 100%; margin-top: -7px; font: 700 14px/14px 'Noto Sans SC', sans-serif; color: #fff;}

.pos_left_content .pos_wrap .pos_btn_cart {position: relative; float: left; width: 100%;}
.pos_left_content .pos_wrap .pos_btn_cart a.btn_add_cart {position: relative; float: left; width: 100%; padding: 10px 20px 12px 20px; border: 1px solid #0f5ef7; background: none; font: 500 14px/14px 'Noto Sans SC', sans-serif; color: #0f5ef7; text-align: center;}
.pos_left_content .pos_wrap .pos_btn_cart a.btn_add_cart:hover {background-color: #0f5ef7; color: #fff;}
.pos_left_content .pos_wrap .pos_sold_out {position: relative; float: left; width: 100%;}
.pos_left_content .pos_wrap .pos_sold_out .btn_sold_out {position: relative; float: left; width: 100%; padding: 10px 20px 12px 20px; border: 1px solid #ebeef7; background: #ebeef7; font: 500 14px/14px 'Noto Sans SC', sans-serif; color: #c4c8cf; text-align: center;}

/*** POS RIGHT COLUMN ***/
.pos_right {position: absolute; top: 0; right: 0; width: 25%; height: 100%;}
.pos_right .pos_mb_footer, .pos_right .pos_close_btn {display: none;}
.pos_right .pos_right_container {position: relative; float: left; width: 100%; height: 100%; padding: 60px 0 0 0;}

.pos_right .pos_right_header {position: absolute; z-index: 2; top: 60px; left: 0; width: 100%; height: 80px; padding: 0; background: #fff; border-bottom: 1px solid #dbdfe5;}
.pos_right .pos_right_header .member_wrap {position: relative; float: left; width: 100%; padding: 0 20px;}
.pos_right .pos_right_header .member_wrap .wrap_input {position: relative; float: left; width: 100%; margin: 25px 0;}
.pos_right .pos_right_header .member_wrap input.member_col {float: left; width: 100%; padding: 5px 10px; background: none; border: none; font: 500 14px/14px 'Noto Sans SC', sans-serif; color: #262626; text-transform: uppercase;}
.pos_right .pos_right_header .member_wrap input.member_col::-webkit-input-placeholder { /* Edge */ color: #b3bac8;}
.pos_right .pos_right_header .member_wrap input.member_col:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #b3bac8;}
.pos_right .pos_right_header .member_wrap input.member_col::placeholder {color: #b3bac8;}

.pos_right .pos_right_header .member_wrap .wrap_details {position: relative; float: left; width: 100%; margin: 20px 0;}
.pos_right .pos_right_header .member_wrap .wrap_details h3 {float: left; font: 700 16px/22px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.pos_right .pos_right_header .member_wrap .wrap_details small {font: 500 12px/18px 'Noto Sans SC', sans-serif; color: #666;}
.pos_right .pos_right_header .member_wrap .wrap_details a.btn_del {position: absolute; top: 8px; right: 0; width: 24px; height: 24px; opacity: 0.65;}
.pos_right .pos_right_header .member_wrap .wrap_details a.btn_del img {float: left; width: 100%;}
.pos_right .pos_right_header .member_wrap .wrap_details a.btn_del:hover {background-color: #ebeef7; opacity: 1;}

.pos_right_content {position: relative; float: left; width: 100%; height: 100%; padding: 80px 0 0 0; background: rgba(243, 245, 249, 1);}
.pos_right_content .checkout_wrap {position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 80px 0 0 0; overflow: hidden;}
.pos_right_content .checkout_wrap .cart_list {position: relative; z-index: 1; float: left; width: 100%; height: 100%; padding: 20px; overflow: auto;}
.pos_right_content .checkout_wrap .s_item {position: relative; float: left; width: 100%;}
.pos_right_content .checkout_wrap .s_item:last-child {margin-bottom: 190px; border-bottom: none;}

.pos_right_content .checkout_wrap .cart_header {margin-bottom: 20px;}
.pos_right_content .checkout_wrap .cart_header h3 {float: left; font: 700 18px/18px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.pos_right_content .checkout_wrap .cart_header small {float: right; font: 500 12px/18px 'Noto Sans SC', sans-serif; color: #666;}

.pos_right_content .pts_items {margin-bottom: 10px; padding: 10px 15px; background: rgba(219, 223, 229, 0.45);}
.pos_right_content .pts_items .pts_card {position: relative; float: left; width: 100%; padding: 5px 0;}
.pos_right_content .pts_items .pts_card .pts_header {position: relative; float: left; width: 100%; margin-bottom: 5px;}
.pos_right_content .pts_items .pts_card .pts_content {position: absolute; top: 0; left: 0; font: 700 14px/18px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.pos_right_content .pts_items .pts_card .pts_item {position: relative; float: left; width: 100%; padding: 0 0 0 110px;}
.pos_right_content .pts_items .pts_card .pts_item input {position: relative; float: left; width: 100%; background: transparent; border: none; font: 500 14px/14px 'Noto Sans SC', sans-serif; color: #262626;}
.pos_right_content .pts_items .pts_card span.pts_info {position: relative; float: left; width: 100%; font: 500 10px/14px 'Noto Sans SC', sans-serif; color: #0f5ef7;}
.pos_right_content .pts_items .pts_card a.btn_del {position: absolute; z-index: 2; top: 50%; right: 0; width: 24px; height: 24px; margin-top: -12px; opacity: 0.65;}
.pos_right_content .pts_items .pts_card a.btn_del img {float: left; width: 100%;}
.pos_right_content .pts_items .pts_card a.btn_del:hover {background-color: #ebeef7; opacity: 1;}

.pos_right_content .cart_items {margin-bottom: 10px; padding: 10px 15px; background: #fff;}
.pos_right_content .cart_items .cart_card {position: relative; float: left; width: 100%; padding: 5px 0;}
.pos_right_content .cart_items .cart_card .pos_details {position: relative; float: left; width: 100%; padding: 0 30px 0 0;}
.pos_right_content .cart_items .cart_card .pos_details .b_title {position: relative; float: left; width: 100%; font: 700 14px/18px 'Noto Sans SC', sans-serif; color: #2b2b2b; word-wrap: break-word;}
.pos_right_content .cart_items .cart_card .pos_details .b_title small {font: 500 10px/14px 'Noto Sans SC', sans-serif; color: #666;}
.pos_right_content .cart_items .cart_card .pos_details .b_details {position: relative; float: left; width: 100%;}
.pos_right_content .cart_items .cart_card .pos_details .b_id {float: left; margin: 0; font: 700 12px/23px 'Noto Sans SC', sans-serif; color: #666;}
.pos_right_content .cart_items .cart_card .pos_details .b_dots {position: relative; float: left; width: 23px; height: 23px; margin: 1px 0; background: url("../images/icon/ico_dot_g.png") no-repeat center; background-size: 12px;}
.pos_right_content .cart_items .cart_card .pos_panel {position: relative; float: left; width: 100%; padding: 5px 0 0 0;}
.pos_right_content .cart_items .cart_card .pos_panel .price_buy {float: left; margin: 0; font: 400 10px/16px 'Noto Sans SC', sans-serif; color: #666;}
.pos_right_content .cart_items .cart_card .pos_panel .price_total {float: right; margin: 0; font: 700 14px/16px 'Noto Sans SC', sans-serif; color: #2b2b2b;}
.pos_right_content .cart_items .cart_card a.btn_del {position: absolute; top: 5px; right: 0; width: 18px; height: 18px; background: #ff365f;}
.pos_right_content .cart_items .cart_card a.btn_del img {float: left; width: 100%;}
.pos_right_content .cart_items .cart_card a.btn_del:hover {background-color: #e9002f;}

.pos_right_content .pay_items {margin-bottom: 10px; padding: 10px 0;}
.pos_right_content .pay_items .pay_wrap {position: relative; float: left; width: 100%;}
.pos_right_content .pay_items .pay_wrap a.pay_select {position: relative; float: left; width: 100%; padding: 10px 20px 12px 20px; border: 1px solid #dbdfe5; background: #dbdfe5; font: 500 14px/14px 'Noto Sans SC', sans-serif; color: #2b2b2b; text-align: center;}
.pos_right_content .pay_items .pay_wrap a.pay_select:hover {background-color: #0f5ef7; color: #fff;}

.pos_right_content .payment_wrap {position: relative; float: left; width: 100%; padding: 0;}
.pos_right_content .payment_wrap .wrap_input {position: relative; float: left; width: 100%; margin: 10px 0;}
.pos_right_content .payment_wrap input.pay_col {float: left; width: 100%; padding: 6px 20px; background: none; border: 1px solid #0f5ef7; font: 500 16px/16px 'Noto Sans SC', sans-serif; color: #262626; text-align: center; text-transform: uppercase;}
.pos_right_content .payment_wrap input.pay_col::-webkit-input-placeholder { /* Edge */ color: #0f5ef7; font-size: 16px;}
.pos_right_content .payment_wrap input.pay_col:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #0f5ef7; font-size: 16px;}
.pos_right_content .payment_wrap input.pay_col::placeholder {color: #0f5ef7; font-size: 16px;}

.pos_right_content .checkout_items {margin-bottom: 10px; padding: 10px 15px; background: #fff;}
.pos_right_content .checkout_items .check_card {position: relative; float: left; width: 100%; padding: 5px 0;}
.pos_right_content .checkout_items .check_card .pos_details {position: relative; float: left; width: 100%; padding: 0 50px 0 0;}
.pos_right_content .checkout_items .check_card .pos_details .b_title {position: relative; float: left; width: 100%; font: 700 14px/16px 'Noto Sans SC', sans-serif; color: #2b2b2b; word-wrap: break-word;}
.pos_right_content .checkout_items .check_card .pos_details .b_title small { float: left; width: 100%; margin-top: 5px; font: 500 10px/12px 'Noto Sans SC', sans-serif; color: #666;}
.pos_right_content .checkout_items .check_card .pos_details .b_details {position: relative; float: left; width: 100%;}
.pos_right_content .checkout_items .check_card .pos_details .b_id {float: left; margin: 0; font: 700 12px/23px 'Noto Sans SC', sans-serif; color: #666;}
.pos_right_content .checkout_items .check_card .pos_details .b_dots {position: relative; float: left; width: 23px; height: 23px; margin: 1px 0; background: url("../images/icon/ico_dot_g.png") no-repeat center; background-size: 12px;}
.pos_right_content .checkout_items .check_card .price_total {position: absolute; top: 5px; right: 0; font: 700 11px/12px 'Noto Sans SC', sans-serif; color: #2b2b2b;}

.pos_right_content .cart_footer {position: absolute; z-index: 2; bottom: 0px; left: 0; width: 100%; padding: 20px; border-top: 1px solid #ebeef7; background: #fff;}
.pos_right_content .cart_footer .checkout_item {position: relative; float: left; width: 100%; margin: 2px 0;}
.pos_right_content .cart_footer .checkout_item .subtitle {float: left; width: 50%; font: 500 12px/18px 'Noto Sans SC', sans-serif; color: #666;}
.pos_right_content .cart_footer .checkout_item .subcontent {float: right; width: 50%; font: 700 12px/18px 'Noto Sans SC', sans-serif; color: #2b2b2b; text-align: right;}
.pos_right_content .cart_footer .checkout_item .subcontent strong {font-size: 18px;}
.pos_right_content .cart_footer .checkout_line {float: left; width: 100%; height: 1px; margin: 5px 0; background: #ebeef7;}
.pos_right_content .cart_footer a.btn_checkout {position: relative; float: left; width: 100%; margin: 10px 0 5px 0; padding: 10px 20px 12px 20px; border: 1px solid #0f5ef7; background: #0f5ef7; font: 500 14px/14px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.pos_right_content .cart_footer a.btn_checkout:hover {background-color: #0c4dc9;}
.pos_right_content .cart_footer a.btn_complete {position: relative; float: left; width: 48%; margin: 10px 4% 5px 0; padding: 10px 20px 12px 20px; border: 1px solid #0f5ef7; background: #0f5ef7; font: 500 14px/14px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.pos_right_content .cart_footer a.btn_complete:hover {background-color: #0c4dc9;}
.pos_right_content .cart_footer a.btn_back {position: relative; float: left; width: 48%; margin: 10px 0 5px 0; padding: 10px 20px 12px 20px; border: 1px solid #ff365f; background: #ff365f; font: 500 14px/14px 'Noto Sans SC', sans-serif; color: #fff; text-align: center;}
.pos_right_content .cart_footer a.btn_back:hover {background-color: #e9002f;}