You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
791 lines
46 KiB
791 lines
46 KiB
@charset "utf-8"; |
|
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); |
|
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 100;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');} |
|
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 300;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');} |
|
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 400;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');} |
|
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 500;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');} |
|
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 700;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');} |
|
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 900;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype');} |
|
|
|
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;800;900&display=swap'); |
|
|
|
html, body, div, span, applet, object, iframe, |
|
h1, h2, h3, h4, h5, h6, p, blockquote, pre, |
|
a, abbr, acronym, address, big, cite, code, |
|
del, dfn, em, img, ins, kbd, q, s, samp, |
|
small, strike, strong, sub, sup, tt, var, |
|
b, u, i, center, |
|
dl, dt, dd, ol, ul, li, |
|
fieldset, form, label, legend, |
|
table, caption, tbody, tfoot, thead, tr, th, td, |
|
article, aside, canvas, details, embed, |
|
figure, figcaption, footer, header, hgroup, |
|
menu, nav, output, ruby, section, summary, |
|
time, mark, audio, video, button { |
|
margin: 0; |
|
padding: 0; |
|
border: 0; |
|
font-size: 100%; |
|
/* font-family:'Rubik','NotoSansKR',맑은고딕, Arial,sans-serif, Dotum, 돋움, "Apple SD Gothic Neo", arial; */ |
|
font-family: 'Rubik', 'NotoSansKR', sans-serif; |
|
font-style: normal; |
|
font-weight:300; |
|
vertical-align: baseline; |
|
letter-spacing: -0.3px; |
|
-webkit-font-smoothing: antialiased; |
|
} |
|
select{ |
|
/* font-family:'Rubik','NotoSansKR',맑은고딕, Arial,sans-serif, Dotum, 돋움, "Apple SD Gothic Neo", arial; */ |
|
font-family: 'Rubik', 'NotoSansKR', sans-serif; |
|
} |
|
/* HTML5 display-role reset for older browsers */ |
|
article, aside, details, figcaption, figure, |
|
footer, header, hgroup, menu, nav, section { |
|
display: block; |
|
} |
|
body { |
|
line-height: 1.4; |
|
} |
|
ol, ul { |
|
list-style: none; |
|
} |
|
blockquote, q{ |
|
quotes: none; |
|
} |
|
blockquote:before, blockquote:after, |
|
q:before, q:after { |
|
content: ''; |
|
content: none; |
|
} |
|
table { |
|
border-collapse: collapse; |
|
border-spacing: 0; |
|
} |
|
*, :after, :before { |
|
-webkit-box-sizing: border-box; |
|
-moz-box-sizing: border-box; |
|
box-sizing: border-box; |
|
} |
|
|
|
html body .content.pal-content .content-wrapper{margin-top:0;} |
|
html body .content.pal-content{min-height:100vh;} |
|
html body .content.pal-content .content-wrapper{min-height:100vh;} |
|
button{border:0;background:transparent;} |
|
|
|
|
|
/*레이아웃*/ |
|
.pal-container{background:#ddd;height:100vh;position:relative;} |
|
.map{width:calc(100% - 80px);position:absolute;right:0;} |
|
.left-layer{width:350px;height:100vh;background:#10163A;position:absolute;left:80px;color:#fff;z-index: 999;padding:14px;overflow: auto;} |
|
.right-layer{width:350px;height:100vh;background:#10163A;position:absolute;right:-350px;color:#fff;z-index: 999;padding:14px;transition: 0.5s ease;-webkit-transition: 0.5s ease;overflow:auto;} |
|
.right-layer.active{right:0px;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
.right-layer-btn{width:40px;height:40px;position:absolute;right:0px;top:50%;transform: translateY(-50%);border:0;background:#7367f0;border-top-left-radius:5px;border-bottom-left-radius:5px;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
.right-layer-btn svg{color:#fff;} |
|
.right-menu.active .right-layer-btn{right:350px;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
.layer-content + .layer-content{margin-top:14px;} |
|
.right-menu{position: absolute;right:0;height: 100vh;} |
|
|
|
/*버튼 기본css*/ |
|
.btn{font-size:0.825rem;font-weight:400;} |
|
|
|
/*레이어 상세정보-상단타이틀*/ |
|
.layer-ti{display:flex;margin-bottom:10px;} |
|
.layer-ti h4{flex:1;color:#bbb;font-weight:500;font-size:1rem;} |
|
.btn-icon{background:transparent;color:#bbb;border: 0;padding:0;margin-top: -3px;} |
|
.layer-ti .badge{font-weight:500;font-size:13px;} |
|
|
|
/*레이어 상세정보-검색*/ |
|
.layer-search .input-group .form-control{height:35px;font-size: 0.875rem;color:#b5b5b7;background:#283046;border:1px solid #404656;border-right:0;} |
|
.layer-search .input-group .form-control:focus{border-color:#7367f0;border-right:1px solid #7367f0;border-right:0px;} |
|
.layer-search .input-group .form-control::placeholder{color:#777;} |
|
.layer-search .btn{height:35px;border-top-left-radius:0;border-bottom-left-radius:0;position:relative;background:#283046;border-color:#404656;} |
|
.layer-search .btn:active{background:#7367f0;border:1px solid #7367f0;} |
|
.layer-search .btn svg{position:absolute;left:50%;top:50%;transform: translate(-50%,-50%);} |
|
|
|
/*레이어 상세정보-필터*/ |
|
.layer-filter{background:#283046;border:1px solid #404656;border-radius: 5px;} |
|
.layer-filter-ti{display:flex;align-items: center;} |
|
.layer-filter-ti h4{padding:10px;color:#bbb;font-weight:500;flex:1;} |
|
.layer-filter-ti svg{margin-right:10px;color:#bbb;} |
|
.layer-filter-content .filter-content-box{padding:10px;display:none;} |
|
.layer-filter-content .filter-content-box + .filter-content-box{padding-top:0;} |
|
.layer-filter-content .filter-content-box h5{color:#c3c3c3;font-size:0.9375rem;margin-bottom:10px;font-weight:500;} |
|
.layer-filter.active .layer-filter-ti{border-bottom:1px solid #404656;} |
|
.layer-filter.active .layer-filter-content .filter-content-box{display:block;} |
|
.layer-filter.active .layer-filter-ti svg {transform: rotate(180deg);} |
|
|
|
/*레이어 상세정보-필터-체크박스*/ |
|
.square_check{width:100%;} |
|
.square_check > div{text-align:center;border-top:1px solid #404656;} |
|
.square_check .btn{border:1px solid #404656;border-left:0px;border-radius:0px;font-size: 13px;color:#bbb;font-weight:300;} |
|
.square_check .btn:first-child{border-left:1px solid #404656;} |
|
.square_check .btn.btn-checked{background:#7367f0;color:#fff;font-weight:400;} |
|
.square_check .btn-group, .btn-group-vertical{display:flex;flex-wrap: wrap;} |
|
.square_check .btn-group.box_3n .btn{width:33.333%;padding: 14px 0;} |
|
.box_3n label:nth-child(n+1):nth-child(-n+99999){border-top:0px;} |
|
.box_3n label:nth-child(3n+1){border-left:1px solid #404656;} |
|
.square_check .btn-group.box_2n .btn{width:50%;padding: 14px 0;} |
|
.box_2n label:nth-child(n+1):nth-child(-n+99999){border-top:0px;} |
|
.box_2n label:nth-child(2n+1){border-left:1px solid #404656;} |
|
.square_check .btn-group > .btn:not(:first-child), [dir=ltr] .btn-group > .btn-group:not(:first-child){ |
|
margin-left:0px; |
|
} |
|
.square_check .btn-group > .btn:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']):first-child, |
|
.square_check .btn-group > .btn:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']):first-of-type{ |
|
border-left-color:#404656!important; |
|
} |
|
.square_check .btn-group > .btn:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']):last-child, |
|
.square_check .btn-group > .btn:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']):last-of-type{ |
|
border-right-color:#404656!important; |
|
} |
|
/*레이어 상세정보-리스트*/ |
|
.drone-list .layer-content-list{cursor: pointer;} |
|
.layer-content-list{background:#283046;border-radius: 5px;padding:10px;color:#bbb;border: 1px solid #404656;} |
|
.layer-content-list + .layer-content-list{margin-top:14px;} |
|
.layer-content-list dl dt{display:flex;} |
|
.layer-content-list dl dt + dt{margin-top:14px;} |
|
.layer-content-list dl dt div{flex:auto;font-size: 0.875rem;} |
|
.layer-content-list dl dt .list-left-txt{text-align: left;font-weight:500;min-width: 70px;} |
|
.layer-content-list dl dt .list-right-txt{text-align: right;} |
|
|
|
/*레이어 상세정보-드론상세정보*/ |
|
.layer-content-box{background:#283046;border-radius: 5px;color:#bbb; border: 1px solid #404656;} |
|
.layer-content-box .drone-ti{display:flex;align-items: center;font-weight:500; color: #f8c023;padding:10px;} |
|
.layer-content-box .drone-ti img{margin-right:6px;} |
|
.layer-content-box .drone-img img{width:100%;} |
|
.layer-content-box .layer-content-info{padding:10px;} |
|
.layer-content-box dl dt{display:flex;} |
|
.layer-content-box dl dt + dt{margin-top:14px;} |
|
.layer-content-box dl dt div{flex:auto;font-size: 0.875rem;} |
|
.layer-content-box dl dt .list-left-txt{text-align: left;font-weight:500;min-width: 70px;} |
|
.layer-content-box dl dt .list-right-txt{text-align: right;} |
|
|
|
|
|
/* 스크롤바 설정*/ |
|
*::-webkit-scrollbar{width: 6px;height:6px;} |
|
/* 스크롤바 막대 설정*/ |
|
*::-webkit-scrollbar-thumb{height:auto;background-color:#b4b7bd;/* 스크롤바 둥글게 설정*/border-radius: 10px; } |
|
/* 스크롤바 뒷 배경 설정*/ |
|
*::-webkit-scrollbar-track{background-color: rgba(0,0,0,0);} |
|
|
|
/*레이어 상세정보-날씨정보*/ |
|
.layer-weather-table > div{border-radius: 5px;} |
|
.layer-weather-address{font-size: 0.875rem;margin-bottom:10px;} |
|
.layer-weather-address span{display:block;font-weight:400;margin-top:10px;} |
|
.layer-weather-address svg{margin-top:-2px;margin-right:4px;} |
|
.layer-weather-table table{margin:0;} |
|
.layer-weather-table tr th, .layer-weather-table tr td{padding:10px 4px;text-align:center;color:#bbb;} |
|
.layer-weather-table tr th{font-weight:500;border:0;background:#343D55;} |
|
.layer-weather-table tr td{border:0;border-top:1px solid #404656;background:#10163A;font-size:13px;} |
|
.rotate-45{transform:rotate(45deg);} |
|
.rotate-75{transform:rotate(75deg);} |
|
.rotate-90{transform:rotate(90deg);} |
|
.rotate-135{transform:rotate(135deg);} |
|
.rotate-180{transform:rotate(180deg);} |
|
.rotate-225{transform:rotate(225deg);} |
|
|
|
/*tab-menu*/ |
|
.tab-menu ul{display:flex;} |
|
.tab-menu ul li{flex:1;text-align: center;padding:10px 0;font-weight:500;cursor: pointer;} |
|
.tab-menu ul li.active{border-bottom:2px solid #7367f0;} |
|
.tab-content{display:none;} |
|
.tab-content.active{display:block;} |
|
|
|
/*날씨상세정보*/ |
|
.layer-weather-box{color:#bbb;} |
|
.layer-weather-box .layer-weather-table table{border:1px solid #404656;} |
|
.layer-weather-box .layer-weather-table thead tr th{border-bottom:1px solid #404656;} |
|
.layer-weather-box .layer-weather-table tr td{border-top:0;} |
|
.layer-weather-box .layer-weather-table table tbody tr:nth-child(2n) td{background:#182444;} |
|
|
|
/*오른쪽레이어*/ |
|
.layer-switch-list dl dt{align-items: center;} |
|
.layer-switch-list dl dt + dt{margin-top:14px;} |
|
.layer-switch-list .custom-control-inline{margin-right:0;} |
|
.layer-switch-list .custom-switch .custom-control-label::before{height:20px;} |
|
.layer-switch-list .custom-switch .custom-control-label:after{left:6px;width:16px;height:16px;} |
|
.layer-switch-list .custom-switch .custom-control-label{height:16px;} |
|
.layer-switch-list .dot-icon{display:inline-block;width:6px;height:6px;border-radius:100%;vertical-align:middle;margin-right:8px;margin-top:-2px;} |
|
.layer-switch-list .dot-icon.color-red{background:#FF3648;} |
|
.layer-switch-list .dot-icon.color-pink{background:#FFA1AA;} |
|
.layer-switch-list .dot-icon.color-orange{background:#FFA800;} |
|
.layer-switch-list .dot-icon.color-brown{background:#A16B00;} |
|
.layer-switch-list .dot-icon.color-purple{background:#AB40FF;} |
|
.layer-switch-list .dot-icon.color-skyblue{background:#009cad;} |
|
.layer-switch-list svg{margin-right:8px;} |
|
.layer-switch-list .custom-switch .custom-control-label:after{top:2px;} |
|
.map-btn .btn-group, .btn-group-vertical{width:100%;} |
|
.map-btn button:hover{box-shadow:none!important;} |
|
.map-btn button{color:#bbb!important;background:#283046!important;border-color:rgba(34, 41, 47, 0.08) !important;} |
|
.map-btn button:focus{color:#7367f0;background:#7367f0!important;color:#fff!important;border-color:rgba(34, 41, 47, 0.08) !important} |
|
.map-btn .btn-primary{background:#7367f0!important;color:#fff!important;} |
|
/* .map-btn .btn-group > .btn:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']):first-child, |
|
.map-btn .btn-group > .btn:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']):first-of-type{border-left-color:transparent!important;} |
|
.map-btn .btn-group [class*='btn-']:not([class*='btn-outline-']):not([class*='btn-flat-']):not([class*='btn-gradient-']):not([class*='btn-relief-']){border-left-color:#9489ff!important;} */ |
|
/*left메뉴*/ |
|
h1.logo{width:50px;height:50px;margin:0px auto 60px auto;text-align:center;} |
|
h1.logo img{width:100%;} |
|
h1.logo span{display:block;color:#f4f4f4;font-weight:bold;letter-spacing:2px;font-size:0.9375rem;} |
|
.left-menu{width:80px;height:100vh;background:#283046;padding-top:20px;position:fixed;} |
|
.left-menu-nav, .left-menu-footer{color:#bbb;} |
|
.left-menu-nav li, .left-menu-footer li{margin-top:20px;text-align:center;} |
|
.left-menu-footer{position:absolute;bottom:20px;left:50%;transform: translateX(-50%);} |
|
.socket_on{display:block;width:32px;height:32px;border-radius:100%;background:#28C76F;position: relative;} |
|
.socket_on svg{color:#fff;margin-top:4px;} |
|
.socket_on::after{content:'';display:block;width:10px;height:10px;border:2px solid #ddd;border-radius:100%;background:#28C76F;position: absolute;right:0;bottom:0px;} |
|
.socket_off{display:block;width:32px;height:32px;border-radius:100%;background:#ed1125;position: relative;} |
|
.socket_off svg{color:#fff;margin-top:4px;} |
|
.socket_off::after{content:'';display:block;width:10px;height:10px;border:2px solid #ddd;border-radius:100%;background:#ed1125;position: absolute;right:0;bottom:0px;} |
|
.logout-btn{cursor: pointer;color:#f4f4f4;} |
|
.socket_on svg{animation: rotate-icon 5s linear infinite;transform-origin: 50% 50%;} |
|
@keyframes rotate-icon{100% {transform: rotate(360deg);}} |
|
.left-menu-nav li{margin-top:40px;} |
|
.left-menu-nav li button{color:#f4f4f4;} |
|
.left-menu-nav li button svg{color:#f4f4f4;} |
|
.left-menu-nav li button svg path{fill:#f4f4f4;} |
|
|
|
/* fligth path draw */ |
|
.left-menu-nav li .check{background-color: #283046; font-size:0.9rem; color: white; width:70px; border: 0px;} |
|
.left-menu-nav.test{position: relative; z-index: 1; cursor: pointer; float: left; display: block; margin: 0px; padding: 0px; width: 28px; height: 28px; list-style: none; box-sizing: content-box !important; background: rgb(255, 255, 255);} |
|
.left-menu-nav .test .btn-stop{margin-left:25px; width: 28px; height: 28px; display: block; border: 0px solid transparent; box-sizing: content-box !important;} |
|
.left-menu-nav .test .btn-use{margin-left:20px; width: 35px; height: 35px; display: block; border: 0px solid transparent; box-sizing: content-box !important; background-color: #009cad;} |
|
|
|
.measure-control{position:absolute; z-index:100;} |
|
|
|
.control-btn{margin-left: 7px; border-bottom: solid 1px #283046; margin-bottom:5px;} |
|
.buffer-input{text-align: center; border-radius: 100px; border: 1px solid #283046; width: 70px; margin-left: 5px;} |
|
.buffer-btn{text-align: center; border-radius: 100px; border: 1px solid #283046; width: 30px; margin-left: 5px;} |
|
|
|
/*메인-알림*/ |
|
.notice{width:650px;height:45px;overflow:hidden;position:absolute;left:50%;top:20px;transform: translate(-50%,0px);background:#283046;display:flex;font-size:0.9375rem;color:#f4f4f4;padding:0px 20px;border-radius:30px;} |
|
.notice-icon{padding:10px 0;} |
|
.notice-txt .time{margin-right:8px;} |
|
.notice-txt{flex:1;padding:0 10px;} |
|
.notice-txt dl dt{height:45px;padding:12px 0;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
.notice-btn{display:flex;flex-direction: column;} |
|
.notice-btn svg{color:#f4f4f4;} |
|
|
|
/*알림목록*/ |
|
.layer-content-list dl.notice-list dt div.list-ti .list-right-txt{font-weight:500;} |
|
.layer-content-list dl.notice-list dt{flex-direction: column;} |
|
.layer-content-list dl.notice-list dt div.list-ti{display:flex;} |
|
.layer-content-list dl.notice-list dt div.list-txt{margin-top:8px;} |
|
|
|
/*로그인*/ |
|
.login{display:flex;height:100vh;color:#bbb;position:relative;} |
|
.login-logo{position:absolute;top:80px;left:100px;color:#bbb;font-weight:bold;font-size:1.8rem;width: 100%;} |
|
.login-img, .login-form {display: flex;align-items: center;justify-content: center;} |
|
.login-img{flex:1.2;background:#161d31;} |
|
.login-form{background:#283046;width:100%;flex:0.8;flex-direction: column;} |
|
.login-form form{width:100%;padding:0 120px;} |
|
.login-form .form-control{background:transparent;border:1px solid #404656;} |
|
.login-form .form-control:focus{border-color:#7367f0;border-right:1px solid #7367f0;} |
|
.login-form .form-label-group > label{color:#bbb;} |
|
.login-form .form-control-position svg{color:#bbb;} |
|
.login-form .form-control::placeholder{color:#bbb;} |
|
.login-form .vx-checkbox-con .vx-checkbox{border-color: #404656;} |
|
.login-txt{width:100%;margin-bottom:20px;} |
|
.login-txt h2{color:#f4f4f4;font-family: "Montserrat", serif;font-size:1.8rem;font-weight:bold;text-align: center;} |
|
.login-txt p{color:#bbb;font-family: "Montserrat", serif;font-size:1.125rem;font-weight:normal;text-align: center;margin-top:20px;} |
|
.full-btn button{width:100%;margin-bottom:10px;} |
|
.login-link{margin-top:10px;} |
|
@media screen and (max-width:1280px){ |
|
.login-img, .login-form{flex:1;} |
|
.login-form form, .login-txt{padding:0 40px;} |
|
} |
|
@media screen and (max-width:900px){ |
|
.login-img{display:none;} |
|
.login-logo{left:50%;transform: translateX(-50%);text-align: center;} |
|
} |
|
|
|
/*메인 대시보드*/ |
|
.main-dashboard .card{margin-bottom:0px;} |
|
.dashboard-section{margin-top:2rem;} |
|
.menu-page div{height:120px;} |
|
.menu-page div a {width: 100%;height: 100%;padding: 0 20px;word-break: keep-all;font-size: 1.25rem;font-weight: bold;color: rgba(255,255,255,0.8);display: flex;justify-content: center;align-items: center;} |
|
.menu-list01{background:url('../../assets/images/menu001.png')#10163A;background-size:cover;background-position:50% 50%;} |
|
.menu-list02{background:url('../../assets/images/menu002.png')#10163A;background-size:cover;background-position:50% 50%;} |
|
.menu-list03{background:url('../../assets/images/menu003.png')#10163A;background-size:cover;background-position:50% 50%;} |
|
.menu-list04{background:url('../../assets/images/menu004.png')#10163A;background-size:cover;background-position:50% 50%;} |
|
.dashboard-list-ti{font-weight: 500;font-size: 1.285rem;font-size:1.125rem;border-bottom:1px solid #404656;margin:0 1rem;padding:1rem;} |
|
.dashboard-list-ti svg{margin-top:-3px;margin-right:10px;} |
|
.dashboard-list-cont .card{padding:1rem;} |
|
.dashboard-section .card-header svg{color:#bbb;} |
|
.dashboard-chart .card{height:520px;} |
|
.dashboard-chart .card .card-title{margin:10px 0;} |
|
.doughnut-chart-list{display: flex;flex-wrap: wrap;justify-content: space-evenly;margin-top:4rem;margin-bottom:1rem;} |
|
.doughnut-chart-list-ti{display:flex;align-items: center;} |
|
.doughnut-chart-list-ti .ti{font-weight:500;} |
|
.dot-icon{width:8px;height:8px;display:inline-block;background:#ddd;border-radius:100%;margin-right:10px;} |
|
.lineChartPrimary{background-color:#666ee8} |
|
.lineChartDanger{background-color:#ff4961;} |
|
.warningColorShade{background-color:#ffe802;} |
|
.warningLightColor{background-color:#FDAC34;} |
|
.successColorShade{background-color:#28dac6;} |
|
.primaryColorShade{background-color:#836AF9;} |
|
.infoColorShade{background-color:#299AFF;} |
|
.yellowColor{background-color:#ffe800;} |
|
.greyColor{background-color:#4F5D70;} |
|
.blueColor{background-color:#2c9aff;} |
|
.blueLightColor{background-color:#84D0FF;} |
|
.greyLightColor{background-color:#EDF1F4;} |
|
|
|
@media screen and (max-width:990px){ |
|
.dashboard-chart + .dashboard-chart{margin-top:2rem;} |
|
} |
|
@media screen and (max-width:767px){ |
|
.menu-page div a, .dashboard-section .card .card-title{font-size:1.125rem;} |
|
.menu-page > div + div{margin-top:2rem;} |
|
} |
|
|
|
.map-drone-icon{position: absolute;top:300px;left:500px;} |
|
.map-drone-icon.test02{top:400px;left:550px;} |
|
.map-drone-icon.test03{top:500px;left:700px;} |
|
.map-drone-icon.test04{top:600px;left:800px;} |
|
.map-drone-icon.test05{top:600px;left:900px;} |
|
.map-drone-icon.test06{top:450px;left:600px;} |
|
.map-drone-icon img{width:30px;height:30px;} |
|
.map-drone-icon .num{display:block;width:15px;height:15px;border-radius:100%;background:#ff6207;color:#fff;font-size:10px;font-weight:600;position:absolute;left:50%;top:8px;transform: translateX(-50%);text-align:center;} |
|
.map-drone-icon.icon-red .num{background:#ed1125;} |
|
.map-drone-icon.icon-yellow .num{background:#fbff00;color:#000;} |
|
.map-drone-icon.icon-skyblue .num{background:#00e7ff;color:#000;} |
|
.map-drone-icon.icon-pulple .num{background:#e682ff;} |
|
.drone-icon{width:35px;} |
|
|
|
.line-test{display:block;position:absolute;left:564px;top:425px;height:180px;width:3px;background:#ed1125;} |
|
.line-test02{display:block;position:absolute;left:713px;top:525px;height:180px;width:3px;background:#fbff00;} |
|
.line-test03{display:block;position:absolute;left:813px;top:625px;height:180px;width:3px;background:#00e7ff;} |
|
.line-test04{display:block;position:absolute;left:914px;top:625px;height:180px;width:3px;background:#e682ff;} |
|
|
|
/*분석이력-검색조건*/ |
|
.search-cont dl dt + dt{margin-top:-1px;} |
|
.search-box{display:flex;border:1px solid #404656;align-items: center;font-size: 0.875rem;height:50px;} |
|
.search-box input{font-size: 0.875rem;} |
|
.search-list-ti{background:#343D55;min-width:150px;width:150px;text-align:center;height:48px;line-height:48px;font-weight:500;} |
|
.search-list{display:flex;align-items: center;padding:0 20px;width:100%;} |
|
.search-list .calendar-flat{border:1px solid #404656;border-radius: 0.357rem;height: 2.142rem;padding: 0 20px;} |
|
.search-list .calendar-flat input{padding:0px;text-align:center;} |
|
.search-list .calendar-flat:hover{border:1px solid #7367f0;} |
|
.search-list-cont{width:100%;} |
|
.search-list-cont-btn .btn{border-radius:0px;border-color: #404656!important;color:#bbb;} |
|
/* .search-list-cont-btn .btn:focus{background-color: #7367f0!important;color:#fff!important;} */ |
|
.search-list-cont-btn .btn.active{background-color: #7367f0!important;color:#fff!important;} |
|
.search-list-cont .custom-control-label{color:#bbb;font-size: 0.875rem;} |
|
.cont-ti{padding-bottom:10px!important;} |
|
.cont-ti > div{display:flex;justify-content: space-between;align-items: center;} |
|
/* .cont-ti button{margin-right:8px;} */ |
|
.cont-ti h4{font-weight:500;color:#bbb;font-size:1.125rem;} |
|
.pt-14{padding-top:14px;} |
|
.cont-ti .btn svg{margin-top:-4px;margin-right:4px;} |
|
.pal-card-body{padding:0px;} |
|
.table.pal-table {color:#bbb;text-align: center;border-bottom:1px solid #3b4253;} |
|
.table.pal-table tr th{font-size: 0.875rem;font-weight:500;padding: 0.72rem 0.5rem;} |
|
.table.pal-table tr td{font-size: 0.875rem;padding: 0.72rem 0.5rem;} |
|
.table.pal-table .td-link{color:#bbb;text-decoration:underline;cursor: pointer;} |
|
.search-case{font-weight:500;font-size:13px;margin-left:14px;color:#ff9f43 ;background-color:rgba(255, 159, 67, 0.12);padding: 0.3rem 0.5rem;border-radius: 0.358rem;} |
|
.pd-0{padding: 0px!important;} |
|
.search-list-cont .form-group{margin-bottom:0px;justify-content: space-between;} |
|
/* .search-list-cont .form-group input{width:calc(100% - 50px);} */ |
|
.search-list-cont .form-group button{height: 2.142rem;margin:0px;} |
|
.search-list-cont .form-group button svg{margin-top:-7px;} |
|
.search-list-cont .form-label-group > label{font-size:0px;} |
|
@media (max-width: 768px){ |
|
.search-box{display:block;height:auto;} |
|
.search-list-ti{width:100%;height:40px;line-height:40px;} |
|
.search-list{padding: 10px 20px;width:100%;display: block;} |
|
/* .search-list-cont + .search-list-cont{margin-left:0px;} */ |
|
.search-list-cont-btn{width:100%;} |
|
.search-list-cont-btn .btn{width:25%} |
|
.search-list-cont .list-input + .list-input{padding-left:1rem;} |
|
.search-box-date .list-input{flex: 0 0 100%;max-width: 100%;} |
|
} |
|
@media (max-width: 767px){ |
|
.search-list-cont .list-input + .list-input{margin-top:10px;} |
|
} |
|
.tooltip-test{position:absolute;left:500px;top:500px;} |
|
|
|
.tooltip-box{background:#283046;padding:10px;border-radius:6px;position:relative;max-width: 180px;} |
|
.tooltip-box div{text-align:left;font-size:13px;color:#bbb;} |
|
.tooltip-ti{border-bottom:1px solid #bbb;padding-bottom:4px;} |
|
.tooltip-ti span, .tooltip-txt .ti{color:#f4f4f4;font-weight:500;display:block;} |
|
.tooltip-txt{padding-top:4px;} |
|
.tooltip-txt-list + .tooltip-txt-list{margin-top:4px;} |
|
.tooltip-box .arrow {position:absolute;bottom:-10px;left:50%;transform: translateX(-50%);display:block;width: 0px;height: 0px;border-top:10px solid #283046;border-bottom:10px solid none;border-right: 10px solid transparent;border-left: 10px solid transparent;} |
|
|
|
/* 데이터블록 */ |
|
.dblock-box{background:#283046;padding:10px;border-radius:6px;position:relative;} |
|
.dblock-box div{text-align:left;font-size:13px;color:#bbb;} |
|
.dblock-ti{border-bottom:1px solid #bbb;padding-bottom:4px;} |
|
.dblock-ti span, .dblock-txt .ti{color:#f4f4f4;font-weight:500;display:block;} |
|
.dblock-txt{padding-top:4px;} |
|
.dblock-txt-list + .dblock-txt-list{margin-top:4px;} |
|
.dblock-box .arrow {position:absolute;bottom:-10px;left:50%;transform: translateX(-50%);display:block;width: 0px;height: 0px;border-top:10px solid #283046;border-bottom:10px solid none;border-right: 10px solid transparent;border-left: 10px solid transparent;} |
|
|
|
/*회원가입*/ |
|
.pal-register .auth-wrapper.auth-v1 .auth-inner{max-width:1200px;} |
|
.pal-register .content-header .sub-txt{display:block;margin-bottom:1rem;} |
|
.pal-register .content-header h5{font-size:1.25rem;font-weight:500;margin-bottom:10px;} |
|
.pal-register .form-border .custom-checkbox{border-bottom:1px solid #404656;padding-bottom:14px;} |
|
.pal-register .terms-box{width:100%;background:#161d31;height:150px;border:1px solid #404656;border-radius:6px;padding:14px;font-size: 0.875rem;margin-top:14px;overflow: auto;} |
|
.pal-register .form-border-terms{border-bottom:1px solid #404656;padding-bottom:14px;} |
|
input:-webkit-autofill, |
|
input:-webkit-autofill:hover, |
|
input:-webkit-autofill:focus, |
|
input:-webkit-autofill:active { |
|
transition: background-color 5000s ease-in-out 0s; |
|
-webkit-transition: background-color 9999s ease-out; |
|
-webkit-box-shadow: 0 0 0px 1000px transparent inset !important; |
|
-webkit-text-fill-color: #b4b7bd !important; |
|
} |
|
input:-internal-autofill-selected { |
|
background-color: transparent !important; |
|
background-image: none !important; |
|
color: rgb(0, 0, 0) !important; |
|
} |
|
/* .pal-register .bs-stepper-header{display:none;} */ |
|
.pal-register .app-collapse .card-header{padding:1rem 0;} |
|
.terms-all-check{border-bottom:1px solid #3b4253;padding-bottom:1rem;} |
|
.terms-check{padding:14px 0;border-bottom:1px solid #3b4253;} |
|
.terms-cont{background:#161d31;padding:10px;margin-top:10px;border-radius:6px;font-size: 0.875rem;height:200px;overflow:auto;} |
|
/* .pal-register .form-group label{margin-bottom:0px;} */ |
|
.pal-register .bs-stepper .bs-stepper-header{padding-bottom:0px;} |
|
/* .terms-check .collapse-default .card:last-child{border-bottom:1px solid #3b4253;} |
|
.terms-check .card-body .card-text{height:110px;background:#161d31;padding:10px;font-size: 0.875rem;overflow:auto;border-radius:6px;} |
|
.terms-check [class*='collapse-'] .card .card-body{padding:0 0 1rem 0;} */ |
|
.pal-register input, .pal-register select{font-size: 0.875rem;} |
|
.input-btn{display:flex;flex-wrap: wrap;} |
|
.input-btn [class*='col']{padding:0px;} |
|
.input-btn [class*='col'] + [class*='col']{padding-left:10px;} |
|
@media screen and (max-width:767px){ |
|
.input-btn [class*='col'] + [class*='col']{padding-left:0px;margin-top:10px;} |
|
} |
|
|
|
.input-btn input + input{margin-right:10px;} |
|
.input-btn button{padding:0.5rem;min-width:130px;} |
|
.pal-register .form-label{margin-bottom:4px;font-weight: 400;} |
|
.necessary{vertical-align: middle;margin-right:4px;} |
|
.user-phone-btn{position: absolute;top: -6px;right: 17px;} |
|
.user-phone-btn .time{font-size: 0.875rem;font-weight:400;margin-right:10px;vertical-align: middle;} |
|
.user-phone-btn button{height:25px;line-height:23px;padding:0px 14px;} |
|
.user-phone-btn button span{font-size:13px;} |
|
|
|
/*헤더메뉴*/ |
|
.header-main-menu{margin-bottom:0px;} |
|
|
|
/*팝업창*/ |
|
.modal-title{font-weight:500;font-size:1.125rem;} |
|
|
|
/*기본css 수정*/ |
|
.badge{font-weight:500;} |
|
.form-control-sm{line-height: 1.4;} |
|
.table{margin-bottom:0px;} |
|
.form-group label{margin-bottom:4px;} |
|
.custom-control-inline{align-items: center;} |
|
/* .flatpickr-input{min-width:235px;} */ |
|
.flatpickr-monthDropdown-months{line-height: 1.2!important;} |
|
/*creatable-select*/ |
|
.creatable-select .select__control{border:1px solid #3b4253;padding:0 10px;min-height: 2.142rem;cursor: text;} |
|
.creatable-select .select__menu div div{padding:10px;} |
|
.creatable-select .select__control input{color:#bbb!important;} |
|
/*상세정보*/ |
|
.search-info-box{display:flex;align-items: center;justify-content:center;font-size: 0.875rem;height:auto;width:100%;} |
|
/* @media (max-width: 768px){ |
|
.search-info-box{justify-content:center;} |
|
} */ |
|
.search-info-box .row{width:100%;} |
|
.complete-txt{text-align: center;border-radius:6px;padding:0px 20px 40px 20px;} |
|
.big-txt{font-size:30px;font-weight:200;display:block;margin:20px 0;} |
|
.complete-txt button{width:100%;max-width:200px;margin-top:30px;} |
|
.search-info-ti .ti{font-size:1rem;font-weight:500;margin-bottom: 10px;} |
|
.search-info dl dt + dt{border-top:1px dotted #404656;padding-top:1rem;} |
|
.search-info .final span{font-weight:500;font-size: 0.875rem;} |
|
.mb-10p{margin-bottom:10px;} |
|
/*서브 레프트메뉴*/ |
|
.pal-main-menu-content .pal-navigation-main > li:first-child a{cursor: default;padding-left:8px;/*border-bottom:2px solid #7367f0;*/} |
|
.pal-navigation-main > li:first-child a > span{font-size:1.125rem;font-weight:500;} |
|
.pal-navigation-main li:first-child a > *{transition: none!important;} |
|
.pal-navigation-main li:first-child a:hover > *{transition: none!important;transform: none!important;} |
|
.pal-navigation-main li a{font-size:1rem;} |
|
.pal-navigation-main li .menu-content li a{font-size: 0.875rem;} |
|
.pal-navigation-main li .menu-content li a span{position: relative;padding-left:14px;} |
|
.pal-navigation-main li .menu-content li a span::before{content:'';display:block;width:5px;height:1px;position:absolute;top:50%;left:0px;background:#d0d2d6;} |
|
|
|
/*카드형식 레이아웃*/ |
|
.pal-card{background:#343D55;border-radius:6px;padding:1rem;} |
|
.pal-card-box{background:#283046;padding:20px;border-radius:6px;} |
|
.pal-card-box + .pal-card-box{margin-top:2rem;} |
|
.pal-card-box .card{margin-bottom:0px;} |
|
.pal-card-header{display: flex;min-height:40px;align-items: center;justify-content: space-between;flex-direction: row;margin-bottom:14px;} |
|
.pal-card-header h3{font-size:1.1875rem;font-weight:500;} |
|
.pal-card .card{margin-bottom:0px;} |
|
.search-info{padding:20px;} |
|
.search-info .cont-ti{padding-bottom:14px!important;border-bottom:1px solid #404656;} |
|
.font-sm{font-size: 0.875rem;} |
|
.pal-card-body .form-group label{margin-bottom:4px;} |
|
.count-del-btn button{height: 2.142rem; width: 100%;padding: 0 12px;} |
|
@media screen and (max-width:768px){ |
|
.count-del-btn{margin-top:10px;} |
|
.count-del-btn button span{display:none;} |
|
.count-del-btn button svg{margin:0px!important;} |
|
} |
|
.count-add-btn{padding-left:-10px;} |
|
.count-box{margin-bottom:1rem;} |
|
.count-box .form-label-group{margin-bottom:0px;} |
|
.count-box form + form{margin-top:1rem;} |
|
.count-box .sm-ti{margin-bottom:4px;display: inline-block;} |
|
.sm-ti{font-weight:500;font-size: 14px;} |
|
/*그리드*/ |
|
|
|
.react-dataTable.pal-dateTable{border-bottom:1px solid #3b4253;} |
|
.react-dataTable.pal-dateTable .rdt_TableHead .rdt_TableHeadRow .rdt_TableCol div[role='button'] div{font-size: 0.875rem;font-weight:500;} |
|
.react-dataTable.pal-dateTable .rdt_TableBody .rdt_TableRow{min-height:40px;background: #242b3d !important;} |
|
.react-dataTable.pal-dateTable .rdt_TableBody .rdt_TableRow .rdt_TableCell{height:40px;} |
|
.react-dataTable.pal-dateTable .rdt_TableBody .rdt_TableRow .rdt_TableCell{font-size: 0.875rem;} |
|
.react-dataTable.pal-dateTable .rdt_TableBody .rdt_TableRow .rdt_TableCell .badge.btn{font-size:85%!important;} |
|
.pal-dateTable a{color:#bbb;text-decoration: underline;} |
|
|
|
@media only screen and (min-width: 768px) and (max-width: 1024px){ |
|
.search-list-cont-btn button{font-size:12px;padding:10px 4px;} |
|
} |
|
|
|
.no-dataTable{font-size: 0.875rem;} |
|
|
|
/*메뉴 관리*/ |
|
|
|
.tree-menu {border-radius: 2px;box-shadow: 0 0 50px rgba(0, 0, 0, 0.1);margin-top:1rem;padding:20px;border-radius:6px;background:#161d31;max-height: 610px;overflow: auto;} |
|
.tree-menu-list ul {margin-left:10px;padding-left:20px;border-left: 1px dashed #bbb;} |
|
.tree-menu-list li {color:#bbb;font-size: 14px;font-weight:300;line-height:2rem;} |
|
.tree-menu-list li > div{display:inline-block;} |
|
.tree-menu-list li span{cursor: pointer;} |
|
.tree-menu-list.no-cursor li span{cursor: default;} |
|
.tree-menu-list li a{color:#bbb;} |
|
.tree-menu-list .folder, |
|
.tree-menu-list .folder > a {color: #ddd;font-size:0.9375rem;font-weight: 400;} |
|
.tree-menu-list li:before { |
|
margin-right: 8px; |
|
content: ""; |
|
height: 20px; |
|
vertical-align: middle; |
|
width: 20px; |
|
background-repeat: no-repeat; |
|
display: inline-block; |
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path fill='lightgrey' d='M85.714,42.857V87.5c0,1.487-0.521,2.752-1.562,3.794c-1.042,1.041-2.308,1.562-3.795,1.562H19.643 c-1.488,0-2.753-0.521-3.794-1.562c-1.042-1.042-1.562-2.307-1.562-3.794v-75c0-1.487,0.521-2.752,1.562-3.794 c1.041-1.041,2.306-1.562,3.794-1.562H50V37.5c0,1.488,0.521,2.753,1.562,3.795s2.307,1.562,3.795,1.562H85.714z M85.546,35.714 H57.143V7.311c3.05,0.558,5.505,1.767,7.366,3.627l17.41,17.411C83.78,30.209,84.989,32.665,85.546,35.714z' /></svg>"); |
|
background-position: center 2px; |
|
background-size: 60% auto; |
|
} |
|
.tree-menu-list li.folder:before { |
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path fill='lightblue' d='M96.429,37.5v39.286c0,3.423-1.228,6.361-3.684,8.817c-2.455,2.455-5.395,3.683-8.816,3.683H16.071 c-3.423,0-6.362-1.228-8.817-3.683c-2.456-2.456-3.683-5.395-3.683-8.817V23.214c0-3.422,1.228-6.362,3.683-8.817 c2.455-2.456,5.394-3.683,8.817-3.683h17.857c3.422,0,6.362,1.228,8.817,3.683c2.455,2.455,3.683,5.395,3.683,8.817V25h37.5 c3.422,0,6.361,1.228,8.816,3.683C95.201,31.138,96.429,34.078,96.429,37.5z' /></svg>"); |
|
background-position: center top; |
|
background-size: 75% auto; |
|
} |
|
.tree-menu-list .custom-checkbox{padding-left:1.8rem;margin-right:0;min-height: 1rem;} |
|
@media screen and (max-width:991px){ |
|
.pal-card-box-many > [class*='col'] + [class*='col']{margin-top:2rem;} |
|
} |
|
|
|
.card-body-tab-cont{padding:20px;} |
|
.card-body-tab-cont .tab-content{display:block;} |
|
.card-body-tab-cont .form-group label{margin-bottom:4px;} |
|
|
|
.modal-box{padding:20px 0;} |
|
.modal-box .ti{font-weight:500;font-size:1.5rem;margin:0 0 20px 0;} |
|
.modal-box .ti svg{margin:0 4px;} |
|
|
|
.input-inline-btn{align-items: flex-end;} |
|
.input-inline-btn button{padding:0.6rem;width:100%;} |
|
.input-inline-btn .time{font-size: 0.875rem;font-weight:400;vertical-align: middle;display:block;text-align:right;margin-bottom:4px;} |
|
@media screen and (min-width:767px){ |
|
.input-inline-btn div:first-child{padding-right:0px;} |
|
} |
|
@media screen and (max-width:768px){ |
|
.input-inline-btn button{margin-top:10px;} |
|
.input-inline-btn .time{position: absolute;top: -58px;right: 17px;} |
|
} |
|
/* .input-inline-btn [class*='col']{padding:0px;} |
|
.input-inline-btn [class*='col'] + [class*='col']{padding-left:10px;} |
|
@media screen and (max-width:767px){ |
|
.input-inline-btn [class*='col'] + [class*='col']{padding-left:0px;margin-top:10px;} |
|
} */ |
|
|
|
|
|
.media-img{width:300px;height:300px;margin: 0px auto;border-radius:6px;} |
|
.media-img img{width:100%;height:100%;border-radius:6px;} |
|
.no-img{width:300px;background:#404656;border-radius:6px;height:300px;display: flex;flex-direction: column;align-items: center;justify-content: center;} |
|
.no-img svg{width:100px;height:100px;} |
|
/* .no-img:after {content: "";display: block;padding-bottom: 100%;} */ |
|
.media-btn-2n > label, .media-btn-2n > button{flex:1;} |
|
@media screen and (max-width:1600px){ |
|
.media-img{width:200px;height:200px;} |
|
.no-img{width:200px;height:200px;} |
|
} |
|
@media screen and (max-width:990px){ |
|
.media-img{width:280px;height:280px;} |
|
.no-img{width:280px;height:280px;} |
|
} |
|
|
|
@media screen and (max-width:768px){ |
|
.pal-media{margin-bottom:1rem;} |
|
} |
|
|
|
.layer-search-form > div + div{margin-top:10px;} |
|
.layer-search-form > div .btn{border-radius:0.358rem;width:100%;} |
|
|
|
/*데이터피커 (달력) 기본 css*/ |
|
.calendar-flat{border:1px solid #404656;background: #283046;border-radius: 0.357rem;height: 2.142rem;padding: 0 20px;} |
|
.calendar-flat input{padding:0px;font-size: 0.875rem;} |
|
.calendar-flat:hover{border:1px solid #7367f0;} |
|
|
|
/*시뮬레이터*/ |
|
.sm-txt{font-size: 0.875rem;color:#bbb;} |
|
.pd-20{padding:20px;} |
|
.simulation-wrap{position:absolute;right:0;bottom:0px;height:auto;width:calc(100% - 430px);z-index: 999;background:#283046;border-left:1px solid #404656;border-bottom:0;overflow:hidden;transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
.simulation-wrap.full{width:calc(100% - 80px);transition: 0.5s ease;-webkit-transition: 0.5s ease;} |
|
.simulation-cont{display:flex;width:100%;justify-content:space-between;align-items: center;} |
|
.simulation-slider{width:100%;} |
|
.simulation-ti{display:flex;background: #7367f0;color: #fff; padding: 10px 20px;} |
|
.simulation-ti div{font-size:1rem;font-weight:500;} |
|
.simulation-ti-btn{padding:0;background-color: transparent!important;border:none;margin-right:1rem;} |
|
.simulation-ti-btn:focus{background-color: transparent!important;border:none;} |
|
.simulation-slider-time{display:flex;padding:0 50px 0 20px;} |
|
.simulation-slider-time .noUi-pips{display:none;} |
|
.simulation-slider-time .btn{margin-right:20px;padding:0;width:35px;height:35px;} |
|
.simulation-cont-box{display:flex;flex-direction: column;} |
|
.simulation-cont-box + .simulation-cont-box{margin-left:2rem;} |
|
.simulation-cont-box > div{flex:1;} |
|
.simulation-cont-box-row{display:flex;flex-direction: row;justify-content: space-between;align-items: center;} |
|
.simulation-cont-box span.ti, .simulation-cont-box span.txt{display:block;font-size: 0.875rem;} |
|
.simulation-cont-box span.ti{font-weight:500;} |
|
.simulation-cont-box-info{margin-top:20px;} |
|
.simulation-cont-box-list{flex:1;min-width:100px;flex-direction: column;border:1px solid #82868b;border-radius:6px;} |
|
.simulation-cont-box-list .ti{background:#82868b;display: block;color:#fff;padding:4px 10px;} |
|
.simulation-cont-box-list .txt{padding:4px 10px;} |
|
.simulation-cont-box-list:nth-child(4){min-width:180px;} |
|
.simulation-cont-box-list + .simulation-cont-box-list{margin-left:1rem;} |
|
.drone-info .badge{min-width:180px;display: flex;justify-content: space-between;} |
|
.drone-info .badge + .badge{margin-top:10px;} |
|
.drone-info .badge .txt{display:inline-block;} |
|
.simulation-cont-box .drone-location{justify-content: space-between;align-items: center;text-align:center;} |
|
.drone-location{ flex: 1;text-align: center;} |
|
.drone-location .border-primary{flex: 1;border-radius:6px;} |
|
.drone-location .border-primary .ti{padding:4px 10px;font-size: 0.875rem;background:#7367f0;color:#fff;} |
|
.drone-location .border-primary .txt{padding:4px 10px;} |
|
.drone-location .border-secondary{flex: 1;border-radius:6px;} |
|
.drone-location .border-secondary .ti{padding:4px 10px;font-size: 0.875rem;background:#82868b;color:#fff;} |
|
.drone-location .border-secondary .txt{padding:4px 10px;} |
|
.drone-location .simulation-icon{flex:0.7;} |
|
.simulation-date{height:auto;padding:0 20px;} |
|
.simulation-date-cont{height: auto;display:flex;font-size: 0.875rem;} |
|
.simulation-date-cont-ti{width:100px;position:fixed;background:#283046;border-right:1px solid #404656;} |
|
.simulation-date-cont-ti div{font-weight:500} |
|
.simulation-date-cont-ti div:first-child{color:#ff9f43;font-weight:600;} |
|
.simulation-date-num div:first-child{background-color: rgba(255, 159, 67, 0.12);color: #ff9f43;padding: 0.3rem 0.5rem;text-align: center;border-radius: 0.358rem;display: inline-block;font-weight: 600;line-height: 1;white-space: nowrap;vertical-align: baseline; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, background 0s, border 0s;} |
|
.simulation-date-num{padding:0 0.5rem;text-align:center;font-size:13px;} |
|
.simulation-date-num{border-right:1px solid #404656;} |
|
.simulation-date-cont-ti div, .simulation-date-num div{margin-bottom:4px;} |
|
.simulation-date-num-pd{display: flex;padding-left:100px;} |
|
.simulation-cont-box-img{flex-direction: row;} |
|
.simulation-cont-box-img .img-box{width:130px;height:130px;margin-right:10px;} |
|
.simulation-cont-box-img .img-box img{width:100%;height:100%;} |
|
.simulation-cont-box-img .no-img{max-height:auto;} |
|
.simulation-cont-box-img .no-img svg{width:50px;height:50px;} |
|
.simulation-cont-box-img .badge{min-width:180px;display:flex;justify-content:space-between;} |
|
.simulation-cont-box-img .badge + .badge{margin-top:10px;} |
|
.simulation-icon svg{fill:#5d6373} |
|
.date-num-focus{background:#7367f0;border-radius: 6px;color:#fff;} |
|
.simulation-date-num.date-num-focus div:first-child{background: #ff9f43;color:#fff;} |
|
|
|
.scroll-container {padding-bottom:10px;} |
|
/* |
|
@media screen and (max-width:1400px){ |
|
} |
|
@media screen and (max-width:1024px){ |
|
.simulation-cont{flex-direction: column;} |
|
.drone-info-flex{display:flex;} |
|
.drone-info .badge{flex:1;min-width:auto;} |
|
.drone-info .badge + .badge{margin-top:0px;margin-left:1rem;} |
|
.simulation-cont-box + .simulation-cont-box{margin-left:0px;} |
|
.simulation-cont-box + .simulation-cont-box{margin-left:0px;margin-top:1rem;} |
|
.simulation-cont-box-img{display:flex;} |
|
.simulation-cont-box-list{margin-top: 1rem;min-width:auto;} |
|
} |
|
@media screen and (max-width:768px){ |
|
.simulation-cont-box-list{min-width:auto;} |
|
} */ |
|
|
|
/*datepicker-custom*/ |
|
.datepicker-custom {display: flex;align-items:center;cursor: pointer;} |
|
.datepicker-custom input{cursor: pointer;} |
|
.datepicker-custom .react-datepicker{background:#161d31;border-color:#161d31;color:#b4b7bd;font-size:0.875rem;font-weight:400;} |
|
.datepicker-custom .react-datepicker__header{background:transparent;border-color:transparent;color:#b4b7bd;font-size: 1.1rem;font-weight:300;} |
|
.datepicker-custom .react-datepicker__year-read-view--down-arrow, |
|
.datepicker-custom .react-datepicker__month-read-view--down-arrow, |
|
.datepicker-custom .react-datepicker__month-year-read-view--down-arrow, |
|
.datepicker-custom .react-datepicker__navigation-icon::before{border-width: 1px 1px 0 0;top: 12px;} |
|
.datepicker-custom .react-datepicker__navigation:hover *::before {border-color: #7367f0;} |
|
.datepicker-custom .react-datepicker__day--keyboard-selected, |
|
.datepicker-custom .react-datepicker__month-text--keyboard-selected, |
|
.datepicker-custom .react-datepicker__quarter-text--keyboard-selected, |
|
.datepicker-custom .react-datepicker__year-text--keyboard-selected{background:#7367f0;} |
|
.datepicker-custom .react-datepicker__month-text.react-datepicker__month--selected:hover, |
|
.datepicker-custom .react-datepicker__month-text.react-datepicker__month--in-range:hover, |
|
.datepicker-custom .react-datepicker__month-text.react-datepicker__quarter--selected:hover, |
|
.datepicker-custom .react-datepicker__month-text.react-datepicker__quarter--in-range:hover, |
|
.datepicker-custom .react-datepicker__quarter-text.react-datepicker__month--in-range:hover, |
|
.datepicker-custom .react-datepicker__quarter-text.react-datepicker__quarter--selected:hover, |
|
.datepicker-custom .react-datepicker__quarter-text.react-datepicker__quarter--in-range:hover {background-color:#7367f0;color:#b4b7bd;} |
|
.datepicker-custom .react-datepicker__month-text:hover, |
|
.datepicker-custom .react-datepicker__quarter-text:hover {background-color: rgba(57,57,57,0.3);} |
|
.datepicker-custom .react-datepicker__month .react-datepicker__month-text, |
|
.datepicker-custom .react-datepicker__month .react-datepicker__quarter-text{width:40px;height:40px;line-height:40px;border-radius:100%;} |
|
.datepicker-custom .react-datepicker__month .react-datepicker__month-text, |
|
.datepicker-custom .react-datepicker__month .react-datepicker__quarter-text {margin:5px;} |
|
.datepicker-custom .react-datepicker__triangle{display:none;} |
|
.datepicker-border-sm{border:1px solid #404656;padding:0 20px;border-radius:20px;} |
|
.datepicker-border-sm input{width:100px;height:34px;padding:0 0 0 1rem;} |
|
|
|
|
|
.m_ft{display:flex;align-items:flex-end; justify-content: space-between;} |
|
.m_ft_box{flex:0 0 49%} |
|
.m_ft_box + .m_ft_box{margin-left:1%} |
|
|
|
.layer-content-box .history-btn{border-radius:4px;display:block;width:100%;height:45px;line-height:45px;text-align:center;font-size: 0.875rem;color:#ddd;font-weight:500;} |
|
.layer-content-box .history-btn:hover{border-radius:4px;background:#00cfe8;border-color:#00cfe8;transition: 0.3s ease;-webkit-transition: 0.3s ease;} |
|
.historyModal .drone-ti span{font-weight:500;margin-top:6px} |
|
.historyModal .drone-name{color:#00cfe8;margin:0 10px 0 0;} |
|
|
|
.search-info-box-del-btn{display: flex; align-items: center;} |
|
.search-info-box-del-btn button{cursor: pointer;margin-top:10px} |
|
@media (max-width: 992px){ |
|
.search-info-box-del-btn button { |
|
margin-bottom:1rem; |
|
margin-top:0px; |
|
} |
|
} |
|
|
|
.login .info-search .pal-card{width:95%;} |
|
.login-form.info-search form{padding:0;} |
|
.info-search .input-btn button{width:100%; padding: 0.786rem 1.5rem;} |
|
.full-btn-2n{display:flex;justify-content:space-between;} |
|
.full-btn-2n button{width:49%;} |
|
.timeInput{position:relative;} |
|
.timeInput .time{position:absolute;right:16px;top:50%;transform: translateY(-50%);font-size:14px;} |
|
.user-search-id{font-weight:500;} |
|
.user-search-modal .modal-body{font-size:1.125rem;padding:30px 20px} |
|
.user-search-modal .modal-body .etc-txt{display:block;font-weight:500;margin-bottom:1rem} |
|
.user-search-link button{font-size:0.875rem;margin-top:20px} |
|
|
|
/* 지도 검색 */ |
|
.search-comp{position:relative; z-index:100;margin:10px} |
|
.search-feather{width:400px;} |
|
.search-result-comp{background-color:#fff;} |
|
.search-result{padding:8px 10px} |
|
.search-result:hover{background-color:#e7e7e7} |
|
.search-result .title{font-size:0.9rem;color:#000;} |
|
.search-result .address{font-size:0.875rem;color:#343D55} |
|
|
|
.pal-modal-body{padding:0;} |
|
.pal-modal-body .pal-card-box + .pal-card-box{margin-top:0;} |
|
|
|
/*그리드 로딩*/ |
|
.grid-loading{width:100%;height:100%;position: absolute;background:rgba(35, 41, 58, 0.7);z-index:999;display:flex;align-items:center;justify-content: center;text-align:center;} |
|
.grid-loading span{display:block;font-weight:500;margin-top:4px;} |