/* CSS Document */
@import url(font-awesome/css/font-awesome.min.css);

body {	-webkit-text-size-adjust:100%; margin:0; text-align:center; font-family:Verdana, "微軟正黑體"; }
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:1002px; margin:0 auto; text-align:left; position:relative; clear:both;}

.after-0:after { clear:both; display:block; content:""; height:0; text-indent:-99999px;}
.after-5:after { clear:both; display:block; content:""; height:5px; text-indent:-99999px;}
.after-10:after { clear:both; display:block; content:""; height:10px; text-indent:-99999px;}
.after-15:after { clear:both; display:block; content:""; height:15px; text-indent:-99999px;}
.after-20:after { clear:both; display:block; content:""; height:20px; text-indent:-99999px;}


.banner-bg { background:url(../images/idx-banner-bg.jpg) no-repeat top center;}
.banner .owl-buttons { 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:'FontAwesome'; 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:'FontAwesome'; font-size:90px; content:"\f105";}
.banner .owl-controls { margin-top:-5px !important;}

.idx-main { display:flex; flex-direction:row; flex-wrap:wrap; padding:40px 10px;}
.idx-main > div:nth-of-type(1) { width:36%; padding-right:35px;}
.idx-main > div:nth-of-type(2) { width:36%; padding:0 35px; border-right:1px solid #c7c7c7; border-left:1px solid #c7c7c7;}
.idx-main > div:nth-of-type(3) { width:28%; padding-left:35px;}
.title01 { margin-bottom:10px; padding-bottom:5px; border-bottom:3px solid #daedf7; position:relative; font-size:20px; color:#15477e; font-weight:bold; letter-spacing: -0.1em;}
.title01 span { color:#222;}
.title01:after { content:""; position:absolute; bottom:-3px; left:0; height:3px; display:block; width:150px; background:#b5d5ec;}
.idx-main > div { font-size: 13px;color: #444;font-weight: bold;line-height: 22px;}
.idx-main > div h1, .idx-main > div h3 { font-size: 16px;color: #15477e;padding: 0 0 3px 0;}
.pto01 { line-height:0; }
.pto01 img { width:100%;}


#owl-demo3 { margin-top:50px;}
#owl-demo3 .owl-item { padding:0 10px;}
#owl-demo3 .owl-pagination { display:none;}
#owl-demo3 .owl-prev { position:absolute; z-index:100; left:0px; top:calc(45% - 10px); background:none !important; padding:0 !important; margin:0 !important;}
#owl-demo3 .owl-prev:before { content:""; display:block; background:url(../images/arr01.png) no-repeat; width:19px; height:40px;}
#owl-demo3 .owl-next { position:absolute; z-index:100; right:0px; top:calc(45% - 10px); background:none !important; padding:0 !important; margin:0 !important;}
#owl-demo3 .owl-next:before { content:""; display:block; background:url(../images/arr02.png) no-repeat; width:19px; height:40px;}
#owl-demo3 .owl-controls { margin-top:-5px !important;}
.idx-list-pro {}
.idx-list-pto { line-height:0; padding-bottom:20px; overflow:hidden; text-align:center;}
.idx-list-pto img { 
-webkit-transition: all 0.4s ease-out 0s;
-moz-transition: all 0.4s ease-out 0s;
transition: all 0.4s ease-out 0s;}
.idx-list-name { position:relative; padding-top:5px; font-size: 15px;color: #555;font-weight: bold; border-top:1px solid #91c8e6;}
.idx-list-name:before { content:""; position:absolute; top:-1px; left:0; height:1px; width:45px; background:#3883c5;}
.idx-list-pro:hover .idx-list-pto img {-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
transform: scale(1.1);}


@media only screen and (max-width: 1002px) {
.banner-bg { background:none;}
}

@media only screen and (max-width: 980px) {
.idx-list-pro:hover .idx-list-pto img{
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}
}

@media only screen and (max-width: 768px) {
.idx-main { padding:20px 10px 40px 10px;}
.idx-main > div { padding:0 !important; width:100% !important;}
.idx-main > div:nth-of-type(2) { padding:20px 0 !important; margin:20px 0; border-right:0px solid #c7c7c7; border-left:0px solid #c7c7c7; border-top:1px solid #c7c7c7; border-bottom:1px solid #c7c7c7;}
}
@media only screen and (max-width: 640px) {

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


}

@media only screen and (max-width: 414px) {
.idx-list-name{ font-size: 20px; }
}

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

}