﻿﻿@charset "utf-8";
@import "page.css";

#xys_about{ width:100%; padding:80px 0}
#xys_about .img{ margin-top:50px; text-align:center}
#xys_about .img img{ width:60%}
#xys_about .list{ margin-top:50px; border:1px solid #eee; border-bottom:0; border-right:0; width:60%; margin:60px auto 0}
#xys_about .list ul li{ float:left; width:calc(100% / 4); padding:15px 0; text-align:center; border-right:1px solid #eee; background:#f8f8f8; border-bottom:1px solid #eee}
#xys_about .list ul li .icon{ font-size:30px;}
#xys_about .list ul li .icon i{ color:#999}
#xys_about .list ul li p{ margin-top:10px}

#xys_adv{ width:100%; padding:80px 0; background:#f8f8f8}
#xys_adv .list{ margin-top:50px}
#xys_adv .list ul li{ float:left; width:calc((100% - 90px) / 4); margin-right:30px; background:#fff}
#xys_adv .list ul li:last-child{ margin-right:0}
#xys_adv .list ul li .img{ overflow:hidden}
#xys_adv .list ul li .img img{ width:100%}
#xys_adv .list ul li .info{ padding:20px}
#xys_adv .list ul li .info big{ display:block; font-size:18px}
#xys_adv .list ul li .info small{ display:block; font-size:14px; margin-top:10px; color:#888; line-height:26px; min-height:120px}

#xys_td{ width:100%; padding:80px 0}
#xys_td .list{ margin-top:20px}
#xys_td .list ul li{ float:left; width:calc((100% - 60px) / 3); margin-right:30px; border:1px solid #eee; padding:20px; margin-top:30px}
#xys_td .list ul li:nth-child(3n){ margin-right:0}
#xys_td .list ul li big{ font-size:18px; display:block; margin-top:20px}
#xys_td .list ul li small{ font-size:14px; display:block; color:#888; margin-top:10px; line-height:26px}
#xys_td .list ul li i{ width:60px; height:60px; background:#f60; border-radius:60px; text-align:center; line-height:60px; font-size:30px; color:#fff}
#xys_td .list ul li:nth-child(1) i{ background:#4fc9e2;}
#xys_td .list ul li:nth-child(2) i{ background:#e2b233}
#xys_td .list ul li:nth-child(3) i{ background:#e771b1}
#xys_td .list ul li:nth-child(4) i{ background:#ae82e3}
#xys_td .list ul li:nth-child(5) i{ background:#e87676}
#xys_td .list ul li:nth-child(6) i{ background:#46b1d9}
#xys_td .list ul li:hover{-webkit-transform:translatey(-10px);-ms-transform:translatey(-10px);-o-transform:translatey(-10px);transform:translatey(-10px);box-shadow:0px 0px 12px 0px rgba(0,0,0,0.06);}

#xys_sj{ width:100%; padding:80px 0; background:url(/theme/2020/static/images/xys_sj_bg.jpg) no-repeat center center; background-size:cover}
#xys_sj .list{display: flex;justify-content: center;align-items: center;padding: 0px 0px; margin-top:50px}
#xys_sj .list .list_text .text{display: flex;align-items: flex-start;}
#xys_sj .list .list_text .text:first-child{ margin-bottom:100px}
#xys_sj .list .list_text .text .icon{ margin-right:30px;}
#xys_sj .list .list_text .text .icon i{ font-size:40px; color:#fff}
#xys_sj .list .list_text .text .txt big{ font-size:18px; display: block; color:#fff}
#xys_sj .list .list_text .text .txt small{ font-size:14px; display: block; color:#fff; line-height:26px; margin-top:10px}
#xys_sj .list .list_img{ padding:0 50px}

#xys_tese{ width:100%; padding:80px 0}
#xys_tese .item{background:#f8f8f8}
#xys_tese .item.itemtop50{ margin-top:50px}
#xys_tese .item .text{ width:45%; padding:70px}
#xys_tese .item .img{ width:50%}
#xys_tese .item .img img{ width:100%}
#xys_tese .item .text .t{ font-size:24px; font-weight:700}
#xys_tese .item .text p{ color:#999; margin-top:20px}
@media (max-width:800px){
	#xys_about{ width:100%; padding:.8rem 0}
	#xys_about .img{ margin-top:.5rem; text-align:center}
	#xys_about .img img{ width:100%}
	#xys_about .list{width:100%; margin:.5rem auto 0}
	#xys_about .list ul li{;padding:.2rem 0;}
	#xys_about .list ul li .icon{ font-size:.3rem;}
	#xys_about .list ul li p{ margin-top:.1rem; font-size:.23rem}
	
	#xys_adv{padding:.8rem 0;}
	#xys_adv .list{ margin-top:.2rem}
	#xys_adv .list ul li{ float: inherit; width:100%; margin-right:0; margin-top:.3rem}
	#xys_adv .list ul li .img img{ width:100%}
	#xys_adv .list ul li .info{ padding:.2rem}
	#xys_adv .list ul li .info big{font-size:.28rem}
	#xys_adv .list ul li .info small{font-size:.23rem; margin-top:.1rem;line-height:.36rem; min-height: inherit}
	
	#xys_td{padding:.8rem 0}
	#xys_td .list{ margin-top:.2rem}
	#xys_td .list ul li{ float: inherit; width:100%; margin-right:0;  padding:.2rem; margin-top:.3rem}
	#xys_td .list ul li big{ font-size:.28rem;margin-top:.2rem}
	#xys_td .list ul li small{ font-size:.23rem;margin-top:.1rem; line-height:.36rem}
	#xys_td .list ul li i{ width:.8rem; height:.8rem; border-radius:.8rem; line-height:.8rem; font-size:.36rem;}
	
	#xys_sj{ padding:.8rem 0;}
	#xys_sj .list{display: block;margin-top:.2rem}
	#xys_sj .list .list_text .text{ border:1px solid #666; padding:.3rem; margin-top:.3rem}
	#xys_sj .list .list_text .text:first-child{ margin-bottom:0}
	#xys_sj .list .list_text .text .icon{ margin-right:.3rem;}
	#xys_sj .list .list_text .text .icon i{ font-size:.4rem}
	#xys_sj .list .list_text .text .txt big{ font-size:.28rem;}
	#xys_sj .list .list_text .text .txt small{ font-size:.23rem; line-height:.36rem; margin-top:.1rem}
	#xys_sj .list .list_img{ display:none}
	
	#xys_tese{padding:.8rem 0}
	#xys_tese .item{ margin-top:.3rem}
	#xys_tese .item.itemtop50{ margin-top:.5rem}
	#xys_tese .item .text{ width:100%; padding:.3rem}
	#xys_tese .item .img{ width:100%}
	#xys_tese .item .img img{ width:100%}
	#xys_tese .item .text .t{ font-size:.28rem;}
	#xys_tese .item .text p{ font-size:.23rem; margin-top:.2rem; line-height:.36rem}
}