* {margin: 0;padding: 0;box-sizing: border-box;}
*:before,*:after {box-sizing: border-box;}
body {font-family: sans-serif;margin: 0 auto;background: #333;}
h1 {text-align: center;margin-bottom: 20px;color: #fff;}
ul {list-style: none;}
footer {margin-top: 20px;text-align: center;color: darkred;}
a {text-decoration: none;}
.tab-section {margin: 0 auto;position: relative;width: 100%;border: 1px solid #d0d0d0;font-size: 0;}
.tab-section::before,.tab-section::after {display: table;content: "";}
.tab-section::after {clear: both;}
.tab-section .tab-link {position: relative;display: inline-block;text-align: center;width: 25%;font-size: 15px;background: #e8e8e8;padding: 10px 0;border-bottom: 1px solid #d0d0d0;color: #5b5b5b;overflow: hidden;}
.tab-section .tab-link:after {content: "";left: -75px;opacity: 1;position: absolute;top: 0;background: #fff;width: 50%;height: 100%;background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,.6) 100%);background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.6) 100%);-webkit-transform: skewX(-25deg);transform: skewX(-25deg);-webkit-transition: all.55scubic-bezier(0.19, 1, 0.22, 1);transition: all .55s cubic-bezier(0.19, 1, 0.22, 1);}
.tab-section .tab-link:hover:after {-webkit-animation: shine .75s;animation: shine .75s;}
@-webkit-keyframes shine {100% {	left: 125%;}}
@keyframes shine {100% {	left: 125%;}}
.tab-section .tab-link ~ .tab-link {border-left: 1px solid #bababa;}
.tab-section .select {background: #fff;font-weight: bold;color: #000;}
/*.tab-btn:target + .tab-link {background: #fff;font-weight: bold;color: #000;} */
.tab-btn:target + .tab-link:hover:after {-webkit-animation: -1s;animation: -1s;}

#con {/*! max-width:100%; */max-width:1024px;width: 100%;margin: 0 auto;min-width: 360px;}
.cctv_label { font-size: 12px; width: 128px; height: 56px; display: block; border: 1px dashed #999; background-color:#fff;}
#cctv_1 .cctv_icon, #cctv_2 .cctv_icon, #cctv_3 .cctv_icon, #cctv_4 .cctv_icon, #cctv_5 .cctv_icon  { position: absolute;  width: 25px; height: 31px; display: block; background: url("/images/sunrise/cctv_locate2.png") no-repeat 0 0;}
.cctv_label > a { color: #000; margin: 0;text-decoration: none;}
.cctv_label > a > p  { margin: 4px;  text-align: center;}
.cctv_label > a > p > span { font-weight: bold; color:#1881bf; font-size: 20px;  text-align: center;display: block;}

#cctv_1 { display: none; position: absolute;margin: -733px 0 0 606px;z-index: 10;}
#cctv_1 .cctv_icon { margin: 8px 0 0 -26px; }
#cctv_2 {display: none;margin: -774px 0 0 387px;position: absolute;z-index: 10;}
#cctv_2 .cctv_icon { margin: 8px 0 0 130px; }
#cctv_3 {display: none;margin: -300px 0 0 492px;position: absolute;z-index: 10;}
#cctv_3 .cctv_icon { margin: 8px 0 0 -26px; }
#cctv_4 {display: none;margin: -300px 0 0 492px;position: absolute;z-index: 10;}
#cctv_4 .cctv_icon { margin: 8px 0 0 -26px; }
#cctv_5 {display: none;margin: -300px 0 0 492px;position: absolute;z-index: 10;}
#cctv_5 .cctv_icon { margin: 8px 0 0 -26px; }


#cctv_1a, #cctv_2a, #cctv_3a, #cctv_4a, #cctv_5a {float: left; margin-left: 10px; margin-top: -57px; z-index: 1; position: relative;}
.cctv_label li {  padding: 0;}
#info_1 {  position: absolute;  margin: -661px 0 0 638px;  width: 120px;  height: 100px;}
#info_1 >p >span {  display: block;  font-weight: bold;text-align: center;background-color: #c9ebec;padding: 2px 0;}

#info_2 {  position: absolute;  margin: -827px 0 0 192px;  width: 120px;  height: 100px;}
#info_2 >p >span {  display: block;  font-weight: bold;text-align: center;background-color: #c9ebec;padding: 2px 0;}

.cctv_label > ul {  padding: 0 0 0 20px;  margin: 0px 0 0 0;}
.cctv_label > p {  margin: 4px;}

#info_1 .cctv_icon  { position: absolute;  width: 25px; height: 31px; display: block; background: url("/images/sunrise/wave_locate.png") no-repeat 0 0;margin: 0 0 0 -30px;}
#info_2 .cctv_icon  { position: absolute;  width: 25px; height: 31px; display: block; background: url("/images/sunrise/wave_locate.png") no-repeat 0 0;margin: 90px 0 0 124px;}













.leaflet-popup-content span.title { font-weight: bold; color:#1881bf; font-size: 13px;  text-align: center;display: block;}
.leaflet-popup-content span.cont {}

.cctv_view_layer {
    /*! position: absolute; */
    z-index: 8888;
    margin: 0 auto;
    top: 40px;
    background-color: #fff;
    left: 0;
    max-width: 1024px;
    width: 100%;
    margin: 0 auto;
    min-width: 360px;
}
.cctv_view_layer p { /*font-size : 12px; padding: 15px 88px 15px 22px !important; */}
#yeongil_layer {position: absolute; z-index: 1000;height: 106px; width: 139px; display: none;}
.box {background-color: #fff;padding: 10px;width:480px;}
.box li {width: 33.33%;float: left;text-align: center;}
.box li img {height: 130px;cursor: -webkit-zoom-in;cursor: zoom-in;}
.plugin-desc { margin-top: 20px; }
.img-preview-box { width:100%; display: block;float: left;max-width: 564px;/*! height: 380px; */}
.img-preview-mask {width: 100%;height: 100%;position: fixed;top: 0;left: 0;z-index: 9998;background-color: rgba(0,0,0,.8);}
.img-preview-popover {position: relative;z-index: 9999;width: 100% !important;max-width: 560px;margin: 0 auto 0;top: -574px;}
.img-preview-foot {width: 96%;padding: 0 2%;position: absolute;bottom: 0;background-color: rgba(0,0,0,.5);font-family:'Roboto';}
.img-foot-title {font-size: 16px;color: #fff;margin-top: 5px;}
.img-foot-desc {font-size: 12px;color: #fff;margin-top: 5px;line-height: 24px;}

.map-container { max-width: 560px; width:100%;}
.box2 { height: 40px; width: 100%; background-color: #000; display: block; }
span.close_button { text-indent: -5000px;width:40px; height: 40px; display: block; background: url('/images/close_icon.png') 0 0 no-repeat;position: absolute;top: 0px;right: 23px;float: left;} 
span.close_button2 { text-indent: -5000px;width:40px; height: 40px; display: block; background: url('/images/close_icon.png') 0 0 no-repeat;position: relative;/*! top: 0px; */z-index: 9999;margin: -53px auto;} 
.help {clear: both;/*! padding: 15px; */ width: 100%; /*! max-width: 520px; */ /*! margin: 10px; */background-color: #fff;border-left: 1px solid #ccc;border-right: 1px solid #ccc;border-bottom: 1px solid #ccc;min-height: 560px;font-size: 18px;color: #736969;line-height: 170%;-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
.help p { font-size: 13px; line-height: 160%;}
.caption {display: block;background-color: #000;color: #fff;padding: 5px;text-align: center;margin: 0;}
.help p {margin: 10px 0;clear: both;padding-left: 10px;}
p.memo { background-color: #f2f2f2; border: 1px dotted #ccc; clear: both;padding:5px 5px 5px 10px; font-size: 12px;}
p.memo span { margin: 10px; display: block;color: #828284;font-size: 11px;}
i { display: inline-block;background: url(/images/sunrise/direction_15x15.png) 0 0 no-repeat;width: 15px;height: 15px;margin-top: 10px;}

.ocean_day_box {width:100%; display:block;margin-top: 10px;border-top: 7px solid #000;clear: both;}
.help dl:nth(1) {margin-top: 0px;}
.ocean_day_box dt {clear:both;display:block;  padding:5px; font-size:19px; text-align:center; background-color:#b7b7b7; font-weight: bold;color: #fff;}
.ocean_day_box dd span {display:block; }
.ocean_day_box dd li {font-size: 14px;margin: auto;}
.ocean_day_box dd.label li.time {text-align:center;}
.ocean_day_box dd.label {clear:both;margin: 0;display: flex;border-bottom: 1px dotted #ccc;padding: 8px 0 4px;background-color: #f2f2f2;line-height: 115%;}
.ocean_day_box dd.label li {width:42px; float:left; display:block; }
.ocean_day_box dd.label li.temp {width: 85px;}
.ocean_day_box dd.label li.temp span.air {width: 50%;float: left;text-align: center;}
.ocean_day_box dd.label li.temp span.water {width: 50%;float: right;text-align: center;}
.ocean_day_box dd.label li.temp span.hum {font-size:11px;text-align: center;color: #77a2d7;/*! width: 103px; */}

.ocean_day_box dd.label li.swell {width: 48px;}
.ocean_day_box dd.label li.swell span.period {font-size: 10px;text-align: center;color: #6dbd74;}
.ocean_day_box dd.label li.swell span.height {text-align: center;}
.ocean_day_box dd.label li.wavedirection {width: 39px;text-align: center;/*! margin-left: 10px; */}
.ocean_day_box dd.label li.wind {width: 67px;}
.ocean_day_box dd.label li.wind span.speed {text-align: center;}
.ocean_day_box dd.label li.wind span.gust {font-size: 11px;text-align: center;color: #dd4b39;}
.ocean_day_box dd.label li.winddirection {width: 40px;text-align: center;}
.ocean_day_box dd.label li.rain {width: 70px;}
.ocean_day_box dd.label li.rain span.cloud {text-align: center;}
.ocean_day_box dd.label li.rain span.precipitation {font-size: 11px;text-align: center;color: #6dbd74;}


.ocean_day_box dd.label li.type {width: 100px;text-align: center;}
.ocean_day_box dd.label li.stime {width: 40px;text-align: center;}
.ocean_day_box dd.label li.etime {width: 40px;text-align: center;}
.ocean_day_box dd.label li.price {width: 40px;text-align: center;}
.ocean_day_box dd.label li.resver {width: 100px;text-align: center;}

.ocean_day_box dd.data li.type {width: 100px;text-align: center;}
.ocean_day_box dd.data li.stime {width: 40px;text-align: center;}
.ocean_day_box dd.data li.etime {width: 40px;text-align: center;}
.ocean_day_box dd.data li.price {width: 40px;text-align: center;}
.ocean_day_box dd.data li.resver {width: 100px;text-align: center;}

.ocean_day_box dd.info {/*! clear:both; */margin: 0px auto 10px;display: flex;/*! border-top: 1px dotted #ccc; */padding: 8px 0 6px;line-height: 100%; font-size: 11px; color:#999;width: 95%;/*! float: left; */border: 1px dotted #ccc;background-color: #f2f2f2;}
.ocean_day_box dd.info li.list span {float: left;margin-right: 14px;font-size: 13px;}
.ocean_day_box dd.info li.list {list-style: none;	margin: 0;width: 465px;line-height: 140%;}
.ocean_day_box dd.info li.rev_ok, .ocean_day_box dd.info li.rev_stby {width: 102px;margin-left: 7px !important;list-style: none;line-height: 130%;font-size: 13px;}


.ocean_day_box dd.data li.time {text-align:center;font-size:18px;/*! margin-left: 0px !important; */width: 42px;}
.ocean_day_box dd.data {clear:both;margin: 0px;display: flex;border-top: 1px dotted #ccc;padding: 8px 0 6px;line-height: 100%;}
.ocean_day_box dd.data li {width:50px;float:left;display:block;  /*! margin-left:15px; */margin: auto;}
.ocean_day_box dd.data li.temp {width:85px;/*! margin-left: 17px !important; */}
.ocean_day_box dd.data li.temp span.air {width: 50%;float: left;text-align: right;}
.ocean_day_box dd.data li.temp span.water {width: 50%;float: right;text-align: right;}
.ocean_day_box dd.data li.temp span.hum {font-size:11px;text-align: center;color: #77a2d7;}
.ocean_day_box dd.data li.swell {width: 48px;}
.ocean_day_box dd.data li.swell span.period {font-size: 11px;text-align: center;color: #6dbd74;}
.ocean_day_box dd.data li.swell span.height {text-align: center;}
.ocean_day_box dd.data li.wavedirection {width: 39px;text-align: center;}
.ocean_day_box dd.data li.wind {width: 67px;/*! margin-left: 8px; */}
.ocean_day_box dd.data li.wind span.speed {text-align: center;}
.ocean_day_box dd.data li.wind span.gust {font-size: 10px;text-align: center;color: #dd4b39;width: 58px;}
.ocean_day_box dd.data li.winddirection {width: 40px;text-align: center;}
.ocean_day_box dd.data li.rain {width: 70px;/* margin: auto; */}
.ocean_day_box dd.data li.rain span.cloud {text-align: center;}
.ocean_day_box dd.data li.rain span.precipitation {font-size: 11px;text-align: center;color: #6dbd74;}
.ocean_day_box dd.data li.current i {    margin-left: 16px;}
.ocean_day_box dd.data li.current span.speed {font-size: 11px;text-align: center;color: #6dbd74;}
.ocean_day_box dd.data li.current i { display: inline-block;padding: 3px;background: url(/images/sunrise/current_direction_15x15.png) 0 0 no-repeat;width: 15px;height: 15px;margin-top: 0px;}
.ocean_day_box dd.tide { display: flex; width: 100%; }
.ocean_day_box dd.tide span { font-size: 12px;text-align: center; float: left; padding: 3px 10px;color: #737373;line-height: 100%;}

.ocean_day_box dd.tide span:nth-child(2) {margin-left:20px;}
.ocean_day_box dd.tide.high { background-color: #FFF5F5;}
.ocean_day_box dd.tide.low { background-color:#EFF9FF;}
.ocean_day_box dd.astro { display: flex; width: 100%; background-color: #EDFFED;}
.ocean_day_box dd.astro span { font-size: 12px;text-align: center; float: left; padding: 3px 10px;color: #737373;line-height: 100%;}
.ocean_day_box dd.astro span:nth-child(2) {margin-left:20px;}
.ocean_day_box dd.astro.sunrise span:nth-child(1) { color:red;}
.ocean_day_box dd.astro.sunset span:nth-child(1) { color:blue;}

.ocean_day_box dd.data li.rain > img { position: absolute; margin-top: -17px; }
.ocean_day_box dd.data li.rain .precipitation2 { position: absolute;margin-top: 20px;font-size: 11px;text-align: center;color: #6dbd74;width: 56px;}

.sns {height:47px;/*! line-height:45px; */background:#484848; }
.sns ul,.sns .sns_inner>span {/*! float:left */}
.sns ul,.sns .sns_inner>span.counter {float:left}

.sns .sns_inner>span {float:left;margin:16px 0 0 15px;background:url("/images/sunrise/view_icons.png") no-repeat 0 center;background-size:18px;padding-left:22px;color:#8e8e93;font-size:12px;}
.sns ul {float:right;padding-right:20px}
.sns ul li {float:left;padding-left:8px}
.sns ul li a {display:block;width:30px;height:45px;text-indent:-9999px}
.sns ul li:nth-child(1) a {background:url("/images/sunrise/kakaotalk.png") no-repeat 0 center;background-size:30px}
.sns ul li:nth-child(2) a {background:url("/images/sunrise/band.png") no-repeat 0 center;background-size:30px}
.sns ul li:nth-child(3) a {background:url("/images/sunrise/naver.png") no-repeat 0 center;background-size:30px}
.sns ul li:nth-child(4) a {background:url("/images/sunrise/facebook.png") no-repeat 0 center;background-size:30px}
.sns ul li:nth-child(5) a {background:url("/images/sunrise/twitter.png") no-repeat 0 center;background-size:30px}
.sns ul li:nth-child(6) a {background:url("/images/sunrise/kakao.png") no-repeat 0 center;background-size:30px}

a.error { position: absolute !important;top: 442px !important;z-index: 1;left: 200px;}

div.adsbyself {width: 100%;border: 1px dotted #dbdbdb;margin: 0 auto;height: 85px;background-color: #f6fbef;}
div.adsbyself img {width: 100%;height: 56px;max-width: 550px;min-width: 486px;}
div.adsbyself > span {font-size: 10px;display: block;text-align: center;color: #dd5353;position: relative;bottom: 34px;}
div.adsbyself a.null {background-color:#ccc;width: 100%;height: 85px;display: block; text-align:center;margin-bottom: 4px; line-height: 140%;}
div.adsbyself a.null span { margin-top: 7px; display: inline-block;}


.header { display: block;background-color:#000;color:#fff;padding: 7px;text-align: center;margin: 0;height: 38px;position: fixed;top: 0;width: 100%;left: 0;z-index:99999;font-size: 16px;font-weight: bold;}
span.back_button { text-indent: -5000px;width:37px; height: 37px; display: block; background: url('/images/sunrise/xclose-icon-white.png') center center no-repeat;position: absolute;top:1px;right: 1px;float: left;} 
.cctv_list { margin:18px 0 0 5px; display: block;padding: 0px 0 0;min-width: 346px;/*! clear: both;float: left; position: relative;*/}
.cctv_list dt { width: 130px; float: left; clear: both;margin-bottom: 10px;}
.cctv_list dt img { width: 120px; /*! height:100px; */}
.cctv_list dd { width: 215px; float: left;border-bottom: dotted 1px #626262;padding-bottom: 5px;}
.cctv_list dd h3 { font-size: 14px; font-weight: bold;line-height: 160%;}
.cctv_list dd p { margin: 2px; line-height: 110%;padding: 0;}

.cctv_list dd.ad { width:341px; border-bottom:none;}
.reservation_info { font-size: 14px;
margin: 10px auto;
display: block;
width: 90%;
line-height: 160%;}



.monthly_bar{ width:100%; table-layout:fixed; text-align:center;}
.monthly_bar table tr{ border-top:1px solid #fafafa;}
.monthly_bar table th{ padding:10px 0;}
.monthly_bar table td{ /*! padding:10px 0; */}

.schedule_list{ border-top:1px solid #949494;}
.schedule_list .schedule_date{ background-color:#f6f6f6; padding:10px;}

.event_list .date { width: 60px; float: left; text-align: center; }
.event_list .icon.eventday { float: right; width: 29px; height: 26px; background:url("/images/sunrise/sprite.png") 0 -88px / 360px; position: absolute; top: 20px; right: 10px; }
.event_list .icon.holliday { float: right; width: 29px; height: 26px; background:url("/images/sunrise/sprite.png") -37px -88px / 360px; position: absolute; top: 20px; right: 10px;}


.calendar_box{ background-color:#fff; }
.calendar_box .nav_calendar{ margin:0 auto; text-align:center;}
.calendar_box .nav_calendar a{}
.calender_wrap {display: inline-block; background-color: #e8ecef; padding: 10px 0 0 0; width: 100%;}

.calendar_box { width:100%; padding: 15px 3%; box-sizing: border-box; }
.nav_calendar { background:#fff;  width:100%; display:inline-block; height:35px;}
.nav_calendar p { display: inline-block; padding: 0 !important; font-size: 13px !important;}
.nav_calendar p a {
    display: inline-block;
    font-size: 0;
	float:left;
    height: 35px;
    text-align: center;
    width: 31px;
	vertical-align:middle;
}
a.date_prev {background: url("/images/sunrise/sprite.png") no-repeat scroll -139px 10px / 360px;}
a.date_next {background: url("/images/sunrise/sprite.png") no-repeat scroll -176px 10px / 360px;}
.nav_calendar p span {font-size:18px; float:left; padding:6px 5px; height:24px; font-weight: 400;} 


.monthly_bar { width: 100%; display: inline-block;}
.monthly_bar table { width: 100%; font-size: 13px; }
.monthly_bar table tr { height: 37px; text-align: center; }
.monthly_bar table td:nth-child(1), .monthly_bar table td:nth-child(1) > a { color: #f04e2a; }
.monthly_bar table td > p { display: inline-block; width: 25px; height: 23px; }
.monthly_bar table td.check > p { background: url("/images/sunrise/sprite.png") no-repeat scroll -175px -45px / 360px;}
.monthly_bar table td.num_today > p { background: url("/images/sunrise/sprite.png") no-repeat scroll 1px -126px / 360px; color: #fff;}
.monthly_bar table td.date > p > span {font-size: 13px !important;margin: -3px auto;width: 25px;height: 25px; }

.nav_calendar ul {float:right; padding:0 !important;}
.nav_calendar ul li {float:left; background:none !important; padding:0 !important;}
.nav_calendar ul li a.on { background:#1c4c75; color:#fff; position:relative;}
.nav_calendar ul li a.on .bg_triange1 {background: url("/images/sunrise/bg_triangle1.gif") no-repeat scroll 0 0 / 9px 6px; position:absolute; bottom:-6px; left:40%;display: inline-block; font-size:0; height:6px; width:9px;}
.nav_calendar ul li a { display:block; padding:10px 10px 8px; height:18px; color:#323232; font-size:13px;}

.event_box { font-size:14px; border-top:1px solid #949494;width:100%;}
.event_box .event_list ul { width:100%; display: inline-block; background-color: #fff; box-sizing: border-box;}
.event_box .event_list > p { width: 100%; height: 39px; background-color: #f6f6f6; padding: 0 3%; display: block; font-size: 13px; line-height: 39px; vertical-align: middle;}
.event_box .event_list ul > li { border-bottom:1px solid #d2d2d2; padding:10px 3%; background:none !important; display: inline-block; width: 100%; box-sizing: border-box; position: relative; }
.event_box .event_list ul > li > p { font-size: 10px; display: block; box-sizing: border-box; padding-left: 60px; padding-right: 50px; }
.event_list span.event_tit {color:#323232; display: inline-block; font-size: 22px; }
.event_list span.event_peroid{color:#333333; display: inline-block; font-size:22px;}
.event_list span.event_location{display: block; font-size:14px; color: #111;}

.add_time_form {
 background:#fff;
 -webkit-box-shadow:0 3px 38px 0 hsla(0,0%,52.2%,.5);
 box-shadow:0 3px 38px 0 hsla(0,0%,52.2%,.5);
 border-radius:.12rem;
 width:80%;
 height:280px;
 left:50%;
 top:46%;
 position:absolute;
 -webkit-transform:translate(-50%,-50%);
 -ms-transform:translate(-50%,-50%);
 transform:translate(-50%,-50%);
display: none;
}
.add_time_form .add_time_check {
    margin: 13px 0 0 24px;
line-height: 190%;
}
.add_time_form .add_title {
    font-weight: bold;
    font-size: 16px;
    margin: 10px auto;
	width: 200px;}


.info_open { background:#eef2f6; padding:10px 0; color:#707070; border-top:1px solid #d2d2d2;}
.icon_exhibition {
    background: transparent url("/images/sunrise/icon_exhibition.gif") no-repeat scroll 0 4px / 17px 17px;
    display: inline-block;
	float:left;
	height:50px;
	padding-left:23px;
	color:#707070;
	width:35px;
	margin-left:5px;



}
.icon_perform {
    background: transparent url("/images/sunrise/icon_perform.gif") no-repeat scroll 0 4px / 17px 17px;
    display: inline-block;
	float:left;
	height:50px;
	padding-left:23px;
	color:#707070;
	width:35px;
	margin-left:5px;
}
.icon_etc {
    background: transparent url("/images/sunrise/icon_etc.gif") no-repeat scroll 0 4px / 17px 17px;
    display: inline-block;
	float:left;
	height:50px;
	padding-left:23px;
	color:#707070;
	width:35px;
	margin-left:5px;
}

.info_open ul { margin-left:10px; padding:0 !important;}
.info_open ul li {line-height: 1.5 !important;text-align: left !important; word-break: break-all;}

caption {

    font-size: 0;
    height: 0;

}



.tel {
    font-size: 20px;
	display: block;
    margin-top: 5px;
    color: #d48f74;
}
.addr {
    display: block;
    margin-top: 10px;
    color: #153c19;
}
.boysfishing_reservation {
    width: 100%;
    height: 168px;
    background: url(/images/sunrise/boysfishing_reservation.jpg?build=2) no-repeat center;

}

video.loading {
  background: black url(/images/sunrise/loader6.gif) center center no-repeat;
}

.cctv_video { width:100%;}
#fullvideo {
  width: 100vh;
height: 100vw;
}
#fullsize_close {
	position: fixed;
	z-index: 99999;
	top:30px;
	right: 30px;
}
.playfullvideo {
	display: none;
	position: fixed;
	transform: rotate(90deg);
	transform-origin: bottom left;
	width: 100vh;
	height: 100vw;
	margin-top: -100vw;
	object-fit: cover;
	top: 0;
	left: 0;
	z-index: 99998;
	visibility: visible;
	background-color: #000;
}
/*로딩중*/
#loding_wrap{position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4); display: flex; align-items: center; justify-content: center; z-index: 9999; display: none;}
#loding_wrap .loding_inner{background-color: #e6e6e6; border-radius: 50%; padding: 22px 20px; text-align: center;}
#loding_wrap .loding_inner .item{position: relative; display: inline-block; margin: 0 auto; width: 43px; height: 20px; animation: fish_body ease-in-out 2.4s infinite;}
#loding_wrap .loding_inner .item > div{float: left; height: 20px;}
#loding_wrap .loding_inner .item .item01{width: 31px; background: url("/images/loding_item1.png") no-repeat; background-size: cover;}
#loding_wrap .loding_inner .item .item02{width: 12px; background: url("/images/loding_item2.png") no-repeat; background-size: cover; transform-origin: left; animation: fish_tail ease-in-out 0.3s infinite;}
#loding_wrap .loding_inner span{display: block; color: #9e9e9e; font-size: 14px; font-weight: 400;}

@keyframes fish_body{
	0%{transform: rotateZ(0deg);}
	40%{transform: rotateZ(45deg);}
	60%{transform: rotateZ(10deg);}
	80%{transform: rotateZ(30deg);}
	100%{transform: rotateZ(0deg);}
}
@keyframes fish_tail{
	0%{transform: rotateY(45deg);}
	100%{transform: rotateY(-45deg);}
}



