html,body {
  width: 100%;
  height: 100%;
  background-color: #Fff;
}

.img ,.topBox img{
  width: 100%;
}


.icon_css {
  font-size: 1.125rem;
}

.backup {
  cursor: pointer;
}

.body {
	width: 1264px;
    margin: 0 auto;
    position: relative;
    z-index: 9;
    background-color: #FFFFFF;
    padding: 24px 68px;
    margin-bottom: 2rem;
}

.backup {
  color: rgba(157, 157, 157, 1);
  font-size: 1.125rem;
}

.now_name {
  font-size: 1.125rem;
  color: rgba(25, 166, 255, 1);
}

.hand_text_box {
  margin-top: 2.5rem;
  width: 100%;
  position: relative;
}
.hand-body{
	width: calc(100% - 500px);
	position: relative;
	z-index: 10;
}
.hand_text1 {
  font-size: 2rem;
  color: #000;
  font-weight: 400;
  margin-bottom: 14px;
}

.hand_text2 {
  font-size: 1rem;
  color: #505050;
  line-height: 2rem;
}

.content {
  margin-top: 4.75rem;
}

.content_title {
  font-size: 1.125rem;
  color: #000;
  font-weight: 600;
  margin-bottom: 14px;
}

.content_box1 {
  color: #666666;
  font-size: 0.875rem;
}

.content_box1 p {
  font-size: 14px;
  color: #666;
  margin: 0.875rem 0;
}

.content_box2 p {
  margin: 0.875rem 0;
  color: #666666;
}

.content_box1 h4.tit,.content_box2 h4.tit {
  font-weight: 500;
  color: #000;
  font-size: 1rem;
}

.cir1 {
  width: 30px;
  height: 30px;
  background: linear-gradient(180deg, rgba(237, 79, 115, 1) 0%, rgba(232, 49, 148, 1) 100%);
  border-radius: 50%;
  opacity: 1;
  position: absolute;
  top: 0;
  left: 22.375rem;
}

.cir2 {
  width: 66px;
  height: 66px;
  background: linear-gradient(180deg, rgba(158, 79, 237, 1) 0%, rgba(232, 49, 232, 1) 100%);
  border-radius: 50%;
  opacity: 1;
  position: absolute;
  top: 0;
  right: 43.4rem;
}

.cir3 {
  width: 100px;
  height: 100px;
  background: linear-gradient(180deg, rgba(237, 164, 79, 1) 0%, rgba(232, 119, 49, 1) 100%);
  border-radius: 50%;
  opacity: 1;
  position: absolute;
  top: 24.75rem;
  left: -2rem;
}

.cir4 {
  width: 40px;
  height: 40px;
  background: linear-gradient(360deg, rgba(79, 237, 122, 1) 0%, rgba(170, 250, 216, 1) 100%);
  border-radius: 50%;
  opacity: 1;
  position: absolute;
  top: 34.5rem;
  left: 6.875rem;
}

.nav-tip{
	padding: 0;
	width: 1400px;
}
.bg-box{
	position: absolute;
	right: 0;
	top: 0;
	width: 420px;
	z-index: 8;
	/* opacity: 0.5; */
}
.layui-form-item{
	background-color: rgba(250, 250, 250, 1);
	line-height: 32px;
	margin-bottom: 0;
	margin-top: 24px;
}
.other-box{
	width: 1400px;
	height: 176px;
	margin: 0 auto;
	margin-top: 36px;
	margin-bottom: 36px;
	padding-bottom: 14px;
}
.other-box .text-h4{
	font-size: 18px;
}
.other-box .layui-col-md5{
	width: 100%;
}

.other-box .grid-demo-bg2{
	width: calc(25% - 11px);
	height: 100%;
	float: left;
    margin-right: 14px;
    margin-top: 14px;
	margin-left: 0;
}

.other-box .grid-demo-bg2:nth-child(4){
	margin-right: 0;
}
.layui-col-md5 .service-text{
	width: calc(100% - 48px);
    height: calc(100% - 48px);
    padding: 24px;
}
.grid-demo p{
	-webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
}
.footer{
	position: fixed;
	bottom: 0;
	z-index: 10;
}

@media only screen and (max-width: 1400px) {
	.body{ width: 948px;margin-top: 0.5rem;padding: 38px; }
	.other-box{ width: 1024px;height: 327px; }
	.other-box .grid-demo-bg2{ width: calc(50% - 11px);height: 137px; }
	.other-box .grid-demo-bg2:nth-child(2){ margin-right: 0; }
}
@media only screen and (max-width: 1024px){
	.body{ width: 692px;margin-top: 0.5rem;padding: 38px; }
	.other-box{ width: 768px;height: 327px; }
	.hand-body{ width: 100%; }
	.layui-col-md5 .grid-demo{ margin-bottom: 0; }
	.bg-box{ position: inherit;opacity: 1; margin-top: 24px; }
}

@media only screen and (max-width: 768px){
	.body{ width: calc(100% - 56px); padding: 14px;margin: 0 14px;margin-top: 4.6rem; margin-bottom: 1rem; }
	.other-box{ width: calc(100% - 28px);height: 630px; }
	.content{ margin-top: 3.75rem; }
	.other-box .grid-demo-bg2{ width: 100%; }
	.hand_text_box{ margin-top: 1.5rem; }
}

@media only screen and (max-width: 449px){
	
}
@media only screen and (max-width: 375px){
	
}