body{font-family: "Arial","微軟正黑體";background-color: #000;}
button:focus{outline:none}
.container{position: relative;max-width: 80%;}
a:hover{text-decoration: none;}
section{padding: 80px 0;}
p{font-size: 20px;}
h3{display: flex;align-items: center;font-size: 3rem;font-weight: 400;transform: translate3d(0px, 0px, 0px);}
h4{line-height: 1.8;}
h6{font-size: 1.8rem;}
h5{font-size: 2.2rem;}





/* visual */
header#visual{height: 80vh;overflow: hidden; position: relative;}
header#Visual .master_content{height: 80vh;position: relative;background: url('../images/header-01bg.jpg')top center repeat;background-size:cover;}
header#Visual .master_content .title > img {width: 55%;padding-top: 9%;padding-left: 4%;}
header#Visual .CPENTAI_logo{width: 50%;position: absolute;top: 49%;left: 35%;z-index: 1000;}

#CPENTAI img{width: 80%;}
#CPENTAI p{line-height: 2.2;color: #FFF;}
#CPENTAI .p-80{padding:0 80px;}

/* First*/
section#First{background: #930909;padding: 120px 0 80px 0;position: relative;}
section#First:before{content: "";width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: url("../images/allbg.jpg") no-repeat center;background-size: cover;background-attachment: fixed;}

section#First .icon{width: 70%;display: block;}
section#First .icon2{width: 80%;display: block;}

/* 標題共用CSS*/
.p-recommend__image{display: block;margin: auto;height: 85px;}



/* Second */
section#Second{position: relative;overflow: hidden;background: #930909;}
section#Second:before{content: "";width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: url("../images/header-05bg.png") no-repeat center;background-size: cover;z-index: 0;background-attachment: fixed;}

section#Second p{font-size: 17px;}
.feature-box {
  background-color: rgba(0, 0, 0, 0.5);
  box-shadow: inset 0px 1.5px 0px rgba(162, 171, 53, 0.25);
    color: white;
    border-radius: 8px;
    padding: 30px 20px;
    margin-bottom: 20px;
    position: relative;

  }

  .feature-box h5 {
    font-weight: bold;
    color: #ffe600;
    font-size: 1.6rem;
  }

  .feature-box-number {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #0d4f5f;
    color: white;
    padding: 5px 15px;
    font-weight: bold;
    border-top-left-radius: 8px;
    border-bottom-right-radius: 8px;
  }

  .feature-icon {
    font-size: 36px;
    margin-bottom: 15px;

  }




/* Third */
.section-title { color: #007bff; font-weight: bold; }
.highlight { font-weight: bold; font-size: 1.8rem; color: #333; }
.sub-highlight { font-weight: bold; font-size: 1.6rem; color: #FFF; margin-top: 10px; }
.mission-text { margin-top: 20px; color: #333; }
.stat-box { border-radius: 8px; padding: 30px 20px;text-align: center;width: 100%; }
.stat-number { color: #ce0d0d; font-size: 4.5rem; font-weight: bold; margin-top: 5px; }
.icon { font-size: 3rem; color: #6ec1e4; margin-bottom: 10px; }
#Third li{color: #FFF;font-weight: bold;font-size: 1.1rem;margin-bottom: 1%;}
#Third{padding: 100px;overflow: hidden;position: relative;}


/* 雲 */
.slide-wrap{  
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none; /* 保證不影響上方內容點擊 */
  overflow: hidden;

}


  #slide-animation {
    display: flex;
    align-items: flex-end;
  }
  .slide-wrap {
    position: absolute;
    display: flex;
    flex-flow: row nowrap;
    width: 100vw;
    over-flow: hidden;
  }
  .slide-wrap ul {
    padding: 0;
    width: auto;
    display: flex;
    flex-shrink: 0;
  }
  .slide-wrap ul li {
    display: inline-block;
    width: 3200px;
    height: 582px;
    list-style: none;
  }
  .slide-wrap ul li img {
    width: 100%;
  }
  




#Third .card{background-color: rgba(9, 36, 65, 0.6);}

.Third_title {color: #FFF;}
.Third_title:hover {color: #ce0d0d;}

/* 3欄 */
.icon-box {
  width: 60px;
  height: 60px;
  background-color: #007070;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.first  {
  margin-top: 100px;
}
  

.first  .icon-box{
  background-color: #273775;
}

.icon-box img {
  width: 30px;
  height: 30px;
  object-fit: contain;
}
.Third_txt{color: #FFF;font-weight: bold;font-size: 1.1rem;}

section#Third  h3:after{
  background-color: #ce0d0d;
  bottom: -30px;
  content: "";
  display: inline-block;
  height: 3px;
  left: calc(50% - 40px);
  position: absolute;
  text-align: center;
  width: 80px;
}
.p-110{padding:0 110px;}

/* Discount */
section#Discount{background: #133b6b;text-align: left;padding: 80px 0;position: relative;}
section#Discount:before{content: "";width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: url("../images/allbg.jpg") no-repeat center;background-size: cover;z-index: 0;background-attachment: fixed;}

section#Discount .box {background-color: #e0e0e0;max-width: 900px;margin: 40px auto;padding: 40px 20px;border-radius: 10px;text-align: center;}

h1 {font-size: 20px;font-weight: bold;margin-bottom: 10px;}

.highlight-green {color: #2ecc71;font-weight: bold;}


.item-column {width: 100%;text-align: left;}
.item-column ul {list-style: none;padding-left: 0;}
.item-column li {margin-bottom: 8px;}

.callout {color: #2ecc71;font-weight: bold;margin-top: 30px;}

.footer {margin-top: 40px;font-size: 14px;color: #444;}

.button {display: inline-block;margin-top: 10px;padding: 10px 20px;background: white;border: 1px solid #ccc;border-radius: 50px;font-weight: bold;text-decoration: none;color: #333;}

.logo-image {max-width: 120px;margin-bottom: 10px;}
section#Discount .card{border: 1px solid #133b6b;background-color: rgba(9, 36, 65, 0);}

 /*優惠 */

 #Discount .prmo-box{
  position: relative;
  padding-left: 2rem; /* 給左邊的線留空間 */

}
.item-box {background-color: rgba(9, 36, 65, 0.7);color: white;padding: 30px;border-radius: 10px;display: flex;flex-wrap: wrap;justify-content: space-around;margin: 30px auto;width: 95%;}

#Discount .prmo-box::before {
  content: "";
  position: absolute;
  left: 0;
  top: 15%;
  bottom: 15%;
  width: 6px;
  border-radius: 4px;
  background: linear-gradient(to bottom, rgba(206,13,13,0) 0%,rgba(206,13,13,1) 37%,rgba(206,13,13,1) 41%,rgba(206,13,13,1) 65%,rgba(206,13,13,1) 67%,rgba(206,13,13,0) 100%);  /* 漸層紅 */
}
/*優惠 */

#Discount .icon{width: 80%;}

.main_title{color: #000;font-weight: bold;font-size: 2.8rem;}
.main_title span{border-bottom: 3px solid #44daca;}
.main_title span:hover{border-bottom: none;}
.card-title{color: white;font-size: 2rem;}
.card-text{color: white;font-size: 1.1rem;line-height: 1.8;text-align: justify;}
#Discount hr{background: #ce0d0d;}

.Article:hover{background-color: rgba(255, 255, 255, 0.1);}

/* btnLink */
section#btnLink{padding:5% 0;background-color: #FFF;position: relative;}
section#btnLink .btn{display: block;position: relative;border-radius: 45px;width: 45%;height: 64px;margin:10px auto;background: rgb(255, 230, 65);color: #007070;font-size: 1.5rem;line-height: 3.5rem;font-weight: bold;}
section#btnLink .btn:hover{border: 2px solid #FFF;background: #FFF;transition: opacity .3s;color: #007070;font-weight: bold;}

section#btnLink .btn:before{content: '';position: absolute;right: 10px;top: 50%;-webkit-transform: translate(0, -50%);transform: translate(0, -50%);width: 45px;height: 45px;}
section#btnLink .btn:before{background: url(../images/ico_arrow_2.svg) no-repeat;pointer-events: none;transition: opacity .3s;}

section#btnLink .btn:after{background: url(../images/ico_arrow_2-2.svg) no-repeat;}
section#btnLink .btn:after{content: '';position: absolute;right: 10px;top: 50%;-webkit-transform: translate(0, -50%);transform: translate(0, -50%);width: 45px;height: 45px;pointer-events: none;transition: opacity .3s;opacity: 0;}

section#btnLink .btn:hover:before{opacity: 0;}
section#btnLink .btn:hover:after{opacity: 1;}

section#btnLink:before{content: "";width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: url("../images/header-05bg.png") no-repeat center;background-size: cover;z-index: 0;background-attachment: fixed;}










@media(min-width: 1441px){
  .container {max-width: 1320px;}
}
@media(max-width: 1440px){}

@media(max-width: 767px){
img{width: 100%;}
.container{max-width: 100%;}



/* visual */
header#visual{height: 63vh;}
header#visual .title img{width: 100%;z-index: 1000;position: absolute;}
header#Visual .master_content{height: 80vh;position: relative;background: url('../images/header-01bg.jpg') -760px 0px repeat;background-size:cover;overflow: hidden;}
header#Visual .master_content .title > img {width: 100%;padding: 0;position: absolute;bottom: 50px;left: 0;}
#CPENTAI .p-80{padding:0;}
.circleBox {z-index: 100;}

section#First .icon2,section#First .icon{width: 100%;}
#Third{padding: 0;}
.p-110{padding:0;}
.box-group {flex-direction: column;}
.stat-box {
  padding: 20px 24px;
  margin: 0 auto;
  width: 100%;
}
.mx-sm-0{margin-left: 0;margin-right: 0;}
.px-sm-0{padding-left: 0 !important;padding-right: 0 !important;}
/* btnLink */
section#btnLink .btn{width: 100%;}

}
