@charset "utf-8";
/* CSS Document */

/*==banner==*/
.bannerWrap{ width:100%; box-sizing:border-box; position:relative;}
.bannerWrap img{ display:block; width:100%;}


/*==interWrap==*/
.interWrap{ box-sizing:border-box; padding:40px 0;}
.interWrap .wrap{}

.interWrap .wrap .TitleBox1{width:75%; float:left;}
.interWrap .wrap .TitleBox1 h3{ width:90%; float:left;margin:0 auto; text-align:center; font-size:25px; color:#FF7373; font-family:微軟正黑體;}
.interWrap .wrap .TitleBox1 img{ width:90%;}

.leftWrap{ width:65%; float:left; padding:20px;}
.leftWrap .newsWrap{ padding:10px 0; height:420px;}
.leftWrap .newsWrap .newsImg{ float:left; width:35%; box-sizing:border-box;}
.leftWrap .newsWrap .newsImg a.imgbgBox{ display:block; width:100%; height:420px; background:url(../images/0510.jpg) no-repeat; position:relative; transition:all 0.4s ease;}
.leftWrap .newsWrap .newsImg a.imgbgBox:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:hsla(0, 100%, 90%, 0.3); transition:all 0.4s ease; opacity:0;}
.leftWrap .newsWrap .newsImg a.imgbgBox .imgText{ width:100%; position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%); z-index:5; box-sizing:border-box; padding:0 5px; text-align: center; transition:all 0.4s ease; opacity:0;}
.leftWrap .newsWrap .newsImg a.imgbgBox .imgText h3{ margin-bottom:10px;font-size:21px; color:#000;}
.leftWrap .newsWrap .newsImg a.imgbgBox .imgText p{ color:#000;}
.leftWrap .newsWrap .newsImg a.imgbgBox:hover:after{ opacity:1;}
.leftWrap .newsWrap .newsImg a.imgbgBox:hover .imgText{ opacity:1;}

.leftWrap .newsWrap .newsImg a.imgbgBox1{ display:block; width:100%; height:420px; background:url(../images/0422.jpg) no-repeat; position:relative; transition:all 0.4s ease;}
.leftWrap .newsWrap .newsImg a.imgbgBox1:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:hsla(0, 100%, 90%, 0.3); transition:all 0.4s ease; opacity:0;}
.leftWrap .newsWrap .newsImg a.imgbgBox1 .imgText{ width:100%; position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%); z-index:5; box-sizing:border-box; padding:0 5px; text-align: center; transition:all 0.4s ease; opacity:0;}
.leftWrap .newsWrap .newsImg a.imgbgBox1 .imgText h3{ margin-bottom:10px;font-size:21px; color:#000;}
.leftWrap .newsWrap .newsImg a.imgbgBox1 .imgText p{ color:#000;}
.leftWrap .newsWrap .newsImg a.imgbgBox1:hover:after{ opacity:1;}
.leftWrap .newsWrap .newsImg a.imgbgBox1:hover .imgText{ opacity:1;}

.leftWrap .newsWrap .textBox{ float:left; width:65%; box-sizing:border-box; padding-left:40px;}
.leftWrap .newsWrap .textBox h3{font-family:微軟正黑體;  margin-top:100px;font-size:21px; color:#FF7373; }
.leftWrap .newsWrap .textBox b{ display:block; font-size:18px; color:#747484; padding:10px 0;}
.leftWrap .newsWrap .textBox p{ font-size:15px; color:#868695;}
.leftWrap .newsWrap .textBox .ReadmoreBtn{ float:right; margin-top:50px;}

.rightWrap{width:30%; display:inline-block; clear:both; padding-top:30px; padding-left:20px;}
.rightWrap .topImg{ width:100%;}
@media (max-width:980px){
.leftWrap{ width:65%; padding-right:2px;}	
.rightWrap{width:30%; padding-left:15px;}
}
@media (max-width:800px){
.interWrap .wrap .TitleBox1{width:100%; text-align:center;}
.leftWrap{ width:90%; }	
.rightWrap{ width:100%; }	
.rightWrap .topImg img{width:45%; padding:15px 10px; float:left;}
.rightWrap .midImg img{width:45%; padding:15px 10px; display:inline-block;}
}
@media (max-width:480px){
.interWrap .wrap .TitleBox1 h3{ width:100%;}
.leftWrap .newsWrap .newsImg{width:100%;}
.leftWrap .newsWrap .textBox{width:100%;}
.rightWrap .topImg img{ width:90%; }
.rightWrap .midImg img{ width:90%; }

}
.interWrap .wrap .leftBox{ float:left; width:50%; box-sizing:border-box;}
.interWrap .wrap .rightBox{ float:left; width:50%; box-sizing:border-box; padding-left:40px;}
@media (max-width:480px){
	.interWrap .wrap .leftBox{width:90%; padding-left:40px; padding-bottom:20px;}
	.interWrap .wrap .rightBox{width:90%;}
}
/*==slider==*/
.interWrap .wrap .container #mixedSlider {
  position: relative;
}
.interWrap .wrap .container #mixedSlider .MS-content {
  white-space: nowrap;
  overflow: hidden;
  margin: 0 5%;
}
.interWrap .wrap .container #mixedSlider .MS-content .item {
  display: inline-block;
  width: 25%;
  position: relative;
  vertical-align: top;
  overflow: hidden;
  height: 100%;
  white-space: normal;
  padding: 0 10px;
}

@media (max-width: 991px) {
.interWrap .wrap .container   #mixedSlider .MS-content .item {
    width: 50%;
  }
}
@media (max-width: 767px) {
.interWrap .wrap .container   #mixedSlider .MS-content .item {
    width: 100%;
  }
}
.interWrap .wrap .container #mixedSlider .MS-content .item .imgTitle {
  position: relative;
}

.interWrap .wrap .container #mixedSlider .MS-content .item .imgTitle img {
  height: 185px;
  width: auto;
}
.interWrap .wrap .container #mixedSlider .MS-content .item p {
  font-size: 16px;
  margin: 2px 10px 0 5px;
  text-indent: 15px;
}
.interWrap .wrap .container #mixedSlider .MS-content .item a {
  float:inherit;
  margin: 0px 20px 0 0;
  font-size: 16px;
  
  color: rgba(173, 0, 0, 0.82);
  font-weight: bold;
  letter-spacing: 1px;
  transition: linear 0.1s;
}
.interWrap .wrap .container #mixedSlider .MS-content .item a:hover { color:#FF7373;}
.interWrap .wrap .container #mixedSlider .MS-controls button {
  position: absolute;
  border: none;
  background-color: transparent;
  outline: 0;
  font-size: 50px;
  top: 95px;
  color: rgba(0, 0, 0, 0.4);
  transition: 0.15s linear;
}
.interWrap .wrap .container #mixedSlider .MS-controls button:hover {
  color: rgba(0, 0, 0, 0.8);
}
@media (max-width: 992px) {
.interWrap .wrap .container #mixedSlider .MS-controls button {
    font-size: 30px;
  }
}
@media (max-width: 767px) {
.interWrap .wrap .container #mixedSlider .MS-controls button {
    font-size: 20px;
  }
}
.interWrap .wrap .container #mixedSlider .MS-controls .MS-left {
  left: 0px;
}
@media (max-width: 767px) {
.interWrap .wrap .container #mixedSlider .MS-controls .MS-left {
    left: -10px;
  }
}
.interWrap .wrap .container #mixedSlider .MS-controls .MS-right {
  right: 0px;
}
@media (max-width: 767px) {
.interWrap .wrap .container #mixedSlider .MS-controls .MS-right {
    right: -10px;
  }
}


/*==linkWrap==*/
.linkWrap{ width:100%; box-sizing:border-box; padding:0px 0 80px;}
.linkWrap .wrap{}
.linkWrap .wrap .leftBox{ float:left; width:420px; box-sizing:border-box; margin-right:20px;} 
.linkWrap .wrap .leftBox a.imgbgBox{ display:block; width:100%; height:420px; background:url(../images/0510.jpg) no-repeat; position:relative; transition:all 0.4s ease;}
.linkWrap .wrap .leftBox a.imgbgBox:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0); transition:all 0.4s ease; opacity:0;}
.linkWrap .wrap .leftBox a.imgbgBox .txtBox{ width:100%; position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%); z-index:5; box-sizing:border-box; padding:0 5px; text-align: center; transition:all 0.4s ease; opacity:0;}
.linkWrap .wrap .leftBox a.imgbgBox .txtBox h3{ margin-bottom:10px;font-size:24px; color:#FF7373;}
.linkWrap .wrap .leftBox a.imgbgBox:hover:after{ opacity:1;}
.linkWrap .wrap .leftBox a.imgbgBox:hover .txtBox{ opacity:1;}

/*文字共用*/
.linkWrap .wrap .txtBox h3{ font-size:24px; color:#014c59; text-align:center;}
.linkWrap .wrap .txtBox p{ font-size:15px; color:#51588b; text-align:center; font-weight:bold;}

.linkWrap .wrap .rightBox{ float:left; width:785px; height:420px; box-sizing:border-box;} 
.linkWrap .wrap .rightBox .topBox{ width:100%;}
.linkWrap .wrap .rightBox .topBox img{ display:block; width:100%;}
.linkWrap .wrap .rightBox .topBox a.bn_a{ display:block; float:left; width:383px; height:200px; background:url(../images/bn_a.jpg) no-repeat; position:relative; transition:all 0.4s ease; box-sizing:border-box; margin-right:20px;}
.linkWrap .wrap .rightBox .topBox a.bn_a:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0); transition:all 0.4s ease; opacity:0;}
.linkWrap .wrap .rightBox .topBox a.bn_a .txtBox{ margin-top:15px; transition:all 0.4s ease; opacity:0; z-index:5;}
.linkWrap .wrap .rightBox .topBox a.bn_a:hover:after{ opacity:1;}
.linkWrap .wrap .rightBox .topBox a.bn_a:hover .txtBox{ opacity:1;}

.linkWrap .wrap .rightBox .topBox a.bn_b{ display:block; float:left; width:382px; height:200px; background:url(../images/bn_b.jpg) no-repeat; position:relative; transition:all 0.4s ease; box-sizing:border-box;}
.linkWrap .wrap .rightBox .topBox a.bn_b .txtBox{ position:absolute; left:70%; top:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%); z-index:5; box-sizing:border-box; transition:all 0.4s ease; opacity:0; }
.linkWrap .wrap .rightBox .topBox a.bn_b .txtBox h3{ font-size:30px; color:#E3E8F0; text-align:left;}
.linkWrap .wrap .rightBox .topBox a.bn_b .txtBox p{ font-size:24px; color:#E3E8F0; font-weight:bold; text-align:left;}
.linkWrap .wrap .rightBox .topBox a.bn_b:hover .txtBox{ opacity:1;}

.linkWrap .wrap .rightBox .bottomBox{ width:100%; height:200px; margin-top:20px;}
.linkWrap .wrap .rightBox .bottomBox a.bn_c{ display:block; float:left; width:100%; height:200px; background:url(../images/bn_c.jpg) no-repeat; position:relative; transition:all 0.4s ease; box-sizing:border-box;}
.linkWrap .wrap .rightBox .bottomBox a.bn_c:after{content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255,255,255,0.7); transition:all 0.4s ease; opacity:0;}
.linkWrap .wrap .rightBox .bottomBox a.bn_c .txtBox{ position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%); z-index:5; box-sizing:border-box; transition:all 0.4s ease; opacity:0; width:68%; }
.linkWrap .wrap .rightBox .bottomBox a.bn_c:hover:after{ opacity:1;}
.linkWrap .wrap .rightBox .bottomBox a.bn_c:hover .txtBox{ opacity:1;}


.linkWrap .wrap .rightBox .bottomBox a.bn_c .txtBox h3{ text-align:left; line-height:1.2;}
.linkWrap .wrap .rightBox .bottomBox a.bn_c .txtBox p{ text-align:left; font-size:14px;}

@media (max-width:1280px){
}


@media (max-width:1034px){
.bannerWrap{ margin-top:50px;}	
	
.interWrap .wrap .txtBox{ padding:0 20px 0 20px;}	
.interWrap .wrap .txtBox .ids{ margin-top:40px;}	

.linkWrap{ padding-bottom:40px;}	
.linkWrap .wrap .leftBox{ width:33%; margin-right:0;}
.linkWrap .wrap .rightBox{ width:67%;}
.linkWrap .wrap .leftBox a.imgbgBox{ height:400px;}
.linkWrap .wrap .rightBox .topBox a.bn_a{ width:50%; margin-right:0;}
.linkWrap .wrap .rightBox .topBox a.bn_b{ width:50%;}	
.linkWrap .wrap .rightBox .bottomBox{ margin-top:0;}

}


@media (max-width:980px){
}


@media (max-width:768px){
}


@media (max-width:640px){
.interWrap .wrap .txtBox .ids{ margin-top:0;}	
}

@media (max-width:480px){
.interWrap .wrap .imgBox{ float:none; width:100%;}	
.interWrap .wrap .txtBox{ float:none; width:100%;}	
.interWrap .wrap .txtBox p{ font-size:14px;}

.linkWrap{ padding-bottom:0;}
.linkWrap .wrap .leftBox{ float:none; width:100%;}
.linkWrap .wrap .rightBox{ float:none; width:100%;}
.linkWrap .wrap .leftBox a.imgbgBox{ background-size:cover;}
.linkWrap .wrap .rightBox .topBox a.bn_a{ width:100%; background-size: contain; height:215px;}
.linkWrap .wrap .rightBox .topBox a.bn_b{ width:100%; background-size: cover; height:209px;}
.linkWrap .wrap .rightBox .bottomBox a.bn_c .txtBox{ width:85%;}
.linkWrap .wrap .leftBox a.imgbgBox .txtBox{ opacity:1;}
.linkWrap .wrap .leftBox a.imgbgBox:after{ opacity:1;}
.linkWrap .wrap .rightBox .topBox a.bn_a .txtBox{ opacity:1;}
.linkWrap .wrap .rightBox .topBox a.bn_b .txtBox{ opacity:1;}
.linkWrap .wrap .rightBox .bottomBox a.bn_c .txtBox{ opacity:1;}
.linkWrap .wrap .rightBox .bottomBox a.bn_c:after{ opacity:1;}

}

@media (max-width:420px){
}

@media (max-width:375px){
.linkWrap .wrap a.imgbgBox .txtBox p{ font-size:14px; padding:0 10px;}
.linkWrap .wrap .txtBox p br{ display:none;}

.linkWrap .wrap .rightBox .topBox a.bn_b .txtBox{ left:60%;}
.linkWrap .wrap .rightBox .topBox a.bn_b .txtBox p{ padding:0;}	

.linkWrap .wrap .rightBox .topBox a.bn_a{ height:196px;}
.linkWrap .wrap .rightBox .topBox a.bn_b{ height:196px;}
}

@media (max-width:320px){
.linkWrap .wrap .rightBox .bottomBox a.bn_c .txtBox h3{ font-size:21px; padding-bottom:6px;}

.linkWrap .wrap .rightBox .topBox a.bn_a{ height:167px;}
.linkWrap .wrap .rightBox .topBox a.bn_b{ height:167px;}	
}