
.material-banner{background-image:url(../images/material/banner.jpg);background-size:cover;padding-top:80px;padding-bottom:80px;}
.material-banner h1{font-family: "mySourceHanSansSC",Microsoft Yahei,Arial,sans-serif;position: relative;color:#ffffff;font-size:36px;margin-left:46px;font-weight: bold;}
.material-banner h1:before{content:'';position:absolute;width: 32px;height: 32px;border: solid 1px #fde02d;border-radius:32px;left:-42px;top:0;bottom:0;margin-top:auto;margin-bottom:auto;}
.material-banner h1:after{content:'';position:absolute;width: 16px;height: 16px;background-color:#fde02d;border-radius:16px;left:-34px;top:0;bottom:0;margin-top:auto;margin-bottom:auto;}
.material-banner small{font-family: "mySourceHanSansSC",Microsoft Yahei,Arial,sans-serif;color:#ffffff;font-size:24px;letter-spacing: 2px;line-height: 1;display:block;margin-top:30px;}

.material-list .title{padding-top:40px;padding-bottom:40px;}
.material-list .title h2.circle{display: inline-block;margin-left:44px;position:relative;}
.material-list .title h2.circle:before{content:'';position:absolute;width: 24px;height: 24px;background-color: #c5cae9;border-radius:24px;left:-42px;top:0;bottom:0;margin-top:auto;margin-bottom:auto;}
.material-list .title h2.circle:after{content:'';position:absolute;width: 16px;height: 16px;background-color:#3f51b5;border-radius:16px;left:-38px;top:0;bottom:0;margin-top:auto;margin-bottom:auto;}
.material-list .title span{margin-left:10px;color:#757575;}
.material-list .title:after{content:"";clear:both;}
.material-list .body{margin-left:-15px;margin-right:-15px;padding-bottom: 10px;}
.material-list .body > div{margin-bottom:30px;}
.material-list .body > div > div{position:relative;	background-color: #f0f2fd;border-radius: 2px;margin-left:15px;margin-right:15px;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.material-list .body a{display: block;padding:20px 30px;}
.material-list .body .img{display:inline-block;width: 40%;vertical-align: middle;margin-right: 20px;font-size: 0;}
.material-list .body .words{display:inline-block;vertical-align: middle;}
.material-list .body h4{font-size:20px;letter-spacing: 1px;color: #212121;font-weight:600;}
.material-list .body i{display:block;font-style: normal;font-size:14px;color:#757575;letter-spacing: 1px;position:relative;line-height: 1;margin-top: 20px;}
.material-list .body i:after{position:absolute;content:"";background-image:url(../images/more-ico.png);width:16px;height:16px;background-position: 48.5% 20%;top:3px;bottom:0;margin-top:auto;margin-bottom:auto;margin-left:8px;}
.material-list .body > div > div:hover{background-color:#3f51b5;}
.material-list .body > div > div:hover h4,
.material-list .body > div > div:hover i{color:#ffffff;}
.material-list .body > div > div:hover i:after{background-position: 48.5% 0;}

.material-crusher{background-color:#f0f2fd;}
.material-crusher .body > div > div{background-color: #ffffff;}

.materials-title{padding-top:40px;padding-bottom:40px;}
.materials-title .container .row{background-color:#f0f2fd;padding:20px;}
.materials-title .words{-ms-flex: 0 0 80%;flex: 0 0 80%;max-width: 80%;padding-right:40px;padding-left:20px;}
.materials-title .words h1{font-size: 24px;font-weight:bold;padding-top:20px;}
.materials-title .words p{margin-top:30px;margin-bottom:30px;}
.materials-title .img{-ms-flex: 0 0 20%;flex: 0 0 20%;max-width: 20%;}
.materials-title .img img{display:table;}
.materials-title .conversion a.chat{padding:15px 30px;background-color:#ffc107;line-height:1;display:inline-block;vertical-align:middle;letter-spacing: 1px;color:#ffffff;border-radius: 2px;margin-right:20px;}
.materials-title .conversion a.phone{display:inline-block;vertical-align:middle;}
.materials-title .conversion a.phone img{display: table;}

.materials-nav{border-bottom:1px solid #c5cae9;}
.materials-nav .container{text-align:center;}
.materials-nav .container .item{cursor:pointer;}
.materials-nav .container .item a{display:block;padding-top:20px;padding-bottom:20px;}
.materials-nav .container .item span{letter-spacing: 1px;color: #757575;font-size:20px;}
.materials-nav .container .item.active,.materials-nav .container .item:hover{border-bottom:2px solid #3f51b5;}
.materials-nav .container .item.active span,.materials-nav .container .item:hover span{color:#3f51b5;font-weight:bold;}
.materials-nav .container .chat{padding-top:20px;padding-bottom:20px;letter-spacing: 1px;font-size:20px;font-weight:bold;color: #ffc107;}
.materials-nav .container .chat a{color: #ffc107;}

.materials-deails .main{padding-right:40px;}

.materials-deails .technology{padding-top:40px;padding-bottom:40px;}
.materials-deails .technology h2{position:relative;display:table;text-align:center;margin-left:auto;margin-right:auto;float:none;margin-bottom:40px;}
.materials-deails .technology h2:before {position:absolute;content:"";width:48px;height:12px;background-image:url(../images/ico.png);background-position:0 0; top:0; bottom:0; margin-top:auto; margin-bottom:auto; margin-left:-68px;}
.materials-deails .technology h2:after {position:absolute; content:"";width:48px;height:12px;background-image:url(../images/ico.png);top:0;bottom:0;margin-top:auto; margin-bottom:auto;margin-left:20px;background-position:7% 0;}
.materials-deails .technology .tabs_content .item {display:none;text-align: center;}
.materials-deails .technology .tabs_content .item:first-child {display:block;}
.materials-deails .technology  .nav-tabs{margin-top:30px;border-bottom: 0;}
.materials-deails .technology  .nav-tabs .row{display:block !important;text-align:center;}
.materials-deails .technology  .nav-tabs .row div{display:inline-block;margin-left:10px;margin-right:10px;}
.materials-deails .technology  .nav-tabs .row div span{position:relative;color:#3f51b5;border: 1px solid #3f51b5;padding:10px 12px 10px 30px;font-weight:lighter;cursor:pointer;}
.materials-deails .technology  .nav-tabs .row div span:before{content: "";position: absolute;height: 6px;width: 8px;border-left: 14px solid #3f51b5;border-top: 8px solid transparent;border-bottom: 8px solid transparent;top: 0;bottom: 0;margin-top: auto;margin-bottom: auto;margin-left: -20px;}
.materials-deails .technology  .nav-tabs .row div.active span{background-color:#3f51b5;color:#ffffff;}
.materials-deails .technology  .nav-tabs .row div.active span:before{border-left: 14px solid #ffffff;}
.materials-deails .technology .video{padding-left:50px;padding-right:50px;}
.materials-deails .technology .video video,
.materials-deails .technology .video object{height:416px !important;}
.materials-deails .technology .body{color:#757575;background-color: #f0f2fd;padding:40px;margin-top:40px;}



.materials-deails .scrollitem.application .title{padding-top:40px;padding-bottom:20px;border-bottom: 1px solid #c5cae9;}
.materials-deails .scrollitem.application .title h2{display: inline-block;font-size:24px;}
.materials-deails .application .body{margin-left:-15px;margin-right:-15px;margin-top: 40px;}
.materials-deails .application .body .col-12 > div{position:relative;line-height: 1;}
.materials-deails .application .body .col-12 > div img{z-index:-1;width:100%;}
.materials-deails .application .body .col-12 > div > div{position: absolute;bottom: 0;padding:20px 20px 0;}
.materials-deails .application .body .col-12 > div > div h4{font-weight:bold;line-height:1.5;font-size:20px;}
.materials-deails .application .body .col-12 > div > div h4,.materials-deails .application .body .col-12 > div > div p{color:#ffffff;}
.materials-deails .application .body .col-12 > div > div p{margin-top:10px;}
.materials-deails .application .body .col-12:not(:last-child) > p{margin-top: 10px;padding-bottom: 30px;}
.materials-deails .application .body .col-12:last-child > p{margin-top: 10px;margin-bottom:20px;}
.materials-deails .application .body.slide .slick-arrow {position:absolute;content:'';border:0;width:24px;height:24px;cursor:pointer;z-index:9999; background-image:url(../images/more-ico.png);font-size: 0;background-color: transparent;top: -80px;padding: 0;right: 15px;}
.materials-deails .application .body.slide .slick-prev {background-position: 0 100%;margin-right: 38px;}
.materials-deails .application .body.slide .slick-prev:hover {background-position:0 34%;}
.materials-deails .application .body.slide .slick-next {background-position: 0 66%;}
.materials-deails .application .body.slide .slick-next:hover {background-position:0 0;}


.related-case .title{padding-bottom:20px;margin-top: 40px;border-bottom: 1px solid #c5cae9;}
.related-case .title h2{display: inline-block;font-size:24px;}
.related-case .title .more{position: relative;float:right;margin-right:28px;}
.related-case .title .more a{color:#ffc107;}
.related-case .title .more i{font-style: normal;letter-spacing: 1px;}
.related-case .title .more i:after{position:absolute;content:"";background-image:url(../images/more-ico.png);width:22px;height:20px;background-position: 26.5% 0;top:2px;bottom:0;margin-top:auto;margin-bottom:auto;margin-left:6px;}
.related-case .title:after{content:"";clear:both;}
.related-case .body{margin-left:-15px;margin-right:-15px;padding-top:40px;}
.related-case .slide .img{display:block;padding-left:15px;padding-right:15px;}
.related-case .body .slick-initialized .slick-slide{padding-left:15px;padding-right:15px;}
.related-case .body .item > div{position:relative;}
.related-case .body .more{-webkit-transition: height 0.3s;-moz-transition: height 0.3s;transition: height 0.3s;bottom: 0;height: 2px;position: absolute;overflow: hidden;width: 100%;}
.related-case .body .more div{margin-left:15px;margin-right:15px;}
.related-case .body .more span{position:relative;text-align:center;width:50%;display:inline-block;padding-top:5px;padding-bottom:5px;font-size:14px;vertical-align: top;}
.related-case .body .more span a{display: block;color:#ffffff;}
.related-case .body .more span:first-child{background-color:#3f51b5;}
.related-case .body .more span:last-child{background-color:#ffc107;}
.related-case .body .more i{font-style: normal;letter-spacing: 1px;margin-left: -22px;}
.related-case .body .more span i:after{position:absolute;content:"";background-image:url(../images/more-ico.png);width:16px;height:16px;top:0;bottom:0;margin-top:auto;margin-bottom:auto;margin-left:6px;background-position: 48.5% 0;}
.related-case .body .item:hover .more{height:36px;}
.related-case .body h4{line-height: 1.5;padding-left:15px;padding-right:15px;letter-spacing: 1px;font-size:16px;padding-top:15px;padding-bottom:35px;}
.related-case .body h4 a{color: #757575;}
.related-case .body .item:hover h4 a{color:#212121;}
.related-case .slick-dots{margin-top:-30px;}
.related-case .slick-dots li button{width: 30px;height: 8px;}
.related-case .slick-dots li button:before{width: 30px;height: 8px;border-radius: 2px;}


.materials-deails .side-top{margin-top:40px;background-color:#f0f2fd;}
.materials-deails .side-top h2{color:#ffffff;font-size:24px;font-weight: normal;padding-top:20px;padding-bottom:20px;background-color:#3f51b5;text-align:center;}
.materials-deails .side-top ul{padding-bottom:20px;}
.materials-deails .side-top ul li{margin-top:20px;padding-left:20px;padding-right:20px;text-align:center;}
.materials-deails .side-top ul li span{display:block;line-height:1;margin-top:10px;}
.materials-deails .side-more{margin-top:40px;background-color:#f0f2fd;}
.materials-deails .side-more h2{color:#ffffff;font-size:24px;font-weight: normal;padding-top:20px;padding-bottom:20px;background-color:#3f51b5;text-align:center;}
.materials-deails .side-more ul{padding-top:20px;padding-bottom:40px;}
.materials-deails .side-more ul li{margin-top:20px;padding-left:40px;padding-right:40px;}
.materials-deails .side-more ul li a{display: block;text-align:center;border-radius: 2px;border: solid 1px #3f51b5;padding-top:20px;padding-bottom:20px;color:#3f51b5;line-height: 1;}
.materials-deails .side-more ul li a:hover{color:#ffffff;background-color:#3f51b5;}
.materials-deails .side-conversion .phone{background-color: #3f51b5;}
.materials-deails .side-conversion .phone a{padding:20px; display: block;line-height: 1;text-align: center;}