@charset "UTF-8";
/***************************
    cyberSecExpo 臺灣資安大展
**********/
/* cyberSecExpo kv */
.section-kv-cyberSecExpo {
  background-color: var(--theme);
  padding: 0;
  /* background: url('../img/kv/bg-cyberSecExpo.jpg') no-repeat center center/cover; */
}

/* .section-kv-cyberSecExpo .kv-content {
  padding: 10%;
  text-align: center;
}
.section-kv-cyberSecExpo .kv-content .kv-text {
  text-shadow: 0 0 5px #000;
  color: #fff;
}
.section-kv-cyberSecExpo .kv-content .kv-text .kv-main {
  font-size: 4rem;
  letter-spacing: 2px;
}
.section-kv-cyberSecExpo .kv-content .kv-text .kv-desc {}
.section-kv-cyberSecExpo .kv-content .kv-text .kv-sub {} */

@media (max-width: 991px) {
  .section-kv-cyberSecExpo {
    /* min-height: 47vh; */
  }
  .section-kv-cyberSecExpo .kv-content{
    padding: 10% 2%;
  }
  /* .section-kv-cyberSecExpo .kv-content .kv-text .kv-main {
    font-size: 2rem;
  }
  .section-kv-cyberSecExpo .kv-content .kv-text .kv-desc {}
  .section-kv-cyberSecExpo .kv-content .kv-text .kv-sub {} */
}



/* cyberSecExpo intro */
.section-cyberSecExpo-intro {
  padding: 5% 0 5%;
  position: relative;
  overflow: hidden;
}
.section-cyberSecExpo-intro .bg-icon-arrow{
  background: url('../img/kv/bg-cyberSecExpo.jpg') no-repeat center center/cover;
}
.cyberSecExpo-intro-txt {
  /* background-color: #fff; */
  padding: 15px 30px;
  /* border-radius: 15px; */
}
.cyberSecExpo-intro-txt .title {
  text-align: left;
}
.cyberExpo-chartbox {
  width: 100%;
}

#cyberExpoChartBox {}

.slide-item {}

#pop01, #pop02, #pop03, #pop04 {
}

/* #pop01.active { display: block;}
#pop02.active { display: block;}
#pop03.active { display: block;}
#pop04.active { display: block;}

#pop-txt01 { display: none;}
#pop-txt02 { display: none;}
#pop-txt03 { display: none;}
#pop-txt04 { display: none;}

#pop-txt01.active { display: block;}
#pop-txt02.active { display: block;}
#pop-txt03.active { display: block;}
#pop-txt04.active { display: block;}

#sm-txt01 { display: block}
#sm-txt02 { display: block}
#sm-txt03 { display: block}
#sm-txt04 { display: block}

#sm-txt01.active { display: none}
#sm-txt02.active { display: none}
#sm-txt03.active { display: none}
#sm-txt04.active { display: none} */


.slide-item {
  /* transform: scale(0.8); */
  transition: 2s ease-in-out;
  transform-origin: center;
}
.slide-item [id*=pop0] {
  fill: #d22287;
  
}

.slide-item_linear {
  opacity: 0;
  transform: scale(1);
  transition: 0.5s ease-in;
}
.slide-item_linear.active {
  opacity: 1;
  transform: scale(1.002);
  /* animation: opacity 2s ease infinite; */
}
@keyframes opacity {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

[id*=chart-under-] path:nth-child(2){}
[id*=chartP_]{
  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
	background-size: 400% 400%;
	animation: opacity 2s ease-in infinite;
}
@keyframes opacity {
	0% {
    fill: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
		/* opacity: 1; */
	}
	50% {
    fill: linear-gradient(-45deg,#23a6d5, #e73c7e, , #ee7752);
		/* opacity: 0.8; */
	}
	100% {
    fill: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
		/* opacity: 1; */
	}
}

@media (max-width: 991px) {
  #cyberExpo-chartbox {}
}






.section-cyberSecExpo-cards {
  background-color: #f1f1f1f1;
}
.expoCard-item {
}
.expoCard-item .banner {
  width: 100%;
  border-radius: 10px 10px 0 0;
}
.expoCard-content {
  padding: 15px;
  background-color: #fff;
  border-radius: 0 0 10px 10px;
}
.expoCard-content .expoCard-title {
  margin: 0 0 10px;
}
.expoCard-content .expoCard-desc {
  margin-bottom: 0.5rem;
  color: #2235af;
}
.expoCard-content .btn-outline {
  margin-left: auto;
  min-width: 110px;
  padding-left: 2rem;
  padding-right: 2rem;
}
.expoCard-content .btn-outline i {
  font-size: 80%;
}






.section-calc.expoCard {
  background: url("../img/bg-calc.jpg") no-repeat bottom center;
  background-size: cover;
  background-attachment: fixed;
  color: #ffffff;
  margin: 0 0 -1px;
  text-align: center;
  padding: 5% 0;
  overflow: hidden;
  position: relative;
  background-color: #050a44bb;
}
.section-calc .calc-item-num p sup {
  top: -0.5em;
  left: -0.2em;
}

@media (max-width: 768px) {
  .section-calc.expoCard {
    background: url("../img/bg-calc-s.jpg") no-repeat bottom center;
  }
}

.section-calc.cyberSecExpo .title {
  margin: 3% 0;
  position: relative;
  z-index: 1;
  color: #fff;
  letter-spacing: 2px;
}

.section-calc.cyberSecExpo .title:before {
  content: none;
}

@media (max-width: 480px) {
  .section-calc.cyberSecExpo .title {
    margin: 2% auto 4%;
    font-size: 2em;
    width: 270px;
  }
}

.section-calc.cyberSecExpo .calc-item {
  text-align: center;
  padding: 0;
  margin-bottom: 1%;
  margin-top: 1%;
  line-height: 1.8;
}

@media (max-width: 991px) {
  .section-calc.cyberSecExpo .calc-item {
    margin-left: 0;
    margin-top: 2%;
  }
}

@media (max-width: 480px) {
  .section-calc.cyberSecExpo .calc-item {
    padding-bottom: 3%;
  }
}

.section-calc.cyberSecExpo .calc-item-num {
  padding-left: 12%;
  position: relative;
}

.section-calc.cyberSecExpo .calc-item-num p {
  font-size: 3.2em;
  text-align: center;
  font-weight: 500;
  line-height: 1em;
  height: 68px;
}

.section-calc.cyberSecExpo .calc-item-num p span.shuffled-digits {
  font-size: 1em;
  font-weight: 500;
}

@media (max-width: 1200px) {
  .section-calc.cyberSecExpo .calc-item-num p {
    font-size: 3.3em;
  }
}

@media (max-width: 667px) {
  .section-calc.cyberSecExpo .calc-item-num p {
    font-size: 2.8em;
    letter-spacing: 1px;
    height: 50px;
  }
}

@media (max-width: 480px) {
  .section-calc.cyberSecExpo .calc-item-num p {
    font-size: 2.2em;
    height: 34px;
  }
}

@media (max-width: 360px) {
  .section-calc.cyberSecExpo .calc-item-num p {
    font-size: 2em;
  }
}

.section-calc.cyberSecExpo .calc-item-num p sup {
  font-size: 0.6em;
  left: -0.3em;
  top: -0.6em;
}
.section-calc.cyberSecExpo .calc-item-num p sub {
  font-size: 0.6em;
  left: -0.3em;
}

.section-calc.cyberSecExpo .calc-item-num p span {
  font-size: 0.6em;
  margin-left: -0.3em;
}

.section-calc.cyberSecExpo .calc-item-sub {
  font-size: 1.48em;
  letter-spacing: 2px;
  font-weight: 300;
}

@media (max-width: 667px) {
  .section-calc.cyberSecExpo .calc-item-sub {
    font-size: 1.2em;
    margin-bottom: 5%;
  }
}

@media (max-width: 480px) {
  .section-calc.cyberSecExpo .calc-item-sub {
    font-size: 1.05em;
    margin-bottom: 1%;
  }
}



/* video */
.section-cyberSecExpo-video {
  background-color: var(--theme);
}
.section-cyberSecExpo-video video {
  width: 100%;
}
.videobox iframe {
  min-height: 700px;
}


/*  */
.section-countdown.cyberSecExpo {
  text-align: center;
  -webkit-background: linear-gradient(0deg, rgba(0, 112, 239, 1) 0%, rgb(5, 10, 68) 100%);
  background: linear-gradient(0deg, rgba(0, 112, 239, 1) 0%, rgba(5, 10, 68, 1) 100%);
  background: url('../img/bg-saveday-expo.jpg');
  background-repeat: no-repeat;
  background-position: center left;
  background-size: cover;
  background-attachment: fixed;
  padding: 8% 0;
  overflow: hidden;
}
.section-countdown.cyberSecExpo {}
.section-countdown.cyberSecExpo .text-area {
  margin: 20px 0;
  padding: 0 30px;
  color: #fff;
  text-shadow: 0 0 5px #000;
}
.section-countdown.cyberSecExpo .text-area .main-txt {
  max-width: 500px;
}
.section-countdown.cyberSecExpo .text-area .main-txt img {

}
.section-countdown.cyberSecExpo .text-area .sub-txt {
  letter-spacing: 1px;
  font-weight: 300;
  text-shadow: 0 0 5px #000;
  line-height: 1.6;
}

.section-countdown.cyberSecExpo .text-area .btn-signup {}




/******* cyberSecExpo 臺灣資安大展 end **********/
