@font-face {
        font-family: "hyykh";
        src:url("https://cdn-shop.redmagic.com/shop-soa-static/font/hyykh/hyykh45W.ttf")  format("truetype");
        font-style: normal;
        font-weight:400;
		unicode-range: U+4E00-9FD5;
    }
@font-face {
        font-family: "hyykh";
        src:url("https://cdn-shop.redmagic.com/shop-soa-static/font/hyykh/hyykh55W.ttf")  format("truetype");
        font-style: normal;
        font-weight:500;
		unicode-range: U+4E00-9FD5;
    }
@font-face {
	        font-family: "hyykh";
	        src:url("https://cdn-shop.redmagic.com/shop-soa-static/font/hyykh/hyykh55W.ttf")  format("truetype");
	        font-style: normal;
	        font-weight:bold;
			unicode-range: U+4E00-9FD5;
	    }
@font-face {
        font-family: "hyykh";
        src:url("https://cdn-shop.redmagic.com/shop-soa-static/font/hyykh/hyykh65W.ttf")  format("truetype");
        font-style: normal;
        font-weight:600;
		unicode-range: U+4E00-9FD5;
    }
@font-face {
        font-family: "hyykh";
        src:url("https://cdn-shop.redmagic.com/shop-soa-static/font/hyykh/hyykh65W.ttf")  format("truetype");
        font-style: normal;
        font-weight:700;
		unicode-range: U+4E00-9FD5;
    }
@font-face {
        font-family: "hyykh";
        src:url("https://cdn-shop.redmagic.com/shop-soa-static/font/hyykh/hyykh85W.ttf")  format("truetype");
        font-style: normal;
        font-weight:800;
		unicode-range: U+4E00-9FD5;
    }
body, h1, h2, h3, h4, h5, h6,body *{
    font-family: "思源黑体","hyykh","Microsoft Yahei","微软雅黑",Arial,Helvetica,sans-serif;
}
		
body, h1, h2, h3, p, dl, dd, ol, ul, th, td, form, fieldset, input, button, textarea { margin: 0; padding: 0 ;}
html { -webkit-text-size-adjust: none; word-wrap: break-word;font-size: 16px!important; }
h1, h2, h3 { font-size: 100% }
ol, ul { list-style: none }
table { border-collapse: collapse; border-spacing: 0; empty-cells: show; font-size: inherit }
fieldset, img { border: 0 }
cite, em, s, i, b { font-style: normal }
input, button, textarea, select { font-size: 100% }
body, input, button, textarea, select, option { font-size: normal }
a, input, textarea { text-decoration: none; outline: 0 }
li, img, label, input { vertical-align: middle }
var { font-style: normal }
ins { text-decoration: none }
body { font-size: 20px; background-color: #FFF; }
.viewport { max-width: 720px; margin: auto; overflow: hidden }
.mlr20 { margin: auto 1em }
.m20 { margin: 1em 0 }
.m30 { margin: 1.5em 0 }
.mt20 { margin-top: 1em }
.mb20 { margin-bottom: 1em }
.mt40 { margin-top: 2em }
.mb40 { margin-bottom: 2em }
.mt-20 { margin-top: -1em }
.hide { display: none }
.h_box { display: -webkit-box; display: box; width: 100% }
.h_box .spacer { width: 1em }
.flex_1 { -webkit-box-flex: 1; box-flex: 1; width: 100% }
.flex_20 { width: 1em }
.imgurl img { width: 100% }
.imgurl { display: block; background: #fff url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAL4AAAC+CAMAAAC8qkWvAAAANlBMVEXp6enp6evq6urs7Ozt7e3v7+/w8PDy8vLz8/P09PT19fb29vb39/f5+fn6+vr7+/v9/f3+/v7HFDeVAAAChElEQVR42u3c0ZKiMBCF4TOAkAYkOe//snsRGJ2tHS/UWqD8+4akMOVHbEysotV46hB8+PDhw4cPHz58+PDhw4cPHz58+PDhw4cPHz58+PDhw4cPHz58+PDhw38L/0vPx958vR778fWe2Ievt8UefOkAfh1B/7xfh9A/7dcx9M/6D8PXf+QL/lv8Oowe/kfwv3QYvw4z+fDhw4cPHz58+PDhw4cPHz78l/mNbfsiqbdte66HtPWTt5hbKWpzqYOv7vae/dg47WTbU18Pndqw7eii2Dki26VVP9v2nCRJrR27J0+TbU+S1BT3ktLa3fqtvdSXhaRhOyuFXfbP/WTbgyQtbmp/ndTab+qnM9lzzbFtyvM2bmd+tnPzD/78F3/6we9d7OsB+P1SHQ/5uU51f3d2sN0egH+xnR7ym2vNnRu/KVlXOx2Ar2S7+51ve8uTb35y0mDnI/B1tZff+Tniaufunp/dSsXuj8Bvsj09zP1kl+bGv3yvZkfga7BdHvGV7XTjT54jYqrXtD9fk203PxamXPQbvyllXRrub949+LEClpXfbTM61Lt15Xd1kVr5ab3E9OPm3YE/ZOckSW2pfM320kupbuWU7NKpXyp0spdWQ1m/iC6+bSL24C+2171LWvlad525v/vatH1ttx1nsW3HNtrNbvwUERFpbX8nVET0t2ZERHSS+tqsg/ptdPBzBT58+PDhw4cPHz58+PDhw/9k/skfAuYJcvjP80f4b9F/ZuHT2cvOTl70d/aSy7MXvJ693Hg8ebH3my7gtfcfX40z/9HB3gEfPnz48OHDhw8fPnz48OHDhw8fPnz48OHDhw8fPnz48OHDhw8fPnz48MdxHP8ATvd+w9b35W0AAAAASUVORK5CIIA=') 50% 50% no-repeat; -webkit-background-size: 40% auto; -moz-background-size: 40% auto; -ms-background-size: 40% auto; -o-background-size: 40% auto; background-size: 40% auto; width: 100% }
@media only screen and (max-width:300px) {
    body { font-size: 8.33333px }
    .viewport { max-width: 300px }
}
@media only screen and (max-width:310px) and (min-width:300px) {
    body { font-size: 8.33333px }
    .viewport { max-width: 310px }
}
@media only screen and (max-width:320px) and (min-width:310px) {
    body { font-size: 8.61111px }
    .viewport { max-width: 320px }
}
@media only screen and (max-width:350px) and (min-width:320px) {
    body { font-size: 8.88889px }
    .viewport { max-width: 350px }
}
@media only screen and (max-width:360px) and (min-width:350px) {
    body { font-size: 9.72222px }
    .viewport { max-width: 360px }
}
@media only screen and (max-width:400px) and (min-width:360px) {
    body { font-size: 10px }
    .viewport { max-width: 400px }
}
@media only screen and (max-width:470px) and (min-width:400px) {
    body { font-size: 11.11111px }
    .viewport { max-width: 470px }
}
@media only screen and (max-width:480px) and (min-width:470px) {
    body { font-size: 13.05556px }
    .viewport { max-width: 480px }
}
@media only screen and (max-width:540px) and (min-width:480px) {
    body { font-size: 13.33333px }
    .viewport { max-width: 540px }
}
@media only screen and (max-width:560px) and (min-width:540px) {
    body { font-size: 15px }
    .viewport { max-width: 560px }
}
@media only screen and (max-width:570px) and (min-width:560px) {
    body { font-size: 15.55556px }
    .viewport { max-width: 570px }
}
@media only screen and (max-width:630px) and (min-width:570px) {
    body { font-size: 15.83333px }
    .viewport { max-width: 630px }
}
@media only screen and (max-width:640px) and (min-width:630px) {
    body { font-size: 17.5px }
    .viewport { max-width: 640px }
}
@media only screen and (max-width:710px) and (min-width:640px) {
    body { font-size: 17.77778px }
    .viewport { max-width: 710px }
}
@media only screen and (max-width:720px) and (min-width:710px) {
    body { font-size: 19.72222px }
    .viewport { max-width: 720px }
}
@media only screen and (min-width:720px) {
    body { font-size: 20px }
    .viewport { width: 720px }
    .form-input { border: 1px solid #ccc; overflow: hidden }
    .form-input>input { border: 0; width: 100%; font-size: 1.4em; padding: .78571em; color: #333 }
    .form-input>input::-webkit-input-placeholder { color: #ccc }
    html, body, #wrapper { height: 100% }
    body { background-color: #fff }
    .global-loading { position: absolute; top: 7.5em; width: 100%; text-align: center }
    .global-loading .global-loading-logo .global-loading-anim { height: 7.5em }
    .global-loading .global-loading-text { font-size: 1.2em; line-height: 1.5em; color: #333 }
    .global-loading .global-loading-text .hot { font-weight: 700; font-size: 1.16667em; padding: 0 .25em }
    .v-enter { position: absolute; top: 0; width: 100%; min-height: 100%; -o-animation: fadein .2s; -moz-animation: fadein .2s; -webkit-animation: fadein .2s; animation: fadein .2s }
    .v-leave { position: absolute; top: 0; width: 100%; min-height: 100%; -o-animation: fadeout .12s; -moz-animation: fadeout .12s; -webkit-animation: fadeout .12s; animation: fadeout .12s }
    @-webkit-keyframes fadein {
        0% { opacity: .5 }
        100% { opacity: 1 }
    }
    @-moz-keyframes fadein {
        0% { opacity: .5 }
        100% { opacity: 1 }
    }
    @-ms-keyframes fadein {
        0% { opacity: .5 }
        100% { opacity: 1 }
    }
    @keyframes fadein {
        0% { opacity: .5 }
        100% { opacity: 1 }
    }
    @-webkit-keyframes fadeout {
        0% { opacity: 1 }
    }
    @-moz-keyframes fadeout {
        0% { opacity: 1 }
    }
    @-ms-keyframes fadeout {
        0% { opacity: 1 }
    }
    @keyframes fadeout {
        0% { opacity: 1 }
    }
    .xm-input-number { display: inline-block; vertical-align: middle; border: 1px solid #eee }
    .xm-input-number .input-sub, .xm-input-number .input-add { display: inline-block; width: 3em; height: 3em; position: relative; vertical-align: middle; background-color: #fafafa; -webkit-transition: background-color .3s; -webkit-transition-delay: linear; -moz-transition: background-color .3s linear; -o-transition: background-color .3s linear; transition: background-color .3s linear 0s }
    .xm-input-number .input-sub:after, .xm-input-number .input-add:after { content: '\0020'; display: block; position: absolute; top: 50%; left: 50%; width: 1.2em; height: .2em; margin: -.1em 0 0 -.6em; -webkit-border-radius: .1em; -moz-border-radius: .1em; -ms-border-radius: .1em; -o-border-radius: .1em; border-radius: .1em; background-color: #ddd }
    .xm-input-number .input-add:before { content: '\0020'; display: block; position: absolute; top: 50%; left: 50%; width: .2em; height: 1.2em; margin: -.6em 0 0 -.1em; -webkit-border-radius: .1em; -moz-border-radius: .1em; -ms-border-radius: .1em; -o-border-radius: .1em; border-radius: .1em; background-color: #ddd }
    .xm-input-number .input-num { vertical-align: middle; display: inline-block; min-width: 1.7em; padding: 0 .6em; height: 3em; line-height: 3em; text-align: center }
    .xm-input-number .input-num span { font-size: 1.6em; color: #51555a }
    .xm-input-number .active { background-color: #f4f4f4 }
    .xm-input-number .active:after, .xm-input-number .active:before { background-color: #999 }
    .xm-button { display: block; -webkit-border-radius: .3em; -moz-border-radius: .3em; -ms-border-radius: .3em; -o-border-radius: .3em; border-radius: .3em; background-color: #f60; text-align: center; height: 4em; line-height: 4em }
    .xm-button span, .xm-button a { font-size: 1.6em; color: #fff; display: block }
    .xm-button:active, .xm-button:hover { -webkit-box-shadow: rgba(0, 0, 0, .3) 0 .1em .2em .05em inset; -moz-box-shadow: rgba(0, 0, 0, .3) 0 .1em .2em .05em inset; -ms-box-shadow: rgba(0, 0, 0, .3) 0 .1em .2em .05em inset; -o-box-shadow: rgba(0, 0, 0, .3) 0 .1em .2em .05em inset; box-shadow: rgba(0, 0, 0, .3) 0 .1em .2em .05em inset }
    .xm-button-gray { background-color: #fdfdfd; border: 1px solid #bbb }
    .xm-button-gray span { color: #464646 }
}

/* header_index css  */
.header-index { position: relative; top: 0; left: 0; border-bottom: 1px solid #ccc; background: #fff; width: 100%;z-index:99; }
.header-index .tit { text-align: center; height: 5em }
.header-index .tit h2 { padding: 1.2em 0 0 }
.header-index .tit span { font-size: 2em; color: #464646; font-weight: 300 }
.header-index .left { position: absolute; top: 0; left: 0 }
.header-index .left .home { display: inline-block; padding: .8em 1.5em }
.header-index .left .home span { padding: .2em 0; display: inline-block; font-size: 2em; color: #464646; color: #fff; width: 7em }
.header-index .left .home .icon-home { padding: 0; font-size: 2.8em }
.header-index .right { position: absolute; top: 0; right: 0; padding: 0 1em 0 0 }
.header-index .right li { float: left }
.header-index .right li a { display: block; padding: 1em .5em 1em .7em; position: relative }
.header-index .right li .ico { display: inline-block; width: 3em; height: 3em }
.header-index .right .user .icon-gerenzhongxin { font-size: 2.6em; color: #464646 }
.header-index .right .cart .icon-gouwuche { font-size: 2.6em; color: #464646 }
.header-index .right .cart .tip { position: absolute; top: .8em; right: 0; width: 1.5em; height: 1.4em; padding-top: .1em; text-align: center; background-color: #ffc703; color: #783600; -webkit-border-radius: .3em; -moz-border-radius: .3em; -ms-border-radius: .3em; -o-border-radius: .3em; border-radius: .3em }



.headerFixed{
	position: fixed;
	left:0px;
	top:0px;  
}
/* header_global css   position: relative;*/

#header {background-color: #fff;z-index:99;height: 3rem; width: 100%;display:flex;
justify-content:space-between;
align-items:center;}
/* #header .tit { text-align: center;height:100%;} */
/* #header .tit h2 { padding: 1.2em 0 0 }
#header .tit span { font-size: 2em; color: #464646; font-weight: 300; display: inline-block; } */
#header .left { margin-left:1rem;height:100%;;display:flex;justify-content:center;align-items:center;}
#header .left .home {height: 100%;height:100%;;display:flex;justify-content:center;align-items:center;min-width: 1.5rem;}
#header .left .home span { display: inline-block; font-size: 2em; color: #464646; }
#header .left .home .icon-home { padding: 0; font-size: 2.8em; color: #fff; }
#header .left .home .back {width:1.5rem}
#header .left .menu{width:1.5rem}

#header .center {height:100%;display:flex;justify-content:center;align-items:center;}
#header .center span{font-size: 1rem;}
#header .center .logo{
	width:2.2rem
}
#header .center .hmlogo{
	width:4.5em
}

#header .right {margin-right:1rem;height:100%; display:flex;
justify-content:flex-end;
align-items:center;/* width: 20%; */
min-width: 3%;
}
#header .right ul>li { float: left ;position: relative;}
#header .right ul>li a { position: relative }
#header .right ul>li .ico { display: inline-block; width: 3em; height: 3em }
#header .right .user .icon-gerenzhongxin { font-size: 2.6em; color: #464646 }
#header .right .cart{
	position: relative;
}
#header .right a img{
	width:1.5rem;
	min-width: 1.5rem;
}
.icon-caddie{
	font-size: 1.6rem;
	font-weight: 900!important;
	color: rgb(50,50,50);
}

#header .right .message{
	position: relative;
}

.cartCount{
	background: #DE634F;
	    border-radius: 50%;
	    font-size: 0.7rem;
	    color: #fff;
	    display: flex;
	    justify-content: center;
	    align-items: center;
	    position: absolute;
	    right: -5px;
	    top: -5px;
	    width: 15px;
	    height: 15px;
		font-weight: normal;
}
.messageTip{
				position: absolute;
        top: -3px;
        right: -5px;
    width: 16px;
    height: 16px;
    background: rgb(255,94,94);
    color: #fff;
    display: none;
    justify-content: center;
    align-items: center;
    font-size: 0.7rem;
    border-radius: 50%;
}

.headerMain .siderBar{
	width:100%;
	 height: 100%;
	display: inline-block;
	 padding:4rem 2rem 2rem 2rem;
	  background: white;
	  position: absolute;
	  top:0; 
	  z-index: 1000;
	  left:-100%;
	  box-sizing: border-box;
	  overflow: auto;
}

.headerMain .siderBar ul{
   display:flex;
   flex-direction: column;
   justify-content:flex-start;
   align-items:center;
   
   width:100%;
   box-sizing: border-box;
}
.headerMain .siderBar ul .user{
	border: none;
	margin-bottom:1rem;
	/* display:flex;
	justify-content:space-between;
	align-items:center; */
}
.headerMain .siderBar ul .hasLogin{
	width:100%;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.headerMain .siderBar ul .user a{
	width:100%;
	/* display:flex; */
	/* justify-content:space-between; */
	/* align-items:center; */
}
.headerMain .siderBar ul .user .unlogin span{
	color: rgb(157,157,157);
	font-size: 0.9rem;
}
.headerMain .siderBar ul .user .unlogin .login{
	color: rgb(255,94,94);
}
.headerMain .siderBar ul .user .head{
	width:3.3rem;
	height: 3.3rem;
	border-radius: 50%;
}


.headerMain .siderBar ul li{
	width:100%;
	height:3.5rem;
	border-bottom: 1px solid #DCDCDC;
	
}
.headerMain .siderBar ul li a{
	display: inline-block;
	width:100%;
	height:100%;
	line-height: 3.5rem;
	font-size: 0.95rem;
	color: rgb(102,102,102);
}
.headerMain .siderBar ul li:last-child{

	border-bottom: none;

}
.headerMain .siderBar ul li span{
	font-size: 0.95rem;
	color: rgb(102,102,102);
}

.headerMain .siderBar .siderSearch{
	    width: 100%;
	    display: inline-block;
	    height: 3.15rem;
	    padding-left: 3rem;
	    font-size: 0.95rem;
	    color: #999999;
	    line-height: 3.15rem;
	    position: relative;
	    background: #F8F8F8;
	    border-radius: 0.3rem;
		margin-top:1.5rem;
		box-sizing: border-box;
}
.headerMain .siderBar .siderSearch img{
	    position: absolute;
	    left: 0.8rem;
	    top:calc((3.15rem/2 - 0.6rem /2)/2);
	    width: 1.75rem;
}
.siderClose{
	position: absolute;
	left:1.3rem;
	top:2rem;
	width:1.6rem;
}

/* page-index css */
.page-index {background: #fff}
.page-index .nav-wrap .swipe { position: relative; visibility: hidden; overflow: hidden }
.page-index .nav-wrap .swipe-wrap { overflow: hidden; position: relative }
.page-index .nav-wrap .swipe-wrap>div { float: left; width: 100%; position: relative }
.page-index .nav-wrap .swipe-wrap>div:after { content: "\0020"; position: absolute; top: 50%; width: .7em; height: .7em; margin-top: -.35em; border-right: 1px solid #e8340e; border-bottom: 1px solid #e8340e; z-index: 2 }
.page-index .nav-wrap .swipe-wrap>div:first-child:after { right: .7em; -webkit-transform: rotate(-45deg); transform: rotate(-45deg) }
.page-index .nav-wrap .swipe-wrap>div:last-child:after { left: .7em; -webkit-transform: rotate(135deg); transform: rotate(135deg) }
.page-index .title { padding:1.4em 0; margin-top: .5em; text-align: center;background: #F6F6F6}
.page-index .title span { font-size: 1.9em; color: #333 }
.page-index .slider { background-color: #fff; overflow: hidden; position: relative }
.page-index .slider .swipe-wrap { overflow: hidden; position: relative }
.page-index .slider .swipe-wrap>div { float: left; position: relative; text-align: center; overflow: hidden }
.page-index .slider .swipe-wrap>div a { display: block }
.page-index .slider .swipe-wrap>div img { width: 100% }
.page-index .slider .swipe-nav { position: absolute; bottom: .5em; text-align: center; width: 100% }
.page-index .slider .swipe-nav span { display: inline-block; width: .8em; height: .8em; margin: 0 .4em; -webkit-border-radius: .8em; -moz-border-radius: .8em; -ms-border-radius: .8em; -o-border-radius: .8em; border-radius: .8em; background: #FFF; filter: alpha(Opacity=60); opacity: .6; box-shadow: 0 0 1px #ccc }
.page-index .slider .swipe-nav span.on { filter: alpha(Opacity=90); opacity: .9; background: #f8f8f8; box-shadow: 0 0 2px #ccc }
.page-index .nav-index { background-color: #fff }
.page-index .nav-index ul { display: table; width: 100%; border-collapse: collapse; /*border-bottom: 1px solid #f6f6f6*/ }
.page-index .nav-index ul:first-child { /*border-top: 1px solid #f6f6f6*/ }
.page-index .nav-index li { display: table-cell; width: 25%; }
.page-index .nav-index li:first-child { border-left: 0 none }
.page-index .nav-index li a {display: block;width: 100%;height: 6.5em;text-align: center;overflow: hidden;margin-top: 1.7em;border-right:1px solid #F6F6F6;}
.page-index .nav-index li a .icon { display: block; margin: 0 auto; margin-bottom: .3em }
.page-index .nav-index li a .icon:before {font-size: 3.1em;color: #5c6066;line-height: 1.375em;}
.page-index .nav-index li a .t {color: #333;font-size: 1.3em;}
.page-index .nav-index li a.red .t { color: red }
.page-index .nav-index li a.red .icon:before { color: red }
.page-index .card .col2 { display: -webkit-box; display: -moz-box; display: -ms-box; display: -o-box; display: box; border-bottom: 6px solid #f6f6f6 }
.page-index .card .col2 .row1, .page-index .card .col2 .row2, .page-index .card .col2 .rows { -webkit-box-flex: 1; -moz-box-flex: 1; -ms-box-flex: 1; -o-box-flex: 1; box-flex: 1; border-left: 6px solid #f6f6f6 }
.page-index .card .col2 .row1:first-child, .page-index .card .col2 .row2:first-child, .page-index .card .col2 .rows:first-child { border-left: 0 none }
.page-index .card .col2 .mg-bor-no-left { border-left: 0 none }
.page-index .card .rows { position: relative }
.page-index .card .rows .row1, .page-index .card .rows .row2 { width: 100%; display: block }
.page-index .card .row1 .imgurl { height: 100%; min-height: 10em }
.page-index .card .row2 { overflow: hidden }
.page-index .card .row2 .imgurl { height: 100%; min-height: 20em }
.page-index .card .mg-bor-top { border-top: 6px solid #f6f6f6 }
.page-index .show_big .rows, .page-index .show_big .row2, .page-index .show_big .row1 { width: 50% }
.page-index .show_big .rows a, .page-index .show_big .row2 a, .page-index .show_big .row1 a { display: block; position: relative; overflow: hidden }
.page-index .show_big .rows a .imgurl, .page-index .show_big .row2 a .imgurl, .page-index .show_big .row1 a .imgurl { width: auto; position: relative }
.page-index .show_big2 { margin-top: -.5em }
.page-index .topic { position: relative; overflow: hidden }
.page-index .topic .bg .imgurl { min-height: 19em }
.page-index .topic .targeturl { position: absolute; top: 0; left: 0; width: 100%; height: 100% }
.page-index .topic .item-lay { position: absolute; top: 0; left: 0; margin: 1.2em }
.page-index .topic .item-lay .imgurl { min-height: 10em }
.page-index .topic .item-lay .item-l { margin-right: .5em; float: left; width: 10em; height: 16em; background-color: #fff; text-align: center }
.page-index .topic .item-lay .item-l p { margin: .5em 1em 0; color: #333 }
.page-index .topic .item-lay .item-l p span { font-size: 1.1em; line-height: 1.3 }
.page-index .card-nomb { margin-bottom: 0 }
.page-index .list { background-color: #fff; margin-bottom: .5em }
.page-index .list .head { padding: 0 1.1em; line-height: 4.4em; border-bottom: 1px solid #f6f6f6; background: #F6F6F6; text-align: center }
.page-index .list .head span { font-size: 1.9em; color: #333 }
.page-index .list .list-cell { display: table; width: 100% }
.page-index .list .list-cell .row { display: table-row }
.page-index .list .list-cell .cell { display: table-cell; vertical-align: top; width: 50%; text-align: center; border-bottom: 6px solid #f6f6f6 }
.page-index .list .list-cell .cell:first-child { border-right: 6px solid #f6f6f6 }
.page-index .list .list-cell a { display: block; padding: 1.5em 0 2em }
.page-index .list .list-cell .imgurl { margin: 0 auto; padding: 0 1px; background-color: transparent;margin-bottom: 1.4em }
.page-index .list .list-cell .p { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #333;margin:0 auto; max-width: 15em }
.page-index .list .list-cell .p span { font-size: 1.3em; line-height: 1.3 }
.page-index .list .list-cell .p del { font-size: 1.3em; line-height: 1.3; color: #999 }
.page-index .more { background-color: #fff }
.page-index .more a { display: block; padding: 1.7em 0; text-align: center }
.page-index .more a span { font-size: 1.6em; color: #999 }
.show_big .p { display: block; text-align: center }
.show_big .p { display: block; padding: 0 1em; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #333 }
.show_big .p span, .mg-bor-right .p span { font-size: 1.3em; line-height: 1.3 }
.show_big .p del, .mg-bor-right .p del { font-size: 1.1em; line-height: 1.3; color: #999 }
#show_big .imgurl { margin: 0 auto; padding: 0 1px; background-color: transparent;  }
#show_big a { display: block; padding: 1.5em 0 2em }
.red { color: #e8320d !important }

/* search css */
.page-search { padding: 0 0 2em; background-color: #f4f4f4 }
.page-search .header-search { position: relative; padding: 1.5em 1.4em 2em }
.page-search .header-search .left { position: absolute; left: 0; vertical-align: middle }
.page-search .header-search .left .back { display: block; width: 4em; height: 3.25em; padding-top: .75em }

/*.page-search .header-search .left .back .ico-back { display: block; margin: 0 auto; width: 2.5em; height: 2.5em; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAATpJREFUaN7t2EEKgkAUBmA9RLtWresQgXWNoBbSkaIg6BDtqgPUogN0gXbZMgL7h1yImI7jwPwv58GP4Go+9Om8CdM0Df6hQg/xEA/xkG5A4ji2tYYJMkVWqJtUyBzZqHUgB0AiiZA8QtUOkJk0SBFxQSJAEkmQMoTqkwcgYpr9JyL4drsISCVCCqQWIQGihWCHaCOYIY0QrJDGCEaIEYINYoxggrRCsEBaIxggVhCuIQtkbQPhEqJmh20OcUXGpgiXkJGa6pBedivJnsZZGkRdrGJcN/sQOdrAMHx+rWBYfoitMUxblFYYtk2jMYZxG2+EYR2sGmOYR91GGPbDB22MhOMgLYyUA7ra7YykI9NKjCRIJUYapAxzR/qAvKVBipiXugLylAhRNUCWyAnZO3m12MpDPMRDOgL5AE1Xb6wOBxAOAAAAAElFTkSuQmCC) no-repeat 0 0; -webkit-background-size: 2.5em 2.5em; -moz-background-size: 2.5em 2.5em; -ms-background-size: 2.5em 2.5em; -o-background-size: 2.5em 2.5em; background-size: 2.5em 2.5em }
*/
.page-search .header-search .form { display: block; border: .15em solid #ccc; overflow: hidden; vertical-align: middle; -webkit-border-radius: .4em; -moz-border-radius: .4em; -ms-border-radius: .4em; -o-border-radius: .4em; border-radius: .4em; position: relative; background-color: #fff; padding-right: 5.4em }
.page-search .header-search .form .search-word { padding: .9em 1.4em 1.2em; height: 1.8em }
.page-search .header-search .form .search-word .input { font-size: 1.7em; width: 100%; border: 0 none; color: #464646 }
.page-search .header-search .form .search-word .input::-webkit-input-placeholder { color: #ccc }
.page-search .header-search .form .submit { position: absolute; right: 0; top: 0; border-left: .15em solid #ccc; width: 5.4em; height: 3.9em; background-color: #f4f4f4 }

/*.page-search .header-search .form .submit .ico-search { margin: .75em auto 0; display: block; width: 2.5em; height: 2.5em; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAupJREFUaN7tml2ITVEUxy/5LLnImBAv8iBRHvDCqwcZKZokxIMrNRRP0mTKw4w8iKjJ281HPBBNoYYHNJmIfEXyEU+aMNxJXMxw/VfWrX+7M/eec2ftw+FM/ZqHO7PW/p29z95rr5lMqVTK/AtkUpFUJBWJLpLL5cIyCWwEeXAHvAf9oAh6QBc4DFaC0RHiVsRSZB44Bb6CUkh6wQFQ/zeIjAft4EeFAX8G3yp8/gnsAsP/lIjMwjNnUDIjZ3V5zQFZ+vmJYCnYB54HCHXq0oxVRAb0kQYh78FRMDVk8mFgFXjqyDwG0+MSkZkoUPJXYHGNy2IUOOjIPHRm0ouIJHhBSe+DOoOdZxv4SXHP66x5E2l3ZqLOagsFu52ZWe9LZD7tTvJ9kaFE+b3pIJE3YKwPkTOUJG8sUWYG+EJ5mqxFZAl91+ByJsz0JJLRk593MVORTRT8skcJYa7zrsy2FMlT4K2eRYSXlG+LpcjdKE/IgJOU74ilSC8FHhGDSAvl67AU6deghRgkhJ0kcs1SpKhBizGJ8OF41VKkhwJPiEGE669zliI3KPCSGEQ6Kd9+S5FDFLjFs8QYvYyV8zVaijRQ4CdRKtMaaKRcUtNNthSRp/SBEiz3KHKL8lzxUTS2UYJHns6TtU55ssKHyBTQR0najCXkivuO4t8Ou4RruVg1USK50W0wkpCb5wOKPQAW+rwhyhO66CTcbjAT95wltTeO5kNWGwSc+HSNjbY14G1Aa6g7SgNiKO2gem2JcvI+fW9mVUk8UltBXVU6kaFlhtqgG+eU2/zuyIwdA3tyv792gFatZAsBvyNFabMOPrKMVe93NXgdoefrchMsoGUbWcayiS2Nts06qDCDl/v/BbBskB0skoyPPysI08A6LfZkE7ikS+qE7kYN2vyuth2HlvElkjE8W7oDlmE2aSKhZZIgEkomKSJVZZIkUlEmaSKDyeSTKBIkcz2pImWZ4yIh5X76nw+pSCryH4v8AsM9RIk4Mt5uAAAAAElFTkSuQmCC) no-repeat 0 0; -webkit-background-size: 2.5em 2.5em; -moz-background-size: 2.5em 2.5em; -ms-background-size: 2.5em 2.5em; -o-background-size: 2.5em 2.5em; background-size: 2.5em 2.5em }
*/
.page-search .search-list { margin: 0 1.5em; padding: 1.5em 1.4em 0 }
.page-search .search-list ul { overflow: hidden }
.page-search .search-list li { float: left; width: 50% }
.page-search .search-list li a { margin: .5em 0; display: inline-block; padding: .6em }
.page-search .search-list li a span { font-size: 1.5em; color: #464646 }
.page-category { background: #FFF }
.page-category .category_child { display: none }
.page-category .category_child.on { display: block }
.page-category .category_search { padding: .2em 1.6em;border-bottom: 1px solid #ccc; }
.page-category .category_search .input-word { padding: 1.4em 4em 1.4em 1em; border: .1em solid #ccc; border-radius: 4em }
.page-category .category_search .input-word input { font-size: 1.5em; border: 0 none; color: #666; padding-left: 3.5em; }
.page-category .category_search .input-word .btn { position: absolute; left: 0.3em; top: 0.2em; width: 3em; height: 3em; -webkit-background-size: contain; -moz-background-size: contain; -ms-background-size: contain; -o-background-size: contain; background-size: contain; content: '\e600'; font-size: 3.5em; color: #999;}
.page-category .category_search form { display: block; position: relative }
.page-category .list_category { text-align: center; padding: 0 1.7em; min-height: 5em }
.page-category .list_category .category { background: #FFF; overflow: hidden; border-bottom: .15em solid #eee; position: relative }
.page-category .list_category .category a { display: block }
.page-category .list_category .category a:after { content: '\0020'; clear: both; display: block }
.page-category .list_category .category .imgurl { float: left; width: 4em; height: 4em; margin-top: 1em; overflow: hidden; background-color: #fff }
.page-category .list_category .category .name { float: left; font-size: 1.35em; margin: 1.48148em 0; padding-left: .74074em; font-weight: 700; color: #333 }
.page-category .list_category .js-more:after { content: '\0020'; display: block; width: 1em; height: 1em; border-top: .2em solid #ccc; border-right: .2em solid #ccc; position: absolute; top: 2.2em; right: .9em; -webkit-transition: .2s ease; -webkit-transition-delay: 0s; -moz-transition: .2s ease; -o-transition: .2s ease; transition: .2s ease; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg) }
.page-category .category_child li { margin-left: 2.2em }
.page-category .category_child .category { border-bottom-style: dotted }
.page-category .category_child .category a { height: 4.5em }
.page-category .category_child .category .name { font-size: 1.35em; margin: 1.18519em 0; padding-left: 1.33333em; color: #999 }
.page-category .category_child li:last-child { margin-left: 0 }
.page-category .category_child li:last-child .category { padding-left: 2.2em; border-bottom-style: solid }


input::-webkit-input-placeholder {color: #9C9C9C;font-size: 1.2em;}
.search{
    padding: 0.8em;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    height: 4rem;
    z-index: 100;
    background-color: #F7F8FA;
    align-items: center;
    justify-content: space-between;
}
.inputWrap{
    width: 75%;
    height: 3rem;
    position: relative;
    background: #fff;
    padding: 0 1rem;
    border-radius: 3rem;
    padding-left: 1rem;
    display: flex;
    align-items: center;	
}
.inputWrap>input{
    outline: none;
        border: 0;
        width: 100%;
        height: 100%;
        font-size: 0.9rem;
		background: #fff;
        color: ##999;
}
.inputWrap>input::-webkit-input-placeholder {
       color: #999;
    }
.inputWrap img{
	width:1.5em;
	position: absolute;
	top:calc((100% - 1.5em)/2);
}
.inputWrap .resetKey{
	right:0.5em;
}
.inputWrap .searchIcon{
	left: 2rem;
	z-index: 100;
	font-size: 1.4rem;
	margin-right: 0.3rem;
	font-weight: 900;
	opacity: 0.7;
}
.searchResult{
	position: absolute;
	top:4rem;
	left:0px;
	width:100%;
	background: #fff;
	display: inline-block;
	
}
.searchResult li{
	width: 100%;
    padding: 0.8em 0.5em 0.8em 1.4em;
    border-bottom: 1px solid rgb(240,240,240);
    font-size: 0.95em;
}


.search>.searchMessage{
    width: 12%;
    height: 3.6em;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 0.7em;
	position: relative;}
.search>a>img{width:1.5em;}

.searchBtn{
    font-size: 1rem;
    display: inline-block;
    margin-left: 0.7em;
    white-space: nowrap;
    background-color: #fff;
    height: 3rem;
    line-height: 3rem;
    /* color: #fff; */
    padding: 0 1em;
    /* transform: skew(-15deg); */
    color: #999;
	border-radius: 3rem;
}



.searchLogoWhite{
    background: url(//cdn-shop.redmagic.com/shop-soa-static/images/logo_white.png) 0 center no-repeat;
    background-size: cover;
}
.searchLogoBlack{
    background: url(//cdn-shop.redmagic.com/shop-soa-static/images/logo_black.png) 0 center no-repeat;
    background-size: cover;
}
.searchLogo{
	margin-right:0.5em;
	width: 40%;
	height: 1em;
}

/* .usr-option css */
.usr { background: #e8340e; height: 16em; width: 100%; display: table; text-align: center; }
.usr-bg { border: .1em solid #fff; border-radius: 50%; display: inline-block; vertical-align: middle; width: 6em; height: 6em; overflow: hidden; margin-bottom: 1em; margin-top: 3em; }
.usr-name { display: block; font-size: 1.6em; }
.usr-opt { color: #ccc; }
.usr-opt li { border-bottom: .1em solid #f0f0f0; padding: 0 1em; line-height: 3.6em; font-size: 1.6em; }
.usr-opt .txt { text-align: left; color: #000; }
.usr-opt i { position: absolute; right: 1em; color:#999;line-height: 3.6em}
.usr-opt a:active, .usr-opt a:active span { color: red; background: #fff; }
.usr-opt a:active li { background: #fff; }
.btn-exit {background:#fff; border-radius: 5em; width: 85%; border: .1em solid #ccc; text-align: center; display: block; margin: 0 auto; vertical-align: middle; margin-top: 1.5em; color: #000; padding: 1em; font-size: 1.4em}

/* more option css */
.more-opt { position: absolute;background: #fff; height: 4.3em; font-size: 1.2em; width: 100%;z-index:99;border-bottom: 1px solid #ccc; }
.more-opt .cell { width: 33%; float: left; text-align: center; color: #464646; margin-top: .6em }
.more-opt .cell .icon { display: block; margin-bottom: .2em; font-size: 1.6em }
.more-opt .cell a { color: #464646; }
.icon-caidan, .icon-close, .icon-huitui { font-size: 2.6em; color: #464646; padding: .2em 0;padding-right:.3em; display: inline-block; font-size: 2em; }
.icon-huitui{
	/* margin-bottom: 0.2rem; */
}
/* footer css */
/* .footer {background: #F6F6F6;padding:1.5em 0;}
.footer .tip { text-align: center; } */
/* .footer .tip a { color: #464646; display: inline-block }
.footer .tip span { font-size: 1.4em;display: inline-block;vertical-align: middle;color:#999; }
.footer .tip i.desktop { background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADoAAAAzCAQAAABsvdNrAAAA0UlEQVRYw+3XIQ7CQBCF4VXYQhAcAI3CVNQ0QZJwiAaFaQie4N8dcITAFZAcAFVRUNVwAUJSWEFI6nanHSpe/gN8YmcmWQODEFeUat0Qmg+aKZK2zKKldj80xaTx0ioawTReRJQoUaJEiRIlSpQoUaJEPdEE48ZLqqjypzhXRnOLxigUyQLx94kD9FQKrGbwh1qIdrHBwaM9luj4omfBwGz90JFoSp/o+6Br4XLMfdCLED25o0PxGXhh4Iquarg+C1f0WAO6c0WnuAvJB2YtukhvqXei0/ybuJsAAAAASUVORK5CIIA=) no-repeat; width:2em; height:2em;display: inline-block;vertical-align: middle;background-size:contain; } */
/* #footer p a{color:gray}
.footer{text-align:center;border-top:.1em solid #dcdcdc;padding:2.5em 0}.footer .box_01 a,.footer .box_02 a{color:#88898d;font-size:1.5em}
.footer .box_01 a{padding:0 .8em}.footer .box_01 a:first-child{border-right:.06667em solid #ccc}.footer .box_01 a:nth-child(2){border-right:.06667em solid #ccc}.footer .box_01 a:nth-child(3){border-right:.06667em solid #ccc}
.footer .box_01 a:last-child{border-left:.06667em solid #ccc}.footer .box_02{margin:1.5em 0}.footer .box_02 a{padding-left:1.66667em;background:url("../images/pc_icon.png") 0 50% no-repeat;-webkit-background-size:1.16667em .86667em;-moz-background-size:1.16667em .86667em;-o-background-size:1.16667em .86667em;background-size:1.16667em .86667em}
.footer .box_03 p{font-size:1em;color:#c5c5c5} */
*{
	box-sizing: border-box;
}
.footMain{
	background: #fff;
}
.footer{
			width:100%;
			display:flex;
			justify-content:center;
			align-items:center;
			flex-direction: column;
			/* padding:0rem 1rem; */
			font-family:normal!important;
			border-top: none!important;
			
		}
		.footer a{
			display: inline-block;
			color: #999999!important;
		}
		.footerTitle{
			width:100%;
			display:flex;
			justify-content:flex-start;
			align-items:center;
			/* border-bottom:1px solid rgb(214,214,214); */
			/* padding:2rem; */
			/* height:8rem; */
			margin-top:2rem;
			padding: 0 1rem;
		}
		.footerTitle a{
			font-size: 0.8rem;
			line-height: 0.8rem;
			color: rgb(50,50,50)!important;
		}
		.footer i{
			margin:0 0.7rem;
			display: inline-block;
			height: 0.8rem;
			border-right: 1px solid rgb(153,153,153);
		}
		
		.footerContent{ 
			line-height: 1.8rem;
			/* height:5rem; */
			padding: 1rem 1rem 4rem 1rem;
			    text-align: left;
				width: 100%;
		}
		.footerContent a{
			font-size:0.70rem;
			/* transform: scale(0.8); */
		}
		
		.footerContent p{
			display:flex;
			justify-content:flex-start;
			align-items:center;
			/* padding-left: 2rem; */
			height: 0.7rem;
			margin: 0!important;
		}
		.footerContent p a{
			white-space: nowrap;
		
			
		}
		.footerContent p a:last-child{	
			position: relative;
			/* right: 0.7rem; */
		}
		.ccie{
			
			margin:0.6rem 0;
			width:60%;
			display:flex;
			justify-content:space-between;
			align-items:center;
		}
		.ccie a{
			width:90%;
		}
		.ccie a img{
			width:100%;
		}
		
		.support{
			padding: 0 1rem;
			width: 100%;
			
		}
		.supportList{
			width:100%;
			
		}
		
		.supportList>li{
			
			width: 100%;
			/* height:4rem; */
			
			border-bottom: 1px solid #DCDCDC;
		}
		.supportList li div{
			padding: 1rem 0;
			width: 100%;
			display:flex;
			justify-content:space-between;
			align-items:center;
		}
		.supportList li div span{
			font-size: 0.95rem;
			color:rgb(50,50,50);
		}
		.supportList li div img{
			width:1rem;
		}
		
		.service{
			height:10rem;
			display:flex;
			justify-content:space-between;
			align-items:center;
			border-bottom: 1px solid #DCDCDC;
			margin-top:1rem;
			    padding-bottom: 1rem;
		}
		.serviceInfo{
			width:50%;
			height:100%;
			display:flex;
			flex-direction: column;
			justify-content:center;
			align-items:flex-start;
			font-style: normal;
			text-decoration: none;
		}
		.serviceInfo p{
			font-size: 0.85rem;
			color:  #333333;
			line-height: 1.7rem;
		}
		.serviceInfo .serverTime{
			color:  #999999;
		}
		
		.serviceBtn{
			    width: 38%;
			        height: 33%;
			    display: flex;
			    justify-content: center;
			    align-items: center;
			    border-radius: 2rem;
			    /* border: 1px solid rgb(100,100,100); */
			    /* color: ; */
			    font-size: 0.9rem;
				background: #666666 ;
				color: #fff!important;
		}
		.serviceBtn img{
			width:1.5rem;
			margin-right:0.5rem;
		}
		.other{
			height:4rem;
			display:flex;
			justify-content:space-between;
			align-items:center;
			border-bottom: 1px solid #DCDCDC;
		}
		.otherLeft{
			width:50%;
			display:flex;
			justify-content:flex-start;
			align-items:center;
			font-size: 0.9rem;;
			color: #999999;
		}
		.otherLeft a{
			display: inline-block;
			margin-left:0.5rem;
		}
		.otherLeft a img{
			width:1.35rem
		}
		.sbs{
			width:100%;
			display: inline-block;
			display:flex;
			flex-wrap: wrap;
			justify-content:flex-start;
			align-items:center;
			padding:2rem 0;
		}
		.sbs a{
			width:50%;
			height:8rem;
			display:flex;
			flex-direction: column;
			justify-content:center;
			align-items:center;
			font-size: 0.9rem;
			color:rgb(50,50,50);
		}
		.sbs a i{
			font-size: 3rem;
			display: inline-block;
			margin-bottom:1.1rem;
		}
		
		/* .sbs a img{
			width:3rem;
			margin-bottom:0.85rem;
		} */
		.foldList{
			width: 100%;
			display: none;
		}
		.foldList li{
			width:100%;
			height:2.15rem;
			display:flex;
			justify-content:flex-start;
			align-items:center;
			font-size: 0.85rem;
			padding-left:0.5rem;
			
		}
		.foldList a{
			color: rgb(50,50,50);
			display: inline-block;
			width: 100%;
		}
		
		.foldList a:last-child{
			
			margin-bottom:1rem;
		}
		.foldList a:last-child li{
			border: none;
			
		}
		 .wxShare{        position: fixed;
    color: #fff;
    text-align: center;
    /* padding-top: 55%; */
    font-size: 2em;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: -1050;
    background: rgba(0,0,0,.7) 50% 70% no-repeat;
    background-image: url(//cdn-shop.redmagic.com/shop-soa-static/shop/images/nb-weixin-code-figure.jpg);
    background-size: 60%;
    background-position: center;
    opacity: 0;}

		/* 黑色主题底部 */
		.footerBlack{
			background: #0D0D0D;
		}
		.footerBlack .sbs a{
			color: #fff;
		}
		.footerBlack .sbs a i{
			color: #fff;
		}
		.footerBlack .supportList li {
			border-bottom: 1px solid #1F1F1F;
		}

		.footerBlack .supportList li div span{
			color: #fff;
			
		}
		.footerBlack .supportList .foldList li{
			color: #fff;
		}
		.footerBlack .footerTitle a{
			color: #fff;
		}
		.footerBlack .service{
			border-bottom: 1px solid #1F1F1F;
		}
		.footerBlack .serverTelNumber{
			color: #fff;
		}
		.footerBlack .serverTel{
			color: #999999;
		}
		.footerBlack .serviceBtn{
			background-color:  #DE634F;
		}
		.footerBlack .other{
			border-bottom: 1px solid #1F1F1F;
		}
		/* 灰色主题底部 */
		.footerGray{
			background: #F0F0F0;
		}
		
		
/* phone_list css */
.phone-list .phone-item { border-bottom: .5em solid #e9e9e9 }

.phone-item .phone-cell { display: inline-block; width: 30%; margin: 2.1em 0; margin-left: 2em;vertical-align: middle; }
.phone-item .phone-desc { display: inline-block; margin-left: 1.2em; line-height: 1.8em; font-size: 1.4em; vertical-align: middle; }
.phone-list .phone-item .title { color: #000; font-size: 1.8em;padding: 0;margin:0;background:transparent;text-align: left; }
.phone-list .phone-item .phone-item-inner { }
.phone-item .small { color: #8b8b8b; font-size: 1.4em }
.phone-item .price { color: #e8320d; font-size: 1.4em }
.phone-item .btn-buy { display: block; width: 100%; text-align: center; padding: 1em 0; color: #000; border-top: .1em solid #e9e9e9; font-size: 1.5em }

/* accessory-list */
.cate-icon { display: inline-block; margin: 0 auto; width: 1em; height: 1em; -webkit-background-size: 1em 1em; -moz-background-size: 1em 1em; -ms-background-size: 1em 1em; -o-background-size: 1em 1em; background-size: 1em 1em; vertical-align: middle;}
.cate-icon.icon-peijian, .icon-hougai, .icon-baohumo, .icon-pitao { font-size: 2.6em; color: #464646 }
.sort { overflow: hidden; background: #fff}
.sort .first-filer { border-bottom: 1px solid #dcdcdc; text-align: center; overflow: hidden; height: 5em; line-height: 4.9em }
.sort .first-filer div { width: 50%; float: left; font-size: 2em}
.sort .first-filer div.cur { color: #fe4e4e; border-bottom: 2px solid #fe4e4e; }
.sort .sec-filer .sort .sec-filer { text-align: center; height: 5em; line-height: 4.9em; overflow-x: scroll; border-bottom: 6px solid #f6f6f6; overflow-y: hidden; overflow-wrap: break-word; white-space: nowrap; width: 100%;}
.category a:visited { color: #000; }
.category .category-cell { width:100%; float: left; border-right: 1px solid #ccc; margin: 1em 0; line-height: 3.1em }
.category div.active { color: #fe4e4e; }
.category-title { color: #000; font-size: 1.4em}

/* productdetails pages */
    .w20 {width:20%}.w25{width:25%}.w33{width:33.333333%}
    .mui-slider{background: #fff;margin-bottom: 0em}
    .pdt-desc{font-size: 18px;background:#fff;line-height:1.5;padding:10px 1rem;text-align: left;margin-top:1px;margin-bottom: 5px;}
    .pdt-desc .pdt-title{color:rgb(25,25,25);font-weight: 600;width: 90%;}
    
    #btn-buy.btn-disabled{background: #A3A3A3;}
    .pdb5{padding-bottom: 5em}
    /* 寮瑰嚭妗� 璐拱鍙傛暟閫夋嫨鏍峰紡 */
    .close{position:absolute;top:5px;right:5px;border-radius: 50%;color:#a6a6a6;background-color: transparent;font-size:24px;line-height:28px;width: 30px;height: 30px;text-align: center;}
    .pdt{border-bottom:1px solid #D7D7D7;padding-bottom: 1em;}
    .pdt-selected{animation-duration:0.5s!important;animation-timing-function: ease!important;position: fixed;background: #fff;bottom:0;width:100%;display:block;z-index:9999;display:none}
    .pdt-pic{margin-left:10px;margin-top:10px;text-align: center;display:inline-block;vertical-align: middle;width: 150px;height:150px}
    .pdt-info{display: inline-block;margin-left:20px;width: 40%;}
    .pdt-info .pdt-h1{color:#000;font-size: 20px;}
    .pdt-selected-confirm{background:#ff4d4d;color:#fff;height:3.5em;line-height:3.5em;display:inline-block;text-align: center;border-radius: 50px;margin:.6em;width: 70%;}
    .pdt-result{border-top: 1px solid #eaeaea;background:#fff;height: 6em;line-height: 6em;text-align: center;}
    .pdt-result .pdt-price {width: 24%; display: inline-block;  vertical-align: middle;font-size: 1.4em }

    /*
    .lazy{display:block;background:#f5f5f6 url("<?php $this->put(IMAGE_URL_NUBIA_PORTAL)?>/app/images/lazyload.png") 50% 50% no-repeat;-webkit-background-size:9.5em 9.5em;-moz-background-size:9.5em 9.5em;-o-background-size:9.5em 9.5em;background-size:9.5em 9.5em;width:100%}
    */
    .mask{position: absolute;top:0;left:0;background: #000;opacity: .8;width: 100%;height:1000%;z-index:98;pointer-events: none;display:none}
    .icon-addshop{width: 42px;height: 42px;display: inline-block;margin-top:8px;margin-left: 8px;}

    .animated {
      -webkit-animation-duration: 1s;
              animation-duration: 1s;
      -webkit-animation-fill-mode: both;
              animation-fill-mode: both;
              -webkit-animation-timing-function:ease-in-out;
    }

    .animated.infinite {
      -webkit-animation-iteration-count: infinite;
              animation-iteration-count: infinite;
    }

    .animated.hinge {
      -webkit-animation-duration: 2s;
              animation-duration: 2s;
    }
    .slideInUp {
      -webkit-animation-name: slideInUp;
              animation-name: slideInUp;
    }
		.slideInDown {
		  -webkit-animation-name: slideInDown;
		          animation-name: slideInDown;
		}
    @-webkit-keyframes slideInUp {
      0% {pdt-selected
        -webkit-transform: translateY(100%);
                transform: translateY(100%);
        visibility: visible;
      }
      50% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
      }
    }

/* usr defined font import */

@font-face {
    font-family: "nubia";
    src: url("../../font/nubia/nubia.eot?#iefix") format("embedded-opentype"),
    url("../../font/nubia/nubia.otf")  format("opentype"),
    url("../../font/nubia/nubia.woff") format("woff"),
    url("../../font/nubia/nubia.ttf")  format("truetype"),
    url("../../font/nubia/nubia.svg") format("svg");
    font-style: normal;
}
@font-face {
    font-family: "nubia-ico";
    src: url("../../font/nubia/nubia-ico.eot?#iefix") format("embedded-opentype"),
    url("../../font/nubia/nubia-ico.woff") format("woff"),
    url("../../font/nubia/nubia-ico.ttf")  format("truetype"),
    url("../../font/nubia/nubia-ico.svg") format("svg");
    font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: "nubia","nubia-ico" !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    font-size: 1.2rem;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-focal_length:before {
    content: "\e600";
}
.icon-exposure_time:before {
    content: "\e601";
}
.icon-iso:before {
    content: "\e602";
}
.icon-camera2:before {
    content: "\e603";
}
.icon-circle_ser:before {
    content: "\e901";
}
.icon-circle-server:before {
    content: "\e903";
}
.icon-aperture:before {
    content: "\e604";
}
.icon-large_compass:before {
    content: "\e9c7";
}
.icon-circle_arrow-down5:before {
    content: "\ea29";
}
.icon-circle_arrow-left5:before {
    content: "\ea2a";
}
.icon-circle_arrow-right5:before {
    content: "\ea2b";
}
.icon-circle_arrow-up5:before {
    content: "\ea56";
}
.icon-arrow-left5:before {
    content: "\ea59";
}
.icon-arrow-right5:before {
    content: "\ea80";
}
.icon-arrow-up5:before {
    content: "\ea81";
}
.icon-arrow-down5:before {
    content: "\ea82";
}
.icon-7-c:before {
    content: "\e9bc";
}
.icon-alipay:before {
    content: "\ea21";
}
.icon-arrow-back:before {
    content: "\e98f";
}
.icon-arrow-down:before {
    content: "\e9a3";
}
.icon-arrow-down2:before {
    content: "\e964";
}
.icon-arrow-down4:before {
    content: "\e9fe";
}
.icon-arrow-left:before {
    content: "\e9a8";
}
.icon-arrow-left2:before {
    content: "\e985";
}
.icon-huitui:before {
    content: "\e985";
}
.icon-arrow-left3:before {
    content: "\e980";
}
.icon-arrow-left4:before {
    content: "\ea00";
}
.icon-arrow-next:before {
    content: "\e990";
}
.icon-arrow-right:before {
    content: "\e9a4";
}
.icon-arrow-right2:before {
    content: "\e986";
}
.icon-arrow-right3:before {
    content: "\e981";
}
.icon-arrow-right4:before {
    content: "\ea01";
}
.icon-arrow-up:before {
    content: "\e9ad";
}
.icon-arrow-up2:before {
    content: "\e965";
}
.icon-arrow-up4:before {
    content: "\e9ff";
}
.icon-bag:before {
    content: "\e9c1";
}
.icon-bars:before {
    content: "\e99e";
}
.icon-bell:before {
    content: "\e977";
}
.icon-bow-tie:before {
    content: "\e987";
}
.icon-bubble:before {
    content: "\e96d";
}
.icon-buoy:before {
    content: "\e97c";
}
.icon-cable:before {
    content: "\e9dc";
}
.icon-caddie:before {
    content: "\e9bd";
}
.icon-caddie-full:before {
    content: "\e99f";
}
.icon-calendar:before {
    content: "\e97d";
}
.icon-camera:before {
    content: "\e972";
}
.icon-card:before {
    content: "\e978";
}
.icon-case:before {
    content: "\e9d9";
}
.icon-check:before {
    content: "\e98a";
}
.icon-circle_7-c:before {
    content: "\e959";
}
.icon-circle_alipay:before {
    content: "\ea1b";
}
.icon-circle_arrow-back:before {
    content: "\e92c";
}
.icon-circle_arrow-down:before {
    content: "\e944";
}
.icon-circle_arrow-down2:before {
    content: "\e900";
}
.icon-circle_arrow-down4path1:before {
    content: "\ea06";
    color: rgb(4, 0, 0);
}
.icon-circle_arrow-down4path2:before {
    content: "\ea07";
    color: rgb(0, 0, 0);
}
.icon-circle_arrow-left:before {
    content: "\e945";
}
.icon-circle_arrow-left2:before {
    content: "\e920";
}
.icon-circle_arrow-left3:before {
    content: "\e91d";
}
.icon-circle_arrow-left4path1:before {
    content: "\ea02";
    color: rgb(4, 0, 0);
}
.icon-circle_arrow-left4path2:before {
    content: "\ea03";
    color: rgb(0, 0, 0);
}
.icon-circle_arrow-next:before {
    content: "\e92d";
}
.icon-circle_arrow-right:before {
    content: "\e940";
}
.icon-circle_arrow-right2:before {
    content: "\e921";
}
.icon-circle_arrow-right3:before {
    content: "\e91e";
}
.icon-circle_arrow-right4path1:before {
    content: "\ea04";
    color: rgb(4, 0, 0);
}
.icon-circle_arrow-right4path2:before {
    content: "\ea05";
    color: rgb(0, 0, 0);
}
.icon-circle_arrow-up:before {
    content: "\e947";
}
.icon-circle_arrow-up2:before {
    content: "\e901";
}
.icon-circle_arrow-up4path1:before {
    content: "\ea08";
    color: rgb(4, 0, 0);
}
.icon-circle_arrow-up4path2:before {
    content: "\ea09";
    color: rgb(0, 0, 0);
}
.icon-circle_bag:before {
    content: "\e95d";
}
.icon-circle_bars:before {
    content: "\e939";
}
.icon-circle_bell:before {
    content: "\e912";
}
.icon-circle_bow-tie:before {
    content: "\e924";
}
.icon-circle_bubble:before {
    content: "\e90b";
}
.icon-circle_buoy:before {
    content: "\e919";
}
.icon-circle_cable:before {
    content: "\e9ce";
}
.icon-circle_caddie:before {
    content: "\e95e";
}
.icon-circle_caddie-full:before {
    content: "\e93a";
}
.icon-circle_calendar:before {
    content: "\e91a";
}
.icon-circle_camera:before {
    content: "\e90c";
}
.icon-circle_card:before {
    content: "\e913";
}
.icon-circle_case:before {
    content: "\e9cb";
}
.icon-circle_check:before {
    content: "\e928";
}
.icon-circle_clock:before {
    content: "\e925";
}
.icon-circle_cloud-down:before {
    content: "\e94e";
}
.icon-circle_cloud-transfer:before {
    content: "\e94f";
}
.icon-circle_cloud-up:before {
    content: "\e950";
}
.icon-circle_cog:before {
    content: "\e90d";
}
.icon-circle_compass:before {
    content: "\e952";
}
.icon-circle_cup:before {
    content: "\e9d4";
}
.icon-circle_dot:before {
    content: "\e9f7";
}
.icon-circle_earphones:before {
    content: "\e9c8";
}
.icon-circle_echo:before {
    content: "\ea0a";
}
.icon-circle_exclam:before {
    content: "\e936";
}
.icon-circle_external:before {
    content: "\e9cf";
}
.icon-circle_eye:before {
    content: "\e904";
}
.icon-circle_facebook:before {
    content: "\e948";
}
.icon-circle_file:before {
    content: "\e92f";
}
.icon-circle_fill_alipaypath1:before {
    content: "\ea1c";

}
.icon-circle_fill_alipaypath2:before {
    content: "\ea1d";

}
.icon-circle_fill_facebook:before {
    content: "\e9f0";
}
.icon-circle_fill_google:before {
    content: "\e9f9";
}
.icon-circle_fill_hearth:before {
    content: "\e9fa";
}
.icon-circle_fill_instagram:before {
    content: "\e9f1";
}
.icon-circle_fill_qqpath1:before {
    content: "\ea16";

}
.icon-circle_fill_qqpath2:before {
    content: "\ea17";

}
.icon-circle_fill_star:before {
    content: "\e9fb";
}
.icon-circle_fill_timelapse:before {
    content: "\ea25";
}
.icon-circle_fill_twitter:before {
    content: "\e9f2";
}
.icon-circle_fill_vk:before {
    content: "\ea0d";
}
.icon-circle_fill_wechatpath1:before {
    content: "\ea18";

}
.icon-circle_fill_wechatpath2:before {
    content: "\ea19";

}
.icon-circle_fill_weibo:before {
    content: "\ea1f";
}
.icon-circle_fill_youtube:before {
    content: "\e9f3";
}
.icon-circle_flag:before {
    content: "\e905";
}
.icon-circle_frame:before {
    content: "\e9d1";
}
.icon-circle_fullscreen:before {
    content: "\e932";
}
.icon-circle_gallery:before {
    content: "\ea26";
}
.icon-circle_gamepad:before {
    content: "\e9d0";
}
.icon-circle_ghost:before {
    content: "\e922";
}
.icon-circle_gift:before {
    content: "\e960";
}
.icon-circle_globe:before {
    content: "\e9f5";
}
.icon-circle_graduate:before {
    content: "\ea27";
}
.icon-circle_headphone-mic-on:before {
    content: "\e95f";
}
.icon-circle_headphones-mic:before {
    content: "\e961";
}
.icon-circle_heart:before {
    content: "\e907";
}
.icon-circle_home:before {
    content: "\e941";
}
.icon-circle_image:before {
    content: "\e92e";
}
.icon-circle_in:before {
    content: "\e942";
}
.icon-circle_lab:before {
    content: "\e9d5";
}
.icon-circle_layout-line:before {
    content: "\e933";
}
.icon-circle_layout-square:before {
    content: "\e934";
}
.icon-circle_leather-case:before {
    content: "\e9cc";
}
.icon-circle_lightning:before {
    content: "\e9d7";
}
.icon-circle_line:before {
    content: "\e93d";
}
.icon-circle_localization:before {
    content: "\e951";
}
.icon-circle_lock:before {
    content: "\e910";
}
.icon-circle_lock-o:before {
    content: "\e90f";
}
.icon-circle_magnify-dollar:before {
    content: "\e93b";
}
.icon-circle_magnify-glass:before {
    content: "\e95a";
}
.icon-circle_magnify-minus:before {
    content: "\e916";
}
.icon-circle_magnify-plus:before {
    content: "\e917";
}
.icon-circle_magnify-yen:before {
    content: "\e95b";
}
.icon-circle_magnifyi-euro:before {
    content: "\e95c";
}
.icon-circle_mail:before {
    content: "\e908";
}
.icon-circle_menu:before {
    content: "\e9ee";
}
.icon-circle_message:before {
    content: "\e94b";
}
.icon-circle_move:before {
    content: "\e9d2";
}
.icon-circle_next:before {
    content: "\e91b";
}
.icon-circle_notebook:before {
    content: "\e918";
}
.icon-circle_null:before {
    content: "\e926";
}
.icon-circle_o:before {
    content: "\e92b";
}
.icon-circle_out:before {
    content: "\e943";
}
.icon-circle_paperclip:before {
    content: "\e90e";
}
.icon-circle_paperplane:before {
    content: "\e909";
}
.icon-circle_pdf:before {
    content: "\e930";
}
.icon-circle_pen:before {
    content: "\e93c";
}
.icon-circle_peripheral:before {
    content: "\e9c9";
}
.icon-circle_phone:before {
    content: "\e956";
}
.icon-circle_photographerpath1:before {
    content: "\ea2c";
    color: rgb(4, 0, 0);
}
.icon-circle_photographerpath2:before {
    content: "\ea2d";
    color: rgb(4, 0, 0);
}
.icon-circle_photographerpath3:before {
    content: "\ea2e";
    color: rgb(4, 0, 0);
}
.icon-circle_photographerpath4:before {
    content: "\ea2f";
    color: rgb(0, 0, 0);
}
.icon-circle_pie:before {
    content: "\e93e";
}
.icon-circle_pin:before {
    content: "\e911";
}
.icon-circle_plus:before {
    content: "\e927";
}
.icon-circle_powerbank:before {
    content: "\ea13";
}
.icon-circle_previous:before {
    content: "\e91f";
}
.icon-circle_print:before {
    content: "\e929";
}
.icon-circle_qq:before {
    content: "\ea1a";
}
.icon-circle_question:before {
    content: "\e937";
}
.icon-circle_reduce:before {
    content: "\e935";
}
.icon-circle_refresh:before {
    content: "\e902";
}
.icon-circle_report:before {
    content: "\e9ef";
}
.icon-circle_ribbon:before {
    content: "\e9d6";
}
.icon-circle_root:before {
    content: "\e962";
}
.icon-circle_rotate:before {
    content: "\e906";
}
.icon-circle_sandglass:before {
    content: "\e914";
}
.icon-circle_screen-protect:before {
    content: "\e9ca";
}
.icon-circle_selfie:before {
    content: "\ea0f";
}
.icon-circle_settings:before {
    content: "\e9d3";
}
.icon-circle_sf:before {
    content: "\e963";
}
.icon-circle_share:before {
    content: "\e93f";
}
.icon-circle_shield:before {
    content: "\e94c";
}
.icon-circle_shop:before {
    content: "\e938";
}
.icon-circle_shuffle:before {
    content: "\ea0b";
}
.icon-circle_smarthome:before {
    content: "\e9cd";
}
.icon-circle_smartphone:before {
    content: "\e903";
}
.icon-circle_smiley:before {
    content: "\e915";
}
.icon-circle_star:before {
    content: "\e90a";
}
.icon-circle_time-back:before {
    content: "\e949";
}
.icon-circle_timelapsepath1:before {
    content: "\ea30";

}
.icon-circle_timelapsepath2:before {
    content: "\ea31";

}
.icon-circle_timelapsepath3:before {
    content: "\ea32";

}
.icon-circle_timelapsepath4:before {
    content: "\ea33";

}
.icon-circle_timelapsepath5:before {
    content: "\ea34";

}
.icon-circle_timelapsepath6:before {
    content: "\ea35";

}
.icon-circle_timelapsepath7:before {
    content: "\ea36";

}
.icon-circle_timelapsepath8:before {
    content: "\ea37";

}
.icon-circle_timelapsepath9:before {
    content: "\ea38";

}
.icon-circle_timelapsepath10:before {
    content: "\ea39";

}
.icon-circle_timelapsepath11:before {
    content: "\ea3a";

}
.icon-circle_timelapsepath12:before {
    content: "\ea3b";

}
.icon-circle_timelapsepath13:before {
    content: "\ea3c";

}
.icon-circle_timelapsepath14:before {
    content: "\ea3d";

}
.icon-circle_timelapsepath15:before {
    content: "\ea3e";

}
.icon-circle_timelapsepath16:before {
    content: "\ea3f";

}
.icon-circle_timelapsepath17:before {
    content: "\ea40";

}
.icon-circle_timelapsepath18:before {
    content: "\ea41";

}
.icon-circle_timelapsepath19:before {
    content: "\ea42";

}
.icon-circle_timelapsepath20:before {
    content: "\ea43";

}
.icon-circle_timelapsepath21:before {
    content: "\ea44";

}
.icon-circle_timelapsepath22:before {
    content: "\ea45";

}
.icon-circle_timelapsepath23:before {
    content: "\ea46";

}
.icon-circle_timelapsepath24:before {
    content: "\ea47";

}
.icon-circle_timelapsepath25:before {
    content: "\ea48";

}
.icon-circle_timelapsepath26:before {
    content: "\ea49";

}
.icon-circle_timelapsepath27:before {
    content: "\ea4a";

}
.icon-circle_timelapsepath28:before {
    content: "\ea4b";

}
.icon-circle_timelapsepath29:before {
    content: "\ea4c";

}
.icon-circle_timelapsepath30:before {
    content: "\ea4d";

}
.icon-circle_timelapsepath31:before {
    content: "\ea4e";

}
.icon-circle_timelapsepath32:before {
    content: "\ea4f";

}
.icon-circle_timelapsepath33:before {
    content: "\ea50";

}
.icon-circle_timelapsepath34:before {
    content: "\ea51";

}
.icon-circle_timelapsepath35:before {
    content: "\ea52";

}
.icon-circle_timelapsepath36:before {
    content: "\ea53";

}
.icon-circle_timelapsepath37:before {
    content: "\ea54";

}
.icon-circle_timelapsepath38:before {
    content: "\ea55";

}
.icon-circle_times:before {
    content: "\e92a";
}
.icon-circle_tools:before {
    content: "\e957";
}
.icon-circle_trash:before {
    content: "\e91c";
}
.icon-circle_tripod:before {
    content: "\ea10";
}
.icon-circle_tumblr:before {
    content: "\e923";
}
.icon-circle_twitter:before {
    content: "\e94a";
}
.icon-circle_user:before {
    content: "\e954";
}
.icon-circle_user-o:before {
    content: "\e953";
}
.icon-circle_wave:before {
    content: "\ea0c";
}
.icon-circle_wechat:before {
    content: "\e955";
}
.icon-circle_weibo:before {
    content: "\e946";
}
.icon-circle_wifi:before {
    content: "\e94d";
}
.icon-circle_wrench:before {
    content: "\e958";
}
.icon-circle_xls:before {
    content: "\e931";
}
.icon-clock:before {
    content: "\e988";
}
.icon-cloud-down:before {
    content: "\e9b2";
}
.icon-cloud-transfer:before {
    content: "\e9ae";
}
.icon-cloud-up:before {
    content: "\e9b3";
}
.icon-cog:before {
    content: "\e96e";
}
.icon-compass:before {
    content: "\e9b7";
}
.icon-cup:before {
    content: "\e9e2";
}
.icon-dot:before {
    content: "\e9f6";
}
.icon-earphones:before {
    content: "\e9e7";
}
.icon-exclam:before {
    content: "\e999";
}
.icon-external:before {
    content: "\e9df";
}
.icon-eye:before {
    content: "\e968";
}
.icon-facebook:before {
    content: "\e9a9";
}
.icon-file:before {
    content: "\e994";
}
.icon-fill-wechat:before {
    content: "\ea15";
}
.icon-fill_alipay:before {
    content: "\ea22";
}
.icon-fill_facebook:before {
    content: "\e9eb";
}
.icon-fill_google:before {
    content: "\e9f8";
}
.icon-fill_hearth:before {
    content: "\e9fc";
}
.icon-fill_instagram:before {
    content: "\e9ec";
}
.icon-fill_qq:before {
    content: "\ea23";
}
.icon-fill_star:before {
    content: "\e9fd";
}
.icon-fill_timelapse:before {
    content: "\ea57";
}
.icon-fill_twitter:before {
    content: "\e9ea";
}
.icon-fill_vk:before {
    content: "\ea0e";
}
.icon-fill_wechat:before {
    content: "\ea20";
}
.icon-fill_weibo:before {
    content: "\ea1e";
}
.icon-fill_youtube:before {
    content: "\e9ed";
}
.icon-flag:before {
    content: "\e969";
}
.icon-frame:before {
    content: "\e9e3";
}
.icon-fullscreen:before {
    content: "\e995";
}
.icon-gallery:before {
    content: "\ea58";
}
.icon-gamepad:before {
    content: "\e9dd";
}
.icon-ghost:before {
    content: "\e982";
}
.icon-gift:before {
    content: "\e9c2";
}
.icon-globe:before {
    content: "\e9f4";
}
.icon-graduate:before {
    content: "\ea28";
}
.icon-headphone-mic-on:before {
    content: "\e9c3";
}
.icon-headphones-mic:before {
    content: "\e9c4";
}
.icon-heart:before {
    content: "\e96a";
}
.icon-home:before {
    content: "\e9a5";
}
.icon-image:before {
    content: "\e991";
}
.icon-in:before {
    content: "\e9a6";
}
.icon-lab:before {
    content: "\e9e4";
}
.icon-layout-line:before {
    content: "\e996";
}
.icon-layout-square:before {
    content: "\e997";
}
.icon-leather-case:before {
    content: "\e9da";
}
.icon-lightning:before {
    content: "\e9e5";
}
.icon-line:before {
    content: "\e9a0";
}
.icon-localization:before {
    content: "\e9b4";
}
.icon-lock:before {
    content: "\e974";
}
.icon-lock-o:before {
    content: "\e973";
}
.icon-magnify-dollar:before {
    content: "\e99a";
}
.icon-magnify-glass:before {
    content: "\e9be";
}
.icon-magnify-minus:before {
    content: "\e97e";
}
.icon-magnify-plus:before {
    content: "\e979";
}
.icon-magnify-yen:before {
    content: "\e9bf";
}
.icon-magnifyi-euro:before {
    content: "\e9c0";
}
.icon-mail:before {
    content: "\e96f";
}
.icon-menu:before {
    content: "\e9e8";
}
.icon-message:before {
    content: "\e9af";
}
.icon-move:before {
    content: "\e9e0";
}
.icon-next:before {
    content: "\e983";
}
.icon-notebook:before {
    content: "\e97a";
}
.icon-null:before {
    content: "\e98b";
}
.icon-out:before {
    content: "\e9a7";
}
.icon-paperclip:before {
    content: "\e970";
}
.icon-paperplane:before {
    content: "\e971";
}
.icon-pdf:before {
    content: "\e992";
}
.icon-pen:before {
    content: "\e99b";
}
.icon-peripheral:before {
    content: "\e9d8";
}
.icon-phone:before {
    content: "\e9b8";
}
.icon-photographer:before {
    content: "\ea5a";
}
.icon-pie:before {
    content: "\e9a1";
}
.icon-pin:before {
    content: "\e975";
}
.icon-plus:before {
    content: "\e98c";
}
.icon-powerbank:before {
    content: "\ea14";
}
.icon-previous:before {
    content: "\e984";
}
.icon-print:before {
    content: "\e98d";
}
.icon-qq:before {
    content: "\ea24";
}
.icon-question:before {
    content: "\e99c";
}
.icon-reduce:before {
    content: "\e998";
}
.icon-refresh:before {
    content: "\e966";
}
.icon-report:before {
    content: "\e9e9";
}
.icon-ribbon:before {
    content: "\e9e6";
}
.icon-root:before {
    content: "\e9c6";
}
.icon-rotate:before {
    content: "\e96b";
}
.icon-sandglass:before {
    content: "\e97b";
}
.icon-screen-protect:before {
    content: "\e9db";
}
.icon-selfie:before {
    content: "\ea11";
}
.icon-settings:before {
    content: "\e9e1";
}
.icon-sf:before {
    content: "\e9c5";
}
.icon-share:before {
    content: "\e9a2";
}
.icon-shield:before {
    content: "\e9b0";
}
.icon-shop:before {
    content: "\e99d";
}
.icon-smarthome:before {
    content: "\e9de";
}
.icon-smartphone:before {
    content: "\e967";
}
.icon-smiley:before {
    content: "\e976";
}
.icon-star:before {
    content: "\e96c";
}
.icon-time-back:before {
    content: "\e9aa";
}
.icon-timelapsepath1:before {
    content: "\ea5b";

}
.icon-timelapsepath2:before {
    content: "\ea5c";

}
.icon-timelapsepath3:before {
    content: "\ea5d";

}
.icon-timelapsepath4:before {
    content: "\ea5e";

}
.icon-timelapsepath5:before {
    content: "\ea5f";

}
.icon-timelapsepath6:before {
    content: "\ea60";

}
.icon-timelapsepath7:before {
    content: "\ea61";

}
.icon-timelapsepath8:before {
    content: "\ea62";

}
.icon-timelapsepath9:before {
    content: "\ea63";

}
.icon-timelapsepath10:before {
    content: "\ea64";

}
.icon-timelapsepath11:before {
    content: "\ea65";

}
.icon-timelapsepath12:before {
    content: "\ea66";

}
.icon-timelapsepath13:before {
    content: "\ea67";

}
.icon-timelapsepath14:before {
    content: "\ea68";

}
.icon-timelapsepath15:before {
    content: "\ea69";

}
.icon-timelapsepath16:before {
    content: "\ea6a";

}
.icon-timelapsepath17:before {
    content: "\ea6b";

}
.icon-timelapsepath18:before {
    content: "\ea6c";

}
.icon-timelapsepath19:before {
    content: "\ea6d";

}
.icon-timelapsepath20:before {
    content: "\ea6e";

}
.icon-timelapsepath21:before {
    content: "\ea6f";

}
.icon-timelapsepath22:before {
    content: "\ea70";

}
.icon-timelapsepath23:before {
    content: "\ea71";

}
.icon-timelapsepath24:before {
    content: "\ea72";

}
.icon-timelapsepath25:before {
    content: "\ea73";

}
.icon-timelapsepath26:before {
    content: "\ea74";

}
.icon-timelapsepath27:before {
    content: "\ea75";

}
.icon-timelapsepath28:before {
    content: "\ea76";

}
.icon-timelapsepath29:before {
    content: "\ea77";

}
.icon-timelapsepath30:before {
    content: "\ea78";

}
.icon-timelapsepath31:before {
    content: "\ea79";

}
.icon-timelapsepath32:before {
    content: "\ea7a";

}
.icon-timelapsepath33:before {
    content: "\ea7b";

}
.icon-timelapsepath34:before {
    content: "\ea7c";

}
.icon-timelapsepath35:before {
    content: "\ea7d";

}
.icon-timelapsepath36:before {
    content: "\ea7e";

}
.icon-timelapsepath37:before {
    content: "\ea7f";

}
.icon-times:before {
    content: "\e98e";
}
.icon-tools:before {
    content: "\e9b9";
}
.icon-trash:before {
    content: "\e97f";
}
.icon-tripod:before {
    content: "\ea12";
}
.icon-tumblr:before {
    content: "\e989";
}
.icon-twitter:before {
    content: "\e9ab";
}
.icon-user:before {
    content: "\e9b5";
}
.icon-user-o:before {
    content: "\e9ba";
}
.icon-wechat:before {
    content: "\e9b6";
}
.icon-weibo:before {
    content: "\e9ac";
}
.icon-wifi:before {
    content: "\e9b1";
}
.icon-wrench:before {
    content: "\e9bb";
}
.icon-xls:before {
    content: "\e993";
}


/*拼团邀请 */
.invitePopup{
		width:82%;
		background: #fff;
		z-index: 1100;
		position: fixed;
		text-align: center;
		top:calc((100% - 50%)/2);
		left:calc((100% - 82%)/2);
		padding:2.5rem 1.5rem;
		padding-bottom:1.5rem;
		border-radius: 10px;
	}
	.inviteClose{
		position: absolute;
		right:0.7rem;
		top:1rem;
		width:1.5rem;
	}
	.inviteTitle{
		font-size: 1.5rem;
		color:#333333;
		margin-bottom:0.7rem;
	}
	.inviteContent{
		font-size: 1rem;
		
	}
	.shareList{
		padding: 0.8rem 0rem;
		    display: flex;
		    justify-content: center;
		    flex-wrap: wrap;
		    align-items: center;
		    border-bottom: 1px solid #E5E5E5;
	}
	.shareList div{
		/* width:3rem; */
		margin:0.7rem 1rem;
		display:flex;
		flex-direction: column;
		justify-content:center;
		align-items:center;
	}
	.shareList div img{
		width:2.5rem;
		margin-bottom:0.2rem;
	}
	.shareList div span{
		font-size: 0.9rem;
		color: #666666;
	}
	.inviteIntro{
		font-size: 0.9rem;
		color: #999999;
		margin:1rem 0 0rem 0
	}
	.mui-backdrop {
	    z-index: 1050;
	}
	.inviteMask{
		    position: fixed;
		    height: 100%;
		    width: 100%;
		    background: rgba(0,0,0,.5);
		    z-index: -1050;
		    top: 0;
		    left: 0;
			opacity: 0;
	}
	
	.courseDetail{
		background: #fff;
		/* margin-top:1.3rem; */
		display:flex;
		justify-content:space-between;
		align-items:center;
		padding:0rem 1rem;
		width:100%;
	}
	.courseDetail div{
		display:flex;
		flex-direction: column;
		justify-content:center;
		align-items:center;
	}
	.courseDetail div img{
		width:1.9rem;
		margin-bottom:0.2rem
	}
	.courseDetail div span{
		font-size: 0.85rem;
		color: #666666;
	}
	.courseDetail .dotLine{
		border-bottom:1px #EBEBEB dotted;
		width:20%;
		margin-bottom:1.6rem;
	}
	
	
.navMain{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	position: fixed;
	bottom:0;
	left:0;
	background-color: #fff;
	/* padding:0.25rem 0; */
	z-index: 100;
}
.navMain .navTab{
	width:25%;
	padding:0.5rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	
	font-size: 0.85rem;
}
.navMain .navTab p{
	color: rgb(20,20,20);
	font-size: 0.75rem;
}
.navMain .navTab.active p{
	color: #E60012;
}
.navMain .navTab img{
	width:1.55rem;
	margin-bottom: 0.25rem;
}
