@charset "utf-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, caption, tbody, tfoot, thead, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, menubox, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0px; border: 0; font-size: 100%; outline: none; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; overflow-x: hidden;}
/* always display scrollbars */
body { font:14px/1.6 "Microsoft Yahei","微软雅黑","Arial","Helvetica","SimHei","黑体","STXihei","华文细黑",sans-serif; margin: 0 auto; color:#333; _background-attachment:fixed; 
_background-image:url(about:blank); width: 100%; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, menubox, section { display: block; }
input, select,button{ vertical-align: middle; outline: none; padding:0; border:0;}
ol, ul,li{ list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
strong,i,em,b{ font-style:normal; font-weight:normal; }
img { border:0;}
input[type="text"], input[type="button"], input[type="submit"], input[type="reset"] { -webkit-appearance: none; border-radius: 0;}
textarea { -webkit-appearance: none; border-radius: 0; background:none; outline:none; padding:0; margin:0; border:none;}
::-moz-selection { background: #b81c22; color: #fff; text-shadow: none; }
::selection { background: #b81c22; color: #fff; text-shadow: none; }
a{ text-decoration:none; blr: expression(this.onFocus=this.blur()); cursor: pointer; color:#000; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; }
a:link, a:visited { text-decoration: none; }
.clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0px; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
.fl{ float:left;}
.fr{ float:right;}
h1,h2,h3,h4,h5{ font-weight:normal; display:block;}
input,button,table,tr,td,textarea{ font-family:Microsoft yahei,Arial;}


@font-face {
	font-family: 'IMPACT';   /*字体名称*/
	src: url('../font/IMPACT.ttf');       /*字体源文件*/

	src:
		url('../font/IMPACT.eot?#font-spider') format('embedded-opentype'),
		url('../font/IMPACT.woff') format('woff'),
		url('../font/IMPACT.ttf') format('truetype'),
		url('../font/IMPACT.svg') format('svg');
	font-weight: normal;
	font-style: normal;

}


 

.search{position:fixed;top:0 !important;left:0;display:none;z-index:1000; width:100%; height:100%; background:#fff;}
.search .layer{ position: absolute; width: 70%; left: 15%; top: 50%; line-height: 100px; margin-top: -50px; border-bottom: 1px solid #eee;}
.search .layer .close{position:absolute;right: 0; top: -60px; font-size: 40px; line-height: 40px; color: #aaa; }
.search .layer .close:hover{ color: #B81C22;}
.search .layer .kuang{display: flex; flex-direction: row; justify-content: space-between; height: 100px; line-height: 100px;}
.search .layer .kuang .text{ width: 80%; font-size: 22px; color: #aaa;}
.search .layer .kuang .sub{ background: url(../images/sousuo.png) center center no-repeat; border: none; width: 40px; cursor: pointer;}

.offerprice{position:fixed;top:0 !important;left:0 !important; right: 0 !important; bottom: 0!important; display:none;z-index:1000; background:rgba(0,0,0,0.5);}
.offerprice .layer{ position: absolute; width: 1200px; left: 50%; margin-left: -600px; top: 50%; margin-top: -250px; background: #fff; border-radius: 10px;}
.offerprice .layer .close{position:absolute;left: 50%; bottom: -80px; margin-left: -25px; display: flex; flex-direction: column;}
.offerprice .layer .close:before{ content: ''; position: absolute; width: 2px; height: 30px; background: #fff; left: 50%; margin-left: -1px; top: -30px;}
.offerprice .layer .kuang{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; height: 500px;}
.offerprice .layer .kuang .kuangLeft{ padding: 0 50px; display: flex; flex-direction: column; width: 450px;}
.offerprice .layer .kuang .kuangLeft .ming{ font-size: 32px; text-align: center; font-weight: bold; width: 100%;}
.offerprice .layer .kuang .kuangLeft .alform{ display: flex; flex-direction: column; padding-top: 10px;}
.offerprice .layer .kuang .kuangLeft .alform .layui{ border: 1px solid #aaa; border-radius: 3px; padding: 0 10px; margin-top: 20px;}
.offerprice .layer .kuang .kuangLeft .alform .layui .text{ width: 100%; height: 50px; line-height: 50px;}
.offerprice .layer .kuang .kuangLeft .tijiao{ width: 100%; overflow: hidden; margin-top:20px;}
.offerprice .layer .kuang .kuangLeft .tijiao .sub{ width: 100%; background: #B81C22; border-radius: 4px; color: #fff; height:50px; line-height: 50px; font-size: 22px; cursor: pointer;}
.offerprice .layer .kuang .kuangLeft .word{ text-align: center; overflow: hidden; padding-top: 10px;}
.offerprice .layer .kuang .kuangLeft .word .num{ color: #B81C22;}

.banner{ width: 100%; overflow: hidden; position: relative; z-index: 1;}
.banner img{ display: block; width: 100%; object-fit: cover;}
.banner .swiper-slide { position: relative;}
.banner .swiper-button-next:after,.banner .swiper-button-prev:after{ font-size: 60px; opacity: 0; transition: all 0.6s;}
.banner:hover .swiper-button-next:after, .banner:hover .swiper-button-prev:after{ opacity: 1;}
.banner .swiper-button-next{ right: 40px;}
.banner .swiper-button-prev{ left: 40px;}

.number{ min-width: 1240px;	display: flex; flex-direction: row;	background: #fff; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); position: relative; z-index: 10;}
.numberList{ width: 20%;	min-width: 248px; height: 150px; display: flex;	flex-direction: column;	justify-content: center; align-items: center; background: #FFF; border-right: 1px solid #FAFAFA;position: relative;}
.numberBgTop{ position: absolute; left: 0px; top: 0px;}
.numberBgBottom{ position: absolute; bottom: 0px; right: 0px;}
.numberListDiv{ font-size: 15px; font-weight: normal;}
.numberListDiv span{ font-size: 50px; color: #000000; font-weight: bold; font-family: 'IMPACT'; margin-left: 5px;}
.numberListP{ font-size: 15px;	color: #888888;}

.Index{ display: flex; flex-direction: column; padding: 50px 0;}
.Index .title{ display: flex; flex-direction: column; padding-bottom: 40px;}
.exclusive{ display: flex; flex-direction: row; justify-content: space-between;}
.exclusive .exclusiveLeft{ width: 380px; display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap;}
.exclusive .exclusiveLeft .exclusiveLeftDiv{ width: 180px; height: 140px; background: #f5f5f5; border-radius: 4px; display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 0 10px 10px 0;cursor:pointer;}
.exclusive .exclusiveLeft .exclusiveLeftDiv:nth-child(3),.exclusive .exclusiveLeft .exclusiveLeftDiv:nth-child(4){ margin-bottom: 0;}
.exclusive .exclusiveLeft .exclusiveLeftDiv .Font{ margin-top: 26px; line-height: 22px; font-size: 22px;}
.exclusive .exclusiveLeft .exclusiveLeftDiv .Font span{ color: #B81C22;}

.exclusive .exclusiveCenter{ width: 480px; padding: 35px; background: #f5f5f5; border-radius: 4px;}
.exclusive .exclusiveCenter .name{ color: #B81C22; font-size: 26px; font-weight: bold;}
.exclusive .exclusiveCenter .text{ font-size: 16px; color: #888; padding-top: 10px;}
.exclusive .exclusiveCenter .kuang{ display: flex; flex-direction: row; justify-content: space-between;}
.exclusive .exclusiveCenter .kuang .nide{ border-radius: 4px; padding: 0 10px; line-height: 50px;}
.exclusive .exclusiveCenter .kuang .nide.zuo{ width: 230px; background: #fff;}
.exclusive .exclusiveCenter .kuang .nide.you{ width: 190px; background: #B81C22;}
.exclusive .exclusiveCenter .kuang .nide .input{ width: 100%; height: 50px;}
.exclusive .exclusiveCenter .kuang .nide .sub{ background: none; color: #fff; width: 100%; font-size: 16px; cursor: pointer;}

.fwmj{ width:100%; overflow:hidden; position:relative; padding:20px 0 50px;}
.fwmj .heng{ height:20px; border-radius:10px; background:#eee; border:none;}
.fwmj .heng .ui-slider-range{ background:#B81C22; border-radius:10px 0 0 10px;}
.fwmj .heng .ui-slider-handle{ top:-4px; margin:0 0 0 -20px; width:16px; height:16px; border:6px #B81C22 solid; background:#fff; border-radius:50%; outline:none;}
.fwmj .heng .form-slider-value{ position:absolute; font-size:16px; bottom:-35px; width:100px; text-align:center; margin-left:-50px;}
.ui-slider{ position:relative; text-align:left;}
.ui-slider .ui-slider-handle{position: absolute;z-index: 2;cursor: default;}
.ui-slider .ui-slider-range{position: absolute;z-index: 1;font-size: .7em;display: block;border: 0;background-position: 0 0;}
.ui-slider-horizontal .ui-slider-range {top: 0;height: 100%;}
.ui-slider-horizontal .ui-slider-range-min {left: 0;}
.ui-slider-horizontal .ui-slider-range-max {right: 0;}

.exclusive .exclusiveRight{ width: 298px; margin-left: 10px; display: flex; flex-direction: column; border: 1px solid #eee;}
.exclusive .exclusiveRight .tuimg{ display: flex; flex-direction: row;}
.exclusive .exclusiveRight .tuimg img{ display: block; width: 100%;}
.exclusive .exclusiveRight .yusuan{ padding: 10px 19px 10px; overflow: hidden;}
.exclusive .exclusiveRight .yusuan .tit{ width: 100%; border-radius: 2px; background: #d6d3cd; padding: 7px;}
.exclusive .exclusiveRight .yusuan .tit .js-total{ border: 3px solid #222; border-radius: 4px; height: 50px; line-height: 50px; display: block; padding: 0 10px; text-align: right; font-size: 34px; font-family: arial;}
.exclusive .exclusiveRight .yusuan ul{ display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap; padding-top: 20px;}
.exclusive .exclusiveRight .yusuan ul li{ width: 130px; line-height: 40px;}
.exclusive .exclusiveRight .yusuan ul li span{ color: #B81C22;}


.Product{ background: url(../images/Product.jpg) no-repeat; background-size: cover;}
.Product .fabric{ display: flex; flex-direction: row; flex-wrap: wrap;}
.Product .fabric .fabricList{ width: 400px; margin-left: 20px; position: relative; overflow: hidden;}
.Product .fabric .fabricList:nth-child(1){ margin: 0;}
.Product .fabric .fabricList .obimg{ display: flex; flex-direction: row;}
.Product .fabric .fabricList .obimg img{ display: block; width: 100%; height: 500px; object-fit: cover; transition:all 0.3s linear;}
.Product .fabric .fabricList .shuguan{ position: absolute; bottom: 0; left: 0; right: 0; z-index: 10; padding: 25px; background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.8));}
.Product .fabric .fabricList .shuguan .ming{ position: relative; color: #fff; font-size: 26px; padding-left: 15px; line-height: 26px;}
.Product .fabric .fabricList .shuguan .ming:before{ content: ''; position: absolute; left: 0; top: 2px; height: 22px; width: 4px; background: #fff;}
.Product .fabric .fabricList .shuguan .text{ color: #fff; font-size: 16px; margin-top: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.Product .fabric .fabricList .shuguan .desi,.Product .fabric .fabricList .shuguan .nofo{ height: 0px; opacity: 0; transition: all 300ms;}
.Product .fabric .fabricList:hover .shuguan .desi{ opacity: 0.6; height: 60px; color: #fff; padding: 10px 0;}
.Product .fabric .fabricList:hover .shuguan .nofo{ opacity: 1; width: 120px; text-align: center; border: 1px solid rgba(255,255,255,0.3); height: 40px; line-height: 40px; color: #fff;}
.Product .fabric .fabricList:hover .obimg img{ transform:scale(1.06);}

.exquisite{ display: flex; flex-direction: row; margin-top: -20px; min-width: 1240px;}
.exquisite ol{ display: flex; flex-direction: row; flex-wrap: wrap; width: 100%;}
.exquisite li{ width: 25%; display: flex; flex-direction: column;}
.exquisite li .contain{ margin: 10px; background: #fff; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); overflow: hidden; display: flex; flex-direction: column;}
.exquisite li .contain .ceng{ display: flex; flex-direction: column; position: relative; overflow: hidden;}
.exquisite li .contain .ceng .cengImg{ display: flex; flex-direction: row;}
.exquisite li .contain .ceng .cengImg img{ display: block; width: 100%;}
.exquisite li .contain .ceng .cengSolo{ opacity: 0; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 10; transform:scale(1.1); transition:all 0.3s linear; background: rgba(0,0,0,0.6); display: flex; flex-direction: column; justify-content: center; align-items: center;}
.exquisite li .contain .ceng .cengSolo .cengSoloming{ color: #fff; font-size: 22px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} 
.exquisite li .contain .ceng .cengSolo .cengSolofont{ color: #fff; display: flex; flex-direction: row; align-items: center; line-height: 30px; justify-content: center;}
.exquisite li .contain .ceng .cengSolo .cengSolofont sup{ padding: 0 10px;}
.exquisite li .contain .ceng .renqi{ position: absolute; top: 0; right: 20px; z-index: 20; background: #B81C22; line-height: 20px; padding: 6px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; color: #fff; display: flex; flex-direction: row; align-items: center;}
.exquisite li .contain .ceng .renqi img{ margin-right: 4px; width: 18px;}
.exquisite li .console{ position: relative; display: flex; flex-direction: column;}
.exquisite li .console .consoleSolo{ padding: 20px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox;-js-display: flex; display: flex;}
.exquisite li .console .consoleSolo .people{ display: flex; flex-direction: row; height: 60px; overflow: hidden;}
.exquisite li .console .consoleSolo .people img{ width: 60px; display: block;}
.exquisite li .console .consoleSolo .cengSolo{ padding-left: 15px; -webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1; overflow:hidden; }
.exquisite li .console .consoleSolo .cengSolo .cengSoloming{font-size: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} 
.exquisite li .console .consoleSolo .cengSolo .cengSolofont{ color: #666; display: flex; flex-direction: row; align-items: center; line-height: 30px;}
.exquisite li .console .consoleSolo .cengSolo .cengSolofont sup{ padding: 0 10px;}
.exquisite li .console .consoleAnniu{ opacity: 0; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 10; padding: 0 30px; transform:scale(1.1); transition:all 0.3s linear; background: #fff; display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
.exquisite li .console .consoleAnniu .consoleAnniulian{ padding: 0 10%; border: 1px solid #B81C22; height: 40px; line-height: 40px; border-radius: 20px;}
.exquisite li .console .consoleAnniu .consoleAnniulian a{ color: #B81C22; display: flex; align-items: center; justify-content: center;}
.exquisite li .console .consoleAnniu .consoleAnniulian a img{ padding-right: 4px;}
.exquisite li:hover .contain .ceng .cengSolo,.exquisite li:hover .console .consoleAnniu{ opacity: 1; transform:scale(1);}

.Desiger{ padding-top: 0;}
.Desiger .Tuijian{ display: flex; flex-direction: column; position:relative; overflow: hidden;}
.Desiger .Tuijian .liest{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; height: 400px; position: relative;}
.Desiger .Tuijian .liest:before{}
.Desiger .Tuijian .liest li{ position: absolute; width: 190px; height: 190px; overflow: hidden;}
.Desiger .Tuijian .liest li img{ display: block; width: 100%;}
.Desiger .Tuijian .liest li:nth-child(1){ left: 0; top: 0;}
.Desiger .Tuijian .liest li:nth-child(2){ left: 210px; top: 0;}
.Desiger .Tuijian .liest li:nth-child(3){ right: 210px; top: 0;}
.Desiger .Tuijian .liest li:nth-child(4){ right: 0; top: 0;}
.Desiger .Tuijian .liest li:nth-child(5){ left: 0; bottom: 0;}
.Desiger .Tuijian .liest li:nth-child(6){ left: 210px; bottom: 0;}
.Desiger .Tuijian .liest li:nth-child(7){ right: 210px; bottom: 0;}
.Desiger .Tuijian .liest li:nth-child(8){ right: 0; bottom: 0;}
.Desiger .Tuijian .liest li.on{ width: 184px; height: 184px; border: 3px solid #B81C22;}
.Desiger .Tuijian .dimian{ overflow:hidden;}
.Desiger .Tuijian .dimian ol li{ display: none; position: absolute; top: 0; left: 420px; z-index: 10; width: 400px; height: 400px;}
.Desiger .Tuijian .dimian ol li.on{ display: block;}
/*.Desiger .Tuijian .dimian ol li .dimianimg{ display: flex; flex-direction: row;}*/
.Desiger .Tuijian .dimian ol li .dimianimg img{ display: block; width: 100%;}
.Desiger .Tuijian .dimian ol li .dimianremen{ position: absolute; top: 20px; right: 20px; z-index: 10; width: 40px; height: 40px; font-family: '宋体'; border: 1px solid #fff; border-radius: 2px; display: flex; flex-direction: row; justify-content: center; align-items: center; line-height: 16px; color: #fff;}
.Desiger .Tuijian .dimian ol li .dimianword{ position: absolute; left: 20px; bottom: 20px; z-index: 10; display: flex; flex-direction: column;}
.Desiger .Tuijian .dimian ol li .dimianword h2{ color: #fff; font-size: 18px;}
.Desiger .Tuijian .dimian ol li .dimianword figure{ color: #fff;}

.picMarquee{ display: flex; flex-direction: column; width: 100%; position: relative; margin-top: 20px;}
.picMarquee .hd{}
.picMarquee .hd .prev,.picMarquee .hd .next{ width: 45px; height: 50px; position: absolute; top: 0; background-color: #666;}
.picMarquee .hd .prev{ left: 0; background-image: url(../images/prev.png); background-position: center center; background-repeat: no-repeat;}
.picMarquee .hd .next{ right: 0; background-image: url(../images/next.png); background-position: center center; background-repeat: no-repeat;}
.picMarquee .hd .prev:hover,.picMarquee .hd .next:hover{ background-color: #B81C22;}
.picMarquee .bd{ margin: 0 55px; overflow: hidden;}
.picMarquee .bd ul{}
.picMarquee .bd ul li{ width: 50px; background: #000; height: 50px; margin-right: 10px;}
.picMarquee .bd ul li img{ display: block; width: 100%; opacity: 0.7;}
.picMarquee .bd ul li:hover img{ opacity: 1;}
	
.Desiger .viewMore{ display: flex; flex-direction: row; justify-content: center; margin-top: 40px;}
.Desiger .viewMore a{ display: block; position: relative; text-align: center; width: 300px; height: 56px; line-height: 56px; transition: all 300ms; color: #B81C22; border: 2px solid #B81C22; font-size: 22px;}
.Desiger .viewMore a:before{ content: ''; position: absolute; left:0; width: 0; top: 0; bottom: 0; z-index: -1; background: #B81C22; transition: all 300ms;}
.Desiger .viewMore a:hover:before{ width: 100%;}
.Desiger .viewMore a:hover{ color: #fff;}
	
.Brand{ background: url(../images/About.jpg) center center no-repeat; display: flex; flex-direction: row;}
.Brand .About{ display: flex; flex-direction: row; height: 800px;}
.Brand .About .AboutLeft{ display: flex; width: 50%; flex-direction: row;}
.Brand .About .AboutLeft .AboutLeftlogo{ padding-top: 40px;}
.Brand .About .AboutLeft .AboutLeftword{ width: 300px; margin: 0 auto; display: flex; flex-direction: column; justify-content: center;}
.Brand .About .AboutLeft .AboutLeftword .name{ color: #B81C22; font-weight: bold; font-size: 36px;}
.Brand .About .AboutLeft .AboutLeftword .years{ display: flex; flex-direction: row; align-items: baseline; font-weight: bold; font-family: 'IMPACT';}
.Brand .About .AboutLeft .AboutLeftword .years span{ font-size: 120px; color: #B81C22;}
.Brand .About .AboutLeft .AboutLeftword .years sup{ color: #fff; opacity: 0.3; font-size: 40px; padding-left: 20px;}
.Brand .About .AboutLeft .AboutLeftword .kouhao{ font-size: 30px; line-height: 50px; color: #fff;}
.Brand .About .AboutLeft .AboutLeftword .liaojie{ display: flex; flex-direction: row; margin-top: 80px;}
.Brand .About .AboutLeft .AboutLeftword .liaojie a{ display: block; transition: all 300ms; width: 200px; height: 60px; line-height: 60px; text-align: center; background: #B81C22; color: #fff; font-size: 16px;}
.Brand .About .AboutLeft .AboutLeftword .liaojie a:hover{ background: #fff; color: #B81C22;}

.Brand .About .AboutRight{ width: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.Brand .About .AboutRight ol{ display: flex; flex-direction: row; flex-wrap: wrap;}
.Brand .About .AboutRight ol li{ width: 40%; padding: 30px 5%; cursor: pointer; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.Brand .About .AboutRight ol li .AboutRighticon{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 120px; height: 120px; border: 1px solid rgba(255,255,255,0.5); border-top-right-radius: 40px; transition: all 300ms;}
.Brand .About .AboutRight ol li .AboutRightword{ display: flex; flex-direction: column; align-items: center; text-align: center;}
.Brand .About .AboutRight ol li .AboutRightword h2{ color: #fff; font-size: 20px; padding: 30px 0 15px;}
.Brand .About .AboutRight ol li .AboutRightword figure{ color: #fff; opacity: 0.6;}
.Brand .About .AboutRight ol li:hover .AboutRighticon{ border-top-right-radius: 0;}

.speciaList{ display: flex; flex-direction: row; justify-content: space-between; width: 100%;}
.speciaList .speciaListLeft{ width: 750px; height: 560px; position: relative; transition: all 300ms;}
.speciaList .speciaListLeft img{ width: 100%; height: 100%; position: absolute; left: 0px; top: 0px;}
.speciaList .speciaListLeft .speciaListLeftword{ z-index: 10; position: absolute; top: 90px; left: 90px;}
.speciaList .speciaListLeft .speciaListLeftword h2{ font-size: 30px; font-weight: bold;}
.speciaList .speciaListLeft .speciaListLeftword p{ font-size: 22px; padding: 10px 0 50px;}
.speciaList .speciaListLeft .speciaListLeftword .tiyan{ display: block; text-align: center; color: #888; transition: all 300ms; width: 150px; height: 40px; line-height: 40px; font-size: 16px; border-radius: 20px; border: 1px solid #888;}
.speciaList .speciaListLeft .speciaListLeftword .tiyan:hover{ background: #B81C22; border-color: #b81c22; color: #fff;}
.speciaList .speciaListRight{ display: flex; flex-direction: column; justify-content: space-between;}
.speciaList .speciaListRight .speciaListRightDiv{ width: 480px; height: 275px; position: relative; transition: all 300ms;}
.speciaList .speciaListRight .speciaListRightDiv img{ width: 100%; height: 100%;}
.speciaList .speciaListRight .speciaListRightDiv .speciaListLeftword{ z-index: 10; position: absolute; top: 35px; left: 40px;}
.speciaList .speciaListRight .speciaListRightDiv .speciaListLeftword h2{ font-size: 24px; font-weight: bold;}
.speciaList .speciaListRight .speciaListRightDiv .speciaListLeftword p{ font-size: 22px;}
.speciaList .speciaListLeft:hover,.speciaList .speciaListRight .speciaListRightDiv:hover{ box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);}

.Strategy{ background: url(../images/news.jpg) right bottom no-repeat #fcfafb;}
.news{ display: flex; flex-direction: row; width:100%; justify-content: space-between;}
.news .newsList{ display: flex; flex-direction: column; background: #fff; transition: all 300ms; background: #fff; width: 390px;}
.news .newsList .newsListTit{ display: flex; flex-direction: column; position: relative;}
.news .newsList .newsListTit .newsListTitPic{ display: block; opacity: 0.4;}
.news .newsList .newsListTit .newsListTitspan{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 10; display: flex; flex-direction: row; justify-content: center; align-items: center; font-size: 30px; letter-spacing: 1px;}
.news .newsList .newsListli{ display: flex; flex-direction: column; padding: 20px; overflow: hidden;}
.news .newsList .newsListli ol{ display: flex; flex-direction: column;}
.news .newsList .newsListli ol li{ display: flex; flex-direction: row; padding-left: 25px; line-height: 50px; position: relative;}
.news .newsList .newsListli ol li a{ display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all 300ms;}
.news .newsList .newsListli ol li:before{ content: ''; position: absolute; left: 0; top: 50%; margin-top: -4px; width: 8px; height: 8px; background: #B81C22;transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg);}
.news .newsList .newsListli ol li a:hover{ padding-left: 5px; color: #B81C22;}
.news .newsList .newsListli .newsListliLink{ display: flex; flex-direction: row; justify-content: center; align-items: center; margin-top: 10px;}
.news .newsList .newsListli .newsListliLink a{ display: block; width: 150px; height: 40px; border: 1px solid #eee; line-height: 40px; text-align: center; transition: all 300ms;}
.news .newsList:hover{ box-shadow: 0 0 20px 0 rgba(0,0,0,0.1);}
.news .newsList:hover .newsListli .newsListliLink a{ border-color: #B81C22; background: #B81C22; color: #fff;}

.reputation{ width: 100%; background: url(../images/reputation.png) center bottom no-repeat; overflow: hidden;}
.reputation .inner{ display: flex; flex-direction: row; justify-content: space-between; height: 170px;}
.reputation .inner .reputationLeft{ display: flex; flex-direction: row; align-items: center; justify-content: center;}
.reputation .inner .reputationLeft .reputationLeftLogo{}
.reputation .inner .reputationLeft .reputationLeftFont{ padding-left: 50px; display: flex; flex-direction: column;}
.reputation .inner .reputationLeft .reputationLeftFont h2{ color: #fff; font-size: 24px;}
.reputation .inner .reputationLeft .reputationLeftFont p{ color: #fff; padding-top: 6px;}
.reputation .inner .reputationRight{ display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
.reputation .inner .reputationRight .reputationRightDiv{ display: flex; flex-direction: column; padding: 0 35px;}
.reputation .inner .reputationRight .reputationRightDiv div{ color: #fff;}
.reputation .inner .reputationRight .reputationRightDiv div span{ font-size: 30px; font-family: 'IMPACT'; padding-right: 5px;}
.reputation .inner .reputationRight .reputationRightDiv p{ color: #fff; font-size: 16px;}


/* footer */
.foot{ background: url(../images/foot-bg.png) no-repeat center; width: 100%; overflow: hidden; padding-top:115px;}
.footerTop{overflow: hidden;}
.foot dl{ float: left; padding-right: 120px;}
.foot dt{ font-size: 18px; color: #fff; padding:0 0 30px 0;}
.foot dd a{ font-size: 14px; color: #999999; display: block; padding-bottom: 20px }
.foot dd a:hover{ color: #ce0c22; }
.foot .hotline dt { padding: 0; display: flex; align-items: center;}
.foot .hotline{padding-right: 0; width: 420px;display: flex;
justify-content: center;flex-direction: column;align-items: center;align-content: center;}
.hotline{position: relative;}
.hotline::before{
	content: '';
	position: absolute;
	left: 0;
	top: 15%;
	bottom: 15%;
	height: 70%;
	background:#444444 ;
	width: 1px;
}
.hotline::after{
	content: '';
	position: absolute;
	right: 0;
	top: 15%;
	bottom: 15%;
	height: 70%;
	background:#444444 ;
	width: 1px;
}
.hotline dt span b{ font-size: 14px; color: #ce0c22; display: inline-block; width: 30px; }
.hotline dt span img{ display: inline-block; padding-right: 8px; }
.hotline dt strong{ font-family: 'DIN'; font-size: 26px; color: #ce0c22; padding-left: 15px; }
.hotline dd a{ display:block; text-align: center; color: #999999; float: left;  padding:0 13px; margin-top: 30px; transition: all 1s; width: 105px; height: 70px; }
.hotline dd a img{ display: block; margin:auto; padding:10px 0; }
.hotline dd a:hover{ transform: translateY(5px); }
.foot .code{ padding-right: 0; padding-left: 45px; }
.code { font-size: 18px; color: #fff; text-align: center;  }
.code img{ display: block; margin:auto; padding:25px 0; }
.link{ padding-top: 30px; border-top: 1px solid #444; margin-top: 30px; }
.txtMarquee-left{ padding-left: 20px; float: left; }
.link h3{ float: left; font-size: 18px; color: #fff; }
.link li{ float:left;}
.link li a{ font-size: 14px; color: #999; display: block; padding-top: 3px; }
.link li a b{ display: inline-block; padding:0 20px; }
.link li a:hover{ color: #ce0c22; }
.link h4{ float: right; }
.link h4 a{ font-size: 14px; color: #ce0c22; display: block; padding-top: 3px; }

.copyright{ background: #000; padding:20px 0; width: 100%; overflow: hidden; margin-top:60px;}
.copyright p{ font-size: 14px; color: #d1d1d1; }


.offer{ width: 100%; display: flex; flex-direction: column; background: rgba(0,0,0,0.8); position: fixed; left: 0; bottom: 0; right: 0; z-index: 110;}
.offer .inner{ display: flex; flex-direction: column;}
.offer .offerAddup{ display: flex; flex-direction: row; justify-content: space-between; height: 80px; position: relative; padding-left: 200px; cursor: pointer;}
.offer .offerAddup .offerAddupImg{ display: flex; flex-direction: row; position: absolute; left: 0; bottom: 0; z-index: 10;}
.offer .offerAddup .offerAddupFont{ display: flex; flex-direction: row; align-items: center;}
.offer .offerAddup .offerAddupFont span{ color: #fff; font-size: 34px; padding-right: 10px;}
.offer .offerAddup .offerAddupFont sup{ font-size: 22px; color: #B81C22;}
.offer .offerAddup .offerAddupArrow{ position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 30px; height: 80px;}
.offer .offerAddup .offerAddupArrow img{ display: block; width: 30px; height: 40px; animation: b 1.5s linear infinite; transition: all 1s;}

@keyframes b{
	0% {
		/* opacity: 0; */
		transform: translateY(-10px);
	}
	25% {
		transform: translateY(0px);
	}
	75% {
		transform: translateY(10px);
	}
	100% {
		/* opacity: 0; */
		transform: translateY(-10px);
	}
}

.offer .offerShow{ display:none; width:100%; z-index:100; background:#fff; margin-bottom: 20px;}
.storey{ display: flex; flex-direction: row; position: relative; padding: 50px; height: 320px; justify-content: space-between;}
.storey .storeyLeft{ width: 430px; display: flex; flex-direction: column;}
.storey .storeyLeft .storeyLeftTit{ display: flex; flex-direction: row; align-items: center; line-height: 30px; padding-bottom: 10px;}
.storey .storeyLeft .storeyLeftTit h2{ font-size: 26px; padding-right: 10px;}
.storey .storeyLeft .storeyLeftTit figure span{ color: #B81C22;}
.storey .storeyLeft .storeyLeftBox{ display: flex; flex-direction: row; justify-content: space-between; padding: 10px 0;}
.storey .storeyLeft .storeyLeftBox .storeyLeftBoxCont{ width: 85px; font-size: 16px; line-height: 40px;}
.storey .storeyLeft .storeyLeftBox .storeyLeftBoxTact{ width: 345px; display: flex; flex-direction: row; justify-content: space-between;}
.storey .storeyLeft .storeyLeftBox .storeyLeftBoxTact .form-group{ width: 170px; background: #f8f8f8; border-radius: 3px;}
.storey .storeyLeft .storeyLeftBox .storeyLeftBoxTact .form-group .form-control{ padding: 0 10px; height: 40px; line-height: 40px; background: none; width: 160px;}
.storey .storeyLeft .storeyLeftBox .storeyLeftBoxTent{ position: relative; width: 325px; padding: 0 10px; display: flex; flex-direction: row; background: #f8f8f8; border-radius: 3px;}
.storey .storeyLeft .storeyLeftBox .storeyLeftBoxTent .text{ width: 100%; background: none; height: 40px; line-height: 40px;}
.storey .storeyLeft .storeyLeftBox .storeyLeftBoxTent span{ position: absolute; right:10px; top:0; display: block; line-height: 40px;}
.storey .storeyLeft .storeyLeftBaomi{ width: 100%; text-align: center; padding-top: 10px;}

.storey .storeyCenter{ position: absolute; top:0; left: 47%; display: flex; display: -ms-flexbox; display: -webkit-flex; align-items: center; height: 420px;}
.storey .storeyCenter:before{ content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; height: 100%; background: #eee;}
.storey .storeyCenter .storeyCenterRound{ position: relative; z-index: 1; cursor: pointer; width: 170px; height: 170px; border-radius: 50%; box-shadow: 0 0 20px 0 rgba(0,0,0,0.1); background: #fff; display: flex; align-items: center; justify-content: center;transition: all 2s; animation: small 1.6s infinite forwards; transform: scale(1);}
.storey .storeyCenter .storeyCenterRound .storeyCenterRoundOne{ width: 130px; height: 130px; border-radius: 50%; background: rgba(184,28,34,0.2); display: flex; align-items: center; justify-content: center;}
.storey .storeyCenter .storeyCenterRound .storeyCenterRoundOne .storeyCenterRoundTwo{ width: 100px; height: 100px; border-radius: 50%; background: #B81C22; color: #fff; font-size: 26px; line-height: 30px; display: flex; align-items: center; justify-content: center;}

.storey .storeyRight{ width: 350px; display: flex; flex-direction: column; justify-content: center;}
.storey .storeyRight .storeyRightTit{ color: #555; font-size: 20px; line-height: 30px;}
.storey .storeyRight .storeyRightTit span{ display: inline-block; text-align: center; width: 30px; color: #B81C22; font-size: 30px;transition: all 2s; animation: small2 1.6s infinite forwards; transform: scale(1);}
.storey .storeyRight .storeyRightKuang{ display: flex; flex-direction: column; line-height: 30px; border: 1px solid #eee; padding: 20px 40px; margin: 20px 0;}
.storey .storeyRight .storeyRightKuang li{ display: flex; flex-direction: row; justify-content: space-between;}
.storey .storeyRight .storeyRightKuang li span{ display: flex; flex-direction: row; width: 60px; letter-spacing: 1px;}
.storey .storeyRight .storeyRightKuang li figure{ color: #B81C22; font-size: 20px;transition: all 2s; animation: small2 1.6s infinite forwards; transform: scale(1);}
.storey .storeyRight .storeyRightExe{ color: #aaa;}


.ripple{ position: fixed; width: 90px; right: 40px; bottom: 100px; z-index: 999;}
.ripple .rippleFloat{ width: 100%; background: #B81C22; border-radius: 6px; position: relative;}
.ripple .rippleFloat .rippleFloatShu{ position: absolute; top: -120px; left: -10px; display: flex; flex-direction: row; width: 130px; height: 140px;}
.ripple .rippleFloat .rippleFloatTit{ color: #fff; text-align: center; line-height: 1.3; padding-top: 25px;}
.ripple .rippleFloat .rippleFloatOl{ display: flex; flex-direction: column; padding-top: 10px;}
.ripple .rippleFloat .rippleFloatOl li{ display: flex; flex-direction: column; padding: 7px 0;}
.ripple .rippleFloat .rippleFloatOl li a{ display: flex; flex-direction: column; color: #fff; justify-content: center; align-items: center; }
.ripple .rippleFloat .rippleFloatOl li:active a img{transition: all 2s; animation: small2 1.6s infinite forwards; transform: scale(1);}
.ripple .rippleFloat .rippleFloatTop{ display: flex; position: relative; margin-top: 5px; padding: 10px 0; flex-direction: column; text-align: center; color: #fff; font-family: arial; font-size: 16px; cursor: pointer;}
.ripple .rippleFloat .rippleFloatTop:before{ content: ''; position: absolute; top: 0; left: 50%; margin-left: -7px; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid #fff;}

@keyframes small{		
	from{ transform: scale(0.95);}
	50%{ transform: scale(1);}
	to{ transform: scale(0.95);}		
}
@keyframes small2{		
	from{ transform: scale(1.25);}
	50%{ transform: scale(1);}
	to{ transform: scale(1.25);}		
}


.currency{position:fixed;top:0 !important;left:0 !important; right: 0 !important; bottom: 0!important; display:none;z-index:1000; background:rgba(0,0,0,0.3);}
.currency .layer{ position: absolute; width: 500px; left: 50%; margin-left: -250px; top: 50%; margin-top: -225px; background: #fff;}
.currency .layer .close{position:absolute;right: 10px; top: 0; display: flex; flex-direction: column; color: #fff; font-size: 30px; line-height: 1.2;}
.currency .layer .house{ display: flex; flex-direction: column;}
.currency .layer .house .houseImg{ display: flex; flex-direction: column;}
.currency .layer .house .houseCeng{ display: flex; flex-direction: column; padding: 30px 50px;}
.currency .layer .house .houseCeng .houseCengTit{ font-size: 26px; text-align: center; line-height: 30px;}
.currency .layer .house .houseCeng .houseCengInput{ display: flex; border: 1px solid #e0e0e0; padding: 0 10px; margin-top: 15px;}
.currency .layer .house .houseCeng .houseCengInput .text{ width: 100%; background: none; height: 44px; line-height: 44px;}
.currency .layer .house .houseCeng .houseCengXuan{ display: flex; flex-direction: column;}
.currency .layer .house .houseCeng .houseCengXuan .select{ display: flex; border: 1px solid #e0e0e0; padding: 0 10px; margin-top: 15px; height: 44px; line-height: 44px;}
.currency .layer .house .houseCeng .houseCengQing{ display: flex; flex-direction: column; margin-top: 15px;}
.currency .layer .house .houseCeng .houseCengQing .sub{ width: 100%; background: #B81C22; border-radius: 4px; color: #fff; height:50px; line-height: 50px; font-size: 22px; cursor: pointer;}
.currency .layer .house .houseCeng .houseCengQing .sub:hover{ opacity: 0.9;}


/* 精品案例页面 */
.inside{ display: flex; flex-direction: column; position: relative;}
.inside .insidePic{ display: flex; flex-direction: column;}
.inside .insidePic img{ display: block; width: 100%; height: 400px; object-fit: cover;}
.inside .insideTent{ display: flex; flex-direction: column; position: absolute; top: 0; left: 0; right: 0; bottom: 0; align-items: center; justify-content: center; z-index: 10;}
.inside .insideTent h2{ font-size: 40px; letter-spacing: 3px; color: #fff;}
.inside .insideTent p{ font-size: 34px; letter-spacing: 3px; color: #fff; opacity: 0.7; text-transform: uppercase;}

.center{ display: flex; flex-direction: column; position: relative; padding: 40px 0;}
.center .inner1440{ width: 1440px; margin: 0 auto; }
.sort{ display: flex; flex-direction: column; border: 1px solid #eee;}
.sort .sortList{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox;-js-display: flex; display: flex; border-top: 1px dashed #e5e5e5; line-height: 20px;}
.sort .sortList:nth-child(1){ border-top: none;}
.sort .sortList .sortListLeft{ width: 130px; font-size: 15px; padding: 20px 0; border-right: 1px solid #E5E5E5; display: flex; flex-direction: row; align-items: center; justify-content: center; background: #f5f5f5;}
.sort .sortList .sortListRight{-webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; padding: 0 10px;}
.sort .sortList .sortListRight a{ display: block; padding: 0 8px; margin: 0 10px; color: #555;}
.sort .sortList .sortListRight a.on,.sort .sortList .sortListRight a:hover{ background: #B81C22; color: #fff; border-radius: 3px;}

.screen{ display: flex; flex-direction: row; justify-content: space-between; background: #f8f8f8; padding: 17px 30px; margin-top: 40px;}
.screen .screenLeft{ display: flex; flex-direction: row;}
.screen .screenLeft .screenLeftAnniu{ display: flex; flex-direction: row;}
.screen .screenLeft .screenLeftAnniu dl{ display: flex; margin-right: 20px; flex-direction: row; background: #fff; border: 1px solid #dcdcdc; height: 34px; padding: 0 15px;  align-items: center; cursor: pointer;}
.screen .screenLeft .screenLeftAnniu dl dt{ color: #666; padding-right: 8px;}
.screen .screenLeft .screenLeftAnniu dl dd{ width: 9px; height: 12px; display: block; background: url(../images/screenLeftAnniu.png) -24px center no-repeat;}
.screen .screenLeft .screenLeftAnniu dl.on{ border-color: #B81C22;}
.screen .screenLeft .screenLeftAnniu dl.on dt{ color: #B81C22;}
.screen .screenLeft .screenLeftAnniu dl.on dd{ background-position: 0 0;}
.screen .screenLeft .screenLeftSou{ position: relative; width: 380px; height: 36px; background: #fff; overflow: hidden;}
.screen .screenLeft .screenLeftSou .text{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; text-indent: 10px; width: 100%; border: 1px solid #DCDCDC; height: 34px; line-height: 34px;}
.screen .screenLeft .screenLeftSou .sub{ position: absolute; right: 0; top: 0; bottom: 0; background: #B81C22; color: #fff; width: 70px; cursor: pointer;}
.screen .screenRight{ color: #666; line-height: 36px; height: 36px;}
.screen .screenRight .num{ font-size: 26px; color: #B81C22; padding: 0 5px;}

.anli{ display: flex; flex-direction: column;}
.anli ol{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.anli ol li{ width: 32%; display: flex; flex-direction: column; position: relative; background: #fff; margin-top: 30px; transition: all 300ms;}
.anli ol li .anliUp{ display: flex; flex-direction: row; position: relative;}
.anli ol li .anliUp .anliUpPic{ display: flex; flex-direction: row; position: relative; overflow: hidden;}
.anli ol li .anliUp .anliUpPic img{ display: block; width: 100%; -webkit-transition:all 0.3s linear; -moz-transition:all 0.3s linear; -o-transition:all 0.3s linear; transition:all 0.3s linear;}
.anli ol li .anliUp .anliUpRen{ position: absolute; left: 50%; height: 80px; width: 80px; border-radius: 50%; overflow: hidden; margin-left: -40px; bottom: -40px; z-index: 10; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);}
/*.anli ol li .anliUp .anliUpRen .anliUpRenImg{ display: flex; flex-direction: row;}*/
.anli ol li .anliUp .anliUpRen .anliUpRenImg img{ display: block; width: 100%;}
.anli ol li .anliUp .anliUpRen .anliUpRenText{ position: absolute; left: 0; bottom: 0; font-size: 12px; background: rgba(0,0,0,0.7); right: 0; text-align: center; color: #fff; line-height: 24px; z-index: 10;}
.anli ol li .anliDown{ padding: 60px 20px 20px; display: block; flex-direction: column; overflow: hidden; border: 1px solid #eee; justify-content: center; align-items: center;}
.anli ol li .anliDown .anliDownTit{ font-size: 20px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.anli ol li .anliDown .anliDownFen{ padding: 25px 0; display: flex; flex-direction: row; color: #999; justify-content: space-around; align-items: center; line-height: 20px;}
.anli ol li .anliDown .anliDownFen figure{ display: flex; flex-direction: row; }
.anli ol li .anliDown .anliDownFen figure span{ color: #999;}
.anli ol li .anliDown .anliDownFen figure sup{ color: #B81C22;}
.anli ol li .anliDown .anliDownButton{ display: flex; flex-direction: row; justify-content: space-around;}
.anli ol li .anliDown .anliDownButton span{ display: block;}
.anli ol li .anliDown .anliDownButton span a{ display: block; line-height: 28px; padding: 0 15px; border: 1px solid #eee; border-radius:15px;}
.anli ol li .anliUp .anliUpPic:before{ content: ""; position: absolute; width: 200px; height: 100%; top: 0; left: -150px; z-index: 10;
	overflow: hidden;
	background: -moz-linear-gradient(left, rgba(255, 255, 255, 0)0, rgba(255, 255, 255, .2)50%, rgba(255, 255, 255, 0)100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(50%, rgba(255, 255, 255, .2)), color-stop(100%, rgba(255, 255, 255, 0)));
	background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0)0, rgba(255, 255, 255, .2)50%, rgba(255, 255, 255, 0)100%);
	background: -o-linear-gradient(left, rgba(255, 255, 255, 0)0, rgba(255, 255, 255, .2)50%, rgba(255, 255, 255, 0)100%);
	-webkit-transform: skewX(-25deg);
	-moz-transform: skewX(-25deg);}           
.anli ol li:hover .anliUp .anliUpPic:before{ left: 150%; transition: left 1s ease 0s;}
.anli ol li:hover .anliUp .anliUpPic img{ -webkit-transform:scale(1.06); -moz-transform:scale(1.06); -ms-transform:scale(1.06); -o-transform:scale(1.06); transform:scale(1.06);}
.anli ol li:hover .anliDown .anliDownTit a{ color: #B81C22;}
.anli ol li .anliDown .anliDownButton span a:hover{ border-color: #B81C22; background: #B81C22; color: #fff;}
.anli ol li:hover{ box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);}

.look{ display: flex; flex-direction: row; justify-content: center; margin-top: 40px;}
.look a{ display: block; width: 320px; height: 70px; position: relative; transition: all 300ms;}
.look a:before{ content: ''; position: absolute; width: 308px; height: 58px; border: 1px solid #B81C22; transition: all 300ms; left: 0; top: 0;}
.look a:after{ content: ''; position: absolute; width: 308px; height: 58px; border: 1px solid #B81C22; transition: all 300ms; right: 0; bottom: 0;}
.look a span{ display: block; line-height: 60px; font-size: 20px; margin: 5px; text-align: center; color: #B81C22; transition: all 300ms;}
.look a:hover:before{ left: 5px; top: 5px;}
.look a:hover:after{ right: 5px; bottom: 5px;}
.look a:hover span{ background: #B81C22; color: #fff;}


/* 精品案例详情 */
.zhong{ background: #f5f5f5; display: flex; flex-direction: column;}
.blue{ display: flex; flex-direction: row; justify-content: space-between; background: #fff; padding: 20px 0;}
.blue .inner{ display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
.blue .inner .blueLeft{ width: 50%; display: flex; flex-direction: column; line-height: 50px;}
.blue .inner .blueLeft h2{ font-size: 30px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.blue .inner .blueLeft figure{ color: #666;}
.blue .inner .blueRight{ width: 420px; display: flex; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox;-js-display: flex;}
.blue .inner .blueRight .blueRightImg{ display: flex; flex-direction: row; width: 100px; height: 100px; overflow: hidden;}
.blue .inner .blueRight .blueRightImg img{ display: block; width: 100%;}
.blue .inner .blueRight .blueRightCont{-webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1; overflow: hidden; padding-left: 20px;}
.blue .inner .blueRight .blueRightCont .blueRightContText{ line-height: 30px; display: flex; flex-direction: row; justify-content: space-between;}
.blue .inner .blueRight .blueRightCont .blueRightContText h2{ font-size: 24px;}
.blue .inner .blueRight .blueRightCont .blueRightContText a{ display: block; height: 28px; line-height: 28px; border: 1px solid #B81C22; color: #B81C22; transition: all 300ms; border-radius: 15px; padding: 0 20px;}
.blue .inner .blueRight .blueRightCont .blueRightContText a:hover{ background: #B81C22; color: #fff;}
.blue .inner .blueRight .blueRightCont .blueRightContMent{ color: #666; line-height: 20px; margin-top: 10px;}
.blue .inner .blueRight .blueRightCont .blueRightContMent div{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}


.frame{ display: flex; flex-direction: row; overflow: hidden; padding: 25px 0;}
.frame .inner{ display: flex; flex-direction: row; justify-content: space-between;}
.trim{ width: 800px; padding: 30px; position: relative; background: #fff; display: flex; flex-direction: column;}
.trim .trimName{ display: flex; flex-direction: row; justify-content: space-between; position: relative;line-height: 36px;}
.trim .trimName h2{ font-size: 22px;}
.trim .trimName .howmuch{ display: flex; flex-direction: row; position: absolute; top: -30px; right: -30px; background: #B81C22; padding: 14px 20px; line-height: 22px;}
.trim .trimName .howmuch span{ display: block; width: 24px; height: 22px; background: url(../images/trimName.png) -80px center no-repeat;}
.trim .trimName .howmuch sup{ color: #fff; font-size: 16px; margin-left: 8px;}
.trim .trimName .howmuch:active{ background: #E62129;}
.trim .trimTable{ display: flex; flex-direction: column; padding: 30px 0;}
.trim .trimTable ol{ display: flex; flex-direction: row; flex-wrap: wrap; border-left: 1px solid #eee; border-top: 1px solid #eee;}
.trim .trimTable ol li{ width: 265px; border-right: 1px solid #eee; border-bottom: 1px solid #eee; line-height: 2; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 20px 0;}
.trim .trimTable ol li span{ font-size: 18px;}
.trim .trimTable ol li sup{ color: #888;}
.trim .trimName .also{ display: flex; flex-direction: row; align-items: center; border: 1px solid #B81C22; color: #B81C22; line-height: 34px; border-radius: 17px; padding: 0 30px; transition: all 300ms;}
.trim .trimName .also span{ display: block; width: 18px; height: 22px; background: url(../images/trimName.png) -6px center no-repeat; transition: all 300ms;}
.trim .trimName .also sup{ margin-left: 8px; transition: all 300ms;}
.trim .trimName .also:active{ background: #B81C22; color: #fff;}
.trim .trimName .also:active span{ background-position: -37px center;}
.trim .trimDetail{ padding: 30px 0; display: flex; flex-direction: column; font-size: 15px; line-height: 2.2;}
.trim .trimDetail img{ display: block; width: 100%; margin-top: 20px;}
.trim .giveup{ display: flex; flex-direction: row; justify-content: center;}
.trim .giveup a{ display: flex; flex-direction: column; width: 130px; border-radius: 35px; height: 70px; justify-content: center; align-items: center; border: 1px solid #D3D3D3;}
.trim .giveup a span{ display: block; width: 24px; height: 22px; background: url(../images/giveup.png) 2px center no-repeat;}
.trim .giveup a sup{ font-family: arial; font-size: 16px; padding-top: 6px;}
.trim .giveup a:active{ background: #B81C22; color: #fff; border-color: #B81C22;}
.trim .giveup a:active span{ background-position: -27px center;}
.trim .trimSolo{ display: flex; flex-direction: row; justify-content: space-between; margin-top: 30px;}
.trim .trimSolo a{ display: block; text-align: center; border-radius: 3px; line-height: 50px; font-size: 16px; border: 1px solid #eee; width: 44%; transition: all 300ms;}
.trim .trimSolo a:hover{ background: #B81C22; border-color: #B81C22; color: #fff;}

.china{ display: flex; flex-direction: column; width: 360px; position: relative; z-index: 101;}
.fitup{ padding: 20px; background: #fff; width: 320px;}
.fitup .fitupTit{ display: flex; flex-direction: row; justify-content: center; align-items: center; border: 2px solid #aaa; border-radius: 10px; height: 86px; font-size: 28px;}
.fitup .fitupTit span{ color: #B81C22;}
.fitup .fitupSuan{ display: flex; flex-direction: column; padding: 20px; border: 2px solid #aaa; border-radius: 10px; margin-top: 20px;}
.fitup .fitupSuan .fitupSuanText{ text-align:justify; text-align-last:justify;}
.fitup .fitupSuan .fitupSuanJiqi{ font-family: 'IMPACT'; font-size: 36px; display: flex; flex-direction: row; padding-right: 25px; justify-content: flex-end; align-items: center; background: url(../images/fitupSuanJiqi.jpg) no-repeat; background-size: 100% 100%; height: 70px; margin: 10px 0 20px;}
.fitup .fitupSuan .fitupSuanFei{ border: 1px solid #eee; border-radius: 4px; padding: 5px 0; line-height: 20px; display: flex; flex-wrap: wrap;}
.fitup .fitupSuan .fitupSuanFei figure{ color: #555; width: 42%; padding: 0 4%;}
.fitup .fitupSuan .fitupSuanShuru{ display: flex; align-items: center; flex-direction: row; border-radius: 4px; position: relative; margin-top: 20px; background: #f5f5f5;}
.fitup .fitupSuan .fitupSuanShuru .text{ width: 100%; text-indent: 10px; height: 40px; line-height: 40px; background: none;}
.fitup .fitupSuan .fitupSuanShuru .sub{ height: 50px; line-height: 50px; background: #B81C22; color: #fff; width: 100%; border-radius: 4px; font-size: 22px; cursor: pointer;}
.fitup .fitupSuan .fitupSuanShuru .sub:active{ background: #E62129;}

.like{ padding: 20px; background: #fff; display: flex; flex-direction: column; margin-top: 20px;}
.like .likeTit{ display: flex; flex-direction: row; justify-content: space-between; border-bottom: 1px solid #eee; padding-bottom: 10px; line-height: 30px;}
.like .likeTit h2{ font-size: 28px;}
.like .likeTit a{ color: #B81C22;}
.like .likeCase{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.like .likeCase a{ display: block; width: 100px; margin-top: 10px; display: flex; flex-direction: row; }
.like .likeCase a img{ display: block; width: 100%; height: 100px; object-fit: cover; transition: all 300ms;}
.like .likeCase a img:hover{ -webkit-transform:scale(1.06); -moz-transform:scale(1.06); -ms-transform:scale(1.06); -o-transform:scale(1.06); transform:scale(1.06);}
.reckon_fixed_top{ position:fixed; top:100px;}
.reckon_fixed_bottom{ position: absolute; bottom: 0;}

.related{ display: flex; flex-direction: column; background: #fff; padding: 0 0 60px;}
.related .inner{ display: flex; flex-direction: column; position: relative;}
.related .inner .relatedTitle{ display: flex; flex-direction: row; justify-content: space-between; height: 90px; border-bottom: 1px solid #EEE; align-items: center;}
.related .inner .relatedTitle h2{ position: relative; padding-left: 15px; line-height: 22px; font-size: 22px;}
.related .inner .relatedTitle h2 span{ color: #aaa; font-family: arial; text-transform: uppercase; padding-left: 10px; font-size: 14px;}
.related .inner .relatedTitle h2:before{ content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: #B81C22;}
.related .relatedList{ display: flex; flex-direction: column;}
.related .relatedList .relatedListUl{ display: flex; flex-direction: row; position: absolute; top: 0; right: 0; z-index: 10;}
.related .relatedList .relatedListUl li{ position: relative; display: flex; flex-direction: row; height: 90px; align-items: center;}
.related .relatedList .relatedListUl li:nth-child(2){ margin: 0 80px;}
.related .relatedList .relatedListUl li a{ color: #555;}
.related .relatedList .relatedListUl li:before{ content: ''; left: 50%; right: 50%; width: 0; height: 1px; position: absolute; bottom: 0; transition: all 300ms; background: #B81C22;}
.related .relatedList .relatedListUl li.on:before{ width: 100%; left: 0; right: 0;}
.related .relatedList .relatedListUl li.on a{ color: #B81C22;}
.related .relatedList .relatedListOne ol{ display: none;}
.related .relatedList .relatedListOne ol.on{ display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap;}
.related .relatedList .relatedListOne ol li{ width:400px; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); position: relative; background: #fff; margin-top: 20px; padding-bottom: 80px;}
.related .relatedList .relatedListOne ol li .relatedListOneCeng{ display: flex; flex-direction: row; position: relative;}
.related .relatedList .relatedListOne ol li .relatedListOneCeng .relatedListOnePic{ display: flex; flex-direction: row;}
.related .relatedList .relatedListOne ol li .relatedListOneCeng .relatedListOnePic img{ display: block; width: 100%;}
.related .relatedList .relatedListOne ol li .relatedListOneCeng .relatedListOneRen{ position: absolute; right: 15px; z-index: 10; bottom: -45px; transition: all 300ms;}
.related .relatedList .relatedListOne ol li .relatedListOneCeng .relatedListOneRen a{ display: block; width: 80px; height: 80px; overflow: hidden; border-radius: 50%; border: 5px solid #fff; box-shadow: 0 0 5px 0 rgba(0,0,0,0.1);}
.related .relatedList .relatedListOne ol li .relatedListOneCeng .relatedListOneRen a img{ display: block; width: 100%;}
.related .relatedList .relatedListOne ol li .relatedListOneTent{ padding: 15px; display: flex; flex-direction: column; height: 50px; position: absolute; bottom: 0; overflow:hidden; z-index: 1; left: 0; right: 0; transition: all 300ms; background: #fff;}
.related .relatedList .relatedListOne ol li .relatedListOneTent .relatedListOneTentWord{ display: flex; flex-direction: column; padding-right: 120px; line-height: 25px;}
.related .relatedList .relatedListOne ol li .relatedListOneTent .relatedListOneTentWord h2 a{ overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; display: block;}
.related .relatedList .relatedListOne ol li .relatedListOneTent .relatedListOneTentWord figure{ padding-top: 6px; color: #888; display: flex; flex-direction: row; align-items: center;}
.related .relatedList .relatedListOne ol li .relatedListOneTent .relatedListOneTentWord figure b{ display: block; padding: 0 12px; font-size: 12px;}
.related .relatedList .relatedListOne ol li .relatedListOneTent .relatedListOneTentText{ display: flex; flex-direction: column; transition: all 300ms;}
.related .relatedList .relatedListOne ol li .relatedListOneTent .relatedListOneTentText h2,
.related .relatedList .relatedListOne ol li .relatedListOneTent .relatedListOneTentText p{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.related .relatedList .relatedListOne ol li .relatedListOneTent .relatedListOneTentText h2{ margin-top: 15px;}
.related .relatedList .relatedListOne ol li .relatedListOneTent .relatedListOneTentText h2 span{ padding-left: 10px; color: #888;}
.related .relatedList .relatedListOne ol li:hover .relatedListOneCeng .relatedListOneRen{ bottom: 15px;}
.related .relatedList .relatedListOne ol li:hover .relatedListOneTent{ height: 110px;}
.related .relatedList .relatedListOne ol li:hover .relatedListOneTent .relatedListOneTentWord h2 a{ color: #B81C22;}

.alltoo{position:fixed;top:0 !important;left:0 !important; right: 0 !important; bottom: 0!important; display:none;z-index:1000; background:rgba(0,0,0,0.5);}
.alltoo .layer{ position: absolute; width: 420px; left: 50%; margin-left: -210px; top: 50%; margin-top: -230px; background: #fff; box-shadow: 0 0 20px 0 rgba(0,0,0,0.3);}
.alltoo .layer .close{position:absolute;right: 30px; top: 20px; display: flex; flex-direction: column; font-size: 24px;}
.alltoo .layer .kuang{ display: flex; flex-direction: column; padding: 30px;}
.alltoo .layer .kuang .ming{ font-size: 22px; width: 100%; line-height: 30px;}
.alltoo .layer .kuang .kuangPic{ display: flex; flex-direction: column; margin-top: 30px;}
.alltoo .layer .kuang .alform{ display: flex; flex-direction: column;}
.alltoo .layer .kuang .alform .layui{  border-radius: 3px; padding: 0 10px; margin-top: 20px; background: #f5f5f5;}
.alltoo .layer .kuang .alform .layui .text{ width: 100%; height: 50px; line-height: 50px; background: none;}
.alltoo .layer .kuang .tijiao{ width: 100%; overflow: hidden; margin-top:20px;}
.alltoo .layer .kuang .tijiao .sub{ width: 100%; background: #B81C22; border-radius: 4px; color: #fff; height:50px; line-height: 50px; font-size: 18px; cursor: pointer;}


/* 设计师样式 */
.person{ display: flex; flex-direction: column; background: #fff;}
.person .personSheji{ display: flex; flex-direction: row; border-bottom: 1px solid #eee; line-height: 30px; padding: 20px 0;}
.person .personSheji .personShejiLeft{ width: 90px; display: flex; flex-direction: column;}
.person .personSheji .personShejiRight{-webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;}
.person .personSheji .personShejiRight a{ display: block; padding: 0 8px; margin: 0 10px; color: #555;}
.person .personSheji .personShejiRight a.on,.person .personSheji .personShejiRight a:hover{ background: #B81C22; color: #fff; border-radius: 3px;}
.person .readd{ padding: 25px 0; background: none; margin-top: 0;}

.human{ display: flex; flex-direction: column;}
.human .inner{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.human .inner li{ width: 295px; margin-top: 20px; background: #fff; transition: all 300ms; display: flex; flex-direction: column;}
.human .inner li .humanPic{ display: flex; flex-direction: column; overflow: hidden;}
.human .inner li .humanPic img{ display: block; width: 100%; transition: all 300ms;}
.human .inner li .humanTent{ display: flex; flex-direction: column;}
.human .inner li .humanTent .humanTentName{ display: flex; flex-direction: row; align-items: center; padding: 15px 15px 0;}
.human .inner li .humanTent .humanTentName h2{ font-size: 22px; color: #000;}
.human .inner li .humanTent .humanTentName b{ color: #555; padding-left: 6px;}
.human .inner li .humanTent .humanTentShu{ display: flex; flex-direction: row; justify-content: space-between; padding: 10px 15px 15px; border-bottom: 1px solid #eee;}
.human .inner li .humanTent .humanTentShu figure{ width: 48%; color: #555; display: flex; flex-direction: row;}
.human .inner li .humanTent .humanTentShu figure:nth-child(1){ justify-content: flex-start;}
.human .inner li .humanTent .humanTentShu figure:last-child{ justify-content: flex-end;}
.human .inner li .humanTent .humanTentShu figure span{ color: #B81C22; padding-right: 3px;}
.human .inner li .humanTent .humanTentShu sup{ color: #555;}
.human .inner li .humanTent .humanTentCeng{ padding: 15px; line-height: 32px; display: flex; flex-direction: row; justify-content: space-between;}
.human .inner li .humanTent .humanTentCeng .yuyue{ width: 130px; background: #B81C22; color: #fff; display: block; height: 32px; text-align: center;}
.human .inner li .humanTent .humanTentCeng span i{ color: #B81C22;}
.human .inner li:hover .humanPic img{ -webkit-transform:scale(1.06); -moz-transform:scale(1.06); -ms-transform:scale(1.06); -o-transform:scale(1.06); transform:scale(1.06);}
.human .inner li:hover{ box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);}

/* 设计师详情 */
.arch{ background: #fff; position: relative; z-index: 12; box-shadow: 0 0 5px 0 rgba(0,0,0,0.1);}
.arch .inner{ display: flex; flex-direction: row; justify-content: space-between; color: #555; line-height: 30px; align-items: center;}
.arch .inner .archRight{ display: flex; flex-direction: row; align-items: center; padding: 20px 0;}
.arch .inner .archRight img{ margin-right: 10px;}
.arch .inner .archRight a{ color: #555;}
.arch .inner .archRight b{ padding: 0 6px;}
.arch .inner .archRight a:hover{ color: #B81C22;}
.arch .inner .archRight a:last-child{ color: #B81C22;}
.arch .inner .archBack{ display: flex; flex-direction: column;}
.arch .inner .archBack a{ display: flex; height: 70px; background: #B81C22; transition: all 300ms; flex-direction: row; padding: 0 35px; align-items: center; justify-content: center;}
.arch .inner .archBack a span{ display: flex; flex-direction: column; width: 20px; height: 17px; background: url(../images/archBack.png) no-repeat;}
.arch .inner .archBack a sup{ color: #fff; padding-left: 8px;}
.arch .inner .archBack a:hover{ background: rgba(184,28,34,0.85);}


.itect{ display: flex; flex-direction: column; padding: 30px 0;}
.itect .inner{ display: flex; flex-direction: row; justify-content: space-between;}
.itect .inner .itectPic{ display: flex; flex-direction: column; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);}
.itect .inner .itectPic img{ width: 340px; height: 500px; object-fit: cover;}
.itect .inner .itectLayer{ width: 810px; padding: 30px; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); background: #fff; display: flex; flex-direction: column;}
.itect .inner .itectLayer .itectLayerOne{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding-bottom: 19px; border-bottom: 1px solid #eee;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneRight{ display: flex; flex-direction: column;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneRight .seek{ display: flex; flex-direction: row; align-items: center; border: 1px solid #B81C22; color: #B81C22; line-height: 38px; border-radius: 19px; padding: 0 30px; transition: all 300ms;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneRight .seek span{ display: block; width: 18px; height: 22px; background: url(../images/trimName.png) -6px center no-repeat; transition: all 300ms;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneRight .seek sup{ margin-left: 8px; transition: all 300ms;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneRight .seek:active{ background: #B81C22; color: #fff;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneRight .seek:active span{ background-position: -37px center;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneLeft{ display: flex; flex-direction: row; position: relative; line-height: 24px;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneLeft:before{ content: ''; position: absolute; left: 0; top: 0; bottom: 0; left: 0; width: 3px; background: #B81C22;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneLeft h2{ font-size: 24px; padding-left: 10px;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneLeft span{ color: #555; padding: 0 40px 0 20px;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneLeft dl{ display: flex; flex-direction: row; color: #B81C22;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneLeft dl dt{ display: flex; flex-direction: column; align-items: center; height: 24px; width: 12px; background: url(../images/itectLayerOneLeft.png) center center no-repeat;}
.itect .inner .itectLayer .itectLayerOne .itectLayerOneLeft dl dd{ padding-left: 4px;}


.discover{position:fixed;top:0 !important;left:0 !important; right: 0 !important; bottom: 0!important; display:none;z-index:1000; background:rgba(0,0,0,0.5);}
.discover .layer{ position: absolute; width: 420px; left: 50%; margin-left: -210px; top: 50%; margin-top: -230px; background: #fff; box-shadow: 0 0 20px 0 rgba(0,0,0,0.3);}
.discover .layer .close{position:absolute;right: 30px; top: 20px; display: flex; flex-direction: column; font-size: 24px;}
.discover .layer .kuang{ display: flex; flex-direction: column; padding: 30px;}
.discover .layer .kuang .ming{ font-size: 22px; width: 100%; line-height: 30px;}
.discover .layer .kuang .alform{ display: flex; flex-direction: column;}
.discover .layer .kuang .alform .layui{  border-radius: 3px; padding: 0 10px; margin-top: 20px; background: #f5f5f5; position: relative;}
.discover .layer .kuang .alform .layui .text{ width: 100%; height: 50px; line-height: 50px; background: none;}
.discover .layer .kuang .tijiao{ width: 100%; overflow: hidden; margin-top:20px;}
.discover .layer .kuang .tijiao .sub{ width: 100%; background: #B81C22; border-radius: 4px; color: #fff; height:50px; line-height: 50px; font-size: 18px; cursor: pointer;}
.discover .layer .kuang .alform .layui .textarea{ width: 100%; height: 70px; text-align: left; padding-top: 10px;}
.discover .layer .kuang .alform .layui span{ display: block; position: absolute; right: 0; top:0; bottom: 0; z-index: 10;}
.discover .layer .kuang .alform .layui span img{ display: block; width: 120px; height: 50px;}

.itect .inner .itectLayer .itectLayerTwo{ display: flex; flex-direction: column; padding: 20px 0;}
.itect .inner .itectLayer .itectLayerTwo ol{ display: flex; flex-direction: column;}
.itect .inner .itectLayer .itectLayerTwo ol li{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; -js-display:flex; display: flex; line-height: 2.4;}
.itect .inner .itectLayer .itectLayerTwo ol li .itectLayerTwoTit{ color: #666;}
.itect .inner .itectLayer .itectLayerTwo ol li .itectLayerTwoCont{ -webkit-box-flex:1; -webkit-flex: 1; -ms-flex: 1; flex: 1 1; display: flex;}
.itect .inner .itectLayer .itectLayerThree{ display: flex; flex-direction: column;}
.itect .inner .itectLayer .itectLayerThree .itectLayerThreeTit{ position: relative; display: flex; flex-direction: column; font-size: 22px;}
.itect .inner .itectLayer .itectLayerThree .itectLayerThreeTit:after{ content: ''; position: absolute; right: 0; top: 50%; width: 88%; height: 0; border-bottom: 1px dashed #ddd;}
.itect .inner .itectLayer .itectLayerThree .itectLayerThreeTent{ margin-top: 10px; display: flex; flex-direction: column; line-height: 30px; height: 90px; overflow-x: hidden; overflow-y: auto;}

.tryto{ display: flex; flex-direction: column; padding: 40px 0; background: #fff;}
.tryto .trytoTitle{ display: flex; flex-direction: column; justify-content: center; align-items: center; font-size: 32px;}
.tryto .trytoList{ display: flex; flex-direction: column; margin-top: 20px;}
.tryto .trytoList ol{ display: flex; flex-wrap: wrap;  justify-content: space-between;}
.tryto .trytoList li{ width:400px; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); position: relative; background: #fff; margin-top: 20px; padding-bottom: 80px;}
.tryto .trytoList li .trytoListOneCeng{ display: flex; flex-direction: row; position: relative;}
.tryto .trytoList li .trytoListOneCeng .trytoListOnePic{ display: flex; flex-direction: row;}
.tryto .trytoList li .trytoListOneCeng .trytoListOnePic img{ display: block; width: 100%;}
.tryto .trytoList li .trytoListOneCeng .trytoListOneRen{ position: absolute; right: 15px; z-index: 10; bottom: -45px; transition: all 300ms;}
.tryto .trytoList li .trytoListOneCeng .trytoListOneRen a{ display: block; width: 80px; height: 80px; overflow: hidden; border-radius: 50%; border: 5px solid #fff; box-shadow: 0 0 5px 0 rgba(0,0,0,0.1);}
.tryto .trytoList li .trytoListOneCeng .trytoListOneRen a img{ display: block; width: 100%;}
.tryto .trytoList li .trytoListOneTent{ padding: 15px;  height: 50px; position: absolute; bottom: 0; overflow:hidden; z-index: 1; left: 0; right: 0; transition: all 300ms; background: #fff;}
.tryto .trytoList li .trytoListOneTent .trytoListOneTentWord{ display: flex; flex-direction: column; padding-right: 120px; line-height: 25px;}
.tryto .trytoList li .trytoListOneTent .trytoListOneTentWord h2 a{ overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; display: block;}
.tryto .trytoList li .trytoListOneTent .trytoListOneTentWord figure{ padding-top: 6px; color: #888; display: flex; flex-direction: row; align-items: center;}
.tryto .trytoList li .trytoListOneTent .trytoListOneTentWord figure b{ display: block; padding: 0 12px; font-size: 12px;}
.tryto .trytoList li .trytoListOneTent .trytoListOneTentText{ display: flex; flex-direction: column; transition: all 300ms;}
.tryto .trytoList li .trytoListOneTent .trytoListOneTentText h2,
.tryto .trytoList li .trytoListOneTent .trytoListOneTentText p{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.tryto .trytoList li .trytoListOneTent .trytoListOneTentText h2{ margin-top: 15px;}
.tryto .trytoList li .trytoListOneTent .trytoListOneTentText h2 span{ padding-left: 10px; color: #888;}
.tryto .trytoList li:hover .trytoListOneCeng .trytoListOneRen{ bottom: 15px;}
.tryto .trytoList li:hover .trytoListOneTent{ height: 110px;}
.tryto .trytoList li:hover .trytoListOneTent .trytoListOneTentWord h2 a{ color: #B81C22;}

.tryto .chakan{ display: flex; flex-direction: row; justify-content: center; align-items: center; margin-top: 50px;}
.tryto .chakan a{ display: block; width: 180px; line-height: 50px; height: 50px; border: 1px solid #222; text-align: center; transition: all 300ms; font-size: 16px;}
.tryto .chakan a:hover{ background: #B81C22; color: #fff; border-color: #B81C22;}


/* 新闻资讯 */
.arch .inner .archLeft{ display: flex; flex-direction: row; border-left: 1px solid #eee;}
.arch .inner .archLeft .archLeftDiv{ display: flex; flex-direction: column; border-right: 1px solid #eee;}
.arch .inner .archLeft .archLeftDiv a{ display: flex; flex-direction: column; position: relative; height: 70px; justify-content: center; align-items: center;}
.arch .inner .archLeft .archLeftDiv a figure{ display: flex; flex-direction: row; width: 200px; justify-content: center; font-size: 18px;}
.arch .inner .archLeft .archLeftDiv a figure h2{ padding: 0 4px;}
.arch .inner .archLeft .archLeftDiv.on a figure{ color: #B81C22; font-weight: bold; font-size: 22px;}
.arch .inner .archLeft .archLeftDiv.on a figure h2{ color: #B81C22; font-weight: bold; font-size: 22px;}

.meiyou{ padding-top: 0;}
.xinwen{ display: flex; flex-direction: row; justify-content: space-between; margin-top: 40px;}
.xinwen .xinwenList{ display: flex; flex-direction: column; width: 32%; background: #fff; transition: all 300ms;}
.xinwen .xinwenList .xinwenListPic{ display: flex; flex-direction: column; overflow: hidden;}
.xinwen .xinwenList .xinwenListPic img{width:100%;margin:0 auto;}
.xinwen .xground: #f5f5f5; border-radius: 50%; width: 50px; height: 50px; position: absolute; top: -5px; color: #000; font-size: 30px;}
.courseCeng .swiper-button-next{ right: -90px;}inwenList .xinwenListPic img{ display: block; width: 100%; height: 280px; object-fit: cover; transition: all 300ms;}
.xinwen .xinwenList .xinwenListTact{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 20px 15px; border: 1px solid #eee;}
.xinwen .xinwenList .xinwenListTact .xinwenListTactTent{ width: 70%; display: flex; flex-direction: column;}
.xinwen .xinwenList .xinwenListTact .xinwenListTactTent h2{ font-size: 22px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 5px;}
.xinwen .xinwenList .xinwenListTact .xinwenListTactMore{ display: flex; flex-direction: column;}
.xinwen .xinwenList .xinwenListTact .xinwenListTactMore a{ display: block; border: 1px solid #eee; padding: 6px 20px; color: #B81C22; transition: all 300ms;}
.xinwen .xinwenList:hover{ box-shadow: 0 0 15px 0 rgba(0,0,0,0.2);}
.xinwen .xinwenList:hover .xinwenListPic img{ -webkit-transform:scale(1.06); -moz-transform:scale(1.06); -ms-transform:scale(1.06); -o-transform:scale(1.06); transform:scale(1.06);}
.xinwen .xinwenList:hover .xinwenListTact .xinwenListTactTent h2 a{ color: #B81C22;}

.infor{ display: flex; flex-direction: column; margin-top: 20px;}
.infor .inforList{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; -js-display:flex; display: flex; margin-top: 20px; background: #fff; transition: all 300ms;}
.infor .inforList .inforListPic a{ display: flex; flex-direction: column; overflow: hidden;}
.infor .inforList .inforListPic img{ width: 420px; height: 260px; object-fit: cover; transition: all 300ms;}
.infor .inforList .inforListTent{ -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1 1; display: flex; padding: 29px 25px; height: 200px; border: 1px solid #eee; flex-direction: row; justify-content: space-between;}
.infor .inforList .inforListTent .inforListTentLeft{ display: flex; flex-direction: column; justify-content: space-between; width: 70%;}
.infor .inforList .inforListTent .inforListTentLeft figcaption{ display: flex; flex-direction: column;}
.infor .inforList .inforListTent .inforListTentLeft figcaption a{ display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 26px; font-weight: bold;}
.infor .inforList .inforListTent .inforListTentLeft figcaption p{ color: #555; line-height: 30px; margin-top: 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.infor .inforList .inforListTent .inforListTentLeft figure span{ margin-right: 40px;}
.infor .inforList .inforListTent .inforListTentLeft figure span i{ padding: 0 5px; color: #B81C22;}
.infor .inforList .inforListTent .inforListTentRight{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 160px;}
.infor .inforList .inforListTent .inforListTentRight span{ font-family: arial; font-size: 26px;}
.infor .inforList .inforListTent .inforListTentRight a{ display: block; width: 140px; height: 44px; margin-top: 10px; border: 1px solid #B81C22; transition: all 300ms; line-height: 44px; text-align: center; color: #B81C22; font-size: 16px;}
.infor .inforList:hover .inforListPic img{ -webkit-transform:scale(1.06); -moz-transform:scale(1.06); -ms-transform:scale(1.06); -o-transform:scale(1.06); transform:scale(1.06);}
.infor .inforList:hover .inforListTent .inforListTentLeft figcaption a{ color: #B81C22;}
.infor .inforList:hover .inforListTent .inforListTentRight a{ color: #fff; background: #B81C22;}
.infor .inforList:hover{ box-shadow: 0 0 15px 0 rgba(0,0,0,0.2);}

.trim .trimXin{ display: flex; flex-direction: column; border-bottom: 1px solid #eee; padding-bottom: 30px;}
.trim .trimXin .trimXinTit{ font-size: 30px;}
.trim .trimXin .trimXinSpan{ color: #666; display: flex; flex-direction: row; padding-top: 20px;}
.trim .trimXin .trimXinSpan span{ padding-right: 30px;}
.trim .trimDaodu{ display: -webkit-flex; display: -ms-flexbox; -js-display: flex; display: flex; height: 100px; margin-top: 30px; background: #f5f5f5;}
.trim .trimDaodu .trimDaoduTit{ background: #B81C22; color: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 120px; font-family: '宋体'; font-weight: bold; font-size: 40px;}
.trim .trimDaodu .trimDaoduCont{ -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1 1; display: flex; align-items: center; justify-content: center; padding: 0 20px; color: #555; line-height: 30px;}
.trim .trimDaodu .trimDaoduCont figure{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}


/* 东箭品牌 */
.multiple{ display: flex; flex-direction: column; padding: 50px 0;}
.multiple .inner1440{width: 1440px; margin: 0 auto;}
.multiple .inner1440 .xingming{ display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 36px; padding-bottom: 40px;}
.regard{ background: url(../images/regard.png) center bottom no-repeat; padding: 80px 0 100px;}
.regard .regardLayer{ display: flex; flex-direction: row; position: relative; justify-content: space-between;}
.regard .regardLayer .regardLayerLeft{ display: flex; flex-direction: column;}
.regard .regardLayer .regardLayerLeft img{ display: block; width: 720px; height: 720px; object-fit: cover;}
.regard .regardLayer .regardLayerRight{ display: flex; flex-direction: column; justify-content: space-between; width: 45%;}
.regard .regardLayer .regardLayerRight figure{ display: flex; flex-direction: column;}
.regard .regardLayer .regardLayerRight figure h2{ font-size: 20px; text-transform: uppercase;}
.regard .regardLayer .regardLayerRight figure h2 span{ font-weight: bold;}
.regard .regardLayer .regardLayerRight figure h3{ color: #B81C22; font-size: 22px;}
.regard .regardLayer .regardLayerRight figcaption{ display: flex; flex-direction: column;}
.regard .regardLayer .regardLayerRight figcaption p{ line-height: 30px; margin-top: 30px;}
.regard .regardLayer .regardLayerZhong{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 820px; height: 220px; position: absolute; top: 80px; right: 0; z-index: 2; border-radius: 10px; background: #B81C22;}
.regard .regardLayer .regardLayerZhong img{ width: 600px; display: block;}

.courseCeng{ display: flex; flex-direction: column; position: relative;}
.courseCeng .swiper-container{ width: 100%; height: 100%;}
.courseCeng .swiper-slide .courseCengData{ display: flex; flex-direction: column; position: relative; font-family: 'IMPACT'; font-size: 32px;}
.courseCeng .swiper-slide .courseCengData:after{ content: ''; position: absolute; width: 75%; height: 2px; background: #eee; top: 50%; margin-top: -1px; right: 0;}
.courseCeng .swiper-slide .courseCengOl{ display: flex; flex-direction: column; max-height: 600px; overflow-y: auto;}
.courseCeng .swiper-slide .courseCengOl .courseCengOlDiv{ display: flex; flex-direction: column; margin-top: 40px;}
.courseCeng .swiper-slide .courseCengOl .courseCengOlDiv .courseCengOlDivTime{ background: #B81C22; color: #fff; width: 80px; height: 40px; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.courseCeng .swiper-slide .courseCengOl .courseCengOlDiv .courseCengOlDivTent{ display: flex; flex-direction: column; margin-top: 20px; color: #555; line-height: 30px;}
.courseCeng .swiper-slide .courseCengOl .courseCengOlDiv .courseCengOlDivPic{ display: flex; flex-direction: column; overflow: hidden; margin-top: 20px;}
.courseCeng .swiper-slide .courseCengOl .courseCengOlDiv .courseCengOlDivPic img{ display: block; width: 100%;}
.courseCeng .swiper-slide .courseCengOl::-webkit-scrollbar-track-piece{background-color:none; -webkit-border-radius:0;}
.courseCeng .swiper-slide .courseCengOl::-webkit-scrollbar{ width:3px; height:10px;}
.courseCeng .swiper-slide .courseCengOl::-webkit-scrollbar-thumb:vertical{ height:50px;background-color:#222;-webkit-border-radius:0;outline:0;outline-offset:0;border:0;}
.courseCeng .swiper-slide .courseCengOl::-webkit-scrollbar-thumb:hover{ height:50px;background-color:#222;-webkit-border-radius:0;}
.courseCeng .swiper-slide .courseCengOl::-webkit-scrollbar-thumb:horizontal{width:5px;background-color:#222;-webkit-border-radius:0;}
.courseCeng .swiper-slide .courseCengOl::-webkit-scrollbar{　width:3px;}
.courseCeng .swiper-container .swiper-pagination{ display: none;}
.courseCeng .swiper-button-next,.courseCeng .swiper-button-prev{ display: flex; flex-direction: column; justify-content: center; align-items: center; background: #f5f5f5; border-radius: 50%; width: 50px; height: 50px; position: absolute; top: 20px; color: #000;}
.courseCeng .swiper-button-next{ right: -90px;}
.courseCeng .swiper-button-prev{ left: -90px;}
.courseCeng .swiper-button-next:after,.courseCeng .swiper-button-prev:after{ font-size: 20px; font-weight: bold;}

.culture{ background: #f5f5f5;}
.culture .cultureWen{ display: flex; flex-direction: row; justify-content: space-between;}
.culture .cultureWen .cultureWenList{ width: 24%; display: flex; flex-direction: column; justify-content: space-between; background: #fff;}
.culture .cultureWen .cultureWenList .cultureWenListCont{ padding: 25px; display: flex; flex-direction: column;}
.culture .cultureWen .cultureWenList .cultureWenListCont h2{ font-size: 28px;}
.culture .cultureWen .cultureWenList .cultureWenListCont p{ margin-top: 10px; font-size: 16px; line-height: 30px;}
.culture .cultureWen .cultureWenList .cultureWenListPic{ display: flex; flex-direction: column;}
.culture .cultureWen .cultureWenList .cultureWenListPic img{ width: 100%;}

.share{ overflow: hidden;}
.share .swiper-container{ display: flex; flex-direction: column; height: 100%; padding-bottom: 40px;}
.share .swiper-container .swiper-slide{ background: #fff; border-radius: 4px; display: flex; flex-direction: column; justify-content: center; align-items: center; margin: auto;}
.share .swiper-container .swiper-slide .sharePic{ width: 100%; overflow: hidden; display: flex; flex-direction: column;}
.share .swiper-container .swiper-slide .sharePic img{ width:100%; border-top-left-radius: 4px; border-top-right-radius: 4px;transition: 0.5s; cursor: pointer;}
.share .swiper-container .swiper-slide:hover .sharePic img{ -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -ms-transform:scale(1.1); -o-transform:scale(1.1); transform:scale(1.1);}
.share .swiper-container .swiper-slide .shareTent{ display: flex; flex-direction: column; margin-top: 20px; font-size: 16px;}
.share .swiper-container .swiper-pagination-bullets{ bottom: 0;}
.share .swiper-container .swiper-pagination-bullets .swiper-pagination-bullet{ width: 16px; height: 16px; background: #B81C22; border-radius: 50%;}
.share .swiper-container .swiper-button-next,.share .swiper-container .swiper-button-prev{ display: none;}

/* 董事长致辞 */
.speech{ display: flex; flex-direction: column; padding: 60px 0; background: url(../images/speech.png) right 100px no-repeat #f5f5f5;}
.speech .inner1440{width: 1440px; margin: 0 auto; display: flex; flex-direction: column;}
.speech .inner1440 .speechTop{ display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
.speech .inner1440 .speechTop .speechTopLeft{ width: 50%; display: flex; flex-direction: column; justify-content: space-between;}
.speech .inner1440 .speechTop .speechTopLeft figure{ display: flex; flex-direction: column;}
.speech .inner1440 .speechTop .speechTopLeft figure h2{ font-size: 40px; font-weight: bold; opacity: 0.1; text-transform: uppercase;}
.speech .inner1440 .speechTop .speechTopLeft figure h3{ font-weight: bold; font-size: 34px;}
.speech .inner1440 .speechTop .speechTopLeft figcaption{ display: flex; flex-direction: column;}
.speech .inner1440 .speechTop .speechTopLeft figcaption p{ line-height: 40px; font-size: 16px; margin-top: 30px;}
.speech .inner1440 .speechTop .speechTopRight{ width: 45%; display: flex; flex-direction: column;}
.speech .inner1440 .speechTop .speechTopRight img{ width: 100%; height: 650px; object-fit: cover;}
.speech .inner1440 .speechBottom{ display: flex; flex-direction: row; justify-content: space-between; margin-top: 60px; display: -webkit-flex; display: -ms-flexbox; -js-display: flex; display: flex;}
.speech .inner1440 .speechBottom .speechBottomLeft{ display: flex; flex-direction: column; justify-content: center; align-items: center; background: url(../images/speechBottomLeft.png) center center no-repeat #B81C22; border-radius: 6px; width: 340px; height: 340px;}
.speech .inner1440 .speechBottom .speechBottomLeft h2{ color: #fff; font-size: 22px; display: flex; flex-direction: column;}
.speech .inner1440 .speechBottom .speechBottomLeft p{ font-size: 30px; line-height: 50px; color: #fff; margin-top: 20px;}
.speech .inner1440 .speechBottom .speechBottomRight{ -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1 1; display: flex; margin-left: 40px; background: url(../images/speechBottomRight.png) 30px 30px no-repeat #fff; border-radius: 6px;}
.speech .inner1440 .speechBottom .speechBottomRight figure{ display: flex; flex-direction: column; padding: 0 50px 0 130px; justify-content: center;}
.speech .inner1440 .speechBottom .speechBottomRight figure h2{ color: #B81C22; font-size: 22px; padding-bottom: 20px;}
.speech .inner1440 .speechBottom .speechBottomRight figure p{ font-size: 16px; color: #555; line-height: 40px;}

/* 联系我们 */
.contact{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.contact .contactList{ width: 320px; background: #f5f5f5; padding: 30px 40px; margin-top: 20px; cursor: pointer; transition: all 300ms;}
.contact .contactList .contactListPic{ display: flex; flex-direction: column; width:45px; height: 40px; justify-content: center; align-items: center; transition: all 300ms;}
.contact .contactList:nth-child(1) .contactListPic{ background: url(../images/contactListPic11.png) 4px center no-repeat;}
.contact .contactList:nth-child(2) .contactListPic{ background: url(../images/contactListPic22.png) 2px center no-repeat;}
.contact .contactList:nth-child(3) .contactListPic{ background: url(../images/contactListPic33.png) 0 center no-repeat;}
.contact .contactList:nth-child(4) .contactListPic{ background: url(../images/contactListPic44.png) 4px center no-repeat;}
.contact .contactList:nth-child(5) .contactListPic{ background: url(../images/contactListPic55.png) 0 center no-repeat;}
.contact .contactList:nth-child(6) .contactListPic{ background: url(../images/contactListPic66.png) 3px center no-repeat;}
.contact .contactList .contactListCont{ display: flex; flex-direction: column; position: relative; margin-top: 20px; line-height: 34px;}
.contact .contactList .contactListCont h2{ color: #666; padding-bottom: 10px; transition: all 300ms;}
.contact .contactList .contactListCont h3{ font-size: 26px; font-family: 'IMPACT'; transition: all 300ms;}
.contact .contactList .contactListCont figure{ display: flex; flex-direction: row; transition: all 300ms;}
.contact .contactList .contactListCont figure a{ display: block; width: 130px; height: 40px; line-height: 40px; text-align: center; border: 1px solid #aaa; color: #666; border-radius: 3px; margin-right: 20px;}
.contact .contactList .contactListCont img{ display: block; position: absolute; right: 0; bottom: 0; width: 140px; height: 140px;}
.contact .contactList:hover{ background: #B81C22;}
.contact .contactList:hover:nth-child(1) .contactListPic{ background-position: -50px center;}
.contact .contactList:hover:nth-child(2) .contactListPic{ background-position: -48px center;}
.contact .contactList:hover:nth-child(3) .contactListPic{ background-position: -45px center;}
.contact .contactList:hover:nth-child(4) .contactListPic{ background-position: -50px center;}
.contact .contactList:hover:nth-child(5) .contactListPic{ background-position: -45px center;}
.contact .contactList:hover:nth-child(6) .contactListPic{ background-position: -50px center;}
.contact .contactList:hover .contactListCont h2,.contact .contactList:hover .contactListCont h3{ color: #fff;}
.contact .contactList:hover .contactListCont figure a{ border-color: #fff; color: #fff;}

.online{ display: flex; flex-direction: column; margin-top: 40px;}
.online .onlineTit{ position: relative; display: flex; flex-direction: column; text-align: center; font-size: 40px;}
.online .onlineTit:after{ content: ''; width: 35px; height: 5px; background: #f5f5f5; margin: 15px auto 0;}
.online .onlineCont{ display: flex; flex-direction: column;}
.online .onlineCont .onlineContTent{ display: flex; flex-direction: row; justify-content: space-between; margin-top: 40px;}
.online .onlineCont .onlineContTent .onlineContTentDiv{ width: 580px; display: flex; flex-direction: column;}
.online .onlineCont .onlineContTent .onlineContTentDiv .onlineContTentDivTxt{ display: flex; flex-direction: column; padding-bottom: 15px; font-size: 16px;}
.online .onlineCont .onlineContTent .onlineContTentDiv .onlineContTentDivKuang{ border: 1px solid #eee; line-height: 40px; padding: 15px; border-radius: 3px; background: #f5f5f5; position: relative; display: -webkit-flex; display: -ms-flexbox; -js-display: flex; display: flex; align-items: center;}
.online .onlineCont .onlineContTent .onlineContTentDiv .onlineContTentDivKuang .onlineContTentDivKuangPic{ width: 40px; height: 40px; display: flex; margin-right: 20px; flex-direction: column; justify-content: center; align-items: center;}
.online .onlineCont .onlineContTent .onlineContTentDiv .onlineContTentDivKuang .onlineContTentDivKuangInput{ display: flex; flex-direction: column; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1 1; display: flex;}
.online .onlineCont .onlineContTent .onlineContTentDiv .onlineContTentDivKuang .onlineContTentDivKuangInput .text{ width: 100%; height: 40px; background: none;}
.online .onlineCont .onlineContTent .onlineContTentDiv .onlineContTentDivKuang .onlineContTentDivKuangInput .textarea{ width: 100%; height: 120px;}
.online .onlineCont .onlineContTent .onlineContTentDiv .onlineContTentDivKuang .onlineContTentDivKuangInput img{ display: flex; width: 150px; height: 70px; position: absolute; top: 0; right: 0; bottom: 0;}
.online .onlineCont .onlineContTent .onlineContTentDiv .onlineContTentDivKuang .onlineContTentDivKuangInput .sub{ width: 100%; height: 70px; background: #B81C22; color: #fff; font-size: 22px; font-weight: bold; cursor: pointer; border-radius: 3px;}
.online .onlineCont .onlineContTent .onlineContTentDiv .onlineContTentDivKuang .onlineContTentDivKuangInput .sub:active{ background: #E62129;}

/* 搜索页面 */
.adapt{ padding: 50px 0;}
.ferret{ display: flex; background: #fff; border-radius: 35px; box-shadow: 0 0 15px 0 rgba(0,0,0,0.1); height: 70px; display: flex; flex-direction: row; justify-content: space-between;}
.ferret .ferretLeft{ width: 80%; padding: 0 30px; display: flex; flex-direction: column;}
.ferret .ferretLeft .text{ width: 100%; height: 70px; background: none;}
.ferret .ferretRight{ display: flex; flex-direction: column; padding-right: 20px;}
.ferret .ferretRight .sub{ width: 70px; height: 70px; background: url(../images/sousuo.png) center center no-repeat; border: none; cursor: pointer;}

.haveto{ display: flex; flex-direction: row; align-items: center; justify-content: center; font-size: 22px; padding: 50px 0;}
.haveto span{ color: #B81C22; padding: 0 4px;}
.haveto sup{ padding: 0 4px;}

.flexible{ display: flex; flex-direction: row; justify-content: space-around;}
.flexible .flexibleDiv{ flex: 1; position: relative; font-size: 22px; text-align: center;}
.flexible .flexibleDiv.on{ color: #B81C22;}


.fenye{ display: flex; align-items: center; justify-content: center; margin: 50px 0;}
.fenye a{ width: 40px;height: 40px;background-color: #ffffff; color: #666666; font-size: 14px;border: solid 1px #e0e0e0; display: block; line-height: 40px; text-align: center; box-sizing: content-box; border-radius: 100%; margin:  0 6px; transition: all 0.36s;}
.fenye .prevye,.fenye  .nextye{ width: 77px;height: 40px; line-height: 40px; text-align: center; box-sizing: content-box;background-color: #ffffff;border-radius: 20px;border: solid 1px #e0e0e0;}
.fenye a.on,.fenye a:hover{ background-color: #E62129; color: #fff;}



/* 领包即住 */
.subject .insidePic img{ height: 780px;}
.collar{ display: flex; flex-direction: column; padding: 50px 0;}
.collar.outline11{ background: url(../images/outline11.jpg) center center no-repeat; background-size: cover;}
.collar.outline22{ background: url(../images/outline22.jpg) center center no-repeat; background-size: cover;}
.collar.outline33{ background: url(../images/outline33.jpg) center center no-repeat; background-size: cover;}
.collar.outline44{ background: url(../images/outline44.jpg) center center no-repeat; background-size: cover;}
.collar.outline55{ background: url(../images/outline55.jpg) center center no-repeat; background-size: cover;}
.collar .collarTitle{ display: flex; flex-direction: column; padding-bottom: 50px;}
.collar .collarBage{ width: 1440px; margin: 0 auto; display: flex; flex-direction: column;}
.collar .collarBage img{ display: block; width: 100%;}

.master{ display: flex; flex-direction: column; position: relative;}
.master .swiper-container{ width: 100%; height: 100%; padding-bottom: 66px;}
.master .swiper-container .swiper-wrapper{ transition: 2s cubic-bezier(0.68, -0.4, 0.27, 1.34) 0.2s;}
.master .swiper-container .swiper-wrapper .masterPic{ display: flex; flex-direction: column; padding: 50px; background: #fff;}
.master .swiper-container .swiper-wrapper .masterPic img{ display: block; width: 100%; height: 560px; object-fit: cover;}
.master .swiper-container .swiper-button-next,.master .swiper-container .swiper-button-prev{ bottom: 0; top: auto; height: 66px; width: 620px; background: rgba(255,255,255,0.3);}
.master .swiper-container .swiper-button-next{ right: 0;}
.master .swiper-container .swiper-button-prev{ left: 0;}
.master .swiper-container .swiper-button-next:after,.master .swiper-container .swiper-button-prev:after{ color: #fff; font-size: 30px;}
.master .swiper-container .swiper-button-next:active,.master .swiper-container .swiper-button-prev:active{ background: #C7A26D;}

.team{ display: flex; flex-direction: row; justify-content: space-between; padding-bottom: 50px;}
.team .teamList{ width: 380px; justify-content: space-between; display: flex; flex-direction: column; cursor: pointer;}
.team .teamList .teamListWoed{ display: flex; flex-direction: column; padding-bottom: 20px;}
.team .teamList .teamListWoed h2{ font-size: 30px; font-family: '宋体'; font-weight: bold; padding-bottom: 10px;}
.team .teamList .teamListWoed p{ font-size: 16px; line-height: 30px;}
.team .teamList .teamListPic{ display: flex; flex-direction: column;}
.team .teamList .teamListPic img{ transition: all 300ms;}
.team .teamList:hover .teamListPic img{ border-top-left-radius: 40px; border-bottom-right-radius: 40px;}

.tong{ display: flex; flex-direction: row; justify-content: space-between;}
.tong .tongList{ width: 540px; position: relative; padding-left: 40px; display: flex; flex-direction: column;}
.tong .tongList:after{ content: ''; position: absolute; width: 500px; background: #C7A26D; z-index: 0; left: 0; bottom: 0; height: 85%;}
.tong .tongList .tongListPic{ display: flex; flex-direction: column; position: relative; z-index: 1; transition: all 300ms; border: 5px solid #fff;}
.tong .tongList .tongListWord{ display: flex; flex-direction: column; width: 420px; padding: 20px 0 40px; position: relative; z-index: 1;}
.tong .tongList .tongListWord h2{ position: relative; display: flex; flex-direction: column; color: #fff; font-size: 24px; padding-left: 20px; font-weight: bold;}
.tong .tongList .tongListWord h2:before{ content: ''; position: absolute; left: 0; width: 8px; height: 18px; background: #fff; top: 50%; margin-top: -9px;}
.tong .tongList .tongListWord p{ font-size: 15px; line-height: 2; color: #fff; margin-top: 10px;}
.tong .tongList:hover .tongListPic{ box-shadow: 0 0 20px 0 rgba(0,0,0,0.3);}

.feature{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; background: url(../images/feature.png) no-repeat; height: 500px;}
.feature .featureList{ display: flex; flex-direction: column; justify-content: space-around; padding: 0 90px;}
.feature .featureList h2{ font-size: 34px; font-weight: bold; color: #C7A26D;}
.feature .featureList p{ font-size: 20px; line-height: 2; padding: 10px 0;}
.feature .featureList figure{ display: flex; flex-direction: column;}
.feature .featureList figure img{ border-radius: 30px; transition: all 300ms;}
.feature .featureList:hover figure img{ border-radius: 0;}

.ensure{overflow:hidden;display: -webkit-box; display: -webkit-flex; display: -ms-flexbox;-js-display: flex; display: flex;}
.ensure .ensureLeft{-webkit-box-flex:1;-webkit-flex:1; -ms-flex:1; flex:1 1; overflow:hidden; padding-right: 40px; display: flex; flex-direction: column; justify-content: space-between;}
.ensure .ensureLeft .ensureLeftDou{}
.ensure .ensureLeft .ensureLeftWord{ display: flex; flex-direction: column;}
.ensure .ensureLeft .ensureLeftWord figure{ display: flex; flex-direction: column; margin-top: 40px;}
.ensure .ensureLeft .ensureLeftWord figure h2{ font-size: 30px; font-weight: bold; color: #fff;}
.ensure .ensureLeft .ensureLeftWord figure p{ color: #fff; font-size: 16px; line-height: 2;}
.ensure .ensureRight{ display: flex; flex-direction: column; border: 10px solid #fff;}


/* 鲁班工艺 */
.devise{ display: flex; flex-direction: column; align-items: flex-end; position: absolute; width: 1240px; left: 50%; margin-left: -620px; top: 50%; margin-top: -260px; z-index: 10;}
.devise .deviseCont{ position: relative; display: flex; flex-direction: column; background: rgba(0,0,0,0.2); border: 10px solid rgba(255,255,255,0.1); width: 370px; height: 500px; padding: 0 30px; justify-content: center;}
.devise .deviseCont:before{ content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: rgba(255,255,255,0.1); z-index: -1;}
.devise .deviseCont .deviseContTit{ display: flex; flex-direction: column; text-align: center; padding-bottom: 20px;}
.devise .deviseCont .deviseContTit h2{ font-size: 30px; font-weight: bold; letter-spacing: 2px; color: #fff;}
.devise .deviseCont .deviseContTit figure{ color: #fff; font-size: 16px;}
.devise .deviseCont .deviseContTit figure span{ padding: 0 4px; color: #C7A26D;}
.devise .deviseCont .deviseContKuang{ display: flex; flex-direction: row; justify-content: space-between; margin-top: 20px;}
.devise .deviseCont .deviseContKuang .deviseContKuangInput{ display: flex; flex-direction: column; width: 160px; padding: 0 10px; background: #fff; border-radius: 3px;}
.devise .deviseCont .deviseContKuang .deviseContKuangInput .text{ width: 100%; height: 50px; line-height: 50px; background: none;}
.devise .deviseCont .deviseContLan{ display: flex; flex-direction: column; margin-top: 20px;}
.devise .deviseCont .deviseContLan .deviseContLanInput{ display: flex; flex-direction: column; padding: 0 10px; background: #fff; border-radius: 3px;}
.devise .deviseCont .deviseContLan .deviseContLanInput .text{ width: 100%; height: 50px; line-height: 50px; background: none;}
.devise .deviseCont .deviseContLan .deviseContLanInput .sub{ cursor: pointer; width: 100%; height: 50px; line-height: 50px; background: #B81C22; border-radius: 3px; color: #fff; font-size: 18px}
.devise .deviseCont .deviseContLan .deviseContLanInput .sub:active{ background: #E62129;}
.devise .deviseCont .deviseContWord{ color: #999; padding-left: 24px; background: url(../images/deviseContWord.png) left center no-repeat; margin-top: 15px;}

.mission{ display: flex; flex-direction: column; padding: 40px 0; background: url(../images/mission.jpg) center bottom no-repeat;}
.mission .missionTitle{ display: flex; flex-direction: column;}
.mission .missionLayer{ display: flex; flex-direction: column; margin-top: 40px;}
.mission .missionLayer ol{ display: flex; flex-direction: row; justify-content: space-between;}
.mission .missionLayer ol li{ display: flex; flex-direction: column; position: relative;}
.mission .missionLayer ol li .missionLayerPic{ display: flex; flex-direction: ;}
.mission .missionLayer ol li .missionLayerCont{ position: absolute; width: 300px; left: 50%; margin-left: -150px; bottom: 0; z-index: 1; display: flex; text-align: center; justify-content: center; align-items: center; height: 160px; color: #fff; font-weight: bold; font-size: 22px;}

.bigbox{ display: flex; flex-direction: column;}
.bigbox .bigboxTitle{ display: flex; padding-bottom: 40px;}
.bigbox .bigboxTitle img{ display: block;}
.flows{ display: flex; flex-direction: column; position: relative; height: 1400px; background: url(../images/bigbox-flows.jpg) top center no-repeat;}
.flows .inner{ position: relative;}
.flows .inner .flowsWord{ width: 100%; position: absolute; top: 520px; left: 0; right: 0; height: 820px;}
.flows .inner .flowsWord li{ display: flex; flex-direction: column; position: absolute; justify-content: center; align-items: center;}
.flows .inner .flowsWord li.flowsWord11{ width: 350px; left: 540px; height: 300px; top:0}
.flows .inner .flowsWord li.flowsWord22{ width: 230px; left: 40px; height: 220px; top:300px;}
.flows .inner .flowsWord li.flowsWord33{ width: 310px; right: 0; height: 220px; top:300px}
.flows .inner .flowsWord li.flowsWord44{ width: 230px; left: 350px; height: 300px; bottom:0}
.flows .inner .flowsWord li h2{ font-size: 26px; font-weight: bold;}
.flows .inner .flowsWord li h2 span{ color: #B81C22;}
.flows .inner .flowsWord li figure{ line-height: 2; font-size: 15px;}
.flows .inner .flowsWord li h3{ font-size: 26px; font-weight: bold; color: #fff; text-align: center;}

.water{ display: flex; flex-direction: column; padding: 60px 0; position: relative; background: url(../images/bigbox-water.jpg) center center no-repeat; background-size: cover;}
.water .waterOl{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.water .waterOl .waterOlList{ width: 520px; padding: 30px 40px; line-height: 40px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid #C7A26D; border-radius: 10px; margin-top: 25px;}
.water .waterOl .waterOlList h2{ color: #C7A26D; font-weight: bold; font-size: 24px; line-height: 40px;}
.water .waterOl .waterOlList figure{ color: #fff; font-size: 19px;}

.water .craft{ display: flex; flex-direction: row; justify-content: space-between; margin-top: 50px;}
.water .craft .craftCont{ width: 290px; display: flex; flex-direction: column; position: relative;}
.water .craft .craftCont .craftContPic{ display: flex; flex-direction: column;}
.water .craft .craftCont .craftContPic img{ width: 290px; height: 240px; object-fit: cover; transition: all 300ms;}
.water .craft .craftCont .craftContNum{ display: flex; position: absolute; right: 0; bottom: 0; z-index: 1;}
.water .craft .craftCont .craftContNum:after{ content: '';width: 0; position: absolute; right: 0; bottom: 0; border-bottom: 60px solid rgba(184,28,34,0.7); border-left: 60px solid transparent;}
.water .craft .craftCont .craftContNum span{ font-size: 26px; color: #fff; font-weight: bold; opacity: 0.5; position: relative; z-index: 1;}
.water .craft .craftCont:hover .craftContPic img{ -webkit-transform:scale(1.06); -moz-transform:scale(1.06); -ms-transform:scale(1.06); -o-transform:scale(1.06); transform:scale(1.06);}

.tiles{ display: flex; flex-direction: column; background: #fff; padding: 50px 0;}
.tiles .tilesCeng{ display: flex; flex-direction: column; position:relative; overflow: hidden;}
.tiles .tilesCeng .liest{ display: flex; flex-direction: row; justify-content: space-between;}
.tiles .tilesCeng .liest li{ display: flex; flex-direction: column; width: 200px; background: #3d3d3d;}
.tiles .tilesCeng .liest li a{ display: flex; align-items: center; justify-content: center; color: #fff; font-size: 22px; height: 70px;}
.tiles .tilesCeng .liest li.on{ background: #B81C22;}
.tiles .tilesCeng .liest li.on a{ font-weight: bold;}
.tiles .tilesCeng .dimian{ overflow:hidden;}
.tiles .tilesCeng .dimian .tilesCengBox{ display: none; margin-top: 40px;}
.tiles .tilesCeng .dimian .tilesCengBox.on{ display: block;}
.tilesCengBox .tilesCengBoxTop{ display: flex; flex-direction: column;}
.tilesCengBox .tilesCengBoxTop h2{ font-size: 22px; font-weight: bold; line-height: 25px; position: relative; padding-left: 20px; margin-bottom: 20px;}
.tilesCengBox .tilesCengBoxTop h2:before{ content: ''; position: absolute; left: 0; top:0; bottom: 0; width: 5px; background: #B81C22;}
.tilesCengBox .tilesCengBoxTop figure{ display: flex; flex-direction: column; background: #f5f5f5; border-radius: 4px; padding: 15px 30px; line-height: 40px; font-size: 16px;}
.tilesCengBox .tilesCengBoxBottom{ display: flex; flex-wrap: wrap; margin-top: 40px;}
.tilesCengBox .tilesCengBoxBottom .tilesCengBoxBottomTent,.tilesCengBox .tilesCengBoxBottom .tilesCengBoxBottomTact{ width: calc(100%/3); display: flex; flex-direction: column; overflow: hidden;}
.tilesCengBox .tilesCengBoxBottom .tilesCengBoxBottomTact img{ display: block; transition: all 300ms;}
.tilesCengBox .tilesCengBoxBottom .tilesCengBoxBottomTact:hover img{ -webkit-transform:scale(1.06); -moz-transform:scale(1.06); -ms-transform:scale(1.06); -o-transform:scale(1.06); transform:scale(1.06);}
.tilesCengBox .tilesCengBoxBottom .tilesCengBoxBottomTent{ background: #B81C22; align-items: center; justify-content: center;}
.tilesCengBox .tilesCengBoxBottom .tilesCengBoxBottomTent span{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100px; height: 100px; border-radius: 50%; border: 1px solid #fff;}
.tilesCengBox .tilesCengBoxBottom .tilesCengBoxBottomTent h3{ font-size: 24px; color: #fff; font-weight: bold; padding: 20px 0 0;}
.tilesCengBox .tilesCengBoxBottom .tilesCengBoxBottomTent p{ font-size: 18px; font-family: arial; color: #fff;}

.tree{ display: flex; flex-direction: column; background: url(../images/bigbox-tree.jpg); padding: 50px 0;}
.tree .treeBox{ display: flex; flex-direction: row; position:relative; overflow: hidden; justify-content: space-between; min-width: 1240px;}
.tree .treeBox .liest{ display: flex; flex-direction: column; width: 50%;}
.tree .treeBox .liest ol{ width: 420px; padding: 0 100px; background: #212121; display: flex; flex-direction: column; height: 100%; justify-content: center; height: 620px;}
.tree .treeBox .liest ol li{ display: flex; flex-direction: column; background: rgba(255,255,255,0.2); cursor: pointer; height: 90px; margin-top: 35px; justify-content: center; padding-left: 110px; font-size: 20px; color: #fff; position: relative;}
.tree .treeBox .liest ol li:nth-child(1){ margin-top: 0;}
.tree .treeBox .liest ol li b,.tree .treeBox .liest ol li i{ display: block; width: 8px; height: 8px; position: absolute; top: 50%; margin-top: -4px;}
.tree .treeBox .liest ol li b{ background: #B81C22; left:35px;}
.tree .treeBox .liest ol li i{ background: #FFFFFF; left:55px;}
.tree .treeBox .liest ol li.on{ background: #B81C22;}
.tree .treeBox .liest ol li.on b{ background: #aaa;}
.tree .treeBox .dimian{ overflow:hidden; display: flex; flex-direction: column; width: 50%;}
.tree .treeBox .dimian .tilesCengBox{ display: none; width: 100%; flex-direction: column;}
.tree .treeBox .dimian .tilesCengBox.on{ display: block;}
.tree .treeBox .dimian .tilesCengBox img{ width: 100%; height: 620px; object-fit: cover;}

.oiler{ display: flex; flex-direction: column; background: url(../images/bigbox-oiler.jpg); padding: 50px 0;}
.oiler .oilerCeng{ display: flex; flex-direction: row; justify-content: space-between;}
.oiler .oilerCeng .oilerCengList{ width: 290px; position: relative; transition: all 300ms; display: flex; flex-direction: column;}
.oiler .oilerCeng .oilerCengList:nth-child(2n+1){ margin-top: 40px;}
.oiler .oilerCeng .oilerCengList:nth-child(2n){ margin-top: 10px;}
.oiler .oilerCeng .oilerCengList .oilerCengListPic{ display: flex; flex-direction: column;}
.oiler .oilerCeng .oilerCengList .oilerCengListIcon{ display: flex; flex-direction: column; justify-content: center; align-items: center; position: absolute; left: -10px; top: -30px; width: 100px; height: 100px; background: url(../images/oiler.png) no-repeat; color: #FFFFFF; font-size: 24px; line-height: 30px; font-weight: bold;}
.oiler .oilerCeng .oilerCengList .oilerCengListCont{ display: flex; flex-direction: column;}
.oiler .oilerCeng .oilerCengList:nth-child(1) .oilerCengListCont{ background: #845B3B;}
.oiler .oilerCeng .oilerCengList:nth-child(2) .oilerCengListCont{ background: #C43D2A;}
.oiler .oilerCeng .oilerCengList:nth-child(3) .oilerCengListCont{ background: #383838;}
.oiler .oilerCeng .oilerCengList:nth-child(4) .oilerCengListCont{ background: #BE9E89;}
.oiler .oilerCeng .oilerCengList .oilerCengListCont figure{ display: flex; flex-direction: column; padding: 0 20px; text-align: center; height: 200px; color: #fff; font-size: 30px; line-height: 40px; align-items: center; justify-content: center; background: url(../images/oilerli.png) no-repeat;}
.oiler .oilerCeng .oilerCengList:nth-child(2n+1):hover{ margin-top: 30px;}
.oiler .oilerCeng .oilerCengList:nth-child(2n):hover{ margin-top: 0;}

.check{ display: flex; flex-direction: column; background: url(../images/bigbox-check.jpg); padding: 50px 0; background-size: cover;}
.check .checkBox{ display: flex; flex-direction: column;}

.possess{ display: flex; flex-direction: column;}
.possess img{ display: block; width: 100%; height: 600px; object-fit: cover;}

.giftbag{ display: flex; flex-direction: column;}
.giftbag img{ display: block; width: 100%; height: 120px; object-fit: cover;}

/* 别墅大宅 */
.tier{ display: flex; flex-direction: column; background: url(../images/tier.jpg) center center no-repeat; background-size: cover; height: 720px; position: relative; z-index: 10;}
.tier .inner{ display: flex; flex-direction: row; justify-content: space-between; position: relative;}
.tier .tierDigit{ display: flex; flex-wrap: wrap; justify-content: space-around; width: 700px; text-align: center; padding-top: 80px;}
.tier .tierDigit .tierDigitList{ width: 50%; display: flex; flex-direction: column; padding-top: 80px;}
.tier .tierDigit .tierDigitList .tierDigitListDiv{ display: flex; flex-direction: row; line-height: 1; justify-content: center; align-items: center;}
.tier .tierDigit .tierDigitList .tierDigitListDiv span{ font-size: 50px; font-family: 'IMPACT'; color: #B81C22;}
.tier .tierDigit .tierDigitList .tierDigitListDiv sup{ color: #B81C22; font-size: 22px;}
.tier .tierDigit .tierDigitList .tierDigitListCont{ font-size: 18px; line-height: 1.5; padding-top: 12px;}
.tier .ration{ display: flex; flex-direction: column; background: #fff; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); position: absolute; top: -100px; right: 0; width: 460px;}
.tier .ration .rationMing{ display: flex; flex-direction: column; background: #f5f5f5; justify-content: center; align-items: center; height: 100px;}
.tier .ration .rationMing h2{ font-size: 26px;}
.tier .ration .rationMing p{ font-size: 18px; color: #999;}
.tier .ration .rationCont{ padding: 0 20px; display: flex; flex-direction: column;}
.tier .ration .rationCont .rationContKuang{ display: flex; flex-direction: row; justify-content: space-between; margin-top: 20px;}
.tier .ration .rationCont .rationContKuang .rationContKuangInput{ display: flex; flex-direction: column; position: relative; width: 180px; padding: 0 10px; border: 1px solid #eee; border-radius: 3px;}
.tier .ration .rationCont .rationContKuang .rationContKuangInput .text{ width: 100%; height: 50px; line-height: 50px; background: none;}
.tier .ration .rationCont .rationContKuang .rationContKuangInput span{ position: absolute; right: 10px; top: 15px; line-height: 20px;}
.tier .ration .rationCont .rationContLan{ display: flex; flex-direction: column; margin-top: 20px;}
.tier .ration .rationCont .rationContLan .rationContLanInput{ display: flex; flex-direction: column; padding: 0 10px; border: 1px solid #eee; border-radius: 3px;}
.tier .ration .rationCont .rationContLan .rationContLanInput .text{ width: 100%; height: 50px; line-height: 50px; background: none;}
.tier .ration .rationCont .rationContLan .rationContLanInput .sub{ cursor: pointer; width: 100%; height: 50px; line-height: 50px; background: #B81C22; border-radius: 3px; color: #fff; font-size: 18px}
.tier .ration .rationCont .rationContLan .rationContLanInput .sub:active{ background: #E62129;}
.tier .ration .rationCont .rationContWord{ color: #999; padding-left: 24px; background: url(../images/rationContWord.png) left center no-repeat; margin-top: 15px;}
.tier .ration .rationPic{ display: flex; flex-direction: column; padding: 20px;}

.whole{ display: flex; flex-direction: column; padding: 50px 0;}
.whole .inner{ position: relative;}
.whole .wholeMing{ display: flex; flex-direction: column; text-align: center; font-weight: bold; font-size: 44px; line-height: 50px; color: #000; padding-bottom: 50px;}
.sound{ background: url(../images/sound.jpg) center center no-repeat; height: 780px; padding: 0 !important;}
.sound .wholeMing{ position: absolute; top: -100px; left: 0; right: 0; z-index: 20;}
.sound .soundSolo{ display: flex; flex-direction: row; justify-content: space-between; position: relative; padding: 70px 0; height: 640px;}
.sound .soundSolo .soundSoloPic{ display: flex; flex-direction: column; width: 670px; position: absolute; left: 50%; margin-left: -335px; top: 50%; margin-top: -285px;}
.sound .soundSolo .soundSoloLeft{ display: flex; flex-direction: column; justify-content: space-between; width: 380px;}
.sound .soundSolo .soundSoloLeft .soundSoloDiv{ display: flex; flex-direction: row; color: #fff; align-items: center; line-height: 20px;}
.sound .soundSolo .soundSoloLeft .soundSoloDiv span,.sound .soundSolo .soundSoloLeft .soundSoloDiv sup{ font-size: 16px;}
.sound .soundSolo .soundSoloLeft .soundSoloDiv b{ padding: 0 4px;}
.sound .soundSolo .soundSoloLeft .soundSoloDiv:nth-child(1),.sound .soundSolo .soundSoloLeft .soundSoloDiv:nth-child(8){ margin-left: 250px;}
.sound .soundSolo .soundSoloLeft .soundSoloDiv:nth-child(2),.sound .soundSolo .soundSoloLeft .soundSoloDiv:nth-child(7){ margin-left: 170px;}
.sound .soundSolo .soundSoloLeft .soundSoloDiv:nth-child(3),.sound .soundSolo .soundSoloLeft .soundSoloDiv:nth-child(6){ margin-left: 100px;}
.sound .soundSolo .soundSoloLeft .soundSoloDiv:nth-child(4),.sound .soundSolo .soundSoloLeft .soundSoloDiv:nth-child(5){ margin-left: 50px;}
.sound .soundSolo .soundSoloPic{ display: flex; flex-direction: column; width: 670px; position: absolute; left: 50%; margin-left: -335px; top: 50%; margin-top: -285px;}
.sound .soundSolo .soundSoloRight{ display: flex; flex-direction: column; justify-content: space-between; width: 380px;}
.sound .soundSolo .soundSoloRight .soundSoloDiv{ display: flex; flex-direction: row; align-items: center; justify-content: flex-end; line-height: 20px;}
.sound .soundSolo .soundSoloRight .soundSoloDiv span,.sound .soundSolo .soundSoloLeft .soundSoloDiv sup{ font-size: 16px;}
.sound .soundSolo .soundSoloRight .soundSoloDiv sup{ color: #666;}
.sound .soundSolo .soundSoloRight .soundSoloDiv span{ color: #B81C22;}
.sound .soundSolo .soundSoloRight .soundSoloDiv b{ padding: 0 4px;}
.sound .soundSolo .soundSoloRight .soundSoloDiv:nth-child(1),.sound .soundSolo .soundSoloRight .soundSoloDiv:nth-child(7){ margin-right: 170px;}
.sound .soundSolo .soundSoloRight .soundSoloDiv:nth-child(2),.sound .soundSolo .soundSoloRight .soundSoloDiv:nth-child(6){ margin-right: 110px;}
.sound .soundSolo .soundSoloRight .soundSoloDiv:nth-child(3),.sound .soundSolo .soundSoloRight .soundSoloDiv:nth-child(5){ margin-right: 50px;}

.group{ background: url(../images/group.jpg) no-repeat;}
.group .groupCeng{ display: flex; flex-direction: column;}
.group .groupCeng .groupCengPic{ display: flex; flex-direction: column;}
.group .groupCeng .groupCengCont{ display: flex; flex-direction: row; justify-content: space-around; padding: 20px 230px 0 0;}
.group .groupCeng .groupCengCont figure{ display: flex; flex-direction: column; font-size: 18px; line-height: 1.5; text-align: center;}
.group .iwant{ display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 40px;}
.group .iwant a{ display: flex; flex-direction: row; width: 300px; height: 60px; background: #B81C22; border-radius: 4px; justify-content: center; align-items: center;}
.group .iwant a span{ font-size: 24px; color: #fff; padding-right: 6px;}
.group .iwant a sup{ display: flex; flex-direction: column;}

.quinta{ display: flex; flex-direction: column; position: relative;}
.quinta .swiper-container{ width: 100%; height: 100%;}
.quinta .swiper-wrapper .swiper-slide{ display: flex; flex-direction: column;}
.quinta .swiper-wrapper .swiper-slide img{ display: block; width: 100%; height: 700px; object-fit: cover;}
.quinta .quintaBox{ width: 1240px; position: absolute; left: 50%; margin-left: -620px; z-index: 10; top: 0;}
.quinta .quintaBox .quintaBoxCeng{ width: 410px; height: 700px; display: flex; flex-direction: column; background: #fff; position: relative;}
.quinta .quintaBox .quintaBoxCeng .swiper-button-prev,.quinta .quintaBox .quintaBoxCeng .swiper-button-next{ height: 60px; top: auto; bottom: 0; width: 50%;}
.quinta .quintaBox .quintaBoxCeng .swiper-button-prev{ left: 0; background: #B81C22;}
.quinta .quintaBox .quintaBoxCeng .swiper-button-next{ right: 0; background: #6F6F6F;}
.quinta .quintaBox .quintaBoxCeng .swiper-button-prev:after,.quinta .quintaBox .quintaBoxCeng .swiper-button-next:after{ color: #fff; font-size: 30px;}
.quinta .quintaBox .quintaBoxCeng .swiper-button-prev:active,.quinta .quintaBox .quintaBoxCeng .swiper-button-next:active{ opacity: 0.85;}
.quinta .quintaBox .quintaBoxCeng .swiper-pagination{ padding: 0 20px; left: 0; right: 0; bottom: 140px; display: flex; flex-wrap: wrap;}
.quinta .quintaBox .quintaBoxCeng .swiper-pagination .swiper-pagination-bullet{ width: 25%; text-align: center; background: none; border-radius: 0; line-height: 50px; height: 50px; font-size: 22px; opacity: 1;}
.quinta .quintaBox .quintaBoxCeng .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{ color: #B81C22;}

.surplus{ position: absolute; left: 32px; top: 150px; z-index: 20;}
.surplus .surplusCeng{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 330px; height: 240px; border: 8px solid #B81C22;}
.surplus .surplusCeng h2{font-weight: bold; color: #B81C22; font-size: 30px;}
.surplus .surplusCeng p{ color: #888; margin: 30px 0;}
.surplus .surplusCeng a{ display: block; width: 220px; height: 40px; line-height: 40px; color: #fff; background: #CCC; text-align: center; font-size: 16px;}
.surplus .surplusCeng a:active{ background: #B81C22;}
.surplus .surplusWord{ text-align: center; padding-top: 60px;}

.home{ display: flex; flex-direction: column;}
.home .inner{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.home .inner .homeList{ width: 380px; display: flex; flex-direction: column; margin-top: 40px;}
.home .inner .homeList .homeListPic{ display: flex; flex-direction: column; overflow: hidden;}
.home .inner .homeList .homeListPic img{ display: block; width: 100%; transition: all 300ms;}
.home .inner .homeList:hover .homeListPic img{ -webkit-transform:scale(1.06); -moz-transform:scale(1.06); -ms-transform:scale(1.06); -o-transform:scale(1.06); transform:scale(1.06);}
.home .inner .homeList .homeListCont{ display: flex; flex-direction: column; position: relative;}
.home .inner .homeList .homeListCont h2{ font-size: 18px; padding-top: 20px;}
.home .inner .homeList .homeListCont figure{ color: #666;}
.home .inner .homeList .homeListCont:after{ content: ''; width: 20px; height: 2px; background: #B81C22; margin-top: 20px;}

.material{ display: flex; flex-direction: column;}
.material img{ display: block; width: 100%; height: 800px; object-fit: cover;}

.building{ background: url(../images/building.png) center bottom no-repeat;}
.building .buildingCont{ display: flex; flex-direction: column;}
.building .buildingCont img{ display: block; width: 100%;}
.building .buildingCont figure{ font-weight: bold; margin-top: 50px; color: #B81C22; font-size: 30px; line-height: 1.5; text-align: center;}

/* 在线报价 */
.budget{ display: flex; flex-direction: column; position: relative;}
.budget .budgetPic{ display: flex; flex-direction: column; position: absolute; left: 0; top: 0; right: 0; z-index: 10;}
.budget .budgetPic img{ display: block; width: 100%; height: 720px; object-fit: cover;}
.budget .budgetLayer{ display: flex; flex-direction: column; position: relative; z-index: 20;}
.budget .budgetLayer .inner{ display: flex; flex-direction: row; position: relative; height: 540px; background: #fff; justify-content: space-between; margin-top: 260px; box-shadow: 0 0 20px 0 rgba(0,0,0,0.1);}
.computeLeft{ width: 420px; padding: 0 30px; display: flex; flex-direction: column; justify-content: center;}
.computeLeft .computeLeftTit{ display: flex; flex-direction: row; align-items: center; line-height: 30px; padding-bottom: 10px;}
.computeLeft .computeLeftTit h2{ font-size: 26px; padding-right: 10px;}
.computeLeft .computeLeftTit figure{ color: #B81C22; font-weight: bold; font-size: 16px;}
.computeLeft .computeLeftBox{ display: flex; flex-direction: row; justify-content: space-between; padding: 10px 0;}
.computeLeft .computeLeftBox .computeLeftBoxCont{ width: 100px; font-size: 18px; color: #555; line-height: 46px;}
.computeLeft .computeLeftBox .computeLeftBoxTact{ width: 320px; display: flex; flex-direction: row; justify-content: space-between;}
.computeLeft .computeLeftBox .computeLeftBoxTact .form-group{ width: 150px; border: 1px solid #AAA;}
.computeLeft .computeLeftBox .computeLeftBoxTact .form-group .form-control{ padding: 0 10px; height: 44px; line-height: 44px; background: none; width: 150px;}
.computeLeft .computeLeftBox .computeLeftBoxTent{ position: relative; width: 300px; padding: 0 9px; display: flex; flex-direction: row; border: 1px solid #AAA; height: 44px;}
.computeLeft .computeLeftBox .computeLeftBoxTent span{ position: absolute; right:10px; top:0; display: block; line-height: 44px;}
.computeLeft .computeLeftBox .computeLeftBoxTact .huxing{ width: 100px; border: 1px solid #AAA; height: 46px; padding: 0 10px;}
.computeLeft .computeLeftBaomi{ color: #B81C22; line-height: 20px; margin-top: 10px;}

.computeCenter{ position: absolute; top:0; left: 50%; margin-left: -70px; display: flex; display: -ms-flexbox; display: -webkit-flex; align-items: center; height: 540px;}
.computeCenter:before{ content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; height: 100%; background: #eee;}
.computeCenter .computeCenterRound{ position: relative; z-index: 1; cursor: pointer; width: 140px; height: 140px; border-radius: 50%; position: relative;}
.computeCenter .computeCenterRound .computeCenterRoundOne{ width: 140px; height: 140px; border-radius: 50%; background: rgba(184,28,34,0.15); -webkit-animation:warn 2s linear 0s infinite; -moz-animation:warn 2s linear 0s infinite; animation:warn 2s linear 0s infinite;}
.computeCenter .computeCenterRound .computeCenterRoundTwo{ width: 100px; height: 100px; border-radius: 50%; background: #B81C22; color: #fff; font-size: 26px; line-height: 30px; display: flex; align-items: center; justify-content: center; position: absolute; left: 20px; top:20px; right: 20px; bottom: 20px; z-index: 10;}						
@keyframes warn {
    0% {
        transform:scale(0.5);
        opacity:0;
    }
    25% {
        transform:scale(0.8);
        opacity:0.5;
    }
    50% {
        transform:scale(1);
        opacity:1;
    }
    75% {
        transform:scale(1.1);
        opacity:0.5;
    }
    100% {
        transform:scale(1.2);
        opacity:0;
    }
}
@-webkit-keyframes warn {
    0% {
        transform:scale(0.5);
        opacity:0;
    }
    25% {
        transform:scale(0.8);
        opacity:0.5;
    }
    50% {
        transform:scale(1);
        opacity:1;
    }
    75% {
        transform:scale(1.1);
        opacity:0.5;
    }
    100% {
        transform:scale(1.2);
        opacity:0;
    }
}
	
.computeRight{ display: flex; width: 430px; padding: 0 40px; flex-direction: column; justify-content: center;}
.computeRight .computeRightCont{ border: 1px solid #EEE; background: #F9F9F9; padding: 24px; border-radius: 15px;}
.computeRight .computeRightCont .computeRightContTit{ background: #D2D3B4; border: 3px solid #222; border-radius: 10px; height: 84px; margin-bottom: 5px; display: flex; flex-direction: row; align-items: center; justify-content: center; font-size: 26px;}
.computeRight .computeRightCont .computeRightContTit div{ font-size: 30px; color: #B81C22; padding: 0 4px;}
.computeRight .computeRightCont .computeRightContList{ margin-top: 20px; border-radius: 10px; background: #E9E9E9; line-height: 60px; text-align: center; display: flex; flex-direction: row; justify-content: space-between;}
.computeRight .computeRightCont .computeRightContList .computeRightContListZuo{ width: 170px; border-right: 1px solid #DDD; font-size: 20px; color: #555;}
.computeRight .computeRightCont .computeRightContList .computeRightContListYou{ padding-right: 40px; font-size: 20px; color: #555;}
.computeRight .computeRightCont .computeRightContList .computeRightContListQian{ font-size: 20px; color: #B81C22;}


.formal{ display: flex; flex-direction: column; position: relative; padding: 50px 0;}
.formal .formalTitle{ display: flex; flex-direction: column; text-align: center; padding-bottom: 50px;}
.formal .formalTitle h2{ font-size: 40px;}
.formal .formalTitle p{ font-size: 22px;}
.fixtu{ background: url(../images/formal.png) right top no-repeat #fEfAf3; z-index: 10; margin-top: -80px;}
.fixtu .formalTitle{ margin-top: 60px;}
.fixtu .fixtuLayer{ padding-right: 240px; min-width: 1240px;}
.fixtu .fixtuLayer .fixtuLayerCeng{ display: flex; flex-direction: column; width: 100%; background: #fff;}
.fixtu .fixtuLayer .fixtuLayerCeng ul{ display: flex; flex-direction: row; overflow: hidden;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.imgBox{ width: 8%; height: 640px; display: flex; flex-direction: row; box-sizing: border-box;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.imgBox .imgBoxTit{ width: 100%; display: flex; flex-direction: column; padding: 100px 30px 0; text-align: center;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.imgBox:nth-child(1) .imgBoxTit{ background: #C7B4A6;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.imgBox:nth-child(2) .imgBoxTit{ background: #E5C46C;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.imgBox:nth-child(3) .imgBoxTit{ background: #B81C22;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.imgBox .imgBoxTit span{ display: block; border: 4px solid #fff; padding: 10px 0; font-size: 40px; color: #fff; font-family: 'IMPACT';}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.imgBox .imgBoxTit sup{ color: #fff; font-size: 40px; padding-top: 70px;-webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; display: flex; align-items: center; line-height: 1.2; letter-spacing: 8px;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.imgBox .imgBoxCont{ display: none;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.imgBox .imgBoxCont img{ display: block; width: 100%; height: 600px; object-fit: cover;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.active{ width: 84%;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.active .imgBoxTit{ width: 7%;}
.fixtu .fixtuLayer .fixtuLayerCeng ul li.active .imgBoxCont{ width: 90%; display: block; padding: 20px 1.5%;}


.example{ display: flex; flex-direction: column; position:relative; overflow: hidden;}
.example .liest{ width: 1240px; margin: 0 auto; display: flex; flex-direction: row; justify-content: space-between;}
.example .liest li{ display: flex; flex-direction: column; width: 205px; background: #F3F3F3; height: 80px; align-items: center; justify-content: center; cursor: pointer; font-size: 22px;}
.example .liest li.on{ background: #B81C22; color: #fff;}
.example .dimian{ overflow:hidden;}
.example .dimian .exampleBox{ display: none; min-width: 1240px; margin-top: 40px; flex-direction: row; justify-content: space-between;}
.example .dimian .exampleBox.on{ display: flex;}
.example .dimian .exampleBox .exampleBoxLeft{ width: 18%; background: #DFD2C2; justify-content: center; display: flex; flex-direction: column; position: relative;}
.example .dimian .exampleBox .exampleBoxLeft .exampleBoxLeftCeng{ display: flex; flex-direction: column; padding: 0 30px;}
.example .dimian .exampleBox .exampleBoxLeft .exampleBoxLeftCeng .exampleBoxLeftCengTit{ position: absolute; right: 20px; top: 30px; color: #fff; font-size: 40px; font-family: 'IMPACT'; text-transform: uppercase;-webkit-writing-mode: vertical-rl; writing-mode: vertical-rl;}
.example .dimian .exampleBox .exampleBoxLeft .exampleBoxLeftCeng .exampleBoxLeftCengTact{ display: flex; flex-direction: column;}
.example .dimian .exampleBox .exampleBoxLeft .exampleBoxLeftCeng .exampleBoxLeftCengTact h2{ font-size: 30px; font-weight: bold;}
.example .dimian .exampleBox .exampleBoxLeft .exampleBoxLeftCeng .exampleBoxLeftCengTact figure{ font-size: 22px; padding: 30px 0;}
.example .dimian .exampleBox .exampleBoxLeft .exampleBoxLeftCeng .exampleBoxLeftCengTact figcaption{ font-size: 16px; line-height: 2.2; color: #666;}
.example .dimian .exampleBox .exampleBoxRight{ width: 82%;}
.example .dimian .exampleBox .exampleBoxRight img{ display: block; margin-left: 10px; height: 700px; object-fit: cover; width: 100%;}

.make{ padding-top: 0;}

.flowpath{ background: url(../images/flowpath.jpg) top center no-repeat;}
.flowpath .flowpathPic{ display: flex; flex-direction: column;}






@media screen and (max-width:1700px){
	header .head .Envelop .logo a img{ height: 40px;}
	header .head .Envelop .menubox li{ padding: 0 20px;}
	
	.exquisite li .console .consoleAnniu .consoleAnniulian{ padding: 0 8%;}
	
	.center .inner1440,.multiple .inner1440,.speech .inner1440,.collar .collarBage{ width: 1240px;}
	
	.regard .regardLayer .regardLayerLeft img{ width: 620px; height: 620px;}
	.regard .regardLayer .regardLayerZhong{ width: 660px; height: 150px;}
	.regard .regardLayer .regardLayerZhong img{ width: 500px;}
	.regard .regardLayer .regardLayerRight figcaption p{ margin-top: 20px;}
	
	.culture .cultureWen .cultureWenList .cultureWenListCont p{ font-size: 14px;}
	
	.fixtu .fixtuLayer{ padding-right: 120px;}
	}
@media screen and (max-width:1440px){
	header .head .topper{ padding: 0 20px;}
	header .head .Envelop{ padding: 20px;}
	header.scroll .head .Envelop{ padding: 20px;}
	header .head .Envelop .logo a img{ height: 34px;}
	header .head .Envelop .menubox li{ padding: 0 15px;}
	header .head .Envelop .envRight .quote a{ width: 80px;}
	
	.exquisite li{ width: 33.33%;}
	.exquisite li:nth-child(7),.exquisite li:nth-child(8){ display: none;}
	.exquisite li .console .consoleAnniu .consoleAnniulian{ padding: 0 11%;}
	
	.fixtu .fixtuLayer{ padding-right: 0;}
	}

