@charset "UTF-8"; 

.main-slide-news{
	position:relative;
}

.news-slide-wrap{
	width:100%;
}

.main-news-slider a{
	width:100%;
	height:100%;
	display:block;
}
.main-news-slider .pic-area{
    width:100%;
    height:495px;
    background-size: cover;
    background-position: center;
    opacity:0;
    transform: translateY(0);
    transition:all .7s ease 0.3s;
	border-radius:25px;
	overflow:hidden;
}

.main-news-slider .pic-area::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 56.36%, rgba(4, 6, 12, 0.6) 107.27%);
    z-index: 90;
}

.main-news-slider .slick-active .pic-area{
    opacity:1;
    transform: translateY(0);
}


.main-slick-control{
    display:flex;
    align-items:center;
    top:0;
}

.main-news-slick-control{
	position:absolute;
	right:0;
	top:-40px;
}

.main-slide-news .slick-pagination .slick-dots button{
    display:block;
}

/* .slick-dots>li { pointer-events: none; } */




.main-visual-section{
	position:relative;
}

.visual-area-slider, .visual-main-slider .slick-slide{
    position:relative;
    height:100vh;
    opacity:1;
}
.movie-wrap{
    position: absolute;
    width:100%;
    height:100%;
    background-color:#000;
    overflow:hidden;
    background-position:center;
    background-size:cover;
    transform:scale(1);
    transition:transform 1.5s ease .1s;
}
.movie-wrap:after{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.5);
}
.movie-wrap video{
    position: absolute;
    min-width: 100%;
    left: 50%;
    top: 50%;
    transform: translate(-50% , -50%);

}
.visual-main-slider .slick-slide.slick-active .movie-wrap{
    transform:scale(1.1);
}


.main-visual-slider-txt{
  position:absolute;
  top:40%;
  left:50%;
  transform:translate(-50% , -50%);
  width:100%;
  max-width:1700px;
  z-index: 9999;
  opacity:0;
}

.main-visual-slider-txt p,
.main-visual-slider-txt span{
    color:#fff;
    max-width:780px;
    display:block;
}

.visual-main-slider .slick-active .main-visual-slider-txt{
    opacity:1;
}

.visual-main-slider .slick-active  .main-visual-slider-txt p{
    overflow:hidden;
}

.visual-main-slider .slick-active  .main-visual-slider-txt .visual-subtxt span{
    animation: visualtxtani 1s;
    animation-delay: 1s;
    animation-fill-mode: forwards;
    transform: translateY(100px);
    opacity: 0;
}

.visual-main-slider .slick-active  .main-visual-slider-txt .visual-txt01 span{
    animation: visualtxtani 1s;
    animation-delay: 1.4s;
    animation-fill-mode: forwards;
    transform: translateY(100px);
    opacity: 0;
}

.visual-main-slider .slick-active  .main-visual-slider-txt .visual-txt02 span{
    animation: visualtxtani 1s;
    animation-delay: 2s;
    animation-fill-mode: forwards;
    transform: translateY(100px);
    opacity: 0;
    color:#fff;
    display:block;
}

@keyframes visualtxtani {
  form { transform: translateY(100px); opacity: 0;}
  to { transform: translateY(0); opacity: 1;}
}

@-webkit-keyframes visualtxtani {
  form { transform: translateY(100px); opacity: 0;}
  to { transform: translateY(0); opacity: 1;}
}

.visual-main-control{
  position:absolute;
  top:65%;
  left:50%;
  transform:translate(-50% , -50%);
  width:100%;
  z-index:99;
  max-width:1700px;
  display:flex;
  align-items:center;
}

.visual-main-control .slick-dots{
    margin-top:0;
    margin-left:0;
}

.visual-main-control .ico{
    filter:brightness(0) invert(1);
}

.visual-main-control > button{
    margin-left:12px;
    width:20px;
    text-align:center;
}

.visual-main-control .slick-dots{
    background:transparent;
}

.visual-main-control .slick-dots li{
  width:30px;
  height:30px;
  background:transparent;
  position:relative;
  margin:0 !important;
}

.visual-main-control .slick-dots li:after{
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  background-color:#fff;
  border-radius:100%;
  position:absolute;
  left:50%;
  top:50%;
  margin-top:-4px;
  margin-left:-5px;
}

.circle_wrap {
  overflow: hidden;
  position: relative;
  width: 30px;
  height: 30px;
  border-radius: 30px;
  background-color: transparent;
}

.circle_wrap .circle {
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  width: 30px;
  height: 30px;
  border-radius: 30px;
  clip: rect(0px, 30px, 30px, 15px)
}

.slick-active .circle_wrap .circle-line {
  width: 30px;
  height: 30px;
  border-radius: 100%;
  border: 2px solid rgba(255,255,255,0.3);
}

.circle_wrap .circle-inner {
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  width: 30px;
  height: 30px;
  border-radius: 30px;
  border:2px solid #fff;
  clip: rect(0px, 15px, 30px, 0px)
}

.circle_wrap .circle2 {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg)
}

.slick-active .circle1 .circle-inner {
  -webkit-animation-name: circle_round;
  -webkit-animation-duration: 3s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards
}

.slick-active .circle2 .circle-inner {
  -webkit-animation-name: circle_round;
  -webkit-animation-duration: 3s;
  -webkit-animation-delay: 3s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards
}

@-webkit-keyframes circle_round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }

  100% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
  }
}

.visual-subtxt{
    font-size:1.5rem;
	font-weight:700;
    line-height:120%;
    transition: all 0.3s ease-in-out;
}

.visual-txt01{
    font-size:4.375rem;
	font-weight:700;
    line-height:1.3em;
    transition: all 0.3s ease-in-out;
	margin:40px 0;
	line-height:100%;
}

.visual-txt02{
    font-size:2.125rem;
	font-weight:600;
	line-height:140%;
}

.visual-txt02 em{
    display:block;
}

.phishing-status{
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	height:230px;
	-webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
	z-index:100;
	transition:all .2s;
}

.phishing-status.fixed{
	position:fixed;
	height:120px;
}

.phishing-status:after{
	content:'';
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:1px;
	background:rgba(255, 255, 255, 0.1);
}

.phishing-status-wrap{
	display:flex;
	height:100%;
}

.main-reporting{
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform: var(--xy50);
    -ms-transform: var(--xy50);
    transform: var(--xy50);
}

.main-reporting a{
	padding:32px 100px;
	border:2px solid var(--whiteColor);
	background:var(--secondaryColor);
	color:var(--whiteColor);
	font-weight:700;
	font-size:2.5rem;
	border-radius:100px;
	transition:all .2s;
}

.phishing-status.fixed .main-reporting a{
	padding:24px 100px;
	font-size:2rem;
}

.main-reporting a:hover{
    box-shadow: inset 0 -4em 0 0 #0B41AD;
	border:2px solid #0B41AD;
}

.phishing-status01{
	flex:1;
	display:flex;
	gap:40px;
	padding:40px 80px 20px;
}

.phishing-status02{
	flex:0 1 auto;
	width:480px;
	background:#0B41AD;
	border-radius:60px 0 0 0;
	padding:50px;
	display:flex;
	flex-direction: column;
	gap:15px;
	color:var(--whiteColor);
	margin-left:auto;
}

.phishing-status02 h3{
	font-size:1.625rem;
	font-weight:700;
}

/* .phishing-status02 .se-btn, .phishing-status02 .se-btn:hover{
	border:1px solid var(--whiteColor) !important;
	font-size:22px !important;
	height:50px !important;
	line-height:50px !important;
	background:transparent !important;
} */


.phishing-status02 .se-btn{
  transition: all 0.3s;
}

.phishing-status02 .se-btn {
  display: inline-block !important;
  font-size:22px !important;
  font-weight:600;
  color:#fff;
  background:transparent !important;
  height:50px !important;
  line-height:50px !important;
  border:1px solid #fff !important;
  transition:all .2s;
  box-shadow:inset 0 0 0 0 #fff;
}

.phishing-status02 .se-btn:hover{
    box-shadow: inset 0 -4em 0 0 #fff;
    color:#0B41AD !important;
}


.phishing-status-txt{
	flex:0 1 auto;
	width:330px;
	display:flex;
	flex-direction: column;
	justify-content: center;
	gap:20px;
	color:var(--whiteColor);
}

.phishing-status-statistics{
	flex:1;
	display:flex;
	align-items:center;
	justify-content: center;
	gap:20px;	
}

.statistics-gauge{
	flex:0 1 auto;
	width:300px;
	height:150px;
}

.phishing-status-txt h3{
	font-size:1.625rem;
	font-weight:700;
}

.phishing-status-txt span{
	font-size:0.875rem;
	opacity:0.4;
}

.statistics-data{
	flex:1;
}

.statistics-data ul{
	display:flex;
	gap:40px;
	justify-content: center;
	color:var(--whiteColor);
}

.statistics-data dl{
	display:flex;
	flex-direction: column;
	align-items:center;
	gap:10px;
}

.statistics-data dt span{
	display:flex;
	align-items: center;
	gap:5px;
}

.statistics-data dt span{
	font-size:1.625rem;
	font-weight:500;
	line-height:100%;
}

.statistics-data dt em{
	font-size:5rem;
	font-weight:700;
	line-height:100%;
}

.statistics-gauge{
	color:var(--whiteColor);
}

.gauge-active{
	border:1px dashed var(--whiteColor);
	font-weight:500;
	color:var(--whiteColor);
}



@media screen and (max-width: 1440px) {
	.main-visual-slider-txt, .visual-main-control{
		padding:0 40px;
	}
}


@media (max-width: 768px) {
    .visual-area-slider,
    .visual-main-slider .slick-slide{
        height:100vh;
    }

    .visual-main-control .slick-dots{
        text-align:inherit;
        display:flex;
    }

    /* .main-visual-slider-txt{
        top:inherit;
        bottom:150px;
        transform: translate(-50% , 0);
    } */

    .main-sec01-btCon a.motion-wrap2{
        display:none;
    }
    .visual-main-control .slick-dots li:after{
      margin-left:-4px;
    }
}


@media (max-width: 425px) {
	.visual-main-slider .slick-active .main-visual-slider-txt .visual-txt01 span{
		line-height:120%;
	}
}