.contain_sub {width: 100%; padding: 0 35px 35px; border-top:1px solid #dfdfdf;}
.sub_ftitle {padding: 15px 0; border-bottom: 1px solid #dfdfdf; display: flex; align-items: flex-end; justify-content: flex-start;}
.sub_ftitle_nbd {padding: 15px 0; display: flex; align-items: flex-end; justify-content: flex-start;}
.sub_ftitle_nbd p,
.sub_ftitle p {text-align: left; color: #7b7b7b;}

.title_contain_h3 {font-family: 'SUIT-SemiBold','Spoqa Han Sans Neo_Medium'; margin-right: 20px;}
.title_contain_h3 i {margin-right: 10px; color: var(--base-form-color);}
.title_contain_h3 em {font-size: 1rem; padding-left: 10px;}
.title_sub_con {display: inline-block; flex:1; padding:15px 0; color: #7b7b7b;}
.title_sub_flex {display: flex; justify-content: space-between; align-items: center; flex:1; padding:15px 0; color: #7b7b7b;}
.info_h4 {margin-right: 20px; display: inline; color: #2c2c2c;}

.block_layout_form {height: 100%; display: flex; align-items: stretch; justify-content: flex-start; border-bottom:1px solid #dfdfdf;}
.block_layout_form:first-of-type {border-top: 1px solid #dfdfdf;}
.block_layout_form:hover .block_title {background: #ececf7; border-left: 2px solid #c6c6f1;}

.block_title {background: #f7f7f7; width: 100px;/*width: 100px;*/text-align: center;padding: 12px 0 !important;display: flex;align-items: flex-start;justify-content: center; word-break: keep-all;}
.block_title_contain {background: #f7f7f7; width:98px; text-align: center; padding: 12px 0 !important; display: flex; align-items: flex-start; justify-content: center; display: flex; align-items: center; justify-content: center;}
.block_con {flex:1; padding: 10px; display: flex; align-items: center;}

.content_form {flex:1;} 
.content_form .area_input:first-child {border-top:0;}
.content_form .area_input:last-child {border-bottom:0;}

.area_input {border-bottom: 1px solid #ececec; padding: 10px; display: flex; align-items: flex-start; justify-content: flex-start;}
.area_input:last-child {border-bottom: 0;}
.set_item {display: flex; margin-top: 4px; align-items: center; width: 100px; word-break: break-all; line-height: 1.2; font-size: 0.9rem;}
.total_info_shipment .fa-star-of-life,
.set_item .fa-star-of-life {font-size: 7px; color:var(--button-point-color); margin: 0 5px 0 0;}
.set_contents {flex:1;}
.set_contents label[for='contain'],
.set_contents label[for='contain2'] {margin-bottom: 3px;}
.pop_layer .set_item + .add_columns {text-align: left; display: flex; align-items: center; justify-content: flex-start; margin-bottom: 10px; flex:1;}  
.pop_layer .fz_m6.btn_default.bg_ffc.plus_product_fcl { transition: all ease-in .3s; padding: 5px 10px; background: #3775a1; color: #fff; border-radius: 3px; border: none; white-space: normal; line-height: 1.3; display: flex; align-items: center; justify-content: center; font-size: 0.98rem;}  


.req_sup {margin-bottom: 5px; border:1px solid #dfdfdf; width: 100%; max-width: 700px; height: 140px; resize: both; outline: none; padding:5px 7px;}
.req_sup:hover,
.req_sup:focus {background: #f7f7f7; border:1px solid #b8b8b8;}

.com_logistic {margin-right: 15px;}

.text_input {display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; margin: 5px 0; position: relative;}
.fa-regular.calendar_icon {position: absolute; display: none; right: 10px; font-size: 17px; color: var(--base-form-color); top: 50%; margin-top: -11px;}

.input_write {padding:5px 7px; outline: none; border:1px solid #dfdfdf; color: var(--base-form-color); width: 100%; border-radius: 0;}
.input_write.form-control.small.shadow-none:hover,
.input_write.form-control.small.shadow-none:focus {border:1px solid #b8b8b8 !important;}
.k-picker-wrap.k-state-default .input_write.form-control.small.shadow-none:hover,
.k-picker-wrap.k-state-default .input_write.form-control.small.shadow-none:focus {border:none !important;}

.k-input.input_write:hover,
.input_write:hover,
.input_write:focus {background: #f7f7f7;border:1px solid #b8b8b8;}
.input_write {cursor: text;}

.add_minus{width: 100%; text-align: right;}
.add_columns{width: 100%; text-align: center;}

.notice_cbm {display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 10px; margin-bottom: 10px; background: var(--tb-back-color); border-radius: 10px; text-align: center; margin:20px 0 0;}
.link_co {padding: 10px 20px; background: #696969; color: #fff; margin-top:10px; border-radius: 5px; display: block; display: inline-block; margin-left:10px;}
.link_co:hover {color: #fff;}
.sm_block > span {display: block; margin-bottom: 5px;}
.wrap_input > .input_write {width: 30%; margin: 0 5px 5px 0;}
.grp_select_input {display: flex; align-items: stretch; justify-content: flex-start; width: 30%; margin-right: 5px; margin-bottom: 5px;}
.grp_select_input select {border:1px solid #dfdfdf; padding: 0 5px; outline: none; color: #666666;}
.grp_select_input select:hover,
.grp_select_input select:focus {background: #f7f7f7; border:1px solid #b8b8b8;}
.lcl_addList,
.total_info_shipment, 
.plus_product_lcl {display: none;}
.total_info_shipment {border-top: 1px solid #dfdfdf; padding-top: 10px; margin-top: 10px;}
.list_cell_header > div:nth-child(1).first_cell {flex-basis:50px;}
.list_cell_box > div:nth-child(1).first_cell {flex-basis:50px;}

   
    .outcome,
    .forward_info_view {display: none;}

/*cbm*/
.shame_sec {border: 1px solid #dfdfdf; padding: 20px;}
.shame {display: flex; align-items: flex-start; justify-content: space-between;}
.shame > div {width: 15%;}
.sm_block .form-select {margin-top: -1px; border-radius: 0; border:1px solid #dfdfdf; outline: none; box-shadow: none;}
.cal_button_action {text-align: center; padding-top: 20px;}
.cal_button {border:none; border:1px solid var(--base-button); padding: 10px 30px; background: var(--base-button); border-radius: 5px; display: inline-block;}
.cal_button_pop {border:none; border:1px solid var(--base-button); padding: 6px 10px; background: var(--base-button); border-radius: 5px; display: inline-block;}
.reset_button {border:none; border:1px solid #ebebeb; padding: 10px 30px; background: #ebebeb; border-radius: 5px;}
.reset_button:hover,
.reset_button:focus {background: #dfdfdf; border:1px solid #dfdfdf;}
.contain_header {border-top: 2px solid var(--base-point-color); /*background: #eef7fb;*/ background:#f9f9f9; display: flex; align-items: stretch; justify-content: space-between; border-left: 1px solid #dfdfdf; border-right:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf;}
.contain_header li {font-family: 'SUIT-SemiBold'; display: flex; align-items: center; padding: 5px 0; justify-content: center;  text-align: center; border-right: 1px solid #dfe4e4;}
.contain_header li:nth-child(1) {width: 9.0909%;}
.contain_header li:nth-child(2) {width: 9.0909%;}
.contain_header li:nth-child(3) {width: 9.0909%;}
.contain_header li:nth-child(4) {width: 9.0909%;}
.contain_header li:nth-child(5) {width: 9.0909%;}
.contain_header li:nth-child(6) {width: 18.1818%; flex-direction: column; padding-bottom: 0;}
.contain_header li:nth-child(6) span {width:50%;  display: block;}
.contain_header li:nth-child(7) {width: 27.2727%; flex-direction: column; padding-bottom: 0;}
.contain_header li:nth-child(7) span {width:33.33%; display: block;}
.contain_header li:nth-child(8) {width: 9.0909%;}
.contain_header li:last-child {border-right: 0;}
.contain_box {font-size: 13px;}

.cal_guide .title_sub_con {margin-right: 10px;}
.cal_guide .fa-solid.fa-rotate-left {font-size: 0.8rem; margin-right: 10px;}
.cal_button_action .fa-solid.fa-rotate-left {margin-right: 10px;}
.shame_result {border:1px solid #dfdfdf;}
.shame_option {background: var(--tb-back-color); display: flex; align-items: center; justify-content: space-between; padding: 10px;}
.shame_count > span {margin-right: 10px;}
.result_fs {padding:2px 5px; border-radius: 5px; background: var(--checkbtn-back);}
.box_result{padding:0 10px;}
.bx_title {padding: 10px 0; border-bottom: 1px solid #e9e9e9;}
.cbm_result {padding:10px; display: flex; align-items: center; justify-content: space-between;}
.info_cbm {width: 50%;}
.cbm_tit {width: 40%; max-width: 150px; white-space: nowrap; display: inline-block;}
.cbm_count {color: var(--number-point); padding-right: 5px; padding-left: 5px; font-family: 'Spoqa Han Sans Neo_Medium';}
.all_result,
.res_cbm {padding: 10px;}
.result_cbm {display: flex; align-items: center; justify-content: space-between;}
.result_cbm li{width: 25%;}
.set_cbm {display: flex; align-items: center; justify-content: space-between;}
.cbm_grp {width: 100%;}
.cbm_grp:nth-child(2) {border-top: 0; border-left: 1px solid #dfdfdf;}
.all_result .info_cbm{width: 50%;}
.info_cbm.ac_fs {width: 100%;}
.info_cbm.ac_fs li {width: 50%;}

.add_sub {width: 100%; border-top:1px solid #dfdfdf; display: flex; align-items: center; justify-content: space-between; margin-top: 5px;}
.add_sub > span {border-right:1px solid #dfdfdf; padding-top: 5px; padding-bottom: 5px; height: 100%;}
.add_sub > span:last-child {border-right: 0;}
.close_info {white-space: nowrap;}
.close_info i {margin-right: 5px;}
.contain_con {display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #dfdfdf; border-left: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf;}
.contain_con li {width: 9.0909%; text-align: center; padding: 10px 0; border-right: 1px solid #dfdfdf;}
.contain_con li:last-child {border-right:0;}
.sm_icon {display: none;}
.reset_btn {border:none;}
.btn_default {border-radius: 0.375rem; padding: 0.375rem 0.75rem; border:none;}
.fcl_list {margin-bottom: 20px;}


.tit_star{font-size: 7px; color:var(--button-point-color); margin: 0 5px 0 0;}
.dutie_box {border:1px solid #dfdfdf;}
.dutie_title {display: flex; align-items: center; min-width: 140px; background: #f7f7f7;  text-align: center; padding: 15px;}
.dutie_title > h4 {white-space: nowrap; display: flex; align-items: center;}
.dutie_title > h4 > b {color: #9e9e9e; font-size: 0.8rem; margin-left: 3px;}
.dutie_box .block_con .input_write {width: 250px; min-width:250px ;}
.dutie_box .st_fs {border-bottom: 1px solid #dfdfdf;}
.dutie_box .st_fs:last-child {border-bottom: 0;}
.guide_text {margin-left: 20px; color: #9e9e9e;}
.unit_dol {width: 250px; max-width: 70%;}
.unit_dol .unit {color: #2c2c2c;}
.link_co_fix {padding: 5px 10px; background: #696969; color: #fff; border-radius: 5px; display: block; display: inline-block; margin-left:10px;}
.link_co_fix:hover,
.link_co_fix:focus {color:#fff;}
.button_grp {padding-top: 20px; text-align: center;}
.button_grp .fa-solid.fa-rotate-left {margin-right: 10px;}


.sub_ftitle_normal {padding: 15px 0; border-bottom: 1px solid #dfdfdf;}
.port_box {border:1px solid #dfdfdf; padding: 20px;}
.port_info_search {display: flex; align-items: center; justify-content: center;}
.port_info_search > div {margin: 5px; width: 20%;}
.port_info_search > div:last-child {width: auto;}
.cal_button.resize_m {padding: 6px 30px;}
.select_company {border:1px solid #dfdfdf;}
.select_company > div {border-right:1px solid #dfdfdf;}
.select_company > div:last-child {border-right:0;}
.select_company > div > h5 {background: var(--tb-back-color); padding: 10px;}
.box_select_title {padding: 10px 10px 0 10px;}
.box_select_op {padding: 0 10px 10px 10px;}
.open_filter {cursor: pointer; padding: 5px 0 5px 5px;}
.to_bar {position: relative; width: 60px; height: 1px; background: #5a5a5a;}
.to_bar::after {content: ''; position: absolute; right:-7px; top:-5px; height: 0; width: 0; position: absolute; border-bottom: 6px solid transparent; border-top: 6px solid transparent; border-left: 6px solid #5a5a5a; border-right: 6px solid transparent;}
.excel {background: #207245; color:#fff; white-space: nowrap; padding:5px 10px; display: block;}
.excel:hover,
.excel:focus {background: #2b8d57; color:#fff;}
.update {background: var(--base-point-color); color:#fff; white-space: nowrap; padding:5px 10px;}
.update:hover,.update:focus {background: var(--button-point-color); color:#fff;}


    /*table set*/
    .tb_box_grp {font-size: 0.9rem; display: table; width:100%; table-layout:fixed; border-bottom:1px solid #dfdfdf; border-right:1px solid #dfdfdf;}  
    .tb_cell_header {background: #f9f9f9; border-top:2px solid var(--base-point-color);}
    .tb_cell_box .fa-filter {color: var(--base-point-color); font-size: 11px; cursor: pointer;}
    .tb_cell_header .fa-circle-info {color: #c7c7c7; cursor: pointer;}
    .tb_cell_header,
    .tb_cell_box {display: table-row;}
    .tb_cell_header > div {position: relative; padding: 8px; display: table-cell; word-break: break-all; vertical-align: middle; text-align: center; border-top: 2px solid var(--base-point-color); border-left: 1px solid #dfdfdf;}
    .tb_cell_box > div:first-child {text-align: left;}
    .tb_cell_box > div {position: relative; padding: 10px; display: table-cell; vertical-align: middle; text-align: left; border-top: 1px solid #dfdfdf; border-left: 1px solid #dfdfdf;}
    .tb_cell_header > div:first-child {width: 13rem;}
    .tb_cell_header > div:nth-child(10) {width: 10rem;}
    .tb_cell_header > div:nth-child(12) {width: 7rem;}
    .tb_cell_header > div:last-child {width: 3rem;}
    
    .info_text_notice {position: absolute; padding: 10px; opacity: 0; background: #3b3b3b; bottom: 50px; color: #fff; width: 190px; border-radius: 5px; right: 0; z-index: 1; transition: all ease-in 0.2s;}
    .info_text_notice.on {opacity: 1; bottom: 45px;}
    .info_text_notice::before {content: ''; position: absolute; border-top: 15px solid #3b3b3b; border-right: 15px solid transparent; border-left: 15px solid transparent; width: 0; right: 20px; height: 0; bottom: -10px; opacity: 1;}

    .info_text_change {position: absolute; padding: 10px; opacity:0; background: #3b3b3b; bottom: 40px; color: #fff; width: 170px; border-radius: 5px; z-index: 1; word-break: break-all; transition: all ease-in 0.2s; left:0; z-index: -1;}
    .info_text_change.on {opacity: 1; bottom: 30px; z-index: 1;}
    .info_text_change::before {content: ''; position: absolute; border-top: 15px solid #3b3b3b; border-right: 15px solid transparent; border-left: 15px solid transparent; width: 0; left: 0; height: 0; bottom: -7px; opacity: 1;}

        .year_block .tb_box_grp {border-right: 0; border-bottom:0;}

    
    .before_years {transition: all ease-in 0.3s; cursor: pointer; padding: 10px 30px; background: #f6f6f6; border-radius: 10px 10px 0 0; margin-right: 5px; border:1px solid #dfdfdf; border-bottom: 1px solid #f6f6f6;}
    .before_years:hover {padding: 10px 40px; background: #fff;}
    .before_years.active {background: var(--base-button); border: 1px solid var(--base-button);}
    .set_contain {flex:1; gap:10px; display: flex; flex-wrap: wrap; width: 100%;}
    .set_contain_column {flex:1; gap:3px; display: flex; flex-wrap: wrap; flex-direction: column; width: 100%; font-size: 0.9rem;}
    .set_contain input.cus_check[type="radio"] + label {word-break: break-all; white-space: normal;}
    .set_contain_column hr {border:0; border-top:1px solid #a9a9a9; margin-top: 5px; margin-bottom: 5px;}
    .set_contain_column input.cus_check[type="checkbox"] + label {position: relative;}
    .set_contain_column .info_text_notice {position: absolute; left: calc(100% + 25px); top:0; padding:0; width: 100%; max-width: 250px; z-index: -1;}
    .set_contain_column .info_text_notice em {background: #3b3b3b; display: block; padding: 10px 20px; border-radius: 10px;}
    .set_contain_column .info_text_notice::before {position: absolute; border-top: 15px solid transparent; border-right: 15px solid #3b3b3b;  border-bottom: 15px solid transparent; width: 0; left: -20px; top: 5px; height: 0; opacity: 1;}
    .set_contain_column .info_text_notice.on {opacity: 1; z-index: 1;}


/*simulate*/
.quo_simulate {width: 100%;}
.cold_storage {max-width: 300px; width: 100%;}
.cs_title {display: flex; align-items: center; padding: 5px 10px; justify-content: space-between; background: var(--checkbtn-back); border-radius: 10px 10px 0 0;}
.temp_check {position: absolute; left: -9999px;}
input.temp_check + label {padding: 5px; cursor: pointer; border-radius: 3px;}
input.temp_check:checked + label {background: var(--button-point-redOrange); color: #fff; font-weight: 600;}
.cold_storage > .ac_sb {padding: 10px; border:1px solid #dfdfdf; border-top:0;}
.cold_storage > .ac_sb > input {width: 48%; padding: 5px; border:1px solid #dfdfdf; outline: none;}
.cold_storage > .ac_sb > input:hover,
.cold_storage > .ac_sb > input:focus {background: #f7f7f7;}
.other_info_input {vertical-align: middle;} 
.quo_simulate {width: 300px; margin-right: 20px; vertical-align: middle;}
.quo_simulate, .files_insert {margin-top:10px; display: inline-block; vertical-align: middle;}

.files_insert {height: 100px;} 
.files_insert form {height: 100%;}
.files_insert + .sm_release_btn {display: block;}
input[type=file].file_select,
.file_select {display: none;}
.pdf_file_upload {display: flex; align-items: center; justify-content: flex-start; height: 100%;}
.pdf_file_upload .file_setup {height: 100px; display: block;}
.pdf_file_upload .file-list {height: 100px; overflow-y: auto; padding: 10px;}
.order_column .pdf_file_upload .file-list,
.order_column .files_insert {height: auto;}
.file_select_zone {background: #fff; border:2px solid var(--checkbtn-back); height: 100%; display: flex; align-items: center; padding: 0 20px; cursor:pointer; border-radius: 10px;}
.file_select_zone:hover {background: #f3f3f3; border:3px solid var(--checkbtn-back);}
.file_select_zone > em {padding: 10px 20px; border-radius: 5px; background: #e73600; color: #fff; display: block;}
.wrap_file {display: flex; align-items: center; justify-content: flex-start;}
.wrap_file .delete {margin-left: 5px; cursor: pointer;}
.wrap_file p.name {word-break: break-all;}
.wrap_file .fa-minus-square {color: #e73600;}

.st_in_land {display: none;}
.ar_in_land {display: none;}
.st_port_land .text_input .input_write,
.ar_port_land .text_input .input_write {margin-bottom: 5px; margin-right: 5px; width: calc(50% - 5px);}
.ar_in_land .text_input .input_write,
.st_in_land .text_input .input_write {width: 100%; margin-right: 5px; margin-bottom: 5px;}
.st_port_land .text_input .input_write.mgr0, 
.ar_port_land .text_input .input_write.mgr0 {margin-right: 0;}
.st_in_land .text_input .input_write.mgr0, 
.ar_in_land .text_input .input_write.mgr0 {margin-right: 0;}

.ar_port_land .sm_cancel_btn {margin-bottom: 5px; margin-left: 5px;}
.st_port_land .sm_cancel_btn {margin-bottom: 5px;margin-left: 5px;}

.ar_in_land button.btn.btn-secondary,
.st_in_land button.btn.btn-secondary {transition: all ease-in .3s;padding: 7px 20px;background: #4d6ca4;display: flex;align-items: center;justify-content: center;color: var(--base-md-color);/* display: inline-block; */border: none;white-space: normal;border-radius: 3px;border: 0;color: #fff;line-height: 1.3;box-shadow: none;outline: none;}

.ar_in_land button.btn.btn-secondary:hover,
.st_in_land button.btn.btn-secondary:hover,
.ar_in_land button.btn.btn-secondary:focus,
.st_in_land button.btn.btn-secondary:focus {background: #4d6ca4; border:0;}


/*drag and drop*/
.insert { padding: 20px 30px; display: block; width: 600px; border: 1px solid #dbdbdb; box-sizing: border-box; }
.insert .file-list { height: 200px; overflow-y: scroll; border: 1px solid #989898; padding: 10px; }
.insert .file-list .filebox p { font-size: 14px; margin-top: 10px; display: inline-block; }
.insert .file-list .filebox .delete i { color: var(--number-point); margin-left: 5px; }
    

.foward_grp {display: flex; align-items: stretch; justify-content: space-between; border-left: 1px solid #dfdfdf;}
.grp_tab {width: 25%; display: flex; align-items: center; justify-content: center; background: #f6f6f6; text-align: center; padding: 10px; cursor: pointer; border-right: 1px solid #dfdfdf;}
.grp_tab.active {background: var(--base-button);}
.grp_depth { padding: 0; border-right: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf; background: #fff;}
.search_btn {background: var(--checkbtn-back); color: #fff; border:0; padding:0px 30px; border-radius: 0 5px 5px 0; margin-left:-1px;}
.search_btn:hover,
.search_btn:focus {background: var(--checkbtn-back);}

.area_search {padding: 20px;}
.select_location li a{padding:5px 10px; display: block;} 
.local_grp {display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap;}
.local_grp li {width: 25%; text-align: center;}
.local_grp li a.active {background: var(--base-button); border-radius: 0 20px 20px 0;}
.local_select {width: 30%; padding: 20px; border-right: 1px solid #dfdfdf; padding-left: 0; padding-right: 0;}
.branch_select {width: 70%; padding: 20px; padding-left: 0; padding-right: 0;}
.branch_grp {display: flex; align-items: flex-start; flex-wrap: wrap; justify-content: flex-start;}
.branch_grp li {width: 11%; text-align: center; display: inline-block; text-align: center;}
.branch_grp li a {display: block; width: 100%; word-break:  break-all;}
.branch_grp li a.active {background: #d9eaee;}
.reset_all {margin-right: 25px; padding: 8px 20px; border-radius: 30px; background: #d9eaee;/*background: #daefda;*/ border:0;}
.reset_all i {margin-right: 10px;}
.com_search {display: flex; align-items: center; justify-content: space-between; padding: 20px; border:1px solid #dfdfdf; border-top: 0;}
.sel_local {margin-right: 10px; white-space: nowrap;}
.sel_local i {padding: 10px; cursor: pointer; padding-left: 3px;} 

.com_search,
.search_grp_02,
.search_grp_03,
.search_grp_04 {display: none;}

.grp_depth .search_grp_01,
.grp_depth .search_grp_02,
.grp_depth .search_grp_03 {border-left:1px solid #dfdfdf; border-top:1px solid #dfdfdf;}

.logist_grp {width: 100%; display: grid; row-gap: 10px; column-gap: 10px; grid-template-columns: repeat(5, 1fr);}
.logist_grp.customs_broker {grid-template-columns: repeat(6, 1fr);}
.logist_cp {padding: 20px;  border-radius: 20px; border:1px solid #e9e9e9; word-break: break-all;}
.logist_cp h3 {height: 100px; margin-bottom: 10px; display: flex; align-items: center; justify-content: center;}
.logist_cp h3 > img {max-width:200px; max-height: 80px;}
.content_between {display: flex; align-items: center; justify-content: space-between; flex-direction: column; height: 95px;} 
.comp_name {font-family: 'SUIT-SemiBold'; margin-bottom: 10px; width: 100%;}
.comp_intro {overflow: hidden; width: 100%; text-overflow: ellipsis; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-wrap:break-word; margin-bottom: 10px; line-height:1.3;}
.state_tag {overflow: hidden; text-align: left; text-overflow: ellipsis;  -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap:break-word; width: 100%;}
.state_tag > span {margin-right: 5px;}
.forwarder {color:#dd6c03;} 
.offering {color:#2081ff;} 
.ex_delivery {color: #00a74b;} 
.gb_customs {color: #c5a000;} 
.logist_it {color: #7400c5;} 
.list_filter {margin-left: 10px; cursor: pointer;}
.list_filter > i {font-size: 0.8rem;}
.company_grp {display: grid; row-gap: 5px; column-gap: 5px; grid-template-columns: repeat(5, 1fr);}
.company_grp .company_fw {background: #fcfcfc; transition: all ease-in 0.1s; border-top: 1px solid #dedede; padding: 10px; border-radius: 0 0 10px 10px;}
.company_grp .company_fw:hover {transform: scale(1.05); border-top: 1px solid var(--number-point); background: #fffef4; box-shadow: 1px 1px 5px rgba(0,0,0,0.1);}
.company_grp .company_fw h3 {max-width: 60%; overflow: hidden; text-align: left; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-all;}
.view_count {display: flex; align-items: center; justify-content: flex-end; white-space: nowrap;}
.view_count i {margin-right: 3px;}
.like_com {margin-left: 6px;}
.tel_fax span {margin-right: 10px; display: block;}
.paging_com {display: flex; align-items: center; margin:0 auto;}
.paging_com li a {padding: 10px; color: var(--base-form-color);}
.paging_com li a.active {color: var(--button-point-color);}
.list_filter.active {color: var(--button-point-redOrange);}
.list_filter.active i {transform: rotate(180deg);}
.special_option {width: 25%; border-top: 1px solid #dfdfdf; border-left: 1px solid #dfdfdf; padding: 20px;}
.special_option h4 {margin-bottom: 10px;}
.special_option:last-child {border-right: 0;}
.sp_select li {display: inline-block;}
.sp_select li a {border:1px solid #ececec; border-radius: 5px; padding:3px 5px; display: block; margin-top: 6px; word-break: break-all;}
.sp_select li a.active {background: #d9eaee; border:1px solid #d9eaee; font-family: 'SUIT-Bold', 'Spoqa Han Sans Neo_Bold';}

.logist_grp.customs_broker .logist_cp:hover {background: #f8f8f8;}
.homepage_link {padding: 5px; border-radius: 100px; transition: all 0.3s ease-in; border:3px solid #dfdfdf; width: 35px; height: 35px; display: flex; align-items: center; justify-content: center;}
.homepage_link i {color: var(--checkbtn-back); z-index: 2;}
.homepage_link:hover {transform: rotateY(180deg); border:3px solid var(--base-point-color);}

.company_grp.customs_broker .company_fw {background: #fff; transition: all ease-in 0.1s; border:1px solid #f5f5f5; border-top: 1px solid #dedede; padding: 10px; border-radius: 0;}
.company_grp.customs_broker .company_fw:hover {transform: scale(1.05); border-left: 1px solid var(--color-point); background: #f9fbff; box-shadow: 1px 1px 5px rgba(0,0,0,0.1);}
.company_grp.customs_broker .company_fw h3 {max-width: 60%; overflow: hidden; text-align: left; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-all; margin-bottom: 5px;}


.search_ship_layer .input_write.w30p{width: 30%;}
.forwarder_ship li {width: 100%;}
.forwarder_ship li > button,
.forwarder_ship li a {width: 100%; border-radius: 5px 5px 5px 5px;  border:none; margin:0 auto; text-align: center; width: 100%; max-width: 250px; display: block; padding: 10px; width: 100%; background: #dfdfdf;}
.forwarder_ship li > button.active,
.forwarder_ship li a.active {background: var(--button-point-orange); color: #fff; border:none;}
.forwarder_ship li:nth-child(2) {margin-top: 5px;}
.all_select {display: none;} 
.all_select + label {user-select:none; cursor: pointer;}
.ship_grp {width: 100%; display: grid; row-gap: 10px; column-gap: 10px; grid-template-columns: repeat(2, 1fr);}
.ship_imgs {width: 35%; margin-right: 20px;}
.ship_grp .content_between {justify-content:flex-start; height: auto;}
.ship_grp .content_between p {width: 100%;}
.ship_grp .comp_name {margin-bottom: 0;}
.ship_grp .logist_cp h3 {height: 80px;}
.alliance {margin-right: 25px; padding: 3px 7px; border-radius: 5px; background: #d9eaee;/*background: #daefda;*/ border:0; margin: 5px 0; display: inline-block;}
.br_type {margin-right: 25px; padding: 3px 7px; border-radius: 5px; background: #e7e7e7;/*background: #daefda;*/ border:0; margin: 5px 0; display: inline-block;}
.country {margin-right: 25px; padding: 3px 7px; border-radius: 5px; background: #ffffff;/*background: #daefda;*/ border:1px solid #dfdfdf; margin: 5px 0; display: inline-block;}


.ship_box_grp {font-size: 13px; display: table; width:100%; /*table-layout:fixed;*/ border-bottom:1px solid #dfdfdf; border-right:1px solid #dfdfdf;}  
.ship_cell_header {background: #f9f9f9; width: 100%; display: table-row;}
.ship_cell_header > div {width: 10%; position: relative; padding: 10px; display: table-cell; word-break: keep-all; vertical-align: middle; text-align: center; border-top: 2px solid var(--base-point-color); border-left: 1px solid #dfdfdf;}

.ship_cell_header > div:nth-child(1) {width: 5%;}
.ship_cell_header > div:nth-child(2) {width: 15%;}
.ship_cell_header > div:nth-child(3) {width: 7%;}
.ship_cell_header > div:nth-child(4) {width: 7%;}
.ship_cell_header > div:nth-child(5) {width: 7%;}
.ship_cell_header > div:nth-child(6) {width: 13%;}
.ship_cell_header > div:nth-child(7) {width: 9%;}
.ship_cell_header > div:nth-child(8) {width: 13%;}
.ship_cell_header > div:nth-child(9) {width: 9%;}
.ship_cell_header > div:nth-child(10) {width: 15%;}

.ship_cell_box {display: table-row;}
.ship_cell_box > div:nth-child(2) > a {display: block; width: 100%; text-decoration: underline; color:#5e5e5e;  font-family: 'SUIT-Bold', 'Spoqa Han Sans Neo_Bold';}
.ship_cell_box > div:nth-child(2) > a:hover {color:var(--number-point); font-family: 'SUIT-ExtraBold', 'Spoqa Han Sans Neo_Bold';}
.ship_cell_box .fa-filter {color: var(--base-point-color); font-size: 11px; cursor: pointer;}
.ship_cell_box > div {position: relative; padding: 10px; display: table-cell; vertical-align: middle; text-align: left; border-top: 1px solid #dfdfdf; border-left: 1px solid #dfdfdf; width: auto; word-break: break-all;}
.ship_cell_box > div:nth-child(1),
.ship_cell_box > div:nth-child(3),
.ship_cell_box > div:nth-child(4),
.ship_cell_box > div:nth-child(5),
.ship_cell_box > div:nth-child(7),
.ship_cell_box > div:nth-child(9){text-align: center;}

.ship_state {display: block; width: 100%; position: relative; transition: all ease-in 1.5s; padding-top: 20px; padding-bottom: 20px;}
.ship_state * {
      -moz-transition: all 2s ease-out;
       -ms-transition: all 2s ease-out;
        -o-transition: all 2s ease-out;
           transition: all 2s ease-out;
}


#shipgoMap .wrapper_map {min-height:100%;}
#shipgoMap .set_fixed { width: 100%; z-index: 1; padding-top: 20px; background: #fff; position: relative; margin-top:0px; }
#shipgoMap .logo_map { padding: 10px; padding-top: 0px; padding-bottom: 20px;}
.ship_state {position:relative; z-index:1; border-top: 1px solid #28a7c9; background: #f6f7fb; display:flex; justify-content: space-between; align-items: center; padding: 8px 15px; font-size: 0.8rem; color:#6d7080;}
.port {width: 40%; display:flex; align-items: center}
.port > .ri-map-pin-line { margin-right: 3px;}
#shipgoMap .ship_state::after {width:0}

/*inland tracking*/
.tracking_map {background: #fff;}
.tracking_map .logo_map {padding: 18px; padding-top: 0px; padding-bottom: 20px;}
.area_location {display: flex; word-break: break-all; padding:10px; padding-top:20px; padding-bottom:20px; border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf; align-items: stretch; justify-content: space-between; width: 96%; margin: 0 auto;}
.info_pt >* {display: block; color: #7e7e7e;} 
.arrow_dir {width: 20%; display: flex; align-items: center; justify-content: flex-start; color: #b4b5b6;}
.arrow_dir > i {font-size: 1.5rem; font-weight: 700; padding:10px}
.destination_p,
.starting_p {width:40%;}
.city_name_p {font-size: 1rem; font-weight: 600; color: #6a769b; padding-top: 7px; padding-bottom: 4px; display: block; position: relative; line-height: 1.3;}

.sub_info_tran input,
.info_pt input,
.city_name_p input {display: block; width: 100%; border:none; outline: none; padding:0; margin:0; background: transparent;}
.city_name_p input:hover,
.city_name_p input:focus {display: block; width: 100%; border:none;  outline: none;}
.tracking_map input[readonly]:hover,
.tracking_map input[readonly]:focus,
.tracking_map input[readonly] {background: transparent; border:none;}

.area_del_info {width:96%; margin: 0 auto; background: #f8f9fd; border-radius: 5px; margin-top: 10px; padding: 10px;}
.area_del_info li {margin-bottom: 10px;}
.hd_info_tran {font-size: 0.9rem; font-weight: 600; color: #6a769b;}
.sub_info_tran {padding-left: 10px; display: block;}
.sta_ata {font-size: 0.85rem; padding-top: 5px; display:inline-block; border-radius: 5px; line-height: 1; color: #fff; padding: 5px;}
.starting_p .sta_ata {background: #ff9c1b;}
.destination_p .sta_ata {background: #4680b8;}

.ship_contain {position: absolute; bottom: 15px; min-width: 24px; width: 0;}
.etd_atd {color: #0092ff;}
.ship_contain .ship_icon {right:0; position: absolute; width: 24px;}
.sea_line {position: absolute; width: 100%; background: #dfdfdf; bottom: 0; left:0; right:0; display: block; height: 2px; margin: 0 auto;}
.inner_line {position: absolute; bottom: 0; height: 2px; background: #088ab1; width: 0;}
.white_line_start,
.white_line_end {width: 24px; height: 100%; background: #cfcfcf; position: absolute;}
.white_line_start {left:0; z-index: 1;}
.white_line_end {right:0;}
.ship_state::after {/* width: 100%; */content: '';height: 2px;}
.mobile_ship_info {display: none;}
.etd_atd {color: var(--number-point);} 



    .tit_ship_info {color: var(--base-form-color);}
    .st_detail {display: flex; flex-wrap: wrap;  border-top: 2px solid var(--base-point-color); border-left: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf;}
    .st_detail .tb_cell {width: 33.33%; background: #f9f9f9; padding: 10px; border-top: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf;}
    .st_detail .tb_cell:nth-child(n+4) {background: #fff;}
    .st_detail .tb_cell:nth-child(n+7) {background: #f9f9f9;}
    .st_detail .tb_cell:nth-child(n+10) {background: #fff;}
    .st_detail .tb_cell:nth-child(n+13) {background: #f9f9f9;}
    .st_detail .tb_cell:nth-child(n+16) {background: #fff;}
    .map_st {width: 100%; position: relative; overflow: hidden; line-height: 0;}
    .cover_map {position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; background: rgba(249, 196, 36, 0.6); left: 0; top:0; backdrop-filter: blur(5px);}
    .login_map {background: #4a4a4a; color: #fff; transition: all 0.1s ease-in; border: 0; padding: 10px 30px; z-index: 1; border-radius: 5px; box-shadow: 1px 1px 5px rgba(0,0,0,0.3);}
    .login_map:hover {color: #fff; padding: 10px 35px;}
    .income_search .form-select {outline: none; box-shadow: none; border-radius: 0; border:1px solid #dfdfdf; padding-top:5px; padding-bottom:5px;}
    .income_search .form-select:hover,
    .income_search .form-select:focus {border:1px solid #dfdfdf;}



        .contain_sub.fs_fs {min-height: 100%;}
        .wrapper_map {overflow-x:hidden; overflow-y: auto;  box-sizing: border-box; width:360px; height:100%; max-height: 800px; position:relative; z-index:1;}
        .wrapper_map::-webkit-scrollbar-thumb {position: absolute;}
        .wrapper_map ul li {list-style-type:none;}
        .wrapper_map ul {padding-left:0; padding-top:0px; padding-bottom:0px; margin-top:0; margin-bottom:0;}
        .wrapper_map::before { content: ''; position: absolute; top: 0; left: 19px; height: 100%; width: 2px; background: #dedede; z-index:0; }
        .logo_map {padding: 5px 0; background:#fff; position:relative; z-index:1;}
        .ship_st {position:relative; z-index:1; /*border-top: 1px solid #28a7c9;*/ border-top: 1px solid var(--base-point-color); background: #f6f7fb; display:flex; justify-content: space-between; align-items: center; padding: 8px 15px; font-size: 0.8rem; color:#6d7080;}
        .port {width: 40%; display:flex; align-items: center}
        .port > .ri-map-pin-line {margin-right: 3px;}
        .arrival {width: 30%;}
        .dep {width: 30%;}

        .list_header {position:relative; z-index:1; background:#fff;  border-bottom: 1px solid #e7e7e7; border-top: 1px solid #e7e7e7; color:#646464; cursor:pointer; font-size: 0.8rem; padding: 8px 15px; display:flex;  justify-content: space-between; align-items: center;}
        .list_header i {font-style:normal; color: var(--number-point); font-size: 0.6rem;}
        .list_header.active,
        .list_header:focus {background:#28a7c9; color:#fff; border-bottom:1px solid #fff;}
        .list_header.active i,
        .list_header:focus i {color:#fff;}
        .list_header .ri-ship-line {margin-right: 3px; font-size: 0.8rem; margin-top: 2px; color: #6d7080;}
        .list_header > span {display:flex; align-items:center;}

        .info_list {display: flex; align-items:stretch; justify-content: space-between; font-size:0.8rem;}
        .local_city {width: 40%; display:flex; align-items: stretch;}
        .arrial_time {width: 30%; word-break:keep-all; display:flex; align-items:center; justify-content: center; flex-direction: column;}
        .start_time {width: 30%; word-break:keep-all; display:flex; align-items:center; justify-content: center; flex-direction: column;}
        .start_time > span,
        .arrial_time > span {display:block; text-align:right; width: 100%; padding-right: 10px;}
        .start_time > span {color:#505050;}
        .arrial_time > span {color: #187993;}

        .set_line {width: 33px; display:block; min-height: 45px; height:100%; position:relative;}
        .set_line::before { content: ''; position: absolute; top: 0; left: 19px; height: 100%; width: 2px; background: #a0a7b2; z-index:0; }
        .set_line::after { content: ''; position: absolute; top: 18px; left: 17px; width: 6px; height: 6px; border:2px solid #a0a7b2; border-radius: 100px; background: #a0a7b2; }
        .info_list.active .set_line::before {color:var(--number-point); background: #28a7c9;}
        .info_list.active .set_line::after {border:2px solid #28a7c9; background:#fff;}
        .local_city > span {flex:1; word-break:break-all; display:flex; align-items:center;}
        .sea_location {position: relative; width: 360px;}
        .set_fixed {width: 100%; z-index: 1; padding-top:20px; margin-top: 0px;}
        .fix_login {position: absolute; z-index: 1; width :100%; height: calc(100% - 20px); background: rgba(250,250,250,0.7); backdrop-filter: blur(4px); border:1px solid #dfdfdf; top:20px; left:0; display: flex; align-items: center; justify-content: center;}
        .login_notice {border:5px solid #dfdfdf; padding: 40px 20px;  width: 90%; text-align: center;}
        .login_notice img {margin:0 auto 20px;}
        .login_map {display: inline-block; margin-top:10px}
        .login_notice > span {display: block;}
        .mobile_ship_info.etd_atd {color: var(--number-point);}


/*BLF track*/
.blf_search {width: 100%; /*display: flex; align-items: flex-start; justify-content: space-between; */margin: 0 auto; border:1px solid #dfdfdf; padding: 30px; background: #fff;}     
.blf_search .input_write {flex-grow: 1;}
.sub_ly_search {width: 100%; margin-top: 30px;}
.sub_ly_search:first-of-type {margin-top: 0;}
.search_blf {display: flex; align-items: stretch; justify-content: flex-start; margin-top: 10px;}
.apl_txt {transition: all ease-in 0.2s; display: flex; align-items: center; justify-content: space-between; padding: 10px; background: #f0f0f0; cursor:pointer; border-radius: 5px 0 0 5px;}
.apl_txt:hover,
.apl_txt:focus {background: var(--base-button);}
.apl_txt > span:first-child {padding-right: 10px}
.search_ts {height: 100%; display: block;}
.traking_input {padding: 10px; flex:1;}

    /*BLF dropdown box*/
    .dropbtn { background-color: #ebebeb; color: white; padding: 10px; font-size: 15px; border: none; border-radius: 5px 0 0 5px; cursor: pointer; width: 100%; display: flex; align-items: center; justify-content: space-between; transition: all 0.2s ease-in; }
    .dropbtn span {color: #2f2f2f;}
    .dropbtn span:nth-child(2) {font-size: 10px; margin-left: 10px;}        
    .dropbtn:hover, .dropbtn:focus { background-color: var(--base-button); }
    .myInput { box-sizing: border-box; /*background-image: url('searchicon.png'); */ background-position: 14px 12px; background-repeat: no-repeat; font-size: 16px; padding: 10px; border: none; border-bottom: 1px solid #ddd; width: 100%;}    
    .myInput:focus {outline: 3px solid #dddddd; border:2px solid var(--checkbtn-back)}
        
        .dropdown { position: relative; display: inline-block; min-width: 250px;}
        .dropdown-content { display: none; position: absolute; background-color: #f6f6f6; width: 100%; min-width: 300px; overflow: auto; border: 1px solid #ddd; z-index: 1; }
        .dropdown-content a { color: black; padding: 12px 16px; text-decoration: none; display: block; }
        .list_drop { max-height: 200px; overflow-y: auto; }
        .dropdown a:hover {background-color: #ddd;}
        .show {display: block;}


.terminal_box_grp {font-size: 13px; display: table; width:100%; border-bottom:1px solid #dfdfdf; border-right:1px solid #dfdfdf;}
.terminal_cell_header {background: #f9f9f9; width: 100%; display: table-row;}
.terminal_cell_header > div {width: 10%; position: relative; padding: 10px; display: table-cell; word-break: keep-all; vertical-align: middle; text-align: center; border-top: 2px solid var(--base-point-color); border-left: 1px solid #dfdfdf;}
.terminal_cell_header > div:nth-child(1) {width: 8%;}
.terminal_cell_header > div:nth-child(2) {width: 9%;}
.terminal_cell_header > div:nth-child(3) {width: 8%;}
.terminal_cell_header > div:nth-child(4) {width: 8%;}
.terminal_cell_header > div:nth-child(5) {width: 11%;}
.terminal_cell_header > div:nth-child(6) {width: 10%;}
.terminal_cell_header > div:nth-child(7) {width: 10%;}
.terminal_cell_header > div:nth-child(8) {width: 10%;}
.terminal_cell_header > div:nth-child(9) {width: 8%;}
.terminal_cell_header > div:nth-child(10) {width: 6%;}
.terminal_cell_header > div:nth-child(11) {width: 6%;}
.terminal_cell_header > div:nth-child(12) {width: 6%;}

.terminal_cell_box > div:nth-child(3) > a {display: block; width: 100%; text-decoration: underline; color:#5e5e5e;}
.terminal_cell_box > div:nth-child(3) > a:hover {color:var(--number-point);}
.terminal_cell_box {display: table-row;}
.terminal_cell_box > div {position: relative; padding: 10px; display: table-cell; vertical-align: middle; text-align: left; border-top: 1px solid #dfdfdf; border-left: 1px solid #dfdfdf; width: auto; word-break: break-all; text-align: center;}
.terminal_cell_box > div p {display: none;}
.terminal_cell_box > div:nth-child(2) > a {width: 100%; text-decoration: underline; color:#5e5e5e; font-family: 'SUIT-Bold', 'Spoqa Han Sans Neo_Bold';}
.terminal_cell_box .svg-inline--fa.fa-table-cells-large,
.terminal_cell_box .svg-inline--fa.fa-calendar-check,
.terminal_cell_box > div:nth-child(2) a i {font-size: 1rem; color: #9c9c9c;}
.terminal_cell_box > div:nth-child(2) a:hover i {color:var(--base-point-color);}
.terminal_cell_box .fa-filter {color: var(--base-point-color); font-size: 11px; cursor: pointer;}
.terminal_cell_box > div:nth-child(1),
.terminal_cell_box > div:nth-child(2),
.terminal_cell_box > div:nth-child(3){text-align: left;}
.terminal_cell_box > div:nth-child(6) {color: #886425;}
.terminal_cell_box > div:nth-child(7) {color: #254588;}
.terminal_cell_box > div:nth-child(8) {color: #788825;}
.terminal_cell_box .ac_fs > b {margin-right: 10px;}
.scd_box {margin-bottom: 1px; margin-left: 5px; display: block;}

.cargo_tm {color: #15a551; white-space: nowrap;} 
.cargo_tm > img {margin-right: 5px;}
.arrived_tm  {color: #2f75d1; white-space: nowrap;}
.arrived_tm > img {margin-right: 5px;}
.progress_tm {color: #4436c2; white-space: nowrap;}
.progress_tm > img {margin-right: 5px;}
.dep_tm {color: var(--button-point-orange); white-space: nowrap;}
.dep_tm > img {margin-right: 5px;}
.open_tm {color: #36a8c2; width: 100%; white-space: nowrap;}
.open_tm > img {margin-right: 5px;}
.normal_tm {color: #2f2f2f; white-space: nowrap;}

.open_date {color: #288499;}
.contain_schedule .special_option:hover {background: #fffdf5;}
.contain_schedule .special_option:nth-child(4) {border-right: 0;}
.terminal_cell_header .fa-circle-info {color:#c7c7c7;}


/*.contain_schedule .special_option h4 > input.cus_check[type="checkbox"] + label:before {margin:-5px 8px 0 0;}
.contain_schedule .special_option:nth-child(n+5) {border-top: 1px solid #dfdfdf;}*/

.terminal_cell_box .info_text_notice {bottom:100%; opacity: 0; z-index: -1; left:0; bottom: 100%; margin-bottom: 10px; width: 100px; text-align: center;}
.terminal_cell_box .info_text_notice::before {right: auto; left: 0; margin-left: 0; bottom: -5px; border-top: 10px solid #3b3b3b;  border-right: 10px solid transparent; border-left: 10px solid transparent;}
.terminal_cell_box .info_text_notice.on {z-index: 1; bottom:90%; opacity: 1;}
.terminal_cell_box .fa-calendar-check + .info_text_notice {width: 105px;}


.terminal_grp {margin-top:20px; width: 100%; display: grid; row-gap: 10px; column-gap: 10px; grid-template-columns: repeat(4, 1fr);}
.terminal_grp .comp_name {color: #555a99;font-family: 'SUIT-SemiBold', 'Spoqa Han Sans Neo_Medium';}
.terminal_grp .logist_cp.done {color: #838383; background: #f1f1f1;} 
.terminal_grp .logist_cp.done .graph_ship_state {background: #a3a3a3;}
.terminal_grp .logist_cp.done .main_percent,
.terminal_grp .logist_cp.done .comp_name,
.terminal_grp .logist_cp.done .percent_tm, 
.terminal_grp .logist_cp.done .time_checks:nth-child(1) span, 
.terminal_grp .logist_cp.done .time_checks:nth-child(2) span, 
.terminal_grp .logist_cp.done .time_checks:nth-child(3) span {color: #838383;} 
.terminal_grp .logist_cp.done .docking > i::before {background: #838383;} 
.terminal_grp .logist_cp.done .state_ship_terminal .fz_m5.ff_7.ac_fs i > img {filter: grayscale(1); opacity: 0.5;} 
.terminal_grp .logist_cp {display: flex; align-items: stretch; justify-content: space-between; flex-direction: column;}
.terminal_cp {padding: 20px;  border-radius: 20px; border:1px solid #e9e9e9;}
.state_ship_terminal {display: flex; flex-wrap: wrap; align-items: center;}
.state_ship_terminal span:nth-child(1) {width: 70%;}
.state_ship_terminal span:nth-child(2) {width: 30%; text-align: right;}
.bar_ship_state {flex-grow: 1; height: 3px; position: relative; width: 100%; background: #dbdbdb;}
.graph_ship_state {height: 100%; position: absolute; top:0; left: 0; background: var(--button-point-redOrange);}
.terminal_state {display: flex; align-items: stretch; justify-content: space-between; background: #fdfdfd; padding-top: 10px; padding-bottom: 10px; margin-top: 10px; margin-bottom: 10px; border-top: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf;}
.time_checks {width: 33.3%;}
.time_checks span:first-child {color: #868686;}
.time_checks span:nth-child(2) {color: #5f5f5f; /*font-family: 'SUIT-Bold', 'Spoqa Han Sans Neo_Bold';*/ font-family: 'SUIT-SemiBold', 'Spoqa Han Sans Neo_Medium';}
.time_checks:nth-child(1) span {color: #663c16;}
.time_checks:nth-child(2) span {color: #2f6847; /*font-family: 'SUIT-Bold', 'Spoqa Han Sans Neo_Bold';*/ font-family: 'SUIT-SemiBold', 'Spoqa Han Sans Neo_Medium';}
.time_checks:nth-child(3) span {color: #555a99; /*font-family: 'SUIT-Bold', 'Spoqa Han Sans Neo_Bold';*/ font-family: 'SUIT-SemiBold', 'Spoqa Han Sans Neo_Medium';}
.time_checks span {display: block; text-align: center; font-size: 0.9rem;}

.percent_state {display: flex; align-items: stretch; justify-content: space-between; background: #f6f6f6; border-radius: 5px; padding: 0 5px;}
.count_tm {text-align: right; width: 100%; display: block; font-size: 0.85rem;}
.tm_percent {display: flex; flex-wrap: wrap; width: 33.3%; border-right: 1px solid #dfdfdf; justify-content: space-between; align-items: stretch; padding: 10px;}
.tm_percent:last-of-type{border-right: 0;}
.tm_percent:last-of-type .percent_tm {color: #e73600; font-weight: 600;}
.percent_tm {text-align: right; width: 100%; display: block; color: #555a99;}
.count_state {width: 60%;}
.docking {width: 40%; text-align: left; display: flex; align-items: center; justify-content: flex-start;}
.docking i {padding-top: 5px; position: relative;}
.docking > i::before {content:''; width: 15px; height: 2px; position: absolute; top:0; left: 5px; background: #555a99;}
.tm_percent:last-of-type .docking > i::before {background: #e73600;}
.state_ship_terminal .fz_m5.ff_7.ac_fs i {margin-left: 10px;}
.main_percent {color: #555a99;}
.graph_ship_state { -webkit-transition: all 2s ease-out; -moz-transition: all 2s ease-out; -ms-transition: all 2s ease-out; -o-transition: all 2s ease-out; transition: all 2s ease-out; width: 0; }
.delay_terminal {display: block; color: #5f5f5f;}


.fcl_sec {border-top: 1px solid #dfdfdf; padding:40px 20px;}
.fcl_inner {width: 100%; margin:0 auto; display: flex; align-items: flex-start; flex-wrap: wrap;}
.tab_text {width: 20%; background: #ededed;}
.tab_fcl {margin-right: 1px; text-align: center; width :100%;}
.tab_fcl > a {width :100%; background: #f1f1f1; display: block; transition: all 0.2s ease-in; padding: 20px; color: #7a7a7a; text-align: center; background: rgb(241,241,241); background: linear-gradient(90deg, rgba(241,241,241,1) 0%, rgba(241,241,241,1) 90%, rgb(231, 231, 231) 100%);}
.tab_fcl > a > img {margin:0 auto; opacity: 0.6; transition: all 0.2s ease-in;}
.fcl_inner .special_option {position: relative; width: 100%; border:0; padding: 10px 0;}
.lcl_service,
.fcl_service {border:1px solid #dfdfdf; padding: 30px; flex: 1; background: #fff;}
.tab_text .active {position: relative; background: #ffffff; border-right: 0; background: #d9eede; color: #2f2f2f;}
.tab_fcl > a.active > img {opacity: 1;} 
.tab_text .tab_fcl:hover > a {background: #b8e6d1; color: #2f2f2f;}
.tab_text .tab_fcl:hover > a img {opacity: 1;}
.fcl_inner .add_columns {flex-grow: 1;}
.fcl_h4 {margin-bottom: 10px; position: relative;}
.fcl_h4::before {content: ''; height: 2px; width :15px; background: #07961a; left: 0; top:-10px; position: absolute;}  
.lcl_service .fcl_h4::before {background:var(--button-point-color);}  
.harbor {position: relative;}

.sample_nation {display: none; position: absolute; left: 0; top:32px; z-index: 1; width: 100%; box-shadow: 1px 1px 5px rgba(0,0,0,0.1); max-width: 800px; z-index: 2;}
.sample_nation h5 {display: flex; align-items: center; justify-content: space-between; background: var(--button-point-color); padding: 10px; color: #fff;}
.sample_nation .svg-inline--fa,
.sample_nation i {color: #fff; font-size:25px; cursor: pointer;}

.nation_select {background: #fff; overflow-y: auto; height: 468px;}
.nation_div {display: flex; align-items: stretch; justify-content: space-between; width: 100%; border-bottom: 1px solid #dfdfdf;;}
.nation_div:last-of-type{border-bottom: 0;}
.nation_div div a {word-break: break-all; line-height: 1.1; margin-bottom: 5px;}
.nation_div div:nth-child(1) {color: #84612d; width: 60px; background: var(--bg-cell-color); text-align: center; padding: 10px; padding-top: 7px;}
.nation_div div:nth-child(2) {flex:1; width: 100%; display: flex; flex-wrap: wrap; padding: 10px;}  
.nation_div div:nth-child(2) a {width: 20%; text-align: left; padding:0 10px;}
.nation_div div:nth-child(2) a:hover {text-decoration: underline; font-weight: 600;}
.lcl_service {display: none;}
.lcl_service .special_option {border-top:0; border-left:0;}
.harbor .myInput {padding: 5px 7px; outline: none; border: 1px solid #dfdfdf; color: var(--base-form-color); width: 100%; border-radius: 0; font-size: inherit;}


    .harbor .dropdown-content{top: 34px; border:0; box-shadow: 1px 1px 3px rgba(0,0,0,.1);}
    .harbor .dropdown-content a {border-left: 1px solid #dfdfdf; border-top: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf; padding: 5px 10px; background: #fff;}
    .harbor .dropdown-content a:hover, 
    .harbor .dropdown-content a:focus{background: #f2f2f2;}
    

    .select_option {width: 250px; padding: 0; background: #fff; padding: 20px; border-radius: 5px; border:1px solid #dfdfdf; word-break: break-all;}
    .select_option > div:first-of-type h4{margin-top: 0;}
    .fcl_list_w {margin-top: 30px; display: flex; align-items: flex-start; justify-content: space-between; flex-direction: row-reverse;}
    .fcl_title {padding-bottom: 10px; margin-top: 30px;}
    
    .fcl_div {width: calc(100% - 280px);}
    .fcl_div .tb_box_grp {background: #fff; border:0;}
    
    .fcl_cell_header {background: #f9f9f9;  display: flex; align-items: stretch; justify-content: flex-start;}
    .fcl_cell_header > div {border-bottom: 1px solid #dfdfdf;}
    .fcl_cell_header > div:nth-child(odd) {background:#ffffff;}
    .fcl_cell_header > div:nth-child(1) {width: 10%;}
    .fcl_cell_header > div:nth-child(2) {width: 20%;}
    .fcl_cell_header > div:nth-child(3) {width: 12%;}
    .fcl_cell_header > div:nth-child(4) {width: 12%;}
    .fcl_cell_header > div:nth-child(5) {width: 12%;}
    .fcl_cell_header > div:nth-child(6) {width: 10%;}
    .fcl_cell_header > div:nth-child(7) {width: 8%;}
    .fcl_cell_header > div:nth-child(8) {width: 8%;}
    .fcl_cell_header > div:nth-child(9) {width: 8%;}
    .fcl_cell_header .fa-circle-info {color: #c7c7c7; cursor: pointer;}
    
    .fcl_cell_box {background: #fff;  display: flex; align-items: stretch; justify-content: flex-start;}
    .fcl_cell_box > div {display: flex; align-items: flex-start; justify-content: center; flex-direction: column;}
    .fcl_cell_box > div:nth-child(1) {width: 10%;}
    .fcl_cell_box > div:nth-child(2){width: 20%;}
    .fcl_cell_box > div:nth-child(3){width: 12%;}
    .fcl_cell_box > div:nth-child(4){width: 12%;}
    .fcl_cell_box > div:nth-child(5){width: 12%; align-items: center;}
    .fcl_cell_box > div:nth-child(6){width: 10%; align-items: center;}
    .fcl_cell_box > div:nth-child(7){width: 8%; align-items: center;}
    .fcl_cell_box > div:nth-child(8){width: 8%; align-items: center;}
    .fcl_cell_box > div:nth-child(9){width: 8%; align-items: center;}
    
    .fcl_cell_box .fa-filter {color: var(--base-point-color); font-size: 11px; cursor: pointer;}
    .fcl_cell_header > div {position: relative; padding: 10px; word-break: break-all; vertical-align: middle; text-align: center; border-top: 2px solid var(--base-point-color);/* border-left: 1px solid #dfdfdf;*/ display: flex; align-items: center; justify-content: center;}
    .fcl_cell_box > div {border-bottom: 1px solid #dfdfdf; position: relative; padding: 10px; vertical-align: middle; text-align: left;}
    .fcl_cell_box > div:first-child {text-align: left;}
    .fcl_cell_box .ship_logo > img {margin:0 auto; max-width: 100%;}
    .fcl_cell_box > div:nth-child(even) {background: #fbfbfb;}
    .link_ship {text-decoration: underline; color: #5e5e5e;}
    .link_ship:hover {text-decoration: underline; color: var(--number-point);}
    .icon_fcl {font-size: 1.1rem; cursor: pointer; display: block; padding: 15px;}
    .fa-solid.fa-link.icon_fcl {color:#555a99; opacity: 0.8;}
    .fa-solid.fa-link.icon_fcl:hover {background: #f1f1f1;}
    .link_area .svg-inline--fa,
    .fa-solid.fa-phone.icon_fcl,
    .fa-solid.fa-minus.icon_fcl {color:#555a99;}
    .fa-solid.fa-minus.icon_fcl:hover {background:#fff7f2;}
    .link_cfs .fa-boxes-stacked,
    .fa-solid.fa-boxes-stacked.icon_fcl,
    .fa-solid.fa-plus.icon_fcl {color:var(--number-point);}
    .fa-solid.fa-plus.icon_fcl:hover {background:#fff7f2;}
    .o_f {padding: 3px 10px; width: 100%; display: block; text-align: right; word-break: break-all;}
    .orde_name {color: var(--base-form-color);}

    .start_port {color: #886425; word-break: break-all;}
    .end_port {color:#254588; word-break: break-all;}
    .detail_vessel {padding: 20px; display: none; background: #fbfbfb; border-bottom: 1px solid #dfdfdf;}
    .tb_detail {width: 100%; margin-top: 15px; background: #fff;}
    .tb_detail tr:first-of-type > th {background: #e4edff;}
    .tb_detail th,
    .tb_detail td {padding:5px; text-align: center;}
    .tb_detail th {background: #f6f9ff; font-weight: 500; line-height: 1.2;}
    .tb_detail td {border:1px solid #dfdfdf; vertical-align: middle;}
    .fairway {position: relative;}
    .fairway::before {background: #ffddc3; width: 100%; height: 2px; content: ''; position: absolute; top: 50%;}
    .fairway {display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;}
    .fairway > div {width: 6.25%; padding-top: 50px; padding-bottom: 50px; position: relative; flex-grow: 1;}
    .nation_rec {position: relative;}
    .last_date {position: relative;}
    .last_date > span {color: #5f5f5f; line-height: 1; word-break: break-all; position: absolute; top: 50%; width: 100%; text-align: center; margin-top: -35px;}
    .nation_rec > span {line-height: 1; word-break: break-all; position: absolute; top: 50%; width: 100%; text-align: center; margin-top: 10px;}
    .nation_rec::before {width: 7px; height: 7px; background: var(--button-point-redOrange); position: absolute; content: ''; left: 50%; top: 50%; margin-top:-2.5px; margin-left:-3.5px;}
    .nation_rec > span {line-height: 1; word-break: break-all; position: absolute; top: 50%; width: 100%; text-align: center; margin-top: 10px;}
    .no_nation_rec::before {position: absolute; content: ''; left: 50%; top: 50%; margin-top:-2.5px; margin-left:-3.5px;}
    
    .ground_ship {position: relative; background: #fff;}
    .logo_ship {position: absolute; width: 20px; z-index: 1;}
    .logo_ship > img {width: 100%;}
    .no_nation_curved_top {background: #fff; position: relative;}
    .no_nation_curved_top::before {position: absolute; top: 50%; width: 50%; left:0; content: ''; height: 2px; background: #ffddc3;}
    .no_nation_curved_top::after {position: absolute; top: 50%; width: 2px; left:50%; content: ''; height: 50%; background: #ffddc3;}
    .no_nation_curved_bottom {background: #fff; position: relative;}
    .no_nation_curved_bottom::before {position: absolute; top: 50%; width: 50%; left:0; content: ''; height: 2px; background: #ffddc3;}
    .no_nation_curved_bottom::after {position: absolute; top: 0; width: 2px; left:50%; content: ''; height: calc(50% + 2px); background: #ffddc3;}
    .cut_off,
    .contact_phone {font-weight: 500; color: #555a99;}
    .contact_phone .svg-inline--fa,
    .contact_phone i{margin-right: 10px;}
    
    .noUi-connect {background: var(--checkbtn-back) !important;}
    .noUi-tooltip {border:none !important;}
    .noUi-target {margin-top: 20px !important; width: 90%; margin:0 auto;}
    .noUi-horizontal .noUi-tooltip {bottom: 80% !important; background: transparent;}
    .noUi-handle::before,
    .noUi-handle:after{display: none !important;}
    .tab_guide {display: none;}
    .tab_guide > a {display: flex; align-items: center; justify-content: center;}
    .tab02, .tab03, .tab04 {display: block;}
    .link_detail {display: none;}
    .show_time {cursor: pointer;}
    .fcl_cell_box > div.link_fcl {padding: 0;}
    .link_area {display: block; width:100%; height: 100%; display: flex; align-items: center; justify-content: center;}
    .link_detail {margin-left: 5px;}
    .m_fcl {display: none; align-items: stretch; justify-content: space-between; border-top: 1px solid #dfdfdf;}
    .m_fcl > div {width: 45%;}
    .arrow_ct {width: 5%; display: flex; align-items: center;}
    .income {width: 50%;}
    .outcome {width: 50%;}
    

    /*LCL detail*/
    .lcl_cell_box > div.ac_sb {flex-direction: row; align-items: center; justify-content: space-between;}
    .lcl_cell_box > div.ac_sb .lcl_ship > span {display: block;}

    .lcl_cell_header {background: #f9f9f9;  display: flex; align-items: stretch; justify-content: flex-start;}
    .lcl_cell_header > div:nth-child(odd) {background:#ffffff;}
    .lcl_cell_header > div > b {line-height: 1.1;}
    .lcl_cell_header > div:nth-child(1) {width: 10%;}
    .lcl_cell_header > div:nth-child(2) {width: 20%;}
    .lcl_cell_header > div:nth-child(3) {width: 12%;}
    .lcl_cell_header > div:nth-child(4) {width: 12%;}
    .lcl_cell_header > div:nth-child(5) {width: 15%;}
    .lcl_cell_header > div:nth-child(6) {width: 13%;}
    .lcl_cell_header > div:nth-child(7) {width: 6%;}
    .lcl_cell_header > div:nth-child(8) {width: 6%;}
    .lcl_cell_header > div:nth-child(9) {width: 6%;}
    .lcl_cell_header .fa-circle-info {color: #c7c7c7; cursor: pointer;}
    .lcl_cell_header > div {position: relative; border:1px solid #dfdfdf; padding: 10px;  word-break: break-all; vertical-align: middle; text-align: center; border-top: 2px solid var(--base-point-color); display: flex; align-items: center; justify-content: center;}
    
    .lcl_cell_box {background: #fff;  display: flex; align-items: stretch; justify-content: flex-start;}
    .lcl_cell_box > div {display: flex; align-items: flex-start; justify-content: center; flex-direction: column;}
    
    .lcl_cell_box > div:nth-child(1){width: 10%;}
    .lcl_cell_box > div:nth-child(2){width: 20%; flex-direction: row; align-items: center; justify-content: space-between;}
    .lcl_cell_box > div:nth-child(3){width: 12%;}
    .lcl_cell_box > div:nth-child(4){width: 12%;}
    .lcl_cell_box > div:nth-child(5){width: 15%; align-items: flex-start;}
    .lcl_cell_box > div:nth-child(6){width: 13%; align-items: flex-start;}
    .lcl_cell_box > div:nth-child(7){width: 6%; align-items: center;}
    .lcl_cell_box > div:nth-child(8){width: 6%; align-items: center;}
    .lcl_cell_box > div:nth-child(9){width: 6%; align-items: center;}

    .lcl_cell_box .fa-filter {color: var(--base-point-color); font-size: 11px; cursor: pointer;}
    .lcl_cell_box > div {border-bottom: 1px solid #dfdfdf; position: relative; padding: 10px; vertical-align: middle; text-align: left;}
    .lcl_cell_box > div:first-child {text-align: left;}
    .lcl_cell_box > div:nth-child(even) {background: #fbfbfb;}
    .lcl_cell_box .ship_logo > img {margin:0 auto; max-width: 100%;}
    .lcl_ship > a {display: block; word-break: break-all;}  
    .fcl_info_state label[for="cbx_chkAll_al"] {margin-right: 10px; width: 100%;}
    .lcl_mtit {display: none;}
    
    .link_lcl .info_text_notice {position: absolute; padding: 10px; opacity: 0; background: #3b3b3b; bottom:100%; color: #fff; width: 190px; border-radius: 5px; right: 0; z-index: -2; transition: all ease-in 0.2s; }
    .link_lcl .info_text_notice.on {opacity: 1; bottom:100%; z-index: 3;}
    .link_lcl .info_text_notice::before { content: ''; position: absolute; border-top: 15px solid #3b3b3b; border-right: 15px solid transparent; border-left: 15px solid transparent; width: 0; right: 20px; height: 0; bottom: -10px; opacity: 1; }
    
    .link_cfs .info_text_notice {position: absolute; padding: 10px; opacity: 0; background: #3b3b3b; bottom:100%; color: #fff; width: 190px; border-radius: 5px; right: 0; z-index: -1; transition: all ease-in 0.2s; }
    .link_cfs .info_text_notice.on {opacity: 1; bottom:100%; z-index: 3;}
    .link_cfs .info_text_notice::before { content: ''; position: absolute; border-top: 15px solid #3b3b3b; border-right: 15px solid transparent; border-left: 15px solid transparent; width: 0; right: 20px; height: 0; bottom: -10px; opacity: 1; }

    .sample_nation.fcl_layout {right:0; left:auto; width: 700px;}


/*modal popup*/
/*.popup_back {display: none; z-index: 20; background: rgba(0,0,0,0.6); top:0; left:0; width:100%; height: 100%; position: fixed;}
.pop_layer {width:100%; height: 100%; position: fixed; display: flex; align-items: center; background: transparent; display: none; justify-content: center; z-index: 23; top:0;}
.pop_hd {background: #2c2c2c; position: relative; color: #fff; padding:10px 20px; border-radius: 10px 10px 0 0;}
.pop_close {position: absolute; right:0; top: -45px;}
.pop_close .svg-inline--fa.fa-xmark,
.pop_close i {background: transparent; font-size: 2.5rem; color: #fff;}
.pop_grps {width: 90%; max-width: 600px; padding: 0;}
.pop_content {background: #fff; padding: 20px; border-radius: 0 0 10px 10px;}
.pop_content_ag {position: relative; overflow-y: auto; padding: 20px; height: calc(100% -  47px); background: #fff;}
.done_popup {position: relative; top: 0; left:0; width :100%; display: flex; align-items: stretch; justify-content: flex-end; padding: 10px; background: #fff; gap:5px; flex-wrap: wrap;}
.done_popup_multi {position: relative; top: 0; left:0; width :100%; display: flex; align-items: stretch; justify-content: space-between; padding: 10px; background: #fff; flex-wrap: wrap;}
    
    .divide_done {width: 50%; display: flex; align-items: center; justify-content: flex-start;gap: 5px;}
    .divide_done_rt {width: 50%; display: flex; align-items: center; justify-content: flex-end; gap: 5px;}
    .search_btn_rec  {border:1px solid #dfdfdf; padding: 5px 10px; background: #fff; color: #2f2f2f; font-size: 0.87rem; background: #f3f3f3;}
*/


.popup_back {display: none;z-index: 40;background: rgba(0, 0, 0, 0.6);top: 0;left: 0;width: 100%;height: 100%;position: fixed;}
.pop_layer {width: 100%;height: 100%;position: fixed;display: flex;align-items: center;background: transparent;display: none;justify-content: center;z-index: 42;top: 0;}
.pop_hd { display: flex; align-items: center; justify-content: space-between; background: linear-gradient(90deg, #21283a 0%, #282e81 100%); position: relative; color: #fff; padding: 5px 10px; border-radius: 3px 3px 0 0; }
.pop_close .svg-inline--fa,
.pop_close i { background: transparent; font-size: 2rem; color: #fff; }

.reg_pop_close .svg-inline--fa,
.reg_pop_close i { background: transparent; font-size: 2rem; color: #fff; }

.pop_grps { width: 90%; max-width: 600px; padding: 0; }
.pop_content { background: #fff; padding: 20px; border-radius: 0 0 10px 10px; }
.pop_content_ag { position: relative; overflow-y: auto; padding: 10px; max-height: 70vh; background: #fff; }
.done_popup { position: relative; top: 0; left: 0; width: 100%; display: flex; align-items: stretch; justify-content: flex-end; padding: 10px; background: #fff; gap: 5px; flex-wrap: wrap; border-radius: 0 0 3px 3px; border-top: 1px solid #ebebeb; }
.done_popup_multi { position: relative; top: 0; left: 0; width: 100%; display: flex; align-items: stretch; justify-content: space-between; padding: 10px; background: #fff; flex-wrap: wrap; }
.divide_done { width: 50%; display: flex; align-items: center; justify-content: flex-start; gap: 5px; }
.divide_done_rt { width: 50%; display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.search_btn_rec { border: 1px solid #dfdfdf; padding: 5px 10px; background: #fff; color: #2f2f2f; font-size: 0.87rem; background: #f3f3f3; }
.pop_grps_auto { width: 90%; max-width: 1600px; padding: 0; }
.agree_conents { position: relative; padding-bottom: 60px; height: 100%; background: #fff; border-radius: 20px; }
.done_conents { position: relative; height: 100%; }
.define_agree { position: absolute; bottom: 0; width: 100%; background: #fff; left: 0; padding: 10px 10px; text-align: right; }
.agree_btn { transition: all ease-in 0.3s; padding: 7px 50px; background: #ff9f0f; color: #fff; display: inline-block; border-radius: 5px; margin-left: 5px; border: none; }
.cancel_btn { transition: all ease-in 0.3s; padding: 7px 50px; background: var(--button-del-cancel); color: #fff; display: inline-block; border-radius: 5px; margin-left: 5px; }
.agree_btn:hover,
.agree_btn:focus { background: #ff7800; color: #fff; }
.cancel_btn:hover,
.cancel_btn:focus { background: #797979; color: #fff; }
.title_pop_point { display: flex; align-items: flex-start; justify-content: flex-start; background: #eeeeee url(../img/title_icon_orange.png) no-repeat 5px 10px; padding-left: 16px; background-size: 6px; padding-top: 8px; padding-bottom: 8px; }
.title_pop { display: flex; align-items: flex-start; justify-content: flex-start; background: #eeeeee url(../img/title_icon_blue.png) no-repeat 5px 10px; padding-left: 16px; background-size: 6px; padding-top: 8px; padding-bottom: 8px; }

.pop_grps_auto.depth_layer {width: 50%; max-width: 500px; box-shadow: 2px 2px 10px rgba(0,0,0,0.3);}
.logis_status_view_popup .pop_grps_auto.depth_layer {max-width: 90%; width: 90%;}
.pop_layer.quote_list_view .pop_grps_auto {width: 96%; max-width: 96%;}
.pop_layer.depth_layer_pop.address_layer_popup {width: 100%; box-shadow: 2px 2px 10px rgba(0,0,0,0.3);}
.address_layer_popup .pop_grps_auto.depth_layer {width: 60%; max-width: 60%;}


.depth_layer_pop.booking_layer_popup .pop_grps_auto.depth_layer { width: 80%; max-width: 1500px;}
.booking_info_grp {display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 10px;}
.booking_info_grp > div {flex: 1;}


.reg_form_msg_send {display: none;}
.depth_layer_pop {z-index: 43; background: rgba(0,0,0,0.35);}
.pop_layer .block_layout_form {border-top: 1px solid #dfdfdf; border-bottom: none;}
.pop_layer .block_layout_form:last-of-type {border-bottom: 1px solid #dfdfdf;}

.unit_price {gap: 10px; flex-wrap:wrap;}
.unit_price .input_write {min-width:220px;width: 40%;max-width: 300px;}
.option_title {width: 80px;}
#booking_section {display: flex !important;}


.booking_info_items {display:flex; align-items:center; justify-content: flex-start; gap: 5px; flex-wrap: wrap; width: 100%;}
.bk_info_item {width: 14%;min-width: 150px;}
.bk_info_item h4 {margin-bottom:5px;}
    
    /*.pop_layer.item_detail_view .block_layout_form:nth-child(3) .area_input:nth-child(2) .set_contents {flex-wrap: wrap; display: flex; align-items: flex-start; justify-content: flex-start;}
    .pop_layer.item_detail_view .block_layout_form:nth-child(3) .area_input:nth-child(2) .set_contents .k-grid.k-widget.k-reorderable.k-editable {flex-basis: 100%;}*/
    .pop_layer .set_contents:has(.k-reorderable),
    .pop_layer .set_contents:has(.k-editable) {flex-wrap: wrap; display: flex; align-items: flex-start; justify-content: flex-start;} 
    .pop_layer .set_contents:has(.k-reorderable),
    .pop_layer .set_contents:has(.k-editable) .k-grid.k-grid-md.k-reorderable.k-editable {flex-basis: 100%;}
    .pop_layer.item_detail_view .content_form .area_input:nth-child(5) {flex-direction: column-reverse;}
    #multiFileUpload3 {width: 100%; margin-bottom: 5px;}
    .pop_layer.item_detail_view .k-dropzone-hint {flex: 1; text-align: left; color: #616161;}
    .pop_layer.item_detail_view #multiFileUpload3 .k-upload-files.k-reset {width: 100%; margin-left: 0;}
    

/*Bootstrap Calendar*/
.datepicker { border-radius: 0; padding: 0 !important; z-index: 1 !important; }
.datepicker-days table thead, .datepicker-days table tbody, .datepicker-days table tfoot { padding: 10px; display: list-item; }
.datepicker-days table thead, .datepicker-months table thead, .datepicker-years table thead, .datepicker-decades table thead, .datepicker-centuries table thead { background: #3546b3; color: #ffffff; border-radius: 0; }
.datepicker-days table thead tr:nth-child(2n+0) td, .datepicker-days table thead tr:nth-child(2n+0) th { border-radius: 3px; }
.datepicker-days table thead tr:nth-child(3n+0) { text-transform: uppercase; font-weight: 300 !important; font-size: 12px; /* color: rgba(255, 255, 255, 0.7); */ color: #fff; }
.datepicker td:hover,
.datepicker th:hover, 
.datepicker-days table thead tr:nth-child(2n+0) td:hover, 
.datepicker-days table thead tr:nth-child(2n+0) th:hover,
.datepicker-days table thead tr:nth-child(3n+0):hover {background: transparent !important;}
.datepicker table tr td.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active:hover {background-image: linear-gradient(to bottom, var(--button-point-color),var(--button-point-color)) !important; background-color: var(--button-point-color) !important;}
.datepicker table tr td.active.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled.disabled, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active.disabled:hover.active, .datepicker table tr td.active.disabled:hover.disabled, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active.disabled:hover:hover, .datepicker table tr td.active.disabled:hover[disabled], .datepicker table tr td.active.disabled[disabled], .datepicker table tr td.active:active, .datepicker table tr td.active:hover, .datepicker table tr td.active:hover.active, .datepicker table tr td.active:hover.disabled, .datepicker table tr td.active:hover:active, .datepicker table tr td.active:hover:hover, .datepicker table tr td.active:hover[disabled], .datepicker table tr td.active[disabled] {background-color: var(--button-point-color) !important;}
.datepicker-days table tfoot {display: none;}
.table-condensed > tbody > tr > td, .table-condensed > tbody > tr > th, .table-condensed > tfoot > tr > td, .table-condensed > tfoot > tr > th, .table-condensed > thead > tr > td, .table-condensed > thead > tr > th { padding: 5px 7px; font-size: 16px; width: 50px; }
.datepicker-months table thead td, .datepicker-months table thead th, .datepicker-years table thead td, .datepicker-years table thead th, .datepicker-decades table thead td, .datepicker-decades table thead th, .datepicker-centuries table thead td, .datepicker-centuries table thead th { border-radius: 0; }
.datepicker td, .datepicker th { border-radius: 50%; padding: 0 12px; }
.datepicker-days table thead, .datepicker-months table thead, .datepicker-years table thead, .datepicker-decades table thead, .datepicker-centuries table thead { background: /*#3546b3*/var(--button-point-color); color: #ffffff; border-radius: 0; }
.datepicker table tr td.active, .datepicker table tr td.active:hover, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled:hover { background-image: none; }
.datepicker .prev, .datepicker .next { color: #fff; transition: 0.3s; width: 37px; height: 37px; }
.datepicker .prev:hover, .datepicker .next:hover { background: transparent; color: rgba(255, 255, 255, 0.99); font-size: 21px; }
.datepicker .datepicker-switch { font-size: 24px; font-weight: 400; transition: 0.3s; }
.datepicker .datepicker-switch:hover { background: transparent !important; }
.datepicker table tr td span { border-radius: 2px; margin: 3%; width: 27%; }
.datepicker table tr td span.active, .datepicker table tr td span.active:hover, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled:hover { background-color: #3546b3; background-image: none; }
.dropdown-menu { border: 1px solid rgba(0,0,0,.1); box-shadow: 0 6px 12px rgba(0,0,0,.175); }
.datepicker-dropdown.datepicker-orient-top:before { border-top: 7px solid rgba(0,0,0,.1); }


    .add_input_pop {display: flex; align-items: stretch; justify-content: space-between; gap: 5px; margin-bottom: 5px; flex-wrap: wrap;}


.storage {display: flex; align-items: center; min-width: 180px; background: #f7f7f7; text-align: center; padding: 15px;}
.storage > h4 {display: flex; align-items: center; text-align: left; word-break: keep-all;}
.storage > h4 > b {color: #9e9e9e; font-size: 0.8rem; margin-left: 3px;}
.select_storage {margin: 5px; margin-right: 10px; padding: 8px 20px; border-radius: 30px; border:1px solid #dfdfdf; cursor: pointer;}
.select_storage.active {background: var(--button-point-color); border:1px solid var(--button-point-color); color: #fff; font-family: 'SUIT-Bold', 'Spoqa Han Sans Neo_Bold';}

.storage_guide_text {color: #5f5f5f; width: 100%; flex-grow: 1; margin-top: 10px;}
.guide_cbm {flex-grow: 1; width: 100%; color: #5f5f5f;}
.guide_cbm .svg-inline--fa.fa-hand-point-right,
.guide_cbm .svg-inline--fa.fa-check,
.storage_guide_text > .svg-inline--fa.fa-hand-point-right,
.guide_cbm > i {color: var(--button-point-color); margin-right: 10px;}
.store_con {flex:1; padding: 10px; display: flex; align-items: center; flex-wrap: wrap; width: 50%;}
.guide_cbm .count {color: var(--number-point);}
.dutie_box .store_con .input_write {width: 250px;}
.guide_cbm > i.fa-solid.fa-check {color:#555a99;}
.form-select.input_write {outline: 0; box-shadow: none; display: inline-block;}
.caution_txt p {color: #5f5f5f;}
.caution_txt p > i {margin-right: 10px;}
.caution_txt p:first-of-type {margin-top: 10px;}
.caution_txt .svg-inline--fa.fa-triangle-exclamation {margin-right: 10px; color: var(--button-point-color);}
.select_info_ly {position: absolute; top:0; left:0; width :100%; height: 100%; background: rgba(249, 196, 36, 0.6); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px);}
.cbm_layout {display: none;}


    .calculator {width: 100%; display: flex; align-items: flex-start; justify-content: space-between;}
    .cal_layout {width: 49%; position: relative; margin-top: 60px;}
    
    .block_cal {width: 100%; border-top: 2px solid var(--base-point-color); border-bottom: 1px solid #dfdfdf;}
    .block_cal td, .block_cal th {padding: 10px; border:1px solid #dfdfdf;} 
    .block_cal th {background: #fbfbfb; vertical-align: middle; position: relative; padding-left: 35px;}
    .block_cal th::before {position: absolute; left: 15px; top: auto; bottom: auto; height: 5px; width: 5px; content:''; background: #dfdfdf; margin: auto; margin-top: 8px;}
    .block_cal td {text-align: right; vertical-align: middle; font-size: 0.95rem;} 
    .block_cal .total_cal td,
    .block_cal .total_cal th {background: #fffaf5; border-top: 2px solid var(--button-point-color);}
    .total_cal {color:#dd6c03; background: #fffaf5;}
    .block_cal th.cal_city {background:#fffeee; position: relative; padding-left: 30px;}
    .block_cal th.cal_city::before {position: absolute; top: 19px; left: 15px; height: 10px; width: 5px; background: var(--button-point-color); content: ''; border-radius: 5px; margin: auto; margin-top: auto;}
    
    .group_cal {display: table; width: 50%; border-bottom: 1px solid #dfdfdf;}
    .group_cal .cal_td {display: table-row;}
    .group_cal .cal_td > div {display: table-cell; border-top: 1px solid #dfdfdf; border-left: 1px solid #dfdfdf;}
    
    .cal_val {padding: 0 10px; font-size: 1.05rem; color: #555a99;}
    .total_cal .cal_val {color:#dd6c03;}
    .view_city {position: absolute; top:0; left:0; width:100%; height:100%; background: #dfdfdf; display: flex; align-items: center; justify-content: center;}
    
    .result_btn {background: #4a4a4a; color: #fff; transition: all 0.1s ease-in; border: 0; padding: 10px 30px; z-index: 1; border-radius: 5px; box-shadow: 1px 1px 5px rgba(0,0,0,0.3);}
    .result_btn:hover,
    .result_btn:focus {color: #fff;}
    

.release_grp {display: flex; align-items: stretch; flex-wrap: wrap; justify-content: space-between;}
.release_grp > div {background: #f8f8f8; display: flex; align-items: center; justify-content: space-between; flex-direction: column; border:1px solid #dfdfdf; width: 19%; padding: 20px; border-radius: 20px;}
.release_grp > div:nth-child(1) a {color:#254588;}
.release_grp > div:nth-child(2) a {color:#3f2588;}
.release_grp > div:nth-child(3) a {color:#256c88;}
.release_grp > div:nth-child(4) a {color:#3a2588;}
.release_grp > div > a {display: block; width: 100%;}
.release_grp > div > a > h5 {text-align: left; width: 100%;}
.release_grp > div.cancel_release,
.release_grp > div.cancel_release a {color:#888888;}
.release_count {width: 100%; text-align: right;  margin-top: 50px; display: block;}
.store_select {border: 1px solid #dfdfdf; padding: 10px 10px; outline: none; color: #666666; width: 100%; max-width: 1000px; flex: 1;}

.release_working {width: 100%; display: flex; align-items: stretch; justify-content: space-between; border-top: 1px solid var(--button-point-redOrange); border-bottom: 1px solid var(--button-point-redOrange); margin-bottom: 20px;}
.squer_w.working_rel {background: var(--button-point-redOrange); text-align: center; color: #fff; display: flex; align-items: center; justify-content: center;}
.squer_w {flex: 1; padding: 10px 0; background: #fff; text-align: center; border-right:1px solid #dfdfdf;}
.squer_w:last-of-type {border-right: 0;}
.squer_w a {color: var(--number-point); padding: 0 10px;}
.squer_w > em {word-break: break-all;}

.search_release {box-sizing: border-box; flex-wrap: wrap; border:1px solid #dfdfdf; gap:10px 20px; background: #fdfdfd; padding: 15px; display: flex; align-items: flex-start; justify-content: space-between; border-radius: 5px;}
.grp_rel {width: calc(50% - 10px); display: flex; align-items: center; justify-content: space-between;}
.df_select{border: 1px solid #dfdfdf; width: 100%; outline: none; color: var(--base-form-color); padding: 6px 5px;}
.df_select:hover,
.df_select:focus {background: #f7f7f7; border:1px solid #b8b8b8;}


    /*plugin select box*/
    .grp_select_input .nice-select:hover,
    .grp_select_input .nice-select:focus {background: #f7f7f7; border:1px solid #b8b8b8;}
    .grp_select_input .nice-select {padding: 5px 7px; width: 40%; border:1px solid #dfdfdf; min-width: 55px; color:var(--base-form-color);}
    .grp_select_input select.nice-select,
    .nice-select .list {z-index: 2; width: 100%; box-shadow: 2px 2px 5px rgba(0,0,0,.2); box-shadow: 2px 2px 9px rgba(0,0,0,.2); border: 1px solid #ebebeb; max-height: 250px; overflow-y: auto;}
    .nice-select.df_select {padding: 5px 7px;}
    .nice-select {border-radius: 0; height: inherit; line-height: inherit; font-size: inherit;}
    .nice-select .option.selected {font-weight: 400;}
    .nice-select:after {border-bottom: 2px solid #b3b3b3; border-right: 2px solid #b3b3b3; right: 10px; width: 8px; height: 8px; margin-top: -6px;}
    .nice-select .option:hover, .nice-select .option.focus, .nice-select .option.selected.focus {background: #f7f7ff;}
    .nice-select .option {padding: 0 10px; border-bottom: 1px solid #f0f0f0; min-height: auto; line-height: 1.4; padding-top: 10px; padding-bottom: 10px; word-break: break-all; white-space: normal;}


.df_select_date{border: 1px solid #dfdfdf; width: 100%; max-width: 300px; outline: none; color: #666666; padding: 6px 5px;}
.df_select_date:hover,
.df_select_date:focus {background: #f7f7f7; border:1px solid #b8b8b8;}

.df_select_location{border: 1px solid #dfdfdf; width: 100%; max-width: 300px; outline: none; color: #666666; padding: 6px 5px;}
.df_select_location:hover,
.df_select_location:focus {background: #f7f7f7; border:1px solid #b8b8b8;}

.column_box .df_select.w100p {width: 100%; max-width: 100%;}
.join_sel_input {gap:10px;}
.grp_rel h4 { margin-bottom: 5px; font-size: 0.9rem; background: url(/resource/common/img/title_icon_yellow.png) no-repeat center left; padding-left: 12px;}
.child_rel >* {font-size: 0.9rem;}
.child_rel.gr_num01 {flex:1; padding:0 5px;}
.child_rel.gr_num02 {flex:1; padding:0 5px;}
.child_rel.gr_num03 {width: 50%; padding:0 5px;}

.child_rel.gr_num04 {flex:1; padding:0 5px;}
.child_rel.gr_num05 {flex:1; padding:0 5px;}
.child_rel.gr_num06 {flex:1; padding:0 5px;}  
.child_rel.gr_num07 {flex:1; padding:0 5px;}

.child_rel.gr_num08 {flex:1; padding:0 5px;} 
.child_rel.gr_num09 {flex:1; padding:0 5px;}   
.child_rel.gr_num10 {width: 50%; padding:0 5px;}

.child_rel.gr_num11 {flex:1; padding:0 5px;}
.child_rel.gr_num12 {flex:1; padding:0 5px;}
.child_rel.gr_num13 {flex:1; padding:0 5px;}

.child_rel.gr_num14 {width: 100%; padding:0 5px;}
.child_rel.gr_num15 {width: 100%; padding:0 5px;}

.child_rel.gr_num03 .join_sel_input .df_select,
.child_rel.gr_num10 .join_sel_input .df_select {flex-basis: 98px; flex-shrink: 0;}
.child_rel.gr_num12 .join_sel_input .input_write,
.child_rel.gr_num13 .join_sel_input .input_write,
.child_rel.gr_num03 .join_sel_input .input_write,
.child_rel.gr_num10 .join_sel_input .input_write {flex:1;}
.child_rel .input_write.form-control {font-size: 0.94rem;}

.release_search {flex:1; display: flex; align-items: stretch; justify-content: center;}
.release_search > .btn_action {margin: 0 5px; white-space: nowrap;}

.list_relase {margin-top: 20px;}
.list_relase .tb_box_grp {border-right: 0; border-bottom: 0;}
.list_cell_header {line-height: 1.2; border-bottom: 1px solid #dadada; background: #f9f9f9;  display: flex; align-items: stretch; justify-content: flex-start;  border-top:2px solid var(--base-point-color); font-size: 0.9rem;}
.list_cell_header > div {flex:1; background: #f9f9f9; display: flex; align-items: center; padding:7px 5px; word-break: break-all; border-left: var(--table-border-line);}
.list_cell_header > div:last-of-type {border-right:1px solid #dfdfdf;}
.list_cell_header > div:nth-child(1) {padding: 0 10px; flex:0; display: flex; align-items: center; justify-content: center;}

.list_cell_header > div.fx_1 {flex:1;}
.list_cell_header > div.fx_2 {flex:2;}
.list_cell_header > div.fx_3 {flex:3;}
.list_cell_header > div.fx_4 {flex:4;}
.list_cell_header > div > b {text-align: center; width: 100%; display: block; text-align: center; line-height: 1.3;}
.list_cell_header > div:nth-child(even) {background: var(--bg-cell-color);}

.list_cell_box {line-height: 1.2; border-bottom: var(--table-border-line); display: flex; align-items: stretch; justify-content: space-between; color: var(--base-lt-color);}
.list_cell_box b {display: none;}
.list_cell_box > div {border-left: var(--table-border-line); word-break: break-all; line-height: 1.3; padding:10px 5px; background: #fff; padding-top: 5px; padding-bottom: 5px; flex:1; text-align: center; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.list_cell_box > div:last-of-type {border-right: var(--table-border-line);}
.list_cell_box > div > a {text-decoration: underline;}
.list_cell_box > div > a:focus,
.list_cell_box > div > a:hover {color:var(--button-point-redOrange);}
.list_cell_box > div >* {line-height: 1.3;}
.list_cell_box > div:nth-child(1) {padding: 0 10px; flex:0; display: flex; align-items: center; justify-content: center;}
.list_cell_box > div.fx_1 {flex:1;}
.list_cell_box > div.fx_2 {flex:2;}
.list_cell_box > div.fx_3 {flex:3;}
.list_cell_box > div.fx_4 {flex:4;}
.list_cell_box > div:nth-child(even) {background: #fdfdfd;}


    /*popup*/
    .search_item {display: flex; align-items: flex-start; justify-content: space-between;}
    .item_select_search,
    .item_select_list {width: 48%;}
    .list_items {gap: 10px;}
    .item_add_list {margin-top:10px; font-size: 1rem; width: 100%;}
    .item_add_list th {border:1px solid #dfdfdf; border-top: 2px solid var(--base-point-color); word-break: break-all; padding: 5px; background: var(--tb-back-color);}
    .item_add_list td {border:1px solid #dfdfdf; padding: 5px; word-break: break-all;}
    .item_add_list th:first-of-type,
    .item_add_list td:first-of-type {vertical-align: middle;}
    
    
    .sm_cancel_btn{transition: all ease-in .3s;margin-left:0;padding: 7px 20px;background: var(--button-del-cancel);display: flex;align-items: center;justify-content: center;color: #fff;border-radius: 3px;border: none;line-height: 1.3;}
    .sm_cancel_btn:hover,
    .sm_cancel_btn:focus {background: #6b6b6b; color:#fff;}

    .sm_done_btn {transition: all ease-in .3s; padding: 7px 20px; background: var(--button-point-color); display: flex; align-items: center; justify-content: center; color: #fff; /*display: inline-block;*/ border-radius: 3px; border: none; white-space:normal; line-height: 1.3;}
    .sm_done_btn:hover,
    .sm_done_btn:focus {background: var(--button-point-redOrange); color:#fff;}

    .release_button {display: flex; align-items: stretch; justify-content: flex-end; gap:5px; flex-wrap: wrap; width: 100%;}
    .sm_release_btn {transition: all ease-in .3s; padding: 7px 20px; background: #6b6b6b; display: flex; align-items: center; justify-content: center; color: #fff; /*display: inline-block;*/ border-radius: 3px; border: none; white-space: normal; line-height: 1.3;}
    .sm_release_btn:hover,
    .sm_release_btn:focus {background: var(--button-point-redOrange); color:#fff;}
    
    .sm_releaseOut_btn {transition: all ease-in .3s; padding: 7px 20px; /*background: #094d07;*/ background: var(--button-point-redOrange); display: flex; align-items: center; color: #fff; /*display: inline-block;*/ border-radius: 3px; border: none; white-space: normal; line-height: 1.3;}
    .sm_releaseOut_btn:hover,
    .sm_releaseOut_btn:focus {background: #0f8b0b; color:#fff;}

    .sm_release_btn.qty {padding: 8px 12px;}

    .sm_reg_btn {transition: all ease-in .3s; padding: 7px 20px; background: #4d6ca4; display: flex; align-items: center; justify-content: center; color: var(--base-md-color); /*display: inline-block;*/ border: none; white-space: normal; border-radius: 3px; border:0; color:#fff; line-height: 1.3;}
    .sm_reg_btn:hover,
    .sm_reg:focus {background: var(--button-point-redOrange); color:#fff;}

    .sm_orderOut_btn {transition: all ease-in .3s; padding: 7px 20px; /*background: #094d07;*/ /*background: #0f8b0b;*/ background: #3775a1; display: flex; align-items: center;  justify-content: center; color: #fff; /*display: inline-block;*/ border-radius: 3px; border: none; white-space: normal; line-height: 1.3;}
    .sm_orderOut_btn:hover,
    .sm_orderOut_btn:focus {background: var(--button-point-redOrange); color:#fff;}
    
    .sm_post_btn {transition: all ease-in .3s; padding: 7px 20px; background: var(--color-point); display: flex; align-items: center;  justify-content: center; color: var(--base-md-color); /*display: inline-block;*/ border: none; white-space: normal; border-radius: 3px; border:0; color:#fff; line-height: 1.3;}
    .sm_post_btn:hover,
    .sm_post_btn:focus {background: var(--base-md-color); color:#fff;}
    
    .column_box > div > span.add_item_code {align-items: stretch;}
    .column_box > div > span.gap_items {gap:5px; flex-wrap: wrap;}
    .add_item_code {gap:5px;}
    .add_item_code .sm_release_btn{padding: 0 12px;}


    /*button */
    .st_cancel_btn{transition: all ease-in .3s; margin-left:0; padding: 4px 10px; background: var(--button-del-cancel); display: flex; align-items: center; justify-content: center; color: #fff; border-radius: 3px; border: none; line-height: 1.3; margin: 0 auto; width: 100%;  box-sizing: border-box !important;}
    .st_req_btn {transition: all ease-in .3s; padding: 4px 10px; background:#f3880d; display: flex; align-items: center; justify-content: center; color: #fff; /*display: inline-block;*/ border-radius: 3px; border: none; white-space:normal; line-height: 1.3; margin: 0 auto; width: 100%;  box-sizing: border-box !important;} 
    .st_receipt_btn {transition: all ease-in .3s; padding: 4px 10px; background: #555a99; display: flex; align-items: center; justify-content: center; color: #fff; /*display: inline-block;*/ border-radius: 3px; border: none; white-space: normal; line-height: 1.3; margin: 0 auto; width: 100%;  box-sizing: border-box !important;}
    .st_quote_btn {transition: all ease-in .3s; padding: 4px 10px; background: #538e9a; display: flex; align-items: center; justify-content: center; color: #fff; /*display: inline-block;*/ border-radius: 3px; border: none; white-space: normal; line-height: 1.3; margin: 0 auto; width: 100%;  box-sizing: border-box !important;}
    .st_view_btn {transition: all ease-in .3s; padding: 4px 10px; background: #4c6199; display: flex; align-items: center; justify-content: center; color: #fff; /*display: inline-block;*/ border-radius: 3px; border: none; white-space: normal; line-height: 1.3; margin: 0 auto; width: 100%;  box-sizing: border-box !important;}
    .st_releaseOut_btn {transition: all ease-in .3s; padding: 4px 10px; /*background: #094d07;*/ background: var(--button-point-redOrange); display: flex; align-items: center; color: #fff; /*display: inline-block;*/ border-radius: 3px; border: none; white-space: normal; line-height: 1.3; width: 100%;  box-sizing: border-box !important;}
    .st_reg_btn {transition: all ease-in .3s; padding: 4px 10px; background: #4d6ca4; display: flex; align-items: center; justify-content: center; color: var(--base-md-color); /*display: inline-block;*/ border: none; white-space: normal; border-radius: 3px; border:0; color:#fff; line-height: 1.3; width: 100%;  box-sizing: border-box !important;}
    .st_orderOut_btn {transition: all ease-in .3s; padding: 4px 10px; /*background: #094d07;*/ /*background: #0f8b0b;*/ background: #3775a1; display: flex; align-items: center;  justify-content: center; color: #fff; /*display: inline-block;*/ border-radius: 3px; border: none; white-space: normal; line-height: 1.3; width: 100%;  box-sizing: border-box !important;}
    .st_post_btn {transition: all ease-in .3s; padding: 4px 10px; background: var(--color-point); display: flex; align-items: center;  justify-content: center; color: var(--base-md-color); /*display: inline-block;*/ border: none; white-space: normal; border-radius: 3px; border:0; color:#fff; line-height: 1.3; width: 100%;  box-sizing: border-box !important;}


    /*popup*/
    .release_list {display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;} 
    .release_info {gap:10px; flex:1;  display: flex; align-items: stretch; justify-content: space-between; flex-wrap: wrap;}
    .release_info_state {width: 25%; background: var(--bg-cell-color);}
    .release_info_detail {border-top:1px solid #bebebe; flex:1; background: #f7f7f7; padding: 10px;}
    .release_order {border-top:1px solid var(--button-point-redOrange); width: 50%; background: #fff9ed; padding: 10px;}
    .layout_release {margin-bottom: 5px; display: flex; align-items: flex-start; justify-content: flex-start; gap: 10px;}
    .release_state:last-child {margin-bottom: 0;}
    .layout_release > span:first-of-type{width: 30%; padding-top: 2px; color: #5f5f5f;}
    .layout_release > span:last-of-type{gap:5px; display: flex; flex: 1;}
    .cancel_input {display: flex; gap: 5px;}
    .cancel_input,.info_release_code {flex-grow: 1; width: 100%;}
    .cancel_input .df_select {flex-basis: 80px;}
    .release_info_state {padding: 10px;}
    .release_state {border:1px solid #dfdfdf; background: #fff; margin-bottom: 10px; padding: 15px;}
    .release_state > h5 {margin-bottom: 10px; position: relative;}
    .release_state.active {color: var(--button-point-redOrange); border:1px solid var(--button-point-redOrange);}
    .release_state.active > h5:before {content: ''; position: absolute; top:5px; right:5px; width: 5px; height: 5px; border-radius: 100px; background: var(--number-point);}
    .release_state.cancel.active {color: #ff2600; border:1px solid #ff2600;}


    .cancel_management {background: var(--tb-back-color); padding: 10px; border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf; gap: 10px;}
    .cancel_management .cal_button {padding: 5px 30px;}

    .cancel_code .list_cell_header > div.fx_1 {flex: 1;}
    .cancel_code .list_cell_header > div.fx_2 {flex: 2;}
    
    .cancel_code .list_cell_box {flex-wrap: wrap;}
    .cancel_code .list_cell_box > div.fx_1 {flex: 1;}
    .cancel_code .list_cell_box > div.fx_2 {flex: 2;}
    .cancel_code .cancel_input .df_select {flex-basis: 100px;}

    .loca_title {flex-grow: 1; width: 100%; margin-bottom: 10px; color: var(--base-lt-color);}
    .releaseOut .caution {color: var(--base-lt-color);}
    .releaseOut .st_fs.fx_w.mgt20 {gap: 10px; background: var(--tb-back-color); padding: 20px;}
    .releaseOut .st_fs.fx_w.mgt20 h6 {margin-bottom: 10px;}    
    .sp_loca h6 {flex-grow: 1; width: 100%;}
    .sp_loca {display: flex; align-items: stretch; justify-content: space-between; flex-wrap: wrap;}
    

.list_order {margin-top: 20px;}
.list_order .list_cell_header > div, .list_order .list_cell_box > div {flex:1;}
.list_order .list_cell_header > div.fx_2, .list_order .list_cell_box > div.fx_2 {flex:2;}
.list_order .list_cell_header > div.fx_3, .list_order .list_cell_box > div.fx_3 {flex:3;}
.list_order .list_cell_header > div.fx_4, .list_order .list_cell_box > div.fx_4 {flex:4;}
.list_order .list_cell_header > div:nth-child(1), .list_order .list_cell_box > div:nth-child(1) {flex:0;}
.list_order .tb_box_grp {border-bottom: 0; border-right: 0;}

.orderOut .caution {color: var(--base-lt-color);}
.orderOut .st_fs.fx_w.mgt20 {gap: 10px; background: var(--tb-back-color); padding: 20px;}
.orderOut .st_fs.fx_w.mgt20 h6 {margin-bottom: 10px;}    
.order_reason {display: none;}

    .cancel_reason {margin-top: 10px;}
    .cancel_reason .df_select {max-width: 200px; width: 100%;}
    .cancel_reason .input_write {margin-top: 10px; width: 100%; max-width: 500px;}


.order_column {padding: 20px; border-radius:5px; border:1px solid #dfdfdf; background: #fff;}
.column_box {display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap;  border-right: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf;}
.column_box > div {display: flex; align-items: stretch;  border-top:1px solid #dfdfdf; border-left:1px solid #dfdfdf;}
.column_box > div > span:first-of-type {flex-basis: 90px; background: var(--bg-cell-color); flex-shrink: 0;}
.column_box > div > span:last-of-type {color:var(--base-lt-color); width: 100%;}
.column_box > div > span {padding:10px; word-break: break-all; display: flex; align-items: center;}
.column_box.row {margin:0; padding:0; --bs-gutter-x: 0; --bs-gutter-y: 0;}
.order_column .list_cell_box {color:var(--base-md-color);font-size: 0.9rem;}
.order_column h4 .svg-inline--fa {color: var(--base-point-color); font-size: 0.85rem;}
.order_column h4 i {color: var(--base-point-color); font-size: 0.85rem;}


    .order_column .df_select {width: 100%; max-width: 600px;}
    .address_deliver {display: flex; gap:10px; align-items: stretch; justify-content: flex-start; flex-direction: column;}
    .address_deliver > div {width: 100%; gap:10px; display: flex; gap:10px;}
    
    .post_num_btn {width: 100%; max-width: 100px; white-space: nowrap;}
    .post {width: 100%; max-width: 200px;}

    .ordering_type .item_add_list th,
    .ordering_type .item_add_list td {text-align: center;}
    .ordering_type .item_add_list td:nth-child(4) {text-align: left;}


.income_inner {width: 100%; margin: 0 auto; display: flex; align-items: stretch; flex-wrap: wrap;}
.income_inner .fcl_h4 {margin-bottom: 30px;}
.income_inner .special_option {width: 100%; padding:0;}

.bl_tab {margin-right: 1px; text-align: center; width: 100%;}
.bl_tab a {width: 100%; background: #f1f1f1; display: block; transition: all 0.2s ease-in; padding: 20px; color: #7a7a7a; text-align: center; background: rgb(241,241,241); background: linear-gradient(90deg, rgba(241,241,241,1) 0%, rgba(241,241,241,1) 90%, rgb(231, 231, 231) 100%); height: 100%; flex-direction: column;}

.lcl_service .form-select {width: 100%; max-width: 200px; margin-bottom: 10px;}
.bl_tab a img {display: block; margin: 0 auto;}
.st_fs.harbor .myInput {width: 100%; max-width: 800px;}
.income_inner .lcl_service {display: flex; align-items: flex-start; justify-content: center; flex-direction: column;}

.bl_sec_01, .bl_sec_02 {display: none;}
.bl_sec_01, .bl_sec_02, .bl_sec_03 {display: flex; align-items: flex-start; justify-content:center; flex-direction: column;}

.income_inner .special_option:nth-child(2) {border-bottom: 0;}


.water_mark {line-height: 2.2;}
.datepicker-dropdown.datepicker-orient-bottom:after {border-bottom: 6px solid var(--button-point-orange);}


.booking_box > div {margin-bottom: 10px;}
.booking_box > div > span:first-of-type{margin-bottom: 5px; padding-left: 13px; display: block; background: url(../img/title_icon_blue.png) no-repeat left center;}
.booking_caution {color:var(--button-point-redOrange); padding-top: 5px;}
.caution_booking {border:1px solid var(--button-point-redOrange);}
.booking_box.cargo_owner > div > span:first-of-type {display: block; background: url(../img/title_icon_orange.png) no-repeat left center;}
.booking_box.transit > div > span:first-of-type {display: block; background: url(../img/title_icon_green.png) no-repeat left center;}
.transit_notice {color: var(--color-point);}
.booking_hr {width: 98%; margin:10px auto; border-top: 1px solid #ececec; opacity: 1;}


.search_quo {box-sizing: border-box; flex-wrap: wrap; border:1px solid #efefef; gap:10px 20px; background: #fff; padding: 15px; display: flex; align-items: flex-start; justify-content: space-between; border-radius: 5px;}
.quo_chlid {width: 35%;}
.quo_title {flex-basis: 100%;}
.list_quo {gap:10px; display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; padding: 20px; background: #fff; margin-bottom: 10px; border-radius: 5px; border:1px solid #eaeaea;}
.list_quo h3, 
.list_quo h4 {color: var(--color-point); margin-bottom: 5px;}
.state_quo_out {background: var(--button-point-orange); padding:5px 10px; color: #fff; display: inline-block; border-radius: 5px;}
.state_quo_in {background: var(--color-point); padding:5px 10px; color: #fff; display: inline-block; border-radius: 5px;}

.view_detail {transition: all ease-in 0.3s; background: #fdfdfd; max-width: 100%; border:1px solid #dfdfdf; padding:5px 20px 5px 10px; border-radius: 30px;}
.view_detail:hover {background: var(--base-button);  border:1px solid var(--base-button);}

.bell_icon {transition: all ease-in 0.3s; margin-right: 5px; display: flex; align-items: center; justify-content: center; padding:10px; border-radius: 100px; width: 30px; height: 30px;}
.view_detail:hover .bell_icon {background: #fff; color: var(--button-point-color);}
.point_bold {color:var(--button-point-redOrange); transition: all ease-in 0.3s; margin: 0 5px;}
.line_city_out {position: relative; margin:0 20px 0 10px;}
.line_city_out:after {position: absolute; opacity: 0.4; width: 100%; border-top: 1px solid var(--button-point-redOrange); top: 50%; content: '';}
.line_city_out:before {position: absolute; top: 50%; opacity: 0.7; content: ''; border-top:7px solid transparent; border-right:7px solid transparent; border-bottom:7px solid transparent; border-left:7px solid var(--button-point-redOrange); left: 100%; margin-top: -6.5px}

.line_city_in {position: relative; margin:0 20px 0 10px;}
.line_city_in:after {position: absolute; opacity: 0.4; width: 100%; border-top: 1px solid var(--color-point); top: 50%; content: '';}
.line_city_in:before {position: absolute; top: 50%; opacity: 0.7; content: ''; border-top:7px solid transparent; border-right:7px solid transparent; border-bottom:7px solid transparent; border-left:7px solid var(--color-point); left: 100%; margin-top: -6.5px}

.now_state {text-align: center; border:1px solid #eaeaea; background: #fff; border-radius: 100px; margin: 10px auto; overflow: hidden; background: #fafafa;}
.now_state a {display: block; padding: 10px 0; border-radius: 100px;}
.now_state a.active {background: var(--base-button); display: block; padding: 10px 0; border-radius: 100px;}
.now_state a:hover {text-decoration: underline; color:var(--button-point-redOrange);}
.now_state a.active:hover {color:inherit;}
.address_quo {color: var(--base-lt-color); word-break: break-all;}


    .quo_grp {gap:20px; flex:2;}
    .left_label {width: 100%; min-width:230px;  max-width:270px;}
    .quo_location {flex:1; background: #fff; padding: 10px; border-top: 2px solid var(--button-point-color)}
    .quo_detail {flex: 6;}
    .tits_label_start {padding: 5px; color: var(--color-point); background: url(../img/title_icon_orange.png) no-repeat 0 8px; padding-left: 15px;}
    .tits_label_arrive {padding: 5px; color: var(--color-point); background: url(../img/title_icon_blue.png) no-repeat 0 8px; padding-left: 15px;}
    .tits_label_ask {padding: 5px; color: var(--color-point); background: url(../img/title_icon_green.png) no-repeat 0 8px; padding-left: 15px;}
    .tits_label_fht {padding: 5px; color: var(--color-point); background: url(../img/title_icon_fht.png) no-repeat 0 8px; padding-left: 15px;}
    .label_con {line-height: 1.2; padding:5px 5px 5px 15px; width: 100%; display: block; background: var(--bg-cell-color); word-break: break-all;}
    .grp_define_option {background: #fff; border-radius: 5px; padding: 10px; margin-bottom: 20px; box-shadow: 1px 1px 3px rgba(0,0,0,0.1); border:1px solid #f5f5f5; flex-wrap: wrap;}
    .grp_define_option h4 .svg-inline--fa {color: var(--base-lt-color); font-size: 0.85rem;}
    .grp_line {background: #fff; border-bottom: 1px dotted #dfdfdf; margin-bottom: 10px; flex-basis: 20%;} 
  
    .grp_line:last-of-type {border-bottom: 0; margin-bottom: 0;}
    .quo_cost_detail {padding: 10px; background: #fff; border-radius: 0 0 5px 5px; border: 1px solid #f5f5f5; border-top: 2px solid var(--base-point-color); padding: 10px; margin-bottom: 20px; box-shadow: 1px 1px 3px rgba(0,0,0,0.1);}
    .total_quo {background: #fff; border-radius: 5px; padding: 10px; margin-bottom: 20px; box-shadow: 1px 1px 3px rgba(0,0,0,0.1); border: 1px solid #f5f5f5;}
    .quo_inner_info {gap:10px; border:1px solid #e5e6e8; background: #fcfcfc;}
    .cost_quo_bill {color: var(--button-point-orange);}
    .quo_inner_info .mb_style {border-top:1px dotted var(--sub-text-lt-color); border-bottom:1px dotted #dfdfdf; padding: 10px; background: #fff;}
    .cost_lists {background: var(--bg-cell-color);}
    .cost_base {color: var(--button-point-redOrange);}
    .total_cost {background: #edf3ff; border-top: 1px dotted #dfdfdf;}


.quo_comparison {display: table; width: 100%;}   
.quo_com {display: table-row;} 
.quo_com > div {display: table-cell;}  
.total_cost_quo {color: var(--button-point-redOrange);  margin-top: 10px; width: 100%; text-align:right;}
.cost_quo_pay {color: var(--color-point); margin-top: 10px; width: 100%; text-align:right;}
.total_cost_quo i,
.cost_quo_pay i {white-space: nowrap;}
.cost_context {width: 100%; text-align:left;}
.forwarder_com {color:var(--color-point);}


.list_cell_box.fare_gp > div:nth-child(1) {padding-top: 10px; padding-bottom: 10px;}
.list_cell_box.fare_gp > div:nth-child(1) > span {text-align: left; word-break: break-all; width: 100%;}


/*table in check box css*/
input.cus_check[type="checkbox"] + label.attr_check {margin-right: 0; padding-top:0; padding-bottom:0; padding-left: 0; display: block;}
input.cus_check[type="checkbox"] + label.attr_check::before {margin-right: 0; display: block; position: relative; top:0;} 
input.cus_check[type="checkbox"] + label.attr_check::after {top: 1px;} 


.logo_company_img {padding: 30px; margin-right: 20px;}
.logo_company_img img { max-width: 200px; max-height: 80px;}
.sp_services {display: block; padding:5px; background: var(--bg-color-lightblue); word-break: normal; margin: 2px; color:var(--color-point); border-radius: 3px;}
.tab_work_view a {line-height: 1.3; padding:5px 15px; display: inline-block; margin-bottom: 5px; border-radius: 30px; color: #fff; background: var(--button-del-cancel);}
.tab_work_view a.active {background: var(--button-point-orange);}
.intro_company_detail {border:var(--table-border-line); padding:20px;}
.intro_company_detail img {max-width: 100%; display: block; margin:0 auto 20px;}
.intro_company_detail h4 {margin-bottom: 10px;}
.intro_company_detail p {margin-bottom: 25px; color: var(--base-md-color);}


/*air cargo tracking*/
.list_grp_air {display: grid; grid-template-columns: 1fr 1fr 1fr;}
.air_company_list { padding:10px; padding-top: 20px; padding-bottom: 20px; font-size: 0.95rem;}
.air_company_list:nth-child(1n),
.air_company_list:nth-child(2n), /* 4n+2 */
.air_company_list:nth-child(3n) { /* 4n+3 */
    background: #fbfbfb;
}
.air_company_list:nth-child(4n), /* 4n, 4n+1 */
.air_company_list:nth-child(5n), /* 4n+2 */
.air_company_list:nth-child(6n) { /* 4n+3 */
    background-color: #fff;
}
.air_company_list:nth-child(7n), /* 4n, 4n+1 */
.air_company_list:nth-child(8n), /* 4n+2 */
.air_company_list:nth-child(9n) { /* 4n+3 */
    background-color: #fbfbfb;
}
.air_company_list:nth-child(10n),
.air_company_list:nth-child(11n),
.air_company_list:nth-child(12n) {
    background-color: #fff;
} 
.air_company_list em {color: #4885b2; font-weight: 600; padding: 0 0 0 10px; display: inline-block; text-align: left; width: 50px;}
.air_company_list a:hover,
.air_company_list a:focus {border-bottom: 1px solid #dfdfdf; color: #336174; background: #e0edf7;}
.search_air_list { margin-bottom: 20px;
    box-sizing: border-box;
    flex-wrap: wrap;
    border: 1px solid #dfdfdf;
    gap: 10px 20px;
    background: #fdfdfd;
    padding: 15px;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    border-radius: 5px;}
.air_search {display: flex; align-items: center; justify-content: flex-start;}
.air_search > h5 {margin-right: 10px; width: auto; white-space: nowrap;}
.air_search .sm_orderOut_btn {margin-left: 5px;}
.air_search .sm_cancel_btn {margin-left: 5px;}
.inputtext_air { background: #f7f7f7; border: 1px solid #b8b8b8; background: #fff;}

.air_layer_popup {flex-direction: column;}
.air_layer_popup .done_popup,
.air_layer_popup .pop_hd {width: 90%; max-width: 1000px;}
.air_layer_popup .pop_content_ag {width: 90%; max-width: 1000px; max-height: 79vh;}

@media (max-width: 1500px) {
    .terminal_grp {grid-template-columns:repeat(3, 1fr);}
}

@media (max-width: 1400px) {
    .tb_cell_header {display: none;}
    .tb_box_grp {border-right: 0; border-bottom: 0;}
    .tb_cell_box {margin-bottom: 10px; display: flex; flex-wrap: wrap; border-bottom: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf;}
    .tb_cell_box > div:first-child {background: var(--tb-back-color);}
    .tb_cell_box > div:before {display: block; word-break: break-all; content: attr(data-title); margin: 0 0 1px; font-size: 11px; color: var(--number-point);}
    .tb_cell_box > div:first-child,
    .tb_cell_box > div:last-child {width: 100%;}
    .tb_cell_box > div:not(:first-child) {flex-grow:1; width: 15%; display: inline-block;}
    .tb_cell_box .d_block {display: inline-block;}
    .logist_grp.customs_broker,
    .logist_grp {grid-template-columns: repeat(4, 1fr);}
    .logist_cp h3 > img {max-width: 150px;}

}

@media (max-width: 1300px) {
    .st_cancel_btn{width: 100%; box-sizing: border-box !important;}
    .st_req_btn {width: 100%; box-sizing: border-box !important;}
    .st_receipt_btn {width: 100%; box-sizing: border-box !important;}
    .st_quote_btn{width: 100%; box-sizing: border-box !important;}
    .st_view_btn{width: 100%; box-sizing: border-box !important;}
    .st_releaseOut_btn {width: 100%; box-sizing: border-box !important;}
    .st_reg_btn {width: 100%; box-sizing: border-box !important;}
    .st_orderOut_btn {width: 100%; box-sizing: border-box !important;}
    .st_post_btn {width: 100%; box-sizing: border-box !important;}

}
@media (max-width: 1050px) {
    .contain_sub {padding:0 10px 30px;}
    .contain_header > li > .add_sub > span > em {display: block; color: #000;}
    .company_grp {display: grid; row-gap: 5px; column-gap: 5px; grid-template-columns: repeat(4, 1fr);}
    
    .terminal_box_grp {display: flex; border-right:0; align-items: stretch; justify-content: space-between; flex-wrap: wrap; border-bottom: 0;}  
    .terminal_cell_header {display: none;}
    .terminal_cell_box {border-top: 2px solid var(--checkbtn-back);}
    .terminal_cell_box > div p {display: block; color: var(--base-form-color);}
    .terminal_cell_box {width: 49%; display: flex; flex-wrap: wrap; margin-bottom: 20px; border-bottom: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf;}
    .terminal_cell_box > div {width: 50%; text-align: left;}
    .terminal_cell_box > div:nth-child(4),
    .terminal_cell_box > div:nth-child(5),
    .terminal_cell_box > div:nth-child(6),
    .terminal_cell_box > div:nth-child(7),
    .terminal_cell_box > div:nth-child(9),
    .terminal_cell_box > div:nth-child(8){text-align: left;}
    
    .cargo_tm.ac_ct, .arrived_tm.ac_ct, .progress_tm.ac_ct, .normal_tm.ac_ct, .dep_tm.ac_ct, .open_tm.ac_ct {justify-content: flex-start;}
}

@media (max-width: 1200px) {
    .branch_grp li {width: 16%;}
    .ship_grp > .logist_cp > .ac_fs {flex-direction: column;}
    .ship_grp > .logist_cp > .ac_fs .fx_1 {width: 100%;}
    .ship_imgs {margin-right: 0;}
    .terminal_grp {grid-template-columns:repeat(2, 1fr);}
    .tb_detail td {word-break: break-all;}
    .fcl_list_w {flex-direction: column;}
    .select_option {width: 100%; padding: 0;}
    .select_option > div {padding: 20px;}
    .select_option .forwarder_ship {display: flex; align-items: stretch;} 
    .select_option .forwarder_ship li:nth-child(2) {margin-top: 0;}
    .select_option .forwarder_ship li > button, .forwarder_ship li a {max-width: 98%; width: 98%;}
    .tab02, .tab03, .tab04 {display: none;}
    .select_option {padding: 0; border:none; background: transparent;}
    .select_option > div:first-of-type {margin-bottom: 20px; border:1px solid #dfdfdf; border-radius: 5px; margin-bottom: 20px; background: #fff;}
    .select_option > div.tab_guide {padding:20px 20px 0 20px; background: #fff; border-radius: 5px 5px 0 0; border:1px solid #dfdfdf; border-bottom: 0; width: 100%; display: flex; align-items: stretch; justify-content: space-between;}
    .select_option > div.tab_guide a {line-height: 1.2;}
    .tab_guide > a {border-radius: 10px 10px 0 0; width: 25%; flex:1; padding:10px 15px; text-align: center; background: #dfdfdf; margin-right: 3px;}
    .tab_guide > a:last-of-type {margin-right: 0;} 
    .tab_guide > a.active {background: var(--button-point-orange); color: #fff;}
    .fcl_title {margin-top: 0px;} 
    .select_option > div.tab_grp {background: #fff; border:1px solid #dfdfdf; border-top: 0; padding-top:15px}
    .t_time  {margin-bottom: 20px;}
    .fcl_div {margin-top: 20px; width: 100%;}
    .forwarder_ship li {display: flex; align-items: stretch; justify-content: center;}
    .forwarder_ship li a {display: flex; align-items: center; justify-content: center;}
    .search_release {flex-direction: column;}
    .grp_rel {width: 100%;}
    .release_search {flex-grow: 1; width: 100%;}
    .address_layer_popup .pop_grps_auto.depth_layer {width: 90%; max-width: 90%;}
    .booking_info_grp > div {flex-basis: 30%;}
    .air_search > h5 {width: 150px;}
}
@media (max-width: 1000px) {
    .sub_ftitle_nbd,
    .sub_ftitle {flex-direction: column; align-items: center; justify-content: center;}
    .sub_ftitle h3,
    .sub_ftitle_nbd h3 {margin-right: 0;}
    .sub_ftitle_nbd b,
    .sub_ftitle_nbd p,
    .sub_ftitle p {text-align: center; margin-top: 10px;}
    .contain_box {font-size: 12px;}
    .set_cbm {flex-direction: column;}
    .cbm_grp:nth-child(1) {border-right: 0;}
    .cbm_grp:nth-child(2) {border-top: 1px solid #e9e9e9; border-left: 0;}
    .ar_in_land.w50p,
    .st_in_land.w50p,
    .set_contents .text_input {width: 100%;}
    .local_select {width: 40%;}
    .search_grp_02 .w30p.st_sb.area_search {width: 40%;}
    .search_grp_03 .w30p.st_sb {width: 60%;} 
    .search_grp_01 .w50p.ship_search {width: 100%;}

        /*check box*/
        .contain_schedule .special_option h4 > input.cus_check[type="checkbox"] + label:before {margin:-1px 8px 0 0;}
    
    .fcl_inner {width: 100%; flex-direction: column;}
    .lcl_service,
    .fcl_service {width: 100%;}
    .tab_text {width: 100%; display: flex; align-items: stretch;}
    .tab_fcl {width: 50%; display: flex; align-items: stretch;}
    .tab_fcl > a {display: flex; align-items: center; justify-content: center; background: #f1f1f1;}
    .tab_fcl > a > img {margin:0; margin-right: 10px;}
    .list_cell_header {display: none;}
    .list_cell_box {border-top: 2px solid var(--base-point-color);}
    .list_cell_box {flex-wrap: wrap; margin-bottom: 20px; border-right: 1px solid #dfdfdf;}
    .list_cell_box > div {flex-basis: 200px !important; border-top:1px solid #dfdfdf; flex-grow: 1 !important; border-left: 1px solid #dfdfdf; flex-direction: column; justify-content: flex-start;}
    .list_cell_box > div:nth-child(1) {justify-content: flex-start; flex-basis: 100% !important; display: flex; align-items: flex-start; padding: 5px; background: var(--bg-cell-color);}
    .list_cell_box > div:nth-child(1).exception {flex-basis: 200px !important; background: #fff; flex-grow: 1;}

    .list_cell_box > div:nth-child(even) {background: #fff;}
    .list_cell_box > div:nth-child(1).contain_first {background: #fafafa;}
    
    .list_cell_box b {display: block; width: 100%; text-align: left; color:var(--color-point);}
    .list_cell_box span,
    .list_cell_box a,
    .list_cell_box em {margin-top:5px; text-align: left; width: 100%;}
    
    .cancel_code .list_cell_box {flex-wrap: wrap; margin-bottom:10px;}
    .cancel_code .list_cell_box > div {flex-basis: 150px; flex: 1;}
    .cancel_code .list_cell_box > div:nth-child(1) {flex:0;}

    .cancel_code .list_cell_box > div.fx_1 {flex-basis: 150px; flex-grow: 1;}
    .cancel_code .list_cell_box > div.fx_2 {flex-basis: 150px; flex-grow: 1;}

    .list_order .list_cell_box > div {flex-basis: 150px; flex-grow: 1;}
    .list_order .list_cell_box > div:nth-child(1) {flex-grow: 1; flex-basis: 100%;}
    .list_order .list_cell_box > div:nth-child(2), .list_order .list_cell_box > div:nth-child(3), .list_order .list_cell_box > div:nth-child(9), .list_order .list_cell_box > div:nth-child(16) {flex-grow: 1; flex-basis: 150px;}
    .order_column .list_cell_box > div:nth-child(1) {flex-basis: 200px !important; background: #fff;}
    .list_cell_box > div:last-of-type {border-right:0;}
    .order_column .list_cell_box > div:nth-child(1).check_prd {flex-basis: 100% !important; background: var(--bg-cell-color);}
    .quo_chlid {width: 45%;}
    .quo_grp {flex-direction: column;}
    .left_label {width: 100%; min-width: 100%; max-width: 100%; gap:10px;}
    .grp_define_option {margin-bottom: 10px; flex-wrap: wrap; gap:5px; width: 100%; display: flex; align-items: stretch; justify-content: space-between;}
    .grp_define_option h4 {flex-basis: 100%; margin-bottom: 0;}
    .grp_line {margin-bottom: 0; flex:1; display: flex; align-items: stretch; flex-direction: column; flex-basis: 20%;}
    .tits_label_fht {display: flex; align-items: flex-start;}
    .label_con {flex:1; display: flex; align-items: flex-start;}
    .quo_inner_info .fx_basis.mgb5 {margin-bottom: 0;}
    .list_cell_box.fare_gp > div:nth-child(1) {padding: 5px;}
    .income,
    .outcome {width: 100%;}

   
}
@media (max-width: 970px) {
    .ship_box_grp {display: flex; border-right:0; align-items: stretch; justify-content: space-between; flex-wrap: wrap; border-bottom: 0;}
    .ship_cell_box > div:nth-child(1),
    .ship_cell_header {display: none;}
    .ship_cell_box {width: 49%; display: flex; flex-wrap: wrap; margin-bottom: 20px; border-bottom: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf;}
    .ship_cell_box > div:not(:first-child) {display: inline-block; width: 33.33%; text-align: left;}
    .ship_cell_box > div:nth-child(2) {width: 100%; background: #f1f1fb; display: table-cell;}
    .ship_cell_box > div {flex-grow: 1;}
    .mobile_ship_info {display: block; width: 100%; text-align: left; color: var(--base-form-color); font-size: 0.9rem;} 
}
@media (max-width: 950px) {
    .logo_company_img {border-top: var(--table-border-line); width: 100%; margin-right: 0;}
    .logo_company_img > img {margin:0 auto; width: 100%;}
    .foward_search.ac_fs {flex-direction: column;}
}
@media (max-width: 900px) {
    .list_quo > div {flex-basis: 100%;}
    .mb_style {border:1px solid #dfdfdf; padding: 10px; border-radius: 5px; background: #fafafa;}
    .view_detail {border-radius: 5px;}
    .quo_inner_info .mb_style {border:0; border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf; border-radius: 0;}   
}
@media (max-width: 870px) {
    .booking_box.transit .col-md-3, .cargo_owner .col-md-6, .cargo_owner .col-md-3, .cargo_owner .col-md-2 {width: 100%;}
}
@media (max-width: 850px) {  
    .squer_w a, .squer_w em {display: block;}
    .shame > div {width: 31.5%; margin-bottom: 20px;}
    .cal_button_action {padding-top: 0;}
    .cal_layout {width: 100%; margin-top: 30px;}
    .calculator, .block_con {flex-direction: column; align-items: flex-start;}
    .dutie_box .guide_text {margin-left: 0; padding-top: 10px;}
    .dutie_box .cbm_count {padding-left: 0; padding-right: 0;}
    .dutie_box .link_co_fix {margin-left: 0; margin-top: 5px;}
    .tb_cell_box .d_block {display: block;}
    .grp_select_input {width: calc(50% - 5px);}
    .lcl_list .wrap_input > .input_write {width: calc(50% - 5px);}
    .text_input.wrap_input {flex-wrap: wrap;}
    .text_input.wrap_input .k-widget.k-dropdown.k-header,
    .fcl_list .wrap_input > .input_write {width: calc(50% - 5px);}
    
    .fcl_addList {gap: 5px;}
    .fcl_list .wrap_input > .input_write {flex:2;}
    .fcl_list .wrap_input > .input_write {flex-basis: 40% !important;}
    .text_input.wrap_input .k-widget.k-dropdown.k-header, .fcl_list .wrap_input > .input_write{flex:2;}

    .lcl_list .wrap_input > .input_write:nth-child(even) {margin-right: 0; width: 50%;}
    .fcl_list .wrap_input > .grp_select_input:nth-child(even) {margin-right: 0; width: 50%;}
    .lcl_list .wrap_input > .grp_select_input:nth-child(even) {margin-right: 0; width: 50%;}
    .logist_grp {grid-template-columns: repeat(2, 1fr);}
    .branch_grp li {width: 25%;}
    .lcl_cell_header,
    .fcl_cell_header,
    .cutoff_info {display: none;}
    
    .fcl_div .tb_box_grp {word-break: break-all; background:transparent;}
    .fcl_cell_box {margin-top: 20px;border-top: 1px solid #dfdfdf; flex-wrap: wrap; border-left: 1px solid #dfdfdf; align-items: stretch;}
    .fcl_cell_box > div {border-right: 1px solid #dfdfdf;}
    .fcl_cell_box > div:nth-child(even) {background: #fff;}
    .fcl_cell_box > div:nth-child(1) {width: 30%;}
    .fcl_cell_box > div:nth-child(2) {flex-grow: 1; width: 70%;}
    .fcl_cell_box > div:nth-child(3) {flex-grow: 1; width: 50%;}
    .fcl_cell_box > div:nth-child(4) {flex-grow: 1; width: 50%;}
    .fcl_cell_box > div:nth-child(5) {flex-grow: 1; width: 50%;}
    .fcl_cell_box > div:nth-child(6) {flex-grow: 1; width: 50%;}
    .fcl_cell_box > div:nth-child(7) {flex-grow: 1; width: 33.33%;}
    .fcl_cell_box > div:nth-child(8) {flex-grow: 1; width: 33.33%;}
    .fcl_cell_box > div:nth-child(9) {flex-grow: 1; width: 33.33%;}
    .icon_fcl {padding:5px}
    .link_detail {display: inline-block;}
    .lcl_cell_header + .lcl_cell_box,
    .fcl_cell_header + .fcl_cell_box {margin-top:0;}
    .detail_vessel {background: #fff; border-left: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf; padding: 0;}
    .detail_vessel > div {padding: 10px;}
    .link_ship {word-break: break-all;}
    .m_fcl {display: flex;}
    
    .lcl_cell_header + .fcl_cell_box {margin-top:0;}
    .lcl_div .tb_box_grp {word-break: break-all; background:transparent;}
    .lcl_cell_box {margin-top: 20px;border-top: 1px solid #dfdfdf; flex-wrap: wrap; border-left: 1px solid #dfdfdf; align-items: stretch;}
    .lcl_cell_box > div {border-right: 1px solid #dfdfdf;}
    .lcl_cell_box > div:nth-child(even) {background: #fff;}
    .lcl_cell_box > div:nth-child(1) {width: 30%;}
    .lcl_cell_box > div:nth-child(2) {flex-grow: 1; width: 70%;}
    .lcl_cell_box > div:nth-child(3) {flex-grow: 1; width: 50%;}
    .lcl_cell_box > div:nth-child(4) {flex-grow: 1; width: 50%;}
    .lcl_cell_box > div:nth-child(5) {flex-grow: 1; width: 50%;}
    .lcl_cell_box > div:nth-child(6) {flex-grow: 1; width: 50%;}
    .lcl_cell_box > div:nth-child(7) {flex-grow: 1; width: 33.33%;}
    .lcl_cell_box > div:nth-child(8) {flex-grow: 1; width: 33.33%;}
    .lcl_cell_box > div:nth-child(9) {flex-grow: 1; width: 33.33%;}
    .lcl_cell_box > div:nth-child(2){width: 20%; flex-direction: row; width: 70%; align-items: center; justify-content: space-between;}
    .lcl_mtit {display: block; word-break: break-all;  margin: 0 0 1px; font-size: 12px; color: var(--number-point);}
    .lcl_cell_header {display: none;}   
    .search_quo {flex-direction: column-reverse;}
    .quo_chlid {width: 100%;}
}
@media (max-width: 800px) {
    .special_option {width: 50%;}
    .contain_schedule .special_option:nth-child(6) {border-right: 0;}
    .map_in_layer.st_fs {flex-direction: column;}
    .map_in_layer.st_fs > .mgr20 {margin-right: 0;}
    .map_in_layer.st_fs > .sea_location {width: 100%;}
    .wrapper_map {width: 100%;}
    .login_notice {padding: 20px;}
    .login_notice img {display: none;} 


    .terminal_cell_box .info_text_notice {bottom:100%; opacity: 0; z-index: -1;  right: 0; left: auto; bottom: 100%; margin-bottom: 10px; width: 100px; text-align: center;}
    .terminal_cell_box .info_text_notice::before {right: 0; left: auto; margin-left: 0; bottom: -5px; border-top: 10px solid #3b3b3b;  border-right: 10px solid transparent; border-left: 10px solid transparent;}
    .terminal_cell_box .info_text_notice.on {z-index: 1; bottom:90%; opacity: 1;}

    .terminal_cell_box .fa-calendar-check + .info_text_notice {width: 105px;}
    .fcl_inner .special_option {border-bottom: 0;}
    .tab_fcl > a {padding: 10px; word-break: break-all;}
    .lcl_service, .fcl_service {padding: 20px;}
    .dutie_box .store_con .input_write {flex-grow:1; flex:1; width: 100%;}
    .store_con .fz_m6.mgl5.mgr20 {margin-right: 0;}
    .storage {min-width: 100px; width: 25%; flex-wrap: wrap;}
    .dutie_box .store_con .input_write {min-width: 250px; /*margin-right: 0;*/}
    .sample_nation.fcl_layout {width: 100%; left:0; right: auto;}
    .income_inner .fcl_h4 {margin-bottom: 10px;}
    .logist_grp.customs_broker {grid-template-columns: repeat(3, 1fr);}
    .list_grp_air {display: grid; grid-template-columns: 1fr;}
    .air_company_list:nth-child(4n), /* 4n, 4n+1 */
    .air_company_list:nth-child(5n), /* 4n+2 */
    .air_company_list:nth-child(6n), /* 4n+3 */
    .air_company_list:nth-child(10n), /* 4n+3 */
    .air_company_list:nth-child(11n), /* 4n+3 */
    .air_company_list:nth-child(12n){ /* 4n+3 */
        background-color: #fbfbfb;
    }
}
@media (max-width: 767px) {
    .address_deliver > .address_detail {flex-direction: column;}
    .gap_items .df_select {flex-basis: 100%; flex-grow: 1;}
    .gap_items > button {flex:1;}
    .address_deliver > div.gap_items > button {flex:0;}
}
@media (max-width: 750px) {
    .company_grp {grid-template-columns: repeat(2, 1fr);}
    .terminal_grp {grid-template-columns:repeat(1, 1fr);}
    .release_button button, .release_button a {flex:1; flex-basis: 100px; text-align: center;}
    .column_box .col-sm-4 {width: 100%;}
}
@media (max-width: 730px) {
    .contain_box {display: flex; align-items: flex-start; justify-content: flex-start;}
    .contain_header {display: inline-block; width: 25%; border-top:1px solid var(--base-point-color);}
    .contain_header li {border-bottom: 1px solid #dfdfdf; border-right: 0; padding: 10px 0;}
    .contain_header li > b {overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: break-all;}
    .contain_header li:nth-child(1) {width: 100%;}
    .contain_header li:nth-child(2) {width: 100%;}
    .contain_header li:nth-child(3) {width: 100%;}
    .contain_header li:nth-child(4) {width: 100%;}
    .contain_header li:nth-child(5) {width: 100%;}
    .contain_header li:nth-child(6) {width: 100%; flex-direction: row; justify-content: space-between; align-items: center; padding-bottom: 0px; padding-top: 0px;}
    .contain_header li:nth-child(6) span {width:50%;  display: block;}
    .contain_header li:nth-child(7) {width: 100%; flex-direction: row; justify-content: space-between; align-items: center; padding-bottom: 0px; padding-top: 0px;}
    .contain_header li:nth-child(7) span {width:33.33%; display: block;}
    .contain_header li:nth-child(8) {width: 100%;}
    .contain_header li:nth-child(6) span {display: none;}
    .contain_header li:nth-child(6) .add_sub i:nth-child(3) {border-bottom: 0;} 
    .contain_header li:nth-child(7) span {display: none;}
    .contain_header li:nth-child(7) .add_sub i:nth-child(5) {border-bottom: 0;} 
    .add_sub {flex-direction: column; width: 30px; margin-top: 0; border-top:0;}
    .el_txt {text-align: center; display: block; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: break-all;}
    .sm_icon {display: block; display: flex; align-items: center; justify-content: center; padding-left: 3px; padding-right: 3px; border-left:1px solid #dfdfdf; width: 30px; border-bottom:1px solid #dfdfdf;}

    .con_grp {width: 75%; display: flex; align-items: center; justify-content: flex-start;}
    .contain_con {display: inline-block; width: 33%; border-left: 0; border-top:1px solid #dfdfdf; border-bottom: 0;}
    .contain_con li {width: 100%; border-right: 0; border-bottom: 1px solid #dfdfdf; padding: 10px 0;}
} 
@media (max-width: 700px) {
    .select_company {flex-wrap: wrap;}
    .select_company > div.w25p:nth-child(2) {border-right: 0;}
    .select_company > div.w25p:nth-child(3),
    .select_company > div.w25p:nth-child(4) {border-top:1px solid #dfdfdf;}
    .select_company > div.w25p {width: 50%;}
    .search_grp_01 .w50p {width: 100%;}  
    .logist_grp {grid-template-columns: repeat(2, 1fr);}
    .local_select {width: 40%;}
    .search_grp_02 .w30p.st_sb.area_search {width: 60%;}
    .search_blf {flex-wrap: wrap;}
    .dropbtn {border-radius: 0;}
    .search_blf .dropdown{flex-grow: 1; width: 100%; margin-bottom: 10px;}
    .blf_search .input_write {width: 80%; height: 40px;}
    .search_blf .search_btn {width: 20%;}
    .search_blf .dropdown {min-width: 100%;}
    .nation_div div:nth-child(2) a {width: 25%;}
    .release_grp > div {width: 49%; margin-bottom: 10px;}
    .release_list {flex-direction: column-reverse;}
    .release_info_state {width: 100%; display: flex; align-items: stretch;}
    .release_state {margin-bottom: 0; flex: 1; word-break: break-all; padding: 10px;}
    .release_info_state > h4 {display: none;}
}
@media (max-width: 670px) {
    .local_select .local_grp{padding-right: 10px;}
    .add_input_pop {flex-direction: column;}
}
@media (max-width: 650px) {
    .ship_grp {grid-template-columns:repeat(1, 1fr)}
    .done_popup_multi {flex-direction: column; gap: 5px 0;}
    .divide_done,.divide_done_rt {width: 100%;}
    .divide_done > button,
    .divide_done > a,
    .divide_done_rt > button,
    .divide_done_rt > a {flex:1;}
}
@media (max-width: 600px) {
    .dutie_box .block_con .input_write {min-width: 100%; width: 100%; max-width: 100%;}
    .dutie_box .cbm_count {width: 100%; max-width: 100%;}
    .area_input {flex-direction: column; align-items: flex-start;}
    .area_input .set_item {margin-bottom: 10px;}
    .quo_simulate,
    .set_item,
    .set_contents {width: 100%;}
    .cold_storage {width: 100%; max-width: 100%;}
    
    .filebox {margin: 5px 0; width: 100%; text-align: left; height: auto;}
    .pdf_file_upload .file-list {height: auto; padding: 0; width: 100%;}
    .wrap_file,
    .files_insert {height: auto;}
    .file_select_zone > em {margin: 20px auto;}
    .files_insert .pdf_file_upload {flex-direction: column;}
    .file_list,
    .file_setup,
    .files_insert,
    .files_insert .pdf_file_upload {width: 100%;}
    .local_select {width: 50%;}
    .search_grp_02 .w30p.st_sb.area_search {width: 100%;}
    .branch_grp li {width: 30%;}
    .search_grp_02 .w30p.st_sb.area_search {width: 40%;}
    .search_grp_03 .ac_fs.pd20 {flex-direction: column; align-items: flex-start;}
    .search_grp_03 .w30p.st_sb {margin-top: 15px; width: 100%;}
    .search_ship_layer .input_write.w30p {width: 100%;}
    
    .nation_div div:nth-child(2) a {width: 33.3%;}
    .order_date,
    .search_item {flex-direction: column;}
    .item_select_search {margin-bottom: 20px;}
    .item_select_search, .item_select_list {width: 100%;}
    .sm_release_btn {flex:1;}
    .sm_done_btn {flex:1;}
    .sm_cancel_btn {flex:1;}
    .release_order,
    .child_rel.gr_num03,
    .child_rel.gr_num10,
    .release_info_detail {width: 100%;}
    .grp_rel {flex-direction: column; gap:10px 0;}
    .child_rel {width: 100%; padding: 0;}
    .search_release {gap: 10px 0;}
    .list_cell_box > div {text-align: left; justify-content:flex-start; align-items: center;}
    .release_state.active > h5:before {display: none;}
    .cancel_code .list_cell_box > div {width: 50%;}
    .inventory .done_popup button,
    .inventory .done_popup a,
    .orderOut .done_popup button,
    .orderOut .done_popup a {flex:1;}
    .water_mark {display: none;}
    .set_contain_column .info_text_notice {top: 100%; left:0; transition: all ease-in 0s; word-break: break-all;}
    .set_contain_column .info_text_notice::before {left: 10px; top: auto; border-top: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 15px solid #3b3b3b;}
    .tax_pick {flex-direction: column;}
    .search_grp_02.tab_grp .w30p.st_sb.area_search {width: 100%;}
    .logist_grp.customs_broker {grid-template-columns: repeat(2, 1fr);}
    .grp_define_option {flex-direction: column;}
    .quo_grp {gap:10px;}
    .total_quo {margin-bottom: 10px;}
    .quo_inner_info {flex-direction: column;}
    .cost_lists span {padding-top: 5px; padding-bottom: 5px;}
    .sm_orderOut_btn,
    .sm_reg_btn {flex: 1;}
    .total_cost {padding-top: 10px; padding-bottom: 10px;}
    .pop_grps_auto.depth_layer {width: 80%;}
    .booking_info_grp > div {flex-basis: 40%;}
}
@media (max-width: 550px) {
    .tb_cell_box > div:not(:first-child) {width: 25%;}
    .ship_cell_box {width: 100%;}
    .income_search {padding: 10px;}
    .income .pdl20 {padding-left: 10px;} 
    .income_search.ac_fs {flex-direction: column;} 
    .income_search.ac_fs > span {width: 100%; padding-left: 0; margin-right: 0;}
    .income_search.ac_fs > div {width: 100%; margin-right: 0; margin-top: 10px;}
    .income .pdt20.pdb20 {padding:0;}
    .terminal_cell_box {width: 100%;}
    .cancel_management {flex-direction: column;}
    .cancel_management > div {width: 100%;}
    .order_release_code .sm_release_btn {flex-basis: 100%;}

}
@media (max-width: 500px) {
    .squer_w.working_rel {display: none;}
    .info_h4 {margin-right:10px;}
    .cbm_tit {width: 50%;}
    .unit_dol {width: 100%;}
    .balloon .d_ib.tx_lf.mgr10.porl {display: block;}
    .local_grp li {width:33.3% ;}
    .branch_grp li {width: 50%;}
    .com_search {flex-direction: column;}
    .com_search .fz_m6.cal_button.btn_action {margin-top:10px;}
    .sel_local {margin-right: 0; margin-left:10px;}
    .pop_content_ag {padding: 10px;}
    .st_detail .tb_cell {width: 50%;}

    .st_detail .tb_cell:nth-child(n+3) {background: #fff;}
    .st_detail .tb_cell:nth-child(n+5) {background: #f2f2f2;}
    .st_detail .tb_cell:nth-child(n+7) {background: #fff;}
    .st_detail .tb_cell:nth-child(n+9) {background: #f2f2f2;}
    .st_detail .tb_cell:nth-child(n+11) {background: #fff;}
    .st_detail .tb_cell:nth-child(n+13) {background: #f2f2f2;}
    .blf_search {padding: 20px;}

    .blf_search .input_write {width: 70%; height: 40px;}
    .search_blf .search_btn {width: 30%;}
    .update_terminal {flex-direction: column;}
    .update_terminal .excel {display: block; text-align: center;}
    .update_terminal .excel.mgl10 {margin-left: 0; margin-top: 10px;}
    .fcl_sec {padding: 40px 0;}
    .nation_div {flex-direction: column;}
    .nation_div div:nth-child(1) {width: 100%; text-align: left;}
    .cancel_code .cancel_input {flex-direction: column;}
    .cancel_code .cancel_input .df_select {flex-basis: auto;}
    .address_deliver > div.gap_items > .post {width: 100%; max-width: 100%;}
    .address_deliver > div.gap_items ,
    .releaseOut .st_fs.fx_w.mgt20 {flex-direction: column;}
    
    .list_quo div.fx_2.ta_r.st_fd{justify-content: center;}
    .list_quo a.ac_fd{justify-content: center;}
    .total_quo {flex-direction: column;}
    .total_quo > div {width: 100%; text-align: center; margin-bottom: 10px;}
    .fcl_list .wrap_input > .input_write {flex-basis: 100% !important;}
}
@media (max-width: 470px) {
    .shame > div {width: 100%; margin-bottom: 15px;}
    .cal_button_action {padding-top: 10px;}
    .cal_button_action .cal_button {width: 100%;}
    .info_cbm.ac_fs {flex-direction: column;}
    .button_grp .btn_action{width: 100%; margin-top: 5px;}

    .ship_flow,
    .cbm_result {flex-direction: column;}
    .all_result .info_cbm,
    .info_cbm {width: 100%;}
    .info_cbm.ac_fs li {width: 100%;}
    .title_sub_flex > div.ac_sb:first-child {margin-bottom: 10px;}
    
    .cold_storage .cs_title span {width: 50%;}
    .grp_select_input {width: 100%; margin-right: 0;}

    .text_input.wrap_input .k-widget.k-dropdown.k-header, .fcl_list .wrap_input > .input_write:nth-child(even),
    .fcl_list .wrap_input > .input_write, 
    .lcl_list .wrap_input > .input_write,
    .fcl_list .wrap_input > .grp_select_input:nth-child(even),
    .lcl_list .wrap_input > .grp_select_input:nth-child(even),
    .fcl_list .wrap_input > .input_write:nth-child(even), 
    .lcl_list .wrap_input > .input_write:nth-child(even) {width: 100%; margin-right: 0;}
    .add_columns {margin-top: 20px;}

    .st_port_land .text_input .input_write,
    .st_in_land .text_input .input_write,
    .ar_port_land .text_input .input_write,
    .ar_in_land .text_input .input_write {margin-right: 0; margin-bottom: 5px; width:100%;}
    .logist_grp {grid-template-columns: repeat(1, 1fr);}
    .company_grp {grid-template-columns: repeat(1, 1fr);}
    .content_between {height: 88px;}
}
@media (max-width: 450px) {
    .special_option {width: 100%;}
    .special_option:nth-child(1) {border-right: 0;}
    .contain_schedule .special_option:nth-child(7), 
    .contain_schedule .special_option:nth-child(5) {border-right: 0;}
    .fcl_service .special_option:nth-child(3) {border-bottom: 0;}
    .dutie_box .store_con .input_write {min-width: 150px; margin-right: 0;}
    .block_cal td, .block_cal th {padding: 7px;}
    .release_info_state {flex-direction: column;}
    .release_state {margin-bottom: 5px; display: flex; align-items: center; justify-content: space-between;}
    .release_state > h5 {margin-bottom: 0;}
    .logist_grp.customs_broker {grid-template-columns: repeat(1, 1fr);}
}
@media (max-width: 420px) {
    .datepicker-dropdown {left:0 !important;}
}
@media (max-width: 400px) {
    .result_cbm {flex-direction: column;}
    .result_cbm li {width: 100%;}
    .result_cbm li:nth-child(2) {margin-top: 10px;}
    .result_cbm li:not(:first-child) {padding-left:10px;}
    .result_cbm:nth-child(2) {margin-top: 10px;}
    .tb_cell_box > div:not(:first-child) {width: 33%;}
    .paging_com li a {padding:8px}
    .local_grp li {width:45% ;}
    .dropdown-content {min-width: 100%;}
    .terminal_state,
    .percent_state {flex-direction: column;}
    .time_checks {width: 100%; display: flex; justify-content: space-between; padding: 10px;} 
    .time_checks:nth-child(2) {background: #f7f7f7;}
    .time_checks span:first-child {text-align: left; margin-right: 5px;}
    .tm_percent {width: 100%; border-right: 0;}
    .percent_state {padding:0;}
    .percent_state .tm_percent:nth-child(2) {background:#fdfdfd;}
    .release_grp > div {width: 100%; margin-bottom: 10px;}
    .release_search {flex-wrap: wrap; gap: 10px;}
    .release_search > .btn_action {flex:1; margin:0;}
    .before_years {flex:1; text-align: center; margin-right: 0;}
    .before_years:hover {padding: 10px 30px;}
    .select_storage {padding: 8px 10px;}
    .now_state {background: transparent; border:0; border-radius: 0; background: #fff; border:1px solid #eaeaea;} 
    .now_state a.active {border-radius: 5px;}
    .cost_quo_bill {word-break: break-all;}
}
@media (max-width: 350px) {
    .divide_done_rt i, .divide_done i {display: none;}
    .bl_tab a {word-break: break-all;}
}
@media (max-width: 330px) {
    .list_cell_box > div:nth-child(1) {flex:1; width: 100%; padding: 5px; flex-basis: 200px; justify-content: flex-start; align-items: flex-start;}
    .info_text_change {margin-left:-50px;}
    .paging_com li a {padding:6px}
    .search_blf .search_btn {width: 30%; padding-left: 0; padding-right: 0;}
}