﻿@charset "utf-8";

html {
-ms-touch-action: none;  /* 阻止windows Phone 的默认触摸事件 */
	height:100%;
	overflow-x: hidden;
}
body,div,p {
	margin: 0;
	padding: 0;
}
ul {
	list-style: none;
}
.pos_abs{ position:absolute;}

.none{display:none;}
.clear {
	zoom: 1;
}

	.clear:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
	}
body {
	width: 100%;
	*cursor: default;
	font: 16px/1.5 "Microsoft YaHei",Helvetica,STHeiti STXihei,Microsoft JhengHei,Arial; background:#fff;
}
.auto {
margin:0 auto;
}

.mt5{margin-top:5%;}
/* 箭头 */
.arrow_up {position:fixed; bottom:0.1rem; left:50%; width:0.9rem; height:0.4rem; z-index:9999;
-webkit-transform:translateX(-50%);
-webkit-animation:dong 1s linear 0s infinite alternate;
transform:translateX(-50%);
animation:dong 1s linear 0s infinite alternate;
}
@-webkit-keyframes dong {
from {
	bottom:0.1rem;
}
to {
	bottom:0.25rem;
}
}
@keyframes dong {
from {
	bottom:0.1rem;
}
to {
	bottom:0.25rem;
}
}


@-webkit-keyframes ball_s{  

    50%{
       transform:scale(1.1);
       -ms-transform:scale(1.1);
       -webkit-transform:scale(1.1);
       -moz-transform:scale(1.1);
       -o-transform:scale(1.1);
    }
    100%{
       transform:scale(1);
       -ms-transform:scale(1);
       -webkit-transform:scale(1);
       -moz-transform:scale(1);
       -o-transform:scale(1);
    }
  }

.ball_01,.ball_02,.ball_03,.ball_04{
animation: ball_s 1s infinite ease-in-out;
-ms-animation: ball_s 1s infinite ease-in-out;
-webkit-animation: ball_s 1s infinite ease-in-out;
-moz-animation: ball_s 1s infinite ease-in-out;
-o-animation: ball_s 1s infinite ease-in-out;
}

@-webkit-keyframes balls {
from {
	bottom:0.5rem;
	-webkit-transform:scale(1,1);
}
to {
	bottom:5.9rem;
	-webkit-transform:scale(0.2,0.2);
}
}
@keyframes balls {
from {
	bottom:0.5rem;
	transform:scale(1,1);
}
to {
	bottom:5.9rem;
	transform:scale(0.2,0.2);
}
}

.ball_ani{
animation:balls 1s linear;
-webkit-animation:balls 1s linear;
}


@-webkit-keyframes hh {
0% {
	-webkit-transform:scale(1,1);
	opacity:1;
}
50% {
	-webkit-transform:scale(1.3,1.3);
	opacity:0.5;
}
100% {
	-webkit-transform:scale(0.8,0.8);
	opacity:0;
	visibility:hidden!important;
}
}
@keyframes hh {
0% {
	transform:scale(1,1);
	opacity:1;
}
50% {
	transform:scale(1.3,1.3);
	opacity:0.5;
}
100% {
	transform:scale(0.8,0.8);
	opacity:0;
	visibility:hidden!important;
}
}


.hh_ani{
animation:hh 0.5s linear;
-webkit-animation:hh 0.5s linear;
}


.loading{ width:100%; height:100%; background:#f7fef8; position:absolute; margin:0 auto; z-index:10000;}
.loading img{ position:absolute; top:50%; left:50%; margin-top:-1.2rem; margin-left:-2.18rem;  z-index:10001;}

/* 自适应框架（设计图宽度） */
body {
	max-width: 7.5rem;
	margin: 0 auto;
}


.mask{ width:100%; height:100%; position:fixed; background:rgba(0,0,0,0.7); left:0; top:0; display:none; z-index:30;}
.mask span {
    font-size:0.3rem;
    position:fixed;
    right:0.1rem;
    top:0.1rem;
}
.fx_box {
    width: 300px;
    height: 60px;
    background: #fff;
    z-index: 2;
    left: 50%;
    top: 50%;
    margin-left: -150px;
    display: none;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    -moz-border-radius: 10px;
}
.fx_box img{ width:40px;}
.quit{ width:30px; height:30px; font-size:30px; position:absolute; right:-30px; top:-30px; color:#fff; cursor:pointer; z-index:33;}
.close {
color:#fff;
}

.menu{
  display: grid;
  grid-template-columns: 30% 20% 20% 30%;  
}
.page .menu input {
	width:0.3rem;height:0.3rem;background:#fff;border-radius:0.2rem;border:1px solid #A6A6A6;}

.page input {
	width:5.75rem;height:0.8rem;background:#fff;border-radius:0.2rem;border:1px solid #A6A6A6;font-size:0.3rem;padding-left:0.25rem;outline:none;margin-bottom:0.3rem;margin-top:0.1rem;
	}
.page textarea {
		width:5.75rem;height:auto;background:#fff;border-radius:0.2rem;border:1px solid #A6A6A6;font-size:0.3rem;padding-left:0.25rem;outline:none;margin-bottom:0.3rem;margin-top:0.1rem;
	}
.tabBox{margin-bottom: 3%;}	

.imgBox,.imgBoxtw {
	width: 6.6rem;
	margin-left: -0.3rem;margin-top:0.3rem;
}
.imgBox table ,.imgBoxtw table{
		float: left;
		_display: inline;
		width: 2rem;
		height: 2rem;
		margin: 0;
		padding: 0;
		margin-left: 0.1rem;
		margin-right: 0.1rem;
	}
.imgBox table tr td,.imgBoxtw table tr td{
			width: 2rem;
			height: 2rem;
			vertical-align: middle;
			text-align: center;
			background: #eee;margin:0;padding:0;position:relative;
	}
.imgBox table tr td span,.imgBoxtw table tr td span{
			font-size:0.3rem;color:#c00;position:absolute; right:0;top:-0.15rem;
	}

.imgBox table tr td img,.imgBoxtw table tr td img{
				display: block;
				padding: 0;
				margin: 0 auto;
				max-height: 2rem;
				max-width: 2rem;
	}

.detailsBox{ height:2.4rem; position: relative; }
.detailsBox textarea{ position: absolute; left:0;top:0;  height: 100%;}
.detailsBox .tip{ position: absolute; right:0.5rem; bottom:-0.2rem;font-size:0.26rem;}

.f16{font-size:0.7em;}
.f18{font-size:0.85em;}
.f20{font-size:0.9em;}
.f22{font-size:0.95em;}
.f24 {
    font-size: 1em;
}
.f26{font-size:1.05em;}
.f40{font-size:1.6em;}
.lh100{line-height:100%}
.lh120{line-height:120%}
.lh130 {
    line-height: 130%
}
.lh140{line-height:140%}
.lh150{line-height:150%}
.lh160 {
    line-height: 160%
}
.lh180{line-height:180%}
@media screen and (max-width: 640px) {
	.f16{font-size:0.7em;}
	.f18{font-size:0.85em;}
	.f20{font-size:0.9em;}
	.f22{font-size:0.95em;}
    .f24 {
        font-size: 1em;
    }
	.f26{font-size:1.05em;}
    .f40{font-size:1.6em;}
}

@media screen and (max-width: 414px) {
	.f16{font-size:0.5em;}
	.f18{font-size:0.65em;}
	.f20{font-size:0.7em;}
	.f22{font-size:0.75em;}
    .f24 {
        font-size: 0.8em;
    }
	.f26{font-size:0.85em;}
    .f40{font-size:1.6em;}
}

@media screen and (max-width: 400px) {
	.f16{font-size:0.5em;}
	.f18{font-size:0.65em;}
	.f20{font-size:0.7em;}
	.f22{font-size:0.75em;}
    .f24 {
        font-size: 0.8em;
    }
	.f26{font-size:0.85em;}
    .f40{font-size:1.6em;}
}

@media screen and (max-width: 392px) {
	.f16{font-size:0.45em;}
	.f18{font-size:0.6em;}
	.f20{font-size:0.65em;}
	.f22{font-size:0.7em;}
    .f24 {
        font-size: 0.75em;
    }
	.f26{font-size:0.8em;}
    .f40{font-size:1.5em;}
}

@media screen and (max-width: 385px) {
	.f16{font-size:0.45em;}
	.f18{font-size:0.6em;}
	.f20{font-size:0.65em;}
	.f22{font-size:0.7em;}
    .f24 {
        font-size: 0.75em;
    }
	.f26{font-size:0.8em;}
    .f40{font-size:1.5em;}
}
@media screen and (max-width: 375px) {
	.f16{font-size:0.45em;}
	.f18{font-size:0.6em;}
	.f20{font-size:0.65em;}
	.f22{font-size:0.7em;}
    .f24 {
        font-size: 0.75em;
    }
	.f26{font-size:0.8em;}
    .f40{font-size:1.5em;}
}
@media screen and (max-width: 359px) {
	.f16{font-size:0.4em;}
	.f18{font-size:0.5em;}
	.f20{font-size:0.55em;}
	.f22{font-size:0.6em;}
    .f24 {
        font-size: 0.65em;
    }
	.f26{font-size:0.7em;}
    .f40{font-size:1.3em;}
}