/* CSS Document */

body {	-webkit-text-size-adjust:100%; font-family: 'Noto Sans TC', sans-serif; overflow-x: hidden; position: relative;}
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; transition: all 0.4s ease-out 0s; }
a:hover { text-decoration:none; }

* { box-sizing: border-box;}

.content-Box { max-width:1366px; width: 100%; margin:0 auto; text-align:left; position:relative; clear:both;}

#content { font-size: 18px; line-height:1.7; color: #333; letter-spacing: 0rem; font-weight: 400; padding-top: 75px;}
#content p{ margin-bottom: 30px; margin-top: 0; font-size: 18px;line-height:1.7;  font-weight: 400;}
p, td, li, label { font-size: 18px;line-height:1.7;  font-weight: 400;}

.photo-fit img { object-fit: cover; width: 100%; height: 100%; position: absolute; z-index: 1; left: 0; top: 0;}

.photo {line-height: 0; height: 0; padding-bottom: 40%; overflow: hidden; position: relative; z-index: 1; margin-bottom: 0px;}
.imgCenter {position: absolute; top: 0; left: 0; right: 0; bottom: 0; line-height: 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; z-index: 2;}
.imgCenter img {max-height: 100%;}

.about-section-1 { padding: calc(40px + 7%) 5%; background: url("../images/about-bg.jpg") no-repeat top center; background-size: cover;}
.about-section-1-content { padding-top: 12%; display: flex; flex-direction: column; flex-wrap: nowrap; align-items: center; max-width: 1280px; margin: 0 auto;}
.about-section-1-content > div { text-align: center; color: #fff;}
.about-section-1-logo { max-width: 570px; padding-bottom: calc(20px + 4%);}
.about-section-1-title { font-size: clamp(20px, 1.5vw, 27px); letter-spacing: 0; line-height: 1.3; padding: 0 0 calc(20px + 15%) 0; margin: 0;}
.about-section-1-data { line-height: 2;}

.agent-title { color: #000; text-align: center; padding:30px 5% 15px 5%; line-height: 1; font-size: clamp(22px, 1.5vw, 30px); }
.agent-list-section {  padding: calc(20px + 3%) 5%; }

.loop { position: relative; padding: 0 0px;}
.loop .owl-dots { display: none;}
.loop .owl-item {position: relative; }
.loop .owl-item:nth-child(even) .idx-pro-data { background: #07517d;}
.loop .owl-nav { position: absolute; top:calc(50% - 40px); left: 0; width: 100%; z-index: 11;}
.loop .owl-prev, .loop .owl-next { position:absolute; z-index:100; top:calc(50% - 0px); width: 50px !important; height: 50px !important; border-radius: 100% !important; background: rgba(255,255,255,0) !important; border: 0px solid #fff !important;}
.loop .owl-prev { left:-20px; }
.loop .owl-next { right:-20px;}
.loop .owl-prev:before, .loop .owl-next:before { font-family: 'Font Awesome 5 Free';font-weight: 900 !important;font-size:70px; color: #fff; opacity: 1;transition: all 0.4s ease-out 0s;width: 30px; height: 30px; background-size: contain; display: block; border-width: 1px 1px 0 0; border-style: solid; border-color: #808080;}
.loop .owl-prev:before { content: ""; transform: rotate(-135deg); margin-left: 20px; }
.loop .owl-next:before { content: ""; transform: rotate(45deg); margin-left: 0px;}
.loop .owl-prev:hover:before, .loop .owl-next:hover:before { opacity: 1;}
.loop .owl-stage-outer {z-index: 2;}
.loop .owl-dots { position: absolute; z-index: 100; bottom:40%; right: calc(10px + 2%); width: 10px; text-align: right !important; padding: 0 0px; }
.loop .owl-dots .owl-dot { border: 0px solid #c10000; background: transparent; margin-left: 6px;  margin-right: 6px; border-radius: 100%;}
.loop .owl-dots .owl-dot.active {  }
.loop .owl-dots .owl-dot span, .loop  .owl-dots .owl-dot span { background: #d3d3d3 !important; width: 10px !important; height: 10px !important; margin: 0 auto!important;transition: all 0.4s ease-out 0s !important; display: block; border-radius: 100%;}
.loop .owl-dots .owl-dot.active span/*, .loop  .owl-dots .owl-dot:hover span*/ {  background: #9cc93a !important;}

.agent-pto { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center; height: 100px; }
.agent-pto img { width: auto !important;}

@media only screen and (max-width: 1279px) {
    #content { padding-top: 60px; }
    #content p{ }
    p, td, li, label { }
	
	
}

@media only screen and (max-width: 980px) {
	.about-section-1-logo { max-width: 80%;}
}
@media only screen and (max-width: 768px) {
	.about-section-1 { background: url("../images/about-bg.jpg") no-repeat 20% 0; background-size: cover;}
    
}
@media only screen and (max-width: 640px) {
	
}
@media only screen and (max-width: 570px) {
	.loop { position: relative; padding: 0 30px;}
}

@media only screen and (max-width: 414px) {
	
}

@media only screen and (max-width: 320px) {
	
}