/* CSS Document */
@import url(font-awesome/css/font-awesome.min.css);

body {	-webkit-text-size-adjust:100%; margin:0; text-align:center; font-family:"微軟正黑體", Arial, sans-serif; }
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; 
-webkit-transition: all 0.2s ease-out 0s;
-moz-transition: all 0.2s ease-out 0s;
transition: all 0.2s 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:980px; 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;}


.single-item-bg1 { background:url(../../../images/idx-ban-1bg.jpg) no-repeat top center; background-size:cover;}
.single-item-bg2 { background:url(../../../images/idx-ban-1bg.jpg) no-repeat top center; background-size:cover;}
.banner-box { max-width:100%; margin:0 auto; text-align:left; position:relative; clear:both; height:625px;}
.banner-slogon { bottom:175px; position:absolute; left:0; width:calc(50% - 30px); padding:38px 15px 38px 15px; background:rgba(0,0,0,.6); text-align:right;}
.banner-slogon img { display:inline-block; margin:0 0 0 auto;}

.single-item .slick-slide { position:relative;}
.single-item .slick-dots { text-align:center; display:none !important;}
.single-item .slick-dots li { width:auto; height:3px; overflow:hidden;}
.single-item .slick-dots li button { width:30px; height:3px; background:#fff; margin:0 2px;}
.single-item .slick-dots li button::before { content:""; display:none; }
.single-item .slick-dots li.slick-active button  { background:#de4609;}
/*.single-item .slick-prev, .single-item .slick-next { display:none !important;}*/
.single-item .slick-prev, .single-item .slick-next { width:auto; height:auto; top:40%;}
.single-item .slick-prev { left:10px;}
.single-item .slick-prev::before { font-family:'FontAwesome'; content:"\f104"; font-size:90px;}
.single-item .slick-next { right:10px;}
.single-item .slick-next::before { font-family:'FontAwesome'; content:"\f105"; font-size:90px;}

.idx-main { background:#fff; display:flex; flex-direction:row; flex-wrap:wrap;
-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);}
.idx-main > div:nth-of-type(1) { width:286px; line-height:0;}
.idx-main > div:nth-of-type(2) { width:calc(100% - 286px - 320px); color:#353535; letter-spacing:1px; font-size:14px; padding:25px 20px;}
.idx-main > div:nth-of-type(3) { width:320px; background:#023e7b; padding:25px 20px;}
.title01 { padding-bottom:15px;}
.title01 h1 { font-size:18px; color:#3a3a3a; letter-spacing:3px; line-height:110%; padding-bottom:5px;}
.title01 span { display:block; color:#3a3a3a; font-size:24px; font-weight:bold; font-family:Lato; letter-spacing:0;}
.more { font-family:Abel; font-size:14px; color:#adadad;}
.more:hover { color:#023e7b;}

.idx-about-pto { display:none;}

.idx-news-title { letter-spacing:3px; color:#fff; font-size:18px; font-weight:bold; padding-bottom:10px; line-height:110%;}
.idx-news-pto { line-height:0;}
.idx-news { padding-top:20px;}
.idx-news span { display:block; font-size:13px; color:#b5b5b5;}
.idx-news a { display:block; font-size:15px; color:#fff; text-decoration:underline;}
.idx-news a:hover { color:#fff; text-decoration:none;}


@media only screen and (max-width: 980px) {

}

@media only screen and (max-width: 768px) {
.banner-box { height:300px;}
.banner-slogon { width:100%; bottom:0;}
.idx-about-pto { display:block; text-align:center; padding-bottom:20px;}
.idx-main > div:nth-of-type(1) { display:none;}
.idx-main > div:nth-of-type(2), .idx-main > div:nth-of-type(3) { width:100%; padding-left:10px; padding-right:10px;}
}
@media only screen and (max-width: 640px) {

}
@media only screen and (max-width: 570px) {

}

@media only screen and (max-width: 414px) {

}

@media only screen and (max-width: 320px) {

}