/*@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:100,300,400,500,700,900&subset=chinese-traditional,japanese');*/ @import "bootstrap_sidebar.css"; @import url("style_video.css"); @import url("sprite_map.css"); html, body { background:#FFFFFF; color:#212529; /*font-family: "微軟正黑體", "Microsoft JhengHei" !important;*/ font-family:'Noto Sans TC', sans-serif; font-size:14px; font-weight:400; width:calc(100% - 0px); height:calc(100% - 0px); line-height:1.5rem; text-align:left; margin:0px; padding:0px; overflow:hidden;} .form-control { padding:5px;} select.form-control { -moz-appearance:none; /* Firefox */ -webkit-appearance:none; /* Safari and Chrome */ appearance:none; background:#FFFFFF url("../images/element/selectArrow.svg") no-repeat; background-size:16px 14px; background-position:right .5rem center;} .dec-emplasis { display:inline-block;} .dec-emplasis::after { color:#ed1c24; margin:0px 2px; content:"\002A"; display:inline-block;} a { outline:none !important; text-decoration:none !important; color:#0083BE; transition:all 0.2s ease-in-out;} a:hover { text-decoration:none; color:#ff9000;} p a { color:#ff9000;} ::selection { color:#222; background:#ace3f9; text-shadow:none;} .dec-overflow-h01 { overflow:hidden!important;} .modal-header .close { height:26.25px; overflow:hidden; padding:2px 3px 3px 3px; margin:0px 0px 0px 10px;} /* 2023/09/11 update [note]:這兩個暫時註解掉 tbody#tablePage::-webkit-scrollbar { width: 0px;} tbody.dec-scrollbarV::-webkit-scrollbar { width: 0px;}*/ /*start - btn-backToTop --------------------------------------------------------------------------------------*/ #btn-backToTop { padding:15px; position:fixed; bottom:25px; right:20px; z-index:99; border:none; outline:none; background-color:#000; opacity:0.5; color:#FFFFFF; cursor:pointer; border-radius:100px; display:none;} #btn-backToTop:hover { opacity:1;} .btn-backToTop-hoverable { transition:box-shadow .55s; box-shadow:0;} .btn-backToTop-hoverable:hover { transition:box-shadow .45s; box-shadow:0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);} /*end - btn-backToTop --------------------------------------------------------------------------------------*/ /*start - a.dec-marqeeArea｜btn全部公告-----------------------------------*/ .dec-marqeeArea { width:300px; height:28px; margin:0px; padding:0px 5px; background:transparent; overflow:hidden;} .dec-marqeeArea a.dec-type, .dec-marqeeArea a.dec-type:hover { width:75px; height:28px; margin:0px; padding:0px; display:inline-block; float:right; font-size:1rem; line-height:2rem; color:#fccf00; text-decoration:none;} .dec-marqeeArea a.dec-type:hover { color:#edc003;} a.marqee, a.marqee:hover { width:210px; height:28px; margin:0px; margin-right:auto; overflow:hidden; position:relative; display:inline-block; text-decoration:none;} a.marqee > ul { padding-left:0; display:inline-block; list-style-type:none; animation:marqee 15s linear infinite; animation:marqee 5s linear infinite; position:absolute;} a.marqee > ul > li { font-size:1rem; line-height:2rem; white-space:nowrap; margin-bottom:2rem; font-weight:normal; color:#fcee21;} a.marqee > ul > li .icon-sprite { margin:0px 2px 0px 0px; padding:0px; display:inline-block; top:4px; position:relative;} @keyframes marqee { 0% { left: 100%; transform: translateX(0%);} 100% { left: 0; transform: translateX(-100%);} } /*end - a.dec-marqeeArea｜btn全部公告-----------------------------------*/ /*start - dec-btnBulletinModal｜btn全部公告Modal-----------------------------------*/ a.dec-btnBulletinModal, a.dec-btnBulletinModal:hover { margin:0px 3px 0px 0px; padding:5px; font-size:12px; line-height:1rem; color:#FFFFFF; word-break:break-all; text-decoration:none; background:#595959; border-radius:5px;} a.dec-btnBulletinModal:hover { background:#0080a2;} /*end - dec-btnBulletinModal｜btn全部公告Modal-----------------------------------*/ /*start - logo-area --------------------------------------------------------------------------------------*/ .logo-area, .logo-area a.btn-logo, .logo-area a.btn-logo .type-zone, .logo-area a.btn-logo .img-logo { background:transparent; font-family:'Noto Sans TC', sans-serif; font-weight:405; margin:0px; padding:0px; overflow:hidden; text-decoration:none; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .logo-area { margin:0px; padding:0px; text-decoration:none;} .logo-area a.btn-logo { } .logo-area a.btn-logo .img-logo { background-image:url("../images/logo/img_logo_BW.svg"); background-repeat:no-repeat; background-position:100% center; margin:0px; padding:0px; height:50px; width:64px;} .logo-area a.btn-logo .type-zone { color:#FFFFFF; font-size:21px; letter-spacing:2px; line-height:26px; margin:0px 0px 0px 5px; overflow:hidden; max-width:480px; word-break:break-all; height:50px;} .logo-area a.btn-logo .type-zone .dec-type-01 { width:auto; min-width:auto; margin:0px; padding:0px;} .logo-area a.btn-logo .type-zone .dec-type-02 { margin:0px; padding:0px; font-size:16px; line-height:18px; letter-spacing:0rem; max-width:340px; word-break:break-all;} /*end - logo-area --------------------------------------------------------------------------------------*/ /*start - logo-area.dec-tsmc --------------------------------------------------------------------------------------*/ .logo-area.dec-tsmc, .logo-area.dec-tsmc a.btn-logo, .logo-area.dec-tsmc a.btn-logo .type-zone, .logo-area.dec-tsmc a.btn-logo .img-logo { background:transparent; font-family:'Noto Sans TC', sans-serif; font-weight:405; margin:0px; padding:0px; overflow:hidden; text-decoration:none; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .logo-area.dec-tsmc { margin: 0px; padding:0px; text-decoration:none;} .logo-area.dec-tsmc a.btn-logo {} .logo-area.dec-tsmc a.btn-logo .img-logo { background-image:url("../images/logo/img_logo_tsmc.svg"); background-repeat:no-repeat; background-position:100% center; margin:0px; padding:0px; height:50px; width:64px;} .logo-area.dec-tsmc a.btn-logo .type-zone { color:#FFFFFF; font-size:21px; letter-spacing:2px; line-height:26px; margin:0px 0px 0px 5px; overflow:hidden; max-width:480px; word-break:break-all; height:50px;} .logo-area.dec-tsmc a.btn-logo .type-zone .dec-type-01 { width:auto; min-width:auto; margin:0px; padding:0px;} .logo-area.dec-tsmc a.btn-logo .type-zone .dec-type-02 { margin:0px; padding:0px; font-size:16px; line-height:18px; letter-spacing:0rem; max-width:340px; word-break:break-all;} /*end - logo-area.dec-tsmc --------------------------------------------------------------------------------------*/ /*start - logo-area.dec-secom --------------------------------------------------------------------------------------*/ .logo-area.dec-secom, .logo-area.dec-secom a.btn-logo, .logo-area.dec-secom a.btn-logo .type-zone, .logo-area.dec-secom a.btn-logo .img-logo { background:transparent; font-family:'Noto Sans TC', sans-serif; font-weight:405; margin:0px; padding:0px; overflow:hidden; text-decoration:none; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .logo-area.dec-secom { margin:0px; padding:0px; text-decoration:none;} .logo-area.dec-secom a.btn-logo {} .logo-area.dec-secom a.btn-logo .img-logo { background-image:url("../images/logo/img_logo_secom.svg"); background-repeat:no-repeat; background-position:100% center; margin:0px; padding:0px; height:50px; width:64px;} .logo-area.dec-secom a.btn-logo .type-zone { color:#FFFFFF; font-size:21px; letter-spacing:2px; line-height:26px; margin:0px 0px 0px 5px; overflow:hidden; max-width:480px; word-break:break-all; height:50px;} .logo-area.dec-secom a.btn-logo .type-zone .dec-type-01 { width:auto; min-width:auto; margin:0px; padding:0px;} .logo-area.dec-secom a.btn-logo .type-zone .dec-type-02 { margin:0px; padding:0px; font-size:16px; line-height:18px; letter-spacing:0rem; max-width:340px; word-break:break-all;} /*end - logo-area.dec-secom --------------------------------------------------------------------------------------*/ /*start - .dec-navbar --------------------------------------------------------------------------------------*/ .dec-navbar { background:#333333 !important; border-bottom:0px solid #020100; padding-top:0px; padding-bottom:0px; padding-left:0.5rem; padding-right:0.5rem;} .dec-navbar.dec-enterprise { background:#787878 !important;} /*end - .dec-navbar --------------------------------------------------------------------------------------*/ /*start - .dec-navbar-sub --------------------------------------------------------------------------------------*/ .dec-navbar-sub { background:#FFFFFF !important; border-bottom:1px solid #CCCCCC; padding-top:5px; padding-bottom:5px; padding-left:0.5rem; padding-right:0.5rem; width:calc(100% - 0px); height:39px; transition:box-shadow .45s; box-shadow:0 0px 17px 0 rgba(0, 0, 0, 0.05), 0 5px 5px 0 rgba(0, 0, 0, 0.05); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} /*end - .dec-navbar-sub --------------------------------------------------------------------------------------*/ .navbar .GNav-area { } .navbar .GNav-area .nav-item.dropdown { list-style:none;} .dec-nav {} .nav-link.dec-gnav-t01 { color:#FFFFFF; margin:0px 5px; padding:6px 10px; border-radius:0.4rem 0.4rem 0rem 0rem;} .nav-link.dec-gnav-t01:hover { color:#FFFFFF; background:#464646;} .nav-link.dec-gnav-t01:focus { color:#FFFFFF; background:#008BAC;} .nav-link.dec-gnav-t01.active { color:#FFFFFF; background:#008BAC;} .nav-link.dec-gnav-t01.is-active { color:#FFFFFF; background:#008BAC;} .nav-link.dec-gnav-t01 .icon-sprite { position:relative; top:3px; margin-right:3px;} .nav-link.dec-gnav-t01 .dec-type-note { font-size:12px;} .GNav-area .dropdown-toggle::after { color:transparent;} /*start - .nav-user --------------------------------------------------------------------------------------*/ .nav-user { background:#FFFFFF; margin:2px; padding:2px; border-radius:2rem; font-size:1rem; display: -ms-inline-flexbox !important; display: inline-flex !important;} .nav-user .name { color:#666; padding:3px 0 0 10px; margin-right:10px;} .nav-user a.btn-user { text-decoration:none; margin:0 3px; font-size:1.0rem; line-height:1.5rem; padding:3px 10px 4px 10px; font-weight:400;} /*end - .nav-user --------------------------------------------------------------------------------------*/ /*start - 版本資訊 dec-version --------------------------------------------------------------------------------------*/ .dec-version { background:transparent; margin:0px 0px 0px 5px; padding:0px; font-size:1rem; color:#b3b3b3;} /*end - 版本資訊 dec-version --------------------------------------------------------------------------------------*/ /*start - .dropdown-menu.dec-t002 --------------------------------------------------------------------------------------*/ .dropdown:hover>.dropdown-menu.dec-t002 { display:block;} .dropdown-menu.dec-t002 { background:#464646; border-radius:0.4rem; border:0px; font-family:'Noto Sans TC', sans-serif; text-align:left; margin-top:0px; margin-left:-335px; width:480px;} .dropdown-menu.dec-t002 .dropdown-item { background:transparent; color:#776744;} .dropdown-menu.dec-t002 .dropdown-item, .dropdown-menu.dec-t002 .dropdown-item:hover { cursor:pointer; padding:8px 5px;} .dropdown-menu.dec-t002 .dropdown-item { color:#FFFFFF; border-bottom:1px solid #776744;} .dropdown-menu.dec-t002 .dropdown-item:hover { background-image: repeating-linear-gradient(to right,#5b4d2f 0%, #5b4d2f 100%); color:#FFFFFF; border-bottom:1px solid #5b4d2f;} .dropdown-menu.dec-t002 .dropdown-item:last-child, .dropdown-menu.dec-t002 .dropdown-item:last-child:hover { border-bottom:0px solid #525252;} .dropdown-menu.dec-t002 .dec-menu-box { width:calc(100% - 0px); margin:0px; padding:5px 5px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .dropdown-menu.dec-t002 .dec-menu-box .dec-menu-box-sort { width:calc(33% - 5px); margin:0px; padding:0px 0px 0px 5px; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: center !important; justify-content: center !important;} .dropdown-menu.dec-t002 .dec-menu-box .dec-menu-box-sort .dec-ic-area { width:calc(100% - 0px); margin:0px; padding:0px; text-align:center; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .dropdown-menu.dec-t002 .dec-menu-box .dec-menu-box-sort .dec-ic-area .dec-ic { margin:10px 0px; padding:0px; font-size:1.8rem; color:#FFFFFF;} .dropdown-menu.dec-t002 .dec-menu-box .dec-menu-box-sort .dec-list-area { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .dropdown-menu.dec-t002 .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item, .dropdown-menu.dec-t002 .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item:hover { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 10px; color:#FFFFFF; text-align:center; border-radius:0.25rem;} .dropdown-menu.dec-t002 .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item:first-child, .dropdown-menu.dec-t002 .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item:hover:first-child { margin:0px;} .dropdown-menu.dec-t002 .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item { background:transparent;} .dropdown-menu.dec-t002 .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item:hover { background:#169cbf;} /*end - .dropdown-menu.dec-t002 --------------------------------------------------------------------------------------*/ /*start - .dropdown-menu.dec-navStatistics --------------------------------------------------------------------------------------*/ .dropdown:hover>.dropdown-menu.dec-navStatistics { display:block;} .dropdown-menu.dec-navStatistics { background:#464646; border-radius:0.4rem; border:0px; font-family:'Noto Sans TC', sans-serif; text-align:left; margin-top:0px; margin-left:0px; width:150px;} .dropdown-menu.dec-navStatistics .dropdown-item { background:transparent; color:#776744;} .dropdown-menu.dec-navStatistics .dropdown-item, .dropdown-menu.dec-navStatistics .dropdown-item:hover { cursor:pointer; padding:8px 5px;} .dropdown-menu.dec-navStatistics .dropdown-item { color:#FFFFFF; border-bottom:1px solid #776744;} .dropdown-menu.dec-navStatistics .dropdown-item:hover { background-image: repeating-linear-gradient(to right,#5b4d2f 0%, #5b4d2f 100%); color:#FFFFFF; border-bottom:1px solid #5b4d2f;} .dropdown-menu.dec-navStatistics .dropdown-item:last-child, .dropdown-menu.dec-navStatistics .dropdown-item:last-child:hover { border-bottom:0px solid #525252;} .dropdown-menu.dec-navStatistics .dec-menu-box { width:calc(100% - 0px); margin:0px; padding:5px 5px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .dropdown-menu.dec-navStatistics .dec-menu-box .dec-menu-box-sort { width:calc(100% - 0px); margin:0px; padding:0px; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: center !important; justify-content: center !important;} .dropdown-menu.dec-navStatistics .dec-menu-box .dec-menu-box-sort .dec-ic-area { width:calc(100% - 0px); margin:0px; padding:0px; text-align:center; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .dropdown-menu.dec-navStatistics .dec-menu-box .dec-menu-box-sort .dec-ic-area .dec-ic { margin:10px 0px; padding:0px; font-size:1.8rem; color:#FFFFFF;} .dropdown-menu.dec-navStatistics .dec-menu-box .dec-menu-box-sort .dec-list-area { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .dropdown-menu.dec-navStatistics .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item, .dropdown-menu.dec-navStatistics .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item:hover { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 10px; color:#FFFFFF; text-align:center; border-radius:0.25rem;} .dropdown-menu.dec-navStatistics .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item:first-child, .dropdown-menu.dec-navStatistics .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item:hover:first-child { margin:0px;} .dropdown-menu.dec-navStatistics .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item { background:transparent;} .dropdown-menu.dec-navStatistics .dec-menu-box .dec-menu-box-sort .dec-list-area a.dec-list-item:hover { background:#169cbf;} /*end - .dropdown-menu.dec-navStatistics --------------------------------------------------------------------------------------*/ /*start - .dropdown-menu --------------------------------------------------------------------------------------*/ .dropdown:hover>.dropdown-menu { display:block;} .dropdown-menu { background:#FFFFFF; border:0px; font-family:'Noto Sans TC', sans-serif; text-align:left; margin-top:0px; margin-left:4px; width:200px; min-width:110px; border-radius:0.25rem;} .dropdown-menu .dropdown-item { background:transparent; color:#776744;} .dropdown-menu .dropdown-item, .dropdown-menu .dropdown-item:hover { cursor:pointer; padding:8px 5px;} .dropdown-menu .dropdown-item { color:#FFFFFF; border-bottom:1px solid #776744;} .dropdown-menu .dropdown-item:hover { background-image: repeating-linear-gradient(to right,#5b4d2f 0%, #5b4d2f 100%); color:#FFFFFF; border-bottom:1px solid #5b4d2f;} .dropdown-menu .dropdown-item:last-child, .dropdown-menu .dropdown-item:last-child:hover { border-bottom:0px solid #525252;} .sticky-top.dec-header01 { z-index:1022; font-size:16px;} .sticky-top.dec-header02 { z-index:1021;} .navbar-light .SubNav-area { margin:0px; padding:0px; height:28px;} .navbar-light .SubNav-area .SubNav-item { margin:0px; padding:0px; position:relative; height:28px;} .navbar-light .SubNav-area .nav-link.dec-nav-link.btn-SubNav, .navbar-light .SubNav-area .nav-link.dec-nav-link.btn-SubNav:hover, .navbar-light .SubNav-area .nav-link.dec-nav-link.btn-SubNav.is-active, .navbar-light .SubNav-area .nav-link.dec-nav-link.btn-SubNav.is-active:hover { text-decoration:none; margin:0px 5px; padding:3px 5px 4px 5px; border-radius:0.25rem; font-size:16px; font-weight:400; line-height:21px;} .navbar-light .SubNav-area .nav-link.dec-nav-link.btn-SubNav { background:transparent; color:#CCCCCC;} .navbar-light .SubNav-area .nav-link.dec-nav-link.btn-SubNav:hover { background:#998a65; color:#FFFFFF;} .navbar-light .SubNav-area .nav-link.dec-nav-link.btn-SubNav.is-active { background:#d9a20c; color:#FFFFFF;} .navbar-light .SubNav-area .nav-link.dec-nav-link.btn-SubNav.is-active:hover { background:#e5aa15; color:#FFFFFF;} .navbar-light .navbar-toggler { border-color:rgba(0, 0, 0, 0);} .navbar-light .SubNav-area .nav-item.dropdown { list-style:none;} /*end - .dropdown-menu --------------------------------------------------------------------------------------*/ /*start - .GNav-area --------------------------------------------------------------------------------------*/ .GNav-area { background:transparent; margin:0px auto; padding:0px; display: -ms-inline-flexbox !important; display: flex !important; align-items: center; } .GNav-area a.btn-GNav, .GNav-area a:hover.btn-GNav, .GNav-area a.btn-GNav.is-active, .GNav-area a.btn-GNav.is-active:hover { text-decoration:none; margin:0px 5px; padding:6px 10px; border-radius:0.4rem; font-size:16px; line-height:21px; font-weight:400;} .GNav-area a.btn-GNav { color: #FFFFFF;} .GNav-area a.btn-GNav:hover { background:#464646; color:#FFFFFF;} .GNav-area a.btn-GNav.is-active { background:#008BAC; color:#FFFFFF;} .GNav-area a.btn-GNav.is-active:hover { background:#008BAC; color:#FFFFFF;} .GNav-area a.btn-GNav .icon-sprite { position:relative; top:3px;} .GNav-area a.btn-GNav .dec-type-note { font-size:12px;} /*end - .GNav-area --------------------------------------------------------------------------------------*/ /*start - .dec-enterprise .GNav-area --------------------------------------------------------------------------------------*/ .dec-enterprise .GNav-area { background:transparent; margin:0px auto; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .dec-enterprise .GNav-area a.btn-GNav, .dec-enterprise .GNav-area a:hover.btn-GNav, .dec-enterprise .GNav-area a.btn-GNav.is-active, .dec-enterprise .GNav-area a.btn-GNav.is-active:hover { text-decoration:none; margin:0px 5px; padding:6px 10px; border-radius:0.4rem; font-size:16px; line-height:21px; font-weight:400;} .dec-enterprise .GNav-area a.btn-GNav { color:#FFFFFF;} .dec-enterprise .GNav-area a.btn-GNav:hover { background:#666666; color:#FFFFFF;} .dec-enterprise .GNav-area a.btn-GNav.is-active { background:#008BAC; color:#FFFFFF;} .dec-enterprise .GNav-area a.btn-GNav.is-active:hover { background:#008BAC; color:#FFFFFF;} .dec-enterprise .GNav-area a.btn-GNav .icon-sprite { position:relative; top:3px;} /*end - .dec-enterprise .GNav-area --------------------------------------------------------------------------------------*/ /*start - .SubNav-area --------------------------------------------------------------------------------------*/ .SubNav-area { background:transparent; margin:0px; padding:0px; width:calc(100% - 0px); width:auto; display: -ms-inline-flexbox !important; display: inline-flex !important;} .SubNav-area a.btn-SubNav, .SubNav-area a:hover.btn-SubNav, .SubNav-area a.btn-SubNav.is-active, .SubNav-area a.btn-SubNav.is-active:hover { text-decoration:none; margin:0px 5px; padding:3px 10px 4px 10px; border-radius:1rem; font-weight:400; font-size:1rem; line-height:21px; height:28px; display:block; overflow:hidden;} .SubNav-area a.btn-SubNav { color:#666666;} .SubNav-area a.btn-SubNav:hover { background:#169cbf; color:#FFFFFF;} .SubNav-area a.btn-SubNav.is-active { background:#0080a2; color:#FFFFFF; } .SubNav-area a.btn-SubNav.is-active:hover { background:#0080a2; color:#FFFFFF;} .SubNav-area a.btn-SubNav .icon-sprite { position:relative; top:3px;} .SubNav-area a.btn-SubNav .icon-sprite.icon-SubNav_crosshairs { } .SubNav-area a.btn-SubNav:hover .icon-sprite.icon-SubNav_crosshairs, .SubNav-area a.btn-SubNav.is-active .icon-sprite.icon-SubNav_crosshairs, .SubNav-area a.btn-SubNav.is-active:hover .icon-sprite.icon-SubNav_crosshairs { background-position:-170px -1668px;} .SubNav-area a.btn-SubNav .icon-sprite.icon-SubNav_route { } .SubNav-area a.btn-SubNav:hover .icon-sprite.icon-SubNav_route, .SubNav-area a.btn-SubNav.is-active .icon-sprite.icon-SubNav_route, .SubNav-area a.btn-SubNav.is-active:hover .icon-sprite.icon-SubNav_route { background-position:-34px -1702px;} .SubNav-area a.btn-SubNav .icon-sprite.icon-SubNav_marker { } .SubNav-area a.btn-SubNav:hover .icon-sprite.icon-SubNav_marker, .SubNav-area a.btn-SubNav.is-active .icon-sprite.icon-SubNav_marker, .SubNav-area a.btn-SubNav.is-active:hover .icon-sprite.icon-SubNav_marker { background-position:-272px -1668px;} .SubNav-area a.btn-SubNav .icon-sprite.icon-SubNav_rocket { } .SubNav-area a.btn-SubNav:hover .icon-sprite.icon-SubNav_rocket, .SubNav-area a.btn-SubNav.is-active .icon-sprite.icon-SubNav_rocket, .SubNav-area a.btn-SubNav.is-active:hover .icon-sprite.icon-SubNav_rocket { background-position:-476px -1668px;} .SubNav-area a.btn-SubNav .icon-sprite.icon-SubNav_truckMoving {} .SubNav-area a.btn-SubNav:hover .icon-sprite.icon-SubNav_truckMoving, .SubNav-area a.btn-SubNav.is-active .icon-sprite.icon-SubNav_truckMoving, .SubNav-area a.btn-SubNav.is-active:hover .icon-sprite.icon-SubNav_truckMoving { background-position:-136px -1702px;} .SubNav-area a.btn-SubNav .icon-sprite.icon-SubNav_bus {} .SubNav-area a.btn-SubNav:hover .icon-sprite.icon-SubNav_bus, .SubNav-area a.btn-SubNav.is-active .icon-sprite.icon-SubNav_bus, .SubNav-area a.btn-SubNav.is-active:hover .icon-sprite.icon-SubNav_bus { background-position:-68px -1668px;} .SubNav-area a.btn-SubNav .icon-sprite.icon-SubNav_parking { } .SubNav-area a.btn-SubNav:hover .icon-sprite.icon-SubNav_parking, .SubNav-area a.btn-SubNav.is-active .icon-sprite.icon-SubNav_parking, .SubNav-area a.btn-SubNav.is-active:hover .icon-sprite.icon-SubNav_parking { background-position:-374px -1668px;} .SubNav-area a.btn-SubNav .icon-sprite.icon-SubNav_roadM { } .SubNav-area a.btn-SubNav:hover .icon-sprite.icon-SubNav_roadM, .SubNav-area a.btn-SubNav.is-active .icon-sprite.icon-SubNav_roadM, .SubNav-area a.btn-SubNav.is-active:hover .icon-sprite.icon-SubNav_roadM { background-position:-476px -1703px;} .SubNav-area a.btn-SubNav .icon-sprite.icon-SubNav_chargingPile { } .SubNav-area a.btn-SubNav:hover .icon-sprite.icon-SubNav_chargingPile, .SubNav-area a.btn-SubNav.is-active .icon-sprite.icon-SubNav_chargingPile, .SubNav-area a.btn-SubNav.is-active:hover .icon-sprite.icon-SubNav_chargingPile { background-position:-748px -2153px;} /*end - .SubNav-area --------------------------------------------------------------------------------------*/ /*start - .MapNav-area --------------------------------------------------------------------------------------*/ .MapNav-area { background:transparent; margin:0px; padding:0px 0px 0px 2px; border-left:1px solid #CCCCCC; position:relative; display: -ms-inline-flexbox !important; display: inline-flex !important;} .MapNav-area { margin:0px; padding:0px; height:28px;} .MapNav-area .MapNav-item { margin:0px; padding:0px; position:relative; width:28px; height:28px; display:inline-block; margin-left:5px;} .MapNav-area a.btn-MapNav, .MapNav-area a:hover.btn-MapNav, .MapNav-area a.btn-MapNav.is-active, .MapNav-area a.btn-MapNav.is-active:hover { text-decoration:none; margin:0px; padding:6px; border-radius:0.25rem; font-weight:400; min-width:28px; max-width:28px; min-height:28px; max-height:28px; font-size:16px; line-height:0px; display:inline-block;} .MapNav-area a.btn-MapNav { color:#999999;} .MapNav-area a.btn-MapNav:hover { background:#169cbf; color:#FFFFFF;} .MapNav-area a.btn-MapNav.is-active { background:#0071bc; color:#FFFFFF; } .MapNav-area a.btn-MapNav.is-active:hover { background:#0071bc; color:#FFFFFF;} /*start - .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch*/ .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav { background:transparent; position:relative; width:28px; height:28px; overflow:hidden; margin:0px; padding:0px;} .MapNav-area a:hover.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active:hover { background:#169cbf; position:relative; width:30px; height:28px; overflow:hidden; margin:0px; padding:0px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav .icon-sprite { position:relative; top:5px; left:5px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav .icon-sprite.icon-FunctionNav_areaSearch { } .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav:hover .icon-sprite.icon-FunctionNav_areaSearch, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active .icon-sprite.icon-FunctionNav_areaSearch, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active:hover .icon-sprite.icon-FunctionNav_areaSearch { background-position:-68px -1601px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Positioning .icon-sprite.icon-FunctionNav_positioning { } .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Positioning:hover .icon-sprite.icon-FunctionNav_positioning, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Positioning.is-active .icon-sprite.icon-FunctionNav_positioning, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Positioning.is-active:hover .icon-sprite.icon-FunctionNav_positioning { background-position:-340px -1601px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Measure .icon-sprite.icon-FunctionNav_measure { } .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Measure:hover .icon-sprite.icon-FunctionNav_measure, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Measure.is-active .icon-sprite.icon-FunctionNav_measure, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Measure.is-active:hover .icon-sprite.icon-FunctionNav_measure { background-position:-204px -1601px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-MapLayer .icon-sprite.icon-FunctionNav_mapLayer { } .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-MapLayer:hover .icon-sprite.icon-FunctionNav_mapLayer, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-MapLayer.is-active .icon-sprite.icon-FunctionNav_mapLayer, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-MapLayer.is-active:hover .icon-sprite.icon-FunctionNav_mapLayer { background-position:-136px -1601px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Message .icon-sprite.icon-FunctionNav_message { } .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Message:hover .icon-sprite.icon-FunctionNav_message, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Message.is-active .icon-sprite.icon-FunctionNav_message, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Message.is-active:hover .icon-sprite.icon-FunctionNav_message { background-position:-272px -1601px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Alarm .icon-sprite.icon-FunctionNav_alarm { } .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Alarm:hover .icon-sprite.icon-FunctionNav_alarm, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Alarm.is-active .icon-sprite.icon-FunctionNav_alarm, .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-Alarm.is-active:hover .icon-sprite.icon-FunctionNav_alarm { background-position:0 -1601px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav .dec-ic-AreaSearch { padding:0px; position:absolute; left:0px; top:0px; width:30px; height:26px; height:28px; overflow:hidden; background:transparent;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav .dec-ic-AreaSearch .dec-ic-AreaSearch-01 { color:#999999; padding:0px; position:absolute; left:10px; top:5px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(45deg); transform: rotate(45deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav .dec-ic-AreaSearch .dec-ic-AreaSearch-02 { color:#999999; padding:0px; position:absolute; left:0px; top:0px; font-size:18px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav .dec-ic-AreaSearch .dec-ic-AreaSearch-03 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:14px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav .dec-ic-AreaSearch .dec-ic-AreaSearch-04 { color:#999999; padding:0px; position:absolute; left:0px; top:0px; font-size:10px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(50deg); transform: rotate(50deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav .dec-ic-AreaSearch .dec-ic-AreaSearch-05 { color:#999999; padding:0px; position:absolute; left:0px; top:0px; font-size:10px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(140deg); transform: rotate(140deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav .dec-ic-AreaSearch .dec-ic-AreaSearch-06 { color:#999999; padding:0px; position:absolute; left:0px; top:0px; font-size:12px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(0deg); transform: rotate(0deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-01 { color:#FFFFFF; padding:0px; position:absolute; left:10px; top:5px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(45deg); transform: rotate(45deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-02 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:18px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-03 { color:#169cbf; padding:0px; position:absolute; left:0px; top:0px; font-size:14px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-04 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:10px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(50deg); transform: rotate(50deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-05 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:10px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(140deg); transform: rotate(140deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-06 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:12px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(0deg); transform: rotate(0deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active .dec-ic-AreaSearch .dec-ic-AreaSearch-01 { color:#FFFFFF; padding:0px; position:absolute; left:10px; top:5px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(45deg); transform: rotate(45deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active .dec-ic-AreaSearch .dec-ic-AreaSearch-02 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:18px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active .dec-ic-AreaSearch .dec-ic-AreaSearch-03 { color:#169cbf; padding:0px; position:absolute; left:0px; top:0px; font-size:14px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active .dec-ic-AreaSearch .dec-ic-AreaSearch-04 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:10px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(50deg); transform: rotate(50deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active .dec-ic-AreaSearch .dec-ic-AreaSearch-05 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:10px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(140deg); transform: rotate(140deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active .dec-ic-AreaSearch .dec-ic-AreaSearch-06 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:12px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(0deg); transform: rotate(0deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-01 { color:#FFFFFF; padding:0px; position:absolute; left:10px; top:5px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(45deg); transform: rotate(45deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-02 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:18px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-03 { color:#169cbf; padding:0px; position:absolute; left:0px; top:0px; font-size:14px;} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-04 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:10px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(50deg); transform: rotate(50deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-05 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:10px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(140deg); transform: rotate(140deg);} .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch-SubNav.is-active:hover .dec-ic-AreaSearch .dec-ic-AreaSearch-06 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:12px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(0deg); transform: rotate(0deg);} /*end - .MapNav-area a.btn-MapNav.btn-MapTool-FunctionArea-AreaSearch*/ /*start - .dec-ic-AreaSearch.dec-p01*/ .dec-ic-AreaSearch.dec-p01 { padding:0px; position:relative; left:0px; top:0px; width:30px; height:28px; overflow:hidden; background:transparent;} .dec-ic-AreaSearch.dec-p01 .dec-ic-AreaSearch-01 { color:#595959; padding:0px; position:absolute; left:10px; top:5px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform:rotate(45deg); transform:rotate(45deg);} .dec-ic-AreaSearch.dec-p01 .dec-ic-AreaSearch-02 { color:#595959; padding:0px; position:absolute; left:0px; top:0px; font-size:18px;} .dec-ic-AreaSearch.dec-p01 .dec-ic-AreaSearch-03 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:14px;} .dec-ic-AreaSearch.dec-p01 .dec-ic-AreaSearch-04 { color:#595959; padding:0px; position:absolute; left:0px; top:0px; font-size:10px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform:rotate(50deg); transform:rotate(50deg);} .dec-ic-AreaSearch.dec-p01 .dec-ic-AreaSearch-05 { color:#595959; padding:0px; position:absolute; left:0px; top:0px; font-size:10px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform:rotate(140deg); transform:rotate(140deg);} .dec-ic-AreaSearch.dec-p01 .dec-ic-AreaSearch-06 { color:#595959; padding:0px; position:absolute; left:0px; top:0px; font-size:12px; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform:rotate(0deg); transform:rotate(0deg);} /*end - .dec-ic-AreaSearch.dec-p01*/ /*start - .my-timepicker-div --------------------------------------------------------------------------------------*/ .my-timepicker-div { z-index:100; display:inline-block; padding:10px 25px; position:absolute; top:0px; left:0px; background:#FFFFFF; border-radius:5px; border:1px solid #ced4da;} .my-timepicker-div select.form-control { -moz-appearance:none; /* Firefox */ -webkit-appearance:none; /* Safari and Chrome */ appearance:none; background: #FFFFFF url("../images/element/selectArrow.svg") no-repeat; background-size: 16px 14px; background-position: right .5rem center; background: transparent;} /*end - .my-timepicker-div --------------------------------------------------------------------------------------*/ /*start - .MapNav-area .btn-message --------------------------------------------------------------------------------------*/ .MapNav-area .btn-message { border-radius:50%; width:28px; height:28px; margin:0px; padding:0px; text-decoration:none; position:absolute; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapNav-area .btn-message { border:0px solid #cccccc; background:#5dc1cf; color:#FFFFFF;} .MapNav-area .btn-message:hover { border:0px solid #cccccc; background:#169cbf; color:#FFFFFF;} .MapNav-area .btn-message .svg-inline--fa, .MapNav-area .btn-message:hover .svg-inline--fa { font-size:16px; position:absolute; top:8px; right:6px;} .MapNav-area .btn-message .box-num { height:20px; background:#f94926; border-radius:25px; right:0px; overflow:hidden; position:absolute; top:-5px; width:auto; min-width:20px; padding-left:2px; padding-right:2px; z-index:3; border:1px solid #FFFFFF; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapNav-area .btn-message:hover .box-num { background:#f23300;} .MapNav-area .btn-message .box-num .dec-type, .MapNav-area .btn-message:hover .box-num .dec-type { color:#FFFFFF; font-family:'Noto Sans TC', sans-serif; font-size:12px; font-weight:400; margin-top:-2px;} .MapNav-area .btn-message.dec-no-data .box-num { background:#d6d6d6; border:1px solid #FFFFFF;} .MapNav-area .btn-message.dec-no-data:hover .box-num { background:#CCCCCC;} .MapNav-area .btn-message.dec-no-data .box-num .dec-type, .MapNav-area .btn-message.dec-no-data:hover .box-num .dec-type { color:#FFFFFF; font-family:'Noto Sans TC', sans-serif; font-size:12px; font-weight:400; margin-top:-2px;} .MapNav-area .btn-message .icon-sprite { position:relative; top:5px; left:5px;} /*end - .MapNav-area .btn-message --------------------------------------------------------------------------------------*/ /*start - .MapNav-area .btn-alarm --------------------------------------------------------------------------------------*/ .MapNav-area .btn-alarm { border-radius:50%; height:26px; margin:0px; padding:0px; text-decoration:none; width:26px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapNav-area .btn-alarm { border:0px solid #cccccc; background:#fbb03b; color:#FFFFFF;} .MapNav-area .btn-alarm:hover { border:0px solid #cccccc; background:#f7931e; color:#FFFFFF;} .MapNav-area .btn-alarm .svg-inline--fa, .MapNav-area .btn-alarm:hover .svg-inline--fa { font-size:16px; position:absolute; top:6px; right:8px;} .MapNav-area .btn-alarm .box-num { height:20px; background:#f94926; border-radius:25px; right:0px; overflow:hidden; position:absolute; top:-5px; width:auto; min-width:20px; padding-left:2px; padding-right:2px; z-index:3; border:1px solid #FFFFFF; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapNav-area .btn-alarm:hover .box-num { background:#f23300;} .MapNav-area .btn-alarm .box-num .dec-type, .MapNav-area .btn-alarm:hover .box-num .dec-type { color:#FFFFFF; font-family:'Noto Sans TC', sans-serif; font-size:12px; font-weight:400; margin-top:-2px;} .MapNav-area .btn-alarm.dec-no-data .box-num { background:#d6d6d6; border:1px solid #FFFFFF;} .MapNav-area .btn-alarm.dec-no-data:hover .box-num { background:#CCCCCC;} .MapNav-area .btn-alarm.dec-no-data .box-num .dec-type, .MapNav-area .btn-alarm.dec-no-data:hover .box-num .dec-type { color:#FFFFFF; font-family:'Noto Sans TC', sans-serif; font-size:12px; font-weight:400; margin-top:-2px;} /*end - .MapNav-area .btn-alarm --------------------------------------------------------------------------------------*/ /*start - .MapNav-area .MapNav-area-note --------------------------------------------------------------------------------------*/ .MapNav-area .MapNav-area-note { width:70px; height:28px; background:#787878; color:#FFFFFF; z-index:9999; position:absolute; top:38px; left:-15px; font-size:14px; line-height:16px; padding:5px; margin:0px; border-radius:5px; border:0px; text-align:center;} .MapNav-area .MapNav-area-note.dec-position-Positioning, .MapNav-area .MapNav-area-note.dec-position-Measure, .MapNav-area .MapNav-area-note.dec-position-MapLayer, .MapNav-area .MapNav-area-note.dec-position-BaseMap, .MapNav-area .MapNav-area-note.dec-position-Message { left:-20px;} .MapNav-area .MapNav-area-note.dec-position-Alarm { left:-38px;} .MapNav-area .MapNav-area-note:after { display:block; position:absolute; height:0; width:0; border-bottom:10px solid #787878; border-left:10px solid transparent; border-right:10px solid transparent; content:''; top:-10px; right:25px;} .MapNav-area .MapNav-area-note.dec-position-Positioning:after, .MapNav-area .MapNav-area-note.dec-position-Measure:after, .MapNav-area .MapNav-area-note.dec-position-MapLayer:after, .MapNav-area .MapNav-area-note.dec-position-BaseMap:after, .MapNav-area .MapNav-area-note.dec-position-Message:after { right:25px;} .MapNav-area .MapNav-area-note.dec-position-Alarm:after { right:8px;} /*end - .MapNav-area .MapNav-area-note --------------------------------------------------------------------------------------*/ /*end - .MapNav-area --------------------------------------------------------------------------------------*/ /*start - .MapViewNav-area --------------------------------------------------------------------------------------*/ .MapViewNav-area { background:transparent; margin:0px; padding:0px; position:relative;} .MapViewNav-area a.btn-MapViewNav, .MapViewNav-area a:hover.btn-MapViewNav, .MapViewNav-area a.btn-MapViewNav.is-active, .MapViewNav-area a.btn-MapViewNav.is-active:hover { text-decoration:none; margin:0px; padding:3px 10px 4px 10px; border-radius:0.25rem 0 0 0.25rem; font-weight:400; min-width:30px; max-width:30px; font-size:1rem; line-height:21px; background:#fafafa;} .MapViewNav-area a.btn-MapViewNav { color:#999999;} .MapViewNav-area a.btn-MapViewNav:hover { background:#ebebeb; color:#999999;} .MapViewNav-area a.btn-MapViewNav.is-active { background:#666666; color:#FFFFFF; } .MapViewNav-area a.btn-MapViewNav.is-active:hover { background:#666666; color:#FFFFFF;} .MapViewNav-area a.btn-MapViewNav .icon-sprite { position:relative; top:3px;} .MapViewNav-area a.btn-MapViewNav .icon-sprite.icon-MapViewNav_GeneralMode { } .MapViewNav-area a.btn-MapViewNav:hover .icon-sprite.icon-MapViewNav_GeneralMode, .MapViewNav-area a.btn-MapViewNav.is-active .icon-sprite.icon-MapViewNav_GeneralMode, .MapViewNav-area a.btn-MapViewNav.is-active:hover .icon-sprite.icon-MapViewNav_GeneralMode { background-position:-442px -1634px;} .MapViewNav-area a.btn-MapViewNav .icon-sprite.icon-MapViewNav_RightSideMode, .MapViewNav-area a.btn-MapViewNav:hover .icon-sprite.icon-MapViewNav_RightSideMode { } .MapViewNav-area a.btn-MapViewNav.is-active .icon-sprite.icon-MapViewNav_RightSideMode, .MapViewNav-area a.btn-MapViewNav.is-active:hover .icon-sprite.icon-MapViewNav_RightSideMode { background-position:-510px -1634px;} .MapViewNav-area a.btn-MapViewNav:nth-last-child(1) { border-radius:0 0.25rem 0.25rem 0; border:1px solid #e0e0e0; border-left:0px;} .MapViewNav-area a.btn-MapViewNav:nth-last-child(2) { border:1px solid #e0e0e0; border-right: 0px;} .MapViewNav-area a.btn-MapViewNav:nth-last-child(1).is-active { border-radius:0 0.25rem 0.25rem 0; border:1px solid #666666;} .MapViewNav-area a.btn-MapViewNav:nth-last-child(2).is-active { border:1px solid #666666;} .MapViewNav-area a.btn-MapViewNav:nth-last-child(1).is-active:hover { border-radius:0 0.25rem 0.25rem 0; border:1px solid #666666;} .MapViewNav-area a.btn-MapViewNav:nth-last-child(2).is-active:hover { border:1px solid #666666;} .MapViewNav-area a.btn-MapViewNav .dec-ic-whole { margin:0px; padding:0px; width:14px; height:14px; overflow:hidden; background:transparent;} .MapViewNav-area a.btn-MapViewNav .dec-ic-a01 { margin-bottom:4px; margin-right:1px; padding:0px; color:#FFFFFF;} .MapViewNav-area a.btn-MapViewNav .dec-ic-a02 { margin-left:0px; padding:0px; color:#999999; width:14px; height:14px;} .MapViewNav-area a.btn-MapViewNav .dec-ic-b01 { margin-top:1px; margin-left:7px; padding:0px; color:#FFFFFF; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(90deg); transform:rotate(90deg);} .MapViewNav-area a.btn-MapViewNav .dec-ic-b02 { margin-left:0px; padding:0px; color:#999999; width:14px; height:14px;} .MapViewNav-area a.btn-MapViewNav:hover .dec-ic-a01 { margin-bottom:4px; margin-right:1px; padding:0px; color:#ebebeb;} .MapViewNav-area a.btn-MapViewNav:hover .dec-ic-a02 { margin-left:0px; padding:0px; color: #999999; width:14px; height:14px;} .MapViewNav-area a.btn-MapViewNav:hover .dec-ic-b01 { margin-top:1px; margin-left:7px; padding:0px; color:#ebebeb; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(90deg); transform:rotate(90deg);} .MapViewNav-area a.btn-MapViewNav:hover .dec-ic-b02 { margin-left:0px; padding:0px; color:#999999; width:14px; height:14px;} .MapViewNav-area a.btn-MapViewNav.is-active .dec-ic-a01 { margin-bottom:4px; margin-right:1px; padding:0px; color:#666666;} .MapViewNav-area a.btn-MapViewNav.is-active .dec-ic-a02 { margin-left:0px; padding:0px; color:#FFFFFF; width:14px; height:14px;} .MapViewNav-area a.btn-MapViewNav.is-active .dec-ic-b01 { margin-top:1px; margin-left:7px; padding:0px; color:#666666; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(90deg); transform:rotate(90deg);} .MapViewNav-area a.btn-MapViewNav.is-active .dec-ic-b02 { margin-left:0px; padding:0px; color:#FFFFFF; width:14px; height:14px;} .MapViewNav-area a.btn-MapViewNav.is-active:hover .dec-ic-a01 { margin-bottom:4px; margin-right:1px; padding:0px; color:#666666;} .MapViewNav-area a.btn-MapViewNav.is-active:hover .dec-ic-a02 { margin-left:0px; padding:0px; color: #FFFFFF; width:14px; height:14px;} .MapViewNav-area a.btn-MapViewNav.is-active:hover .dec-ic-b01 { margin-top:1px; margin-left:7px; padding:0px; color:#666666; -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(90deg); transform:rotate(90deg);} .MapViewNav-area a.btn-MapViewNav.is-active:hover .dec-ic-b02 { margin-left:0px; padding:0px; color:#FFFFFF; width:14px; height:14px;} /*end - .MapViewNav-area --------------------------------------------------------------------------------------*/ .hidden-a { visibility: hidden;} /*start - .box-loadingIcon --------------------------------------------------------------------------------------*/ .box-loadingIcon { margin:0px; padding:0px; z-index:4; z-index:99999; text-align:center; position:absolute; top:0px; left:0px; background:rgba(0, 0, 0, 0.5); width:calc(100% - 0px); height:calc(100% - 0px); overflow:hidden;} .box-loadingIcon.dec-01 { position:relative; top:0px; width:40px; height:40px; margin:0px auto; padding:0px 0px 0px 2px; text-align:left; border-radius:50%; background:transparent;} .box-loadingIcon .box-loadingIcon-innerbox { margin:0px; padding:0px; background:transparent; height:calc(50% + 18px); overflow:hidden; position:relative;} .box-loadingIcon .box-loadingIcon-innerbox .dec-ic { background:rgba(255, 255, 255, 1); margin:0px; padding:5px; border-radius:50%; position:absolute; bottom:0px;} /*start - loadingIcon - cycle*/ @keyframes ld-cycle { 0%, 50%, 100% { animation-timing-function: cubic-bezier(0.5, 0.5, 0.5, 0.5);} 0% { -webkit-transform: rotate(0); transform: rotate(0);} 50% { -webkit-transform: rotate(180deg); transform: rotate(180deg);} 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg);} } @-webkit-keyframes ld-cycle { 0%, 50%, 100% { animation-timing-function: cubic-bezier(0.5, 0.5, 0.5, 0.5);} 0% { -webkit-transform: rotate(0); transform: rotate(0);} 50% { -webkit-transform: rotate(180deg); transform: rotate(180deg);} 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg);} } .ld.ld-cycle { width:36px; height:36px; -webkit-animation: ld-cycle 1s infinite linear; animation: ld-cycle 1s infinite linear;} .ld-hourglass { width:1em; height:1em; position:relative; color:inherit; display:inline-block; } .ld-hourglass:after { position:absolute; margin:auto; width:100%; height:100%; top:0; left:0; right:0; bottom:0; content:" "; display:inline-block; background:center center no-repeat; background-size:cover;} .ld-hourglass:after { width:0; height:0; background:none; border-radius:50%; border-style:solid; border-width:0.5em; border-color:currentColor transparent currentColor transparent;} /*end - loadingIcon - cycle*/ /*end - .box-loadingIcon --------------------------------------------------------------------------------------*/ /*start - .map-area (地圖底圖sample) --------------------------------------------------------------------------------------*/ .main-area { position:absolute; top:0px; bottom:0; left:0px; right:0; background:transparent; background:#595959; width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .main-area.dec-video { background:#464646; overflow:hidden;} .main-area.dec-scroll {} .map-area { position:absolute; top:89px; bottom:0; left:0px; right:0; background:#ebebeb; width:calc(100% - 0px); height:calc(100% - 89px); overflow:hidden;} .map-area .gmap { width:100%; height:100%; background:url("../images/sample/sample_map.png"); background-repeat:repeat;} /*end - .map-area (地圖底圖sample) --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox-sample --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox-sample { width:auto; margin:0px; position:absolute; top:100px; left:50px; z-index:2;} .MapTool-FunctionBox-sample .box-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:transparent;} .dec-map-type { width:auto; margin:5px; padding:3px 8px; border-radius:5px; background:rgba(255, 255, 255, 0.2); color:#333333; font-size:14px; line-height:14px; display:inline;} .dec-map-type.dec-bg { background:rgba(255, 255, 255, 0.85);} .dec-map-polygon-sample { width:100px; height:50px; margin:5px; padding:0px; border:2px solid #d9a20c; background:rgba(255, 255, 255, 0.5);} /*量測工具&空間定位 / 面(polygon)外框*/ .dec-map-marker-sample { margin:5px; padding:0px;} .dec-map-marker-sample .dec-img { margin:0px; padding:0px;} .dec-map-polygon-sample.dec-layer-school-colleage { width:100px; height:50px; margin:5px; padding:0px; border:2px solid #776744; background:rgba(156, 71, 149, 0.5);} /*圖層開關｜學校｜大學*/ .dec-map-polygon-sample.dec-layer-school-seniorHigh { width:100px; height:50px; margin:5px; padding:0px; border:2px solid #776744; background:rgba(231, 56, 40, 0.5);} /*圖層開關｜學校｜高中*/ .dec-map-polygon-sample.dec-layer-school-juniorHigh { width:100px; height:50px; margin:5px; padding:0px; border:2px solid #776744; background:rgba(151, 92, 0, 0.5);} /*圖層開關｜學校｜國中*/ .dec-map-polygon-sample.dec-layer-school-elementary { width:100px; height:50px; margin:5px; padding:0px; border:2px solid #776744; background:rgba(252, 207, 0, 0.5);} /*圖層開關｜學校｜國小*/ .dec-map-polygon-sample.dec-layer-school-kindergarten { width:100px; height:50px; margin:5px; padding:0px; border:2px solid #776744; background:rgba(93, 193, 207, 0.5);} /*圖層開關｜學校｜幼稚園*/ .dec-map-polygon-sample.dec-layer-park { width:100px; height:50px; margin:5px; padding:0px; border:2px solid #72bf44; background:rgba(114, 191, 68, 0.5);} /*圖層開關｜公園*/ .dec-map-polygon-sample.dec-layer-transit { width:100px; height:50px; margin:5px; padding:0px; border:2px solid #f7931e; background:rgba(247, 147, 30, 0.5);} /*圖層開關｜交通設施*/ .dec-map-polygon-sample.dec-layer-case { width:100px; height:50px; margin:5px; padding:0px; border:2px solid #e8528d; background:rgba(232, 82, 147, 0.5);} /*圖層開關｜個案圍籬*/ /*end - .MapTool-FunctionBox-sample --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox-Nav --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox-Nav { width:auto; height:35px; overflow:hidden; margin:0px; padding:6px 15px; background:rgba(255, 255, 255, 1); z-index:3; position:absolute; left:0px; bottom:309px; font-size:16px; border-top:1px solid #CCC; border-right:1px solid #CCC;} .MapTool-FunctionBox-Nav.div-MapTool-Sign-Nav { width:95px;} .MapTool-FunctionBox-Nav.div-MapTool-FunctionArea-AreaSearch-POISearch-Result-Nav { width:95px;} .MapTool-FunctionBox-Nav.dec-TrackHistory-Nav01 { left:0px;} .MapTool-FunctionBox-Nav.dec-TrackHistory-Nav02, .MapTool-FunctionBox-Nav.dec-TrackHistory-Nav02.is-active { left:95px;} .MapTool-FunctionBox-Nav.dec-TrackHistory-Nav03, .MapTool-FunctionBox-Nav.dec-TrackHistory-Nav03.is-active { left:190px;} .MapTool-FunctionBox-Nav.dec-Monitor-Car-Nav01, .MapTool-FunctionBox-Nav.dec-Monitor-Car-Nav01.is-active { left:0px; width:95px;} .MapTool-FunctionBox-Nav.dec-Monitor-Car-Nav02, .MapTool-FunctionBox-Nav.dec-Monitor-Car-Nav02.is-active { left:95px; width:95px;} .MapTool-FunctionBox-Nav.dec-Monitor-Car-Nav03, .MapTool-FunctionBox-Nav.dec-Monitor-Car-Nav03.is-active { left:190px; width:63px;} .MapTool-FunctionBox-Nav.dec-Monitor-Car-Nav01-secom, .MapTool-FunctionBox-Nav.dec-Monitor-Car-Nav01-secom.is-active { left:253px; width:144px;} .MapTool-FunctionBox-Nav.dec-Monitor-Car-Nav01-CTC, .MapTool-FunctionBox-Nav.dec-Monitor-Car-Nav01-CTC.is-active { left:397px; width:144px;} .MapTool-FunctionBox-Nav.dec-ParkingLot-Nav01 { left:0px;} .MapTool-FunctionBox-Nav.dec-ParkingLot-Nav02, .MapTool-FunctionBox-Nav.dec-ParkingLot-Nav02.is-active { left:127px;} .MapTool-FunctionBox-Nav.dec-ParkingLot-Nav01-collapse { left:0px; bottom:8px; border:0px;} .MapTool-FunctionBox-Nav.dec-ParkingLot-Nav02-collapse, .MapTool-FunctionBox-Nav.dec-ParkingLot-Nav02-collapse.is-active { left:127px; bottom:8px; border:0px;} .MapTool-FunctionBox-Nav.dec-ChargingPile-Nav, .MapTool-FunctionBox-Nav.dec-ChargingPile-Nav.is-active { left:0px; width:95px;} a.MapTool-FunctionBox-Nav, a.MapTool-FunctionBox-Nav:hover, a.MapTool-FunctionBox-Nav.is-active, a.MapTool-FunctionBox-Nav:hover.is-active { text-decoration:none;} a.MapTool-FunctionBox-Nav { color:#212529; background:#f0f0f0; border-bottom:1px solid #CCC;} a.MapTool-FunctionBox-Nav:hover { color: #169cbf; background:#ebebeb; border-bottom:1px solid #CCC;} a.MapTool-FunctionBox-Nav.is-active { color:#212529; background:rgba(255, 255, 255, 1); border-bottom:1px solid transparent;} a.MapTool-FunctionBox-Nav:hover.is-active { color:#212529; background:rgba(255, 255, 255, 1); border-bottom:1px solid transparent;} .MapTool-FunctionBox-Nav.dec-Mission-Nav01, .MapTool-FunctionBox-Nav.dec-Mission-Nav01.is-active { left:0px;} .MapTool-FunctionBox-Nav.dec-Mission-Nav02, .MapTool-FunctionBox-Nav.dec-Mission-Nav02.is-active { left:95px;} .MapTool-FunctionBox-Nav.dec-Mission-Nav03, .MapTool-FunctionBox-Nav.dec-Mission-Nav03.is-active { left:190px;} .MapTool-FunctionBox-Nav.dec-ChiMeiMission-Nav01, .MapTool-FunctionBox-Nav.dec-ChiMeiMission-Nav01.is-active { left:0px;} .MapTool-FunctionBox-Nav.dec-ChiMeiMission-Nav02, .MapTool-FunctionBox-Nav.dec-ChiMeiMission-Nav02.is-active { left:95px;} /*end - .MapTool-FunctionBox-Nav --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox-NavShowHide --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox-NavShowHide { width:35px; height:35px; overflow:hidden; margin:0px; padding:5px; background:rgba(255, 255, 255, 1); z-index:3; position:absolute; left:94px; bottom:309px; font-size:16px; border-top:1px solid #CCC; border-right:1px solid #CCC;} .MapTool-FunctionBox-NavShowHide.dec-TrackHistory { left:285px; border-bottom:1px solid #CCC;} .MapTool-FunctionBox-NavShowHide.dec-ParkingLot { left:254px; border-bottom:1px solid #CCC;} .MapTool-FunctionBox-NavShowHide.dec-CommandRoom-TrackHistory { left:190px; border-bottom:1px solid #CCC;} .MapTool-FunctionBox-NavShowHide a, .MapTool-FunctionBox-NavShowHide a:hover, .MapTool-FunctionBox-NavShowHide a.is-active, .MapTool-FunctionBox-NavShowHide a:hover.is-active { text-decoration:none; background:transparent; border-bottom:1px solid transparent;} .MapTool-FunctionBox-NavShowHide a { color:#212529;} .MapTool-FunctionBox-NavShowHide a:hover { color:#169cbf;} .MapTool-FunctionBox-NavShowHide a.is-active { color:#212529;} .MapTool-FunctionBox-NavShowHide a:hover.is-active { color:#212529;} .MapTool-FunctionBox-NavShowHide a .dec-ic, .MapTool-FunctionBox-NavShowHide a .dec-ic, .MapTool-FunctionBox-NavShowHide a .dec-ic:hover { margin:0px; padding:2px 3px 5px 3px; width:25px; height:25px; overflow:hidden; border-radius:3px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox-NavShowHide a .dec-ic { color:#787878;} .MapTool-FunctionBox-NavShowHide a .dec-ic:hover { background:transparent; color:#169cbf;} .MapTool-FunctionBox-NavShowHide a .dec-ic .dec-angleDown { font-size:20px;} .MapTool-FunctionBox-NavShowHide a .dec-ic .dec-angleUp { font-size:20px;} .MapTool-FunctionBox-NavShowHide.dec-show { left:94px; bottom:15px; bottom:10px; border-right:1px solid transparent; background:transparent; border-top:0px;} .MapTool-FunctionBox-NavShowHide.dec-show-ParkingLot { left:254px; bottom:10px; border-right:1px solid transparent; background:transparent; border-top:0px;} .MapTool-FunctionBox-NavShowHide.dec-MapTool-Mission { left:269px;} .MapTool-FunctionBox-NavShowHide.dec-MapTool-Mission.dec-p01 { left:189px;} /*註: [範圍搜尋]功能暫不開發，增加css style "dec-p01"設定以調整隱藏按鈕位置。(2023.01.03 update)*/ a.btn-MapTool-Monitor-Car-hide, a.btn-MapTool-Monitor-Car-hide:hover, a.btn-MapTool-Monitor-Car-show, a.btn-MapTool-Monitor-Car-show:hover, a.btn-MapTool-Monitor-Car-secom-hide, a.btn-MapTool-Monitor-Car-secom-hide:hover, a.btn-MapTool-Monitor-Car-secom-show, a.btn-MapTool-Monitor-Car-secom-show:hover, a.btn-MapTool-Monitor-Car-CTC-hide, a.btn-MapTool-Monitor-Car-CTC-hide:hover, a.btn-MapTool-Monitor-Car-CTC-show, a.btn-MapTool-Monitor-Car-CTC-show:hover, a.btn-MapTool-Device-hide, a.btn-MapTool-Device-hide:hover, a.btn-MapTool-Device-show, a.btn-MapTool-Device-show:hover, a.btn-MapTool-Sign-hide, a.btn-MapTool-Sign-hide:hover, a.btn-MapTool-Sign-show, a.btn-MapTool-Sign-show:hover, a.btn-MapTool-ChargingPile-hide, a.btn-MapTool-ChargingPile-hide:hover, a.btn-MapTool-ChargingPile-show, a.btn-MapTool-ChargingPile-show:hover { width:35px; height:35px; overflow:hidden; margin:0px 0px 0px 5px; padding:7px; background:#FFFFFF; font-size:20px; border:0px; color:#787878; display:inline-flex; vertical-align:top;} a.btn-MapTool-TrackHistory-Nav01-hide, a.btn-MapTool-TrackHistory-Nav01-hide:hover, a.btn-MapTool-TrackHistory-Nav01-show, a.btn-MapTool-TrackHistory-Nav01-show:hover, a.btn-MapTool-TrackHistory-Nav02-hide, a.btn-MapTool-TrackHistory-Nav02-hide:hover, a.btn-MapTool-TrackHistory-Nav02-show, a.btn-MapTool-TrackHistory-Nav02-show:hover, a.btn-MapTool-TrackHistory-Nav03-hide, a.btn-MapTool-TrackHistory-Nav03-hide:hover, a.btn-MapTool-TrackHistory-Nav03-show, a.btn-MapTool-TrackHistory-Nav03-show:hover { width:35px; height:35px; overflow:hidden; margin:2px 5px 0px 5px; padding:7px; background:#FFFFFF; font-size:20px; border:0px; color:#787878; display:inline-flex; vertical-align:top;} a.btn-MapTool-ChiMeiMission-Nav01-hide, a.btn-MapTool-ChiMeiMission-Nav01-hide:hover, a.btn-MapTool-ChiMeiMission-Nav01-show, a.btn-MapTool-ChiMeiMission-Nav01-show:hover, a.btn-MapTool-ChiMeiMission-Nav02-hide, a.btn-MapTool-ChiMeiMission-Nav02-hide:hover, a.btn-MapTool-ChiMeiMission-Nav02-show, a.btn-MapTool-ChiMeiMission-Nav02-show:hover { width:35px; height:35px; overflow:hidden; margin:2px 5px 0px 5px; padding:7px; background:#FFFFFF; font-size:20px; border:0px; color:#787878; display:inline-flex; vertical-align:top;} a.btn-MapTool-Monitor-Car-hide:hover, a.btn-MapTool-Monitor-Car-show:hover, a.btn-MapTool-TrackHistory-hide:hover, a.btn-MapTool-TrackHistory-show:hover, a.btn-MapTool-Device-hide:hover, a.btn-MapTool-Device-show:hover, a.btn-MapTool-Sign-hide:hover, a.btn-MapTool-Sign-show:hover, a.btn-MapTool-ChargingPile-hide:hover, a.btn-MapTool-ChargingPile-show:hover { color:#169cbf;} /*end - .MapTool-FunctionBox-NavShowHide --------------------------------------------------------------------------------------*/ /*start - .dec-ic-group-videoMultiple --------------------------------------------------------------------------------------*/ .dec-ic-group-videoMultiple { width:18px; height:18px; margin:0px; padding:0px; background:transparent; display:inline-block; position:relative; overflow:hidden;} .dec-ic-group-videoMultiple .dec-01 { margin:0px; padding:0px; color:#FFFFFF; position:absolute; font-size:10px; top:-1px !important; left:auto !important; right:0px !important; bottom:auto !important; -webkit-transform: rotate(-5deg); transform: rotate(-5deg);} .dec-ic-group-videoMultiple .dec-02 { margin:0px; padding: 0px; color:#FFFFFF; position:absolute; font-size:12px; bottom:-1px !important; left:0px !important; right:auto !important; top:auto !important; -webkit-transform: rotate(15deg); transform: rotate(15deg);} /*end - .dec-ic-group-videoMultiple --------------------------------------------------------------------------------------*/ /*start - .div-Map-TrackTimeline --------------------------------------------------------------------------------------*/ .div-Map-TrackTimeline { margin:0px; padding:0px; width:calc(50% - 0px); max-width:500px; background:transparent; position:absolute; left:350px; bottom:315px; z-index:2;} .div-Map-TrackTimeline .dec-innerBox { width:calc(100% - 0px); margin:0px; padding:10px 5px 0px 10px; background:rgba(255,255,255,0.75); border-radius:50px; box-shadow:0px 2px 4px rgba(0, 0, 0, .3); -ms-flex-pack: justify !important; justify-content: space-between !important; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .div-Map-TrackTimeline .con-L { width:38px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .div-Map-TrackTimeline .con-M { width:calc(100% - 95px); margin:0px 5px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .div-Map-TrackTimeline .con-R { width:50px; margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .div-Map-TrackTimeline .con-M .con-M-top { width:calc(100% - 5px); margin:5px 0px 0px 5px; padding:5px 0px;} .div-Map-TrackTimeline .con-M .con-M-top .dec-progress { height:0.5rem; border-top:1px solid #e6e6e6; border-right:1px solid #e6e6e6; border-bottom:0px solid #f0f0f0; border-left:0px solid #f0f0f0; background-color:#999999; background-image: linear-gradient(to bottom, #FFFFFF, #FFFFFF);} .div-Map-TrackTimeline .con-M .con-M-top .dec-color { background-color:#5dc1cf;} .div-Map-TrackTimeline .con-M .con-M-Bottom { width:calc(100% - 0px); margin:0px; padding:0px; -ms-flex-pack: justify !important; justify-content: space-between !important; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .div-Map-TrackTimeline .con-M .con-M-Bottom .dec-con-box { width:calc((100%/6) - 5px); margin:0px 5px 0px 0px; padding:0px; font-size:12px; color:#333333;} .div-Map-TrackTimeline .con-M .con-M-Bottom .dec-con-box .dec-type { text-shadow: 1px 1px 2px #FFFFFF, 0 0 25px #FFFFFF, 0 0 5px #CCCCCC; background:rgba(255,255,255,0.5); margin:0px; padding:0px 5px; border-radius:15px;} .div-Map-TrackTimeline a.btn-TrackTimeline-Play { } .div-Map-TrackTimeline a.btn-TrackTimeline-Play .dec-ic-01 { color:#C2C2C2;} .div-Map-TrackTimeline a.btn-TrackTimeline-Play:hover .dec-ic-01 { color:#666666;} .div-Map-TrackTimeline a.btn-TrackTimeline-Play .dec-ic-02 { color:#FFFFFF;} .div-Map-TrackTimeline a.btn-TrackTimeline-Play:hover .dec-ic-02 { color:#FFFFFF;} .div-Map-TrackTimeline a.btn-TrackTimeline-Forward .dec-ic { font-size:20px; margin:0px; padding:0px;} .div-Map-TrackTimeline a.btn-TrackTimeline-Backward .dec-ic { font-size:20px; margin:0px; padding:0px;} .div-Map-TrackTimeline a.btn-TrackTimeline-Forward { margin:0px; padding:0px;} .div-Map-TrackTimeline a.btn-TrackTimeline-Forward .dec-ic-01 { color:#C2C2C2;} .div-Map-TrackTimeline a.btn-TrackTimeline-Forward:hover .dec-ic-01 { color:#666666;} .div-Map-TrackTimeline a.btn-TrackTimeline-Forward .dec-ic-02 { color:#FFFFFF;} .div-Map-TrackTimeline a.btn-TrackTimeline-Forward:hover .dec-ic-02 { color:#FFFFFF;} .div-Map-TrackTimeline a.btn-TrackTimeline-Backward { margin:0px; padding:0px;} .div-Map-TrackTimeline a.btn-TrackTimeline-Backward .dec-ic-01 { color:#C2C2C2;} .div-Map-TrackTimeline a.btn-TrackTimeline-Backward:hover .dec-ic-01 { color:#666666;} .div-Map-TrackTimeline a.btn-TrackTimeline-Backward .dec-ic-02 { color:#FFFFFF;} .div-Map-TrackTimeline a.btn-TrackTimeline-Backward:hover .dec-ic-02 { color:#FFFFFF;} /*end - .div-Map-TrackTimeline --------------------------------------------------------------------------------------*/ /*start - MapTool-FunctionBox --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox { height:auto; margin:0px; padding:0px; position:absolute; left:10px; background:rgba(255, 255, 255, 0.85); color:#333333; border-radius:0px; z-index:2; box-shadow:0px 2px 4px rgba(0, 0, 0, .3); border:0px solid #999999;} .MapTool-FunctionBox .box-inner { width:calc(100% - 0px); height:auto; margin:0px; padding:0px 5px; overflow:hidden; border-radius:0px 0px 5px 5px; background:transparent;} .MapTool-FunctionBox.dec-FunctionArea-Measure .box-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px 5px; overflow:hidden; border-radius:0px 0px 5px 5px; background:transparent;} .MapTool-FunctionBox.dec-FunctionArea-Positioning .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Device .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-TrackHistory-Video .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Mission-Edit .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Mission-Detail .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Mission-Info .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Road .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-RoadM .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Road-Detail .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-POI .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-BusStopRoute-Route .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Video .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-DeviceInfo .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-SignInfo .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-ParkingLot .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-ParkingLot-ParkingLotList .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-ChargingPile .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-AreaSearch-POISearch .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-ChargingPileInfo .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main, .MapTool-FunctionBox.dec-Mission .box-inner .con-main, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main, .MapTool-FunctionBox.dec-CarMission .box-inner .con-main, .MapTool-FunctionBox.dec-Device .box-inner .con-main, .MapTool-FunctionBox.dec-Sign .box-inner .con-main, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main, .MapTool-FunctionBox.dec-ParkingLot-ParkingLotList .box-inner .con-main, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main, .MapTool-FunctionBox.dec-AreaSearch-POISearch .box-inner .con-main, .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; overflow-x:hidden; overflow-y:auto; height:255px;} /* .dec-Monitor-CarInfo ChargingPileInfo */ .MapTool-FunctionBox.dec-Monitor-Car, .MapTool-FunctionBox.dec-Mission, .MapTool-FunctionBox.dec-TrackHistory, .MapTool-FunctionBox.dec-CarMission, .MapTool-FunctionBox.dec-Device, .MapTool-FunctionBox.dec-Sign, .MapTool-FunctionBox.dec-ParkingLot, .MapTool-FunctionBox.dec-ParkingLot-ParkingLotList, .MapTool-FunctionBox.dec-ChiMeiMission, .MapTool-FunctionBox.dec-ChargingPile, .MapTool-FunctionBox.dec-AreaSearch-POISearch, .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result { width:350px; width:calc(100% - 0px); bottom:0px; left:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo, .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Device, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video, .MapTool-FunctionBox.dec-TrackHistory-Video, .MapTool-FunctionBox.dec-TrackHistory-Video-secom, .MapTool-FunctionBox.dec-TrackHistory-RightSideMode, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen, .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message, .MapTool-FunctionBox.dec-Mission-Edit, .MapTool-FunctionBox.dec-Mission-Detail, .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder, .MapTool-FunctionBox.dec-Mission-Detail-FillIn, .MapTool-FunctionBox.dec-Mission-Info, .MapTool-FunctionBox.dec-Mission-InfoWindow, .MapTool-FunctionBox.dec-Road, .MapTool-FunctionBox.dec-RoadM, .MapTool-FunctionBox.dec-Road-Detail, .MapTool-FunctionBox.dec-POI, .MapTool-FunctionBox.dec-CarMission-Schedule, .MapTool-FunctionBox.dec-BusStopRoute-BusStop, .MapTool-FunctionBox.dec-BusStopRoute-Route, .MapTool-FunctionBox.dec-Video, .MapTool-FunctionBox.dec-FunctionArea-Positioning, .MapTool-FunctionBox.dec-FunctionArea-Measure, .MapTool-FunctionBox.dec-FunctionArea-MapLayer, .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan, .MapTool-FunctionBox.dec-FunctionArea-BaseMap, .MapTool-FunctionBox.dec-FunctionArea-Alarm, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen, .MapTool-FunctionBox.dec-FunctionArea-Alarm-MapInfo, .MapTool-FunctionBox.dec-DeviceInfo, .MapTool-FunctionBox.dec-SignInfo, .MapTool-FunctionBox.dec-ParkingLot-ParkingLotList, .MapTool-FunctionBox.dec-AreaSearch-POISearch, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch, .MapTool-FunctionBox.dec-ExpirationDate-Announce, .MapTool-FunctionBox.dec-ChargingPileInfo { width:350px; top:95px; left:auto; right:10px;} .MapTool-FunctionBox.dec-Monitor-CarInfo { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo.dec-height-01 { height:40px;} .MapTool-FunctionBox.dec-ChargingPileInfo { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo.div-MapTool-Monitor-CarInfo-secom.dec-height-01 { height:40px;} .MapTool-FunctionBox.dec-Monitor-CarInfo.div-MapTool-Monitor-CarInfo-CTC.dec-height-01 { height:40px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Device { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-TrackHistory-Video { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-TrackHistory-Video-secom { height:calc(100% - 105px); width:calc(100% - 20px); z-index:1050;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom.dec-newPage { height:calc(100% - 0px); width:calc(100% - 0px); z-index:1050; top:0px; left:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom.dec-newPage .box-inner .con-top { border:0px;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen { height:calc(100% - 445px); width:calc(100% - 20px); z-index:3;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen.dec-Resizable { height:calc(100% - 89px); width:calc(100% - 0px); z-index:3; top:89px; left:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Mission-Edit { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Mission-Detail { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Mission-Detail-FillIn { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Mission-Info { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Mission-InfoWindow { height:auto; left: 30%;} .MapTool-FunctionBox.dec-DeviceInfo { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-SignInfo { height:calc(100% - 105px); width:200px;} .MapTool-FunctionBox.dec-ParkingLot-ParkingLotList { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-AreaSearch-POISearch { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-ExpirationDate-Announce { height:350px; left:calc(50% - 300px); width:600px; top:250px; z-index:3;} .MapTool-FunctionBox.dec-Road { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Road-Detail { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-RoadM { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-POI { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-CarMission-Schedule { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-BusStopRoute-BusStop { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-BusStopRoute-Route { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-Video { height:calc(100% - 105px); width:calc(100% - 20px);} .MapTool-FunctionBox.dec-FunctionArea-Positioning { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-FunctionArea-Measure { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-FunctionArea-MapLayer { width:250px; height:auto; padding-bottom:10px;} .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan { width:250px; height:auto; padding-bottom:10px; left:10px; right:auto;} .MapTool-FunctionBox.dec-FunctionArea-BaseMap { width:250px; height:auto; padding-bottom:10px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm { height:calc(100% - 105px); height:350px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen { height:calc(100% - 105px); width:calc(100% - 20px); z-index:3;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-MapInfo { width:220px; padding-bottom:5px; border-radius:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Device .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .box-inner .con-main, .MapTool-FunctionBox.dec-TrackHistory-Video .box-inner .con-main, .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main, .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .box-inner .con-main, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner .con-main, .MapTool-FunctionBox.dec-Mission-Edit .box-inner .con-main, .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main, .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main, .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main, .MapTool-FunctionBox.dec-Mission-Info .box-inner .con-main, .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner .con-main, .MapTool-FunctionBox.dec-Road .box-inner .con-main, .MapTool-FunctionBox.dec-Road-Detail .box-inner .con-main, .MapTool-FunctionBox.dec-RoadM .box-inner .con-main, .MapTool-FunctionBox.dec-POI .box-inner .con-main, .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-main, .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main, .MapTool-FunctionBox.dec-BusStopRoute-Route .box-inner .con-main, .MapTool-FunctionBox.dec-Video .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Positioning .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Measure .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-MapLayer .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Alarm-MapInfo .box-inner .con-main, .MapTool-FunctionBox.dec-DeviceInfo .box-inner .con-main, .MapTool-FunctionBox.dec-SignInfo .box-inner .con-main, .MapTool-FunctionBox.dec-ParkingLot-ParkingLotList .box-inner .con-main, .MapTool-FunctionBox.dec-AreaSearch-POISearch .box-inner .con-main, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main, .MapTool-FunctionBox.dec-ExpirationDate-Announce .box-inner .con-main, .MapTool-FunctionBox.dec-ChargingPileInfo .box-inner .con-main { color:#595959; width:calc(100% - 0px); height:calc(100% - 50px); margin:5px 0px 0px 0px; padding:1px 7px 0px 3px; display:block; overflow-x:hidden; overflow-y:auto; background-image:linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0.5));} .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner .con-main.div-MapTool-Monitor-CarInfo-CTC-conMain { overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner .con-main.div-MapTool-Monitor-CarInfo-CTC-conMain .con-main-CTC { width:calc(100% - 0px); height:calc(100% - 85px); margin:0px; padding:0px 5px 0px 0px;} .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Measure .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-MapLayer .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-main, .MapTool-FunctionBox.dec-FunctionArea-Alarm-MapInfo .box-inner .con-main { padding:0px 5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .box-inner .con-main { height:calc(100% - 50px);} .MapTool-FunctionBox.dec-Video .box-inner .con-main { height:calc(100% - 50px); overflow-y:auto;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-main { height:calc(100% - 50px); overflow-y:auto;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner .con-main { height:calc(100% - 50px); overflow-y:auto; } .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-main { height:calc(100% - 50px); overflow-y:auto;} .MapTool-FunctionBox.dec-Mission-Edit .box-inner .con-main { height:calc(100% - 50px); margin:5px 0px;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main { height:calc(100% - 50px); margin:5px 0px;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main { height:calc(100% - 50px); margin:5px 0px;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main { height:calc(100% - 50px); margin:5px 0px;} .MapTool-FunctionBox.dec-Mission-Info .box-inner .con-main { height:calc(100% - 50px); margin:5px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .box-inner .con-main { height:calc(100% - 50px); overflow-y:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .box-inner .con-main { height:calc(100% - 50px); overflow-y:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .box-inner .con-main { height:calc(100% - 50px); overflow-y:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .box-inner .con-main { height:calc(100% - 50px); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .box-inner .con-main { height:calc(100% - 55px);} .MapTool-FunctionBox.dec-TrackHistory-Video .box-inner .con-main { height:calc(100% - 55px); overflow-y:hidden;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main { height:calc(100% - 55px); overflow-y:hidden;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-main { height:calc(100% - 50px); overflow-y:hidden;} .MapTool-FunctionBox.dec-FunctionArea-MapLayer .box-inner .con-main { max-height:calc(100vh - 155px); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-main { max-height:calc(100vh - 155px); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-main { max-height:calc(100vh - 155px); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main { overflow-x:hidden; overflow-y:hidden;} .MapTool-FunctionBox.dec-ParkingLot-ParkingLotList .box-inner .con-main { height:calc(100% - 55px); overflow-x:hidden; overflow-y:hidden;} .MapTool-FunctionBox.dec-AreaSearch-POISearch .box-inner .con-main { height:calc(100% - 55px); overflow-x:hidden; overflow-y:hidden;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main { height:calc(100% - 45px); overflow-x:hidden; overflow-y:hidden;} .MapTool-FunctionBox.dec-ExpirationDate-Announce .box-inner .con-main { height:calc(100% - 45px); overflow-x:hidden; overflow-y:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-main { overflow:hidden; height:calc(100% - 50px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-main .box-con.dec-boxView-01 { overflow:hidden; height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-main .box-con.dec-boxView-02 { overflow:hidden; height:calc(100% - 0px);} .MapTool-FunctionBox.dec-BusStopRoute-BusStop.div-MapTool-BusStopRoute-BusStop-addStop .box-inner .con-main { overflow-x:hidden; overflow-y:auto;} /*start - .MapTool-FunctionBox.dec-BusStopRoute-Route.div-MapTool-BusStopRoute-Route-addRoute .box-inner .con-main*/ .MapTool-FunctionBox.dec-BusStopRoute-Route.div-MapTool-BusStopRoute-Route-addRoute .box-inner .con-main { overflow:hidden; height:calc(100% - 55px);} .MapTool-FunctionBox.dec-BusStopRoute-Route.div-MapTool-BusStopRoute-Route-addRoute .box-inner .con-main .box-conArea { height:calc(100% - 0px); overflow:hidden;} .MapTool-FunctionBox.dec-BusStopRoute-Route.div-MapTool-BusStopRoute-Route-addRoute .box-inner .con-main .box-Route-conArea { overflow:hidden; height:calc(100% - 180px);} .MapTool-FunctionBox.dec-BusStopRoute-Route.div-MapTool-BusStopRoute-Route-addRoute .box-inner .con-main .box-Route-conArea .box-listArea { overflow-x:hidden; overflow-y:auto; height:calc(100% - 45px);} /*end - .MapTool-FunctionBox.dec-BusStopRoute-Route.div-MapTool-BusStopRoute-Route-addRoute .box-inner .con-main*/ /*start - .MapTool-FunctionBox.dec-Monitor-RightClick ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-RightClick { height:auto; width:130px; z-index:999; border:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-Monitor-RightClick.dec-position-sample { bottom:60px; left:300px; right:auto;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner { padding:0px;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main { color:#595959; width:calc(100% - 0px); margin:2px 0px; padding:1px 3px 0px 3px; display:block; background-image:linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0.5));} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a, .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover { width:calc(100% - 0px); margin:0px; padding:5px; font-size:1rem; line-height:1.5rem; text-decoration:none; border-top:1px solid #ebebeb; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a { color:#787878;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover { color:#169cbf; background:#fafafa;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:first-child, .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover:first-child { border-top:0px;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a .dec-ic, .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover .dec-ic { margin:0px 5px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a .icon-sprite { margin-right:5px;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover .icon-sprite.icon-ic_monitorVideo_78 { background-position:-782px -2117px;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover .icon-sprite.icon-ic_video_78 { background-position:-816px -2117px;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover .icon-sprite.icon-ic_route_78 { background-position:-850px -2117px;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover .icon-sprite.icon-ic_navigateGoogle_78 { background-position:-884px -2117px;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover .icon-sprite.icon-ic_navigate_78 { background-position:-918px -2117px;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover .icon-sprite.icon-ic_message_78 { background-position:-952px -2117px;} .MapTool-FunctionBox.dec-Monitor-RightClick .box-inner .con-main a:hover .icon-sprite.icon-ic_cameraVideo_78 { background-position:-986px -2117px;} /*end - .MapTool-FunctionBox.dec-Monitor-RightClick ----------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-LeftClick ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-LeftClick { height:auto; width:80px; z-index:999; border:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-Monitor-LeftClick.dec-position-sample { bottom:155px; left:155px; right:auto;} .MapTool-FunctionBox.dec-Monitor-LeftClick .box-inner { padding:0px;} .MapTool-FunctionBox.dec-Monitor-LeftClick .box-inner .con-main { color:#595959; width:calc(100% - 0px); margin:2px 0px; padding:1px 3px 0px 3px; display:block; background-image: linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0.5));} .MapTool-FunctionBox.dec-Monitor-LeftClick .box-inner .con-main a, .MapTool-FunctionBox.dec-Monitor-LeftClick .box-inner .con-main a:hover { width:calc(100% - 0px); margin:0px; padding:5px; font-size:1rem; line-height:1.5rem; text-decoration:none; display:block; border-top:1px solid #ebebeb;} .MapTool-FunctionBox.dec-Monitor-LeftClick .box-inner .con-main a { color:#787878;} .MapTool-FunctionBox.dec-Monitor-LeftClick .box-inner .con-main a:hover { color:#169cbf; background:#fafafa;} .MapTool-FunctionBox.dec-Monitor-LeftClick .box-inner .con-main a:first-child, .MapTool-FunctionBox.dec-Monitor-LeftClick .box-inner .con-main a:hover:first-child { border-top:0px;} .MapTool-FunctionBox.dec-Monitor-LeftClick .box-inner .con-main a .dec-ic, .MapTool-FunctionBox.dec-Monitor-LeftClick .box-inner .con-main a:hover .dec-ic { margin:0px 5px 0px 0px;} /*end - .MapTool-FunctionBox.dec-Monitor-LeftClick ----------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-Car-secom-InfoWindow ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-Car-secom-InfoWindow { height:auto; width:250px; z-index:999; border:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-Monitor-Car-secom-InfoWindow.dec-position-sample { bottom:155px; left:455px; right:auto;} .MapTool-FunctionBox.dec-Monitor-Car-secom-InfoWindow .box-inner { padding:0px;} .MapTool-FunctionBox.dec-Monitor-Car-secom-InfoWindow .box-inner .con-main { color:#595959; width:calc(100% - 0px); margin:2px 0px; padding:1px 3px 0px 3px; display:block; background-image: linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0.5)); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Monitor-Car-secom-InfoWindow .box-inner .con-main .listGroup { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1rem; line-height:1.2rem; border-top:1px solid #CCCCCC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-Car-secom-InfoWindow .box-inner .con-main .listGroup:nth-child(1) { border-top:0px;} .MapTool-FunctionBox.dec-Monitor-Car-secom-InfoWindow .box-inner .con-main .listGroup .box-L { width:105px; margin:0px; padding:5px;} .MapTool-FunctionBox.dec-Monitor-Car-secom-InfoWindow .box-inner .con-main .listGroup .box-R { width:calc(100% - 105px); margin:0px; padding:5px;} /*end - .MapTool-FunctionBox.dec-Monitor-Car-secom-InfoWindow ----------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable { height:auto; width:80px; z-index:999; border:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable.dec-position-sample { bottom:155px; left:155px; right:auto;} .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable .box-inner { padding:0px;} .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable .box-inner .con-main { color:#595959; width:calc(100% - 0px); margin:2px 0px; padding:1px 3px 0px 3px; display:block; background-image: linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0.5));} .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable .box-inner .con-main a, .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable .box-inner .con-main a:hover { width:calc(100% - 0px); margin:0px; padding:5px; font-size:1rem; line-height:1.5rem; text-decoration:none; display:block; border-top: 1px solid #ebebeb;} .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable .box-inner .con-main a { color:#787878;} .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable .box-inner .con-main a:hover { color:#169cbf; background:#fafafa;} .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable .box-inner .con-main a:first-child, .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable .box-inner .con-main a:hover:first-child { border-top:0px;} .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable .box-inner .con-main a .dec-ic, .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable .box-inner .con-main a:hover .dec-ic { margin:0px 5px 0px 0px;} /*end - .MapTool-FunctionBox.dec-Monitor-LeftClick-BottomResizable ----------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-MapLeftClick ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-MapLeftClick { height:auto; width:105px; z-index:999; border:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick.dec-position-sample { top: 310px; left: 310px; right: auto;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner { padding:0px; width:calc(100% - 0px); margin:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-main { color:#595959; width:calc(100% - 0px); margin:2px 0px; padding:1px 3px 0px 3px; display:block; background:transparent;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-main a, .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-main a:hover { width:calc(100% - 0px); margin:0px; padding:5px; font-size:1rem; line-height:1.5rem; text-decoration:none; display:block; border-top:1px solid #ebebeb;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-main a { color:#787878; background:transparent;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-main a:hover { color:#169cbf; background:#fafafa;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-main a:first-child, .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-main a:hover:first-child { border-top:0px;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-main a .dec-ic, .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-main a:hover .dec-ic { margin:0px 5px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-btnArea { width:calc(100% - 0px); height:30px; overflow:hidden; margin:0px; padding:0px; display:inline-block; text-align:right; background:transparent;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-btnArea a, .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-btnArea a:hover { margin:0px; padding:5px; width:30px; height:30px; display:inline-block;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-btnArea a .dec-ic, .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-btnArea a:hover .dec-ic { margin:0px 4px 0px 0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-btnArea a .dec-ic { color:#787878;} .MapTool-FunctionBox.dec-Monitor-MapLeftClick .box-inner .con-btnArea a:hover .dec-ic { color:#169cbf;} /*end - .MapTool-FunctionBox.dec-Monitor-MapLeftClick ----------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-TimeSelector ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-TimeSelector { height:auto; width:200px; z-index:999; border:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-TimeSelector.dec-position-sample { bottom:80px; bottom:73px; left:auto; right:370px;} .MapTool-FunctionBox.dec-TimeSelector .box-inner { padding:0px;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main { color:#595959; width:calc(100% - 0px); margin:0px; padding:5px; display:block; background-image:linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0.5)); -ms-flex-direction: column !important; flex-direction: column !important;} /*start - .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-title*/ .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-title { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-title .box-L { width:40px; margin:0px; padding:5px;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-title .box-R { width:calc(100% - 40px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-title .box-R .dec-num { margin:0px; padding:0px; letter-spacing:0.2rem; font-size:1.2rem; font-weight:bold; color:#f7931e;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-title .box-R .dec-num::before { content:"："; color:#595959;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-title .box-R .dec-num:first-child::before { content:""; color:#595959;} /*end - .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-title*/ /*start - .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer*/ .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer { width:calc(100% - 0px); margin:0px; padding:5px; background:#fafafa; border:1px solid #ebebeb; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer .box-group { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #ebebeb; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer .box-group:first-child { margin:0px; padding:0px 0px 5px 0px; background:transparent; border:0px;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer .box-group .box-L { width:40px; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer .box-group .box-R { width:calc(100% - 40px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer .box-group .box-btnArea { margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer .box-group .box-R .box-Opacity-range { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer .box-group .box-R .box-Opacity-range .slider { -webkit-appearance: none; width:100%; height:2px; background:#d3d3d3; outline:none; opacity:0.7; -webkit-transition: .2s; transition: opacity .2s;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer .box-group .box-R .box-Opacity-range .slider:hover { opacity:1;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer .box-group .box-R .box-Opacity-range .slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 15px; height: 15px; background: #169cbf; cursor: pointer; border-radius: 15px;} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer .box-group .box-R .box-Opacity-range .slider::-moz-range-thumb { width: 15px; height: 15px; background: #169cbf; cursor: pointer; border-radius: 15px;} /*end - .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-group-outer*/ .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-btnArea .con-btnbox .dec-btn.dec-w-half { width:calc(50% - 5px);} .MapTool-FunctionBox.dec-TimeSelector .box-inner .con-main .box-btnArea .con-btnbox .dec-btn.dec-w-half:last-child { width:calc(40% - 5px);} /*end - .MapTool-FunctionBox.dec-TimeSelector ----------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-tableArea { width:calc(100% - 94px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/7) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#FFFFFF; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #999999; border-bottom:1px solid #999999;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea.div-MapTool-Monitor-Car-selectionArea.dec-all { border-right:5px solid #2ca6e0;} /*車輛現況｜all*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea.div-MapTool-Monitor-Car-selectionArea.dec-driving { border-right:5px solid #0089ff;} /*blue｜車輛現況｜行駛*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea.div-MapTool-Monitor-Car-selectionArea.dec-speeding { border-right:5px solid #ff0000;} /*red｜車輛現況｜超速*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea.div-MapTool-Monitor-Car-selectionArea.dec-idling { border-right:5px solid #f7931e;} /*orange｜車輛現況｜停留*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea.div-MapTool-Monitor-Car-selectionArea.dec-parked { border-right:5px solid #e8528d;} /*darkPink｜車輛現況｜怠速*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea.div-MapTool-Monitor-Car-selectionArea.dec-flameout { border-right:5px solid #787878;} /*darkGray｜車輛現況｜熄火*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea.div-MapTool-Monitor-Car-selectionArea.dec-outage { border-right:5px solid #b3b3b3;} /*gray｜車輛現況｜斷訊*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all:hover, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active:hover { background:#2ca6e0;} /*blue｜輛現況｜all*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-driving:hover, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-driving.is-active, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-driving.is-active:hover { background:#0089ff;} /*blue｜車輛現況｜行駛*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-speeding:hover, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-speeding.is-active, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-speeding.is-active:hover { background:#ff0000;} /*red｜車輛現況｜超速*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-idling:hover, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-idling.is-active, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-idling.is-active:hover { background:#f7931e;} /*orange｜車輛現況｜停留*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parked:hover, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parked.is-active, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parked.is-active:hover { background:#e8528d;} /*darkPink｜車輛現況｜怠速*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-flameout:hover, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-flameout.is-active, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-flameout.is-active:hover { background:#787878;} /*darkGray｜車輛現況｜熄火*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-outage:hover, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-outage.is-active, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav.dec-outage.is-active:hover { background:#b3b3b3;} /*gray｜車輛現況｜斷訊*/ /*end - .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main 充電樁 --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-tableArea { width:calc(100% - 94px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/5) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#FFFFFF; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #999999; border-bottom:1px solid #999999;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea.div-MapTool-ChargingPileCondition-selectionArea.dec-ChargingPileCondition-all { border-right:5px solid #2ca6e0;} /*充電樁｜all*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea.div-MapTool-ChargingPileCondition-selectionArea.dec-ChargingPileCondition-charging { border-right:5px solid #0089ff;} /*blue｜充電樁｜充電中*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea.div-MapTool-ChargingPileCondition-selectionArea.dec-ChargingPileCondition-notInUse { border-right:5px solid #787878;} /*darkGray｜充電樁｜未使用*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea.div-MapTool-ChargingPileCondition-selectionArea.dec-ChargingPileCondition-breakdown { border-right:5px solid #ED1C24;} /*red｜充電樁｜故障*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea.div-MapTool-ChargingPileCondition-selectionArea.dec-ChargingPileCondition-outage { border-right:5px solid #b3b3b3;} /*gray｜充電樁｜未連線*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-all:hover, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-all.is-active, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-all.is-active:hover { background:#2ca6e0;} /*blue｜充電樁｜all*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-charging:hover, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-charging.is-active, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-charging.is-active:hover { background:#0089ff;} /*blue｜充電樁｜充電中*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-notInUse:hover, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-notInUse.is-active, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-notInUse.is-active:hover { background:#787878;} /*darkGray｜充電樁｜未使用*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-breakdown:hover, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-breakdown.is-active, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-breakdown.is-active:hover { background:#ED1C24;} /*red｜充電樁｜故障*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-outage:hover, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-outage.is-active, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-outage.is-active:hover { background:#b3b3b3;} /*gray｜充電樁｜未連線*/ /*end - .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-main 充電樁 --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Device .box-inner .con-main --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Device .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-tableArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/7) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#999999; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #169cbf; border-bottom:1px solid #169cbf;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { } .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} /*end - .MapTool-FunctionBox.dec-Device .box-inner .con-main --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Sign .box-inner .con-main --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Sign .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-tableArea { width:calc(100% - 94px); width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/7) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#999999; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color: #FFFFFF; background:#2ca6e0; border-top:1px solid #169cbf; border-bottom:1px solid #169cbf;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type {} .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} /*end - .MapTool-FunctionBox.dec-Sign .box-inner .con-main --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-CarMission .box-inner .con-main --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-CarMission .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-tableArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/7) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#999999; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #169cbf; border-bottom:1px solid #169cbf;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { } .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} /*end - .MapTool-FunctionBox.dec-CarMission .box-inner .con-main --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Mission .box-inner .con-main 任務派遣 --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; /*display: -ms-flexbox !important; display: flex !important;*/ -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav01 {} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav02 {} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav03 {} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-tableArea { width:calc(100% - 94px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/5) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#FFFFFF; /*background:#e6e6e6; border-top:1px solid #CCCCCC;*/} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #828282; border-bottom:1px solid #828282;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav01 .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav02, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav03 { border-right:5px solid #2ca6e0;} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav01.dec-all, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav02.dec-all, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav03.dec-all { border-right:5px solid #2ca6e0;} /*任務派遣｜範圍搜尋｜全部*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav01.dec-notYetStarted, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav02.dec-notYetStarted, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav03.dec-notYetStarted { border-right:5px solid #b3b3b3;} /*gray｜任務派遣｜範圍搜尋｜未開始*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav01.dec-onTheGo, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav02.dec-onTheGo, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav03.dec-onTheGo { border-right:5px solid #0089ff;} /*blue｜任務派遣｜範圍搜尋｜進行中*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav01.dec-delivered, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav02.dec-delivered, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav03.dec-delivered { border-right:5px solid #39b54a;} /*green｜任務派遣｜範圍搜尋｜已配達*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav01.dec-cancel, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav02.dec-cancel, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav03.dec-cancel { border-right:5px solid #787878;} /*darkGray｜任務派遣｜範圍搜尋｜已取消*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav01.dec-abnormal, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav02.dec-abnormal, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav03.dec-abnormal { border-right:5px solid #f15a24;} /*red｜任務派遣｜範圍搜尋｜異常*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav01 a.btn-subNav, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav01 a.btn-subNav:hover { height:calc((100%/6) - 0px);} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav02 a.btn-subNav, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav02 a.btn-subNav:hover { height:calc((100%/4) - 0px);} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav03 a.btn-subNav, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea.div-MapTool-Mission-selectionArea-Nav03 a.btn-subNav:hover { height:calc((100%/6) - 0px);} .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all:hover, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active:hover { background:#2ca6e0;} /*任務派遣｜範圍搜尋｜全部*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-notYetStarted:hover, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-notYetStarted.is-active, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-notYetStarted.is-active:hover { background:#b3b3b3;} /*gray｜任務派遣｜範圍搜尋｜未開始*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-onTheGo:hover, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-onTheGo.is-active, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-onTheGo.is-active:hover { background:#0089ff;} /*blue｜任務派遣｜範圍搜尋｜進行中*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-delivered:hover, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-delivered.is-active, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-delivered.is-active:hover { background:#39b54a;} /*green｜任務派遣｜範圍搜尋｜已配達*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-cancel:hover, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-cancel.is-active, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-cancel.is-active:hover { background:#787878;} /*darkGray｜任務派遣｜範圍搜尋｜已取消*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-abnormal:hover, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-abnormal.is-active, .MapTool-FunctionBox.dec-Mission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-abnormal.is-active:hover { background:#f15a24;} /*red｜任務派遣｜範圍搜尋｜異常*/ /*end - .MapTool-FunctionBox.dec-Mission .box-inner .con-main 任務派遣 --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main 奇美任務 --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav01 {} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav02 {} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-tableArea { width:calc(100% - 94px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-tableArea.dec-overflow-01 .box-tableArea-innerBox { margin:0px; padding:0px; width:calc(100% - 0px); height:calc(100% - 0px);} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/6) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#FFFFFF;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #828282; border-bottom:1px solid #828282;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav01 .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav02 { border-right:5px solid #2ca6e0;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav01.dec-ChiMeiMissionCondition-A, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav02.dec-ChiMeiMissionCondition-A { border-right:5px solid #b3b3b3;} /*gray｜奇美任務｜任務狀態｜未執行*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav01.dec-ChiMeiMissionCondition-B, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav02.dec-ChiMeiMissionCondition-B { border-right:5px solid #50a8b4;} /*teal｜奇美任務｜任務狀態｜已掛號*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav01.dec-ChiMeiMissionCondition-C, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav02.dec-ChiMeiMissionCondition-C { border-right:5px solid #0089ff;} /*blue｜奇美任務｜任務狀態｜入廠中*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav01.dec-ChiMeiMissionCondition-D, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav02.dec-ChiMeiMissionCondition-D { border-right:5px solid #f7931e;} /*orange｜奇美任務｜任務狀態｜出廠中*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav01.dec-ChiMeiMissionCondition-E, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav02.dec-ChiMeiMissionCondition-E { border-right:5px solid #39b54a;} /*green｜奇美任務｜任務狀態｜已執行*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav01.dec-ChiMeiMissionCondition-F, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav02.dec-ChiMeiMissionCondition-F { border-right:5px solid #787878;} /*darkGray｜奇美任務｜任務狀態｜已取消*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav01 a.btn-subNav, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav01 a.btn-subNav:hover { height:calc((100%/4) - 0px);} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav02 a.btn-subNav, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-selectionArea-Nav02 a.btn-subNav:hover { height:calc((100%/6) - 0px);} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-A:hover, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-A.is-active, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-A.is-active:hover { background:#b3b3b3;} /*gray｜奇美任務｜任務狀態｜未執行*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-B:hover, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-B.is-active, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-B.is-active:hover { background:#50a8b4;} /*teal｜奇美任務｜任務狀態｜已掛號*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-C:hover, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-C.is-active, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-C.is-active:hover { background:#0089ff;} /*blue｜奇美任務｜任務狀態｜入廠中*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-D:hover, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-D.is-active, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-D.is-active:hover { background:#f7931e;} /*orange｜奇美任務｜任務狀態｜出廠中*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-E:hover, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-E.is-active, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-E.is-active:hover { background:#39b54a;} /*green｜奇美任務｜任務狀態｜已執行*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-F:hover, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-F.is-active, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-F.is-active:hover { background:#787878;} /*darkGray｜奇美任務｜任務狀態｜已取消*/ /*end - .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-main 奇美任務 --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea { width:89px; width:95px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-tableArea { width:calc(100% - 94px); width:calc(100% - 100px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow: hidden;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-tableArea.dec-overflow-01 .dec-innerBoxArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:transparent; overflow:hidden;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-tableArea.dec-overflow-01 .dec-innerBoxArea .dec-innerBox-01, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-tableArea.dec-overflow-01 .dec-innerBoxArea .dec-innerBox-02 { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:transparent; overflow:hidden;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/5) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#999999; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #169cbf; border-bottom:1px solid #169cbf;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type {} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} /*end - .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main 軌跡查詢 --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main.dec-CarSearching { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-tableArea { width:calc(100% - 94px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main.dec-CarSearching .box-tableArea { width:calc(100% - 0px);} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main.dec-CarSearching .box-tableArea .table a.dec-table-btn, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main.dec-CarSearching .box-tableArea .table a:hover.dec-table-btn { height:auto; margin:0px; padding:2px 5px; border:0px; background:transparent;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main .box-selectionArea a.btn-subNav:hover, .MapTool-FunctionBox.dec-CarMission .box-inner .con-main .box-selectionArea a.btn-subNav:hover, .MapTool-FunctionBox.dec-Device .box-inner .con-main .box-selectionArea a.btn-subNav:hover, .MapTool-FunctionBox.dec-Sign .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/7) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#FFFFFF; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea.div-MapTool-TrackHistory-selectionArea.dec-all { border-right:5px solid #2ca6e0;} /*軌跡查詢｜all*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea.div-MapTool-TrackHistory-selectionArea.dec-driving { border-right:5px solid #0089ff;} /*blue｜軌跡查詢｜行駛*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea.div-MapTool-TrackHistory-selectionArea.dec-speeding { border-right:5px solid #ff0000;} /*red｜軌跡查詢｜超速*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea.div-MapTool-TrackHistory-selectionArea.dec-idling { border-right:5px solid #f7931e;} /*orange｜軌跡查詢｜停留*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea.div-MapTool-TrackHistory-selectionArea.dec-parked { border-right:5px solid #e8528d;} /*darkPink｜軌跡查詢｜怠速*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea.div-MapTool-TrackHistory-selectionArea.dec-flameout { border-right:5px solid #787878;} /*darkGray｜軌跡查詢｜熄火*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea.div-MapTool-TrackHistory-selectionArea.dec-outage { border-right:5px solid #b3b3b3;} /*gray｜軌跡查詢｜斷訊*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all:hover, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active:hover { background:#2ca6e0;} /*blue｜軌跡查詢｜all*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-driving:hover, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-driving.is-active, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-driving.is-active:hover { background:#0089ff;} /*blue｜軌跡查詢｜行駛*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-speeding:hover, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-speeding.is-active, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-speeding.is-active:hover { background:#ff0000;} /*red｜軌跡查詢｜超速*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-idling:hover, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-idling.is-active, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-idling.is-active:hover { background:#f7931e;} /*orange｜軌跡查詢｜停留*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parked:hover, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parked.is-active, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parked.is-active:hover { background:#e8528d;} /*darkPink｜軌跡查詢｜怠速*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-flameout:hover, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-flameout.is-active, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-flameout.is-active:hover { background:#787878;} /*darkGray｜軌跡查詢｜熄火*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-outage:hover, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-outage.is-active, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main .box-selectionArea a.btn-subNav.dec-outage.is-active:hover { background:#b3b3b3;} /*gray｜軌跡查詢｜斷訊*/ /*end - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-main 軌跡查詢 --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main 停車場 --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ParkingLot｜停車場 border-right ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav:hover { color:#FFFFFF; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea.dec-all { border-right:5px solid #2ca6e0;} /*停車場｜all*/ .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea.dec-parking-01 { border-right:5px solid #29abe2;} /*blue｜停車場｜停車場01*/ .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea.dec-parking-02 { border-right:5px solid #50a8b4;} /*red｜停車場｜停車場02*/ .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea.div-MapTool-ParkingLot-selectionArea a.btn-subNav:hover { height:calc((100%/5) - 0px);} /*end - .MapTool-FunctionBox.dec-ParkingLot｜停車場 border-right ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ParkingLot｜停車場 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all:hover, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active:hover { background:#2ca6e0;} /*blue｜停車場｜all*/ .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-01:hover, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-01.is-active, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-01.is-active:hover { background: #29abe2;} /*blue｜停車場｜停車場01*/ .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-02:hover, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-02.is-active, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-02.is-active:hover { background:#50a8b4;} /*red｜停車場｜停車場02*/ /*end - .MapTool-FunctionBox.dec-ParkingLot｜停車場 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*end - .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-main 停車場 --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-tableArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/7) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#999999; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #169cbf; border-bottom:1px solid #169cbf;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { } .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} /*end - .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-main --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-tableArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto; } .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/7) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#999999; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #169cbf; border-bottom:1px solid #169cbf;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { } .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} /*end - .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-main --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main { width:calc(100% - 0px); margin:0px; padding:0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea { width:89px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-tableArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/7) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav:first-child, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav:last-child, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#999999; background:#e6e6e6; border-top:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav.is-active, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #169cbf; border-bottom:1px solid #169cbf;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { } .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .MapTool-FunctionBox.dec-AreaSearch-PAddressSearch .box-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} /*end - .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-main --------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-TrackHistory-Video-secom ----------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-TrackHistory-Video-secom { margin:0px; padding:0px; background:#333333; z-index:4;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-top { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-top .con-top-title { width:calc(100% - 60px); margin:0px; padding:0px; color:#FFFFFF; font-size:16px; line-height:1.2rem; letter-spacing: 0.2rem; font-weight:500; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-top .con-top-title .dec-box-list { width:300px; height:calc(100% - 0px); margin:0px 0px 0px 10px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-top .con-top-title .dec-box-result { width:calc(100% - 320px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main { width:calc(100% - 20px); height: calc(100% - 55px); overflow:hidden; margin:0px 10px; color:#FFFFFF; border:0px; padding: 0px; background:#333333; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area { width:300px; height:calc(100% - 0px); margin:0px 10px 0px 0px; padding:0px 5px 0px 0px; background:#333333; overflow-x:hidden; overflow-y:auto; color:#FFFFFF;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area .con-box { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area .con-subTitle { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:0px; color:#FFFFFF; font-size:1rem;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area .con-box .box-width-half:first-child { width:calc(50% - 2px); margin:0px 5px 0px 0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area .con-box .box-width-half { width:calc(50% - 3px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area .dec-divider { width:calc(100% - 0px); margin:15px 0px; padding:0px; border-top:1px solid #666666;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area-result { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area .con-title { width:calc(100% - 0px); margin:0px; padding:0px; color:#FFFFFF; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area .con-title-01 { width:calc(100% - 0px); margin:0px; padding:0px; color:#e0e0e0; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500;} /*start - .box-btn-channelArea --------------------------------------------------------------*/ /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: start !important; align-items: flex-start !important;} /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem, /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem:hover, /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem.is-active, /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem.is-active:hover { width:calc(20% - 5px); height:36px; margin:5px 5px 5px 0px; padding:5px; border:1px solid #595959; background:#252525; color:#FFFFFF; font-size:1.2rem; line-height:1.5rem; overflow:hidden; text-align:center;} /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem:hover, /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem.is-active, /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem.is-active:hover { width:calc(20% - 5px); height:36px; margin:5px 5px 5px 0px; padding:5px; border:2px solid #5dc1cf; background:#212121; color:#5dc1cf; font-size:1.3rem; line-height:1.5rem; overflow:hidden; text-align:center;} /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem.dec-gray, /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem.dec-gray:hover, /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem.dec-gray.is-active, /*.MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-list-area*/ .box-btn-channelArea a.channelItem.dec-gray.is-active:hover { width:calc(20% - 5px); height:36px; margin:5px 5px 5px 0px; padding:5px; border:1px solid #787878; background:#787878; color:#CCCCCC; font-size:1.2rem; line-height:1.5rem; overflow:hidden; text-align:center;} /*end - .box-btn-channelArea --------------------------------------------------------------*/ /*start - .box-btn-channelArea.dec-light --------------------------------------------------------------*/ .box-btn-channelArea.dec-light { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: start !important; align-items: flex-start !important;} .box-btn-channelArea.dec-light a.channelItem, .box-btn-channelArea.dec-light a.channelItem:hover, .box-btn-channelArea.dec-light a.channelItem.is-active, .box-btn-channelArea.dec-light a.channelItem.is-active:hover { width:calc(20% - 5px); height:36px; margin:5px 5px 5px 0px; padding:5px; border:1px solid #adadad; background:#fafafa; color:#787878; font-size:1.2rem; line-height:1.5rem; overflow:hidden; text-align:center;} .box-btn-channelArea.dec-light a.channelItem:hover, .box-btn-channelArea.dec-light a.channelItem.is-active, .box-btn-channelArea.dec-light a.channelItem.is-active:hover { width:calc(20% - 5px); height:36px; margin:5px 5px 5px 0px; padding:5px; border:2px solid #5dc1cf; background:#FFFFFF; color:#5dc1cf; font-size:1.3rem; line-height:1.5rem; overflow:hidden; text-align:center;} .box-btn-channelArea.dec-light a.channelItem.dec-gray, .box-btn-channelArea.dec-light a.channelItem.dec-gray:hover, .box-btn-channelArea.dec-light a.channelItem.dec-gray.is-active, .box-btn-channelArea.dec-light a.channelItem.dec-gray.is-active:hover { width:calc(20% - 5px); height:36px; margin:5px 5px 5px 0px; padding:5px; border:1px solid #999999; background:#999999; color:#CCCCCC; font-size:1.2rem; line-height:1.5rem; overflow:hidden; text-align:center;} /*end - .box-btn-channelArea.dec-light --------------------------------------------------------------*/ .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area { width:calc(100% - 310px); height:calc(100% - 0px); margin:0px; padding:0px; background:#020100; overflow:hidden; color:#FFFFFF; position:relative; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box { width:calc(100% - 0px); height:calc(100% - 130px); margin:0px; padding:0px; background:transparent;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-04 .dec-imgArea { width:calc(50% - 8px); height:calc(50% - 5px);} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea .dec-imgArea, .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-08 .dec-imgArea { width:calc(25% - 8px); height:calc(100% - 10px); margin:0px 5px 0px 0px; padding:5px; border:1px solid #333333; display: inline-block; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea .dec-imgArea:nth-child(1), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea .dec-imgArea:nth-child(2), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea .dec-imgArea:nth-child(3), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea .dec-imgArea:nth-child(4) { margin-top:5px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-01 .dec-imgArea:nth-child(2), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-01 .dec-imgArea:nth-child(3), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-01 .dec-imgArea:nth-child(4), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-01 .dec-imgArea:nth-child(5), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-01 .dec-imgArea:nth-child(6), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-01 .dec-imgArea:nth-child(7), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-01 .dec-imgArea:nth-child(8) { display:none;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-04 .dec-imgArea:nth-child(5), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-04 .dec-imgArea:nth-child(6), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-04 .dec-imgArea:nth-child(7), .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-04 .dec-imgArea:nth-child(8) { display:none;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea .dec-imgArea .dec-imgBox { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-08 .dec-imgArea { height: calc(50% - 5px);} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea .dec-imgArea .dec-imgBox .dec-img { margin:0px; padding:0px; max-width:calc(100% - 0px); height:calc(100% - 0px); max-height:calc(100% - 0px);} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea .dec-imgArea .dec-imgBox .dec-type { color:#ebebeb;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .dec-box .dec-imgBoxArea.dec-img-01 .dec-imgArea { width:calc(100% - 8px);} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #centerLine { -webkit-transform: translateZ(0); z-index:2; width:0px; border-right:2px solid #0C5DAB; bottom:45px; height:45px; position:absolute;} /* start - RD / 中保Phase2｜__監控影像：歷史紀錄(歷史軌跡-影像)(中保SECOM) -------------------------------------------------------------------------------------------------------------------------------------------------*/ .unavaliableZone { width: 6px; height: 100%; position: relative; float: left; display: inline-block; background-color:#DFF3F9; background-image:url('../img/timelineBg.png');} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #centerLine { -webkit-transform: translateZ(0); z-index:2; width:0px; border-right:2px solid #0C5DAB; bottom:45px; height:45px; position:absolute;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #idTimelineOutside, .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .idTimelineOutside { left:0; bottom:0px; height:88px; width:100%; background-color:#DFF3F9; border:1px solid #DFF3F9; overflow-x:scroll; z-index:1; position:absolute; overflow-y:hidden !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .idTimelineInside { width:9100px; float:left; background-color:rgba(0,0,0,0.05); background-image: url("../img/slash_background.png"); position:absolute; bottom:0px; left:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #idTimelineInside .extendFrontBlock, .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .idTimelineInside .extendFrontBlock { float:left; background-color:none; height:60px; width:100px; position:absolute;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #idTimelineInside .timeDrag, .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .idTimelineInside .timeDrag { display:inline-block; float:left; height:60px; background-image:url('../img/timelineBg.png'); background-color:#81e6ff; width:8640px; position:relative;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #idTimelineInside .timeDrag .manyTimeLabel, .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area .idTimelineInside .timeDrag .manyTimeLabel { text-align:center; font-weight:bold; font-family: arial; color:#121212; position:absolute; bottom:-25px; display:inline-block; width:80px; user-select:none; text-align:left;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #videoControlBar { width:calc(100% - 0px); height:40px; display:block; margin:0px; padding:2px 5px 5px 5px; padding:0px; background:#6DA7C0; bottom:88px; position:absolute; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #videoControlBar .btnVideoControl { width:40px; height:40px; overflow:hidden; margin:0px 5px 0px 0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #videoControlBar .btnVideoControl:first-child { width:40px; margin:0px 35px 0px 0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #videoControlBar .btnVideoControl:last-child { width:40px; margin:0px 35px 0px 0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #videoControlBar .btnVideoControl img { width:30px; margin:5px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video-secom .box-inner .con-main .dec-box-result-area #videoControlBar .btnVideoControl:nth-child(3) img { width:40px; margin:5px 0px; padding:0px;} /* end - RD / 中保Phase2｜__監控影像：歷史紀錄(歷史軌跡-影像)(中保SECOM) -------------------------------------------------------------------------------------------------------------------------------------------------*/ /*end - .MapTool-FunctionBox.dec-TrackHistory-Video-secom ----------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox .box-inner .con-top --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox .box-inner .con-top { width:calc(100% + 10px); margin:0px -5px; height:45px; padding:2px 0px 3px 0px; border-bottom:0px solid #5b4d2f; border-top:1px solid #CCCCCC; /*overflow:hidden;*/ background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox .box-inner .con-top .con-top-title, .MapTool-FunctionBox .box-inner .con-top .con-top-btn { margin:0px; padding:0px; display:inline-block; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox .box-inner .con-top .con-top-title { width:calc(100% - 0px); margin:0px 0px 0px 5px; padding:0px 0px 0px 5px; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#595959; height:40px; /*overflow:hidden;*/ -ms-flex-pack: start !important;justify-content: flex-start !important;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-form-check-01 { font-size:1rem; font-weight:normal; margin-left:auto; margin-right:0px; letter-spacing:normal;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title { width:calc(100% - 0px); height:40px; /*overflow:hidden;*/} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-title { width:120px; margin:0px; padding:5px; font-size:16px; line-height:1.2rem; letter-spacing:0rem; color:#212529; font-weight:normal;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-title a { display:inline-block;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con { width:calc(100% - 100px); margin:0px; margin-left:auto; padding:0px; font-size:1rem; line-height:1.2rem; letter-spacing:0rem; color:#212529; font-weight:normal; height:40px; /*overflow:hidden;*/} .MapTool-FunctionBox.dec-ExpirationDate-Announce .box-inner.div-box-inner { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-ExpirationDate-Announce .box-inner.div-box-inner .con-top { height:45px;} .MapTool-FunctionBox.dec-ExpirationDate-Announce .box-inner.div-box-inner .con-main { height:calc(100% - 55px); overflow-y:auto; width:calc(100% - 5px); margin-right: 5px;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-a01, .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-a02, .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-a03 { margin:0px 0px 0px 5px; height:33px;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-a01 { width:180px; margin-left:15px;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-a02 { width:150px;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-a03 { width:60px;} /*start - .MapTool-FunctionBox.dec-Mission*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-top { width:calc(100% + 10px); height:45px; padding:2px 0px 3px 0px; overflow:hidden; margin:0px -5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title { margin:0px; padding:0px; width:calc(100% - 0px); height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-title { width:135px; margin:0px; padding:0px 0px 0px 22px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con { width:calc(100% - 135px); height:40px; overflow:hidden; margin:0px; padding:0px; margin-left:auto;} /*end - .MapTool-FunctionBox.dec-Mission*/ /*start - .MapTool-FunctionBox.dec-ChiMeiMission*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top { width:calc(100% + 10px); height:45px; padding:2px 0px 3px 0px; overflow:hidden; margin:0px -5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title { margin:0px; padding:0px; width:calc(100% - 0px); height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-title { width:135px; margin:0px; padding:0px 0px 0px 22px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con { width:calc(100% - 135px); height:40px; overflow:hidden; margin:0px; padding:0px; margin-left:auto;} /*end - .MapTool-FunctionBox.dec-ChiMeiMission*/ /*start - .MapTool-FunctionBox.dec-ChargingPile*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top { width:calc(100% + 10px); height:45px; padding:2px 0px 3px 0px; overflow:hidden; margin:0px -5px;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title { margin:0px; padding:0px; width:calc(100% - 0px); height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-title { width:135px; width:100px; margin:0px; padding:0px 0px 0px 22px;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con { width:calc(100% - 135px); width:calc(100% - 100px); height:40px; overflow:hidden; margin:0px; padding:0px; margin-left:auto;} /*end - .MapTool-FunctionBox.dec-ChargingPile*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top, .MapTool-FunctionBox.dec-Mission .box-inner .con-top, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top, .MapTool-FunctionBox.dec-CarMission .box-inner .con-top, .MapTool-FunctionBox.dec-Device .box-inner .con-top, .MapTool-FunctionBox.dec-Sign .box-inner .con-top, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top, .MapTool-FunctionBox.dec-ParkingLot-ParkingLotList .box-inner .con-top, .MapTool-FunctionBox.dec-AreaSearch-POISearch .box-inner .con-top, .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch .box-inner .con-top, .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top, .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top { height:45px; padding:2px 0px 3px 0px;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con { width:calc(100% - 120px); height:40px; overflow:hidden; position:relative; margin:0px; padding:0px; margin-left:auto;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con a.dec-btn { margin:3px 0px 0px 0px;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { margin:0px;} .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con { width:calc(100% - 100px);} .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con { width:calc(100% - 100px);} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con { width:calc(100% - 90px); margin-left:-5px; margin-left:auto; height:40px; /*overflow-y:hidden;*/ padding:0px 5px 0px 0px; vertical-align:top; position:relative; text-align:right;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con a.dec-btn { background:#ebebeb; margin:3px 0px; padding:8px 10px; border-radius:25px; color:#999999; height:33.5px; display:inline-block; overflow:hidden;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con a.dec-btn-download, .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con a.dec-btn-download:hover { margin-right:auto; margin-left:3px; padding:8px 10px; height:33.5px; overflow:hidden; display:inline-block;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} /*start - .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea*/ .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn { background:#ebebeb; margin:0px; padding:6px 10px; border-radius:25px; color:#999999; height:33.5px; display:inline-block; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn-download, .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn-download:hover { margin-right:auto; margin-left:3px; padding:6px 10px; height:33.5px; display:inline-block; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .dec-box-inner { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn.dec-mL { margin-left:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn.dec-mL-auto { margin-left:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn.dec-mR-auto { margin-right:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn.dec-mR { margin-right:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn.dec-mR01 { margin-right:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn.dec-w01 { width:85px; margin-right:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn.dec-w02 { width:70px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.dec-btn.dec-w03 { width:95px; margin-right:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-type { width:auto; margin:0px 0px 0px 10px; margin-right: auto; padding:0px; color:#999999;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-type a, .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-type a:hover { background:transparent; margin:0px; padding:8px 10px 8px 0px; height:33.5px; overflow:hidden; text-decoration:underline !important;} /*end - .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea*/ .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-Mission { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-TrackHistory { width:calc(100% - 110px); margin:0px 0px 0px 10px; padding:0px;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-CarMission { width:calc(100% - 200px); margin:0px 0px 0px 10px; padding:0px;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-ParkingLot { width:calc(100% - 200px); margin:0px 0px 0px 0px; padding:0px;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-ChargingPile { width:calc(100% - 0px); margin:0px 0px 0px 0px; padding:0px;} /*start - .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { margin:0px; padding:0px; height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px 5px 0px 0px; height: 40px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01 { width:100px;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto { margin-right:auto; text-align:left;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto .form-check.dec-form-check .form-check-input { margin-top:0.2rem;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto a.dec-btn { padding:8px 10px; height:33.5px; display:inline-block; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto { margin-left:auto; text-align:right;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-selectionArea { width:200px; width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-selectionArea .dec-inner-Box { width:calc(100% - 0px); margin:5px 0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select, .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover { margin:0px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-type { color:#595959;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-btn { color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; display:inline-block; overflow:hidden;} /*end - .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { margin:0px; padding:0px; height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px 5px 0px 0px; height: 40px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01 { width:100px;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-mLAuto a.dec-btn { padding:8px 10px; height:33.5px; display:inline-block; overflow:hidden;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-mLAuto { margin-left:auto; text-align:right;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03.dec-mLAuto { margin-left:auto;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; display:inline-block; overflow:hidden;} /*end - .MapTool-FunctionBox.dec-ChargingPile .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ChargingPile-POISample ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ChargingPile-POISample { top:150px; left:25px; width:calc(50% - 0px); height:auto; right:auto; left:15px; top:95px; margin:0px; padding:0px; position:absolute; background:transparent; overflow:hidden; border:0px; box-shadow:0px 2px 4px rgb(0 0 0 / 0%);} .MapTool-FunctionBox.dec-ChargingPile-POISample .box-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:transparent; position:relative; border-radius:0px;} .MapTool-FunctionBox.dec-ChargingPile-POISample .box-inner .dec-list { width:calc(100% - 0px); margin:5px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-ChargingPile-POISample .box-inner .dec-list .icon-sprite { margin-left:5px;} .MapTool-FunctionBox.dec-ChargingPile-POISample .box-inner .dec-list .div-break { width:calc(100% - 0px); height:5px; margin:0px; padding:0px; background:transparent; display:block;} .MapTool-FunctionBox.dec-ChargingPile-POISample .box-inner .dec-type, .MapTool-FunctionBox.dec-ChargingPile-POISample .box-inner .dec-type-selected { width:auto; font-size:14px; border-radius:5px; margin:0px; padding:1px 5px 1px 3px; display:inline-block;} .MapTool-FunctionBox.dec-ChargingPile-POISample .box-inner .dec-type { color:#595959; background:rgba(255,255,255,0.8); border:1px solid rgba(0, 0, 0, 0.35);} .MapTool-FunctionBox.dec-ChargingPile-POISample .box-inner .dec-type-selected { color:#ed1c24; background:rgba(255,255,255,1); border:1px solid #666666;} /*end - .MapTool-FunctionBox.dec-ChargingPile-POISample-POISearch ----------------------------------------------------------------*/ /*start - .dec-ExpirationDate-Announce-ListArea -------------------------------------------------------------------*/ .dec-ExpirationDate-Announce-ListArea { width:calc(100% - 0px); margin:0px; padding:0px;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem { width:calc(100% - 0px); margin:0px; padding:5px; word-break:break-all; font-size:1rem; line-height:1.2rem; border-bottom:1px solid #ebebeb; color:#e73828; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem:hover { background:#fafafa;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem:first-child { margin:0px; border-top:1px solid #ebebeb;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem > div { margin-left:5px;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem .dec-btnArea { width:25px; height:25px; margin:0px; border-radius:5px; background:#e73828; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem .dec-btnArea:hover { background:#e73828;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem .dec-btnArea .dec-ic { color:#FFFFFF; margin:0px; padding:0px;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem .dec-btnArea:hover .dec-ic { color:#FFFFFF; margin:0px; padding:0px;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem .dec-name { width:80px;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem .dec-num { width:50px;} .dec-ExpirationDate-Announce-ListArea .dec-ExpirationDate-Announce-ListItem .dec-con { width:calc(100% - 180px); color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} /*end - .dec-ExpirationDate-Announce-ListArea -------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Car-secom-BottomResizable, .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Car-CTC-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; /*display: -ms-inline-flexbox !important; display: inline-flex !important;*/ -ms-flex-direction: column !important; flex-direction: column !important;} /*start - .div-MapTool-BottomSideMode-inner --------------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Car-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; /*display: -ms-inline-flexbox !important; display: inline-flex !important;*/ -ms-flex-direction: column !important; flex-direction: column !important;} /*start - .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .dec-box-con { width:calc(100% - 0px); height:45px; margin:0px; padding:0px; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-mLAuto { margin-left:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01 { width:100px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01 .dec-subTitle { font-size:1.1rem; line-height:1.5rem; font-weight:500; padding-left:10px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01 .dec-subTitle .dec-sample-note { font-size:12px; line-height:14px; margin:0px; padding:0px; font-weight:400;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-02 { width:200px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-02 .dec-subTitle { font-size:1.1rem; line-height:1.5rem; font-weight:500; padding-left:10px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto { margin-right:auto; text-align:left;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto .form-check.dec-form-check .form-check-input { margin-top:0.2rem;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto a.dec-btn { display:inline-block; height:33.5px; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto a.dec-btn { background:#ebebeb; margin:0px; padding:6px 10px; border-radius:25px; color:#999999;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto { margin-left:auto; text-align:right;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-selectionArea { width:200px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-selectionArea .dec-inner-Box { width:calc(100% - 0px); margin:0px; padding:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.box-inner-select { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.box-inner-select, .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover { margin:0px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-type { color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-btn { color:#169cbf;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03.dec-mLAuto { margin-left:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 .dec-type { text-align:right; color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-date { width:130px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-break { width:10px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-time { width:70px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .con-btnbox.dec-w01 { width:150px !important; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .con-btnbox.dec-margin { margin-right:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-type { width:auto; margin:0px 0px 0px 10px; margin-right: auto; padding:0px; color:#999999;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-type a, .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-type a:hover { background:transparent; margin:0px; padding:8px 10px 8px 0px; height:33.5px; overflow:hidden; text-decoration:underline !important;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-05 { width:85px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-05.dec-mLAuto { margin-left:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-05 .dec-type { text-align:right; color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 { width:180px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07.dec-mLAuto { margin-left:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox { width:calc(100% - 0px); margin:0px; padding:0px 5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox div.form-check { display:inline-block; margin:5px 5px 5px 0px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox div.form-check .form-check-input { margin-top:0.15rem;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; margin-top:0px; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .con-btnbox.dec-w01 { width:150px !important; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea div.dec-mRAuto { margin-right:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 .dec-num { color:#f7931e; font-weight: bold; margin-left:2px;} .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner .box-conArea .box-inner-width-checkBox { width:auto; margin-left:15px;} /*end - .div-MapTool-BottomSideMode-inner .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .div-MapTool-BottomSideMode-inner .con-main --------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main { width:calc(100% - 0px); height:calc(100% - 46px); margin:0px; padding:0px; border-top:1px solid #e1e1e1;} .div-MapTool-BottomSideMode-inner .con-main .box-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} /*start - .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea 車輛現況 -----------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea { width:89px; width:95px; height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner .con-main .box-tableArea { width:calc(100% - 94px); width:calc(100% - 100px); height:calc(100% - 0px); margin:0px; padding:0px; background:rgba(255,255,255,0.5); overflow-x:hidden; overflow-y:auto;} .div-MapTool-BottomSideMode-inner .con-main .box-tableArea.dec-overflow-01 { overflow:hidden;} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav:hover { width:calc(100% - 0px); height:calc((100%/7) - 0px); margin:0px; padding:5px; text-decoration:none; border-top:1px solid #dee2e6; border-left:0px; border-right:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav:first-child, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav:hover:first-child { margin:0px; border-top:0px;} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav:last-child, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav:hover:last-child { margin:0px; border-bottom:1px solid #dee2e6;} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav { color:#999999; background:transparent;} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav:hover { color:#FFFFFF; background:#e6e6e6; border-top:1px solid #CCCCCC;} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover { color:#FFFFFF; background:#2ca6e0; border-top:1px solid #999999; border-bottom:1px solid #999999;} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav .dec-type { margin-left:5px; color:#5dc1cf;} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav:hover .dec-type { color:#FFFFFF;} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.is-active .dec-type, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.is-active:hover .dec-type { color:#FFFFFF;} .div-MapTool-BottomSideMode-inner .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner .con-main .box-tableArea.dec-overflow-01 {} /*start - 兩側模式 BottomSideMode｜｜車輛現況 border-right ---------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Monitor-Car-selectionArea.dec-all { border-right:5px solid #2ca6e0;} /*車輛現況｜all*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Monitor-Car-selectionArea.dec-driving { border-right:5px solid #0089ff;} /*blue｜車輛現況｜行駛*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Monitor-Car-selectionArea.dec-speeding { border-right:5px solid #ff0000;} /*red｜車輛現況｜超速*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Monitor-Car-selectionArea.dec-idling { border-right:5px solid #f7931e;} /*orange｜車輛現況｜停留*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Monitor-Car-selectionArea.dec-parked { border-right:5px solid #e8528d;} /*darkPink｜車輛現況｜怠速*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Monitor-Car-selectionArea.dec-flameout { border-right:5px solid #787878;} /*darkGray｜車輛現況｜熄火*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Monitor-Car-selectionArea.dec-outage { border-right:5px solid #b3b3b3;} /*gray｜車輛現況｜斷訊*/ /*end - 兩側模式 BottomSideMode｜車輛現況 border-right ---------------------------------------------------------------------------------------------------------------------------------*/ /*start - 兩側模式 BottomSideMode｜軌跡查詢 border-right ---------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-TrackHistory-selectionArea.dec-all { border-right:5px solid #2ca6e0;} /*軌跡查詢｜all*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-TrackHistory-selectionArea.dec-driving { border-right:5px solid #0089ff;} /*blue｜軌跡查詢｜行駛*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-TrackHistory-selectionArea.dec-speeding { border-right:5px solid #ff0000;} /*red｜軌跡查詢｜超速*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-TrackHistory-selectionArea.dec-idling { border-right:5px solid #f7931e;} /*orange｜軌跡查詢｜停留*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-TrackHistory-selectionArea.dec-parked { border-right:5px solid #e8528d;} /*darkPink｜軌跡查詢｜怠速*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-TrackHistory-selectionArea.dec-flameout { border-right:5px solid #787878;} /*darkGray｜軌跡查詢｜熄火*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-TrackHistory-selectionArea.dec-outage { border-right:5px solid #b3b3b3;} /*gray｜軌跡查詢｜斷訊*/ /*end - 兩側模式 BottomSideMode｜軌跡查詢 border-right ---------------------------------------------------------------------------------------------------------------------------------*/ /*start - 兩側模式 BottomSideMode｜任務派遣｜範圍搜尋 border-right ---------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav01, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav02, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav03 { border-right:5px solid #2ca6e0;} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav01.dec-all, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav02.dec-all, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav03.dec-all { border-right:5px solid #2ca6e0;} /*blue｜任務派遣｜範圍搜尋｜all*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav01.dec-notYetStarted, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav02.dec-notYetStarted, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav03.dec-notYetStarted { border-right:5px solid #b3b3b3;} /*gray｜任務派遣｜範圍搜尋｜未開始*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav01.dec-onTheGo, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav02.dec-onTheGo, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav03.dec-onTheGo { border-right:5px solid #0089ff;} /*blue｜任務派遣｜範圍搜尋｜進行中*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav01.dec-delivered, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav02.dec-delivered, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav03.dec-delivered { border-right:5px solid #39b54a;} /*green｜任務派遣｜範圍搜尋｜已配達*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav01.dec-cancel, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav02.dec-cancel, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav03.dec-cancel { border-right:5px solid #787878;} /*darkGray｜任務派遣｜範圍搜尋｜已取消*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav01.dec-abnormal, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav02.dec-abnormal, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav03.dec-abnormal { border-right:5px solid #f15a24;} /*red｜任務派遣｜範圍搜尋｜異常*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav01 a.btn-subNav, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav01 a.btn-subNav:hover { height:calc((100%/6) - 0px);} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav02 a.btn-subNav, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav02 a.btn-subNav:hover { height:calc((100%/4) - 0px);} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav03 a.btn-subNav, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-Mission-selectionArea-Nav03 a.btn-subNav:hover { height:calc((100%/6) - 0px);} /*end - 兩側模式 BottomSideMode｜任務派遣｜範圍搜尋 border-right ---------------------------------------------------------------------------------------------------------------------------------*/ /*start - 兩側模式 BottomSideMode｜停車場 border-right ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ParkingLot-selectionArea.dec-all { border-right:5px solid #2ca6e0;} /*停車場｜all*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ParkingLot-selectionArea.dec-parking-01 { border-right:5px solid #29abe2;} /*blue｜停車場｜停車場01*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ParkingLot-selectionArea.dec-parking-02 { border-right:5px solid #50a8b4;} /*red｜停車場｜停車場02*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ParkingLot-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ParkingLot-selectionArea a.btn-subNav:hover { height:calc((100%/5) - 0px);} /*end - 兩側模式 BottomSideMode｜停車場 border-right ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*start - 兩側模式 BottomSideMode｜車輛現況 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-all:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active:hover { background:#2ca6e0;} /*blue｜車輛現況｜all*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-driving:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-driving.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-driving.is-active:hover { background:#0089ff;} /*blue｜車輛現況｜行駛*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-speeding:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-speeding.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-speeding.is-active:hover { background:#ff0000;} /*red｜車輛現況｜超速*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-idling:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-idling.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-idling.is-active:hover { background:#f7931e;} /*orange｜車輛現況｜停留*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-parked:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-parked.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-parked.is-active:hover { background:#e8528d;} /*darkPink｜車輛現況｜怠速*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-flameout:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-flameout.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-flameout.is-active:hover { background:#787878;} /*darkGray｜車輛現況｜熄火*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-outage:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-outage.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-outage.is-active:hover { background:#b3b3b3;} /*gray｜車輛現況｜斷訊*/ /*end - 兩側模式 BottomSideMode｜車輛現況 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*start - 兩側模式 BottomSideMode｜任務派遣｜範圍搜尋 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-all:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active:hover { background:#2ca6e0;} /*gray｜任務派遣｜範圍搜尋｜all*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-notYetStarted:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-notYetStarted.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-notYetStarted.is-active:hover { background:#b3b3b3;} /*gray｜任務派遣｜範圍搜尋｜未開始*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-onTheGo:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-onTheGo.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-onTheGo.is-active:hover { background:#0089ff;} /*gray｜任務派遣｜範圍搜尋｜進行中*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-delivered:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-delivered.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-delivered.is-active:hover { background:#39b54a;} /*gray｜任務派遣｜範圍搜尋｜已配達*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-cancel:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-cancel.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-cancel.is-active:hover { background:#787878;} /*gray｜任務派遣｜範圍搜尋｜已取消*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-abnormal:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-abnormal.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-abnormal.is-active:hover { background:#f15a24;} /*gray｜任務派遣｜範圍搜尋｜異常*/ /*end - 兩側模式 BottomSideMode｜任務派遣｜範圍搜尋 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*start - 兩側模式 BottomSideMode｜停車場 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-all:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-all.is-active:hover { background:#2ca6e0;} /*blue｜停車場｜all*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-01:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-01.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-01.is-active:hover { background:#29abe2;} /*blue｜停車場｜停車場01*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-02:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-02.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-parking-02.is-active:hover { background:#50a8b4;} /*red｜停車場｜停車場02*/ /*end - 兩側模式 BottomSideMode｜停車場 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*start 奇美任務 ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*start - 兩側模式 BottomSideMode｜奇美任務 border-right ---------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav01.dec-ChiMeiMissionCondition-A { border-right:5px solid #b3b3b3;} /*gray｜奇美任務｜未執行*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav01.dec-ChiMeiMissionCondition-B { border-right:5px solid #50a8b4;} /*teal｜奇美任務｜已掛號*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav01.dec-ChiMeiMissionCondition-C { border-right:5px solid #0089ff;} /*blue｜奇美任務｜入廠中*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav01.dec-ChiMeiMissionCondition-D { border-right:5px solid #f7931e;} /*orange｜奇美任務｜出廠中*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav01.dec-ChiMeiMissionCondition-E { border-right:5px solid #39b54a;} /*green｜奇美任務｜已執行*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav01.dec-ChiMeiMissionCondition-F { border-right:5px solid #787878;} /*darkGray｜奇美任務｜已取消*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav02.dec-ChiMeiMissionCondition-A { border-right:5px solid #b3b3b3;} /*gray｜奇美任務｜未執行*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav02.dec-ChiMeiMissionCondition-B { border-right:5px solid #50a8b4;} /*teal｜奇美任務｜已掛號*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav02.dec-ChiMeiMissionCondition-C { border-right:5px solid #0089ff;} /*blue｜奇美任務｜入廠中*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav02.dec-ChiMeiMissionCondition-D { border-right:5px solid #f7931e;} /*orange｜奇美任務｜出廠中*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav02.dec-ChiMeiMissionCondition-E { border-right:5px solid #39b54a;} /*green｜奇美任務｜已執行*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-ChiMeiMission-BottomSideMode-selectionArea-Nav02.dec-ChiMeiMissionCondition-F { border-right:5px solid #787878;} /*darkGray｜奇美任務｜已取消*/ /*end - 兩側模式 BottomSideMode｜奇美任務 border-right ---------------------------------------------------------------------------------------------------------------------------------*/ /*start - 兩側模式 BottomSideMode｜奇美任務 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-A:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-A.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-A.is-active:hover { background:#b3b3b3;} /*gray｜奇美任務｜未執行*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-B:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-B.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-B.is-active:hover { background:#50a8b4;} /*teal｜奇美任務｜已掛號*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-C:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-C.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-C.is-active:hover { background:#0089ff;} /*blue｜奇美任務｜入廠中*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-D:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-D.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-D.is-active:hover { background:#f7931e;} /*orange｜奇美任務｜出廠中*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-E:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-E.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-E.is-active:hover { background:#39b54a;} /*green｜奇美任務｜已執行*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-F:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-F.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChiMeiMissionCondition-F.is-active:hover { background:#787878;} /*darkGray｜奇美任務｜已取消*/ /*end - 兩側模式 BottomSideMode｜奇美任務 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*end 奇美任務 ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*end - .MapTool-FunctionBox.dec-Monitor-Car .box-inner .con-main --------------------------------------------------------------------------------------*/ /*start - 兩側模式 BottomSideMode｜充電樁 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ChargingPileCondition-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ChargingPileCondition-selectionArea a.btn-subNav:hover { height:calc((100%/5) - 0px);} .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ChargingPileCondition-selectionArea.dec-ChargingPileCondition-all { border-right:5px solid #2ca6e0;} /*充電樁｜all*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ChargingPileCondition-selectionArea.dec-ChargingPileCondition-charging { border-right:5px solid #0089ff;} /*blue｜充電樁｜充電中*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ChargingPileCondition-selectionArea.dec-ChargingPileCondition-notInUse { border-right:5px solid #787878;} /*darkGray｜充電樁｜未使用*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ChargingPileCondition-selectionArea.dec-ChargingPileCondition-breakdown { border-right:5px solid #ED1C24;} /*red｜充電樁｜故障*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea.div-MapTool-BottomSideMode-ChargingPileCondition-selectionArea.dec-ChargingPileCondition-outage { border-right:5px solid #b3b3b3;} /*gray｜充電樁｜未連線*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-all:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-all.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-all.is-active:hover { background:#2ca6e0;} /*blue｜充電樁｜all*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-charging:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-charging.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-charging.is-active:hover { background:#0089ff;} /*blue｜充電樁｜充電中*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-notInUse:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-notInUse.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-notInUse.is-active:hover { background:#787878;} /*darkGray｜充電樁｜未使用*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-breakdown:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-breakdown.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-breakdown.is-active:hover { background:#ED1C24;} /*red｜充電樁｜故障*/ .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-outage:hover, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-outage.is-active, .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea a.btn-subNav.dec-ChargingPileCondition-outage.is-active:hover { background:#b3b3b3;} /*gray｜充電樁｜未連線*/ /*end - 兩側模式 BottomSideMode｜充電樁 background ----------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*end - .div-MapTool-BottomSideMode-inner .con-main .box-selectionArea -----------------------------------------------------------*/ /*end - .div-MapTool-BottomSideMode-inner .con-main --------------------------------------------------------------------------------------*/ /*start - BottomResizable --------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Company-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Company-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Company-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Company-BottomResizable .con-main .box-tableArea { width:calc(100% - 89px); width:calc(100% - 100px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Company-BottomResizable .con-main .box-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Company-BottomResizable .con-main .box-selectionArea a.btn-subNav:hover { height:calc((100%/4) - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Company-BottomResizable .con-main .box-selectionArea {} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Company-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Outsider-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Outsider-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Outsider-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Outsider-BottomResizable .con-main .box-tableArea { width:calc(100% - 89px); width:calc(100% - 100px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Outsider-BottomResizable .con-main .box-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Outsider-BottomResizable .con-main .box-selectionArea a.btn-subNav:hover { height:calc((100%/4) - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Outsider-BottomResizable .con-main .box-selectionArea {} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-ParkingLot-Outsider-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-CarMission-CarMission-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-CarMission-CarMission-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-CarMission-CarMission-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-CarMission-CarMission-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-CarMission-CarMission-BottomResizable .con-main .box-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner.div-MapTool-CarMission-CarMission-BottomResizable .con-main .box-selectionArea a.btn-subNav:hover { height:calc((100%/6) - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-CarMission-CarMission-BottomResizable .dec-box-con .dec-box-inner .box-conArea a.dec-btn:hover { color:#169cbf; background:#ebebeb;} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-CarMission-CarMission-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-ZoneSearching-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-ZoneSearching-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-ZoneSearching-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-ZoneSearching-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader th:nth-child(2), .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-ZoneSearching-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader td:nth-child(2) { border-left:0px;} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-ZoneSearching-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px); width:calc(100% - 100px);} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-ZoneSearching-BottomResizable .con-main .box-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-ZoneSearching-BottomResizable .con-main .box-selectionArea a.btn-subNav:hover { height:calc((100%/6) - 0px);} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-ZoneSearching-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-History-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-History-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-History-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-History-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader th:nth-child(2), .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-History-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader td:nth-child(2) { border-left:0px;} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-History-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px); width:calc(100% - 100px);} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-History-BottomResizable .con-main .box-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-History-BottomResizable .con-main .box-selectionArea a.btn-subNav:hover { height:calc((100%/4) - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-History-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-date { margin-right:5px;} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-History-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-New-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-New-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-New-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-New-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader th:nth-child(2), .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-New-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader td:nth-child(2) { border-left:0px;} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-New-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px); width:calc(100% - 100px);} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-New-BottomResizable .con-main .box-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-New-BottomResizable .con-main .box-selectionArea a.btn-subNav:hover { height:calc((100%/6) - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-New-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-date { margin-right:5px;} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-Mission-New-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Device-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Device-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Device-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 40px);} .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Device-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px);} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Device-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Sign-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Sign-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Sign-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 40px);} .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Sign-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px);} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-MonitorCar-Sign-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-POISearch-Result-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-POISearch-Result-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-POISearch-Result-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 40px);} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-POISearch-Result-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px);} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-POISearch-Result-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 40px);} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px);} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader th:nth-child(2), .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader td:nth-child(2) { border-left:0px;} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px); height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable .con-main .box-tableArea .box-tableArea-innerBox { width:calc(100% - 0px); height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable .con-main .box-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable .con-main .box-selectionArea a.btn-subNav:hover { height:calc((100%/4) - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-date { margin-right:5px;} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-History-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader th:nth-child(2), .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader td:nth-child(2) { border-left:0px;} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px); height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable .con-main .box-tableArea .box-tableArea-innerBox { width:calc(100% - 0px); height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable .con-main .box-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable .con-main .box-selectionArea a.btn-subNav:hover { height:calc((100%/4) - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-date { margin-right:5px;} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-ChiMeiMission-New-BottomResizable*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable*/ .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px !important; overflow:hidden; -ms-flex-direction: column !important; flex-direction: column !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader th:nth-child(2), .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable .con-main .table-responsive.dec-table.dec-fixedTableHeader td:nth-child(2) { border-left:0px;} .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable .con-main .box-tableArea { width:calc(100% - 0px); height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable .con-main .box-tableArea .box-tableArea-innerBox { width:calc(100% - 0px); height:calc(100% - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable .con-main .box-selectionArea a.btn-subNav, .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable .con-main .box-selectionArea a.btn-subNav:hover { height:calc((100%/4) - 0px);} .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-date { margin-right:5px;} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-ChargingPile-BottomResizable*/ /*end - BottomResizable --------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*start - .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory --------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-01 { width:100px; max-width:250px; margin-left:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-btnArea { width:292px; min-width:292px; width:322px; min-width:322px; padding:3px 0px; height:40px; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-countArea { width:calc(100% - 0px); height:33.5px; overflow:hidden; margin:0px; padding:7px 5px; border:1px solid #e1e1e1; color:#29aecc; background:rgba(255,255,255,0.5); border-radius:0.25rem;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-countArea:hover { background:rgba(255,255,255,1);} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-countArea.dec-onDuty::before { content:"啟動時數"; margin:0px 5px 0px 0px; padding:5px 0px; color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-countArea.dec-offDuty::before { content:"熄火時數"; margin:0px 5px 0px 0px; padding:5px 0px; color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-02 { width:120px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-02-title { width:60px; margin-left:5px; text-align:right;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-02-time { width:80px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-02-note { width:120px; margin-left:5px; font-size:12px; color:#999999;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-02.dec-mLAuto { margin-left: auto;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-03 { width:120px; margin:0px; padding:0px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-03.dec-mLAuto { margin-left: auto;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-03-date { width:130px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-03-date.dec-mLAuto { margin-left:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-03-time { width:70px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-05-time { width:70px; margin-left:15px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-05.dec-margin { width:70px; margin-left:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-05.dec-margin a.dec-btn { margin-left:auto; padding:5px 10px; height:33.5px; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .box-inner-width-break { width:10px; margin-left:5px;} /*start - .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox*/ .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox { width:60px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox.dec-margin { margin-right:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33px; width:60px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox a.dec-btn-01 { border-radius:5px; border:1px solid #ced4da; height:33px; width:120px; margin-top:0px;} /*end - .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox*/ /*start - .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox-01*/ .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox-01 { width:32px; height:32px; overflow:hidden; padding:0px; margin-left:5px; background:transparent; text-align:center;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox-01.dec-margin { margin-right:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn { border-radius:25px; border:1px solid #ced4da; height:32px; width:32px; margin:0px; padding:0px; background:#ebebeb; display:block; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn:hover { background:#ebebeb;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn .dec-ic-01 { margin:7px; padding:0px; color:#999999;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn:hover .dec-ic-01 { margin:7px; padding:0px; color:#169cbf;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn .dec-ic-02 { margin:8px 2px; padding:0px; color:#999999;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn:hover .dec-ic-02 { margin:8px 2px; padding:0px; color:#169cbf;} /*end - .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory .dec-box-inner .box-conArea .con-btnbox-01*/ /*end - .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-TrackHistory --------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea { width:calc(100% - 0px); height:40px; margin:0px; padding:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .dec-mRAuto { margin-right:auto; text-align:left; height:40px; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .dec-mRAuto .con-innerBox { width:auto; margin:0px; padding:0px; overflow:hidden; height:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .dec-mRAuto .con-innerBox .switch-box-area { width:auto; margin:0px; padding:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .dec-mRAuto .dec-type { margin:0px; padding:0px 5px; display: inline-block;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01 { width:100px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto { margin-right:auto; text-align:left;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto .form-check.dec-form-check .form-check-input { margin-top:0.2rem;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto a.dec-btn { padding:8px 10px; height:33.5px; display:inline-block; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto { margin-left:auto; text-align:right;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-01.dec-width-02.dec-mLAuto { margin-left:auto; text-align:right; width:68px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-selectionArea { width:150px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-selectionArea .dec-inner-Box { width:calc(100% - 0px); margin:5px 0px; padding:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea a.box-inner-select { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea a.box-inner-select, .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea a.box-inner-select:hover { margin:0px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius: 0.25rem; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-type { color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-btn { color:#169cbf;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-03 .dec-type { text-align:right; color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-03-date { width:130px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-break { width:10px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-03-time { width:70px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-05 { width:85px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-05 .dec-type { text-align:right; color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .con-btnbox.dec-w01 { width:150px !important; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .con-btnbox.dec-margin { margin-right:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; display:inline-block; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-type { width:auto; margin:0px 0px 0px 10px; margin-right: auto; padding:0px; color:#999999;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-type a, .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-type a:hover { background:transparent; margin:0px; padding:8px 10px 8px 0px; height:33.5px; overflow:hidden; text-decoration:underline !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-07 { width:180px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox { width:calc(100% - 0px); margin:0px; padding:0px 5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox div.form-check { display:inline-block; margin:5px 5px 5px 0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChiMeiMission .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox div.form-check .form-check-input { margin-top:0.15rem;} /*end - .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ChargingPileInfo .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea { width:calc(100% - 0px); height:40px; margin:0px; padding:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .dec-mRAuto { margin-right:auto; text-align:left; height:40px; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .dec-mRAuto .con-innerBox { width:auto; margin:0px; padding:0px; overflow:hidden; height:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .dec-mRAuto .con-innerBox .switch-box-area { width:auto; margin:0px; padding:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .dec-mRAuto .dec-type { margin:0px; padding:0px 5px; display: inline-block;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01 { width:100px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto { margin-right:auto; text-align:left;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto .form-check.dec-form-check .form-check-input { margin-top:0.2rem;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto a.dec-btn { padding:8px 10px; height:33.5px; display:inline-block; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto { margin-left:auto; text-align:right;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-01.dec-width-02.dec-mLAuto { margin-left:auto; text-align:right; width:68px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-selectionArea { width:150px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-selectionArea .dec-inner-Box { width:calc(100% - 0px); margin:5px 0px; padding:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea a.box-inner-select { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea a.box-inner-select, .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea a.box-inner-select:hover { margin:0px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius: 0.25rem; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-type { color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-btn { color:#169cbf;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-03 .dec-type { text-align:right; color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-03-date { width:130px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-break { width:10px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-03-time { width:70px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-05 { width:85px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-05 .dec-type { text-align:right; color:#595959;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .con-btnbox.dec-w01 { width:150px !important; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .con-btnbox.dec-margin { margin-right:auto;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; display:inline-block; overflow:hidden;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-type { width:auto; margin:0px 0px 0px 10px; margin-right: auto; padding:0px; color:#999999;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-type a, .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-type a:hover { background:transparent; margin:0px; padding:8px 10px 8px 0px; height:33.5px; overflow:hidden; text-decoration:underline !important;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-07 { width:180px; margin-left:5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox { width:calc(100% - 0px); margin:0px; padding:0px 5px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox div.form-check { display:inline-block; margin:5px 5px 5px 0px;} .div-MapTool-BottomSideMode-inner .dec-box-con.dec-MapTool-ChargingPileInfo .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox div.form-check .form-check-input { margin-top:0.15rem;} /*end - .MapTool-FunctionBox.dec-ChargingPileInfo .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*end - .div-MapTool-BottomSideMode-inner --------------------------------------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { margin:0px; padding:0px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01 { width:100px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto { margin-right:auto; text-align:left;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto .form-check.dec-form-check .form-check-input { margin-top:0.2rem;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto a.dec-btn { padding:8px 10px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto { margin-left:auto; text-align:right;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-selectionArea { width:200px; margin-left:5px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-selectionArea .dec-inner-Box { width:calc(100% - 0px); margin:5px 0px; padding:0px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover { margin:0px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; text-align:left; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-type { color:#595959;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-btn { color:#169cbf;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33px;} /*end - .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .box-conArea.dec-selecter-RightSideMode -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode {} .box-conArea.dec-selecter-RightSideMode { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px 0px 5px 0px; border-bottom:1px solid #CCCCCC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-a01 { width:80px; margin-left:0px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-a02 { width:calc(50% - 45px); margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-a03 { width:calc(50% - 45px); margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-a01.dec-demo { width:calc(30% - 5px); margin-left:0px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-a02.dec-demo { width:calc(40% - 0px); margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-a03.dec-demo { width:calc(30% - 5px); margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-b01.dec-demo { width:calc(100% - 65px); margin-left:0px; margin-top:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-b02.dec-demo { width:60px; margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-b01 { width:80px; margin-left:0px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-b02 { width:calc(100% - 150px); margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-b03 { width:60px; margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-b03 a { margin-top:0px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-c01 { width:calc(50% - 0px); margin-left:0px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-c02 { width:calc(50% - 5px); margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-d01 { width:60px; margin-left:0px; margin-top: 5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-d02 { width:calc(50% - 65px); margin-left:5px; margin-top:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-d03 { width:calc(50% - 70px); margin-left:5px; margin-top:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-d04 { width:60px; margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-e01 { width:calc(30% - 6px); margin-left:0px; margin-top:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-e02 { width:calc(20% - 6px); margin-left:5px; margin-top:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-e03 { width:14px; padding:0px 2px; margin-left:0px; text-align:center; margin-top:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-e04 { width:calc(30% - 6px); margin-left:0px; margin-top:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-e05 { width:calc(20% - 6px); margin-left:5px; margin-top:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-f01 { width:90px; margin-left:0px; margin-top:5px; text-align:right;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-f02 { width:calc(100% - 160px); margin-left:5px; margin-top:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-f03 { width:60px; margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-selectionArea {} .box-conArea.dec-selecter-RightSideMode .box-inner-width-selectionArea .dec-inner-Box { width:calc(100% - 0px); margin:5px 0px; padding:0px;} .box-conArea.dec-selecter-RightSideMode a.box-inner-select { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .box-conArea.dec-selecter-RightSideMode a.box-inner-select, .box-conArea.dec-selecter-RightSideMode a.box-inner-select:hover { margin:0px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden;} .box-conArea.dec-selecter-RightSideMode a.box-inner-select .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .box-conArea.dec-selecter-RightSideMode a.box-inner-select .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .box-conArea.dec-selecter-RightSideMode a.box-inner-select:hover .dec-innerArea .dec-type { color:#595959;} .box-conArea.dec-selecter-RightSideMode a.box-inner-select .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .box-conArea.dec-selecter-RightSideMode a.box-inner-select:hover .dec-innerArea .dec-btn { color:#169cbf;} .box-conArea.dec-selecter-RightSideMode a.box-inner-select .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} .box-conArea.dec-selecter-RightSideMode .box-inner-width-03 { width:150px; margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .box-conArea.dec-selecter-RightSideMode .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33px;} /*end - .box-conArea.dec-selecter-RightSideMode -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-TrackHistory-RightSideMode -----------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-conArea.dec-selecter-RightSideMode-02 { width:calc(100% - 0px); margin:0px; padding:0px; border-bottom:0px solid #CCCCCC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-conArea.dec-selecter-RightSideMode-02 .box-conArea { width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-conArea.dec-selecter-RightSideMode-02 .box-conArea a.dec-btn { background:#ebebeb; margin:0px; padding:7px 10px; border-radius:25px; color:#999999; height:33.5px; overflow:hidden; display:inline-block;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-conArea.dec-selecter-RightSideMode-02 .box-conArea a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .dec-box-inner-result.dec-FunctionArea-TrackHistory-RightSideMode-Nav01A { height:calc(100% - 125px);} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .dec-box-inner-result.dec-FunctionArea-TrackHistory-RightSideMode-Nav02A { height:calc(100% - 165px);} /*end - .MapTool-FunctionBox.dec-TrackHistory-RightSideMode -----------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main { height:calc(100% - 50px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main .dec-box-con { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main .dec-box-con .dec-box-inner { height:calc(100% - 0px); overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result { height:calc(100% - 130px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .table-responsive.dec-table.dec-h-01 { height:calc(100% - 40px);} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; height:33.5px; overflow:hidden; position:relative; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea .box-inner-width-01.dec-width-01 { margin:0px; padding:0px; height:33.5px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto { padding-top:7px; padding-left:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea a.dec-btn { background:#ebebeb; margin:0px; padding:7px 10px; border-radius:25px; color:#999999; height:33.5px; overflow:hidden; display:inline-block;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea a.dec-btn:hover { color:#169cbf; background:#ebebeb;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode .box-inner .con-main*/ a.box-inner-select { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} a.box-inner-select, a.box-inner-select:hover { margin:0px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden;} a.box-inner-select .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} a.box-inner-select .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-whole a.box-inner-select .dec-innerArea .dec-type { margin:0px;} a.box-inner-select:hover .dec-innerArea .dec-type { color:#595959;} a.box-inner-select .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left: 1px solid #e6e6e6; background:#fafafa; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} a.box-inner-select:hover .dec-innerArea .dec-btn { color: #169cbf;} a.box-inner-select .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} /*start - .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { margin:0px; padding:5px 0px; height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 .dec-num { color:#f7931e; font-weight:bold; margin-right:2px;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-checkBox { width:auto; margin-left:15px;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33px;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto { margin-left:auto; text-align:right; height:33.5px;} .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-mLAuto { margin-left:auto; text-align:right;} /*end - .MapTool-FunctionBox.dec-AreaSearch-POISearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { margin:0px; padding:0px; height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-04 { width:250px; margin-left:5px;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-checkBox { width:auto; margin-left:15px;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33px;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto { margin-left:auto; text-align:right;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-mLAuto { margin-left:auto; text-align:right;} .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02.dec-mLAuto { margin-left:auto; text-align:right;} /*end - .MapTool-FunctionBox.dec-AreaSearch-AddressSearch-Result .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner { margin:0px; padding:5px 0px;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 .dec-subTitle { font-size:1.1rem; line-height:1.5rem; font-weight:500; padding-left:10px;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02.dec-mLAuto { margin-left:auto; text-align:right;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:80px; margin-left:auto; text-align:right; height:33px;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea .box-inner-width-04 { width:250px; margin-left:5px;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn, .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn:hover { border-radius:5px;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea a.dec-btn { background:#ebebeb; margin:0px; padding:5px 10px; border-radius:25px; color:#999999; height:33px; display:inline-block; overflow: hidden;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea a.dec-btn-download, .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner .box-conArea a.dec-btn-download:hover { margin-right:auto; margin-left:3px; padding:5px 10px;} .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} /*end - .div-MapTool-BottomSideMode-inner.div-MapTool-FunctionArea-AreaSearch-AddressSearch-Result-BottomResizable .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { margin:0px; padding:0px; height:40px; overflow:hidden; position:absolute;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-checkBox { width:auto; margin-left:15px;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; display:inline-block; overflow:hidden;} /*end - .MapTool-FunctionBox.dec-CarMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { width:calc(100% - 0px); margin:0px; padding:0px; height:40px; overflow:hidden; position:relative;} .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px 5px 0px 0px; height:40px; overflow:hidden; position:absolute; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-checkBox { width:auto; margin-left:15px;} .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .dec-mLAuto { margin-left: auto;} .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; display: inline-block; overflow:hidden;} /*end - .MapTool-FunctionBox.dec-Device .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { width:calc(100% - 0px); margin:0px; padding:0px; height:40px; overflow:hidden; position:relative;} .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px 5px 0px 0px; height:40px; overflow:hidden; position:absolute; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-checkBox { width:auto; margin-left:15px;} .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .dec-mLAuto { margin-left:auto;} .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; display:inline-block; overflow:hidden;} /*end - .MapTool-FunctionBox.dec-Sign .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Video .box-inner .con-main .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Video .box-inner .con-main .dec-box-inner { width:calc(100% - 0px); max-width:1280px; margin:0px auto; padding:0px; height:40px; overflow:hidden; position:absolute;} .MapTool-FunctionBox.dec-Video .box-inner .con-main .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px; height:40px; overflow:hidden; position:absolute; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-Video .box-inner .con-main .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-Video .box-inner .con-main .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Video .box-inner .con-main .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Video .box-inner .con-main .dec-box-inner .box-conArea .con-btnbox { width:60px; margin-left:5px;} .MapTool-FunctionBox.dec-Video .box-inner .con-main .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; margin-top:0px;} /*end - .MapTool-FunctionBox.dec-Video .box-inner .con-main .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-Mission .dec-box-inner-Mission-Nav01, .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-Mission .dec-box-inner-Mission-Nav02, .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-Mission .dec-box-inner-Mission-Nav03 { width:calc(100% - 0px); margin:0px; padding:0px; height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-Mission .dec-box-inner-Mission-Nav01 { } .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-Mission .dec-box-inner-Mission-Nav02 { } .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-Mission .dec-box-inner-Mission-Nav03 { } .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-Mission .dec-box-inner-Mission-Nav01 .box-conArea, .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-Mission .dec-box-inner-Mission-Nav02 .box-conArea, .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-Mission .dec-box-inner-Mission-Nav03 .box-conArea { width:calc(100% - 0px); height:40px; margin:0px; padding:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con a.dec-btn { height:33.5px; overflow:hidden; padding:8px 10px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con a.dec-btn.dec-margin { margin-left:5px; margin-right:auto;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con a.dec-btn.dec-margin-01 { margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:100px; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-selectionArea { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-selectionArea .dec-inner-Box { width:calc(100% - 0px); margin:5px 0px; padding:0px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select, .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover { margin:0px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-type { color:#595959;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-btn { color:#169cbf;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 .dec-type { text-align:right; color:#595959;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-date { width:130px; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-break { width:10px; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-time { width:70px; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-05 { width:85px; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-05 .dec-type { text-align:right; color:#595959;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox.dec-w01 { width:150px !important; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox.dec-margin { margin-right:auto;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; display:inline-block; overflow:hidden;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-type { width:auto; margin:0px 0px 0px 10px; margin-right:auto; padding:0px; color:#999999;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-type a, .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-type a:hover { background:transparent; margin:0px; padding:8px 10px 8px 0px; height:33.5px; overflow:hidden; text-decoration:underline !important;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 { width:180px; margin-left:5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox { width:calc(100% - 0px); margin:0px; padding:0px 5px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox div.form-check { display:inline-block; margin:5px 5px 5px 0px;} .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox div.form-check .form-check-input { margin-top:0.15rem;} .div-MapTool-Mission-box-inner-Nav01-radio01, .div-MapTool-Mission-box-inner-Nav01-radio02 { width:auto; min-width:100px; margin:0px; padding:0px;} .div-MapTool-Mission-box-inner-Nav01-radio01 div, .div-MapTool-Mission-box-inner-Nav01-radio02 div { display:inline-block;} .div-MapTool-Mission-box-inner-Nav01-radio01R, .div-MapTool-Mission-box-inner-Nav01-radio02R { width:auto; min-width:100px; margin:0px; padding:0px;} .div-MapTool-Mission-box-inner-Nav01-radio01R div, .div-MapTool-Mission-box-inner-Nav01-radio02R div { display:inline-block;} /*end - .MapTool-FunctionBox.dec-Mission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { margin:0px; padding:0px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-ChiMeiMission .dec-box-inner-ChiMeiMission-Nav01, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-ChiMeiMission .dec-box-inner-ChiMeiMission-Nav02 { width:calc(100% - 0px); margin:0px; padding:0px; height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-ChiMeiMission .dec-box-inner-ChiMeiMission-Nav01 { } .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-ChiMeiMission .dec-box-inner-ChiMeiMission-Nav02 { } .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-ChiMeiMission .dec-box-inner-ChiMeiMission-Nav01 .box-conArea, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-MapTool-ChiMeiMission .dec-box-inner-ChiMeiMission-Nav02 .box-conArea { width:calc(100% - 0px); height:40px; margin:0px; padding:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con a.dec-btn { height:33.5px; overflow:hidden; padding:8px 10px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con a.dec-btn.dec-margin { margin-left:5px; margin-right:auto;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con a.dec-btn.dec-margin-01 { margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .dec-mRAuto { margin-right:auto; text-align:left; height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .dec-mRAuto .con-innerBox { width:auto; margin:0px; padding:0px; overflow:hidden; height:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .dec-mRAuto .con-innerBox .switch-box-area { width:auto; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .dec-mRAuto .dec-type { margin:0px; padding:0px 5px; display: inline-block;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01 { width:100px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto { margin-right:auto; text-align:left;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mRAuto .form-check.dec-form-check .form-check-input { margin-top:0.2rem;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto a.dec-btn { padding:8px 10px; height:33.5px; display:inline-block; overflow:hidden;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-01.dec-mLAuto { margin-left:auto; text-align:right;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01.dec-width-02.dec-mLAuto { margin-left:auto; text-align:right; width:68px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-selectionArea { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-selectionArea .dec-inner-Box { width:calc(100% - 0px); margin:5px 0px; padding:0px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover { margin:0px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-type { color:#595959;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select:hover .dec-innerArea .dec-btn { color:#169cbf;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea a.box-inner-select .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 .dec-type { text-align:right; color:#595959;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-date { width:130px; margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-break { width:10px; margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-time { width:70px; margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-05 { width:85px; margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-05 .dec-type { text-align:right; color:#595959;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; width:60px !important; margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox.dec-w01 { width:150px !important; margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox.dec-margin { margin-right:auto;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px; display:inline-block; overflow:hidden;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-type { width:auto; margin:0px 0px 0px 10px; margin-right:auto; padding:0px; color:#999999;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-type a, .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-type a:hover { background:transparent; margin:0px; padding:8px 10px 8px 0px; height:33.5px; overflow:hidden; text-decoration:underline !important;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 { width:180px; margin-left:5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox { width:calc(100% - 0px); margin:0px; padding:0px 5px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox div.form-check { display:inline-block; margin:5px 5px 5px 0px;} .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-07 .con-functionbox div.form-check .form-check-input { margin-top:0.15rem;} .div-MapTool-ChiMeiMission-box-inner-Nav01-radio01, .div-MapTool-ChiMeiMission-box-inner-Nav01-radio02 { width:auto; min-width:100px; margin:0px; padding:0px;} .div-MapTool-ChiMeiMission-box-inner-Nav01-radio01 div, .div-MapTool-ChiMeiMission-box-inner-Nav01-radio02 div { display:inline-block;} .div-MapTool-ChiMeiMission-box-inner-Nav01-radio01R, .div-MapTool-ChiMeiMission-box-inner-Nav01-radio02R { width:auto; min-width:100px; margin:0px; padding:0px;} .div-MapTool-ChiMeiMission-box-inner-Nav01-radio01R div, .div-MapTool-ChiMeiMission-box-inner-Nav01-radio02R div { display:inline-block;} /*end - .MapTool-FunctionBox.dec-ChiMeiMission .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con { width:calc(100% - 280px); position:relative;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner { margin:0px; padding:0px; width:calc(100% - 155px); height:40px; position:absolute; top:0px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .dec-box-inner-ParkingLot-Nav01, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .dec-box-inner-ParkingLot-Nav02 { width:calc(100% - 0px); margin:0px; padding:0px; height:40px; overflow:hidden;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .dec-box-inner-ParkingLot-Nav01 .box-conArea, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .dec-box-inner-ParkingLot-Nav02 .box-conArea { width:calc(100% - 0px); height:40px; overflow:hidden; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:200px; margin-left:0px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:150px; margin-left:5px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03.dec-mLAuto { width:150px; margin-left:auto;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; margin-left:5px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33.5px;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con a.dec-btn { background:#ebebeb; margin:3px 0px; padding:8px 10px; border-radius:25px; color:#999999; height:33.5px; overflow:hidden; display:inline-block;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con a.dec-btn-download, .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con a.dec-btn-download:hover { margin-right:auto; margin-left:3px; padding:8px 10px; height:33.5px; overflow:hidden; display:inline-block;} /*end - .MapTool-FunctionBox.dec-ParkingLot .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con a.dec-btn-download, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con a.dec-btn-download:hover { position:relative;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px; height:40px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01 { width:calc(100% - 600px); max-width:250px; margin-left:0px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-01b { width:calc(100% - 600px); max-width:250px; margin-left:0px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02 { width:120px; margin-left:5px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02-title { width:60px; margin-left:5px; text-align:right;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02-time { width:80px; margin-left:5px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-02-note { width:120px; margin-left:5px; font-size:12px; color:#999999;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03 { width:120px; margin:0px; padding:0px; margin-left:5px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-date { width:130px; margin-left:5px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-time { width:70px; margin-left:5px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-03-dateAndTime { width:220px; margin-left:5px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-05-time { width:70px; margin-left:15px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-05.dec-margin { width:70px; margin-left:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-05.dec-margin a.dec-btn { margin-left:auto; padding:8px 10px; display:inline-block; overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-inner-width-break { width:10px; margin-left:5px;} /*start - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox { width:60px; margin-left:5px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox.dec-margin { margin-right:auto;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn { border-radius:5px; border:1px solid #ced4da; height:33px; width:60px;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox a.dec-btn-01 { border-radius:5px; border:1px solid #ced4da; height:33px; width:120px; margin-top:0px;} /*end - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox*/ /*start - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox-01*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox-01 { width:32px; height:32px; overflow:hidden; padding:0px; margin-left:5px; background:transparent; text-align:center;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox-01.dec-margin { margin-right:auto;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn { border-radius:25px; border:1px solid #ced4da; height:32px; width:32px; margin:0px; padding:0px; background:#ebebeb; display:block; overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn:hover { background:#ebebeb;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn .dec-ic-01 { margin:7px; padding:0px; color:#999999;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn:hover .dec-ic-01 { margin:7px; padding:0px; color:#169cbf;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn .dec-ic-02 { margin:8px 2px; padding:0px; color:#999999;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox-01 a.dec-btn:hover .dec-ic-02 { margin:8px 2px; padding:0px; color:#169cbf;} /*end - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .con-btnbox-01*/ /*start - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-boxInner-TrackHistory-box-inner ----------------------------------------------------*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-boxInner-TrackHistory-box-inner { margin:0px; padding:0px; vertical-align:top; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-boxInner-TrackHistory-box-inner.dec-Nav01 { width:calc(100% - 328px); vertical-align:top; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-boxInner-TrackHistory-box-inner.dec-Nav02 { width:calc(100% - 286px); vertical-align:top; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-boxInner-TrackHistory-box-inner.dec-Nav03 { width:calc(100% - 72px); vertical-align:top; margin-left: auto; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-boxInner-TrackHistory-box-inner .div-MapTool-TrackHistory-box-inner-Nav01, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-boxInner-TrackHistory-box-inner .div-MapTool-TrackHistory-box-inner-Nav02, .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-boxInner-TrackHistory-box-inner .div-MapTool-TrackHistory-box-inner-Nav03 { width:calc(100% - 0px);} /*end - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner.div-boxInner-TrackHistory-box-inner ----------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-countArea*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-countArea { width:calc(100% - 0px); height:33.5px; overflow:hidden; margin:0px; padding:7px 5px; border:1px solid #e1e1e1; color:#29aecc; background:rgba(255,255,255,0.5); border-radius:0.25rem;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-countArea:hover { background:rgba(255,255,255,1);} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-countArea.dec-onDuty::before { content:"啟動時數"; margin:0px 5px 0px 0px; padding:5px 0px; color:#595959} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-countArea.dec-offDuty::before { content:"熄火時數"; margin:0px 5px 0px 0px; padding:5px 0px; color:#595959} /*end - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .box-countArea*/ .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner .box-conArea .dec-mL-auto { margin-left:auto;} /*end - .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-title .dec-box-con .dec-box-inner -------------------------------------------------------------------*/ .MapTool-FunctionBox .box-inner .con-top .con-top-title.dec-back { width:calc(100% - 45px); margin:0px 5px 0px 0px;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .dec-ic { width:20px; margin-right:8px;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn { width:60px; height:40px; margin:0px 5px 0px 0px; padding:0px; -ms-flex-pack: end !important; justify-content: flex-end !important;} .MapTool-FunctionBox.dec-TrackHistory .box-inner .con-top .con-top-btn { width:30px;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn.dec-back { width:35px;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn a, .MapTool-FunctionBox .box-inner .con-top .con-top-btn a:hover { margin:0px 5px 0px 0px; padding:0px; text-decoration:none; width:25px; height:25px; overflow:hidden;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn a:last-child, .MapTool-FunctionBox .box-inner .con-top .con-top-btn a:last-child:hover { margin:0px;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn a .dec-ic, .MapTool-FunctionBox .box-inner .con-top .con-top-btn a:hover .dec-ic:hover { margin:0px; padding:4px 3px 5px 3px; width:25px; height:25px; overflow:hidden; border-radius:3px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn .dec-ic { color: #787878;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn .dec-ic:hover { color:#169cbf;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn .dec-ic .dec-angleDown { font-size:20px;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn .dec-ic .dec-angleUp { font-size:20px;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn a .icon-sprite.icon-ic_cross, .MapTool-FunctionBox .box-inner .con-top .con-top-btn a:hover .icon-sprite.icon-ic_cross { margin:3px;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn a:hover .icon-sprite.icon-ic_cross { margin:3px; background-position:-170px -1566px;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn a .icon-sprite.icon-ic_minimise, .MapTool-FunctionBox .box-inner .con-top .con-top-btn a:hover .icon-sprite.icon-ic_minimise { margin:3px;} .MapTool-FunctionBox .box-inner .con-top .con-top-btn a:hover .icon-sprite.icon-ic_minimise { margin:3px; background-position:-272px -2117px;} /*start - .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn*/ .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-title { width:calc(100% - 70px);} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn { width:70px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn a .dec-ic {} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn a:first-child .dec-ic {} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn a, .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn a:hover { background:transparent;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn a .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn a:hover .dec-ic { background:transparent;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn a .dec-ic.dec-ic-01, .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn a:hover .dec-ic.dec-ic-01 { padding:6px 3px 5px 3px;} /*start - btn-MapTool-FunctionArea-Alarm-minimise 監控圖台｜M05.地圖右側功能/告警通知｜div-MapTool-FunctionArea-Alarm｜div最小化設定*/ .MapTool-FunctionBox.dec-FunctionArea-Alarm.div-MapTool-FunctionArea-Alarm.dec-minimise { height:40px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-main.div-con-main-Alarm.dec-minimise { display:none;} /*end - btn-MapTool-FunctionArea-Alarm-minimise 監控圖台｜M05.地圖右側功能/告警通知｜div-MapTool-FunctionArea-Alarm｜div最小化設定*/ /*end - .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn*/ /*start - 地圖右側功能 ----------------------------------------------------*/ .MapTool-FunctionBox.dec-Road .box-inner .con-top, .MapTool-FunctionBox.dec-Road-Detail .box-inner .con-top, .MapTool-FunctionBox.dec-POI .box-inner .con-top, .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-top, .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-top, .MapTool-FunctionBox.dec-BusStopRoute-Route .box-inner .con-top, .MapTool-FunctionBox.dec-Video .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .box-inner .con-top, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner .con-top, .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-top, .MapTool-FunctionBox.dec-Mission-Edit .box-inner .con-top, .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-top, .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-top, .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-top, .MapTool-FunctionBox.dec-Mission-Info .box-inner .con-top, .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner .con-top, .MapTool-FunctionBox.dec-FunctionArea-Positioning .box-inner .con-top, .MapTool-FunctionBox.dec-FunctionArea-Measure .box-inner .con-top, .MapTool-FunctionBox.dec-FunctionArea-MapLayer .box-inner .con-top, .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-top, .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-top, .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner .con-top, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top, .MapTool-FunctionBox.dec-FunctionArea-Alarm-MapInfo .box-inner .con-top, .MapTool-FunctionBox.dec-DeviceInfo .box-inner .con-top, .MapTool-FunctionBox.dec-SignInfo .box-inner .con-top, .MapTool-FunctionBox.dec-ChargingPileInfo .box-inner .con-top { background:rgba(255,255,255,0.6); border-bottom:1px solid #e1e1e1; border-radius:3px 3px 0px 0px;} /*start - 告警通知｜狀態：一般狀態/.dec-condition-general, 告警狀態/.dec-condition-alarm ----------------------------------------*/ /*start - .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-general 告警通知｜狀態：一般狀態*/ .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-general { background:#FFFFFF;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-general .con-top-title { z-index:2;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-general .con-top-btn { z-index:2;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-general .con-top-title .dec-update { margin:0px; padding:0px; background:transparent; color:#999999; font-size:14px; font-weight:400; margin-left:auto; letter-spacing:0;} @keyframes fade { from { opacity: 1.0;} 50% { opacity: 0.0;} to { opacity: 1.0;}} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-general .dec-bg { width:calc(100% - 2px); height:38px; margin:1px; padding:0px; position:absolute; top:0px; left:0px; z-index:1; background:rgba(255, 255, 255, 1); animation: fade 600ms infinite;} /*end - .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-general 告警通知｜狀態：一般狀態*/ /*start - .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-alarm .con-top 告警通知｜狀態：告警狀態*/ .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-alarm { background:#FFFFFF;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-alarm .con-top-title { z-index:2;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-alarm .con-top-btn { z-index:2;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-alarm .con-top-title .dec-update { margin:0px; padding:0px; background:transparent; color:#999999; font-size:10px; font-weight:400; margin-left:auto; letter-spacing:0;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-alarm .dec-bg { width:calc(100% - 2px); height:38px; margin:1px; padding:0px; position:absolute; top:0px; left:0px; z-index:1; background:rgba(249, 73, 38, 0.1); animation: fade 600ms infinite;} /*end - .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-alarm .con-top 告警通知｜狀態：告警狀態*/ /*end - 告警通知｜狀態：一般狀態/.dec-condition-general, 告警狀態/.dec-condition-alarm ----------------------------------------*/ .MapTool-FunctionBox.dec-Road .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Road-Detail .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-POI .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-BusStopRoute-Route .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Video .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-TrackHistory-Video .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Mission-Edit .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Mission-Info .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-FunctionArea-Positioning .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-FunctionArea-Measure .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-FunctionArea-MapLayer .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-FunctionArea-Alarm-MapInfo .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-DeviceInfo .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-SignInfo .box-inner .con-top .con-top-title { color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner .con-top .con-top-title .dec-type-note { color:#595959; margin:0px; padding:0px; display:inline-block; font-size:1rem; line-height:1rem; font-weight:400;} .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner .con-top .con-top-btn .btn-MapTool-Monitor-CarInfo-hide .dec-ic { padding-top:10px;} .MapTool-FunctionBox .box-inner .con-top .con-top-title .icon-sprite { margin:6px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner .con-top .con-top-title {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner .con-top .con-top-title .dec-driverArea { width:calc(100% - 70px); height:28px; margin:0px; padding:5px 0px; overflow:hidden; vertical-align:middle;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner .con-top .con-top-title .dec-btnArea { width:70px; margin:0px; padding:0px; text-align:right;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner .con-top .con-top-btn { width:30px;} .MapTool-FunctionBox.dec-Road .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Road-Detail .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-POI .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-BusStopRoute-Route .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Video .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-TrackHistory-Video .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Mission-Edit .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Mission-Info .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Positioning .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Measure .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-MapLayer .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Alarm-MapInfo .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-DeviceInfo .box-inner .con-top .con-top-btn .dec-ic, .MapTool-FunctionBox.dec-SignInfo .box-inner .con-top .con-top-btn .dec-ic { color:#999999;} .MapTool-FunctionBox.dec-Road .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Road-Detail .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-POI .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-BusStopRoute-Route .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Video .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-TrackHistory-Video .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Mission-Edit .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Mission-Info .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-FunctionArea-Positioning .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-FunctionArea-Measure .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-FunctionArea-MapLayer .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-FunctionArea-Alarm-MapInfo .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-DeviceInfo .box-inner .con-top .con-top-btn .dec-ic:hover, .MapTool-FunctionBox.dec-SignInfo .box-inner .con-top .con-top-btn .dec-ic:hover { color:#169cbf; background:#FFFFFF;} .MapTool-FunctionBox.dec-Road .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-Road-Detail .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-POI .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-BusStopRoute-Route .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-Video .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Positioning .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Positioning .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Measure .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-MapLayer .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-FunctionArea-Alarm-MapInfo .box-inner .con-top .con-top-title .dec-ic, .MapTool-FunctionBox.dec-ParkingLot-ParkingLotList .box-inner .con-top .con-top-title .dec-ic { color:#008BAC;} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-alarm .con-top-title .dec-ic { color:#f94926; -webkit-animation-name: fa-beat; animation-name: fa-beat; -webkit-animation-delay: var(--fa-animation-delay, 0s); animation-delay: var(--fa-animation-delay, 0s); -webkit-animation-direction: var(--fa-animation-direction, normal); animation-direction: var(--fa-animation-direction, normal); -webkit-animation-duration: var(--fa-animation-duration, 1s); animation-duration: var(--fa-animation-duration, 1s); -webkit-animation-iteration-count: var(--fa-animation-iteration-count, infinite); animation-iteration-count: var(--fa-animation-iteration-count, infinite); -webkit-animation-timing-function: var(--fa-animation-timing, ease-in-out); animation-timing-function: var(--fa-animation-timing, ease-in-out);} .MapTool-FunctionBox.dec-FunctionArea-Alarm .box-inner .con-top.dec-condition-general .con-top-title .dec-ic { } /*end - 地圖右側功能 ----------------------------------------------------*/ /*end - .MapTool-FunctionBox .box-inner .con-top --------------------------------------------------------------------------------------*/ /*start - 監控圖台｜告警通知｜div-MapTool-FunctionArea-Alarm ->可移動div (Make the DIV element draggagle) --------------------*/ #divMapToolFunctionAreaAlarm { position:absolute; left:10px; z-index:99;} #divMapToolFunctionAreaAlarmheader { cursor:move; cursor:default; z-index:10;} /*end - 監控圖台｜告警通知｜div-MapTool-FunctionArea-Alarm ->可移動div (Make the DIV element draggagle) --------------------*/ /*start - .MapTool-FunctionBox.dec-FunctionArea-Measure ----------------------------------------------------*/ .MapTool-FunctionBox.dec-FunctionArea-Measure { width:290px;} .MapTool-FunctionBox.dec-FunctionArea-Measure .box-inner .con-main { background:#FFFFFF;} /*end - .MapTool-FunctionBox.dec-FunctionArea-Measure ----------------------------------------------------*/ /*start - .box-FunctionArea-Measure-Area ----------------------------------------------------*/ .box-FunctionArea-Measure-Area { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; background:transparent; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-FunctionArea-Measure-Area .dec-info { width:calc(100% - 0px); margin:0px; padding:10px 0px; color:#595959; font-size:1rem; line-height:1.2rem;} .dec-FunctionArea-Landmark .box-FunctionArea-Measure-Area .dec-info { width:calc(100% - 0px); margin:0px; padding:0px 0px 10px 0px; color:#595959; font-size:1rem; line-height:1.2rem;} /*end - .box-FunctionArea-Measure-Area ----------------------------------------------------*/ /*start - .box-FunctionArea-Measure-Area.dec-Route ----------------------------------------------------*/ .box-FunctionArea-Measure-Area.dec-Route{ width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; background:transparent; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-FunctionArea-Measure-Area.dec-Route .dec-info { width:calc(100% - 0px); margin:0px; padding:10px 0px; color:#595959; font-size:1rem; line-height:1.2rem;} /*end - .box-FunctionArea-Measure-Area.dec-Route ----------------------------------------------------*/ /*start - .div-AreaSearch-POISearch-Area .btn-Measure-Area*/ .div-AreaSearch-POISearch-Area .btn-Measure-Area { background:transparent; margin:0px 0px 30px 0px; padding:0px; position:relative; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important;} .div-AreaSearch-POISearch-Area .btn-Measure-Area a.btn-Measure, .div-AreaSearch-POISearch-Area .btn-Measure-Area a:hover.btn-Measure, .div-AreaSearch-POISearch-Area .btn-Measure-Area a.btn-Measure.is-active, .div-AreaSearch-POISearch-Area .btn-Measure-Area a.btn-Measure.is-active:hover { padding:6px 45px; width:calc((100%/3) - 5px);} /*end - .div-AreaSearch-POISearch-Area .btn-Measure-Area*/ /*start - .div-AreaSearch-AddressSearch-Area .btn-Measure-Area*/ .div-AreaSearch-AddressSearch-Area .btn-Measure-Area { background:transparent; margin:0px 0px 30px 0px; padding:0px; position:relative; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important;} .div-AreaSearch-AddressSearch-Area .btn-Measure-Area a.btn-Measure, .div-AreaSearch-AddressSearch-Area .btn-Measure-Area a:hover.btn-Measure, .div-AreaSearch-AddressSearch-Area .btn-Measure-Area a.btn-Measure.is-active, .div-AreaSearch-AddressSearch-Area .btn-Measure-Area a.btn-Measure.is-active:hover { padding:6px 45px; width:calc((100%/3) - 5px);} /*end - .div-AreaSearch-AddressSearch-Area .btn-Measure-Area*/ /*start - .btn-Measure-Area -----------------------------------------------------------------------------------------------------*/ .btn-Measure-Area { background:transparent; margin:0px; padding:0px; position:relative; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important;} .btn-Measure-Area a.btn-Measure, .btn-Measure-Area a:hover.btn-Measure, .btn-Measure-Area a.btn-Measure.is-active, .btn-Measure-Area a.btn-Measure.is-active:hover { text-decoration: none; margin:0px 0px 0px 5px; padding:6px 10px; font-size:16px; line-height:21px; font-weight:400; width:calc((100%/7) - 5px); border-radius:0.25rem; border:1px solid #FFFFFF; background:#fafafa;} .btn-Measure-Area.dec-POI {} .btn-Measure-Area.dec-POI a.btn-Measure, .btn-Measure-Area.dec-POI a.btn-Measure:hover { width:calc(25% - 0px); text-align:center;} .btn-Measure-Area.dec-POI a.btn-Measure.is-active, .btn-Measure-Area.dec-POI a.btn-Measure.is-active:hover { text-align:center;} .btn-Measure-Area.dec-POI a .dec-type { display:inline-block; margin:2px 0px 0px 0px; padding:0px; width:calc(100% - 0px); text-align:center;} .btn-Measure-Area a.btn-Measure:first-child, .btn-Measure-Area a:hover.btn-Measure:first-child, .btn-Measure-Area a.btn-Measure.is-active:first-child, .btn-Measure-Area a.btn-Measure.is-active:hover:first-child { margin:0px;} .btn-Measure-Area a.btn-Measure { background:#fafafa; color:#CCCCCC;} .btn-Measure-Area a.btn-Measure:hover { background:#fafafa; color:#e5aa15; border:1px solid #ebebeb;} .btn-Measure-Area a.btn-Measure.is-active { background:#FFFFFF; color:#d9a20c; border:1px solid #CCCCCC;} .btn-Measure-Area a.btn-Measure.is-active:hover { background:#FFFFFF; color:#e5aa15; border:1px solid #CCCCCC;} .btn-Measure-Area a.btn-Measure.btn-Measure-FunctionArea-Point .fa-map-marker-alt { margin-left:0px;} .btn-Measure-Area a.btn-Measure.btn-Measure-FunctionArea-Line .fa-slash { margin-left:-3px;} .btn-Measure-Area a.btn-Measure.btn-Measure-FunctionArea-Polygon .fa-square { margin-left:-1px;} .btn-Measure-Area a.btn-Measure.btn-Measure-FunctionArea-Rectangle .fa-layers { margin-left:calc(50% - 5px);} .btn-Measure-Area a.btn-Measure.btn-Measure-FunctionArea-Rectangle .fa-square.dec-ic-01 { margin-left:calc(50% - 13px);} .btn-Measure-Area a.btn-Measure.btn-Measure-FunctionArea-Rectangle .fa-square.dec-ic-02 { margin-left:calc(50% - 5px);} .btn-Measure-Area a.btn-Measure.btn-Measure-FunctionArea-Round .fa-circle { margin-left:calc(50% - 7px);} .btn-Measure-Area a.btn-Measure.btn-Measure-FunctionArea-IrregularShape .fa-draw-polygon { margin-left:calc(50% - 7px);} .btn-Measure-Area a.btn-Measure.btn-Measure-FunctionArea-Font .fa-font { margin-left:-2px;} .btn-Measure-Area .Measure-area-note { width:35px; height:28px; background:#787878; color:#FFFFFF; z-index:9999; position:absolute; top:35px; left:-15px; font-size:14px; line-height:16px; padding:5px 2px; margin:0px; border-radius:0.25rem; border:0px; text-align:center;} .btn-Measure-Area .Measure-area-note.dec-position-Point { left:0px;} .btn-Measure-Area .Measure-area-note.dec-position-Line { left:38px;} .btn-Measure-Area .Measure-area-note.dec-position-Polygon { left:77px;} .btn-Measure-Area .Measure-area-note.dec-position-Rectangle { left:110px; width:45px;} .btn-Measure-Area .Measure-area-note.dec-position-Round { left:147px; width:45px;} .btn-Measure-Area .Measure-area-note.dec-position-IrregularShape { left:183px; width:55px;} .btn-Measure-Area .Measure-area-note.dec-position-Font { left:230px;} .div-AreaSearch-POISearch-Area .btn-Measure-Area .Measure-area-note.dec-position-Rectangle { width:45px; left:calc(83% - 22px);} .div-AreaSearch-POISearch-Area .btn-Measure-Area .Measure-area-note.dec-position-Round { width:45px; left:calc(50% - 22px);} .div-AreaSearch-POISearch-Area .btn-Measure-Area .Measure-area-note.dec-position-IrregularShape { left:25px; width:55px; margin-left:calc(10% - 27px);} .div-AreaSearch-AddressSearch-Area .btn-Measure-Area .Measure-area-note.dec-position-Rectangle { width:45px; left:calc(83% - 22px);} .div-AreaSearch-AddressSearch-Area .btn-Measure-Area .Measure-area-note.dec-position-Round { width:45px; left:calc(50% - 22px);} .div-AreaSearch-AddressSearch-Area .btn-Measure-Area .Measure-area-note.dec-position-IrregularShape { left:25px; width:55px; margin-left:calc(10% - 27px);} .btn-Measure-Area .Measure-area-note:after { content:''; display:block; position:absolute; height:0; width:0; border-bottom:10px solid #787878; border-left:10px solid transparent; border-right:10px solid transparent; top:-7px; right:25px;} .btn-Measure-Area .Measure-area-note.dec-position-Point:after { right:9px;} .btn-Measure-Area .Measure-area-note.dec-position-Line:after { right:9px;} .btn-Measure-Area .Measure-area-note.dec-position-Polygon:after { right:9px;} .btn-Measure-Area .Measure-area-note.dec-position-Rectangle:after { right:12px;} .btn-Measure-Area .Measure-area-note.dec-position-Round:after { right:12px;} .btn-Measure-Area .Measure-area-note.dec-position-IrregularShape:after { right:20px;} .btn-Measure-Area .Measure-area-note.dec-position-Font:after { right:10px;} /*end - .btn-Measure-Area -----------------------------------------------------------------------------------------------------*/ /*start - .nav-pills.dec-con-01 -----------------------------------------------------------------------------------------------------*/ .nav-pills.dec-con-01 { font-size:1rem; padding-bottom:0.2rem; margin-bottom:5px; border-bottom:1px solid #E1F1F4;} .nav-pills.dec-con-01 .nav-link { border-radius:0.25rem; background:#FFFFFF; margin-right:5px; border:1px solid #e6e6e6; color:#999999; padding:0.25rem 0.5rem;} .nav-pills.dec-con-01 .nav-link:hover { background:#fafafa; color:#999999;} .nav-pills.dec-con-01 .nav-link.active, .nav-pills.dec-con-01 .show > .nav-link { color:#FFFFFF; background:#169cbf; border:1px solid #00994e; padding:0.25rem 0.5rem; margin-bottom:-0.2rem; border-bottom:1px solid #169cbf;} .nav-pills.dec-con-01 .nav-item { width:calc(25% - 0px);} .tab-content.dec-con-01 { width:calc(100% - 0px); height:calc(100% - 50px); margin:0px; padding:0px 5px 5px 5px; background:#FFFFFF; overflow:hidden; color:#595959;} .MapTool-FunctionBox.dec-TrackSearch-Time .con-main .tab-content.dec-con-01 { overflow:hidden; height:calc(100% - 50px);} .box-conArea.dec-result-TrackSearch-Time .tab-content.dec-con-01 { padding-right:0px; padding-left:0px;} /*end - .nav-pills.dec-con-01 -----------------------------------------------------------------------------------------------------*/ /*start - .nav-pills.dec-con-01.dec-c01 -----------------------------------------------------------------------------------------------------*/ .nav-pills.dec-con-01.dec-c01 { font-size:1rem; padding-bottom:0.2rem; margin-bottom:5px; border-bottom:1px solid #e8ddc8;} .nav-pills.dec-con-01.dec-c01 .nav-link { border-radius:0.25rem; background:#FFFFFF; margin-right:5px; border:1px solid #e8ddc8; color:#999999; padding:0.25rem 0.5rem;} .nav-pills.dec-con-01.dec-c01 .nav-link:hover { background: #fafafa; color: #999999;} .nav-pills.dec-con-01.dec-c01 .nav-link.active, .nav-pills.dec-con-01.dec-c01 .show > .nav-link { color:#FFFFFF; background:#776744; border:1px solid #5b4d2f; padding:0.25rem 0.5rem; margin-bottom:-0.2rem; border-bottom:1px solid #5b4d2f;} .nav-pills.dec-con-01.dec-c01 .nav-item { width:calc(25% - 0px);} .tab-content.dec-con-01.dec-c01 { width:calc(100% - 0px); height:calc(100% - 55px); margin:0px; padding:0px 5px 5px 5px; background:#FFFFFF; overflow-x:hidden; overflow-y:auto; color:#595959;} /*end - .nav-pills.dec-con-01 -----------------------------------------------------------------------------------------------------*/ /*start - .nav-pills.dec-con-02 -----------------------------------------------------------------------------------------------------*/ .nav-pills.dec-con-02 { font-size:1rem; padding-bottom:0.2rem; margin-bottom:5px; border-bottom:1px solid #f0f0f0;} .nav-pills.dec-con-02 .nav-link { border-radius:0rem; background:transparent; margin-right:5px; border-bottom:2px solid transparent; color:#bdbdbd; padding:0.25rem 0.5rem;} .nav-pills.dec-con-02 .nav-link:hover { background:#f0f0f0; color:#999999; border-bottom:2px solid #f0f0f0;} .nav-pills.dec-con-02 .nav-link.active, .nav-pills.dec-con-02 .show > .nav-link { background:transparent; color:#5b4d2f; padding:0.25rem 0.5rem; margin-bottom:-0.2rem; border-bottom:2px solid #d9a20c;} .nav-pills.dec-con-02 .nav-item { width:calc(25% - 0px);} .tab-content.dec-con-02 { width:calc(100% - 0px); height:calc(100% - 55px); margin:0px; padding:0px 5px 5px 5px; background:transparent; overflow-x:hidden; overflow-y:auto; color:#595959;} /*end - .nav-pills.dec-con-02 -----------------------------------------------------------------------------------------------------*/ /*start - .nav-pills.dec-con-03 -----------------------------------------------------------------------------------------------------*/ .nav-pills.dec-con-03 { font-size:1rem; padding-bottom:0.2rem; margin-bottom:5px; border-bottom:1px solid #E1F1F4;} .nav-pills.dec-con-03 .nav-link { border-radius:0.25rem; background:#FFFFFF; margin-right:5px; border:1px solid #e6e6e6; color:#999999; padding:0.25rem 0.5rem;} .nav-pills.dec-con-03 .nav-link:hover { background:#fafafa; color:#999999;} .nav-pills.dec-con-03 .nav-link.active, .nav-pills.dec-con-03 .show > .nav-link { color:#FFFFFF; background:#169cbf; border:1px solid #00994e; padding:0.25rem 0.5rem; margin-bottom:-0.2rem; border-bottom:1px solid #169cbf;} .nav-pills.dec-con-03 .nav-item { width:calc((100%/9) - 0px); text-align: center;} .tab-content.dec-con-03 { margin:0px; padding:0px 5px 5px 5px; background:#FFFFFF; overflow-x:hidden; overflow-y:auto; width:calc(100% - 0px); height:calc(100% - 55px); color:#595959;} .tab-content.dec-con-03.dec-overflow-h { overflow:hidden;} .tab-content.dec-con-03.dec-overflow-h .dec-tab-pane-01 { height:calc(100% - 0px); overflow:auto;} .tab-content.dec-con-03.dec-overflow-h .dec-tab-pane-01.dec-overflow-h { overflow:hidden;} .tab-content.dec-con-03.dec-overflow-h .dec-tab-pane-02 { height:calc(100% - 0px);} .tab-content.dec-con-03.dec-height-01 { height:calc(100% - 120px);} .tab-content.dec-con-03.dec-height-01 .tab-pane { height:calc(100% - 0px); overflow:hidden;} .tab-content.dec-con-03.dec-height-01 .tab-pane .box-con-a03 { height:calc(100% - 0px); overflow:hidden;} .MapTool-FunctionBox.dec-TrackSearch-Time .con-main .tab-content.dec-con-03 { overflow:hidden; height:calc(100% - 50px);} .box-conArea.dec-result-TrackSearch-Time .tab-content.dec-con-03 { padding-right:0px; padding-left:0px;} .nav-pills.dec-con-03 .nav-link .dec-note { font-size:12px; line-height:1rem;} /*start - .dec-conBoxInner.div-NavSortBox-statisticsDashCam 數位大餅｜圖表*/ .dec-conBoxInner.div-NavSortBox-statisticsDashCam .tab-content.dec-con-03 { overflow-x:auto;} .dec-conBoxInner.div-NavSortBox-statisticsDashCam .tab-content.dec-con-03 .box-con-a03 { width:auto;} .dec-conBoxInner.div-NavSortBox-statisticsDashCam .tab-content.dec-con-03 .box-con-a03 > div { padding-right:20px;} /*end - .dec-conBoxInner.div-NavSortBox-statisticsDashCam 數位大餅｜圖表*/ /*start - .nav-pills.dec-con-03 .nav-link .dec-num*/ .nav-pills.dec-con-03 .nav-link .dec-num { margin:0px 0px 0px 5px; padding:2px 8px 3px 8px; border-radius:12px; font-size:1rem; line-height:1rem;} .nav-pills.dec-con-03 .nav-link .dec-num, .nav-pills.dec-con-03 .nav-link:hover .dec-num { color:#FFFFFF; background:#72bf44; border:1px solid #72bf44;} .nav-pills.dec-con-03 .nav-link.active .dec-num, .nav-pills.dec-con-03 .show > .nav-link .dec-num { color:#50b848; background:#FFFFFF; border:1px solid #FFFFFF;} /*end - .nav-pills.dec-con-03 .nav-link .dec-num*/ /*end - .nav-pills.dec-con-03 -----------------------------------------------------------------------------------------------------*/ /*start - .nav-pills.dec-con-05*/ .nav-pills.dec-con-05 { font-size:1rem; padding-bottom:0rem; margin-bottom:0px; border-bottom:1px solid #E1F1F4;} .nav-pills.dec-con-05 .nav-link { border-radius:0.25rem; background:#FFFFFF; margin-right:5px; border:1px solid #e6e6e6; color:#999999; padding:0.25rem 0.5rem;} .nav-pills.dec-con-05 .nav-link:hover { background:#fafafa; color:#999999;} .nav-pills.dec-con-05 .nav-link.active, .nav-pills.dec-con-05 .show > .nav-link { color:#FFFFFF; background:#169cbf; border:1px solid #00994e; padding:0.25rem 0.5rem; margin-bottom:-0.2rem; border-bottom:1px solid #169cbf;} .nav-pills.dec-con-05 .nav-item { width:calc(20% - 0px); text-align:center;} .tab-content.dec-con-05 { margin:0px; padding:0px 5px 5px 5px; background:#FFFFFF; overflow-x:hidden; overflow-y:hidden; width:calc(100% - 0px); height:calc(100% - 0px); color:#595959} .MapTool-FunctionBox.dec-TrackSearch-Time .con-main .tab-content.dec-con-05 { overflow:hidden; height:calc(100% - 50px);} .box-conArea.dec-result-TrackSearch-Time .tab-content.dec-con-05 { padding-right:0px; padding-left:0px;} /*end - .nav-pills.dec-con-05*/ /*start - .nav-pills.dec-con-07 -----------------------------------------------------*/ .nav-pills.dec-con-07 { font-size:1rem; padding-bottom:0.2rem; margin-bottom:5px; border-bottom:1px solid #E1F1F4;} .nav-pills.dec-con-07 .nav-link { border-radius:0.25rem; background:#FFFFFF; margin-right:5px; border:1px solid #e6e6e6; color:#999999; padding:0.25rem 0.5rem;} .nav-pills.dec-con-07 .nav-link:hover { background:#fafafa; color:#999999;} .nav-pills.dec-con-07 .nav-link.active, .nav-pills.dec-con-07 .show > .nav-link { color:#FFFFFF; background:#169cbf; border:1px solid #00994e; padding:0.25rem 0.5rem; margin-bottom:-0.2rem; border-bottom:1px solid #169cbf;} .nav-pills.dec-con-07 .nav-item { width:calc(20% - 0px); width:calc((100%/6) - 0px); width:calc((100%/8) - 0px); text-align:center;} .tab-content.dec-con-07 { width:calc(100% - 0px); height:calc(100% - 55px); margin:0px; padding:0px 5px 5px 5px; background:#FFFFFF; overflow-x:hidden; overflow-y:auto; color:#595959;} .nav-pills.dec-con-07 .nav-link .dec-note { font-size:12px; line-height:1rem;} /*start - .nav-pills.dec-con-07 .nav-link .dec-num*/ .nav-pills.dec-con-07 .nav-link .dec-num { margin:0px 0px 0px 5px; padding:2px 8px 3px 8px; border-radius:12px; font-size:1rem; line-height:1rem;} .nav-pills.dec-con-07 .nav-link .dec-num, .nav-pills.dec-con-07 .nav-link:hover .dec-num { color:#FFFFFF; background:#72bf44; border:1px solid #72bf44;} .nav-pills.dec-con-07 .nav-link.active .dec-num, .nav-pills.dec-con-07 .show > .nav-link .dec-num { color:#50b848; background:#FFFFFF; border:1px solid #FFFFFF;} /*end - .nav-pills.dec-con-07 .nav-link .dec-num*/ /*end - .nav-pills.dec-con-07 -----------------------------------------------------*/ .dec-bg { background:#f5f5f5;} /*start - .box-conArea ---------------------------------------------------------------------------------------*/ .box-conArea { margin:0px 0px 5px 0px; padding:0px;} .box-conArea .box-conArea-outerBox { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea .box-conArea-outerBox:first-child { width:calc(100% - 0px); margin:0px; padding:0px;} .box-conArea .box-conArea-outerBox.dec-justifyContentStart { -ms-flex-pack: start !important; justify-content: flex-start !important; padding:5px 0px;} .box-conArea .box-conArea-outerBox .box-conArea-con { width:calc(100% - 0px); margin:0px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con.dec-padding { padding:0px 5px 0px 0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-m01 { margin-top:5px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-btnArea-add { width:120px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-btnArea-note { width:calc(100% - 120px); height:35px; overflow:hidden; margin:5px 0px 0px 0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-btnArea-note .dec-type { margin:0px; padding:0px; color:#b4b4b4; line-height:1.3rem;} /*start - .box-conArea .box-conArea-outerBox.dec-half*/ .box-conArea .box-conArea-outerBox.dec-half { display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .box-conArea .box-conArea-outerBox.dec-half .box-conArea-con { width: calc(50% - 5px);} .box-conArea .box-conArea-outerBox.dec-half .box-conArea-con .box-con-whole {} /*end - .box-conArea .box-conArea-outerBox.dec-half*/ .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-checBox { width:calc(100% - 20px); margin:0px 0px 0px 20px; -ms-flex-pack: start !important; justify-content: flex-start !important; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-checBox .dec-checBox-01 { width:calc(33% - 10px);} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-padding { width:calc(100% - 0px); margin:0px; padding:5px 0px 0px 10px; display: -ms-flexbox !important; display: flex !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-a01 { width:calc(35% - 5px); margin:0px 0px 0px 0px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-a02 { width:calc(35% - 5px); margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-a03 { width:calc(30% - 0px); margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-a01a { width:calc(50% - 5px); margin:0px 0px 0px 0px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-a02a { width:calc(50% - 0px); margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-b01 { width:calc(23% - 5px); margin:0px 0px 0px 0px; padding:5px 0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-b02 { width:calc(47% - 5px); margin:0px 0px 0px 5px; padding:5px 0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-b03 { width:calc(30% - 0px); margin:0px 0px 0px 5px; padding:5px 0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-b03 a.btn-search, .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-b03 a.btn-search:hover { margin-top:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-c01 { width:50px; margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-c02 { width:calc(100% - 55px); margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-d01 { width:calc(50% - 8px); margin:0px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-d02 { width:6px; margin:0px 5px; padding:0px; text-align:center; padding-top:5px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-d03 { width:calc(50% - 8px); margin:0px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-e01 { width:60px; margin:0px; padding:0px; line-height:1.2rem; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-e02 { width:calc(100% - 65px); margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-f01 { width:calc(50% - 5px); margin:0px 0px 0px 0px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-f02 { width:calc(50% - 0px); margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-g01 { width:calc(33% - 10px); margin:0px 0px 0px 0px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-g02 { width:calc(33% - 10px); margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-g03 { width:calc(34% - 30px); margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-g04 { width:35px; margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-g04 a.btn-search, .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-g04 a.btn-search:hover { margin-top:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-h01 { width:calc(100% - 65px); margin:0px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-h01.dec-whole { width:calc(100% - 0px); margin:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-h-btn { width:60px; margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-i01 { width:calc(47% - 35px); margin:0px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-i02 { width:calc(53% - 35px); margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-i03-btn { width:60px; margin:0px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-i03-btn .btn-search { margin:0px;} .MapTool-FunctionBox.dec-Alarm .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-whole { padding: 0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-whole { width:calc(100% - 0px); margin:0px; padding:0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-whole .dec-type { margin:5px 0px 0px 0px; padding:5px 0px 3px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-whole .form-check { margin:0px 15px 5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-selection { width:calc(100% - 10px); height:120px; margin:0px 0px 0px 10px; padding:0px 5px 0px 0px; border-top:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; overflow-x:hidden; overflow-y:auto; background:#fafafa;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-selection .form-check { width:calc(100% - 0px); padding-top:5px; padding-bottom:5px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half { width:calc(50% - 5px); margin:5px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half:first-child { width:calc(50% - 0px); margin:5px 0px 0px 0px;} /*start - .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-withBtn*/ .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-withBtn .box-inner-width-half { width:calc(50% - 55px); margin:5px 0px 0px 5px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-withBtn .box-inner-width-half:first-child { margin-left:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-withBtn .box-btnArea { width:115px; margin:0px; padding:0px 0px 0px 5px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-withBtn .box-btnArea .con-btnbox .dec-btn.dec-w-half { width:calc(50% - 3px);} /*end - .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-withBtn*/ .dec-Monitor-CarInfo-Video .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half { width:calc(35% - 5px); margin:5px 0px 0px 5px; padding:0px;} .dec-Monitor-CarInfo-Video .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half:first-child { width:calc(65% - 0px); margin:5px 0px 0px 0px;} .dec-Monitor-CarInfo-Video-FullScreen .box-conArea { max-width:480px; width:480px;} .dec-Monitor-CarInfo-Video-FullScreen .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half { width:calc(30% - 5px); margin:5px 0px 0px 5px; padding:0px;} .dec-Monitor-CarInfo-Video-FullScreen .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half:nth-child(2) { width:calc(30% - 5px); margin:5px 0px 0px 5px; padding:0px;} .dec-Monitor-CarInfo-Video-FullScreen .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half:first-child { width:calc(30% - 0px); margin:5px 0px 0px 0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half .dec-type { margin:5px 0px 0px 0px; padding:0px 0px 3px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half.dec-textAlignR { display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half a.dec-btn, .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half a.dec-btn:hover { margin:0px; padding:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half a.dec-btn { color:#0083BE; } .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half a.dec-btn:hover { color:#ff9000;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half a.dec-btn:first-child::after { content:"|"; margin:0px 5px 0px 5px; padding:0px; color:#CCCCCC;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half.dec-w03 { width:115px; margin:0px 0px 0px 5px; padding:0px; font-size:0.9rem; color:#999999; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half.dec-w03:first-child { width:calc(100% - 120px); margin:0px; font-size:1rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-date-start, .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-date-end { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-date-start::before { content:"起始時間"; margin-right:5px; padding:0px; width:65px; text-align:right;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-date-end::before { content:"結束時間"; margin-right:5px; padding:0px; width:65px; text-align:right;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-date-start .dec-form-control, .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-date-end .dec-form-control { width:calc(100% - 70px); margin:0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .dec-note { width:calc(100% - 0px); font-size:0.9rem; color:#999999; text-align:center; margin:0px; padding:5px 0px 0px 0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half a.dec-btn-a01, .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half a.dec-btn-a01:hover { margin:0px; padding:5px 0px;} .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half a.dec-btn-a01 { } .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-half a.dec-btn-a01:hover { } /*start - .box-conArea.dec-result-FunctionArea-Measure -------------------------------------------------------------------------------*/ .box-conArea.dec-result-FunctionArea-Measure { width:calc(100% - 0px); height:calc(100% - 150px); height:calc(100% - 190px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-conArea.dec-result-FunctionArea-Measure .dec-listTitle { width:calc(100% - 0px); margin:0px; padding:10px 0px 5px 5px; font-size:16px; line-height:1.2rem; font-weight:500;} .box-conArea.dec-result-FunctionArea-Measure a.dec-listArea { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-bottom:1px solid #e1e1e1; clear:both; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea.dec-result-FunctionArea-Measure a.dec-listArea:hover { background:#fcfbe0;} .box-conArea.dec-result-FunctionArea-Measure a.dec-listArea .dec-num { width:25px; margin:0px 5px; padding:2px 0px; border-radius:25px; text-align:center; background:#5dc1cf; color:#FFFFFF; font-size:12px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea.dec-result-FunctionArea-Measure a.dec-listArea:hover .dec-num { background:#5dc1cf;} .box-conArea.dec-result-FunctionArea-Measure a.dec-listArea .dec-type , .box-conArea.dec-result-FunctionArea-Measure a.dec-listArea:hover .dec-type { width:calc(100% - 35px); margin:0px; padding:5px 0px; font-size:1rem; line-height:1.2rem; color:#666666;} /*end - .box-conArea.dec-result-FunctionArea-Measure -------------------------------------------------------------------------------*/ /*start - .tab-content.dec-con-01 -------------------------------------------------------------------------------*/ .tab-content.dec-con-01 { } .tab-content.dec-con-01 .tab-pane { margin:0px; padding:0px 5px 0px 0px; width:calc(100% - 0px); height:calc(100% - 0px); overflow-x:hidden; overflow-y:auto;} .tab-content.dec-con-01 .tab-pane.dec-tab-pane-01 { margin:0px; padding:0px; width:calc(100% - 0px); height:calc(100% - 0px); overflow-x:hidden; overflow-y:hidden;} .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-FunctionArea-Positioning-Landmark { width:calc(100% - 0px); height:calc(100% - 115px); margin:0px; padding:0px 0px 5px 0px; overflow-x:hidden; overflow-y:auto;} .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-FunctionArea-Positioning-Landmark .dec-Pagination, .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-FunctionArea-Positioning-Road .dec-Pagination, .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-FunctionArea-Positioning-Address .dec-Pagination, .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-FunctionArea-Positioning-Management .dec-Pagination, .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-FunctionArea-POI .dec-Pagination, .dec-Road-Detail .dec-Pagination { width:calc(100% - 0px); height:30px; margin:10px 0px 0px 0px; padding:0px; overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important;} .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-FunctionArea-Positioning-Road { width:calc(100% - 0px); height:calc(100% - 160px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-FunctionArea-Positioning-Address { width:calc(100% - 0px); height:calc(100% - 120px); margin:0px; padding:0px 0px 5px 0px; overflow-x:hidden; overflow-y:auto;} .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-FunctionArea-Landmark-Management { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-TrackSearch-Time { width:calc(100% - 0px); height:calc(100% - 140px); margin:15px 0px 0px 0px; padding:15px 0px 0px 5px; overflow:hidden; border-top:1px solid #f4e9d0; background:#fafafa;} .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-TrackSearch-Time-A { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; background:transparent;} .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-TrackSearch-Area { width:calc(100% - 0px); height:calc(100% - 220px); margin:15px 0px 0px 0px; padding:15px 0px 0px 5px; overflow:hidden; border-top:1px solid #f4e9d0; background:#fafafa;} .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-TrackSearch-Area-A { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; background:transparent;} .tab-content.dec-con-01 .tab-pane .box-conArea.dec-result-FunctionArea-POI { width:calc(100% - 0px); height:calc(100% - 85px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} /*end - .tab-content.dec-con-01 -------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-FunctionArea-Positioning .tab-content.dec-con-01, .MapTool-FunctionBox.dec-FunctionArea-Positioning .tab-content.dec-con-01 .tab-pane { overflow:hidden;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad-List .tab-content.dec-con-01 .tab-pane { overflow:hidden;} /*start - .box-conArea .box-conArea-outerBox.dec-resultList --------------------------------------------------------------------------------------------------------------*/ /*start - .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea --------------------------------------------------------------------------------------------------------------*/ .box-conArea .box-conArea-outerBox.dec-resultList { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-conArea .box-conArea-outerBox.dec-resultList .dec-info { width:calc(100% - 0px); margin:0px; padding:10px 0px; color:#595959; font-size:1rem; line-height:1.2rem;} .box-conArea .box-conArea-outerBox.dec-resultList .dec-info-note { width:calc(100% - 0px); margin:0px; padding:0px 0px 10px 3px; color:#8cc63f; font-size:12px; line-height:16px;} .box-conArea.dec-result-FunctionArea-Landmark-Management .box-conArea-outerBox.dec-resultList { margin:0px;} .box-conArea.dec-result-FunctionArea-Landmark-Management .box-conArea-outerBox.dec-resultList .dec-info { width:calc(100% - 0px); margin:0px; padding:0px 0px 10px 0px; color:#595959; font-size:1rem; line-height:1.2rem;} .box-conArea .box-conArea-outerBox.dec-resultList .dec-info .dec-num { color:#d9a20c; font-weight:bold; font-size:1.1rem; line-height:1.2rem; margin-right:2px; padding:0px 0px 0px 5px;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item, .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item:hover { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; text-decoration: none; border-bottom: 1px solid #e1e1e1; border-radius:0.25rem; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item:first-child { margin:0px;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item:hover { background:#fcfbe0;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-top { width:calc(100% - 0px); margin:0px; padding:5px; border-radius:1rem; color:#666666; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-bottom { width:calc(100% - 0px); margin:0px; padding:0px;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-top .dec-ic { width:30px; color:#e5aa15;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item:hover .box-top .dec-ic { color:#d9a20c;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-top .icon-sprite { width:18px; margin:6px;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item:hover .box-top .icon-sprite { background-position:-204px -204px;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-top .dec-type { width:calc(100% - 30px); margin:0px; padding:0px; font-size:16px; line-height:1.2rem;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-bottom .dec-type { width:calc(100% - 0px); margin:0px; padding:0px 5px 5px 35px; font-size:14px; line-height:1.2rem; color:#999999;} /*start - .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea .box-function -------------------------------------------------------------------------------*/ .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea .box-function { width:calc(100% - 0px); margin:0px; padding:0px; border-bottom:1px solid #e1e1e1; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea .box-function:hover { background:#fcfbe0;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea .box-function .box-function-con { width:calc(100% - 65px); margin:0px; padding:0px;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea .box-function .box-function-btn { width:65px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea .box-function .box-function-con a.box-resultList-item { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; text-decoration:none; border-bottom:0px;} a.btn-function, a:hover.btn-function, a.btn-function.is-active, a.btn-function.is-active:hover { text-decoration:none; margin:0px 2px; border-radius:0.25rem; padding:6px 5px; width:28px; display:inline-block;} a.btn-function { color:#b3b3b3;} a.btn-function:hover { background:transparent; color:#776744;} a.btn-function .fa-edit { margin-left:1px;} a.btn-function .fa-trash { margin-left:2px;} a.btn-function .dec-ic { margin-top:3px;} a.btn-function:hover .icon-sprite.icon-ic_trash_s { width:18px;height:18px; background-position:-340px -2080px;} a.btn-function:hover .icon-sprite.icon-ic_edit_s { width:18px;height:18px; background-position:-136px -2080px;} /*end - .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea .box-function -------------------------------------------------------------------------------*/ /*start - .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-whole ----------------------------------------------------------------------------*/ .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-whole { width:calc(100% - 0px); margin:0px; padding:5px; border-radius:1rem; color:#776744; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-whole .dec-ic { width:30px; color:#e5aa15;} .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-whole .dec-distance { min-width:60px; text-align:right; margin:0px 0px 0px 5px; margin-left:auto; font-size:0.9rem; line-height:1.2rem; padding:0px; color:#b3b3b3;} /*end - .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea a.box-resultList-item .box-whole ----------------------------------------------------------------------------*/ /*end - .box-conArea .box-conArea-outerBox.dec-resultList .box-resultList-itemArea --------------------------------------------------------------------------------------------------------------*/ /*end - .box-conArea .box-conArea-outerBox.dec-resultList --------------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Device .box-inner.div-box-inner .con-main .box-resultList-itemArea-device ----------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Device .box-inner.div-box-inner .con-main .box-resultList-itemArea-device { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; background:#FFFFFF; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-resultList-itemArea-device .dec-typeArea { width:calc(100% - 0px); margin:0px; padding:5px 0px 10px 0px; font-size:15px; line-height:16px;} .box-resultList-itemArea-device .dec-typeArea .dec-num { margin:0px; padding:0px 2px; color:#f7931e; font-weight:500;} .box-resultList-itemArea-device a.box-resultList-item, .box-resultList-itemArea-device a.box-resultList-item:hover { width:calc(100% - 0px); margin:0px; padding:5px 0px 5px 5px; text-decoration:none; border-bottom:1px solid #e1e1e1; border-radius:0.25rem; word-break: normal; cursor: pointer; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important;} .box-resultList-itemArea-device a.box-resultList-item:first-child { margin:0px;} .box-resultList-itemArea-device a.box-resultList-item:hover { background:#e1f1f4;} .box-resultList-itemArea-device a.box-resultList-item:nth-child(even) { background:rgba(0, 0, 0, 0.03);} .box-resultList-itemArea-device a.box-resultList-item:nth-child(even):hover { background:#e1f1f4;} .box-resultList-itemArea-device a.box-resultList-item.is-active, .box-resultList-itemArea-device a.box-resultList-item.is-active:hover, .box-resultList-itemArea-device a.box-resultList-item:nth-child(even).is-active, .box-resultList-itemArea-device a.box-resultList-item:nth-child(even).is-active:hover { background:#e1f1f4;} .box-resultList-itemArea-device a.box-resultList-item .box-item-L { width:80px; padding:0px; margin:0px; font-size:15px; font-weight:500; color:#595959; overflow:hidden; line-height:1.3rem; display: -ms-inline-flexbox !important; display: inline-flex !important; justify-content: flex-start !important; align-items: center !important;} .box-resultList-itemArea-device a.box-resultList-item .box-item-M { width:calc(100% - 105px); padding:0px; margin:0px; overflow:hidden;} .box-resultList-itemArea-device a.box-resultList-item .box-item-Btn { width:25px; padding:0px; margin:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; justify-content: center !important; align-items: center !important;} .box-resultList-itemArea-device a.box-resultList-item .box-item-Btn .dec-ic { margin:0px; padding:4px 3px 5px 3px; width:25px; height:25px; overflow:hidden; border-radius:0px; color:#d6d6d6;} .box-resultList-itemArea-device a.box-resultList-item:hover .box-item-Btn .dec-ic { color:#169cbf;} .box-resultList-itemArea-device a.box-resultList-item .box-item-M .box-item-group { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; justify-content: flex-start !important; align-items: center !important;} .box-resultList-itemArea-device a.box-resultList-item .box-item-M .box-item-group:first-child { margin:0px;} .box-resultList-itemArea-device a.box-resultList-item .box-item-M .box-item-group .box-item-group-subTitle { width:65px; margin:0px; padding:0px; color:#666666; font-size:12px;} .box-resultList-itemArea-device a.box-resultList-item .box-item-M .box-item-group .box-item-group-con { width:calc(100% - 65px); margin:0px; padding:0px 5px 0px 0px; color:#595959; font-weight:500; font-size:15px;} .box-resultList-itemArea-device .dec-noData { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; text-align:center; color:#CCCCCC; font-size:14px; line-height:1.5rem;} .box-resultList-itemArea-device .dec-noData .dec-type {} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Device .box-inner.div-box-inner .con-main .box-resultList-itemArea-device ----------------------------------------------------------------------------*/ /*start - .box-conArea.dec-result-FunctionArea-Alarm -------------------------------------------------------------------------------*/ .box-conArea.dec-result-FunctionArea-Alarm { width:calc(100% - 0px); height:calc(100% - 85px); margin:5px 0px 0px 0px; padding:0px 5px 0px 0px; overflow-x:hidden; overflow-y:auto;} .box-conArea.dec-btnArea-FunctionArea-Alarm { width:calc(100% - 0px); height:40px; margin:0px; padding:0px; overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: end !important; align-items: flex-end !important;} .box-conArea.dec-btnArea-FunctionArea-Alarm .con-btnbox { width:calc(33% - 5px); height:35px;} .box-conArea.dec-btnArea-FunctionArea-Alarm .con-btnbox a { margin:0px; height:35px; display:block;} .box-conArea.dec-btnArea-FunctionArea-Alarm .con-btnbox a.dec-01d { margin:0px; height:35px; display:block !important;} .box-conArea.dec-result-FunctionArea-Alarm .dec-note { font-size:1rem; color:#CCCCCC; margin:0px; padding:5px; width:calc(100% - 0px); text-align:center;} .box-conArea.dec-result-FunctionArea-Alarm .dec-note .dec-ic { margin:0px 5px 0px 0px; padding:0px;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area { width:calc(100% - 0px); margin:0px; padding:5px 0px; text-decoration:none; border-bottom:1px solid #ebebeb; color:#787878; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area:hover { background:#fcfbe0; color:#595959;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.box-listItem, .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.box-listItem:hover{ width:calc(100% - 75px); margin:0px; padding:5px 0px; text-decoration:none; color:#787878; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.box-listItem:hover { background:#fcfbe0; color:#595959;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.box-listItem .dec-ic { font-size:22px; margin:2px 5px 0px 0px; padding:0px; color:#f94926;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.box-listItem:hover .dec-ic { color:#ed1c24;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.box-listItem .dec-num { width:85px; margin:0px 5px 0px 0px; padding:0px; font-size:16px; color:#f94926;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.box-listItem:hover .dec-num { color:#ed1c24;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.box-listItem .dec-con { width:calc(100% - 120px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.dec-btn, .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.dec-btn:hover { width:32px; height:32px; margin:0px; padding:0px; background:#FFFFFF; display:inline-block; overflow:hidden; border:1px solid #dfe2e5; border-radius:5px;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.dec-btn:hover { border:1px solid #c4cad0; background:#fafafa;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.dec-btn .dec-ic { margin:8px; padding:0px; color:#a3a3a3;} .box-conArea.dec-result-FunctionArea-Alarm .box-listArea .box-listItem-area a.dec-btn:hover .dec-ic { margin:8px; padding:0px; color:#29aecc;} /*end - .box-conArea.dec-result-FunctionArea-Alarm -------------------------------------------------------------------------------*/ /*end - .box-conArea ---------------------------------------------------------------------------------------*/ /*start - .box-btnArea ----------------------------------------------------------------*/ .box-btnArea { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-btnArea .con-btnbox { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-btnArea .con-btnbox .dec-btn, .box-btnArea .con-btnbox .dec-btn:hover { margin:5px 0px 0px 0px; min-height:35px; width:calc(100% - 0px);} .box-btnArea .con-btnbox .dec-btn.dec-w-half { width:calc(50% - 3px);} .box-btnArea .con-btnbox .dec-btn.dec-w-half:first-child { width:calc(50% - 2px);} .box-btnArea .con-btnbox .dec-btn.dec-w-half:last-child {} .box-btnArea .con-btnbox .dec-btn.dec-w-half.dec-ml-01 { margin-left:calc(25% - 0px);} .box-btnArea .con-btnbox .dec-btn.disabled { background:#fafafa; color:#d6d6d6; cursor:default; border-color:#CCCCCC;} .box-btnArea .con-btnbox .dec-btn .dec-type, .box-btnArea .con-btnbox .dec-btn:hover .dec-type { display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-btnArea .con-btnbox .dec-btn .dec-type .dec-iconSprite, .box-btnArea .con-btnbox .dec-btn:hover .dec-type .dec-iconSprite { } .box-btnArea .con-btnbox .dec-btn:hover .dec-type .dec-iconSprite { background-position:-68px -2080px;} .box-btnArea.dec-mt01 { margin-top:35px;} .box-btnArea .con-btnbox.dec-mt02 { margin:0px 0px 5px 0px;} .box-btnArea .con-btnbox .dec-btn .dec-ic { margin:0px 2px 0px 0px;} /*end - .box-btnArea ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Draw-DrawTool-Color { width:260px; left:auto; right:25px; top:270px; height:230px; position:absolute;} .MapTool-FunctionBox.dec-Draw-DrawTool-Color-Landmark { width:260px; left:auto; right:25px; top:385px; height:230px; position:absolute;} /*start - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-position-sample { left:auto; right:375px; top:270px;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow { width:280px; left:auto; right:auto; top:auto; padding-bottom:5px; height:auto; position:absolute; z-index:3;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; line-height:1.2rem; font-size:1rem; border-top:1px solid #e1e1e1; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list:first-child { margin:0px; border:0px;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list .dec-box-list-L { width:65px; margin:0px; padding:0px; text-align:right; color:#595959;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list .dec-box-list-R { width:calc(100% - 70px); margin:0px; padding:0px; text-align:left; color:#1591BC;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list.dec-01 .dec-box-list-L { width:75px; margin:0px; padding:0px; text-align:right; color:#595959;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list.dec-01 .dec-box-list-R { width:calc(100% - 80px); margin:0px; padding:0px; text-align:left; color:#787878;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list .dec-box-list-wholeT { width:calc(100% - 0px); margin:0px; padding:0px 5px 5px 5px; text-align:left; color:#595959;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list .dec-box-list-wholeB { width:calc(100% - 0px); margin:0px; padding:0px; text-align:left; color:#1591BC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important;justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} /*start - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list-Note*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list-Note { width:calc(100% - 0px); margin:0px; padding:5px 0px; color:#adadad; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list-Note .dec-ic { margin:0px; padding:0px; display:inline-block;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list-Note .dec-type { max-width:calc(100% - 25px); margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; word-break:break-all;} /*end - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list-Note*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-img { width:calc(100% - 0px); min-height:213px; background:url("../images/sample/img_video_none.svg"); background-position:center; background-repeat:no-repeat; background-blend-mode:darken;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list .dec-item { margin:0px; padding:2px 5px; width:calc((100%/4) - 0px); border:1px solid transparent; border-radius:0.25rem;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-box-list .dec-item:hover { background:#fcfbe0; border:1px solid transparent; color:#0080a2;} /*start - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-TrafficLight-Area*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-TrafficLight-Area { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-TrafficLight-Area .dec-TrafficLight-Box { margin:0px auto; padding:5px; border-radius:35px; color:#FFFFFF; background:#595959; border:1px solid #595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-TrafficLight-Area .dec-item { margin:0px; margin-left:5px; padding:0px; width:35px; height:35px; border-radius:25px; border:1px solid #595959; color:#FFFFFF; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-TrafficLight-Area .dec-item:first-child { margin-left:0px;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-TrafficLight-Area .dec-item.dec-Light-Red { background: #ff0000;} /*紅燈*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-TrafficLight-Area .dec-item.dec-Light-Yellow { background:#fccf00;} /*黃燈*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-TrafficLight-Area .dec-item.dec-Light-Green { background: #72bf44;} /*綠燈*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-TrafficLight-Area .dec-item .dec-type { color:#FFFFFF; font-size:16px; font-weight:500; margin:0px; padding:0px;} /*end - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .dec-TrafficLight-Area*/ /*start - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-POI*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-POI { width:280px; height:auto; padding-bottom:5px; position:absolute; left:415px; right:auto; top:270px;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-POI .dec-box-list { width:calc(100% - 0px); margin:0px; padding:7px 0px; line-height:1.2rem; font-size:1rem; border-top:1px solid #e1e1e1; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-POI .dec-box-list:first-child { margin:0px; border:0px;} /*end - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-POI*/ /*start - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-TrafficLight*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-TrafficLight { width:280px; height:auto; left:315px; right:auto; top:270px; padding-bottom:5px; position:absolute;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-TrafficLight .dec-box-list { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; line-height:1.2rem; font-size:1rem; border-top:1px solid #e1e1e1; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-TrafficLight .dec-box-list:first-child { margin:0px; border:0px;} /*end - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-TrafficLight*/ /*start - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-Video*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-Video.dec-position-sample { left:615px; right:auto; top:270px;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-Video { width:330px; left:auto; right:auto; top:auto; padding-bottom:5px; height:auto; position:absolute;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-Video .dec-box-list { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; line-height:1.2rem; font-size:1rem; border-top:1px solid #e1e1e1; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-Video .dec-box-list:first-child { margin:0px; border:0px;} /*end - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-Video*/ .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .box-inner .con-top .con-top-title { width:calc(100% - 30px);} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .box-inner .con-top .con-top-title .dec-type { width:calc(100% - 85px); word-break:break-all;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .box-inner .con-top .con-top-btn { width:25px;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .con-top-title a.dec-btn, .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .con-top-title a.dec-btn:hover{ margin-left:auto; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .con-top-title a.dec-btn { background:transparent; color:#787878;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .con-top-title a.dec-btn:hover { background:#fafafa; color:#169cbf;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow .box-inner .con-top-title .dec-ic { margin:0px;} /*end - .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow ----------------------------------------------------------------*/ /*start - .colorPickerArea.dec-Measure .box-Opacity-area ----------------------------------------------------------------*/ .colorPickerArea.dec-Measure .box-Opacity-area { width:calc(100% - 55px); margin:0px; margin-left:auto; padding:0px; background:#fafafa; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-line-pack: start !important; align-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .colorPickerArea.dec-Measure .box-Opacity-area .box-Opacity-text { width:85px; margin:0px 5px 0px 0px; padding:0px; font-size:0.9rem; line-height:1.2rem;} .colorPickerArea.dec-Measure .box-Opacity-area .box-Opacity-text span { color:#776744; font-size:1rem; line-height:1.2rem;} .colorPickerArea.dec-Measure .box-Opacity-area .box-Opacity-range { width:calc(100% - 95px); margin:0px; padding:0px;} .colorPickerArea.dec-Measure .slidecontainer { width:100%; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .colorPickerArea.dec-Measure .slider { -webkit-appearance:none; width:100%; height:2px; background:#d3d3d3; outline:none; opacity:0.7; -webkit-transition:.2s; transition:opacity .2s;} .colorPickerArea.dec-Measure .slider:hover { opacity:1;} .colorPickerArea.dec-Measure .slider::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:15px; height:15px; background:#d9a20c; cursor:pointer; border-radius:15px;} .colorPickerArea.dec-Measure .slider::-moz-range-thumb { width:15px; height:15px; background:#d9a20c; cursor:pointer; border-radius:15px;} .colorPickerArea.dec-Measure .dec-checkBox-area { width:calc(100% - 0px); margin:0px; padding:0.5rem 0.5rem 0.5rem 1.5rem;} /*start - .colorPickerArea.dec-Measure.dec-TrackSearch-Time*/ .colorPickerArea.dec-Measure.dec-TrackSearch-Time .box-Opacity-area { width:calc(100% - 0px); padding:5px 0px; background:transparent;} .colorPickerArea.dec-Measure.dec-TrackSearch-Time .box-Opacity-area .box-Opacity-text { width:105px; margin:0px 5px 0px 0px; padding:0px; font-size:0.9rem; line-height:1.2rem; text-align:right;} .colorPickerArea.dec-Measure.dec-TrackSearch-Time .box-Opacity-area .box-Opacity-range { width:calc(100% - 110px); margin:0px; padding:0px;} /*end - .colorPickerArea.dec-Measure.dec-TrackSearch-Time*/ /*start - .colorPickerArea.dec-Measure.dec-POI ----------------------------------------------------------------*/ .colorPickerArea.dec-Measure.dec-POI { width:auto; margin:5px 0px 0px 0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .colorPickerArea.dec-Measure.dec-POI .box-Opacity-area .box-Opacity-text { width:80px;} .colorPickerArea.dec-Measure.dec-POI .box-Opacity-area { width:calc(100% - 150px); margin:0px; margin-left:5px; padding:0px; background:#fafafa; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-line-pack: start !important; align-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .colorPickerArea.dec-Measure.dec-POI .dec-checkBox-area { width:90px; margin-left:5px; position:relative;} .div-MapTool-FunctionArea-Measure-FillStyle-POI-Showhide-Route { width:calc(100% - 0px); margin:0px; padding:0px;} .div-MapTool-FunctionArea-Measure-FillStyle-POI-Showhide-Route .con-inner { margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} /*end - .colorPickerArea.dec-Measure.dec-POI ----------------------------------------------------------------*/ /*end - .colorPickerArea.dec-Measure .box-Opacity-area ----------------------------------------------------------------*/ /*start - .typeArea -----------------------------------------------------------------------------*/ .typeArea { width:auto; margin:5px 0px 0px 0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .typeArea .dec-info { width:calc(100% - 0px); margin:0px; padding:10px 0px 5px 0px; color:#595959; font-size:1rem; line-height:1.2rem; display: -ms-flexbox !important; display: flex !important;} .typeArea .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px;} /*end - .typeArea -----------------------------------------------------------------------------*/ /*start - .colorPickerArea.dec-Measure -----------------------------------------------------------------------------*/ .div-MapTool-FunctionArea-Measure-FillStyle, .div-MapTool-FunctionArea-Measure-typeStyle { width:calc(100% - 0px); margin:0px; padding:0px; height:65px;} .div-MapTool-FunctionArea-Measure-blankArea { width:calc(100% - 0px); margin:0px; padding:0px; height:31px;} .colorPickerArea.dec-Measure { width:auto; margin:5px 0px 0px 0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .colorPickerArea.dec-Measure .dec-info { width:calc(100% - 0px); margin:0px; padding:10px 0px 5px 0px; color:#595959; font-size:1rem; line-height:1.2rem;} .colorPickerArea.dec-Measure a.btn-colorPicker-box { width:auto; margin:0px; padding:3px 20px 3px 2px; position:relative; background:#fafafa; border-radius:0.25rem; border:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-line-pack: start !important; align-content: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .colorPickerArea.dec-Measure a.btn-colorPicker-box:hover { background:#FFFFFF;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker:hover, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker:focus, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker.is-active, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker.is-active:hover { width:25px; height:25px; margin:0px; padding:1px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .colorPickerArea.dec-Measure a.btn-colorPicker-box > div:after { display:block; position:absolute; height:0; width:0; border-top:7px solid #999999; border-left:5px solid transparent; border-right:5px solid transparent; content:''; top:12px; left:30px;} .colorPickerArea.dec-Measure a.btn-colorPicker-box:hover > div:after { content:''; display:block; position:absolute; height:0; width:0; border-top:7px solid #595959; border-left:5px solid transparent; border-right:5px solid transparent; top:12px; left:30px;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker { border:1px solid #999999; border-color:#e6e6e6 #fafafa #fafafa #e6e6e6;} .colorPickerArea.dec-Measure a.btn-colorPicker-box:hover .btn-colorPicker {} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-01, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-02, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-03, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-04, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-05, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-06, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-07, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-08, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-09, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-10, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-11, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-12, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-13, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-14, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-15, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-16, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-17, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-18, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-19, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-20, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-21, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-22, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-23, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-24, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-25, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-26, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-27, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-28, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-29, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-30, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-31, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-32, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-33, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-34, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-35, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-36, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-37, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-38, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-39, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-40, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-41, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-42, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-43, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-44, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-45, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-46, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-47, .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-48 { margin:0px; padding:0px; width:21px; height:21px; overflow:hidden;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-01 { background:#000000;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-02 { background:#ff0000;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-03 { background:#ffff00;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-04 { background:#00ff00;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-05 { background:#00ffff;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-06 { background:#0000ff;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-07 { background:#ff00ff;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-08 { background:#c1272d;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-09 { background:#ed1c24;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-10 { background:#f15a24;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-11 { background:#f7931e;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-12 { background:#fbb03b;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-13 { background:#fcee21;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-14 { background:#d9e021;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-15 { background:#8cc63f;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-16 { background:#39b54a;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-17 { background:#009245;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-18 { background:#006837;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-19 { background:#22b573;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-20 { background:#00a99d;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-21 { background:#29abe2;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-22 { background:#0071bc;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-23 { background:#2e3192;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-24 { background:#1b1464;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-25 { background:#662d91;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-26 { background:#93278f;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-27 { background:#9e005d;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-28 { background:#d4145a;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-29 { background:#ed1e79;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-30 { background:#c7b299;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-31 { background:#998675;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-32 { background:#736357;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-33 { background:#534741;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-34 { background:#c69c6d;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-35 { background:#a67c52;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-36 { background:#8c6239;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-37 { background:#754c24;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-38 { background:#603813;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-39 { background:#42210b;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-40 { background:#ee835c;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-41 { background:#f4af8f;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-42 { background:#fccf00;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-43 { background:#b4af7d;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-44 { background:#ddd36e;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-45 { background:#bac570;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-46 { background:#b7caba;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-47 { background:#50a8b4;} .colorPickerArea.dec-Measure a.btn-colorPicker-box .btn-colorPicker .dec-ic-DrawTool-Color-48 { background:#718bc6;} /*end - .colorPickerArea.dec-Measure -----------------------------------------------------------------------------*/ /*start - .colorPickerArea -----------------------------------------------------------------------------*/ .colorPickerArea { width:calc(100% - 0px); margin:0px; padding:0px;} .colorPickerArea .btn-colorPicker-box { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-line-pack: start !important; align-content: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .colorPickerArea .textbox-colorPicker { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker:hover, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker:focus, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker.is-active, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker.is-active:hover { width:25px; height:25px; margin:0px 5px 5px 0px; padding:1px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker { border:1px solid #999999; border-color:#e6e6e6 #fafafa #fafafa #e6e6e6;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker:hover, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker:focus, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker.is-active, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker.is-active:hover { border:1px solid #595959; border-color:#595959 #999999 #999999 #595959;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-01, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-02, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-03, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-04, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-05, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-06, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-07, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-08, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-09, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-10, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-11, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-12, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-13, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-14, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-15, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-16, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-17, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-18, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-19, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-20, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-21, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-22, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-23, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-24, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-25, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-26, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-27, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-28, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-29, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-30, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-31, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-32, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-33, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-34, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-35, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-36, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-37, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-38, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-39, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-40, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-41, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-42, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-43, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-44, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-45, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-46, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-47, .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-48 { margin:0px; padding:0px; width:21px; height:21px; overflow:hidden;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-01 { background:#000000;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-02 { background:#ff0000;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-03 { background:#ffff00;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-04 { background:#00ff00;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-05 { background:#00ffff;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-06 { background:#0000ff;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-07 { background:#ff00ff;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-08 { background:#c1272d;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-09 { background:#ed1c24;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-10 { background:#f15a24;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-11 { background:#f7931e;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-12 { background:#fbb03b;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-13 { background:#fcee21;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-14 { background:#d9e021;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-15 { background:#8cc63f;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-16 { background:#39b54a;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-17 { background:#009245;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-18 { background:#006837;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-19 { background:#22b573;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-20 { background:#00a99d;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-21 { background:#29abe2;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-22 { background:#0071bc;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-23 { background:#2e3192;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-24 { background:#1b1464;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-25 { background:#662d91;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-26 { background:#93278f;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-27 { background:#9e005d;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-28 { background:#d4145a;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-29 { background:#ed1e79;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-30 { background:#c7b299;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-31 { background:#998675;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-32 { background:#736357;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-33 { background:#534741;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-34 { background:#c69c6d;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-35 { background:#a67c52;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-36 { background:#8c6239;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-37 { background:#754c24;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-38 { background:#603813;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-39 { background:#42210b;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-40 { background:#ee835c;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-41 { background:#f4af8f;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-42 { background:#fccf00;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-43 { background:#b4af7d;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-44 { background:#ddd36e;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-45 { background:#bac570;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-46 { background:#b7caba;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-47 { background:#50a8b4;} .colorPickerArea .btn-colorPicker-box a.btn-colorPicker .dec-ic-DrawTool-Color-48 { background:#718bc6;} .colorPickerArea .textbox-colorPicker .box-L, .colorPickerArea .textbox-colorPicker .box-R { margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .colorPickerArea .textbox-colorPicker .box-L { width:90px; -ms-flex-pack: end !important; justify-content: flex-end !important;} .colorPickerArea .textbox-colorPicker .box-R { width:calc(100% - 97px);} /*end - .colorPickerArea -----------------------------------------------------------------------------*/ /*start - .ic-camCondition-connected... ------------------------------------------*/ /*CAM狀態：01.正常連線: .ic-camCondition-connected, 02.未安裝或不正常連線: .ic-camCondition-disconnected*/ .ic-camCondition-connected { width:18px; height:18px; background:transparent; margin:0px; padding:0px; display:block; position:relative; overflow:hidden;} .ic-camCondition-connected .dec-a01 { color:#787878; margin:0px; padding:0px; position:absolute; top:0px; left:0px; width:15px; height:15px;} .ic-camCondition-connected .dec-a02 { color:#FFFFFF; margin:0px; padding:0px; position:absolute; top:2px; left:2px; width:11px; height:11px;} .ic-camCondition-connected .dec-a03 { color:#787878; margin:0px; padding:0px; position:absolute; top:4px; left:4px; width:7px; height:7px;} .ic-camCondition-connected .dec-b01 { color:#787878; margin:0px; padding:0px; position:absolute; top:7px; left:0px; width:16px; height:16px;} .ic-camCondition-connected .dec-c01 { color:#009245; margin:0px; padding:0px; position:absolute; top:8px; left:8px; width:10px; height:10px;} .ic-camCondition-connected .dec-c02 { color:#39b54a; margin:0px; padding:0px; position:absolute; top:9px; left:9px; width:8px; height:8px;} .ic-camCondition-connected .dec-c03 { color:#FFFFFF; margin:0px; padding:0px; position:absolute; top:10px; left:10px; width:6px; height:6px;} .ic-camCondition-disconnected { width:18px; height:18px; background:transparent; margin:0px; padding:0px; display:block; position:relative; overflow:hidden;} .ic-camCondition-disconnected .dec-a01 { color:#CCCCCC; margin:0px; padding:0px; position:absolute; top:0px; left:0px; width:15px; height:15px;} .ic-camCondition-disconnected .dec-a02 { color:#FFFFFF; margin:0px; padding:0px; position:absolute; top:2px; left:2px; width:11px; height:11px;} .ic-camCondition-disconnected .dec-a03 { color:#CCCCCC; margin:0px; padding:0px; position:absolute; top:4px; left:4px; width:7px; height:7px;} .ic-camCondition-disconnected .dec-b01 { color:#CCCCCC; margin:0px; padding:0px; position:absolute; top:7px; left:0px; width:16px; height:16px;} .ic-camCondition-disconnected .dec-c01 { color:#ed1c24; margin:0px; padding:0px; position:absolute; top:8px; left:8px; width:10px; height:10px;} .ic-camCondition-disconnected .dec-c02 { color:#f15a24; margin:0px; padding:0px; position:absolute; top:9px; left:9px; width:8px; height:8px;} .ic-camCondition-disconnected .dec-c03 { color:#FFFFFF; margin:0px; padding:0px; position:absolute; top:9px; left:9px; width:8px; height:8px;} /*end - .ic-camCondition-connected... ------------------------------------------*/ /*start - .ic-arrow (in use) --------------------------------------------------------------------------------------*/ .ic-arrow.dec-ic-carCondition-driving, .ic-arrow.dec-ic-carCondition-speeding, .ic-arrow.dec-ic-carCondition-idling, .ic-arrow.dec-ic-carCondition-parked, .ic-arrow.dec-ic-carCondition-flameout, .ic-arrow.dec-ic-carCondition-outage, .ic-arrow.dec-ic-carCondition-offline { background-image:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:0 -1499px; background-repeat:no-repeat; margin:0px; padding:0px; width:18px; height:18px; display:inline-block; vertical-align:text-bottom; border-radius:25px;} .ic-arrow.dec-ic-carCondition-driving { background-color:#0089ff;} .ic-arrow.dec-ic-carCondition-speeding { background-color:#ff0000;} .ic-arrow.dec-ic-carCondition-idling { background-color:#f7931e;} .ic-arrow.dec-ic-carCondition-parked { background-color:#e8528d;} .ic-arrow.dec-ic-carCondition-flameout { background-color:#787878;} .ic-arrow.dec-ic-carCondition-outage { background-color:#b3b3b3;} .ic-arrow.dec-ic-carCondition-offline { background-color:#b3b3b3;} .ic-arrow.dec-ic-carCondition-driving.dec-truck, .ic-arrow.dec-ic-carCondition-speeding.dec-truck, .ic-arrow.dec-ic-carCondition-idling.dec-truck, .ic-arrow.dec-ic-carCondition-parked.dec-truck, .ic-arrow.dec-ic-carCondition-flameout.dec-truck, .ic-arrow.dec-ic-carCondition-outage.dec-truck, .ic-arrow.dec-ic-carCondition-offline.dec-truck { background-image:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:-340px -34px; background-repeat:no-repeat; margin:0px; padding:0px; width:18px; height:18px; display:inline-block; vertical-align:text-bottom; border-radius:25px;} .ic-arrow.dec-ic-carCondition-driving.dec-car, .ic-arrow.dec-ic-carCondition-speeding.dec-car, .ic-arrow.dec-ic-carCondition-idling.dec-car, .ic-arrow.dec-ic-carCondition-parked.dec-car, .ic-arrow.dec-ic-carCondition-flameout.dec-car, .ic-arrow.dec-ic-carCondition-outage.dec-car, .ic-arrow.dec-ic-carCondition-offline.dec-car { background-image:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:0 -238px; background-repeat:no-repeat; margin:0px; padding:0px; width:18px; height:18px; display:inline-block; vertical-align:text-bottom; border-radius: 25px;} .ic-arrow.dec-ic-carCondition-driving.dec-selfDriving, .ic-arrow.dec-ic-carCondition-speeding.dec-selfDriving, .ic-arrow.dec-ic-carCondition-idling.dec-selfDriving, .ic-arrow.dec-ic-carCondition-parked.dec-selfDriving, .ic-arrow.dec-ic-carCondition-flameout.dec-selfDriving, .ic-arrow.dec-ic-carCondition-outage.dec-selfDriving, .ic-arrow.dec-ic-carCondition-offline.dec-selfDriving { background-image:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:-442px 0; background-repeat:no-repeat; margin:0px; padding:0px; width:18px; height: 18px; display:inline-block; vertical-align:text-bottom; border-radius: 25px;} /*end - .ic-arrow (in use) --------------------------------------------------------------------------------------*/ /*start - .dec-ic-layering -----------------------------------------------------------------------------*/ .dec-ic-layering { font-size: 1.5rem;} .dec-ic-layering.dec-Color-BlockedTraffic-fill { color:#ed1c24;} .dec-ic-layering.dec-Color-BlockedTraffic-outline { color:#FFFFFF;} /*start - dec-ic-carCondition -----------------------------------------------------------------------------*/ /* #0089ff (0, 137, 255) 車輛狀態/行駛｜carCondition-driving #ff0000 (255, 0, 0) 車輛狀態/超速｜carCondition-speeding #f7931e (247, 147, 30) 車輛狀態/停留｜carCondition-idling #e8528d (232, 82, 147) 車輛狀態/怠速｜carCondition-parked #787878 (120, 120, 120) 車輛狀態/熄火｜carCondition-flameout #b3b3b3 (179, 179, 179) 車輛狀態/斷訊｜carCondition-outage #b3b3b3 (179, 179, 179) 車輛狀態/離線｜carCondition-offline */ .dec-ic-layering.dec-ic-carCondition-driving-01 { color:#0089ff; font-size:1.3rem;} .dec-ic-layering.dec-ic-carCondition-driving-02 { color:#FFFFFF; font-size:0.7rem;} .dec-ic-layering.dec-ic-carCondition-speeding-01 { color:#ff0000; font-size:1.3rem;} .dec-ic-layering.dec-ic-carCondition-speeding-02 { color:#FFFFFF; font-size:0.7rem;} .dec-ic-layering.dec-ic-carCondition-idling-01 { color:#f7931e; font-size:1.3rem;} .dec-ic-layering.dec-ic-carCondition-idling-02 { color:#FFFFFF; font-size:0.7rem;} .dec-ic-layering.dec-ic-carCondition-parked-01 { color:#e8528d; font-size:1.3rem;} .dec-ic-layering.dec-ic-carCondition-parked-02 { color:#FFFFFF; font-size:0.7rem;} .dec-ic-layering.dec-ic-carCondition-flameout-01 { color:#787878; font-size:1.3rem;} .dec-ic-layering.dec-ic-carCondition-flameout-02 { color:#FFFFFF; font-size:0.7rem;} .dec-ic-layering.dec-ic-carCondition-outage-01 { color:#b3b3b3; font-size:1.3rem;} .dec-ic-layering.dec-ic-carCondition-outage-02 { color:#FFFFFF; font-size:0.7rem;} .dec-ic-layering.dec-ic-carCondition-offline-01 { color:#b3b3b3; font-size:1.3rem;} .dec-ic-layering.dec-ic-carCondition-offline-02 { color:#FFFFFF; font-size:0.7rem;} /*end - dec-ic-carCondition -----------------------------------------------------------------------------*/ /*start - .dec-type-carCondition -----------------------------------------------------------------------------*/ /*#0089ff (0, 137, 255) 車輛狀態/行駛｜dec-type-carCondition-driving #ff0000 (255, 0, 0) 車輛狀態/超速｜dec-type-carCondition-speeding #f7931e (247, 147, 30) 車輛狀態/停留｜dec-type-carCondition-idling #e8528d (232, 82, 147) 車輛狀態/怠速｜dec-type-carCondition-parked #787878 (120, 120, 120) 車輛狀態/熄火｜dec-type-carCondition-flameout #b3b3b3 (179, 179, 179) 車輛狀態/斷訊｜dec-type-carCondition-outage #b3b3b3 (179, 179, 179) 車輛狀態/離線｜dec-type-carCondition-offline*/ .dec-type-carCondition-driving, .dec-type-carCondition-speeding, .dec-type-carCondition-idling, .dec-type-carCondition-parked, .dec-type-carCondition-flameout, .dec-type-carCondition-outage, .dec-type-carCondition-offline { font-size:1rem; margin:0px 0px 0px 5px; padding:4px 8px; color:#FFFFFF; border-radius:25px;} .dec-type-carCondition-driving { background:#0089ff;} .dec-type-carCondition-speeding { background:#ff0000;} .dec-type-carCondition-idling { background:#f7931e;} .dec-type-carCondition-parked { background:#e8528d;} .dec-type-carCondition-flameout { background:#787878;} .dec-type-carCondition-outage { background:#b3b3b3;} .dec-type-carCondition-offline { background:#b3b3b3;} /*end - .dec-type-carCondition -----------------------------------------------------------------------------*/ /*start - .dec-type-ChargingPileCondition -----------------------------------------------------------------------------*/ /* 充電樁狀態/all｜#2ca6e0｜dec-ChargingPileCondition-all 充電樁狀態/充電中｜#0089ff｜dec-ChargingPileCondition-charging 充電樁狀態/未使用｜#787878｜dec-ChargingPileCondition-notInUse 充電樁狀態/故障｜#ED1C24｜dec-ChargingPileCondition-breakdown 充電樁狀態/未連線｜#b3b3b3｜dec-ChargingPileCondition-outage */ .dec-type-ChargingPileCondition-all, .dec-type-ChargingPileCondition-charging, .dec-type-ChargingPileCondition-notInUse, .dec-type-ChargingPileCondition-breakdown, .dec-type-ChargingPileCondition-outage { font-size:1rem; margin:0px 0px 0px 5px; padding:4px 8px; color:#FFFFFF; border-radius:25px;} .dec-type-ChargingPileCondition-all { background:#2ca6e0;} .dec-type-ChargingPileCondition-charging { background:#0089ff;} .dec-type-ChargingPileCondition-notInUse { background:#787878;} .dec-type-ChargingPileCondition-breakdown { background:#ED1C24;} .dec-type-ChargingPileCondition-outage { background:#b3b3b3;} /*end - .dec-type-ChargingPileCondition -----------------------------------------------------------------------------*/ a.icon-sprite.icon-ic_messageDots:hover { background:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:-238px -1702px;} /*start - .ic-box (new) --------------------------------------------------------------------------------------*/ .ic-box.dec-ic-missionCondition-B, .ic-box.dec-ic-missionCondition-C, .ic-box.dec-ic-missionCondition-D, .ic-box.dec-ic-missionCondition-E, .ic-box.dec-ic-missionCondition-F { background-image:url("../images/map/18x18px/img_m_marker_missionCondition_BW.svg"); background-size:contain; background-repeat:no-repeat; margin:0px; padding:0px; width:18px; height:18px; display:inline-block; vertical-align:text-bottom; border-radius:25px;} .ic-box.dec-ic-missionCondition-B { background-color:#b3b3b3; background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_B.svg");} .ic-box.dec-ic-missionCondition-C { background-color:#0089ff; background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_C.svg");} .ic-box.dec-ic-missionCondition-D { background-color:#39b54a; background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_D.svg");} .ic-box.dec-ic-missionCondition-E { background-color:#787878; background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_E.svg");} .ic-box.dec-ic-missionCondition-F { background-color:#f15a24; background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_F.svg");} /* XXX派遣狀態｜未派遣 #4e4e4e (78, 78, 78) dec-ic-missionCondition-A 派遣狀態｜1.未開始 #b3b3b3 (179, 179, 179) dec-ic-missionCondition-B 派遣狀態｜2.進行中 #0089ff (0, 137, 255) dec-ic-missionCondition-C 派遣狀態｜3.已配達 #39b54a (57, 181, 74) dec-ic-missionCondition-D 派遣狀態｜4.已取消 #787878 (120, 120, 120) dec-ic-missionCondition-E 派遣狀態｜5.異常 #f15a24 (241, 90, 36) dec-ic-missionCondition-F*/ /*end - .ic-box (in use) --------------------------------------------------------------------------------------*/ /*start - dec-ic-missionCondition -----------------------------------------------------------------------------*/ /* 進行中｜#0089ff｜(0, 137, 255) ｜dec-ic-missionCondition-A 異常｜#ff0000 ｜(255, 0, 0) ｜dec-ic-missionCondition-B 已完成｜#787878｜(120, 120, 120)｜dec-ic-missionCondition-C 未開始｜#b3b3b3｜(179, 179, 179)｜dec-ic-missionCondition-D */ .dec-ic-layering.dec-ic-missionCondition-A-01 { color:#0089ff; font-size:1.3rem;} .dec-ic-layering.dec-ic-missionCondition-A-02 { color:#FFFFFF; font-size:9px;} .dec-ic-layering.dec-ic-missionCondition-B-01 { color:#ff0000; font-size:1.3rem;} .dec-ic-layering.dec-ic-missionCondition-B-02 { color:#FFFFFF; font-size:0.8rem;} .dec-ic-layering.dec-ic-missionCondition-C-01 { color:#787878; font-size:1.3rem;} .dec-ic-layering.dec-ic-missionCondition-C-02 { color:#FFFFFF; font-size:0.8rem;} .dec-ic-layering.dec-ic-missionCondition-D-01 { color:#b3b3b3; font-size:1.3rem;} .dec-ic-layering.dec-ic-missionCondition-D-02 { color:#f0f0f0; font-size:0.8rem;} /*end - dec-ic-missionCondition -----------------------------------------------------------------------------*/ /*start - .dec-type-missionCondition 派遣狀態 -----------------------------------------------------------------------------*/ /* 派遣狀態｜1.未開始 #b3b3b3 (179, 179, 179) dec-type-missionCondition-B 派遣狀態｜2.進行中 #0089ff (0, 137, 255) dec-type-missionCondition-C 派遣狀態｜3.完成 #39b54a (57, 181, 74) dec-type-missionCondition-D */ .dec-type-missionCondition-B, .dec-type-missionCondition-C, .dec-type-missionCondition-D { font-size:1rem; margin:0px 0px 0px 5px; padding:4px 8px 6px 8px; color:#FFFFFF; border-radius:25px;} .dec-type-missionCondition-B { background:#b3b3b3;} .dec-type-missionCondition-C { background:#0089ff;} .dec-type-missionCondition-D { background:#39b54a;} /*end - .dec-type-missionCondition 派遣狀態 -----------------------------------------------------------------------------*/ /*start - 任務派遣/任務管理/任務狀態icon .ic-box.dec-ic-missionConditionN-A... --------------------------------------------------------------------------------------*/ /*5-1.物流任務狀態＆貨櫃任務狀態 1.未派遣｜#4e4e4e｜(78, 78, 78)｜dec-ic-missionConditionN-A 2.未開始｜#b3b3b3｜(179, 179, 179)｜dec-ic-missionConditionN-B 3.進行中｜#0089ff｜(0, 137, 255)｜dec-ic-missionConditionN-C 4.已配達｜#39b54a｜(57, 181, 74)｜dec-ic-missionConditionN-D 5.已取消｜#787878｜(120, 120, 120)｜dec-ic-missionConditionN-E 6.異常｜#f15a24｜(241, 90, 36)｜dec-ic-missionConditionN-F*/ .ic-box.dec-ic-missionConditionN-A, .ic-box.dec-ic-missionConditionN-B, .ic-box.dec-ic-missionConditionN-C, .ic-box.dec-ic-missionConditionN-D, .ic-box.dec-ic-missionConditionN-E, .ic-box.dec-ic-missionConditionN-F { background-size:contain; background-repeat:no-repeat; margin:0px; padding:0px; width:18px; height:18px; display:inline-block; vertical-align:text-bottom; border-radius:25px;} .ic-box.dec-ic-missionConditionN-A { background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_A_BW.svg");background-size:contain; background-repeat:no-repeat;} .ic-box.dec-ic-missionConditionN-B { background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_B_BW.svg");background-size:contain; background-repeat:no-repeat;} .ic-box.dec-ic-missionConditionN-C { background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_C_BW.svg");background-size:contain; background-repeat:no-repeat;} .ic-box.dec-ic-missionConditionN-D { background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_D_BW.svg");background-size:contain; background-repeat:no-repeat;} .ic-box.dec-ic-missionConditionN-E { background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_E_BW.svg");background-size:contain; background-repeat:no-repeat;} .ic-box.dec-ic-missionConditionN-F { background-image:url("../images/map/18x18px/img_m_marker_missionConditionN_F_BW.svg");background-size:contain; background-repeat:no-repeat;} .ic-box.dec-ic-missionConditionN-A { background-color:#4e4e4e;} .ic-box.dec-ic-missionConditionN-B { background-color:#b3b3b3;} .ic-box.dec-ic-missionConditionN-C { background-color:#0089ff;} .ic-box.dec-ic-missionConditionN-D { background-color:#39b54a;} .ic-box.dec-ic-missionConditionN-E { background-color:#787878;} .ic-box.dec-ic-missionConditionN-F { background-color:#f15a24;} .type-box { margin-left:2px; color:#595959;} .type-box .dec-color-normal { color:#595959;} .type-box .dec-color-emphasis { color:#ed1c24;} .type-box.dec-detail { margin-left:2px; color:#FFFFFF;} .type-box.dec-detail .dec-color-normal { color:#FFFFFF;} .type-box.dec-detail .dec-color-emphasis { color:#fccf00;} /*end - 任務派遣/任務管理/任務狀態icon .ic-box.dec-ic-missionConditionN-A... --------------------------------------------------------------------------------------*/ /*end - .dec-ic-layering -----------------------------------------------------------------------------*/ /*start - .dec-ic-layering.dec-Color-Polygon-fill & outline -----------------------------------------------------------------------------*/ .dec-ic-layering.dec-Color-Polygon-fill-01 { color:rgba(0, 0, 0, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-01 { color:#000000;} .dec-ic-layering.dec-Color-Polygon-fill-02 { color:rgba(255, 0, 0, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-02 { color:#ff0000;} .dec-ic-layering.dec-Color-Polygon-fill-03 { color:rgba(255, 255, 0, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-03 { color:#ffff00;} .dec-ic-layering.dec-Color-Polygon-fill-04 { color:rgba(0, 255, 0, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-04 { color:#00ff00;} .dec-ic-layering.dec-Color-Polygon-fill-05 { color:rgba(0, 255, 255, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-05 { color:#00ffff;} .dec-ic-layering.dec-Color-Polygon-fill-06 { color:rgba(0, 0, 255, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-06 { color:#0000ff;} .dec-ic-layering.dec-Color-Polygon-fill-07 { color:rgba(255, 0, 255, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-07 { color:#ff00ff;} .dec-ic-layering.dec-Color-Polygon-fill-08 { color:rgba(193, 39, 45, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-08 { color:#c1272d;} .dec-ic-layering.dec-Color-Polygon-fill-09 { color:rgba(237, 28, 36, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-09 { color:#ed1c24;} .dec-ic-layering.dec-Color-Polygon-fill-10 { color:rgba(241, 90, 36, 0.5);} .dec-ic-layering.dec-Color-Polygon-fill-11 { color:rgba(247, 147, 30, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-11 { color:#f7931e;} .dec-ic-layering.dec-Color-Polygon-fill-12 { color:rgba(251, 176, 59, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-12 { color:#fbb03b;} .dec-ic-layering.dec-Color-Polygon-fill-13 { color:rgba(252, 238, 33, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-13 { color:#fcee21;} .dec-ic-layering.dec-Color-Polygon-fill-14 { color:rgba(217, 224, 33, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-14 { color:#d9e021;} .dec-ic-layering.dec-Color-Polygon-fill-15 { color:rgba(140, 198, 63, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-15 { color:#8cc63f;} .dec-ic-layering.dec-Color-Polygon-fill-16 { color:rgba(57, 181, 74, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-16 { color:#39b54a;} .dec-ic-layering.dec-Color-Polygon-fill-17 { color:rgba(0, 146, 69, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-17 { color:#009245;} .dec-ic-layering.dec-Color-Polygon-fill-18 { color:rgba(0,104, 55, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-18 { color:#006837;} .dec-ic-layering.dec-Color-Polygon-fill-19 { color:rgba(34, 181, 115, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-19 { color:#22b573;} .dec-ic-layering.dec-Color-Polygon-fill-20 { color:rgba(0, 169, 157, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-20 { color:#00a99d;} .dec-ic-layering.dec-Color-Polygon-fill-21 { color:rgba(41, 171, 226, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-21 { color:#29abe2;} .dec-ic-layering.dec-Color-Polygon-fill-22 { color:rgba(0, 113, 188, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-22 { color:#0071bc;} .dec-ic-layering.dec-Color-Polygon-fill-23 { color:rgba(46, 49, 146, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-23 { color:#2e3192;} .dec-ic-layering.dec-Color-Polygon-fill-24 { color:rgba(27, 20, 100, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-24 { color:#1b1464;} .dec-ic-layering.dec-Color-Polygon-fill-25 { color:rgba(102, 45, 145, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-25 { color:#662d91;} .dec-ic-layering.dec-Color-Polygon-fill-26 { color:rgba(147, 39, 143, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-26 { color:#93278f;} .dec-ic-layering.dec-Color-Polygon-fill-27 { color:rgba(158, 0, 93, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-27 { color:#9e005d;} .dec-ic-layering.dec-Color-Polygon-fill-28 { color:rgba(212, 20, 90, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-28 { color:#d4145a;} .dec-ic-layering.dec-Color-Polygon-fill-29 { color:rgba(237, 30, 121, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-29 { color:#ed1e79;} .dec-ic-layering.dec-Color-Polygon-fill-30 { color:rgba(199, 178, 153, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-30 { color:#c7b299;} .dec-ic-layering.dec-Color-Polygon-fill-31 { color:rgba(153, 134, 117, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-31 { color:#998675;} .dec-ic-layering.dec-Color-Polygon-fill-32 { color:rgba(115, 99, 87, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-32 { color:#736357;} .dec-ic-layering.dec-Color-Polygon-fill-33 { color:rgba(83, 71, 65, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-33 { color:#534741;} .dec-ic-layering.dec-Color-Polygon-fill-34 { color:rgba(198, 156, 109, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-34 { color:#c69c6d;} .dec-ic-layering.dec-Color-Polygon-fill-35 { color:rgba(166, 124, 82, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-35 { color:#a67c52;} .dec-ic-layering.dec-Color-Polygon-fill-36 { color:rgba(140, 98, 57, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-36 { color:#8c6239;} .dec-ic-layering.dec-Color-Polygon-fill-37 { color:rgba(117, 76, 36, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-37 { color:#754c24;} .dec-ic-layering.dec-Color-Polygon-fill-38 { color:rgba(96, 56, 19, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-38 { color:#603813;} .dec-ic-layering.dec-Color-Polygon-fill-39 { color:rgba(66, 33, 11, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-39 { color:#42210b;} .dec-ic-layering.dec-Color-Polygon-fill-40 { color:rgba(238, 131, 92, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-40 { color:#ee835c;} .dec-ic-layering.dec-Color-Polygon-fill-41 { color:rgba(244, 175, 143, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-41 { color:#f4af8f;} .dec-ic-layering.dec-Color-Polygon-fill-42 { color:rgba(252, 207, 0, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-42 { color:#fccf00;} .dec-ic-layering.dec-Color-Polygon-fill-43 { color:rgba(180, 175, 125, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-43 { color:#b4af7d;} .dec-ic-layering.dec-Color-Polygon-fill-44 { color:rgba(221, 211, 110, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-44 { color:#ddd36e;} .dec-ic-layering.dec-Color-Polygon-fill-45 { color:rgba(186, 197, 112, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-45 { color:#bac570;} .dec-ic-layering.dec-Color-Polygon-fill-46 { color:rgba(183, 202, 186, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-46 { color:#b7caba;} .dec-ic-layering.dec-Color-Polygon-fill-47 { color:rgba(80, 168, 180, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-47 { color:#50a8b4;} .dec-ic-layering.dec-Color-Polygon-fill-48 { color:rgba(113, 139, 198, 0.5);} .dec-ic-layering.dec-Color-Polygon-outline-48 { color:#718bc6;} /*end - .dec-ic-layering.dec-Color-Polygon-fill & outline -----------------------------------------------------------------------------*/ /*start - .dec-ic-layering.dec-Color-Point-fill & outline -----------------------------------------------------------------------------*/ .dec-ic-layering.dec-Color-Point-fill-01, .dec-ic-layering.dec-Color-Point-outline-01, .dec-ic-layering.dec-Color-Point-fill-02, .dec-ic-layering.dec-Color-Point-outline-02, .dec-ic-layering.dec-Color-Point-fill-03, .dec-ic-layering.dec-Color-Point-outline-03, .dec-ic-layering.dec-Color-Point-fill-04, .dec-ic-layering.dec-Color-Point-outline-04, .dec-ic-layering.dec-Color-Point-fill-05, .dec-ic-layering.dec-Color-Point-outline-05, .dec-ic-layering.dec-Color-Point-fill-06, .dec-ic-layering.dec-Color-Point-outline-06, .dec-ic-layering.dec-Color-Point-fill-07, .dec-ic-layering.dec-Color-Point-outline-07, .dec-ic-layering.dec-Color-Point-fill-08, .dec-ic-layering.dec-Color-Point-outline-08, .dec-ic-layering.dec-Color-Point-fill-09, .dec-ic-layering.dec-Color-Point-outline-09, .dec-ic-layering.dec-Color-Point-fill-10, .dec-ic-layering.dec-Color-Point-outline-10, .dec-ic-layering.dec-Color-Point-fill-11, .dec-ic-layering.dec-Color-Point-outline-11, .dec-ic-layering.dec-Color-Point-fill-12, .dec-ic-layering.dec-Color-Point-outline-12, .dec-ic-layering.dec-Color-Point-fill-13, .dec-ic-layering.dec-Color-Point-outline-13, .dec-ic-layering.dec-Color-Point-fill-14, .dec-ic-layering.dec-Color-Point-outline-14, .dec-ic-layering.dec-Color-Point-fill-15, .dec-ic-layering.dec-Color-Point-outline-15, .dec-ic-layering.dec-Color-Point-fill-16, .dec-ic-layering.dec-Color-Point-outline-16, .dec-ic-layering.dec-Color-Point-fill-17, .dec-ic-layering.dec-Color-Point-outline-17, .dec-ic-layering.dec-Color-Point-fill-18, .dec-ic-layering.dec-Color-Point-outline-18, .dec-ic-layering.dec-Color-Point-fill-19, .dec-ic-layering.dec-Color-Point-outline-19, .dec-ic-layering.dec-Color-Point-fill-20, .dec-ic-layering.dec-Color-Point-outline-20, .dec-ic-layering.dec-Color-Point-fill-21, .dec-ic-layering.dec-Color-Point-outline-21, .dec-ic-layering.dec-Color-Point-fill-22, .dec-ic-layering.dec-Color-Point-outline-22, .dec-ic-layering.dec-Color-Point-fill-23, .dec-ic-layering.dec-Color-Point-outline-23, .dec-ic-layering.dec-Color-Point-fill-24, .dec-ic-layering.dec-Color-Point-outline-24, .dec-ic-layering.dec-Color-Point-fill-25, .dec-ic-layering.dec-Color-Point-outline-25, .dec-ic-layering.dec-Color-Point-fill-26, .dec-ic-layering.dec-Color-Point-outline-26, .dec-ic-layering.dec-Color-Point-fill-27, .dec-ic-layering.dec-Color-Point-outline-27, .dec-ic-layering.dec-Color-Point-fill-28, .dec-ic-layering.dec-Color-Point-outline-28, .dec-ic-layering.dec-Color-Point-fill-29, .dec-ic-layering.dec-Color-Point-outline-29, .dec-ic-layering.dec-Color-Point-fill-30, .dec-ic-layering.dec-Color-Point-outline-30, .dec-ic-layering.dec-Color-Point-fill-31, .dec-ic-layering.dec-Color-Point-outline-31, .dec-ic-layering.dec-Color-Point-fill-32, .dec-ic-layering.dec-Color-Point-outline-32, .dec-ic-layering.dec-Color-Point-fill-33, .dec-ic-layering.dec-Color-Point-outline-33, .dec-ic-layering.dec-Color-Point-fill-34, .dec-ic-layering.dec-Color-Point-outline-34, .dec-ic-layering.dec-Color-Point-fill-35, .dec-ic-layering.dec-Color-Point-outline-35, .dec-ic-layering.dec-Color-Point-fill-36, .dec-ic-layering.dec-Color-Point-outline-36, .dec-ic-layering.dec-Color-Point-fill-37, .dec-ic-layering.dec-Color-Point-outline-37, .dec-ic-layering.dec-Color-Point-fill-38, .dec-ic-layering.dec-Color-Point-outline-38, .dec-ic-layering.dec-Color-Point-fill-39, .dec-ic-layering.dec-Color-Point-outline-39, .dec-ic-layering.dec-Color-Point-fill-40, .dec-ic-layering.dec-Color-Point-outline-40, .dec-ic-layering.dec-Color-Point-fill-41, .dec-ic-layering.dec-Color-Point-outline-41, .dec-ic-layering.dec-Color-Point-fill-42, .dec-ic-layering.dec-Color-Point-outline-42, .dec-ic-layering.dec-Color-Point-fill-43, .dec-ic-layering.dec-Color-Point-outline-43, .dec-ic-layering.dec-Color-Point-fill-44, .dec-ic-layering.dec-Color-Point-outline-44, .dec-ic-layering.dec-Color-Point-fill-45, .dec-ic-layering.dec-Color-Point-outline-45, .dec-ic-layering.dec-Color-Point-fill-46, .dec-ic-layering.dec-Color-Point-outline-46, .dec-ic-layering.dec-Color-Point-fill-47, .dec-ic-layering.dec-Color-Point-outline-47, .dec-ic-layering.dec-Color-Point-fill-48, .dec-ic-layering.dec-Color-Point-outline-48 { font-size:1.5rem;} .dec-ic-layering.dec-Color-Point-fill-01 { color:#6d6d6d;} .dec-ic-layering.dec-Color-Point-outline-01 { color:#0a0a0a;} .dec-ic-layering.dec-Color-Point-fill-02 { color:#ff0000;} .dec-ic-layering.dec-Color-Point-outline-02 { color:#b51212;} .dec-ic-layering.dec-Color-Point-fill-03 { color:#ffff00;} .dec-ic-layering.dec-Color-Point-outline-03 { color:#b7b30f;} .dec-ic-layering.dec-Color-Point-fill-04 { color:#00ff00;} .dec-ic-layering.dec-Color-Point-outline-04 { color:#00994e;} .dec-ic-layering.dec-Color-Point-fill-05 { color:#00ffff;} .dec-ic-layering.dec-Color-Point-outline-05 { color:#07a39b;} .dec-ic-layering.dec-Color-Point-fill-06 { color:#6161ff;} .dec-ic-layering.dec-Color-Point-outline-06 { color:#030368;} .dec-ic-layering.dec-Color-Point-fill-07 { color:#ff00ff;} .dec-ic-layering.dec-Color-Point-outline-07 { color:#b009b5;} .dec-ic-layering.dec-Color-Point-fill-08 { color:#ce3641;} .dec-ic-layering.dec-Color-Point-outline-08 { color:#960914;} .dec-ic-layering.dec-Color-Point-fill-09 { color:#ed1c24;} .dec-ic-layering.dec-Color-Point-outline-09 { color:#a0020e;} .dec-ic-layering.dec-Color-Point-fill-10 { color:#f15a24;} .dec-ic-layering.dec-Color-Point-outline-10 { color:#b73108;} .dec-ic-layering.dec-Color-Point-fill-11 { color:#f7931e;} .dec-ic-layering.dec-Color-Point-outline-11 { color:#d66c0d;} .dec-ic-layering.dec-Color-Point-fill-12 { color:#fbb03b;} .dec-ic-layering.dec-Color-Point-outline-12 { color:#cc7a19;} .dec-ic-layering.dec-Color-Point-fill-13 { color:#fcee21;} .dec-ic-layering.dec-Color-Point-outline-13 { color:#c1ab0c;} .dec-ic-layering.dec-Color-Point-fill-14 { color:#d9e021;} .dec-ic-layering.dec-Color-Point-outline-14 { color:#a8a807;} .dec-ic-layering.dec-Color-Point-fill-15 { color:#8cc63f;} .dec-ic-layering.dec-Color-Point-outline-15 { color:#6a9920;} .dec-ic-layering.dec-Color-Point-fill-16 { color:#39b54a;} .dec-ic-layering.dec-Color-Point-outline-16 { color:#13891f;} .dec-ic-layering.dec-Color-Point-fill-17 { color:#009245;} .dec-ic-layering.dec-Color-Point-outline-17 { color:#3025b2a;} .dec-ic-layering.dec-Color-Point-fill-18 { color:#0c8244;} .dec-ic-layering.dec-Color-Point-outline-18 { color:#000000;} .dec-ic-layering.dec-Color-Point-fill-19 { color:#22b573;} .dec-ic-layering.dec-Color-Point-outline-19 { color:#033d1d;} .dec-ic-layering.dec-Color-Point-fill-20 { color:#00a99d;} .dec-ic-layering.dec-Color-Point-outline-20 { color:#0c665b;} .dec-ic-layering.dec-Color-Point-fill-21 { color:#29abe2;} .dec-ic-layering.dec-Color-Point-outline-21 { color:#147fa5;} .dec-ic-layering.dec-Color-Point-fill-22 { color:#0071bc;} .dec-ic-layering.dec-Color-Point-outline-22 { color:#011a21;} .dec-ic-layering.dec-Color-Point-fill-23 { color:#578bff;} .dec-ic-layering.dec-Color-Point-outline-23 { color:#242944;} .dec-ic-layering.dec-Color-Point-fill-24 { color:#6161a3;} .dec-ic-layering.dec-Color-Point-outline-24 { color:#010116;} .dec-ic-layering.dec-Color-Point-fill-25 { color:#7544aa;} .dec-ic-layering.dec-Color-Point-outline-25 { color:#120321;} .dec-ic-layering.dec-Color-Point-fill-26 { color:#a032a0;} .dec-ic-layering.dec-Color-Point-outline-26 { color:#2a022b;} .dec-ic-layering.dec-Color-Point-fill-27 { color:#af0b75;} .dec-ic-layering.dec-Color-Point-outline-27 { color:#28031d;} .dec-ic-layering.dec-Color-Point-fill-28 { color:#d4145a;} .dec-ic-layering.dec-Color-Point-outline-28 { color:#3f041f;} .dec-ic-layering.dec-Color-Point-fill-29 { color:#f93a95;} .dec-ic-layering.dec-Color-Point-outline-29 { color:#280218;} .dec-ic-layering.dec-Color-Point-fill-30 { color:#c7b299;} .dec-ic-layering.dec-Color-Point-outline-30 { color:#77604d;} .dec-ic-layering.dec-Color-Point-fill-31 { color:#998675;} .dec-ic-layering.dec-Color-Point-outline-31 { color:#635347;} .dec-ic-layering.dec-Color-Point-fill-32 { color:#827368;} .dec-ic-layering.dec-Color-Point-outline-32 { color:#1c1714;} .dec-ic-layering.dec-Color-Point-fill-33 { color:#c98377;} .dec-ic-layering.dec-Color-Point-outline-33 { color:#110b08;} .dec-ic-layering.dec-Color-Point-fill-34 { color:#c69c6d;} .dec-ic-layering.dec-Color-Point-outline-34 { color:#845f40;} .dec-ic-layering.dec-Color-Point-fill-35 { color:#a67c52;} .dec-ic-layering.dec-Color-Point-outline-35 { color:#70563f;} .dec-ic-layering.dec-Color-Point-fill-36 { color:#8c6239;} .dec-ic-layering.dec-Color-Point-outline-36 { color:#26150a;} .dec-ic-layering.dec-Color-Point-fill-37 { color:#a050a0;} .dec-ic-layering.dec-Color-Point-outline-37 { color:#0f0701;} .dec-ic-layering.dec-Color-Point-fill-38 { color:#d86fd5;} .dec-ic-layering.dec-Color-Point-outline-38 { color:#0f0803;} .dec-ic-layering.dec-Color-Point-fill-39 { color:#fca1ff;} .dec-ic-layering.dec-Color-Point-outline-39 { color:#493e38;} .dec-ic-layering.dec-Color-Point-fill-40 { color:#ee835c;} .dec-ic-layering.dec-Color-Point-outline-40 { color:#b7543d;} .dec-ic-layering.dec-Color-Point-fill-41 { color:#f4af8f;} .dec-ic-layering.dec-Color-Point-outline-41 { color:#bc8873;} .dec-ic-layering.dec-Color-Point-fill-42 { color:#fccf00;} .dec-ic-layering.dec-Color-Point-outline-42 { color:#ceac20;} .dec-ic-layering.dec-Color-Point-fill-43 { color:#b4af7d;} .dec-ic-layering.dec-Color-Point-outline-43 { color:#847e52;} .dec-ic-layering.dec-Color-Point-fill-44 { color:#ddd36e;} .dec-ic-layering.dec-Color-Point-outline-44 { color:#aa9f4f;} .dec-ic-layering.dec-Color-Point-fill-45 { color:#bac570;} .dec-ic-layering.dec-Color-Point-outline-45 { color:#848c35;} .dec-ic-layering.dec-Color-Point-fill-46 { color:#b7caba;} .dec-ic-layering.dec-Color-Point-outline-46 { color:#6f9373;} .dec-ic-layering.dec-Color-Point-fill-47 { color:#50a8b4;} .dec-ic-layering.dec-Color-Point-outline-47 { color:#2b797f;} .dec-ic-layering.dec-Color-Point-fill-48 { color:#718bc6;} .dec-ic-layering.dec-Color-Point-outline-48 { color:#1a3351;} /*end - .dec-ic-layering.dec-Color-Point-fill & outline -----------------------------------------------------------------------------*/ /*start - .dec-ic-layering.dec-Color-Line-01 -----------------------------------------------------------------------------*/ .dec-ic-layering.dec-Color-Line-01 { color:#0071bc;} .dec-ic-layering.dec-Color-Line-02 { color:#2ca6e0;} .dec-ic-layering.dec-Color-Line-03 { color:#39b54a;} .dec-ic-layering.dec-Color-Line-04 { color:#8cc63f;} .dec-ic-layering.dec-Color-Line-05 { color:#d9e021;} .dec-ic-layering.dec-Color-Line-06 { color:#fcee21;} .dec-ic-layering.dec-Color-Line-07 { color:#fbb03b;} .dec-ic-layering.dec-Color-Line-08 { color:#f7931e;} .dec-ic-layering.dec-Color-Line-09 { color:#ed1c24;} .dec-ic-layering.dec-Color-Line-10 { color:#c1272d;} .dec-ic-layering.dec-Color-Line-11 { color:#787878;} .dec-ic-layering.dec-Color-Line-12 { color:#b3b3b3;} .dec-ic-layering.dec-Color-Line-13 { color:#578bff;} .dec-ic-layering.dec-Color-Line-14 { color:#6d6d6d;} .dec-ic-layering.dec-Color-Line-15 { color:#00ff00;} .dec-ic-layering.dec-Color-Line-16 { color:#00ffff;} .dec-ic-layering.dec-Color-Line-17 { color:#6161ff;} .dec-ic-layering.dec-Color-Line-18 { color:#ff00ff;} .dec-ic-layering.dec-Color-Line-19 { color:#009245;} .dec-ic-layering.dec-Color-Line-20 { color:#6a9920;} .dec-ic-layering.dec-Color-Line-21 { color:#6161a3;} .dec-ic-layering.dec-Color-Line-22 { color:#7544aa;} .dec-ic-layering.dec-Color-Line-23 { color:#a032a0;} .dec-ic-layering.dec-Color-Line-24 { color:#af0b75;} .dec-ic-layering.dec-Color-Line-25 { color:#d4145a;} .dec-ic-layering.dec-Color-Line-26 { color:#f93a95;} .dec-ic-layering.dec-Color-Line-27 { color:#c7b299;} .dec-ic-layering.dec-Color-Line-28 { color:#998675;} .dec-ic-layering.dec-Color-Line-29 { color:#827368;} .dec-ic-layering.dec-Color-Line-30 { color:#c98377;} .dec-ic-layering.dec-Color-Line-31 { color:#c69c6d;} .dec-ic-layering.dec-Color-Line-32 { color:#a67c52;} .dec-ic-layering.dec-Color-Line-33 { color:#8c6239;} .dec-ic-layering.dec-Color-Line-34 { color:#b7543d;} .dec-ic-layering.dec-Color-Line-35 { color:#b009b5;} .dec-ic-layering.dec-Color-Line-36 { color:#a050a0;} .dec-ic-layering.dec-Color-Line-37 { color:#d86fd5;} .dec-ic-layering.dec-Color-Line-38 { color:#fca1ff;} .dec-ic-layering.dec-Color-Line-39 { color:#ee835c;} .dec-ic-layering.dec-Color-Line-40 { color:#f4af8f;} .dec-ic-layering.dec-Color-Line-41 { color:#fccf00;} .dec-ic-layering.dec-Color-Line-42 { color:#b4af7d;} .dec-ic-layering.dec-Color-Line-43 { color:#ddd36e;} .dec-ic-layering.dec-Color-Line-44 { color:#bac570;} .dec-ic-layering.dec-Color-Line-45 { color:#b7caba;} .dec-ic-layering.dec-Color-Line-46 { color:#50a8b4;} .dec-ic-layering.dec-Color-Line-47 { color:#718bc6;} .dec-ic-layering.dec-Color-Line-48 { color:#ceac20;} /*end - .dec-ic-layering.dec-Color-Line-01 -----------------------------------------------------------------------------*/ .dec-ic-layering.dec-position-00 { } .dec-ic-layering.dec-position-01 { left:1px !important;} .dec-ic-layering.dec-position-02 { left:2px !important;} .dec-ic-layering.dec-position-03 { left:3px !important;} .dec-ic-layering.dec-position-04 { left:-3px !important;} .dec-ic-layering.dec-color-poi-fill { color:#FFFFFF;} /*start - .main-area .div-mapLegend-area -------------------------------------------------------------------------------------------------------*/ .main-area .div-mapLegend-area { width:78px; height:208px; margin:0px; padding:3px; position:absolute; bottom:10px; right:10px; background:rgba(255, 255, 255, 0.85); color:#333333; border-radius:5px; z-index:2; box-shadow:0px 2px 4px rgba(0, 0, 0, .3); border:1px solid #999999; overflow:hidden; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .div-mapLegend-area .div-mapLegend-gradientBox { width:10px; height:calc(100% - 0px); margin:0px; padding:0px; border-radius:3px; overflow:hidden; display:inline-block; float:right; background-image: linear-gradient(to bottom, #ed1c24 , #f7931e, #fcee21 , #8cc63f, #29abe2); background-image: linear-gradient(to bottom, #c1272d 0%, #c1272d 10%, #ed1c24 11%, #ed1c24 20%, #f7931e 21%, #f7931e 30%, #fbb03b 31%, #fbb03b 40%, #fcee21 41%, #fcee21 50%, #d9e021 51%, #d9e021 60%, #8cc63f 61%, #8cc63f 70%, #39b54a 71%, #39b54a 80%, #2ca6e0 81%, #2ca6e0 90%, #0071bc 91%, #0071bc 100%); } .div-mapLegend-area .div-mapLegend-infoBox { width:calc(100% - 15px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden; display:inline-block;} .div-mapLegend-area .div-mapLegend-infoBox .dec-type { font-size:12px; line-height:14px; margin:0px; padding:0px; width:calc(100% - 0px); height:20px; color:#595959; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} /*end - .main-area .div-mapLegend-area -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con:first-child { border:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea { width:calc(100% - 65px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .con-btnbox { width:60px; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .con-btnbox.dec-w01 { width:calc(33% - 5px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .con-btnbox.dec-w02 { width:calc(50% - 5px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .con-btnbox.dec-w03 { width:calc(25% - 5px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .con-btnbox a.dec-btn { background:#fafafa; margin:0px; padding:3px 0px; border-radius:5px; color:#999999; border:1px solid #ced4da; height:33px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .con-btnbox a.dec-btn:hover { color:#169cbf; background:#f5f5f5; border:1px solid #ced4da;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .con-btnbox a.dec-btn .dec-ic { margin:0px 2px 0px 0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:16px; font-weight:500; line-height:1.2rem; letter-spacing:0.2rem; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .dec-box-subTitle .dec-type { margin:0px; padding:0px; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .dec-box-subTitle .dec-update { margin:0px; padding:0px; font-size:12px; line-height:1.2rem; letter-spacing:0rem; font-weight:400; color:#adadad;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L { width:100px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L::after { content:"："; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-R { width:calc(100% - 100px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 ----------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con { width:calc(100% - 38px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con .con-group { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con .con-group:nth-child(2) { padding: 10px 0px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-btn { width:33px; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con .dec-box-list-L { width:100px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con .dec-box-list-L::after { content:"："; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con .dec-box-list-R { width:calc(100% - 100px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-btn { width:33px; height:33px; overflow:hidden; margin:0px 0px 0px 5px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-btn a.btn-more, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-btn a.btn-more:hover{ width:33px; height:33px; overflow:hidden; background:#fafafa; margin:0px; padding:7px 8px; border-radius:5px; color:#999999; border:1px solid #ced4da; display: inline-block;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-btn a.btn-more:hover { color:#169cbf; background:#f5f5f5; border:1px solid #ced4da;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC-01 ----------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC ---------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC .dec-box-list { width:calc(40% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC .dec-box-list:first-child { width:calc(60% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC .dec-box-list .dec-box-list-L { width:50px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC .dec-box-list .dec-box-list-L::after { content:"："; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC .dec-box-list .dec-box-list-R { width:calc(100% - 50px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea.dec-CTC ---------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-ChargingPileInfo .con-main -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-ChargingPileInfo .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con:first-child { border:0px;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .box-infoArea { width:calc(100% - 0px); margin:0px; padding:10px; background: #f0f0f0; border-radius: 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .box-infoArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L { width:80px; margin:0px; padding:0px; text-align:left; color:#595959; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-R { width:calc(100% - 80px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem; font-weight:500;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; padding:15px 5px 8px 2px;font-size:16px; font-weight:500; line-height:1.2rem; letter-spacing:0.2rem; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .dec-box-subTitle .dec-type { margin:0px; padding:0px; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#595959;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .dec-box-subTitle .dec-update { margin:0px; padding:0px; font-size:12px; line-height:1.2rem; letter-spacing:0rem; font-weight:400; color:#adadad;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .box-currentData { width:calc(50% - 3px); margin:0px 0px 5px 0px; padding:0px; background:#fafafa; border-radius:5px; border:1px solid #e1e1e1; text-align:center; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .box-currentData:hover { background:#fcfbe0;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .box-currentData .dec-box-num { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; font-size:1.5rem; font-weight:500; color:#595959;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .box-currentData .dec-box-num.dec-color { color:#e73828;} .MapTool-FunctionBox.dec-ChargingPileInfo .con-main .box-con .box-currentData .dec-box-type { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; color:#a3a3a3;} /*end - .MapTool-FunctionBox.dec-ChargingPileInfo .con-main -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-mission { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:5px; background:#fafafa; border-radius:5px; border:1px solid #f5f5f5;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-mission:hover { background:#fcfbe0;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-mission .box-mission-con { width:calc(100% - 0px); margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-mission .box-mission-note { width:calc(100% - 0px); margin:0px; padding:0px 5px 5px 5px; font-size:12px; line-height:1rem; color:#AFAFAF;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData { width:calc(50% - 3px); margin:0px 0px 5px 0px; padding:0px; background:#fafafa; border-radius:5px; border:1px solid #e1e1e1; text-align:center; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData:hover { background:#fcfbe0;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-w-03 { width:calc(33% - 3px);} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-condition { padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-condition.dec-p01 { padding:0px 0px 7px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-condition.dec-normal .dec-box-num, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-condition.dec-normal .dec-box-type { color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-condition.dec-inDanger .dec-box-num, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-condition.dec-inDanger .dec-box-type { color:#e73828;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; font-size:1.5rem; font-weight:500;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-GPS { font-size:1.2rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num-high { width:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; font-size:1.2rem; font-weight:500; text-align:left;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num-high::before { content:"高"; width:calc(40% - 0px); margin:0px 5px 0px 35px; font-weight:300; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num-low { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1.2rem; font-weight:500; text-align:left;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num-low::before { content:"低"; width:calc(40% - 0px); margin:0px 5px 0px 35px; font-weight:300; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num-high.dec-color, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num-low.dec-color { color:#e73828;} /*start - 中保｜車輛狀態｜(正常true/異常false｜超速,怠速,熄火,拖吊,溫度異常1,溫度異常2,防盜狀態) ---------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-01, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-02, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-03, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-04, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-05, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-06 { padding:6px 0px 11px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-01.dec-true { color:#ff0000;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-02.dec-true { color:#f7931e;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-03.dec-true { color:#f9bd00;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-04.dec-true { color:#a050a0;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-05.dec-true { color:#f2669f;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-06.dec-true { color:#f9bd00;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-01.dec-false, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-02.dec-false, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-03.dec-false, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-04.dec-false, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-05.dec-false, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-status-06.dec-false { color:#d6d6d6;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-type { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; color:#a3a3a3;} /*end - 中保｜車輛狀態｜(正常true/異常false｜超速,怠速,熄火,拖吊,溫度異常1,溫度異常2,防盜狀態) ---------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem｜溫度計燈號/綠,黃,橘,紅,無資料 -------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-widthWhole { width:calc(100% - 0px); padding-left:2px; padding-right:2px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; font-size:1.5rem; font-weight:500; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem { width:calc((100%/8) - 2px); margin:0px; padding:0px 2px; border-left:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem:first-child { border:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem .dec-lightBox { width:24px; height:24px; margin-top:2px; margin:0px auto; margin-bottom:2px; padding:0px; border-radius:50%;} /*註：[溫度計燈號] (1) dec-color-green/綠燈 (2) dec-color-yellow/黃燈 (3) dec-color-orange/橘燈 (4) dec-color-red/紅燈 (5) dec-color-noData/無資料*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-lightBox { background:#8cc63f;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-lightBox { background:#fccf00;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-lightBox { background:#f7931e;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-lightBox { background:#ed1c24;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-lightBox { background:transparent;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-lightBox:after { content:"-"; background:transparent; color:#CCCCCC;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-type { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; font-size:12px; line-height:14px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-type { color:#A3A3A3;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-type { color:#CCCCCC;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem｜溫度計燈號/綠,黃,橘,紅,無資料 -------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem｜溫度計燈號/綠,黃,橘,紅,無資料 -------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; padding:0px; background:#fafafa; border-radius:5px; border:0px; text-align:center; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom:hover { background:transparent;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem { width:calc(50% - 3px); margin:0px 5px; padding:10px 5px 11px 5px; background:#fafafa; border:1px solid #e1e1e1; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem:hover { background:#fcfbe0;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem:nth-child(odd) { margin:5px 5px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem:nth-child(even) { margin:5px 0px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem:nth-child(1) { margin:0px 5px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem:nth-child(2) { margin:0px 0px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem .dec-lightBox { width:18px; height:18px; margin-top:2px; margin:0px 5px 0px 0px; padding:0px; border-radius:50%;} /*註：[溫度計燈號] (1) dec-color-green/綠燈 (2) dec-color-yellow/黃燈 (3) dec-color-orange/橘燈 (4) dec-color-red/紅燈 (5) dec-color-noData/無資料*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-lightBox { background:#8cc63f;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-lightBox { background:#fccf00;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-lightBox { background:#f7931e;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-lightBox { background:#ed1c24;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-lightBox { background:transparent;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-lightBox:after { content:"-"; background:transparent; color:#CCCCCC;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-type { width:65px; margin:0px 5px 0px 0px; margin-right:auto; font-size:16px; line-height:16px; text-align:left; border-right:1px solid #a3a3a3; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-type, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-type { color:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-type { color:#CCCCCC;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-num, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-num, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-num, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-num, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-num { width:calc(100% - 95px); margin:0px; padding:0px; font-size:16px; line-height:16px; text-align:left; font-weight:300;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-num, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-num, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-num, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-num { color:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-num { color:#CCCCCC;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem｜溫度計燈號/綠,黃,橘,紅,無資料 -------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-SelfDriving*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-SelfDriving { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:3px 0px; font-size:1rem; font-weight:500;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-SelfDriving .dec-inner { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-SelfDriving .dec-inner .dec-mode { width:50px; margin:0px; padding:2px 10px; color:#A3A3A3; background:transparent; display:inline-block; border:1px solid #CCCCCC;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-SelfDriving .dec-inner .dec-mode.is-active { color:#FFFFFF; background:#787878; border:1px solid #787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-SelfDriving .dec-inner .dec-mode:first-child { border-radius:0.25rem 0px 0px 0.25rem; border-right:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-SelfDriving .dec-inner .dec-mode:last-child { border-radius:0px 0.25rem 0.25rem 0px; border-left:0px;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-currentData .dec-box-num.dec-SelfDriving*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con a.dec-currentData-detail, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con a.dec-currentData-detail:hover { margin:0px 0px 0px auto; padding:5px 0px 5px 5px; font-size:1rem; text-align:left; text-decoration:underline !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con a.dec-currentData-detail { color:#999999; width:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con a.dec-currentData-detail:hover { color:#5dc1cf;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con a.dec-currentData-detail::after { content:' \003E';} /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo.dec-SelfDriving*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo.dec-SelfDriving { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo.dec-SelfDriving .carNum-front { width:calc(100% - 0px); margin:0px; padding:6px 5px; border-radius:5px; background:#f0f0f0; text-align:center;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo.dec-SelfDriving .carNum-back { width:calc(50% - 5px); margin:0px; padding:6px 5px; border-radius:5px; background:#f0f0f0; text-align:center; display:none;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo.dec-SelfDriving .carPhoto { background-image:url("../images/element/img_carModel_07.svg") !important;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo.dec-SelfDriving*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carNum-front { width:calc(50% - 3px); margin:0px; padding:6px 5px; border-radius:5px; background:#f0f0f0; text-align:center;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carNum-front.dec-whole { width:calc(100% - 0px);} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carNum-back { width:calc(50% - 2px); margin:0px; padding:6px 5px; border-radius:5px; background:#f0f0f0; text-align:center;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto { width:269px; height:100px; margin:5px 0px 0px 0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-00, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-01, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-02, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-03, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-04, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-05, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-06, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-07, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-08, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-09, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-10, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-11, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-12, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-13, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-14, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-15, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-16, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-17, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-18, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-19, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-20, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-21, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-22, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-23, .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-24 { background-position:right bottom; background-repeat:no-repeat; background-color:#FFFFFF;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-00 { background-image:url("../images/element/img_carModel_00.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-01 { background-image:url("../images/element/img_carModel_01.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-02 { background-image:url("../images/element/img_carModel_02.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-03 { background-image:url("../images/element/img_carModel_03.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-04 { background-image:url("../images/element/img_carModel_04.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-05 { background-image:url("../images/element/img_carModel_05.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-06 { background-image:url("../images/element/img_carModel_06.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-07 { background-image:url("../images/element/img_carModel_07.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-08 { background-image:url("../images/element/img_carModel_08.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-09 { background-image:url("../images/element/img_carModel_09.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-10 { background-image:url("../images/element/img_carModel_10.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-11 { background-image:url("../images/element/img_carModel_11.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-12 { background-image:url("../images/element/img_carModel_12.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-13 { background-image:url("../images/element/img_carModel_13.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-14 { background-image:url("../images/element/img_carModel_14.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-15 { background-image:url("../images/element/img_carModel_15.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-16 { background-image:url("../images/element/img_carModel_16.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-17 { background-image:url("../images/element/img_carModel_17.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-18 { background-image:url("../images/element/img_carModel_18.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-19 { background-image:url("../images/element/img_carModel_19.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-20 { background-image:url("../images/element/img_carModel_20.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-21 { background-image:url("../images/element/img_carModel_21.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-22 { background-image:url("../images/element/img_carModel_22.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-23 { background-image:url("../images/element/img_carModel_23.svg");} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-24 { background-image:url("../images/element/img_carModel_24.svg");} /*[車種] dec-img-carModel-00 (預設圖), dec-img-carModel-01 (大貨車), dec-img-carModel-02 (小貨車), dec-img-carModel-03 (自駕車), dec-img-carModel-04 (掃街車), dec-img-carModel-05 (號誌), dec-img-carModel-06 (紅綠燈), dec-img-carModel-07 (勤崴無人車/winbus), dec-img-carModel-08 (和泰汽車), dec-img-carModel-09 (消防車), dec-img-carModel-10 (救護車), dec-img-carModel-10 (救護車), dec-img-carModel-11 (曳引車), dec-img-carModel-12 (垃圾車), dec-img-carModel-13 (資源回收車), dec-img-carModel-14 (廚餘車), dec-img-carModel-15 (平板車), dec-img-carModel-16 (油罐車), dec-img-carModel-17 (砂石車), dec-img-carModel-18 (貨櫃車), dec-img-carModel-19 (裝櫃車), dec-img-carModel-20 (堆高機), dec-img-carModel-21 (小客車), dec-img-carModel-22 (大客車), dec-img-carModel-23 (冷鏈車), dec-img-carModel-24 (微型車)*/ .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-infoArea .box-carInfo .dec-type { color:#1591BC;} /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-CarInfoListArea ------------------------------------------------*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-CarInfoListArea { width:calc(100% - 0px); margin:10px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-CarInfoListArea { width:calc(100% - 0px); margin:10px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .CarInfoList { width:calc(100% - 0px); margin:0px; padding:0px; border-bottom:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;}.CarInfoList:first-child { border-top:1px solid #e1e1e1;} .CarInfoList .CarInfoListItemBox { width:calc(50% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .CarInfoList .CarInfoListItemBox:first-child { border-right:1px solid #e1e1e1;} .CarInfoList .CarInfoListItemBox .CarInfoListItem { width:calc(50% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .CarInfoList .CarInfoListItemBox .CarInfoListItem:first-child { padding-left:5px; text-align:left; width:auto;} .CarInfoList .CarInfoListItemBox .CarInfoListItem:last-child { padding-right:5px; text-align:right; width:auto; color:#1591BC; display:inline-block !important;} /*start - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-CarInfoListArea ------------------------------------------------*/ /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo .con-main .box-con .box-CarInfoListArea ------------------------------------------------*/ /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo -------------------------------------------------------------------------------------------------------*/ /*start - .table td .dec-carPhoto -------------------------------------------------------------------------------------------------------*/ .table td .dec-carPhoto { width:138px; height:57px; background:transparent;} .table td .dec-carPhoto.dec-img-carModel-00, .table td .dec-carPhoto.dec-img-carModel-01, .table td .dec-carPhoto.dec-img-carModel-02, .table td .dec-carPhoto.dec-img-carModel-03, .table td .dec-carPhoto.dec-img-carModel-04, .table td .dec-carPhoto.dec-img-carModel-05, .table td .dec-carPhoto.dec-img-carModel-06, .table td .dec-carPhoto.dec-img-carModel-07, .table td .dec-carPhoto.dec-img-carModel-08, .table td .dec-carPhoto.dec-img-carModel-09, .table td .dec-carPhoto.dec-img-carModel-10, .table td .dec-carPhoto.dec-img-carModel-11, .table td .dec-carPhoto.dec-img-carModel-12, .table td .dec-carPhoto.dec-img-carModel-13, .table td .dec-carPhoto.dec-img-carModel-14, .table td .dec-carPhoto.dec-img-carModel-15, .table td .dec-carPhoto.dec-img-carModel-16, .table td .dec-carPhoto.dec-img-carModel-17, .table td .dec-carPhoto.dec-img-carModel-18, .table td .dec-carPhoto.dec-img-carModel-19, .table td .dec-carPhoto.dec-img-carModel-20, .table td .dec-carPhoto.dec-img-carModel-21, .table td .dec-carPhoto.dec-img-carModel-22, .table td .dec-carPhoto.dec-img-carModel-23, .table td .dec-carPhoto.dec-img-carModel-24 { background-position:right bottom; background-repeat:no-repeat; background-color:transparent;} .table td .dec-carPhoto.dec-img-carModel-00 { background-image:url("../images/element/img_carModel_00.svg");} .table td .dec-carPhoto.dec-img-carModel-01 { background-image:url("../images/element/img_carModel_01.svg");} .table td .dec-carPhoto.dec-img-carModel-02 { background-image:url("../images/element/img_carModel_02.svg");} .table td .dec-carPhoto.dec-img-carModel-03 { background-image:url("../images/element/img_carModel_03.svg");} .table td .dec-carPhoto.dec-img-carModel-04 { background-image:url("../images/element/img_carModel_04.svg");} .table td .dec-carPhoto.dec-img-carModel-05 { background-image:url("../images/element/img_carModel_05.svg");} .table td .dec-carPhoto.dec-img-carModel-06 { background-image:url("../images/element/img_carModel_06.svg");} .table td .dec-carPhoto.dec-img-carModel-07 { background-image:url("../images/element/img_carModel_07.svg");} .table td .dec-carPhoto.dec-img-carModel-08 { background-image:url("../images/element/img_carModel_08.svg");} .table td .dec-carPhoto.dec-img-carModel-09 { background-image:url("../images/element/img_carModel_09.svg");} .table td .dec-carPhoto.dec-img-carModel-10 { background-image:url("../images/element/img_carModel_10.svg");} .table td .dec-carPhoto.dec-img-carModel-11 { background-image:url("../images/element/img_carModel_11.svg");} .table td .dec-carPhoto.dec-img-carModel-12 { background-image:url("../images/element/img_carModel_12.svg");} .table td .dec-carPhoto.dec-img-carModel-13 { background-image:url("../images/element/img_carModel_13.svg");} .table td .dec-carPhoto.dec-img-carModel-14 { background-image:url("../images/element/img_carModel_14.svg");} .table td .dec-carPhoto.dec-img-carModel-15 { background-image:url("../images/element/img_carModel_15.svg");} .table td .dec-carPhoto.dec-img-carModel-16 { background-image:url("../images/element/img_carModel_16.svg");} .table td .dec-carPhoto.dec-img-carModel-17 { background-image:url("../images/element/img_carModel_17.svg");} .table td .dec-carPhoto.dec-img-carModel-18 { background-image:url("../images/element/img_carModel_18.svg");} .table td .dec-carPhoto.dec-img-carModel-19 { background-image:url("../images/element/img_carModel_19.svg");} .table td .dec-carPhoto.dec-img-carModel-20 { background-image:url("../images/element/img_carModel_20.svg");} .table td .dec-carPhoto.dec-img-carModel-21 { background-image:url("../images/element/img_carModel_21.svg");} .table td .dec-carPhoto.dec-img-carModel-22 { background-image:url("../images/element/img_carModel_22.svg");} .table td .dec-carPhoto.dec-img-carModel-23 { background-image:url("../images/element/img_carModel_23.svg");} .table td .dec-carPhoto.dec-img-carModel-24 { background-image:url("../images/element/img_carModel_24.svg");} /*[車種] dec-img-carModel-00 (預設圖), dec-img-carModel-01 (大貨車), dec-img-carModel-02 (小貨車), dec-img-carModel-03 (自駕車), dec-img-carModel-04 (掃街車), dec-img-carModel-05 (號誌), dec-img-carModel-06 (紅綠燈), dec-img-carModel-07 (勤崴無人車/winbus), dec-img-carModel-08 (和泰汽車), dec-img-carModel-09 (消防車), dec-img-carModel-10 (救護車), dec-img-carModel-10 (救護車), dec-img-carModel-11 (曳引車), dec-img-carModel-12 (垃圾車), dec-img-carModel-13 (資源回收車), dec-img-carModel-14 (廚餘車), dec-img-carModel-15 (平板車), dec-img-carModel-16 (油罐車), dec-img-carModel-17 (砂石車), dec-img-carModel-18 (貨櫃車), dec-img-carModel-19 (裝櫃車), dec-img-carModel-20 (堆高機), dec-img-carModel-21 (小客車), dec-img-carModel-22 (大客車), dec-img-carModel-23 (冷鏈車), dec-img-carModel-24 (微型車)*/ /*end - .table td .dec-carPhoto -------------------------------------------------------------------------------------------------------*/ /*start - .con-width-whole .dec-carPhoto -------------------------------------------------------------------------------------------------------*/ .con-width-whole .dec-carPhoto { width:269px; height:90px; background:transparent; margin:auto; margin-top:10px; margin-bottom:5px;} .con-width-whole .dec-carPhoto.dec-img-carModel-00, .con-width-whole .dec-carPhoto.dec-img-carModel-01, .con-width-whole .dec-carPhoto.dec-img-carModel-02, .con-width-whole .dec-carPhoto.dec-img-carModel-03, .con-width-whole .dec-carPhoto.dec-img-carModel-04, .con-width-whole .dec-carPhoto.dec-img-carModel-05, .con-width-whole .dec-carPhoto.dec-img-carModel-06, .con-width-whole .dec-carPhoto.dec-img-carModel-07, .con-width-whole .dec-carPhoto.dec-img-carModel-08, .con-width-whole .dec-carPhoto.dec-img-carModel-09, .con-width-whole .dec-carPhoto.dec-img-carModel-10, .con-width-whole .dec-carPhoto.dec-img-carModel-11, .con-width-whole .dec-carPhoto.dec-img-carModel-12, .con-width-whole .dec-carPhoto.dec-img-carModel-13, .con-width-whole .dec-carPhoto.dec-img-carModel-14, .con-width-whole .dec-carPhoto.dec-img-carModel-15, .con-width-whole .dec-carPhoto.dec-img-carModel-16, .con-width-whole .dec-carPhoto.dec-img-carModel-17, .con-width-whole .dec-carPhoto.dec-img-carModel-18, .con-width-whole .dec-carPhoto.dec-img-carModel-19, .con-width-whole .dec-carPhoto.dec-img-carModel-20, .con-width-whole .dec-carPhoto.dec-img-carModel-21, .con-width-whole .dec-carPhoto.dec-img-carModel-22, .con-width-whole .dec-carPhoto.dec-img-carModel-23, .con-width-whole .dec-carPhoto.dec-img-carModel-24 { background-position:right bottom; background-repeat:no-repeat; background-color:transparent;} .con-width-whole .dec-carPhoto.dec-img-carModel-00 { background-image:url("../images/element/img_carModel_00.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-01 { background-image:url("../images/element/img_carModel_01.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-02 { background-image:url("../images/element/img_carModel_02.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-03 { background-image:url("../images/element/img_carModel_03.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-04 { background-image:url("../images/element/img_carModel_04.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-05 { background-image:url("../images/element/img_carModel_05.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-06 { background-image:url("../images/element/img_carModel_06.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-07 { background-image:url("../images/element/img_carModel_07.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-08 { background-image:url("../images/element/img_carModel_08.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-09 { background-image:url("../images/element/img_carModel_09.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-10 { background-image:url("../images/element/img_carModel_10.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-11 { background-image:url("../images/element/img_carModel_11.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-12 { background-image:url("../images/element/img_carModel_12.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-13 { background-image:url("../images/element/img_carModel_13.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-14 { background-image:url("../images/element/img_carModel_14.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-15 { background-image:url("../images/element/img_carModel_15.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-16 { background-image:url("../images/element/img_carModel_16.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-17 { background-image:url("../images/element/img_carModel_17.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-18 { background-image:url("../images/element/img_carModel_18.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-19 { background-image:url("../images/element/img_carModel_19.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-20 { background-image:url("../images/element/img_carModel_20.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-21 { background-image:url("../images/element/img_carModel_21.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-22 { background-image:url("../images/element/img_carModel_22.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-23 { background-image:url("../images/element/img_carModel_23.svg");} .con-width-whole .dec-carPhoto.dec-img-carModel-24 { background-image:url("../images/element/img_carModel_24.svg");} /*[車種] dec-img-carModel-00 (預設圖), dec-img-carModel-01 (大貨車), dec-img-carModel-02 (小貨車), dec-img-carModel-03 (自駕車), dec-img-carModel-04 (掃街車), dec-img-carModel-05 (號誌), dec-img-carModel-06 (紅綠燈), dec-img-carModel-07 (勤崴無人車/winbus), dec-img-carModel-08 (和泰汽車), dec-img-carModel-09 (消防車), dec-img-carModel-10 (救護車), dec-img-carModel-11 (曳引車), dec-img-carModel-12 (垃圾車), dec-img-carModel-13 (資源回收車), dec-img-carModel-14 (廚餘車), dec-img-carModel-15 (平板車), dec-img-carModel-16 (油罐車), dec-img-carModel-17 (砂石車), dec-img-carModel-18 (貨櫃車), dec-img-carModel-19 (裝櫃車), dec-img-carModel-20 (堆高機), dec-img-carModel-21 (小客車), dec-img-carModel-22 (大客車), dec-img-carModel-23 (冷鏈車), dec-img-carModel-24 (微型車)*/ /*end - .con-width-whole .dec-carPhoto -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con:first-child { border:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con .box-infoArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con .dec-box-subTitle .dec-note { font-size:1rem; font-size:13px; color:#f7931e; font-weight:normal;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con .dec-box-subTitle .dec-note::before { content:"："; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con .dec-box-subTitle .dec-note .dec-date { letter-spacing:0.05rem; font-size:12px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con .box-infoArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L { width:100px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height: 1.2rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L::after { content:"："; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-R { width:calc(100% - 100px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Car -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con:first-child { border:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con .box-infoArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con .dec-box-subTitle .dec-note { font-size:1rem; color:#f7931e; font-weight:normal;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con .dec-box-subTitle .dec-note::before { content:"："; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con .dec-box-subTitle .dec-note .dec-date { letter-spacing:0rem; font-size:12px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-R .dec-note-gray { color:#CCCCCC; font-weight:normal; margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con .box-infoArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L { width:130px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L::after { content:"："; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-R { width:calc(100% - 130px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Detail-Driver -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-top-title {} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-top-title a.dec-btn, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-top-title a.dec-btn:hover{ margin-left:auto; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-top-title a.dec-btn { background:#FFFFFF; color:#787878;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-top-title a.dec-btn:hover { background:#fafafa; color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner .con-top-title a.dec-btn .dec-ic { margin:0px; color:#787878;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .box-inner .con-top-title a.dec-btn:hover .dec-ic { margin:0px; color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-con .box-infoArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-con .box-infoArea .dec-box-btn { width:60px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-con .box-infoArea .dec-box-btn .dec-btn { width:26px; height:26px; margin:0px; padding:5px; overflow:hidden; color:#999999;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-con .box-infoArea .dec-box-btn .dec-btn:hover { color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-con .box-infoArea .dec-box-btn .dec-btn .dec-ic { margin:0px; padding:0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-con .dec-box-subTitle { width:calc(100% - 60px); margin:0px; padding:8px 5px 8px 2px; font-size:1rem; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-con .dec-box-subTitle .dec-type { display:inline-block; color:#595959;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-con .dec-box-subTitle .dec-note { font-size:1rem; color:#f7931e; font-weight:normal;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-con .dec-box-subTitle .dec-note::before { content:"："; color:#595959;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-conArea.dec-video { width:330px; height:220px; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .box-conArea.dec-video .dec-img { margin:0px; padding:0px; width:calc(100% - 0px); height:calc(100% - 0px);} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .dec-noteBox { width:calc(100% - 0px); height:calc(100% - 630px); margin:0px; padding:0px 0px 5px 0px; overflow-x:hidden; overflow-y:auto; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .dec-noteBox .dec-type { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1rem; line-height:1.5rem; color:#787878;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video .con-main .dec-noteBox .dec-time { width:calc(100% - 0px); margin:0px; padding:0px; font-size:0.9rem; line-height:1.5rem; color:#b3b3b3;} /*end - .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video -------------------------------------------------------------------------------------------------------*/ /*start - .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable { overflow: hidden;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-top-title { } .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-top-title a.dec-btn, .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-top-title a.dec-btn:hover{ margin-left:auto; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-top-title a.dec-btn { background:#FFFFFF; color:#787878;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-top-title a.dec-btn:hover { background:#fafafa; color:#169cbf;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .box-inner .con-top-title .dec-ic { margin:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-con:first-child { border:0px;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-con .box-infoArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:1rem; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#169cbf;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-con .dec-box-subTitle .dec-type { display:inline-block; color:#595959;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-con .dec-box-subTitle .dec-type-01 { display:inline-block; color:#169cbf;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result { width:calc(100% - 0px); height:calc(100% - 255px); height:calc(100% - 260px); margin:0px 0px 5px 0px; padding:0px; overflow:hidden;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; overflow:hidden;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-selection { width:calc(100% - 0px); height:35px; margin:0px; padding:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: end !important; align-items: flex-end !important;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-selection .dec-note { display:inline-block; font-size:1rem; margin:0px; padding:2px 5px; color:#b7b7b7; font-weight:normal;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-selection .form-check, .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-selection .form-check:hover { background:transparent;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-selection .form-check { display:inline-block; width:auto; padding:5px 5px 2px 25px; border-radius:0px;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-content { height:calc(100% - 0px); height:calc(100% - 35px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; border-top:1px solid #e1e1e1; border:1px solid #e1e1e1; background:#FFFFFF;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-content .dec-note { font-size:1rem; color:#CCCCCC; margin:0px; padding:5px; width:calc(100% - 0px); text-align:center;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-content .dec-list { width:calc(100% - 0px); margin:0px; padding:2px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-content .dec-list:nth-child(odd) { background:#fafafa;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-content .dec-list .form-check { width:calc(100% - 70px); padding:5px 5px 5px 25px; border-radius:25px; margin:0px 5px 0px 0px;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-content .dec-list:hover { background:#fcfbe0;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem.dec-content .form-check:first-child { margin:0px; border-top:0px;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea { width:60px; margin:0px; padding:0px;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn, .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn:hover { border-radius: 0px; margin:0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); border:0px; height:31px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn { background:transparent; color:#595959;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn:hover { background:transparent; color:#29abe2;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn .dec-type, .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn:hover .dec-type { font-size:1rem; margin:0px; padding:0px;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn .dec-ic { margin-left:5px; color:#eaeaea;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn:hover .dec-ic { margin-left:5px; color:#29abe2;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn .dec-ic-01 { margin-left:5px; color:#eaeaea; color:#CCCCCC; display:inline-block;} .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn:hover .dec-ic-01 { margin-left:5px; color:#29abe2; display:inline-block;} /*end - .div-box-inner.dec-TrackHistory-Video-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-TrackHistory-Video -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-TrackHistory-Video .con-top-title {} .MapTool-FunctionBox.dec-TrackHistory-Video .con-top-title a.dec-btn, .MapTool-FunctionBox.dec-TrackHistory-Video .con-top-title a.dec-btn:hover{ margin-left:auto; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-top-title a.dec-btn { background:#FFFFFF; color:#787878;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-top-title a.dec-btn:hover { background:#fafafa; color:#169cbf;} .MapTool-FunctionBox.dec-TrackHistory-Video .box-inner .con-top-title .dec-ic { margin:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-con:first-child { border:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-con .box-infoArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:1rem; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#169cbf;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-con .dec-box-subTitle .dec-type { display:inline-block; color:#595959;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-con .dec-box-subTitle .dec-type-01 { display:inline-block; color:#169cbf;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result { width:calc(100% - 0px); height:calc(100% - 255px); margin:0px 0px 5px 0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea { width:calc( 100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-selection { width:calc(100% - 0px); height:35px; margin:0px; padding:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: end !important; align-items: flex-end !important;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-selection .dec-note { display:inline-block; font-size:1rem; margin:0px; padding:2px 5px; color:#b7b7b7; font-weight:normal;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-selection .form-check, .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-selection .form-check:hover { background:transparent;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-selection .form-check { display:inline-block; width:auto; padding:5px 5px 2px 25px; border-radius:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-content { height:calc(100% - 0px); height:calc(100% - 35px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; border-top:1px solid #e1e1e1; border:1px solid #e1e1e1; background:#FFFFFF;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-content .dec-note { font-size:1rem; color:#CCCCCC; margin:0px; padding:5px; width:calc(100% - 0px); text-align:center;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-content .dec-list { width:calc(100% - 0px); margin:0px; padding:2px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-content .dec-list:nth-child(odd) { background:#fafafa;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-content .dec-list .form-check { width:calc(100% - 70px); padding:5px 5px 5px 25px; border-radius:25px; margin:0px 5px 0px 0px;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-content .dec-list:hover { background:#fcfbe0;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem.dec-content .form-check:first-child { margin:0px; border-top:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea { width:60px; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn, .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn:hover { border-radius:0px; margin:0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); border:0px; height:31px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn { background:transparent; color:#595959;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn:hover { background:transparent; color:#29abe2;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn .dec-type, .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn:hover .dec-type { font-size:1rem; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn .dec-ic { margin-left:5px; color:#eaeaea;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn:hover .dec-ic { margin-left:5px; color:#29abe2;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn .dec-ic-01 { margin-left:5px; color:#CCCCCC; display:inline-block;} .MapTool-FunctionBox.dec-TrackHistory-Video .con-main .box-result .box-ListArea .box-listItem .dec-btnArea a.dec-btn:hover .dec-ic-01 { margin-left:5px; color:#29abe2; display:inline-block;} /*end - .MapTool-FunctionBox.dec-TrackHistory-Video -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-TrackHistory-RightSideMode -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-TrackHistory-RightSideMode {} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-top .con-top-title {} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-top .con-top-title a.dec-btn, .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-top .con-top-title a.dec-btn:hover{ margin-left:auto; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-top .con-top-title a.dec-btn { background:#FFFFFF; color:#787878;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-top .con-top-title a.dec-btn:hover { background:#fafafa; color:#169cbf;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .box-inner .con-top .con-top-title .dec-ic { margin:0px;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .box-con:first-child { border:0px;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .box-con .box-infoArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane { height:calc(100% - 0px); overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane .dec-box-con { height:calc(100% - 0px); overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane .dec-box-con .dec-box-inner { height:calc(100% - 0px); overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane .dec-box-con .dec-box-inner {} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-content .tab-pane.dec-TrackHistory-RightSideModeS-01 .dec-box-con .dec-box-inner .dec-box-inner-result { height:calc(100% - 125px); overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-content .tab-pane.dec-TrackHistory-RightSideModeS-02 .dec-box-con .dec-box-inner .dec-box-inner-result { height:calc(100% - 165px); overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav02 .dec-box-con .dec-box-inner .box-conArea.dec-selecter-RightSideMode { height:80px; overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav02 .dec-box-con .dec-box-inner .box-conArea.dec-selecter-RightSideMode-02 { height:45px; overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav02 .dec-box-con .dec-box-inner .dec-box-inner-result { height:calc(100% - 120px); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav02 .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea { width:calc(100% - 0px); margin:0px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav02 .dec-box-con .dec-box-inner .box-conArea.dec-selecter-RightSideMode-02 .box-conArea { width:calc(100% - 0px); margin:0px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav01 .dec-box-con .dec-box-inner .box-conArea.dec-selecter-RightSideMode-02 .box-conArea { width:calc(100% - 0px); margin:0px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav02 .dec-box-con .dec-box-inner .box-conArea.dec-selecter-RightSideMode-02 .box-conArea a.dec-btn { background:#ebebeb; margin:0px; padding:5px 10px; border-radius:25px; color:#999999;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav02 .dec-box-con .dec-box-inner .box-conArea.dec-selecter-RightSideMode-02 .box-conArea a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav01 .dec-box-con .dec-box-inner .box-conArea.dec-selecter-RightSideMode { height:115px; overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav01 .dec-box-con .dec-box-inner .box-conArea.dec-selecter-RightSideMode-02 { height:35px; overflow:hidden;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav01 .dec-box-con .dec-box-inner .dec-box-inner-result { height:calc(100% - 120px); height:calc(100% - 155px); overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav01 .dec-box-con .dec-box-inner .box-conArea.dec-selecter-RightSideMode-02 .box-conArea a.dec-btn { background:#ebebeb; margin:0px; padding:5px 10px; border-radius:25px; color:#999999;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav01 .dec-box-con .dec-box-inner .box-conArea.dec-selecter-RightSideMode-02 .box-conArea a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane .dec-box-con .dec-box-inner .dec-box-inner-result .table-responsive.dec-table.dec-h-01 { height:calc(100% - 0px);} .MapTool-FunctionBox.dec-TrackHistory-RightSideMode .con-main .tab-pane#pills-FunctionArea-TrackHistory-RightSideMode-Nav02 .dec-box-con .dec-box-inner .dec-box-inner-result { width:calc(100% - 0px); height:calc(100% - 125px);} /*end - .MapTool-FunctionBox.dec-TrackHistory-RightSideMode -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Video -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-top-title {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-top-title a.dec-btn, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-top-title a.dec-btn:hover { margin-left:auto; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-top-title a.dec-btn { background:#FFFFFF; color:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-top-title a.dec-btn:hover { background:#fafafa; color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-top-title a.dec-btn.dec-m01 { margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .box-inner .con-top-title .dec-ic { margin:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con:first-child { border:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con .box-infoArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:1rem; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con .dec-box-subTitle .dec-type { display:inline-block; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con .dec-box-subTitle .dec-note { font-size:1rem; color:#f7931e; font-weight:normal;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con .dec-box-subTitle .dec-note::before { content:"："; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-R .dec-note-gray { color:#CCCCCC; font-weight:normal; margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con .box-infoArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L { width:120px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L::after { content:"："; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-R { width:calc(100% - 120px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Video -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title .box-conArea { margin-left:auto;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn:hover { margin-left:auto; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn { background:#FFFFFF; color:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.is-active, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.is-active:hover { background:#fafafa; color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-view-01 { color:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-view-01:hover { color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-view-02 { color:#787878; margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-view-01.is-active { color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-view-01.is-active:hover { color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-view-02.is-active, .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-view-02.is-active:hover { color:#169cbf; margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title .dec-break { margin:0px 10px; padding:0px; width:1px; height:24px; background:#CCCCCC; display:inline-block;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-sort-amount-up { margin-left:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-sort-amount-up:hover { color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-sort-amount-down { margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-sort-amount-down:hover { color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-top-title a.dec-btn.dec-m01 { margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title .dec-ic { margin:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn .dec-ic-01 { color:#787878; font-size:12px; margin:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn .dec-ic-02 { color:#787878; font-size:12px; margin:2px 0px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn .dec-ic-03 { color:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active .dec-ic-01 { color:#169cbf; font-size:12px; margin:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active .dec-ic-02 { color:#169cbf; font-size:12px; margin:2px 0px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active .dec-ic-03 { color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn:hover .dec-ic-01 { color:#169cbf; font-size:12px; margin:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn:hover .dec-ic-02 { color:#169cbf; font-size:12px; margin:2px 0px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn:hover .dec-ic-03 { color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active:hover .dec-ic-01 { color:#169cbf; font-size:12px; margin:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active:hover .dec-ic-02 { color:#169cbf; font-size:12px; margin:2px 0px 0px 0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active:hover .dec-ic-03 { color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .box-inner .con-top-title .dec-type { color:#169cbf; display:inline-block; font-size:1rem; line-height:1.2rem; margin-left:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border:0px; clear:both;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-02 {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 .dec-imgBox { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 .dec-imgBox .dec-img { width:calc((100%/6) - 12px); height:calc(50% - 12px); margin-top:20px; margin-right:12px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(1), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(2), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(3), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(4), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(5), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(6) { margin-top:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(6), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(12) { margin-right:0px;} /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border:0px; clear:both;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con.dec-boxView-01 {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con.dec-boxView-02 {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con.dec-boxView-01 .dec-imgBox { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con.dec-boxView-01 .dec-imgBox .dec-img { width:calc(25% - 12px); height:calc(50% - 12px); margin-top:20px; margin-right:16px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(1), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(2), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(3), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(4) { margin-top:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(4), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(8) { margin-right:0px;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-08*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 { width:calc(100% - 0px); margin:0px; padding:0px 5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border:0px; clear:both;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-02 {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 .dec-imgBox { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 .dec-imgBox .dec-img { width:calc((100%/6) - 12px); height:calc(50% - 12px); margin-top:20px; margin-right:12px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(1), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(2), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(3), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(4), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(5), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(6) { margin-top:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(6), .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12 .box-con.dec-boxView-01 .dec-imgBox .dec-img:nth-child(12) { margin-right:0px;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen .con-main.dec-monitor-12*/ /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Video-FullScreen -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title .box-conArea { margin-left:auto; width:465px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title {} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn:hover { margin-left:5px; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn { background:#FFFFFF;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn:hover, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.is-active, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.is-active:hover{ background:#fafafa; color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-view-01 { color:#787878;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-view-01:hover { color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-view-02 { color:#787878; margin-left:5px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-view-01.is-active { color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-view-01.is-active:hover { color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-view-02.is-active, .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-view-02.is-active:hover { color:#169cbf; margin-left:5px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title .dec-break { margin:0px 10px; padding:0px; width:1px; height:24px; background:#CCCCCC; display: inline-block;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-sort-amount-up { margin-left:0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-sort-amount-up:hover { color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-sort-amount-down { margin-left:5px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-top-title a.dec-btn.dec-sort-amount-down:hover { color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title .dec-ic { margin:0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn .dec-ic-01 { color:#787878; font-size:12px; margin:0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn .dec-ic-02 { color:#787878; font-size:12px; margin:2px 0px 0px 0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn .dec-ic-03 { color:#787878;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active .dec-ic-01 { color:#169cbf; font-size:12px; margin:0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active .dec-ic-02 { color:#169cbf; font-size:12px; margin:2px 0px 0px 0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active .dec-ic-03 { color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn:hover .dec-ic-01 { color:#169cbf; font-size:12px; margin:0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn:hover .dec-ic-02 { color:#169cbf; font-size:12px; margin:2px 0px 0px 0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn:hover .dec-ic-03 { color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active:hover .dec-ic-01 { color:#169cbf; font-size:12px; margin:0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active:hover .dec-ic-02 { color:#169cbf; font-size:12px; margin:2px 0px 0px 0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn.is-active:hover .dec-ic-03 { color:#169cbf;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn.dec-archiveImage { width:auto; margin:0px 0px 0px 5px; margin-left:auto; color:#72bf44;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title a.dec-btn.dec-archiveImage .dec-ic { color: #72bf44;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .box-inner .con-top-title .dec-type { color:#169cbf; display:inline-block; font-size:1rem; line-height:1.2rem; margin-left:5px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-main .box-con-video { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px 0px; border:0px; clear:both; text-align:center;} .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen .con-main .box-con-video .dec-img { margin:0px auto; padding:0px; width:auto; width:calc(100% - 0px); height:calc(100% - 0px); background:#ebebeb;} /*end - .MapTool-FunctionBox.dec-FunctionArea-Alarm-Video-FullScreen -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-top-title {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-top-title .dec-type { color:#34B5E8;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-top-title a.dec-btn, .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-top-title a.dec-btn:hover{ margin-left:auto; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-top-title a.dec-btn { background:#FFFFFF; color:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-top-title a.dec-btn:hover { background:#fafafa; color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .box-inner .con-top-title .dec-ic { margin:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main .box-voice-outerBox { width:calc(100% - 0px); height:calc(100% - 130px); overflow-x:hidden; overflow-y:auto; margin:0px; padding:0px; border-radius:5px; background:#fafafa;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main .box-voice-outer { width:fit-content; top:calc(20% - 0px); margin:auto; padding:5px; background:#999999; border-radius:50px; position:relative;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main .box-voice-outer:hover { background:#5dc1cf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main .box-voice-outer .box-voice-inner { margin:0px; padding:0px; position:relative; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main .box-voice-outer .box-voice-inner .dec-con { width:auto; margin:0px; padding:5px 0px 5px 5px; text-align:right; color:#FFFFFF;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main .box-voice-outer .box-voice-inner a.btn-MapTool { width:30px; min-width:30px; height:30px; overflow: hidden; margin:0px 0px 0px 5px; padding:5px 5px 5px 7px; background:#f0f0f0; border-radius: 25px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main .box-voice-outer .box-voice-inner:hover a.btn-MapTool { background:#FFFFFF;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main .box-voice-outer .box-voice-inner a.btn-MapTool:hover { background:#fcfbe0;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main .box-voice-outer .box-voice-inner a.btn-MapTool .dec-ic { margin-left:2px; padding:0px; color:#c1c1c1;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main .box-voice-outer .box-voice-inner a.btn-MapTool:hover .dec-ic { margin-left:2px; padding:0px; color:#5dc1cf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main a.dec-box-speaker, .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main a.dec-box-speaker:hover { width:calc(100% - 15px); height:120px; margin:0px; padding:0px; text-decoration:none; bottom:8px; position:absolute; border-radius:15px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main a.dec-box-speaker { background:#fafafa; border:1px solid #d6d6d6} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main a.dec-box-speaker:hover { background:#34B5E8; border:1px solid #34B5E8;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main a.dec-box-speaker .dec-ic { color:#999999; margin:5px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main a.dec-box-speaker .dec-type { color:#999999; margin:0px; padding:0px; font-size:14px; line-height:1.2rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main a.dec-box-speaker:hover .dec-ic { color:#FFFFFF;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice .con-main a.dec-box-speaker:hover .dec-type { color:#FFFFFF;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Voice -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-top-title {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-ListArea { width:calc( 100% - 0px); height:calc(100% - 50px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover { width:calc(100% - 0px); margin:0px; padding:5px; border-bottom:1px solid #e1e1e1; background:transparent; text-decoration:none; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover { background:#fcfbe0;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content { width:calc(100% - 0px); margin:0px; padding:0px; margin-right:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content .dec-con-titleArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content .dec-con-titleArea a.dec-con-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content .dec-con-titleArea a.dec-con-title:hover, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content .dec-con-titleArea a.dec-con-title, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content .dec-con-titleArea a.dec-con-title:hover { width:calc(100% - 60px); margin:0px; padding:0px; font-size:1.2rem; line-height:1.7rem; font-weight:500; text-overflow:ellipsis; white-space:nowrap; overflow-x:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content .dec-con-titleArea a.dec-con-title { color:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content .dec-con-titleArea a.dec-con-title:hover { color:#29aecc;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content .dec-con-titleArea a.dec-con-title { color:#29aecc;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content .dec-con-titleArea a.dec-con-title:hover { color:#29aecc;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content .dec-con-titleArea a .dec-ic { color:#999999; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content .dec-con-titleArea .btn-ic-checked { color:#8cc63f; width:25px; height:25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content .dec-con-titleArea .btn-ic-uncheck { color:#f15a24; width:25px; height:25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content .dec-con-titleArea a .dec-ic { color:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content .dec-con-titleArea .btn-ic-checked { color:#72bf44;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content .dec-con-titleArea .btn-ic-uncheck { color:#ed1c24;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content a.dec-con, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content a.dec-con { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1rem; line-height:1.5rem; text-overflow:ellipsis; white-space:nowrap; overflow-x:hidden; color:#b8b8b8;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content a.dec-con { color:#AEAEAE;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List .box-content a.dec-date, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content a.dec-date { width:calc(100% - 0px); margin:0px; padding:0px; font-size:12px; line-height:16px; text-overflow:ellipsis; white-space:nowrap; overflow-x:hidden; color:#b8b8b8;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List:hover .box-content a.dec-date { color:#AEAEAE;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List.dec-unChecked*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List.dec-unChecked .box-content .dec-con-titleArea a.dec-con-title { color:#f23300;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-List.dec-unChecked*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-con*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-con { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-con .con-btnbox { width:60px; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-con .con-btnbox.dec-w01 { width:calc(33% - 5px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-con .con-btnbox.dec-w02 { width:calc(33% - 5px); margin:0px 0px 0px 15px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-con .con-btnbox.dec-w02:nth-child(1) { margin-left:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-con .con-btnbox a.dec-btn { background:#fafafa; margin:0px; padding:3px 0px; border-radius:5px; color:#999999; border:1px solid #ced4da; height:33px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-con .con-btnbox a.dec-btn:hover { color:#169cbf; background:#f5f5f5; border:1px solid #ced4da;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-con .con-btnbox a.dec-btn .dec-ic { margin:0px 2px 0px 0px; padding:0px;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List .con-main .box-con*/ /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-List -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-top-title {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .input-group { margin:0px; padding:0px; border-radius:25px; background:#eff1f3;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .input-group > .form-control:not(:last-child), .input-group > .custom-select:not(:last-child) { border-top-left-radius:25px; border-bottom-left-radius:25px; border-top-right-radius:0px; border-bottom-right-radius:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .input-group .form-control { border:0px; background:#eff1f3; padding-left:10px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .input-group .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color:#cacdd1; opacity:1; /* Firefox */} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .input-group .form-control:-ms- .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .input-group .form-control::-ms-input-placeholder { /* Microsoft Edge */ color:#d8dbdf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .input-group .btn { color:#81868b;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .box-result { margin:0px; padding:0px; width:calc( 100% - 0px); height:calc(100% - 37px); overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .box-ListArea-note { font-size:1rem; color:#5dc1cf; margin:0px; padding:8px 5px 5px 5px; height: 32px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .box-ListArea { width:calc( 100% - 0px); height:calc(100% - 32px); margin:0px; padding:5px 0px 0px 0px; overflow-x:hidden; overflow-y:auto; border-top:1px solid #ebebeb;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .box-ListArea a.box-List, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .box-ListArea a.box-List:hover { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:8px 10px; border:0px; text-decoration:none; font-size:1rem; border-radius:25px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-item-align: start !important; align-self: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .box-ListArea a.box-List:first-child, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .box-ListArea a.box-List:hover:first-child { margin:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .box-ListArea a.box-List { color:#787878; background:transparent;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add .con-main .box-ListArea a.box-List:hover { color:#29aecc; background:#fcfbe0;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-Add -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-top-title {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .input-group { margin:0px; padding:0px; border-radius:25px; background:#eff1f3;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .input-group > .form-control:not(:last-child), .input-group > .custom-select:not(:last-child) { border-top-left-radius:25px; border-bottom-left-radius:25px; border-top-right-radius:0px; border-bottom-right-radius:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .input-group .form-control { border:0px; background:#eff1f3; padding-left:10px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .input-group .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color:#cacdd1; opacity:1; /* Firefox */} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .input-group .form-control:-ms- .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .input-group .form-control::-ms-input-placeholder { /* Microsoft Edge */ color:#d8dbdf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .input-group .btn { color:#81868b;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-result { width:calc(100% - 0px); height:calc(100% - 80px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-result .box-ListArea { width:calc( 100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-con { width:calc(100% - 0px); height:40px; margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-con .con-btnbox { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-con .con-btnbox a { border-radius:25px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-con .con-btnbox a .dec-ic { margin-right:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-con .con-btnbox.dec-unselect a, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-con .con-btnbox.dec-unselect a:hover { background:#fafafa; border:1px solid #e1e1e1; color:#d7d7d7;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-ListArea .box-listItem { width:calc(100% - 0px); margin:0px; padding:5px 0px; color:#595959; border-radius:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-ListArea .box-listItem.dec-selection { height:35px; margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-ListArea .box-listItem.dec-selection .form-check, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-ListArea .box-listItem.dec-selection .form-check:hover { background:transparent;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-ListArea .box-listItem.dec-selection .form-check { width:calc(100% - 0px); padding:10px 5px 0px 25px; border-radius:25px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-ListArea .box-listItem.dec-content { height: calc(100% - 35px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-ListArea .box-listItem .form-check { width:calc(100% - 0px); padding:5px 5px 5px 25px; border-radius:25px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-ListArea .box-listItem .form-check:hover { background:#fcfbe0;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass .con-main .box-ListArea .box-listItem.dec-content .form-check:first-child { margin:0px; border-top:0px; margin-top:5px;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-top-title {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-top-title .dec-type { color:#169cbf; display:inline-block; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main { width:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .input-group { margin:0px; padding:0px; border-radius:25px; background:#eff1f3;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .input-group > .form-control:not(:last-child), .input-group > .custom-select:not(:last-child) { border-top-left-radius:25px; border-bottom-left-radius:25px; border-top-right-radius:0px; border-bottom-right-radius:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .input-group .form-control { border:0px; background:#eff1f3; padding-left:10px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .input-group .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color:#cacdd1; opacity:1; /* Firefox */} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .input-group .form-control:-ms- .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .input-group .form-control::-ms-input-placeholder { /* Microsoft Edge */ color:#d8dbdf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .input-group .btn { color:#81868b;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-result { width:calc(100% - 0px); height:calc(100% - 80px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-result .box-ListArea { width:calc( 100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-con { width:calc(100% - 0px); height: 40px; margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-con .con-btnbox { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-con .con-btnbox a { border-radius:25px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-con .con-btnbox a .dec-ic { margin-right:5px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-con .con-btnbox.dec-unselect a, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-con .con-btnbox.dec-unselect a:hover { background:#fafafa; border:1px solid #e1e1e1; color:#d7d7d7;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-ListArea .box-listItem { width:calc(100% - 0px); margin:0px; padding:5px 0px; color:#595959; border-radius:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-ListArea .box-listItem.dec-selection { height:35px; margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-ListArea .box-listItem.dec-selection .form-check, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-ListArea .box-listItem.dec-selection .form-check:hover { background:transparent;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-ListArea .box-listItem.dec-selection .form-check { width:calc(100% - 0px); padding:10px 5px 0px 25px; border-radius:25px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-ListArea .box-listItem.dec-content { height:calc(100% - 35px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-ListArea .box-listItem .form-check { width:calc(100% - 0px); padding:5px 5px 5px 25px; border-radius:25px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-ListArea .box-listItem .form-check:hover { background:#fcfbe0;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-main .box-ListArea .box-listItem.dec-content .form-check:first-child { margin:0px; border-top:0px; margin-top:5px;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-top-title {} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-top-title .dec-type { color:#34B5E8;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-top-title a.dec-btn, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-top-title a.dec-btn:hover { margin-left:auto; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-top-title a.dec-btn { background:#FFFFFF; color:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-top-title a.dec-btn:hover { background:#fafafa; color:#169cbf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .box-inner .con-top-title .dec-ic { margin:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-messageText { width:calc(100% - 0px); height:calc(100% - 50px); margin:0px; padding:5px; overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-messageTextBtn { width:calc(100% - 0px); height:50px; margin:0px; padding:5px; overflow-x:hidden; overflow-y:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-messageTextBtn .con-conbox { width:calc(100% - 65px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-messageTextBtn .con-btnbox { width:60px; margin:0px 0px 0px 5px; padding:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-messageTextBtn .con-btnbox a.btn-search, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-messageTextBtn .con-btnbox a.btn-search:hover { border-radius:5px; margin:0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-messageTextBtn .con-btnbox a.btn-search.disabled, .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-messageTextBtn .con-btnbox a.btn-search.disabled:hover { color:#FFFFFF; background:#CCCCCC;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-messageTextBtn .con-btnbox a.btn-search { color:#999999; background:#ebebeb; border:1px solid #ced4da;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-messageTextBtn .con-btnbox a.btn-search:hover { color:#169cbf; background:#f5f5f5; border:1px solid #ced4da;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer { width:fit-content; margin:0px auto; margin-bottom:5px; padding:5px; background:#999999; border-radius:50px; color:#FFFFFF;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer:hover { background:#787878;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer .box-voice-inner { margin:0px; padding:0px; position:relative; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer:hover .box-voice-inner { color:#FFFFFF;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer:hover { background:#5dc1cf;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer .box-voice-inner .dec-con { width:auto; margin:0px; padding:5px 0px 5px 5px; text-align:right; word-break:break-all; color:#FFFFFF;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer .box-voice-inner a.btn-MapTool { width:30px; min-width:30px; height:30px; overflow:hidden; margin:0px 0px 0px 5px; padding:5px 5px 5px 7px; background: #f0f0f0; border-radius:25px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer .box-voice-inner:hover a.btn-MapTool { background:#FFFFFF;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer .box-voice-inner a.btn-MapTool:hover { background:#fcfbe0;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer .box-voice-inner a.btn-MapTool .dec-ic { margin-left:2px; padding:0px; color:#c1c1c1;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-voice-outer .box-voice-inner a.btn-MapTool:hover .dec-ic { margin-left:2px; padding:0px; color:#5dc1cf;} /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; border-radius:0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: end !important; align-self: flex-end !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con:first-child { margin:0px; border:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con .box-con { width:calc(100% - 50px); margin:0px; padding:5px; border-radius:15px 15px 0px 15px; background:#29aecc; text-align:left; color:#FFFFFF; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-order: 2; order: 2;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con .box-con .box-Name { width: auto; margin:0px; padding:5px; font-size: 1rem; line-height:1.2rem; border-radius:50px; text-align:right; background:#FFFFFF; color:#29aecc;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con .box-con .box-Con { width:calc(100% - 0px); margin:0px; padding:2px 0px 0px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-item-align: start !important; align-self: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con .box-con .box-Con .dec-time { font-size:12px; line-height:1.3rem; color:#fcfbe0;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con .box-note { width:50px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-item-align: end !important; align-self: flex-end !important; -ms-flex-order: 1; order: 1;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con .box-con .box-R .dec-type { font-size:1rem; line-height:1.3rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con .box-note .btn-ic-checked { color:#8cc63f; width:25px; height:25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent; margin-left:auto;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con .box-note .btn-ic-uncheck { color:#f15a24; width:25px; height:25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent; margin-left:auto;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con .box-note .btn-ic-checked:hover { color:#72bf44;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con .box-note .btn-ic-uncheck:hover { color:#ed1c24;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; border-radius:0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: end !important; align-self: flex-end !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer:first-child { margin:0px; border:0px;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-con { width:calc(100% - 50px); margin:0px; padding:5px; border-radius:15px 15px 15px 0px; background:#f0f0f0; text-align:left; color:#666666; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-order: 1; order: 1;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-con .box-Name { width:auto; margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; border-radius:50px; text-align:right; background:#FFFFFF; color:#595959;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-con .box-Con { width:calc(100% - 0px); margin:0px; padding:2px 0px 0px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-item-align: start !important; align-self: flex-start !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-con .box-Con .dec-time { font-size:12px; line-height:1.3rem; color:#AFAFAF;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-note { width:50px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-item-align: end !important; align-self: flex-end !important; -ms-flex-order: 1; order: 1;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-con .box-R .dec-type { font-size:1rem; line-height:1.3rem;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-note .btn-ic-checked { color:#8cc63f; width:25px; height:25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent; margin-left:auto;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-note .btn-ic-uncheck { color:#f15a24; width:25px; height: 25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent; margin-left:auto;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-note .btn-ic-checked:hover { color:#72bf44;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-note .btn-ic-uncheck:hover { color:#ed1c24;} .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer .box-note .dec-time { font-size:12px; line-height:1.3rem; color:#AFAFAF;} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message .con-main .box-message-con.dec-viewer*/ /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Mission-Edit -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Mission-Edit .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-bottom:1px solid #e1e1e1; margin-bottom:5px; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con.dec-box { background:#fafafa; padding:5px; margin-bottom:5px; border:1px solid #c6dbde; border-radius:5px;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con:last-child { border:0px;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoArea { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:20px 0px; background:#f0f0f0; border-radius:5px; font-size:1.2rem; line-height:1.5rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoArea .box-carInfo-Num { margin:0px; padding:0px 5px 0px 0px;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoArea .box-carInfo-Driver { margin:0px; padding:0px; color:#1591BC;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoConOuter { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon.dec-box-01 { padding-top:0px;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-title { width:100px; margin:0px; padding:0px 5px 0px 0px; text-align:right;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-con { width:calc(100% - 100px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-con.dec-textAlignR { text-align:right;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-con a { border-bottom:1px solid transparent;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-con a:hover { border-bottom:1px solid #f7931e;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-con-whole { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-con-half-01 { width:calc(50% - 5px); margin:0px 5px 0px 0px; padding:0px;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-con-half-02 { width:calc(50% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-con .dec-textarea { background:#FFFFFF; border:1px solid #ced4da; width:calc(100% - 0px); color:#495057;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-con-groupTitle { width:calc(100% + 10px); margin:-10px -5px 0px -5px; padding:5px 0px; border-bottom:1px solid #c6dbde; text-align:center; font-weight:500; background:#e8eff0; border-radius:3px 3px 0px 0px; color: #698394;} .MapTool-FunctionBox.dec-Mission-Edit .con-main .box-con .box-infoCon .dec-note { width:calc(100% - 25px); margin:0px 10px 0px 15px; padding:0px; font-size:14px; line-height:1.2rem; color:#999999;} /*end - .MapTool-FunctionBox.dec-Mission-Edit -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Mission-Detail -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main { width:calc(100% - 0px); margin:0px; padding:0px; height:calc(100% - 0px); overflow:hidden;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-bottom:1px solid #e1e1e1; margin-bottom:5px; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:1rem; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#169cbf;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-con .dec-box-subTitle .dec-type { display:inline; color:#595959; background:#FFFFFF; border-radius:25px; padding:2px 5px 2px 7px; margin-right:5px;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-con .dec-box-subTitle .dec-type:last-child { margin-left:5px;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-btnArea {} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea { margin:0px; padding:5px; width:calc(100% - 0px); height:calc(100% - 175px); overflow-x:hidden; overflow-y:auto; font-size:1rem; line-height:1.2rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:0px; border:1px solid #e1e1e1; border-radius:5px; background:#fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item:hover { background:#fcfcfc;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item:first-child { margin:0px;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea { width:45px; margin:0px; padding:5px; background:#595959; border-radius:3px 0px 5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item:hover .dec-box-itemNumArea { background:#666666;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea .dec-type { font-size:12px; line-height:14px; color:#FFFFFF;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea .dec-num { font-size:1.5rem; line-height:2rem; color:#FFFFFF; font-weight:500;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea { width:calc(100% - 50px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list:first-child { margin:0px;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list .dec-L { width:100px; text-align:right;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list .dec-R { width:calc(100% - 115px); margin:0px; padding:5px; color:#169cbf;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-function { width:calc(100% - 0px); margin:0px; padding:5px; margin-top:5px; border-radius:0px 0px 5px 0px; border-top:1px dotted #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-function a, .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-function a:hover { margin:0px 0px 0px 5px; padding:8px 10px; text-decoration:none; height:34px; overflow:hidden; background:transparent; border-radius:25px; border:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-function a { color:#595959; background:transparent;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-function a:hover { color:#333333; background:#ebebeb;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-function a.dec-arrow, .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-function a.dec-arrow:hover { padding:7px 8px; border-radius:5px;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-box-function .dec-note { font-size:12px; line-height:16px; color:#595959; margin:0px; padding:0px; margin-left:auto;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-type-missionCondition-B, .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-type-missionCondition-C, .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-type-missionCondition-D { font-size:1rem; margin:0px; padding:3px 8px 4px 8px; color:#FFFFFF; border-radius:25px; display:inline;} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-type-missionCondition-B::after { content:"未開始";} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-type-missionCondition-C::after { content:"進行中";} .MapTool-FunctionBox.dec-Mission-Detail .box-inner .con-main .box-missionConArea .dec-type-missionCondition-D::after { content:"完成";} /* 派遣狀態｜1.未開始 #b3b3b3 (179, 179, 179) dec-type-missionCondition-B 派遣狀態｜2.進行中 #0089ff (0, 137, 255) dec-type-missionCondition-C 派遣狀態｜3.完成 #39b54a (57, 181, 74) dec-type-missionCondition-D */ /*end - .MapTool-FunctionBox.dec-Mission-Detail -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main { width:calc(100% - 0px); margin:0px; padding:0px; height:calc(100% - 45px); overflow:hidden;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-btnArea {} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea { margin:0px; padding:5px; width:calc(100% - 0px); height:calc(100% - 40px); overflow-x:hidden; overflow-y:auto; font-size: 1rem; line-height:1.2rem; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .nav-pills.dec-con-01 .nav-item { width:auto;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .tab-content.dec-con-01 { height:calc(100% - 30px); padding-bottom:0px;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .tab-content.dec-con-01 .tab-pane {} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .tab-content.dec-con-01 .tab-pane .box-con-a03 { padding-bottom:5px; padding-top:5px;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .nav-pills.dec-con-01 { width:calc(100% - 0px);} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .nav-pills.dec-con-01 .dec-type { color:#595959; font-size:1rem; margin:0px; padding:5px 5px 0px 0px;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .nav-pills.dec-con-01 .nav-link { text-align: center;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:0px 0px 5px 0px; border:1px solid #e1e1e1; border-radius:5px; background:#fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item:hover { background:#fcfcfc;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item:first-child { margin:0px;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea { width:45px; margin:0px; padding:5px; background:#595959; border-radius:3px 0px 5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item:hover .dec-box-itemNumArea { background:#666666;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea .dec-type { font-size:12px; line-height:14px; color:#FFFFFF;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea .dec-num { font-size:2rem; line-height:2rem; color:#FFFFFF; font-weight:500;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea { width:calc(100% - 50px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list:first-child { margin:0px;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list .dec-L { width:75px; text-align:right;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list .dec-R { width:calc(100% - 80px); margin:0px; padding:5px; color:#169cbf;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-function { width:calc(100% - 0px); margin:0px; padding:5px; margin-top:5px; border-radius:0px 0px 5px 0px; border-top:1px dotted #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-function a, .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-function a:hover { margin:0px 0px 0px 5px; padding:8px 10px; text-decoration:none; height:34px; overflow:hidden; background:transparent; border-radius: 25px; border:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-function a { color:#595959; background:transparent;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-function a:hover { color:#333333; background:#ebebeb;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-function a.dec-arrow, .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-function a.dec-arrow:hover { padding:7px 8px; border-radius:5px;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-box-function .dec-note { font-size:12px; line-height:16px; color:#595959; margin:0px; padding:0px; margin-left:auto;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-type-missionCondition-B, .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-type-missionCondition-C, .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-type-missionCondition-D { font-size:1rem; margin:0px; padding:3px 8px 4px 8px; color:#FFFFFF; border-radius:25px; display:inline;} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-type-missionCondition-B::after { content:"未開始";} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-type-missionCondition-C::after { content:"進行中";} .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder .box-inner .con-main .box-missionConArea .dec-type-missionCondition-D::after { content:"完成";} /* 派遣狀態｜1.未開始 #b3b3b3 (179, 179, 179) dec-type-missionCondition-B 派遣狀態｜2.進行中 #0089ff (0, 137, 255) dec-type-missionCondition-C 派遣狀態｜3.完成 #39b54a (57, 181, 74) dec-type-missionCondition-D */ /*end - .MapTool-FunctionBox.dec-Mission-Detail-RouteOrder -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Mission-Detail-FillIn -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main { width:calc(100% - 0px); margin:0px; padding:0px; height:calc(100% - 45px); overflow:hidden;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:0px; border:1px solid #e1e1e1; border-radius:5px; background:#fafafa; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item:hover { background:#fcfcfc;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item:first-child {} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item .dec-box-itemNumArea { width:45px; margin:0px; padding:5px; background:#595959; border-radius:3px 0px 0px 3px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item:hover .dec-box-itemNumArea { background:#666666;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item .dec-box-itemNumArea .dec-type { font-size:12px; line-height:14px; color:#FFFFFF;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item .dec-box-itemNumArea .dec-num { font-size:2rem; line-height:2rem; color:#FFFFFF; font-weight:500;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item .dec-box-itemConArea { width:calc(100% - 50px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item .dec-box-itemConArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; background:#fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item .dec-box-itemConArea .dec-box-list:first-child { margin:0px;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item .dec-box-itemConArea .dec-box-list .dec-L { width:calc(100% - 0px); text-align:left;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-item .dec-box-itemConArea .dec-box-list .dec-R { width:calc(100% - 0px); margin:0px; padding:5px 0px; color:#169cbf; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-itemDetail { width:calc(100% - 0px); margin:0px; padding:0px 20px 10px 5px; height:calc(100% - 65px); overflow-x:hidden; overflow-y:auto; font-size:1rem; line-height:1.5rem; color:#595959; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-itemDetail .dec-title { font-weight:500; width:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px; border-top:1px solid #e1e1e1;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-itemDetail .dec-title:first-child { border-top:0px;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-itemDetail .dec-title-sub { font-weight:400; width:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-itemDetail .dec-con { font-weight:400; width:calc(100% - 0px); margin:0px; padding:5px 0px;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-itemDetail .dec-contentBox { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px 0px 10px 0px; border-radius:0px; border-radius:5px; padding-left:5px; background:#f5f5f5;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-itemDetail .dec-box-list { width:calc(100% - 15px); margin:0px 0px 0px 15px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-itemDetail .dec-box-list .dec-L { width:75px; margin:0px; padding:5px 0px; text-align:right; color:#787878; line-height:1.2rem;} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-itemDetail .dec-box-list .dec-L::after { content:"：";} .MapTool-FunctionBox.dec-Mission-Detail-FillIn .box-inner .con-main .dec-box-itemDetail .dec-box-list .dec-R { width:calc(100% - 75px); margin:0px; padding:5px 0px; color:#169cbf; line-height:1.2rem;} /*end - .MapTool-FunctionBox.dec-Mission-Detail-FillIn -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Mission-InfoWindow -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con:first-child { border:0px; padding-bottom:10px;} .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner .con-top .con-top-title { color:#FFFFFF;} .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner .con-top .con-top-title .dec-type-missionCondition-A { background:#0089ff; margin:0px; padding:5px;} .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner .con-top .con-top-title .dec-type-missionCondition-B { background:#ff0000; margin:0px; padding:5px;} .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner .con-top .con-top-title .dec-type-missionCondition-C { background:#787878; margin:0px; padding:5px;} .MapTool-FunctionBox.dec-Mission-InfoWindow .box-inner .con-top .con-top-title .dec-type-missionCondition-D { background:#b3b3b3; margin:0px; padding:5px;} /*派遣狀態/進行中｜#0089ff｜(0, 137, 255) ｜dec-type-missionCondition-A 派遣狀態/異常 ｜#ff0000 ｜(255, 0, 0) ｜dec-type-missionCondition-B 派遣狀態/已配達｜#787878｜(120, 120, 120)｜dec-type-missionCondition-C 派遣狀態/未開始｜#b3b3b3｜(179, 179, 179)｜dec-type-missionCondition-D*/ .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-note { font-size:1rem; width:calc(100% - 0px); background:transparent;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-note.dec-type-missionCondition-A { color:#0089ff; margin: 0px; padding:5px;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-note.dec-type-missionCondition-B { color:#ff0000; margin: 0px; padding:5px;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-note.dec-type-missionCondition-C { color:#787878; margin: 0px; padding:5px;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-note.dec-type-missionCondition-D { color:#b3b3b3; margin: 0px; padding:5px;} /*派遣狀態/進行中｜#0089ff｜(0, 137, 255) ｜dec-type-missionCondition-A 派遣狀態/異常 ｜#ff0000 ｜(255, 0, 0) ｜dec-type-missionCondition-B 派遣狀態/已完成｜#787878｜(120, 120, 120)｜dec-type-missionCondition-C 派遣狀態/未開始｜#b3b3b3｜(179, 179, 179)｜dec-type-missionCondition-D*/ .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-box-group { width:calc(100% - 0px); margin:0px; padding:0px; background:#fafafa;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L { width:100px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-L::after { content:"："; color:#595959;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-box-list .dec-box-list-R { width:calc(100% - 100px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-Mission-InfoWindow .con-main .box-con .box-infoArea .dec-box-subTitle { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:4px 8px; border-bottom:1px solid #e1e1e1; font-size:1.1rem; line-height:1.5rem; font-weight:500; letter-spacing:0.2rem;} .MapTool-FunctionBox.dec-Mission-InfoWindow:after, .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow:after, .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-Video:after { display:block; position:absolute; height:0; width:0; border-top:10px solid #5c5c5c; border-left:10px solid transparent; border-right:10px solid transparent; content:''; bottom:-10px;} .MapTool-FunctionBox.dec-Mission-InfoWindow:after { right:175px;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow:after { right:135px;} .MapTool-FunctionBox.dec-MapLayer-MapPOIInfoWindow.dec-MapTool-Monitor-InfoWindow-Video:after { right:155px;} /*end - .MapTool-FunctionBox.dec-Mission-InfoWindow -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-CarMission-Schedule -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-main { width:calc(100% - 0px); margin:0px; padding:0px 5px} .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-main .con-functionbox div.form-check { display:inline-block; margin:5px 25px 5px 0px;} .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-main .box-inner-width-h-btn a.dec-btn { background:#ebebeb; margin:0px; padding:3px 10px; border-radius:5px; color:#999999; border:1px solid #ced4da; height:33px;} .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-main .box-inner-width-h-btn a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .MapTool-FunctionBox.dec-CarMission-Schedule .box-inner .con-main .dec-color { color:#e73828;} /*end - .MapTool-FunctionBox.dec-CarMission-Schedule -------------------------------------------------------------------------------------------------------*/ /*start - 次選單SubMenu｜即時監控、軌跡查詢、任務派遣、站牌與路線、停車場、道路管理RoadM、奇美任務、充電樁、區域查詢 -------------------------------------------------------------------------------------*/ .div-MapTool-MonitorCar-SubMenu, .div-MapTool-TrackHistory-SubMenu, .div-MapTool-POI-SubMenu, .div-MapTool-Mission-SubMenu, .div-MapTool-CarMission-SubMenu, .div-MapTool-BusStopRoute-SubMenu, .div-MapTool-ParkingLot-SubMenu, .div-MapTool-RoadM-SubMenu, .div-MapTool-ChiMeiMission-SubMenu, .div-MapTool-ChargingPile-SubMenu, .div-MapTool-FunctionArea-AreaSearch-SubMenu { background:#5c5c5c !important; margin:0px; padding:0px; width:108px; position:absolute; top:29px; z-index:9999;} .div-MapTool-MonitorCar-SubMenu { left:0px;} .div-MapTool-TrackHistory-SubMenu { left:0px;} .div-MapTool-POI-SubMenu { left:0px;} .div-MapTool-Mission-SubMenu { left:0px;} .div-MapTool-CarMission-SubMenu { left:0px;} .div-MapTool-BusStopRoute-SubMenu { left:5px;} .div-MapTool-ParkingLot-SubMenu { left:0px;} .div-MapTool-RoadM-SubMenu { left:0px;} .div-MapTool-ChiMeiMission-SubMenu { left:0px;} .div-MapTool-ChargingPile-SubMenu { left:0px;} .div-MapTool-FunctionArea-AreaSearch-SubMenu { left:-40px;} .div-MapTool-MonitorCar-SubMenu a, .div-MapTool-MonitorCar-SubMenu a:hover, .div-MapTool-TrackHistory-SubMenu a, .div-MapTool-TrackHistory-SubMenu a:hover, .div-MapTool-POI-SubMenu a, .div-MapTool-POI-SubMenu a:hover, .div-MapTool-Mission-SubMenu a, .div-MapTool-Mission-SubMenu a:hover, .div-MapTool-CarMission-SubMenu a, .div-MapTool-CarMission-SubMenu a:hover, .div-MapTool-BusStopRoute-SubMenu a, .div-MapTool-BusStopRoute-SubMenu a:hover, .div-MapTool-ParkingLot-SubMenu a, .div-MapTool-ParkingLot-SubMenu a:hover, .div-MapTool-RoadM-SubMenu a, .div-MapTool-RoadM-SubMenu a:hover, .div-MapTool-ChiMeiMission-SubMenu a, .div-MapTool-ChiMeiMission-SubMenu a:hover, .div-MapTool-ChargingPile-SubMenu a, .div-MapTool-ChargingPile-SubMenu a:hover, .div-MapTool-FunctionArea-AreaSearch-SubMenu a, .div-MapTool-FunctionArea-AreaSearch-SubMenu a:hover { margin:0px; padding:5px; border-bottom:0px solid #ebebeb; width:calc(100% - 0px); display:block; text-align:center; color:#FFFFFF;} .div-MapTool-MonitorCar-SubMenu a, .div-MapTool-TrackHistory-SubMenu a, .div-MapTool-POI-SubMenu a, .div-MapTool-Mission-SubMenu a, .div-MapTool-CarMission-SubMenu a, .div-MapTool-BusStopRoute-SubMenu a, .div-MapTool-ParkingLot-SubMenu a, .div-MapTool-RoadM-SubMenu a, .div-MapTool-ChiMeiMission-SubMenu a, .div-MapTool-ChargingPile-SubMenu a, .div-MapTool-FunctionArea-AreaSearch-SubMenu a { background:transparent;} .div-MapTool-MonitorCar-SubMenu a:hover, .div-MapTool-TrackHistory-SubMenu a:hover, .div-MapTool-POI-SubMenu a:hover, .div-MapTool-Mission-SubMenu a:hover, .div-MapTool-CarMission-SubMenu a:hover, .div-MapTool-BusStopRoute-SubMenu a:hover, .div-MapTool-ParkingLot-SubMenu a:hover, .div-MapTool-RoadM-SubMenu a:hover, .div-MapTool-ChiMeiMission-SubMenu a:hover, .div-MapTool-ChargingPile-SubMenu a:hover, .div-MapTool-FunctionArea-AreaSearch-SubMenu a:hover { background:#787878;} .div-MapTool-MonitorCar-SubMenu a:last-child, .div-MapTool-TrackHistory-SubMenu a:last-child, .div-MapTool-POI-SubMenu a:last-child, .div-MapTool-Mission-SubMenu a:last-child, .div-MapTool-CarMission-SubMenu a:last-child, .div-MapTool-BusStopRoute-SubMenu a:last-child, .div-MapTool-ParkingLot-SubMenu a:last-child, .div-MapTool-RoadM-SubMenu a:last-child, .div-MapTool-ChiMeiMission-SubMenu a:last-child, .div-MapTool-ChargingPile-SubMenu a:last-child, .div-MapTool-FunctionArea-AreaSearch-SubMenu a:last-child { border:0px;} .div-MapTool-MonitorCar-SubMenu a .dec-note, .div-MapTool-MonitorCar-SubMenu a:hover .dec-note, .div-MapTool-TrackHistory-SubMenu a .dec-note, .div-MapTool-TrackHistory-SubMenu a:hover .dec-note, .div-MapTool-POI-SubMenu a .dec-note, .div-MapTool-POI-SubMenu a:hover .dec-note, .div-MapTool-Mission-SubMenu a .dec-note, .div-MapTool-Mission-SubMenu a:hover .dec-note, .div-MapTool-CarMission-SubMenu a .dec-note, .div-MapTool-CarMission-SubMenu a:hover .dec-note, .div-MapTool-BusStopRoute-SubMenu a .dec-note, .div-MapTool-BusStopRoute-SubMenu a:hover .dec-note, .div-MapTool-ParkingLot-SubMenu a .dec-note, .div-MapTool-ParkingLot-SubMenu a:hover .dec-note, .div-MapTool-RoadM-SubMenu a .dec-note, .div-MapTool-RoadM-SubMenu a:hover .dec-note, .div-MapTool-ChargingPile-SubMenu a .dec-note, .div-MapTool-ChargingPile-SubMenu a:hover .dec-note, .div-MapTool-ChiMeiMission-SubMenu a .dec-note, .div-MapTool-ChiMeiMission-SubMenu a:hover .dec-note, .div-MapTool-ChargingPile-SubMenu a .dec-note, .div-MapTool-ChargingPile-SubMenu a:hover .dec-note, .div-MapTool-FunctionArea-AreaSearch-SubMenu a .dec-note, .div-MapTool-FunctionArea-AreaSearch-SubMenu a:hover .dec-note { display:block; font-size:12px; line-height:14px; color:#fafafa; color:#CCCCCC;} /*end - 次選單SubMenu｜即時監控、軌跡查詢、任務派遣、站牌與路線、停車場、道路管理RoadM、奇美任務、充電樁、區域查詢 -------------------------------------------------------------------------------------*/ /*start - .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main { width:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; height:calc(100% - 45px); overflow:hidden;} /*.MapTool-FunctionBox.dec-BusStopRoute-BusStop.div-MapTool-BusStopRoute-BusStop-addStop .box-inner .con-main { overflow-x: hidden; overflow-y: auto;}*/ .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main .con-functionbox div.form-check { display:inline-block; margin:5px 25px 5px 0px;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main .box-inner-width-h-btn a.dec-btn { background:#ebebeb; margin:0px; padding:3px 10px; border-radius:5px; color:#999999; border:1px solid #ced4da; height:33px;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main .box-inner-width-h-btn a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main .dec-color {color:#e73828;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main .dec-BusStopRoute-BusStop-Result { width:calc(100% - 0px); height:calc(100% - 157px); margin:0px; padding:0px;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main .box-con { margin:0px; padding:5px 0px 10px 0px;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main a.dec-btn-road, .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main a.dec-btn-road:hover { width:calc(100% - 0px); margin:0px; padding:15px 10px; text-decoration:none; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main a.dec-btn-road { background:#fafafa; border:1px solid #d6d6d6} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main a.dec-btn-road:hover { background:#34B5E8; border:1px solid #34B5E8;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main a.dec-btn-road .dec-ic { color: #999999; margin:5px; padding:0px;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main a.dec-btn-road .dec-type { color: #999999; margin:0px; padding:0px; font-size:14px; line-height:1.2rem;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main a.dec-btn-road:hover .dec-ic { color:#FFFFFF;} .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main a.dec-btn-road:hover .dec-type { color:#FFFFFF;} /*end - .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main { width:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; height:calc(100% - 45px); overflow:hidden;} /*.MapTool-FunctionBox.dec-BusStopRoute-BusStop.div-MapTool-BusStopRoute-BusStop-addStop .box-inner .con-main { overflow-x: hidden; overflow-y: auto;}*/ .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main .con-functionbox div.form-check { display:inline-block; margin:5px 25px 5px 0px;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main .box-inner-width-h-btn a.dec-btn { background:#ebebeb; margin:0px; padding:3px 10px; border-radius:5px; color:#999999; border:1px solid #ced4da; height:33px;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main .box-inner-width-h-btn a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main .dec-color { color:#e73828;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main .dec-BusStopRoute-BusStop-Result { width:calc(100% - 0px); height:calc(100% - 157px); margin:0px; padding:0px;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main .box-con { margin:0px; padding:5px 0px 10px 0px;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main a.dec-btn-road, .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main a.dec-btn-road:hover { width:calc(100% - 0px); margin:0px; padding:15px 10px; text-decoration:none; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main a.dec-btn-road { background:#fafafa; border:1px solid #d6d6d6} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main a.dec-btn-road:hover { background:#34B5E8; border:1px solid #34B5E8;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main a.dec-btn-road .dec-ic { color:#999999; margin:5px; padding:0px;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main a.dec-btn-road .dec-type { color:#999999; margin:0px; padding:0px; font-size:14px; line-height:1.2rem;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main a.dec-btn-road:hover .dec-ic { color:#FFFFFF;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main a.dec-btn-road:hover .dec-type { color:#FFFFFF;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main a.dec-btn-road .icon-sprite { margin:3px; opacity:0.5;} .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable .con-main a.dec-btn-road:hover .icon-sprite { background-position:-272px -1668px; opacity:1;} /*end - .box-inner.dec-BusStopRoute-BusStop-addStop-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-BusStopRoute-Route .dec-BusStopRoute-Route-Result { height:calc(100% - 165px);} /*start - .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main .dec-BusStopRoute-BusStop-Result { height:calc(100% - 165px);} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main a.dec-btn-road, .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main a.dec-btn-road:hover { width:calc(100% - 0px); margin:0px; padding:15px 10px; text-decoration:none; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main a.dec-btn-road { background:#fafafa; border:1px solid #d6d6d6} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main a.dec-btn-road:hover { background:#34B5E8; border:1px solid #34B5E8;} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main a.dec-btn-road .dec-ic { color:#999999; margin:5px; padding:0px;} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main a.dec-btn-road .dec-type { color:#999999; margin:0px; padding:0px; font-size:14px; line-height:1.2rem;} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main a.dec-btn-road:hover .dec-ic { color:#FFFFFF;} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main a.dec-btn-road:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main a.dec-btn-road .icon-sprite.dec-ic { opacity:0.6;} .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main a.dec-btn-road:hover .icon-sprite.dec-ic { opacity:1; width:18px; height:18px; background:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:-272px -1668px;} /*end - .MapTool-FunctionBox.dec-BusStopRoute-BusStop .box-inner .con-main -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-BusStopRoute-Route -------------------------------------------------------------------------------------------------------*/ .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main { width:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .dec-BusStopRoute-Route-Result { width:calc(100% - 0px); height:calc(100% - 157px); margin:0px; padding:0px;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .con-functionbox div.form-check { display:inline-block; margin: 5px 25px 5px 0px;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .box-inner-width-h-btn a.dec-btn { background:#ebebeb; margin:0px; padding:3px 10px; border-radius:5px; color:#999999;border:1px solid #ced4da; height:33px;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .box-inner-width-h-btn a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .dec-color { color:#e73828;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main { height:calc(100% - 45px); overflow:hidden;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .tab-content.dec-con-01 { height:calc(100% - 45px); overflow:hidden;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .tab-content.dec-con-01 .tab-pane.dec-content-01 { height: calc(100% - 0px); overflow:hidden;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .tab-content.dec-con-01 .tab-pane.dec-content-01 .box-conArea { height: calc(100% - 0px); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-item-align: start !important; align-self: start !important;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .tab-content.dec-con-01 .tab-pane.dec-content-01 .box-conArea .box-conArea-outerBox { height:auto;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .tab-content.dec-con-01 .tab-pane.dec-content-01 .box-conArea .box-conArea-outerBox.dec-inner-content-01 { height:calc(100% - 300px); overflow-x:hidden; overflow-y:auto;} .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .box-Route-conArea { width:calc(100% - 0px); margin:0px; padding:0px; height:calc(100% - 165px);} .box-Route-conArea .box-btnArea { width:calc(100% - 0px); height: 40px; margin:0px; padding:0px; border-bottom: 1px solid #e1e1e1; } .box-Route-conArea .box-btnArea a, .box-Route-conArea .box-btnArea a:hover { width:calc(100% - 0px); margin:0px; padding:5px 0px; text-align:center;} .box-Route-conArea .box-listArea { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; height:calc(100% - 45px); overflow-x:hidden; overflow-y:auto;} .box-Route-conArea .box-listArea .dec-note { width:calc(100% - 0px); margin:0px; padding:5px; color:#b9b9b9; font-size:1rem; line-height:1.2rem; text-align:center;} .box-Route-conArea .box-listArea .box-listItem { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; border-radius:25px; background:#fafafa; display: -ms-flexbox !important; display: flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .box-Route-conArea .box-listArea .box-listItem:hover { background:#fcfbe0;} .box-Route-conArea .box-listArea .box-listItem .dec-num-outer { width:30px; height:30px; margin:0px 5px; padding:0px; border-radius:25px; background:#e1f1f4; display: -ms-flexbox !important; display: flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .box-Route-conArea .box-listArea .box-listItem .dec-num-outer .dec-num { font-size:1rem; font-weight:500; margin:0px; padding:0px; color:#29aecc; display: -ms-flexbox !important; display: flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .box-Route-conArea .box-listArea .box-listItem .box-con { width:calc(100% - 75px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: start !important; justify-content: start !important;} .box-Route-conArea .box-listArea .box-listItem .box-btn { width:35px; margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: center !important; justify-content: center !important;} /*end - .box-inner.dec-BusStopRoute-Route-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main -------------------------------------------------------------------*/ .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main { width:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .dec-BusStopRoute-Route-addRoute-Result { width:calc(100% - 0px); height:calc(100% - 157px); margin:0px; padding:0px;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .con-functionbox div.form-check { display:inline-block; margin: 5px 25px 5px 0px;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .box-inner-width-h-btn a.dec-btn { background:#ebebeb; margin:0px; padding:3px 10px; border-radius:5px; color:#999999;border:1px solid #ced4da; height:33px;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .box-inner-width-h-btn a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .dec-color { color:#e73828;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main { height:calc(100% - 45px); overflow:hidden;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .tab-content.dec-con-01 { height:calc(100% - 45px); overflow:hidden;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .tab-content.dec-con-01 .tab-pane.dec-content-01 { height: calc(100% - 0px); overflow:hidden;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .tab-content.dec-con-01 .tab-pane.dec-content-01 .box-conArea { height: calc(100% - 0px); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-item-align: start !important; align-self: start !important;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .tab-content.dec-con-01 .tab-pane.dec-content-01 .box-conArea .box-conArea-outerBox { height:auto;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .tab-content.dec-con-01 .tab-pane.dec-content-01 .box-conArea .box-conArea-outerBox.dec-inner-content-01 { height:calc(100% - 300px); overflow-x:hidden; overflow-y:auto;} .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .box-Route-conArea { width:calc(100% - 0px); margin:0px; padding:0px; height:calc(100% - 165px);} /*end - .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main -------------------------------------------------------------------*/ /*start - .box-Route-conArea .box-btnArea -------------------------------------------------------------------*/ .box-Route-conArea .box-btnArea { width:calc(100% - 0px); height: 40px; margin:0px; padding:0px; border-bottom: 1px solid #e1e1e1;} .box-Route-conArea .box-btnArea a, .box-Route-conArea .box-btnArea a:hover { width:calc(100% - 0px); margin:0px; padding:5px 0px; text-align:center; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-Route-conArea .box-btnArea a:hover .icon-sprite { background-position: -68px -2080px;} /*end - .box-Route-conArea .box-btnArea -------------------------------------------------------------------*/ /*start - .box-Route-conArea .box-listArea -------------------------------------------------------------------*/ .box-Route-conArea .box-listArea { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; height:calc(100% - 45px); overflow-x:hidden; overflow-y:auto;} .box-Route-conArea .box-listArea .dec-note { width:calc(100% - 0px); margin:0px; padding:5px; color:#b9b9b9; font-size:1rem; line-height:1.2rem; text-align:center;} .box-Route-conArea .box-listArea .box-listItem { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; border-radius:25px; background:#fafafa; display: -ms-flexbox !important; display: flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .box-Route-conArea .box-listArea .box-listItem:hover { background:#fcfbe0;} .box-Route-conArea .box-listArea .box-listItem .dec-num-outer { width:30px; height:30px; margin:0px 5px; padding:0px; border-radius:25px; background:#e1f1f4; display: -ms-flexbox !important; display: flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .box-Route-conArea .box-listArea .box-listItem .dec-num-outer .dec-num { font-size:1rem; font-weight:500; margin:0px; padding:0px; color:#29aecc; display: -ms-flexbox !important; display: flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .box-Route-conArea .box-listArea .box-listItem .box-con { width:calc(100% - 75px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: start !important; justify-content: start !important;} .box-Route-conArea .box-listArea .box-listItem .box-btn { width:35px; margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: center !important; justify-content: center !important;} /*end - .box-Route-conArea .box-listArea -------------------------------------------------------------------*/ /*end - .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Road -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Road .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Road .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Road .con-main .box-con:first-child { border:0px; padding-bottom:10px;} .MapTool-FunctionBox.dec-Road .con-main a.dec-btn-road, .MapTool-FunctionBox.dec-Road .con-main a.dec-btn-road:hover { width:calc(100% - 0px); margin:0px; padding:15px 10px; text-decoration: none; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-Road .con-main a.dec-btn-road { background:#fafafa; border:1px solid #d6d6d6} .MapTool-FunctionBox.dec-Road .con-main a.dec-btn-road:hover { background:#34B5E8; border:1px solid #34B5E8;} .MapTool-FunctionBox.dec-Road .con-main a.dec-btn-road .dec-ic { color:#999999; margin:5px; padding:0px;} .MapTool-FunctionBox.dec-Road .con-main a.dec-btn-road .dec-type { color:#999999; margin:0px; padding:0px; font-size:14px; line-height:1.2rem;} .MapTool-FunctionBox.dec-Road .con-main a.dec-btn-road:hover .dec-ic { color:#FFFFFF;} .MapTool-FunctionBox.dec-Road .con-main a.dec-btn-road:hover .dec-type { color:#FFFFFF;} .separate-box { width:calc(100% - 0px); margin:14px 0px 19px 0px; margin:24px 0px 29px 0px; padding:0px; text-align:center; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .separate-box .separate-division-box { height: 1px; width:100%; border:1px solid #cdcdcd; border-top-width:0;} .separate-box>span { min-width:32px; height: 16px; margin:0px 10px; font-size: 16px; font-weight: 400; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: normal; text-align: center; color: #737373;} /*end - .MapTool-FunctionBox.dec-Road -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Road-Detail -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Road-Detail .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-con:first-child { border:0px; padding-bottom:10px;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea { width:calc(100% - 0px); margin-left:0px; margin-right:0px; margin-bottom: 5px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox { width: auto;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox:nth-child(2) { margin-left:5px;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox:nth-child(3) { margin-left:auto;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn, .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn:hover { width: auto; border-radius: 25px;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn .dec-ic-a01 { color:#FFFFFF; font-size:18px;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn .dec-ic-a02 { color:#5dc1cf; font-size:16px;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn .dec-ic-a03 { color:#FFFFFF; font-size:14px; font-weight:600} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn:hover .dec-ic-a02 { color:#59b9c1; font-size:16px;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn .dec-ic-b01 { color:#FFFFFF; font-size:18px;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn .dec-ic-b02 { color:#5dc1cf; font-size:16px;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn.dec-sort, .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn.dec-sort:hover { border-radius:25px; margin:5px 0px 0px 0px; padding:5px 8px; text-align: right; text-decoration:none; display:inline-block; min-width:35px; height:35px; overflow-y:hidden;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn.dec-sort { color:#5dc1cf; background:#FFFFFF; border:1px solid #e6e6e6;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn.dec-sort .dec-ic { color:#5dc1cf;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn.dec-sort .dec-type { color:#999999;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn.dec-sort:hover { color:#FFFFFF; background:#5dc1cf; border:1px solid #29abe2;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn.dec-sort:hover .dec-ic { color:#FFFFFF;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-btnArea .con-btnbox a.dec-btn.dec-sort:hover .dec-type { color:#FFFFFF;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-conArea { margin:0px 0px 5px 0px; background: #FFFFFF; padding: 5px;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-conArea a.dec-btn { height: calc(100% - 0px); background:#ebebeb; margin:0px; padding:3px 10px; border-radius:5px; border:1px solid #ced4da; color:#999999;} .MapTool-FunctionBox.dec-Road-Detail .con-main .box-conArea a.dec-btn:hover { color:#169cbf; background: #ebebeb;} /*end - .MapTool-FunctionBox.dec-Road-Detail -------------------------------------------------------------------------------------------------------*/ /*start - .box-conArea.dec-result-MapTool-RestrictArea-List -------------------------------------------------------------------------------------------------------*/ .box-conArea.dec-result-MapTool-POI-List { width:calc(100% - 0px); height: calc(100% - 80px); height: calc(100% - 130px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .box-conArea.dec-result-MapTool-POI-List .box-conArea-outerBox.dec-resultList { width: calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px 5px 10px 5px; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px 0px 5px 0px; font-size:1rem; line-height:1.2rem; border-bottom:1px solid #e1e1e1;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group { width:calc(100% - 0px); margin:0px; padding:0px; border-bottom: 0px solid #e1e1e1;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-spot { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; background: #fcfbe0; background:#fafafa; border-radius:25px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-spot .dec-ic { width:30px; margin:0px; padding:0px; color: #e5aa15;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-spot .dec-type { width:calc(100% - 30px); margin:0px; padding:5px 0px; font-size:14px; line-height:1.2rem; color:#776744;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-spot .dec-type .icon-sprite { position:relative; top:3px;} .box-conArea.dec-result-MapTool-TrackMgtRule-List .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-spot .dec-type { width:calc(100% - 0px); margin:0px; padding:5px 0px; font-size:14px; line-height:1.2rem; color:#776744;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-spot .box-function-btn { width:65px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-POIInfo { width:calc(100% - 30px); margin:0px 0px 0px 30px; padding:0px; border-bottom:1px solid #e1e1e1; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-POIInfo:last-child { border:0px;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-POIInfo .dec-type { width:calc(100% - 65px); margin:0px; padding:5px 0px; font-size:0.9rem; line-height:1.2rem; color:#999999;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-POIInfo .dec-type .dec-color { color:#595959; margin-bottom:5px;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-POI-List .box-con-whole .box-content-group .box-POIInfo .box-function-btn { width:65px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} /*.accordion-toggle:before { font-family:'Font Awesome 5 Free'; content:"\f078"; font-weight:900; padding-left:10px; padding-right: 5px;}*/ /*.accordion-toggle.collapsed:before { font-family:'Font Awesome 5 Free'; content:"\f077"; font-weight:900; padding-left:10px; padding-right:5px;}*/ .accordion-toggle:before { content:""; padding-left:18px; padding-right:5px; width: 18px; height: 18px; background:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position: -170px -1634px;} .accordion-toggle.collapsed:before { content:""; padding-left:18px; padding-right:5px; width: 18px; height: 18px; background:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position: -238px -1634px;} /*end - .box-conArea.dec-result-MapTool-RestrictArea-List -------------------------------------------------------------------------------------------------------*/ /*start - .box-conArea.dec-result-MapTool-BusStopRoute-BusStop -------------------------------------------------------------------------------------------------------*/ .box-conArea.dec-result-MapTool-BusStopRoute-BusStop-List { width:calc(100% - 0px); height: calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .box-conArea.dec-result-MapTool-BusStopRoute-BusStop-List .dec-noData { width:calc(100% - 0px); margin:0px; padding:0px; text-align:center;} .box-conArea.dec-result-MapTool-BusStopRoute-BusStop-List .dec-noData .dec-ic { margin:10px 0px 5px 0px; padding:0px; color:#CCCCCC;} .box-conArea.dec-result-MapTool-BusStopRoute-BusStop-List .dec-noData .dec-type { margin:0px; padding:0px; color:#CCCCCC;} .box-conArea.dec-result-MapTool-BusStopRoute-BusStop-List .box-conArea-outerBox.dec-resultList { width: calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px 5px 10px 5px; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole { width:calc(100% - 0px); margin:0px; padding:0px 0px 5px 0px; font-size:1rem; line-height:1.2rem; border-bottom:0px;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:4px 0px; background:#fafafa; border-radius:25px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group.dec-dynamic { background:#ffdd4d;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group a.box-spot, .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group a.box-spot:hover { width:calc(100% - 70px); margin:0px; padding:0px; text-decoration:none; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group a.box-spot .dec-ic { width:30px; margin:0px; padding:0px; color:#e5aa15;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group a.box-spot .dec-ic-iconSprite { width:18px; margin:0px 6px; padding:0px; color:#e5aa15;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group a.box-spot .dec-type { width:calc(100% - 90px); margin:0px; padding:5px 0px; font-size:14px; line-height:1.2rem; color:#776744; margin-right:auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .MapTool-FunctionBox.dec-BusStopRoute-Route .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group a.box-spot .dec-type { width:calc(100% - 90px);} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group a.box-spot .dec-stops { width:55px; background:#bac570; margin:0px; padding:3px 5px; font-size:1rem; font-weight:500; color:#FFFFFF; border-radius:25px; text-align:center;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group a.box-spot .dec-stops::after { content:"站";} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group a.box-spot:hover .icon-sprite.icon-ic_marker_yellow { background-position:-204px -2080px;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group a.box-spot:hover .icon-sprite.icon-ic_route { background-position:-272px -2080px;} .box-conArea .box-conArea-outerBox.dec-resultList.dec-BusStopRoute-BusStop-List .box-con-whole .box-content-group .box-function-btn { width:70px; margin:0px; padding:0px; color:#776744;} /*end - .box-conArea.dec-result-MapTool-BusStopRoute-BusStop -------------------------------------------------------------------------------------------------------*/ /*start - .con-MapTool-Video-Area ----------------------------------------------------------------------------------------------------------------------------*/ /*start - .con-MapTool-Video-Area .con-pagenation-area --------------------------------------------------------------------------------*/ .con-MapTool-Video-Area .con-pagenation-area { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-MapTool-Video-Area .con-pagenation-area .dec-Pagination { display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important;} /*end - .con-MapTool-Video-Area .con-pagenation-area --------------------------------------------------------------------------------*/ /*start - .con-MapTool-Video-Area .con-infoArea --------------------------------------------------------------------------------*/ .con-MapTool-Video-Area .con-infoArea { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px 40px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-MapTool-Video-Area .con-infoArea .dec-type { font-size:16px; line-height:1.5rem; margin:0px 15px 0px 0px; padding:0px 0px; color:#595959;} .con-MapTool-Video-Area .con-infoArea .dec-type-note { font-size:14px; line-height:1.5rem; margin:0px; padding:0px 8px; border-radius:15px; background:#e73828; color:#FFFFFF;} /*end - .con-MapTool-Video-Area .con-infoArea --------------------------------------------------------------------------------*/ .con-MapTool-Video-Area { width:calc(100% - 0px); max-width:1170px; margin:auto; margin-bottom:5px; padding:0px; border-radius:8px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-MapTool-Video-Area:hover { background:#fcfbe0;} .con-MapTool-Video-Area:last-child:hover { background:transparent;} .con-MapTool-Video-Area .con-swiperSlide-area { width:auto; margin:5px 0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} /*start - .nav-swiperSlide ----------------------------------------------------------------------------------------------------------------------------*/ .nav-swiperSlide { position:relative; width:93%; height: auto; margin:0px auto;} .nav-next { margin-right:-40px;} .nav-prev { margin-left:-40px;} @media (max-width: 600px) { .nav-swiperSlide { position:relative; width:100%; height:auto; margin:0px auto;} .nav-next { display:none;} .nav-prev { display:none;} } #topNav, #topNavA, #topNavB, #topNavC, #topNavD, #topNavE { width:100%; overflow:hidden; font-size:1rem; border-bottom:0px;} #topNavD { background:#FFFFFF;} #topNavE { background:#FFFFFF; width:calc(100% - 0px);} #topNav .swiper-slide, #topNavA .swiper-slide, #topNavB .swiper-slide, #topNavC .swiper-slide, #topNavD .swiper-slide, #topNavE .swiper-slide { padding:0 5px; letter-spacing:2px; width:auto; text-align:center;} #topNav .swiper-slide a, #topNavA .swiper-slide a, #topNavB .swiper-slide a, #topNavC .swiper-slide a, #topNavD .swiper-slide a, #topNavE .swiper-slide a { text-decoration:none;} #topNav .swiper-slide span, #topNavA .swiper-slide span, #topNavB .swiper-slide span, #topNavC .swiper-slide span, #topNavD .swiper-slide span, #topNavE .swiper-slide span { font-size:1rem; color:#000; padding:5px; padding:0px; margin:5px 0px; border:0px; border-radius:5px; transition:all .1s ease; display:block;} #topNav .active span, #topNavA .active span, #topNavB .active span, #topNavC .active span, #topNavD .active span, #topNavE .active span { color:#fff; border:0px;} #topNav .swiper-slide span.dec-itemBox, #topNavA .swiper-slide span.dec-itemBox, #topNavB .swiper-slide span.dec-itemBox, #topNavC .swiper-slide span.dec-itemBox, #topNavD .swiper-slide span.dec-itemBox, #topNavE .swiper-slide span.dec-itemBox { margin:0px; padding:10px; padding:0px; max-width: 120px; background:#FFFFFF; border:1px solid #e6e6e6;} #topNav .swiper-slide span.dec-itemBox:hover, #topNavA .swiper-slide span.dec-itemBox:hover, #topNavB .swiper-slide span.dec-itemBox:hover, #topNavC .swiper-slide span.dec-itemBox:hover, #topNavD .swiper-slide span.dec-itemBox:hover, #topNavE .swiper-slide span.dec-itemBox:hover { background:rgba(88, 186, 163,0.8);} #topNav .swiper-slide span.dec-itemBox .dec-img, #topNavA .swiper-slide span.dec-itemBox .dec-img, #topNavB .swiper-slide span.dec-itemBox .dec-img, #topNavC .swiper-slide span.dec-itemBox .dec-img, #topNavD .swiper-slide span.dec-itemBox .dec-img, #topNavE .swiper-slide span.dec-itemBox .dec-img { width:calc(100% - 0px); margin:0px; padding:0px;} #topNav .swiper-slide span.dec-itemBox.dec-blankBox, #topNavA .swiper-slide span.dec-itemBox.dec-blankBox, #topNavB .swiper-slide span.dec-itemBox.dec-blankBox, #topNavC .swiper-slide span.dec-itemBox.dec-blankBox, #topNavD .swiper-slide span.dec-itemBox.dec-blankBox, #topNavE .swiper-slide span.dec-itemBox.dec-blankBox { width:120px; height:80px; margin:0px; padding:0px; background:#ebebeb; text-align:center; overflow-y:hidden; color:transparent;} .dec-row-statistics #topNavD a, .dec-row-statistics #topNavD a:hover { border:0px;} .dec-row-statistics #topNavE a, .dec-row-statistics #topNavE a:hover { border:0px;} /*start - #topNavD .swiper-slide .dec-itemBox*/ #topNavD .swiper-slide .dec-itemBox { font-size:1rem; color:#000; margin:0px; padding:5px 15px 5px 10px; border:0px; border-left:1px solid #CCCCCC; border-radius:0px; transition:all .1s ease; display:block; min-width:140px; min-height:80px; text-align:left; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; } #topNavD .active .dec-itemBox { color:#fff;} #topNavD .swiper-slide .dec-itemBox { background:#FFFFFF; background:transparent;} #topNavD .swiper-slide .dec-itemBox:hover { background:rgba(88, 186, 163,0.8); background:rgba(88, 186, 163,0.1);} #topNavD .swiper-slide .dec-itemBox .dec-numberArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; } #topNavD .swiper-slide .dec-itemBox .dec-numberArea .dec-num { font-size:1.7rem; line-height:1.8rem; color:#464646; font-weight:500; margin:10px 5px 10px 0px; padding:0px;} #topNavD .swiper-slide .dec-itemBox .dec-numberArea .dec-percentage { font-size:12px; line-height:14px; border-radius:5px; color:#FFFFFF; margin:0px; padding:3px 3px 4px 3px;} #topNavD .swiper-slide .dec-itemBox .dec-numberArea .dec-percentage.dec-up { background:#e73828;} #topNavD .swiper-slide .dec-itemBox .dec-numberArea .dec-percentage.dec-down { background:#595959;} #topNavD .swiper-slide .dec-itemBox .dec-numberArea .dec-percentage .dec-ic { margin:0px; padding:0px; color:#FFFFFF;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea { width:calc(100% - 0px); margin:0px; padding:0px;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type { font-size:1rem; line-height: 1.5rem; color:#595959;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic { margin:0px 5px 0px 0px; padding:0px;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-01 { color:#ff0000;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-02 { color:#f7931e;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-03 { color:#f4e200;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-04 { color:#578bff;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-05 { color:#787878;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-06 { color:#b3b3b3;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-07 { color:#39b54a;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-08 { color:#e8528d;} #topNavD .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-09 { color:#a050a0;} /*end- #topNavD .swiper-slide .dec-itemBox*/ /*start - #topNavE .swiper-slide .dec-itemBox*/ #topNavE .swiper-slide .dec-itemBox { font-size: 1rem; color:#000; margin:0px; padding:5px 15px 5px 10px; border:0px; border-left: 1px solid #CCCCCC; border-radius:0px; transition:all .1s ease; display:block; min-width: 140px; min-height: 80px; text-align:left; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; } #topNavE .active .dec-itemBox { color:#fff;} #topNavE .swiper-slide .dec-itemBox { background:#FFFFFF; background:transparent;} #topNavE .swiper-slide .dec-itemBox:hover { background:rgba(88, 186, 163,0.8); background:rgba(88, 186, 163,0.1);} #topNavE .swiper-slide .dec-itemBox .dec-numberArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; } #topNavE .swiper-slide .dec-itemBox .dec-numberArea .dec-num { font-size:1.7rem; line-height:1.8rem; color:#464646; font-weight:500; margin:10px 5px 10px 0px; padding:0px;} #topNavE .swiper-slide .dec-itemBox .dec-numberArea .dec-percentage { font-size:12px; line-height:14px; border-radius:5px; color:#FFFFFF; margin:0px; padding:3px 3px 4px 3px;} #topNavE .swiper-slide .dec-itemBox .dec-numberArea .dec-percentage.dec-up { background:#e73828;} #topNavE .swiper-slide .dec-itemBox .dec-numberArea .dec-percentage.dec-down { background:#595959;} #topNavE .swiper-slide .dec-itemBox .dec-numberArea .dec-percentage .dec-ic { margin:0px; padding:0px; color:#FFFFFF;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea { width:calc(100% - 0px); margin:0px; padding:0px;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type { font-size:1rem; line-height:1.5rem; color:#595959;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic { margin:0px 5px 0px 0px; padding:0px;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-01 { color:#ff0000;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-02 { color:#f7931e;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-03 { color:#f4e200;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-04 { color:#578bff;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-05 { color:#787878;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-06 { color:#b3b3b3;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-07 { color:#39b54a;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-08 { color:#e8528d;} #topNavE .swiper-slide .dec-itemBox .dec-typeArea .dec-type .dec-ic.dec-dangerousDriving-09 { color:#a050a0;} /*end- #topNavE .swiper-slide .dec-itemBox*/ /*[統計分析｜危險駕駛統計] 1.超速(次)｜#ff0000｜(255, 0, 0)｜dec-dangerousDriving-01 2.急加速(次)｜#f7931e｜(247, 147, 30)｜dec-dangerousDriving-02 3.急減速(次)｜#f4e200｜(244, 226, 0)｜dec-dangerousDriving-03 4.急轉彎(次)｜#578bff｜(87, 139, 255)｜dec-dangerousDriving-04 5.車道偏移｜#787878｜(120, 120, 120)｜dec-dangerousDriving-05 6.前車碰撞｜#b3b3b3｜(179, 179, 179)｜dec-dangerousDriving-06 7.行人碰撞｜#39b54a｜(57, 181, 74)｜dec-dangerousDriving-07 8.瞌睡｜#e8528d｜(232, 82, 147)｜dec-dangerousDriving-08 9.分心｜#a050a0｜(160, 80, 160)｜dec-dangerousDriving-09 [統計分析｜危險駕駛統計]：超速(次) dec-dangerousDriving-01、急加速(次) dec-dangerousDriving-02、急減速(次) dec-dangerousDriving-03、急轉彎(次) dec-dangerousDriving-04、車道偏移 dec-dangerousDriving-05、前車碰撞 dec-dangerousDriving-06、行人碰撞 dec-dangerousDriving-07、瞌睡 dec-dangerousDriving-08、分心 dec-dangerousDriving-09 */ /*end - .nav-swiperSlide ----------------------------------------------------------------------------------------------------------------------------*/ /*end - .con-MapTool-Video-Area ----------------------------------------------------------------------------------------------------------------------------*/ /*start - .box-conArea.dec-result-MapTool-Alarm-MapInfo -------------------------------------------------------------------------------------------------------*/ .box-conArea.dec-result-MapTool-Alarm-MapInfo { width:calc(100% - 0px); height:auto; margin:0px; padding:0px; overflow:hidden;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group, .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group:hover { width:calc(100% - 0px); margin:0px; padding:5px; border-bottom:0px; text-decoration:none; color:#595959; border-radius:2px; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group:hover { background:#fafafa;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group .box-content { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group .box-content .box-content-L { width:35px; margin:0px 5px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group .box-content .box-content-L .dec-ic { color:#e73828; font-size:2rem;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group .box-content .box-content-C { max-width:calc(100% - 70px); margin:0px; padding:0px; font-size:1.2rem; line-height: 1.5rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group .box-content .box-content-R { margin:0px; padding:0px; font-size:0.9rem; line-height:1.5rem; color:#dda528; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group .box-content .box-content-C.dec-box-detail { margin:0px 5px 0px 0px; padding:0px; margin-right:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group .box-content .box-content-C.dec-box-detail .box-detail-top { margin:0px; margin-right:auto; padding:0px; font-size: 16px; line-height:1.5rem;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group .box-content .box-content-C.dec-box-detail .box-detail-bottom { margin:0px; margin-right:auto; padding:0px; font-size: 14px; line-height:1.2rem; color:#169cbf;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group .btn-more { text-decoration:none; margin:0px 0px 0px 5px; border-radius:0.25rem; font-size:1.2rem; line-height: 1.5rem; padding:5px 0px 5px 10px; background:transparent; color:#eaeaea;} .box-conArea.dec-result-MapTool-Alarm-MapInfo .box-conArea-outerBox.dec-resultList a.box-content-group:hover .btn-more { color:#b3b3b3;} /*end - .box-conArea.dec-result-MapTool-Alarm-MapInfo -------------------------------------------------------------------------------------------------------*/ .con-container { width:calc(100% - 0px); height:calc(100% - 50px); margin:0px; margin:auto; padding:0px 15px 15px 15px; background:#FFFFFF; overflow-x:hidden; overflow-y:auto;} /*start - .con-container .box-member-block -------------------------------------------------------------------------------------------------------*/ .con-container .box-member-block { width:calc(100% - 0px); margin:0px; margin-top:calc(15vh - 0px); padding:25px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-member-block .dec-ic { color:#CCCCCC; margin:5px; padding:0px;} .con-container .box-member-block .dec-type { width:calc(100% - 0px); text-align:center; font-size:2rem; line-height:2.2rem; font-weight:normal; margin:0px; padding:5px 0px; color:#c2c2c2;} /*end - .con-container .box-member-block -------------------------------------------------------------------------------------------------------*/ /*start - .con-container.dec-login -------------------------------------------*/ .con-container.dec-login { width:calc(100% - 0px); max-width:calc(100% - 0px); height:calc(100% - 50px); overflow-x:hidden; overflow-y:auto; color:#595959; margin:0px; padding:0px; position:absolute; background-color:#fcf9fb; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='40' viewBox='0 0 50 40'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23e7f0f2' fill-opacity='0.4'%3E%3Cpath d='M40 10L36.67 0h-2.11l3.33 10H20l-2.28 6.84L12.11 0H10l6.67 20H10l-2.28 6.84L2.11 10 5.44 0h-2.1L0 10l6.67 20-3.34 10h2.11l2.28-6.84L10 40h20l2.28-6.84L34.56 40h2.1l-3.33-10H40l2.28-6.84L47.89 40H50l-6.67-20L50 0h-2.1l-5.62 16.84L40 10zm1.23 10l-2.28-6.84L34 28h4.56l2.67-8zm-10.67 8l-2-6h-9.12l2 6h9.12zm-12.84-4.84L12.77 38h15.79l2.67-8H20l-2.28-6.84zM18.77 20H30l2.28 6.84L37.23 12H21.44l-2.67 8zm-7.33 2H16l-4.95 14.84L8.77 30l2.67-8z' /%3E%3C/g%3E%3C/g%3E%3C/svg%3E");} .con-container.dec-login .box-bg-login { color:#595959; height:calc(100% - 0px); margin:0px; padding:55px 15px 50px 15px; opacity:1; position:absolute; top:0px; width:calc(100% - 0px); z-index:1; background: rgba(255,255,255,0); background-repeat: no-repeat; background-size:1920px 1080px; background-size:auto; background-position: center; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container.dec-login .box-con-a02.dec-login { background:rgba(250, 250, 250, 1); border-radius:5px; border:1px solid #e1e1e1; padding:10px; margin:0px auto; margin-top:55px; margin-bottom:55px; width:calc(50% - 0px); min-width:400px; position:relative; z-index:2; border-bottom:1px solid #cccccc; -moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1); display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} @media (max-width: 800px) { .con-container.dec-login .box-con-a02.dec-login { background: rgba(250, 250, 250, 1); border-radius:5px; border:1px solid #e1e1e1; padding:10px; margin:0px auto; margin-top:55px; margin-bottom:55px; width:calc(100% - 20px); min-width:300px; max-width:400px; position:relative; z-index:2; border-bottom:1px solid #cccccc; -moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1); display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} } .con-container.dec-login .box-con-a02.dec-login .dec-btn-forgetPassword, .con-container.dec-login .box-con-a02.dec-login .dec-btn-forgetPassword:hover { margin:0px; padding:5px;} .con-container.dec-login .box-con-a02.dec-login .dec-btn-forgetPassword { color:#595959; text-decoration:none;} .con-container.dec-login .box-con-a02.dec-login .dec-btn-forgetPassword:hover { color:#4c92cc; text-decoration:underline;} .con-container.dec-login .box-con-a02.dec-login .box-conArea { background:transparent;} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login { margin:0px; padding:0px; width:calc(100% - 0px); background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .box-memberArea-con { width:calc(50% - 0px); min-width:368px; max-width:400px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} @media (max-width: 410px) { .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .box-memberArea-con { width:calc(100% - 0px); min-width:200px; max-width:360px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} } .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .con-box { } .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .con-box .box-login-con { margin:0px; padding:15px 0px 10px 0px; width:calc(100% - 0px); background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .con-box .box-login-con .dec-c01 { width:25px; height:25px; margin:0px 5px 0px 0px; padding:0px;} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .con-box .box-login-con .box-type { color:#585858; padding:0px; font-size:1.7rem; font-weight:400; letter-spacing:0.2rem;} /*start - .con-container .box-con-a02 .box-conArea .con-box -------------------------------------------*/ .con-container .box-con-a02 .box-conArea .con-box .con-conBox-verificationCode { margin: 0px; padding: 0px; width: calc(100% - 0px); word-break: break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .con-container .box-con-a02 .box-conArea .con-box .con-verificationCode-textbox, .con-container .box-con-a02 .box-conArea .con-box .con-verificationCode-img, .con-container .box-con-a02 .box-conArea .con-box .con-verificationCode-btn { padding:0px;} .con-container .box-con-a02 .box-conArea .con-box .con-verificationCode-textbox { margin:0px; width:calc(100% - 145px);} .con-container .box-con-a02 .box-conArea .con-box .con-verificationCode-img { margin:0px 0px 0px 5px; width:90px;} .con-container .box-con-a02 .box-conArea .con-box .con-verificationCode-img .dec-img { margin:0px; padding:0px; width:calc(100% - 0px);} .con-container .box-con-a02 .box-conArea .con-box .con-verificationCode-btn { margin:0px; width:50px;} .con-container .box-con-a02 .box-conArea .con-box .con-verificationCode-btn .dec-c01 { margin:0px; padding:0px;} /*end - .con-container .box-con-a02 .box-conArea .con-box -------------------------------------------*/ /*start - .con-topBox -------------------------------------------*/ .con-topBox { border-bottom:1px solid #333333; margin:0px -15px 10px -15px; padding:1rem 30px; width:calc(100% + 30px); background:#595959; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: end !important; align-items: flex-end !important;} .con-container.dec-statistics .con-topBox { border-bottom:1px solid #333333; margin:0px -15px; padding:1rem 30px; width:calc(100% - 0px); background:#595959; width:calc(100% + 30px); display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: end !important; align-items: flex-end !important;} .con-topBox .con-topBox-title, .con-topBox .con-topBox-breadcrumb, .con-topBox .con-topBox-info { margin:0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .con-topBox .con-topBox-title { font-size:1.4rem; line-height:1.7rem; padding:5px 10px 5px 5px; margin-left:0px; border-radius:2rem; color:#595959; color:#FFFFFF; width:auto; min-width:320px; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-order: 1; order: 1;} .con-topBox .con-topBox-title .dec-ic { margin:0px 5px;} .con-topBox .con-topBox-title .dec-note { margin:0px 0px 0px 10px; padding:5px; font-size:1rem; line-height:1.5rem; color:#CCCCCC;} .con-topBox .con-topBox-breadcrumb { -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-order: 3; order: 3;} .con-topBox .con-topBox-info { margin:0px; background:transparent; padding:0px 5px; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-order: 2; order: 2;} .con-topBox .con-topBox-info.dec-box-01 { margin-left:auto; margin-right:25px;} .con-topBox .con-topBox-info.dec-box-02 { margin-left:25px; margin-right:auto; width:250px;} .con-topBox .con-topBox-info.dec-box-03 { margin-left:25px; margin-right:auto; width:auto; padding:0px;} .con-topBox .con-topBox-info.dec-box-03 .box-inner-width-a01 { width:150px; margin:0px; padding:0px 0px 0px 5px;} .con-topBox .con-topBox-info.dec-box-03 .box-inner-width-a01 a, .con-topBox .con-topBox-info.dec-box-03 .box-inner-width-a01 a:hover { margin-left:0px;} .con-topBox .con-topBox-info.dec-box-03 .dec-box-break { width:auto; margin-left:5px; padding:0px;} .con-topBox .con-topBox-info .dec-ic { color:#595959; margin:0px 0px 0px 5px; padding:0px;} .con-topBox .con-topBox-info .dec-driver { margin:0px; padding:5px; font-size:1.2rem; line-height: 1.5rem;} .con-topBox .con-topBox-info .dec-driver::before { content:"司機："; margin:0px; padding:5px 0px; font-size:1.2rem; line-height:1.5rem;} .con-topBox .con-topBox-info .dec-driverNumber { margin:0px; padding:5px; font-size:1rem; line-height:1.5rem; color:#CCCCCC;} .con-topBox .con-topBox-info .dec-driverNumber::before { content:"(員編："; color: #CCCCCC;} .con-topBox .con-topBox-info .dec-driverNumber::after { content:")"; color: #CCCCCC;} .con-topBox .con-topBox-info a, .con-topBox .con-topBox-info a:hover { margin:0px 0px 0px 5px; padding:2px 5px; font-size:1rem; border-radius:5px;} .con-topBox .con-topBox-info a.dec-01 { background:#fbb03b; color:#FFFFFF;} .con-topBox .con-topBox-info a.dec-01:hover { background:#f7931e; color:#FFFFFF;} .con-topBox .con-topBox-info a.dec-02 { background:#c69c6d; color:#FFFFFF;} .con-topBox .con-topBox-info a.dec-02:hover { background:#a67c52; color:#FFFFFF;} .con-topBox .con-topBox-info .box-btn { width:80px;} @media (max-width: 991px) { .con-topBox { border-bottom:1px solid #333333; margin:0px -15px 10px -15px; padding:1rem 30px; width:calc(100% + 30px); background:#595959; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-topBox .con-topBox-title, .con-topBox .con-topBox-breadcrumb { margin:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .con-topBox .con-topBox-title { margin-right:auto; -ms-flex-order: 2; order: 2;} .con-topBox .con-topBox-breadcrumb { width: calc(100% - 0px); -ms-flex-order: 1; order: 1;} .con-topBox .con-topBox-breadcrumb nav { width:calc(100% - 0px);} .con-topBox .con-topBox-breadcrumb nav ol { text-align:right;} .con-topBox .con-topBox-info.dec-box-01 { margin-left:auto; margin-right:25px;} .con-topBox .con-topBox-info.dec-box-02 { margin-left:0px; margin-right:auto;} } /*start - .con-topBox .con-topBox-title .box-buttonArea -------------------------------------*/ .con-topBox .con-topBox-title .box-buttonArea { margin:0px 0px 0px 5px; padding:0px; width:auto; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-topBox .con-topBox-title .box-buttonArea a, .con-topBox .con-topBox-title .box-buttonArea a:hover { text-decoration:none; margin:0px; padding:0px; min-width:90px; font-size:1rem; background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .con-topBox .con-topBox-title .box-buttonArea a .dec-type, .con-topBox .con-topBox-title .box-buttonArea a:hover .dec-type { margin:0px; padding:5px;color:#FFFFFF; word-break:keep-all; height:34px; overflow-y:hidden;} .con-topBox .con-topBox-title .box-buttonArea a.condition-01 .dec-type { background: #B6B6B6;} .con-topBox .con-topBox-title .box-buttonArea a.condition-01:hover .dec-type { background: #C0C0C0;} .con-topBox .con-topBox-title .box-buttonArea a.condition-01 .dec-svg { fill:#B6B6B6;} .con-topBox .con-topBox-title .box-buttonArea a.condition-01:hover .dec-svg { fill:#C0C0C0;} .con-topBox .con-topBox-title .box-buttonArea a.condition-02 .dec-type { background:#72bf44;} .con-topBox .con-topBox-title .box-buttonArea a.condition-02:hover .dec-type { background:#80ce4e;} .con-topBox .con-topBox-title .box-buttonArea a.condition-02 .dec-svg { fill:#72bf44;} .con-topBox .con-topBox-title .box-buttonArea a.condition-02:hover .dec-svg { fill:#80ce4e;} /*end - .con-topBox .con-topBox-title .box-buttonArea -------------------------------------*/ /*start - .con-topBox .con-topBox-title .box-infoArea -------------------------------------*/ .con-topBox .con-topBox-title .box-infoArea { margin:0px 0px 0px 5px; padding:0px; width: auto; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-topBox .con-topBox-title .box-infoArea .dec-infoNum { color:#f7931e; font-size:1.4rem; margin:0px; padding:0px; width:auto;} /*end - .con-topBox .con-topBox-title .box-infoArea -------------------------------------*/ /*start - .con-topBox .con-topBox-infoR -------------------------------------*/ .con-topBox .con-topBox-infoR { width:auto; margin:0px; padding:0px; margin-left: auto; order: 2 !important; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .con-topBox .con-topBox-infoR .dec-note { width:auto; margin:0px; padding:5px 0px; color:#595959; text-align:right;} .con-topBox .con-topBox-infoR a.btnBox, .con-topBox .con-topBox-infoR a.btnBox:hover { width:120px; height:33.5px; margin:0px 10px; padding:5px; background:#FFFFFF; text-decoration: none; border-radius: 5px; border:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-topBox .con-topBox-infoR a.btnBox:hover { background:#fafafa; color:#787878;} .con-topBox .con-topBox-infoR a.btnBox .dec-type { font-size:1rem; line-height: 1.5rem; margin:0px; padding:0px; color:#595959;} .con-topBox .con-topBox-infoR a.btnBox .dec-ic { margin:2px 5px; padding: 0px; opacity:0.3;} .con-topBox .con-topBox-infoR a.btnBox:hover .dec-ic { opacity:1;} /*end - .con-topBox .con-topBox-infoR -------------------------------------*/ /*end - .con-topBox -------------------------------------------*/ /*start - .bulletinBox.dec-rwd ---------------------------------------------------------------------------------------------------------------------------*/ .bulletinBox.dec-rwd { width:calc(100% - 0px); max-width:calc(100% - 0px); height:calc(100% - 0px); margin:10px auto; margin-top:0px; margin-bottom:0px; padding:10px; position:absolute; top:0px; left:0px; z-index:1023; background:rgba(0,0,0,0.8);} .bulletinBox.dec-rwd .bulletinBox-innerBox { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px; background:#FFFFFF; border-radius:10px; border:0px;} .bulletinBox.dec-rwd .listArea-innerBox { width:calc(100% - 20px); height:calc(100% - 85px); margin:10px; padding:15px 10px; overflow-x:hidden; overflow-y:auto;} .bulletinBox.dec-rwd .listArea-innerBox.dec-detail-rwd { width:calc(100% - 20px); height:calc(100% - 85px); margin:10px; padding:15px 10px 0px 10px; overflow-x:hidden; overflow-y:auto;} .bulletinBox.dec-rwd .listArea-innerBox .dec-noData { width:calc(100% - 0px); margin:0px; padding:0px; text-align:center;} .bulletinBox.dec-rwd .listArea-innerBox .dec-noData .dec-type { margin:0px; padding:0px; color:#CCCCCC;} .bulletinBox.dec-rwd .listArea { width:calc(100% - 0px); margin:0px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: center !important; align-items: center !important;} .bulletinBox.dec-rwd .listArea .listItem { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-bottom:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; flex-wrap: wrap !important; -ms-flex-align: center !important; align-items: center !important;} .bulletinBox.dec-rwd .listArea .listItem:hover { background:#f5f5f5;} .bulletinBox.dec-rwd .listArea .listItem:nth-child(even) { background:#f2f2f2;} .bulletinBox.dec-rwd .listArea .listItem.dec-01, .bulletinBox.dec-rwd .listArea .listItem.dec-01:hover { padding:10px 5px; background:#f5f5f5;} .bulletinBox.dec-rwd .listArea .listItem.dec-01 .listType { font-size:1.2rem; line-height:1.5rem; font-weight:500;} .bulletinBox.dec-rwd .listArea .listItem:first-child { border-top:1px solid #e1e1e1;} .bulletinBox.dec-rwd .listArea .listItem .listSort { width:85px; height:33.5px; margin:0px 5px 0px 10px; padding:5px; text-align:center; color:#FFFFFF; border-radius:5px;} .bulletinBox.dec-rwd .listArea .listItem .listSort.bgColor-01 { background:#29abe2;} .bulletinBox.dec-rwd .listArea .listItem .listSort.bgColor-02 { background:#e73828;} .bulletinBox.dec-rwd .listArea .listItem .listSort.bgColor-03 { background:#f7931e;} .bulletinBox.dec-rwd .listArea .listItem .listSort.bgColor-04 { background:#8cc63f;} .bulletinBox.dec-rwd .listArea .listItem .listSort.bgColor-05 { background:#787878;} .bulletinBox.dec-rwd .listArea .listItem .listType { width:calc(100% - 275px); margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; color:#595959; margin-right:auto; text-align:left;} .bulletinBox.dec-rwd .listArea .listItem .listType a, .bulletinBox.dec-rwd .listArea .listItem .listType a:hover { text-decoration: none;} .bulletinBox.dec-rwd .listArea .listItem .listType a { color:#595959;} .bulletinBox.dec-rwd .listArea .listItem .listType a:hover { color:#787878;} .bulletinBox.dec-rwd .listArea .listItem .listDate { width:100px; margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; color:#999999; margin-left:100px; text-align:left;} .bulletinBox.dec-rwd .listArea .listItem .listTime { width:70px; margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; color:#999999; text-align:left; margin-right: auto;} .bulletinBox.dec-rwd .listArea .listItem a.listCheck, .bulletinBox.dec-rwd .listArea .listItem a.listCheck:hover { width:70px; margin:0px; padding:5px; color:#999999; text-align:center;} .bulletinBox.dec-rwd .listArea .listItem a.listCheck .icon-sprite.icon-ic_check { opacity:0.3;} .bulletinBox.dec-rwd .listArea .listItem a.listCheck:hover .icon-sprite.icon-ic_check { opacity:1;} .bulletinBox.dec-rwd .listArea .listItem a.listCheck .icon-sprite.icon-ic_check_o, .bulletinBox.dec-rwd .listArea .listItem a.listCheck:hover .icon-sprite.icon-ic_check_o {} .bulletinBox.dec-rwd .infoBox { width:calc(100% - 20px); margin:15px 10px; padding:10px 10px 15px 10px; border-radius:5px; background-image:repeating-linear-gradient(to right,#f7931e 0%, #f15a24 100%); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .bulletinBox.dec-rwd .infoBox .dec-type { width:120px; margin:0px; padding:10px; text-align:right; color:#FFFFFF; font-weight:500; font-size:1.5rem; line-height:2.2rem;} .bulletinBox.dec-rwd .infoBox .dec-time { width:calc(50% - 100px); margin:0px; padding:10px; color:#FFFFFF; font-weight:400; font-size:2rem; line-height:2.2rem;} @media (max-width: 750px) { .bulletinBox.dec-rwd .infoBox { width:calc(100% - 10px); margin:15px 5px; padding:5px 10px 10px 10px; border-radius:5px; background-image:repeating-linear-gradient(to right,#f7931e 0%, #f15a24 100%); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: center !important; align-items: center !important;} .bulletinBox.dec-rwd .infoBox .dec-type { width:110px; margin:0px; padding:10px; text-align:left; color:#FFFFFF; font-weight:500; font-size:1.5rem; line-height:2.2rem;} .bulletinBox.dec-rwd .infoBox .dec-time { width:calc(100% - 110px); margin:0px; padding:10px; color:#FFFFFF; font-weight:400; font-size:2rem; line-height:2.2rem; text-align:right;} } .bulletinBox.dec-rwd .dec-content .dec-imgArea { width:calc(100% - 0px); height:160px; margin:0px; padding:0px; overflow-x:auto; overflow-y:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .bulletinBox.dec-rwd .dec-content .dec-imgArea a.dec-img, .bulletinBox.dec-rwd .dec-content .dec-imgArea a.dec-img:hover { margin:5px; padding:0px; display:inline-block; border:5px solid #fafafa; text-decoration:none;} .bulletinBox.dec-rwd .dec-content .dec-imgArea a.dec-img:hover { border:5px solid #f7931e;} .bulletinBox.dec-rwd .bulletinBox-topBox { width:calc(100% - 0px); margin:0px; padding:15px 20px 0px 20px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: center !important; align-items: center !important;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-title { font-size:2rem; line-height:2.2rem; margin:0px; padding:0px;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-title.dec-01 { margin-left:15px;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn { width:36px; height:36px; margin:0px; padding:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important; align-items: center !important;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-title.dec-mR { margin-right:auto;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn.dec-mL { margin-left:auto;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn a, .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn a:hover { margin:0px; padding:0px; text-decoration:none; width:36px; height:36px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; align-items: center !important;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn .dec-ic { color: #787878;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn .dec-ic:hover { color:#169cbf;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn .dec-ic .dec-angleDown { font-size:20px;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn .dec-ic .dec-angleUp { font-size:20px;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn a .icon-sprite.icon-ic_cross_36x36px, .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn a:hover .icon-sprite.icon-ic_cross_36x36px { margin:0px;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn a:hover .icon-sprite.icon-ic_cross_36x36px { margin:0px; opacity:0.8;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn a .icon-sprite.icon-ic_arrowLeft_36x36px, .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn a:hover .icon-sprite.icon-ic_arrowLeft_36x36px { margin:0px;} .bulletinBox.dec-rwd .bulletinBox-topBox .con-top-btn a:hover .icon-sprite.icon-ic_arrowLeft_36x36px { margin:0px; opacity:0.8;} .bulletinBox.dec-rwd .listArea .listItem .listType { width:calc(100% - 100px);} /*end - .bulletinBox.dec-rwd ---------------------------------------------------------------------------------------------------------------------------*/ /*start - bulletinBox ---------------------------------------------------------------------------------------------------------------------------*/ .bulletinBox { width:calc(100% - 0px); max-width:1366px; margin:0px auto; margin-top:15px; margin-bottom:15px; padding:0px;} .bulletinBox .listArea { width:calc(100% - 0px); margin:0px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: center !important; align-items: center !important;} .bulletinBox .listArea .listItem { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-bottom:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .bulletinBox .listArea .listItem:hover { background:#f5f5f5;} .bulletinBox .listArea .listItem:nth-child(even) { background:#f2f2f2;} .bulletinBox .listArea .listItem.dec-01, .bulletinBox .listArea .listItem.dec-01:hover { padding:10px 5px; background:#f5f5f5;} .bulletinBox .listArea .listItem.dec-01 .listType { font-size:1.2rem; line-height:1.5rem;} .bulletinBox .listArea .listItem:first-child { border-top:1px solid #e1e1e1;} .bulletinBox .listArea .listItem .listSort { width:85px; height:33.5px; margin:0px 5px 0px 10px; padding:5px; text-align:center; color:#FFFFFF; border-radius:5px;} .bulletinBox .listArea .listItem .listSort.bgColor-01 { background:#e73828;} .bulletinBox .listArea .listItem .listSort.bgColor-02 { background:#29abe2;} .bulletinBox .listArea .listItem .listSort.bgColor-03 { background:#f7931e;} .bulletinBox .listArea .listItem .listSort.bgColor-04 { background:#8cc63f;} .bulletinBox .listArea .listItem .listSort.bgColor-05 { background:#787878;} .bulletinBox .listArea .listItem .listType { width:calc(100% - 275px); margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; color:#595959; margin-right:auto; text-align:left;} .bulletinBox .listArea .listItem .listType a, .bulletinBox .listArea .listItem .listType a:hover { text-decoration:none;} .bulletinBox .listArea .listItem .listType a { color:#595959;} .bulletinBox .listArea .listItem .listType a:hover { color:#787878;} .bulletinBox .listArea .listItem .listDate { width:100px; margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; color:#999999; margin-left:auto; text-align:right;} .bulletinBox .listArea .listItem .listTime { width:70px; margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; color:#999999; text-align:right;} .bulletinBox .listArea .listItem a.listCheck, .bulletinBox .listArea .listItem a.listCheck:hover { width:70px; margin:0px; padding:5px; color:#999999; text-align:center;} .bulletinBox .listArea .listItem a.listCheck .icon-sprite.icon-ic_check { opacity:0.3;} .bulletinBox .listArea .listItem a.listCheck:hover .icon-sprite.icon-ic_check { opacity:1;} .bulletinBox .listArea .listItem a.listCheck .icon-sprite.icon-ic_check_o, .bulletinBox .listArea .listItem a.listCheck:hover .icon-sprite.icon-ic_check_o {} .bulletinBox .dec-Pagination { margin-top:5px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important;} .bulletinBox .infoBox { width:calc(100% - 20px); margin:15px 10px; padding:10px; border-radius:5px; background-image:repeating-linear-gradient(to right,#f7931e 0%, #f15a24 100%); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .bulletinBox .infoBox .dec-type { width:100px; margin:0px; padding:10px; text-align:right; color:#FFFFFF; font-weight:500; font-size:1.2rem;} .bulletinBox .infoBox .dec-time { width:calc(50% - 100px); margin:0px; padding:10px; color:#FFFFFF; font-weight:400; font-size:2rem; line-height:2.2rem;} @media (max-width: 750px) { .bulletinBox .infoBox { width:calc(100% - 20px); margin:15px 10px; padding:10px; border-radius:5px; background-image:repeating-linear-gradient(to right,#f7931e 0%, #f15a24 100%); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: center !important; align-items: center !important;} .bulletinBox .infoBox .dec-type { width:100px; width:calc(100% - 0px); margin:0px; padding:10px 10px 0px 10px; text-align:left; color:#FFFFFF; font-weight:500; font-size:1.2rem;} .bulletinBox .infoBox .dec-time { width:calc(100% - 0px); margin:0px; padding:0px 10px 10px 10px; color:#FFFFFF; font-weight:400; font-size:2rem; line-height:2.2rem;} } .bulletinBox .dec-content { width:calc(100% - 20px); margin:15px 10px 0px 10px; padding:0px;} .bulletinBox .dec-content p { font-size:1.1rem; line-height:1.7rem; margin:0px 0px 10px 0px; padding:5px 0px; font-weight:normal; color:#595959;} .bulletinBox .dec-content .dec-imgArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 5px 0px;} .bulletinBox .dec-content .dec-imgArea a.dec-img, .bulletinBox .dec-content .dec-imgArea a.dec-img:hover { margin:5px; padding:0px; display:inline-block; border:5px solid #fafafa; text-decoration:none;} .bulletinBox .dec-content .dec-imgArea a.dec-img:hover { border:5px solid #f7931e;} .bulletinBox .dec-content .dec-divider { width:calc(100% - 0px); height:1px; margin:0px 0px 10px 0px; padding:0px; background:#e1e1e1;} .bulletinBox .dec-content .dec-type-sub { text-align:left; color:#595959; padding:5px 5px 0px 5px; margin:10px 0px 0px 0px;} .bulletinBox .dec-content p a, .bulletinBox .dec-content p a:hover { margin:5px 0px; padding:5px; color:#595959; display: inline-block; text-decoration: underline !important;} .bulletinBox .dec-content p a:hover { color:#f7931e;} .bulletinBox .dec-content p.dec-note { color: #787878; font-size:1rem; line-height:1.5rem;} .bulletinBox a.dec-btnBox, .bulletinBox a.dec-btnBox:hover { width:160px; margin:15px calc(50% - 80px); padding:10px 20px; background:transparent; display:inline-block; text-align:center; border:1px solid #e1e1e1; border-radius:5px; color:#595959;} .bulletinBox a.dec-btnBox:hover { color:#787878; background:#f5f5f5;} /*end - bulletinBox ---------------------------------------------------------------------------------------------------------------------------*/ /*start - .systemMaintenanceBox -------------------------------------------*/ .systemMaintenanceBox-outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:30px 0px 0px 0px; background-color:#fcf9fb; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='40' viewBox='0 0 50 40'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23e7f0f2' fill-opacity='0.4'%3E%3Cpath d='M40 10L36.67 0h-2.11l3.33 10H20l-2.28 6.84L12.11 0H10l6.67 20H10l-2.28 6.84L2.11 10 5.44 0h-2.1L0 10l6.67 20-3.34 10h2.11l2.28-6.84L10 40h20l2.28-6.84L34.56 40h2.1l-3.33-10H40l2.28-6.84L47.89 40H50l-6.67-20L50 0h-2.1l-5.62 16.84L40 10zm1.23 10l-2.28-6.84L34 28h4.56l2.67-8zm-10.67 8l-2-6h-9.12l2 6h9.12zm-12.84-4.84L12.77 38h15.79l2.67-8H20l-2.28-6.84zM18.77 20H30l2.28 6.84L37.23 12H21.44l-2.67 8zm-7.33 2H16l-4.95 14.84L8.77 30l2.67-8z' /%3E%3C/g%3E%3C/g%3E%3C/svg%3E");} .systemMaintenanceBox-outer .systemMaintenanceBox { width:calc(100% - 0px); max-width:800px; height:calc(100% - 20px); margin:0px auto; padding:0px; color:#595959; overflow:hidden;} .systemMaintenanceBox .conArea { width:calc(100% - 20px); min-height:450px; margin:10px 0px 0px 0px; padding:10px 10px 10px calc(35% - 0px); letter-spacing:0.05rem; height:calc(100% - 100px); overflow:auto; background-image:repeating-linear-gradient(to right,transparent 0%, #f0f0f0 50%, transparent 80%, transparent 100%); position:relative;} @media (max-width: 600px) { .systemMaintenanceBox .conArea { width:calc(100% - 20px); min-height:450px; margin:10px 0px 0px 0px; padding:10px 10px 10px calc(15% - 0px); letter-spacing:0.05rem; height:calc(100% - 100px); overflow:auto; background-image:repeating-linear-gradient(to right,transparent 0%, #f0f0f0 50%, transparent 80%, transparent 100%); position:relative;} } .systemMaintenanceBox .conArea .conAreaBg { width:calc(80% - 0px); height:250px; margin:0px; padding:0px; position:absolute; bottom:0px; right:0px; z-index:1; background:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:-576px -1498px; background-repeat:no-repeat;} @media (max-width: 600px) { .systemMaintenanceBox .conArea .conAreaBg { width:calc(90% - 0px); height:250px; margin:0px; padding:0px; position:absolute; bottom:0px; right:0px; z-index:1; background:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:-576px -1498px; background-repeat:no-repeat;} } .systemMaintenanceBox .conAreaT { width:calc(100% - 0px); height:10px; margin:0px 0px 5px 0px; padding:0px; background-image:repeating-linear-gradient(to right,transparent 0%, #ebebeb 30%, transparent 50%, transparent 100%);} .systemMaintenanceBox .conAreaB { width:calc(100% - 0px); height:10px; margin:10px 0px 0px 0px; padding:0px; background-image:repeating-linear-gradient(to right,transparent 0%, #ebebeb 70%, transparent 100%, transparent 100%);} .systemMaintenanceBox .conArea .contentBox { width:calc(100% - 0px); margin:0px; padding:0px; z-index:2; position:relative;} .systemMaintenanceBox .dec-title { width:calc(100% - 0px); margin:0px; padding:15px; font-weight:500; font-size:1.7rem; line-height:2rem; color:#FFFFFF; letter-spacing:0.1rem; border-radius:5px; text-align:center; background-image:repeating-linear-gradient(to right, transparent 0%, #787878 55%, #595959 65%, #595959 65%, #787878 75%, transparent 100%);} .systemMaintenanceBox .conArea .dec-type { width:calc(100% - 0px); margin:0px; padding:5px 0px; font-weight:400; color:#595959; text-shadow:2px 2px #fafafa;} .systemMaintenanceBox .conArea .dec-type.dec-01 { font-size:1.2rem; line-height:1.7rem; padding:25px 0px 5px 0px;} .systemMaintenanceBox .conArea .dec-type.dec-02 { font-size:1.1rem; line-height:1.5rem;} .systemMaintenanceBox .conArea .dec-type.dec-03 { font-size:1rem; line-height:1.5rem; font-weight:400;} .systemMaintenanceBox .conArea .infoBox { width:calc(100% - 0px); margin:10px 0px; padding:5px; border-radius:5px; background-image:repeating-linear-gradient(to right,#f7931e 0%, #f15a24 100%); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: center !important; align-items: center !important;} .systemMaintenanceBox .conArea .infoBox .dec-type { width:120px; margin:0px; padding:10px; text-align:right; color:#fafafa; font-weight:400; font-size:1.5rem; line-height:2rem; text-shadow:none;} .systemMaintenanceBox .conArea .infoBox .dec-time { width:calc(100% - 120px); margin:0px; padding:10px; color:#FFFFFF; font-weight:500; font-size:1.8rem; line-height:2rem;} /*end - .systemMaintenanceBox -------------------------------------------*/ /*start - .con-container .box-con-a02 --------------------------------------------------------------------------------------*/ .dec-emphasis { color:#f23300; font-size:1rem; line-height:1rem; margin:0px; padding:0px 3px; display: -ms-inline-flexbox !important; display: inline-flex !important;} /*start - .con-container .box-con-a02.dec-title*/ .con-container .box-con-a02.dec-title { background:transparent; border-radius:0px; border:0px; margin:0px auto; padding:0px; width:calc(100% - 0px); max-width:1280px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a02.dec-title .con-type.dec-title { width:calc(100% - 0px); margin:0px; padding:25px 0px 5px 0px; color:#595959; font-weight:500; font-size:1.2rem; line-height:1.5rem;} /*end - .con-container .box-con-a02.dec-title*/ .con-container .box-con-a02 { background:#fafafa; border-radius:5px; border:1px solid #e1e1e1; margin:0px auto; padding:10px; width:calc(100% - 0px); max-width:1280px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a02.dec-memberArea { margin:0px auto; width:calc(50% - 0px); min-width:400px;} .con-container .box-con-a02 .box-conArea { background:#fafafa; margin:0px; padding:5px; width:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a02 .box-conArea .con-box { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a02 .box-conArea .con-box nav { width:calc(100% - 0px);} .con-container .box-con-a02 .box-conArea .con-box .box-login-con { margin:0px; padding:0px; width:calc(100% - 0px); background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a02 .box-conArea .con-box .box-login-con .dec-c01 { width:25px; height:25px; margin:0px 5px 0px 0px; padding:0px;} .con-container .box-con-a02 .box-conArea .con-box .box-login-con .box-type { margin:10px 0px 5px 0px; color:#585858; padding:0px; font-size:2rem; line-height:2.5rem; font-weight:400; letter-spacing:0.2rem; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} /*start - .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member*/ .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member { margin:0px; padding:0px; border:0px;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half { margin:0px calc(25% - 0px); margin-bottom:5px; padding:5px 0px 5px 0px; word-break:break-all; width:calc(100% - 0px); margin:0px; margin-bottom:5px; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half.dec-checkBox-a01 { padding-bottom:0px; margin-bottom:0px;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half.dec-checkBox-a02 { padding-top:0px; width:calc(50% - 0px); margin-left:calc(50% - 0px);} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half.dec-checkBox-a02 .dec-type-con { color:#595959;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half:first-child { padding:5px 0px;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half.dec-checkBox-a01:first-child { padding-bottom:0px;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half.dec-checkBox-a01.dec-vAlign { -ms-flex-align: start !important; align-items: flex-start !important;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half.dec-checkBox-a01.dec-vAlign .dec-type-name { padding:15px 0px 0px 0px;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-name { color:#595959; font-size:1rem; line-height:1rem; margin:0px 5px 0px 0px; padding:5px 0px; width:90px; text-align:right;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con { color:#169cbf; font-size:1rem; line-height:1rem; margin:0px; padding: 5px 0px; width:calc(50% - 95px);} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con .dec-note { margin:0px; padding:5px; width:calc(100% - 0px); color:#b4b4b4;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con .dec-signatureBox { margin:5px 0px 0px 0px; padding:0px; width:calc(100% - 0px); height:150px; position:relative; display:block;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con .dec-signatureBox .dec-innerBox { margin:0px; padding:0px; width:calc(100% - 0px); height:calc(100% - 0px); position:absolute; top:0px; left:0px; z-index:1; display:block; text-align:center;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con .dec-signatureBox .dec-innerBox .dec-img { max-width:calc(100% - 0px); max-height:calc(100% - 0px); padding:0px; margin:auto;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con .dec-signatureBox a.dec-btnBox, .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con .dec-signatureBox a.dec-btnBox:hover { margin:0px; padding:0px; width:45px; height:35px; position:absolute; bottom:5px; right:5px; z-index:2; overflow:hidden; background:#fafafa; border-radius:5px; text-decoration:none; border:1px solid #e0e0e0;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con .dec-signatureBox a.dec-btnBox:hover { background:#FFFFFF;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con .dec-signatureBox a.dec-btnBox .dec-ic { margin:8px 13px; padding:0px; color:#8f8f8f;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con .dec-signatureBox a.dec-btnBox:hover .dec-ic { color:#787878;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con .dec-form-control-input { padding-top:2px;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half.dec-checkBox-a02 .dec-type-con { width:calc(100% - 95px);} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-name-01 { color:#595959; font-size:1rem; line-height:1rem; margin:0px 5px 0px 0px; padding:5px 0px; width:40px; text-align:right;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con-01 { color:#169cbf; font-size:1rem; line-height:1rem; margin:0px; padding: 5px 0px; width: 100px;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con-02 { color:#169cbf; font-size:1rem; line-height:1rem; margin:0px; padding: 5px 0px; width:calc(100% - 95px);} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con-02 .dec-item { margin:2px; padding:5px 8px; border-radius:25px; color: #FFFFFF; background:#169cbf;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-con-03 { color:#169cbf; font-size: rem; line-height:1rem; margin:0px; padding: 5px 0px; width:calc(50% - 305px);} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-phone-01 { color:#169cbf; font-size:1rem; line-height:1rem; margin:0px 5px 0px 0px; padding:5px 0px; width:40px;} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-type-phone-02 { color:#169cbf; font-size:1rem; line-height:1rem; margin:0px; padding:5px 0px; width:calc(50% - 285px);} .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member .con-box-half .dec-margin-R { margin-right: 5px;} /*end - .con-container .box-con-a02 .box-conArea .con-box.dec-half.dec-member*/ /*start - .con-container .box-con-a02 .box-conArea .con-btnbox -------------------------------------------------*/ .con-container .box-con-a02 .box-conArea .con-btnbox { width:auto;} .con-container .box-con-a02 .box-conArea .con-btnbox .btn-cancel, .con-container .box-con-a02 .box-conArea .con-btnbox .btn-add { width:auto; margin-top:0px;} /*end - .con-container .box-con-a02 .box-conArea .con-btnbox -------------------------------------------------*/ .con-container .box-con-a02 .box-conArea .con-box .con-type { color:#595959; font-weight:500; font-size:1rem; line-height:1rem; margin:0px; padding:15px 0px 5px 0px; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: end !important; align-items: flex-end !important;} .con-container .box-con-a02 .box-conArea .con-box .con-conBox { margin:0px; padding:0px; width:calc(100% - 0px); word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .con-container .box-con-a02 .box-conArea .con-box .con-conBox-whole { margin:0px; padding:0px; width:calc(100% - 0px); word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a02 .box-conArea .con-box .con-textbox-whole { margin:0px; padding:0px; width:calc(100% - 0px);} .con-container .box-con-a02 .box-conArea .con-box .con-textbox-whole .dec-type-c01 { color:#58baa3;} .con-container .box-con-a02 .box-conArea .con-box .con-conBox-whole-mode { margin:10px 0px 0px 0px; padding:0px; width:calc(100% - 0px); word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .con-container .box-con-a02 .box-conArea .con-box .con-conBox-whole-mode a.dec-mode, .con-container .box-con-a02 .box-conArea .con-box .con-conBox-whole-mode a.dec-mode:hover { width:calc(50% - 0px); margin:0px; padding:6px 5px; font-size:1.2rem; line-height: 1.5rem; display:inline-block; text-align: center;} .con-container .box-con-a02 .box-conArea .con-box .con-conBox-whole-mode a.dec-mode { color: #595958; border-bottom: 5px solid #595958; background:#fafafa;} .con-container .box-con-a02 .box-conArea .con-box .con-conBox-whole-mode a.dec-mode:hover { color:#787878; border-bottom:5px solid #787878; background:#fafafa;} .con-container .box-con-a02 .box-conArea .con-box .con-conBox-whole-mode a.dec-mode.is-active, .con-container .box-con-a02 .box-conArea .con-box .con-conBox-whole-mode a.dec-mode.is-active:hover { color:#fafafa; border-bottom:5px solid #595958; background:#595959;} /*start - .con-container .box-con-a02-btnArea ---------------------------------------------------*/ .con-container .box-con-a02-btnArea { margin:10px 0px; padding:0px; width:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a02-btnArea .con-btnbox { margin:0px 5px; padding:0px; width:calc(20% - 0px); max-width:200px; min-width:150px;} .con-container .box-con-a02-btnArea .con-btnbox.dec-box-01 { margin-left:auto; max-width:160px; min-width:160px;} .con-container .box-con-a02-btnArea .con-btnbox-01.dec-width-01 { margin:0px 5px; padding:0px; width:calc(20% - 0px); max-width:200px; min-width:160px;} .con-container .box-con-a02-btnArea .con-btnbox-01, .con-container .box-con-a02-btnArea .con-btnbox-02 { margin:0px; padding:0px; width:calc(100% - 0px);} .con-container .box-con-a02-btnArea .con-btnbox-01 a { margin:0px; padding:5px 0px; -ms-flex-pack: justify !important; justify-content: space-between !important;} .con-container .box-con-a02-btnArea .con-btnbox-01 .box-blank { width:29px; margin:0px; padding:0px; display:inline-block;} .con-container .box-con-a02-btnArea .con-btnbox-01 .dec-c01 { margin:1px 0px; padding:0px; font-size:1.5rem; color:#FFFFFF; width:25px;} .con-container .box-con-a02-btnArea .con-btnbox-02 { margin:0px; padding:0px; width:calc(100% - 0px);} .con-container .box-con-a02-btnArea .con-btnbox .dec-btn { margin:0px; padding:0px; min-height:37px;} /*end - .con-container .box-con-a02-btnArea ---------------------------------------------------*/ /*end - .con-container .box-con-a02 --------------------------------------------------------------------------------------*/ /*start - .con-container .con-btn-noteArea ---------------------------------------------------*/ .con-container .con-btn-noteArea { margin:5px 0px; padding:5px 0px; width:calc(100% - 0px); text-align:center;} .con-container .con-btn-noteArea p.dec-type { color:#ed1c24; font-family: 'Noto Sans TC', sans-serif; font-weight:400; font-size:1rem; line-height:1.3rem; margin:5px 0px; padding:5px 0px;} /*end - .con-container .con-btn-noteArea ---------------------------------------------------*/ /*start - .con-topBox.dec-forgetPassword-step -------------------------------------------*/ .con-topBox.dec-forgetPassword-step { border-bottom: 0px; background:transparent;} .con-topBox .con-forgetPassword-step { background:transparent; margin: 0px auto; margin-top:30px; width: calc(50% - 0px); min-width:340px; min-width:290px; position:relative; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} @media (max-width: 750px) {.con-topBox .con-forgetPassword-step { width: calc(55% - 0px);}} @media (max-width: 700px) {.con-topBox .con-forgetPassword-step { width: calc(58% - 0px);}} @media (max-width: 650px) {.con-topBox .con-forgetPassword-step { width: calc(68% - 0px);}} @media (max-width: 600px) {.con-topBox .con-forgetPassword-step { width: calc(73% - 0px);}} @media (max-width: 550px) {.con-topBox .con-forgetPassword-step { width: calc(78% - 0px);}} @media (max-width: 500px) {.con-topBox .con-forgetPassword-step { width: calc(88% - 0px);}} @media (max-width: 450px) {.con-topBox .con-forgetPassword-step { width: calc(100% - 0px);}} /*start - .con-topBox .con-forgetPassword-step .con-step*/ .con-topBox .con-forgetPassword-step .con-step { background:transparent; margin:0px; padding:5px; width:calc(25% - 10px); min-width:70px; z-index:2; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-topBox .con-forgetPassword-step .con-step .con-num { background:#FFFFFF; color:#e6e6e6; margin:0px auto; margin-bottom:5px; padding:5px; height:45px; width:calc(100% - 0px); max-width:45px; font-size:1.5rem; font-weight: 700; line-height:2rem; border-radius: 35px; border: 2px solid #e6e6e6; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-topBox .con-forgetPassword-step .con-step .con-num .dec-c01 { color: #e6e6e6;} .con-topBox .con-forgetPassword-step .con-step .con-type { background:transparent; color:#e6e6e6; margin:0px; padding:0px; width:calc(100% - 0px); font-size:1rem; font-weight:400; line-height:1.5rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} /*end - .con-topBox .con-forgetPassword-step .con-step*/ /*start - .con-topBox .con-forgetPassword-step .con-step.active*/ .con-topBox .con-forgetPassword-step .con-step.active .con-num { background:#a3a3a3; color:#FFFFFF; margin:0px auto; margin-bottom:5px; padding:5px; height:45px; width:calc(100% - 0px); max-width:45px; font-family:'Noto Sans TC', sans-serif; font-size: 1.5rem; font-weight: 700; line-height:2rem; border-radius: 35px; border: 2px solid #a3a3a3; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-topBox .con-forgetPassword-step .con-step.active .con-num .dec-c01 { color: #FFFFFF;} .con-topBox .con-forgetPassword-step .con-step.active .con-type { background:transparent; color:#999999; margin:0px; padding:0px; width:calc(100% - 0px); font-size:1rem; font-weight:400; line-height:1.5rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} /*end - .con-topBox .con-forgetPassword-step .con-step.active*/ .con-topBox .con-forgetPassword-step .con-step-bg { background:#e6e6e6; margin:30px calc(12% - 0px) 0px calc(12% - 0px); padding:0px; left:0px; top:0px; height:2px; width:calc(100% - 25%); position:absolute; z-index:1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} /*end - .con-topBox.dec-forgetPassword-step -------------------------------------------*/ /*start - .con-container .box-con-a02 .box-conArea .box-memberArea -------------------------------------------*/ .con-container .box-con-a02 .box-conArea .box-memberArea { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .con-container .box-con-a02 .box-conArea .box-memberArea .box-memberAreaR { width:calc(50% - 5px); margin:0px; padding:5px 5px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a02 .box-conArea .box-memberArea .box-memberAreaL { width:calc(50% - 0px); margin:0px 4px 0px 0px; border-right:1px solid #e1e1e1; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-container.dec-login .box-con-a02.dec-login .box-conArea { background: transparent;} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login { margin:0px; padding:0px; width:calc(100% - 0px); background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .box-memberArea-con { width:calc(50% - 0px); min-width:368px; max-width:400px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .con-box {} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .con-box .box-login-con { margin:0px; padding:0px; width:calc(100% - 0px); background:transparent; position:relative; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .con-box .box-login-con .box-type { margin:10px 0px 5px 0px; color:#585858; padding:0px; font-size:2rem; line-height:2.5rem; font-weight:400; letter-spacing: 0.2rem; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .con-box .box-login-con .icon-sprite { margin:5px 5px 0px 0px; padding:0px;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con { width:calc(80% - 0px); min-width:368px; max-width:400px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} /*start - .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02*/ .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02, .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .con-step-02-L, .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .con-step-02-R { margin:0px; padding:0px;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 { width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-L { width:60px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R { width:calc(100% - 60px); word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-L .dec-c01 { color:#e6e6e6; margin:0px; padding:0px; width:50px; height:50px;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-01, .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-02, .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-03 { width:calc(100% - 0px);} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-01 { color:#595959; font-size:1.2rem; line-height:1.8rem; font-weight:400;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-02 { color:#f7931e; font-size:1.2rem; line-height:1.8rem; font-weight:700; word-break:break-all;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-02 a, .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-02 a:hover { color:#f7931e; text-decoration:none;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-03 { color:#999999; font-size:15px; line-height:1.3rem; font-weight:400;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-01 p, .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-02 p { margin:5px 0px 0px 0px; padding:0px;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R .dec-type-03 p { margin:20px 0px 5px 0px; padding:0px;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R p a, .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R p a:hover { margin:2px 0px; padding:5px 0px; color:#4c92cc; display:inline-block; word-break: break-all;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R p a { text-decoration:none;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02 .boxCon-step-02-R p a:hover { text-decoration:underline;} /*end - .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con .boxCon-step-02*/ @media (max-width: 800px) { .con-container .box-con-a02 .box-conArea .box-memberArea { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a02 .box-conArea .box-memberArea .box-memberAreaR { width:calc(100% - 0px); margin:0px; padding:5px 5px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a02 .box-conArea .box-memberArea .box-memberAreaL { width:calc(100% - 0px); margin:0px 4px 0px 0px; border-right:0px solid #e1e1e1; border-bottom:1px solid #e1e1e1; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .con-container .box-con-a02 .box-conArea .box-memberArea.dec-changePassword .box-memberArea-con { width:calc(100% - 0px); min-width:268px; max-width:368px; margin:0px auto; border-right:0px solid #e1e1e1; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a02.dec-memberArea { margin:0px auto; width:calc(100% - 20px); min-width:290px; max-width:400px;} .con-container.dec-login .box-con-a02.dec-login { background:rgba(250, 250, 250, 1); border-radius:5px; border:1px solid #e1e1e1; padding:10px; margin:0px auto; margin-top:55px; margin-bottom:55px; width:calc(100% - 20px); min-width:300px; max-width:400px; position:relative; z-index:2; border-bottom:1px solid #cccccc; -moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1); display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container.dec-login .box-con-a02.dec-login .box-conArea .box-memberArea.dec-login .box-memberArea-con { width:calc(100% - 0px); min-width:268px; max-width:368px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} } /*end - .con-container.dec-login -------------------------------------------*/ /*start - .con-container .box-con-a03 ------------------------------------------------------------------------------------------------*/ .con-container .box-con-a03 { width:calc(100% - 0px); margin:0px auto; padding:10px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .main-area.dec-video .con-container { max-width:calc(100% - 0px); height:calc(100% - 0px); padding:80px 15px 15px 15px; padding:80px 10px 10px 10px; overflow:hidden; background:#464646; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .main-area.dec-video .con-container .box-con-video { margin:0px; padding:0px; width:calc(100% - 0px); height:calc(100% - 0px); overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} /*start - .con-container .box-con-a03 .box-functionArea -------------------------------------------*/ .con-container .box-con-a03 .box-functionArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03.dec-padding { padding:0px 10px;} .con-container .box-con-a03 .box-functionArea .box-buttonArea { margin:0px; padding:5px 0px; width:auto;} .con-container .box-con-a03 .box-functionArea .box-buttonArea.dec-mL { margin:0px; margin-left:auto; padding:5px 0px; width:auto;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-note { margin:0px; padding:0px; color:#999999; text-align:left;} .con-container .box-con-a03 .box-functionArea .box-infoArea { width:auto; margin:0px; margin-left:auto; padding:5px; text-align:right;} .con-container .box-con-a03 .box-functionArea .box-infoArea .dec-type { color:#f7931e; margin:0px 2px 0px 0px; padding:0px 0px 0px 2px; display:inline-block;} .con-container .box-con-a03 .box-functionArea .box-infoArea .dec-type-01 { color:#212529; margin:0px 2px 0px 5px; padding:0px; display:inline-block;} .con-container .box-con-a03 .box-functionArea .box-infoArea .dec-num-01 { color:#f7931e; margin:0px 10px 0px 0px; padding:0px; display:inline-block;} .con-container .box-con-a03 .box-functionArea .box-selectionArea { width:auto; margin:0px; padding:0px; text-align:right;} .con-container .box-con-a03 .box-functionArea .box-selectionArea.dec-m01 { padding-right:15px; margin-right:15px; border-right:1px solid #CCCCCC;} .con-container .box-con-a03 .box-functionArea .box-selectionArea-inner { width:auto; margin:0px; padding:0px; text-align:right; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-functionArea .box-selectionArea-advanceCon { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px 5px; border-radius:5px; background:#e1f1f4; border:1px solid #d5bdd6;} .con-container .box-con-a03 .box-functionArea .box-selectionArea-advanceCon-inner { width:calc(100% - 0px); margin:5px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} /*start - .con-container .box-con-a03 .box-functionArea .box-buttonArea ----------------------------------------------------------------------------------------------------------------------------------------*/ .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-add, .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-add:hover { margin:0px; padding:3px 10px; border-radius:25px; text-decoration:none; color:#FFFFFF; border:1px solid #0083BE;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-add { background:#169cbf;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-add:hover { background:#0083BE;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-delete, .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-delete:hover { margin:0px; padding:3px 10px; border-radius:25px; text-decoration:none; color:#FFFFFF; border:1px solid #666666;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-delete { background:#787878;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-delete:hover { background:#666666;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-other, .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-other:hover { margin:0px; padding:3px 10px; border-radius:25px; text-decoration:none; color:#595959; border:1px solid #CCCCCC;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-other { background:#FFFFFF;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-other:hover { background:#f5f5f5;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-maintain, .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-maintain:hover { margin:0px; padding:3px 10px; border-radius:25px; text-decoration:none; color:#FFFFFF; border:1px solid #f47a21;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-maintain { background:#f7931e;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-maintain:hover { background:#f47a21;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-save, .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-save:hover { margin:0px; padding:3px 10px; border-radius:25px; text-decoration:none; color:#FFFFFF; border:1px solid #dd6e54;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-save { background:#ee835c;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-save:hover { background:#e57857;} .con-container .box-con-a03 .box-functionArea .box-selectionArea .box-width-01 { width:150px; width:180px; margin:0px; padding:0px;} .con-container .box-con-a03 .box-functionArea .box-selectionArea .box-width-02 { width:120px; margin:0px 0px 0px 5px; padding:0px;} .con-container .box-con-a03 .box-functionArea .box-selectionArea .box-btn { width:50px; margin:0px 0px 0px 5px; padding:0px;} .con-container .box-con-a03 .box-functionArea .box-selectionArea .box-btn .dec-btn { margin:0px;} .con-container .box-con-a03 .box-functionArea .box-selectionArea .box-btn-advance { width:100px; margin:0px 0px 0px 5px; padding:0px;} .con-container .box-con-a03 .box-functionArea .box-selectionArea .box-btn-advance .dec-btn { margin:0px;} .con-container .box-con-a03 .box-functionArea .box-selectionArea .box-btn-advance .dec-btn .dec-ic { margin-left:2px; margin-bottom:2px; padding:0px;} .con-container .box-con-a03 .box-functionArea .box-selectionArea-advanceCon-inner .dec-width-btn { width:150px; margin:0px; padding:0px;} @media (max-width:950px){ .con-container .box-con-a03 .box-functionArea .box-buttonArea { width:calc(100% - 0px);} .con-container .box-con-a03 .box-functionArea .box-selectionArea {} .con-container .box-con-a03 .box-functionArea .box-selectionArea-advanceCon-inner .dec-width-btn {} } .con-container .box-con-a03 .box-functionArea .box-buttonArea.dec-align { display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-functionArea .box-buttonArea.dec-align a.dec-btn:nth-child(1), .con-container .box-con-a03 .box-functionArea .box-buttonArea.dec-align a.dec-btn:nth-child(2) { margin-right:3px;} .con-container .box-con-a03 .box-functionArea .box-buttonArea.dec-align .dec-note { font-size:1rem; line-height:1.2rem; margin:0px 0px 0px 15px; padding:0px; display:inline-block; color:#b4b4b4;} /*end - .con-container .box-con-a03 .box-functionArea .box-buttonArea ----------------------------------------------------------------------------------------------------------------------------------------*/ /*start - .con-container .dec-typeNoteArea ------------------------------------------------------------------------*/ .con-container .dec-typeNoteArea { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:10px 20px 5px 20px; background:transparent;} .con-container .dec-typeNoteArea .dec-type { margin:0px; padding:0px; font-size:1rem; line-height: 1.2rem; color:#999999;} /*end - .con-container .dec-typeNoteArea ------------------------------------------------------------------------*/ /*start - .con-container .dec-checkBoxArea ------------------------------------------------------------------------*/ .con-container .dec-checkBoxArea { width:calc(100% - 0px); margin:0px; padding:10px; border-radius:15px; background:#ebebeb;} .con-container .dec-checkBoxArea .box-topArea { width:calc(100% - 0px); margin:0px; padding:5px 10px; border-bottom:1px solid #CCCCCC;} .con-container .dec-checkBoxArea .box-conArea { width:calc(100% - 0px); margin:0px; padding:0px; border:0px;} /*start - .con-container .dec-checkBoxArea .box-conArea .con-listGroup*/ .con-container .dec-checkBoxArea .box-conArea .con-listGroup { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .dec-checkBoxArea .box-conArea .con-listGroup .box-listItem { min-width:110px; margin:0px; padding:5px 10px; color:#595959; border-radius:0px; border:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container .dec-checkBoxArea .box-conArea .con-listGroup .box-listItem:hover { background:#f0f0f0;} .con-container .dec-checkBoxArea .box-conArea .con-listGroup .box-listItem:first-child { margin:0px; border-bottom:1px solid #e1e1e1;} .con-container .dec-checkBoxArea .box-conArea .con-listGroup .box-listItem:first-child:hover { background:transparent;} .con-container .dec-checkBoxArea .box-conArea .con-listGroup .box-listItem .box-listItem-con { width:calc(100% - 0px); margin:0px; padding:0px;} .con-container .dec-checkBoxArea .box-conArea .con-listGroup .box-listItem .box-listItem-con .form-check-label { margin:2px 0px 3px 0px; line-height:1.3rem;} .con-container .dec-checkBoxArea .box-conArea .con-listGroup .box-listItem .box-listItem-con .form-check.form-check-inline:first-child { margin-right:0rem;} /*end - .con-container .dec-checkBoxArea .box-conArea .con-listGroup*/ /*end - .con-container .dec-checkBoxArea ------------------------------------------------------------------------*/ /*start - .box-sub-nav -------------------------------------------*/ .box-sub-nav { position:absolute; margin:0px; padding:0px; background:#5c5c5c; width:95px; height:auto; left:195px; top:197px; z-index:9999;} .box-sub-nav a, .box-sub-nav a:hover { width:calc(100% - 0px); margin:0px; padding:5px 8px; text-decoration:none; border-bottom:0px solid #ebebeb; display:block; text-align:center; color:#FFFFFF;} .box-sub-nav a { background:transparent;} .box-sub-nav a:hover { background:#787878;} .box-sub-nav a:last-child, .box-sub-nav a:last-child:hover { border-bottom:0px;} /*end - .box-sub-nav -------------------------------------------*/ /*start - .dec-group -------------------------------------------*/ .dec-group { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px 0px 5px 0px; border-bottom:1px dotted #CCCCCC;} .dec-group.dec-01 { margin:0px; padding:0px; border:0px;} .dec-group .dec-group-type { width:calc(100% - 0px); margin:0px; padding:15px 0px 5px 0px; color:#595959; font-size:1rem; line-height:1rem; display: -ms-inline-flexbox !important; display: inline-flex !important; ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: end !important; align-items: flex-end !important;} .dec-group .dec-group-con { width: calc(100% - 0px); margin: 0px; padding: 0px; word-break: break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .dec-group .dec-group-con .con-box-period { margin:0px 5px 0px 0px; padding:0px; text-align:center; vertical-align:middle; color:#808080;} .dec-group select.form-control { width:calc(12% - 0px); margin-right:5px;} .dec-group select.form-control:first-child { width:calc(22% - 0px); margin-right:5px;} .dec-group input.form-control { width:calc(60% + 18px); margin-right:5px;} .dec-group input.form-control.dec-form-control { width:calc(24% + 5px); margin:0px 5px 0px 0px; margin-left: auto;} .dec-group input.form-control.dec-form-control-02 { width:calc(20% - 20px); margin:0px 5px 0px 0px;} .dec-group .dec-group-con .dec-type { color:#999999;} .dec-group .dec-group-con a.dec-btn .dec-type, .dec-group .dec-group-con a.dec-btn:hover .dec-type { color:#FFFFFF;} .dec-group .dec-group-con a.dec-btn, .dec-group .dec-group-con a.dec-btn:hover { width:35px; min-width:35px; height:33.5px; margin:0px; padding:8px 0px 0px 9px; overflow:hidden; border-radius:5px; border:1px solid #CCCCCC;} .dec-group .dec-group-con a.dec-btn .dec-ic { font-size:16px;} .dec-group .dec-group-con a.dec-btn.dec-add { color:#72bf44; background:#fafafa;} .dec-group .dec-group-con a.dec-btn.dec-add:hover { color:#72bf44; background:#f0f0f0;} .dec-group .dec-group-con a.dec-btn.dec-delete { color:#999999; background:#fafafa;} .dec-group .dec-group-con a.dec-btn.dec-delete:hover { color:#999999; background:#f0f0f0;} .dec-group .dec-group-con .dec-group-listItem { width:calc(76% - 5px); margin:0px; padding:0px;} .dec-group .dec-group-con .dec-group-listItem .dec-form-check-inline { width:calc((100%/7) - 5px); margin:0px; padding:0px;} .dec-group .dec-group-con a.box-inner-width-02, .dec-group .dec-group-con a.box-inner-width-02:hover { margin-left:5px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden; width:calc(12% - 0px);} .dec-group .dec-group-con a.box-inner-width-02.dec-m-01 { margin-top:0px;} .dec-group .dec-group-con a.box-inner-width-02.dec-m-01a { margin-top:0px;} .dec-group .dec-group-con a.box-inner-width-02.dec-m-01b { margin-top:5px;} .dec-group .dec-group-con a.box-inner-width-02.dec-m-02 { margin-left:5px;} .dec-group .dec-group-con a.box-inner-width-02.dec-width-01 { width:150px; margin-top:0px;} .dec-group .dec-group-con a.box-inner-width-02.dec-box-01 { margin-left:0px; margin-right:5px; margin-top:0px;} .dec-group .dec-group-con .box-inner-width-02a { width:130px; margin-left:5px; padding: 5px; background:#FFFFFF; height:33.5px; overflow:hidden;} .dec-group .dec-group-con a.box-inner-width-02 .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-group .dec-group-con a.box-inner-width-02 .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .dec-group .dec-group-con a.box-inner-width-02:hover .dec-innerArea .dec-type { color:#595959;} .dec-group .dec-group-con .box-inner-width-02 .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .dec-group .dec-group-con a.box-inner-width-02 .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} /*start - .box-selectionArea-advanceCon-inner.dec-missionM .dec-group*/ .box-selectionArea-advanceCon-inner.dec-missionM .dec-group .dec-group-con { width:calc(100% - 0px); margin:0px; padding:0px; word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-selectionArea-advanceCon-inner.dec-missionM .dec-group select.form-control { width:calc(15% - 0px); margin-right:5px; margin-top:3px; margin-bottom:2px;} .box-selectionArea-advanceCon-inner.dec-missionM .dec-group select.form-control:first-child { width:calc(15% - 0px); margin-right:5px; margin-top:3px; margin-bottom:2px;} .box-selectionArea-advanceCon-inner.dec-missionM .dec-group input.form-control { width:calc(60% + 18px); margin-right: 5px; margin-top:3px; margin-bottom:2px;} .box-selectionArea-advanceCon-inner.dec-missionM .dec-group input.form-control.dec-form-control { width:calc(15% - 0px); margin:0px 5px 0px 0px; margin-top:3px; margin-bottom:2px;} .box-selectionArea-advanceCon-inner.dec-missionM .dec-group input.form-control.dec-form-control-date { width:calc(15% - 6px); margin:0px 5px 0px 0px; margin-top:3px; margin-bottom:2px;} /*end - .box-selectionArea-advanceCon-inner.dec-missionM .dec-group*/ /*end - .dec-group -------------------------------------------*/ /*end - .con-container .box-con-a03 .box-functionArea -------------------------------------------*/ /*start - .con-container .box-con-a03 .box-conArea.dec-result-EnterpriseAccount-powerAdmin -----------------------------------------------------------*/ .con-container .box-con-a03 .box-conArea.dec-result-EnterpriseAccount-powerAdmin, .con-container .box-con-a03 .box-conArea.dec-result-EnterpriseAccount, .con-container .box-con-a03 .box-conArea.dec-result-EnterpriseAccountAccess { width:calc(100% - 0px); height:calc(100% - 140px); margin:25px 0px 0px 0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .con-container .box-con-a03 .box-conArea.dec-result-EnterpriseAccount-powerAdmin .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-EnterpriseAccount .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-EnterpriseAccountAccess .dec-Pagination { margin-top:5px; padding-top:5px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important;} /*end - .con-container .box-con-a03 .box-conArea.dec-result-EnterpriseAccount-powerAdmin -----------------------------------------------------------*/ .con-container .box-con-a03 .box-conArea.dec-result-MonthlyReport_Report_01, .con-container .box-con-a03 .box-conArea.dec-result-MonthlyReport_Report_02, .con-container .box-con-a03 .box-conArea.dec-result-MonthlyReport_Report_03, .con-container .box-con-a03 .box-conArea.dec-result-MonthlyReport_Report_04 { width:calc(100% - 0px); height:calc(100% - 55px); margin:25px 0px 0px 0px; padding:0px; overflow:hidden;} /*dec-result-m-missionM_Freight_Logistics_Assign*/ /*start - .con-container .box-con-a03 .box-conArea.dec-result-m-Car -----------------------------------------------------------*/ .con-container .box-con-a03 .box-conArea.dec-result-m-Car, .con-container .box-con-a03 .box-conArea.dec-result-m-CarTrail, .con-container .box-con-a03 .box-conArea.dec-result-m-CarLicense, .con-container .box-con-a03 .box-conArea.dec-result-m-CarRepairHead, .con-container .box-con-a03 .box-conArea.dec-result-m-CarRepairTrail, .con-container .box-con-a03 .box-conArea.dec-result-m-CarMaintain, .con-container .box-con-a03 .box-conArea.dec-result-m-Driver, .con-container .box-con-a03 .box-conArea.dec-result-m-Attendance, .con-container .box-con-a03 .box-conArea.dec-result-m-DrivingLicense, .con-container .box-con-a03 .box-conArea.dec-result-m-Customer, .con-container .box-con-a03 .box-conArea.dec-result-m-Equipment, .con-container .box-con-a03 .box-conArea.dec-result-m-SIM, .con-container .box-con-a03 .box-conArea.dec-result-m-Spare, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRecord, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleSpeed, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleDrivingBehavior, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleCar, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleTire, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleFence, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleParkingLot, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleDriver, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleColdChain, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleExpirationDate, .con-container .box-con-a03 .box-conArea.dec-result-m-CarRoster, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsDashCam_03, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsAutomation, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsAutomationBackUp, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_Logistics, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_LogisticsDetail, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_LogisticsAssign, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_LogisticsFreight, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_FreightDetail, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsContainerVolume, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsSingleStationRushHour, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsRouteRushHour, .con-container .box-con-a03 .box-conArea.dec-result-m-overviewPowerAdminSCM { width:calc(100% - 0px); height:auto; margin:25px 0px 0px 0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .con-container .box-con-a03 .box-conArea { width:calc(100% - 0px); height:auto; margin:25px 0px 0px 0px; padding:0px; overflow:hidden;} .con-container .box-con-a03 .box-conArea .con-box { width:calc(100% - 0px); height:auto; margin:25px 0px 0px 0px; padding:0px; overflow:hidden;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer { width:calc(100% - 0px); height:auto; margin:25px 0px 0px 0px; padding:0px; overflow:hidden;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-conBox { width:calc(100% - 0px); height:auto; margin:0px; padding:0px; overflow:hidden;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-conBox.dec-mt01 { margin-top:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-conBox .dec-note { width: calc(100% - 0px); font-size:1rem; line-height:1.3rem; color:#b4b4b4; margin:0px; padding:5px 0px 15px 0px;} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-conBox .box-conArea.dec-result-m-missionM_Freight_Logistics_Assign*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-conBox .box-conArea.dec-result-m-missionM_Freight_Logistics_Assign { width:calc(100% - 0px); height:auto; margin:25px 0px 0px 0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-conBox .box-conArea.dec-result-m-missionM_Freight_Logistics_Assign .dec-noData { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:5px 0px; text-align:center; color:#CCCCCC; font-size:14px; line-height:1.5rem;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-conBox .box-conArea.dec-result-m-missionM_Freight_Logistics_Assign .dec-noData .dec-type {} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-conBox .box-conArea.dec-result-m-missionM_Freight_Logistics_Assign*/ .con-container .box-con-a03 .box-conArea.dec-result-m-Car .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-CarTrail .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-CarLicense .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-CarRepairHead .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-CarRepairTrail .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-CarMaintain .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-Driver .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-Attendance .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-DrivingLicense .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-Customer .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-Equipment .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-SIM .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-Spare .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRecord .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleSpeed .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleDrivingBehavior .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleCar .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleTire .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleFence .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleParkingLot .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleDriver .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleColdChain .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-AlarmRuleExpirationDate .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-CarRoster .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsDashCam_03 .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsAutomation .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsAutomationBackUp .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_Logistics .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_LogisticsDetail .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_LogisticsAssign .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_LogisticsFreight .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_FreightDetail .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsContainerVolume .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsSingleStationRushHour .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsRouteRushHour .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-overviewPowerAdminSCM .dec-Pagination, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_Freight_Logistics_Assign .dec-Pagination, .con-container.dec-statistics .dec-conArea-tableInfo .dec-Pagination, .dec-modal.modal-dialog .modal-content .modal-body .dec-Pagination { margin-top:5px; padding:5px 0px 0px 0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-container .box-con-a03 .box-conArea.dec-result-m-CarRoster, .con-container .box-con-a03 .box-conArea.dec-result-m-missionM_LogisticsAssign, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsContainerVolume, .con-container .box-con-a03 .box-conArea.dec-result-m-statisticsSingleStationRushHour { margin:0px;} .con-container .box-con-a03 .box-conArea .dec-width-01 { width:200px; display:inline-block;} .con-container .box-con-a03 .box-conArea .form-check-input.dec-margin-01 { margin-top:0.7rem;} .con-container .dec-conBoxInner.div-NavSortBox-statisticsDashCam .box-conArea.dec-result-m-statisticsDashCam_03 { height:calc(100% - 0px); overflow:auto;} /*end - .con-container .box-con-a03 .box-conArea.dec-result-m-Car -----------------------------------------------------------*/ .con-container .box-con-a03 .box-conArea.dec-half { margin:0px 0px 5px 0px; padding:0px; width:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container .box-con-a03 .box-conArea .con-box { margin:0px 0px 5px 0px; padding:0px; width:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box.dec-half { margin:0px 0px 5px 0px; padding:0px; width:calc(50% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box.dec-half:first-child { margin-right: 10px;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer { width:calc(100% - 0px); margin:0px; padding:10px; border-radius: 5px; background:#fafafa; border:1px solid #e1e1e1; position:relative; color:#595959;} /*start - .con-container .box-con-a03 .box-conArea.dec-whole*/ .con-container .box-con-a03 .box-conArea.dec-whole { width:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgArea { width:calc(100% - 0px); height: calc(32vh - 0px); margin:0px; padding:0px; text-align: center; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgArea .dec-img { width:auto; max-width:calc(100% - 0px); max-height:calc(30vh - 0px); margin:0px; margin:auto; padding:0px;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgArea .dec-type { font-size:1rem; color:#999999; margin:0px; margin:auto; padding:0px;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group { width:calc(100% - 0px); margin:0px; padding:0px; border-top:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: distribute !important; justify-content: space-around !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group:first-child { border-top:0px;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group .dec-imgArea { width:calc(35% - 0px); height: auto; margin:0px; padding: 5px;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group .dec-imgArea .dec-img { max-width:calc(100% - 0px); max-height:calc(20vh - 0px); margin:0px; padding:0px;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group .dec-conArea { width:calc(65% - 0px); margin:0px; padding:5px; border-left:1px solid #e1e1e1; min-height: calc(21vh - 0px); -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group .dec-conArea .dec-conlistArea { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; border-top: 1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: distribute !important; justify-content: space-around !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group .dec-conArea .dec-conlistArea:first-child { border-top:0px;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group .dec-conArea .dec-conlistArea .dec-subtitle { width:100px; font-size:1rem; line-height:1.5rem; font-weight: 500; text-align:right; color:#595959; margin:0px 5px 0px 0px; padding: 0px;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group .dec-conArea .dec-conlistArea .dec-content { width:calc(100% - 105px); font-size:1rem; line-height:1.5rem; font-weight:400; color:#595959; margin:0px; padding:0px;} .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group .dec-conArea .dec-conlistArea .dec-content a, .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group .dec-conArea .dec-conlistArea .dec-content a:hover { } .con-container .box-con-a03 .box-conArea.dec-whole .con-box .con-box-outer .dec-imgList-area .dec-imgList-group .dec-conArea .dec-conlistArea .dec-content .dec-note { color:#999999; font-size:12px; line-height:1.2rem;} /*end - .con-container .box-con-a03 .box-conArea.dec-whole*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer.dec-Version { width:calc(100% - 0px); margin:0px; padding:0px; border-radius: 0px; background:#FFFFFF; border: 0px solid #e1e1e1; position:relative;} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition ---------------------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition { margin:-1px 10px 0px -5px; padding:5px 22px 5px 15px; border-radius:0px 0px 5px 5px; position: absolute; top:0px; right:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition .dec-type { color:#FFFFFF;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Job-01 .dec-type { color:#595959;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Detect-01 .dec-type { color:#595959;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Mission-01 .dec-type { color:#595959;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Job-01 .dec-type:after { content:"正常下班";} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Job-02 .dec-type:after { content:"上/下班異常";} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Job-03 .dec-type:after { content:"出勤中";} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Detect-01 .dec-type:after { content:"已檢測";} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Detect-02 .dec-type:after { content:"未檢測";} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Mission-01 .dec-type:after { content:"已完成";} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Mission-02 .dec-type:after { content:"已完成(遲送)";} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Mission-03 .dec-type:after { content:"運送中";} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Mission-04 .dec-type:after { content:"運送過(遲送)";} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Job-01 { background-image:repeating-linear-gradient(-135deg,#ebebeb 0%,#ebebeb 20%, #FFFFFF 20%, #FFFFFF 25%, #FFFFFF 100%); border:1px solid #CCCCCC;} /*出勤管理/上下班狀態：正常下班*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Job-02 { background-image:repeating-linear-gradient(-135deg,#fc715e 0%,#fc715e 20%, #f15a24 20%, #f15a24 25%, #f15a24 100%); border:1px solid #e55123;} /*出勤管理/上下班狀態：上/下班異常*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Job-03 { background-image:repeating-linear-gradient(-135deg,#a2d159 0%,#a2d159 20%, #72bf44 20%, #72bf44 25%, #72bf44 100%); border:1px solid #69af3c;} /*出勤管理/上下班狀態：出勤中*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Detect-01 { background-image:repeating-linear-gradient(-135deg,#ebebeb 0%,#ebebeb 20%, #FFFFFF 20%, #FFFFFF 25%, #FFFFFF 100%); border:1px solid #CCCCCC;} /*出勤管理/檢測：已檢測*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Detect-02 { background-image:repeating-linear-gradient(-135deg,#fc715e 0%,#fc715e 20%, #f15a24 20%, #f15a24 25%, #f15a24 100%); border:1px solid #e55123;} /*出勤管理/檢測：未檢測*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Mission-01 { background-image:repeating-linear-gradient(-135deg,#ebebeb 0%,#ebebeb 20%, #FFFFFF 20%, #FFFFFF 25%, #FFFFFF 100%); border:1px solid #CCCCCC;} /*出勤管理/任務資訊：已完成*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Mission-02 { background-image:repeating-linear-gradient(-135deg,#fc715e 0%,#fc715e 20%, #f15a24 20%, #f15a24 25%, #f15a24 100%); border:1px solid #e55123;} /*出勤管理/任務資訊：已完成(遲送)*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Mission-03 { background-image:repeating-linear-gradient(-135deg,#a2d159 0%,#a2d159 20%, #72bf44 20%, #72bf44 25%, #72bf44 100%); border:1px solid #69af3c;} /*出勤管理/任務資訊：運送中*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition.dec-color-Mission-04 { background-image:repeating-linear-gradient(-135deg,#d6435c 0%,#d6435c 20%, #c1272d 20%, #c1272d 25%, #c1272d 100%); border:1px solid #b2222d;} /*出勤管理/任務資訊：運送過(遲送)*/ /*end - .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .dec-condition ---------------------------------------------------*/ .con-container .box-con-a03 .box-breakArea { width:calc(100% - 0px); margin:15px 0px; padding:0px; height: 1px; background:transparent; border-top: 1px dotted #CCCCCC;} .con-container .box-con-a03 .box-conArea .con-box .con-type { color:#595959; font-weight:500; font-size:1rem; line-height:1rem; margin:0px; padding:15px 0px 5px 0px; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: end !important; align-items: flex-end !important;} .con-container .box-con-a03 .box-conArea .con-box .con-type.dec-p01 { padding:10px 0px 0px 0px; margin-bottom:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-a01 { margin:0px; padding:0px; width:calc(30% - 10px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-a02 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-a03 { margin:0px; padding:0px; width:calc(50% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-c01 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-c02 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-c03 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-c04 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-c05 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-d01 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-d02 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-d03 { margin:0px; padding:0px; width:calc(60% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-e01 { margin:0px; padding:0px; width:calc(25% - 20px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-e02 { margin:0px; padding:0px; width:calc(25% - 20px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-e03 { margin:0px; padding:0px; width:calc(25% - 20px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-e04 { margin:0px; padding:0px; width:calc(25% - 20px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-e05 { margin:0px; padding:0px; width:40px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-f01 { margin:0px; padding:0px; width:calc(70% - 40px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-f02 { margin:0px; padding:0px; width:calc(30% - 40px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-f03 { margin:0px; padding:0px; width:60px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-n01 { margin:0px; padding:0px; width:calc(30% - 15px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-n02 { margin:0px; padding:0px; width:calc(20% - 15px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-n03 { margin:0px; padding:0px; width:20px; height:calc(100% - 0px); margin-left:10px; text-align:center;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-n04 { margin:0px; padding:0px; width:calc(30% - 15px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-n05 { margin:0px; padding:0px; width:calc(20% - 15px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-n01a { margin:0px; padding:0px; width:calc(50% - 20px); height:calc(100% - 0px); color:#B4B4B4;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-n03a { margin:0px; padding:0px; width:20px; height:calc(100% - 0px); margin-left:10px; text-align:center;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-n04a { margin:0px; padding:0px; width:calc(50% - 20px); height:calc(100% - 0px); margin-left:10px;color:#B4B4B4;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-p01 { margin:0px; padding:0px; width:110px; height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-p02 { margin:0px; padding:0px; width:calc(25% - 65px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-con-p03 { margin:0px; padding:0px; width:calc(25% - 70px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-half { margin:0px; padding:0px; width:calc(50% - 5px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-type .con-width-half:nth-child(2) { margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-type.dec-title { width:calc(100% - 0px); margin:0px; padding:25px 0px 5px 0px; color:#595959; font-weight:500; font-size:1.2rem; line-height:1.5rem;} .con-container .box-con-a03 .box-conArea .con-box .con-type.dec-title:first-child { padding: 5px 0px 5px 0px;} .con-container .box-con-a03 .box-conArea .con-box .div-note { margin:0px; margin-left:auto; padding:5px 0px; color:#999999; font-weight:400; font-size:1rem; line-height:1.5rem; display:inline-block;} .con-container .box-con-a03 .box-conArea .con-box .con-type.dec-title .dec-note { margin: 0px; margin-left:auto; padding:0px; color:#999999; font-weight:400; font-size:1rem; line-height:1.5rem; display:inline-block;} .con-container .box-con-a03 .box-conArea .con-box .con-type.dec-title .dec-type { color:#1591BC;} .con-container .box-con-a03 .box-conArea .con-box .con-type.dec-title .dec-num { color:#f7931e;} .con-container .box-con-a03 .box-conArea .con-box .con-type .dec-num { color:#f7931e;} .con-container .box-con-a03 .box-conArea .con-box .con-type a.btn-sort, .con-container .box-con-a03 .box-conArea .con-box .con-type a.btn-sort:hover { margin:0px 0px 0px 5px; padding:3px 5px; border:1px solid #CCCCCC; border-radius:5px; background:transparent; color:#ADADAD; display:inline-block; font-size:12px;} .con-container .box-con-a03 .box-conArea .con-box .con-type a.btn-sort:hover { border:1px solid #50a8b4; color:#50a8b4;} .con-container .box-con-a03 .box-conArea .con-box .con-type a.btn-sort.is-active, .con-container .box-con-a03 .box-conArea .con-box .con-type a.btn-sort.is-active:hover { margin:0px 0px 0px 5px; padding:3px 5px; border:1px solid #8F8F8F; border-radius:5px; background:transparent; color:#8F8F8F; display:inline-block; font-size:12px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-sortArea { width:calc(100% - 0px); margin:0px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-groupOuter01 { width:calc(100% - 0px); padding:0px 0px 0px 30px; margin:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-groupOuter01 .con-type:first-child { padding:5px 0px;} .con-container .box-con-a03 .box-conArea .con-box .con-groupOuter { width:calc(100% - 0px); margin:0px 0px 10px 0px; padding:10px; background:#ebeaef; border-radius:5px;} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox -----------------------------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox { width: calc(100% - 0px); min-height: 33.5px; margin: 0px; padding: 0px; word-break: break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-h01 { min-height:20px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-h02 { height:33.5px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-m01 { margin-top:5px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-m02 { margin-bottom:15px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-form-control-file { margin:5px 0px 0px 0px; min-height: 38.5px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole.dec-wrap { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole .dec-type { font-size:1rem; line-height: 1.2rem; color: #169cbf;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole.dec-email { width: calc(100% - 0px); height: calc(100% - 0px); margin: 0px; padding: 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole.dec-email .dec-type { width: calc(100% - 0px); font-size:1rem; line-height:1.3rem; color:#b4b4b4; margin:0px; padding:5px 0px 15px 0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-half { margin: 0px; padding: 0px; width: calc(50% - 5px); height: calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-half:nth-child(2) { margin-left: 10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole .dec-note, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-half .dec-note { width: calc(100% - 0px); font-size:1rem; line-height:1.3rem; color:#b4b4b4; margin:0px; padding:5px 0px 15px 0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole .dec-note.dec-style01 { color:#72bf44; padding:5px 0px 15px 22px;} .con-container .box-con-a03 .box-conArea .con-box .con-groupOuter .con-conBox .con-width-whole.dec-wrap .dec-note { color:#b4af7d;} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole.dec-new & dec-edit*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole.dec-new .dec-form-control { width:calc(100% - 70px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole.dec-new .dec-btn { width:60px; margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole.dec-new .dec-btn .dec-type { color:#FFFFFF;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole.dec-edit .dec-form-control { width:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole.dec-edit .dec-btn { display: none !important;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-whole.dec-new & dec-edit*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-a01 { margin:0px 5px 0px 0px; padding:0px; width:100px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-a02 { margin:0px; padding:0px; width:calc(100% - 105px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-b01 { margin:0px 5px 0px 0px; padding:0px; width:100px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-b02 { margin:0px 5px 0px 0px; padding:0px; width:calc(100% - 265px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-b03 { margin:0px 5px 0px 0px; padding:0px; width:50px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-b04 { margin:0px; padding:0px; width:100px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-c01 { margin:0px 5px 0px 0px; padding:0px; width:100px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-c02 { margin:0px 5px 0px 0px; padding:0px; width:100px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-c03 { margin:0px 0px 0px 0px; padding:0px; width:calc(100% - 210px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-d01 { margin:0px 5px 0px 0px; padding:0px; width:calc(100% - 170px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-d02 { margin:0px 5px 0px 0px; padding:0px; width:80px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-d03 { margin:0px 0px 0px 0px; padding:0px; width:80px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-e01 { margin:0px 5px 0px 0px; padding:0px; width:100px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-e02 { margin:0px 5px 0px 0px; padding:0px; width:calc(25% - 70px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-e03 { margin:0px 5px 0px 0px; padding:0px; width:calc(25% - 70px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-e04 { margin:0px 5px 0px 0px; padding:0px; width:100px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-e05 { margin:0px 5px 0px 0px; padding:0px; width:calc(25% - 70px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-e05a { margin:0px 5px 0px 0px; padding:0px; width:calc(50% - 135px); text-align:right; color:#b8b8b8; line-height:1.2rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-e06 { margin:0px 5px 0px 0px; padding:0px; width:calc(25% - 70px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-e07 { margin:0px; padding:0px; width:50px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-f01 { margin:0px 5px 0px 0px; padding:0px; width:100px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-f02 { margin:0px 5px 0px 0px; padding:0px; width:calc(50% - 110px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-f03 { margin:0px 5px 0px 0px; padding:0px; width:100px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-f04 { margin:0px 5px 0px 0px; padding:0px; width:calc(50% - 110px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-g01 { margin:0px 5px 0px 0px; padding:0px; width:100px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-g02 { margin:0px 5px 0px 0px; padding:0px; width:calc(25% - 55px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-g03 { margin:0px 5px 0px 0px; padding:0px; width:calc(25% - 60px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-g04 { margin:0px 5px 0px 0px; padding:0px; width:100px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-g05 { margin:0px 5px 0px 0px; padding:0px; width:calc(50% - 110px);} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-AlarmRuleSpeed-roadType*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-AlarmRuleSpeed-roadType { background:#ebebeb; padding:10px 0px; border-radius:0.25rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-AlarmRuleSpeed-roadType .con-width-e01 { margin:0px 5px 0px 0px; padding:0px; width:95px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-AlarmRuleSpeed-roadType .con-width-e02 { margin:0px 5px 0px 0px; padding:0px; width:calc(50% - 105px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-AlarmRuleSpeed-roadType .con-width-e03 { margin:0px 0px 0px 0px; padding:0px; width:calc(50% - 0px);} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-AlarmRuleSpeed-roadType*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox a { margin-top:0px; height:34px !important; min-height:34px !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.dec-01 { padding:5px 0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.dec-02 { padding:7px 5px 5px 5px; margin:0px; text-decoration:underline !important; height:33.5px !important; overflow:hidden;} .con-container .box-con-a03 .box-conArea .con-box .box-btnArea { margin:0px 25%; padding:0px; width:calc(50% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-result { width:calc(100% - 0px); margin:10px 0px; padding:0px; word-break:break-all; overflow-x:hidden; overflow-y:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-result .table td { vertical-align:middle;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-result .table td .dec-color-01 { color:#f7931e;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-result .dec-noData { width:calc(100% - 0px); margin:0px; padding:0px; text-align:center;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-result .dec-noData .dec-type { margin:0px; padding:0px; color:#CCCCCC;} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-group*/ .con-container .box-con-a03 .box-conArea .con-box .con-group { width:calc(100% - 0px); margin:0px; padding:0px; background:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .con-container .box-con-a03 .box-conArea .con-box .con-group .con-type { color:#595959; font-size:1rem; line-height:1rem; margin:0px; padding:5px 10px 5px 5px; width:calc(100% - 0px); width:150px; font-weight:500; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-group .con-conBox { width:calc(100% - 120px); min-height:33.5px; margin:0px; padding:0px; word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-group .con-conBox .dec-note { font-size:12px; color:#999999; margin-left:5px;} .con-container .box-con-a03 .box-conArea .con-box .con-divider { width:calc(100% - 0px); margin:5px 0px; padding: 0px; border-top:1px solid #d6d6d6;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-group*/ /*start - .dec-innerBox.dec-AlarmRuleTire ----------------------------------------------------*/ .dec-innerBox.dec-AlarmRuleTire { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleTire .dec-innerBox-A01 { width:40px; margin:0px 5px 0px 0px; padding:0px; text-align:right;} .dec-innerBox.dec-AlarmRuleTire .dec-innerBox-A02 { width:calc(25% - 30px); margin:0px 10px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleTire .dec-innerBox-A03 { width:calc(25% - 0px); margin:0px 10px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleTire .dec-innerBox-A04 { width:40px; margin:0px 5px 0px 0px; padding:0px; text-align:left;} /*end - .dec-innerBox.dec-AlarmRuleTire ----------------------------------------------------*/ /*start - .dec-innerBox.dec-AlarmRuleCar ----------------------------------------------------*/ .dec-innerBox.dec-AlarmRuleCar { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleCar:first-child { margin:0px;} .dec-innerBox.dec-AlarmRuleCar .dec-innerBox-A01 { width:40px; min-width:40px; margin:0px 5px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleCar .dec-innerBox-A02 { width:80px; min-width:80px; margin:0px 5px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleCar .dec-innerBox-A03 { width:30px; min-width:30px; margin:0px 5px 0px 0px; padding:0px; text-align:right;} .dec-innerBox.dec-AlarmRuleCar .dec-innerBox-A04 { width:calc(25% - 30px); min-width:calc(25% - 30px); margin:0px 5px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleCar .dec-innerBox-A04.dec-width { width:calc(50% - 40px);} .dec-innerBox.dec-AlarmRuleCar .dec-innerBox-A05 { width:10px; min-width:10px; margin:0px 5px 0px 0px; padding:0px; text-align:center;} .dec-innerBox.dec-AlarmRuleCar .dec-innerBox-A06 { width:calc(25% - 30px); min-width:calc(25% - 30px); margin:0px 5px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleCar .dec-innerBox-A07 { width:40px; min-width:40px; margin:0px 5px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleCar.dec-w-01 .dec-innerBox-A01 { width:65px; min-width:65px;} .dec-innerBox.dec-AlarmRuleCar.dec-w-02 .dec-innerBox-A01 { width:80px;} .dec-innerBox.dec-AlarmRuleCar.dec-w-03 .dec-innerBox-A01 { width:65px;} .dec-innerBox.dec-AlarmRuleCar.dec-w-04 .dec-innerBox-A01 { width:40px;} .dec-innerBox.dec-AlarmRuleCar.dec-w-04 .dec-innerBox-A02 { width:95px; min-width:95px;} /*end - .dec-innerBox.dec-AlarmRuleCar ----------------------------------------------------*/ /*start - .dec-innerBox.dec-AlarmRuleCar-sort ------------------------------------------------------------*/ .con-sortArea .desc { } .con-sortArea .desc .dec-innerBox.dec-AlarmRuleCar-sort { width:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleCar-sort:nth-child(1) { padding:0px;} .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox { margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox .con-type { color:#595959; font-weight:400; font-size:1rem; line-height:1rem; margin:0px; padding:15px 0px 5px 0px; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: end !important; align-items: flex-end !important;} .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox.dec-A01 .con-type { padding: 5px 0px;} .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox.dec-A01 { width:190px; min-width:65px; margin:0px; padding:0px;} .con-sortArea .desc.dec-w-00 .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox.dec-A01 { width:100px;} .con-sortArea .desc.dec-w-01 .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox.dec-A01 { width:125px;} .con-sortArea .desc.dec-w-02 .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox.dec-A01 { width:135px;} .con-sortArea .desc.dec-w-03 .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox.dec-A01 { width:145px;} .con-sortArea .desc.dec-w-04 .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox.dec-A01 { width:155px;} .con-sortArea .desc.dec-w-05 .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox.dec-A01 { width:180px;} .con-sortArea .desc.dec-w-06 .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox.dec-A01 { width:200px;} .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox.dec-A02 { width:calc(100% - 195px); min-width:65px; margin:0px; padding:0px;} .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox .form-check { width:calc(100% - 0px); margin:0px; padding:0px; height:33.5px;} .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox .form-check .form-check-input { margin-top:0.7rem;} .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox .form-check .form-check-label { padding:5px 0px;} .dec-innerBox.dec-AlarmRuleCar-sort .dec-innerBox .form-check .dec-form-control { width: calc(50% - 145px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} /*end - .dec-innerBox.dec-AlarmRuleCar-sort ------------------------------------------------------------*/ /*start - .dec-innerBox.dec-AlarmRuleSpeed ----------------------------------------------------*/ .dec-innerBox.dec-AlarmRuleSpeed { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-01 { width:80px; margin:0px 5px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-02 { width: calc(50% - 90px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-01.dec-w-01 { width:150px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-02.dec-w-01 { width:calc(50% - 160px);} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-02.dec-w-02 { width:calc(50% - 315px);} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-01.dec-w-03 { width:calc(50% - 10px); margin:0px 10px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-01.dec-w-05A { width:160px; margin:0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-01.dec-w-05B { width:calc(50% - 175px); margin:0px 0px 0px 10px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-03 { width:calc(50% - 10px); margin:0px; margin-left:10px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-half { width:calc(50% - 5px); margin:0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-A01 { width:35px; margin:0px 10px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-A02 { width:calc(25% - 10px); margin:0px 10px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-A03 { width:calc(25% - 10px); margin:0px 10px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-A04 { width:calc(50% - 50px); margin:0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-B01 { width:50px; margin:0px 10px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-B02 { width:80px; margin:0px 10px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-B03 { width:80px; margin:0px 10px 0px 0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-B04 { width:150px; margin:0px; padding:0px;;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-B05 { width:100px; margin-left: 10px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-B05A { width:50px; margin-left:10px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-B06 { width:50px; margin-left:10px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-C01, .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-C04 { width:100px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-C02, .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-C05 { width: calc(50% - 265px); margin:0px 5px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-C03, .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-C06 { width:80px; margin:0px; padding:0px;} .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-C07 { width:150px; margin:0px; padding:0px; color:#b4b4b4;} .dec-innerBox.dec-AlarmRuleSpeed.dec-m01 { margin-top:10px;} .dec-innerBox.dec-AlarmRuleSpeed.dec-m02 { margin-top:5px;} .showAlarmRuleSpeed_duration { margin:0px; padding:0px;} /*end - .dec-innerBox.dec-AlarmRuleSpeed ----------------------------------------------------*/ /*start - .dec-innerBox.dec-AlarmRuleExpirationDate ----------------------------------------------------*/ .dec-innerBox.dec-AlarmRuleExpirationDate { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleExpirationDate:first-child { margin:0px;} .dec-innerBox.dec-AlarmRuleExpirationDate .dec-innerBox-01 { width:70px; margin:0px 5px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleExpirationDate .dec-innerBox-02 { width: calc(50% - 80px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleExpirationDate .dec-innerBox-A01 { width:calc(25% - 10px); margin:0px 5px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-innerBox.dec-AlarmRuleExpirationDate .dec-innerBox-A02 { width: calc(25% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} /*end - .dec-innerBox.dec-AlarmRuleExpirationDate ----------------------------------------------------*/ /*start - .box-infoCon .dec-con .con-functionbox ----------------------------------------------------*/ .box-infoCon .dec-con .con-functionbox { } .box-infoCon .dec-con .con-functionbox .form-check.dec-a01 { width:auto; margin-bottom:5px; padding:0px 0px 0px 25px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-infoCon .dec-con .con-functionbox .form-check.dec-a02 { width:auto; margin-bottom:5px; padding:0px 0px 0px 25px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-infoCon .dec-con .con-functionbox .form-check.dec-a01 .form-check-label { width:auto; margin-top:0.2rem;} .box-infoCon .dec-con .con-functionbox .form-check.dec-a01 .form-check-input { margin-top:0.3rem;} /*end - .box-infoCon .dec-con .con-functionbox ----------------------------------------------------*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox ----------------------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox { margin:0px; padding:0px; height:calc(100% - 0px); width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-column { -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-column .form-check { padding-top:2px; padding-bottom:3px; margin-right:auto; width:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-column .form-check .form-check-label { width:calc(100% - 0px);} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01 { width:calc(100% - 0px); margin-bottom:5px; padding:0px 0px 0px 35px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01 .form-check-label { width:40px; margin-top:0.2rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01 .form-check-input { margin-top:0.3rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01 .dec-form-control { width:calc(100% - 40px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01 input[type="radio"] + label + select { pointer-events:none; /*background:#F5F5F5;*/ color:#CCCCCC; -moz-appearance:none; -webkit-appearance:none; appearance:none; background: #FFFFFF url("../images/element/selectArrow.svg") no-repeat; background-size:16px 14px; background-position: right .5rem center;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01 input[type="radio"]:checked + label + select { pointer-events:auto; /*background:#FFFFFF;*/ color:#595959; -moz-appearance:none; -webkit-appearance:none; appearance:none; background: #FFFFFF url("../images/element/selectArrow.svg") no-repeat; background-size:16px 14px; background-position: right .5rem center;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01 input[type="radio"]:checked + label + input[type="text"] { pointer-events:auto; color:#595959;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01 input[type="radio"] + label + input[type="text"] { pointer-events:none;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01 input[type="radio"] + label + input[type="text"]::placeholder { color:#999999;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01 input[type="radio"]:checked + label + input[type="text"]::placeholder { color:#6c757d;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a01*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02 { width:calc(100% - 0px); margin-bottom:5px; padding:0px 0px 0px 35px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02 .form-check-label { width:80px; margin-top:0.2rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02 .form-check-input { margin-top:0.3rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02 .dec-form-control { width:calc(100% - 80px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02 input[type="radio"] + label + select { pointer-events:none; /*background:#F5F5F5;*/ color:#CCCCCC; -moz-appearance:none; -webkit-appearance:none; appearance:none; background: #FFFFFF url("../images/element/selectArrow.svg") no-repeat; background-size:16px 14px; background-position:right .5rem center;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02 input[type="radio"]:checked + label + select { pointer-events:auto; /*background:#FFFFFF;*/ color:#595959; -moz-appearance:none; -webkit-appearance:none; appearance:none; background: #FFFFFF url("../images/element/selectArrow.svg") no-repeat; background-size: 16px 14px; background-position:right .5rem center;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02 input[type="radio"]:checked + label + input[type="text"] { pointer-events:auto; color:#595959;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02 input[type="radio"] + label + input[type="text"] { pointer-events:none;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02 input[type="radio"] + label + input[type="text"]::placeholder { color:#999999;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02 input[type="radio"]:checked + label + input[type="text"]::placeholder { color:#6c757d;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .div-note { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 120px; color:#B4B4B4;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check.dec-a02*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check:after { content: ""; margin-right:15px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check:last-child:after { content:""; margin-right:15px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check .dec-box { display:inline-block; width:150px; margin-left:3px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check .form-check-input.dec-form-check-input { margin-top:0.75rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .form-check .dec-note { width:auto; margin:0px 0px 0px 25px; padding:0px; display:inline; color:#b4b4b4;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox .dec-type-03 { margin:0px; padding:0px 10px 0px 30px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-a03 .form-check { padding-top:3px; padding-bottom:2px;} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole { margin:0px; padding:0px; height:calc(100% - 0px); width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-input.dec-form-check-input { margin-top:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check { width:calc(100% - 0px); margin:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label { width:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label .dec-box { width:calc(100% - 0px); margin-left:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label .dec-box div { margin:0px 0px 0px 5px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label .dec-box div:first-child { width:30px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label .dec-box div:nth-child(2) { width:110px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label .dec-box div:nth-child(3) { width:calc(100% - 230px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label .dec-box div:nth-child(4) { width:70px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label .dec-box div a, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label .dec-box div a:hover { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label .dec-box div a.disabled, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check-label .dec-box div a.disabled:hover { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1rem; background:#fafafa; color:#bebebe; border:1px solid #dee2e6; cursor:default;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-whole .form-check*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed ----------------------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check { width:calc(100% - 0px); padding:5px 0px 5px 120px; border-top:1px solid #ebebeb;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check:hover { background:#fcfbe0;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check .form-check-label { width:calc(100% - 0px); padding:0.2rem 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check { display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check .form-check-input { margin-top:0rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check .dec-innerBox.dec-AlarmRuleSpeed { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-01 { width:150px; margin:0px 5px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-02 { width:20px; margin:0px 5px 0px 0px; padding:0px 0px 0px 5px; text-align: center; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-03 { width:calc(50% - 240px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-03 .dec-form-control { width:calc(100% - 60px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-03 .dec-type { width:55px; margin:0px 0px 0px 5px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-04 { width:calc(50% + 60px); margin:0px; margin-left:10px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed .form-check .dec-innerBox.dec-AlarmRuleSpeed .dec-innerBox-04 .dec-type { color:#b4b4b4; line-height:1.3rem;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleSpeed ----------------------------------------------------*/ /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox ----------------------------------------------------*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox ----------------------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleColdChain { margin:0px; padding:0px; height:calc(100% - 0px); width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleColdChain .con-functionboxList { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleColdChain .con-functionboxList .con-box-group-01 { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .con-functionboxList .con-box-group-01 .con-box:nth-child(1) { margin:0px; padding:5px 0px; width:100px;} .con-functionboxList .con-box-group-01 .con-box:nth-child(2) { margin:0px; padding:0px 10px; width:40px; height:45px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: end !important; align-items: flex-end !important;} .con-functionboxList .con-box-group-01 .con-box:nth-child(2).dec-01 { -ms-flex-align: start !important; align-items: flex-start !important;} .con-functionboxList .con-box-group-01 .con-box:nth-child(2) .dec-ic-group { margin:0px; padding:0px; width:40px; height:45px; overflow:hidden;} .con-functionboxList .con-box-group-01 .con-box:nth-child(2) .dec-ic-group .dec-ic-g01 { margin:6px 0px 0px 3px; padding:0px; color:#CCCCCC; font-size:22px;} .con-functionboxList .con-box-group-01 .con-box:nth-child(2) .dec-ic-group .dec-ic-g02 { margin:15px 0px 0px 5px; padding:0px; color:#CCCCCC;} .con-functionboxList .con-box-group-01 .con-box:nth-child(2) .dec-ic-group .dec-ic-g03 { margin:27px 0px 0px 5px; padding:0px; color:#CCCCCC;} .con-functionboxList .con-box-group-01 .con-box:nth-child(2) .dec-ic-groupB { margin:0px; padding:0px; width:40px; height:45px; overflow:hidden;} .con-functionboxList .con-box-group-01 .con-box:nth-child(2) .dec-ic-groupB .dec-ic-g01 { margin:6px 0px 0px 3px; margin:27px 0px 0px 3px; padding:0px; color:#CCCCCC; font-size:22px;} .con-functionboxList .con-box-group-01 .con-box:nth-child(2) .dec-ic-groupB .dec-ic-g02 { margin:0px 0px 0px 5px; padding:0px; color:#CCCCCC;} .con-functionboxList .con-box-group-01 .con-box:nth-child(2) .dec-ic-groupB .dec-ic-g03 { margin:15px 0px 0px 5px; padding:0px; color:#CCCCCC;} .con-functionboxList .con-box-group-01 .con-box:nth-child(3) { margin:0px; padding:5px 0px; width:calc(100% - 140px); border-bottom:1px solid #dddbd7; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .con-functionboxList .con-box-group-01 .con-box .con-box-item { margin:0px; padding:0px 0px 0px 5px;} .con-functionboxList .con-box-group-01 .con-box .con-box-item:nth-child(1) { width:150px;} .con-functionboxList .con-box-group-01 .con-box .con-box-item:nth-child(2) { width:70px; text-align:right;} .con-functionboxList .con-box-group-01 .con-box .con-box-item:nth-child(3) { width:calc(100% - 600px);} .con-functionboxList .con-box-group-01 .con-box .con-box-item:nth-child(4) { width:50px;} .con-functionboxList .con-box-group-01 .con-box .con-box-item:nth-child(5) { width:100px; text-align:right;} .con-functionboxList .con-box-group-01 .con-box .con-box-item:nth-child(6) { width:80px; text-align:right;} .con-functionboxList .con-box-group-01 .con-box .con-box-item:nth-child(7) { width:100px;} .con-functionboxList .con-box-group-01 .con-box .con-box-item:nth-child(8) { width:50px;} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleColdChain .con-functionboxList .con-box-group-02*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleColdChain .con-functionboxList .con-box-group-02 { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .con-functionboxList .con-box-group-02 .con-box { height:44px; overflow:hidden;} .con-functionboxList .con-box-group-02 .con-box:nth-child(1) { margin:0px; padding:5px 0px; width:100px;} .con-functionboxList .con-box-group-02 .con-box:nth-child(2) { margin:0px; padding:0px 10px; width:40px; height:45px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: end !important; align-items: flex-end !important;} .con-functionboxList .con-box-group-02 .con-box:nth-child(2) .dec-ic-group { margin:0px; padding:0px; width:40px; height:45px; overflow:hidden;} .con-functionboxList .con-box-group-02 .con-box:nth-child(2) .dec-ic-group .dec-ic-g01 { margin:0px 0px 0px 5px; padding:0px; color:#CCCCCC;} .con-functionboxList .con-box-group-02 .con-box:nth-child(2) .dec-ic-group .dec-ic-g02 { margin:15px 0px 0px 5px; padding:0px; color:#CCCCCC;} .con-functionboxList .con-box-group-02 .con-box:nth-child(2) .dec-ic-group .dec-ic-g03 { margin:27px 0px 0px 5px; padding:0px; color:#CCCCCC;} .con-functionboxList .con-box-group-02 .con-box:nth-child(3) { margin:0px; padding:5px 0px; width:calc(100% - 140px); border-bottom:1px solid #dddbd7; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .con-functionboxList .con-box-group-02 .con-box:nth-child(3).dec-01 { background:#e1f1f4;} .con-functionboxList .con-box-group-02 .con-box .con-box-item { margin:0px; padding:0px 0px 0px 5px;} .con-functionboxList .con-box-group-02 .con-box .con-box-item:nth-child(1) { width:150px;} .con-functionboxList .con-box-group-02 .con-box .con-box-item:nth-child(2) { width:calc(50% - 280px); text-align:right;} .con-functionboxList .con-box-group-02 .con-box .con-box-item:nth-child(3) { width:30px; text-align: center;} .con-functionboxList .con-box-group-02 .con-box .con-box-item:nth-child(4) { width:calc(50% - 280px);} .con-functionboxList .con-box-group-02 .con-box .con-box-item:nth-child(5) { width:50px;} .con-functionboxList .con-box-group-02 .con-box .con-box-item:nth-child(6) { width:100px; text-align:right;} .con-functionboxList .con-box-group-02 .con-box .con-box-item:nth-child(7) { width:80px; text-align:right;} .con-functionboxList .con-box-group-02 .con-box .con-box-item:nth-child(8) { width:100px;} .con-functionboxList .con-box-group-02 .con-box .con-box-item:nth-child(9) { width:50px;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-functionbox.dec-AlarmRuleColdChain .con-functionboxList .con-box-group-02*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-a01 { margin:0px; padding:0px; width:calc(30% - 10px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-a02 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-a03 { margin:0px; padding:0px; width:calc(50% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-a01A { margin:0px; padding:0px; width:110px; height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-a02A { margin:0px; padding:0px; width:calc(50% - 125px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-a03A { margin:0px; padding:0px; width:70px; height:calc(100% - 0px); margin-left:10px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-a04A { margin:0px; padding:0px; width:calc(25% - 90px); height: calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-a05A { margin:0px; padding:0px; width:55px; height:calc(100% - 0px); margin-left:10px; text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-a06A { margin:0px; padding:0px; width:calc(25% - 75px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-b01 { margin:0px; padding:0px; width:calc(25% - 10px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-b02 { margin:0px; padding:0px; width:calc(25% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-b03 { margin:0px; padding:0px; width:calc(25% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-b04 { margin:0px; padding:0px; width:calc(25% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-c01 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-c02 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-c03 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-c04 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-c05 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-d01 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-d02 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-d03 { margin:0px; padding:0px; width:calc(60% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-d01A { margin:0px; padding:0px; width:calc(10% - 10px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-d01B { margin:0px; padding:0px; width:calc(10% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-d02A { margin:0px; padding:0px; width:calc(10% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-d02B { margin:0px; padding:0px; width:calc(10% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-d01C { margin:0px; padding:0px; width:calc(20% - 6px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-d02C { margin:0px; padding:0px; width:calc(40% - 7px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-d03C { margin:0px; padding:0px; width:calc(40% - 7px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-e01 { margin-bottom:5px; padding:0px; width:calc(25% - 20px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-e02 { margin-bottom:5px; padding:0px; width:calc(25% - 20px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-e03 { margin-bottom:5px; padding:0px; width:calc(25% - 20px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-e04 { margin-bottom:5px; padding:0px; width:calc(25% - 20px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-e05 { margin-bottom:5px; padding:0px; width:40px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-f01 { margin:0px; padding:0px; width:calc(70% - 40px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-f02 { margin:0px; padding:0px; width:calc(30% - 40px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-f03 { margin:0px; padding:0px; width:60px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-f01-reverse { margin:0px; padding:0px; width:calc(30% - 10px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-f02-reverse { margin:0px; padding:0px; width:calc(70% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-g01 { margin:0px; padding:0px; width:calc(30% - 10px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-g02 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-g03 { margin:0px; padding:0px; width:calc(30% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-g04 { margin:0px; padding:0px; width:calc(20% - 10px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-h01 { margin:0px; padding:0px; width:calc(60% - 5px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-h02 { margin:0px; padding:0px; width:calc(40% - 5px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-i01 { margin:0px; padding:0px; width:calc(50% - 50px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-i02 { margin:0px; padding:0px; width:calc(50% - 7px); height:calc(100% - 0px); display:inline-block;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-i03 { margin:0px; padding:0px; width:calc(50% - 8px); height:calc(100% - 0px); margin-left:10px; display:inline-block;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-i04 { margin:0px; padding:0px; width:calc(50% - 30px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-i05 { margin:0px; padding:0px; width:60px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-j01 { margin:0px; padding:0px; width:140px; height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-j02 { margin:0px; padding:0px; width:calc(100% - 180px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-j02 .dec-type { color:#b4b4b4; line-height:1.3rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-k01 { margin:0px; padding:0px; width:100px; height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-k02 { margin:0px; padding:0px; width:110px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-k03 { margin:0px; padding:0px; width:120px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-k04 { margin:0px; padding:0px; width:60px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-k05 { margin:0px; padding:0px; width:calc(100% - 430px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-k05 .dec-type { color:#b4b4b4; line-height:1.3rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-l01 { margin:0px; padding:0px; width:auto; height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-l02 { margin:0px; padding:0px; width:auto; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-l02 .dec-type { color: #b4b4b4; line-height: 1.3rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-l03 { margin:0px; padding:0px; width:140px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-m01 { width:auto; margin:0px; padding:0px; height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-m02 { width:auto; margin:0px; padding:0px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-m02 .dec-type { color: #b4b4b4; line-height: 1.3rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-m03 { width: calc(50% - 220px); margin:0px; padding:0px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-n01 { margin:0px; padding:0px; width:calc(30% - 15px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-n02 { margin:0px; padding:0px; width:calc(20% - 15px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-n03 { margin:0px; padding:5px 0px; width:20px; height:calc(100% - 0px); margin-left:10px; text-align:center;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-n04 { margin:0px; padding:0px; width:calc(30% - 15px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-n05 { margin:0px; padding:0px; width:calc(20% - 15px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-p01 { margin:0px; padding:0px; width:110px; height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-p02 { margin:0px; padding:0px; width:calc(25% - 65px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-con-p03 { margin:0px; padding:0px; width:calc(25% - 70px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-half-oneThird { width:calc(18% - 5px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-half-oneThird:nth-child(2), .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-width-half-oneThird:nth-child(3) { margin-left:10px; width:calc(16% - 10px);} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-conBox { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-conBox.dec-m01 { margin-top:5px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain.dec-m01 { margin-top:5px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain.dec-m02 { margin-top:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-n00 { width:85px; margin:0px; padding:0px; height:calc(100% - 0px); text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-n01 { width:170px; margin:0px; padding:0px; height:calc(100% - 0px); text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-n01.dec-01 { text-align:left; padding-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-n02 { width:calc(50% - 275px); margin:0px; padding:0px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-n03 { width:30px; margin:0px; padding:0px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-a00 { width:85px; margin:0px; padding:0px; height:calc(100% - 0px); text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-a01 { width:100px; margin:0px; padding:0px; height:calc(100% - 0px); text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-a02 { width:calc(50% - 205px); margin:0px; padding:0px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-a03 { width:30px; margin: 0px; padding:0px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-a04 { width:calc(50% - 50px); margin:0px; padding:0px; height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-a04 .dec-type { color:#b4b4b4; line-height:1.3rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-o01 { margin:0px; padding:0px; width:85px; height:calc(100% - 0px); text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain .con-width-con-o02 { margin:0px; padding:0px; width:calc(50% - 105px); height:calc(100% - 0px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain.dec-mt01 { margin-top:5px;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-innerBox.dec-AlarmRuleColdChain*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .AlarmRuleColdChain_01, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .AlarmRuleColdChain_02, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .AlarmRuleColdChain_03, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .AlarmRuleColdChain_04 { width:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access { width:calc(100% - 0px); height:auto; margin:0px; padding:0px; word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half { width:calc(50% - 5px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half:first-child { margin-right:5px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half:last-child { margin-left:5px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version { margin-top:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half { width:calc(50% - 10px); margin:0px; padding:10px; border-radius:5px; background:#fafafa; border:1px solid #e1e1e1; position:relative;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-type { padding:5px 0px; width:auto;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .box-btnArea.dec-Version { width:260px; margin:0px; margin-left:auto;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half:first-child { width:calc(50% - 10px); margin-right:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half:last-child { width:calc(50% - 10px); margin-left:10px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem { width:calc(100% - 0px); margin:0px; padding:5px 0px; color:#595959; border-radius:0px; border-top:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem:hover { background:#f0f0f0;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem:first-child { margin:0px; border-top:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem:first-child:hover { background:transparent; border-top:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem.dec-subTitle {} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem.dec-subTitle:hover { background:transparent;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem.dec-sub { width:calc(100% - 100px); margin:0px 0px 0px 100px; padding:5px 0px 0px 0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem.dec-padding-top { padding-top:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem.dec-padding-bottom { padding-bottom:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem.dec-sub.dec-border { border:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem.dec-sub .box-listItem-title { width:100px; text-align:left; padding-left:5px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem.dec-sub .box-listItem-con { width:calc(100% - 105px); margin:0px;} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-account .con-width-half*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-account .con-width-half { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-account .con-width-half .box-listItem { width:calc(100% - 0px); margin:0px; padding:5px 10px; color:#595959; border-radius:0px; border:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-account .con-width-half .box-listItem:hover { background:#f0f0f0;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-account .con-width-half .box-listItem:first-child { margin:0px; border-bottom:1px solid #e1e1e1;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-account .con-width-half .box-listItem:first-child:hover { background:transparent;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-account .con-width-half .box-listItem .box-listItem-con { width:calc(100% - 0px); margin:0px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-account .con-width-half .box-listItem .box-listItem-con .form-check-label { margin:2px 0px 3px 0px; line-height:1.6rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-account .con-width-half .box-listItem .box-listItem-con .form-check.form-check-inline:first-child { margin-right:2rem;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-account .con-width-half*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup*/ /*.con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background: pink; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup .box-listItem { width:calc(100% - 0px); width:110px; margin:0px; padding:5px 10px; color:#595959; border-radius:0px; border:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup .box-listItem:hover { background:#f0f0f0;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup .box-listItem:first-child { margin:0px; border-bottom:1px solid #e1e1e1; width:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup .box-listItem:first-child:hover { background:transparent;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup .box-listItem .box-listItem-con { width:calc(100% - 0px); margin:0px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup .box-listItem .box-listItem-con .form-check-label { margin:2px 0px 3px 0px; line-height:1.3rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup .box-listItem .box-listItem-con .form-check.form-check-inline:first-child { margin-right:0rem;}*/ /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup-01*/ /*.con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup-01 { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:orange; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup-01 .box-listItem { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; color:#595959; border-radius:0px; border:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup-01 .box-listItem:first-child { margin:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup-01 .box-listItem .box-listItem-con { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup-01 .box-listItem .box-listItem-con .dec-con-01 { width:50px; margin:0px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup-01 .box-listItem .box-listItem-con .dec-con-02 { width:calc(100% - 105px); margin:0px 5px 0px 0px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup-01 .box-listItem .box-listItem-con .dec-con-03 { width:50px; margin:0px; padding:0px;}*/ /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-listGroup-01*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half .box-listItem .box-listItem-con .form-check.form-check-inline:first-child { width:calc(100% - 0px); margin-right:2rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half .box-listItem.dec-sub .box-listItem-title { width:0px; padding-left:5px; text-align:left;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half .box-listItem.dec-sub .box-listItem-con { width:calc(100% - 5px); margin:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half .box-listItem.dec-sub .box-listItem-con .form-check-inline .form-check-input {} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half .box-listItem .box-listItem-con .form-check-label { width:calc(100% - 52px); line-height:1.6rem; margin:2px 0px 3px 0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half .box-listItem.dec-selectAll .box-listItem-con .form-check.form-check-inline:first-child { width:calc(100% - 0px); margin-right:2rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half .box-listItem.dec-sub.dec-selectAll .box-listItem-con .form-check-inline .form-check-input { margin-left:auto;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version .con-width-half .box-listItem.dec-selectAll .box-listItem-con .form-check-label { width:35px; margin:2px 0px 3px 0px; line-height:1.6rem;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access.dec-Version*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem .box-listItem-title { width:100px; margin:2px 0px 3px 0px; padding:0px; text-align:right; font-weight:500;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem .box-listItem-con { width:calc(100% - 205px); margin:0px 0px 0px 100px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem .box-listItem-con .form-check-label { margin:2px 0px 3px 0px; line-height:1.6rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-Access .con-width-half .box-listItem .box-listItem-con .form-check.form-check-inline:first-child { margin-right:2rem;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit { margin-bottom:10px;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit:first-child { margin-bottom:0px;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit:first-child .con-width-half:last-child { margin-bottom:0px; margin-left:0px;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit .con-width-half { width:calc(50% - 23px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit .con-width-half.dec-btnArea { width:36px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit .con-width-half.dec-btnArea .dec-btn.dec-delete, .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit .con-width-half.dec-btnArea .dec-btn.dec-delete:hover { width:34px; margin:0px; padding:5px; border-radius:5px; text-decoration:none; border:1px solid #ced4da; overflow-y:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit .con-width-half.dec-btnArea .dec-btn.dec-delete { background:#f5f5f5; color:#999999;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit .con-width-half.dec-btnArea .dec-btn.dec-delete:hover { background:#fafafa; color:#595959;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit .con-width-half:first-child { margin-right:5px;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit .con-width-half:last-child { margin-left:5px;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox.dec-CarLicenseEdit .con-width-half.con-type { padding:15px 0px 5px 0px;} .con-container .box-con-a03 .box-conArea .con-box.dec-half .con-conBox .box-btnArea .con-btnbox .dec-btn { margin:0px;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox -----------------------------------------------------------*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics:first-child { margin-bottom:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics:first-child .dec-box:last-child { margin-bottom:0px; margin-left:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics .dec-conArea { width:calc(100% - 40px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics .dec-btnArea { width:36px; margin:0px 0px 0px 4px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics .dec-btnArea .dec-btn.dec-delete, .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics .dec-btnArea .dec-btn.dec-delete:hover { width:34px; margin:0px; padding:5px; border-radius:5px; text-decoration:none; border:1px solid #ced4da; overflow-y: hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics .dec-btnArea .dec-btn.dec-delete { background:#f5f5f5; color:#999999;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics .dec-btnArea .dec-btn.dec-delete:hover { background:#fafafa; color:#595959;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-btn.dec-n01 { width:auto; margin:10px 0px 0px 0px;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox.dec-missionMLogistics*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea -----------------------------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea { margin:0px; padding:0px; width:calc(100% - 0px); word-break:break-all; border-bottom:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea:hover {} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea:first-child { margin-top:15px; border-bottom:1px solid #a3a3a3;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea.dec-fontWeight { font-weight:700;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea .con-listItem-01, .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea .con-listItem-02 { margin:0px 5px 0px 0px; padding:5px;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea .con-listItem-01 { width:calc(50% - 55px); margin-right:auto;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea .con-listItem-02 { width:calc(50% - 0px); text-align:right;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea .con-listItem-btn { width:45px; text-align:center; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea a.dec-btn.dec-delete, .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea a.dec-btn.dec-delete:hover { margin:2px 0px; padding:5px 10px; border-radius:5px; text-decoration:none; background:transparent;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea a.dec-btn.dec-delete { color:#b7b7b7;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea a.dec-btn.dec-delete:hover { color:#666666;} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .box-btnArea { margin:0px 75% 0px 0px; padding:0px; width:calc(25% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .box-btnArea.dec-w01 { margin:25px 25% 0px 25%; padding:0px; width:calc(50% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .box-listItem-con-01 { width:calc(100% - 0px); margin:0px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .box-listItem-con-01 .form-check-label { line-height:1.6rem; margin:2px 0px 3px 0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .box-listItem-con-01 .form-check-inline { padding-right:1.5rem;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .box-listItem-con-01.dec-01 { padding-left:10px;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-box-outer .con-listArea -----------------------------------------------------------*/ /*end - .con-container .box-con-a03 ------------------------------------------------------------------------------------------------*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed ------------------------------------------------------------------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed_01, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed_02, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed_03, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed_04, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed_05, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleTire_01, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleTire_02, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleTire_03, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleTire_04, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_01, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_02, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_03, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_04, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_01, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_02, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_03, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_04, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_05, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_06, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_07, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_08, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_09, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_10, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_11, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_12, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_13, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_14, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_15, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_16, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_17, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_18, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_19, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_20, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_21, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_22, .con-container .box-con-a03 .box-conArea .con-box .StandardRoad_Box_01, .con-container .box-con-a03 .box-conArea .con-box .StandardRoad_Box_02, .con-container .box-con-a03 .box-conArea .con-box .StandardRoadCustom_Box_01, .con-container .box-con-a03 .box-conArea .con-box .StandardRoadCustom_Box_02 { width:calc(100% - 0px); margin:0px; padding:0px; color:#595959;} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed_01 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed_02 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed_03 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed_04 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed_05 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleTire_01 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleTire_02 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleTire_03 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleTire_04 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_01 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_02 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_03 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_04 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_01, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_02, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_03, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_04, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_05, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_06, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_07, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_08, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_09, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_10, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_11, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_12, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_13, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_14, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_15, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_16, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_17, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_18, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_19, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_20, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_21, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleCar_sortDAF_22 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleParkingLot_01 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleParkingLot_02 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleParkingLot_03 {} .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleExpirationDate_01, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleExpirationDate_02, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleExpirationDate_03, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleExpirationDate_04, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleExpirationDate_05, .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleExpirationDate_06 { width:calc(100% - 0px); margin:0px; padding:0px; color:#595959;} .con-container .box-con-a03 .box-conArea .con-box .dec-note-info { margin:0px 5px 0px 15px; padding:0px; color:#72bf44; font-size:1rem; line-height:1.3rem; display:inline-block;} .con-container .box-con-a03 .box-conArea .con-box .StandardRoad_Box_01 {} .con-container .box-con-a03 .box-conArea .con-box .StandardRoad_Box_02 {} .con-container .box-con-a03 .box-conArea .con-box .StandardRoadCustom_Box_01 {} .con-container .box-con-a03 .box-conArea .con-box .StandardRoadCustom_Box_02 {} /*end - .con-container .box-con-a03 .box-conArea .con-box .AlarmRuleSpeed ------------------------------------------------------------------------------------------------*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list -----------------------------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list { margin:0px; padding:0px; width:calc(100% - 0px); border-top:1px solid #e1e1e1; word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list:first-child { border:0px; font-weight:500;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list:first-child:hover { background:transparent;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list:hover { background:#fcfbe0;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list .box-01, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list .box-02, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list .box-03, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list .box-04 { margin:0px; padding:5px 0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list .box-01 { width:calc(33% - 30px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list .box-02 { width:calc(33% - 30px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list .box-03 { width:calc(34% - 30px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list .box-04 { width:90px;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .dec-box-list -----------------------------------------------------------*/ /*start - .dec-row-statistics ---------------------------------------------------------------------------------------------------------------------------------------------------------------*/ .con-container.dec-statistics { height:calc(100% - 40px); overflow:hidden; width:calc(100% + 30px); margin:0px -15px;} .dec-row-statistics { width:calc(100% - 0px); height:calc(100% - 55px); margin:0px; padding:0px; overflow:hidden; color:#595959; background:#FFFFFF; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: start !important; align-self: flex-start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .dec-row-statistics .dec-conBox { width:calc(100% - 240px); height:calc(100% - 0px); margin:0px 0px 0px 10px; padding:0px 10px 0px 5px; border-left:1px solid #E6E6E6;} .dec-row-statistics .dec-conBox .dec-conBoxInner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDashCam .box-conArea.dec-height { height:calc(100% - 80px); overflow:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedChart .box-conArea.dec-height { height:calc(100% - 100px); overflow:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsParkingLot .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFormRecord .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDangerousDriving .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDangerousDriving .box-conArea.dec-height .con-swiperSlide-area { margin-bottom:20px;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCar .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCarSensor .box-conArea.dec-height { height:calc(100% - 95px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDriver .box-conArea.dec-height { height:calc(100% - 95px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsWineTest .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormal .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormalStay .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingN .box-conArea.dec-height { height:calc(100% - 130px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContinuedSpeeding .box-conArea.dec-height { height:calc(100% - 130px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingInFence .box-conArea.dec-height { height:calc(100% - 90px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFenceInOut .box-conArea.dec-height { height:calc(100% - 130px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsOvertimeDriving .box-conArea.dec-height { height:calc(100% - 90px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsRestrictedRoad .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsOffsetRoute .box-conArea.dec-height { height:calc(100% - 140px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsTBD .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDEF .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFuel .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAlarmRecord .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsImmobilizer .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSOS .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsBarcode .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsLateRatio .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDetachRatio .box-conArea.dec-height { height:calc(100% - 100px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsColdChain .box-conArea.dec-height { height:calc(100% - 100px); overflow:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDailyReport .box-conArea.dec-height { height:calc(100% - 100px); overflow:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFuelConsumption .box-conArea.dec-height { height:calc(100% - 100px); overflow:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsLoadFactor .box-conArea.dec-height { height:calc(100% - 100px); overflow:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsLoadFactor .box-conArea.dec-height .tab-content.dec-con-03.dec-overflow-h { height:calc(100% - 40px);} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDrivingBehavior .box-conArea.dec-height { height:calc(100% - 100px); overflow:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingN .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContinuedSpeeding .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingInFence .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFenceInOut .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContainerVolume .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSingleStationRushHour .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsRouteRushHour .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCar .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDailyReport .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFuelConsumption .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCarSensor .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDriver .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsWineTest .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormalStay .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsOvertimeDriving .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsRestrictedRoad .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsVehicleCheckList .box-conArea.dec-height .tab-content.dec-con-03, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsLoadingAndUnloadingRecord .box-conArea.dec-height .tab-content.dec-con-03 { height:calc(100% - 45px);} .tab-content.dec-con-03.dec-overflow-h {} .tab-content.dec-con-03.dec-overflow-h .dec-tab-pane-02 {} .tab-content.dec-con-03.dec-overflow-h.dec-statisticsCarSensorTableCAN {} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01.div-NavSortBox-statisticsCarSensor-Table-CAN { height:calc(100% - 0px);} .dec-row-statistics .dec-conBox .dec-conBoxInner p { font-family:'Noto Sans TC', sans-serif; font-size:14px; font-weight:400; line-height:1.5rem;} /*(XXX_2021/08/12 移除該功能 prototype v1.15)*/ /*.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAlarm .box-conArea.dec-height { height: calc(100% - 100px); overflow-x: hidden; overflow-y: auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeeding .box-conArea.dec-height { height: calc(100% - 130px); overflow-x: hidden; overflow-y: auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFenceAlarm .box-conArea.dec-height { height: calc(100% - 130px); overflow-x: hidden; overflow-y: auto;}*/ .dec-row-statistics #sidebar { min-width:230px; max-width:230px; background:#787878;} .dec-row-statistics #sidebar ul { } .dec-row-statistics #sidebar ul li {} .dec-row-statistics #sidebar ul.list-unstyled.collapse.show { background:#595959;} .dec-row-statistics #sidebar a, .dec-row-statistics #sidebar a:hover { border-left:0px; border-right:0px;} .dec-row-statistics #sidebar a { text-decoration:none; background-color:transparent; color:#FFFFFF; border-bottom:1px solid #484848; margin-top:0px;} .dec-row-statistics #sidebar a:hover { background:#484848; color:#5dc1cf;} .dec-row-statistics #sidebar a .dec-note, .dec-row-statistics #sidebar a:hover .dec-note { font-size:12px; margin:0px; padding:0px 0px 0px 2px;} .dec-row-statistics a.dec-box-01 { margin-top:0px;} .dec-row-statistics a:first-child { margin-top:0px;} .dec-row-statistics a:first-child:hover { margin-top:0px;} .dec-row-statistics a:hover { text-decoration:underline; color:#5dc1cf; border-bottom:1px solid #595959; background:rgba(0,0,0,0.7);} .dec-row-statistics a:not([href]):not([class]) { color:inherit; text-decoration:none;} .dec-row-statistics a:not([href]):not([class]):hover { color:inherit; text-decoration:none;} .dec-row-statistics a.dec-a01 { background-color:transparent; color:#595959; margin-top:0px; margin-right:5px; padding:5px 0px 2px 0px; border-color:#787878; border-style:solid; border-width:0px 0px 1px 0px; text-decoration:underline;} .dec-row-statistics a.dec-a01:hover { color:#169cbf; border-color:#169cbf;} .dec-row-statistics a.dec-a01:not([href]):not([class]) { color:inherit; text-decoration:none;} .dec-row-statistics a.dec-a01:not([href]):not([class]):hover { color:inherit; text-decoration:none;} /*.dec-row-statistics #sidebar ul li.active>a, .dec-row-statistics #sidebar ul li.active>a:hover { color:#5dc1cf; color:#FFFFFF;} .dec-row-statistics #sidebar ul li .dropdown-toggle::after { color:#5dc1cf; color:#FFFFFF;} .dec-row-statistics #sidebar ul li a::before { content:" \2022";} .dec-row-statistics #sidebar ul li.active > ul li a.is-active { color:#5dc1cf; color:#FFFFFF;}*/ .dec-row-statistics .dec-table td a, .dec-row-statistics .dec-table td a:hover { margin:0px!important; color:#169cbf; border:0px; display:inline-block; text-decoration:underline!important;} .dec-row-statistics .dec-table td a.dec-btn-01, .dec-row-statistics .dec-table td a.dec-btn-01:hover { color:#595959; display:inline-block; text-decoration:none !important; background:transparent; padding:3px 5px !important; border-radius:5px; margin:0px;} .dec-row-statistics .dec-table td a.dec-btn-01:hover { color:#169cbf; border:1px solid #d2d2d2 !important; background:#fafafa;} .dec-row-statistics .dec-table td a.dec-btn-02, .dec-row-statistics .dec-table td a.dec-btn-02:hover { color:#595959; border:1px solid transparent; display:inline-block; text-decoration:none !important; background:transparent; padding:3px 2px !important; border-radius:2px; margin:0px;} .dec-row-statistics .dec-table td a.dec-btn-02:hover { color:#169cbf; border:1px solid #5dc1cf; background:#fafafa;} .dec-row-statistics .dec-table td a.dec-btn-02 .dec-img, .dec-row-statistics .dec-table td a.dec-btn-02:hover .dec-img { margin:0px; padding:0px; width:calc(100% - 0px);} .dec-row-statistics .dec-table td.dec-verticalAlignM { vertical-align:middle;} /*.dec-row-statistics .dec-table th.dec-border-01,*/ .dec-row-statistics .dec-table td.dec-border-01 { border-left:1px solid #dee2e6;} .dec-row-statistics .dec-table th.dec-border-02, .dec-row-statistics .dec-table td.dec-border-02 { border-right:1px solid #dee2e6;} .dec-row-statistics .dec-table th.dec-border-03, .dec-row-statistics .dec-table td.dec-border-03 { border-left:1px solid #dee2e6; border-right:1px solid #dee2e6;} .dec-row-statistics th a, .dec-row-statistics th a:hover { border:0px;} .dec-row-statistics .nav-pills .nav-link.active, .dec-row-statistics .nav-pills .show > .nav-link { color:#FFFFFF; background:#169cbf;} .nav-pills.dec-con-03 .nav-link .dec-ic { color:#999999; margin:0px 0px 0px 5px; padding:0px;} .nav-pills.dec-con-03 .nav-link.active .dec-ic { color:#FFFFFF; margin:0px 0px 0px 5px; padding:0px;} .dec-row-statistics .box-topArea { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:5px; overflow:hidden; background:transparent; border-radius:5px;} .dec-row-statistics .box-conArea { width:calc(100% - 0px); height:calc(100% - 95px); margin:0px; padding:5px; overflow:hidden; position:relative;} .dec-row-statistics .box-topArea.dec-scm-01 { height:calc(100% - 20px); margin:0px; padding:0px 0px 0px 5px; overflow:hidden; overflow-y:auto;} .dec-row-statistics .box-topArea .con-group-title { width:calc(100% - 0px); margin:0px; padding:25px 0px 5px 0px; font-size:1.2rem; font-weight:500; color:#595959;} .dec-row-statistics .box-topArea .con-group-title .dec-sampleNote { margin:0px 5px 0px 0px; padding:0px; font-size:12px; color:#999999;} .dec-row-statistics .box-topArea .con-group { width:calc(100% - 0px); margin:0px; padding:0px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-name { margin-right:5px; padding:0px; width:calc(12% - 0px); width:auto; text-align:right; padding-left:10px; -ms-flex-item-align: center !important; align-self: center !important;} .dec-row-statistics .dec-conBoxInner.div-NavSortBox-statisticsSpeeding .box-conArea { width:calc(100% - 0px); height:calc(100% - 130px); margin:0px; padding:5px; overflow:hidden; position:relative;} .dec-row-statistics .box-conArea .dec-conArea-note { width:calc(100% - 0px); margin:15px 0px; padding:0px; text-align:center; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .dec-row-statistics .box-conArea .dec-conArea-note .dec-type { color:#BDBDBD; font-size:1.2rem; line-height:2rem; margin:0px 5px; padding:0px;} .dec-row-statistics .box-conArea .dec-conArea-note .dec-ic { color:#CCCCCC; font-size:2rem; margin:0px; padding:0px;} .dec-row-statistics .box-conArea a.dec-btn-chart, .dec-row-statistics .box-conArea a.dec-btn-chart:hover { position:absolute; margin:0px; padding:5px; font-size:1rem; line-height:1.5rem; color:#595959; background:#FFFFFF; z-index:3; bottom:5px; right:5px; text-decoration:none; border:1px solid #CCCCCC; border-radius: 5px;} .dec-row-statistics .box-conArea a.dec-btn-chart:hover { color:#29aecc;} .dec-row-statistics .box-conArea a.dec-btn-chart .dec-ic { margin:0px 3px 0px 0px; padding:0px;} .dec-row-statistics .box-conArea .dec-conArea-tableInfo { width:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .box-conArea .dec-conArea-tableInfo.dec-overflow { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:hidden;} .dec-row-statistics .box-conArea .dec-conArea-tableInfo.dec-overflow.dec-maxWidth-01 { max-width:1175px; max-width:calc(100% - 0px);} .dec-row-statistics .box-conArea .dec-conArea-tableInfo .dec-conArea-Result.dec-result-01 { width:calc(100% - 0px); height:70px; margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-line-pack: justify !important; align-content: space-between !important;} .dec-row-statistics .box-conArea .dec-conArea-tableInfo .dec-conArea-Result .dec-btnArea { width:35px; height:calc(100% - 0px); margin:0px; padding:0px; text-align:center; vertical-align:top; display:inline-block; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .dec-row-statistics .box-conArea .dec-conArea-tableInfo .dec-conArea-Result .dec-btnArea a.dec-btn { width:30px; height:30px; margin:0px; padding:5px; border:1px solid #e6e6e6; border-radius:25px; overflow:hidden; vertical-align: middle;} .dec-row-statistics .box-conArea .dec-conArea-tableInfo .dec-conArea-Result .dec-btnArea a.dec-btn .dec-ic { margin:2px 0px 0px 0px; padding:0px;} .dec-row-statistics .box-conArea .dec-conArea-tableInfo .dec-conArea-Result .dec-tableArea { width:calc(100% - 40px); margin:0px; padding:0px; vertical-align:top; display:inline-block;} .dec-row-statistics .box-conArea .dec-conArea-tableInfo .dec-conArea-Result.dec-result-02 { width:calc(100% - 0px); height: calc(100% - 75px); margin:5px 0px 0px 0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .box-conArea .dec-conArea-tableInfo .dec-conArea-Result.dec-result-01 .dec-tableArea table tbody tr td { color:#f7931e;} .dec-row-statistics .box-conArea .dec-conArea-itemInfo { width:calc(100% - 10px); height:calc(65% - 5px); margin:5px; padding:0px; overflow:hidden; position:absolute; z-index:999; bottom:0px; right:0px; border:1px solid #e6e6e6; border-radius:5px; background:#FFFFFF; transition:box-shadow .45s; box-shadow:0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);} .dec-row-statistics .box-topArea .con-conBox { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .dec-row-statistics .box-topArea .con-conBox:first-child { margin-top:0px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-a01, .dec-row-statistics .box-topArea .con-conBox .dec-box-a02, .dec-row-statistics .box-topArea .con-conBox .dec-box-a03, .dec-row-statistics .box-topArea .con-conBox .dec-box-b01, .dec-row-statistics .box-topArea .con-conBox .dec-box-b02, .dec-row-statistics .box-topArea .con-conBox .dec-box-b03, .dec-row-statistics .box-topArea .con-conBox .dec-box-b04, .dec-row-statistics .box-topArea .con-conBox .dec-box-break, .dec-row-statistics .box-topArea .con-conBox .dec-box-note { -ms-flex-item-align: center !important; align-self: center !important;} .dec-row-statistics .box-topArea .con-conBox .dec-box-a01 { margin-right:5px; padding:0px; width:calc(12% - 0px);} .dec-row-statistics .box-topArea .con-conBox .dec-box-a02 { margin-right:5px; padding:0px; width:calc(12% - 0px);} .dec-row-statistics .box-topArea .con-conBox .dec-box-a02.dec-w-01 { width:150px; margin-left:5px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-a03 { margin-right:5px; padding:0px; width:calc(12% - 0px);} .dec-row-statistics .box-topArea .con-conBox .dec-box-b01 { width:auto; margin-right:5px; padding:0px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-b02 { width:auto; margin-right:5px; padding:0px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-b02 .dec-note { color:#72bf44; font-weight:normal; margin-left:5px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-b02 .dec-type-num { color:#f7931e; margin:0px 2px 0px 0px; padding:0px; display:inline-block;} .dec-row-statistics .box-topArea .con-conBox .dec-box-b03 { padding:0px; margin-left:auto; margin-right:5px; width:auto;} .dec-row-statistics .box-topArea .con-conBox .dec-box-b03 .dec-type { color:#f7931e; margin:0px 2px 0px 0px; padding:0px; display:inline-block;} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo { width:auto; margin-right:25px; padding:0px; margin-left:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-align: center !important; align-items: center !important;} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo { width:10px; height:16px; margin:3px 3px 0px 0px; padding:0px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-c01 { background:#ff0000; background:rgba(255, 0, 0, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-c02 { background:#f7931e; background:rgba(247, 147, 30, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-c03 { background:#787878; background:rgba(120, 120, 120, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-c04 { background:#0089ff; background:rgba(0, 137, 255, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-coldChain-01 { background:#ff0000; background:rgba(255, 0, 0, 1);} /* [統計分析｜冷鏈圖表] 1.異常｜#ff0000｜(255, 0, 0)｜dec-coldChain-01 XX_2.警告｜#f7931e｜(247, 147, 30)｜dec-coldChain-02 XX_3.注意｜#f9bd00｜(249, 189, 0)｜dec-coldChain-03 XX_4.正常｜#578bff｜(87, 139, 255)｜dec-coldChain-04 */ /*[統計分析｜冷鏈圖表]：異常 dec-coldChain-01*/ .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-01 { background:#ff0000; background:rgba(255, 0, 0, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-02 { background:#f7931e; background:rgba(247, 147, 30, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-03 { background:#f4e200; background:rgba(244, 226, 0, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-04 { background:#578bff; background:rgba(87, 139, 255, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-05 { background:#787878; background:rgba(120, 120, 120, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-06 { background:#b3b3b3; background:rgba(179, 179, 179, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-07 { background:#39b54a; background:rgba(57, 181, 74, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-08 { background:#e8528d; background:rgba(232, 82, 147, 1);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-09 { background:#a050a0; background:rgba(160, 80, 160, 1);} /*[統計分析｜危險駕駛統計] 1.超速(次)｜#ff0000｜(255, 0, 0)｜dec-dangerousDriving-01 2.急加速(次)｜#f7931e｜(247, 147, 30)｜dec-dangerousDriving-02 3.急減速(次)｜#f4e200｜(244, 226, 0)｜dec-dangerousDriving-03 4.急轉彎(次)｜#578bff｜(87, 139, 255)｜dec-dangerousDriving-04 5.車道偏移｜#787878｜(120, 120, 120)｜dec-dangerousDriving-05 6.前車碰撞｜#b3b3b3｜(179, 179, 179)｜dec-dangerousDriving-06 7.行人碰撞｜#39b54a｜(57, 181, 74)｜dec-dangerousDriving-07 8.瞌睡｜#e8528d｜(232, 82, 147)｜dec-dangerousDriving-08 9.分心｜#a050a0｜(160, 80, 160)｜dec-dangerousDriving-09 [統計分析｜危險駕駛統計]：超速(次) dec-dangerousDriving-01、急加速(次) dec-dangerousDriving-02、急減速(次) dec-dangerousDriving-03、急轉彎(次) dec-dangerousDriving-04、車道偏移 dec-dangerousDriving-05、前車碰撞 dec-dangerousDriving-06、行人碰撞 dec-dangerousDriving-07、瞌睡 dec-dangerousDriving-08、分心 dec-dangerousDriving-09 */ /*狀態：超速｜dec-dangerousDriving-01, 急加速｜dec-dangerousDriving-02, 急減速｜dec-dangerousDriving-03, 急轉彎｜dec-dangerousDriving-04, 車道偏移｜dec-dangerousDriving-05, 前車碰撞｜dec-dangerousDriving-06, 行人碰撞｜dec-dangerousDriving-07, 瞌睡｜dec-dangerousDriving-08, 分心｜dec-dangerousDriving-09*/ /*start - [統計分析｜總吞吐量(月)] ----------------------------------------*/ .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-ContainerVolume-01 { background:#578bff; background:rgba(87, 139, 255);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-ContainerVolume-02 { background:#f7931e; background:rgba(247, 147, 30);} /*[統計分析｜總吞吐量(月)] 1.上車(人)｜#578bff｜(87, 139, 255)｜dec-ContainerVolume-01 2.下車(人)｜#f7931e｜(249, 189, 0)｜dec-ContainerVolume-02 [統計分析｜總吞吐量(月)]：上車(人) dec-color-ContainerVolume-01、下車(人) dec-color-ContainerVolume-02 */ /*end - [統計分析｜總吞吐量(月)] ----------------------------------------*/ /*start - [統計分析｜單站尖峰時段] ----------------------------------------*/ .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-SingleStationRushHour-01 { background:#578bff; background:rgba(87, 139, 255);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-SingleStationRushHour-02 { background:#f7931e; background:rgba(247, 147, 30);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-SingleStationRushHour-03 { background:#787878; background:rgba(120, 120, 120);} /*[統計分析｜單站尖峰時段] 1.P1 CUP上車(人)｜#578bff｜(87, 139, 255)｜dec-SingleStationRushHour-01 2.P1 CUP下車(人)｜#f7931e｜(249, 189, 0)｜dec-SingleStationRushHour-02 3.誤點時數(分)｜#787878｜(120, 120, 120)｜dec-SingleStationRushHour-02 [統計分析｜單站尖峰時段]：P1 CUP上車(人) dec-color-SingleStationRushHour-01、P1 CUP下車(人) dec-color-SingleStationRushHour-02、誤點時數(分) dec-color-SingleStationRushHour-03 */ /*end - [統計分析｜單站尖峰時段] ----------------------------------------*/ /*start - [統計分析｜路線尖峰時段] ----------------------------------------*/ .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-statisticsRouteRushHour-01 { background:#b3b3b3; background:rgba(179, 179, 179);} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .con-legendInfo.dec-statisticsRouteRushHour-02 { background:#f9bd00; background:rgba(249, 189, 0);} /*[統計分析｜路線尖峰時段] 1.上車(人)｜#b3b3b3｜(179, 179, 179)｜dec-statisticsRouteRushHour-01 2.下車(人)｜#f9bd00｜(249, 189, 0)｜dec-statisticsRouteRushHour-02 [統計分析｜路線尖峰時段]：上車(人) dec-color-statisticsRouteRushHour-01、下車(人) dec-color-statisticsRouteRushHour-02 */ /*end - [統計分析｜路線尖峰時段] ----------------------------------------*/ .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .dec-type { width:auto; margin:0px 10px 0px 0px; padding:0px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-legendInfo .dec-type .dec-note { color:#858585; margin:0px 0px 0px 2px; padding:0px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-b04 { margin-right:0px; padding:0px; margin-left:auto; margin-left:0px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-break { width:auto; margin-right:5px; padding:0px;} .dec-row-statistics .box-topArea .con-conBox .dec-box-note { width:auto; margin-right:5px; padding:0px; color:#adadad;} .dec-row-statistics .box-topArea .con-conBox .dec-box-note .dec-type { color:#72bf44; margin:0px 2px; padding:0px;} .dec-row-statistics .box-topArea .con-conBox .dec-btn.dec-other, .dec-row-statistics .box-topArea .con-conBox .dec-btn.dec-other:hover { margin:0px; padding:3px 10px; border-radius:25px; text-decoration:none; color:#595959; border:1px solid #CCCCCC;} .dec-row-statistics .box-topArea .con-conBox .dec-btn.dec-other { background:#FFFFFF;} .dec-row-statistics .box-topArea .con-conBox .dec-btn.dec-other:hover { background:#f5f5f5;} .dec-row-statistics .box-topArea .con-conBox .dec-btn.dec-add, .dec-row-statistics .box-topArea .con-conBox .dec-btn.dec-add:hover { margin:0px; padding:3px 10px; border-radius:25px; text-decoration:none; color:#FFFFFF; border:1px solid #0083BE;} .dec-row-statistics .box-topArea .con-conBox .dec-btn.dec-add { background:#169cbf;} .dec-row-statistics .box-topArea .con-conBox .dec-btn.dec-add:hover { background:#0083BE;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-add, .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-add:hover { margin:0px; padding:3px 10px; border-radius:25px; text-decoration:none; color:#FFFFFF; border:1px solid #0083BE;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-add { background:#169cbf;} .con-container .box-con-a03 .box-functionArea .box-buttonArea .dec-btn.dec-add:hover { background:#0083BE;} /*start - .dec-row-statistics .box-topArea .con-conBox .dec-sortArea*/ .dec-row-statistics .box-topArea .con-conBox .dec-sortArea { margin:0px 0px 0px 5px; padding:5px 0px 0px 0px; width:calc(100% - 110px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .dec-row-statistics .box-topArea .con-conBox .dec-sortArea a.dec-btn-sort, .dec-row-statistics .box-topArea .con-conBox .dec-sortArea a.dec-btn-sort:hover { margin:0px 5px 5px 0px; padding:3px 10px; border-radius:25px; text-decoration:none;} .dec-row-statistics .box-topArea .con-conBox .dec-sortArea a.dec-btn-sort { color:#787878; background:#FFFFFF; border:1px solid #f0f0f0;} .dec-row-statistics .box-topArea .con-conBox .dec-sortArea a.dec-btn-sort:hover { color:#787878; background:#ebebeb; border:1px solid #f0f0f0;} .dec-row-statistics .box-topArea .con-conBox .dec-sortArea a.dec-btn-sort.is-active, .dec-row-statistics .box-topArea .con-conBox .dec-sortArea a.dec-btn-sort.is-active:hover { margin:0px 5px 5px 0px; padding:3px 10px; border-radius:25px; text-decoration:none;} .dec-row-statistics .box-topArea .con-conBox .dec-sortArea a.dec-btn-sort.is-active { color:#169cbf; background:#FFFFFF; border:1px solid #29aecc;} .dec-row-statistics .box-topArea .con-conBox .dec-sortArea a.dec-btn-sort.is-active:hover { color:#169cbf; background:#FFFFFF; border:1px solid #29aecc;} .dec-row-statistics .box-topArea .con-conBox .dec-sortArea .dec-selector { width:calc(20% - 0px); min-width:150px;} /*end - .dec-row-statistics .box-topArea .con-conBox .dec-sortArea*/ .dec-row-statistics .box-topArea .con-conBox .box-inner-width-01 { margin-left:5px; padding:0px; width:calc(12% - 0px);} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-01.dec-box-01 { margin-top:5px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-01.dec-m-01 { margin-top:5px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-01.dec-ml01 { margin-left:0px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-01.dec-mr01 { margin-right:5px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-01.dec-mb01 { margin-bottom:5px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-01.dec-wTimePicker { width:130px;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02, .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02:hover { margin-left:5px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden; width:calc(12% - 0px);} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02.dec-m-01 { margin-top:0px;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02.dec-m-01a { margin-top:0px;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02.dec-m-01b { margin-top:5px;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02.dec-m-02 { margin-left:5px;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02.dec-width-01 { width:150px; margin-top:0px;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02.dec-box-01 { margin-left:0px; margin-right:5px; margin-top:0px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-02a { width:130px; margin-left:5px; padding: 5px; background:#FFFFFF; height:33.5px; overflow:hidden;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02 .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02 .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02:hover .dec-innerArea .dec-type { color:#595959;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-02 .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02 .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px; color:#595959;} .dec-row-statistics .box-topArea .con-conBox a.box-inner-width-02:hover .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px; color:#787878;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-03-group { margin:0px; padding:0px; width:230px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-03-group .box-inner-width-03 { display: inline-block;} @media (max-width: 1339px) { .dec-row-statistics .box-topArea .con-conBox .box-inner-width-03-group { margin:5px 0px 0px 0px; padding:0px; width:250px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-03-group .box-inner-width-03 { display:inline-block;} } .dec-row-statistics .box-topArea .con-conBox .box-inner-width-03-group.dec-mt01 { margin-top:5px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-03 { width:auto; margin-left:5px; padding:0px; -ms-flex-item-align: center !important; align-self: center !important;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-03 .dec-form-control { width:130px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-03.dec-m-01 { margin-top:5px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-03.dec-select { width:100px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-03 .dec-type { width:auto; margin-left:5px; padding:0px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-break { width:10px; margin-left:5px; padding:5px 0px 0px 0px;} /*start - .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox ------------------------------------------------------------------*/ .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox { width:auto; margin:0px; padding:0px 0px 0px 5px; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox.dec-m-01 { margin-top:5px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox .dec-innerArea { width: auto;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox .dec-innerArea .dec-type {} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox .dec-innerArea .dec-btn {} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox .form-check { width:auto; margin:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox .form-check:last-child { margin-right:0px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox .form-check .form-check-label { width:auto; margin:0px 10px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox .form-check .form-check-label .dec-type-01 { width:auto; margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox .form-check .form-check-input { margin-top:10px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox .form-check:last-child .form-check-input { margin-top:12px;} /*end - .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox ------------------------------------------------------------------*/ /*start - .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox-01 ------------------------------------------------------------------*/ .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox-01 { width:auto; margin:0px; padding:0px 0px 0px 5px; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox-01 .form-check .form-check-input { margin-top:10px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox-01 .form-check { width:auto; margin:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox-01 .form-check:last-child { margin-right:0px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox-01 .form-check .form-check-label { width:auto; margin:0px 10px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox-01 .form-check .form-check-label .dec-type-01 { width:auto; margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox-01 .form-check .form-check-input { margin-top:4px;} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox-01 .form-check:last-child .form-check-input { margin-top:4px;} /*end - .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox-01 ------------------------------------------------------------------*/ .dec-conBoxInner.div-NavSortBox-statisticsSpeeding .box-topArea .con-conBox:first-child { margin-top:-3px; margin-bottom:-2px;} .dec-conBoxInner.div-NavSortBox-statisticsSpeeding .box-topArea .con-conBox .box-inner-width-01 { margin-top:3px; margin-bottom:2px;} .dec-conBoxInner.div-NavSortBox-statisticsSpeeding .box-topArea .con-conBox .box-inner-width-break { margin-top:3px; margin-bottom:2px;} .dec-conBoxInner.div-NavSortBox-statisticsSpeeding .box-topArea .con-conBox a.box-inner-width-02, .dec-conBoxInner.div-NavSortBox-statisticsSpeeding .box-topArea .con-conBox a.box-inner-width-02:hover { margin-top:3px; margin-bottom:2px; text-decoration:none;} .dec-conBoxInner.div-NavSortBox-statisticsSpeeding .box-topArea .con-conBox .box-inner-width-functionbox {} .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox.dec-box-01 { margin-top:0px;} @media (max-width: 1459px) { .dec-row-statistics .box-topArea .con-conBox .box-inner-width-functionbox.dec-box-01 { margin-top:5px;} } /*start - .dec-row-statistics .box-conArea .dec-conArea-itemInfo --------------------------------------------------------------------------------*/ .dec-row-statistics .box-conArea .dec-conArea-itemInfo .box-topArea { margin:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-line-pack: justify !important; align-content: space-between !important;} .dec-row-statistics .box-conArea .dec-conArea-itemInfo .box-topArea .dec-conArea { width:calc(100% - 40px); margin:0px; padding:0px;} .dec-row-statistics .box-conArea .dec-conArea-itemInfo .box-topArea .dec-btnArea { width:40px; height:31px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-line-pack: center !important; align-content: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .dec-row-statistics .box-conArea .dec-conArea-itemInfo .box-topArea .dec-btnArea a.dec-btn, .dec-row-statistics .box-conArea .dec-conArea-itemInfo .box-topArea .dec-btnArea a.dec-btn:hover { width:40px; height:31px; margin:0px; padding:2px 5px; border:0px; background:transparent;} .dec-row-statistics .box-conArea .dec-conArea-itemInfo .box-topArea .dec-btnArea a.dec-btn .dec-ic { margin:5px 0px 0px 8px; padding:0px;} .dec-row-statistics .box-conArea .dec-conArea-itemInfo .dec-boxChart { width:calc(100% - 0px); height:calc(100% - 40px); margin:0px; padding:5px 8px; overflow-x:hidden; overflow-y:auto; display:block;} .dec-row-statistics .box-conArea .dec-conArea-itemInfo .box-topArea .con-conBox {} .dec-row-statistics .box-conArea .dec-conArea-itemInfo .box-topArea .con-conBox .dec-box-a01 { width:auto; margin:0px; padding:5px 0px;} .dec-row-statistics .box-conArea .dec-conArea-itemInfo .box-topArea .con-conBox .dec-box-a01.dec-type-02 { font-size:1.2rem; padding-left:5px; font-weight:500;} /*end - .dec-row-statistics .box-conArea .dec-conArea-itemInfo --------------------------------------------------------------------------------*/ /*start - .dec-row-statistics .box-conArea .box-conChartArea --------------------------------------------------------------------------------*/ .dec-row-statistics .box-conArea .box-conChartArea { width:calc(100% - 0px); max-width:1175px; height:150px; margin:10px 0px; padding:0px; background:#FFFFFF; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: start !important; align-items: flex-start !important;} .dec-row-statistics .box-conArea .box-conChartArea .box-con { height:calc(100% - 0px); margin:0px; padding:0px; background:#ebebeb; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: center !important; justify-content: center !important;} .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-01, .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-02, .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-03, .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-04 { height:calc(100% - 0px); margin:0px; padding:0px; border-radius:5px; border:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important;} .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-01 { width:calc(22% - 15px);} .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-02 { width:calc(22% - 15px);} .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-03 { width:calc(16% - 0px); border-radius:5px 0px 0px 5px;} .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-04 { width:calc(40% - 0px); border-radius:0px 5px 5px 0px; border-right:1px solid #ddd; border-bottom:1px solid #ddd;} .dec-row-statistics .box-conArea .box-conChartArea .box-con.box-con-break { width:15px; height:calc(100% - 0px); overflow:hidden; margin:0px; padding:0px; background:transparent;} .dec-row-statistics .box-conArea .box-conChartArea .box-con .box-con-num { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:0px; font-size:2.7rem; line-height:3rem; font-weight:400; color:#169cbf; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .dec-row-statistics .box-conArea .box-conChartArea .box-con .box-con-type { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1.3rem; line-height:1.3rem; color:#787878; letter-spacing:0.2rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: center !important; justify-content: center !important;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsLoadFactor .box-conArea.dec-height .box-conChartArea .box-con.dec-con-04 .bottom-table-area-a01 { height:calc(100% - 0px); background:#FFFFFF;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsLoadFactor .box-conArea.dec-height .box-conChartArea .box-con.dec-con-04 .bottom-table-area-a01 .table tr th { border-top:1px solid #595959;} .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-03 { border-right:1px solid #dee2e6; background:#595959;} .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-03 .box-con-num { color:#7adee5;} .dec-row-statistics .box-conArea .box-conChartArea .box-con.dec-con-03 .box-con-type { color:#fafafa;} /*end - .dec-row-statistics .box-conArea .box-conChartArea --------------------------------------------------------------------------------*/ .dec-row-statistics .box-conArea .box-conChartArea-subTitle { width:calc(100% - 0px); margin:0px; padding:35px 0px 0px 0px; font-size:1.2rem; line-height:1.5rem; font-weight:500; color:#595959;} .dec-row-statistics .box-conArea .box-conChartArea-subTitle:first-child { padding:15px 0px 0px 0px;} .dec-row-statistics .box-conArea .box-conChartArea-subTitle .dec-subTitleNote { width:auto; margin:0px; padding:0px 0px 0px 5px; font-size:1rem; line-height:1.5rem; font-weight:400; color:#787878;} .dec-row-statistics .box-conArea .box-conChartArea-chart { width:calc(100% - 0px); margin:0px; padding:0px; height:calc(100% - 265px);} /*start - .dec-row-statistics .box-conArea .box-statisticsCarSensor... 統計分析｜車輛感測器數據｜CAN數據｜儀表板... --------------------------------------------------*/ /*start - .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea*/ .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea { width:calc(100% - 0px); margin:0px; padding:0px; display:block;} .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a, .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a:hover { font-size:1.2rem; line-height:1.5rem; color:#999999; margin-left:8px; padding:25px 5px 5px 5px; border-bottom:5px solid #FFFFFF; font-weight:500; background:#FFFFFF; display:inline-block;} .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a:hover { color:#999999; margin-left:8px; border-bottom:5px solid #b4b4b4; background:#FFFFFF;} .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a.is-active, .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a.is-active:hover { color:#595959; margin-left:8px; border-bottom:5px solid #787878; background:#FFFFFF;} .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a:first-child, .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a:first-child:hover, .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a:first-child.is-active, .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a:first-child.is-active:hover { margin:0px;} .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a:last-child, .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a:last-child:hover, .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a:last-child.is-active, .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea a:last-child.is-active:hover { margin-right:auto;} /*end - .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnArea*/ .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnConArea { width:calc(100% - 0px); margin:0px; padding:10px;} .dec-row-statistics .box-conArea .box-statisticsCarSensor-btnConArea .box-contentArea { width:calc(100% - 0px); margin:0px; padding:0px;} /*end - .dec-row-statistics .box-conArea .box-statisticsCarSensor... 統計分析｜車輛感測器數據｜CAN數據｜儀表板... --------------------------------------------------*/ /*start - .dec-row-statistics .box-conArea .box-statisticsAlarmRecord... 統計分析｜告警紀錄｜重要告警排行圖表... --------------------------------------------------*/ /*start - .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea*/ .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea { width:calc(100% - 0px); margin:0px; padding:0px; display:block;} .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a, .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a:hover { font-size:1.2rem; line-height:1.5rem; color:#999999; margin-left:8px; padding:25px 5px 5px 5px; border-bottom:5px solid #FFFFFF; font-weight:500; background:#FFFFFF; display: inline-block;} .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a:hover { color:#999999; margin-left:8px; border-bottom:5px solid #b4b4b4; background:#FFFFFF;} .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a.is-active, .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a.is-active:hover { color:#595959; margin-left:8px; border-bottom:5px solid #787878; background:#FFFFFF;} .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a:first-child, .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a:first-child:hover, .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a:first-child.is-active, .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a:first-child.is-active:hover { margin:0px;} .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a:last-child, .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a:last-child:hover, .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a:last-child.is-active, .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea a:last-child.is-active:hover { margin-right:auto;} /*end - .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnArea*/ .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnConArea { width:calc(100% - 0px); margin:0px; padding:10px;} .dec-row-statistics .box-conArea .box-statisticsAlarmRecord-btnConArea .box-contentArea { width:calc(100% - 0px); margin:0px; padding:0px;} /*end - .dec-row-statistics .box-conArea .box-statisticsAlarmRecord... 統計分析｜告警紀錄｜重要告警排行圖表... --------------------------------------------------*/ /*end - .dec-row-statistics ---------------------------------------------------------------------------------------------------------------------------------------------------------------*/ .con-container.dec-statistics .breadcrumb-item.active { color:#ebebeb;} /*start - 統計分析｜左上角breadcrumb文字 ------------------------------------------------------------------------------------------------*/ .breadcrumb-type.dec-statisticsContainerVolume::after, .breadcrumb-type.dec-statisticsSingleStationRushHour::after, .breadcrumb-type.dec-statisticsRouteRushHour::after, .breadcrumb-type.dec-statisticsDashCam::after, .breadcrumb-type.dec-statisticsSpeedChart::after, .breadcrumb-type.dec-statisticsColdChain::after, .breadcrumb-type.dec-statisticsDangerousDrivingSubmenu::after, .breadcrumb-type.dec-statisticsCarSubmenu::after, .breadcrumb-type.dec-statisticsDailyReport::after, .breadcrumb-type.dec-statisticsFuelConsumption::after, .breadcrumb-type.dec-statisticsCarSensorSubmenu::after, .breadcrumb-type.dec-statisticsDriverSubmenu::after, .breadcrumb-type.dec-statisticsWineTestSubmenu::after, .breadcrumb-type.dec-statisticsAbnormalSubmenu::after, .breadcrumb-type.dec-statisticsAbnormalStay::after, .breadcrumb-type.dec-statisticsSpeedingN::after, .breadcrumb-type.dec-statisticsContinuedSpeeding::after, .breadcrumb-type.dec-statisticsSpeedingInFence::after, .breadcrumb-type.dec-statisticsFenceInOut::after, .breadcrumb-type.dec-statisticsOvertimeDriving::after, .breadcrumb-type.dec-statisticsRestrictedRoad::after, .breadcrumb-type.dec-statisticsOffsetRoute::after, .breadcrumb-type.dec-statisticsDEFSubmenu::after, .breadcrumb-type.dec-statisticsFuelSubmenu::after, .breadcrumb-type.dec-statisticsAlarmRecord::after, .breadcrumb-type.dec-statisticsAlarmRecordSelfDriving::after, .breadcrumb-type.dec-statisticsParkingLot::after, .breadcrumb-type.dec-statisticsFormRecord::after, .breadcrumb-type.dec-statisticsImmobilizer::after, .breadcrumb-type.dec-statisticsSOS::after, .breadcrumb-type.dec-statisticsBarcode::after, .breadcrumb-type.dec-statisticsLateRatio::after, .breadcrumb-type.dec-statisticsDetachRatio::after, .breadcrumb-type.dec-statisticsSelectionSCM::after, .breadcrumb-type.dec-statisticsLoadFactor::after, .breadcrumb-type.dec-statisticsDrivingBehavior::after, .breadcrumb-type.dec-statisticsVehicleCheckList::after, .breadcrumb-type.dec-statisticsLoadingAndUnloadingRecord::after { margin:0px; padding:0px 0px 0px 0.5rem; color:#78dadd; display:inline-block;} .breadcrumb-type.dec-statisticsContainerVolume::after { content:"\002F \0020 總吞吐量";} .breadcrumb-type.dec-statisticsSingleStationRushHour::after { content:"\002F \0020 單站尖峰時段";} .breadcrumb-type.dec-statisticsRouteRushHour::after { content:"\002F \0020 路線尖峰時段";} .breadcrumb-type.dec-statisticsDashCam::after { content:"\002F \0020 數位大餅";} .breadcrumb-type.dec-statisticsSpeedChart::after { content:"\002F \0020 時速圖表";} .breadcrumb-type.dec-statisticsColdChain::after { content:"\002F \0020 冷鏈圖表";} .breadcrumb-type.dec-statisticsDangerousDrivingSubmenu::after { content:"\002F \0020 駕駛行為圖表";} /*2024/01/05 [危險駕駛統計]更名為[駕駛行為圖表]. prototype v1.99.163*/ .breadcrumb-type.dec-statisticsCarSubmenu::after { content:"\002F \0020 出車績效統計";} .breadcrumb-type.dec-statisticsDailyReport::after { content:"\002F \0020 行車日報表";} .breadcrumb-type.dec-statisticsFuelConsumption::after { content:"\002F \0020 油耗日報表(SCM)";} .breadcrumb-type.dec-statisticsCarSensorSubmenu::after { content:"\002F \0020 車輛感測器數據";} .breadcrumb-type.dec-statisticsDriverSubmenu::after { content:"\002F \0020 司機出勤統計";} .breadcrumb-type.dec-statisticsWineTestSubmenu::after { content:"\002F \0020 酒測血壓詳細數據";} .breadcrumb-type.dec-statisticsAbnormalSubmenu::after { content:"\002F \0020 異常管理";} .breadcrumb-type.dec-statisticsAbnormalStay::after { content:"\002F \0020 異常停留";} .breadcrumb-type.dec-statisticsSpeedingN::after { content:"\002F \0020 超速";} .breadcrumb-type.dec-statisticsContinuedSpeeding::after { content:"\002F \0020 持續超速";} .breadcrumb-type.dec-statisticsSpeedingInFence::after { content:"\002F \0020 圍籬內超速";} .breadcrumb-type.dec-statisticsFenceInOut::after { content:"\002F \0020 進入/離開圍籬";} .breadcrumb-type.dec-statisticsOvertimeDriving::after { content:"\002F \0020 超時駕駛";} .breadcrumb-type.dec-statisticsRestrictedRoad::after { content:"\002F \0020 禁行路段";} .breadcrumb-type.dec-statisticsOffsetRoute::after { content:"\002F \0020 偏移路線";} .breadcrumb-type.dec-statisticsDEFSubmenu::after { content:"\002F \0020 尿素加注紀錄";} .breadcrumb-type.dec-statisticsFuelSubmenu::after { content:"\002F \0020 加油紀錄";} .breadcrumb-type.dec-statisticsAlarmRecord::after { content:"\002F \0020 告警紀錄";} .breadcrumb-type.dec-statisticsAlarmRecordSelfDriving::after { content:"\002F \0020 告警紀錄(自駕車)";} .breadcrumb-type.dec-statisticsParkingLot::after { content:"\002F \0020 停車場進出紀錄";} .breadcrumb-type.dec-statisticsFormRecord::after { content:"\002F \0020 六聯單紀錄";} .breadcrumb-type.dec-statisticsImmobilizer::after { content:"\002F \0020 防盜器紀錄";} .breadcrumb-type.dec-statisticsSOS::after { content:"\002F \0020 SOS紀錄";} .breadcrumb-type.dec-statisticsBarcode::after { content:"\002F \0020 條碼機紀錄";} .breadcrumb-type.dec-statisticsLateRatio::after { content:"\002F \0020 誤點率分析";} .breadcrumb-type.dec-statisticsDetachRatio::after { content:"\002F \0020 脫離率分析";} .breadcrumb-type.dec-statisticsSelectionSCM::after { content:"\002F \0020 [中保]添加選單表頭名稱範例";} .breadcrumb-type.dec-statisticsLoadFactor::after { content:"\002F \0020 乘載率報表(城鄉)";} .breadcrumb-type.dec-statisticsDrivingBehavior::after { content:"\002F \0020 駕駛行為報表(城鄉)";} .breadcrumb-type.dec-statisticsVehicleCheckList::after { content:"\002F \0020 車輛點檢紀錄";} .breadcrumb-type.dec-statisticsLoadingAndUnloadingRecord::after { content:"\002F \0020 上板/卸板紀錄";} /*start - dec-displayN ---------------------------------------------------*/ .breadcrumb-type.dec-statisticsContainerVolume.dec-displayN, .breadcrumb-type.dec-statisticsSingleStationRushHour.dec-displayN, .breadcrumb-type.dec-statisticsRouteRushHour.dec-displayN, .breadcrumb-type.dec-statisticsDashCam.dec-displayN, .breadcrumb-type.dec-statisticsSpeedChart.dec-displayN, .breadcrumb-type.dec-statisticsColdChain.dec-displayN, .breadcrumb-type.dec-statisticsDangerousDrivingSubmenu.dec-displayN, .breadcrumb-type.dec-statisticsCarSubmenu.dec-displayN, .breadcrumb-type.dec-statisticsDailyReport.dec-displayN, .breadcrumb-type.dec-statisticsFuelConsumption.dec-displayN, .breadcrumb-type.dec-statisticsCarSensorSubmenu.dec-displayN, .breadcrumb-type.dec-statisticsDriverSubmenu.dec-displayN, .breadcrumb-type.dec-statisticsWineTestSubmenu.dec-displayN, .breadcrumb-type.dec-statisticsAbnormalSubmenu.dec-displayN, .breadcrumb-type.dec-statisticsAbnormalStay.dec-displayN, .breadcrumb-type.dec-statisticsSpeedingN.dec-displayN, .breadcrumb-type.dec-statisticsContinuedSpeeding.dec-displayN, .breadcrumb-type.dec-statisticsSpeedingInFence.dec-displayN, .breadcrumb-type.dec-statisticsFenceInOut.dec-displayN, .breadcrumb-type.dec-statisticsOvertimeDriving.dec-displayN, .breadcrumb-type.dec-statisticsRestrictedRoad.dec-displayN, .breadcrumb-type.dec-statisticsOffsetRoute.dec-displayN, .breadcrumb-type.dec-statisticsDEFSubmenu.dec-displayN, .breadcrumb-type.dec-statisticsFuelSubmenu.dec-displayN, .breadcrumb-type.dec-statisticsAlarmRecord.dec-displayN, .breadcrumb-type.dec-statisticsAlarmRecordSelfDriving.dec-displayN, .breadcrumb-type.dec-statisticsParkingLot.dec-displayN, .breadcrumb-type.dec-statisticsFormRecord.dec-displayN, .breadcrumb-type.dec-statisticsImmobilizer.dec-displayN, .breadcrumb-type.dec-statisticsSOS.dec-displayN, .breadcrumb-type.dec-statisticsBarcode.dec-displayN, .breadcrumb-type.dec-statisticsLateRatio.dec-displayN, .breadcrumb-type.dec-statisticsDetachRatio.dec-displayN, .breadcrumb-type.dec-statisticsSelectionSCM.dec-displayN, .breadcrumb-type.dec-statisticsLoadFactor.dec-displayN, .breadcrumb-type.dec-statisticsDrivingBehavior.dec-displayN, .breadcrumb-type.dec-statisticsVehicleCheckList.dec-displayN, .breadcrumb-type.dec-statisticsLoadingAndUnloadingRecord.dec-displayN { display:none;} /*end - dec-displayN ---------------------------------------------------*/ /*end - 統計分析｜左上角breadcrumb文字 ------------------------------------------------------------------------------------------------*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.box-inner-width-02 --------------------------------------------------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.box-inner-width-02.dec-width-01, .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.box-inner-width-02.dec-width-01:hover { width:100%; height:34px; margin:0px; padding:0px; background:#FFFFFF; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.box-inner-width-02 .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.box-inner-width-02 .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.box-inner-width-02:hover .dec-innerArea .dec-type { color:#0083BE;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.box-inner-width-02 .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.box-inner-width-02 .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.box-inner-width-02:hover .dec-innerArea .dec-btn .dec-ic { color:#0083BE;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox a.box-inner-width-02 --------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-FunctionArea-BaseMap ----------------------------------------------------*/ .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-top .con-top-btn { width:30px;} .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-top .con-top-title { width:calc(100% - 30px); letter-spacing:0.1rem;} .MapTool-FunctionBox.dec-FunctionArea-BaseMap { width:150px;} .MapTool-FunctionBox.dec-FunctionArea-BaseMap .box-inner .con-main {} .btn-BaseMap-Area { width:calc(100% - 0px); margin:0px; padding:5px 0px; background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .btn-BaseMap-Area .btn-baseMap { margin:0px; padding:5px; color:#595959; text-decoration:none; vertical-align:top; text-align:left; width:130px; height:85px; position:relative; border-radius:0.25rem; background:#fafafa; border:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .btn-BaseMap-Area .btn-baseMap:hover { text-decoration: none; background:#5dc1cf;} .btn-BaseMap-Area .btn-baseMap:nth-child(1), .btn-BaseMap-Area .btn-baseMap:nth-child(3) { margin-right:5px;} .btn-BaseMap-Area .btn-baseMap:nth-child(1), .btn-BaseMap-Area .btn-baseMap:nth-child(2) { margin-bottom:5px;} .btn-BaseMap-Area .btn-baseMap.is-active, .btn-BaseMap-Area .btn-baseMap.is-active:focus, .btn-BaseMap-Area .btn-baseMap.is-active:active, .btn-BaseMap-Area .btn-baseMap.is-active:hover { text-decoration:none; background:#5dc1cf;} .btn-BaseMap-Area .btn-baseMap .dec-img, .btn-BaseMap-Area .btn-baseMap:hover .dec-img { width:120px; height:75px; margin:0px; padding:0px; border-radius:0.25rem; border-width:22px;} .btn-BaseMap-Area .btn-baseMap .dec-type, .btn-BaseMap-Area .btn-baseMap:hover .dec-type, .btn-BaseMap-Area .btn-baseMap.is-active .dec-type, .btn-BaseMap-Area .btn-baseMap.is-active:focus .dec-type, .btn-BaseMap-Area .btn-baseMap.is-active:active .dec-type, .btn-BaseMap-Area .btn-baseMap.is-active:hover .dec-type { margin:0px; padding:5px 0px 8px 0px; font-size:14px; letter-spacing:0rem; line-height:1rem; font-weight:400; color:#FFFFFF; width:calc(100% - 0px); text-align:center; position:absolute; bottom:0px; border-radius:0rem 0rem 0.25rem 0.25rem; border-width:0px;} .btn-BaseMap-Area .btn-baseMap .dec-type { color:#5dc1cf; background:rgba(255,255,255,0.6);} .btn-BaseMap-Area .btn-baseMap:hover .dec-type { background:#5dc1cf;} .btn-BaseMap-Area .btn-baseMap.is-active .dec-type, .btn-BaseMap-Area .btn-baseMap.is-active:focus .dec-type, .btn-BaseMap-Area .btn-baseMap.is-active:active .dec-type, .btn-BaseMap-Area .btn-baseMap.is-active:hover .dec-type { background:#5dc1cf;} /*end - .MapTool-FunctionBox.dec-FunctionArea-BaseMap ----------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-MapLayer-POISample ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-MapLayer-POISample { width:calc(100% - 400px); height:200px; height:auto; right:auto; left:15px; top:95px; margin:0px; padding:0px; position:absolute; background:transparent; overflow:hidden; box-shadow:0px 2px 4px rgb(0 0 0 / 0%); border:0px;} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:transparent; position:relative; border-radius:0px;} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-list { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img { margin:2px; padding:0px; background:transparent; border-radius:25px;} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-small { width:18px; height:18px;} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-medium { width:32px; height:32px;} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-large { width:48px; height:48px;} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-rotate-0 { -webkit-transform: rotate(0deg); transform: rotate(0deg);} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-rotate-45 { -webkit-transform: rotate(45deg); transform: rotate(45deg);} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-rotate-90 { -webkit-transform: rotate(90deg); transform: rotate(90deg);} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-rotate-135 { -webkit-transform: rotate(135deg); transform: rotate(135deg);} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-rotate-180 { -webkit-transform: rotate(180deg); transform: rotate(180deg);} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-rotate-225 { -webkit-transform: rotate(225deg); transform: rotate(225deg);} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-rotate-270 { -webkit-transform: rotate(270deg); transform: rotate(270deg);} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-rotate-315 { -webkit-transform: rotate(315deg); transform: rotate(315deg);} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-img.dec-rotate-360 { -webkit-transform: rotate(360deg); transform: rotate(360deg);} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-type { width:auto; font-size:14px; color:#595959; background:rgba(255,255,255,0.8); border-radius:5px; margin:0px; padding:2px 3px; display:inline-block;} .MapTool-FunctionBox.dec-MapLayer-POISample .box-inner .dec-type-selected { width:auto; font-size:14px; color:#ed1c24; background:rgba(255,255,255,1); border-radius:5px; margin:0px; padding:2px 3px; display:inline-block;} /*end - .MapTool-FunctionBox.dec-MapLayer-POISample ----------------------------------------------------------------*/ /*區域查詢/POI查詢 (地圖用marker) 政府機關 img_m_poi_gov 金融證券 img_m_poi_bank 餐飲美食 img_m_poi_food 交通運輸 img_m_poi_transit 逛街購物 img_m_poi_shopping 醫療保健 img_m_poi_medical 休閒娛樂 img_m_poi_recreation 公司行號 img_m_poi_company 殯葬禮儀 img_m_poi_funeral 宗教民俗 img_m_poi_religion*/ /*start - .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch.dec-videoArea-POISample { top:150px; left:25px;} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch { width:calc(50% - 0px); height:auto; right:auto; left:15px; top:95px; margin:0px; padding:0px; position:absolute; background:transparent; overflow:hidden; box-shadow:0px 2px 4px rgb(0 0 0 / 0%); border:0px;} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:transparent; position:relative; border-radius:0px;} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-list { width:calc(100% - 0px); margin:5px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-list .icon-sprite { margin-left:5px;} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img { margin:2px; padding:0px; background:transparent; border-radius:25px;} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small { width:18px; height:18px;} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium { width:32px; height:32px;} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large { width:48px; height:48px;} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_gov { background: url("../images/map/18x18px/img_m_poi_gov.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_bank { background: url("../images/map/18x18px/img_m_poi_bank.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_food { background: url("../images/map/18x18px/img_m_poi_food.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_transit { background: url("../images/map/18x18px/img_m_poi_transit.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_shopping { background: url("../images/map/18x18px/img_m_poi_shopping.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_medical { background: url("../images/map/18x18px/img_m_poi_medical.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_recreation { background: url("../images/map/18x18px/img_m_poi_recreation.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_company { background: url("../images/map/18x18px/img_m_poi_company.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_funeral { background: url("../images/map/18x18px/img_m_poi_funeral.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_religion { background: url("../images/map/18x18px/img_m_poi_religion.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_facility { background: url("../images/map/18x18px/img_m_poi_facility.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_gov_o { background: url("../images/map/18x18px/img_m_poi_gov_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_bank_o { background: url("../images/map/18x18px/img_m_poi_bank_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_food_o { background: url("../images/map/18x18px/img_m_poi_food_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_transit_o { background: url("../images/map/18x18px/img_m_poi_transit_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_shopping_o { background: url("../images/map/18x18px/img_m_poi_shopping_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_medical_o { background: url("../images/map/18x18px/img_m_poi_medical_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_recreation_o { background: url("../images/map/18x18px/img_m_poi_recreation_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_company_o { background: url("../images/map/18x18px/img_m_poi_company_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_funeral_o { background: url("../images/map/18x18px/img_m_poi_funeral_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_religion_o { background: url("../images/map/18x18px/img_m_poi_religion_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_poi_facility_o { background: url("../images/map/18x18px/img_m_poi_facility_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_gov { background: url("../images/map/32x32px/img_m_poi_gov.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_bank { background: url("../images/map/32x32px/img_m_poi_bank.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_food { background: url("../images/map/32x32px/img_m_poi_food.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_transit { background: url("../images/map/32x32px/img_m_poi_transit.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_shopping { background: url("../images/map/32x32px/img_m_poi_shopping.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_medical { background: url("../images/map/32x32px/img_m_poi_medical.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_recreation { background: url("../images/map/32x32px/img_m_poi_recreation.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_company { background: url("../images/map/32x32px/img_m_poi_company.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_funeral { background: url("../images/map/32x32px/img_m_poi_funeral.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_religion { background: url("../images/map/32x32px/img_m_poi_religion.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_facility { background: url("../images/map/32x32px/img_m_poi_facility.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_gov_o { background: url("../images/map/32x32px/img_m_poi_gov_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_bank_o { background: url("../images/map/32x32px/img_m_poi_bank_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_food_o { background: url("../images/map/32x32px/img_m_poi_food_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_transit_o { background: url("../images/map/32x32px/img_m_poi_transit_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_shopping_o { background: url("../images/map/32x32px/img_m_poi_shopping_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_medical_o { background: url("../images/map/32x32px/img_m_poi_medical_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_recreation_o { background: url("../images/map/32x32px/img_m_poi_recreation_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_company_o { background: url("../images/map/32x32px/img_m_poi_company_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_funeral_o { background: url("../images/map/32x32px/img_m_poi_funeral_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_religion_o { background: url("../images/map/32x32px/img_m_poi_religion_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_poi_facility_o { background: url("../images/map/32x32px/img_m_poi_facility_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_gov { background: url("../images/map/48x48px/img_m_poi_gov.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_bank { background: url("../images/map/48x48px/img_m_poi_bank.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_food { background: url("../images/map/48x48px/img_m_poi_food.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_transit { background: url("../images/map/48x48px/img_m_poi_transit.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_shopping { background: url("../images/map/48x48px/img_m_poi_shopping.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_medical { background: url("../images/map/48x48px/img_m_poi_medical.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_recreation { background: url("../images/map/48x48px/img_m_poi_recreation.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_company { background: url("../images/map/48x48px/img_m_poi_company.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_funeral { background: url("../images/map/48x48px/img_m_poi_funeral.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_religion { background: url("../images/map/48x48px/img_m_poi_religion.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_facility { background: url("../images/map/48x48px/img_m_poi_facility.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_gov_o { background: url("../images/map/48x48px/img_m_poi_gov_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_bank_o { background: url("../images/map/48x48px/img_m_poi_bank_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_food_o { background: url("../images/map/48x48px/img_m_poi_food_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_transit_o { background: url("../images/map/48x48px/img_m_poi_transit_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_shopping_o { background: url("../images/map/48x48px/img_m_poi_shopping_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_medical_o { background: url("../images/map/48x48px/img_m_poi_medical_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_recreation_o { background: url("../images/map/48x48px/img_m_poi_recreation_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_company_o { background: url("../images/map/48x48px/img_m_poi_company_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_funeral_o { background: url("../images/map/48x48px/img_m_poi_funeral_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_religion_o { background: url("../images/map/48x48px/img_m_poi_religion_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_poi_facility_o { background: url("../images/map/48x48px/img_m_poi_facility_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_marker_parking { background: url("../images/map/18x18px/img_m_marker_parking.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_marker_parking_o { background: url("../images/map/18x18px/img_m_marker_parking_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_marker_parking { background: url("../images/map/32x32px/img_m_marker_parking.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_marker_parking_o { background: url("../images/map/32x32px/img_m_marker_parking_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_marker_parking { background: url("../images/map/48x48px/img_m_marker_parking.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_marker_parking_o { background: url("../images/map/48x48px/img_m_marker_parking_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_marker_parking_selected { background: url("../images/map/18x18px/img_m_marker_parking_selected.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_marker_parking_selected_o { background: url("../images/map/18x18px/img_m_marker_parking_selected_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_marker_parking_selected { background: url("../images/map/32x32px/img_m_marker_parking_selected.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_marker_parking_selected_o { background: url("../images/map/32x32px/img_m_marker_parking_selected_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_marker_parking_selected { background: url("../images/map/48x48px/img_m_marker_parking_selected.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_marker_parking_selected_o { background: url("../images/map/48x48px/img_m_marker_parking_selected_o.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_marker_timeline { background:url("../images/map/18x18px/img_m_marker_timeline.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_marker_timeline { background: url("../images/map/32x32px/img_m_marker_timeline.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_marker_timeline { background: url("../images/map/48x48px/img_m_marker_timeline.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-small.dec-img_m_marker_videoCar { background:url("../images/map/18x18px/img_m_marker_videoCar.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-medium.dec-img_m_marker_videoCar { background: url("../images/map/32x32px/img_m_marker_videoCar.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-img.dec-large.dec-img_m_marker_videoCar { background: url("../images/map/48x48px/img_m_marker_videoCar.svg");} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-type { width:auto; fint-size:14px; color:#595959; background:rgba(255,255,255,0.8); border-radius:5px; margin:0px; padding:2px 3px; display:inline-block;} .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch .box-inner .dec-type-selected { width:auto; fint-size:14px; color:#ed1c24; background:rgba(255,255,255,1); border-radius:5px; margin:0px; padding:2px 3px; display:inline-block;} /*end - .MapTool-FunctionBox.dec-MapLayer-POISample-POISearch ----------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-DeviceInfo .con-main ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-DeviceInfo .con-main {} .MapTool-FunctionBox.dec-DeviceInfo .con-main .dec-list-area { width:calc(100% - 0px); margin:0px; margin-top:5px; padding:0px; word-break:break-all; font-size:1rem; line-height:1.2rem; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-DeviceInfo .con-main .dec-list-area:first-child { margin-top:0px;} .MapTool-FunctionBox.dec-DeviceInfo .con-main .dec-list-area .dec-L { width:80px; margin:0px; padding:0px; text-align:right;} .MapTool-FunctionBox.dec-DeviceInfo .con-main .dec-list-area .dec-C { width:15px; margin:0px; padding:0px; text-align:center;} .MapTool-FunctionBox.dec-DeviceInfo .con-main .dec-list-area .dec-R { width:calc(100% - 95px); margin:0px; padding:0px;} /*end - .MapTool-FunctionBox.dec-DeviceInfo .con-main ----------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-SignInfo .con-main ----------------------------------------------------------------*/ .MapTool-FunctionBox.dec-SignInfo .con-main {} /*start - .MapTool-FunctionBox.dec-SignInfo .con-main .dec-TrafficLight-Area*/ .MapTool-FunctionBox.dec-SignInfo .con-main .dec-TrafficLight-Area { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-SignInfo .con-main .dec-TrafficLight-Area .dec-TrafficLight-Box { margin:0px auto; padding:2px; border-radius:100px; color:#FFFFFF; background:#595959; border:1px solid #595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-SignInfo .con-main .dec-TrafficLight-Area .dec-item { margin:0px; margin-left:5px; padding:0px; width:100px; height:100px; border-radius:100px; border:1px solid #595959; color:#FFFFFF; overflow: hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-SignInfo .con-main .dec-TrafficLight-Area .dec-item:first-child { margin-left:0px;} .MapTool-FunctionBox.dec-SignInfo .con-main .dec-TrafficLight-Area .dec-item.dec-Light-Red { background:#ff0000;} /*紅燈*/ .MapTool-FunctionBox.dec-SignInfo .con-main .dec-TrafficLight-Area .dec-item.dec-Light-Yellow { background:#fccf00;} /*黃燈*/ .MapTool-FunctionBox.dec-SignInfo .con-main .dec-TrafficLight-Area .dec-item.dec-Light-Green { background:#72bf44;} /*綠燈*/ .MapTool-FunctionBox.dec-SignInfo .con-main .dec-TrafficLight-Area .dec-item .dec-type { color:#FFFFFF; font-size:4.5rem; line-height:5rem; font-weight:500; margin:0px; padding:0px 0px 5px 0px;} /*end - .MapTool-FunctionBox.dec-SignInfo .con-main .dec-TrafficLight-Area*/ .MapTool-FunctionBox.dec-SignInfo .con-main .box-con { width:calc(100% - 0px); margin:15px 0px 0px 0px; padding:0px;} .MapTool-FunctionBox.dec-SignInfo .con-main .dec-list-area { width:calc(100% - 0px); margin:0px; margin-top:5px; padding:0px; word-break:break-all; font-size:1rem; line-height:1.2rem; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-SignInfo .con-main .dec-list-area:first-child { margin-top:0px;} .MapTool-FunctionBox.dec-SignInfo .con-main .dec-list-area .dec-L { width:35px; margin:0px; padding:0px; text-align:right;} .MapTool-FunctionBox.dec-SignInfo .con-main .dec-list-area .dec-C { width:15px; margin:0px; padding:0px; text-align:center;} .MapTool-FunctionBox.dec-SignInfo .con-main .dec-list-area .dec-R { width:calc(100% - 50px); margin:0px; padding:0px;} /*end - .MapTool-FunctionBox.dec-SignInfo .con-main ----------------------------------------------------------------*/ /*start - .box-conArea.div-parkingLotList-Area ----------------------------------------------------------------*/ .box-conArea.div-parkingLotList-Area { width:calc(100% - 0px); height:calc(100% - 1px); margin:0px 0px 1px 0px; padding:0px; background:transparent; overflow-x:hidden; overflow-y:auto; font-size:1rem; line-height:1.2rem; color:#999999;} .box-conArea.div-parkingLotList-Area a.btn-listBox, .box-conArea.div-parkingLotList-Area a.btn-listBox:hover, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:hover { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px; background:transparent; border-radius:5px; border:1px solid #ebebeb; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-conArea.div-parkingLotList-Area a.btn-listBox:hover { background:#fafafa;} .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:hover { background:#fcfbe0;} .box-conArea.div-parkingLotList-Area a.btn-listBox:first-child, .box-conArea.div-parkingLotList-Area a.btn-listBox:hover:first-child, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:first-child, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:hover:first-child {} .box-conArea.div-parkingLotList-Area a.btn-listBox .dec-titleArea { width:calc(100% - 0px); margin:0px; padding:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .box-conArea.div-parkingLotList-Area a.btn-listBox .dec-titleArea .dec-ic-p01 { color:#595959; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox .dec-titleArea .dec-ic-p02 { color:#FFFFFF; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox .dec-titleArea .dec-ic-p03 { color:#0083be; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox .dec-titleArea .icon-sprite.icon-ic_parking { } .box-conArea.div-parkingLotList-Area a.btn-listBox:hover .dec-titleArea .icon-sprite.icon-ic_parking { background-position:0 -1736px;} .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active .dec-titleArea .icon-sprite.icon-ic_parking { background-position:-76px -1736px;} .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:hover .dec-titleArea .icon-sprite.icon-ic_parking { background-position:-38px -1736px;} .box-conArea.div-parkingLotList-Area a.btn-listBox .dec-titleArea .dec-type { color:#666666; font-size:16px; line-height:1.5rem; font-weight:500; margin:0px 0px 0px 8px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox:hover .dec-titleArea .dec-ic-p01 { color:#910718; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox:hover .dec-titleArea .dec-ic-p02 { color:#FFFFFF; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox:hover .dec-titleArea .dec-ic-p03 { color:#0083be; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active .dec-titleArea .dec-ic-p01 { color:#595959; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active .dec-titleArea .dec-ic-p02 { color:#FFFFFF; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active .dec-titleArea .dec-ic-p03 { color:#f9bd00; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:hover .dec-titleArea .dec-ic-p01 { color:#910718; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:hover .dec-titleArea .dec-ic-p02 { color:#FFFFFF; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:hover .dec-titleArea .dec-ic-p03 { color:#f9bd00; margin:0px 5px 0px 0px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox:hover .dec-titleArea .dec-type, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active .dec-titleArea .dec-type, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:hover .dec-titleArea .dec-type { color:#666666; font-size:16px; line-height:1.5rem; font-weight:500; margin:0px 0px 0px 8px; padding:0px;} .box-conArea.div-parkingLotList-Area a.btn-listBox .dec-note-01, .box-conArea.div-parkingLotList-Area a.btn-listBox:hover .dec-note-01, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active .dec-note-01, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:hover .dec-note-01 { width:calc(100% - 0px); color:#999999; margin:0px; padding:5px 0px 0px 30px;} .box-conArea.div-parkingLotList-Area a.btn-listBox .dec-note-02, .box-conArea.div-parkingLotList-Area a.btn-listBox:hover .dec-note-02, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active .dec-note-02, .box-conArea.div-parkingLotList-Area a.btn-listBox.is-active:hover .dec-note-02 { width:calc(100% - 0px); color:#999999; margin:0px; padding:5px 0px 5px 30px;} /*end - .box-conArea.div-parkingLotList-Area ----------------------------------------------------------------*/ /*start - .box-conArea.div-parkingLotList-Area .dec-noData ----------------------------------------------------------------*/ .box-conArea.div-parkingLotList-Area .dec-noData { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:5px 0px; text-align:center; color:#CCCCCC; font-size:14px; line-height:1.5rem;} .box-conArea.div-parkingLotList-Area .dec-noData .dec-type {} /*end - .box-conArea.div-parkingLotList-Area .dec-noData ----------------------------------------------------------------*/ /*start - .box-conArea.div-AreaSearch-POISearch-Area ----------------------------------------------------------------*/ .box-conArea.div-AreaSearch-POISearch-Area { width:calc(100% - 0px); height:calc(100% - 1px); margin:0px 0px 1px 0px; padding:0px 5px 0px 0px; background:transparent; overflow-x:hidden; overflow-y:auto; font-size:1rem; line-height:1.2rem;} .box-POISearch-TitleArea { width:calc(100% - 0px); margin:0px; padding:0px 10px;} .box-POISearch-TitleArea.dec-01 { margin-top:30px;} .box-POISearch-TitleArea .dec-titleArea { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1rem; line-height:1.5rem;} .box-POISearch-TitleArea .dec-conArea { width:calc(100% - 0px); margin:0px; padding:5px 0px 5px 23px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .box-POISearch-TitleArea .dec-conArea .dec-note { color:#999999;} .box-POISearch-TitleArea .dec-conArea .dec-num { color:#595959;} .box-POISearch-TitleArea .dec-conArea .dec-num .dec-c01 { color:#f7931e; padding:0px 3px;} /*end - .box-conArea.div-AreaSearch-POISearch-Area ----------------------------------------------------------------*/ /*start - .box-conArea.div-AreaSearch-AddressSearch-Area ----------------------------------------------------------------*/ .box-conArea.div-AreaSearch-AddressSearch-Area { width:calc(100% - 0px); height:calc(100% - 1px); margin:0px 0px 1px 0px; padding:0px; background:transparent; overflow:hidden; font-size:1rem; line-height:1.2rem;} .box-AddressSearch-TitleArea { width:calc(100% - 0px); margin:0px; padding:0px 10px;} .box-AddressSearch-TitleArea.dec-01 { margin-top:10px; margin-bottom:5px;} .box-AddressSearch-TitleArea .dec-titleArea { width:calc(100% - 0px); margin:15px 0px 0px 0px; padding:0px; font-size:1rem; line-height:1.5rem;} .box-AddressSearch-TitleArea .dec-conArea { width:calc(100% - 0px); margin:0px; padding:5px 0px 5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .box-AddressSearch-TitleArea .dec-conArea .dec-note { color:#999999;} .box-AddressSearch-TitleArea .dec-conArea .dec-num { color:#595959;} .box-AddressSearch-TitleArea .dec-conArea .dec-num .dec-c01 { color:#f7931e; padding:0px 3px;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult-title { width:calc(100% - 0px); margin:0px; padding:10px 5px 5px 5px; font-size:1.1rem; font-weight:500;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult { width:calc(100% - 0px); height:calc(100% - 255px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; border-top:1px solid #CCCCCC;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult .dec-listArea { width:calc(100% - 0px); margin:0px; padding:0px;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult .dec-listArea .box-listItem { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #f0f0f0; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult .dec-listArea .box-listItem:first-child { border-top:0px;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult .dec-listArea .box-listItem:hover { background:#fcfbe0;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult .dec-listArea .box-listItem a { color:#29aecc; text-decoration:underline !important;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult .dec-listArea .box-listItem a:hover { color:#169cbf; text-decoration:underline !important;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult .dec-listArea .box-listItem div:first-child { width:calc(100% - 50px); margin:0px; padding:5px; line-height:1.2rem;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult .dec-listArea .box-listItem div:last-child { width:50px; margin:0px; padding:5px; text-align:center;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult .dec-listArea .dec-noData { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:5px 0px; text-align:center; color:#CCCCCC; font-size:14px; line-height:1.5rem; border-top:1px solid #CCCCCC;} .box-conArea.div-AreaSearch-AddressSearch-Area .dec-searchResult .dec-listArea .dec-noData .dec-type {} /*end - .box-conArea.div-AreaSearch-AddressSearch-Area ----------------------------------------------------------------*/ /*start - .con-missionM-box ----------------------------------------------------------------*/ .con-missionM-box { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:5px 0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .con-missionM-box { display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .con-missionM-box .con-missionM-boxInner { width:auto; margin-left:auto; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .con-missionM-box .con-missionM-boxInner .con-box { width:auto; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-missionM-box .con-missionM-boxInner .con-box-period { width:20px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-missionM-box .con-missionM-boxInner .con-box.con-box-break { width:1px; height:40px; margin:0px 8px; padding:0px; border-left:1px solid #CCCCCC; display:inline-block; overflow:hidden;} .con-missionM-box .con-missionM-boxInner .con-box .dec-subtitle { margin:0px; padding:0px; font-size:12px; color:#595959;} .con-missionM-box .con-missionM-boxInner .con-box .dec-number { margin:0px; padding:0px; font-size:1.5rem; color:#f7931e; font-weight:500;} .con-missionM-box .con-missionM-boxInner .con-box .dec-number.dec-price::before { content:"$";} /*start - .con-missionM-box.dec-01 ----------------------------------------------------------------*/ .con-missionM-box.dec-01 { display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-missionM-box.dec-01.dec-alignEnd { display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .con-missionM-box.dec-01 .con-missionM-boxInner { width:calc(80% - 0px); margin-left:auto; padding:0px; margin:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: distribute !important; justify-content: space-around !important;} .con-missionM-box.dec-01 .con-missionM-boxInner .con-box { width:auto; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: end !important; align-items: flex-end !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-direction: column !important; flex-direction: column !important;} /*end - .con-missionM-box.dec-01 ----------------------------------------------------------------*/ /*end - .con-missionM-box ----------------------------------------------------------------*/ /*start - a.box-inner-width-advanceCon ----------------------------------------------------------------*/ a.box-inner-width-advanceCon, a.box-inner-width-advanceCon:hover { width:calc(15% - 0px); margin-left: 5px; padding:0px; background:#FFFFFF; height:33.5px; border:1px solid #ced4da; border-radius:0.25rem; overflow:hidden;} a.box-inner-width-advanceCon.dec-box-01 { margin-left:0px; margin-right:5px; margin-top:0px;} a.box-inner-width-advanceCon.dec-box-01 .dec-innerArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} a.box-inner-width-advanceCon.dec-box-01 .dec-innerArea .dec-type { color:#595959; width:calc(100% - 30px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; -ms-flex-item-align: center !important; align-self: center !important;} a.box-inner-width-advanceCon.dec-box-01:hover .dec-innerArea .dec-type { color:#595959;} a.box-inner-width-advanceCon.dec-box-01 .dec-innerArea .dec-btn { width:30px; height:33.5px; overflow:hidden; margin:0px; padding:5px; border:0px solid transparent; border-left:1px solid #e6e6e6; background:#fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important;} a.box-inner-width-advanceCon.dec-box-01 .dec-innerArea .dec-btn .dec-ic { margin:5px 0px 0px 3px; padding:0px;} /*end - a.box-inner-width-advanceCon ----------------------------------------------------------------*/ /*start - .dropdown.dec-btn-dropDown --------------------------------------------------------------------------------------*/ .dropdown.dec-btn-dropDown { margin:0px; margin-right:5px; padding:0px;} .dropdown.dec-btn-dropDown a.btn.dropdown-toggle { color:#595959; background-color:#FFFFFF; border-color:#ced4da;} .dropdown.dec-btn-dropDown a.btn.dropdown-toggle::after { display:inline-block; position:relative; top:50%; right: 0px; transform:translateY(-50%); color:#595959; background-color:#FFFFFF; border-color:#ced4da; margin-left:0.255em; vertical-align:0.255em; content:""; border-top:0.3em solid; border-right:0.3em solid transparent; border-bottom:0; border-left:0.3em solid transparent;} .dropdown.dec-btn-dropDown .dropdown-menu { background: #FFFFFF; border:0px; font-family: 'Noto Sans TC', sans-serif; text-align:left; margin-top:0px; margin-left:4px; width:200px; min-width:110px; border-radius:0.25rem;} .dropdown.dec-btn-dropDown.dec-Assign { width:calc(50% - 0px); margin:0px; margin-right:5px; padding:0px;} .dropdown.dec-btn-dropDown.dec-Assign a.btn.dropdown-toggle { width:calc(100% - 0px); color:#595959; background-color:#FFFFFF; border-color:#ced4da; text-align:left;} .dropdown.dec-btn-dropDown.dec-Assign a.btn.dropdown-toggle.dec-position-01::after { float:right;} .dropdown.dec-btn-dropDown.dec-Assign .dropdown-menu { width:calc(100% - 0px); background:#FFFFFF; border:0px; font-family: 'Noto Sans TC', sans-serif; text-align:left; margin-top:0px; margin-left:4px; min-width:110px; border-radius:0.25rem;} .dropdown.dec-btn-dropDown .dropdown-menu .dropdown-item { background:transparent; color:#595959;} .dropdown.dec-btn-dropDown .dropdown-menu .dropdown-item, .dropdown.dec-btn-dropDown .dropdown-menu .dropdown-item:hover { cursor:pointer; padding:8px 5px;} .dropdown.dec-btn-dropDown .dropdown-menu .dropdown-item { color:#FFFFFF; border-bottom:1px solid #776744;} .dropdown.dec-btn-dropDown .dropdown-menu .dropdown-item:hover { background-image:repeating-linear-gradient(to right,#ebebeb 0%, #ebebeb 100%); color:#FFFFFF; border-bottom:1px solid #5b4d2f;} .dropdown.dec-btn-dropDown .dropdown-menu .dropdown-item:last-child, .dropdown.dec-btn-dropDown .dropdown-menu .dropdown-item:last-child:hover { border-bottom:0px solid #ebebeb; color:#595959;} .dropdown.dec-btn-dropDown .dropdown-menu .dec-sort { width:calc(100% - 0px); margin:0px; padding:5px 5px 0px 5px; color:#999999; font-size:14px; font-style:italic; border-bottom:1px solid #ebebeb;} /*end - .dropdown.dec-btn-dropDown --------------------------------------------------------------------------------------*/ /*start - .missionM_Logistics_ConTop --------------------------------------------------------------------------------------*/ .missionM_Logistics_ConTop { width:calc(100% + 30px); margin:0px -15px 0px -15px; padding:15px; background:#787878; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .missionM_Logistics_ConTop .box-con { margin:0px; padding:0px 5px 0px 0px; max-width:calc(15% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .missionM_Logistics_ConTop.dec-missionM_Freight .box-con { max-width: calc(20% - 0px); margin-right:15px;} .missionM_Logistics_ConTop.dec-missionM_Freight .box-con:nth-child(2) { margin-left:auto;} .missionM_Logistics_ConTop.dec-missionM_Freight .box-con:nth-child(5) { margin-right:auto;} .missionM_Logistics_ConTop .box-con a, .missionM_Logistics_ConTop .box-con a:hover { width:auto;} .missionM_Logistics_ConTop .box-con a .dec-ic {} .missionM_Logistics_ConTop .box-con a .dec-type {} .missionM_Logistics_ConTop .box-con .dec-subTitle { width:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; color:#CCCCCC; font-size:12px;} .missionM_Logistics_ConTop .box-con .dec-content { width:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap; color:#FFFFFF; font-size:1rem;} .missionM_Logistics_ConTop .box-con.dec-01 { width:170px; min-width:170px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .missionM_Logistics_ConTop .box-con.dec-01 .dec-title { margin:0px; padding:10px 0px 0px 10px; font-size:1.5rem; line-height:1.7rem; color:#FFFFFF;} /*end - .missionM_Logistics_ConTop --------------------------------------------------------------------------------------*/ /*start - .main-area.dec-missionM_Logistics --------------------------------------------------------------------------------------*/ .main-area.dec-missionM_Logistics { height:calc(100% - 0px); overflow:hidden;} .main-area.dec-missionM_Logistics .con-container { height:calc(100% - 50px); overflow:hidden;} .main-area.dec-missionM_Logistics .con-container .con-main { height:calc(100% - 77px); overflow:hidden;} .main-area.dec-missionM_Logistics .con-container .con-main .tab-content.dec-con-03.dec-missionM_Logistics { margin:0px; background:transparent; overflow-x:hidden; overflow-y:auto; width:calc(100% - 0px); height:calc(100% - 70px); color:#595959; padding:0px; overflow:hidden;} .main-area.dec-missionM_Logistics .con-container .con-main .tab-content.dec-con-03.dec-missionM_Logistics > .active { height:calc(100% - 70px);} .main-area.dec-missionM_Logistics .con-container .con-main .tab-content.dec-con-03.dec-missionM_Logistics > .active.dec-withTable .box-con-a03 { height:calc(100% - 0px); overflow:hidden;} .main-area.dec-missionM_Logistics .con-container .con-main .tab-content.dec-con-03.dec-missionM_Logistics .box-con-a03 { height:calc(100% - 0px); overflow-y:auto; display: block !important;} .main-area.dec-missionM_Logistics .con-container .con-main .tab-content.dec-con-03.dec-missionM_Logistics .box-con-a03.dec-overflow-01 { height:auto; overflow-y:auto;} .main-area.dec-missionM_Logistics .con-container .con-main .tab-content.dec-con-03.dec-missionM_Logistics .box-con-a03 .dec-tableArea { width:calc(100% - 0px); margin:0px; padding:0px; /*height:300px;*/} .main-area.dec-missionM_Logistics .con-container .con-main .tab-content.dec-con-03.dec-missionM_Logistics .box-con-a03 .box-conArea.dec-result-m-missionM_LogisticsDetail { height:calc(100% - 0px); overflow:hidden; margin:0px;} .main-area.dec-missionM_Logistics .con-container .con-main .tab-content.dec-con-03.dec-missionM_Logistics .bottom-table-area-a01 { height:calc(100% - 45px); font-size:1rem;} .main-area.dec-missionM_Logistics .con-container .con-main .tab-content.dec-con-03.dec-missionM_Logistics .bottom-table-area-a01 p { font-size:15px; margin:0px; color:#595959; font-weight:400; line-height:1.5rem;} .main-area.dec-missionM_Logistics .con-container .con-main .tab-content.dec-con-03.dec-missionM_Logistics .bottom-table-area-a01 p.dec-note { color:#828282; font-size:12px; font-family: 'Noto Sans TC', sans-serif; background:#ebebeb; padding:0px 3px; letter-spacing:0.02rem;} .box-conArea.dec-result-m-missionM_Logistics .table-responsive.dec-table.dec-h-01.dec-fixedTableHeader { height:calc(100% - 50px);} /*start - .main-area.dec-missionM_Logistics .con-container .box-con-a03*/ .main-area.dec-missionM_Logistics .con-container .box-con-a03 .dec-table p { color:#595959; font-size:1rem; line-height:1.5rem; margin:0px; padding:0px; font-family:'Noto Sans TC', sans-serif; font-weight:400;} .main-area.dec-missionM_Logistics .con-container .box-con-a03 .dec-table p.dec-note { color:#999999; font-size:12px; font-family: 'Noto Sans TC', sans-serif;} .main-area.dec-missionM_Logistics .con-container .box-con-a03 .dec-table a.dec-button { margin:3px 3px 2px 2px; display: block;} .main-area.dec-missionM_Logistics .con-container .box-con-a03 .dec-noData { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:5px 0px; text-align:center; color:#CCCCCC; font-size:14px; line-height:1.5rem; border-top:1px solid #CCCCCC;} .main-area.dec-missionM_Logistics .con-container .box-con-a03 .dec-noData .dec-type {} /*end - .main-area.dec-missionM_Logistics .con-container .box-con-a03*/ /*end - .main-area.dec-missionM_Logistics --------------------------------------------------------------------------------------*/ /*start - .main-area.dec-missionM_Freight --------------------------------------------------------------------------------------*/ .main-area.dec-missionM_Freight { height:calc(100% - 0px); overflow:hidden;} .main-area.dec-missionM_Freight .con-container { height:calc(100% - 50px); overflow:hidden;} .main-area.dec-missionM_Freight .con-container .con-main { height:calc(100% - 77px); overflow:hidden;} .main-area.dec-missionM_Freight .con-container .con-main .tab-content.dec-con-03.dec-missionM_Freight { margin:0px; background:transparent; overflow-x:hidden; overflow-y:auto; width:calc(100% - 0px); height:calc(100% - 70px); color:#595959; padding:0px; overflow:hidden;} .main-area.dec-missionM_Freight .con-container .con-main .tab-content.dec-con-03.dec-missionM_Freight .box-con-a03 { height:calc(100% - 0px); overflow-y:auto; display:block !important;} .main-area.dec-missionM_Freight .con-container .con-main .tab-content.dec-con-03.dec-missionM_Freight > .active { height:calc(100% - 70px);} .main-area.dec-missionM_Freight .con-container .con-main .tab-content.dec-con-03.dec-missionM_Freight > .active.dec-withTable .box-con-a03 { height:calc(100% - 0px); overflow:hidden;} .main-area.dec-missionM_Freight .con-container .con-main .tab-content.dec-con-03.dec-missionM_Freight .box-con-a03 .dec-tableArea { width:calc(100% - 0px); margin:0px; padding:0px;} .main-area.dec-missionM_Freight .con-container .con-main .tab-content.dec-con-03.dec-missionM_Freight .box-con-a03 .box-conArea.dec-result-m-missionM_FreightDetail { height:calc(100% - 0px); overflow:hidden; margin:0px;} .main-area.dec-missionM_Freight .con-container .con-main .tab-content.dec-con-03.dec-missionM_Freight .box-con-a03 .box-conArea.dec-result-m-missionM_FreightDetail p { font-size:15px; margin:0px; color:#595959; font-weight:400; line-height:1.5rem;} .main-area.dec-missionM_Freight .con-container .con-main .tab-content.dec-con-03.dec-missionM_Freight .box-con-a03 .box-conArea.dec-result-m-missionM_FreightDetail p.dec-note { color:#828282; font-size:12px; font-family: 'Noto Sans TC', sans-serif; background:#ebebeb; padding:0px 3px; letter-spacing:0.02rem;} .box-conArea.dec-result-m-missionM_Freight .table-responsive.dec-table.dec-h-01.dec-fixedTableHeader { height:calc(100% - 50px);} /*start - .main-area.dec-missionM_Freight .con-container .box-con-a03*/ .main-area.dec-missionM_Freight .con-container .box-con-a03 .dec-table p { color:#595959; font-size:1rem; line-height:1.5rem; margin:0px; padding:0px; font-family:'Noto Sans TC', sans-serif; font-weight:400;} .main-area.dec-missionM_Freight .con-container .box-con-a03 .dec-table p.dec-note { color:#999999; font-size:12px; font-family: 'Noto Sans TC', sans-serif; background:#ebebeb; padding:0px 3px;} .main-area.dec-missionM_Freight .con-container .box-con-a03 .dec-table a.dec-button { margin:3px 3px 2px 2px; display: block;} .main-area.dec-missionM_Freight .con-container .box-con-a03 .dec-noData { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:5px 0px; text-align:center; color:#CCCCCC; font-size:14px; line-height:1.5rem;} .main-area.dec-missionM_Freight .con-container .box-con-a03 .dec-noData .dec-type {} /*end - .main-area.dec-missionM_Freight .con-container .box-con-a03*/ /*end - .main-area.dec-missionM_Freight --------------------------------------------------------------------------------------*/ /*start - dec-situationRoom｜戰情室 ---------------------------------------------------------------------------------------------------------------------------------*/ .main-area .con-container.dec-situationRoom { width:calc(100% - 0px); height:calc(100% - 50px); margin:0px; padding:0px 15px 25px 15px; background:transparent; position:absolute; top:50px; left:0px; overflow-x:hidden; overflow-y:auto; background-color:rgba(0,0,0,0.9); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='40' viewBox='0 0 50 40'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23e7f0f2' fill-opacity='0.02'%3E%3Cpath d='M40 10L36.67 0h-2.11l3.33 10H20l-2.28 6.84L12.11 0H10l6.67 20H10l-2.28 6.84L2.11 10 5.44 0h-2.1L0 10l6.67 20-3.34 10h2.11l2.28-6.84L10 40h20l2.28-6.84L34.56 40h2.1l-3.33-10H40l2.28-6.84L47.89 40H50l-6.67-20L50 0h-2.1l-5.62 16.84L40 10zm1.23 10l-2.28-6.84L34 28h4.56l2.67-8zm-10.67 8l-2-6h-9.12l2 6h9.12zm-12.84-4.84L12.77 38h15.79l2.67-8H20l-2.28-6.84zM18.77 20H30l2.28 6.84L37.23 12H21.44l-2.67 8zm-7.33 2H16l-4.95 14.84L8.77 30l2.67-8z' /%3E%3C/g%3E%3C/g%3E%3C/svg%3E");} /*start - .main-area .con-container.dec-situationRoom .con-topBox -------------------------------------------*/ .main-area .con-container.dec-situationRoom .con-topBox { border-bottom:1px solid #020100; margin:auto; margin-top:1rem; margin-bottom:1rem;} .main-area .con-container.dec-situationRoom .con-topBox .con-topBox-title { color:#FFFFFF;} .main-area .con-container.dec-situationRoom .con-topBox .con-topBox-title .dec-ic-situationRoom-01 { margin:0px 5px; padding:0px; position:absolute; position:relative; left:0px; top:0px; width:30px; height:20px; overflow:hidden; background:transparent;} .main-area .con-container.dec-situationRoom .con-topBox .con-topBox-title .dec-ic-situationRoom-01 .dec-ic-01 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:14px;} .main-area .con-container.dec-situationRoom .con-topBox .con-topBox-title .dec-ic-situationRoom-01 .dec-ic-02 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:20px;} /*end - .main-area .con-container.dec-situationRoom .con-topBox -------------------------------------------*/ /*start - .dec-ic-situationRoom -------------------------------------------*/ .dec-ic-situationRoom { padding:0px; position:absolute; position:relative; left:0px; top:0px; width:30px; height:18px; overflow:hidden; background:transparent;} .dec-ic-situationRoom .dec-ic-01 { color:#FFFFFF; padding:0px; position:absolute; left:10px; top:5px; font-size:12px;} .dec-ic-situationRoom .dec-ic-02 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:10px; font-size:16px;} /*end - .dec-ic-situationRoom -------------------------------------------*/ /*start - .main-area .con-container.dec-situationRoom .con-main*/ .main-area .con-container.dec-situationRoom .con-main { width:calc(100% - 0px); margin:0px; padding:0px; background:transparent; text-align:center;} .main-area .con-container.dec-situationRoom .con-main .dec-situationRoom-box { width:calc(100% - 0px); margin:0px auto; padding:0px; min-height:200px; margin-bottom:15px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} /*end - .main-area .con-container.dec-situationRoom .con-main*/ /*start - .dec-situationRoom-box .dec-situationRoom-item -------------------------------------------*/ .dec-situationRoom-box .dec-situationRoom-item { width:calc(50% - 10px); padding:15px; border-radius:1rem; height:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important;} .dec-situationRoom-box .dec-situationRoom-item:nth-child(odd) { margin:10px 20px 10px 0px;} .dec-situationRoom-box .dec-situationRoom-item:nth-child(even) { margin:10px 0px 10px 0px;} .dec-situationRoom-box .dec-situationRoom-item:nth-child(1), .dec-situationRoom-box .dec-situationRoom-item:nth-child(2) { margin-top:0px;} .dec-situationRoom-box .dec-situationRoom-item .dec-wholeBox { width:calc(100% - 0px); max-width:700px; margin:0px; margin:auto; padding:0px; display: -ms-flexbox !important; display: flex !important;} /*start - .dec-situationRoom-box .dec-situationRoom-item.dec-style01 -------------------------------------------*/ .dec-situationRoom-box .dec-situationRoom-item.dec-style01 { background-image: repeating-linear-gradient(to right,#29aecc 0%, #008BAC 100%); color:#FFFFFF; height:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01.dec-color-01 { background-image: repeating-linear-gradient(to right,#f15a24 0%, #c1272d 100%); } .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-con-L { width:calc(40% - 0px); height:calc(100% - 0px); margin:0px; margin-right:auto; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-con-R { width:calc(60% - 10px); height:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; border-left: 1px solid #008BAC; min-height:228px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01.dec-color-01 .dec-con-R { border-left: 1px solid #c1272d;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-titleArea { width:calc(100% - 0px); margin:0px; padding:0px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-titleArea .dec-type { font-size:1.3rem; line-height:1.5rem; letter-spacing:0.2rem; margin:0px; padding:5px 0px 10px 0px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numArea { width:calc(100% - 0px); margin:0px; padding:0px; margin-bottom: auto !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numArea .dec-num { font-size:4rem; line-height: 4rem; margin:0px; padding:5px 0px 10px 0px; width:calc(100% - 0px); font-weight:500;} /*.dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numArea .dec-num::after { content:' \0025'; margin:0px; padding:0px;}*/ .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numDetail { width:calc(100% - 0px); margin:0px; padding:0px; margin-top: auto !important; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numDetail .dec-numItem { width:calc(50% - 5px); margin:5px 5px 5px 0px; padding:0px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numDetail .dec-numItem:nth-child(odd) { margin-right:auto;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numDetail .dec-numItem:nth-child(odd).dec-01 { margin:auto;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numDetail .dec-numItem:nth-child(even) { margin-right:0px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numDetail .dec-numItem:nth-child(1), .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numDetail .dec-numItem:nth-child(2) { margin-top:0px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numDetail .dec-numItem .dec-type { width:calc(100% - 0px); margin:0px; padding:5px; font-size:12px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-numDetail .dec-numItem .dec-num { width:calc(100% - 0px); margin:0px; padding:0px; font-size:2rem; font-weight:500;} .dec-situationRoom-box .dec-situationRoom-item.dec-style01 .dec-chartArea { width:calc(100% - 0px); margin:0px; padding:0px;} /*end - .dec-situationRoom-box .dec-situationRoom-item.dec-style01 -------------------------------------------*/ /*start - .dec-situationRoom-box .dec-situationRoom-item.dec-style02 -------------------------------------------*/ .dec-situationRoom-box .dec-situationRoom-item.dec-style02 { color:#FFFFFF; height:calc(100% - 0px); background-image: repeating-linear-gradient(to right,#333333 0%, #222222 100%); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .topArea { width:calc(100% - 0px); margin:0px; padding:0px 5px 10px 10px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .conArea { width:calc(100% - 0px); margin:0px; padding:0px; text-align:left; position:relative; min-height:310px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .topArea .dec-title { font-size:1.3rem; line-height:1.5rem; margin:0px; padding:5px 0px; color:#FFFFFF;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .topArea .dec-time { font-size:1.2rem; line-height:1.5rem; margin:0px; padding:5px 0px; color:#b7b7b7;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .topArea .dec-selection { margin:0px; padding:0px; margin-right:auto; margin-left:15px; width:150px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .conArea .mapArea { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; height:calc(100% - 0px); position:absolute; background:transparent; border-radius:5px; top:0px; left:0px; z-index:2;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .conArea .dec-btn-ZoomIn { margin:0px; padding:0px; bottom:-5px; right:0px; background:transparent; position:absolute; z-index:3; width:45px; height:45px; overflow:hidden;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .conArea .dec-btn-ZoomIn a, .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .conArea .dec-btn-ZoomIn a:hover { margin:0px; padding:0px; border-radius:5px; display:block; width:calc(100% - 0px); height:calc(100% - 0px); text-decoration:none; border:1px solid #020100;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .conArea .dec-btn-ZoomIn a { background:#333333;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .conArea .dec-btn-ZoomIn a:hover { background:#303030;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .conArea .dec-btn-ZoomIn a .dec-ic, .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .conArea .dec-btn-ZoomIn a:hover .dec-ic { color:#ebebeb; margin:12px 13px; padding:0px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .conArea .chartArea { width:calc(100% - 0px); max-width:625px; margin:10px 0px 0px 0px; margin:auto; padding:0px; background:transparent;} /*end - .dec-situationRoom-box .dec-situationRoom-item.dec-style02 -------------------------------------------*/ /*start - .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea -------------------------------------------*/ .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea { width:calc(100% - 0px); margin:0px; padding:0px; min-height:310px; font-size:1rem; line-height:1.5rem; color:#FFFFFF;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea { width:calc(100% - 0px); margin:0px; padding:0px; border-top:1px solid #595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea:hover { background:#404040;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea:first-child { border-top:0px; margin-top:0px; font-weight:500;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea:first-child:hover { background:transparent;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea .dec-listItem { margin:0px; padding:3px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea .dec-listItem:first-child { margin-right: auto; margin-right:5px; padding-left:5px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea .dec-listItem:nth-child(2) { width:100px; margin-left:auto; margin-right:5px; -ms-flex-pack: end !important; justify-content: flex-end !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea .dec-listItem:nth-child(3) { width:100px; margin-right:5px; -ms-flex-pack: end !important; justify-content: flex-end !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea .dec-listItem:nth-child(4) { width:70px; text-align:right; padding-right:5px; -ms-flex-pack: end !important; justify-content: flex-end !important;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea .dec-percentage { font-size:12px; line-height:14px; border-radius:5px; color:#FFFFFF; margin:0px; padding:3px 3px 4px 3px;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea .dec-percentage.dec-up { background:#e73828;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea .dec-percentage.dec-down { background:#595959;} .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea .dec-listItemArea .dec-percentage .dec-ic { margin:0px; padding:0px; color:#FFFFFF;} /*end - .dec-situationRoom-box .dec-situationRoom-item.dec-style02 .dec-listArea -------------------------------------------*/ /*end - .dec-situationRoom-box .dec-situationRoom-item -------------------------------------------*/ /*start - .con-topBox .con-topBox-breadcrumb .dec-btnPeriodArea -------------------------------------------*/ .con-topBox .con-topBox-breadcrumb .dec-btnPeriodArea { width:auto; margin:0px; padding:0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-align: center !important; align-items: center !important;} .con-topBox .con-topBox-breadcrumb .dec-btnPeriodArea .btnBox { width:auto; margin:0px; padding:0px; background:#464646; border-radius:50px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-align: center !important; align-items: center !important;} .dec-btnPeriodArea a, .dec-btnPeriodArea a:hover, .dec-btnPeriodArea a.is-active, .dec-btnPeriodArea a.is-active:hover { margin:0px; padding:7px 12px; border-radius:50px; font-size:14px; line-height:16px;} .dec-btnPeriodArea a { color:#999999; background:#464646;} .dec-btnPeriodArea a:hover { color:#CCCCCC; background:#595959;} .dec-btnPeriodArea a.is-active, .dec-btnPeriodArea a.is-active:hover { color:#212529; background:#FFFFFF;} .dec-btnPeriodArea .dec-note { font-size:14px; line-height: 14px; margin:0px 15px 0px 0px; padding:0px; color:#787878;} /*end - .con-topBox .con-topBox-breadcrumb .dec-btnPeriodArea -------------------------------------------*/ /*end - dec-situationRoom｜戰情室 ---------------------------------------------------------------------------------------------------------------------------------*/ /*start - dec-controlCenter｜行控中心 --------------------------------------------------------------------------------------*/ .main-area .con-container.dec-controlCenter { width:calc(100% - 0px); height:calc(100% - 50px); margin:0px; padding:0px 15px 25px 15px; background:transparent; position:absolute; top:50px; left:0px; overflow-x:hidden; overflow-y:auto; background-color: rgba(0,0,0,0.9); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='40' viewBox='0 0 50 40'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23e7f0f2' fill-opacity='0.02'%3E%3Cpath d='M40 10L36.67 0h-2.11l3.33 10H20l-2.28 6.84L12.11 0H10l6.67 20H10l-2.28 6.84L2.11 10 5.44 0h-2.1L0 10l6.67 20-3.34 10h2.11l2.28-6.84L10 40h20l2.28-6.84L34.56 40h2.1l-3.33-10H40l2.28-6.84L47.89 40H50l-6.67-20L50 0h-2.1l-5.62 16.84L40 10zm1.23 10l-2.28-6.84L34 28h4.56l2.67-8zm-10.67 8l-2-6h-9.12l2 6h9.12zm-12.84-4.84L12.77 38h15.79l2.67-8H20l-2.28-6.84zM18.77 20H30l2.28 6.84L37.23 12H21.44l-2.67 8zm-7.33 2H16l-4.95 14.84L8.77 30l2.67-8z' /%3E%3C/g%3E%3C/g%3E%3C/svg%3E");} /*start - .con-container.dec-controlCenter .con-topBox .con-topBox-breadcrumb*/ .con-container.dec-controlCenter .con-topBox .con-topBox-breadcrumb a { color:#CCCCCC;} .con-container.dec-controlCenter .con-topBox .con-topBox-breadcrumb a:hover { color:#ebebeb;} .con-container.dec-controlCenter .con-topBox .con-topBox-breadcrumb li.breadcrumb-item.active { color:#FFFFFF;} /*end - .con-container.dec-controlCenter .con-topBox .con-topBox-breadcrumb*/ /*start - .main-area .con-container.dec-controlCenter .con-topBox*/ .main-area .con-container.dec-controlCenter .con-topBox { border-bottom:1px solid #020100; max-width:1280px; margin:auto; margin-top:1rem; margin-bottom:1rem; background:transparent;} .main-area .con-container.dec-controlCenter .con-topBox .con-topBox-title { color:#FFFFFF;} .main-area .con-container.dec-controlCenter .con-topBox .con-topBox-title .dec-ic-controlCenter-01 { margin:0px 5px; padding:0px; position:relative; left:0px; top:0px; width:30px; height:20px; overflow:hidden; background:transparent;} .main-area .con-container.dec-controlCenter .con-topBox .con-topBox-title .dec-ic-controlCenter-01 .dec-ic-01 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:14px;} .main-area .con-container.dec-controlCenter .con-topBox .con-topBox-title .dec-ic-controlCenter-01 .dec-ic-02 { color:#FFFFFF; padding:0px; position:absolute; left:0px; top:0px; font-size:20px;} /*end - .main-area .con-container.dec-controlCenter .con-topBox*/ .main-area .con-container.dec-controlCenter .con-main { width:calc(100% - 0px); margin:0px; margin:auto; padding:0px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox { width:calc(100% - 0px); margin:0px; padding:0px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox:first-child .con-title { padding:10px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-title { width:calc(100% - 0px); margin:0px; padding:30px 10px 10px 12px; font-size:1.2rem; line-height:1.5rem; color:#FFFFFF;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea { width:calc(100% - 0px); margin:0px; padding:0px 10px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:hover { width:calc(25% - 20px); margin:23px 13px 0px 13px; padding:25px 0px; background:#595959; font-size:1rem; line-height:1.2rem; text-decoration:none; border-radius:5px; color:#FFFFFF; border:1px solid #595959; border-width:1px 0px 0px 1px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:hover { background:#464646; border-top:1px solid #595959; border-left:1px solid #333333; border-width:1px 0px 0px 1px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(1), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(2), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(3), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(4) { margin-top:0px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(1), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(5), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(9), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(13), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(17) { margin-left:0px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(4), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(8), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(12), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(16), .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox:nth-child(20) { margin-right:0px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox { margin:0px; padding:0px; background:transparent; width:60px; height:60px; overflow:hidden;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup { margin:0px; padding:0px; width:calc(100% - 0px); height:calc(100% - 0px); overflow:hidden; background:transparent; position:relative;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-a01, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-a02, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-a03, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-a04, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-b01, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-b02, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-b03, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c01, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c02, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c03, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c04, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c05, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c04a, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c05a, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c04b, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c05b, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c06, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c07, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c08, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c09, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c10, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-d01, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-d02, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-d03, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-d04, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-d05, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-e01, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-f01, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-f02, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-f03, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-f04, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-f05, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-g01, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-h01, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-h02, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-h03, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-h04, .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-i01 { position:absolute; padding:0px; color:#FFFFFF;} /*start - icon 行控中心｜營運模組｜01.最近發車班表*/ .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-a01 { margin:0px; font-size:45px; top:5px; left:2px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-a02 { margin:0px; font-size:28px; top:15px; left:34px; color:#595959;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-a03 { margin:0px; font-size:40px; top:18px; left:35px;} /*end - icon 行控中心｜營運模組｜01.最近發車班表*/ /*start - icon 行控中心｜營運模組｜02.各路線派遣班次表*/ .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-b01 { margin:0px; font-size:50px; top:0px; left:0px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-b02 { margin:0px; font-size:33px; top:23px; left:25px; color:#595959;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-b03 { margin:0px; font-size:30px; top:25px; left:28px;} /*end - icon 行控中心｜營運模組｜02.各路線派遣班次表*/ /*start - icon 行控中心｜營運模組｜03.路線圖*/ .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c01 { margin:0px; font-size:18px; top:1px; left:5px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c02 { margin:0px; font-size:28px; top:6px; left:36px; -webkit-transform: rotate(-90deg); transform: rotate(-90deg);} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c03 { margin:0px; font-size:28px; top:25px; left:4px; -webkit-transform: rotate(90deg); transform: rotate(90deg);} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c04 { margin:0px; font-size:14px; top:22px; left:24px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c05 { margin:0px; font-size:10px; top:24px; left:27px; color: #595959;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c04a { margin:0px; font-size:14px; top:5px; left:34px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c05a { margin:0px; font-size:10px; top:7px; left:36px; color: #595959;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c04b { margin:0px; font-size:14px; top:40px; left:12px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c05b { margin:0px; font-size:10px; top:42px; left:14px; color: #595959;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c06 { margin:0px; font-size:27px; top:-2px; left:17px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c07 { margin:0px; font-size:27px; top:35px; left:19px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c08 { margin:0px; font-size:22px; top:37px; left:36px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c09 { margin:0px; font-size:16px; top:40px; left:39px; color:#595959;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-c10 { margin:0px; font-size:10px; top:43px; left:42px;} /*end - icon 行控中心｜營運模組｜03.路線圖*/ /*start - icon 行控中心｜營運模組｜04.3D圖台*/ .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-d01 { margin:0px; font-size:35px; top:8px; left:12px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-d02 { margin:0px; font-size:28px; top:24px; left:2px; -webkit-transform: rotate(230deg); transform: rotate(230deg);} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-d03 { margin:0px; font-size:28px; top:24px; left:28px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-d04 { margin:0px; font-size:30px; top:10px; left:14px; color:#595959; -webkit-transform: rotate(180deg); transform: rotate(180deg);} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-d05 { margin:0px; font-size:30px; top:16px; left:20px; color:#595959; -webkit-transform: rotate(45deg); transform: rotate(45deg);} /*end - icon 行控中心｜營運模組｜04.33D圖台*/ /*start - icon 行控中心｜營運模組｜05.公車車輛現況*/ .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-e01 { margin:0px; font-size:50px; top:4px; left:4px;} /*end - icon 行控中心｜營運模組｜05.公車車輛現況*/ /*start - icon 行控中心｜營運模組｜06.智慧站牌現況*/ .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-f01 { margin:0px; font-size:26px; top:8px; left:16px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-f02 { margin:0px; font-size:26px; top:8px; left:18px; -webkit-transform: rotate(180deg); transform: rotate(180deg);} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-f03 { margin:0px; font-size:30px; top:25px; left:15px; -webkit-transform: rotate(90deg); transform: rotate(90deg);} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-f04 { margin:0px; font-size:20px; top:42px; left:19px; -webkit-transform: rotate(180deg); transform: rotate(180deg);} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-f05 { margin:0px; font-size:16px; top:13px; left:22px; color:#595959;} /*end - icon 行控中心｜營運模組｜06.智慧站牌現況*/ /*start - icon 行控中心｜營運模組｜07.監視器*/ .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-g01 { margin:0px; font-size:40px; top:8px; left:7px;} /*end - icon 行控中心｜營運模組｜07.監視器*/ /*start - icon 行控中心｜營運模組｜08.車輛戰情室*/ .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-h01 { margin:0px; font-size:35px; top:0px; left:1px;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-h02 { margin:0px; font-size:40px; top:18px; left:16px; color:#595959;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-h03 { margin:0px; font-size:15px; top:27px; left:27px; color:#595959;} .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-h04 { margin:0px; font-size:40px; top:21px; left:19px;} /*end - icon 行控中心｜營運模組｜08.車輛戰情室*/ /*start - icon 行控中心｜營運模組｜09.告警戰情室*/ .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-icBox .dec-icGroup .dec-ic-i01 { margin:0px; font-size:45px; top:5px; left:7px;} /*end - icon 行控中心｜營運模組｜09.告警戰情室*/ .main-area .con-container.dec-controlCenter .con-main .con-groupBox .con-conArea a.con-itemBox .dec-type { margin:5px 0px 0px 0px; padding:0px; color:#FFFFFF; width:calc(100% - 0px); font-size:1.2rem; line-height:1.5rem; text-align:center; font-weight:400;} .con-container.dec-controlCenter .box-con-a03 {} .con-container.dec-controlCenter .box-con-a03 .box-conArea { width:calc(100% - 0px);} .con-container.dec-controlCenter .box-con-a03 .box-conArea.dec-half { width:calc(50% - 0px); margin:auto;} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box { width:calc(100% - 0px);} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-box-outer { width:calc(100% - 0px); max-width:1280px; margin:0px; margin:auto; padding:10px 10px 30px 10px; border-radius:5px; position:relative; background:#333333; border:1px solid #464646; color:#FFFFFF;} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-type { color:#FFFFFF;} /*start - .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup*/ .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup { width:calc(100% - 0px); margin:5px 0px; padding:0px; word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem, .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem:hover { font-size:1rem; line-height:1.2rem; border:1px solid #666666; border-left:0px; border-radius:0px; background:#282828; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup.button-num-02 a.buttonGroupItem, .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup.button-num-02 a.buttonGroupItem:hover { width:calc(50% - 0px);} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup.button-num-06 a.buttonGroupItem, .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup.button-num-06 a.buttonGroupItem:hover { width:calc(20% - 0px);} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem:first-child, .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem:first-child:hover { border-left:1px solid #666666; border-radius:5px 0px 0px 5px;} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem:last-child, .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem:last-child:hover { border-radius:0px 5px 5px 0px;} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem { background:#282828; color:#787878;} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem:hover { background:#333333; color:#ebebeb;} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem.active, .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem.active:hover { background:#72bf44; color:#FFFFFF;} .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup a.buttonGroupItem:focus { background:#72bf44; color:#FFFFFF;} /*end - .con-container.dec-controlCenter .box-con-a03 .box-conArea .con-box .con-conBox .buttonGroup*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-note, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .con-note p { width:calc(100% - 0px); margin:0px; padding:0px; color:#999999; font-size:1rem; line-height:1.2rem;} /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup 行控中心｜路線圖｜版面設定 -------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup { width:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; display:block; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:hover { width:auto; height:auto !important; margin:0px; padding:0px; background:transparent; color:#787878; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:hover .innerItemBoxOuter { background:#282828; color:#787878; border:1px solid #666666; border-left:0px; border-radius:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:hover .innerItemBoxOuter { background:#333333; color:#ebebeb;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox.active .innerItemBoxOuter, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox.active:hover .innerItemBoxOuter, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:focus .innerItemBoxOuter { background:#72bf44; color:#FFFFFF;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:first-child .innerItemBoxOuter, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:first-child:hover .innerItemBoxOuter { border-left:1px solid #666666; border-radius:5px 0px 0px 5px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:last-child .innerItemBoxOuter, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:last-child:hover .innerItemBoxOuter { border-radius:0px 5px 5px 0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter { margin:0px; padding:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox { width:auto; height:50px; margin:10px; padding:0px; position:relative; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter { width:290px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:first-child .innerItemBoxOuter { width:180px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:last-child .innerItemBoxOuter { width:360px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBox.dec-note { width:calc(100% - 0px); height:auto; text-align:center;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:focus .innerItemBox.dec-note, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox.active .innerItemBox.dec-note, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox:hover .innerItemBox.dec-note { color:#ebebeb;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle { margin:0px; padding:0px; font-size:18px; position:absolute;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line { margin:0px; padding:0px; font-size:28px; position:absolute;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-vLine { margin:0px; padding:0px; font-size:28px; position:absolute; -webkit-transform: rotate(90deg); transform: rotate(90deg);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-01 { top:0px; left:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-02 { top:0px; left:35px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-03 { top:0px; left:70px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-04 { top:0px; left:105px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-05 { top:0px; left:140px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-06 { top:0px; left:175px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-07 { top:0px; left:210px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-08 { top:0px; left:245px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-09 { top:0px; left:280px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-10 { top:0px; left:315px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line.p-01 { top:-4px; left:14px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line.p-02 { top:-4px; left:49px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line.p-03 { top:-4px; left:84px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line.p-04 { top:-4px; left:119px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line.p-05 { top:-4px; left:154px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line.p-06 { top:-4px; left:189px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line.p-07 { top:-4px; left:224px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line.p-08 { top:-4px; left:259px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line.p-09 { top:-4px; left:294px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-vLine.p-L { top:10px; left:-3px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-vLine.p-R { top:10px; left:137px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-vLine.p-R02 { top:10px; left:242px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-vLine.p-R03 { top:10px; left:312px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-cicle.p-b { top:30px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup a.route-layoutItemBox .innerItemBoxOuter .innerItemBox .dec-ic-line.p-b { top:26px;} /*end - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .route-layoutGroup 行控中心｜路線圖｜版面設定 -------------------------------------*/ /*start - .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup 行控中心｜戰情室｜版面設定 -------------------------------------*/ .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup { width:calc(100% - 0px); margin:0px; padding:5px 0px 10px 0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:hover { width:auto; width:calc((100%/3) - 7px); height:150px !important; margin:10px 0px 0px 10px; padding:0px; background:transparent; color:#787878; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:hover { background:#424242;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:nth-child(1), .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:nth-child(2), .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:nth-child(3) { margin-top:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:nth-child(1), .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:nth-child(4), .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:nth-child(7) { margin-left:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:nth-child(3), .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:nth-child(6), .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:nth-child(9) { margin-right:0px;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; background:transparent; border:1px solid #CCCCCC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox { margin:0px; padding:0px; border:0px; text-align:center; font-size:1.2rem; line-height: 1.5rem; color:#FFFFFF; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-a01 { width:calc(50% - 0px); height:calc(50% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-a02 { width:calc(50% - 1px); height:calc(50% - 0px); border-left:1px solid #CCCCCC;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-a03 { width:calc(50% - 0px); height:calc(50% - 1px); border-top:1px solid #CCCCCC;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-a04 { width:calc(50% - 1px); height:calc(50% - 1px); border-left:1px solid #CCCCCC; border-top: 1px solid #CCCCCC;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-b01 { width:calc(50% - 0px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-b02 { width:calc(50% - 1px); height:calc(100% - 0px); border-left:1px solid #CCCCCC;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-c01 { width:calc(50% - 0px); height:calc(50% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-c02 { width:calc(50% - 1px); height:calc(50% - 0px); border-left:1px solid #CCCCCC;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-c03 { width:calc(100% - 0px); height:calc(50% - 1px); border-top:1px solid #CCCCCC;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-d01 { width:calc(100% - 0px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-e01 { width:calc(100% - 0px); height:calc(100% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-f01 { width:calc(50% - 0px); height:calc(50% - 0px);} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-f02 { width:calc(50% - 1px); height:calc(50% - 0px); border-left:1px solid #CCCCCC;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox .div-innerBox .layoutBox.dec-f03 { width:calc(100% - 0px); height:calc(50% - 1px); border-top:1px solid #CCCCCC;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox.active .div-innerBox, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox.active:hover.div-innerBox, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:focus .div-innerBox, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:focus:hover.div-innerBox{ border:3px solid #5dc1cf;} .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox.active .div-innerBox .layoutBox, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox.active:hover .div-innerBox .layoutBox, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:focus .div-innerBox .layoutBox, .con-container .box-con-a03 .box-conArea .con-box .con-conBox .situationRoom-layoutGroup a.situationRoom-layoutItemBox:focus:hover .div-innerBox .layoutBox{ color:#5dc1cf; border-color:#5dc1cf;} /*end - dec-controlCenter｜行控中心 --------------------------------------------------------------------------------------*/ /*start - .box-legendInfo-coldChain ------------------------------------------------------------------------------------------*/ .box-legendInfo-coldChain { width:auto; margin-right:25px; padding:0px; margin-left:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-align: center !important; align-items: center !important;} .box-legendInfo-coldChain .con-legendInfo { width:10px; height:16px; margin:0px 3px 0px 0px; padding:0px;} .box-legendInfo-coldChain .con-legendInfo.dec-coldChain-01 { background:#ff0000; background:rgba(255, 0, 0, 1);} .box-legendInfo-coldChain .con-legendInfo.dec-coldChain-02 { background:#f7931e; background:rgba(247, 147, 30, 1);} .box-legendInfo-coldChain .con-legendInfo.dec-coldChain-03 { background:#f9bd00; background:rgba(249, 189, 0, 1);} .box-legendInfo-coldChain .con-legendInfo.dec-coldChain-04 { background:#578bff; background:rgba(87, 139, 255, 1);} .box-legendInfo-coldChain .dec-type { width:auto; margin: 0px 10px 0px 0px; padding:0px;} /* [統計分析｜冷鏈圖表] 1.危險｜#ff0000｜(255, 0, 0)｜dec-coldChain-01 2.警告｜#f7931e｜(247, 147, 30)｜dec-coldChain-02 3.注意｜#f9bd00｜(249, 189, 0)｜dec-coldChain-03 4.正常｜#578bff｜(87, 139, 255)｜dec-coldChain-04 */ /*[統計分析｜冷鏈圖表]：危險 dec-coldChain-01、警告 dec-coldChain-02、注意 dec-coldChain-03、正常 dec-coldChain-04*/ /*end - .box-legendInfo-coldChain ------------------------------------------------------------------------------------------*/ /*start - .con-container-missionM_Info ---------------------------------------------------------------*/ .con-container.dec-missionM_Info { height:calc(100% - 0px); background:#595959;} .con-container-missionM_Info { width:calc(100% - 0px); margin:0px; margin:auto; margin-top:15px; padding:5px 25px 25px 25px; border-radius:12px; background:#FFFFFF; max-width:1024px; color:#595959; box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.05);} .con-container-missionM_Info .dec-title { font-size:2rem; line-height:2.5rem; margin:0px; padding:25px 0px 20px 0px; width:calc(100% - 0px); letter-spacing:0.15rem; font-weight:300;} /*start - .con-container-missionM_Info .listGroup*/ .con-container-missionM_Info .listGroup { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container-missionM_Info .listGroup .listItemGroup { width:auto; margin:0px 0px 0px 2px; padding: 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container-missionM_Info .listGroup .listItemGroup:nth-child(1) { width:40px; margin:0px;} .con-container-missionM_Info .listGroup .listItemGroup:nth-child(2) { width:calc(16% - 10px);} .con-container-missionM_Info .listGroup .listItemGroup:nth-child(3) { width:calc(18% - 10px);} .con-container-missionM_Info .listGroup .listItemGroup:nth-child(4) { width:calc(22% - 10px);} .con-container-missionM_Info .listGroup .listItemGroup:nth-child(5) { width:calc(16% - 10px);} .con-container-missionM_Info .listGroup .listItemGroup:nth-child(6) { width:calc(28% - 10px);} .con-container-missionM_Info .listGroup .listItemGroup .dec-groupnote { width:calc(100% - 0px); font-size:1rem; color:#999999; line-height:1.2rem; text-align:center; margin:0px; padding:0px;} .con-container-missionM_Info .listGroup .listItemGroup .dec-groupnote:nth-child(2) { width:calc(100% - 0px); font-size:1rem; color:#999999; line-height:1.2rem; text-align:center; margin:50px 0px 0px 0px; padding:0px;} .con-container-missionM_Info .listGroup .listItemGroup .dec-conditionArea { margin:0px; padding:0px; width:auto; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .con-container-missionM_Info .listGroup .listItemGroup .dec-conditionArea .dec-condition { color:#FFFFFF; word-break:keep-all; height:34px; overflow-y:hidden; text-decoration:none; margin:0px; padding:0px; min-width:90px; font-size:1rem; background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .con-container-missionM_Info .listGroup .listItemGroup .dec-conditionArea .dec-condition .dec-type { font-size:1.2rem; margin:0px; padding:5px; color:#FFFFFF; word-break:keep-all; height:34px; overflow-y:hidden; background:#595959;} .con-container-missionM_Info .listGroup .listItemGroup .dec-conditionArea .dec-condition .dec-svg { fill:#595959;} .con-container-missionM_Info .listGroup .listItemGroup .dec-arrowArea { width:calc(100% - 0px); height:30px; margin:5px 0px; padding:0px; position:relative; overflow:hidden;} .con-container-missionM_Info .listGroup .listItemGroup .dec-arrowArea .dec-circle { width:24px; height:24px; border-radius:25px; background:#fafafa; margin:0px; padding:0px; position:absolute; top:3px; left:3px; z-index:3; display:inline-block;} .con-container-missionM_Info .listGroup .listItemGroup .dec-arrowArea .dec-circle-outline { width:30px; height:30px; border-radius:25px; background:#999999; margin:0px; padding:0px; position:absolute; top:0px; left:0px; z-index:2; display:inline-block;} .con-container-missionM_Info .listGroup .listItemGroup .dec-arrowArea .dec-hLine { width:calc(100% - 30px); height:3px; border-radius:25px; background:#999999; margin:0px 4px 0px 29px; padding:0px; position:absolute; top:15px; left:0px; z-index:1; display:inline-block;} .con-container-missionM_Info .listGroup .listItemGroup .dec-arrowArea .dec-svg { margin:0px; padding:0px; position:absolute; right:0px; top:6px; fill:#999999;} .con-container-missionM_Info .listGroup .listItemGroup .dec-conArea { width:calc(100% - 0px); margin:5px 0px; padding:0px; position:relative;} .con-container-missionM_Info .listGroup .listItemGroup .dec-conArea .dec-subTitle { font-size:1.2rem; line-height:1.5rem; margin:0px; padding:0px 0px 5px 0px; width:calc(100% - 0px);} .con-container-missionM_Info .listGroup .listItemGroup .dec-conArea .dec-con { font-size:1rem; line-height:1.2rem; margin:0px; padding:0px 0px; width:calc(100% - 0px); color:#999999;} /*start - .con-container-missionM_Info .listGroup.dec-dashed --------------------------------------*/ .con-container-missionM_Info .listGroup.dec-dashed { border-bottom:1px solid #CCCCCC; padding-bottom:15px;} .con-container-missionM_Info .listGroup.dec-dashed .listItemGroup .dec-arrowArea { width:calc(100% - 0px); height:60px; margin:0px 0px 5px 0px; padding:0px; position:relative; overflow:hidden;} .con-container-missionM_Info .listGroup.dec-dashed .listItemGroup .dec-arrowArea .dec-circle { width:24px; height:24px; border-radius:25px; background:#fafafa; margin:0px; padding:0px; position:absolute; top:33px; left:3px; z-index:3; display:inline-block;} .con-container-missionM_Info .listGroup.dec-dashed .listItemGroup .dec-arrowArea .dec-circle-outline { width:30px; height:30px; border-radius:25px; background:#999999; margin:0px; padding:0px; position:absolute; top:30px; left:0px; z-index:2; display:inline-block;} .con-container-missionM_Info .listGroup.dec-dashed .listItemGroup .dec-arrowArea .dec-vDashedLine { height:45px; width:10px; border-style:dashed; border-width:0px 0px 0px 3px; border-color:#999999; margin-left:8px;} .con-container-missionM_Info .listGroup.dec-dashed .listItemGroup .dec-arrowArea .dec-hDashedLine { width:calc(100% - 0px); height:10px; border-radius:0px; background:transparent; padding:0px; position:absolute; top:37px; left:0px; z-index:1; display:inline-block; border-style:dashed; border-width:0px 0px 3px 0px; border-color:#999999;} .con-container-missionM_Info .listGroup.dec-dashed .listItemGroup .dec-arrowArea .dec-hDashedLine.dec-m01 { margin:0px 0px 3px 11px;} .con-container-missionM_Info .listGroup.dec-dashed .listItemGroup .dec-arrowArea .dec-svg { margin:0px; padding:0px; position:absolute; left:0px; top:0px; fill:#999999;} /*end - .con-container-missionM_Info .listGroup.dec-dashed --------------------------------------*/ /*end - .con-container-missionM_Info .listGroup*/ /*start - .con-container-missionM_Info .crewListGroupArea*/ .con-container-missionM_Info .crewListGroupArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container-missionM_Info .crewListGroupArea .crewListGroupArrow { width:24px; height:750px; margin:0px 10px; padding:0px; position:relative; overflow:hidden;} .con-container-missionM_Info .crewListGroupArea .crewListGroupArrow .dec-vLine { width:4px; height:calc(100% - 40px); margin:35px 10px 0px 10px; padding:0px; background:#CCCCCC; position:absolute;} .con-container-missionM_Info .crewListGroupArea .crewListGroupArrow .dec-svg { margin:0px; padding:0px; right:0px; bottom:0px; fill:#CCCCCC; position:absolute;} .con-container-missionM_Info .crewListGroupArea .crewListGroup { width:calc(50% - 10px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} /*start - .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL*/ .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL { width:calc(100% - 150px); margin:0px; padding:0px;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup:nth-child(1) { margin:0px;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-listItemGroup { width:100px; margin:0px; padding:0px;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-listItemGroup:nth-child(1) { width:80px;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-listItemGroup:nth-child(2) { width:125px;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-listItemGroup:nth-child(3) { width:calc(100% - 210px);} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-type-title { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1.2rem; font-weight:500; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-type-con { width:calc(100% - 0px); margin:0px; padding:0px; font-weight:400; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-type-con:hover { background:#f0f0f0;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-conditionArea { width:calc(100% - 0px); margin:0px; padding:0px;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-condition { margin:0px; color:#FFFFFF; word-break:keep-all; height:24px; overflow-y:hidden; position:relative; text-decoration:none; padding:0px; font-size:1rem; background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-condition .dec-type { font-size:12px; margin:0px; padding:1px 5px; color:#FFFFFF; word-break:keep-all; height:24px; overflow-y:hidden; background:#999999; position:absolute; left:10px;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-condition .dec-svg { fill:#999999; margin:0px; padding:0px; position:absolute; left:0px;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL .dec-listGroup .dec-condition.dec-01 { margin-top:60px;} /*end - .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaL*/ /*start - .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaR*/ .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaR { width:150px; margin:0px; padding:0px; color:#FFFFFF; background:#595959;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaR .dec-title { font-size:1rem; line-height: 1.5rem; width:calc(100% - 0px); margin:0px; padding:5px; background:#333333;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaR .dec-listGroup { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaR .dec-listGroup .dec-conL { width:80px; margin:0px; padding:2px 5px;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaR .dec-listGroup .dec-conR { width:calc(100% - 80px); margin:0px; padding:5px; color:#CCCCCC;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaR .dec-listGroup .dec-conL.dec-01 { width:100px; margin:0px; padding:5px;} .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaR .dec-listGroup .dec-conR.dec-01 { width:calc(100% - 100px); margin:0px; padding:5px; color:#CCCCCC;} /*end - .con-container-missionM_Info .crewListGroupArea .crewListGroup .dec-conAreaR*/ /*end - .con-container-missionM_Info .crewListGroupArea*/ .dashedLine-h { margin:5px 0px; padding:0px; width:calc(100% - 0px); height:5px; border-width:3px 0px 0px 0px; border-style:dashed; border-color:#999999;} /*end - .con-container-missionM_Info ---------------------------------------------------------------*/ /*start - MapTool-RoutePlan 多點路順規劃｜圖台兩側模式_可調寬度 ---------------------------------------------------------------------------------------------------------------------------------------------------*/ #map-canvas { height:100%; width:100%;} .MapTool-RoutePlan-float-left { margin-top:0px; float:left; z-index:1;} .MapTool-RoutePlan-handler_vertical { background:url("../js/resizable/img/handle-v.png") 3px 50% no-repeat; background-color:rgb(246, 246, 246); width:9px; border:1px solid silver; float:left;} #chart-panel { padding:0.6em 0em 1em 0.6em; height:100%; overflow:hidden;} #map-panel { padding:0px; margin:0px; width:calc(100% - 350px); height:calc(100vh - 89px); z-index:1;} /*start - 一般模式*/ #chart-panel.dec-Normal { display: none !important;} #map-panel.dec-Normal { width:calc(100% - 0px) !important;} .handler_vertical.dec-Normal { display:none !important;} /*end - 一般模式*/ .MapTool-FunctionBox { height:auto; margin:0px; padding:0px 0px 5px 0px; background:#FFFFFF; overflow:hidden; position:absolute; left:0px; color:#333333; border-radius:0px; z-index:1; box-shadow:0px 2px 4px rgba(0, 0, 0, .3); border:0px solid #999999;} /*start - .MapTool-FunctionBox.dec-MapTool-RoutePlan -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-MapTool-RoutePlan { margin:0px; padding:0px; background:#FFFFFF; overflow:hidden; position:absolute; left:0px; color:#333333; border-radius:0px; z-index:1; box-shadow:0px 2px 4px rgba(0, 0, 0, .3); border:0px solid #999999; width:calc(100% - 0px); height:calc(100vh - 88px); top:88px; /*z-index: 999;實際程式設定時會有衝突，所以隱藏，2022/09/13 update*/} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top { width:calc(100% - 0px); height:40px; margin:0px; padding:0px; overflow:hidden; background:#FFFFFF; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main { width:calc(100% - 0px); height:calc(100% - 40px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .default-theme.splitpanes--vertical > .splitpanes__splitter, .default-theme .splitpanes--vertical > .splitpanes__splitter { width:9px; border-left:1px solid silver; border-right:1px solid silver; margin-left:-1px; background-color:rgb(246, 246, 246);} /*end - .MapTool-FunctionBox.dec-MapTool-RoutePlan -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top --------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-title, .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn { margin:0px; padding:0px; display:inline-block; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-title { width:calc(100% - 45px); margin:0px; padding:5px 5px 5px 10px; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#595959; -ms-flex-pack: start !important;justify-content: flex-start !important;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-title .dec-note { margin:0px; padding:0px 0px 0px 10px; color:#999999; font-weight:normal; letter-spacing:0rem; font-size:14px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn { width:45px; margin:0px; padding:0px; -ms-flex-pack: end !important; justify-content: flex-end !important;} /*start - .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn a*/ .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn a, .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn a:hover { margin:0px; padding:0px; text-decoration:none; width:45px; height:40px; overflow:hidden; background:transparent; position:relative;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn a .dec-ic, .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn a:hover .dec-ic { margin:8px 10px; padding:3px 3px 5px 3px; width:25px; height:25px; overflow:hidden; border-radius:0px; position:absolute; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn a .dec-ic { color:#787878;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn a:hover .dec-ic { color:#169cbf;} /*end - .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn a*/ /*start - .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon ---*/ .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon { width:90px; height:40px; overflow:hidden; background:transparent;} .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a, .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a:hover { margin:0px; padding:0px 5px 0px 3px; text-decoration:none; width:calc(100% - 0px); height:36px; overflow:hidden; background:#FFFFFF; position:relative; border-radius:5px; border:1px solid #ebebeb;} .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a:hover { background:#fafafa; background-image: repeating-linear-gradient(to right,#FFFFFF 0%, #fafafa 80%, #fafafa 100%);} .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a .dec-ic, .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a:hover .dec-ic { margin:5px 0px 5px 2px; padding:6px 3px; width:25px; height:25px; overflow:hidden; border-radius:0px; position:relative; color:#999999;} .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a:hover .dec-ic { color:#169cbf;} .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a .dec-type, .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a:hover .dec-type { font-size:14px; line-height:18px; margin:8px 0px 0px 0px; padding:0px; position:absolute; color:#999999; display:inline-block;} .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a:hover .dec-type { color:#787878;} .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a.dec-btn-normalScreen .dec-ic, .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon a.dec-btn-normalScreen:hover .dec-ic { margin-left:9px;} /*end - .MapTool-FunctionBox .box-inner.div-box-inner.dec-MapTool-RoutePlan .con-top .con-top-btn.dec-btnWithIcon ---*/ /*end - .div-box-inner.dec-MapTool-RoutePlan .box-inner .con-top .con-top-btn.dec-btn-withIcon a*/ /*end - .div-box-inner.dec-MapTool-RoutePlan .box-inner .con-top --------------------------------------------------------------------------------------*/ .dec-whole { width:calc(100% - 0px);} .div-MapTool-RoutePlan-Multiple { background:#FFFFFF;} /*div｜多點路順規劃*/ .div-MapTool-RoutePlan-Delivery { background:#FFFFFF;} /*div｜配送路線規劃*/ /*start - .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner ---------------------------------------------------------*/ .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea { width:calc(100% - 10px); margin:0px 5px; padding:5px 0px 5px 0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea.dec-border { border-top:1px solid #e6e6e6;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea.dec-subCon { padding:0px 0px 5px 15px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label .dec-type { margin:0px; padding:10px 0px 5px 0px; display: inline-block;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label a.dec-btn, .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label a.dec-btn:hover { text-decoration:underline !important; margin:0px; padding:10px 5px 5px 5px; float:right; display:inline-block;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label a.dec-btn { color:#169cbf;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label a.dec-btn:hover { color:#29aecc;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole input { margin:0px; padding:5px 0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea .dec-subTitle { width:calc(100% - 0px); margin:0px; padding:10px 0px 5px 0px; font-weight:500; font-size:15px; line-height:18px; border-bottom:1px solid #e6e6e6;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea .dec-typeArea { width:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea .dec-typeArea.dec-padding { padding-top:5px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea .dec-conWhole { width:calc(100% - 10px); margin:0px; padding:5px 0px 5px 0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-noteArea { width:calc(100% - 10px); margin:0px 5px; padding:5px 0px 0px 0px; text-align:center;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-noteArea .dec-type { margin:0px; padding:0px; font-size:1rem; line-height:1.5rem; color:#e73828;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-btnArea { width:calc(100% - 10px); margin:0px 5px; padding:10px 0px 0px 0px;} /*end - .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner ---------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea*/ .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px 0px; overflow:hidden;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea { width:calc(100% - 0px); height:calc(100% - 50px); margin:0px; padding:0px 0px 5px 5px; overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-btnArea { width:calc(100% - 0px); height:50px; margin:5px 0px 0px 0px; padding:0px 5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-btnArea .dec-btn-width-01 { width:auto; margin-left:5px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-btnArea .dec-btn-width-01:first-child { margin-left:0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-btnArea .dec-type { padding:0px 15px 0px 48px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea .dec-MapTool-RoutePlan-listArea { width:calc(100% - 0px); margin:25px 0px 0px 0px; padding:5px 0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole { } .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea { width:calc(100% - 0px); margin-right:0px; display:inline-block;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea:first-child { margin-top:0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea.dec-fullScreen { width:calc(50% - 10px); margin-right:15px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea.dec-fullScreen:nth-child(even) { margin-right:0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea.dec-fullScreen:first-child, .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea.dec-fullScreen:nth-child(even) { margin-top:0px;} /*end - .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea*/ /*start - .dec-MapTool-RoutePlan-listArea -------------------------------------------------------------------------*/ .dec-MapTool-RoutePlan-listArea:first-child { margin:0px;} .dec-MapTool-RoutePlan-listArea .dec-topCon { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .dec-MapTool-RoutePlan-listArea .dec-con { width:calc(100% - 0px); margin:0px; padding:0px;} .dec-MapTool-RoutePlan-listArea .dec-topCon .dec-title-icon { width:16px; height:16px; margin:0px 0px 0px 5px; padding:0px;} .dec-ic-Bg-Color-01 { background:#000000; background:rgba(0, 0, 0,1);} /*black*/ .dec-ic-Bg-Color-02 { background:#ff0000; background:rgba(255, 0, 0,1);} /*light red*/ .dec-ic-Bg-Color-03 { background:#ffff00; background:rgba(255, 255, 0,1);} /*yellow*/ .dec-ic-Bg-Color-04 { background:#00ff00; background:rgba(0, 255, 0,1);} /*green*/ .dec-ic-Bg-Color-05 { background:#00ffff; background:rgba(0, 255, 255,1);} /*cyan*/ .dec-ic-Bg-Color-06 { background:#0000ff; background:rgba(0, 0, 255,1);} /*medium blue*/ .dec-ic-Bg-Color-07 { background:#ff00ff; background:rgba(255, 0, 255,1);} /*magenta*/ .dec-ic-Bg-Color-08 { background:#c1272d; background:rgba(193, 39, 45,1);} /*brick red*/ .dec-ic-Bg-Color-09 { background:#ed1c24; background:rgba(237, 28, 36,1);} /*red*/ .dec-ic-Bg-Color-10 { background:#f15a24; background:rgba(241, 90, 36,1);} /*dark orange*/ .dec-ic-Bg-Color-11 { background:#f7931e; background:rgba(247, 147, 30,1);} /*orange*/ .dec-ic-Bg-Color-12 { background:#fbb03b; background:rgba(251, 176, 59,1);} /*light orange*/ .dec-ic-Bg-Color-13 { background:#fcee21; background:rgba(252, 238, 33,1);} /*yellow*/ .dec-ic-Bg-Color-14 { background:#d9e021; background:rgba(217, 224, 33,1);} /*light green*/ .dec-ic-Bg-Color-15 { background:#8cc63f; background:rgba(140, 198, 63,1);} /*grass green*/ .dec-ic-Bg-Color-16 { background:#39b54a; background:rgba(57, 181, 74,1);} /*green*/ .dec-ic-Bg-Color-17 { background:#009245; background:rgba(0, 146, 69,1);} /*green*/ .dec-ic-Bg-Color-18 { background:#006837; background:rgba(0,104, 55,1);} /*green*/ .dec-ic-Bg-Color-19 { background:#22b573; background:rgba(34, 181, 115,1);} /*green*/ .dec-ic-Bg-Color-20 { background:#00a99d; background:rgba(0, 169, 157,1);} /*teal*/ .dec-ic-Bg-Color-21 { background:#29abe2; background:rgba(41, 171, 226,1);} /*blue*/ .dec-ic-Bg-Color-22 { background:#0071bc; background:rgba(0, 113, 188,1);} /*blue*/ .dec-ic-Bg-Color-23 { background:#2e3192; background:rgba(46, 49, 146,1);} /*blue*/ .dec-ic-Bg-Color-24 { background:#1b1464; background:rgba(27, 20, 100,1);} /*dark blue*/ .dec-ic-Bg-Color-25 { background:#662d91; background:rgba(102, 45, 145,1);} /*purple*/ .dec-ic-Bg-Color-26 { background:#93278f; background:rgba(147, 39, 143,1);} /*purple*/ .dec-ic-Bg-Color-27 { background:#9e005d; background:rgba(158, 0, 93,1);} /*purple*/ .dec-ic-Bg-Color-28 { background:#d4145a; background:rgba(212, 20, 90,1);} /*red*/ .dec-ic-Bg-Color-29 { background:#ed1e79; background:rgba(237, 30, 121,1);} /*red*/ .dec-ic-Bg-Color-30 { background:#c7b299; background:rgba(199, 178, 153,1);} /*light brown*/ .dec-ic-Bg-Color-31 { background:#998675; background:rgba(153, 134, 117,1);} /*brown*/ .dec-ic-Bg-Color-32 { background:#736357; background:rgba(115, 99, 87,1);} /*brown*/ .dec-ic-Bg-Color-33 { background:#534741; background:rgba(83, 71, 65,1);} /*brown*/ .dec-ic-Bg-Color-34 { background:#c69c6d; background:rgba(198, 156, 109,1);} /*brown*/ .dec-ic-Bg-Color-35 { background:#a67c52; background:rgba(166, 124, 82,1);} /*brown*/ .dec-ic-Bg-Color-36 { background:#8c6239; background:rgba(140, 98, 57,1);} /*brown*/ .dec-ic-Bg-Color-37 { background:#754c24; background:rgba(117, 76, 36,1);} /*brown*/ .dec-ic-Bg-Color-38 { background:#603813; background:rgba(96, 56, 19,1);} /*brown*/ .dec-ic-Bg-Color-39 { background:#42210b; background:rgba(66, 33, 11,1);} /*brown*/ .dec-ic-Bg-Color-40 { background:#ee835c; background:rgba(238, 131, 92,1);} /*light red*/ .dec-ic-Bg-Color-41 { background:#f4af8f; background:rgba(244, 175, 143,1);} /*light red*/ .dec-ic-Bg-Color-42 { background:#fccf00; background:rgba(252, 207, 0,1);} /*yellow*/ .dec-ic-Bg-Color-43 { background:#b4af7d; background:rgba(180, 175, 125,1);} /*ochre*/ .dec-ic-Bg-Color-44 { background:#ddd36e; background:rgba(221, 211, 110,1);} /*green*/ .dec-ic-Bg-Color-45 { background:#bac570; background:rgba(186, 197, 112,1);} /*green*/ .dec-ic-Bg-Color-46 { background:#b7caba; background:rgba(183, 202, 186,1);} /*light green*/ .dec-ic-Bg-Color-47 { background:#50a8b4; background:rgba(80, 168, 180,1);} /*teal*/ .dec-ic-Bg-Color-48 { background:#718bc6; background:rgba(113, 139, 198,1);} /*blue*/ .dec-ic-Bg-Color-blank { background:#FFFFFF; background:rgba(255, 255, 255,1);} /*white*/ .dec-MapTool-RoutePlan-listArea .dec-topCon .dec-title-type { font-size:15px; line-height:1.5rem; color:#595959; font-weight:500; margin:0px; padding:5px;} .dec-MapTool-RoutePlan-listArea .dec-topCon .dec-title-note { font-size:15px; line-height:1.5rem; color:#999999; font-weight:400; margin:0px; padding:5px 5px 5px 15px;} .dec-MapTool-RoutePlan-listArea .dec-topCon .dec-title-note.dec-m01 { margin-left:auto;} /*end - .dec-MapTool-RoutePlan-listArea -------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table*/ .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table.dec-table { word-break:break-all; font-size:1rem; line-height:1.5rem; width:calc(100% - 0px); margin:0px; padding:0.25rem; background:#fafafa;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr {} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr th { border-top:0px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr td { } .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr th:first-child, .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr td:first-child { width:50px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr th:nth-child(2), .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr td:nth-child(2) { width:calc(100% - 400px);} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr th:nth-child(3), .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr td:nth-child(3) { width:100px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr th:nth-child(4), .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr td:nth-child(4) { width:120px;} .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr th:nth-child(5), .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table tr td:nth-child(5) { width:130px;} /*end - .MapTool-FunctionBox.dec-MapTool-RoutePlan .box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea table*/ /*start - .dec-btn-withIcon --------------------------------------------------------------------------------------*/ .dec-btn-withIcon { color:#999999; border-color:#dddbd7; background-color:#fafafa; height:45px; margin:0px 0px 5px 0px; padding:0px;} .dec-btn-withIcon:hover { color:#FFFFFF; border-color:#29aecc; background-color:#5dc1cf; background-image:repeating-linear-gradient(to right,#29aecc 0%, #5dc1cf 80%, #5dc1cf 100%);} .dec-btn-withIcon:focus, .dec-btn-withIcon.focus { box-shadow:0 0 0 0.2rem rgba(40, 167, 69, 0.5);} .dec-btn-withIcon.disabled, .dec-btn-withIcon:disabled { color:#ebebeb; background-color:transparent;} .dec-btn-withIcon:not(:disabled):not(.disabled):active, .dec-btn-withIcon:not(:disabled):not(.disabled).active, .show > .dec-btn-withIcon.dropdown-toggle { color:#FFFFFF; border-color:#29aecc; background-color:#5dc1cf; background-image:repeating-linear-gradient(to right,#29aecc 0%, #5dc1cf 80%, #5dc1cf 100%);} .dec-btn-withIcon:not(:disabled):not(.disabled):active:focus, .dec-btn-withIcon:not(:disabled):not(.disabled).active:focus, .show > .dec-btn-withIcon.dropdown-toggle:focus { box-shadow:0 0 0 0.2rem rgba(40, 167, 69, 0.5);} .dec-btn-withIcon svg.dec-ic { margin-top:0px; margin-left:18px; font-size:18px; width:20px; height:20px; overflow:hidden; float:left;} .dec-btn-withIcon .dec-type { text-align:center; padding:0px 48px; font-size:15px; line-height:18px;} .fa-layers.dec-ic-group-a { width:20px; height:20px; color:#999999; overflow:hidden; position:relative; margin:0px 0px 0px 18px; padding:0px; float:left;} .fa-layers.dec-ic-group-a .dec-ic-01 { margin:0px; padding:0px; position:absolute; top:0px; right:auto; left:0px; font-size:10px; width:9px; height:9px;} .fa-layers.dec-ic-group-a .dec-ic-02 { margin:0px; padding:0px; position:absolute; top:0px; right:auto; left:11px; font-size:10px; width:9px; height:9px;} .fa-layers.dec-ic-group-a .dec-ic-03 { margin:0px; padding:0px; position:absolute; top:6px; right:auto; left:5px; font-size:12px; width:14px; height:14px;} .dec-btn-withIcon:hover .fa-layers.dec-ic-group-a .dec-ic-01, .dec-btn-withIcon:hover .fa-layers.dec-ic-group-a .dec-ic-02, .dec-btn-withIcon:hover .fa-layers.dec-ic-group-a .dec-ic-03 { color:#FFFFFF;} .dec-btn-withIcon .icon-sprite { margin-top:0px; margin-left:18px; font-size:18px; width:22px; height:22px; overflow:hidden; float:left;} .dec-btn-withIcon:hover .icon-sprite.icon-ic_routePlan_delivery { background-position:-152px -1736px;} .dec-btn-withIcon:hover .icon-sprite.icon-ic_routePlan_deliveryTable { background-position:-228px -1736px;} /*end - .dec-btn-withIcon --------------------------------------------------------------------------------------*/ /*start - .dec-btn-withoutIcon --------------------------------------------------------------------------------------*/ .dec-btn-withoutIcon { color:#999999; border-color:#dddbd7; background-color:#fafafa; height:45px; margin:0px 0px 5px 0px; padding:0px;} .dec-btn-withoutIcon:hover { color:#FFFFFF; border-color:#29aecc; background-color:#5dc1cf; background-image: repeating-linear-gradient(to right,#29aecc 0%, #5dc1cf 80%, #5dc1cf 100%);} .dec-btn-withoutIcon:focus, .dec-btn-withoutIcon.focus { box-shadow:0 0 0 0.2rem rgba(40, 167, 69, 0.5);} .dec-btn-withoutIcon.disabled, .dec-btn-withoutIcon:disabled { color:#CCCCCC; background-color:transparent;} .dec-btn-withoutIcon:not(:disabled):not(.disabled):active, .dec-btn-withoutIcon:not(:disabled):not(.disabled).active, .show > .dec-btn-withoutIcon.dropdown-toggle { color:#FFFFFF; border-color:#29aecc; background-color:#5dc1cf; background-image: repeating-linear-gradient(to right,#29aecc 0%, #5dc1cf 80%, #5dc1cf 100%);} .dec-btn-withoutIcon:not(:disabled):not(.disabled):active:focus, .dec-btn-withoutIcon:not(:disabled):not(.disabled).active:focus, .show > .dec-btn-withoutIcon.dropdown-toggle:focus { box-shadow:0 0 0 0.2rem rgba(40, 167, 69, 0.5);} .dec-btn-withoutIcon .dec-type { text-align:center; padding:0px 25px; font-size:15px; line-height:18px;} /*end - .dec-btn-withoutIcon --------------------------------------------------------------------------------------*/ /*start - .dec-btn-withoutIconGray --------------------------------------------------------------------------------------*/ .dec-btn-withoutIconGray { color:#999999; border-color:#dddbd7; background-color:#fafafa; height:45px; margin:0px 0px 5px 0px; padding:0px;} .dec-btn-withoutIconGray:hover { color:#8f8f8f; border-color:#d3d1cd; background-color:#fafafa; background-image: repeating-linear-gradient(to right,#FFFFFF 0%, #fafafa 80%, #fafafa 100%);} .dec-btn-withoutIconGray:focus, .dec-btn-withoutIconGray.focus { box-shadow:0 0 0 0.2rem rgba(40, 167, 69, 0.5);} .dec-btn-withoutIconGray.disabled, .dec-btn-withoutIconGray:disabled { color:#CCCCCC; background-color:transparent;} .dec-btn-withoutIconGray:not(:disabled):not(.disabled):active, .dec-btn-withoutIconGray:not(:disabled):not(.disabled).active, .show > .dec-btn-withoutIconGray.dropdown-toggle { color:#8f8f8f; border-color:#d3d1cd; background-color:#fafafa; background-image: repeating-linear-gradient(to right,#FFFFFF 0%, #fafafa 80%, #fafafa 100%);} .dec-btn-withoutIconGray:not(:disabled):not(.disabled):active:focus, .dec-btn-withoutIconGray:not(:disabled):not(.disabled).active:focus, .show > .dec-btn-withoutIconGray.dropdown-toggle:focus { box-shadow:0 0 0 0.2rem rgba(40, 167, 69, 0.5);} .dec-btn-withoutIconGray .dec-type { text-align:center; padding:0px 25px; font-size:15px; line-height:18px;} /*end - .dec-btn-withoutIconGray --------------------------------------------------------------------------------------*/ /*end - MapTool-RoutePlan 多點路順規劃｜圖台兩側模式_可調寬度 ---------------------------------------------------------------------------------------------------------------------------------------------------*/ /*start - .table --------------------------------------------------------------------------------------*/ .table th.dec-w-025, .table td.dec-w-025 { width:25px; min-width:25px;} .table th.dec-w-050, .table td.dec-w-050 { width:50px; min-width:50px;} .table th.dec-w-075, .table td.dec-w-075 { width:75px; min-width:75px;} .table th.dec-w-100, .table td.dec-w-100 { width:100px; min-width:100px;} .table th.dec-w-125, .table td.dec-w-125 { width:125px; min-width:125px;} .table th.dec-w-150, .table td.dec-w-150 { width:150px; min-width:150px;} .table th.dec-w-175, .table td.dec-w-175 { width:175px; min-width:175px;} .table th.dec-w-200, .table td.dec-w-200 { width:200px; min-width:200px;} .table th.dec-w-225, .table td.dec-w-225 { width:225px; min-width:225px;} .table th.dec-w-250, .table td.dec-w-250 { width:250px; min-width:250px;} .table th.dec-ta-R, .table td.dec-ta-R { text-align:right;} .table th.dec-w-check, .table td.dec-w-check { min-width:25px !important; width:25px !important; max-width:25px !important; vertical-align:top;} .table td.dec-icon { vertical-align:middle;} .table td.dec-bgColor-ColdChain-01 { color:#FFFFFF; background:#ff0000;} /* [統計分析｜冷鏈圖表] 1.異常｜#ff0000｜(255, 0, 0)｜dec-coldChain-01 */ /*[統計分析｜冷鏈圖表]表格背景：異常 dec-bgColor-ColdChain-01*/ .tab-content.dec-con-03.dec-missionM_Freight .tab-pane .table-responsive.dec-table .table.table-hover.dec-table tbody { height:auto;} .tab-content.dec-con-03.dec-missionM_Freight .tab-pane .table-responsive.dec-table .table.table-hover.dec-table thead tr th { padding:8px;} .tab-content.dec-con-03.dec-missionM_Freight .tab-pane .table-responsive.dec-table.dec-fixedTableHeader .table.table-hover.dec-table tbody { display:block; overflow-x:hidden; overflow-y:auto; height:calc(100% - 40px);} .tab-content.dec-con-03.dec-missionM_Freight .tab-pane .table-responsive.dec-table.dec-fixedTableHeader .table.table-hover.dec-table thead tr th { padding:8px;} .table td.dec-chart-maxWidth { width:400px; min-width:400px;} .table-responsive.dec-table.dec-h-01 { height:calc(100% - 40px); overflow-y:auto;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-bottom-function .dec-box-R .box-tableArea .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px); overflow-y:hidden;} .MapTool-FunctionBox.dec-Monitor-Car .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px); overflow-y:hidden;} .dec-conBoxInner.div-NavSortBox-statisticsDangerousDriving .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 130px); overflow-y:hidden;} .con-main.div-MapTool-Mission-ConMain .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px); overflow-y:hidden;} .con-main.div-MapTool-Mission-ConMain .table-responsive.dec-table.dec-fixedTableHeader th:nth-child(2), .con-main.div-MapTool-Mission-ConMain .table-responsive.dec-table.dec-fixedTableHeader td:nth-child(2) { border-left:0px;} .con-main.div-MapTool-ParkingLot-ConMain .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px); overflow-y:hidden;} .con-main.div-MapTool-ParkingLot-ConMain .table-responsive.dec-table.dec-fixedTableHeader.dec-with-pagination { height:calc(100% - 40px); overflow-y:hidden;} .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 40px); overflow-y:hidden;} .table-responsive.dec-table.dec-fixedTableHeader thead { display:block; height:38px; overflow:hidden; background:#595959;} .table-responsive.dec-table.dec-fixedTableHeader tbody { display:block; overflow-x:hidden; overflow-y:auto; height:203px;} .table-responsive.dec-table.dec-fixedTableHeader thead tr, .table-responsive.dec-table.dec-fixedTableHeader tbody tr { display:table; width:100%; table-layout:fixed; border-bottom:1px solid #ebebeb;} .table-responsive.dec-table.dec-fixedTableHeader tbody tr:nth-child(even) { background:#f2f2f2;} .table-responsive.dec-table.dec-fixedTableHeader tbody tr td { padding:0.25rem;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDangerousDriving .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 140px); overflow-y:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsColdChain .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCar .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDailyReport .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCarSensor .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDriver .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsWineTest .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormalStay .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingInFence .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFenceInOut .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsOvertimeDriving .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsRestrictedRoad .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsOffsetRoute .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsImmobilizer .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSOS .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsBarcode .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsLateRatio .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDetachRatio .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContainerVolume .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSingleStationRushHour .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsRouteRushHour .table-responsive.dec-table.dec-fixedTableHeader, .dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDashCam .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 40px); overflow-y:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 40px); overflow-y:hidden;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader thead { display:block; height:30px; overflow:hidden; background:#595959;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader tbody { display:block; height:calc(100% - 30px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader.dec-h01 thead { display:block; height:70px; overflow:hidden; background:#595959;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader.dec-h01 tbody { display:block; height:calc(100% - 70px); overflow-x:hidden; overflow-y:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader .dec-table-sub thead { display:none;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader .dec-table-sub tbody { height:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader .dec-table-sub.dec-thead thead { display:block;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader .dec-table-sub.dec-thead tbody { height:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.div-NavSortBox-statisticsCarSensor-Table-Tire .dec-table-sub thead { display:block;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.div-NavSortBox-statisticsCarSensor-Table-Tire .dec-table-sub tbody { height:auto;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader thead tr, .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader tbody tr { display:table; width:100%; table-layout:fixed; border-bottom:1px solid #ebebeb; } .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader tbody tr:nth-child(even) { background:#f2f2f2;} .table.dec-table tbody tr:hover, .table-responsive.dec-table.dec-fixedTableHeader tbody tr:hover, .table-responsive.dec-table.dec-fixedTableHeader tbody tr:nth-child(even):hover, .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table.dec-fixedTableHeader tbody tr:nth-child(even):hover { background:#e1f1f4;} .table.dec-table tbody tr.dec-dynamic:hover { background:#ffc550;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table tbody tr.dec-table-sub td { } .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table tbody tr:nth-child(even) { background:#f2f2f2;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table tbody tr:nth-child(even):hover { background:#e1f1f4;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table tbody tr { border-bottom:1px solid #ebebeb;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table tbody tr th { background:#3d7d9e;} .dec-row-statistics .dec-conBox .dec-conBoxInner .table-responsive.dec-table tbody tr td { } .table-responsive.dec-table.dec-fixedTableHeader.dec-RightSideMode .table.table-hover.dec-table { width:975px;} .table-responsive.dec-table.dec-fixedTableHeader.dec-RightSideMode.dec-w02 .table.table-hover.dec-table { width:730px;} .table-responsive.dec-table.dec-fixedTableHeader.dec-RightSideMode.dec-w03 .table.table-hover.dec-table { width:330px;} .table-responsive.dec-table { width:calc(100% - 0px); margin:0px; padding:5px; overflow-x:auto; overflow-y:hidden; color:#595959; border-radius:5px; word-break:break-all;} .table.table-hover.dec-table { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px;} .table.table-hover.dec-table thead { background:#595959; color:#FFFFFF;} .table.table-hover.dec-table tbody tr:nth-child(even) { background:#f2f2f2;} .table-responsive.dec-table.dec-style-01 { background:transparent; padding:0px 0px 15px 0px;} .table-responsive.dec-table.dec-style-01 .table.table-hover.dec-table { background:#fafafa;} .table-responsive.dec-table.dec-style-01 .table.table-hover.dec-table.dec-mt02 { margin-top:25px;} .table.dec-table th { border-top:0px; padding:0.25rem; color:#FFFFFF; border-left:1px solid #dddddd;} .table.dec-table th:last-child { border-right:1px solid #dddddd;} .table.dec-table tr { border-right:1px solid #dddddd;} .dec-table-sub .table.table-hover.dec-table tr.dec-table-sub th a, .dec-table-sub .table.table-hover.dec-table tr.dec-table-sub th a:hover { color:#FFFFFF;} .table.dec-table th a, .table.dec-table th a:hover { text-decoration:none; background:transparent;} .table.dec-table.dec-checkBox th:nth-child(1), .table.dec-table.dec-checkBox td:nth-child(1) { text-align: center; min-width:25px; width:25px; max-width:25px !important; vertical-align:top;} .table.dec-table th .dec-type-note { color:#f0f0f0; font-size:12px; font-weight:400;} .table.dec-table th .dec-type-note-num { color:#fccf00; font-size:12px; font-weight:400; padding-left:3px;} .table.dec-table th .form-check { margin-bottom: 0px;} .table.dec-table th .form-check .form-check-label { color:#595959;} .table.dec-table tr.dec-table-sub { background:transparent; } .table.table-hover.dec-table tr.dec-table-sub { background:transparent;} .table.table-hover.dec-table tr.dec-table-sub.dec-bg { background:#f0f0f0;} /*start - .table.table-hover.dec-table tr.dec-table-sub.dec-bg.dec-NavSortBox-statisticsColdChain-subTable*/ .table.table-hover.dec-table tr.dec-table-sub.dec-bg.dec-NavSortBox-statisticsColdChain-subTable { font-weight:normal;} .table.table-hover.dec-table tr.dec-table-sub.dec-bg.dec-NavSortBox-statisticsColdChain-subTable .dec-conArea-tableInfo .table-responsive.dec-table { padding:0px; width:calc(100% - 0px); border-spacing:0px;} .table.table-hover.dec-table tr.dec-table-sub.dec-bg.dec-NavSortBox-statisticsColdChain-subTable .dec-conArea-tableInfo .table-responsive.dec-table .table { border-spacing:0px; padding:0px;} .table.table-hover.dec-table tr.dec-table-sub.dec-bg.dec-NavSortBox-statisticsColdChain-subTable.dec-subTable td.dec-td { padding:0px;} .table.table-hover.dec-table tr.dec-table-sub.dec-bg.dec-NavSortBox-statisticsColdChain-subTable .dec-conArea-tableInfo .table-responsive.dec-table th { display:none;} .table.table-hover.dec-table tr.dec-table-sub.dec-bg.dec-NavSortBox-statisticsColdChain-subTable .dec-conArea-tableInfo .table-responsive.dec-table td {} /*end - .table.table-hover.dec-table tr.dec-table-sub.dec-bg.dec-NavSortBox-statisticsColdChain-subTable*/ .table.table-hover.dec-table tr.dec-table-sub.dec-bg .dec-conArea-tableInfo .table-responsive.dec-table { background:transparent;} .table.table-hover.dec-table tr.dec-table-sub th a { margin:0px; color:#595959; text-decoration: none !important;} .table.table-hover.dec-table tr.dec-table-sub th a:hover { margin:0px; color:#169cbf; text-decoration: none !important;} .table.dec-table tbody tr:hover, .table.dec-table tr.is-active, .table.dec-table tr.is-active:hover { background:#e1f1f4;} .table.dec-table td a { margin:2px 0px; display:inline-block; background:transparent;} .table td { padding:0.5rem; color:#595959; font-size:1rem; border-left:1px solid #dddddd;} .table td .dec-type { margin-left:2px;} .table td .dec-color-Y { color:#595959;} .table td .dec-color-N { color:#e73828;} .table td .dec-color-01 { color:#f7931e;} .table td .dec-color-noData { color:#c2c2c2;} .table td .dec-color-Job-01 { color:#595959; background:transparent; border-radius:25px; padding:2px 5px; display:inline-block;} /*出勤管理/上下班狀態：正常下班*/ .table td .dec-color-Job-02 { color:#FFFFFF; background:#f15a24; border-radius:25px; padding:2px 5px; display:inline-block;} /*出勤管理/上下班狀態：上/下班異常*/ .table td .dec-color-Job-03 { color:#FFFFFF; background:#72bf44; border-radius:25px; padding:2px 5px; display:inline-block;} /*出勤管理/上下班狀態：出勤中*/ .table td .dec-color-Detect-01 { color:#595959; background:transparent; border-radius:25px; padding:2px 5px; display:inline-block;} /*出勤管理/檢測：已檢測*/ .table td .dec-color-Detect-01.dec-pass .dec-type { color:#595959; background:transparent; font-size:12px; margin:1px 0px 1px 2px; border:1px solid #595959; border-radius:25px; padding:2px 5px; display:inline-block;} /*出勤管理/檢測：已檢測-通過*/ .table td .dec-color-Detect-01.dec-unpassed .dec-type { color:#f15a24; background:transparent; font-size:12px; margin:1px 0px 1px 2px; border:1px solid #f15a24; border-radius:25px; padding:2px 5px; display:inline-block;} /*出勤管理/檢測：已檢測-不通過*/ .table td .dec-color-Detect-02 { color:#FFFFFF; background:#f15a24; border-radius: 25px; padding:2px 5px; display:inline-block;} /*出勤管理/檢測：未檢測*/ .table td .dec-color-Mission-01 { color:#595959; background:transparent; border-radius:25px; padding:2px 5px; display:inline-block;} /*出勤管理/任務資訊：已完成*/ .table td .dec-color-Mission-02 { color:#f15a24; background:transparent; border-radius:25px; padding:2px 5px; display:inline-block;} /*出勤管理/任務資訊：已完成(遲送)*/ .table td .dec-color-Mission-02.dec-type { color:#f15a24; background:transparent; font-size:12px; margin:1px 0px 1px 2px; border:1px solid #f15a24; border-radius: 25px; padding:2px 5px; display:inline-block;} /*出勤管理/任務資訊：已完成(遲送)*/ .table td .dec-color-Mission-03 { color:#FFFFFF; background:#72bf44; border-radius: 25px; padding:2px 5px; display:inline-block;} /*出勤管理/任務資訊：運送中*/ .table td .dec-color-Mission-04 { color:#c1272d; background:transparent; border-radius: 25px; padding:2px 5px; display:inline-block;} /*出勤管理/任務資訊：運送過(遲送)*/ .table td .dec-color-Mission-04.dec-type { color:#c1272d; background:transparent; font-size: 12px; margin: 1px 0px 1px 2px; border:1px solid #c1272d;} /*出勤管理/任務資訊：運送過(遲送)*/ .table td .dec-color-Customer-01 { color:#595959;} /*客戶管理/狀態：正常*/ .table td .dec-color-Customer-02 { color:#e73828;} /*客戶管理/狀態：停止合作*/ .table td .dec-color-Stock-01 { color:#595959;} /*備品管理/狀態：充足*/ .table td .dec-color-Stock-02 { color:#e73828;} /*備品管理/狀態：低庫存*/ .table td .dec-color-AlarmLevel-01 { color:#595959;} /*告警規則管理/告警等級：一般*/ .table td .dec-color-AlarmLevel-02 { color:#e73828;} /*告警規則管理/告警等級：重要*/ .table td .dec-color-resetPassword-Y { color:#e73828;} /*忘記密碼待重置/狀態：Y*/ .table td .dec-color-resetPassword-N { color:#595959;} /*忘記密碼待重置/狀態：N*/ .table td .dec-color-AlarmSpeedSort-01 { background:#c1272d; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/車速監控/告警分類：超速*/ .table td .dec-color-AlarmSpeedSort-02 { background:#f15a24; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/車速監控/告警分類：怠速*/ .table td .dec-color-AlarmSpeedSort-03 { background:#787878; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/車速監控/告警分類：停止*/ .table td .dec-color-AlarmFenceSor-01 { background:#787878; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/圍籬監控/告警分類：進入圍籬*/ .table td .dec-color-AlarmFenceSor-02 { background:#c1272d; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/圍籬監控/告警分類：離開圍籬*/ .table td .dec-color-AlarmFenceSor-03 { background:#f15a24; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/圍籬監控/告警分類：接近圍籬*/ .table td .dec-color-AlarmDriverSort-01 { background:#c1272d; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/司機出勤/告警分類：遲到*/ .table td .dec-color-AlarmDriverSort-02 { background:#f15a24; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/司機出勤/告警分類：早退*/ .table td .dec-color-AlarmDriverSort-03 { background:#a050a0; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/司機出勤/告警分類：超時工作*/ .table td .dec-color-AlarmDriverSort-04 { background:#0071bc; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/司機出勤/告警分類：酒測不過*/ .table td .dec-color-AlarmAIoTSort-01 { background:#0071bc; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/AIoT設備/告警分類：電量*/ .table td .dec-color-AlarmAIoTSort-02 { background:#39b54a; color:#FFFFFF; border-radius:5px; padding:0px 5px;} /*告警規則管理/AIoT設備/告警分類：訊號*/ .table td .dec-color-DetectAlcohol-01A { color:#595959; background:transparent; border-radius:25px; padding:2px 5px; display:inline-block; border:1px solid #595959;} /*統計分析/檢酒測血壓詳細數據：正確, 正常*/ .table td .dec-color-DetectAlcohol-01B { color:#f15a24; background:transparent; border-radius:25px; padding:2px 5px; display:inline-block; border:1px solid #f15a24;} /*統計分析/檢酒測血壓詳細數據：錯誤, 異常*/ .table td .dec-color-DetectAlcohol-02 { color:#FFFFFF; background:#f15a24; border-radius:25px; padding:2px 5px; display:inline-block; border:1px solid #f15a24;} /*統計分析/檢酒測血壓詳細數據：未執行*/ .table td .dec-color-FormRecord-01 { color:#72bf44; background:transparent; border-radius:25px; padding:2px 5px; display:inline-block; border:1px solid #72bf44;} /*統計分析/六聯單紀錄：已清運*/ .table td .dec-color-FormRecord-02 { color:#d9a20c; background:transparent; border-radius:25px; padding:2px 5px; display:inline-block; border:1px solid #d9a20c;} /*統計分析/六聯單紀錄：休診*/ .table td .dec-color-FormRecord-03 { color:#FFFFFF; background:#f15a24; border-radius:25px; padding:2px 5px; display:inline-block; border:1px solid #f15a24;} /*統計分析/六聯單紀錄：未清運*/ .table td .dec-color-Burglarproof-01 { color:#FFFFFF; background:#999999; border-radius:5px; padding:2px 5px; display:inline-block; border:1px solid #999999;} /*防盜狀態：已解除*/ .table td .dec-color-Burglarproof-02 { color:#FFFFFF; background:#39b54a; border-radius:5px; padding:2px 5px; display:inline-block; border:1px solid #39b54a;} /*防盜狀態：已設定*/ .table td .dec-color-Temperature-01 { color:#595959; background:transparent; border-radius:5px; padding:1px 3px; display:inline-block; border:1px solid transparent; margin:0px 2px 2px 0px; font-size:14px; line-height:14px;} /*溫度狀態：normal*/ .table td .dec-color-Temperature-02 { color:#595959; background:#fff278; border-radius:5px; padding:1px 3px; display:inline-block; border:1px solid #fff278; margin:0px 2px 2px 0px; font-size:14px; line-height:14px;} /*溫度狀態：yellow*/ .table td .dec-color-Temperature-03 { color:#5b3e24; background:#ffcfab; border-radius:5px; padding:1px 3px; display:inline-block; border:1px solid #ffc08d; margin:0px 2px 2px 0px; font-size:14px; line-height:14px;} /*溫度狀態：orange*/ .table td .dec-color-Temperature-04 { color:#e73828; background:#f7d3d2; border-radius:5px; padding:1px 3px; display:inline-block; border:1px solid #f7d3d2; margin:0px 2px 2px 0px; font-size:14px; line-height:14px;} /*溫度狀態：red*/ /*start - .table td:last-child a.dec-table-btn ----------------------------------------------------*/ .table td:last-child a.dec-table-btn, .table td:last-child a.dec-table-btn:hover { text-decoration:none; margin:0px 5px 0px 0px; padding:5px; border:1px solid #d2d5d8; border-radius:5px; width:33.5px; height:33.5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .table td:last-child a.dec-table-btn { color:#adadad; background:#fafafa;} .table td:last-child a.dec-table-btn:hover { color:#29aecc; background:#FFFFFF;} .table td:last-child a.dec-table-btn.dec-edit {} .table td:last-child a.dec-table-btn.dec-edit:hover { color:#29aecc;} .table td:last-child a.dec-table-btn.dec-delete {} .table td:last-child a.dec-table-btn.dec-delete:hover { color:#ed1c24;} .table td:last-child a.dec-table-btn.dec-view {} .table td:last-child a.dec-table-btn.dec-view:hover { color:#50b848;} .table td:last-child a.dec-table-btn.dec-password {} .table td:last-child a.dec-table-btn.dec-password:hover { color:#9c4795;} .table td:last-child a.dec-table-btn.dec-w-auto, .table td:last-child a.dec-table-btn.dec-w-auto:hover { width:auto;} .table td:last-child a.dec-table-btn.dec-w-auto .dec-type-01, .table td:last-child a.dec-table-btn.dec-w-auto:hover .dec-type-01 { font-size:1rem; line-height: 1rem; margin:0px 0px 0px 2px; padding:0px; display:inline-block;} .table td:last-child a.dec-table-btn.dec-circle { border-radius:50px;} /*end - .table td:last-child a.dec-table-btn ----------------------------------------------------*/ /*start - .table td:last-child a.dec-table-btn-01 ----------------------------------------------------*/ .table td a.dec-table-btn-01, .table td a.dec-table-btn-01:hover { text-decoration:none; margin:0px 5px 0px 0px; padding:5px; border:1px solid #d2d5d8; border-radius:5px; width:33.5px; height:33.5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .table td a.dec-table-btn-01 { color:#adadad; background:#fafafa;} .table td a.dec-table-btn-01:hover { color:#29aecc; background:#FFFFFF;} .table td a.dec-table-btn-01.dec-edit {} .table td a.dec-table-btn-01.dec-edit:hover { color:#29aecc;} .table td a.dec-table-btn-01.dec-delete {} .table td a.dec-table-btn-01.dec-delete:hover { color:#ed1c24;} .table td a.dec-table-btn-01.dec-view {} .table td a.dec-table-btn-01.dec-view:hover { color:#50b848;} .table td a.dec-table-btn-01.dec-password {} .table td a.dec-table-btn-01.dec-password:hover { color:#9c4795;} .table td a.dec-table-btn-01.dec-w-auto, .table td a.dec-table-btn-01.dec-w-auto:hover { width:auto;} .table td a.dec-table-btn-01.dec-w-auto .dec-type-01, .table td a.dec-table-btn-01.dec-w-auto:hover .dec-type-01 { font-size:1rem; line-height: 1rem; margin:0px 0px 0px 2px; padding:0px; display:inline-block;} .table td a.dec-table-btn-01.dec-circle { border-radius:50px;} /*end - .table td a.dec-table-btn-01 ----------------------------------------------------*/ .table tr.dec-dynamic { background:#ffdd4d;} .table td a.btn-show, .table td a.btn-hide { width:35px; height:24px; overflow:hidden; vertical-align:middle; margin:-5px 5px; padding:5px 6px; text-decoration:none; color:#787878; background:transparent;} .table td a.btn-show:hover, .table td a.btn-hide:hover { width:35px; height:24px; overflow:hidden; vertical-align:middle; margin:-5px 5px; padding:5px 6px; text-decoration:none; color:#169cbf; background:transparent;} .table td a.btn-show .dec-ic, .table td a.btn-hide .dec-ic { color:#787878; margin:0px; padding:0px;} .table td a.btn-show:hover .dec-ic, .table td a.btn-hide:hover .dec-ic { color:#169cbf; margin:0px; padding:0px;} .table td .dec-note { color:#FFFFFF; display:inline-block; margin:0px; padding:1px 5px; border-radius:3px; font-size:12px; background:#b7b7b7;} /*start - .table-responsive.dec-videoAlarm --------------------------------------------------------------------------------------*/ .table-responsive.dec-videoAlarm { width:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:hidden; color:#595959; border-radius:5px; background:#595959; word-break:break-all; border:1px solid #595959;} .table.table-hover.dec-videoAlarm { width:calc(100% - 0px); margin:0px; padding:0px; color:#FFFFFF; font-size:1.2rem; line-height:1.5rem; background:transparent;} .dec-videoAlarm .table-dark th, .dec-videoAlarm .table-dark td { border-bottom:1px solid #595959;} .table.dec-videoAlarm th { border-top:0px; padding:0.25rem; color:#FFFFFF; font-size:1.2rem; line-height:1.5rem;} .table.dec-videoAlarm tbody tr:hover { background: #f15a24;} .table.dec-videoAlarm th:nth-child(1), .table.dec-videoAlarm td:nth-child(1) { width:100px;} .table.dec-videoAlarm th:nth-child(2), .table.dec-videoAlarm td:nth-child(2) { width:calc(100% - 160px); color:#fccf00;} .table.dec-videoAlarm th:nth-child(3), .table.dec-videoAlarm td:nth-child(3) { width:60px;} .table.dec-videoAlarm th a, .table.dec-videoAlarm th a:hover { text-decoration:none; color:#FFFFFF;} .table.dec-videoAlarm td { color:#FFFFFF; font-size:1.2rem; line-height:1.5rem;} .table.dec-videoAlarm td:last-child a, .table.dec-videoAlarm td:last-child a:hover { text-decoration:none; color:#FFFFFF;} /*end - .table-responsive.dec-videoAlarm --------------------------------------------------------------------------------------*/ /*start - ic_f_sort / ic_f_sortUp / ic_f_sortDown----------------------------------------------------------------*/ .table th a { color:#FFFFFF;} .table th a:hover { color:#ebebeb;} .table th a .ic_f_sort::before, .table th a:hover .ic_f_sort::before { margin:0px 0px 0px 3px; vertical-align:top; text-decoration:none; color:#FFFFFF;} .table th a:hover .ic_f_sort::before { margin:0px 0px 0px 3px; vertical-align:top; text-decoration:none; color:#f0f0f0;} .table th a .ic_f_sortUp::before, .table th a:hover .ic_f_sortUp::before { margin:0px 0px 0px 3px; vertical-align:top; text-decoration:none; color:#FFFFFF;} .table th a:hover .ic_f_sortUp::before { margin:0px 0px 0px 3px; vertical-align:top; text-decoration:none; color:#f0f0f0;} .table th a .ic_f_sortDown::before, .table th a:hover .ic_f_sortDown::before { margin:0px 0px 0px 3px; vertical-align:top; text-decoration:none; color:#FFFFFF;} .table th a:hover .ic_f_sortDown::before { margin:0px 0px 0px 3px; vertical-align:top; text-decoration:none; color:#f0f0f0;} .table th a .dec-c01 { color:#FFFFFF;} .table th a:hover .dec-c01 { color:#0097aa;} .ic_f_sort::before { margin:0px; padding:0px; content: "\f0dc";font-family: "Font Awesome 5 Free"; font-weight:900;} .ic_f_sortUp::before { margin:0px; padding:0px; content: "\f0de";font-family: "Font Awesome 5 Free"; font-weight:900;} .ic_f_sortDown::before { margin:0px; padding:0px; content: "\f0dd";font-family: "Font Awesome 5 Free"; font-weight:900;} .iconSVG::before { display:inline-block; font-style:normal; font-variant:normal; text-rendering:auto; -webkit-font-smoothing:antialiased;} .iconSVG, .iconSVG.dec-c01 { display: inline;} /*end - ic_f_sort / ic_f_sortUp / ic_f_sortDown----------------------------------------------------------------*/ /*end - .table --------------------------------------------------------------------------------------*/ /*start - .switch-box-area -----------------------------------------------------------------------------*/ .switch-box-area-outer { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .switch-box-area { margin:0px 5px 0px 0px; padding:5px 0px; position:relative; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .switch-box-area .switch-box { height:22px; margin:0px; padding:0px; position:relative; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important;} .switch-box-area .dec-type { color:#FAFAFA; display:inline-block; font-size:1.2rem; padding:0px 5px 0px 0px; margin:0px;} .switch-box-area .switch-box .switch { display:inline-block; height:22px; position:relative; width:44px;} .switch-box-area .switch-box .switch input { height:0px; width:0px; opacity:0;} .switch-box-area .switch-box .switch .slider { position:absolute; cursor:pointer; top:0; left:0; right:0; bottom:0; background-color:#e1e1e1; -webkit-transition:.4s; transition:.4s;} .switch-box-area .switch-box .switch .slider:before { position:absolute; content:""; height:18px; width:18px; left:2px; bottom:2px; background-color:white; -webkit-transition:.4s; transition:.4s;} .switch-box-area .switch-box .switch input:checked + .slider { background-color:#2ca6e0;} .switch-box-area .switch-box .switch input:focus + .slider { box-shadow:0 0 1px #3399CC;} .switch-box-area .switch-box .switch input:checked + .slider:before { -webkit-transform: translateX(22px); -ms-transform: translateX(22px); transform: translateX(22px);} .switch-box-area .switch-box .switch .slider.round { border-radius:34px;} .switch-box-area .switch-box .switch .slider.round:before { border-radius:50%;} /*end - .switch-box-area -----------------------------------------------------------------------------*/ /*start - .sidebar-01 -------------------------------------------------------------------------------------------------------*/ .sidebar-01 { width:calc(100% - 0px); background:transparent; color:#595959; transition: all 0.3s; margin:0px; padding:0px;} .sidebar-01.active { text-align:center;} .sidebar-01 ul { margin:0px; padding:0px; background:transparent;} .sidebar-01.active .dropdown-toggle::after { right:50%; top:0px; bottom:0px; -webkit-transform:translateX(50%); -ms-transform:translateX(50%); transform:translateX(50%);} .sidebar-01 ul li.dec-li { margin-top:-10px; border-bottom:1px solid #e1e1e1;} .sidebar-01 ul li a { text-align: left; padding:10px 5px 10px 0px; font-size:1rem; display:block; text-decoration:none; color:#595959; background:transparent; padding-left:0px !important;} .sidebar-01 ul li a:hover { color:#169cbf; text-decoration:none;} .sidebar-01 ul li > ul li a:hover { color:#595959;} .sidebar-01 ul li a i { margin-right:10px;} .sidebar-01 ul li.active>a, a[aria-expanded="true"] { color:#fff;} a[data-toggle="collapse"] { position:relative;} .dropdown-toggle.dec-01a { width:calc(100% - 52px); display:inline-block; padding-left:0px;} .dropdown-toggle.dec-01a::after { display:block; position:absolute; top:50%; right:23px; transform:translateY(-50%); color:#595959;} .dropdown-toggle.dec-01a:hover::after { color:#d9a20c; color:#169cbf;} .dropdown-toggle.dec-01b::after { display:none; position:absolute; top:50%; right:23px; transform:translateY(-50%); color:#595959;} .sidebar-01 ul li .dec-box-list-sort { width:calc(100% - 0px); padding:0px; padding-top:5px; margin-top:0px; background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .sidebar-01 ul li .dec-box-list-sort .dec-01b { width:calc(100% - 52px); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .sidebar-01 ul li .dec-box-list-sort .dec-type { width:calc(100% - 20px); margin-left:3px; word-break:break-all; white-space:normal; padding-left:5px; line-height:1.2rem;} .sidebar-01 ul li .dec-box-list-sort .dec-type-sort { width:calc(100% - 20px); display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .sidebar-01 ul li .dec-box-list-sort .dec-type-sort .dec-type { width:calc(100% - 20px); padding-right:25px; display:inline-block; margin-left:3px; word-break:break-all; white-space:normal; line-height:1.2rem; padding:5px 25px 0px 5px;} .sidebar-01 ul li.dec-li > ul { width:calc(100% - 0px);} .sidebar-01 ul li.dec-li > ul li { margin:0px 0px 5px 0px; padding:0px; line-height:0rem; width:calc(100% - 0px);} .sidebar-01 ul li.dec-li > ul li .dec-box-list { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 52px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .sidebar-01 ul li.dec-li > ul li .dec-box-list:hover { background:#fafafa;} .sidebar-01 ul li.dec-li > ul li .dec-box-list a.dec-01c { width:calc(100% - 52px); padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .sidebar-01 ul li.dec-li > ul li .dec-box-list a.dec-01c .dec-type { padding:5px 0px 0px 0px; padding:0px; line-height:1.2rem; width:calc(100% - 20px); margin-left:3px; word-break:break-all; white-space:normal; display: -ms-inline-flexbox !important; display: inline-flex !important;} .sidebar-01 ul li.dec-li > ul li .dec-box-list a.dec-01c:hover .dec-type { color:#169cbf;} /*end - .sidebar-01 -------------------------------------------------------------------------------------------------------*/ /*start - .sidebar-02 -------------------------------------------------------------------------------------------------------*/ .sidebar-02 { width:calc(100% - 0px); background:transparent; color:#595959; transition: all 0.3s; margin:0px; padding:0px;} .sidebar-02.active { text-align: center;} .sidebar-02 ul { margin:0px; padding:0px; background:transparent;} .sidebar-02.active .dropdown-toggle::after { right:50%; top:0px; bottom:0px; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%);} .sidebar-02 ul li.dec-li { margin-top:-10px; border-bottom: 1px solid #e1e1e1;} .sidebar-02 ul li a { width:calc(100% - 0px); text-align:left; padding:10px 5px 10px 0px; font-size:1rem; display:block; text-decoration:none; color:#595959; background:transparent; padding-left:0px !important;} .sidebar-02 ul li a:hover { color: #169cbf; text-decoration:none;} .sidebar-02 ul li > ul li a:hover { color:#595959;} .sidebar-02 ul li a i { margin-right:10px;} .sidebar-02 ul li.active>a, a[aria-expanded="true"] { color:#fff;} a[data-toggle="collapse"] { position:relative;} .sidebar-02 .dropdown-toggle.dec-01a { width:calc(100% - 52px); width:calc(100% - 0px); display:inline-block; padding-left:0px;} .sidebar-02 .dropdown-toggle.dec-01a::after { display:block; position:absolute; top:50%; right:23px; transform: translateY(-50%); color:#595959;} .sidebar-02 .dropdown-toggle.dec-01a:hover::after { color:#169cbf;} .sidebar-02 .dropdown-toggle.dec-01b::after { display:none; position:absolute; top:50%; right:23px; transform: translateY(-50%); color:#595959;} .sidebar-02 ul li .dec-box-list-sort { width:calc(100% - 0px); padding:0px; padding-top:5px; padding-left:10px; margin-top:0px; background:transparent; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .sidebar-02 ul li .dec-box-list-sort .dec-01b { width:calc(100% - 52px); overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .sidebar-02 ul li .dec-box-list-sort .dec-type { width:calc(100% - 20px); display:inline-block; margin-left:3px; word-break:break-all; white-space:normal; padding-left:5px; line-height:1.2rem;} .sidebar-02 ul li .dec-box-list-sort .dec-type-sort { width:calc(100% - 20px); display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important;} .sidebar-02 ul li .dec-box-list-sort .dec-type-sort .dec-type { width:calc(100% - 20px); padding-right:25px; display:inline-block; margin-left:3px; word-break:break-all; white-space:normal; line-height:1.2rem; padding: 5px 25px 5px 5px;} .sidebar-02 ul li.dec-li > ul { width:calc(100% - 0px);} .sidebar-02 ul li.dec-li > ul li { margin:0px; padding:0px; line-height: 2rem; width:calc(100% - 0px);} .sidebar-02 ul li.dec-li > ul li .dec-box-list { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 42px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .sidebar-02 ul li.dec-li > ul li .dec-box-list:hover { background:#fafafa;} /*.sidebar-02 ul li.dec-li > ul li .dec-box-list a.dec-01c { width:calc(100% - 42px); padding: 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .sidebar-02 ul li.dec-li > ul li .dec-box-list a.dec-01c .dec-type { padding: 5px 0px 0px 0px; padding: 0px; line-height: 1.2rem; width:calc(100% - 20px); display: inline-block; margin-left: 3px; word-break: break-all; white-space: normal; display: -ms-inline-flexbox !important; display: inline-flex !important;} .sidebar-02 ul li.dec-li > ul li .dec-box-list a.dec-01c:hover .dec-type {color: #169cbf;}*/ .sidebar-02 ul li.dec-li > ul li .dec-box-list .dec-form-check { width:calc(100% - 0px); margin:0px; padding:5px 0px; line-height:1.2rem;} .sidebar-02 ul li.dec-li > ul li .dec-box-list .dec-form-check .form-check-input { margin-top: 0.2rem;} .sidebar-02 ul li.dec-li > ul li .dec-box-list .dec-form-check .form-check-label { width:calc(100% - 0px); margin:0px; padding:0px;} .sidebar-02 ul li.dec-li > ul li .dec-box-list .dec-form-check .form-check-label .dec-type { width:calc(100% - 0px); margin:0px; padding:0px; line-height:1.2rem;} /*end - .sidebar-02 -------------------------------------------------------------------------------------------------------*/ /*start - .boxSlidesContainer -------------------------------------------------------------------------------------------------------*/ .boxSlidesContainer { position:relative;} /* Hide the images by default */ .boxSlidesContainer .mySlides { /*display: none;*/ min-height:220px; background:#222222;} /* Add a pointer when hovering over the thumbnail images */ .boxSlidesContainer .cursor { cursor:pointer;} /* Next & previous buttons */ .boxSlidesContainer .prev, .boxSlidesContainer .next { cursor:pointer; position:absolute; top:150px; width:auto; padding:16px; margin-top:-50px; color:white; font-weight:bold; font-size:20px; border-radius:0 3px 3px 0; user-select:none; -webkit-user-select:none;} /* Position the "next button" to the right */ .boxSlidesContainer .next { right:0; border-radius:3px 0 0 3px;} /* On hover, add a black background color with a little bit see-through */ .boxSlidesContainer .prev:hover, .boxSlidesContainer .next:hover { background-color:rgba(0, 0, 0, 0.8);} /* Number text (1/3 etc) */ .boxSlidesContainer .numbertext { color:#f2f2f2; font-size:12px; padding:8px 12px; position:absolute; top:0;} .boxSlidesContainer p#caption { margin-bottom:5px;} /* Container for image text */ .boxSlidesContainer .caption-container { text-align:center; background-color:#222; padding:2px 16px; color:white;} .boxSlidesContainer .row { margin:0px;} .boxSlidesContainer .row:after { content:""; display:table; clear:both;} /* Six columns side by side */ .boxSlidesContainer .column { float:left; width:50%; background:#222222; min-height:110px;} /* Add a transparency effect for thumnbail images */ .boxSlidesContainer .demo01 { opacity:0.6;} .boxSlidesContainer .active, .boxSlidesContainer .demo01:hover { opacity:1;} /*end - .boxSlidesContainer -------------------------------------------------------------------------------------------------------*/ /*start - .boxSlidesContainerA -------------------------------------------------------------------------------------------------------*/ .boxSlidesContainerA { position:relative; padding:5px; height:calc(100% - 0px); width:calc(100% - 0px); overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .boxSlidesContainerA .box-view { width:calc(72vw - 0px); height:calc(100% - 0px); overflow:hidden;} .boxSlidesContainerA .box-thumbView { margin-top:11px; width:calc(28vw - 60px); height:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px; overflow:hidden;} /* Hide the images by default */ .boxSlidesContainerA .mySlidesA { width:calc(72vw - 0px); height:calc(100% - 0px); overflow:hidden;} /* Add a pointer when hovering over the thumbnail images */ .boxSlidesContainerA .cursor { cursor:pointer;} /* Next & previous buttons */ .boxSlidesContainerA .prev, .boxSlidesContainerA .next { cursor:pointer; position:absolute; top:calc(50% - 0px); width:auto; padding:16px; margin-top:-50px; color:white; font-weight:bold; font-size:20px; border-radius:0 3px 3px 0; user-select:none; -webkit-user-select:none;} /* Position the "next button" to the right */ .boxSlidesContainerA .next { right:0; right:auto; left:calc(72vw - 38px); border-radius:3px 0 0 3px;} /* On hover, add a black background color with a little bit see-through */ .boxSlidesContainerA .prev:hover, .boxSlidesContainerA .next:hover { background-color:rgba(0, 0, 0, 0.8);} /* Number text (1/3 etc) */ .boxSlidesContainerA .numbertext { color:#f2f2f2; font-size:12px; padding:8px 12px; position:absolute; top:0;} .boxSlidesContainerA p#captionA { margin-bottom:5px;} /* Container for image text */ .boxSlidesContainerA .caption-containerA { text-align:center; background-color:#222; padding:2px 16px; color:white; width:calc(72vw - 0px);} .boxSlidesContainerA .row { margin:0px; width:calc(100% - 0px); height:calc(100% - 0px);} .boxSlidesContainerA .row:after { content:""; display:table; clear:both;} /* Six columns side by side */ .boxSlidesContainerA .column { float:left; width:50%; width:calc(50% - 5px); height:calc((100%/6) - 8px);} .boxSlidesContainerA .column:nth-child(odd) { margin-right:5px; margin-top:10px;} .boxSlidesContainerA .column:nth-child(even) { margin-left:5px; margin-top:10px;} /*start - 螢幕數量切換dec-monitor-08, dec-monitor-12*/ .con-main.dec-monitor-08 .boxSlidesContainerA .column { float:left; width:50%; width:calc(50% - 5px); height:calc((100%/4) - 8px);} .con-main.dec-monitor-08 .boxSlidesContainerA .column:nth-child(odd) { margin-right:5px; margin-top:10px;} .con-main.dec-monitor-08 .boxSlidesContainerA .column:nth-child(even) { margin-left:5px; margin-top:10px;} .con-main.dec-monitor-12 .boxSlidesContainerA .column { float:left; width:50%; width:calc(50% - 5px); height:calc((100%/6) - 8px);} .con-main.dec-monitor-12 .boxSlidesContainerA .column:nth-child(odd) { margin-right:5px; margin-top:10px;} .con-main.dec-monitor-12 .boxSlidesContainerA .column:nth-child(even) { margin-left:5px; margin-top:10px;} /*end - 螢幕數量切換dec-monitor-08, dec-monitor-12*/ /* Add a transparency effect for thumnbail images */ .boxSlidesContainerA .demo01A { opacity:0.6;} .boxSlidesContainerA .active, .boxSlidesContainerA .demo01A:hover { opacity:1;} /*end - .boxSlidesContainerA -------------------------------------------------------------------------------------------------------*/ /*start - .main-area.dec-Monitor-Video-NewPage -------------------------------------------------------------------------------------------------------*/ .main-area.dec-Monitor-Video-NewPage { background:#464646; overflow:hidden;} .main-area.dec-Monitor-Video-NewPage .con-container { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px 15px 15px 15px; overflow:hidden; background:#464646;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function { width:calc(100% - 0px); height:50px; margin:0px; padding:0px; overflow:hidden; color:#FFFFFF; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function { width:calc(100% - 0px); height:calc(65% - 25px); margin:0px; padding:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-bottom-function { width:calc(100% - 0px); height:calc(35% - 24px); margin:0px; padding:0px; overflow:hidden; border-top:1px solid #999999; background:#ebebeb; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-bottom-function .dec-box-L { width:calc(50% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden; border-left:1px solid #999999; border-right:1px solid #999999; border-bottom:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-bottom-function .dec-box-R { width:calc(50% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:auto; border-left:0px solid #999999; border-right:1px solid #999999; border-bottom:1px solid #999999; background:#FFFFFF;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-bottom-function .dec-box-L .gmap { width:100%; height:100%; background:url("../images/sample/sample_map.png"); background-repeat:repeat;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-bottom-function .dec-box-R .box-tableArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-bottom-function .dec-box-R .box-tableArea .dec-table {} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .dec-title { font-size:1.5rem; line-height:1.7rem; letter-spacing:0.2rem; font-weight:bold;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .dec-selection { margin:0px; padding:0px; font-size:1rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .dec-selection .dec-subTitle-01 { font-size:1rem; line-height:1.2rem; margin:0px; padding:5px 0px 5px 20px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .dec-selection .dec-subTitle-02 { font-size:1rem; line-height:1.2rem; margin:0px; padding:5px 5px 5px 20px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .dec-selection .dec-type { font-size:1rem; line-height:1.2rem; margin:0px; padding:5px 0px 5px 15px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .dec-selection .box-inner-width-01 { width:50px; margin:0px; padding:0px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .dec-selection .box-inner-width-02 { width:100px; margin:0px; padding:0px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .con-btnbox { margin:0px; padding:0px 0px 0px 5px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .con-btnbox a { margin:0px; height:33.5px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .con-btnbox-01 { margin:0px; margin-left:auto; padding:0px 0px 0px 5px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .con-btnbox-01 a { margin:0px; height:33.5px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .con-btnbox-01 a.dec-btn, .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .con-btnbox-01 a.dec-btn:hover { margin-left:auto; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .con-btnbox-01 a.dec-btn { background:#FFFFFF; color:#787878;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .con-btnbox-01 a.dec-btn:hover { background:#fafafa; color:#169cbf;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-top-function .con-btnbox-01 a.dec-btn .dec-ic { margin:0px 2px 0px 0px;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box { width:calc(25% - 0px); width:calc((100%/6) - 0px); height:calc(50% - 0px); margin:0px; padding:0px; overflow:hidden; border-left:0px; border-top:0px; border-right:1px solid #999999; border-bottom:1px solid #999999; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box:nth-child(1) { border-left:1px solid #999999; border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box:nth-child(2) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box:nth-child(3) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box:nth-child(4) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box:nth-child(5) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box:nth-child(6) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box:nth-child(7) { border-left:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box .dec-videoArea .dec-note { width:calc(100% - 0px); margin:0px auto; padding:0px; background:transparent; font-size:1.2rem; line-height:1.5rem; color:#ebebeb; text-align:center;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box .dec-videoArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function .dec-box .dec-videoArea .dec-img { width:calc(100% - 0px); min-height:213px; background:url("../images/sample/img_video_none_transparent.svg"); background-position:center; background-repeat:no-repeat; background-blend-mode:darken; margin:auto; padding:0px;} /*註：螢幕數量切換dec-monitor-08, dec-monitor-12*/ /*start - .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08*/ .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08 .dec-box { width:calc(25% - 0px); height:calc(50% - 0px); margin:0px; padding:0px; overflow:hidden; border-left:0px; border-top:0px; border-right:1px solid #999999; border-bottom:1px solid #999999; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08 .dec-box:nth-child(1) { border-left:1px solid #999999; border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08 .dec-box:nth-child(2) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08 .dec-box:nth-child(3) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08 .dec-box:nth-child(4) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08 .dec-box:nth-child(5) { border-left:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08 .dec-box .dec-videoArea .dec-note { width:calc(100% - 0px); margin:0px auto; padding:0px; background:transparent; font-size:1.2rem; line-height:1.5rem; color:#ebebeb; text-align:center;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08 .dec-box .dec-videoArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08 .dec-box .dec-videoArea .dec-img { width:calc(100% - 0px); min-height:213px; background:url("../images/sample/img_video_none_transparent.svg"); background-position:center; background-repeat:no-repeat; background-blend-mode:darken; margin:auto; padding:0px;} /*end - .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-08*/ /*start - .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12*/ .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box { width:calc(25% - 0px); width:calc((100%/6) - 0px); height:calc(50% - 0px); margin:0px; padding:0px; overflow:hidden; border-left:0px; border-top:0px; border-right:1px solid #999999; border-bottom:1px solid #999999; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box:nth-child(1) { border-left:1px solid #999999; border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box:nth-child(2) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box:nth-child(3) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box:nth-child(4) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box:nth-child(5) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box:nth-child(6) { border-top:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box:nth-child(7) { border-left:1px solid #999999;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box .dec-videoArea .dec-note { width:calc(100% - 0px); margin:0px auto; padding:0px; background:transparent; font-size:1.2rem; line-height:1.5rem; color:#ebebeb; text-align:center;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box .dec-videoArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12 .dec-box .dec-videoArea .dec-img { width:calc(100% - 0px); min-height:213px; background:url("../images/sample/img_video_none_transparent.svg"); background-position:center; background-repeat:no-repeat; background-blend-mode:darken; margin:auto; padding:0px;} /*end - .main-area.dec-Monitor-Video-NewPage .con-container .dec-middle-function.dec-monitor-12*/ /*end - .main-area.dec-Monitor-Video-NewPage -------------------------------------------------------------------------------------------------------*/ /*start - .dec-box-treeview -------------------------------------------------------------------------------------------------------*/ .dec-box-treeview { color: #595959;} .dec-box-treeview ul, .dec-box-treeview #myUL, .dec-box-treeview #myUL-02, .dec-box-treeview #myUL-03 { list-style-type: none; width:calc(100% - 0px);} /* Remove margins and padding from the parent ul */ .dec-box-treeview #myUL { margin: 0; padding: 0;} .dec-box-treeview #myUL-02 { margin: 0; padding: 0;} .dec-box-treeview #myUL-03 { margin: 0; padding: 0;} .dec-box-treeview .dec-widthWhole { width:calc(100% - 0px); height: 30px; overflow: hidden; margin:5px 0px 0px 0px; padding:0px; position: relative;} .dec-box-treeview .dec-widthWhole .dec-form-check { margin-top: 5px; right: 10px; position: absolute;} .dec-box-treeview .dec-widthWhole .dec-form-check-02 { margin-top: 5px; right: 120px; position: absolute;} .dec-box-treeview .dec-widthWhole .dec-form-check-03 { margin-top: 5px; right: 43px; position: absolute;} /* Style the caret/arrow */ .dec-box-treeview .caret, .dec-box-treeview .caret:hover { border-radius: 0.5rem; padding: 5px; position: relative; margin-top: 5px; cursor: auto; user-select: none; /* Prevent text selection */ width:calc(100% - 0px);} .dec-box-treeview .caret:hover { background:#ebebeb;} /* Create the caret/arrow with a unicode, and style it */ .dec-box-treeview .caret::before { /*content: "\25B6"; transform: rotate(0deg); color: #595959; display: inline-block; margin-right: 6px;*/} .dec-box-treeview .caret-down, .dec-box-treeview .caret-down:hover { background:#ebebeb; border-radius: 0.5rem; padding: 5px; color: #595959; margin-top:5px; position:relative; cursor:auto;} .dec-box-treeview ul > li ul { margin-top: 0px;} .dec-box-treeview ul > li ul > li { margin-top: 0px; position: relative;} .dec-box-treeview ul > li ul > li ul { margin-top: 0px;} .dec-box-treeview .dec-box { padding: 5px 0px 5px 5px; border-radius: 0.5rem; margin-top:2px;} .dec-box-treeview .dec-box:hover { background:#ebebeb;} /* Rotate the caret/arrow icon when clicked on (using JavaScript) */ .dec-box-treeview .caret-down::before, .dec-box-treeview .caret-down:hover::before { /*content: "\25B6"; transform: rotate(90deg); color: #595959; display: inline-block; margin-right: 6px;*/} /* Hide the nested list */ .dec-box-treeview .nested { display:none;} /* Show the nested list when the user clicks on the caret/arrow (with JavaScript) */ .dec-box-treeview .active { display:block;} .dec-box-treeview #myUL ul { width:calc(100% - 10px); border-left: 2px solid #CCCCCC; margin-left:10px;} .dec-box-treeview #myUL ul > li ul { width: calc(100% - 10px); position: relative;} .dec-box-treeview #myUL ul > li ul > li ul { width: calc(100% - 10px); position:relative;} .dec-box-treeview #myUL ul > li ul > li ul > li ul { width: calc(100% - 10px); position:relative;} .dec-box-treeview #myUL-02 ul { width:calc(100% - 10px); border-left:2px solid #CCCCCC; margin-left:10px;} .dec-box-treeview #myUL-02 ul > li ul { width: calc(100% - 10px);} .dec-box-treeview #myUL-02 ul > li ul > li ul { width: calc(100% - 10px);} .dec-box-treeview #myUL-02 ul > li ul > li ul > li ul { width: calc(100% - 10px);} .dec-box-treeview #myUL-03 ul { width:calc(100% - 10px); border-left:2px solid #CCCCCC; margin-left:10px;} .dec-box-treeview #myUL-03 ul > li ul { width:calc(100% - 10px); position: relative;} .dec-box-treeview #myUL-03 ul > li ul > li ul { width:calc(100% - 10px); position: relative;} .dec-box-treeview #myUL-03 ul > li ul > li ul > li ul { width:calc(100% - 10px); position:relative;} .dec-box-treeview .caret .dec-form-check, .dec-box-treeview .caret-down .dec-form-check, .dec-box-treeview .caret li .dec-form-check, .dec-box-treeview .caret-down li .dec-form-check { display:inline-block; right:10px; position:absolute;} .dec-box-treeview ul > li ul > li .dec-form-check { display:inline-block; right:10px; position:absolute;} .dec-box-treeview .caret .dec-form-check-02, .dec-box-treeview .caret-down .dec-form-check-02, .dec-box-treeview .caret li .dec-form-ccheck-02, .dec-box-treeview .caret-down li .dec-form-check-02 { display:inline-block; right:120px; position:absolute;} .dec-box-treeview ul > li ul > li .dec-form-check-02 { display:inline-block; right:120px; position:absolute;} /*start - a.btn-treeview... ----------------------------------------*/ a.btn-treeview-collapse, a.btn-treeview-sub01-collapse, a.btn-treeview-sub011-collapse, a.btn-treeview-sub012-collapse, a.btn-treeview-sub02-collapse, a.btn-treeview-expand, a.btn-treeview-sub01-expand, a.btn-treeview-sub011-expand, a.btn-treeview-sub012-expand, a.btn-treeview-sub02-expand, a.btn-treeview-a02-expand, a.btn-treeview-a02-collapse, a.btn-treeview-a02-sub01-collapse, a.btn-treeview-a02-sub02-collapse, a.btn-treeview-a02-sub01-expand, a.btn-treeview-a02-sub02-expand, a.btn-treeview-a03-expand, a.btn-treeview-a03-collapse, a.btn-treeview-a04-expand, a.btn-treeview-a04-collapse, a.btn-treeview-a04-sub01-collapse, a.btn-treeview-a04-sub01-expand, a.btn-treeview-b01-expand, a.btn-treeview-b01-collapse { padding:0px !important; background:transparent;} a.btn-treeview-collapse::before, a.btn-treeview-sub01-collapse::before, a.btn-treeview-sub011-collapse::before, a.btn-treeview-sub012-collapse::before, a.btn-treeview-sub02-collapse::before, a.btn-treeview-a02-collapse::before, a.btn-treeview-a02-sub01-collapse::before, a.btn-treeview-a02-sub02-collapse::before, a.btn-treeview-a03-collapse::before, a.btn-treeview-a04-collapse::before, a.btn-treeview-a04-sub01-collapse::before, a.btn-treeview-b01-collapse::before { content:"\25B6"; transform:rotate(90deg); color:#595959; display:inline-block; margin-right:6px;} a.btn-treeview-expand::before, a.btn-treeview-sub01-expand::before, a.btn-treeview-sub011-expand::before, a.btn-treeview-sub012-expand::before, a.btn-treeview-sub02-expand::before, a.btn-treeview-a02-expand::before, a.btn-treeview-a02-sub01-expand::before, a.btn-treeview-a02-sub02-expand::before, a.btn-treeview-a03-expand::before, a.btn-treeview-a04-expand::before, a.btn-treeview-a04-sub01-expand::before, a.btn-treeview-b01-expand::before { content:"\25B6"; transform:rotate(0deg); color:#595959; display:inline-block; margin-right:6px;} /*end - a.btn-treeview... ----------------------------------------*/ /*start - a.btn-treeviewA... ----------------------------------------*/ a.btn-treeviewA-collapse, a.btn-treeviewA-sub01-collapse, a.btn-treeviewA-sub011-collapse, a.btn-treeviewA-sub012-collapse, a.btn-treeviewA-sub02-collapse, a.btn-treeviewA-expand, a.btn-treeviewA-sub01-expand, a.btn-treeviewA-sub011-expand, a.btn-treeviewA-sub012-expand, a.btn-treeviewA-sub02-expand, a.btn-treeviewA-a02-expand, a.btn-treeviewA-a02-collapse, a.btn-treeviewA-a02-sub01-collapse, a.btn-treeviewA-a02-sub02-collapse, a.btn-treeviewA-a02-sub01-expand, a.btn-treeviewA-a02-sub02-expand, a.btn-treeviewA-a03-expand, a.btn-treeviewA-a03-collapse, a.btn-treeviewA-a04-expand, a.btn-treeviewA-a04-collapse, a.btn-treeviewA-a04-sub01-collapse, a.btn-treeviewA-a04-sub01-expand { padding:0px !important; background:transparent;} a.btn-treeviewA-collapse::before, a.btn-treeviewA-sub01-collapse::before, a.btn-treeviewA-sub011-collapse::before, a.btn-treeviewA-sub012-collapse::before, a.btn-treeviewA-sub02-collapse::before, a.btn-treeviewA-a02-collapse::before, a.btn-treeviewA-a02-sub01-collapse::before, a.btn-treeviewA-a02-sub02-collapse::before, a.btn-treeviewA-a03-collapse::before, a.btn-treeviewA-a04-collapse::before, a.btn-treeviewA-a04-sub01-collapse::before { content:"\25B6"; transform:rotate(90deg); color:#595959; display:inline-block; margin-right:6px;} a.btn-treeviewA-expand::before, a.btn-treeviewA-sub01-expand::before, a.btn-treeviewA-sub011-expand::before, a.btn-treeviewA-sub012-expand::before, a.btn-treeviewA-sub02-expand::before, a.btn-treeviewA-a02-expand::before, a.btn-treeviewA-a02-sub01-expand::before, a.btn-treeviewA-a02-sub02-expand::before, a.btn-treeviewA-a03-expand::before, a.btn-treeviewA-a04-expand::before, a.btn-treeviewA-a04-sub01-expand::before { content:"\25B6"; transform:rotate(0deg); color:#595959; display:inline-block; margin-right:6px;} /*end - a.btn-treeviewA... ----------------------------------------*/ /*end - .dec-box-treeview -------------------------------------------------------------------------------------------------------*/ /*start - resizable - 圖台兩側模式_可調寬度 ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ #map-canvas { height:100%; width:100%;} .float-left { margin-top:0px; float:left;} .handler_vertical { background:url("../js/resizable/img/handle-v.png") 3px 50% no-repeat; background-color:rgb(246, 246, 246); width: 9px; border:1px solid silver; float:left;} #chart-panel { padding:0px 0px 5px 10px; height: 100%; overflow:hidden; background:#FFFFFF;} #map-panel { padding:0px; margin:0px; width:calc(100% - 350px); height:calc(100vh - 89px);} /*start - [for 振展｜兩側模式] .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable ---------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable { height:calc(100vh - 88px); background:#FFFFFF; width:calc(100% - 0px); top:88px; left:0px; /*z-index: 999;實際程式設定時會有衝突，所以隱藏，2022/09/13 update*/ margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner .con-main { width:calc(100% - 0px); height:calc(100% - 45px); margin:0px; padding:1px 3px 0px 3px; overflow:hidden; color:#595959; display:block; background-image:linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0.5));} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner { width:calc(100% - 0px); height: calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea { width:calc(100% - 0px); margin:0px; padding:5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea a.dec-btn { background:#ebebeb; margin:0px; padding:5px 10px; border-radius:25px; color:#999999;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea a.dec-btn:hover { color:#169cbf; background: #ebebeb;} .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .table-responsive.dec-table.dec-fixedTableHeader { height: calc(100% - 120px);} /*end - .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result*/ /*end - [for 振展｜兩側模式] .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideModeResizable ---------------------------*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable { height:calc(100vh - 88px); background:#FFFFFF; width:calc(100% - 0px); top:88px; left:0px; /*z-index: 999;實際程式設定時會有衝突，所以隱藏，2022/09/13 update*/ margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top { width:calc(100% - 0px); height:40px; margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title { width:calc(100% - 35px); margin-right:auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title .dec-type { color:#169cbf; display:inline-block; margin:0px; padding:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title .dec-type-note { color:#595959; margin:0px; padding:0px; display:inline-block; font-size:1rem; line-height:1rem; font-weight:400;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-btn { width:35px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title .dec-driverArea { width:calc(100% - 70px); height:28px; margin:0px; padding:5px 0px; overflow:hidden; vertical-align:middle;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title .dec-btnArea { width:70px; margin:0px; padding:0px; text-align:right;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-messageText { width:calc(100% - 0px); height:calc(100% - 50px); margin:0px; padding:5px; overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-messageTextBtn { width:calc(100% - 0px); height:50px; margin:0px; padding:5px; overflow-x:hidden; overflow-y:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-messageTextBtn .con-conbox { width:calc(100% - 65px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-messageTextBtn .con-btnbox { width:60px; margin:0px 0px 0px 5px; padding:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-messageTextBtn .con-btnbox a.btn-search, .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-messageTextBtn .con-btnbox a.btn-search:hover { border-radius:5px; margin:0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-messageTextBtn .con-btnbox a.btn-search.disabled, .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-messageTextBtn .con-btnbox a.btn-search.disabled:hover { color:#FFFFFF; background:#CCCCCC;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-messageTextBtn .con-btnbox a.btn-search { color:#999999; background:#ebebeb; border:1px solid #ced4da;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-messageTextBtn .con-btnbox a.btn-search:hover { color:#169cbf; background:#f5f5f5; border:1px solid #ced4da;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-functionbox div.form-check { display:inline-block; margin:5px 25px 5px 0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-h-btn .con-btnbox a, .MapTool-FunctionBox.dec-RightSideModeResizable .box-conArea .box-conArea-outerBox .box-conArea-con .box-con-whole .box-inner-width-h-btn .con-btnbox a:hover { margin-top:0px;} /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; border-radius:0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: end !important; align-self: flex-end !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con:first-child { margin:0px; border:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con .box-con { width:calc(100% - 50px); margin:0px; padding:5px; border-radius:15px 15px 0px 15px; background:#29aecc; text-align:left; color:#FFFFFF; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-order: 2; order: 2;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con .box-con .box-Name { width: auto; margin:0px; padding:5px; font-size: 1rem; line-height:1.2rem; border-radius:50px; text-align:right; background:#FFFFFF; color:#29aecc;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con .box-con .box-Con { width:calc(100% - 0px); margin:0px; padding:2px 0px 0px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-item-align: start !important; align-self: flex-start !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con .box-con .box-Con .dec-time { font-size:12px; line-height:1.3rem; color:#fcfbe0;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con .box-note { width:50px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-item-align: end !important; align-self: flex-end !important; -ms-flex-order: 1; order: 1;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con .box-con .box-R .dec-type { font-size:1rem; line-height:1.3rem;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con .box-note .btn-ic-checked { color:#8cc63f; width:25px; height:25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent; margin-left:auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con .box-note .btn-ic-uncheck { color:#f15a24; width:25px; height:25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent; margin-left:auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con .box-note .btn-ic-checked:hover { color:#72bf44;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con .box-note .btn-ic-uncheck:hover { color:#ed1c24;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; border-radius:0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: end !important; align-self: flex-end !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer:first-child { margin:0px; border: 0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-con { width:calc(100% - 50px); margin:0px; padding:5px; border-radius:15px 15px 15px 0px; background:#f0f0f0; text-align:left; color:#666666; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-order: 1; order: 1;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-con .box-Name { width:auto; margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; border-radius:50px; text-align:right; background:#FFFFFF; color: #595959;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-con .box-Con { width:calc(100% - 0px); margin:0px; padding:2px 0px 0px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-item-align: start !important; align-self: flex-start !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-con .box-Con .dec-time { font-size:12px; line-height:1.3rem; color:#AFAFAF;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-note { width:50px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-item-align: end !important; align-self: flex-end !important; -ms-flex-order: 1; order: 1;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-con .box-R .dec-type { font-size:1rem; line-height:1.3rem;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-note .btn-ic-checked { color:#8cc63f; width:25px; height:25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent; margin-left: auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-note .btn-ic-uncheck { color:#f15a24; width:25px; height: 25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent; margin-left: auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-note .btn-ic-checked:hover { color:#72bf44;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-note .btn-ic-uncheck:hover { color:#ed1c24;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer .box-note .dec-time { font-size:12px; line-height:1.3rem; color:#AFAFAF;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .box-message-con.dec-viewer*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title.dec-back { width:calc(100% - 35px); margin-left:auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-btn.dec-back { width:35px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title a.dec-btn, .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title a.dec-btn:hover { margin-left:auto; margin-right: 0px; border-radius:25px; padding:5px 8px; border:1px solid #e1e1e1; font-weight:normal; font-size:1rem; letter-spacing:normal; height:29px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title a.dec-btn { background:#FFFFFF; color:#787878;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title a.dec-btn:hover { background:#fafafa; color:#169cbf;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title a.dec-btn.dec-m01 { margin-left:5px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title a.dec-btn .dec-ic { margin:0px; padding:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title a.dec-btn .dec-ic-01 { margin:2px 0px 0px 0px; padding:0px;} /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main ------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-Mission-Edit-RightSideModeResizable-boxInner .con-main { overflow-x:hidden; overflow-y:auto;} /*start - .div-MapTool-Mission-Edit-RightSideModeResizable-boxInner .con-main .box-infoCon .dec-con .con-functionbox ----------------------------------------------------*/ .div-MapTool-Mission-Edit-RightSideModeResizable-boxInner .con-main .box-infoCon .dec-con .con-functionbox { } .div-MapTool-Mission-Edit-RightSideModeResizable-boxInner .con-main .box-infoCon .dec-con .con-functionbox .form-check.dec-a01 { width:auto; margin:5px 10px 5px 0px; margin-bottom:5px; padding:0px 0px 0px 25px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .div-MapTool-Mission-Edit-RightSideModeResizable-boxInner .con-main .box-infoCon .dec-con .con-functionbox .form-check.dec-a02 { width:auto; margin-bottom:5px; padding:0px 0px 0px 25px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .div-MapTool-Mission-Edit-RightSideModeResizable-boxInner .con-main .box-infoCon .dec-con .con-functionbox .form-check.dec-a01 .form-check-label { width:auto; margin-top:0.2rem;} .div-MapTool-Mission-Edit-RightSideModeResizable-boxInner .con-main .box-infoCon .dec-con .con-functionbox .form-check.dec-a01 .form-check-input { margin-top:0.3rem;} /*end - .div-MapTool-Mission-Edit-RightSideModeResizable-boxInner .con-main .box-infoCon .dec-con .con-functionbox ----------------------------------------------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main.dec-Monitor-CarInfo-Detail-Car-RightSideModeResizable { overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main { width:calc(100% - 0px); height:calc(100% - 45px); margin:0px; padding:1px 3px 5px 3px; overflow:hidden; color:#595959; display:block; background-image:linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0.5));} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner { width:calc(100% - 0px); height: calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner.dec-overflow-01 { overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-btnArea { width:calc(100% - 10px); margin:0px 5px; padding:10px 0px 0px 0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-top .con-top-title .dec-note { margin:0px; padding:0px 0px 0px 10px; color:#999999; font-weight:normal; letter-spacing:0rem; font-size:14px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:1rem; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#169cbf;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con .dec-box-subTitle .dec-type { display:inline-block; color:#595959;} /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea { width:calc(100% - 10px); margin:0px 5px; padding:5px 0px 5px 0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea.dec-border { border-top:1px solid #e6e6e6;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea.dec-subCon { padding:0px 0px 5px 15px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole .form-group.dec-form-group { margin-bottom:0.5rem;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label .dec-type { margin:0px; padding:10px 0px 5px 0px; display:inline-block;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label a.dec-btn, .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label a.dec-btn:hover { text-decoration:underline !important; margin:0px; padding:10px 5px 5px 5px; float:right; display:inline-block;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label a.dec-btn { color:#169cbf;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole label a.dec-btn:hover { color:#29aecc;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea form.dec-conWhole input { margin:0px; padding:5px 0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea .dec-subTitle { width:calc(100% - 0px); margin:0px; padding:10px 0px 5px 0px; font-weight:500; font-size:15px; line-height: 18px; border-bottom:1px solid #e6e6e6;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea .dec-typeArea { width:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea .dec-typeArea.dec-padding { padding-top:5px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea .dec-conWhole { width:calc(100% - 10px); margin:0px; padding:5px 0px 5px 0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea .dec-noteArea { width:calc(100% - 0px); margin:0px 5px; padding:0px 0px 20px 0px; text-align:left;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea .dec-noteArea .dec-type { margin:0px; padding:0px; font-size:1rem; line-height:1.5rem; color:#999999;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-conArea*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-noteArea*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-noteArea { width:calc(100% - 10px); margin:0px 5px; padding:5px 0px 0px 0px; text-align:center;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-noteArea .dec-type { margin:0px; padding:0px; font-size:1rem; line-height:1.5rem; color:#e73828;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-noteArea*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea { width:calc(100% - 0px); height:calc(100% - 50px); margin:0px; padding:0px 0px 5px 5px; overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-btnArea { width:calc(100% - 0px); height:50px; margin:5px 0px 0px 0px; padding:0px 5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-btnArea .dec-btn-width-01 { width:auto; margin-left:5px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-btnArea .dec-btn-width-01:first-child { margin-left:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-btnArea .dec-type { padding:0px 15px 0px 48px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea .dec-MapTool-RoutePlan-listArea { width:calc(100% - 0px); margin:25px 0px 0px 0px; padding:5px; border-radius:5px; background:#fafafa;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole { } .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea { width:calc(100% - 0px); margin-right:0px; display:inline-block;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea:first-child { margin-top:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea.dec-fullScreen { width:calc(50% - 25px); margin-right:45px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea.dec-fullScreen:nth-child(even) { margin-right:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea.dec-fullScreen:first-child, .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea .dec-contentArea.dec-whole .dec-MapTool-RoutePlan-listArea.dec-fullScreen:nth-child(even) { margin-top:0px;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-MapTool-RoutePlan-TableArea*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01 { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01:first-child { border:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01 .box-infoArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01 .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#595959;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01 .dec-box-subTitle .dec-note { margin:0px 0px 0px 15px; font-size:13px; color:#f7931e; font-weight:normal; width:calc(100% - 145px); word-break: break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01 .dec-box-subTitle .dec-note::before { content:"："; color:#595959; margin:0px 0px 0px -15px; padding:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01 .dec-box-subTitle .dec-note .dec-date { letter-spacing:0.05rem; font-size:12px; word-break:break-all;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01 .box-infoArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01 .box-infoArea .dec-box-list .dec-box-list-L { width:100px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height: 1.2rem;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01 .box-infoArea .dec-box-list .dec-box-list-L::after { content:"："; color:#595959;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01 .box-infoArea .dec-box-list .dec-box-list-R { width:calc(100% - 100px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01.dec-w01 .box-infoArea .dec-box-list .dec-box-list-L { width:130px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height:1.2rem;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01.dec-w01 .box-infoArea .dec-box-list .dec-box-list-L::after { content:"："; color:#595959;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01.dec-w01 .box-infoArea .dec-box-list .dec-box-list-R { width:calc(100% - 130px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .box-con-01*/ /*start - .con-main.dec-ChargingPileInfo-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main.dec-ChargingPileInfo-RightSideModeResizable { width:calc(100% - 0px); margin:0px; padding:0px;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con:first-child { border:0px;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .box-infoArea { width:calc(100% - 0px); margin:0px; padding:10px; background: #f0f0f0; border-radius: 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .box-infoArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .box-infoArea .dec-box-list .dec-box-list-L { width:80px; margin:0px; padding:0px; text-align:left; color:#595959; font-size:1rem; line-height:1.2rem;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .box-infoArea .dec-box-list .dec-box-list-R { width:calc(100% - 80px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem; font-weight:500;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:15px 5px 8px 2px; font-size:16px; font-weight:500; line-height:1.2rem; letter-spacing:0.2rem; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .dec-box-subTitle .dec-type { margin:0px; padding:0px; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#595959;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .dec-box-subTitle .dec-update { margin:0px; padding:0px; font-size:12px; line-height:1.2rem; letter-spacing:0rem; font-weight:400; color:#adadad;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .box-currentData { width:calc(50% - 3px); margin:0px 0px 5px 0px; padding:0px; background:#fafafa; border-radius:5px; border:1px solid #e1e1e1; text-align:center; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .box-currentData:hover { background:#fcfbe0;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; font-size:1.5rem; font-weight:500; color:#595959;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-color { color:#e73828;} .con-main.dec-ChargingPileInfo-RightSideModeResizable .box-con .box-currentData .dec-box-type { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; color:#a3a3a3;} /*end - .con-main.dec-ChargingPileInfo-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main ------------------------------------------------------------------------------------------------------*/ /*start - .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable ------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable { overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-ListArea { width:calc(100% - 0px); height:calc(100% - 50px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} /*start - .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List ------------------------*/ .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List, .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover { width:calc(100% - 0px); margin:0px; padding:5px; border-bottom:1px solid #e1e1e1; background:transparent; text-decoration:none; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover { background:#fcfbe0;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content { width:calc(100% - 0px); margin:0px; padding:0px; margin-right:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content .dec-con-titleArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content .dec-con-titleArea a.dec-con-title, .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content .dec-con-titleArea a.dec-con-title:hover, .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content .dec-con-titleArea a.dec-con-title, .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content .dec-con-titleArea a.dec-con-title:hover { width:calc(100% - 60px); margin:0px; padding:0px; font-size:1.2rem; line-height: 1.7rem; font-weight:500; text-overflow:ellipsis; white-space:nowrap; overflow-x:hidden;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content .dec-con-titleArea a.dec-con-title { color:#787878;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content .dec-con-titleArea a.dec-con-title:hover { color:#29aecc;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content .dec-con-titleArea a.dec-con-title { color:#29aecc;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content .dec-con-titleArea a.dec-con-title:hover { color:#29aecc;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content .dec-con-titleArea a .dec-ic { color:#999999; margin:0px; padding:0px;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content .dec-con-titleArea .btn-ic-checked { color:#8cc63f; width:25px; height:25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content .dec-con-titleArea .btn-ic-uncheck { color:#f15a24; width:25px; height:25px; overflow:hidden; margin:0px; padding:0px; border:0px; background:transparent;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content .dec-con-titleArea a .dec-ic { color:#787878;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content .dec-con-titleArea .btn-ic-checked { color:#72bf44;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content .dec-con-titleArea .btn-ic-uncheck { color:#ed1c24;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content a.dec-con, .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content a.dec-con { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1rem; line-height:1.5rem; text-overflow:ellipsis; white-space:nowrap; overflow-x:hidden; color:#b8b8b8;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content a.dec-con { color:#AEAEAE;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List .box-content a.dec-date, .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content a.dec-date { width:calc(100% - 0px); margin:0px; padding:0px; font-size:12px; line-height:16px; text-overflow:ellipsis; white-space:nowrap; overflow-x:hidden; color:#b8b8b8;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List:hover .box-content a.dec-date { color:#AEAEAE;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List.dec-unChecked .box-content .dec-con-titleArea a.dec-con-title { color:#f23300;} /*end - .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-List ------------------------*/ /*start - .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-con ------------------------*/ .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-con { width:calc(100% - 0px); height: 45px; margin:5px 0px 0px 0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-con .con-btnbox { width:60px; margin:0px; padding:0px;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-con .con-btnbox.dec-w01 { width:calc(33% - 5px); margin:0px; padding:0px;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-con .con-btnbox.dec-w02 { width:calc(33% - 5px); margin:0px 0px 0px 15px; padding:0px;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-con .con-btnbox.dec-w02:nth-child(1) { margin-left:0px;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-con .con-btnbox a.dec-btn { background:#fafafa; margin:0px; padding:3px 0px; border-radius:5px; color:#999999; border:1px solid #ced4da; height:33px;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-con .con-btnbox a.dec-btn:hover { color:#169cbf; background:#f5f5f5; border:1px solid #ced4da;} .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-con .con-btnbox a.dec-btn .dec-ic { margin:0px 2px 0px 0px; padding:0px;} /*end - .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable .box-con ------------------------*/ /*end - .con-main.dec-Monitor-CarInfo-Message-List-RightSideModeResizable ------------------------------------------------------------------------*/ /*start - .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .input-group { margin:0px; padding:0px; border-radius:25px; background:#eff1f3;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .input-group > .form-control:not(:last-child), .input-group > .custom-select:not(:last-child) { border-top-left-radius:25px; border-bottom-left-radius:25px; border-top-right-radius:0px; border-bottom-right-radius:0px;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .input-group .form-control { border:0px; background:#eff1f3; padding-left:10px;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .input-group .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color:#cacdd1; opacity:1; /* Firefox */} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .input-group .form-control:-ms- .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .input-group .form-control::-ms-input-placeholder { /* Microsoft Edge */ color:#d8dbdf;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .input-group .btn { color:#81868b;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .box-result { margin:0px; padding:0px; width:calc(100% - 0px); height:calc(100% - 37px); overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .box-ListArea-note { font-size:1rem; color:#5dc1cf; margin:0px; padding:8px 5px 5px 5px; height: 32px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .box-ListArea { width:calc( 100% - 0px); height:calc(100% - 32px); margin:0px; padding:5px 0px 0px 0px; overflow-x:hidden; overflow-y:auto; border-top:1px solid #ebebeb;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .box-ListArea a.box-List, .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .box-ListArea a.box-List:hover { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:8px 10px; border:0px; text-decoration:none; font-size:1rem; border-radius:25px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-item-align: start !important; align-self: flex-start !important;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .box-ListArea a.box-List:first-child, .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .box-ListArea a.box-List:hover:first-child { margin:0px;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .box-ListArea a.box-List { color:#787878; background:transparent;} .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable .box-ListArea a.box-List:hover { color:#29aecc; background:#fcfbe0;} /*end - .con-main.dec-Monitor-CarInfo-Message-Add-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass -------------------------------------------------------------------------------------------------------*/ .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .input-group { margin:0px; padding:0px; border-radius:25px; background:#eff1f3;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .input-group > .form-control:not(:last-child), .input-group > .custom-select:not(:last-child) { border-top-left-radius:25px; border-bottom-left-radius:25px; border-top-right-radius:0px; border-bottom-right-radius:0px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .input-group .form-control { border:0px; background:#eff1f3; padding-left:10px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .input-group .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color:#cacdd1; opacity:1; /* Firefox */} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .input-group .form-control:-ms- .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .input-group .form-control::-ms-input-placeholder { /* Microsoft Edge */ color:#d8dbdf;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .input-group .btn { color:#81868b;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-result { width:calc(100% - 0px); height:calc(100% - 80px); margin:0px; padding:0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-result .box-ListArea { width:calc( 100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-con { width:calc(100% - 0px); height:40px; margin:0px; padding:0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-con .con-btnbox { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-con .con-btnbox a { border-radius:25px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-con .con-btnbox a .dec-ic { margin-right:5px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-con .con-btnbox.dec-unselect a, .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-con .con-btnbox.dec-unselect a:hover { background:#fafafa; border:1px solid #e1e1e1; color:#d7d7d7;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-ListArea .box-listItem { width:calc(100% - 0px); margin:0px; padding:5px 0px; color:#595959; border-radius:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-ListArea .box-listItem.dec-selection { height:35px; margin:0px; padding:0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-ListArea .box-listItem.dec-selection .form-check, .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-ListArea .box-listItem.dec-selection .form-check:hover { background:transparent;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-ListArea .box-listItem.dec-selection .form-check { width:calc(100% - 0px); padding:10px 5px 0px 25px; border-radius:25px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-ListArea .box-listItem.dec-content { height: calc(100% - 35px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; border-top:1px solid #e1e1e1;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-ListArea .box-listItem .form-check { width:calc(100% - 0px); padding:5px 5px 5px 25px; border-radius:25px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-ListArea .box-listItem .form-check:hover { background:#fcfbe0;} .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable .box-ListArea .box-listItem.dec-content .form-check:first-child { margin:0px; border-top:0px; margin-top:5px;} /*end - .con-main.dec-Monitor-CarInfo-Message-AddMass-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-Message-AddMass-Con .con-top-title .dec-type { color:#169cbf; display:inline-block; margin:0px; padding:0px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable { width:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .input-group { margin:0px; padding:0px; border-radius:25px; background:#eff1f3;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .input-group > .form-control:not(:last-child), .input-group > .custom-select:not(:last-child) { border-top-left-radius:25px; border-bottom-left-radius:25px; border-top-right-radius:0px; border-bottom-right-radius:0px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .input-group .form-control { border:0px; background:#eff1f3; padding-left:10px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .input-group .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color:#cacdd1; opacity:1; /* Firefox */} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .input-group .form-control:-ms- .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .input-group .form-control::-ms-input-placeholder { /* Microsoft Edge */ color:#d8dbdf;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .input-group .btn { color:#81868b;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-result { width:calc(100% - 0px); height:calc(100% - 80px); margin:0px; padding:0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-result .box-ListArea { width:calc( 100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-con { width:calc(100% - 0px); height: 40px; margin:0px; padding:0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-con .con-btnbox { width:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-con .con-btnbox a { border-radius:25px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-con .con-btnbox a .dec-ic { margin-right:5px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-con .con-btnbox.dec-unselect a, .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-con .con-btnbox.dec-unselect a:hover { background:#fafafa; border:1px solid #e1e1e1; color:#d7d7d7;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-ListArea .box-listItem { width:calc(100% - 0px); margin:0px; padding:5px 0px; color:#595959; border-radius:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-ListArea .box-listItem.dec-selection { height:35px; margin:0px; padding:0px; overflow:hidden;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-ListArea .box-listItem.dec-selection .form-check, .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-ListArea .box-listItem.dec-selection .form-check:hover { background:transparent;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-ListArea .box-listItem.dec-selection .form-check { width:calc(100% - 0px); padding:10px 5px 0px 25px; border-radius:25px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-ListArea .box-listItem.dec-content { height:calc(100% - 35px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; border-top:1px solid #e1e1e1;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-ListArea .box-listItem .form-check { width:calc(100% - 0px); padding:5px 5px 5px 25px; border-radius:25px;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-ListArea .box-listItem .form-check:hover { background:#fcfbe0;} .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable .box-ListArea .box-listItem.dec-content .form-check:first-child { margin:0px; border-top:0px; margin-top:5px;} /*end - .con-main.dec-Monitor-CarInfo-Message-AddMass-Con-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .con-main.dec-MapTool-MonitorCar-DeviceInfo-RightSideModeResizable ----------------------------------------------------------------------------------------*/ .con-main.dec-MapTool-MonitorCar-DeviceInfo-RightSideModeResizable { width:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .con-main.dec-MapTool-MonitorCar-DeviceInfo-RightSideModeResizable .dec-list-area { width:calc(100% - 0px); margin:0px; margin-top:5px; padding:0px; word-break:break-all; font-size:1rem; line-height:1.2rem; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-main.dec-MapTool-MonitorCar-DeviceInfo-RightSideModeResizable .dec-list-area:first-child { margin-top:0px;} .con-main.dec-MapTool-MonitorCar-DeviceInfo-RightSideModeResizable .dec-list-area .dec-L { width:80px; margin:0px; padding:0px; text-align:right;} .con-main.dec-MapTool-MonitorCar-DeviceInfo-RightSideModeResizable .dec-list-area .dec-C { width:15px; margin:0px; padding:0px; text-align:center;} .con-main.dec-MapTool-MonitorCar-DeviceInfo-RightSideModeResizable .dec-list-area .dec-R { width:calc(100% - 95px); margin:0px; padding:0px;} /*end - .con-main.dec-MapTool-MonitorCar-DeviceInfo-RightSideModeResizable ----------------------------------------------------------------------------------------*/ /*start - .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable ----------------------------------------------------------------*/ .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-TrafficLight-Area { margin:0px; padding:0px; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-TrafficLight-Area .dec-TrafficLight-Box { margin:0px auto; padding:2px; border-radius:100px; color:#FFFFFF; background:#595959; border:1px solid #595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-TrafficLight-Area .dec-item { margin:0px; margin-left:5px; padding:0px; width:100px; height:100px; border-radius:100px; border:1px solid #595959; color: #FFFFFF; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-TrafficLight-Area .dec-item:first-child { margin-left:0px;} .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-TrafficLight-Area .dec-item.dec-Light-Red { background:#ff0000;} /*紅燈*/ .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-TrafficLight-Area .dec-item.dec-Light-Yellow { background:#fccf00;} /*黃燈*/ .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-TrafficLight-Area .dec-item.dec-Light-Green { background:#72bf44;} /*綠燈*/ .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-TrafficLight-Area .dec-item .dec-type { color:#FFFFFF; font-size:4.5rem; line-height:5rem; font-weight:500; margin:0px; padding:0px 0px 5px 0px;} .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .box-con { width:calc(100% - 0px); margin:15px 0px 0px 0px; padding:0px;} .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-list-area { width:calc(100% - 0px); margin:0px; margin-top:5px; padding:0px; word-break:break-all; font-size:1rem; line-height:1.2rem; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-list-area:first-child { margin-top:0px;} .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-list-area .dec-L { width:35px; margin:0px; padding:0px; text-align:right;} .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-list-area .dec-C { width:15px; margin:0px; padding:0px; text-align:center;} .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable .dec-list-area .dec-R { width:calc(100% - 50px); margin:0px; padding:0px;} /*end - .con-main.dec-MapTool-MonitorCar-SignInfo-RightSideModeResizable ----------------------------------------------------------------*/ /*start - .box-inner.dec-Mission-Edit-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main { width:calc(100% - 0px); margin:0px; padding:0px;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-bottom:1px solid #e1e1e1; margin-bottom:5px; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con.dec-box { background:#fafafa; padding: 5px; margin-bottom:5px; border:1px solid #c6dbde; border-radius:5px;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con:last-child { border:0px;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoArea { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:20px 0px; background:#f0f0f0; border-radius:5px; font-size:1.2rem; line-height:1.5rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoArea .box-carInfo-Num { margin:0px; padding:0px 5px 0px 0px;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoArea .box-carInfo-Driver { margin:0px; padding:0px; color:#1591BC;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoConOuter { width:calc(100% - 0px); margin:0px; padding:0px;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon.dec-box-01 { padding-top:0px;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-title { width:100px; margin:0px; padding:0px 5px 0px 0px; text-align:right;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-con { width:calc(100% - 100px); margin:0px; padding:0px;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-con.dec-textAlignR { text-align:right;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-con a { border-bottom: 1px solid transparent;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-con a:hover { border-bottom:1px solid #f7931e;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-con-whole { width:calc(100% - 0px); margin:0px; padding:0px;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-con-half-01 { width:calc(50% - 5px); margin:0px 5px 0px 0px; padding:0px;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-con-half-02 { width:calc(50% - 0px); margin:0px; padding:0px;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-con .dec-textarea { background:#FFFFFF; border:1px solid #ced4da; width:calc(100% - 0px); color:#495057;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-con-groupTitle { width:calc(100% + 10px); margin:-10px -5px 0px -5px; padding:5px 0px; border-bottom:1px solid #c6dbde; text-align: center; font-weight:500; background:#e8eff0; border-radius:3px 3px 0px 0px; color:#698394;} .box-inner.dec-Mission-Edit-RightSideModeResizable .con-main .box-con .box-infoCon .dec-note { width:calc(100% - 25px); margin:0px 10px 0px 15px; padding:0px; font-size:14px; line-height:1.2rem; color:#999999;} /*end - .box-inner.dec-Mission-Edit-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .box-inner.dec-Mission-Detail-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main { width:calc(100% - 0px); margin:0px; padding:0px; height:calc(100% - 0px); overflow:hidden;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-bottom:1px solid #e1e1e1; margin-bottom:5px; clear: both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:1rem; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#169cbf;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-con .dec-box-subTitle .dec-type { display:inline; color:#595959; background:#FFFFFF; border-radius:25px; padding:2px 5px 2px 7px; margin-right:5px;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-con .dec-box-subTitle .dec-type:last-child { margin-left:5px;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-btnArea {} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea { margin:0px; padding:5px; width:calc(100% - 0px); height:calc(100% - 135px); overflow-x:hidden; overflow-y:auto; font-size:1rem; line-height:1.2rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:0px; border:1px solid #e1e1e1; border-radius:5px; background: #fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item:hover { background:#fcfcfc;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item:first-child { margin:0px;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea { width:45px; margin:0px; padding:5px; background:#595959; border-radius:3px 0px 5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item:hover .dec-box-itemNumArea { background:#666666;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea .dec-type { font-size:12px; line-height:14px; color:#FFFFFF;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea .dec-num { font-size:1.5rem; line-height:2rem; color:#FFFFFF; font-weight:500;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea { width:calc(100% - 50px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list:first-child { margin:0px;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list .dec-L { width:100px; text-align:right;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list .dec-R { width:calc(100% - 115px); margin:0px; padding:5px; color:#169cbf;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-function { width:calc(100% - 0px); margin:0px; padding:5px; margin-top:5px; border-radius:0px 0px 5px 0px; border-top:1px dotted #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a, .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a:hover { margin:0px 0px 0px 5px; padding:8px 10px; text-decoration: none; height:34px; overflow:hidden; background:transparent; border-radius: 25px; border:1px solid #e1e1e1;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a { color:#595959; background:transparent;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a:hover { color:#333333; background:#ebebeb;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a.dec-arrow, .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a.dec-arrow:hover { padding:7px 8px; border-radius:5px;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-box-function .dec-note { font-size:12px; line-height:16px; color:#595959; margin:0px; padding:0px; margin-left:auto;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-B, .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-C, .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-D { font-size:1rem; margin:0px; padding:3px 8px 4px 8px; color:#FFFFFF; border-radius:25px; display:inline;} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-B::after { content:"未開始";} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-C::after { content:"進行中";} .box-inner.dec-Mission-Detail-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-D::after { content:"完成";} /* 派遣狀態｜1.未開始 #b3b3b3 (179, 179, 179) dec-type-missionCondition-B 派遣狀態｜2.進行中 #0089ff (0, 137, 255) dec-type-missionCondition-C 派遣狀態｜3.完成 #39b54a (57, 181, 74) dec-type-missionCondition-D */ /*end - .box-inner.dec-Mission-Detail-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main { width:calc(100% - 0px); margin:0px; padding:0px; height:calc(100% - 45px); overflow:hidden;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-btnArea {} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea { margin:0px; padding:5px; width:calc(100% - 0px); height:calc(100% - 40px); overflow-x:hidden; overflow-y:auto; font-size:1rem; line-height:1.2rem; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .nav-pills.dec-con-01 .nav-item { width:auto;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .tab-content.dec-con-01 { height:calc(100% - 30px); padding-bottom:0px;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .tab-content.dec-con-01 .tab-pane {} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .tab-content.dec-con-01 .tab-pane .box-con-a03 { padding-bottom:5px; padding-top:5px;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .nav-pills.dec-con-01 { width:calc(100% - 0px);} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .nav-pills.dec-con-01 .dec-type { color:#595959; font-size:1rem; margin:0px; padding:5px 5px 0px 0px;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .nav-pills.dec-con-01 .nav-link { text-align:center;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:0px 0px 5px 0px; border:1px solid #e1e1e1; border-radius:5px; background:#fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item:hover { background:#fcfcfc;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item:first-child { margin:0px;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea { width:45px; margin:0px; padding:5px; background:#595959; border-radius:3px 0px 5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item:hover .dec-box-itemNumArea { background:#666666;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea .dec-type { font-size:12px; line-height:14px; color:#FFFFFF;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemNumArea .dec-num { font-size:2rem; line-height:2rem; color:#FFFFFF; font-weight:500;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea { width:calc(100% - 50px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list:first-child { margin:0px;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list .dec-L { width:75px; text-align:right;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-item .dec-box-itemConArea .dec-box-list .dec-R { width:calc(100% - 80px); margin:0px; padding:5px; color:#169cbf;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-function { width:calc(100% - 0px); margin:0px; padding:5px; margin-top:5px; border-radius:0px 0px 5px 0px; border-top: 1px dotted #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a, .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a:hover { margin:0px 0px 0px 5px; padding:8px 10px; text-decoration:none; height:34px; overflow:hidden; background:transparent; border-radius:25px; border:1px solid #e1e1e1;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a { color:#595959; background:transparent;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a:hover { color:#333333; background:#ebebeb;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a.dec-arrow, .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-function a.dec-arrow:hover { padding:7px 8px; border-radius:5px;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-box-function .dec-note { font-size:12px; line-height:16px; color:#595959; margin:0px; padding:0px; margin-left:auto;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-B, .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-C, .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-D { font-size:1rem; margin:0px; padding:3px 8px 4px 8px; color:#FFFFFF; border-radius:25px; display: inline;} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-B::after { content:"未開始";} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-C::after { content:"進行中";} .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main .box-missionConArea .dec-type-missionCondition-D::after { content:"完成";} /* 派遣狀態｜1.未開始 #b3b3b3 (179, 179, 179) dec-type-missionCondition-B 派遣狀態｜2.進行中 #0089ff (0, 137, 255) dec-type-missionCondition-C 派遣狀態｜3.完成 #39b54a (57, 181, 74) dec-type-missionCondition-D */ /*end - .box-inner.dec-Mission-Detail-RouteOrder-RightSideModeResizable .con-main -------------------------------------------------------------------------------------------------------*/ /*start - .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main { width:calc(100% - 0px); margin:0px; padding:0px; height:calc(100% - 45px); overflow:hidden;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:0px; border:1px solid #e1e1e1; border-radius:5px; background:#fafafa; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item:hover { background:#fcfcfc;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item:first-child {} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item .dec-box-itemNumArea { width:45px; margin:0px; padding:5px; background:#595959; border-radius:3px 0px 0px 3px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item:hover .dec-box-itemNumArea { background:#666666;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item .dec-box-itemNumArea .dec-type { font-size:12px; line-height:14px; color:#FFFFFF;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item .dec-box-itemNumArea .dec-num { font-size:2rem; line-height:2rem; color:#FFFFFF; font-weight:500;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item .dec-box-itemConArea { width:calc(100% - 50px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item .dec-box-itemConArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; background:#fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item .dec-box-itemConArea .dec-box-list:first-child { margin:0px;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item .dec-box-itemConArea .dec-box-list .dec-L { width:calc(100% - 0px); text-align:left;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-item .dec-box-itemConArea .dec-box-list .dec-R { width:calc(100% - 0px); margin:0px; padding:5px 0px; color:#169cbf; overflow-x:hidden; text-overflow:ellipsis; white-space:nowrap;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-itemDetail { width:calc(100% - 0px); margin:0px; padding:0px 20px 10px 5px; height:calc(100% - 65px); overflow-x:hidden; overflow-y:auto; font-size:1rem; line-height:1.5rem; color:#595959; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-itemDetail .dec-title { font-weight:500; width:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px; border-top:1px solid #e1e1e1;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-itemDetail .dec-title:first-child { border-top:0px;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-itemDetail .dec-title-sub { font-weight:400; width:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-itemDetail .dec-con { font-weight:400; width:calc(100% - 0px); margin:0px; padding:5px 0px;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-itemDetail .dec-contentBox { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px 0px 10px 0px; border-radius:0px; border-radius:5px; padding-left:5px; background:#f5f5f5;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-itemDetail .dec-box-list { width:calc(100% - 15px); margin:0px 0px 0px 15px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-itemDetail .dec-box-list .dec-L { width:75px; margin:0px; padding:5px 0px; text-align:right; color:#787878; line-height:1.2rem;} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-itemDetail .dec-box-list .dec-L::after { content:"：";} .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main .dec-box-itemDetail .dec-box-list .dec-R { width:calc(100% - 75px); margin:0px; padding:5px 0px; color:#169cbf; line-height:1.2rem;} /*end - .box-inner.dec-Mission-Detail-FillIn-RightSideModeResizable .con-main -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable { overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main { overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable .con-main .dec-BusStopRoute-BusStop-Result { width:calc(100% - 0px); height:calc(100% - 158px); overflow-x:hidden; overflow-y:auto;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-BusStop-RightSideModeResizable*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-RightSideModeResizable*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-RightSideModeResizable { overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main { overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-RightSideModeResizable .con-main .dec-BusStopRoute-Route-Result { width:calc(100% - 0px); height:calc(100% - 158px); overflow-x:hidden; overflow-y:auto;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-RightSideModeResizable*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable { overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main { overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .box-conArea { overflow:hidden; height:calc(100% - 0px);} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable .con-main .box-Route-conArea { width:calc(100% - 0px); height:calc(100% - 185px); overflow-x:hidden; overflow-y:auto;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-BusStopRoute-Route-addRoute-RightSideModeResizable*/ /*start - .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan - 多點路順規劃/圖台功能/開啟圖層*/ .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan { height:calc(100% - 445px); height:calc(100% - 110px); overflow:hidden; padding-bottom:5px; z-index:3;} .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner { height:calc(100% - 0px); overflow:hidden;} .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-main { height:calc(100% - 50px); overflow:hidden;} .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-main .dec-contentArea { width:calc(100% - 0px); height:calc(100% - 30px); margin:0px; padding:0px 10px 5px 0px; overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan .box-inner .con-main .dec-noteArea { width:calc(100% - 0px); height:30px; margin:0px; padding:10px 0px 0px 0px; font-size:1rem; line-height:1.2rem; color:#999999; overflow: hidden;} /*end - .MapTool-FunctionBox.dec-FunctionArea-MapLayer-RoutePlan - 多點路順規劃/圖台功能/開啟圖層*/ /*start - .dec-MapTool-MapLayer-RoutePlan-listArea -------------------------------------------------------------------------*/ .form-check.dec-form-switch-MapLayerRoutePlan { margin:5px 0px 0px 0px; padding:5px; display: flex !important; flex-direction: row-reverse !important; justify-content: space-between !important;} .form-check.dec-form-switch-MapLayerRoutePlan:hover { background:#fafafa;} .form-check.dec-form-switch-MapLayerRoutePlan:first-child { margin:0px;} .form-check.dec-form-switch-MapLayerRoutePlan .form-check-label { width:calc(100% - 0px); word-break: break-all; padding-right:15px;} .form-check.dec-form-switch-MapLayerRoutePlan .form-check-label .dec-ic { display:inline-block; vertical-align:top; margin:4px 2px 0px 0px; padding:0px;} .form-check.dec-form-switch-MapLayerRoutePlan .form-check-label .dec-type { width:calc(100% - 25px); margin:0px; padding:2px 0px; display:inline-block; vertical-align:top; font-size:1rem; line-height:1.2rem;} .dec-ic-fill-Color-01 { color:#000000; color:rgba(0, 0, 0,1);} /*black*/ .dec-ic-fill-Color-02 { color:#ff0000; color:rgba(255, 0, 0,1);} /*light red*/ .dec-ic-fill-Color-03 { color:#ffff00; color:rgba(255, 255, 0,1);} /*yellow*/ .dec-ic-fill-Color-04 { color:#00ff00; color:rgba(0, 255, 0,1);} /*green*/ .dec-ic-fill-Color-05 { color:#00ffff; color:rgba(0, 255, 255,1);} /*cyan*/ .dec-ic-fill-Color-06 { color:#0000ff; color:rgba(0, 0, 255,1);} /*medium blue*/ .dec-ic-fill-Color-07 { color:#ff00ff; color:rgba(255, 0, 255,1);} /*magenta*/ .dec-ic-fill-Color-08 { color:#c1272d; color:rgba(193, 39, 45,1);} /*brick red*/ .dec-ic-fill-Color-09 { color:#ed1c24; color:rgba(237, 28, 36,1);} /*red*/ .dec-ic-fill-Color-10 { color:#f15a24; color:rgba(241, 90, 36,1);} /*dark orange*/ .dec-ic-fill-Color-11 { color:#f7931e; color:rgba(247, 147, 30,1);} /*orange*/ .dec-ic-fill-Color-12 { color:#fbb03b; color:rgba(251, 176, 59,1);} /*light orange*/ .dec-ic-fill-Color-13 { color:#fcee21; color:rgba(252, 238, 33,1);} /*yellow*/ .dec-ic-fill-Color-14 { color:#d9e021; color:rgba(217, 224, 33,1);} /*light green*/ .dec-ic-fill-Color-15 { color:#8cc63f; color:rgba(140, 198, 63,1);} /*grass green*/ .dec-ic-fill-Color-16 { color:#39b54a; color:rgba(57, 181, 74,1);} /*green*/ .dec-ic-fill-Color-17 { color:#009245; color:rgba(0, 146, 69,1);} /*green*/ .dec-ic-fill-Color-18 { color:#006837; color:rgba(0,104, 55,1);} /*green*/ .dec-ic-fill-Color-19 { color:#22b573; color:rgba(34, 181, 115,1);} /*green*/ .dec-ic-fill-Color-20 { color:#00a99d; color:rgba(0, 169, 157,1);} /*teal*/ .dec-ic-fill-Color-21 { color:#29abe2; color:rgba(41, 171, 226,1);} /*blue*/ .dec-ic-fill-Color-22 { color:#0071bc; color:rgba(0, 113, 188,1);} /*blue*/ .dec-ic-fill-Color-23 { color:#2e3192; color:rgba(46, 49, 146,1);} /*blue*/ .dec-ic-fill-Color-24 { color:#1b1464; color:rgba(27, 20, 100,1);} /*dark blue*/ .dec-ic-fill-Color-25 { color:#662d91; color:rgba(102, 45, 145,1);} /*purple*/ .dec-ic-fill-Color-26 { color:#93278f; color:rgba(147, 39, 143,1);} /*purple*/ .dec-ic-fill-Color-27 { color:#9e005d; color:rgba(158, 0, 93,1);} /*purple*/ .dec-ic-fill-Color-28 { color:#d4145a; color:rgba(212, 20, 90,1);} /*red*/ .dec-ic-fill-Color-29 { color:#ed1e79; color:rgba(237, 30, 121,1);} /*red*/ .dec-ic-fill-Color-30 { color:#c7b299; color:rgba(199, 178, 153,1);} /*light brown*/ .dec-ic-fill-Color-31 { color:#998675; color:rgba(153, 134, 117,1);} /*brown*/ .dec-ic-fill-Color-32 { color:#736357; color:rgba(115, 99, 87,1);} /*brown*/ .dec-ic-fill-Color-33 { color:#534741; color:rgba(83, 71, 65,1);} /*brown*/ .dec-ic-fill-Color-34 { color:#c69c6d; color:rgba(198, 156, 109,1);} /*brown*/ .dec-ic-fill-Color-35 { color:#a67c52; color:rgba(166, 124, 82,1);} /*brown*/ .dec-ic-fill-Color-36 { color:#8c6239; color:rgba(140, 98, 57,1);} /*brown*/ .dec-ic-fill-Color-37 { color:#754c24; color:rgba(117, 76, 36,1);} /*brown*/ .dec-ic-fill-Color-38 { color:#603813; color:rgba(96, 56, 19,1);} /*brown*/ .dec-ic-fill-Color-39 { color:#42210b; color:rgba(66, 33, 11,1);} /*brown*/ .dec-ic-fill-Color-40 { color:#ee835c; color:rgba(238, 131, 92,1);} /*light red*/ .dec-ic-fill-Color-41 { color:#f4af8f; color:rgba(244, 175, 143,1);} /*light red*/ .dec-ic-fill-Color-42 { color:#fccf00; color:rgba(252, 207, 0,1);} /*yellow*/ .dec-ic-fill-Color-43 { color:#b4af7d; color:rgba(180, 175, 125,1);} /*ochre*/ .dec-ic-fill-Color-44 { color:#ddd36e; color:rgba(221, 211, 110,1);} /*green*/ .dec-ic-fill-Color-45 { color:#bac570; color:rgba(186, 197, 112,1);} /*green*/ .dec-ic-fill-Color-46 { color:#b7caba; color:rgba(183, 202, 186,1);} /*light green*/ .dec-ic-fill-Color-47 { color:#50a8b4; color:rgba(80, 168, 180,1);} /*teal*/ .dec-ic-fill-Color-48 { color:#718bc6; color:rgba(113, 139, 198,1);} /*blue*/ .dec-ic-fill-Color-blank { color:#FFFFFF; color:rgba(255, 255, 255,1);} /*white*/ /*end - .dec-MapTool-MapLayer-RoutePlan-listArea -------------------------------------------------------------------------*/ /*start - 程式使用 .dec-MapTool-BottomSideMode-Outer*/ .dec-MapTool-BottomSideMode-Outer { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px 3px 0px 0px; background:rgba(255,255,255,1); position:absolute; left:0px; bottom:0px; z-index:2; overflow:hidden;} /*end - 程式使用 .dec-MapTool-BottomSideMode-Outer*/ #map-panel .div-MapTool-BottomSideMode-Outer { width:calc(100% - 0px); height:300px; margin:0px; padding:0px 3px 0px 0px; background:rgba(255,255,255,1); position:absolute; left:0px; bottom:0px; z-index:2; overflow:hidden;} #map-panel .div-MapTool-BottomSideMode-Outer .div-MapTool-BottomSideMode { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} #map-panel .div-MapTool-BottomSideMode-Outer .div-MapTool-BottomSideMode .div-MapTool-BottomSideMode-inner { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} #map-panel .div-MapTool-BottomSideMode-Outer .div-MapTool-BottomSideMode .div-MapTool-BottomSideMode-inner .contopArea { width:calc(100% - 0px); height: 55px; margin:0px; padding:0px; overflow:hidden;} #map-panel .div-MapTool-BottomSideMode-Outer .div-MapTool-BottomSideMode .div-MapTool-BottomSideMode-inner .conArea { width:calc(100% - 0px); height:calc(100% - 55px); margin:0px; padding:0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important;} #map-panel .div-MapTool-BottomSideMode-Outer .div-MapTool-BottomSideMode .div-MapTool-BottomSideMode-inner .conArea .conArea-TabArea { width:90px; height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} #map-panel .div-MapTool-BottomSideMode-Outer .div-MapTool-BottomSideMode .div-MapTool-BottomSideMode-inner .conArea .conArea-TableArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .div-MapTool-BottomSideMode-inner.div-MapTool-TrackHistory-History-BottomResizable, .div-MapTool-BottomSideMode-inner.div-MapTool-TrackHistory-RealTime-BottomResizable, .div-MapTool-BottomSideMode-inner.div-MapTool-TrackHistory-CarSearching-BottomResizable { height:calc(100% - 0px);} /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea { width:calc(100% - 0px); margin:0px; padding:5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: center !important; align-self: center !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea a.dec-btn { background:#ebebeb; margin:0px; padding:5px 10px; border-radius:25px; color:#999999;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .box-conArea a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 120px);} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result*/ .default-theme.splitpanes--vertical > .splitpanes__splitter, .default-theme .splitpanes--vertical > .splitpanes__splitter { width:9px; border-left:1px solid silver; border-right:1px solid silver; margin-left:-1px; background-color:rgb(246, 246, 246);} /*start - .con-main.dec-Monitor-CarInfo-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main.dec-Monitor-CarInfo-RightSideModeResizable { width:calc(100% - 0px); margin:0px; padding:0px 5px 0px 0px; overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main.dec-Monitor-CarInfo-RightSideModeResizable.div-MapTool-Monitor-CarInfo-CTC-conMain-RightSideModeResizable { overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner .con-main.dec-Monitor-CarInfo-RightSideModeResizable.div-MapTool-Monitor-CarInfo-CTC-conMain-RightSideModeResizable .con-main-CTC { width:calc(100% - 0px); height:calc(100% - 85px); margin:0px; padding:0px 5px 0px 0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con { width:calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; clear:both; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con:first-child { border:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea { width:calc(100% - 65px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .con-btnbox { width:60px; margin:0px; padding:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .con-btnbox.dec-w01 { width:calc(33% - 5px); margin:0px; padding:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .con-btnbox.dec-w02 { width:calc(50% - 5px); margin:0px; padding:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .con-btnbox.dec-w03 { width:calc(25% - 5px); margin:0px; padding:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .con-btnbox a.dec-btn { background:#fafafa; margin:0px; padding:3px 0px; border-radius:5px; color:#999999; border:1px solid #ced4da; height:33px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .con-btnbox a.dec-btn:hover { color:#169cbf; background: #f5f5f5; border:1px solid #ced4da;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .con-btnbox a.dec-btn .dec-ic { margin:0px 2px 0px 0px; padding:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .dec-box-subTitle { width:calc(100% - 0px); margin:0px; padding:8px 5px 8px 2px; font-size:16px; font-weight:500; line-height:1.2rem; letter-spacing:0.2rem; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .dec-box-subTitle .dec-type { margin:0px; padding:0px; font-size:16px; line-height:1.2rem; letter-spacing:0.2rem; font-weight:500; color:#595959;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .dec-box-subTitle .dec-update { margin:0px; padding:0px; font-size:12px; line-height:1.2rem; letter-spacing:0rem; font-weight:400; color:#adadad;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .dec-box-list .dec-box-list-L { width:100px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height:1.2rem;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .dec-box-list .dec-box-list-L::after { content:"："; color:#595959;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .dec-box-list .dec-box-list-R { width:calc(100% - 100px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} /*start - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 ----------------------------------------------*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con { width:calc(100% - 38px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con .con-group { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-btn { width:33px; margin:0px; padding:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con .dec-box-list-L { width:100px; margin:0px; padding:0px; text-align:right; color:#595959; font-size:1rem; line-height:1.2rem;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con .dec-box-list-L::after { content:"："; color:#595959;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-con .dec-box-list-R { width:calc(100% - 100px); margin:0px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-btn { width:33px; height:33px; overflow:hidden; margin:0px 0px 0px 5px; padding:0px; color:#1591BC; font-size:1rem; line-height:1.2rem;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-btn a.btn-more, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-btn a.btn-more:hover{ width:33px; height:33px; overflow:hidden; background:#fafafa; margin:0px; padding:7px 8px; border-radius:5px; color:#999999; border:1px solid #ced4da; display:inline-block;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 .dec-box-list .box-group-btn a.btn-more:hover { color:#169cbf; background:#f5f5f5; border:1px solid #ced4da;} /*end - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea.dec-CTC-01 ----------------------------------------------*/ /*start - .box-infoChart --------------------------------------------------------------------------------------------*/ .box-infoChart { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; flex-wrap: wrap !important; justify-content: flex-start !important; align-items: flex-start !important;} .box-infoChart .box-infoChart-item { width:calc(13% - 12px); margin:10px 0px 10px 12px; padding:10px 0px 10px 0px; background:#fafafa; border-radius:8px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; flex-direction: column !important; justify-content: flex-start !important; align-items: center !important;} .box-infoChart .box-infoChart-item:first-child { margin-left:0px;} .box-infoChart .box-infoChart-item .dec-con { width:calc(100% - 0px); /*height:calc(5vw - 0px);*/ margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; justify-content: center !important; align-items: center !important;} .box-infoChart .box-infoChart-item .dec-con .dec-num { font-size:2.4rem; line-height:2.2rem; color:#008BAC; font-weight:420; margin:0px; padding:20px 0px;} .box-infoChart .box-infoChart-item .dec-type { font-size:1.3rem; line-height:1.4rem; color:#595959; margin:0px; padding:10px 0px;} .box-infoChart .box-infoChart-item.dec-withChart .dec-con .dec-num { font-size:2.4rem; line-height:2.2rem; color:#008BAC; font-weight:420; margin:0px; padding:calc(24% - 0px) 0px calc(23% - 0px) 0px;} .box-infoChart .box-infoChart-item.dec-withChart .dec-con .dec-img { width:calc(80% - 0px); font-weight:500; margin:0px; padding:calc(0% - 0px) calc(10% - 0px);} .box-infoChart .box-infoChart-item.dec-withChart .dec-type { font-size:1.3rem; line-height:1.4rem; color:#595959; margin:0px; padding:10px 0px;} /*end - .box-infoChart --------------------------------------------------------------------------------------------*/ /*start - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-mission ------------------------------------------------------------*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-mission { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:5px; background:#fafafa; border-radius:5px; border:1px solid #f5f5f5;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-mission:hover { background:#fcfbe0;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-mission .box-mission-con { width:calc(100% - 0px); margin:0px; padding:5px; font-size:1rem; line-height:1.2rem; color:#595959;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-mission .box-mission-note { width:calc(100% - 0px); margin:0px; padding:0px 5px 5px 5px; font-size:12px; line-height:1rem; color:#AFAFAF;} /*end - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-mission ------------------------------------------------------------*/ /*start - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData ------------------------------------------------------------*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData { width:calc(50% - 3px); margin:0px 0px 5px 0px; padding:0px; background:#fafafa; border-radius:5px; border:1px solid #e1e1e1; text-align: center; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData:hover { background:#fcfbe0;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-w-03 { width:calc(33% - 3px);} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-condition { padding:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-condition.dec-p01 { padding:0px 0px 7px 0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-condition.dec-normal .dec-box-num, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-condition.dec-normal .dec-box-type { color:#595959;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-condition.dec-inDanger .dec-box-num, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-condition.dec-inDanger .dec-box-type { color:#e73828;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; font-size:1.5rem; font-weight:500;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-GPS { font-size:1.2rem;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num-high { width:calc(100% - 0px); margin:0px; padding:5px 0px 0px 0px; font-size:1.2rem; font-weight:500; text-align:left;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num-high::before { content:"高"; width:calc(40% - 0px); margin:0px 5px 0px 35px; font-weight:300; color:#595959;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num-low { width:calc(100% - 0px); margin:0px; padding: 0px; font-size:1.2rem; font-weight:500; text-align:left;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num-low::before { content:"低"; width:calc(40% - 0px); margin:0px 5px 0px 35px; font-weight:300; color:#595959;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num-high.dec-color, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num-low.dec-color { color:#e73828;} /*end - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData ------------------------------------------------------------*/ /*start - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-SelfDriving*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-SelfDriving { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:3px 0px; font-size:1rem; font-weight:500;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-SelfDriving .dec-inner { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-SelfDriving .dec-inner .dec-mode { width:50px; margin:0px; padding:2px 10px; color:#A3A3A3; background:transparent; display: inline-block; border:1px solid #CCCCCC;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-SelfDriving .dec-inner .dec-mode.is-active { color:#FFFFFF; background:#787878; border:1px solid #787878;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-SelfDriving .dec-inner .dec-mode:first-child { border-radius:0.25rem 0px 0px 0.25rem; border-right:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-SelfDriving .dec-inner .dec-mode:last-child { border-radius:0px 0.25rem 0.25rem 0px; border-left:0px;} /*end - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-SelfDriving*/ /*start - 中保｜車輛狀態｜(正常true/異常false｜超速,怠速,熄火,拖吊,溫度異常1,溫度異常2,防盜狀態) ---------------------------------------------------*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-01, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-02, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-03, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-04, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-05, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-06 { padding:15px 0px 21px 0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-01.dec-true { color:#ff0000;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-02.dec-true { color:#f7931e;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-03.dec-true { color:#f9bd00;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-04.dec-true { color:#a050a0;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-05.dec-true { color:#f2669f;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-06.dec-true { color:#f9bd00;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-01.dec-false, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-02.dec-false, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-03.dec-false, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-04.dec-false, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-05.dec-false, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-num.dec-status-06.dec-false { color:#d6d6d6;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-type { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; color:#a3a3a3;} /*end - 中保｜車輛狀態｜(正常true/異常false｜超速,怠速,熄火,拖吊,溫度異常1,溫度異常2,防盜狀態) ---------------------------------------------------*/ /*start - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem｜溫度計燈號/綠,黃,橘,紅,無資料 -------------------------*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-widthWhole { width:calc(100% - 0px); padding-left:2px; padding-right:2px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:5px 0px; font-size:1.5rem; font-weight:500; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem { width:calc((100%/8) - 2px); margin:0px; padding:0px 2px; border-left:1px solid #e1e1e1; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: start !important; align-items: flex-start !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem:first-child { border:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem .dec-lightBox { width:24px; height:24px; margin-top:2px; margin:0px auto; margin-bottom:2px; padding:0px; border-radius:50%;} /*註：[溫度計燈號] (1) dec-color-green/綠燈 (2) dec-color-yellow/黃燈 (3) dec-color-orange/橘燈 (4) dec-color-red/紅燈 (5) dec-color-noData/無資料*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-lightBox { background:#8cc63f;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-lightBox { background:#fccf00;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-lightBox { background:#f7931e;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-lightBox { background:#ed1c24;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-lightBox { background:transparent;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-lightBox:after { content:"-"; background:transparent; color:#CCCCCC;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-type { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; font-size:12px; line-height:14px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-type { color:#A3A3A3;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-type { color:#CCCCCC;} /*end - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData .dec-box-lightsArea .dec-box-lightsItem｜溫度計燈號/綠,黃,橘,紅,無資料 -------------------------*/ /*start - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem｜溫度計燈號/綠,黃,橘,紅,無資料 -------------------------*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; padding:0px; background:#fafafa; border-radius:5px; border:0px; text-align:center; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom:hover { background:transparent;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem { width:calc(50% - 3px); margin:0px 5px; padding:10px 5px 11px 5px; background:#fafafa; border:1px solid #e1e1e1; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem:hover { background:#fcfbe0;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem:nth-child(odd) { margin:5px 5px 0px 0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem:nth-child(even) { margin:5px 0px 0px 0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem:nth-child(1) { margin:0px 5px 0px 0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem:nth-child(2) { margin:0px 0px 0px 0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem .dec-lightBox { width:18px; height:18px; margin-top:2px; margin:0px 5px 0px 0px; padding:0px; border-radius:50%;} /*註：[溫度計燈號] (1) dec-color-green/綠燈 (2) dec-color-yellow/黃燈 (3) dec-color-orange/橘燈 (4) dec-color-red/紅燈 (5) dec-color-noData/無資料*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-lightBox { background:#8cc63f;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-lightBox { background:#fccf00;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-lightBox { background:#f7931e;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-lightBox { background:#ed1c24;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-lightBox { background:transparent;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-lightBox:after { content:"-"; background:transparent; color:#CCCCCC;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-type { width:65px; margin:0px 5px 0px 0px; margin-right:auto; font-size:16px; line-height:16px; text-align:left; border-right:1px solid #a3a3a3; padding:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-type, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-type { color:#787878;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-type { color:#CCCCCC;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-num, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-num, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-num, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-num, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-num { width:calc(100% - 95px); margin:0px; padding:0px; font-size:16px; line-height:16px; text-align:left; font-weight:300;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-green .dec-box-num, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-yellow .dec-box-num, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-orange .dec-box-num, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-red .dec-box-num { color:#787878;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem.dec-color-noData .dec-box-num { color:#CCCCCC;} /*end - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-currentData.dec-secom .dec-box-lightsArea .dec-box-lightsItem｜溫度計燈號/綠,黃,橘,紅,無資料 -------------------------*/ /*start - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con a.dec-currentData-detail*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con a.dec-currentData-detail, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con a.dec-currentData-detail:hover { margin:0px 0px 0px auto; padding:5px 0px 5px 5px; font-size:1rem; text-align:left; text-decoration:underline !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con a.dec-currentData-detail { color:#999999; width:calc(100% - 0px);} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con a.dec-currentData-detail:hover { color:#5dc1cf;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con a.dec-currentData-detail::after { content:' \003E';} /*end - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con a.dec-currentData-detail*/ /*start - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo.dec-SelfDriving*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo.dec-SelfDriving { width:calc(100% - 0px); margin:0px; padding:0px;; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo.dec-SelfDriving .carNum-front { width:calc(100% - 0px); margin:0px; padding:6px 5px; border-radius:5px; background:#f0f0f0; text-align:center;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo.dec-SelfDriving .carNum-back { width:calc(50% - 5px); margin:0px; padding:6px 5px; border-radius:5px; background:#f0f0f0; text-align:center; display:none;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo.dec-SelfDriving .carPhoto { background-image:url("../images/element/img_carModel_07.svg") !important;} /*end - .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo.dec-SelfDriving*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carNum-front { width:calc(50% - 3px); margin:0px; padding:6px 5px; border-radius:5px; background:#f0f0f0; text-align:center;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carNum-front.dec-whole { width:calc(100% - 0px);} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carNum-back { width:calc(50% - 2px); margin:0px; padding:6px 5px; border-radius:5px; background:#f0f0f0; text-align:center;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto { width:269px; height:100px; margin:5px 0px 0px 0px; margin:auto; margin-top:5px; padding:0px;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-00, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-01, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-02, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-03, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-04, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-05, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-06, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-07, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-08, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-09, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-10, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-11, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-12, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-13, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-14, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-15, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-16, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-17, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-18, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-19, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-20, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-21, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-22, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-23, .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-24 { background-position:right bottom; background-repeat:no-repeat; background-color:#FFFFFF;} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-00 { background-image:url("../images/element/img_carModel_00.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-01 { background-image:url("../images/element/img_carModel_01.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-02 { background-image:url("../images/element/img_carModel_02.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-03 { background-image:url("../images/element/img_carModel_03.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-04 { background-image:url("../images/element/img_carModel_04.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-05 { background-image:url("../images/element/img_carModel_05.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-06 { background-image:url("../images/element/img_carModel_06.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-07 { background-image:url("../images/element/img_carModel_07.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-08 { background-image:url("../images/element/img_carModel_08.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-09 { background-image:url("../images/element/img_carModel_09.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-10 { background-image:url("../images/element/img_carModel_10.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-11 { background-image:url("../images/element/img_carModel_11.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-12 { background-image:url("../images/element/img_carModel_12.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-13 { background-image:url("../images/element/img_carModel_13.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-14 { background-image:url("../images/element/img_carModel_14.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-15 { background-image:url("../images/element/img_carModel_15.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-16 { background-image:url("../images/element/img_carModel_16.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-17 { background-image:url("../images/element/img_carModel_17.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-18 { background-image:url("../images/element/img_carModel_18.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-19 { background-image:url("../images/element/img_carModel_19.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-20 { background-image:url("../images/element/img_carModel_20.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-21 { background-image:url("../images/element/img_carModel_21.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-22 { background-image:url("../images/element/img_carModel_22.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-23 { background-image:url("../images/element/img_carModel_23.svg");} .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .carPhoto.dec-img-carModel-24 { background-image:url("../images/element/img_carModel_24.svg");} /*[車種] dec-img-carModel-00 (預設圖), dec-img-carModel-01 (大貨車), dec-img-carModel-02 (小貨車), dec-img-carModel-03 (自駕車), dec-img-carModel-04 (掃街車), dec-img-carModel-05 (號誌), dec-img-carModel-06 (紅綠燈), dec-img-carModel-07 (勤崴無人車/winbus), dec-img-carModel-08 (和泰汽車), dec-img-carModel-09 (消防車), dec-img-carModel-10 (救護車), dec-img-carModel-10 (救護車), dec-img-carModel-11 (曳引車), dec-img-carModel-12 (垃圾車), dec-img-carModel-13 (資源回收車), dec-img-carModel-14 (廚餘車), dec-img-carModel-15 (平板車), dec-img-carModel-16 (油罐車), dec-img-carModel-17 (砂石車), dec-img-carModel-18 (貨櫃車), dec-img-carModel-19 (裝櫃車), dec-img-carModel-20 (堆高機), dec-img-carModel-21 (小客車), dec-img-carModel-22 (大客車), dec-img-carModel-23 (冷鏈車), dec-img-carModel-24 (微型車)*/ .con-main.dec-Monitor-CarInfo-RightSideModeResizable .box-con .box-infoArea .box-carInfo .dec-type { color:#1591BC;} /*end - .con-main.dec-Monitor-CarInfo-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*end - .MapTool-FunctionBox.dec-RightSideModeResizable -------------------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner ------------------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .con-main .tab-content.dec-con-05 { width:calc(100% - 0px); height: calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .con-main .tab-content.dec-con-05 .tab-pane { width:calc(100% - 0px); height: calc(100% - 0px); margin:0px; padding:0px; overflow: hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .con-main .tab-content.dec-con-05 .dec-box-con { width:calc(100% - 0px); height: calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .con-main .tab-content.dec-con-05 .dec-box-con .dec-box-inner { width:calc(100% - 0px); height: calc(100% - 0px); margin:0px; padding:0px; overflow: hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .con-main #pills-FunctionArea-TrackHistory-RightSideMode-Nav01 .dec-box-con .dec-box-inner .dec-box-inner-result { width:calc(100% - 0px); height: calc(100% - 165px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .con-main #pills-FunctionArea-TrackHistory-RightSideMode-Nav02 .dec-box-con .dec-box-inner .dec-box-inner-result { width:calc(100% - 0px); height: calc(100% - 125px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .con-main #pills-FunctionArea-TrackHistory-RightSideMode-Nav01 .dec-box-con .dec-box-inner .dec-box-inner-result .table-responsive.dec-table.dec-h-01 { height: calc(100% - 0px);} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .con-main #pills-FunctionArea-TrackHistory-RightSideMode-Nav02 .dec-box-con .dec-box-inner .dec-box-inner-result .table-responsive.dec-table.dec-h-01 { height: calc(100% - 0px);} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .box-conArea.dec-selecter-RightSideMode-02 { height:35px; overflow: hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .box-conArea.dec-selecter-RightSideMode-02 a.dec-btn { background:#ebebeb; margin:0px; padding:5px 10px; border-radius:25px; color:#999999;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .box-conArea.dec-selecter-RightSideMode-02 a.dec-btn:hover { color:#169cbf; background: #ebebeb;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner .box-conArea.dec-selecter-RightSideMode-02 .box-conArea { width:calc(100% - 0px); margin:0px; padding: 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-item-align: center !important; align-self: center !important;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.div-MapTool-TrackHistory-RightSideModeResizable-boxInner ------------------------*/ /*end - resizable - 圖台兩側模式_可調寬度 ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*start - a.btn-MapTool-RoutePlan-Nav ---------------------------------------------------------------------*/ a.btn-MapTool-RoutePlan-Nav, a.btn-MapTool-RoutePlan-Nav:hover { text-decoration:none; position:absolute; top:105px; left:15px; z-index:2; width:35px; height:35px; overflow:hidden; margin:0px; padding:0px; border-radius:5px; box-shadow:0px 2px 4px rgba(0, 0, 0, .3); border:0px solid #999999;} a.btn-MapTool-RoutePlan-Nav { color:#999999; background:#FFFFFF;} a.btn-MapTool-RoutePlan-Nav:hover { color:#169cbf; background:#fafafa;} a.btn-MapTool-RoutePlan-Nav .dec-ic, a.btn-MapTool-RoutePlan-Nav:hover .dec-ic { margin:8px; padding:0px; font-size:18px;} /*start - a.btn-MapTool-RoutePlan-Nav ---------------------------------------------------------------------*/ /*start - .con-Allowlist-selectArea ---------------------------------------------------------------------*/ .con-Allowlist-selectArea { width:calc(100% - 0px); margin:0px 0px 15px 0px; padding:5px 0px; border-bottom:1px solid #CCCCCC; font-size:1rem; line-height:1.2rem; word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .con-Allowlist-selectArea .dec-form-control { width:150px; margin:0px 5px 0px 0px; } .con-Allowlist-selectArea .dec-btn, .con-Allowlist-selectArea .dec-btn:hover { margin:0px 15px 0px 0px; width:60px;} .con-Allowlist-selectArea .dec-note { width:calc(100% - 230px); margin:0px; padding:0px; color:#999999;} /*end - .con-Allowlist-selectArea ---------------------------------------------------------------------*/ /*start - 監控圖台｜自訂地標｜地點｜下拉選單選擇marker -----------------------------------------------------------------------------*/ .dec-selectpicker-POI { width:calc(100% - 0px); margin:0px; padding:0px; display:inline-block;} .dec-selectpicker-POI .bootstrap-select { width:calc(100% - 0px);} .dec-selectpicker-POI .bootstrap-select > .dropdown-toggle { width:calc(100% - 0px);} .dec-selectpicker-POI .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) { width:calc(100% - 0px);} .dec-selectpicker-POI .dropdown.bootstrap-select:hover .dropdown-menu { transform:translate3d(0px, 0px, 0px) !important;} .dec-selectpicker-POI .bootstrap-select .dropdown-menu { margin:0px; padding:5px; max-height:100px; transform:translate3d(5px, 44px, 0px) !important;} .dec-selectpicker-POI .dropdown.bootstrap-select.show .dropdown-menu.show { transform:translate3d(0px, 44px, 0px) !important;} .dec-selectpicker-POI .dropdown.bootstrap-select.show .dropdown-menu.inner.show { transform:translate3d(0px, 0px, 0px) !important;} .dec-selectpicker-POI .bootstrap-select .dropdown-menu .inner { margin:0px; padding:0px; height:calc(100% - 0px);} .dec-selectpicker-POI .bootstrap-select .dropdown-menu li { display: inline-block; border-radius:0rem; width:36px; height:36px; overflow:hidden;} .dec-selectpicker-POI .bootstrap-select .dropdown-menu li a:hover { background:#e8ddc8;} .dec-selectpicker-POI .bootstrap-select .dropdown-menu li a.selected.active, .dec-selectpicker-POI .bootstrap-select .dropdown-menu li a.selected.active:hover { background:#e73828;} .dec-selectpicker-POI .bootstrap-select .dropdown-menu .dropdown-item, .dec-selectpicker-POI .bootstrap-select .dropdown-menu .dropdown-item:hover { padding:2px; margin:0px;} .dec-selectpicker-POI .bootstrap-select > .dropdown-toggle { border:1px solid #ced4da; padding:5px;} .dec-selectpicker-POI .bootstrap-select .dropdown-menu li a span.text { width:32px; height:32px; overflow:hidden;} .m-marker-01, .m-marker-02, .m-marker-03, .m-marker-04, .m-marker-05, .m-marker-06, .m-marker-07, .m-marker-08, .m-marker-09, .m-marker-10, .m-marker-11, .m-marker-12, .m-marker-13, .m-marker-14, .m-marker-15, .m-marker-16, .m-marker-17, .m-marker-18, .m-marker-19, .m-marker-20, .m-marker-21, .m-marker-22, .m-marker-23, .m-marker-24, .m-marker-25, .m-marker-26, .m-marker-27, .m-marker-28, .m-marker-29, .m-marker-30, .m-marker-31, .m-marker-32, .m-marker-33, .m-marker-34, .m-marker-35, .m-marker-36, .m-marker-37, .m-marker-38, .m-marker-39, .m-marker-40, .m-marker-41, .m-marker-42, .m-marker-43, .m-marker-44, .m-marker-45, .m-marker-46, .m-marker-47, .m-marker-48 { width:32px; height:32px; margin:0px; padding:0px; display:inline-block; overflow:hidden;} .m-marker-01 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_01.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-02 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_02.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-03 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_03.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-04 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_04.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-05 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_05.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-06 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_06.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-07 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_07.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-08 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_08.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-09 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_09.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-10 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_10.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-11 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_10.png"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-12 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_12.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-13 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_13.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-14 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_14.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-15 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_15.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-16 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_16.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-17 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_17.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-18 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_18.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-19 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_19.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-20 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_20.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-21 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_21.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-22 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_22.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-23 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_23.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-24 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_24.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-25 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_25.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-26 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_26.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-27 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_27.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-28 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_28.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-29 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_29.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-30 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_30.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-31 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_30.png"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-32 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_32.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-33 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_33.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-34 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_30.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-35 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_35.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-36 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_36.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-37 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_37.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-38 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_38.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-39 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_39.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-40 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_40.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-41 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_41.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-42 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_42.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-43 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_43.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-44 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_44.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-45 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_45.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-46 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_46.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-47 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_47.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} .m-marker-48 { background:#FFFFFF url("../images/map/32x32px/img_m_marker_48.svg"); background-size:22px; background-position:center; background-repeat:no-repeat;} /*end - 監控圖台｜自訂地標｜地點｜下拉選單選擇marker -----------------------------------------------------------------------------*/ /*start - 車隊總指揮室 ----------------------------------------------------------------------------------*/ .main-area .container-commandRoom { width:calc(100% - 0px); height:calc(100% - 50px); margin:0px; padding:0px; background:#212529; color:#FFFFFF; position:relative; z-index:1; overflow:hidden;} .main-area .container-commandRoom .con-top { width:calc(100% - 0px); height:auto; margin:0px; padding:25px 10px; background:rgba(0,0,0,0.7); background:rgba(20, 127, 165, 0.9); position:absolute; top:0px; left:0px; z-index: 2; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .main-area .container-commandRoom .con-top .con-title { font-size:2rem; line-height:2.2rem; font-weight:500; letter-spacing:0.25rem; color:#FFFFFF; margin-left:65px;} .main-area .container-commandRoom .con-top .nav-area { width:auto; font-size:16px; line-height:1.2rem; font-weight:400; color:#FFFFFF; margin-left:15px; margin-right:auto;} .main-area .container-commandRoom .con-top .nav-area a, .main-area .container-commandRoom .con-top .nav-area a:hover, .main-area .container-commandRoom .con-top .nav-area a.is-active, .main-area .container-commandRoom .con-top .nav-area a.is-active:hover { margin:2px; padding:5px 14px; background:transparent; color:#FFFFFF; border-radius:25px; letter-spacing:0.1rem;} .main-area .container-commandRoom .con-top .nav-area a:hover, .main-area .container-commandRoom .con-top .nav-area a.is-active, .main-area .container-commandRoom .con-top .nav-area a.is-active:hover { background:#e1f1f4; color:#3d7d9e;} .main-area .container-commandRoom .con-top .time-area { width:auto; margin:0px; margin-left:auto; padding:5px; background:transparent; color:#fcfbe0; text-align:right;} .main-area .container-commandRoom .con-content { width:calc(100% - 0px); margin:0px; padding:90px 10px 10px 10px; background:#212529; color:#FFFFFF; height:calc(100% - 0px); position:absolute; top:0px; left:0px; overflow-x:hidden; overflow-y:auto;} .main-area .container-commandRoom .con-content p { color:#FFFFFF;} .main-area .container-commandRoom .con-content .con-contentArea { width:calc(100% - 0px); margin:0px; padding:0px; background:transparent;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner { width:calc(100% - 0px); height:calc(100vh - 150px); margin:0px; padding:0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L { width:calc(66vw - 0px); margin:0px; padding:0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-R { width:calc(34vw - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:#333333;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-R .con-title { width:calc(100% - 0px); height:auto; margin:0px; padding:15px 0px; text-align:center; color:#FFFFFF; font-weight:400; letter-spacing:0.25rem; font-size:1.5rem; line-height:2rem;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-R .con-area { width:calc(100% - 0px); height:calc(100% - 60px); margin:0px; padding:10px 10px; vertical-align:top; overflow:auto;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block { width:calc(33% - 10px); height:calc(33% - 10px); margin:15px 15px 0px 0px; padding:0px; background:#333333; word-break:break-all; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-line-pack: justify !important; align-content: space-between !important;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block:hover { background:#3d3d3d;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block:nth-child(1), .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block:nth-child(2), .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block:nth-child(3) { margin-top:0px;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block:nth-child(3), .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block:nth-child(6), .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block:nth-child(9) { margin-right:0px;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block .con-title { width:calc(100% - 0px); margin:0px; padding:15px 0px 10px 0px; text-align:center; color:#FFFFFF; font-weight:400; letter-spacing:0.25rem; font-size:1.5rem; line-height:2rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block .con-title .dec-break { font-size:1.5rem; margin:0px; padding:0px; line-height:2.2rem; letter-spacing:0rem; color:#999999;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block .con-title .dec-type { vertical-align:middle; color:#CCCCCC; margin-left:2px; font-size:1.8rem; font-weight:normal;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block .con-area { width:calc(100% - 0px); height:calc(100% - 60px); margin:0px; padding:0px 10px 10px 10px; vertical-align:top; overflow:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-line-pack: center !important; align-content: center !important;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block .con-area .con-num { width:calc(100% - 0px); margin:0px; padding:10px 0px 15px 0px; text-align:center; color:#FFFFFF; font-weight:500; letter-spacing:0.05rem; font-size:3rem; line-height:3.7rem;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block .con-area .con-num .dec-break { font-size:2rem; margin:0px; padding:0px; line-height:2.2rem; letter-spacing:0rem; color:#666666;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block .con-area .con-num.dec-num { display:inline-block;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block .con-area .con-noteArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block .con-area .con-noteArea .con-note { width:auto; margin:10px 0px; padding:5px 15px 7px 15px; text-align:center; color:#FFFFFF; font-weight:400; letter-spacing: 0rem; background: #72bf44; border-radius: 25px; font-size:1.2rem; } /*start - 在線車輛數｜%出車率*/ .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block.dec-01 {} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block.dec-01 .con-title .dec-break { font-size:1.5rem; line-height:2.2rem; margin:0px; padding:0px; letter-spacing:0rem; color:#999999;} .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block.dec-01 .con-title .dec-type { font-size:1.5rem; line-height:2rem; font-weight:normal; letter-spacing:0rem; } .main-area .container-commandRoom .con-content .con-contentArea .con-contentAreaInner .content-L .con-L-block.dec-01 .con-area .con-num { width:calc(100% - 0px); margin:0px; padding:10px 0px 15px 0px; text-align:center; color:#FFFFFF; font-weight:500; letter-spacing:0rem; font-size:2.7rem; line-height:3.7rem;} /*end - 在線車輛數｜%出車率*/ .main-area .container-commandRoom .con-content .con-contentArea .con-innerContent { width:calc(100% - 0px); max-width:1250px; margin:0px auto; padding:0px; background:transparent;} /*start - 車隊總指揮室｜登記車數｜carAmount -------------------------------------------------*/ .carAmount { width:calc(100% - 0px); max-width:1366px; margin:0px; padding:0px; display:inline-block; vertical-align:top; background:transparent;} .carAmount .search-box { padding:0px; background:#FFFFFF; border:solid 1px #dbdbd5; border-radius:25px; display:table;} .carAmount .search-box { width:calc(50% - 0px); margin:0px 0px 0px calc(50% - 0px);} @media (max-width: 480px) {.carAmount .search-box { width:calc(100% - 0px); margin:0px 0px 0px calc(0% - 0px);}} .carAmount .search-box .text-01 { width:calc(100% - 40px); margin:0px; padding:10px 5px; background:transparent; border:0px; border-radius:0px 25px 25px 0px; display:inline-block;} .carAmount .search-box .ic-01 { width:30px; margin:2px; padding:10px; border:0px; border-radius:25px; display:inline-block;} .carAmount .search-box .ic-01 .dec-ic { color:#00aff0;} .carAmount .timelineArea { width:calc(100% - 0px); margin:20px 0px; padding:0px; background:#F5F5F5; display:block;} .carAmount .btn-box { width:calc(100% - 0px); margin:0px; padding:0px; display:block; vertical-align:top;} .carAmount .btn-box .btn-01 { padding:0px; display:-webkit-inline-flex; display:inline-flex; -webkit-justify-content:center; justify-content:center; position:relative; overflow:auto;} .carAmount .btn-box .btn-01 { margin:0px 15px 15px 0px; width:calc((100%/4) - 20px); height:280px;} @media (max-width:1280px){.carAmount .btn-box .btn-01 { margin:0px 15px 15px 0px; width:calc(25vw - 35px); height:calc(25vw - 35px);}} @media (max-width:1050px){.carAmount .btn-box .btn-01 { margin:0px 15px 15px 0px; width:calc(33vw - 35px); height:calc(33vw - 35px);}} @media (max-width:768px){.carAmount .btn-box .btn-01 { margin:0px 15px 15px 0px; width:calc(48vw - 35px); height:calc(48vw - 35px);}} @media (max-width:480px){.carAmount .btn-box .btn-01 { margin:0px 0px 15px 0px; width:calc(100vw - 35px); height:calc(100vw - 35px);}} .carAmount .btn-box .btn-01 .btn-type { width:calc(100% - 0px); margin:0px; padding:15px 0px; z-index:2; color:#f5f5f5; background:rgba(0,0,0,0.5); align-self:center; text-align:center; text-decoration:none;} .carAmount .btn-box .btn-01 .btn-type:hover { color:#FFFFFF; background:rgba(0,175,240,0.9);} .carAmount .btn-box .btn-01 .btn-type .dec-type { font-size:1.3rem; line-height:1.7rem; letter-spacing:0.2rem;} .carAmount .btn-box .btn-01 .btn-type .dec-type .dec-type-break { display:block;} @media (max-width: 1024px) {.carAmount .btn-box .btn-01 .btn-type .dec-type .dec-type-break { display:block;}} .carAmount .btn-box .btn-01 .dec-img, .carAmount .btn-box .btn-01 .dec-img-more { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display:block; z-index:1; position:absolute; right:0px; top:0px;} .carAmount .btn-box .btn-01 .dec-img {} .carAmount .btn-box .btn-01 .dec-img-more { background:#5f5b5b;} .carAmount .introduction-box { width:calc(100% - 0px); margin:0px; padding:0px;} .carAmount .introduction-box .dec-title { width:calc(100% - 65px); margin:0px 5px 0px 0px; padding:5px 0px 5px 0px; line-height:2rem; display:inline-block; color:#595959; vertical-align:top;} .carAmount .introduction-box .dec-btn { width:50px; margin:0px; padding:15px 10px; border-radius:50px; vertical-align:top; display:inline-block;} .carAmount .introduction-box .dec-img { max-width:calc(100% - 0px); max-height:500px; margin:5px 0px; padding:0px; display:block;} .carAmount .introduction-box .content { width:calc(100% - 0px); margin:20px 0px 0px 0px; padding:0px; letter-spacing:0.2rem; display:inline-block; vertical-align:top; color:#595959;} .carAmount .introduction-box .note { margin:0px 5px 0px 0px; padding:0px; font-size:0.9rem; color:#666666; display:inline-block; letter-spacing:0.2rem;} .carAmount .introduction-box .note-img { margin:0px 5px 0px 0px; padding:0px; font-size:0.9rem; color:#666666; display:inline-block; letter-spacing:0.2rem;} .carAmount .introduction-box a { margin:0px; padding:3px; color:#00aff0; text-decoration:none; display:inline;} .carAmount .introduction-box a:hover { color:#FFFFFF; background:#00aff0; text-decoration:none;} .carAmount .introduction-box .extendedReading-box { width:calc(100% - 0px); margin:15px 0px 0px 0px; padding:5px 15px;} .carAmount .introduction-box .extendedReading-box a, .carAmount .introduction-box .extendedReading-box a:hover { display:block; margin-left:20px; margin-bottom:15px;} .carAmount .introduction-box .extendedReading-box a:last-child, .carAmount .introduction-box .extendedReading-box a:last-child:hover { margin-bottom:0px;} .carAmount .introduction-box.dec-extendedReading { margin-top:15px;} /*end - 車隊總指揮室｜carAmount -------------------------------------------------*/ /*start - 車隊總指揮室｜車種分析PieChart -------------------------------------------------*/ .main-area .container-commandRoom .con-content .con-contentArea .con-innerContent .carTypeAnalysis { width:calc(100% - 0px); margin:0px 0px 10px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .main-area .container-commandRoom .con-content .con-contentArea .con-title { width:calc(100% - 0px); margin:0px; padding:20px 0px 0px 0px; text-align:center; color:#FFFFFF; font-weight:400; letter-spacing:0.25rem; font-size:1.5rem; line-height:2rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .main-area .container-commandRoom .con-content .con-contentArea .con-title .dec-type { vertical-align:middle; color:#CCCCCC; margin-left:2px; font-size:1.8rem; font-weight:normal;} .main-area .container-commandRoom .con-content .con-contentArea .con-innerContent .carTypeAnalysis .content-chart { width:calc(65% - 15px); margin:0px; padding:41px 0px 0px 0px; background:transparent; display:inline-block;} .main-area .container-commandRoom .con-content .con-contentArea .con-innerContent .carTypeAnalysis .content-chartLegend { width:calc(35% - 0px);margin:0px 0px 0px 10px; padding:0px; background:transparent; display:inline-block; height: 450px; overflow:hidden;} .content-chartLegend-infoBox { width:calc(100% - 0px); height:calc(100% - 0px); overflow:hidden; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .content-chartLegend-infoBox .con-listArea { width:calc(100% - 0px); height:calc(100% - 0px); overflow:hidden; margin:0px; padding:0px;} .content-chartLegend-infoBox .con-listArea .con-listItemHeader { width:calc(100% - 0px); margin:0px; padding:0px; border-bottom:1px solid #CCCCCC; font-size:1.3rem; line-height:1.5rem; height:41px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .content-chartLegend-infoBox .con-listArea .con-listItemHeader .con-item { width:calc(75% - 0px); margin:5px; padding:5px; font-weight:500;} .content-chartLegend-infoBox .con-listArea .con-listItemHeader .con-item:first-child { width:calc(25% - 0px); margin:5px; padding:5px 8px; background:transparent; border-radius:25px; text-align:center; font-weight:500;} .content-chartLegend-infoBox .con-listArea .con-listItemArea { width:calc(100% - 0px); margin:0px; padding:0px 0px -1px 0px; border-bottom:1px solid #787878; font-size:1.2rem; line-height:1.5rem; height:calc(100% - 41px); overflow-x:hidden; overflow-y:auto; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem { width:calc(100% - 0px); margin:0px; padding:0px; border-bottom:1px solid #787878; font-size:1.2rem; overflow:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover { background:#000000;} .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item { width:calc(75% - 0px); margin:5px; padding:5px; text-align:left; font-size:1.2rem; line-height:1.5rem;} .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child { width:calc(25% - 0px); margin:5px; padding:5px 8px; background:#666666; border-radius:25px; text-align:center;} .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child::after { content:"%"; margin-left: 5px; padding:0px;} .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child.dec-color-01 { background:#0089ff;} /*藍_blue #0089ff 0, 137, 255*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child.dec-color-02 { background:#f7931e;} /*橘_orange #f7931e 247, 147, 30*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child.dec-color-03 { background:#ff0000;} /*紅_red #ff0000 255, 0, 0*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child.dec-color-04 { background:#b4af7d;} /*淺灰_lightgrey #b4af7d 180, 175, 125*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child.dec-color-05 { background:#e85293;} /*粉紅_pink #e85293 232, 82, 147*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child.dec-color-06 { background:#72bf44;} /*綠_green #72bf44 114, 191, 68*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child.dec-color-07 { background:#975c00;} /*棕_brown #975c00 151, 92, 0*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child.dec-color-08 { background:#fccf00;} /*黃_yellow #fccf00 252, 207, 0*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child.dec-color-09 { background:#5dc1cf;} /*淺藍_lightBlue #5dc1cf 93, 193, 207*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem .con-item:first-child.dec-color-10 { background:#009545;} /*綠_green01 #009545 0, 146, 69*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover .con-item:first-child.dec-color-01 { background:#0083e5;} /*藍_blue #0083e5 0, 131, 229*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover .con-item:first-child.dec-color-02 { background:#ef8318;} /*橘_orange #ef8318 239, 131, 24*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover .con-item:first-child.dec-color-03 { background:#ea0303;} /*紅_red #ea0303 234, 3, 3*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover .con-item:first-child.dec-color-04 { background:#a39d6c;} /*淺灰_lightgrey #a39d6c 163, 157, 108*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover .con-item:first-child.dec-color-05 { background:#c93f88;} /*粉紅_pink #c93f88 201, 63, 136*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover .con-item:first-child.dec-color-06 { background:#6aaf3e;} /*綠_green #6aaf3e 106, 175, 62*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover .con-item:first-child.dec-color-07 { background:#824a02;} /*棕_brown #824a02 130, 74, 2*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover .con-item:first-child.dec-color-08 { background:#eabe06;} /*黃_yellow #eabe06 234, 190, 6*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover .con-item:first-child.dec-color-09 { background:#52b9c1;} /*淺藍_lightBlue #52b9c1 82, 185, 193*/ .content-chartLegend-infoBox .con-listArea .con-listItemArea .con-listItem:hover .con-item:first-child.dec-color-10 { background:#038239;} /*綠_green01 #038239 3, 130, 57*/ /*end - 車隊總指揮室｜車種分析PieChart -------------------------------------------------*/ /*end - 車隊總指揮室 ----------------------------------------------------------------------------------*/ /*start - 遠端監控 ----------------------------------------------------------------------------------*/ /*start - .top-autonomousCarsReservation -------------------------------------------------------------*/ .top-autonomousCarsReservation { width:calc(100% - 0px); height:60px; overflow:hidden; margin:0px; padding:10px; background:#333333; color:#FFFFFF; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .top-autonomousCarsReservation .con-title { margin:0px; padding:5px 25px 5px 5px; font-size:1.5rem; line-height:1.7rem;} .top-autonomousCarsReservation .con-selection { margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .top-autonomousCarsReservation .con-selection .con-width-01 { margin:0px 5px 0px 0px; padding:0px; width:120px;} .top-autonomousCarsReservation .con-selection .con-btnArea { width:60px; margin:0px; padding:0px;} .top-autonomousCarsReservation .con-selection .con-btnArea a.btn-search, .top-autonomousCarsReservation .con-selection .con-btnArea a.btn-search:hover { margin:0px;} .top-autonomousCarsReservation .con-update { margin:0px 15px 0px 0px; margin-left:auto; padding:0px 6px 3px 8px; color:#b7caba; text-align:right; font-size:1rem; line-height:1.5rem;} /*start - .top-autonomousCarsReservation .con-legendInfo -----------------------------------------------------*/ .top-autonomousCarsReservation .con-legendInfo { margin:0px 15px 0px 0px; padding:0px; color:#fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important;} .top-autonomousCarsReservation .con-legendInfo .dec-subtitle { margin:0px; padding:0px; font-size:1rem; line-height:1.5rem; color:#fafafa;} .top-autonomousCarsReservation .con-legendInfo .dec-subtitle::after { content:"｜";} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox { margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important;} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox .dec-box { margin:5px 5px 5px 0px; padding:0px; width:14px; height:14px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important;} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-full .dec-box { background:#ff0000;} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-some .dec-box { background:#f7931e;} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-average .dec-box { background:#555555;} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-few .dec-box { background:#b3b3b3;} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-full .dec-boxtype, .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-some .dec-boxtype, .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-average .dec-boxtype, .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-few .dec-boxtype { margin:0px; padding:0px 10px 0px 0px; font-size:1rem; line-height:1.7rem;} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-full .dec-boxtype::after { content:"滿載";} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-some .dec-boxtype::after { content:"略多";} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-average .dec-boxtype::after { content:"普通";} .top-autonomousCarsReservation .con-legendInfo .dec-itemBox.dec-ReservationIntensity-few .dec-boxtype::after { content:"極少";} /*end - .top-autonomousCarsReservation .con-legendInfo -----------------------------------------------------*/ /*start - .top-autonomousCarsReservation .con-btnArea -----------------------------------------------------*/ .top-autonomousCarsReservation .con-btnArea { width:60px; margin:0px; padding:0px 0px 0px 5px;} .top-autonomousCarsReservation .con-btnArea a.btn-cancel, .top-autonomousCarsReservation .con-btnArea a.btn-cancel:hover { margin:0px;} .top-autonomousCarsReservation .con-btnArea a.btn-cancel { background:#333333; color:#fafafa; border:1px solid #787878;} .top-autonomousCarsReservation .con-btnArea a.btn-cancel:hover { background:#212529; color:#f0f0f0; border:1px solid #828282;} /*end - .top-autonomousCarsReservation .con-btnArea -----------------------------------------------------*/ /*end - .top-autonomousCarsReservation -------------------------------------------------------------*/ /*[站點預約強度]1.滿載/dec-ReservationIntensity-full, 2.略多/dec-ReservationIntensity-some, 3.普通/dec-ReservationIntensity-average, 4.極少/dec-ReservationIntensity-few*/ /* 1 滿載 #ff0000 (255, 0, 0) dec-ReservationIntensity-full 2 略多 #f7931e (247, 147, 30) dec-ReservationIntensity-some 3 普通 #555555 (85, 85, 85) dec-ReservationIntensity-average 4 極少 #b3b3b3 (179, 179, 179) dec-ReservationIntensity-few*/ /*start - .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader -----------------------------------------------------*/ .con-autonomousCarsReservation { width:calc(100% - 0px); height:calc(100vh - 110px); margin:0px; padding:10px 10px 20px 10px; background:#333333; color:#FFFFFF;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader .table.table-hover.dec-table { border-bottom:0px;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 40px); overflow-y:hidden;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader { height:calc(100% - 0px); overflow-y:hidden;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader thead { display:block; height:55px; overflow:hidden; background:#454545;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader thead th { padding:0.25rem; border:1px solid #222222;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader thead th .dec-type { padding:0rem 0rem 0rem 0.25rem; font-weight:400; color:#d9d9d9;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader thead tr .dec-current { color:#fcee21; font-weight:normal; padding:2px;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody { display:block; height:calc(100% - 55px); overflow-x:hidden; overflow-y:auto;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr { border-bottom:1px solid #222222; border-right:1px solid #222222; background:#999999;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr td { padding:0rem; border-left:1px solid #222222; border-top:0px solid #222222;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr, .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr:nth-child(even) { background:#555555;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr:hover, .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr:nth-child(even):hover { background:#333333;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr th { background:#595959;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr td { background:#454545;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr:hover td { background:#333333;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr.dec-table-sub td { } .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr .dec-subtitle { font-size:1.5rem; line-height:1.7rem; font-weight:500; text-transform:uppercase; padding:12px 0.25rem; color:#FFFFFF;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr .dec-num { font-size:1rem; line-height:1.7rem; font-weight:400; text-transform:uppercase; padding:12px 0.5rem; color:#FFFFFF;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr a, .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr a:hover { color:#FFFFFF; font-weight:normal; font-size:1.5rem; line-height:1.7rem; margin:0px; padding:12px 0.5rem 12px 0.5rem; width:calc(100% - 0px);} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr a.dec-ReservationIntensity-full { background:#ff0000;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr a.dec-ReservationIntensity-full:hover { background:#ea0303;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr a.dec-ReservationIntensity-some { background:#f7931e;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr a.dec-ReservationIntensity-some:hover { background:#ef8318;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr a.dec-ReservationIntensity-average { background:#555555;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr a.dec-ReservationIntensity-average:hover { background:#4b4b4b;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr a.dec-ReservationIntensity-few { background:#b3b3b3;} .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader tbody tr a.dec-ReservationIntensity-few:hover { background:#a9a9a9;} /*end - .con-autonomousCarsReservation .table-responsive.dec-table.dec-fixedTableHeader -----------------------------------------------------*/ /*start - .box-con.con-autonomousCarsReservation-LegendSetting -----------------------------------------------------*/ .box-con.con-autonomousCarsReservation-LegendSetting { width:calc(100% - 0px); margin:0px; padding:0px;} .box-con.con-autonomousCarsReservation-LegendSetting .con-note { width:calc(100% - 0px); margin:0px; padding:5px 0px; font-size:1rem; line-height:1.2rem; color:#999999;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem { width:calc(100% - 0px); height:44px; overflow:hidden; margin:0px; padding:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem:hover { background:#fcfbe0;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem .con-icon { width:80px; height:34px; margin:0px; padding:0px;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem .con-icon.dec-ReservationIntensity-full { background:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:-550px -1870px;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem .con-icon.dec-ReservationIntensity-some { background:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:-630px -1870px;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem .con-icon.dec-ReservationIntensity-average { background:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:-710px -1870px;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem .con-icon.dec-ReservationIntensity-few { background:url("../images/map/sprite_map/sprite_map.svg"); background-size:1008px 2335px; background-position:-790px -1870px;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem .con-iconType { width:60px; margin:0px; padding:5px; font-size:1rem; line-height:1.7rem; color:#595959;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem .con-type-01 { width:70px; margin:0px; padding:5px; font-size:1rem; line-height:1.7rem; color:#595959; text-align:right;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem .con-type-02 { width:40px; margin:0px; padding:5px;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem .con-textArea { width:calc(100% - 250px); margin:0px; padding:0px;} .box-con.con-autonomousCarsReservation-LegendSetting .con-listItem .con-textArea .dec-type { margin:0px; padding:6px 0px;} /*end - .box-con.con-autonomousCarsReservation-LegendSetting -----------------------------------------------------*/ .table-responsive.dec-table.dec-fixedTableHeader.dec-autonomousCarsReservation-Detail { height:calc(100% - 0px);} .table-responsive.dec-table.dec-fixedTableHeader.dec-autonomousCarsReservation-Detail .table.table-hover.dec-table { border-bottom:0px;} .table-responsive.dec-table.dec-fixedTableHeader.dec-autonomousCarsReservation-Detail .table.table-hover.dec-table tr.dec-note, .table-responsive.dec-table.dec-fixedTableHeader.dec-autonomousCarsReservation-Detail .table.table-hover.dec-table tr.dec-note:hover { border:0px; background: transparent;} .table-responsive.dec-table.dec-fixedTableHeader.dec-autonomousCarsReservation-Detail .table.table-hover.dec-table tr.dec-note td { text-align: center; margin:0px; padding:5px; color:#c2c2c2; border:0px;} /*end - 遠端監控 ----------------------------------------------------------------------------------*/ /*start - 車輛派遣｜新增班表 --------------------------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-CarMission-Schedule-RightSideModeResizable .con-main { overflow-x:hidden; overflow-y:auto; padding:0px 5px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-CarMission-Schedule-RightSideModeResizable .con-main .box-conArea .box-conArea-outerBox .box-conArea-con { width:calc(100% - 0px); margin:0px; padding:0px 0px 5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.dec-CarMission-Schedule-RightSideModeResizable .con-main .box-conArea .box-conArea-outerBox .box-conArea-con .con-functionbox .form-check { width:auto;} /*end - 車輛派遣｜新增班表 --------------------------------------------------------------------------------------------------*/ /*start - [04-01M.監控圖台/NavLeft/道路管理M/導航路線繪製] & [04-01MC.監控圖台/NavLeft/道路管理M/導航路線繪製(右側上下模式/右側)] ---------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad .box-inner .con-main｜04-01M.監控圖台/NavLeft/道路管理M/導航路線繪製 ----------------------------------------------------------*/ .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad .box-inner .con-main { overflow:hidden;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad .box-inner .con-main .box-conArea-RoadM-NavRoad, .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad .box-inner .con-main .box-btnArea-RoadM-NavRoad { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad .box-inner .con-main .box-conArea-RoadM-NavRoad { height:calc(100% - 80px); overflow-x:hidden; overflow-y:auto; margin:0px; padding:0px 5px 0px 0px;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad .box-inner .con-main .box-btnArea-RoadM-NavRoad { height:80px; margin:0px; padding:0px; overflow:hidden;} .box-btnArea-RoadM-NavRoad .dec-btn.dec-w-half.dec-floatL { float:left;} /*start - .box-conArea-RoadM-NavRoad .box-conArea-outerBox ---------------------------------------------------------*/ .box-conArea-RoadM-NavRoad .box-conArea-outerBox { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox:hover {} .box-conArea-RoadM-NavRoad .box-conArea-outerBox:first-child {} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-con-whole { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-con-whole .box-inner-width-half:first-child { width:calc(50% - 0px); margin:0px; padding:0px;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-con-whole .box-inner-width-half:last-child { width:calc(50% - 5px); margin:0px 0px 0px 5px; padding:0px;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-conArea-con { width:calc(100% - 0px); margin:0px; padding:0px 0px 5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-conArea-con.dec-divider { border-top:1px solid #CCCCCC; margin-bottom:5px;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-conArea-con.dec-note { color:#b3b3b3; margin-bottom:5px; padding: 5px 0px; line-height:1.2rem; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-conArea-con.dec-note .icon-sprite { display:inline-block; margin:0px; padding:0px 5px;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-conArea-con.dec-note p { width:calc(100% - 0px); margin-bottom:5px; line-height:1.2rem; font-size:1rem; color:#b3b3b3; font-weight:normal; font-family:'Noto Sans TC', sans-serif;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-conArea-con.dec-subTitle { color:#595959; -ms-flex-pack: start !important; justify-content: flex-start !important; padding:10px 0px 5px 0px;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-conArea-con.dec-subTitle.dec-pt01 { } .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-conArea-con.dec-subTitle .icon-sprite { margin-right:5px;} .box-conArea-RoadM-NavRoad .box-conArea-outerBox .box-conArea-con.dec-paddingTop { padding-top:15px;} /*end - .box-conArea-RoadM-NavRoad .box-conArea-outerBox ---------------------------------------------------------*/ .box-conArea-RoadM-NavRoad .box-inner-width-whole { width:calc(100% - 0px); height:34px; margin-left:0px;} /*start - .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad .box-inner .con-main .box-conArea-RoadM-NavRoad ---------------------------------------------------------*/ /*start - .box-conArea-RoadM-NavRoad .con-functionbox -------------------------------------*/ .box-conArea-RoadM-NavRoad .con-functionbox { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-conArea-RoadM-NavRoad .con-functionbox .form-check { width:55px; padding-top:2px; padding-bottom:3px; margin-right:5px;} .box-conArea-RoadM-NavRoad .con-functionbox .form-check .form-check-label { width:calc(100% - 0px); padding-right:0px;} .box-conArea-RoadM-NavRoad .con-functionbox div.form-check, .box-conArea-RoadM-NavRoad .con-functionbox.dec-RoadM-type div.form-check { width:auto; display:inline-block; margin:5px 25px 5px 0px;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad .box-inner .con-main .con-functionbox div.form-check { } /*end - .box-conArea-RoadM-NavRoad .con-functionbox -------------------------------------*/ .box-conArea-RoadM-NavRoad .box-inner-width-aa01 { width:34px; height:34px; margin-left:0px;} .box-conArea-RoadM-NavRoad .box-inner-width-aa02 { width:48px; margin-left:0px; text-align:right;} .box-conArea-RoadM-NavRoad .box-inner-width-aa03 { width:calc(100% - 51px); margin-left:5px;} .box-conArea-RoadM-NavRoad .box-inner-width-aa03a { width:calc(100% - 199px); margin-left:5px;} .box-conArea-RoadM-NavRoad .box-inner-width-aa04 { width:34px; height:34px; margin-left:5px;} .box-conArea-RoadM-NavRoad .box-inner-width-aa05 { width:34px; height:34px; margin-left:0px;} .box-conArea-RoadM-NavRoad .box-inner-width-aa06 { width:34px; height:34px; margin-left:0px;} .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker, .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker:hover, .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker.is-active, .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker.is-active:hover { width:34px; height:34px; margin:0px; padding:0px; position:relative; overflow:hidden; text-decoration: none; border:3px solid #f7931e; display: block;} .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker { border:3px solid transparent; display:block;} .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker:hover, .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker.is-active, .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker.is-active:hover { border:3px solid #f7931e; display:block;} .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker .icon-type { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:1px 0px 0px 0px; position:absolute; font-size:12px; font-weight:normal; z-index:2; color:#FFFFFF; top:0px; left:0px; text-align:center;} .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker .icon-type.dec-midway { color:#595959;} .box-conArea-RoadM-NavRoad .box-inner-width-aa01 a.ic-marker .icon-sprite { margin:0px; padding:0px; z-index:1; top:0px; left:0px; position:absolute; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea-RoadM-NavRoad a.icon-sprite, .box-conArea-RoadM-NavRoad a:hover.icon-sprite { width:34px; height:34px; margin:0px; padding:8px; display:block; border-radius:25px;} .box-conArea-RoadM-NavRoad a.icon-sprite .icon-ic_arrowUp_darkGray, .box-conArea-RoadM-NavRoad a.icon-sprite .icon-ic_arrowDown_darkGray, .box-conArea-RoadM-NavRoad a.icon-sprite .icon-ic_trash_darkGray {} .box-conArea-RoadM-NavRoad a.dec-disable.icon-sprite .icon-sprite.icon-ic_arrowUp_darkGray, .box-conArea-RoadM-NavRoad a.dec-disable:hover.icon-sprite .icon-sprite.icon-ic_arrowUp_darkGray { background-position:-306px -2189px;} .box-conArea-RoadM-NavRoad a.dec-disable.icon-sprite .icon-sprite.icon-ic_arrowDown_darkGray, .box-conArea-RoadM-NavRoad a.dec-disable:hover.icon-sprite .icon-sprite.icon-ic_arrowDown_darkGray { background-position:-340px -2189px;} .box-conArea-RoadM-NavRoad a.dec-disable.icon-sprite, .box-conArea-RoadM-NavRoad a.dec-disable:hover.icon-sprite { background:transparent; cursor:auto;} .box-conArea-RoadM-NavRoad a { background:transparent;} .box-conArea-RoadM-NavRoad a:hover, .box-conArea-RoadM-NavRoad a.is-active, .box-conArea-RoadM-NavRoad a.is-active:hover { background:#f5f5f5;} .box-conArea-RoadM-NavRoad a.dec-midway .dec-type, .box-conArea-RoadM-NavRoad a:hover.dec-midway .dec-type { font-size: 1rem; margin:0px 0px 0px 5px; padding:0px; color:#595959;} .box-conArea-RoadM-NavRoad a:hover.dec-midway .dec-type { color:#169cbf;} .box-conArea-RoadM-NavRoad a.dec-midway { margin:0px; padding:5px 8px; border-radius:5px; border:1px solid #e1e1e1; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .box-conArea-RoadM-NavRoad a:hover.dec-midway { color:#0083be; border:1px solid #CCCCCC; background:#fafafa;} /*end - .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad .box-inner .con-main .box-conArea-RoadM-NavRoad ---------------------------------------------------------*/ /*end - .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad .box-inner .con-main｜04-01M.監控圖台/NavLeft/道路管理M/導航路線繪製 ----------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoad .con-main｜04-01MC.監控圖台/NavLeft/道路管理M/導航路線繪製(右側上下模式/右側) ------------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoad .con-main { overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoad .con-main .box-conArea-RoadM-NavRoad, .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoad .con-main .box-btnArea-RoadM-NavRoad { width:calc(100% - 0px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoad .con-main .box-conArea-RoadM-NavRoad { height:calc(100% - 80px); overflow-x: hidden; overflow-y:auto; margin:0px; padding:0px 5px 0px 0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoad .con-main .box-btnArea-RoadM-NavRoad { height:80px; margin:0px; padding:0px; overflow:hidden;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoad .con-main｜04-01MC.監控圖台/NavLeft/道路管理M/導航路線繪製(右側上下模式/右側) ------------------*/ /*end - [04-01M.監控圖台/NavLeft/道路管理M/導航路線繪製] & [04-01MC.監控圖台/NavLeft/道路管理M/導航路線繪製(右側上下模式/右側)] ---------------------------------------------------------------------------------*/ /*start - [04-02M.監控圖台/NavLeft/道路管理M/導航路線列表] & [04-02MC.監控圖台/NavLeft/道路管理M/導航路線列表(右側上下模式/右側)] -----------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad-List .box-inner.div-box-inner .con-main｜04-02M.監控圖台/NavLeft/道路管理M/導航路線列表 ----------------------------------------------------------*/ .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad-List { overflow:hidden;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad-List .box-inner.div-box-innern { overflow:hidden;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad-List .box-inner.div-box-inner .con-main { overflow:hidden;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad-List .box-inner.div-box-inner .con-main .con-NavRoadListArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad-List .box-inner.div-box-inner .con-main .con-NavRoadListArea .box-conArea.dec-NavRoadList-SearchArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 2px 0px; overflow:hidden; height:35px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SearchArea .box-inner-width-ab01 { width:calc(50% - 5px); margin:0px 5px 0px 0px; padding:0px;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SearchArea .box-inner-width-ab02 { width:calc(50% - 0px); margin:0px; padding:0px;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SearchArea .box-inner-width-ac01 { width:calc(100% - 65px); margin:0px 5px 0px 0px; padding:0px;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SearchArea .box-inner-width-ac02 { width:60px; margin:0px; padding:0px;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SearchArea .box-inner-width-ac02 a.btn-search { margin-top:0px;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SearchArea .box-inner-width-ac01 .form-check-label { display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SearchArea .box-inner-width-ac01 .form-check-label .icon-sprite { margin:2px 3px 0px 0px; padding:0px;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad-List .box-inner.div-box-inner .con-main .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle { width:calc(100% - 0px); height:37px; margin:0px; padding:0px 0px 0px 5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .dec-type { color:#595959;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea { width:30px; height:37px; margin:0px 0px 0px 5px; padding:0px; background:transparent; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a.btn-sortUp, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a:hover.btn-sortUp, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a.btn-sortDown, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a:hover.btn-sortDown { width:30px; height:18px; margin:0px; padding:0px 10px 0px 0px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a.btn-sortUp, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a:hover.btn-sortUp { margin-bottom:1px; background:transparent;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a.btn-sortDown, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a:hover.btn-sortDown, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a:hover.btn-sortUp, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a:hover.btn-sortDown { background:transparent;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a.btn-sortUp .icon-sprite { opacity:0.7;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a:hover.btn-sortUp .icon-sprite { opacity:1;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a.btn-sortDown .icon-sprite { opacity:0.7;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a:hover.btn-sortDown .icon-sprite { opacity:1;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a.btn-sortUp.dec-disable .icon-sprite, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a:hover.btn-sortUp.dec-disable .icon-sprite, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a.btn-sortDown.dec-disable .icon-sprite, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .box-btnArea a:hover.btn-sortDown.dec-disable .icon-sprite { opacity:0.3; cursor:auto;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .btn-instructions { margin:0px; margin-left:auto; padding:0px; display:inline-block;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .btn-instructions a, .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .btn-instructions a:hover { margin:0px; padding:3px 0px 1px 0px; border-bottom:1px solid #29abe2; background:transparent; display:inline-block; color:#29abe2;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle .btn-instructions a:hover { border-bottom:1px solid #1899c6; color:#1899c6;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad-List .box-inner.div-box-inner .con-main .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result { width:calc(100% - 0px); height:calc(100% - 110px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; background:transparent;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .dec-noData { color:#b3b3b3; margin-bottom:5px; padding:5px 0px; line-height:1.2rem; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .dec-noData .dec-type { display:inline-block; margin:0px; width:calc(100% - 0px);} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .dec-noData .dec-type p { width:calc(100% - 0px); margin-bottom:5px; line-height:1.2rem; font-size:1rem; color:#b3b3b3; font-weight:normal; font-family:'Noto Sans TC', sans-serif; text-align:center;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; background:transparent; border-bottom:1px solid #ebebeb; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem:nth-child(odd) { background:#f2f2f2;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem:first-child { border-top:1px solid #ebebeb;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem:hover, .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem.is-active, .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem.is-active:hover { background:#e1f1f4;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem .conBthArea { margin:0px; padding:0px; width:40px; height:40px; overflow:hidden;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea, .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea:hover { margin:0px; padding:0px; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conBtnArea, .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conBtnArea:hover { width:40px; height: 40px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea.dec-w01-btn { width:calc(100% - 100px); margin-right:auto;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea.dec-w02a { width:calc(100% - 40px); margin-right:auto;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea.dec-w02 { width:calc(100% - 80px); margin-right:auto;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea.dec-w03 { width:calc(100% - 120px); margin-right:auto;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-Top { width:calc(100% - 0px); margin:0px; padding:5px 0px; font-size:1rem; line-height:1.5rem; color:#595959;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea { width:calc(100% - 0px); height:26px; margin:0px; padding:0px 0px 5px 0px; font-size:12px; line-height:1.2rem; color:#999999; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox { width:calc(100% - 22px); height:calc(100% - 0px); overflow:hidden; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightCautionBox { width:18px; height:18px; margin:0px; padding:0px;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox .con-routeWeightItem { width:calc(20% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; text-align:center; background:#CCCCCC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox .con-routeWeightItem.dec-color-routeWeightItem-drive { background:#29abe2;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox .con-routeWeightItem.dec-color-routeWeightItem-unable { background:#ef5b5b;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox .con-routeWeightItem.dec-color-routeWeightItem-notSet { background:#CCCCCC;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox .con-routeWeightItem .dec-type { font-size:1rem; line-height:1.5rem; margin:0px; padding:0px; color:#FFFFFF;} /* 導航路線列表/權重: 1.正常行駛.dec-color-routeWeightItem-drive, 2.無法行駛.dec-color-routeWeightItem-unable, 3.未設定.dec-color-routeWeightItem-notSet (正常行駛)_該權重之路徑可正常行駛 #29abe2 (41, 171, 226) dec-color-routeWeightItem-drive (無法行駛)_因禁行路段而無法行駛 #ef5b5b (239, 91, 91) dec-color-routeWeightItem-unable (未設定)_該權重未設定路徑 #CCCCCC (204, 204, 204) dec-color-routeWeightItem-notSet */ .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conBtnArea .icon-sprite { opacity:0.7;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conBtnArea:hover .icon-sprite { opacity:1;} .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem .dec-type { text-align:right; margin:0px; padding:5px; color:#787878; margin-left:auto;} /*end - .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-NavRoad-List .box-inner.div-box-inner .con-main｜04-02M.監控圖台/NavLeft/道路管理M/導航路線列表 ----------------------------------------------------------*/ /*start - .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoadList｜04-02MC.監控圖台/NavLeft/道路管理M/導航路線列表(右側上下模式/右側) ----------------------------------------------------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoadList .con-main .con-NavRoadListArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoadList .con-main .con-NavRoadListArea .box-conArea.dec-NavRoadList-SearchArea { width:calc(100% - 0px); margin:0px; padding:0px 0px 2px 0px; overflow:hidden; height:35px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoadList .con-main .con-NavRoadListArea .box-conArea.dec-NavRoadList-SubTitle { width:calc(100% - 0px); height:37px; margin:0px; padding:0px 0px 0px 5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoadList .con-main .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result { width:calc(100% - 0px); height:calc(100% - 110px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto; background:transparent;} /*end - .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-NavRoadList｜04-02MC.監控圖台/NavLeft/道路管理M/導航路線列表(右側上下模式/右側) ----------------------------------------------------------*/ /*end - [04-02M.監控圖台/NavLeft/道路管理M/導航路線列表] & [04-02MC.監控圖台/NavLeft/道路管理M/導航路線列表(右側上下模式/右側)] -----------------------------------------------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main｜04-03M.監控圖台/NavLeft/道路管理M/禁行道路繪製 -------------------------------------------------------*/ .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main { height:calc(100% - 50px); overflow:hidden;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main .box-conArea.dec-conArea { height:calc(100% - 50px); overflow-y:auto; padding:0px 5px 0px 0px;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main .box-conArea.dec-btnArea { height:50px; overflow:hidden;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-subTitle { color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; padding:10px 0px 5px 0px;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-subTitle.dec-pt01 { } .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-subTitle .icon-sprite { margin-right:5px;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-note { color:#b3b3b3; margin-bottom:5px; padding:5px 0px; line-height:1.2rem; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-note .icon-sprite { display:inline-block; margin:0px; padding:0px 5px;} .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-note p { width:calc(100% - 0px); margin-bottom:5px; line-height:1.2rem; font-size:1rem; color:#b3b3b3; font-weight:normal; font-family:'Noto Sans TC', sans-serif;} /*end - .MapTool-FunctionBox.dec-RoadM.div-MapTool-RoadM-ForbiddenRoad .box-inner .con-main｜04-03M.監控圖台/NavLeft/道路管理M/禁行道路繪製 -------------------------------------------------------*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main｜04-03MC.監控圖台/NavLeft/道路管理M/禁行道路繪製(右側上下模式/右側) -----------------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main { height:calc(100% - 0px); overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main .box-conArea.dec-conArea { height:calc(100% - 90px); overflow-y:auto; padding:0px 5px 0px 0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main .box-conArea.dec-btnArea { height:50px; overflow:hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-subTitle { color:#595959; -ms-flex-pack: start !important; justify-content: flex-start !important; padding:10px 0px 5px 0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-subTitle.dec-pt01 { } .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-subTitle .icon-sprite { margin-right:5px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-note { color:#b3b3b3; margin-bottom:5px; padding:5px 0px; line-height:1.2rem; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-note .icon-sprite { display:inline-block; margin:0px; padding:0px 5px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main .box-conArea .box-conArea-outerBox .box-conArea-con.dec-note p { width:calc(100% - 0px); margin-bottom:5px; line-height:1.2rem; font-size:1rem; color:#b3b3b3; font-weight: normal; font-family:'Noto Sans TC', sans-serif;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad .con-main｜04-03MC.監控圖台/NavLeft/道路管理M/禁行道路繪製(右側上下模式/右側) -----------------*/ /*start - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main .con-NavRoadForbiddenRoadListArea 04-04MC.監控圖台/NavLeft/道路管理M/禁行道路列表(右側上下模式/右側) --------*/ .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main { } .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main .con-NavRoadForbiddenRoadListArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection { width:calc(100% - 0px); margin:0px; padding:0px 0px 5px 0px; height:45px; overflow: hidden;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection .box-con-whole { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection .box-con-whole .box-inner-width-a01 { width:calc(100% - 65px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection .box-con-whole .box-inner-width-a01-btn { width:60px; margin:0px 0px 0px 5px; padding:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection .box-con-whole .box-inner-width-a01-btn a.btn-search, .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection .box-con-whole .box-inner-width-a01-btn a.btn-search:hover { margin:0px;} .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Result { width:calc(100% - 0px); height:calc(100% - 45px); margin:0px; padding:0px;} /*end - .MapTool-FunctionBox.dec-RightSideModeResizable .box-inner.div-box-inner.dec-RightSideModeResizable.dec-RoadM-ForbiddenRoad-List .con-main .con-NavRoadForbiddenRoadListArea 04-04MC.監控圖台/NavLeft/道路管理M/禁行道路列表(右側上下模式/右側) --------*/ /*start - .MapTool-FunctionBox.dec-RoadM .tab-content.dec-con-01 .con-NavRoadForbiddenRoadListArea div-MapTool-RoadM-ForbiddenRoad-List - 04-04M.監控圖台/NavLeft/道路管理M/禁行道路列表 ------------------------*/ .MapTool-FunctionBox.dec-RoadM .tab-content.dec-con-01 .con-NavRoadForbiddenRoadListArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .con-NavRoadForbiddenRoadListArea.dec-ForbiddenRoad-List-01 { } .con-NavRoadForbiddenRoadListArea.dec-ForbiddenRoad-List-02 { } .MapTool-FunctionBox.dec-RoadM .tab-content.dec-con-01 .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection { width:calc(100% - 0px); margin:0px; padding:0px 0px 5px 0px; height:45px; overflow: hidden;} .MapTool-FunctionBox.dec-RoadM .tab-content.dec-con-01 .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection .box-con-whole { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .MapTool-FunctionBox.dec-RoadM .tab-content.dec-con-01 .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection .box-con-whole .box-inner-width-a01 { width:calc(100% - 65px); margin:0px; padding:0px;} .MapTool-FunctionBox.dec-RoadM .tab-content.dec-con-01 .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection .box-con-whole .box-inner-width-a01-btn { width:60px; margin:0px 0px 0px 5px; padding:0px;} .MapTool-FunctionBox.dec-RoadM .tab-content.dec-con-01 .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection .box-con-whole .box-inner-width-a01-btn a.btn-search, .MapTool-FunctionBox.dec-RoadM .tab-content.dec-con-01 .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Selection .box-con-whole .box-inner-width-a01-btn a.btn-search:hover { margin:0px;} .MapTool-FunctionBox.dec-RoadM .tab-content.dec-con-01 .con-NavRoadForbiddenRoadListArea .box-conArea.dec-ForbiddenRoad-Result { width:calc(100% - 0px); height:calc(100% - 45px); margin:0px; padding:0px;} /*end - .MapTool-FunctionBox.dec-RoadM .tab-content.dec-con-01 .con-NavRoadForbiddenRoadListArea div-MapTool-RoadM-ForbiddenRoad-List - 04-04M.監控圖台/NavLeft/道路管理M/禁行道路列表 ------------------------*/ /*start - 即時監控｜車輛現況(振展兩側模式) ----------------------------------------------------------*/ .box-inner.div-box-inner.div-MapTool-Monitor-Car-RightSideModeResizable-boxInner .box-conArea.dec-selecter-RightSideMode { margin:0px 0px 5px 0px; padding:0px 0px 5px 0px; border-bottom:1px solid #CCCCCC; overflow: hidden;} .box-inner.div-box-inner.div-MapTool-Monitor-Car-RightSideModeResizable-boxInner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result { height:calc(100% - 90px); overflow: hidden;} .box-inner.div-box-inner.div-MapTool-Monitor-Car-RightSideModeResizable-boxInner .con-main .dec-box-con .dec-box-inner .dec-box-inner-result .bottom-table-area-a01 { height:calc(100% - 120px); margin-top:5px;} /*end - 即時監控｜車輛現況(振展兩側模式) ----------------------------------------------------------*/ /*start - 01-01A.監控圖台/NavLeft/即時監控/車輛現況(一般模式，地圖右側，不可調整寬度) ----------------------------------------------------------*/ .MapTool-FunctionBox.dec-Monitor-CarInfo-MonitorCar-RightSideMode.div-MapTool-Monitor-Car-RightSideMode .box-inner .con-top .con-top-title { padding-left:5px;} /*end - 01-01A.監控圖台/NavLeft/即時監控/車輛現況(一般模式，地圖右側，不可調整寬度) ----------------------------------------------------------*/ /*start - 03-01A.監控圖台/NavLeft/軌跡查詢(右側模式) ----------------------------------------------------------*/ .MapTool-FunctionBox.dec-TrackHistory-RightSideMode.div-MapTool-TrackHistory-RightSideMode .box-inner .con-top .con-top-title { } .MapTool-FunctionBox.dec-TrackHistory-RightSideMode.div-MapTool-TrackHistory-RightSideMode .box-inner .con-top .con-top-title .nav-pills.dec-con-05 { width:calc(100% - 0px); border:0px;} /*end - 03-01A.監控圖台/NavLeft/軌跡查詢(右側模式) ----------------------------------------------------------*/ .modal-dialog.modal-dialog-centered { height:80%;} /*start - .dec-modal -------------------------------------------------------------------------------*/ .dec-modal { height:calc(100% - 0px); color:#595959;} .dec-modal.modal-dialog { height:80%;} .dec-modal.modal-dialog.dec-mSpareEdit-Record { width:calc(80% - 0px); max-width:calc(80% - 0px);} .dec-modal.modal-dialog .modal-content { height:calc(100% - 0px); background:#FFFFFF; border:1px solid #484848;} .dec-modal.modal-dialog .modal-content.dec-box01 { height: 230px !important; height: 350px !important;} .dec-modal.modal-dialog .modal-content.dec-box01.dec-height-01 { height: 300px !important;} .dec-modal.modal-dialog .modal-content.dec-box01.dec-height-02 { height: 460px !important;} .dec-modal.modal-dialog .modal-content.dec-box01.dec-height-03 { height: 365px !important;} .dec-modal.modal-dialog .modal-content.dec-box02 { height:80%; width:76%; margin-left:12%;} .dec-modal.modal-dialog .modal-content.dec-box03 { height:90%; width:900px; margin-left:calc(50% - 450px); min-height:580px;} .dec-modal.modal-dialog .modal-content.dec-box02.dec-video {} .dec-modal.modal-dialog .modal-content .modal-header { background:#7b7b7b; padding-top:5px; padding-bottom:5px; padding-right:5px;} .dec-modal.modal-dialog.dec-autonomousCarsReservation-Detail { width:calc(80% - 0px); max-width:900px;} .dec-modal.modal-dialog.dec-autonomousCarsReservation-Detail .modal-content { height:calc(50% - 0px); max-height:calc(50% - 0px);} .dec-modal.modal-dialog .modal-content .modal-header .modal-title { background:transparent; width:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .dec-modal.modal-dialog .modal-content .modal-header .dec-type { color:#FFFFFF; font-family:'Noto Sans TC', sans-serif; font-weight:400;} .dec-modal.modal-dialog .modal-content .modal-header .dec-type .dec-num { margin:0px 0px 0px 3px; padding:0px; font-weight:500; color:#fccf00;} .dec-modal.modal-dialog .modal-content .modal-header .dec-note { color: #ebebeb; font-family: 'Noto Sans TC', sans-serif; font-weight: 400; font-size:1rem; margin-left:10px; margin-top:3px;} .dec-modal.modal-dialog .modal-content .modal-header .modal-title .dec-update { margin:0px 0px 0px auto; padding:0px; font-size:12px; line-height:1.2rem; letter-spacing:0rem; font-weight:400; color:#CCCCCC;} .dec-modal.modal-dialog .modal-content .modal-header .close.btn-modalFunction-close { color:#FFFFFF; opacity:1;} .dec-modal.modal-dialog .modal-content .modal-header .close.btn-modalFunction-close:not(:disabled):not(.disabled):hover, .dec-modal.modal-dialog .modal-content .modal-header .close.btn-modalFunction-close:not(:disabled):not(.disabled):focus { color:#FFFFFF; text-decoration:none; opacity:0.75;} .dec-modal.modal-dialog .modal-content .modal-header .close.btn-modalFunction-close:first-child { margin-right:-0.5rem; margin-left:-1rem;} .dec-modal.modal-dialog .modal-content .modal-header a, .dec-modal.modal-dialog .modal-content .modal-header a:hover { color:#ebebeb; margin:0px; margin-left:auto; padding:1px 8px; border-radius:25px; font-size:1rem; background:#787878; border:1px solid #656565;} .dec-modal.modal-dialog .modal-content .modal-header a:hover { background:#595959;} .dec-modal.modal-dialog .modal-content .modal-body { background:#FFFFFF; display:block; width:calc(100% - 20px); height:calc(100% - 120px); overflow-x:hidden; overflow-y:auto; margin:10px; padding:0px 5px 5px 0px;} .dec-modal.modal-dialog .modal-content .modal-body.dec-overflow-h01 { padding-right:0px; overflow:hidden;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-whole { height:calc(100% - 0px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-whole .form-group { height:calc(100% - 0px);} .dec-modal.modal-dialog .modal-content .modal-body .con-conBox { width:calc(100% - 0px); margin:0px; padding:5px 0px; height:33.5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .dec-modal.modal-dialog .modal-content .modal-body .con-conBox .con-width-whole { width:calc(100% - 0px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .con-conBox .box-con-checkBoxArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .dec-modal.modal-dialog .modal-content .modal-body .con-conBox .box-con-checkBoxArea .form-check .form-check-label { padding-right:25px;} .dec-modal.modal-dialog .modal-content .modal-footer { background:transparent; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog .modal-content .modal-footer.dec-p01 { background:transparent; -ms-flex-pack: center !important; justify-content: center !important;} .dec-modal.modal-dialog .modal-content .modal-footer .dec-w01, .dec-modal.modal-dialog .modal-content .modal-footer .dec-w01:hover { width:calc(50% - 10px); display:inline-block; font-size:1.1rem;} .dec-modal.modal-dialog .modal-content .modal-footer .dec-w02, .dec-modal.modal-dialog .modal-content .modal-footer .dec-w02:hover { width:calc(50% - 10px); max-width:130px; display:inline-block; font-size:1.1rem;} .dec-modal.modal-dialog .modal-content .modal-footer .dec-w02a, .dec-modal.modal-dialog .modal-content .modal-footer .dec-w02a:hover { width:calc(50% - 10px); max-width:160px; display:inline-block; font-size:1.1rem;} .dec-modal.modal-dialog .modal-content .modal-footer .dec-w03, .dec-modal.modal-dialog .modal-content .modal-footer .dec-w03:hover { width:calc(30% - 10px); max-width:130px; display:inline-block; font-size:1.1rem;} .dec-modal.modal-dialog .modal-content .modal-body .box-con, .dec-modal.modal-dialog .modal-content .modal-body .box-con.dec-textAlignC { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px 5px 0px 0px; display:block; overflow-x:hidden; overflow-y:auto;} .dec-modal.modal-dialog .modal-content .modal-body .box-con.dec-textAlignC { display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-con-halfArea --------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-con-halfArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-con-halfArea .box-con-halfBox { width:calc(50% - 5px); margin:0px 0px 0px 5px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-con-halfArea .box-con-halfBox:first-child { width:calc(50% - 0px); margin:0px;} /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-con-halfArea --------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con p.dec-noteArea-type { color:#999999; font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1rem; line-height:1.3rem; margin:5px 0px; padding:5px 0px; width:calc(100% - 0px); text-align:left;} .dec-modal.modal-dialog .modal-content .modal-body .box-con p.dec-noteArea-type-01 { color: #ed1c24; font-family: 'Noto Sans TC', sans-serif; font-weight:400; font-size:1rem; line-height:1.3rem; margin:5px 0px; padding:5px 0px; width:calc(100% - 0px); text-align:center;} .dec-modal.modal-dialog .modal-content .modal-body .box-con.dec-overflow-h { overflow:hidden;} .dec-modal.modal-dialog .modal-content .modal-body .box-con p { color:#666666; font-size:1rem; font-weight:400; line-height:1.3rem; margin:0px; padding:5px 0px 0px 0px; border:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con p .dec-type { color:#f7931e;} .dec-modal.modal-dialog .modal-content .modal-body .box-con p .dec-type-01 { color:#e73828;} .dec-modal.modal-dialog .modal-content .modal-body .box-con p.dec-type-01 { color:#e73828; font-size:1rem; font-weight:400; line-height:1.3rem; margin:0px; padding:5px 0px 0px 0px; border:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con p.dec-type-indent { color:#999999; font-size:1rem; font-weight:400; line-height:1.5rem; margin:0px; padding:5px 0px 0px 30px; border:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-note-01 { width:calc(100% - 0px); color:#e73828; font-size:0.9rem; line-height:1.2rem; margin:0px; padding:5px 0px 0px 0px; text-align:center;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-note-02 { width:calc(100% - 0px); color:#afafaf; font-size:0.9rem; line-height:1.2rem; margin:0px; padding:5px 0px 0px 0px; text-align:left;} /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-note-list*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-note-list { -ms-flex-direction: column !important; flex-direction: column !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-note-list .dec-subtitle { color:#afafaf; font-size:0.9rem; line-height:1.2rem; margin-top:10px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-note-list .dec-note-02 { width:calc(100% - 0px); color:#afafaf; font-size:0.9rem; line-height:1.2rem; margin:0px; padding:0px; text-align:left;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-note-list .dec-note-02 ul { list-style:none; padding-inline-start:20px; text-indent:-20px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-note-list .dec-note-02 ul li { margin-top:3px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-note-list .dec-note-02 ul li:first-child { margin-top:0px;} /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-note-list*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con .con-type { color:#595959; font-weight:400; font-size:1rem; line-height:1rem; margin:0px; padding:15px 0px 5px 0px; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: end !important; align-items: flex-end !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .con-type.dec-p01 { padding:10px 0px 0px 0px; margin-bottom:10px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-noteArea { width:calc(100% - 0px); margin:5px 0px; padding:10px; background:#ebebeb; background:transparent;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-noteArea p { margin:0px 0px 5px 0px; padding:0px; font-size:1rem; line-height:1.4rem; color:#999999;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-note { width:calc(100% - 0px); margin:5px 0px; padding:0px; font-size:0.9rem; line-height:1.2rem; color:#b3b3b3;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-title { width:calc(100% - 0px); margin:5px 0px; padding:0px; font-size:1.5rem; line-height:2rem; color:#776744;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-subtitle { width:calc(100% - 0px); margin:5px 0px; padding:5px 0px 0px 0px; font-size:1rem; line-height:1.5rem; color:#595959;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-mapArea { width:calc(100% - 0px); height:300px; margin:5px 0px; padding:0px; border:1px solid #b3b3b3; background:#fafafa;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-mapArea.dec-img { background: url("../images/sample/sample_map.png") repeat;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box { width:calc(100% - 0px); height:auto; margin:5px 0px; padding:0px; display:block; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-type { color:#169cbf;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-L { width:70px; margin:0px 5px 0px 0px; padding:0px; text-align:right;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-R { width:calc(100% - 75px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-R.dec-type { color:#169cbf;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-L-01 { width:180px; margin:0px 5px 0px 0px; padding:5px 0px 0px 0px; text-align:right;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-R-01 { width:calc(100% - 185px); margin:0px; padding:5px 0px 0px 0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-R-01 .box-inner-width-whole .form-check { display:inline-block; margin-right:25px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-L-02 { width:135px; margin:0px; padding:0px; text-align:right;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-R-02 { width:calc(100% - 135px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-L-02 a { width:60px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-whole { width:calc(100% - 0px); height:auto; margin:2px 0px; padding:0px; display:block; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .form-control.dec-L { width:calc(50% - 5px); margin:0px 5px 0px 0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .form-control.dec-R { width:calc(50% - 5px); margin:0px 0px 0px 0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-emphasis { margin-right:auto;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-display-column { -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-align: start !important; align-items: start !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-display-column .form-check:nth-child(1) { margin-top:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-display-column .form-check { margin-top:5px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-whole .box-inner-width-date { width:calc(50% - 10px); margin:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-box-whole .box-inner-width-break { width:20px; margin:0px; padding:0px 5px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box a.dec-btn-gray { background:#ebebeb; margin:0px 0px 0px 5px; padding:3px 10px; border-radius:5px; color:#999999; border:1px solid #ced4da; height:33px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box a.dec-btn-gray:hover { color:#169cbf; background:#ebebeb;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box a.dec-btn-clear { background:#f5f5f5; margin:0px 0px 0px 5px; padding:3px 10px; border-radius:5px; color:#999999; border:1px solid #ced4da; height:33px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box a.dec-btn-clear:hover { color:#787878; background:#f0f0f0;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-addStop-con { width:calc(100% - 0px); height:calc(100% - 85px); margin:5px 0px; padding:0px 5px; overflow-x:hidden; overflow-y:auto; background:#fafafa; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: start !important; align-items: start !important; -ms-flex-pack: start !important; justify-content: start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box.dec-addStop-con .form-check { padding:3px 5px 2px 1.25rem;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-type { font-size:1rem; line-height:1.2rem;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-type.dec-c01 { color:#f7931e; line-height:1.5rem;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-width-timeArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: start !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-width-timeArea .dec-box-01 { width:calc(34% - 10px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-width-timeArea .dec-box-02 { width:calc(33% - 10px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-width-timeArea .dec-box-03 { width:calc(33% - 10px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-width-timeArea .dec-box-01 .dec-form-control-01, .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-width-timeArea .dec-box-02 .dec-form-control-01, .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-width-timeArea .dec-box-03 .dec-form-control-01 { text-align: center;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box .dec-width-timeArea .dec-box-type { width:15px; margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .con-btn-noteArea-01 { margin:0px 0px 10px 0px; padding:0px; width:calc(100% - 0px); text-align:left;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .con-btn-noteArea-01 p.dec-type { color:#adadad; font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1rem; line-height:1.3rem; margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .con-btn-noteArea { margin:0px; padding:5px 0px; width:calc(100% - 0px); text-align:center;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .con-btn-noteArea p.dec-type { color:#ed1c24; font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1rem; line-height:1.3rem; margin:5px 0px; padding:5px 0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .con-btn-noteArea p.dec-type-01 { color:#999999; font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1rem; line-height:1.3rem; margin:5px 0px; padding:5px 0px; text-align:left;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .con-btn-noteArea p.dec-type-02 { color:#999999; font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1rem; line-height:1.3rem; margin:0px; padding:0px; text-align:left;} /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con-whole .form-group -----------------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con-whole .form-group label { width:calc(100% - 0px); margin:0px; padding:5px 0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-whole .form-group label .dec-type { margin:0px; padding:0px; width:auto; font-size:1rem; line-height:1.2rem;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-whole .form-group label .dec-note { margin:0px; padding:0px; width:auto; font-size:12px; line-height:1.2rem; color:#b3b3b3;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-whole .form-group select.form-control { height: calc(100% - 30px); overflow-x:hidden; overflow-y:auto; background:#FFFFFF;} /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con-whole .form-group -----------------------------------------------------*/ /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box-formcheck -----------------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box-formcheck { width:calc(100% - 0px); height:auto; margin:2px 0px; padding:0px; display:block; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box-formcheck .form-check { width:calc(100% - 0px); margin:2px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box-formcheck .form-check .dec-w01 { width:calc(100% - 65px);} /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box-formcheck -----------------------------------------------------*/ /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-listArea ------------------------------------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-listArea { width:calc(100% - 0px); margin:5px 0px; padding:0px; word-break:break-all; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; flex-direction: column !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-listArea .box-lisrtItemArea { width:calc(100% - 0px); margin:0px; padding:0px; border-bottom:1px solid #dddddd; font-size:1rem; line-height:1.2rem; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-listArea .box-lisrtItemArea:first-child { border-top: 1px solid #dddddd;} .dec-modal.modal-dialog .modal-content .modal-body .box-listArea .box-lisrtItemArea:nth-child(even) { background:rgba(0, 0, 0, 0.03);} .dec-modal.modal-dialog .modal-content .modal-body .box-listArea .box-lisrtItemArea .box-L { width:100px; margin:0px; padding:8px 5px; font-weight:500;} .dec-modal.modal-dialog .modal-content .modal-body .box-listArea .box-lisrtItemArea .box-R { width:calc(100% - 100px); margin:0px; padding:8px 5px;} /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-listArea ------------------------------------------------------------------------*/ /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend ------------------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend { width:calc(100% - 0px); margin:0px; padding:0px 0px 5px 0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: column !important; flex-direction: column !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart { width:calc(100% - 0px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-imgArea { width:calc(100% - 0px); height:190px; margin:0px; padding:0px; background:url("../images/element/img_carTire.svg"); background-repeat:no-repeat; background-position:center; background-size:contain;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea { width:calc(100% - 0px); margin:0px; padding:25px 0px 2px 0px; border-radius:25px; color:#787878; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-direction: row !important; flex-direction: row !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item { width:calc(25% - 10px); margin:0px; padding:5px; background:#ebebeb; border-radius:5px; border:1px solid #ebebeb; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item:nth-child(2) { width:calc(50% - 0px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item:nth-child(2) .dec-content .dec-sortArea { width:calc(22% - 0px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item:nth-child(2) .dec-content .dec-sortArea:nth-child(1) { width:calc(34% - 0px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-type-conArea { font-size:1.1rem; line-height:2rem; color:#595959; width:calc(100% - 0px); margin:0px; padding:0px 0px 3px 0px; text-align:center;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content { width:calc(100% - 0px); height:calc(100% - 20px); margin:0px; padding:5px 0px; overflow:hidden; font-size:14px; border-top:1px solid #dcdcdc; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea { width:calc(50% - 0px); margin:0px 0px 1px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort { width:18px; height:18px; border:1px solid #999999; border-radius:3px; margin:2px 5px; padding:0px; -ms-flex-pack: center !important; justify-content: center !important; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort.dec-temperature::before { content:"溫"; font-size:12px; line-height:12px; margin:2px; padding:0px; color:#333333;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort.dec-tachometer::before { content:"壓"; font-size:12px; line-height:12px; margin:2px; padding:0px; color:#333333;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort.dec-color-leak { background:#a050a0; background:rgb(160, 80, 160); border:1px solid #a050a0; border:1px solid #333333;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort.dec-color-high { background:#ed1c24; background:rgb(237, 28, 36); border:1px solid #ed1c24; border:1px solid #333333;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort.dec-color-low { background:#0083be; background:rgb(0, 131, 190); border:1px solid #0083be; border:1px solid #333333;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort.dec-color-normal { background:#FFFFFF; background:rgb(255, 255, 255);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort.dec-color-leak::before, .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort.dec-color-high::before, .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort.dec-color-low::before { color:#FFFFFF;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-sort.dec-border-none { border:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-type { font-size:12px; line-height:12px; width:calc(100% - 30px); height:calc(100% - 0px); margin:0px 5px 0px 0px; padding:5px 0px; color:#595959;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend .dec-infoArea .dec-box-item .dec-content .dec-sortArea .dec-type.dec-noData { color:#999999;} /* 1 洩氣(權重最高) #a050a0 (160, 80, 160) dec-color-leak 2 過高 #ed1c24 (237, 28, 36) dec-color-high 3 過低 #0083be (0, 131, 190) dec-color-low 4 正常 #FFFFFF (255, 255, 255) dec-color-normal 無訊號 - - dec-wifi-no 低電量 - - dec-battery-low */ /*註：洩氣(權重最高)|dec-color-leak, 過高|dec-color-high, 過低|dec-color-low, 正常|dec-color-normal*/ /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart-legend ------------------------------------------------------*/ /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box ------------------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box { width:calc(100% - 0px); margin:0px; padding:0px; background:#FFFFFF; border:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box:nth-child(1) { margin:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box.dec-mt01 { margin-top:20px;} /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group --------------------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group { height:70px; margin:0px; padding:0px; border:1px solid #787878; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group.dec-subTitle { height:auto; border:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group.dec-border-01 { border-top:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group.dec-border-02 { border-bottom:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group.dec-L { width:calc(48% - 0px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group.dec-L.dec-w01 { width:calc(36% - 0px); margin-left:calc(12% - 0px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group.dec-R { width:calc(48% - 0px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-box-item { width:calc(25% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; background:#FFFFFF; border:0px; border-left:1px solid #999999;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-box-item-subTitle { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:5px 0px 2px 0px; background:#FFFFFF; border:0px; border-left:0px; font-size:1.1rem; line-height:1.5rem; color:#595959;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-box-item:hover { background:#fcfbe0;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group.dec-L.dec-w01 .dec-box-item { width:calc((100% /3) - 0px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-box-item:nth-child(1) { border-left: 0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-num { width:calc(100% - 0px); height:20px; background:#CCCCCC; padding:1px 5px; margin:0px; border:0px; overflow:hidden; border-bottom:1px solid #787878; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-direction: row !important; flex-direction: row !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-num .dec-type { font-size:14px; line-height:16px; color:#595959; margin:0px; padding:0px; margin-right:auto;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-num .icon-sprite:last-child { margin-left:3px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea { width:calc(100% - 0px); margin:0px 0px 1px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-sort { width:18px; height:18px; border:1px solid #999999; border-radius:3px; margin:2px 5px; padding:0px; -ms-flex-pack: center !important; justify-content: center !important; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-sort.dec-temperature::before { content:"溫"; font-size:12px; line-height:12px; margin:2px; padding:0px; color:#333333;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-sort.dec-tachometer::before { content:"壓"; font-size:12px; line-height:12px; margin:2px; padding:0px; color:#333333;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-sort.dec-color-leak { background:#a050a0; background:rgb(160, 80, 160); border:1px solid #a050a0; border:1px solid #333333;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-sort.dec-color-high { background:#ed1c24; background:rgb(237, 28, 36); border:1px solid #ed1c24; border:1px solid #333333;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-sort.dec-color-low { background:#0083be; background:rgb(0, 131, 190); border:1px solid #0083be; border:1px solid #333333;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-sort.dec-color-normal { background:#FFFFFF; background:rgb(255, 255, 255);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-sort.dec-color-leak::before, .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-sort.dec-color-high::before, .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-sort.dec-color-low::before { color:#FFFFFF;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-type { font-size:12px; line-height:12px; width:calc(100% - 30px); height:calc(100% - 0px); margin:0px 5px 0px 0px; padding:5px 0px; color:#595959;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group .dec-content .dec-sortArea .dec-type.dec-noData { color:#999999;} /* 1 洩氣(權重最高) #a050a0 (160, 80, 160) dec-color-leak 2 過高 #ed1c24 (237, 28, 36) dec-color-high 3 過低 #0083be (0, 131, 190) dec-color-low 4 正常 #FFFFFF (255, 255, 255) dec-color-normal 無訊號 - - dec-wifi-no 低電量 - - dec-battery-low */ /*註：洩氣(權重最高)|dec-color-leak, 過高|dec-color-high, 過低|dec-color-low, 正常|dec-color-normal*/ /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box .box-group --------------------------------------------------------*/ /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con-chart .dec-inner-box ------------------------------------------------------*/ /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 -------------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1.3rem; line-height:1.5rem;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box { width:calc(100% - 0px); height:auto; margin:5px 0px; padding:0px; display:block; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box:first-child { margin-top:15px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box:nth-child(3), .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box:nth-child(4) { margin:0px; line-height:2.2rem;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box .dec-box-L { width:50px; margin:0px 5px 0px 0px; padding:0px; text-align:right;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box .dec-box-R { width:calc(100% - 55px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box .box-selection-area { width:calc(50% - 5px); margin:5px 0px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box .box-selection-area:nth-child(1), .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box .box-selection-area:nth-child(2) { margin-top:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box .box-selection-area .dec-box-inner-L { width:25px; margin:0px 5px 0px 0px; padding:0px; text-align:center; background:#FFFFFF; color:#169cbf; border-radius:50px; border:1px solid #b7b7b7; height:25px; overflow:hidden;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box .box-selection-area .dec-box-inner-R { width:calc(100% - 30px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 .dec-box .dec-form-group { margin:5px 0px 5px 15px;} .carousel-item .dec-img { margin-left:12%; width:76% !important; padding-bottom:30px;} .carousel-control-prev, .carousel-control-next { color:#999999;} .carousel-control-prev:hover, .carousel-control-prev:focus, .carousel-control-next:hover, .carousel-control-next:focus { color:#595959;} .dec-carousel-caption { bottom:0px; padding-bottom:5px; color:#595959;} .dec-carousel-caption h5 { margin-bottom:0px;} /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con-01 -------------------------------------------------*/ /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 -------------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-01, .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-02, .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-03 { margin:0px; padding:5px 0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-01 { width:calc(50% - 35px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-02 { width:calc(50% - 35px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-03 { width:60px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-03 a, .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-03 a:hover { margin:0px; padding:5px 8px; border-radius:5px; border:1px solid #dcdcdc; width:calc(100% - 2px); display:block; text-align:center;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-03 a { background:#fafafa; color:#999999;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-03 a:hover { background:#f0f0f0; color:#169cbf;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-reslutArea { width:calc(100% - 0px); height:calc(100% - 45px); margin:0px; padding:5px; border-top:1px solid #e1e1e1; overflow-x:hidden; overflow-y:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: start !important;justify-content: flex-start !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-reslutArea .box-listItem-con { width:calc(100% - 0px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-reslutArea .box-listItem-con .form-check-inline { width:calc(100% - 0px); padding-left:5px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-reslutArea .box-listItem-con .form-check-inline:hover { background:#fcfbe0;} .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 .box-reslutArea .box-listItem-con .form-check-label { line-height:1.2rem; margin:5px 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: start !important;justify-content: flex-start !important; -ms-flex-direction: column !important; flex-direction: column !important;} /*start - .dec-modal.modal-dialog.dec-video ------------------------------------------------------------------*/ .dec-modal.modal-dialog.dec-video .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-03 a, .dec-modal.modal-dialog.dec-video .modal-content .modal-body .box-con-02 .box-selectionArea .dex-box-03 a:hover { font-size:1.3rem; line-height:2.1rem; height:42px; overflow-y:hidden;} .dec-modal.modal-dialog.dec-video .modal-content .modal-footer .dec-btn-confirm, .dec-modal.modal-dialog.dec-video .modal-content .modal-footer .dec-btn-confirm:hover { font-size:1.3rem; line-height:2.2rem;} .dec-modal.modal-dialog.dec-video .modal-content .modal-body .box-con-02 .box-reslutArea .box-listItem-con .form-check-label { font-size:1.3rem; line-height:2.1rem; width:calc(100% - 10px); margin-top:0px; margin-bottom:0px; padding-top:5px; padding-bottom:5px;} /*end - .dec-modal.modal-dialog.dec-video ------------------------------------------------------------------*/ /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con-02 -------------------------------------------------*/ /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con-03 -------------------------------------------------*/ .dec-modal.modal-dialog.dec-video .modal-content .modal-body .box-con-03 { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1.3rem; line-height:1.5rem; color:#595959;} .dec-modal.modal-dialog.dec-video .modal-content .modal-body .box-con-03 .dec-box { width:calc(100% - 0px); height:auto; margin:0px; padding:5px 0px; border-top:1px solid #e1e1e1; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog.dec-video .modal-content .modal-body .box-con-03 .dec-box:first-child { margin-top:15px; border:0px;} .dec-modal.modal-dialog.dec-video .modal-content .modal-body .box-con-03 .dec-box .dec-box-L { width:80px; margin:0px 10px 0px 0px; padding:0px; text-align:right; font-size:1.3rem; line-height:1.5rem;} .dec-modal.modal-dialog.dec-video .modal-content .modal-body .box-con-03 .dec-box .dec-box-R { width:calc(100% - 90px); margin:0px; padding:0px; font-size:1.3rem; line-height:1.7rem; color:#1591BC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con-03 -------------------------------------------------*/ /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-RoadM-NavRoad-List-InstructionsArea*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-RoadM-NavRoad-List-InstructionsArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-RoadM-NavRoad-List-InstructionsArea .box-L { width:calc(50% - 5px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-RoadM-NavRoad-List-InstructionsArea .box-R { width:calc(50% - 5px); margin:30px 0px 0px 10px; padding:0px;} /*start - .box-RoadM-NavRoad-List-InstructionsArea --------------------------------------------------------------------------------------------------------------------------------------------*/ /*start - .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox -------------------------------------------------------------------------------------*/ .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox { width:calc(100% - 0px); height:calc(100% - 0px); overflow:hidden; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox .con-routeWeightItem { width:45px; height:21px; margin:0px; padding:0px; text-align:center; background:#CCCCCC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox .con-routeWeightItem.dec-color-routeWeightItem-drive { background:#29abe2;} .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox .con-routeWeightItem.dec-color-routeWeightItem-unable { background:#ef5b5b;} .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox .con-routeWeightItem.dec-color-routeWeightItem-notSet { background:#CCCCCC;} .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox .dec-type { width:calc(100% - 50px); font-size:1rem; line-height:1.2rem; margin:0px 0px 5px 5px; padding:5px 0px 0px 0px; color:#595959;} .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox .con-routeWeightCautionBox { width:45px; height:21px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox .con-routeWeightCautionBox .con-routeWeightCautionBoxItem { width:18px; height:18px; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox .con-routeWeightCautionBox .con-routeWeightCautionBoxItem .icon-sprite {} /*end - .box-RoadM-NavRoad-List-InstructionsArea .box-R .con-routeWeightBox -------------------------------------------------------------------------------------*/ /*start - .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem -----------------------------------------------*/ .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem { width:calc(100% - 0px); margin:0px; padding:0px 5px 0px 5px; background:transparent; border-bottom:1px solid #ebebeb; color:#595959; border-left:1px solid #ebebeb; border-right:1px solid #ebebeb; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem:nth-child(odd), .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem:nth-child(odd):hover { background:#f2f2f2;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem:first-child { border-top:1px solid #ebebeb;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem .conBthArea { margin:0px; padding:0px; width:40px; height:40px; overflow:hidden;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea, .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea:hover { margin:0px; padding:0px; color:#595959; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea.dec-w02a { width:calc(100% - 0px); margin-right:auto;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-Top { width:calc(100% - 0px); margin:0px; padding:5px 0px; font-size:1rem; line-height:1.5rem; color:#595959;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea { width:calc(100% - 0px); height:26px; margin:0px; padding:0px 0px 5px 0px; font-size:12px; line-height:1.2rem; color:#999999; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox { width:calc(100% - 22px); height:calc(100% - 0px); overflow:hidden; margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: center !important; align-items: center !important;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightCautionBox { width:18px; height:18px; margin:0px; padding:0px;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox .con-routeWeightItem { width:calc(20% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; text-align:center; background:#CCCCCC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox .con-routeWeightItem.dec-color-routeWeightItem-drive { background:#29abe2;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox .con-routeWeightItem.dec-color-routeWeightItem-unable { background:#ef5b5b;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox .con-routeWeightItem.dec-color-routeWeightItem-notSet { background:#CCCCCC;} .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem a.conArea .con-routeWeightArea .con-routeWeightBox .con-routeWeightItem .dec-type { font-size:1rem; line-height:1.5rem; margin:0px; padding:0px; color:#FFFFFF;} /*end - .box-RoadM-NavRoad-List-InstructionsArea .box-L .con-NavRoadListArea .box-conArea.dec-NavRoadList-Result .con-listItem -----------------------------------------------*/ /*end - .box-RoadM-NavRoad-List-InstructionsArea --------------------------------------------------------------------------------------------------------------------------------------------*/ /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-RoadM-NavRoad-List-InstructionsArea*/ /*end - .dec-modal -------------------------------------------------------------------------------*/ /*start - .dec-modal.modal-dialog .modal-content .modal-body .dec-noteArea-type ---------------------------------------------------*/ .dec-modal.modal-dialog .modal-content .modal-body p.dec-noteArea-type { color: #ed1c24; font-family: 'Noto Sans TC', sans-serif; font-weight:400; font-size:1rem; line-height:1.3rem; margin:5px 0px; padding:5px 0px; width: calc(100% - 0px); text-align:center;} /*end - ..dec-modal.modal-dialog .modal-content .modal-body .dec-noteArea-type ---------------------------------------------------*/ /*start - .dec-modal.modal-dialog.dec-bulletinModal-Div -------------------------------------------------------------------------------*/ .modal-backdrop.modal-backdrop-bulletinModal {} /*start - .dec-modal.modal-dialog.dec-bulletinModal -------------------------------------------------------------------------------*/ /*start - .dec-modal.modal-dialog.dec-bulletinModal -------------------------------------------------------------------------------*/ .modal.dec-bulletinModal { height:calc(100% - 50px); overflow:hidden; margin:0px; padding:0px; top:50px;} .modal.dec-bulletinModal .dec-modal.modal-dialog .modal-content .modal-header { border-radius:0px;} .modal.dec-bulletinModal .dec-modal.modal-dialog.dec-bulletinModal { width:calc(100% - 0px); max-width:calc(100% - 0px); min-width:calc(100% - 0px); height:calc(100% - 0px); margin:0px auto; padding:0px; top:0px;} .modal.dec-bulletinModal .dec-modal.modal-dialog.dec-bulletinModal .modal-content { width:calc(100% - 0px); height:calc(100% - 0px); margin-left:0px; border-radius:0px;} .modal.dec-bulletinModal .dec-modal.modal-dialog.dec-bulletinModal .modal-content .modal-body {} /*end - .dec-modal.modal-dialog.dec-bulletinModal -------------------------------------------------------------------------------*/ /*start - .dec-modal.modal-dialog.dec-bulletinModal-Detail -------------------------------------------------------------------------------*/ .modal.dec-bulletinModal .dec-modal.modal-dialog.dec-bulletinModal-Detail { width:calc(100% - 0px); max-width:calc(100% - 0px); min-width:calc(100% - 0px); height:calc(100% - 0px); margin:0px auto; padding:0px; top:0px; background:rgba(0,0,0,0.5);} .modal.dec-bulletinModal .dec-modal.modal-dialog.dec-bulletinModal-Detail .modal-content { width:calc(70% - 0px); height:calc(70% - 0px); margin:0px auto;} .modal.dec-bulletinModal .dec-modal.modal-dialog.dec-bulletinModal-Detail .modal-content .modal-body {} .modal.dec-bulletinModal .dec-modal.modal-dialog .modal-content .modal-footer .dec-w02.dec-mAuto, .dec-modal.modal-dialog .modal-content .modal-footer .dec-w02.dec-mAuto:hover { margin:auto;} /*end - .dec-modal.modal-dialog.dec-bulletinModal-Detail -------------------------------------------------------------------------------*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 -------------------------------------------------------------------------------------------------------*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 {} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-width-01 { max-width:800px; max-width:calc(80% - 0px);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-width-02 { max-width:calc(90% - 0px);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-width-03 { max-width:400px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-width-05 { max-width:calc(85% - 0px); max-width:950px; height:auto;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-width-07 { max-width:calc(50% - 0px);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .table.table-hover.dec-table { height:auto;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .table.table-hover.dec-table.dec-fixedHeight { height:calc(100% - 0px);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td a.dec-btn-01, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td a.dec-btn-01:hover { color:#595959; border:1px solid #dcdcdc; display:inline-block; text-decoration:none !important; background:transparent; padding:2px 5px !important; border-radius:5px; margin:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td a.dec-btn-01:hover { color:#169cbf; border:1px solid #d2d2d2; background:#fafafa;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td a.dec-btn-02, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td a.dec-btn-02:hover { color:#595959; border:1px solid transparent; display:inline-block; text-decoration:none !important; background:transparent; padding:0px 2px !important; border-radius:2px; margin:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td a.dec-btn-02:hover { color:#169cbf; border:1px solid #d2d2d2; background:#FFFFFF;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table th { border-bottom:0px solid #dee2e6;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td { border-top:0px solid #dee2e6;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow .dec-table th { border-bottom:2px solid #dee2e6;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow .dec-table td { border-top:1px solid #dee2e6;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table th.dec-border-01, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td.dec-border-01 { border-left:1px solid #dee2e6;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table th.dec-border-02, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td.dec-border-02 { border-right:1px solid #dee2e6;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table th.dec-border-03, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td.dec-border-03 { border-left:1px solid #dee2e6; border-right:1px solid #dee2e6;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-table td .dec-img { width:calc(100% - 0px); margin:0px; padding:0px;} /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow { width:calc(100% - 0px); height:calc(100% - 205px); overflow:hidden; padding:0px; margin:10px 0px 0px 0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow .table-responsive.dec-table.dec-fixedTableHeader thead { display:block; height:30px; overflow:hidden;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow .table-responsive.dec-table.dec-fixedTableHeader tbody { display:block; height:calc(100% - 30px); overflow-x:hidden; overflow-y:auto;} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-h-01*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-h-01 { width:calc(100% - 0px); height:calc(100% - 0px); overflow:hidden; padding:0px; margin:10px 0px 0px 0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-h-01 .table-responsive.dec-table.dec-fixedTableHeader thead { display:block; height:30px; overflow:hidden;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-h-01 .table-responsive.dec-table.dec-fixedTableHeader tbody { display:block; height:calc(100% - 30px); overflow-x:hidden; overflow-y:auto;} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow.dec-header-01*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow.dec-header-01 { width:calc(100% - 0px); height:calc(100% - 240px); overflow:hidden; padding:0px; margin:10px 0px 0px 0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow.dec-header-01 .table-responsive.dec-table.dec-fixedTableHeader thead { display:block; height:50px; overflow:hidden;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow.dec-header-01 .table-responsive.dec-table.dec-fixedTableHeader tbody { display:block; height:calc(100% - 50px); overflow-x:hidden; overflow-y:auto;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow.dec-header-01 .bottom-table-area-a01.table-responsive-a01 thead tr th { line-height:1.1rem; vertical-align:bottom !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow.dec-header-01 .bottom-table-area-a01.table-responsive-a01 tbody {} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea-tableInfo.dec-overflow.dec-header-01*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-dangerousDriving .dec-conArea-tableInfo.dec-overflow*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-dangerousDriving .dec-conArea-tableInfo.dec-overflow { width:calc(100% - 0px); height:calc(100% - 230px); overflow:hidden; padding:0px; margin:10px 0px 0px 0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-dangerousDriving .dec-conArea-tableInfo.dec-overflow.dec-height-withoutChart { height:calc(100% - 150px);} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-dangerousDriving .dec-conArea-tableInfo.dec-overflow*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo { width:auto; padding:0px; margin:0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-align: center !important; align-items: center !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo { width:10px; height: 16px; margin:0px 3px 0px 0px; padding:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-c01 { background:#ff0000; background:rgba(255, 0, 0, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-c02 { background:#f7931e; background:rgba(247, 147, 30, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-c03 { background:#787878; background:rgba(120, 120, 120, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-c04 { background:#0089ff; background:rgba(0, 137, 255, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .dec-type { width:auto; margin:0px 10px 0px 0px; padding:0px;} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo { width:auto; padding:0px; margin:0px; background:transparent; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-align: center !important; align-items: center !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo { width:10px; height:16px; margin:0px 3px 0px 0px; padding:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-coldChain-01 { background:#ff0000; background:rgba(255, 0, 0, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-coldChain-02 { background:#578bff; background:rgba(87, 139, 255, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .dec-type { width:auto; margin:0px 10px 0px 0px; padding:0px;} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo*/ /* [統計分析｜冷鏈圖表] 1.異常｜#ff0000｜(255, 0, 0)｜dec-coldChain-01 2.正常｜#578bff｜(87, 139, 255)｜dec-coldChain-04 */ /*[統計分析｜冷鏈圖表]：異常 dec-coldChain-01、正常 dec-coldChain-02*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-01 { background:#ff0000; background:rgba(255, 0, 0, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-02 { background:#f7931e; background:rgba(247, 147, 30, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-03 { background:#f4e200; background:rgba(244, 226, 0, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-04 { background:#578bff; background:rgba(87, 139, 255, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-05 { background:#787878; background:rgba(120, 120, 120, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-06 { background:#b3b3b3; background:rgba(179, 179, 179, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-07 { background:#39b54a; background:rgba(57, 181, 74, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-08 { background:#e8528d; background:rgba(232, 82, 147, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .con-legendInfo.dec-dangerousDriving-09 { background:#a050a0; background:rgba(160, 80, 160, 1);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo .dec-type { width:auto; margin:0px 10px 0px 0px; padding:0px;} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-box-legendInfo*/ /**/ /*[統計分析｜危險駕駛統計] 1.超速(次)｜#ff0000｜(255, 0, 0)｜dec-dangerousDriving-01 2.急加速(次)｜#f7931e｜(247, 147, 30)｜dec-dangerousDriving-02 3.急減速(次)｜#f4e200｜(244, 226, 0)｜dec-dangerousDriving-03 4.急轉彎(次)｜#578bff｜(87, 139, 255)｜dec-dangerousDriving-04 5.車道偏移｜#787878｜(120, 120, 120)｜dec-dangerousDriving-05 6.前車碰撞｜#b3b3b3｜(179, 179, 179)｜dec-dangerousDriving-06 7.行人碰撞｜#39b54a｜(57, 181, 74)｜dec-dangerousDriving-07 8.瞌睡｜#e8528d｜(232, 82, 147)｜dec-dangerousDriving-08 9.分心｜#a050a0｜(160, 80, 160)｜dec-dangerousDriving-09 [統計分析｜危險駕駛統計]：超速(次) dec-dangerousDriving-01、急加速(次) dec-dangerousDriving-02、急減速(次) dec-dangerousDriving-03、急轉彎(次) dec-dangerousDriving-04、車道偏移 dec-dangerousDriving-05、前車碰撞 dec-dangerousDriving-06、行人碰撞 dec-dangerousDriving-07、瞌睡 dec-dangerousDriving-08、分心 dec-dangerousDriving-09 */ /*start - .box-statistics-SpeedChart-Info.dec-DangerousDriving*/ .box-statistics-SpeedChart-Info.dec-DangerousDriving { margin:10px 0px; padding:8px 5px 15px 5px; width:calc(100% - 0px); border-radius:5px; background:#f5f5f5; overflow-x:auto; overflow-y:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .box-statistics-SpeedChart-Info.dec-DangerousDriving .con-swiperSlide-area { margin:5px 0px; padding:0px; width:calc(100% - 0px); display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .box-statistics-SpeedChart-Info.dec-DangerousDriving .con-swiperSlide-area .nav-swiperSlide { width:calc(93% - 0px);} .box-statistics-SpeedChart-Info.dec-DangerousDriving .box-item { margin:0px; padding:0px 5px; border-left:5px solid #CCCCCC; min-width:calc((100%/8) - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} /*end - .box-statistics-SpeedChart-Info.dec-DangerousDriving*/ /*start - .box-statistics-SpeedChart-Info*/ .box-statistics-SpeedChart-Info { margin:10px 0px; padding:8px 5px; width:calc(100% - 0px); border-radius:5px; background:#f5f5f5; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .box-statistics-SpeedChart-Info .box-item { margin:0px; padding:0px 15px 0px 5px; border-left:5px solid #dee2e6; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important;} .box-statistics-SpeedChart-Info .box-item:first-child { padding:0px 5px;} .box-statistics-SpeedChart-Info .box-item .dec-type-01 { font-size:1.2rem; line-height:1.5rem; font-weight:500; margin:0px; padding:0px; color:#595959;} .box-statistics-SpeedChart-Info .box-item .dec-type-02 { font-size:12px; line-height:1.2rem; font-weight:400; margin:0px; padding:0px; color:#adadad;} .box-statistics-SpeedChart-Info .box-item .dec-box-01 { width:150px;} /*end - .box-statistics-SpeedChart-Info*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox:first-child { margin-top:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-01, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-02, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-03, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-04, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-note { -ms-flex-item-align: center !important; align-self: center !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-01 { width:calc(20% - 5px); margin-right:5px; padding:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-02 { width:auto; margin-right:5px; padding:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-02 a { margin:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-03 { width:auto; margin-right:5px; margin-left:auto; padding:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-03 .dec-note { color:#72bf44; font-weight:normal; margin-left:5px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-03 .dec-type-num { color:#f7931e; margin:0px 2px 0px 0px; padding:0px; display:inline-block;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-04 { margin-right: 0px; padding:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-04.dec-m01 { margin-left:auto; margin-top:5px; margin-bottom:5px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-04 a .dec-type { margin:0px; font-size:1rem; padding:3px 2px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-box-note { width:auto; margin-left:5px; padding:0px; color:#72bf44; font-size:12px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-btn.dec-other, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-btn.dec-other:hover { margin:0px; padding:3px 10px; border-radius:25px; text-decoration:none; color:#595959; border:1px solid #CCCCCC;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-btn.dec-other { background:#FFFFFF;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox .dec-btn.dec-other:hover { background:#f5f5f5;} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-conBox*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-listArea*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-listArea { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow-x:auto; overflow-y:hidden;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-listArea .dec-conArea { margin:0px; padding:0px 20px 0px 0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-listArea .dec-conArea.dec-listTitle { height:35px; margin:0px; padding:0px; overflow:hidden; font-weight:bold; font-size:1rem; line-height:1.5rem; border-bottom:1px solid #CCCCCC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-listArea .dec-conArea.dec-listCon { height:calc(100% - 35px); margin:0px; padding:0px; font-weight:normal; font-size:1rem; line-height:1.2rem; vertical-align:top; text-align:left; overflow-x:hidden; overflow-y:auto; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: column !important; flex-direction: column !important; -ms-flex-pack: start !important; justify-content: flex-start !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-listArea .dec-conArea.dec-listCon .dec-itemArea { margin:0px; padding:8px 0px; border-top:1px solid #CCCCCC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-listArea .dec-conArea.dec-listCon .dec-itemArea:nth-child(1) { border-top:0px;} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .con-listArea*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box { margin:0px; padding:0px 5px 0px 0px; word-break:break-all;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(1) { min-width:100px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(2) { min-width:100px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(3) { min-width:150px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(4) { min-width:100px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(5) { min-width:100px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(6) { min-width:110px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(7) { min-width:110px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(8) { min-width:110px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(9) { min-width:125px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(10) { min-width:125px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box:nth-child(11) { min-width:60px; padding:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea a.dec-table-btn, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea a.dec-table-btn:hover { text-decoration:none; margin:0px 5px 0px 0px; padding:5px; border:1px solid #d2d5d8; border-radius:5px; width:33.5px; height:33.5px; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea a.dec-table-btn { color:#adadad; background:#fafafa;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea a.dec-table-btn:hover { color:#29aecc; background:#FFFFFF;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea a.dec-table-btn.dec-delete {} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea a.dec-table-btn.dec-delete:hover { color:#ed1c24;} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .dec-conArea .dec-box*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content --------------------------------------------------------------------------------*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content { background:#FFFFFF; border:1px solid #484848; height:calc(100% - 0px);} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content .modal-body .box-con { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px 5px 0px 0px; overflow:hidden;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content .modal-body .box-con.dec-01 { margin:0px; padding:0px 20px 0px 0px; overflow-x:hidden; overflow-y:auto;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content .modal-body .box-con .dec-box-chartArea { width:calc(100% - 0px); height:calc(100% - 35px); margin:0px; padding:0px; overflow-x:hidden; overflow-y:auto;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content .modal-body .box-con .dec-box-chartArea .dec-img { width:calc(100% - 0px); height:auto; margin:5px 0px 0px 0px; padding:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content .modal-body .box-con .dec-img-sketch { margin:0px; margin:auto; padding:0px; text-align:center; max-width:calc(100% - 0px); display:block;} /*start - 監控圖台/NavLeft/多點路順規劃/01.配送路線規劃/路線表/新增配送地點(右側模式可調整寬度)*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-RoutePlan-Delivery-Table-AddSpot .modal-content .modal-body .box-con { height:auto;} /*end - 監控圖台/NavLeft/多點路順規劃/01.配送路線規劃/路線表/新增配送地點(右側模式可調整寬度)*/ /*start - .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-WineTestPhotoArea --------------------*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-WineTestPhotoArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; align-items: flex-start !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-WineTestPhotoArea .box-photo { width:511px; margin:0px; padding:0px 0px 0px 10px; border:0px; border-left:1px solid #e1e1e1; width:calc(65% - 0px);} .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-WineTestPhotoArea .box-photo img.dec-img { width:calc(100% - 0px); max-width:calc(100% - 0px); margin:0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-WineTestPhotoArea .box-type { width:calc(100% - 511px); margin:0px; padding:10px; width:calc(35% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; flex-direction: column !important; align-items: flex-start !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-WineTestPhotoArea .box-type p { margin:0px; padding:20px 0px 0px 0px; font-size:1.2rem; line-height:1.5rem; color:#595959;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-WineTestPhotoArea .box-type p .dec-type-title { font-size:1.2rem; line-height:1.5rem; color:#595959; font-weight:500;} /*end - .dec-modal.modal-dialog .modal-content .modal-body .box-con .box-WineTestPhotoArea --------------------*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content .modal-body .box-con.dec-Mission-Detail-FillIn --------------------*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content .modal-body .box-con.dec-Mission-Detail-FillIn { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .box-con.dec-Mission-Detail-FillIn .dec-box-item { width:calc(100% - 0px); margin:0px 0px 5px 0px; padding:0px; border:1px solid #e1e1e1; border-radius:5px; background:#fafafa; overflow:hidden; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: justify !important; justify-content: space-between !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-con.dec-Mission-Detail-FillIn .dec-box-item:hover { background:#fcfcfc;} .box-con.dec-Mission-Detail-FillIn .dec-box-item:first-child { } /*start - .box-con.dec-Mission-Detail-FillIn .dec-box-item .dec-box-list*/ .box-con.dec-Mission-Detail-FillIn .dec-box-item .dec-box-list { width:calc(100% - 0px); margin:0px; padding:0px 0px 0px 5px; background:#fafafa; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .box-con.dec-Mission-Detail-FillIn .dec-box-item .dec-box-list:first-child { margin:0px;} .box-con.dec-Mission-Detail-FillIn .dec-box-item .dec-box-list .dec-L { width:80px; text-align: right;} .box-con.dec-Mission-Detail-FillIn .dec-box-item .dec-box-list .dec-R { width:calc(100% - 80px); margin:0px; padding:5px 0px; color:#169cbf;} .box-con.dec-Mission-Detail-FillIn .dec-box-item .dec-box-list .dec-L-01 { width:80px; text-align: right;} .box-con.dec-Mission-Detail-FillIn .dec-box-item .dec-box-list .dec-R-01 { width:calc(50% - 80px); margin:0px; padding:5px 0px; color:#169cbf;} .box-con.dec-Mission-Detail-FillIn .dec-box-item .dec-box-list .dec-L-02 { width:80px; text-align: right; margin:0px; padding:5px 0px;} .box-con.dec-Mission-Detail-FillIn .dec-box-item .dec-box-list .dec-R-02 { width:calc(50% - 80px); margin:0px; padding:5px 0px;} /*end - .box-con.dec-Mission-Detail-FillIn .dec-box-item .dec-box-list*/ /*start - .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail*/ .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail { width:calc(100% - 0px); margin:0px; padding:0px 20px 0px 5px; height:calc(100% - 215px); overflow-x:hidden; overflow-y:auto; font-size:1rem; line-height:1.5rem; color:#595959; -ms-flex-wrap: wrap !important; flex-wrap: wrap !important;} .dec-modal.modal-dialog .modal-content .modal-body .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail .dec-title { font-weight:500; width:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px; border-top:1px solid #e1e1e1; font-size:1.2rem; color:#595959;} .dec-modal.modal-dialog .modal-content .modal-body .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail .dec-title:first-child { border-top:0px;} .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail .dec-title-sub { font-weight:400; width:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px;} .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail .dec-con { font-weight:400; width:calc(100% - 0px); margin:0px; padding: 5px 0px;} .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail .dec-contentBox { width:calc(100% - 0px); margin:5px 0px 0px 0px; padding:0px 0px 10px 0px; border-radius:0px; border-radius:5px; padding-left:5px; background: #f5f5f5;} .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail .dec-box-list { width:calc(100% - 15px); margin:0px 0px 0px 15px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-align: start !important; align-items: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail .dec-box-list .dec-L { width:75px; margin:0px; padding:5px 0px; text-align:right; color:#787878; line-height:1.2rem;} .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail .dec-box-list .dec-L::after { content:"：";} .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail .dec-box-list .dec-R { width:calc(100% - 75px); margin:0px; padding:5px 0px; color:#169cbf; line-height:1.2rem;} .dec-modal.modal-dialog .modal-content .modal-body .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail .dec-note { width:calc(100% - 0px); margin:10px 0px 0px 0px; padding:5px 0px; color:#CCCCCC; text-align:center; font-size:1rem;} /*end - .box-con.dec-Mission-Detail-FillIn .dec-box-itemDetail*/ /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content .modal-body .box-con.dec-Mission-Detail-FillIn --------------------*/ /*start - .modal-body .box-con .dec-box-selection-01*/ .modal-body .box-con .dec-box-selection-01 { width:calc(100% - 0px); height:45px; height:auto; margin:0px 0px 5px 0px; padding:0px; overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .modal-body .box-con .dec-box-selection-01 .dec-type { width: 80px; margin:0px 5px; padding:5px 0px;} .modal-body .box-con .dec-box-selection-01 .con-functionbox { margin:0px; padding:5px 0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .modal-body .box-con .dec-box-selection-01 .con-functionbox .form-check { width: 60px;} .modal-body .box-con .dec-box-selection-01 .dec-noteArea { width: calc(100% - 200px); margin:0px; padding:5px 0px 5px 20px; font-size:14px; color:#b4b4b4; text-align:right;} /*end - .modal-body .box-con .dec-box-selection-01*/ /*start - .modal-body .box-con .dec-box-selection-02*/ .modal-body .box-con .dec-box-selection-02 { width:calc(100% - 0px); height:45px; height:auto; margin:0px 0px 5px 0px; padding:0px; overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .modal-body .box-con .dec-box-selection-02 .dec-type { width:80px; margin:0px 5px; padding:5px 0px;} .modal-body .box-con .dec-box-selection-02 .con-functionbox { margin:0px; padding:5px 0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: start !important; justify-content: flex-start !important; -ms-flex-direction: row !important; flex-direction: row !important;} .modal-body .box-con .dec-box-selection-02 .con-functionbox .form-check { width:auto; margin-right:15px;} .modal-body .box-con .dec-box-selection-02 .dec-noteArea { width: calc(100% - 200px); margin:0px; padding:5px 0px 5px 20px; font-size:14px; color:#b4b4b4; text-align:right;} /*end - .modal-body .box-con .dec-box-selection-02*/ /*start - .modal-body .box-con .dec-box-MissionFillIn*/ .modal-body .box-con .dec-box-MissionFillIn { width:calc(100% - 0px); margin:0px; padding:10px 0px 0px 0px; border-top:1px solid #CCCCCC;} .modal-body .box-con .dec-box-MissionFillIn .dec-type { font-size:1rem; line-height:1.2rem; color:#595959; margin:0px; padding:5px;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea.dec-titleArea { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea.dec-titleArea .dec-type { margin:0px 0px 0px 5px; padding:5px 0px; width:80px;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea.dec-titleArea .dec-note { margin:0px 5px 0px 0px; margin-left:auto; padding:5px 0px; font-size:14px; color:#b4b4b4; width:calc(100% - 200px); text-align:right;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea.dec-titleArea a.dec-btn, .modal-body .box-con .dec-box-MissionFillIn .dec-listArea.dec-titleArea a.dec-btn:hover{ margin:0px; padding:5px 0px; border:0px; width:80px;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea { width:calc(100% - 0px); margin:0px; padding:5px 0px 5px 5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea:hover { background:#fcfbe0;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea.dec-titleArea:hover { background:transparent;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea .con-conbox { width:calc(100% - 85px); margin:0px; padding:0px;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea .con-conbox .dec-type { color:#999999;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea .con-btnbox { width:80px; width:80px !important; margin:0px; margin-left: 5px; padding:0px;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea .con-btnbox a.dec-btn { width:calc(100% - 0px); border:1px solid #ced4da; height:33.5px; background:#ebebeb; margin:0px; padding:3px 5px; border-radius:5px; color:#999999;} .modal-body .box-con .dec-box-MissionFillIn .dec-listArea .con-btnbox a.dec-btn:hover { color:#169cbf; background:#ebebeb;} .modal-body .box-con .dec-box-MissionFillIn .dec-noteArea { width:calc(100% - 0px); margin:0px; padding:0px; font-size:1rem; color:#f23300; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} /*end - .modal-body .box-con .dec-box-MissionFillIn*/ /*start - .modal-body .box-con .dec-box-MissionFillInSampleM*/ .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box-MissionFillInSampleM.dec-title { width:calc(100% - 20px); font-size:1rem; line-height:1.2rem; height:35px; overflow:hidden; color:#595959; border-bottom:1px solid #CCCCCC; margin:0px 20px 0px 0px; padding:0px;} .dec-modal.modal-dialog .modal-content .modal-body .box-con .dec-box-MissionFillInSampleM.dec-con { width:calc(100% - 0px); height:calc(100% - 45px); font-size:1rem; color:#595959; margin:0px; padding:0px 20px 0px 0px; overflow-x:hidden; overflow-y:auto;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea.dec-titleArea { width:calc(100% - 0px); margin:0px; padding:0px; border:0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea { width: calc(100% - 0px); margin:0px; padding:5px 0px; border-top:1px solid #CCCCCC; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea:nth-child(1) { margin:0px; padding:5px 0px; border:0px;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea .dec-listItem { margin:0px 0px 0px 25px; padding: 0px; text-align:center;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea .dec-listItem:nth-child(1) { width:calc(100% - 240px);} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea .dec-listItem:nth-child(2) { width:100px;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea .dec-listItem:nth-child(3) { width:100px;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea .dec-listItem:nth-child(4) { width:60px;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea.dec-titleArea .dec-listItem:nth-child(1) { text-align:left;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea.dec-btnArea { -ms-flex-pack: justify !important; justify-content: space-between !important;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea.dec-btnArea .dec-btn { width:150px; margin:0px 0px 0px 13px; padding:0px;} .modal-body .box-con .dec-box-MissionFillInSampleM .dec-listArea.dec-btnArea .dec-note { margin:0px; padding:0px; font-size:14px; color:#b4b4b4; text-align:right;} /*end - .modal-body .box-con .dec-box-MissionFillInSampleM*/ .modal-body .box-con .dec-box-selection { width:calc(100% - 0px); height:45px; margin:0px; padding:0px; overflow:hidden; display: -ms-flexbox !important; display: flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content .dec-conArea-note { width:calc(100% - 0px); margin:15px 0px; padding:0px; text-align:center; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-item-align: center !important; align-self: center !important; -ms-flex-pack: center !important; justify-content: center !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content .dec-conArea-note .dec-type { color:#BDBDBD; font-size:1rem; line-height:1.5rem; margin:0px 5px; padding:0px;} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-content --------------------------------------------------------------------------------*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .dec-box-selection a.dec-btn, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .dec-box-selection a.dec-btn:hover { background:#ebebeb; margin:0px 0px 0px 5px; padding:3px 10px; border-radius:25px; border-radius:5px; border:1px solid #ced4da; height:35.5px; width:80px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .dec-box-selection a.dec-btn { color:#999999;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .dec-box-selection a.dec-btn:hover { color:#169cbf;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .input-group { margin:0px; padding:0px; border-radius:0.25rem; background:#eff1f3; border:1px solid #ced4da} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .input-group > .form-control:not(:last-child), .input-group > .custom-select:not(:last-child) { border-radius:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .input-group .form-control { border:0px; background:#eff1f3; padding-left:10px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .input-group .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color:#cacdd1; opacity:1; /* Firefox */} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .input-group .form-control:-ms- .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .input-group .form-control::-ms-input-placeholder { /* Microsoft Edge */ color:#d8dbdf;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .input-group .btn { color:#81868b;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox { width:calc(100% - 0px); height:calc(100% - 50px); margin:5px 0px 0px 0px; padding:0px; overflow:hidden;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-conArea-con { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px; overflow:hidden;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-conArea-con .box-con-whole.dec-padding { width:calc(100% - 0px); height:35px; overflow:hidden; margin:0px; padding:5px 0px 0px 10px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-conArea-con .box-con-whole-note { width:calc(100% - 0px); height:35px; overflow:hidden; margin:0px; padding:5px 0px 0px 5px; color: #BDBDBD; font-size: 1rem; line-height:1.1rem;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-conArea-con .box-selection { width:calc(100% - 0px); height:calc(100% - 35px); margin:0px; padding:0px 5px 0px 10px; padding:0px 5px 0px; border-top:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6; overflow-x:hidden; overflow-y:auto; background:#fafafa;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-conArea-con .box-selection.dec-withoutSeletAll { width:calc(100% - 0px); height:calc(100% - 0px); margin:0px; padding:0px 5px 0px 10px; padding:0px; border-top:1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; overflow-x:hidden; overflow-y:auto; background:#fafafa;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-conArea-con .box-selection .form-check { width:calc(100% - 0px); padding-top:5px; padding-top:0px; padding-bottom:0px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-conArea-con .box-selection .form-check:hover { background:#f0f0f0;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con-whole .form-group label { width:calc(100% - 0px); margin:0px; padding:5px 0px; padding:0px; display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con-whole .form-group label .dec-type { margin:0px; padding:0px; width:auto; font-size:1rem; line-height:1.2rem;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con-whole .form-group label .dec-note { margin:0px; padding:0px; width:auto; font-size:12px; line-height:1.2rem; color:#b3b3b3;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con-whole .form-group select.form-control { height:calc(100% - 30px); overflow-x:hidden; overflow-y:auto;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-selection .form-check { padding-left:25px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-selection .form-check .form-check-input { margin-left:-15px; margin-top:8px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-selection .form-check .form-check-input.dec-form-check-input { margin-left:-15px; margin-top:18px;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body .box-con .box-conArea-outerBox .box-selection .form-check .form-check-label { margin-left:5px; padding-top:5px; padding-bottom:5px; width:calc(100% - 5px);} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 .modal-body*/ /*start - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-selection-driver*/ .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-selection-driver .modal-body .box-con .box-conArea-outerBox .box-selection .form-check .form-check-label { margin-left:5px; width:calc(100% - 5px); display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-selection-driver .modal-body .box-con .box-conArea-outerBox .box-selection .form-check .form-check-label span.dec-type { width:calc(100% - 120px); text-align:left; font-size:1rem; line-height:1.2rem; color:#595959;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-selection-driver .modal-body .box-con .box-conArea-outerBox .box-selection .form-check .form-check-label span.dec-number { width:120px; text-align:right; color:#999999;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-selection-driver .modal-body .box-con .box-conArea-outerBox .box-selection .form-check .form-check-label span.dec-number a, .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-selection-driver .modal-body .box-con .box-conArea-outerBox .box-selection .form-check .form-check-label span.dec-number a:hover { color:#999999; text-decoration: underline !important;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-selection-driver .modal-body .box-con .box-conArea-outerBox .box-selection .form-check .form-check-label span.dec-number a:hover { color:#169cbf;} .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-selection-driver .modal-body .box-con .box-conArea-outerBox .box-selection .form-check .form-check-label span.dec-note { width:120px; text-align:right; color:#50a8b4; font-size:14px; line-height:16px;} /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01.dec-selection-driver*/ /*end - .modal-dialog.modal-dialog-centered.dec-modal.dec-statistics-01 -------------------------------------------------------------------------------------------------------*/ /*start - a.btn-CSS-stylesheets -------------------------------------------*/ a.btn-CSS-stylesheets, a.btn-CSS-stylesheets:hover { border-radius:5px; margin:0px 0px 0px 2px; padding:5px 2px; text-align:center; text-decoration:none; font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:12px; line-height:1rem;} a.btn-CSS-stylesheets.disabled, a.btn-CSS-stylesheets.disabled:hover { color:#999999; background:#333333;} a.btn-CSS-stylesheets { color:#CCCCCC; background:#333333; border:1px solid #595959;} a.btn-CSS-stylesheets:hover, a.btn-CSS-stylesheets.is-active, a.btn-CSS-stylesheets.is-active:hover { color:#FFFFFF; background:#333333; border:1px solid #ebebeb;} /*end - a.btn-CSS-stylesheets -------------------------------------------*/ /*start - a.btn-search -------------------------------------------*/ a.btn-search, a.btn-search:hover { border-radius:5px; margin:5px 0px 0px 0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-search.disabled, a.btn-search.disabled:hover { color:#FFFFFF; background:#CCCCCC;} a.btn-search { color:#FFFFFF; background:#5dc1cf; border:1px solid #29abe2;} a.btn-search:hover { color:#FFFFFF; background:#59b9c1; border:1px solid #54b0b2;} a.btn-search .iconSVG {} a.btn-search .iconSVG.dec-c01 { color:#FFFFFF;} a.btn-search:hover .iconSVG.dec-c01 { color:#FFFFFF;} a.btn-search .dec-type, a.btn-search:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1.1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} /*end - a.btn-search -------------------------------------------*/ /*start - a.btn-version -------------------------------------------*/ a.btn-version, a.btn-version:hover { border-radius:5px; margin:5px 0px 0px 0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-version.disabled, a.btn-version.disabled:hover { color:#FFFFFF; background:transparent;} a.btn-version { color:#adadad; background:#FFFFFF; border:1px solid #e0e0e0;} a.btn-version:hover { color:#59b9c1; background:#FFFFFF; border:1px solid #5dc1cf;} a.btn-version .dec-type, a.btn-version:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1.1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} a.btn-version .dec-ic { color:#adadad;} a.btn-version:hover .dec-ic { color:#59b9c1;} a.btn-version.dec-w01, a.btn-version.dec-w01:hover { width:80px;} /*end - a.btn-version -------------------------------------------*/ /*start - a.btn-search-advance -------------------------------------------*/ a.btn-search-advance, a.btn-search-advance:hover { border-radius:5px; margin:5px 0px 0px 0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-search-advance.disabled, a.btn-search-advance.disabled:hover { color: #FFFFFF; background:#CCCCCC;} a.btn-search-advance { color:#FFFFFF; background:#c7a5c7; border:1px solid #b68ab7;} a.btn-search-advance:hover { color:#FFFFFF; background:#be9bbf; border:1px solid #b68ab7;} a.btn-search-advance .iconSVG {} a.btn-search-advance .iconSVG.dec-c01 { color:#FFFFFF;} a.btn-search-advance:hover .iconSVG.dec-c01 { color:#FFFFFF;} a.btn-search-advance .dec-type, a.btn-search-advance:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1.1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} /*end - a.btn-search-advance -------------------------------------------*/ /*start - a.btn-search.dec-c01 -------------------------------------------*/ a.btn-search.dec-c01, a.btn-search.dec-c01:hover { border-radius:5px; margin:5px 0px 0px 0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-search.dec-c01.disabled, a.btn-search.dec-c01.disabled:hover { color:#FFFFFF; background:#CCCCCC;} a.btn-search.dec-c01 { color:#FFFFFF; background:#998a65; border:1px solid #776744;} a.btn-search.dec-c01:hover { color:#FFFFFF; background:#776744; border:1px solid #776744;} a.btn-search.dec-c01 .iconSVG {} a.btn-search.dec-c01 .iconSVG.dec-c01 { color:#FFFFFF;} a.btn-search.dec-c01:hover .iconSVG.dec-c01 { color:#FFFFFF;} a.btn-search.dec-c01 .dec-type, a.btn-search.dec-c01:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1.1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} /*end - a.btn-search -------------------------------------------*/ /*start - a.btn-addSchedule -------------------------------------------*/ a.btn-addSchedule, a.btn-addSchedule:hover { border-radius:0.25rem; margin:0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); min-height:35px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-addSchedule { background:#FFFFFF; border:1px solid #ced4da; color:#998a65;} a.btn-addSchedule:hover { background:#fcfbe0; border:1px solid #e1e1e1; color:#f7931e;} a.btn-addSchedule .dec-ic { color:#d9a20c; margin:0px 5px 0px 0px;} a.btn-addSchedule:hover .dec-ic { color:#f7931e;} /*end - a.btn-addSchedule -------------------------------------------*/ /*start - a.btn-deleteSchedule -------------------------------------------*/ a.btn-deleteSchedule, a.btn-deleteSchedule:hover { border-radius:0.25rem; margin:0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); min-height:35px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-deleteSchedule { background:#fafafa; border:1px solid #ced4da; color:#595959;} a.btn-deleteSchedule:hover { background:#FFFFFF; border:1px solid #e1e1e1; color:#595959;} a.btn-deleteSchedule .dec-ic { color:#ed1c24; margin:0px 5px 0px 0px;} a.btn-deleteSchedule:hover .dec-ic { color:#ed1c24;} /*end - a.btn-deleteSchedule -------------------------------------------*/ /*start - a.btn-alarmSound-on 警示音/開 -------------------------------------------*/ a.btn-alarmSound-on, a.btn-alarmSound-on:hover { border-radius:0.25rem; margin:0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); min-height:35px; /*display: -ms-inline-flexbox !important; display: inline-flex !important;*/ -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-alarmSound-on { background:#fbb03b; border:1px solid #CCCCCC; color:#999999;} a.btn-alarmSound-on:hover { background:#f9a332; border:1px solid #CCCCCC; color:#8f8f8f;} a.btn-alarmSound-on .dec-ic { color:#FFFFFF; margin:0px 2px 0px 0px; font-size:15px;} a.btn-alarmSound-on:hover .dec-ic { color:#FFFFFF;} a.btn-alarmSound-on .dec-type, a.btn-alarmSound-on:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1.1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px; color:#FFFFFF;} /*end - a.btn-alarmSound-on 警示音/開 -------------------------------------------*/ /*start - a.btn-alarmSound-off 警示音/關 -------------------------------------------*/ a.btn-alarmSound-off, a.btn-alarmSound-off:hover { border-radius:0.25rem; margin:0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); min-height:35px; /*display: -ms-inline-flexbox !important; display: inline-flex !important;*/ -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-alarmSound-off { background:#f5f5f5; border:1px solid #ced4da; color:#d7d7d7;} a.btn-alarmSound-off:hover { background:#f0f0f0; border:1px solid #e1e1e1; border:1px solid #cccccc; color:#cdcdcd;} a.btn-alarmSound-off .dec-ic { color:#d7d7d7; margin:0px 0px 0px 2px; } a.btn-alarmSound-off:hover .dec-ic { color:#cdcdcd;} a.btn-alarmSound-off .dec-type, a.btn-alarmSound-off:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1.1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} /*end - a.btn-alarmSound-off 警示音/關 -------------------------------------------*/ /*start - a.btn-drawArea -------------------------------------------*/ a.btn-drawArea, a.btn-drawArea:hover { border-radius:0.25rem; margin:0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); min-height:35px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-drawArea { background:#FFFFFF; border:1px solid #ced4da; color:#29aecc;} a.btn-drawArea:hover { background:#fcfbe0; border:1px solid #b7caba; color:#0083BE;} a.btn-drawArea .dec-ic { color:#5dc1cf; margin:0px 5px 0px 0px;} a.btn-drawArea:hover .dec-ic { color:#29aecc;} /*end - a.btn-drawArea -------------------------------------------*/ /*start - a.btn-cancel -------------------------------------------*/ a.btn-cancel, a.btn-cancel:hover { border-radius:5px; margin:5px 0px 0px 0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-cancel { background:#8f8f8f; border:1px solid #8f8f8f; color:#FFFFFF;} a.btn-cancel:hover { background:#858585; border:1px solid #808080; color:#FFFFFF;} a.btn-cancel .iconSVG {} a.btn-cancel .iconSVG.dec-c01 { color:#FFFFFF;} a.btn-cancel:hover .iconSVG.dec-c01 { color:#FFFFFF;} a.btn-cancel .dec-type, a.btn-cancel:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1.1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} /*end - a.btn-cancel -------------------------------------------*/ /*start - .dec-btn-confirm --------------------------------------------------------------------------------------*/ .dec-btn-confirm { color:#FFFFFF; border-color:#29abe2; background:#5dc1cf; text-decoration:none; width:calc(100% - 0px);} .dec-btn-confirm:hover { background:#59b9c1;} .dec-btn-confirm { color:#FFFFFF; border-color:#29abe2;} .dec-btn-confirm:hover { color:#FFFFFF; background-color:#59b9c1; border-color:#54b0b2;} .dec-btn-confirm:focus, .dec-btn-confirm.focus { box-shadow:0 0 0 0.2rem rgba(153, 138, 101, 0.5);} .dec-btn-confirm.disabled, .dec-btn-confirm:disabled { color:#FFFFFF; background-color:#CCCCCC;} .dec-btn-confirm:not(:disabled):not(.disabled):active, .dec-btn-confirm:not(:disabled):not(.disabled).active, .show > .dec-btn-confirm.dropdown-toggle { color:#FFFFFF; background-color:#29abe2; border-color:#54b0b2;} .dec-btn-confirm:not(:disabled):not(.disabled):active:focus, .dec-btn-confirm:not(:disabled):not(.disabled).active:focus, .show > .dec-btn-confirm.dropdown-toggle:focus { box-shadow:0 0 0 0.2rem rgba(153, 138, 101, 0.5);} /*end - .dec-btn-confirm --------------------------------------------------------------------------------------*/ /*start - .dec-btn-cancel --------------------------------------------------------------------------------------*/ .dec-btn-cancel { color:#FFFFFF; border-color:#8f8f8f; background:#a3a3a3;} .dec-btn-cancel:hover { background:#8f8f8f;} .dec-btn-cancel { color:#FFFFFF; border-color:#8f8f8f;} .dec-btn-cancel:hover { color:#FFFFFF; background-color:#8f8f8f; border-color:#8f8f8f;} .dec-btn-cancel:focus, .dec-btn-cancel.focus { box-shadow:0 0 0 0.2rem rgba(40, 167, 69, 0.5);} .dec-btn-cancel.disabled, .dec-btn-cancel:disabled { color:#FFFFFF; background-color:transparent;} .dec-btn-cancel:not(:disabled):not(.disabled):active, .dec-btn-cancel:not(:disabled):not(.disabled).active, .show > .dec-btn-cancel.dropdown-toggle { color:#FFFFFF; background-color:#8f8f8f; border-color:#8f8f8f;} .dec-btn-cancel:not(:disabled):not(.disabled):active:focus, .dec-btn-cancel:not(:disabled):not(.disabled).active:focus, .show > .dec-btn-cancel.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);} /*end - .dec-btn-cancel --------------------------------------------------------------------------------------*/ /*start - .dec-btn-clear --------------------------------------------------------------------------------------*/ .dec-btn-clear { color:#8f8f8f; border-color:#CCCCCC; background:#FFFFFF;} .dec-btn-clear:hover { background:#fafafa;} .dec-btn-clear { color:#8f8f8f; border-color:#CCCCCC;} .dec-btn-clear:hover { color:#8f8f8f; background-color:#fafafa; border-color:#CCCCCC;} .dec-btn-clear:focus, .dec-btn-clear.focus { box-shadow:0 0 0 0.2rem rgba(40, 167, 69, 0.5);} .dec-btn-clear.disabled, .dec-btn-clear:disabled { color:#8f8f8f; background-color:transparent;} .dec-btn-clear:not(:disabled):not(.disabled):active, .dec-btn-clear:not(:disabled):not(.disabled).active, .show > .dec-btn-clear.dropdown-toggle { color:#8f8f8f; background-color:#fafafa; border-color:#CCCCCC;} .dec-btn-clear:not(:disabled):not(.disabled):active:focus, .dec-btn-clear:not(:disabled):not(.disabled).active:focus, .show > .dec-btn-clear.dropdown-toggle:focus { box-shadow:0 0 0 0.2rem rgba(40, 167, 69, 0.5);} /*end - .dec-btn-clear --------------------------------------------------------------------------------------*/ /*start - a.btn-refresh-02 -------------------------------------------*/ a.btn-refresh-02, a.btn-refresh-02:hover { border-radius:5px; text-decoration:none; margin:0px 0px 0px 5px; padding:0px; width:calc(100% - 5px); height:35px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-refresh-02 { background:rgba(255, 255, 255, 0.5); border:1px solid #cccccc; color:#FFFFFF;} a.btn-refresh-02:hover { background:rgba(255, 255, 255, 1); border:1px solid #c8c9ca; color:#FFFFFF;} a.btn-refresh-02 .dec-c01, a.btn-refresh-02:hover .dec-c01 { color:#999999; font-size:1rem;} /*end - a.btn-refresh-02 -------------------------------------------*/ /*start - a.btn-changePassword -------------------------------------------*/ a.btn-changePassword, a.btn-changePassword:hover { border-radius:5px; margin:5px 0px 0px 0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-changePassword { background:#FFFFFF; border:1px solid #e1e1e1; color:#595959;} a.btn-changePassword:hover { background:#FFFFFF; border:1px solid #cccccc; color:#169cbf;} a.btn-changePassword .iconSVG {} a.btn-changePassword .iconSVG.dec-c01 { color:#FFFFFF;} a.btn-changePassword:hover .iconSVG.dec-c01 { color:#FFFFFF;} a.btn-changePassword .dec-type, a.btn-changePassword:hover .dec-type { font-size:1rem; margin:0px 0px 2px 2px; padding:0px;} @media all and (-ms-high-contrast:none) { *::-ms-backdrop, a.btn-changePassword .dec-type, *::-ms-backdrop, a.btn-changePassword:hover .dec-type { font-size:1rem; margin:0px 0px 2px 2px; padding:5px 0px;} /* IE11 */ } /*end - a.btn-changePassword -------------------------------------------*/ /*start - a.btn-add -------------------------------------------*/ a.btn-add, a.btn-add:hover { border-radius:0.25rem; margin:5px 0px 0px 0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-add.disabled, a.btn-add.disabled:hover { color:#CCCCCC; background:#FFFFFF;} a.btn-add { color:#fbb03b; background:#fafafa; border:1px solid #ced4da;} a.btn-add:hover { color:#f7931e; background:#FFFFFF; border:1px solid #ced4da;} a.btn-add .iconSVG {} a.btn-add .iconSVG.dec-c01 { color:#fbb03b;} a.btn-add:hover .iconSVG.dec-c01 { color:#f7931e;} a.btn-add .dec-type, a.btn-add:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1.1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} /*end - a.btn-add -------------------------------------------*/ /*start - a.btn-add-02 -------------------------------------------*/ a.btn-add-02, a.btn-add-02:hover { border-radius:0.25rem; margin:5px 0px 0px 0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-add-02.disabled, a.btn-add-02.disabled:hover { color:#CCCCCC; background:#FFFFFF;} a.btn-add-02 { color:#72bf44; background:#fafafa; border:1px solid #ced4da;} a.btn-add-02:hover { color:#72bf44; background: #f0f0f0; border:1px solid #ced4da;} a.btn-add-02 .iconSVG {} a.btn-add-02 .iconSVG.dec-c01 { color:#fbb03b;} a.btn-add-02:hover .iconSVG.dec-c01 { color:#f7931e;} a.btn-add-02 .dec-type, a.btn-add-02:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1.1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} /*end - a.btn-add-02 -------------------------------------------*/ /*start - a.btn-cancel-02 -------------------------------------------*/ a.btn-cancel-02, a.btn-cancel-02:hover { border-radius:0.25rem; margin:5px 0px 0px 0px; padding:2px 5px; text-align:right; text-decoration:none; width:calc(100% - 0px); display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-cancel-02.disabled, a.btn-cancel-02.disabled:hover { color:#CCCCCC; background:#FFFFFF;} a.btn-cancel-02 { color:#999999; background:#fafafa; border:1px solid #ced4da;} a.btn-cancel-02:hover { color:#999999; background:#f0f0f0; border:1px solid #ced4da;} a.btn-cancel-02 .iconSVG {} a.btn-cancel-02 .iconSVG.dec-c01 { color:#fbb03b;} a.btn-cancel-02:hover .iconSVG.dec-c01 { color:#f7931e;} a.btn-cancel-02 .dec-type, a.btn-cancel-02:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1.1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} /*end - a.btn-cancel-02 -------------------------------------------*/ /*start - a.btn-view -------------------------------------------*/ a.btn-view, a.btn-view:hover { border-radius:0.25rem; margin:5px 0px 0px 0px; padding:2px 5px; text-align:right; width:calc(100% - 0px); text-decoration:underline !important; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-view.disabled, a.btn-view.disabled:hover { color:#CCCCCC; background:transparent;} a.btn-view { color:#999999; background:transparent; border:1px solid transparent;} a.btn-view:hover { color:#5dc1cf; background:transparent; border:1px solid transparent;} a.btn-view .iconSVG {} a.btn-view .iconSVG.dec-c01 { color:#5dc1cf;} a.btn-view:hover .iconSVG.dec-c01 { color:#5dc1cf;} a.btn-view .dec-type, a.btn-view:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} /*end - a.btn-view -------------------------------------------*/ /*start - a.btn-download-bw -------------------------------------------*/ .dec-btn-outer { width:calc(100% - 0px); margin:0px; padding: 0px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: end !important; justify-content: flex-end !important; -ms-flex-align: center !important; align-items: center !important;} a.btn-download-bw, a.btn-download-bw:hover { border-radius:5px; margin:5px 0px; padding:5px 8px; text-align:right; width:80px; background:#595959; border:1px solid #cccccc; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: center !important; justify-content: center !important;} a.btn-download-bw.disabled, a.btn-download-bw.disabled:hover { color:#999999; background:transparent;} a.btn-download-bw { color:#FFFFFF; background:#333333; border:1px solid #595959;} a.btn-download-bw:hover { color:#fafafa; background:#000000; border:1px solid #595959;} a.btn-download-bw .icon-sprite { margin-right:5px; opacity:0.8;} a.btn-download-bw:hover .icon-sprite { margin-right:5px; opacity:1;} a.btn-download-bw .dec-type, a.btn-download-bw:hover .dec-type { font-family:'Noto Sans TC', sans-serif; font-weight:400; font-size:1rem; line-height:1.2rem; margin:0px 0px 2px 2px; padding:5px 2px;} a.btn-download-bw .dec-type { color:#FFFFFF; opacity:0.8;} a.btn-download-bw:hover .dec-type { color:#FFFFFF; opacity:1;} /*end - a.btn-download-bw -------------------------------------------*/ /*start - a.dec-btn-importLandmark -------------------------------------------------------------------------------------------------------*/ a.dec-btn-importLandmark, a.dec-btn-importLandmark:hover { width:calc(100% - 0px); margin:0px; padding:10px 10px; text-decoration:none; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} a.dec-btn-importLandmark { background:#bf9fc1; border:1px solid #b495b7;} a.dec-btn-importLandmark:hover { background:#b495b7; border:1px solid #977a99;} a.dec-btn-importLandmark .dec-ic { color:#FFFFFF; margin:5px; padding:0px;} a.dec-btn-importLandmark .dec-type { color:#FFFFFF; margin:0px; padding:0px; font-size:14px; line-height:1.2rem;} a.dec-btn-importLandmark:hover .dec-ic { color:#FFFFFF;} a.dec-btn-importLandmark:hover .dec-type { color:#FFFFFF;} a.dec-btn-importLandmark .icon-sprite.dec-ic { opacity:1;} a.dec-btn-importLandmark:hover .icon-sprite.dec-ic { opacity:1;} /*end - a.dec-btn-importLandmark -------------------------------------------------------------------------------------------------------*/ /*start - a.dec-btn-template -------------------------------------------------------------------------------------------------------*/ a.dec-btn-template, a.dec-btn-template:hover { width:calc(100% - 0px); margin:0px; padding:10px 10px; text-decoration:none; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} a.dec-btn-template { background:#999999; border:1px solid #858585;} a.dec-btn-template:hover { background:#888888; border:1px solid #787878;} a.dec-btn-template .dec-ic { color:#FFFFFF; margin:5px; padding:0px;} a.dec-btn-template .dec-type { color:#FFFFFF; margin:0px; padding:0px; font-size:14px; line-height:1.2rem;} a.dec-btn-template:hover .dec-ic { color:#FFFFFF;} a.dec-btn-template:hover .dec-type { color:#FFFFFF;} a.dec-btn-template .icon-sprite.dec-ic { opacity:1;} a.dec-btn-template:hover .icon-sprite.dec-ic { opacity:1;} /*end - a.dec-btn-template -------------------------------------------------------------------------------------------------------*/ /*start - a.btn-overloadMgt-support -------------------------------------------------------------------------------------------------------*/ a.btn-overloadMgt-support, a.btn-overloadMgt-support:hover { width:calc(100% - 0px); margin:0px; padding:3px 5px; text-decoration:none; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} a.btn-overloadMgt-support { background:#ff0000; border:1px solid #ea0303;} a.btn-overloadMgt-support:hover { background:#ea0303; border:1px solid #ea0303;} a.btn-overloadMgt-support .dec-ic { color:#FFFFFF; margin:5px; padding:0px;} a.btn-overloadMgt-support .dec-type { color:#FFFFFF; margin:0px; padding:0px; font-size:14px; line-height:1.2rem;} a.btn-overloadMgt-support:hover .dec-ic { color:#FFFFFF;} a.btn-overloadMgt-support:hover .dec-type { color:#FFFFFF;} a.btn-overloadMgt-support .icon-sprite.dec-ic { opacity:1;} a.btn-overloadMgt-support:hover .icon-sprite.dec-ic { opacity:1;} /*end - a.btn-overloadMgt-support -------------------------------------------------------------------------------------------------------*/ /*start - a.btn-overloadMgt-dispatch -------------------------------------------------------------------------------------------------------*/ a.btn-overloadMgt-dispatch, a.btn-overloadMgt-dispatch:hover { width:calc(100% - 0px); margin:0px; padding:3px 5px; text-decoration:none; border-radius:5px; display: -ms-inline-flexbox !important; display: inline-flex !important; -ms-flex-pack: center !important; justify-content: center !important; -ms-flex-align: center !important; align-items: center !important;} a.btn-overloadMgt-dispatch { background:#999999; border:1px solid #888888;} a.btn-overloadMgt-dispatch:hover { background:#888888; border:1px solid #888888;} a.btn-overloadMgt-dispatch .dec-ic { color:#FFFFFF; margin:5px; padding:0px;} a.btn-overloadMgt-dispatch .dec-type { color:#FFFFFF; margin:0px; padding:0px; font-size:14px; line-height:1.2rem;} a.btn-overloadMgt-dispatch:hover .dec-ic { color:#FFFFFF;} a.btn-overloadMgt-dispatch:hover .dec-type { color:#FFFFFF;} a.btn-overloadMgt-dispatch .icon-sprite.dec-ic { opacity:1;} a.btn-overloadMgt-dispatch:hover .icon-sprite.dec-ic { opacity:1;} /*end - a.btn-overloadMgt-dispatch -------------------------------------------------------------------------------------------------------*/ /*start - pagination -------------------------------------------------------------------------------------------*/ .pagination.dec-h-01 { -ms-flex-pack: center !important; justify-content: center !important; margin-top:5px; height:40px; overflow:hidden;} .pagination { margin-top:2px; padding-left:0; list-style:none; border-radius:0.25rem; width:calc(100% - 0px) !important; padding-top:5px; display: -ms-flexbox !important; display: flex !important; -ms-flex-direction: row !important; flex-direction: row !important; -ms-flex-align: center !important; align-items: center !important; -ms-flex-pack: justify !important; justify-content: space-between !important;} .page-link { position:relative; display:block; padding:0.5rem 0.75rem; margin-left:5px; line-height:1rem; color:#595959; background-color:transparent; border:1px solid #e1e1e1; border-radius:5px; height:30px;} .page-link:hover { z-index:2; color: #FFFFFF; text-decoration: none; background-color:#59A2D3; border-color:#3D7FBF;} .page-link:focus { z-index:2; outline:0; box-shadow:0 0 0 0.2rem rgba(0, 123, 255, 0.25);} .page-link:not(:disabled):not(.disabled) { cursor:pointer;} .page-item:first-child .page-link { margin-left:0; border-top-left-radius:0.25rem; border-bottom-left-radius:0.25rem; border-radius:0.25rem;} .page-item:last-child .page-link { border-top-right-radius:0.25rem; border-bottom-right-radius:0.25rem; border-radius:0.25rem;} .page-item.active .page-link { z-index:1; color:#FFFFFF; background-color:#59A2D3; border-color:#3D7FBF;} .page-item.disabled .page-link { color:#bebebe; pointer-events:none; cursor:auto; background:#fafafa; border-color:#dee2e6;} .pagination-lg .page-link { padding:0.75rem 1.5rem; font-size:1.25rem; line-height:1.5rem; height:30px;} .pagination-lg .page-item:first-child .page-link { border-top-left-radius:0.3rem; border-bottom-left-radius:0.3rem; border-radius:0.3rem;} .pagination-lg .page-item:last-child .page-link { border-top-right-radius:0.3rem; border-bottom-right-radius:0.3rem; border-radius:0.3rem;} .pagination-sm .page-link { padding:0.25rem 0.5rem; font-size:0.875rem; line-height:1.5rem;} .pagination-sm .page-item:first-child .page-link { border-top-left-radius:0.2rem; border-bottom-left-radius:0.2rem; border-radius:0.2rem;} .pagination-sm .page-item:last-child .page-link { border-top-right-radius:0.2rem; border-bottom-right-radius:0.2rem; border-radius:0.2rem;} /*end - pagination -------------------------------------------------------------------------------------------*/ /*start - .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination -------------------------------------------------------------------*/ .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo {} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination { margin-left: 5px !important; border-color:#dee2e6;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .page-link { position:relative; display:block; padding:0.5rem 0.75rem; margin-left:5px !important; line-height:1rem; color:#595959; background-color:transparent; border:1px solid #e1e1e1; border-radius:5px; height:30px; text-decoration:none !important;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .page-link:hover { z-index:2; color:#FFFFFF; text-decoration:none; background-color:#59A2D3; border-color:#3D7FBF;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .page-link:focus { z-index:2; outline:0; box-shadow:0 0 0 0.2rem rgba(0, 123, 255, 0.25);} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .page-link:not(:disabled):not(.disabled) { cursor:pointer;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .page-item:first-child .page-link { margin-left:0; border-top-left-radius:0.25rem; border-bottom-left-radius:0.25rem; border-radius:0.25rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .page-item:last-child .page-link { border-top-right-radius:0.25rem; border-bottom-right-radius:0.25rem; border-radius:0.25rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .page-item.active .page-link, .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .page-item.active:hover .page-link { z-index:1; color:#FFFFFF; background-color:#59A2D3; border-color:#3D7FBF;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .page-item.disabled .page-link { color:#bebebe; pointer-events:none; cursor:auto; background:transparent; border-color:#dee2e6; background-color:transparent;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .pagination-lg .page-link { padding:0.75rem 1.5rem; font-size:1.25rem; line-height:1.5rem; height:30px;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .pagination-lg .page-item:first-child .page-link { border-top-left-radius:0.3rem; border-bottom-left-radius:0.3rem; border-radius:0.3rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .pagination-lg .page-item:last-child .page-link { border-top-right-radius:0.3rem; border-bottom-right-radius:0.3rem; border-radius:0.3rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .pagination-sm .page-link { padding:0.25rem 0.5rem; font-size:0.875rem; line-height:1.5rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .pagination-sm .page-item:first-child .page-link { border-top-left-radius:0.2rem; border-bottom-left-radius:0.2rem; border-radius:0.2rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination .pagination-sm .page-item:last-child .page-link { border-top-right-radius:0.2rem; border-bottom-right-radius:0.2rem; border-radius:0.2rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-noteArea { width:calc(100% - 0px); margin:0px; padding:0px; text-align:center; color:#39b54a; font-size:1rem; line-height:1.2rem;} /*end - .con-container.dec-statistics .box-conArea.dec-height .dec-conArea-tableInfo .dec-Pagination -------------------------------------------------------------------*/ /*start - .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination -------------------------------------------------------------------*/ .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo {} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination { margin-left: 5px !important; border-color:#dee2e6;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .page-link { position:relative; display:block; padding:0.5rem 0.75rem; margin-left:5px !important; line-height:1rem; color:#595959; background-color:transparent; border:1px solid #e1e1e1; border-radius:5px; height:30px; text-decoration:none !important;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .page-link:hover { z-index:2; color:#FFFFFF; text-decoration:none; background-color:#59A2D3; border-color:#3D7FBF;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .page-link:focus { z-index:2; outline:0; box-shadow:0 0 0 0.2rem rgba(0, 123, 255, 0.25);} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .page-link:not(:disabled):not(.disabled) { cursor:pointer;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .page-item:first-child .page-link { margin-left:0; border-top-left-radius:0.25rem; border-bottom-left-radius:0.25rem; border-radius:0.25rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .page-item:last-child .page-link { border-top-right-radius:0.25rem; border-bottom-right-radius:0.25rem; border-radius:0.25rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .page-item.active .page-link, .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .page-item.active:hover .page-link { z-index:1; color:#FFFFFF; background-color:#59A2D3; border-color:#3D7FBF;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .page-item.disabled .page-link { color:#bebebe; pointer-events:none; cursor:auto; background:#fafafa; border-color:#dee2e6; background-color:transparent;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .pagination-lg .page-link { padding:0.75rem 1.5rem; font-size:1.25rem; line-height:1.5rem; height:30px;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .pagination-lg .page-item:first-child .page-link { border-top-left-radius:0.3rem; border-bottom-left-radius:0.3rem; border-radius:0.3rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .pagination-lg .page-item:last-child .page-link { border-top-right-radius:0.3rem; border-bottom-right-radius:0.3rem; border-radius:0.3rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .pagination-sm .page-link { padding:0.25rem 0.5rem; font-size:0.875rem; line-height:1.5rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .pagination-sm .page-item:first-child .page-link { border-top-left-radius:0.2rem; border-bottom-left-radius:0.2rem; border-radius:0.2rem;} .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination .pagination-sm .page-item:last-child .page-link { border-top-right-radius:0.2rem; border-bottom-right-radius:0.2rem; border-radius:0.2rem;} /*end - .con-container.dec-statistics .box-conArea.dec-height .dec-table-sub.dec-bg .dec-conArea-tableInfo .dec-Pagination -------------------------------------------------------------------*/ /*start - .breadcrumb -------------------------------*/ .breadcrumb { display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; padding:0.4rem 1rem; margin-top:1px; margin-bottom:0px; list-style:none; background-color:transparent; border-radius:0.25rem; color: #ebebeb;} .breadcrumb-item + .breadcrumb-item { padding-left:0.5rem;} .breadcrumb-item + .breadcrumb-item::before { display:inline-block; padding-right:0.5rem; color:#999999; content:"/";} .breadcrumb-item + .breadcrumb-item:hover::before { text-decoration:underline;} .breadcrumb-item + .breadcrumb-item:hover::before { text-decoration:none;} .breadcrumb-item + .breadcrumb-item .dec-slash { color:#999999; padding:0px 7px;} .breadcrumb-item.active { color:#73d1d8;} .breadcrumb a, .breadcrumb a:hover { text-decoration:none;} .breadcrumb a { color:#ebebeb;} .breadcrumb a:hover { color:#73d1d8;} /*end - .breadcrumb -------------------------------*/ /* start - 告警for RD｜舊版使用 ----------------------------------------------------------------------------------*/ .MapTool-FunctionBox.dec-FunctionArea-Alarm.div-MapTool-FunctionArea-Alarm.dec-Alarm-RDTest { height:calc(100% - 105px);} .MapTool-FunctionBox.dec-FunctionArea-Alarm.div-MapTool-FunctionArea-Alarm.dec-Alarm-RDTest .box-inner .con-main { overflow:hidden; overflow-y:hidden;} .MapTool-FunctionBox.dec-FunctionArea-Alarm.div-MapTool-FunctionArea-Alarm.dec-Alarm-RDTest .box-conArea.dec-result-FunctionArea-Alarm { height:calc(100% - 115px);} .MapTool-FunctionBox.dec-FunctionArea-Alarm.div-MapTool-FunctionArea-Alarm.dec-Alarm-RDTest .box-conArea.dec-result-FunctionArea-Alarm .table-responsive.dec-table.dec-fixedTableHeader { overflow:hidden;} .box-conArea.dec-result-FunctionArea-Alarm table.dec-table th:nth-child(1), .box-conArea.dec-result-FunctionArea-Alarm table.dec-table td:nth-child(1) { width:100px;} .box-conArea.dec-result-FunctionArea-Alarm table.dec-table th:nth-child(2), .box-conArea.dec-result-FunctionArea-Alarm table.dec-table td:nth-child(2) { width:calc(100% - 125px);} .box-conArea.dec-result-FunctionArea-Alarm table.dec-table .dec-inner-box { width:calc(100% - 0px); margin:0px; padding:0px;} .box-conArea.dec-result-FunctionArea-Alarm table.dec-table .dec-inner-box .dec-box-top { width:calc(100% - 0px); margin:0px; padding:0px;} .box-conArea.dec-result-FunctionArea-Alarm table.dec-table .dec-inner-box .dec-box-top a, .box-conArea.dec-result-FunctionArea-Alarm table.dec-table .dec-inner-box .dec-box-top a:hover { color:#169cbf;} .box-conArea.dec-result-FunctionArea-Alarm table.dec-table .dec-inner-box .dec-box-bottom { width:calc(100% - 0px); margin:0px; padding:0px; display: -ms-inline-flexbox !important; display: inline-flex !important;} .box-conArea.dec-result-FunctionArea-Alarm table.dec-table .dec-inner-box .dec-box-bottom .dec-type { font-size:12px; color:#999999;} .box-conArea.dec-result-FunctionArea-Alarm table.dec-table .dec-inner-box .dec-box-bottom .dec-btn-area { margin:0px; padding:0px; margin-left:auto;} .box-conArea.dec-result-FunctionArea-Alarm table.dec-table .dec-inner-box .dec-box-bottom .dec-btn-area a, .box-conArea.dec-result-FunctionArea-Alarm table.dec-table .dec-inner-box .dec-box-bottom .dec-btn-area a:hover { color:#999999; margin:0px 0px 0px 2px; padding:5px; width:26px; height:26px; overflow:hidden;} .box-conArea.dec-result-FunctionArea-Alarm table.dec-table .dec-inner-box .dec-box-bottom .dec-btn-area a .dec-ic { margin:1px; padding:0px;} /* [note]map.html 在html裡加上「dec-Alarm-RDTest」
*/ /* end - 告警for RD｜舊版使用 ----------------------------------------------------------------------------------*/ /*start - Roger - table scroller tableStyles ----------------------------------------------------------------------------------*/ .table-responsive-a01 .table { max-width:none; -webkit-overflow-scrolling:none !important;} @media screen and (max-width: 991px) { .table-responsive-a01 { width:100%; margin-bottom:15px; overflow-y:hidden; -ms-overflow-style:-ms-autohiding-scrollbar; border:1px solid #ddd;} .table-responsive-a01 > .table { margin-bottom:0;} .table-responsive-a01 > .table > thead > tr > th, .table-responsive-a01 > .table > tbody > tr > th, .table-responsive-a01 > .table > tfoot > tr > th, .table-responsive-a01 > .table > thead > tr > td, .table-responsive-a01 > .table > tbody > tr > td, .table-responsive-a01 > .table > tfoot > tr > td { white-space:nowrap; white-space:normal;} .table-responsive-a01 > .table-bordered { border:0;} .table-responsive-a01 > .table-bordered > thead > tr > th:first-child, .table-responsive-a01 > .table-bordered > tbody > tr > th:first-child, .table-responsive-a01 > .table-bordered > tfoot > tr > th:first-child, .table-responsive-a01 > .table-bordered > thead > tr > td:first-child, .table-responsive-a01 > .table-bordered > tbody > tr > td:first-child, .table-responsive-a01 > .table-bordered > tfoot > tr > td:first-child { border-left:0;} .table-responsive-a01 > .table-bordered > thead > tr > th:last-child, .table-responsive-a01 > .table-bordered > tbody > tr > th:last-child, .table-responsive-a01 > .table-bordered > tfoot > tr > th:last-child, .table-responsive-a01 > .table-bordered > thead > tr > td:last-child, .table-responsive-a01 > .table-bordered > tbody > tr > td:last-child, .table-responsive-a01 > .table-bordered > tfoot > tr > td:last-child { border-right:0;} .table-responsive-a01 > .table-bordered > tbody > tr:last-child > th, .table-responsive-a01 > .table-bordered > tfoot > tr:last-child > th, .table-responsive-a01 > .table-bordered > tbody > tr:last-child > td, .table-responsive-a01 > .table-bordered > tfoot > tr:last-child > td { border-bottom:0;} } @media screen and (min-width: 991px) { .table-responsive-a01 { width:100%; margin-bottom:15px; overflow-y:hidden; -ms-overflow-style:-ms-autohiding-scrollbar; border:0px solid #ddd;} .table-responsive-a01 > .table { margin-bottom: 0;} .table-responsive-a01 > .table > thead > tr > th, .table-responsive-a01 > .table > tbody > tr > th, .table-responsive-a01 > .table > tfoot > tr > th, .table-responsive-a01 > .table > thead > tr > td, .table-responsive-a01 > .table > tbody > tr > td, .table-responsive-a01 > .table > tfoot > tr > td { white-space: nowrap; white-space: normal;} .table-responsive-a01 > .table-bordered { border:0;} .table-responsive-a01 > .table-bordered > thead > tr > th:first-child, .table-responsive-a01 > .table-bordered > tbody > tr > th:first-child, .table-responsive-a01 > .table-bordered > tfoot > tr > th:first-child, .table-responsive-a01 > .table-bordered > thead > tr > td:first-child, .table-responsive-a01 > .table-bordered > tbody > tr > td:first-child, .table-responsive-a01 > .table-bordered > tfoot > tr > td:first-child { border-left:0;} .table-responsive-a01 > .table-bordered > thead > tr > th:last-child, .table-responsive-a01 > .table-bordered > tbody > tr > th:last-child, .table-responsive-a01 > .table-bordered > tfoot > tr > th:last-child, .table-responsive-a01 > .table-bordered > thead > tr > td:last-child, .table-responsive-a01 > .table-bordered > tbody > tr > td:last-child, .table-responsive-a01 > .table-bordered > tfoot > tr > td:last-child { border-right:0;} .table-responsive-a01 > .table-bordered > tbody > tr:last-child > th, .table-responsive-a01 > .table-bordered > tfoot > tr:last-child > th, .table-responsive-a01 > .table-bordered > tbody > tr:last-child > td, .table-responsive-a01 > .table-bordered > tfoot > tr:last-child > td { /*border-bottom:0;*/} } /* vertical*/ .custom-scrollbar { display:block; overflow:auto !important; -webkit-overflow-scrolling:touch;} .custom-scrollbar::-webkit-scrollbar { width:5px; height:5px; background-color:#ccc;} .custom-scrollbar::-webkit-scrollbar-thumb { background:#999; border-radius:10px;} /* horizontal */ .custom-scrollbar-x { display:block; width:100%; overflow:auto; -webkit-overflow-scrolling:touch;} .custom-scrollbar-x::-webkit-scrollbar { height:8px; background-color:#ccc;} .custom-scrollbar-x::-webkit-scrollbar-thumb { background:#999; border-radius:10px;} .disable-scroll-y { overflow-y:none;} .table-dec-scrollbar { table-layout:auto; width:100%; font-size:10px;} .table-dec-scrollbar tr th { font-size:15px; vertical-align:middle !important; background:#595959; padding:8px; position:sticky; top:-1px; top:0px; min-width:60px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .table-dec-scrollbar tr td { font-size:15px; vertical-align:middle !important; padding:8px; min-width:60px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} @media (min-width: 768px) { .bottom-table-area-a01 { float:left; width:calc(100%); height:calc(100% - 0px); white-space:nowrap; margin-bottom:0px !important; padding:0px; overflow:auto;} .bottom-table-area-a01.dec-height-withPagination { height:calc(100% - 50px);} /*註：預留分頁的高度(50px): dec-height-withPagination*/ } @media (max-width: 767px) { .bottom-table-area-a01 { float:left; width:100%; height:calc(100% - 0px); margin-bottom:0px; padding:0px;} .bottom-table-area-a01.dec-height-withPagination { height:calc(100% - 50px);} /*註：預留分頁的高度(50px): dec-height-withPagination*/ } .table-responsive-a01 .table.table-dec-scrollbar tbody tr:hover, .table-responsive-a01 .table.table-dec-scrollbar tr.is-active, .table-responsive-a01 .table.table-dec-scrollbar tr.is-active:hover { background:#e1f1f4;} /*end - Roger - table scroller tableStyles ----------------------------------------------------------------------------------*/ .table-responsive-a01 > .table-bordered > thead > tr > th:first-child { vertical-align: top !important;} .table-responsive-a01 > .table-bordered.dec-checkBox > thead > tr > th:first-child { border-right:0px solid #595959;} .table-responsive-a01 > .table.table-bordered.dec-checkBox > tbody > tr > td:first-child { border-right:0px solid transparent;} .table-responsive-a01 > .table-bordered > thead > tr > th:nth-child(2) { } .table-responsive-a01 > .table-bordered.dec-checkBox > thead > tr > th:nth-child(2) { border-left:0px solid #595959;} .table-responsive-a01 > .table.table-bordered.dec-checkBox > tbody > tr > td:nth-child(2) { border-left:0px solid transparent;} /*start - .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 -------------------*/ .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 { height:calc(100% - 40px);} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDangerousDriving .box-conArea.dec-height .bottom-table-area-a01 { height:calc(100% - 140px);} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDrivingBehavior .box-conArea.dec-height .bottom-table-area-a01 { height:calc(100% - 120px);} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsLoadFactor .box-conArea.dec-height .bottom-table-area-a01 { height:calc(100% - 45px);} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAlarmRecordSelfDriving .box-conArea.dec-height .bottom-table-area-a01 { height:calc(100% - 45px);} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table th { vertical-align:bottom !important;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table th .dec-type-note { color:#f0f0f0; font-size:12px; font-weight:400;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table th .dec-type-note-num { color:#fccf00; font-size:12px; font-weight:400; padding-left:3px;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table th a:hover { text-decoration:none; color:#fafafa; border-bottom:0px !important; background:transparent;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a { border:1px solid #d2d2d2 !important;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a:hover { background:transparent; border:1px solid #d2d2d2 !important;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a .dec-img, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a:hover .dec-img { margin:0px; padding:0px;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.dec-type, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.dec-type:hover { border:1px solid transparent !important;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr th { color:#FFFFFF;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.dec-btn-01, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.dec-btn-01:hover { color:#595959; display:inline-block; border:1px solid #d2d2d2 !important; background:transparent; padding:2px 5px !important; border-radius:5px; margin:0px;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.dec-btn-01:hover { color:#169cbf; border:1px solid #d2d2d2 !important; background:#fafafa;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.dec-mL01 { margin-left:5px!important;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.dec-btn-02, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.dec-btn-02:hover { color:#595959; display:inline-block; border:1px solid #d2d2d2 !important; background:transparent; padding:0px !important; border-radius:5px; margin:0px;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.dec-btn-02:hover { color:#169cbf; border:1px solid #d2d2d2 !important; background:#fafafa;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.btn-show, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.btn-show:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.btn-hide, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.btn-hide:hover { border:0px !important;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub { background:#ebebeb;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub th { color:#FFFFFF;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub th a, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub th a:hover { border:0px !important;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub td a.dec-btn-01, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub td a.dec-btn-01:hover { color:#595959; display:inline-block; border:1px solid #d2d2d2 !important; background:transparent; padding:2px 5px !important; border-radius:5px; margin:0px;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub td a.dec-btn-01:hover { color:#169cbf; border:1px solid #d2d2d2 !important; background:#fafafa;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub td a.dec-mL01 { margin-left:5px!important;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub td a.dec-btn-02, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub td a.dec-btn-02:hover { color:#595959; display:inline-block; border:1px solid #d2d2d2 !important; background:transparent; padding:0px !important; border-radius:5px; margin:0px;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub td a.dec-btn-02:hover { color:#169cbf; border:1px solid #d2d2d2 !important; background:#fafafa;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.btn-show-01, .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.btn-show-01:hover { border:0px !important; padding:4px 6px; display:inline-block; float:right; color:#787878;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.btn-show-01 .dec-ic { color:#787878; margin:0px; padding:0px;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 .table td a.btn-show-01:hover .dec-ic { color:#169cbf; margin:0px; padding:0px;} /*start - .row.dec-row-statistics .dec-conBox .dec-conBoxInner｜tablesub 冷鏈圖表, XX(車輛感測器數據｜胎溫/胎壓數據), 異常管理, 超速, 1持續超速, 1尿素加注紀錄, 1加油紀錄, 1告警紀錄 ----------------------------------------*/ .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsColdChain .box-conArea.dec-height .bottom-table-area-a01 .table tr, /*.row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCarSensor .box-conArea.dec-height .bottom-table-area-a01.table-responsive-a01.div-NavSortBox-statisticsCarSensor-Table-Tire .table tr,*/ .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormal .box-conArea.dec-height .bottom-table-area-a01 .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingN .box-conArea.dec-height .bottom-table-area-a01 .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContinuedSpeeding .box-conArea.dec-height .bottom-table-area-a01 .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDEF .box-conArea.dec-height .bottom-table-area-a01 .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFuel .box-conArea.dec-height .bottom-table-area-a01 .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAlarmRecord .box-conArea.dec-height .bottom-table-area-a01 .table tr { background:#FFFFFF;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsColdChain .box-conArea.dec-height .bottom-table-area-a01 .table tr:hover, /*.row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCarSensor .box-conArea.dec-height .bottom-table-area-a01.table-responsive-a01.div-NavSortBox-statisticsCarSensor-Table-Tire .table tr:hover,*/ .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormal .box-conArea.dec-height .bottom-table-area-a01 .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingN .box-conArea.dec-height .bottom-table-area-a01 .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContinuedSpeeding .box-conArea.dec-height .bottom-table-area-a01 .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDEF .box-conArea.dec-height .bottom-table-area-a01 .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFuel .box-conArea.dec-height .bottom-table-area-a01 .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAlarmRecord .box-conArea.dec-height .bottom-table-area-a01 .table tr:hover { background:#e1f1f4;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsColdChain .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub, /*.row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCarSensor .box-conArea.dec-height .bottom-table-area-a01.table-responsive-a01.div-NavSortBox-statisticsCarSensor-Table-Tire .table tr.dec-table-sub,*/ .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormal .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingN .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContinuedSpeeding .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDEF .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFuel .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAlarmRecord .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub { background:rgba(0, 0, 0, 0.05);} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsColdChain .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCarSensor .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormal .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingN .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContinuedSpeeding .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDEF .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFuel .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAlarmRecord .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr { background:#FFFFFF;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsColdChain .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even), .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCarSensor .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even), .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormal .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even), .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingN .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even), .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContinuedSpeeding .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even), .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDEF .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even), .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFuel .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even), .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAlarmRecord .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even) { background:#fafafa;} .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsColdChain .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsColdChain .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even):hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCarSensor .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsCarSensor .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even):hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormal .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAbnormal .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even):hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingN .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsSpeedingN .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even):hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContinuedSpeeding .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsContinuedSpeeding .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even):hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDEF .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsDEF .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even):hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFuel .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsFuel .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even):hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAlarmRecord .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:hover, .row.dec-row-statistics .dec-conBox .dec-conBoxInner.div-NavSortBox-statisticsAlarmRecord .box-conArea.dec-height .bottom-table-area-a01 .table tr.dec-table-sub .table tr:nth-last-child(even):hover { background:#e1f1f4;} /*end - .row.dec-row-statistics .dec-conBox .dec-conBoxInner｜tablesub 冷鏈圖表, 車輛感測器數據｜胎溫/胎壓數據, 異常管理, 超速, 1持續超速, 1尿素加注紀錄, 1加油紀錄, 1告警紀錄 ----------------------------------------*/ /*end - .row.dec-row-statistics .dec-conBox .dec-conBoxInner .box-conArea.dec-height .bottom-table-area-a01 -------------------*/ .table-responsive-a01 > .table > thead > tr > th { z-index:99;} .table-responsive-a01 > .table > thead > tr > th .dec-type-note { color:#f0f0f0; font-size:12px; font-weight:400;} .table-responsive-a01 > .table > thead > tr > th .dec-type-note-num { color:#fccf00; font-size:12px; font-weight:400; padding-left:3px;} .modal-content .bottom-table-area-a01 .table tr th { color:#FFFFFF;} .table-responsive-a01 > .table > thead > tr > th .form-check { margin-bottom: 0px; color:#FFFFFF;} .table-responsive-a01 > .table > thead > tr > th .form-check .form-check-label { color:#FFFFFF;} .table-responsive-a01 > .table-bordered > thead > tr > th:first-child .form-check { margin-bottom:0px; color:#FFFFFF;} .table-responsive-a01 > .table-bordered > thead > tr > th { color:#FFFFFF;}