@import url(font-awesome/css/font-awesome.min.css);
* {margin: 0;padding: 0;font-family: "微軟正黑體", "Arial";margin: 0;padding: 0;list-style: none;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;
box-sizing: border-box;font-size: 17px;}

input,button,select,textarea {outline: none}

img {max-width: 100%;height: auto;}
.banner{padding-top: 75px;margin: 0 auto;text-align: center;}
#main{margin-top: -30px;}
.main-product {margin: 0 auto;background: url(../images/about-back.png) no-repeat 70% center;height: 500px;background-size: cover;}
.main-product h2 {text-align: center;padding: 50px 0;font-size: 28px;color: #262626;}
.main-product h2 span {background: #e72c18;color: #fff;padding: 2px 10px;margin-right: 15px;font-size: 28px;}
.main-product_content {margin: 50px 0;display: flex;align-items: center;justify-content: center;}
.main-product_img {margin: 10px 15px;display: flex;align-items: center;}
.main-product_img img{margin: 0 5px;width: 230px;}
.main-product_text {margin: 10px 35px;}
.main-product_text ul{}
.main-product_text ul li {list-style-image: url(../images/dot.png);color: #000;font-weight: 600;padding: 5px 0;}
.main-product_text ul li span {color: #777777;font-weight:normal;}
.aboutus{display: flex;align-items: center;}
.aboutus .left {background: url(../images/about.jpg) no-repeat;height: 350px;width: 50%;background-position: 80% center;position: relative; }
.aboutus_title {color: #fff;border: 1px solid #fff;width: 160px;padding: 10px 0;text-align: center;position: absolute;top:45%;right: 20%;font-size: 28px;}
.aboutus .right {background: #e72c18;height: 283px;width: 50%;position: relative;border-top: 20px solid #ee6c5e;
border-bottom: 20px solid #ee6c5e;}
.aboutus .right::before {content: "";width: 0;height: 0;border-style: solid;border-width: 30px 40px 30px 0;border-color: transparent #e72c18 transparent transparent;position: absolute;top:40%;left: -40px;}
.aboutus .right::after {content: "";background: #ee6c5e;}
.aboutus_text{padding: 15px;}
h1{font-size: 28px;color:#fff;margin-bottom:10px; }
.aboutus_text p {color:#fff;line-height: 22px;padding: 5px 30px 5px 0;}
.aboutus_buttom {background: #000000;width: 200px;padding: 10px;transform: skewX(-30deg);margin: 0 auto;}
.aboutus_buttom a {color: #fff;text-decoration: none;text-align: center;transform: skewX(30deg);display: block;}
.aboutus_buttom:hover {background: #FF9800;transform: skewX(30deg);transition: all .1s linear;}
.aboutus_buttom:hover a {transform: skewX(-30deg);transition: all .1s linear;}
.products_section{margin: 50px auto;width: 70%;}
.products_section h2 {font-size: 28px;color: #e72c19;margin: 0 auto;text-align: center;padding-bottom: 10px;}
.products_all {border-top: 5px solid #e72c19;border-bottom: 5px solid #e72c19;}
.products_all ul {display: flex;align-items: center;margin: 6% auto 3%;justify-content: center;position: relative;}
.products_all ul li {display: flex;flex-direction: column;justify-content: center;}
.products_all ul li .pic {border: 1px solid #cccccc;border-radius: 15px;text-align: center;height: 171px;padding: 15px 0;margin-bottom: 20px;}
.products_all ul li .pic img {margin: 0 auto;max-height: 150px;width: auto;}
.products_all ul li .name {border-left: 5px solid #bbbbbb;padding-left:5px; }
.products_all ul li a {text-decoration: none;}
.products_all ul li a .name{color:#000;}
.products_all ul li:hover a .name {color: #e72c19;}
.products_all ul li:hover a .pic img{opacity: .6;}
.products_all ul.owl-carousel .owl-nav {display: block;}
.products_all ul.owl-carousel .owl-nav .owl-prev::before {content: "\f104";font: normal normal normal 90px/1 'FontAwesome';
left: -80px;position: absolute;top: 40%;color: #bbbbbb;}
.products_all ul.owl-carousel .owl-nav .owl-next::after {content: "\f105";font: normal normal normal 90px/1 'FontAwesome';
right: -80px;position: absolute;top: 40%;color: #bbbbbb;}
.products_buttom {background: #000000;width: 200px;padding: 10px;transform: skewX(-30deg);margin: 30px auto;}
.products_buttom a{color: #fff;text-decoration: none;text-align: center;transform: skewX(30deg);display: block;}
.products_buttom:hover {background: #FF9800;transform: skewX(30deg);transition: all .1s linear;}
.products_buttom:hover a {transform: skewX(-30deg);transition: all .1s linear;}
.news-all {background: url(../images/news.png) no-repeat center center;height: 450px;background-attachment: fixed;
position: relative;background-size: cover;z-index: 10;}
.news-all::after {content: "";background: #0c0c0f;width: 100%;height: 100%;position: absolute;top: 0;
opacity: .8;z-index: 9;}
.news-all .content-Box {z-index: 11;position: relative;}
.news-all h2 {text-align: center;margin: 10px auto;width: 160px;padding: 10px 0;color: #fff;font-size: 28px;
border: 1px solid;top: 50px;position: absolute;right: 0;left: 0;}
.news-all ul{margin: 0 auto;display: flex;align-items: center;flex-wrap: wrap;justify-content: center;padding-top:150px;width: 80%; }
.news-all ul li {width: calc(100% / 2 - 60px);padding: 10px 0;border-bottom: 1px solid #fff;margin: 5px 20px;overflow: hidden;
text-overflow: ellipsis;white-space: nowrap;color:#fff;}
.news-all ul li a {color: #fff;text-decoration: none;}
.news-all ul li a span{font-size:20px;padding-right: 15px;}
.news-all ul li:hover{opacity: .6;}
.news_buttom {background: #e72c18;width: 200px;padding: 10px;transform: skewX(-30deg);margin: 30px;float: right;}
.news_buttom a {color: #fff;text-decoration: none;text-align: center;transform: skewX(30deg);display: block;}
.news_buttom:hover {background: #000;transform: skewX(30deg);transition: all .1s linear;}
.news_buttom:hover a{transform: skewX(-30deg);transition: all .1s linear;}
.project-all {margin: 80px auto;}
.project-all ul {display: flex;align-items: center;flex-wrap: wrap;justify-content: space-between;}
.project-all ul li {background: #e72c18;width: calc(100% / 3 - 20px);padding: 5px 5px;display: flex;align-items: center;margin: 5px;height: 100px;}
.project-all ul li .icon{padding: 5px 10px; }
.project-all ul li .icon img{}
.project-all ul li .text{color:#fff;width: 70%;}
.project-all ul li a .icon {display: inline-block;vertical-align: middle;}
.project-all ul li a .text {width: 70%;display: inline-block;vertical-align: middle;}
.project-all ul li a {text-decoration: none;}
.project-all ul li a:hover {opacity: .7;}