.main-area.top .main-content{margin-top: 0px; padding: 0px}
/*.main-area p,.block p,.block-txt p  { width: 100%; font-size:1.125rem;  line-height:1.75rem; font-weight: 400;  padding:5px; margin-bottom: 20px;  color:#404040; }*/
.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:1.125rem;  line-height:1.875rem; font-weight: 400;  padding:5px; 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-wrap{ width: 100%; padding:0px; margin:0px auto; height: auto;  display: flex; flex-wrap: wrap;  }
.main-about{ position: relative; margin:0px; padding:80px 0px 40px 0px; display: flex; flex-wrap: wrap;justify-content: space-between; background-color: #fff; /*background-image: linear-gradient(to top, #d5d4d0 0%, #d5d4d0 1%, #fff 31%, #fff 75%, #efeeec 100%);*/}
.main-about .animated {  -webkit-animation-duration: 1.5s; animation-duration: 1.5s; transition: opacity 0.5s ease 0.3s;}
.block {width:50%; height: auto;margin: 0; padding:0px;  position: relative;z-index: 1 }
.block-txt{width:80%; margin:60px auto; padding:0px 30px;}
.block p { width: 100%; font-size:1.125rem;  line-height:2rem; font-weight: 400;  padding:5px; margin-bottom:15px;  color:#3f3a39;  }
.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: #3f3a39; }
.block-box{ width: 80%;bottom: 0px;left:0px;  position: absolute; z-index: 9; }
.post-btn{  margin-left:62.5%; }
.card-1{ width:auto; height: auto;  position: relative; z-index: 1;  }
.card-2{ width: auto; margin: 0px; padding: 0px; top:20%; left:15%; position: absolute; z-index: 2;  }
.card-3{ width: 50%;  height: auto;  top:65%; left:0px; position: absolute; z-index: 3; }
.card-1 img,.card-2 img,.card-3 img{display: block; margin: 0; box-shadow: 0px 5px 16px rgba(0,0,0,.3)}
@media (max-width:1366px) {
.block-txt{width:100%; margin:60px auto; padding:0px 30px;}
.block p {  font-size:1rem;  line-height:1.75rem;  }
}
@media (max-width: 1280px) {
 .main-about{ padding:80px 20px 40px 20px;}
.block-txt{width:100%; padding:20px;  }
.card-3{ width: 60%;  height: auto;  top:50%;  }
 .card-2{ width: 70%; top:20%; right:0;left:auto;   }
}
@media (max-width: 1024px) {
.main-about{ padding:40px 0px; }
.block {width:100%;margin: 0px; padding: 0px; display: block; }  
.block-txt{ padding:20px 30px;margin: 0px;  }
.block-box{ width: 100%;}   
.card-1{ width:auto; height: auto;  margin-left: 40%;  margin-top: -30%;}
.card-2{ width: 40%;  padding: 0px; margin-top: -20%; margin-left: 60%;  position: relative; z-index: 2;  }
.card-3{  width:auto;   height: auto;   top:30%; left:auto; right:0px; position: relative; z-index: 3; }
.card-1 img,.card-2 img,.card-3 img{display: block; margin: 0; box-shadow: 0px 5px 16px rgba(0,0,0,.3)}
    
}
@media (max-width:992px) {
.card-1{  width:50%; height: auto;  margin:10px auto; }
.card-2{ width:100%; height: auto;  margin:10px 0px 10px 0px  }
.card-3{ width:calc(50% - 10px); height: auto;  margin:10px 10px 10px 0px; }
.card-1 img,.card-2 img,.card-3 img{width: 100%;}

}
@media (max-width:767.98px) {
.block-txt{ margin:20px 0px; padding: 0px 20px;}   
}
@media (max-width:640px) {
.main-about{ padding:0px; }
.block p { padding:5px 0px; margin-bottom: 20px;  }    
.block-txt .btn-02{margin-bottom: 20px;}
}


 


.icon-list{width: 100%; margin:0px auto; padding:30px 0px; display: flex; flex-wrap: wrap;  }
.icon-list li{width:calc(100%/2); margin:0px; 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; }
.icon-list li h3 { width: 100%; font-size:2.75rem; line-height: 2.75rem; font-weight:900;  color:#063688;overflow: hidden; word-break: normal; word-wrap: break-word; text-overflow: ellipsis;  position: relative; }  
.icon-list li h3 span{ padding-right: 10px; font-size:1.15rem;  font-weight:400;  color:#000;  }
.icon-list li p {  width: 100%; font-size: 1rem; line-height: 1.15rem; font-weight:400; color:#777;   }  
@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:767.98px) {
.icon-list{  padding:30px 0px 30px 30px; }
.icon-list li{width:100%; margin:0px; display:flex; flex-wrap: wrap;  align-content: flex-start; transition: all 0s ease 0s;position: relative; } 
}




.main-about-box{ position: relative; margin:0px; padding:0px; display: flex; flex-wrap: wrap;justify-content: space-between; background-image: linear-gradient(to top, #d5d4d0 0%, #d5d4d0 1%, #fff 31%, #fff 75%, #efeeec 100%);}
.about-team { position: relative;z-index: 1;  display: block;  padding:40px 0px;  }
.about-team-container,.team-esg {  display: -webkit-box; display: -ms-flexbox;  display: flex;  -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0px 140px;  position: relative;z-index: 1; }
.about-team-container >.about-team-column:nth-child(odd) { width: calc(41.66667% - 11.66667px); max-width: calc(41.66667% - 11.66667px); -webkit-box-flex: 0; -ms-flex: 0 0 calc(41.66667% - 11.66667px); flex: 0 0 calc(41.66667% - 11.66667px);}
.about-team-container >.about-team-column:nth-child(2n) {  width: calc(58.33333% - 8.33333px); max-width: calc(58.33333% - 8.33333px); -webkit-box-flex: 0; -ms-flex: 0 0 calc(58.33333% - 8.33333px); flex: 0 0 calc(58.33333% - 8.33333px); margin-left: 20px;}

.about-team-container >.about-team-esg:nth-child(odd) { width: calc(45.66667% - 11.66667px); max-width: calc(45.66667% - 11.66667px); -webkit-box-flex: 0; -ms-flex: 0 0 calc(45.66667% - 11.66667px); flex: 0 0 calc(45.66667% - 11.66667px);padding-top: 40px;}
.about-team-container >.about-team-esg:nth-child(2n) {  width: calc(54.33333% - 8.33333px); max-width: calc(55.33333% - 8.33333px); -webkit-box-flex: 0; -ms-flex: 0 0 calc(55.33333% - 8.33333px); flex: 0 0 calc(54.33333% - 8.33333px);padding-top: 40px; padding-left: 40px; margin-left: 0px;}

.about-team-container.team-esg {display: -webkit-box; display: -ms-flexbox;  display: flex;  -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0px 140px;  position: relative;z-index: 1; }
.about-team-container.team-esg:nth-child(odd) { flex-direction: row-reverse }
.about-team-container.team-esg .about-team-esg:nth-child(2n){margin-left: 0px; margin-right:0px; padding-right: 40px;}
 
.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-name { margin-bottom: 20px; font-size: 26px; font-weight: 700; line-height: 1.5;  font-style: italic; letter-spacing: normal; color:#053688;}
.about-team-main-name:before { width: 10px; height:10px; content: ""; display: inline-block;  margin-right: 8px;  margin-bottom: 4px; background-color:#053688; border-radius: 2px;}
.about-team-main-row { position: relative; margin-bottom: 63px;  }
.about-team-main-summary {   margin-top: 11px; font-family: 'Poppins', sans-serif;}  
.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 { padding:0px; margin-bottom: 0px;}     
.about-team-main-name { font-size: 150%; }    
.about-team-container >.about-team-column:nth-child(odd) { width: 100%; max-width: 100%;   -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; margin-left: 0px; }
.about-team-container >.about-team-column:nth-child(2n) {  width: 100%; max-width: 100%;   -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; margin-left: 0px;  }
.about-team-container >.about-team-esg:nth-child(odd) { width: 100%; max-width: 100%;   -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; margin-left: 0px;   }
.about-team-container >.about-team-esg:nth-child(2n) {  width: 100%; max-width: 100%;   -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; margin-left: 0px;padding-top: 0px; padding-left: 0px; }
 
.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;}
}

.bg-feather { box-shadow: 0 0 10px 10px transparent  inset, 0 0 30px 20px transparent  inset, 0 0 50px 30px transparent inset; filter: blur(1px);  background-size:auto; background-position:left bottom; position: absolute; bottom: 0;z-index: -1; opacity: 0.5; }
.bg-feather-2 {  background-size:auto; background-position:left bottom; position: absolute; bottom: 0;z-index: -1;   }
.bg-feather-3 {  background-size:auto; background-position:left bottom;    }
@media(max-width:1440px) {
.bg-feather {   background-size:100% auto;   }    
.bg-feather-2 {  background-size:100% auto;   }    
}


@media(max-width:767.98px) {
.bg-feather {   background-size:150% auto;   }    
.bg-feather-2 {  background-size:150% auto;   }   
    .bg-feather-3 {   background-size:150% auto;background-position:left bottom;    }
}



/* ==== 底圖 fix=== */
.bg-background-fix { background-image: attr(src url); background-repeat: no-repeat; background-size: 80% auto;background-position:left bottom; background-attachment: fixed; background-color: #fff; position: absolute;z-index: 0; top:0px; left: 0; right: 0; bottom: 0; line-height: 0;  width: 100%;  }
@media(max-width:1024px) {
.bg-background-fix {background-size:contain;}
}


.about-box{ width: 90%; margin:6% auto;position: relative;z-index: 1 }
.box { position: relative;z-index: 1; margin: 0 auto;padding:30px 30px 30px 50px; width: 80%; height: auto; transition: 0.4s;  pointer-events: all; }
.box:before {content: ""; position: absolute;z-index: 0; top: 0; left: 0;  width: 100%; height: calc(100% + 20px); background: transparent; border-top: 2px solid #d9e1ed; border-left: 2px solid #d9e1ed; box-sizing: border-box;}
.box:after { content: ""; position: absolute;z-index: 0; top: 0; left: 0; width: 100%; height: calc(100% + 20px); border-bottom: 2px solid #d9e1ed; border-right: 2px solid #d9e1ed; box-sizing: border-box;} 
.box .fas { font-size: 25px; height: 50px; width: 50px; line-height: 50px !important;  color: #2C3A47; background-color: #fff}
.box .fa1 {position: absolute; top: 0; left: 0;}
.box .fa2 {position: absolute;  bottom: -30px; right: 0; z-index: 1;}

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

.choose-us{ background-color:#f2f2f3;  }
.award-card { display: grid; width: 100%; margin: auto; grid-template-columns: repeat(auto-fit, minmax(30%, 1fr)); gap: 30px; padding: 15px 0px; position: relative;z-index:99 }
.award-card > .award-w30 {  aspect-ratio: 16 / 9;  width: 100%;  }
.award-card > .award-w40 {  aspect-ratio: 16 / 9;  width: 100%;  }
.award-w30 img {  width: 100%; height: auto;   object-position: center;}
.award-w40 .item-inner{ padding: 20px 0px;}
.award-w40 .item-inner h3{ font-size:1.125rem;font-weight: 500; min-height: 50px; color: #063688}
.award-card > .award-w40  a { padding-bottom: 10px; display: block;}
@media (max-width:767.98px){
.award-card {  grid-template-columns: repeat(auto-fit, minmax(40%, 1fr));  gap: 10px;padding: 0px; }  
.award-w40 .item-inner h3{ font-size:.9rem;}   
.about-box.w-full .award-card {  grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));  gap: 10px;padding: 0px; }  
}




.overview-pic{width: 100%; max-width:60%; display: block; margin: auto;}
.overview-pic img{width: 100%; max-width:100%; display: block; margin: auto;}
@media (max-width: 1024px){
.overview-pic{  max-width:100%}

}
.overview { position: relative;width: 100%;}
.overview-list { position: relative; margin-top: 24px;}
.overview-summary { font-size: 26px; font-weight: 500; line-height: 1.5; letter-spacing: 1px; position: relative; color:#053688;}
.overview-list-title { font-size: 26px; font-weight: bold; color:#053688; line-height: 1.88; letter-spacing: normal;  position: relative;  display: -webkit-box;  display: -ms-flexbox;  display: flex;  -webkit-box-align: center;  -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start;}
.overview-list-title:after { width: auto;  height: 1px; content: ""; display: block;  -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; margin-left: 16px; background-color: #f1f1f1;}

.overview-list-main { position: relative; display: block; padding: 43px 10px 40px;}
@media (min-width: 1200px){
.overview-list-main { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;}
}

@media (max-width:768px) {
.overview-list-main {padding: 10px 0px;}     
}

.overview-list-column { position: relative;  margin-top: 25px;}
@media (min-width: 1200px){
.overview-list-main>.overview-list-column:nth-child(2n+2), .overview-list-main>.overview-list-column:nth-child(odd) { width: calc((100% - 20px)/2); max-width: calc((100% - 20px)/2); -webkit-box-flex: 0; -ms-flex: 0 0 calc((100% - 20px)/2);  flex: 0 0 calc((100% - 20px)/2);}
}

.overview-name { font-size: 24px!important; font-weight: 700; line-height: normal; letter-spacing: normal;  position: relative;  padding-left: 18px; color:#053688; font-family: 'Playfair Display', serif; }
.overview-name:before { width: 4px; height: 4px; content: ""; position: absolute; top: 12px; left: 0; background-color: #f38054; border-radius: 50%;}
.overview-desc { position: relative;  padding-left: 18px!important;padding-right: 18px!important;  margin-top: 10px;   }

@media (max-width:767.98px){
 .overview-desc {  padding-left: 10px!important;padding-right: 10px!important;   }   
 }
 /*about-history*/
.milestone-block { padding: 150px; }
.milestone-box { position: relative; margin: 0 auto; }
.milestone-box .milestone-list { position: relative; z-index: 1; }
.milestone-box .milestone-list p { font-size: 1rem;  font-weight:400; line-height: 1.75rem; color: #1d2c2f;  font-family: 'Poppins', sans-serif;  }
.milestone-box .milestone-list.year-none .milestone-list-year {  display: none; }
.milestone-box .milestone-list.aos-animate .milestone-list-dot-line { -ms-transform: scaleX(1);  transform: scaleX(1); }
.milestone-box .milestone-list.aos-animate .milestone-list-info h3 { opacity: 1; }
.milestone-box .milestone-list.aos-animate .milestone-list-info p { opacity: 1;  -ms-transform: translateY(0); transform: translateY(0); }
.milestone-box .milestone-list-year {margin-bottom: 20px; font-size: 32px; color: #00A0B6; font-weight: 700; position: relative;  z-index: 1; background-color: #fff; font-family: 'Playfair Display', serif; }
.milestone-box .milestone-list-info {  position: relative; }
.milestone-box .milestone-list-info .milestone-list-title {  display: inline-block; }
.milestone-list-title ul li{ font-size: 1rem; font-weight:400; line-height: 1.75rem; color: #1d2c2f;  font-family: 'Poppins', sans-serif; }
.milestone-list-title ul li strong{  color:#b78603;  }
.milestone-box .milestone-list-info h3 {font-size: 1.15rem; font-weight:400;line-height: 36px; color: #00A0B6; margin-bottom: 20px; background-color: #FFF; position: relative; z-index: 1;  padding-right: 10px; transition-delay: .5s; transition-duration: .5s;  opacity: 0; }
.milestone-box .milestone-list-info p {  -ms-transform: translateY(30px); transform: translateY(30px); opacity: 0; transition-duration: .5s; transition-delay: .5s; }
.milestone-box .milestone-list-info .milestone-list-dot { width: 15px; height: 15px;  border-radius: 50%; border: 1px dotted #00A0B6; position: absolute; top: 6px; display: -ms-flexbox;  display: flex;  -ms-flex-align: center; align-items: center;  -ms-flex-pack: center; justify-content: center; }
.milestone-box .milestone-list-info .milestone-list-dot span { width: 5px; height: 5px; display: block; background-color: #00A0B6; margin: 0 auto; border-radius: 50%; }
.milestone-box .milestone-list-info .milestone-list-dot-line { position: absolute; height: 1px;  background-color: #00A0B6; transition-duration: .5s; transition-delay: .3s;  -ms-transform: scaleX(0); transform: scaleX(0); }
.milestone-box .milestone-list-flex {  display: -ms-flexbox;  display: flex;  -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 50px; }
.milestone-box .milestone-list-img {  font-size: 0; }
.milestone-box .milestone-list-img a { width: calc((100% - 2px) ); max-width: 300px;  display: inline-block;  margin-right: 20px; }
.milestone-box .milestone-list-img a:last-child {
margin-right: 0; }
.milestone-box::after { content: '';  width: 1px;  height: 100%;  position: absolute;  left: 50%; top: 0; background-color: #00A0B6; transition: all .5s linear; }
@media (min-width:1024px) {
 .milestone-block { padding: 50px; }
   
}

@media (min-width: 992px) {
.milestone-list .milestone-list-year { text-align: center; }
.milestone-list .milestone-list-flex .milestone-list-info, .milestone-list .milestone-list-flex .milestone-list-img {  width: 50%; }
.milestone-list:nth-child(odd) .milestone-list-info { -ms-flex-order: 2;  order: 2;  padding-left: 80px; }
.milestone-list:nth-child(odd) .milestone-list-info .milestone-list-dot-line { -ms-transform-origin: left;  transform-origin: left; }
.milestone-list:nth-child(odd) .milestone-list-img { -ms-flex-order: 1; order: 1;  padding-right: 80px; text-align: right; }
.milestone-list:nth-child(odd) .milestone-list-dot { left: -7px; }
.milestone-list:nth-child(odd) .milestone-list-dot-line {  width: 70px;  top: 13px;  left: 0; }
.milestone-list:nth-child(even) .milestone-list-info {  -ms-flex-order: 1; order: 1;  padding-right: 80px; }
.milestone-list:nth-child(even) .milestone-list-info .milestone-list-dot-line { -ms-transform-origin: right; transform-origin: right; }
.milestone-list:nth-child(even) .milestone-list-img {  -ms-flex-order: 2;  order: 2;  padding-left: 80px; text-align: left; }
.milestone-list:nth-child(even) .milestone-list-dot {  right: -8px; }
.milestone-list:nth-child(even) .milestone-list-dot-line { width: 20%; top: 13px; right: 0; } 
}

@media (max-width: 991px) {
.milestone-block { padding: 0px; }
.milestone-block {  overflow: hidden; }
.milestone-box::after { left: 32px; }
.milestone-box .milestone-list-flex { display: block;  padding-left: 80px; }
.milestone-box .milestone-list-info .milestone-list-dot { left: -55px; }
.milestone-box .milestone-list-info .milestone-list-dot-line { top: 13px; left: -38px;  width: 39px;  -ms-transform-origin: left; transform-origin: left; }
.milestone-list .milestone-list-info { margin-bottom: 20px; }
.milestone-list .milestone-list-info h3 {  margin-bottom: 5px; }
.milestone-list.aos-animate .milestone-list-img { opacity: 1;  -ms-transform: translateX(0px); transform: translateX(0px); }
.milestone-box .milestone-list-img a { width: 100%; margin: 10px 0px; }
.milestone-box .milestone-list-img a:last-child { margin-bottom: 0; } 
.milestone-box .milestone-list-info p {  opacity: .5;   }  
.milestone-box .milestone-list-info .milestone-list-title { margin: 0px;padding: 0px; }
}

@media (max-width:320px) {
.milestone-box .milestone-list-flex { padding-left: 20px; }
.milestone-box .milestone-list-info p {  padding-left: 20px; }  
.milestone-box .milestone-list-img a {  margin: 10px 0px 10px 20px; }
}

.org-box{ width: 100%;max-width: 80%; margin:6% auto;position: relative;z-index: 11 }
@media (max-width:840px) {
.org-box{  max-width: 100%; margin:0px auto;padding: 40px 0px; }    
}