body,html{ width: 100%; height:100%; min-width: 375px; background: #1A1A1A; }


/*******************header-Mobile******************/

#header_mb{ width: 100%; height: 80px; background: rgba(0,0,0,.8); backdrop-filter:blur(4px); position: fixed; top:0; padding:14px 8px; box-sizing: border-box; z-index: 8; }
#header_mb .nav_left{ width: 52px; height: 52px; float: right; position: relative; overflow: hidden; opacity: .8; }
#header_mb .nav_left .menu{ width: 100%; height: 100%; position: absolute; left: 0;top:0; transition: all 0.5s;  }
.nav_left .menu .menu_line{ width: 18px; height: 1px; background: #C7B299; position: absolute; left:17px; transition: all 0.3s; }
.nav_left .menu .menu_line_top{ top: 21px; }
.nav_left .menu .menu_line_bottom{ bottom: 21px;}

#nav_mb{ width: 100%; height: 100vh; background: #000; position: fixed; top:0; z-index:6; padding:80px 0 0; box-sizing: border-box; overflow: hidden; display: none; }
#nav_mb i{ display: block; width: 0; height: 0.8px; background: #2A2A2A; transition: all 0.3s; position: absolute; top:80px; }

#nav_mb p{ width: 100%; font-size: 12px; color:#333; text-align: center; position: absolute; bottom:0; line-height: 64px; background: #000;  }

#nav_mb .nav_box{ width: 100%; height: 100%; overflow-y:auto; padding:16px 0 64px; box-sizing: border-box; }
.nav_box::-webkit-scrollbar { display: none; }
.nav_box::-moz-scrollbar { display: none; }
#nav_mb ul{ width: 100%; height: auto; padding:0 40px 32px; box-sizing: border-box; /*overflow-y:auto;*/  }

#nav_mb ul li{ width: 100%; height: auto; position: relative;  }

#nav_mb ul li .list_top{ width: 100%; font-size:16px; line-height: 56px; overflow:hidden; text-align: center; font-weight: 300; color:#C7B299; border-bottom: 0.8px solid #2A2A2A; }
#nav_mb ul li .list_top .text{ float:left;}
#nav_mb ul li .list_top .ic_show{ float:right; width: 32px; height: 56px; /*background: rgba(255,255,255,.2);*/ overflow: hidden; position: relative; transition:all 0.3s; }
#nav_mb ul li .list_top .ic_show span{ background: #C7B299; position: absolute; left:50%; top:50%; transform:translateX(-50%) translateY(-50%); }
#nav_mb ul li .list_top .ic_show span:nth-of-type(1){ width: 12px; height: 1px;/*transform:rotate(45deg);*/}
#nav_mb ul li .list_top .ic_show span:nth-of-type(2){ width: 1px; height: 12px;/*transform:rotate(45deg);*/}


/*nav ul li .list_click{ width: 100%; height: 56px; position:absolute; z-index: 1; }*/


#nav_mb ul li .list_bottom { width: 100%; overflow: hidden; display:none; }
#nav_mb ul li .list_bottom ol{ width: 100%; padding:14px 0; }
#nav_mb ul li .list_bottom ol li{ width: 100%; height:48px; font-size:16px; border: none; line-height: 48px; }
#nav_mb ul li .list_bottom ol li a{ width: 100%; padding-left:16px; box-sizing: border-box; height: 100%; display:inline-block; color:#fff; font-weight: 300; }



#header_mb .nav_right{ width: 52px; height: 52px; float: right; /*background: #fff;*/ opacity: .8; }
#header_mb .nav_right a{ display: block; width: 100%; height: 100%; background: url(../img/ic_home1.svg) no-repeat 50% 50% / cover ; }
#header_mb .nav_logo{  width: 120px; height: 52px; position: absolute; left:50%; margin-left: -60px; }
#header_mb .nav_logo h1{  width: 100%; height: 100%; }
#header_mb .nav_logo h1 a{ display: block; width: 100%; height: 100%; background: url(../img/logo_m.svg) no-repeat 50% 50% / cover ;}





/*******************header-PC******************/

/*header*/
#header_pc{ width: 100vw; height: 160px; /*background: #000;*/ background: rgba(0,0,0,.8); backdrop-filter:blur(4px); position: fixed; left: 0; top: 0; z-index: 999;}

#header_pc .logo{width:128px;height:112px;margin: 0 auto;}
#header_pc .logo h1 a{width: 128px; height:112px; display:block; background: url(../img/logo.svg) left no-repeat;}

#nav_pc{ width: 1440px; height: 48px; margin: 0 auto; }
#nav_pc ul { width: 100%; height: 100%; display: flex;  }
#nav_pc ul li{ flex:1; margin: 0 56px; position: relative; }
#nav_pc ul li a{ width: 100%; line-height: 48px; font-size: 14px; color: #C7B299; text-align:center; display: inline-block; /*position: relative;*/ /*cursor: default;*/ font-weight: 300; }
#nav_pc ul li i{ width: 0px; height: 1px; position: absolute; left:32px; bottom:0; background: #C7B299; transition:all 0.3s;}


.subnav{ width: 1440px; height: auto; position: fixed; top:160px; left: 50%; margin-left: -720px; z-index: 999; padding:0 0 24px; box-sizing: border-box; overflow: hidden;/* background: #000;*/ }
.subnav .subnav-bg{ overflow: hidden; box-sizing: border-box; display: none;}

.subnav .subnav-bg:nth-of-type(1) { padding-left: 88px;  }
.subnav .subnav-bg:nth-of-type(2) { padding-left: 328px;}
.subnav .subnav-bg:nth-of-type(3) { padding-left: 568px;}
.subnav .subnav-bg:nth-of-type(4) { padding-left: 808px;}
.subnav .subnav-bg:nth-of-type(5) { padding-left: 1048px;}
.subnav .subnav-bg:nth-of-type(6) { padding-left: 1288px;}

.subnav .subnav-bg ul{ display: inline-block; overflow: hidden; position: relative; padding-top:24px; box-sizing: border-box; /*background: rgba(255,255,255,.2); */ }
.subnav .subnav-bg ul:before{ content: ""; width: 1px; height: 100%; position: absolute; top:24px; left: 0; background: #C7B299; z-index: 2; }

.subnav ul li{ line-height: 48px; /*background: rgba(0,0,0,.2);*/ backdrop-filter:blur(4px); }
.subnav ul li a{ display: block; line-height: 48px; font-size: 14px; color: #C7B299 ; padding:0 12px; font-weight: 300; }
.subnav ul li a:hover{ font-weight: 500; }






main{ width: 100vw; height:auto; margin: 160px auto 0; /*padding-top: 160px; box-sizing: border-box;*/ }

/*one*/
main .about_one{ width: 100%; height:auto; padding: 160px 12% 0 24%; box-sizing: border-box; /*background: #222;*/ }
.one_text{ width: 100%; height: 248px; padding-left:4%; box-sizing: border-box; /*background: rgba(255,255,255,.2);*/ }
.one_text span{ font-size: 18px; color:#4d4d4d; display: inline-block; margin-top:40px; }
.one_text h3{ font-size: 36px; color:#fff; margin:32px 0 56px; }
.one_text i{ width: 65px; height: 9px; display: block; margin-top:24px; position: relative; overflow: hidden; }
.one_text i:before{ content: ""; width: 65px; height: 9px; background: url(../img/arrow.svg) no-repeat 50% 50% / cover; position: absolute; top:0; left: -32px; transition: all 0.3s ease; }
.one_text:hover i:before{ left: 0; }

.one_img{ width: 100%; height: 32vw;  margin-top: 64px; background: url(../img/ab_one.jpg) no-repeat 50% 50% / cover; }
.one_img figure{ width: 100%; height: 100%; background: url(../img/ab_one_text.svg) no-repeat 50% 50% / cover; }


/*two*/
main .about_two{ width: 100%; height:auto; padding: 120px 12% 0 24%; box-sizing: border-box; /*background: #222;*/ }
.two_text{ width: 100%; height: 248px; padding-left:4%; box-sizing: border-box; /*background: rgba(255,255,255,.2);*/ }
.two_text span{ font-size: 18px; color:#4d4d4d; display: inline-block; margin-top:40px; }
.two_text h3{ font-size: 36px; color:#fff; margin:32px 0 56px; }
.two_text i{ width: 65px; height: 9px; display: block; margin-top:24px; position: relative; overflow: hidden; }
.two_text i:before{ content: ""; width: 65px; height: 9px; background: url(../img/arrow.svg) no-repeat 50% 50% / cover; position: absolute; top:0; left: -32px; transition: all 0.3s ease; }
.two_text:hover i:before{ left: 0; }

.two_img{ width: 100%; height: 25vw;  margin-top: 64px; background: url(../img/ab_two.png) no-repeat 50% 50% / cover; }

.about_two p{ font-size: 18px; color: #fff; font-weight:300; line-height: 40px; padding :0 32% 0 4%; box-sizing: border-box; margin-top: 64px; }



/*three*/
main .about_three{ width: 100%; height:auto; margin-top: 120px; /*padding: 120px 12% 0 24%; box-sizing: border-box; background: #222;*/ }

.three_text_box{ width: 100%; height: auto; padding:0 12% 0 24%; box-sizing: border-box; }
.three_text{ width: 100%; height: 248px; padding-left:4%; box-sizing: border-box; /*background: rgba(255,255,255,.2);*/ }
.three_text span{ font-size: 18px; color:#4d4d4d; display: inline-block; margin-top:40px; }
.three_text h3{ font-size: 36px; color:#fff; margin:32px 0 56px; }
.three_text i{ width: 65px; height: 9px; display: block; margin-top:24px; position: relative; overflow: hidden; }
.three_text i:before{ content: ""; width: 65px; height: 9px; background: url(../img/arrow.svg) no-repeat 50% 50% / cover; position: absolute; top:0; left: -32px; transition: all 0.3s ease; }
.three_text:hover i:before{ left: 0; }

/*.three_img{ width: 100%; height: 32vw;  margin-top: 64px; background: url(../img/ab_one.jpg) no-repeat 50% 50% / cover; }*/



.three_img{ width: 80vw; height: 34vw; margin:40px auto 0;  overflow: hidden; /*position: relative;*/ }
.three_img ul { width: 100%; height: 100%; position:relative; }
.three_img ul li{ width: 100%; height: 100%; position: absolute; left: 0; top:0; display: none; }
.three_img ul li a{ display: block; width: 100%; height: 100%; cursor: auto; }
.three_img ul li/*:nth-of-type(1)*/ a{background: url(../img/time_logo.svg) no-repeat 50% 50% / cover;}



.time24 { width: 100%; height: auto; padding:0 12% 0 24%; margin-top:80px; box-sizing: border-box;  }
.time24 h3{ font-size: 18px; color: #fff; font-weight:300; line-height: 40px; padding :0 32% 0 4%; box-sizing: border-box; }
.time24 p{ font-size: 18px; color: #fff; font-weight:300; line-height: 40px; padding :0 32% 0 4%; box-sizing: border-box; margin-top: 32px; }
.time24 img{ width: 34vw; height:auto;  padding-left: 4%; margin-top:80px;  }






/*four*/
main .about_four{ width: 100%; height:auto; padding: 120px 12% 240px 24%; box-sizing: border-box; /*background: #222;*/ }
.four_text{ width: 100%; height: 248px; padding-left:4%; box-sizing: border-box; /*background: rgba(255,255,255,.2);*/ }
.four_text span{ font-size: 18px; color:#4d4d4d; display: inline-block; margin-top:40px; }
.four_text h3{ font-size: 36px; color:#fff; margin:32px 0 56px; }
.four_text i{ width: 65px; height: 9px; display: block; margin-top:24px; position: relative; overflow: hidden; }
.four_text i:before{ content: ""; width: 65px; height: 9px; background: url(../img/arrow.svg) no-repeat 50% 50% / cover; position: absolute; top:0; left: -32px; transition: all 0.3s ease; }
.four_text:hover i:before{ left: 0; }

.about_cont{ width: 100%; height: auto; padding-left:4%; box-sizing: border-box; margin-top: 56px; }
.about_cont h2{ font-size: 26px; color: #C7B299; }



.about_cont .about_cont_phone{ display:flex; margin: 40px 0 32px 0; }
.about_cont .about_cont_phone span{ font-size: 22px; color: #C7B299; line-height: 44px;}
.about_cont .about_cont_phone p{ flex:1; font-size: 22px; font-weight: 300; color: #fff; margin-left: 32px; line-height: 44px;}


.about_cont i{ width: 64%; height: 1px; background: #C7B299; display: block; box-sizing: border-box; }


.about_cont .about_cont_email{ display:flex; margin: 40px 0 24px 0; }
.about_cont .about_cont_email span{ font-size: 22px; color: #C7B299; line-height: 44px;}
.about_cont .about_cont_email p{ flex:1; margin-left: 40px; }
.about_cont .about_cont_email p a{ font-size: 22px; font-weight: 300; color: #fff; line-height: 44px; transition: all 0.2s ease; }
.about_cont .about_cont_email p a:hover{ color: #C7B299; }


.about_cont .about_cont_add{ display:flex;  }
.about_cont .about_cont_add span{ font-size: 22px; color: #C7B299; line-height: 44px;}
.about_cont .about_cont_add p{ flex:1; margin-left: 56px; }
.about_cont .about_cont_add p a{ font-size: 22px; font-weight: 300; color: #fff; line-height: 44px; transition: all 0.2s ease; }
.about_cont .about_cont_add p a:hover{ color: #C7B299;}








/*******************响应******************/

@media (max-width:2560px){

	.header_pc_box{ display: block; }
	.header_mb_box{ display: none; }
}

@media (max-width:1600px){

	.header_pc_box{ display: none; }
	.header_mb_box{ display: block; }

}


@media (max-width:1024px){

	main{ margin-top:80px; }

	/*one*/
	main .about_one{  padding: 64px 8% 0 8%;   }
	.one_text{ padding-left:0%; height: auto; }
	.one_text span{ font-size: 14px; margin-top:20px; }
	.one_text h3{ font-size: 20px; margin:24px 0 28px; }

	.one_img{ height: 44vw;  margin-top: 32px;  }


	/*two*/
	main .about_two{ padding: 60px 8% 0 8%; }
	.two_text{ height: auto; padding-left:0; }
	.two_text span{ font-size: 14px; margin-top:20px; }
	.two_text h3{ font-size: 20px; margin:24px 0 28px; }

	.two_img{ height: 33vw; margin-top: 32px; }

	.about_two p{ font-size: 16px; line-height: 32px; padding :0 ; margin-top: 32px; }


	/*three*/
	main .about_three{ margin-top: 60px; }

	.three_text_box{ padding:0 8% 0 8%; }
	.three_text{ height: auto; padding-left:0; }
	.three_text span{ font-size: 14px; margin-top:20px; }
	.three_text h3{ font-size: 20px;  margin:24px 0 28px; }

	.three_img{ width: 100vw; height: 72vw; margin:40px auto 0;  overflow: hidden; /*position: relative;*/ }
	.three_img ul { width: 100%; height: 100%; position:relative; }
	.three_img ul li{ width: 100%; height: 100%; position: absolute; left: 0; top:0; display: none; }
	.three_img ul li a{ display: block; width: 100%; height: 100%; cursor: auto; }
	.three_img ul li/*:nth-of-type(1)*/ a{background: url(../img/time_logo.svg) no-repeat 50% 50% / cover;}

	.time24 { padding:0 8%; margin-top:48px; padding:0; }
	.time24 h3{ font-size: 20px;  padding :0 8%; }
	.time24 p{ font-size: 16px; line-height: 32px; padding :0 8%; margin-top: 24px; }
	.time24 img{ width: 84vw; padding-left: 8%; margin-top:32px;  }



	/*four*/
	main .about_four{ padding: 60px 8% 120px 8%;  }
	.four_text{ height: auto; padding-left:0; }
	.four_text span{ font-size: 16px; margin-top:20px; }
	.four_text h3{ font-size: 20px; margin:16px 0 28px; }

	.about_cont{ padding-left:0;  margin-top: 40px; }
	.about_cont h2{ font-size: 18px; }



	.about_cont .about_cont_phone{ display:block; margin: 40px 0 32px 0; }
	.about_cont .about_cont_phone span{ font-size: 16px; line-height: 32px;}
	.about_cont .about_cont_phone p{ font-size: 14px;  margin:8px 0 0 0; line-height: 32px;}


	.about_cont i{ width: 100%; }


	.about_cont .about_cont_email{ display:block; margin: 40px 0 24px 0; }
	.about_cont .about_cont_email span{ font-size: 16px; line-height: 32px;}
	.about_cont .about_cont_email p{ margin:8px 0 0 0; }
	.about_cont .about_cont_email p a{ font-size: 14px; line-height: 32px; }

	.about_cont .about_cont_add{ display:block;  }
	.about_cont .about_cont_add span{ font-size: 16px; line-height: 32px;}
	.about_cont .about_cont_add p{ margin:8px 0 0 0; }
	.about_cont .about_cont_add p a{ font-size: 14px; line-height: 32px; }
	



}