@charset "utf-8";
/* CSS Document */
  #c_magiccube_005-1637288758471 .p_turnPage_pagination {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 60px;
}
@media only screen and (max-width: 1400px) and (min-width: 1024px) {
  
  #c_navigation_034-16463660766200 .e_navigationA-42 .p_level1Item a,#c_navigation_034-1642040375794 .e_navigationA-42 .p_level1Item a{padding:0px 1.2rem !important;}
  #c_navigation_034-16463660766200 .e_container-46 .cbox-46-1{display:none;}




}




 .container-arrowarrow {
    pointer-events: none;
    overflow: hidden;
    position: relative;
    margin: 0 auto;
    height: 100px;
    width: 50px;
}
 
  
 .container-arrowarrow:before {
    content: '';
    position: absolute;
    top: 0;
    left: 25px;
    width: 2px;
    height: 100%;
    background-color: #ffffff;
    -webkit-animation: screen-arrow 1.5s infinite ease;
    animation: screen-arrow 1.5s infinite ease;
}
  
  
  
@-webkit-keyframes screen-arrow {
    0% {
      -webkit-transform: translateY(-100%);
      transform: translateY(-100%);
    }
    100% {
      -webkit-transform: translateY(100%);
      transform: translateY(100%);
    }
  }
  @keyframes screen-arrow {
    0% {
      -webkit-transform: translateY(-100%);
      transform: translateY(-100%);
    }
    100% {
      -webkit-transform: translateY(100%);
      transform: translateY(100%);
    }
  }

#c_static_001-1642668906248 .e_bannerA-1 .p_video{position:relative;}

#c_static_001-1642668906248 .e_bannerA-1 .p_video .videoContent:before{background-color: rgba(0,0,0,0.4);z-index: 99;position:absolute;width: 100%;height: 100%;content:"";}

#c_static_001-1642668906248 .e_bannerA-1 .p_video #videowz{
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position:absolute;
    z-index: 999;
    margin-top: -77px;
    width: 100%;
    max-width: 640px;
    margin-left: -320px;
}



.fadeInUp{
    -webkit-animation:fadeInUp 1000ms .8s ease both;
}


@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px);
        transform: translateY(20px)
    }
 
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}





.cursor-dot {
    width: 8px;
    height: 8px;
    background: linear-gradient(to right, #bb9462 0%, #896639 100%);
}


.cursor-dot-outline {
    width: 40px;
    height: 40px;
    border: 1px dashed #bb9462;
}


.cursor-dot, .cursor-dot-outline {
    pointer-events: none;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    opacity: 0;
    transform: translate(-50%, -50%);
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    z-index: 99999999 !important;
}

@media only screen and (max-width: 768px) {
  #c_static_001-1642657106326 .e_container-1.response-transition .e_button-7{margin-left:auto !important;}
#c_magiccube_005-1637288758471 .p_turnPage_pagination {
    display: flex;
    justify-content: center;
    margin-bottom: 0;
}
.main:before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0px;
	right: 0;
	z-index: 9;
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0));
	height: 0px !important;
	/* box-shadow: 0px 30px 50px rgb(0 0 0 / 50%); */
	/* background-size: auto 99%; */
}



	#c_static_001-1642668906248 .e_bannerA-1 .p_video #videowz {
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    z-index: 999;
    width: 100%;
    max-width: 260px;
    margin-left: -130px;
}


  #c_navigation_034-16463660766200 .e_navigationA-42 .p_level1Box .p_menu1Item{color:#333 !important;}
  #c_product_detail_005-1642071994072 .e_magnifier-24 .magnifier-container,#c_new_detail_010-1642729633612 .e_imageList-21,#c_new_detail_011-1642728166163 .e_imageList-11{height:auto !important;}
  
  
  
  .topnav {

	height: auto !important

}

  .topnav#c_navigation_034-1642040375794 .e_navigationA-42 .p_iconBox {
    
    color: #fff !important;
}
  #c_navigation_034-1642040375794 .e_navigationA-42 .p_menu1Item {
    
    color: #333 !important;
}
  
  .container-arrowarrow {
    pointer-events: none;
    overflow: hidden;
    position: relative;
    margin: 0 auto;
    height: 50px;
    display:none;
    width: 2px;
}
  #c_navigation_034-1642040375794 .e_container-9 .cbox-9-1 ,#c_navigation_034-16463660766200 .e_container-9 .cbox-9-1{position: absolute;right: 10px;top: 12px;}
  
  
  #c_static_001-1642657106326 .e_container-4 .cbox-4-0 {
    flex: 0 0 0px !important;
}
  
  

	#c_static_001-1642657106326 .e_text-3, #c_static_001-1642657106326 .e_text-8, #c_static_001-1642662921684 .e_text-2, #c_static_001-1642663416112 .e_text-6, #c_static_001-1642660953992 .e_text-1{font-size:22px;}

	
#c_navigation_033-1642668901729 .e_container-5 .cbox-5-1 {
	margin-top: 10px;
}
#c_navigation_033-1642668901729 .e_navigationA-11 .p_openIcon {
	color: #fff;
}
}
#c_static_001-1642734662716 .e_loop_F-1 .swiper-button-next {
	left: auto;
	right: calc(50% - 260px) !important;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2021112918522744999/cms/image/60d73ea8-fb7a-45f8-bf3e-5dd72c25cca9.png_560xaf.png) no-repeat center;
}
#c_static_001-1642734662716 .e_loop_F-1 .swiper-button-next:hover {
	left: auto;
	right: calc(50% - 260px) !important;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2021112918522744999/cms/image/60d73ea8-fb7a-45f8-bf3e-5dd72c25cca9.png_560xaf.png) no-repeat center;
}
#c_static_001-1642734662716 .e_loop_F-1 .swiper-button-prev {
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2021112918522744999/cms/image/d7545d29-323f-4ff6-bf53-19b302bf0137.png_560xaf.png) no-repeat center;
}
#c_static_001-1642734662716 .e_loop_F-1 .swiper-button-prev:hover {
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2021112918522744999/cms/image/5912e1f9-6444-4205-b907-056458807e7a.png_560xaf.png) no-repeat center;
}
#c_static_001-1642734662716 .e_loop_F-1 .swiper-button-next:after, #c_static_001-1642734662716 .e_loop_F-1 .swiper-button-prev:after {
	font-size: 0px !important;
}
#c_static_001-1642734662716 .e_image-3 img {
	width: 100%;
	position: absolute;
	width: 100%;
	min-height: 100%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	transition: all 0.5s;
	height: 100%;
	object-fit: cover;
}
#c_static_001-1642734662716 .e_loop_F-1 .swiper-button-prev:after {
	font-size: 0px !important;
}
.page_a.current {
	background: #333 !important;
	color: #fff;
}
.topnav {
	background: #303030 !important;
	position: fixed !important;
	top: 0px !important;
	height: 100px;
	transition: all ease 1s;
}
.active >div {
	border-bottom: 0px solid #cfa972 !important;
}
.active a {
	color: #333;
	font-weight: bold;
}
.main:before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0px;
	right: 0;
	z-index: 9;
	background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0));
	height: 100px;/* box-shadow: 0px 30px 50px rgb(0 0 0 / 50%); */
    /* background-size: auto 99%; */
}
#c_magiccube_005-1637288758471 .p_turnPageItem {
	height: 2px !important;
	display: block;
	text-align: right;
	border-radius: 0px;
	border: 0px solid #d7d7d7;
	background: #fff;
}
#c_magiccube_005-1637288758471 .p_turnPageItem_active .p_turnPageItem {
	background-color: #cfa972;
	width: 40px !important;
}
#c_new_list_047-1642665028310 .e_image-17 img {
	object-fit: none !important;
	position: absolute;
	width: 100%;
	min-height: 100%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	transition: all 0.5s;
	height: 100%;
}
#c_static_001-1642657106326 .e_text-3, #c_static_001-1642657106326 .e_text-8, #c_static_001-1642662921684 .e_text-2, #c_static_001-1642663416112 .e_text-6, #c_static_001-1642660953992 .e_text-1 {
	font-family: "tw";
	letter-spacing: 4px;
}

@media only screen and (min-width: 992px) {
.demo .list:hover .title {
	opacity: 1;
	/* margin-top: -120px; */
	font-weight: normal;
}

.demo .list:hover .ms {
	opacity: 1;
	font-weight: normal;
	bottom: 56%;
}


.demo .list:hover .more {
	opacity: 1;
	bottom: 6%;
	font-weight: normal;
}
.demo .list:hover .title span {
	opacity: 1;
	/* margin-top: 14px; */
	font-weight: normal;
}
.demo .more span:hover {
	opacity: 1;
	background: #cfa972;
	font-weight: normal;
	border: 1px solid #cfa972;
}
.demo {
	height: 100vh;
}
.lists {
	height: 100%;
}
.list {
	float: left;
	transition: all 0.8s ease-out;
}
.list1 {
	position: relative;
	width: calc(100% / 6);
	height: 100%;
	float: left;
	overflow: hidden;
}
.list2 {
	position: relative;
	width: calc(100% / 6);
	height: 100%;
	float: left;
	overflow: hidden;
}
.list3 {
	position: relative;
	width: calc(100% / 6);
	height: 100%;
	overflow: hidden;
}
.list4 {
	position: relative;
	width: calc(100% / 6);
	height: 100%;
	float: left;
	overflow: hidden;
}
.list5 {
	position: relative;
	width: calc(100% / 6);
	height: 100%;
	float: left;
	overflow: hidden;
}
.list6 {
	position: relative;
	width: calc(100% / 6);
	height: 100%;
	float: left;
	overflow: hidden;
}
.list7 {
	position: relative;
	width: calc(100% / 6);
	height: 100%;
	float: left;
	overflow: hidden;
}
.list1 .bg, .list2 .bg, .list3 .bg, .list4 .bg, .list5 .bg, .list6 .bg, .list7 .bg {
	height: 100%;
}
.bg::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.3);
	opacity: .2;
	visibility: hidden;
	transition: all .4s;
	-moz-transition: all .4s;
	-webkit-transition: all .4s;
}
.title {
	opacity: 1;
}
.title span {
	opacity: 0;
	margin-top: 30px;/* margin: 40px 16%; */
}
.demo .more {
	bottom: 30px;
	opacity: 0;
}
}
.list1 .bg {
	width: 100%;
	height: 100%;
	   background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/f2e64986-a80c-49f6-b873-5ea0e4613d09.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.list1 .bg:hover {
	width: 100%;
	height: 100%;
	   background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/d93f6938-8abd-48ff-8789-e52b245e9383.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.list2 .bg {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/4860b5d4-8a36-45a1-baca-2ab4e1744291.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.list2 .bg:hover {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/a06891c0-cbf4-4237-85e2-422f2cc14671.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.list3 .bg {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/873fd2d2-1818-4499-864f-6463cdccf2e9.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.list3 .bg:hover{
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/f6ac1f7e-9432-4220-9d3a-d4dd871d35e8.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.list4 .bg {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/b6bc3b40-28b8-44c4-946c-d774a81dc9dc.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.list4 .bg:hover{
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/fbe9f4cc-ba22-42b0-9069-a81e75fb44e6.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.list5 .bg {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/b177436f-b249-4892-acc3-e4698b3d39f7.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.list5 .bg:hover{
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/3b51853a-58e4-4ea7-90f7-fa6de6390b15.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}

.list6 .bg:hover  {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/4503a83a-e416-40d7-a936-76369618ac1d.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.list6 .bg{
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/881b25b5-f6d1-4abe-bbcc-796ce887a79a.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.more span {
	display: inline-block;
	width: 130px;
	height: 35px;
	line-height: 35px;
	color: #333;
	opacity: .9;
	font-family: Arial;
	font-size: 14px;
	border: 1px solid #999;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}
.more span i {
	font-style: normal;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}
.title span {
	display: block;
	margin: 270px 16%;
	padding: 0px 30px;
	font-size: 14px;
	color: #333;
}
.more {
	position: absolute;
	width: 100%;
	height: 50px;
	margin-top: 0;
	bottom: 0px;
	text-align: center;
	-webkit-transition: all 2s;
	-moz-transition: all 0.5s;
	transition: all 2s;
}
.demo .title {
	position: absolute;
	top: 24%;
	margin-top: -60px;
	width: 100%;
	text-align: center;
	color: #fbf3de;
	font-size: 30px;
	z-index: 2;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	transition: all 1s;
}

.demo .ms {
	position: absolute;
	bottom: 60px;
	width: 100%;
	padding: 0px 60px;
	opacity:0;
	text-align: center;
	color: #fff;
	font-size: 18px;
	font-weight:normal;
	z-index: 2;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	transition: all 1s;
}


.demo {
	width: 100%;
	height: 100vh;
	overflow: hidden;
}
.lists {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}
.demo .list {
	position: relative;
}
.demo .active {
	width: 34%;
}
.demo .deactive {
	width: 13.2%;
}

@media only screen and (min-width: 769px) {
#kl {
	background: rgba(0,0,0,0.1);
	width: 100%;
	height: auto;/* min-height: 192px; */
	position: absolute;
	bottom: 0px;
}
#link {
	width: 94%;
	max-width: 1600px;
	margin: 0px auto;
}
#link .li img {
	width: 45px;
	margin: 0px auto;
	display: block;
	-webkit-transition: -webkit-transform 1s ease-out;
	-moz-transition: -moz-transform 1s ease-out;
	-o-transition: -o-transform 1s ease-out;
	-ms-transition: -ms-transform 1s ease-out;
}
#link .li {
	border-right: 1px solid rgba(255,255,255,0.1)
}
#link .li span {
	color: #fff;
	width: 100%;
	float: left;
	font-size: 16px;
	text-align: center;
	margin: 14px auto 0px auto;
}
#link .li {
	position: relative;
	width: calc(100% / 5);
	height: 100%;
	float: left;
	overflow: hidden;
	padding: 46px 0px;
}
#link .li:hover {
	background: #cfa972;
}
#link .li:hover img {
	-webkit-transform: rotateY(360deg);
	-moz-transform: rotateY(360deg);
	-o-transform: rotateY(360deg);
	-ms-transform: rotateY(360deg);
	transform: rotatey(360deg);
}
#link1 {
	width: 100%;
}
#link1 .li1 img {
	width: 160px;
	margin: 0px auto;
	display: block;
	-webkit-transition: -webkit-transform 1s ease-out;
	-moz-transition: -moz-transform 1s ease-out;
	-o-transition: -o-transform 1s ease-out;
	-ms-transition: -ms-transform 1s ease-out;
}
#link1 .li1 {
	border-right: 1px solid rgba(255,255,255,0.1)
}
#link1 .li1 span {
	color: #333;
	width: 100%;
	font-size: 24px;
	transition: all 0.4s ease;
	text-align: center;
	display: block;
	margin: 14px auto 0px auto;
}
#link1 .li1 .line {
	background: #cfa972;
	height: 2px;
	transition: all 0.4s ease;
	margin: 14px auto;
	text-align: center;
	width: 100%;
	max-width: 30px;
}
#link1 .li1 .ms {
	color: #666;
	padding: 0px 40px;
	transition: all 0.4s ease;
	line-height: 26px;
	font-size: 15px;
	text-align: center;
}
#link1 .li1 {
	position: relative;
	width: calc((100% - 90px)/3);
	height: 100%;
	margin: 0px 15px;
	float: left;
	transition: all 0.4s ease;
	min-height: 440px;
	border-radius: 6px;
	background: rgba(255,255,255,0.95);
	overflow: hidden;
	padding: 46px 0px;
}
#link1 .li1:hover span, #link1 .li1:hover .ms {
	color: #fff;
}
#link1 .li1:hover .line {
	background: #333;
}
#link1 .li1:hover {
	background: #cfa972;
}
#link1 .li1:hover img {
	-webkit-transform: rotateY(360deg);
	-moz-transform: rotateY(360deg);
	-o-transform: rotateY(360deg);
	-ms-transform: rotateY(360deg);
	transform: rotatey(360deg);
}
}

@media only screen and (max-width: 1024px) and (min-width: 769px) {
  
  #c_navigation_034-1642040375794 .e_navigationA-42 .p_level1Item a {
  
    padding: 0 1rem !important;
 
    text-align: center;
}
  
  
}

@media only screen and (max-width: 768px) {
	
	

.list1 .bg {
	width: 100%;
	height: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/f2e64986-a80c-49f6-b873-5ea0e4613d09.jpg)no-repeat;
	background-position: 50%;
	background-size: cover;
}
.list2 .bg {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/4860b5d4-8a36-45a1-baca-2ab4e1744291.jpg)no-repeat
	background-position: 50%;
	background-size: cover;
}
.list3 .bg {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/873fd2d2-1818-4499-864f-6463cdccf2e9.jpg)no-repeat;
	background-position: 50%;
	background-size: cover;
}
.list4 .bg {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/b6bc3b40-28b8-44c4-946c-d774a81dc9dc.jpg)no-repeat;
	background-position: 50%;
	background-size: cover;
}
.list5 .bg {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/b177436f-b249-4892-acc3-e4698b3d39f7.jpg)no-repeat;
	background-position: 50%;
	background-size: cover;
}
.list6 .bg {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2022071914511555315/cms/image/881b25b5-f6d1-4abe-bbcc-796ce887a79a.jpg)no-repeat;
	background-position: 50%;
	background-size: cover;
}
.list7 .bg {
	width: 100%;
	background: url(https://omo-oss-image.thefastimg.com/portal-saas/new2021112918522744999/cms/image/94bbaf1e-a8ac-4cbb-9c05-a5b74d9bf9d2.jpg)no-repeat;
	background-position: 50%;
	background-size: auto 100%;
}
.more span {
	display: inline-block;
	width: 130px;
	height: 35px;
	line-height: 35px;
	color: #fff;
	opacity: .9;
	font-family: Arial;
	font-size: 14px;
	border: 1px solid #fff;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}
.more span i {
	font-style: normal;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}
.title span {
	display: block;
	margin: 40px 16%;
	/* padding: 0px 30px; */
	font-size: 14px;
}
.more {
	position: absolute;
	bottom: 120px;
	width: 100%;
	height: 50px;
	margin-top: 80px;
	top: 50%;
	text-align: center;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}
.demo .title {
	position: absolute;
	bottom: 45%;
	margin-top: -100px;
	width: 100%;
	text-align: center;
	top: inherit;
	color: #fff;
	font-size:20px;
	z-index: 2;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	transition: all 1s;
}
.demo {
	width: 100%;
	height: 100vh;
	overflow: hidden;
}
.lists {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}
.demo .list {
	position: relative;
}
.demo .active {
	width: 28%;
}
.demo .deactive {
	width: 12%;
}
	
	
#c_navigation_033-1642668901729 .e_container-5 .cbox-5-1 {
	margin-top: 14px;
}
/*-body{display:none;}-*/

#c_navigation_033-1642668901729 .e_navigationA-11 .p_menu1Item {
	color: #333;
}
#kl {
	background: rgba(0,0,0,0.1);
	width: 100%;
	height: auto;/* min-height: 192px; */
	position: absolute;
	bottom: 0px;
}
#link {
	width: 94%;
	max-width: 1600px;
	margin: 0px auto;
}
#link .li img {
	width: 32px;
	margin: 0px auto;
	display: block;
	-webkit-transition: -webkit-transform 1s ease-out;
	-moz-transition: -moz-transform 1s ease-out;
	-o-transition: -o-transform 1s ease-out;
	-ms-transition: -ms-transform 1s ease-out;
}
#link .li {
	border-right: 1px solid rgba(255,255,255,0.1)
}
#link .li span {
	color: #fff;
	width: 100%;
	float: left;
	font-size: 12px;
	text-align: center;
	margin: 14px auto 0px auto;
}
#link .li {
	position: relative;
	width: calc(100% / 5);
	height: 100%;
	float: left;
	overflow: hidden;
	padding: 30px 0px;
}
#link .li:hover {
	background: #cfa972;
}
#link .li:hover img {
	-webkit-transform: rotateY(360deg);
	-moz-transform: rotateY(360deg);
	-o-transform: rotateY(360deg);
	-ms-transform: rotateY(360deg);
	transform: rotatey(360deg);
}
#link1 {
	width: 100%;
}
#link1 .li1 img {
	width: 48px;
	margin: 0px auto;
	display: block;
	-webkit-transition: -webkit-transform 1s ease-out;
	-moz-transition: -moz-transform 1s ease-out;
	-o-transition: -o-transform 1s ease-out;
	-ms-transition: -ms-transform 1s ease-out;
}
#link1 .li1 {
	border-right: 1px solid rgba(255,255,255,0.1)
}
#link1 .li1 span {
	color: #333;
	width: 100%;
	font-size: 16px;
	transition: all 0.4s ease;
	text-align: center;
	display: block;
	margin: 14px auto 0px auto;
}
#link1 .li1 .line {
	background: #cfa972;
	height: 2px;
	transition: all 0.4s ease;
	margin: 14px auto;
	text-align: center;
	width: 100%;
	max-width: 30px;
}
#link1 .li1 .ms {
	color: #666;
	padding: 0px 40px;
	transition: all 0.4s ease;
	line-height: 17px;
	font-size: 12px;
	display: none;
	text-align: center;
}
#link1 .li1 {
	position: relative;
	width: calc((100% - 18px)/3);
	height: 100%;
	margin: 0px 3px;
	float: left;
	transition: all 0.4s ease;
	/* min-height: 440px; */
	border-radius: 6px;
	background: rgba(255,255,255,0.95);
	overflow: hidden;
	padding: 20px 0px;
}
#link1 .li1:hover span, #link1 .li1:hover .ms {
	color: #fff;
}
#link1 .li1:hover .line {
	background: #333;
}
#link1 .li1:hover {
	background: #cfa972;
}
#link1 .li1:hover img {
	-webkit-transform: rotateY(360deg);
	-moz-transform: rotateY(360deg);
	-o-transform: rotateY(360deg);
	-ms-transform: rotateY(360deg);
	transform: rotatey(360deg);
}
.demo {
	height: 100vh;
}
.lists {
	height: 100%;
}
.list {
	float: left;
	transition: all 0.8s ease-out;
}
.list1 {
	position: relative;
	width: calc(100% / 2);
	height: 33%;
	float: left;
	overflow: hidden;
}
.list2 {
	position: relative;
	width: calc(100% / 2);
	height: 33%;
	float: left;
	overflow: hidden;
}
.list3 {
	position: relative;
	width: calc(100% / 2);
	height: 33%;
	overflow: hidden;
}
.list4 {
	position: relative;
	width: calc(100% / 2);
	height: 33%;
	float: left;
	overflow: hidden;
}
.list5 {
	position: relative;
	width: calc(100% / 2);
	height: 33%;
	float: left;
	overflow: hidden;
}
.list6 {
	position: relative;
	width: calc(100% / 2);
	height: 33%;
	float: left;
	overflow: hidden;
}
.list7 {
	position: relative;
	width: calc(100% / 2);
	height: 100%;
	float: left;
	overflow: hidden;
}
.list1 .bg, .list2 .bg, .list3 .bg, .list4 .bg, .list5 .bg, .list6 .bg, .list7 .bg {
	height: 100%;
}
.bg::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.3);
	opacity: .2;
	visibility: hidden;
	transition: all .4s;
	-moz-transition: all .4s;
	-webkit-transition: all .4s;
}
.title {
	opacity: 1;
}
.title span {
	opacity: 0;
	margin-top: 30px;/* margin: 40px 16%; */
}
.demo .more {
	bottom: 60px;
	opacity: 0;
}
}

@media only screen and (max-width: 1366px) and (min-width: 1024px) {


#link1 .li1 img {
	width: 100px;
	margin: 0px auto;
	display: block;
	-webkit-transition: -webkit-transform 1s ease-out;
	-moz-transition: -moz-transform 1s ease-out;
	-o-transition: -o-transform 1s ease-out;
	-ms-transition: -ms-transform 1s ease-out;
}



}






@font-face {
	font-family: "tw";
	src: url(https://omo-oss-file.thefastfile.com/portal-saas/new2021112918522744999/cms/file/30c269d8-d3b5-4bdf-b3de-49be2815bedf.otf);
}
@font-face {
	font-family: "tw";
	src: url(https://omo-oss-file.thefastfile.com/portal-saas/new2021112918522744999/cms/file/576bc017-f7e7-4a79-9d53-2b95b0740091.ttf);
}
@font-face {
	font-family: "tw";
	src: url(https://omo-oss-file.thefastfile.com/portal-saas/new2021112918522744999/cms/file/faca275f-655c-491a-a45c-0e65573fa540.woff);
}