/* 加载所有样式 */
.loading{ position:fixed; top:0; left:0; width:100%; height:100%; background:#444; z-index:999998;}
.load_box{position:absolute; top:50%; left:0; width:100%}
.load_text{ color:#fff; font-size:14px; margin:0; height:20px; line-height:20px; width:100%; text-align:center; /*position:absolute; top:50%; left:0;*/}
.hidden{ display:none}
#network{position:fixed; top:10px; left:5%; width:90%; height:30px; line-height:30px; color:#fff; text-align:center; background:rgba(0,0,0,0.6); z-index:999999; border-radius:20px; display:none; font-size:14px}
/* 加载1 */
.load_01 .spinner{width:70px; text-align:center; margin:0 auto;}
.load_01 .spinner > div {width: 18px; height:18px; border-radius: 100%;display: inline-block;-webkit-animation: bouncedelay 1.4s infinite ease-in-out;animation: bouncedelay 1.4s infinite ease-in-out;-webkit-animation-fill-mode: both; animation-fill-mode: both;}
.load_01 .loadpoint{background:#fff;}
.load_01 .load_text{margin-top:10px}
.load_01 .spinner .bounce1 {-webkit-animation-delay: -0.32s;animation-delay: -0.32s; }
.load_01 .spinner .bounce2 {-webkit-animation-delay: -0.16s;animation-delay: -0.16s;}
@-webkit-keyframes bouncedelay {0%, 80%, 100% { -webkit-transform: scale(0.0) }40% { -webkit-transform: scale(1.0) }}
@keyframes bouncedelay {0%, 80%, 100% {transform: scale(0.0);-webkit-transform: scale(0.0);} 40% {transform: scale(1.0);  -webkit-transform: scale(1.0);}}

/* 加载2 */
.load_02 .spinner{width:40px;height:40px; margin:0 auto;}
.load_02 .container1 > div,.load_02 .container2 > div,.load_02 .container3 > div{width:10px;height:10px;border-radius:100%;position:absolute;-webkit-animation:bouncedelay 1.2s infinite ease-in-out;animation:bouncedelay 1.2s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
.load_02 .loadpoint{background:#fff;}
.load_02 .load_text{margin-top:20px}
.load_02 .spinner .load-container{position:absolute;width:40px;height:40px;}
.load_02 .container2{-webkit-transform:rotateZ(45deg);transform:rotateZ(45deg);}
.load_02 .container3{-webkit-transform:rotateZ(90deg);transform:rotateZ(90deg);}
.load_02 .circle1{top:0;left:0;}
.load_02 .circle2{top:0;right:0;}
.load_02 .circle3{right:0;bottom:0;}
.load_02 .circle4{left:0;bottom:0;}
.load_02 .container2 .circle1{-webkit-animation-delay:-1.1s;animation-delay:-1.1s;}
.load_02 .container3 .circle1{-webkit-animation-delay:-1.0s;animation-delay:-1.0s;}
.load_02 .container1 .circle2{-webkit-animation-delay:-0.9s;animation-delay:-0.9s;}
.load_02 .container2 .circle2{-webkit-animation-delay:-0.8s;animation-delay:-0.8s;}
.load_02 .container3 .circle2{-webkit-animation-delay:-0.7s;animation-delay:-0.7s;}
.load_02 .container1 .circle3{-webkit-animation-delay:-0.6s;animation-delay:-0.6s;}
.load_02 .container2 .circle3{-webkit-animation-delay:-0.5s;animation-delay:-0.5s;}
.load_02 .container3 .circle3{-webkit-animation-delay:-0.4s;animation-delay:-0.4s;}
.load_02 .container1 .circle4{-webkit-animation-delay:-0.3s;animation-delay:-0.3s;}
.load_02 .container2 .circle4{-webkit-animation-delay:-0.2s;animation-delay:-0.2s;}
.load_02 .container3 .circle4{-webkit-animation-delay:-0.1s;animation-delay:-0.1s;}
@-webkit-keyframes bouncedelay{0%,80%,100%{-webkit-transform:scale(0.0)}40%{-webkit-transform:scale(1.0)}}
@keyframes bouncedelay{0%,80%,100%{transform:scale(0.0);-webkit-transform:scale(0.0);}40%{transform:scale(1.0);-webkit-transform:scale(1.0);}}

/* 加载3 */
.load_03 .spinner{width:60px;height:60px;text-align:center;font-size:10px; margin:0 auto}
.load_03 .spinner > div{height:100%;width:6px;display:inline-block;-webkit-animation:stretchdelay 1.2s infinite ease-in-out;animation:stretchdelay 1.2s infinite ease-in-out;}
.load_03 .loadpoint{background:#fff;}
.load_03 .load_text{margin-top:10px}
.load_03 .spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s;}
.load_03 .spinner .rect3{-webkit-animation-delay:-1.0s;animation-delay:-1.0s;}
.load_03 .spinner .rect4{-webkit-animation-delay:-0.9s;animation-delay:-0.9s;}
.load_03 .spinner .rect5{-webkit-animation-delay:-0.8s;animation-delay:-0.8s;}
@-webkit-keyframes stretchdelay{0%,40%,100%{-webkit-transform:scaleY(0.4)}20%{-webkit-transform:scaleY(1.0)}}
@keyframes stretchdelay{0%,40%,100%{transform:scaleY(0.4);-webkit-transform:scaleY(0.4);}20%{transform:scaleY(1.0);-webkit-transform:scaleY(1.0);}}

/* 加载4 */
.load_04 .spinner{width:60px;height:60px; -webkit-animation:rotateplane 1.2s infinite ease-in-out;animation:rotateplane 1.2s infinite ease-in-out; margin:0 auto}
.load_04 .loadpoint{background:#fff;}
.load_04 .load_text{margin-top:20px}
@-webkit-keyframes rotateplane{0%{-webkit-transform:perspective(120px)}50%{-webkit-transform:perspective(120px) rotateY(180deg)}100%{-webkit-transform:perspective(120px) rotateY(180deg)  rotateX(180deg)}}
@keyframes rotateplane{0%{transform:perspective(120px) rotateX(0deg) rotateY(0deg);-webkit-transform:perspective(120px) rotateX(0deg) rotateY(0deg)}50%{transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg);-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg)}100%{transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);}}

/* 加载5 */
.load_05 .spinner{width:60px;height:60px;position:relative;margin:0 auto;}
.load_05 .double-bounce1,.load_05 .double-bounce2{width:100%;height:100%;border-radius:50%;opacity:0.6;position:absolute;top:0;left:0;-webkit-animation:bounce 2.0s infinite ease-in-out;animation:bounce 2.0s infinite ease-in-out;}
.load_05 .loadpoint{background:#fff;}
.load_05 .load_text{margin-top:10px}
.load_05 .double-bounce2{-webkit-animation-delay:-1.0s;animation-delay:-1.0s;}
@-webkit-keyframes bounce{0%,100%{-webkit-transform:scale(0.0)}50%{-webkit-transform:scale(1.0)}}
@keyframes bounce{0%,100%{transform:scale(0.0);-webkit-transform:scale(0.0);}50%{transform:scale(1.0);-webkit-transform:scale(1.0);}}

/* 加载6 */
.load_06 .spinner{margin:0 auto;width:64px;height:64px;position:relative;}
.load_06 .loadpoint{background:#fff;}
.load_06 .cube1,.load_06 .cube2{width:30px;height:30px;position:absolute;top:0;left:0;-webkit-animation:cubemove 1.8s infinite ease-in-out;animation:cubemove 1.8s infinite ease-in-out;}
.load_06 .cube2{-webkit-animation-delay:-0.9s;animation-delay:-0.9s;}
.load_06 .load_text{margin-top:25px}
@-webkit-keyframes cubemove{25%{-webkit-transform:translateX(42px) rotate(-90deg) scale(0.5)}50%{-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg)}75%{-webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(0.5)}100%{-webkit-transform:rotate(-360deg)}}
@keyframes cubemove{25%{transform:translateX(42px) rotate(-90deg) scale(0.5);-webkit-transform:translateX(42px) rotate(-90deg) scale(0.5);}50%{transform:translateX(42px) translateY(42px) rotate(-179deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-179deg);}50.1%{transform:translateX(42px) translateY(42px) rotate(-180deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg);}75%{transform:translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);-webkit-transform:translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);}100%{transform:rotate(-360deg);-webkit-transform:rotate(-360deg);}}

/* 加载7 */
.load_07 .spinner{margin:0 auto;width:90px;height:90px;position:relative;text-align:center;-webkit-animation:rotate 2.0s infinite linear;animation:rotate 2.0s infinite linear;}
.load_07 .loadpoint{background:#fff;}
.load_07 .dot1,.load_07 .dot2{width:60%;height:60%;display:inline-block;position:absolute;top:0;border-radius:100%;-webkit-animation:bounce 2.0s infinite ease-in-out;animation:bounce 2.0s infinite ease-in-out;}
.load_07 .dot2{top:auto;bottom:0px;-webkit-animation-delay:-1.0s;animation-delay:-1.0s;}
.load_07 .load_text{margin-top:20px}
@-webkit-keyframes rotate{100%{-webkit-transform:rotate(360deg)}}
@keyframes rotate{100%{transform:rotate(360deg);-webkit-transform:rotate(360deg)}}
@-webkit-keyframes bounce{0%,100%{-webkit-transform:scale(0.0)}50%{-webkit-transform:scale(1.0)}}
@keyframes bounce{0%,100%{transform:scale(0.0);-webkit-transform:scale(0.0);}50%{transform:scale(1.0);-webkit-transform:scale(1.0);}}

/* 加载8 */
.load_08 .spinner{width:40px;height:40px;margin:0 auto;}
.load_08 .circle{width:40px;height:40px; border-radius:100%;-webkit-animation:scaleout 1.0s infinite ease-in-out;animation:scaleout 1.0s infinite ease-in-out; position:relative}
.load_08 .loadpoint{background:#fff;}
.load_08 .load_text{margin-top:10px}
@-webkit-keyframes scaleout{0%{-webkit-transform:scale(0.0)}100%{-webkit-transform:scale(1.0);opacity:0;}}
@keyframes scaleout{0%{transform:scale(0.0);-webkit-transform:scale(0.0);}100%{transform:scale(1.0);-webkit-transform:scale(1.0);opacity:0;}