@font-face{font-family:Pretendard-Regular;src:url(https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}*{font-family:Pretendard-Regular;margin:0;padding:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}body,html{overflow:hidden}#map,body,html{width:100%;height:100%}#map{position:absolute;top:0;left:0;z-index:201}canvas{width:100vw;height:100vh;display:block}#webglCanvasDiv{z-index:200}#webglCanvas,#webglCanvasDiv{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}#webglCanvas{background-color:black}#tooltipCanvas{z-index:450}#poiCanvas,#tooltipCanvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}#poiCanvas{z-index:250}#logo-kiost-background{position:fixed;top:100px;left:10px;width:45px;border-radius:10px;height:25px;background-color:rgba(0,0,0,.9);transition:background-color .3s;cursor:pointer;z-index:500}#logo-kiost-background:hover{transform-origin:left bottom;transform:scale(2.7);transition:transform .3s;background-color:rgba(50,50,50,.9)}#logo-kiost{position:relative;top:3px;left:5px;width:35px;opacity:1;z-index:1000}#itemBar{position:fixed;top:140px;left:10px;width:45px;border-radius:20px;height:270px;background-color:rgba(0,0,0,.9);transition:background-color .3s;cursor:pointer;z-index:500}.item-bg{position:absolute;width:90%;height:40px;left:5%;border-radius:15px;overflow:hidden;background-color:rgb(97,97,97,0);z-index:510}#item-bg-ocurrent{top:15px}#item-bg-waveHeight{top:65px}#item-bg-surfElevation{top:115px}#item-bg-temperature{top:165px}#item-bg-salinity{top:215px}.item-bg:hover{background-color:rgb(97,97,97,.9)}.item-bg-selected{background-color:rgba(0,161,212,1)}.item-bg-selected:hover{background-color:rgba(119,191,212,.9)}#item-ocurrent,#item-salinity,#item-surfElevation,#item-temperature,#item-waveHeight{position:absolute;left:0;width:40px;visibility:visible;z-index:520}#itemBar:hover{width:120px;transition:background-color .3s;transition:width .3s;background-color:rgba(50,50,50,.9)}#itemBar:hover #item-ocurrent,#itemBar:hover #item-salinity,#itemBar:hover #item-surfElevation,#itemBar:hover #item-temperature,#itemBar:hover #item-waveHeight{width:40px;left:10px}.item-text{position:absolute;left:15px;width:100%;padding:5px;text-align:center;color:#fff;font-size:1em;visibility:hidden;top:5px;z-index:520}#itemBar:hover .item-text{visibility:visible}#buoyBar{position:fixed;top:420px;left:10px;width:45px;border-radius:20px;height:50px;background-color:rgba(0,0,0,.9);transition:background-color .3s;transition:width .3s;cursor:pointer;z-index:500}#buoyBar:hover{width:120px;background-color:rgba(50,50,50,.9)}#item-bg-buoy{top:5px}.item-img{position:absolute;left:5px;top:5px;width:35px;height:35px;visibility:visible;z-index:520}#buoyBar:hover .item-img{width:40px;left:10px}#buoyBar:hover .item-text{visibility:visible}#buoyBar.buoy-selected{background-color:rgba(0,161,212,1)}#buoyBar.buoy-selected:hover{background-color:rgba(119,191,212,.9)}.itemIcons{position:fixed;left:10px;width:40px;height:40px;border-radius:20px;background-color:rgba(0,0,0,.9);transition:background-color .3s;cursor:pointer;display:flex;justify-content:center;align-items:center;z-index:500}.itemIcons:hover{background-color:rgba(50,50,50,.9)}.itemIcons:active{transform:scale(.9)}#showInfoButton{bottom:180px}#detectGps{pointer-events:auto;bottom:120px}.fa-info-circle,.fa-times-circle{color:rgba(0,161,212,1)}#showInfoButton i.selected{display:flex}#showInfoButton i{display:none}#timeBarWrapper{position:fixed;bottom:20px;left:20px;width:100%;height:60px;display:flex;justify-content:center;align-items:center;z-index:1000}.timeBar{width:60px;height:35px;background-color:rgba(10,10,10,.9);color:white;font-family:Pretendard-Regular;font-size:.9rem;transition:height .05s}.timeBar.currentTime:hover{transform:translateY(0);border-radius:0}.timeBar:hover{bottom:20px;height:80px;background-color:rgba(20,20,20,.9);border-radius:5px}#timeBarCurrentTime{top:0;width:40px;border-top-left-radius:10px;border-bottom-left-radius:10px;position:relative}#timeBarCurrentTime:hover:before{content:"현재 시각으로 설정";width:110px;position:absolute;top:-30px;left:0;background-color:rgba(0,0,0,.8);color:white;padding:5px 10px;border-radius:5px}#timeBarPlay{width:40px;border-top-right-radius:10px;border-bottom-right-radius:10px}.timeBarBtn{display:none;width:100%;background-color:rgba(87,164,187,.9);color:white;border:none;font-size:1.2rem;cursor:pointer;border-radius:5px}.timeBarText{width:100%;height:35px;display:flex;justify-content:center;align-items:center;color:white;font-size:1rem;text-align:center}.timeBar:hover .timeBarBtn{display:inline-block}.downBtn:hover,.upBtn:hover{background-color:rgba(0,161,212,.9)}.downBtn:active,.upBtn:active{transform:scale(.9)}#timeBarYear{width:45px}#timeBarDay,#timeBarMonth,#timeBarYoil{width:30px}#timeBarYoil.timeBar:hover{height:auto;background-color:rgba(10,10,10,.9)}#timeBarHour,#timeBarMinute{width:30px}.hyphen{display:flex;justify-content:center;align-items:center;width:10px}.hyphen:hover{height:30px}#timeBarCurrentTime,#timeBarPlay{display:flex;justify-content:center;align-items:center}.timeBar i{font-size:1.2rem;transition:font-size .2s}.timeBar:hover i{font-size:2rem}.timeBar i.fa-clock-o{color:rgba(150,150,150,.9)}.timeBar i.fa-clock-o:hover{color:rgba(255,255,255,.9)}#timeBarCurrentTime:active,#timeBarPlay:active{transform:scale(.9)}#timeBarPlay i.selected{display:flex}#timeBarPlay i,.modal{display:none}.modal{position:fixed;left:60px;bottom:150px;width:300px;overflow:hidden;z-index:500}.modal-content{background-color:#fefefe;margin:5% auto;padding:20px;border:solid #888;width:80%;border-radius:20px;opacity:1;position:relative}.modal-content:before{content:"";position:absolute;bottom:25px;left:-20px;border:10px solid transparent;border-right-color:#fefefe;z-index:999}.modal-gps{display:none;position:fixed;left:60px;bottom:70px;width:250px;overflow:hidden;z-index:500}.modal-content-gps{left:5px;background-color:#fefefe;margin:5% auto;padding:20px;border:solid #888;width:80%;border-radius:20px;opacity:1;position:relative}.modal-content-gps:before{content:"";position:absolute;bottom:25px;left:-20px;border:10px solid transparent;border-right-color:#fefefe;z-index:999}#detectGps:hover:before{content:"현재 위치로 이동";position:absolute;top:5px;right:-135px;background-color:rgba(0,0,0,.8);color:white;padding:5px 10px;border-radius:5px}.gradientBar{display:none;position:fixed;bottom:75px;left:50%;transform:translateX(-50%);width:320px;height:15px;justify-content:space-between;padding:0 10px;z-index:400;border:1px solid #7a7a7a;border-radius:10px}#gradient-bar-current{display:flex;background:linear-gradient(90deg,rgba(36,22,42,1) 0,rgba(56,42,84,1) 5.72%,rgba(63,63,128,1) 11.81%,rgba(56,93,154,1) 18.35%,rgba(52,121,161,1) 25.46%,rgba(52,151,168,1) 33.33%,rgba(61,179,172,1) 42.26%,rgba(98,207,172,1) 52.86%,rgba(170,226,189,1) 66.67%,rgba(218,242,225,1))}#gradient-bar-elevation{background:linear-gradient(90deg,rgba(0,0,4,1) 0,rgba(27,12,65,1) 11.11%,rgba(74,12,107,1) 22.22%,rgba(120,28,109,1) 33.33%,rgba(165,44,96,1) 44.44%,rgba(207,68,70,1) 55.55%,rgba(237,105,37,1) 66.66%,rgba(251,155,6,1) 77.77%,rgba(247,209,61,1) 88.88%,rgba(252,255,164,1))}#gradient-bar-temperature{background:linear-gradient(90deg,rgba(48,18,59,1) 0,rgba(64,67,166,1) 6.67%,rgba(70,112,232,1) 13.33%,rgba(62,155,254,1) 20%,rgba(33,196,225,1) 26.67%,rgba(26,228,182,1) 33.33%,rgba(70,247,131,1) 40%,rgba(135,254,77,1) 46.67%,rgba(185,245,52,1) 53.33%,rgba(225,220,55,1) 60%,rgba(249,186,56,1) 66.67%,rgba(253,140,39,1) 73.33%,rgba(239,90,17,1) 80%,rgba(214,52,5,1) 86.66%,rgba(174,24,1,1) 93.33%,rgba(122,4,2,1))}#gradient-bar-salinity{background:linear-gradient(90deg,rgba(68,1,84,1) 0,rgba(72,40,120,1) 33.33%,rgba(62,73,137,1) 47.14%,rgba(49,104,142,1) 57.73%,rgba(38,130,142,1) 66.67%,rgba(31,158,137,1) 74.54%,rgba(53,183,121,1) 81.65%,rgba(110,206,88,1) 88.19%,rgba(181,222,43,1) 94.28%,rgba(253,231,37,1))}#gradient-bar-waveHeight{background:linear-gradient(90deg,rgba(5,3,54,1) 0,rgba(47,15,96,1) 11.11%,rgba(107,34,108,1) 22.22%,rgba(168,54,103,1) 33.33%,rgba(214,75,85,1) 44.44%,rgba(243,113,78,1) 55.55%,rgba(251,157,109,1) 66.66%,rgba(246,199,159,1) 77.77%,rgba(232,243,239,1) 88.88%,rgba(255,255,255,1))}.num{font-family:Pretendard-Regular;font-size:.8rem;position:relative;color:#fff;text-shadow:-1px 0 black,0 1px black,1px 0 black,0 -1px black}.general-desc{text-align:center;line-height:2em!important}#missingTime{display:none}.modal-missingTime{position:fixed;width:300px;overflow:hidden;z-index:500;top:50%;left:50%;transform:translate(-50%,-50%)}.modal-content-missingTime{line-height:1.8;text-align:center;background-color:#1b1b1b;color:#fefefe;margin:5% auto;padding:20px;border:solid #888;width:80%;border-radius:20px;opacity:1;position:relative;animation:shiningBorder 1s linear infinite}@keyframes shiningBorder{0%,to{box-shadow:1px 1px 2px 1px rgba(170,169,189,.9)}25%{box-shadow:-1px 1px 2px 1px rgba(141,150,165,.9)}50%{box-shadow:-1px -1px 2px 1px rgba(121,170,167,.9)}75%{box-shadow:1px -1px 2px 1px rgba(218,242,225,.9)}}#datetimePicker-wrapper{position:fixed;bottom:33px;left:calc(50% - 170px);width:34px;height:33px;display:flex;justify-content:center;align-items:center;background-color:rgba(10,10,10,.9);border-radius:10px;z-index:1200}.fa.fa-calendar{color:rgb(158,158,158);font-size:1.5rem}.fa.fa-calendar:hover{color:rgb(216,216,216)}.tempus-dominus-widget{overflow:hidden!important}#calendar-wrapper,#calendar-wrapper_waveHeight{pointer-events:none;position:absolute;display:block;width:350px;height:400px;left:50%;bottom:100px;transform:translate(-50%);border-radius:10px;z-index:1200}#datetimepicker1_waveHeight{display:none}.tempus-dominus-widget{pointer-events:auto;position:absolute;padding:20px!important;transform:translate(2px,-5px)!important;z-index:1500}.day.disabled{color:#424242!important}#calendar-wrapper{pointer-events:auto;padding:12px;background-color:rgba(10,10,10,.95);color:#fff}#calendar-wrapper .rdp-root{--rdp-accent-color:rgba(0,161,212,1);--rdp-accent-background-color:rgba(0,161,212,0.35);--rdp-today-color:rgba(0,161,212,1);--rdp-disabled-opacity:0.35;--rdp-outside-opacity:0.5;color:#fff}#calendar-wrapper .rdp-weekday{color:rgb(158,158,158)}#calendar-wrapper .rdp-day_button{color:#fff}#calendar-wrapper .rdp-disabled .rdp-day_button{color:#424242}#calendar-wrapper .rdp-button_next,#calendar-wrapper .rdp-button_previous{color:#fff}#calendar-wrapper .rdp-chevron{fill:#fff}#waveSpeedSlider{position:fixed;bottom:10px;width:340px;height:10px;left:50%;transform:translateX(-50%);display:flex;justify-content:center;align-items:center;z-index:900}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:3px;border-radius:3px;background:#000000;outline:none;opacity:.7;transition:opacity .2s}.slider:hover{opacity:1}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:120px;height:20px;background:rgba(0,161,212,.9);cursor:pointer;border-radius:8px;color:#fff;font-size:12px;text-align:center;line-height:20px}.slider::-moz-range-thumb{width:120px;height:20px;background:rgba(0,161,212,.9);cursor:pointer;border-radius:8px;color:#fff;font-size:12px;text-align:center;line-height:20px}.slider-label{position:absolute;width:100px;color:#fff;font-size:.8rem;padding:2px 10px;text-align:center;top:-4px;transform:translateX(0);pointer-events:none;z-index:902}.popwrap{display:block;box-sizing:border-box;position:relative;background:#1a162aa0;color:#9b94b9;padding:5px 20px;width:100%;z-index:10000}.poptopgmn{display:flex;justify-content:space-between;align-items:center}.poptopgmn .logo{padding-right:20px}.popwrap p{padding:10px 0}@media (max-width:768px){.popwrap{padding:0}.poptopgmn{display:none}}