/* CSS Document */

body {	-webkit-text-size-adjust:100%; margin:0; text-align:center; font-family: '微軟正黑體','PT Sans', sans-serif; overflow-x: hidden;}
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; 
-webkit-transition: all 0.4s ease-out 0s;
-moz-transition: all 0.4s ease-out 0s;
transition: all 0.4s ease-out 0s; }
a:hover { text-decoration:none; }

* { margin:0; padding:0; list-style:none;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */}

.content-Box { max-width:1280px; margin:0 auto; text-align:left; position:relative; clear:both;}

#content { overflow-x: hidden;}


.banner { line-height:0;}
.banner img { width:100%;}
.banner .owl-pagination { display:none;}
.banner .owl-prev { position:absolute; z-index:100; left:0px; top:calc(50% - 10px); background:none !important;}
.banner .owl-prev:before { font-family: 'Font Awesome 5 Free';font-weight: 900; font-size:90px; content:"\f104";}
.banner .owl-next { position:absolute; z-index:100; right:0px; top:calc(50% - 10px); background:none !important;}
.banner .owl-next:before { font-family: 'Font Awesome 5 Free';font-weight: 900; font-size:90px; content:"\f105";}
.banner .owl-controls { margin-top:0 !important;}

.idx-about { background: url(../images/idx-about-bg.png) repeat-x top; text-align: center; padding: 108px 10px 90px 10px; color: #222222; font-size: 20px; line-height: 30px;}
.idx-about-box { text-align: center; max-width: 900px;}
.idx-about-content { text-align: left;}
.idx-about h1 { padding-bottom: 60px; font-size: 42px; line-height: 110%;}
.idx-about-btn { margin-top: 80px;}
.idx-about-btn a { display: inline-block; color: #d01e28; padding-bottom: 10px; border-bottom: 3px solid #d01e28; width: 130px;}
.idx-about-btn a:hover { width: 150px;}

.idx-pro { background: url(../images/idx-pro-bg.jpg) no-repeat top right; background-size: cover; padding: 175px 0px;}
.idx-pro-list img { width:auto; width: 100%;}
.idx-pro-list .owl-item { padding: 0 34px;}
.idx-pro-list .owl-item a { display: block; background: #e3e3e3; padding: 12px;}
.idx-pro-list .owl-item:hover img {transform: scale(1.05);}
.idx-pro-list .owl-buttons { display:none;}
.idx-pro-list .owl-prev { position:absolute; z-index:100; left:0px; top:calc(50% - 40px); background:none !important;}
.idx-pro-list .owl-prev:before { font-family: 'Font Awesome 5 Free';font-weight: 900;font-size:90px; content:"\f104"; color: #919498}
.idx-pro-list .owl-next { position:absolute; z-index:100; right:0px;font-weight: 900; top:calc(50% - 40px); background:none !important;}
.idx-pro-list .owl-next:before { font-family:'Font Awesome 5 Free'; font-size:90px; content:"\f105"; color: #919498;}
.idx-pro-list .owl-controls { bottom:-80px; position: absolute; width: 100%; z-index: 101;}
.idx-pro-list .owl-controls .owl-page span { width: 12px !important; height: 12px !important; background: #c2c2c2 !important;  opacity: 1 !important;}
.idx-pro-list .owl-controls .owl-page.active span, .idx-pro-list .owl-controls.clickable .owl-page:hover span {background: #d01e28 !important;}
.idx-pro-list-pto { overflow: hidden; line-height: 0;}
.idx-pro-list-pto img { width: 100%; transition: all 1s ease-out 0s;}
.idx-pro-list-name { background: #ffffff; min-height:76px; text-align: center; font-size: 17px; font-weight: bold; color: #717171; line-height: 30px; padding: 20px 10px;}

.idx-bottom { background: url(../images/idx-bottom-bg.jpg) no-repeat top right;background-size: cover; min-height: 719px; padding: 210px 210px 0 110px;}
.idx-bottom-content { max-width: 755px; margin: 0 auto 0 0; text-align: left; color: #fefefe; font-size: 4vw; line-height: 100%; font-weight: bold;}
.idx-bottom-btn { display: block; border: 3px solid #ffffff; border-radius: 100%; width: 118px; height: 118px; text-align: center; line-height: 123px; font-size: 90px; color: #fff; margin-top: 35px;padding-left: 10px}
.idx-bottom-btn:hover { background: #fff; color: #c20259;}

@media only screen and (max-width: 1360px) {
	.idx-bottom-content {
	    font-size: 3.5vw;
	}
}
@media only screen and (max-width: 1280px) {
	.idx-bottom { padding: 350px 10px 0 10px; min-height: 670px; background-position: 80% 0px;}
	.idx-bottom-content > div {text-shadow: 2px 2px 8px rgba(0,0,0,.4);}
	.idx-bottom-btn { width: 80px; height: 80px; line-height: 80px; font-size: 60px;padding-left: 6px}

}
@media only screen and (max-width: 980px) {
	body { margin-top: 100px;}
	.idx-about { padding: 50px 10px; font-size: 18px;}
	.idx-about h1 { padding-bottom: 30px; font-size: 32px; }
	.idx-about-btn { margin-top: 50px;}
	.idx-pro { padding: 80px 0 110px 0;}
	.idx-bottom-content { max-width: 100%; font-size: 46px;}
}

@media only screen and (max-width: 768px) {
	
}
@media only screen and (max-width: 640px) {

}
@media only screen and (max-width: 570px) {
	.banner .owl-prev:before, .banner .owl-next:before { font-size: 50px;}
}

@media only screen and (max-width: 414px) {
	

}

@media only screen and (max-width: 320px) {

}