.main-area.top .main-content{margin-top: 0px; padding: 0px}
 .block p strong{  display: block;  width: 100%; font-size: 1.313rem; line-height: 2rem; letter-spacing: 1.2px; font-weight:400;  padding:5px; margin-bottom: 10px; color: #404040; }
.block-txt p strong{  display: block;  width: 100%; font-size: 1.5rem; line-height: 2rem; letter-spacing: 1.2px; font-weight:700;  padding:5px; margin-bottom: 10px; color: #eb9924;  }
.block p,.about-team-main-summary p ,.about-box p,.overview-list-column p,.overview-desc{ width: 100%; font-size:1rem;  font-size: min(max(3.5vw, 0.9rem), 1rem); line-height:1.75rem; font-weight:400;  margin-bottom:20px;  color:#3f3a39;  }
@media (max-width:767.98px) {
.block p,.about-team-main-summary p ,.about-box p,.overview-list-column p,.overview-desc{  margin-bottom:20px; line-height:1.75rem;   }
}
@media (max-width:1024px) {
.main-area p,.block p,.block-txt p  {  font-size:1rem;}
}

 
 
 
/*main-about
=================================*/
.main-about{ position: relative; z-index: 0; margin:0px; padding:0px; display: flex; flex-wrap: wrap;justify-content: space-between;  overflow: hidden; }
.main-about .animated {  -webkit-animation-duration: 1.5s; animation-duration: 1.5s; transition: opacity 0.5s ease 0.3s;}

@media (max-width: 1280px) {
.main-about{ padding:80px 0px 40px 0px;}
}
@media (max-width: 1024px) {
.main-about{ padding:40px 0px; }
}
@media (max-width:640px) {
.main-about{ padding:0px; }
}
 





.block-wrap{ display: flex; flex-wrap: wrap; padding: 0px 60px; position: relative;  }
.block {width:50%; height: auto;margin: 0 auto; padding:0px; position: relative;z-index: 1 }

@media (min-width: 1400px) {
.block-wrap{  padding: 0px 120px;}
.block-wrap .block:nth-child(1){  padding:140px 0px 20px 0px;  }  
.block-wrap .block:nth-child(2){  padding:140px 0px 0px 0px;  }  
}
@media (min-width: 1600px) {
.block-wrap{  padding: 0px 140px;}
}

@media (max-width: 992px) {
.block-wrap .block:nth-child(1){ width: 100%; padding:0px 0px 20px 0px;  }  
.block-wrap .block:nth-child(2){ padding:0px 0px 50px 0px; margin: auto;  }  
}

@media (max-width: 767.98px) {
.block-wrap{  padding: 0px 40px;  }
.block {width:100%;  }
}

 @media (max-width: 320px) {
.block-wrap{  padding: 0px 30px;  }
}




.block p { width: 100%;  margin-bottom: 5px;    }
.block p strong{   font-size: 1.15rem; line-height: 2rem; letter-spacing: 1.2px; font-weight:700;  margin-bottom: 10px; color: #333; }
@media (max-width:1366px) {
.block p {  font-size:1rem;  line-height:1.75rem;  }
}
@media (max-width:640px) {
.block p { padding:5px 0px; margin-bottom: 20px;  }    
}





.post-btn{  margin-left:62.5%; }
.card-1{ width:auto; height: auto; position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: flex-end; }
.card-font{ width: 50%;  height: auto;  top:40px;left:auto; right:0px; position: absolute; z-index: 3;  }
.card-1 img,.card-font img{display: block; margin: 0; box-shadow: 0px 5px 16px rgba(0,0,0,.3)}

@media (max-width:1200px) {
.card-font{ width:60%;  height: auto;  top:40px;left:auto; right:-60px; position: absolute; z-index: 3;  }
 
}
 
@media (max-width:1024px) {
.card-font{ top:28%; bottom: auto; left:auto; right:0;  }
.block {width:100%;margin: 0px auto; padding: 0px;   }  
}

@media (max-width: 992px) {
.card-font{ top:8%; left:35%; right: auto;} 
.card-1,.card-font{width: 30%;} 
}
@media (max-width: 768px) {
.card-1,.card-font{width: 50%;}  
.card-font{  left:auto; right: 0px;} 

}

 


 
.block-box { border-left: 8px solid #e5e5e5; padding: 0px 40px 20px 40px;}
@media (max-width: 1024px) {
.block-box{ width: 100%;}   
}

@media (max-width:767.98px) {
.block-box {  border-left:none;   padding: 0px 0px 20px 0px;}    
}


.block-txt{width:100%; margin:0px auto; padding:0px 60px 20px 0px ; position: relative; z-index: 1;}
@media (max-width:1366px) {
.block-txt{width:100%; margin:60px auto; padding:0px 30px;}
}
@media (max-width: 1280px) {
.block-txt{width:100%; padding:20px;  }
}
@media (max-width: 1024px) {
.block-txt{ padding:20px 0px;margin: 0px;  }
}


@media (max-width:767.98px) {
.block-txt{ margin:20px 0px; padding: 0px ;}   
}
 
  
.about-box{ width: 90%; margin:6% auto;position: relative;z-index: 1 }
@media(max-width:1200px) {
.about-box{ width:100%; margin: auto; }    
}

@media(max-width:1024px) {
.about-box{ padding: 0px 30px; }    
}


@media(max-width:767.98px) {
.about-box{ width: 100%; padding: 0px; }   
.wrapper .about-box:nth-child(2){margin-top: 20%;}
}

.box { position: relative;z-index: 1; margin: 0 auto;padding:30px 30px 30px 50px; width: 80%; height: auto; transition: 0.4s;  pointer-events: all; }
@media(max-width:1280px) {
.box { padding: 0px 30px; }   
}
@media(max-width:1024px) {
.box {  width: 100%;  padding: 0px; }   
}
@media(max-width:767.98px) {
.box {  padding:30px 10px ;  }   
}

 
.about-team { position: relative;z-index: 1;  display: block; width: 100%; padding:40px 0px 140px 0px;  }
  @media(max-width:1200px) {
 .about-team {   padding:40px 0px 140px 0px;  }
     
}

.photo {  width: 100%; height: auto; position: relative;}
.photo img {  border-radius: 10px; background-position: center;   width: inherit;height: inherit;}
.photo-image { color: rgba(0, 0, 0, 0.16);box-shadow: 0 2px 4px, 0 4px 8px -1px, 0 8px 16px -2px, 0 16px 32px -4px, 0 32px 64px -8px, 0 64px 128px -16px; background-size: 150%;}
.photo-shadow { background-color: #fff; box-shadow: 0 2px 25px 2px rgba(0, 0, 0, 1), 0 2px 50px 2px rgba(0, 0, 0, 1), 0 0 100px 3px rgba(0, 0, 0, .25); height: 1px;  margin: -1px auto 0;  width: 80%; z-index: -1;}

.about-team-main{width: 100%;display: flex; flex-wrap: wrap;justify-content: space-between; position: relative;z-index: 1 }
.about-icon { position: relative;z-index: 1;  display: block; width: 100%; padding:80px 0px;  }

.icon-list{width: 100%; margin:0px auto; padding:30px 0px; display: flex; flex-wrap: wrap;  }
.icon-list li{width:calc(100%/5 - 40px); margin:20px; padding: 20px 0px; display:flex; flex-wrap: wrap; align-content: flex-start;border:solid 1px #eaf7ff;border-radius:15px;   transition: all 0s ease 0s;position: relative;background-image: linear-gradient(to bottom, #eaf7ff 0%,rgba(255,255,255,.1) 100%); } 
.icon-list li.half{width:calc(100%/2 - 40px); margin:20px; display:flex; flex-wrap: wrap;  align-content: flex-start; transition: all 0s ease 0s;position: relative; } 
.icon-list li .item{ width: 100%; margin:0px; padding:0px 0px 0px 10px;display: flex; flex-wrap: wrap; align-items: center; }
.icon-list li .w-title{width:100%; margin: auto; font-size: 1rem; line-height: 1.15rem; font-weight:400; color:#777;}
.icon-list li .w-txt{width:auto; margin: auto ; display:flex; flex-wrap: wrap; align-items: center;  }
.icon-list li .w-title p{  font-size: 1.275rem; line-height: 1.5rem; font-weight:400;text-align: center;  color:#000;margin: auto auto 20px auto; }
.icon-list li .w-txt span{ font-size:2.75rem; line-height: 2.75rem; font-weight:900; font-style:normal; color:#063688;   }
.icon-list li .w-txt em{ margin-left: 10px; font-size:1rem;  font-weight:400; font-style: normal; color:#03a9f4;   }
@media (max-width: 1280px) {
.icon-list{  padding:30px 10px 30px 60px; }
.icon-list li h3{  font-size: 2rem; }
.icon-list li h3 span{ font-size:1rem;  }
.icon-list li p{font-size:.875rem; }
}

@media (max-width: 1200px) {
.icon-list{  padding:30px 0px; }
}

@media (max-width:767.98px) {
.icon-list{  padding:30px 0px; }
.icon-list li.half{width:calc(100%/2 - 20px); margin:20px 10px;}     
.icon-list li{width:100%; margin:0px; display:flex; flex-wrap: wrap;  align-content: flex-start; transition: all 0s ease 0s;position: relative; } 
}




/* ==== 底圖 fix=== */
.bg-background-icon {background-image: attr(src url); background-repeat: no-repeat; background-size:100% auto;background-position:right bottom;position: absolute;z-index: 0; top:0px; left: 0; right: 0; bottom: 0; line-height: 0;  width: 100%; pointer-events: none;}


.about-team-main-name { margin-bottom: 20px; font-size: 2rem;  font-size: min(max(3.5vw, 1.375rem), 2rem); font-weight: 700; line-height: 1.5; letter-spacing: normal; color:#2da6e0;}
.about-team-main-name:before { width: 10px; height:10px; content: ""; display: inline-block;  margin-right: 8px;  margin-bottom: 4px; background-color:#2da6e0; border-radius: 2px;}
.about-team-main-row {  width: calc(100%/2 - 40px);  margin:0px 20px 63px 20px;  position: relative; }
.about-team-main-summary {   margin-top: 11px;  }  
.about-team-image{position: relative;}
.background{position: relative; width: 100%; height: 480px; overflow: hidden; }
.background-bg img{ width: 100%; max-width: 100%; height: auto; display: block; margin: auto; -o-object-fit: cover;  object-fit: cover; -webkit-backface-visibility: hidden;  backface-visibility: hidden; transition: all 0.3s; position: relative; z-index: 0;}





@media (max-width:1024px) {
.about-team-container {  padding: 0px 40px 30px 40px;}      
}

@media (max-width:768px) {
.about-team-container .wrapper{padding: 0px;}    
.background{ height: 380px; }    
}
@media (max-width:767.98px) {
 .about-team-container {  padding: 0px 20px;}      
.about-team-main-name { font-size: 150%; }    
.background{ height: 200px; }    
}

/* ==== 底圖 === */
.bg-background {background-image: attr(src url); background-repeat: no-repeat; background-size: 100% auto;background-position:center bottom;position: absolute;z-index: 0; top:0px; left: 0; right: 0; bottom: 0; line-height: 0;  width: 100%; pointer-events: none;}
@media(max-width:767.98px) {
.bg-background {background-size:cover;}
}

 

 

 
@-webkit-keyframes caseScale {
0% { opacity: 0; -webkit-transform: scale(0); transform: scale(0); }
100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
}
@keyframes caseScale {
0% { opacity: 0; -webkit-transform: scale(0); transform: scale(0); }
100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
}
@-webkit-keyframes caseScale2 {
0% { opacity: 0; -webkit-transform: scale(0.2); transform: scale(0.2); }
100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
}
@keyframes caseScale2 {
0% { opacity: 0; -webkit-transform: scale(0.2); transform: scale(0.2); }
100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
}

 
.shape.shape1 {-webkit-animation: caseScale 1s linear forwards; animation: caseScale 1s linear forwards;}
.shape.shape2 { -webkit-animation: caseScale 1s 0.8s linear forwards; animation: caseScale 1s 0.8s linear forwards;}

.pic-box .pic {-webkit-animation: caseScale2 1s 0.4s linear forwards; animation: caseScale2 1s 0.4s linear forwards;}
.pic-box .picLogo { -webkit-animation: caseScale2 1s 1.2s linear forwards; animation: caseScale2 1s 1.2s linear forwards;}





.pic-box{-webkit-box-ordinal-group: 3;  -ms-flex-order: 2; order: 2; width: 45%; position: relative; padding: 0 60px 160px;}
@media (max-width: 1300px) {
.pic-box{width: 40%; }
}
@media (max-width: 1200px) {
.pic-box{ width: 50%; padding: 0; -webkit-box-ordinal-group: 2;  -ms-flex-order: 1;  order: 1; margin: 0 auto;}
}
@media (max-width: 640px) {
.pic-box{width: 100%;}
}
.pic-box .pic {   position: relative;  width: 100%; opacity: 1;}
/*.pic-box .pic {clip-path: polygon(0 20%, 50% 0, 100% 19%, 100% 81%, 53% 100%, 0 83%);}*/



@media (max-width: 1200px) {
.pic-box .pic { width: 75%; margin: 0 auto; }
}
.pic-box .pic img { width: 100%; display: block; -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: 1}
.pic-box .picLogo { position: absolute; bottom: 20%; left: -100px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center;  -ms-flex-align: center; align-items: center; width: 400px; height: 400px; background: url("../images/index/card-logo-bg.png") no-repeat center;background-size: contain; pointer-events: none; opacity: 1;}
.pic-box .picLogo img { position: relative; z-index: 2; width: 40%;}

@media (max-width: 1280px) {
.pic-box .picLogo { bottom: 5%; }
}
@media (max-width: 1200px) {
 .pic-box .picLogo { bottom: -5%;}
}
@media (max-width: 1023px) {
.pic-box .picLogo {bottom: -15%;}
}
@media (max-width: 640px) {
.pic-box .picLogo {width: 240px;height: 290px;left: -30px;}
}
@media (max-width: 360px) {
.pic-box .picLogo {bottom: -35%;}
}

.main-about .shape { position: absolute;}
@media (max-width: 1023px) {
.main-about .shape { width: 30%; }
}
.main-about .shape img { width: 100%; display: block; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
.main-about .shape.shape1 { top: 0; left: 0; opacity: 1; -webkit-transform: scale(0); transform: scale(0);}
@media (max-width: 640px) {
 .main-about .shape.shape1 { left: 20px; }
}
.main-about .shape.shape2 { bottom: 125px; right: 0px; opacity: 1; -webkit-transform: scale(0); transform: scale(0);}
@media (max-width: 1280px) {
.main-about .shape.shape2 { bottom: 10%; }
}
@media (max-width: 640px) {
.main-about .shape.shape2 { right: 20px; }
}




.bg-about{padding-top: 50px;}
.main-wrap{ width: 100%; padding:0px; margin:0px auto; height: auto;  display: flex; flex-wrap: wrap;  }
.box-wrap{ width: 100%; padding: 0px; margin:0px auto; height: auto;  display: flex; flex-wrap: wrap; justify-content: space-between;position: relative; }
.box-wrap::before { content: ""; position: absolute; width: 100%; height: 517px; bottom:0px; left: 0;background: url("../images/index/bg-item.png") no-repeat left bottom;background-size: 100% auto;}


.main-about .box-wrap:nth-child(odd)::before { content: ""; position: absolute; width: 100%; height: 517px; bottom:0px; left: 0;background: url("../images/index/bg-item-w.png") no-repeat left bottom;background-size: 100% auto;}


.main-about .box-wrap:nth-child(odd){ background-color: #F2F5F5}
.main-about .box-wrap:nth-child(odd) .main-wrap{ flex-direction: row-reverse;  }