@charset "utf-8";
/* ====================================================================================================
 * Public Styles (全站级公共样式)
 * ==================================================================================================== */
/* Reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0;}
table { border-collapse:collapse;border-spacing:0px;}
fieldset,img { border:0;}
em,strong,th,var { font-style:normal; font-weight:normal;}
ol,ul { list-style:none;}
caption,th { text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight:normal;}
q:before,q:after { content:'';}
abbr,acronym { border:0;}
img{vertical-align:top;border:0;}
li{list-style-type:none;}
label{ font-weight: normal;}

html{ -webkit-text-size-adjust:none;}
body{ height: 100%; font:14px/26px "Microsoft YaHei", "微软雅黑", "宋体", Arial; color: #666; letter-spacing: .03em; -webkit-font-smoothing: antialiased; background: #f6f6f6;}
input,select,textarea,button{ font:14px/22px "Microsoft YaHei", "微软雅黑", "宋体", Arial; color:#c7c7c7; outline: none;}
table{ font-size:inherit; font:100%;}
select{ -moz-appearance: none; -webkit-appearance:none; appearance:none;}
input[type="text"]:focus{ outline: none;}
/* Link */
a{ outline:none; text-decoration:none;}
a:hover, a:active, a:link, a:visited{ color: #00afa0; text-decoration:none;}

/* Form */
button{ cursor:pointer; border:0; padding:0; overflow:hidden;}
textarea { overflow:auto; resize:none;}
.input_c,.input_r{ width:16px; height:16px; padding:0; margin:2px 3px 2px 0; overflow:hidden; vertical-align:middle;}
/* Clearfix */
.clearfix:after, .form-group:after, .clearfixlist li:after, .tr:after{ content:"\0020"; display:block; clear:both; height:0; font-size:0;}
.clearfix, .form-group, .clearfixlist li, .tr{ zoom:1;}
.clear{ clear:both; display:block;}
/*form reset*/
.act_clear{ background:none; border:0 none; outline:none; overflow:hidden;}
.btn{ color:#fff; cursor:pointer; overflow:hidden;}
.btn-cancel{ color: #666;}
.icon-rect{ display: inline-block; width: 4px; height: 4px; vertical-align: middle; background: #666;}
.border-rect, .bounce-to-right.border-rect:before{ -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px;}
.border-circle, .iadd{ -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%;}
.border-oval{ -webkit-border-radius: 18px; -moz-border-radius: 18px; -o-border-radius: 18px; -ms-border-radius: 18px; border-radius: 18px;}

.youlianMw{    
background: url(../images/mw_logo_hover.png) no-repeat right center;color:#fff;
    padding-right: 92px;}
.youlianMw:hover{    
background: url(../images/mw_logo.png) no-repeat right center;color:#fff;
    padding-right: 92px;}
.fl{ float: left;}
.fr{ float: right;}
.container{ width: 100%; margin: 0 auto;}

.mr-4{ margin-right: 4px;}
.ml-8{ margin-left: 8px;}
.mt-8{ margin-top: 8px;}
.mt-18{ margin-top: 18px;}
.mb-8{ margin-bottom: 8px;}
.mb-12{ margin-bottom: 12px;}
.mb-20{ margin-bottom: 20px;}
.mb-28{ margin-bottom: 28px;}
.mb-30{ margin-bottom: 30px;}
.show-pad, .show-phone{ display: none;}

.font-16{ font-size: 16px;}
.font-25{ font-size: 25px; line-height: 38px;}

.body-white{ background: #fff;}
.gray{ color: #747474;} .green{ color: #00afa0;} .red{ color: #f80000;}
.pic img, .pic-left img, .pic-right img, .portrait img, .logo img, .banner img, .loading img{ width: 100%; height: 100%;}
.vertical{ display: table-cell; vertical-align: middle; text-align: center;}
.text-ellipsis{ text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.scale{ -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); transition: all ease 0.38s;}
a:hover .scale{ -webkit-transform: scale(1.08); -moz-transform: scale(1.08); -o-transform: scale(1.08); transform: scale(1.08);}

hr{ border-top: 1px solid #bfbfbf;}
.nodata{ padding-top: 168px; margin: 18px 0; font-size: 16px; text-align: center; background: url(../images/nodata.png) no-repeat center 0;}
.loading{ position: fixed; z-index: 999; top: 18%; left: 50%; width: 98px; height: 98px; margin-left: -48px;}

.animated{ -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}
.rotate{ -webkit-animation-name: rotate; animation-name: rotate;}
@-webkit-keyframes rotate{
	0%{ -webkit-transform-origin:center center; transform-origin:center center; -webkit-transform:rotate(-200deg); transform:rotate(-200deg);}
	100%{ -webkit-transform-origin:center center; transform-origin:center center; -webkit-transform:rotate(0); transform:rotate(0);}
}
@keyframes rotate{
	0%{ -webkit-transform-origin:center center; transform-origin:center center; -webkit-transform:rotate(-200deg); transform:rotate(-200deg);}
	100%{ -webkit-transform-origin:center center; transform-origin:center center; -webkit-transform:rotate(0); transform:rotate(0);}
}
@keyframes starGrow{ 0%{transform:scale(1)} 50%{transform:scale(4);opacity:1} to{transform:scale(1);opacity:1}}

/* Bounce To Right */
.bounce-to-right{ position: relative; vertical-align: middle;
  -webkit-transform: translateZ(0); transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden;
  backface-visibility: hidden; -moz-osx-font-smoothing: grayscale;
  -webkit-transition-property: color; transition-property: color;
  -webkit-transition-duration: 0.5s; transition-duration: 0.5s;
}
.bounce-to-right:before{ content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; color: #fff; background-color: #014f48;
  -webkit-transform: scaleX(0); transform: scaleX(0);
  -webkit-transform-origin: 0 50%; transform-origin: 0 50%;
  -webkit-transition-property: transform; transition-property: transform;
  -webkit-transition-duration: 0.5s; transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;
}
.bounce-to-right:hover, .bounce-to-right:focus, .bounce-to-right:active{ color: #fff;}
.bounce-to-right:hover:before, .bounce-to-right:focus:before, .bounce-to-right:active:before{
  -webkit-transform: scaleX(1); transform: scaleX(1);
  -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}

.scroll-top{ position: fixed; z-index: 99; bottom: 35px; right: 50px; width: 50px; height: 50px; opacity:0; -webkit-transform:translateX(100%) rotate(360deg); transform:translateX(100%) rotate(360deg); transition:all .5s ease; background: url(../images/btn-scrollTop.png) no-repeat 0 0; background-size: 100% 100%;}
.scroll-top.rollIn{ opacity:1; -webkit-transform:translateX(0px) rotate(0deg); transform:translateX(0px) rotate(0deg); transition:all .5s ease;}

.pagination>li>a, .pagination>li>span{ border-color: #e1e1e1; color: #999;}
.pagination>li:first-child>a, .pagination>li:first-child>span, .pagination>li:last-child>a, .pagination>li:last-child>span{ border-radius: 0;}
.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus,
.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus{ border-color: #00afa0; color: #fff; background-color: #00afa0;}

/* sprite */
.header-tel, .site-about, .sku-tips, .control-protocol input~i, .btn-more span, 
.test-list .arrow-more, .index-news .more, .index-news .remark .more, .amount-btn i, .footer-contact .item-tel i,
.form-search .input-control, .travel-list .arrow, .aside-member .btn-sign, .aside-member .icon-integrel, 
.more .icon-more, .label-single input:checked~i, .init-test .btn-back{ background: url(../images/sprite-icon.png) no-repeat 0 -9999em;}

/* 勾选 */
.label-single{ padding: 5px 10px; margin-bottom: 0;}
.label-single input~i{ display: inline-block; width: 26px; height: 26px; border: 1px solid #e2e2e2; vertical-align: middle;}
.label-single input:checked~i{ border-color: #f13030; background-color: #f13030; background-position: -1px -59px;}

/* header */
.header-login{ padding: 28px 0;}
.header-tel{ margin-left: 168px; padding-left: 48px; border-left: 1px solid #00afa0; margin-top: 5px; font-size: 24px; color: #00afa0; line-height: 48px; background-position: 15px 10px;}
.site-nav, .site-nav a{ color: #656565;}
.site-nav{ height: 32px; line-height: 32px; background: #f4f3f3;}
.site-nav a.sign-out{ padding-left: 18px;}
.site-nav i{ padding: 0 8px; font-style: normal;}
.site-about{ padding-left: 20px; margin-left: 28px; background-position: 0 -338px;}

.fixedNav{ position:fixed; z-index:100; top:0px; left:0px; width:100%; _position:absolute; _top:expression(eval(document.documentElement.scrollTop));}
.header-logo{ height: 72px; border-bottom: 1px solid #bfbfbf; background: #fff;}
h1.logo{ position: absolute; width: 150px; margin: 8px 0 12px;}
.navbar-nav{ float: right; width: 72%; height: 71px;}
.nav>li{ width: 16.66%; text-align: center;}
.nav>li.show-pad{ display: none;}
.nav>li>a{ height: 71px; padding: 0; line-height: 70px; font-size: 16px; color: #222; transition: all .2s ease-in-out;}
.nav>li>a:hover, .nav>li>a:focus, .nav>li.nav-hover>a, .nav>li.active>a{ color: #00afa0; border-top: 4px solid #00afa0; background: transparent;}
.dropdown-menu{ position: fixed; left: auto; width: 100%; border: 0 none; border-bottom: 3px solid #00afa0; background: #fff;}
.dropdown-menu>li{ float: right; width: 16.6%; font-size: 16px;}
.dropdown-menu>li>a{ padding: 8px 0; color: #222;}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus, .dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus{ color: #00afa0; background: none;}
.dropdown-menu .submenu{ padding-bottom: 18px; font-size: 14px; line-height: 28px;}
.dropdown-menu .submenu a{ color: #797477; -webkit-transition: all ease .4s; transition: all ease .4s;}
.dropdown-menu .submenu a:hover{ border-bottom: 1px solid #00afa0; color: #00afa0;}

/* footer */
.footer{ padding-top: 12px; font-size: 13px; line-height: 22px; background: #014f48;}
.footer img{ max-width: 100%;}
.footer, .footer a{ color: #459089;}
.footer a:hover{ color: #022724;}
.footer .name{ margin-bottom: 5px; font-size: 15px; color: #fff;}
.footer-logo{ width: 20%; margin-top: 28px;}
.friend-links, .footer-center{ width: 15%; text-align: center;}
.footer-contact{ width: 24%; margin-right: 1%;}
.footer-contact .item-tel{ margin: 18px 0; font-size: 22px; color: #fff;}
.footer-contact .item-tel i{ display: inline-block; width: 40px; height: 40px; vertical-align: middle; background-position: 0 -98px;}
.footer-contact .item-add{ margin-right: 8px;}
.qrcode{ width: 24%;} .footer-qrcode{ width: 18%;}
.qrcode-inner{ margin-top: 12px;}
.qrcode img{ width: 48%;}
.copyright{ padding: 8px; margin-top: 8px; font-size: 12px; color: #fff; text-align: center; opacity: .68; filter:Alpha(opacity=68); background: #022724;}
.copyright.fixed{ position: fixed; bottom: 0; left: 0; width: 100%;}
.copyright i{ font-style: normal;}

.fixedVideo{ position: fixed; right: 8px; bottom: 228px; width: 266px; background-color: #fff;}
.fixedVideo .btn-close{ width: 100%; height: 20px; background: url(../images/btn-close.png) no-repeat 98% center #292929; background-size: 12px;}
.fixedVideo .video{ width: 100%; height: 148px;}

/* ==== login & register ==== */
.content-login{ padding: 100px 0 78px; background: #3fbdb1;}
.content-login .container{ width: 360px; margin: 0 auto;}
.content-login .title{ margin-bottom: 18px; font-size: 24px; line-height: 38px; color: #fff;}
.content-login .form-group{ margin-bottom: 28px;}

.control-protocol, .control-protocol a{ color: #fff;}
.control-protocol{ position: relative; padding-left: 35px; margin-left: 80px; line-height: 30px;}
.control-protocol input~i{ display: block; position: absolute; top: 2px; left: 0; width: 28px; height: 28px; border: 1px solid #fff; margin-right: 8px; background-position: 0 -58px;}
.form-group{ margin-bottom: 12px;}
.form-control{ height: 42px; border: 0 none; border-radius: 0;}
.form-verify .form-control{ float: left; width: 64%;}
.form-verify .btn-verify{ float: right; width: 34%; height: 42px; padding: 8px 4px; border: 0 none; font-size: 13px; color: #3fbdb1; text-align: center; background: #fff;}
.btn-register{ display: block; width: 32%; height: 42px; margin: 0 auto; font-size: 16px; color: #fff; background: #014f48;}
.form-btns a{ color: #fff; cursor: pointer;}

.formtips{ clear: both; display: block; margin-left: 23%; font-size: 14px; line-height: 28px;}
.formtips.onError{ color: #a94442;}
.formtips.onSuccess{ color: #3c763d;}

/* banner 轮播 */
#carousel-generic{ margin-bottom: 18px; overflow: hidden;}
.carousel-inner>.item>a>img{ width: 100%; height: 100%;}
.carousel-indicators{ z-index: 2;}
.carousel-indicators li{ width: 12px; height: 12px; border: 2px solid #d3d3d3; background: transparent;}
.carousel-indicators .active{ width: 12px; height: 12px; border-color: #00afa0; background: #00afa0;}
.carousel-control .icon-prev, .carousel-control .icon-next{ width: 88px; height: 88px; margin-top: -30px; background: url(../images/btn-control.png) no-repeat 0 0; background-size: 88px 191px;}
.carousel-control .icon-next{ margin-right: -15px; background-position: 0 -104px;}
.carousel-control .icon-prev:before, .carousel-control .icon-next:before{ content: '\0020';}

.title, .title-upper{ text-align: center;}
.title{ line-height: 38px;}
.title span{ display: inline-block; vertical-align: middle;}
.title-china{ padding-right: 16px; border-right: 4px solid #00afa0; font-size: 24px; line-height: 34px; color: #00afa0;}
.title-en{ margin-right: -64px; margin-top: -5px; font-size: 24px; color: #e6e6e6;}
.title-tips{ width: auto; height: 28px; font-size: 14px; color: #666;}
.scrollNews ul, .scrollNews li, .scrollNews a{ width: 100%; height: 28px; color: #666; line-height: 28px; text-align: left;}

.title-upper{ border-bottom: 1px solid #d8d8d8; margin-bottom: 28px;}
.title-upper span{ display: block; line-height: 30px;}
.title-upper .title-china{ padding-right: 0; border-right: 0 none; font-size: 24px; color: #222;}
.title-upper .title-en{ position: relative; margin: 0; font-size: 16px; color: #e6e6e6; text-transform: uppercase;}
.title-upper i{ display: block; position: absolute; z-index: 8; bottom: -3px; left: 50%; width: 54px; height: 6px; margin-left: -28px; background: #00afa0;}

.index-mod{ margin-bottom: 28px;}
.index-mod .btn-more{ display: block; width: 188px; height: 52px; font-size: 16px; line-height: 52px; color: #fff; text-align: center; background: #00afa0;}
.index-mod .btn-more span{ display: inline-block; padding: 0 36px 0 8px; text-decoration: underline; background-position: 116% -168px;}

.index-news .title-upper{ margin-bottom: 8px;}
.index-news li{ float: left; position: relative; width: 49%; padding: 10px 0; border-bottom: 1px dotted #e7e7e7; font-size: 13px;}
.index-news li:nth-child(2n){ float: right;}
.index-news a{ color: #888;}
.index-news .name{ padding-right: 78px; font-size: 17px; color: #303030;}
.index-news .name, .index-news .info{ margin-bottom: 4px;}
.index-news .info{ height: 24px;}
.index-news .date{ display: inline-block; position: absolute; top: 10px; right: 0; font-size: 12px;}
.index-news .btn-more{ margin: 28px auto 0;}
.index-news a:hover, .index-news a:hover .name{ color: #00afa0;}

.swiper-container .iadd{ width: 28px; height: 28px; margin: 18px auto; font-size: 16px; color: rgba(0,0,0,.88); text-align: center; background: #fff;}
.mod-culture .title-upper{ border: 0 none; margin: 0;}
.mod-culture .bd{ padding: 45px 0 38px; text-align: center; background: #00afa0;}
.swiper-culture .pic{ position: relative; width: 100%; max-width: 348px; border: 1px solid #fff; margin: 0 auto; overflow: hidden;}
.swiper-culture .remark{ display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.68);}
.swiper-culture .name, .swiper-culture .tit{ margin-top: 18px; font-size: 16px; font-weight: bold; color: #fff;}
.swiper-culture .tit{ margin-top: 58px;}
.swiper-culture a:hover .name{ opacity: 0;}
.swiper-culture a:hover .remark{ display: block;}

.index-product .pic{ _display: inline; float: left; width: 38%; margin-left: 2%; overflow: hidden;}
.index-product .detail{ float: right; width: 56%; font-size: 14px; color: #666;}
.index-product .name{ font-size: 16px; line-height: 38px; color: #00afa0;}
.index-product .subname{ margin-bottom: 18px; font-size: 14px; color: #666;}
.index-product .btn-more{ margin-top: 18px;}
.nature-list li{ margin-bottom: 5px;}
.nature-list .nature{ font-size: 14px; color: #222;}

.mod-server{ padding: 0 0 28px;}
.swiper-server .inner{ position: relative; width: 100%;}
.swiper-server .diamond{ position: absolute; z-index: 8; top: 50%; left: 50%; width: 22px; height: 20px; margin-left: -10px; margin-top: -11px; background: url(../images/diamond.png) no-repeat center center;}
.swiper-server .pic, .swiper-server .info{ float: left; width: 50%;}
.swiper-server .pic{ overflow: hidden;}
.swiper-server .info{ position: relative; font-size: 12px; color: #fff; background: #7fd7cf;}
.swiper-server .name, .swiper-server .en{ position: absolute; left: 0; width: 100%; padding: 0 10px;}
.swiper-server .name{ bottom: 48px; font-size: 16px; font-weight: 600;}
.swiper-server .en{ bottom: 28px; text-transform: uppercase;}
.swiper-server .right{ text-align: right;}
.swiper-server .iadd{ display: none; margin-top: 38px; color: #00afa0;}
/*.swiper-server .pic:hover{-webkit-filter: grayscale(50%); -moz-filter: grayscale(50%); -ms-filter: grayscale(50%); -o-filter: grayscale(50%); filter: grayscale(50%); filter: gray;}*/
.swiper-server .info:hover{ text-align: center; background: #00afa0;}
.swiper-server .info:hover .iadd{ display: block;}
.swiper-server .info:hover .en{ bottom: 38px;}
.swiper-server .info:hover .name{ bottom: 58px;}


/*.index-flash{ margin-bottom: 28px;}
.index-flash .title-china{ margin-right: 16px; font-size: 20px;}
.flash-list li{ float: left; width: 25%;}
.flash-list a{ display: block; margin: 0 19%;}
.flash-list img{ width: 100%; height: 100%;}
.index-test .test-content{ padding: 58px 0 68px; margin: 50px 0 32px; background: #00afa0;}
.index-test .test-content .container{ position: relative;}
.index-test .person{ display: block; position: absolute; top: -87px;}
.index-test .person .pic{ width: 178px; height: 278px;}
.index-test .person .name{ width: 246px; height: 82px; padding-top: 12px; padding-right: 60px; margin-top: -16px; font-size: 20px; line-height: 70px; text-align: right;}
.index-test .person .name .name-china{ font-size: 30px;}
.index-test .man{ left: 0; color: #31c8fb;}
.index-test .man .pic{ margin-left: 52px;}
.index-test .man .name{ background: url(../images/bg-man.png) no-repeat 0 0; background-size: 246px 82px;}
.index-test .woman{ right: 0; color: #e2008f;}
.index-test .woman .pic{ margin-left: 17px;}
.index-test .woman .name{ padding-left: 60px; padding-right: 0; text-align: left; background: url(../images/bg-woman.png) no-repeat 0 0; background-size: 246px 82px;}
.index-test .btn-more{ margin: 0 auto;}
.index-test .center{ display: block; width: 300px; padding: 32px 38px; border: 4px solid #fff; margin: 0 auto; line-height: 48px; color: #fff; text-align: center;}
.index-test .center .name{ padding: 18px 0; border-bottom: 4px solid #fff; font-size: 36px;}
.index-test .center em{ font-size: 50px; letter-spacing: -8px;}
.index-test .center .tips{ font-size: 16px;}
.test-list li{ float: left; width: 16.6%; margin-bottom: 20px;}
.test-list a{ display: block; padding: 12px 0 8px; border: 1px solid #e1e1e1; margin: 0 18px; text-align: center; transition: all 0.58s ease;}
.test-list .pic{ width: 50%; margin: 0 auto 8px; overflow: hidden;}
.test-list .pic img{ transform: scale(1); transition: all 0.58s ease;}
.test-list .name{ font-size: 16px; color: #222; line-height: 32px;}
.test-list .more{ font-size: 14px; color: #9c9c9c; transition: all 0.58s ease;}
.test-list .arrow-more{ display: inline-block; width: 0; height: 8px; vertical-align: middle; transition: all 0.58s ease; background-position: 0 -258px;}
.test-list a:hover{ border-color: #00afa0;}
.test-list a:hover img{ transform: scale(1.08);}
.test-list a:hover .more{ color: #00afa0;}
.test-list a:hover .arrow-more{ width: 20px;}
.init-service .test-list li{ width: 25%;}
.init-service .test-list a{ margin: 0 32px;}

.index-service{ background: #00afa0;}
.service-list .title{ position: relative; height: 58px; margin: 18px 0; line-height: 38px; text-align: left;}
.service-list .title .title-china{ position: absolute; top: 8px; left: 5px; border-right: 0; margin-bottom: 0; color: #fff;}
.service-list .title .title-en{ margin: 0; color: #57c9bf;}
.service-list .title .title-line{ display: block; width: 55px; height: 4px; background: #fff;}
.service-list .pic-right{ float: right; width: 22%;}
.service-list a{ float: left; width: 50%; overflow: hidden;}
.service-list img{ -webkit-transform: scale(1); transform: scale(1); transition: all 0.58s ease;}
.service-left, .service-center{ float: left;}
.service-left{ width: 38%;}
.service-left .pic-left{ width: 100%;}
.service-center{ width: 40%;}
.service-list a:hover img{ -webkit-transform: scale(1.08); transform: scale(1.08);}*/
/*.index-news .title-china{ padding: 0; border: 0 none; margin-top: -28px; color: #333;}
.index-news .title-line{ width: 55px; height: 4px; margin-top: 8px; background: #46c2b7;}
.index-news .news-list{ float: left; width: 66%;}
.index-news .pic{ float: right; position: relative; width: 30%; overflow: hidden;}
.index-news .pic img{ transform: scale(1); transition: all 0.38s ease;}
.index-news .more{ display: inline-block; padding-right: 28px; margin-top: 12px; font-size: 14px; color: #00afa0; text-decoration: underline; background-position: right -280px;}
.index-news .remark{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; color: #fff; background: rgba(0,0,0,.48);}
.index-news .remark .vertical{ width: 100%; height: 100%;}
.index-news .remark .name{ margin-bottom: 18px; font-size: 20px; line-height: 48px; color: #fff;}
.index-news .remark .subname{ margin-bottom: 8px;}
.index-news .remark .more{ width: 28px; height: 26px; margin: 0 auto; background-position: 0 -180px;}*/

/* ================= init ================ */
.crumb{ padding: 12px 0;}
.crumb, .crumb a{ color: #666;}
.crumb a:hover{ color: #00afa0;}

/* product */
.init-white .container{ padding: 0; background: #fff;}
.summary{ padding: 28px 10px 28px 28px;}
.gallery{ float: left; width: 440px; margin-bottom: 28px;}
.box{ width: 440px;}
.tb-pic a{display:table-cell;text-align:center;vertical-align:middle;}
.tb-pic a img{ vertical-align:middle;}
.tb-pic a{ *display:block; *font-family:Arial; *line-height:1;}
.thumbnail{ position: relative; border: 0 none; margin-bottom: 8px;}
.thumbnail_slide{ margin: 0 auto;}
.thumbnail .trigger{ display:block; position: absolute; top: 28px; cursor:pointer; width:15px; height:28px; text-indent:-9999em; background: url(../images/btn-thumbnail.png) no-repeat 0 -999em;}
.thumbnail .prev{ left: 12px; background-position: 0 0;}
.thumbnail .next{ right: 12px; background-position: 0 -73px;}
.tb-booth{ position:relative; z-index:1; margin-bottom: 18px;}
.tb-booth, .tb-booth a{ height:440px; width:440px;}
.tb-booth, .tb-booth img{ max-height:440px; max-width:440px;}
.tb-thumb{ overflow:hidden;}
.tb-thumb li{ float:left; height:78px; margin: 0 15px; overflow:hidden;}
.tb-thumb .tb-pic{ border:1px solid #ddd;}
.tb-thumb .tb-selected .tb-pic{ height:78px; width:78px; border:2px solid #00afa0;}
.zoomDiv{ display:none; position:absolute; z-index:999; top:0px; left:0px; width:200px; height:200px; border:1px solid #ccc; text-align:center; background:#fff; overflow:hidden;}
.zoomMask{ position:absolute; z-index:1; background:url("../images/mask.png") repeat scroll 0 0 transparent; cursor:move;}

/* Slider */
.slider-product{ display: none;}
.slick-slider{ position:relative; display:block;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.slick-slider:active,.slick-slider:focus{outline:0;blr:expression(this.onFocus="this.blur"());cursor:pointer}
.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}
.slick-list:focus{cursor:pointer;outline:0}
.slick-list.dragging{cursor:pointer;cursor:hand}
.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
.slick-slide{display:none;float:left;height:100%;min-height:1px}
[dir=rtl] .slick-slide{float:right}
.slick-slide img{display:block; width: 100%; height: 100%;}
.slick-slide.slick-loading img{display:none}
.slick-slide.dragging img{pointer-events:none}
.slick-initialized .slick-slide{display:block}
.slick-loading .slick-slide{visibility:hidden}
.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}
.slick-arrow.slick-hidden{display:none}
.slick-dots{ position: absolute; bottom: 28px; list-style: none; display: block; height: 18px; text-align: center; padding: 0px; width: 100%; }
.slick-dots li { position: relative; display: inline-block; height: 16px; width: 16px; margin: 0px 5px; padding: 0px; cursor: pointer; }
.slick-dots li button { border: 0; background: #fff; display: block; height: 16px; width: 16px; border-radius: 50%; outline: none; line-height: 0; font-size: 0; color: transparent; padding: 5px; cursor: pointer; outline: none; }
.slick-dots li button:focus { outline: none;}
.slick-dots li.slick-active button{ background: #0089dc;}
.store-list .slick-dots{ bottom: 8px;}

/* 产品详情 按钮 */
#property{ float: right; margin-bottom: 25px;}
#property .name{ margin-top: 38px; margin-bottom: 12px; font-size: 18px; color: #00afa0;}
#property .subname{ margin-bottom: 50px; font-size: 16px; color: #666;}
#property .nature-list li{ margin-bottom: 8px;}

.tb-sku span, .tb-sku label{ float: left; margin-right: 16px;}
.tb-sku .attr{ margin-left: 48px; font-size: 16px; color: #222;}
.tb-sku .sku-tips, .sku-tips{ display: none; height: 18px; padding-left: 20px; margin-left: 44px; font-size: 12px; line-height: 16px; background-position: 0 -345px;}
.tb-num{ margin: 28px 0 30px; line-height: 36px; color: #999;}
.tb-sku .amount-btn{ margin-right: 0;}
.amount-input{ float: left; width: 60px; height: 36px; border: 1px solid #ccc; font-size: 16px; color: #999; text-align: center;}
.amount-btn{ float: left; width: 32px; height: 36px; border: 1px solid #ccc; border-left: 0;}
.amount-btn i{ display: block; width: 100%; height: 17px; margin: 0; cursor: default; overflow: hidden;}
.amount-btn .amount-increase{ border-bottom: 1px solid #ccc; background-position: 0 -398px;}
.amount-btn .amount-decrease{ background-position:  0 -440px;}
.btn-action .btn{ float: left; padding: 6px 20px; font-size: 16px; color: #fff;}
.btn-action .btn-buy{ width: 158px; height: 42px; margin-left: 78px; line-height: 28px; background: #00afa0;}

.line{ width: 100%; border-top: 1px solid #1ebbad; margin: 38px 0 25px;}

.virture-list li{ float: left; width: 20%; text-align: center;}
.virture-list i{ display: block; width: 56px; height: 56px; margin: 0 auto 8px;}

.details{ color: #222;}
.details .nav-tabs{ padding: 0 28px; border-bottom: 2px solid #00afa0; margin-bottom: 18px;}
.details .nav-tabs>li>a, .details .nav-tabs>li.active>a{ height: 43px; border: 0 none; border-radius: 0; margin-right: 4px; font-size: 16px; line-height: 43px; color: #222;}
.details .nav-tabs>li.active>a, .details .nav-tabs>li>a:hover, .details .nav-tabs>li.active>a:hover, .details .nav-tabs>li.active>a:focus{ color: #fff; background: #00afa0;}
/* details 产品详细 */
.details .item-tips{ padding: 18px 0 28px 180px; border-top: 2px solid #f2f2f2; color: #00afa0; text-align: center; background: url(../images/tips.png) no-repeat 30% center #ecf7f1;}
.details .item-tips h2{ font-size: 30px; font-weight: bold; line-height: 48px;}
.details .item-tips p{ font-size: 16px; font-weight: 100; line-height: 36px;}
.details .item-tips span{ font-size: 20px; font-weight: bold;}

.tab-pane .content{ width: 90%; padding-bottom: 58px; margin: 0 auto;}
.vertical-bottom{ display: table-cell; text-align: center; vertical-align: bottom;}
.item-nutrition{ width: 80%; padding: 50px 0 28px; margin: 0 auto;}
.item-nutrition .info, .item-nutrition .pic-outer{ width: 50%; text-align: center;}
.item-nutrition .name{ display: inline-block; padding: 20px; border: 10px solid #29c7b8; margin-bottom: 28px; font-size: 70px; line-height: 60px; color: #fff; text-align: center; background: #00afa0;}
.item-nutrition .name span{ display: block;}
.item-nutrition p{ font-size: 26px; line-height: 48px; color: #00afa0;}
.item-nutrition strong{ font-weight: bold;}
.item-nutrition .pic{ width: 100%;}

.details .green{ color: #00afa0;}
.details .pro-title{ height: 68px; margin-bottom: 28px; text-align: center; background: url(../images/bg2.png) no-repeat center bottom;}
.details .pro-title h2{ height: 60px; font-size: 34px; line-height: 60px; color: #fff; background: #00afa0;}
.details .pro-subtitle{ margin-bottom: 28px; font-size: 24px; font-weight: 500; line-height: 30px; color: #000; text-align: center;}
.details .pro-subtitle .green{ font-weight: 600;}

.item-bone{ padding-bottom: 18px;}
.bone-list li, .clinical-list li{ padding: 0 8%; margin-bottom: 10px; font-size: 16px;}
.bone-list .pic, .clinical-list .pic-outer{ float: left; width: 28%;}
.bone-list .info, .clinical-list .info{ float: right; width: 68%;}
.bone-list .info .vertical{ text-align: left;}
.bone-list li:nth-child(2n) .pic{ float: right;}
.bone-list li:nth-child(2n) .info{ float: left;}

.clinical-list .name{ font-size: 12px; text-align: center;}
.clinical-list .subname{ height: 36px; padding-left: 18px; margin: 8px 0 28px; font-size: 16px; line-height: 36px; background: #e4d7aa;}
.clinical-list li{ margin-bottom: 28px;}
.clinical-list .pic-outer{ width: 20%;}
.clinical-list .tips{ margin-top: 28px; font-size: 14px; text-align: left;}
.clinical-list span{ float: left; height: 36px; padding: 0 18px; margin: 0; line-height: 36px; color: #fff; background: #00afa0;}
.clinical-list .slip{ margin-top: -12px; margin-left: -18px;}

.item-devote .content{ padding: 0 8%;}
.item-devote .pic{ float: left; width: 28%;}
.item-devote .info{ float: right; width: 48%; font-size: 16px; font-weight: 600; line-height: 28px; color: #48514f;}
.item-devote .pro-subtitle{ margin-bottom: 12px; font-size: 34px; color: #00afa0;}
.item-devote .green{ font-size: 16px; font-weight: 500;}
.devote-bone{ margin: 38px 0;}
.devote-bone .info{ float: left; width: 48%; padding-top: 18px; font-weight: normal; text-align: right;}
.devote-bone .pic{ float: right; width: 48%;}
.devote-bone li{ height: 30px; padding-right: 28px; margin-bottom: 42px; line-height: 30px; background: url(../images/bg3.png) no-repeat right center;}
.devote-bone li:nth-child(1){ margin-right: -38px;}
.devote-bone li:nth-child(2){ margin-right: -8px;}
.devote-bone li:nth-child(3){ margin-right: 28px; background: url(../images/bg5.png) no-repeat right center;}
.devote-bone li:nth-child(4), .devote-bone li:nth-child(5){ background: url(../images/bg4.png) no-repeat right center;}
.devote-bone li:nth-child(4){ margin-right: -8px;}
.devote-bone li:nth-child(5){ margin-right: -38px;}

.item-others .pic{ width: 48%; margin: 0 auto 28px;}
.item-expensive{ text-align: center;}
.item-expensive .tips{ margin-bottom: 38px; font-size: 14px; color: #5b5a5a;}
.item-expensive .pic{ width: 68%; margin: 0 auto 18px;}
.expense-list .subitem{ width: 58%; margin: 0 auto;}
.expense-list .name{ display: inline-block; padding: 8px 28px; margin-bottom: 8px; font-size: 24px; letter-spacing: 5px; background: #e4d7aa;}
.expense-list .info{ margin-bottom: 48px; font-size: 16px; font-weight: 500; color: #000;}

.knowledge-list{ width: 88%; margin: 38px auto;}
.knowledge-list li{ float: left; width: 30.3%; padding: 18px; margin: 0 1.5%; background: url(../images/bg-knowledge01.png) repeat 0 0;}
.knowledge-list li:nth-child(2n){ color: #fff; background-image: url(../images/bg-knowledge02.png); }
.knowledge-list .name{ margin-bottom: 8px; font-size: 22px; line-height: 28px;}

/* details 品牌故事 */
.item-poetry{ padding: 28px 28px 0; background: url(../images/bg-poetry.png) no-repeat center center;}
.item-poetry dt{ float: right; width: 30px; margin-left: 18%; font-size: 30px; word-wrap: break-word;}
.item-poetry dd{ float: right; width: 16px; margin-left: 8px; font-size: 16px; font-weight: 600; word-wrap: break-word;}
.item-poetry .mt-28{ margin-top: 28%;}
.item-poetry .mt{ margin-top: 8%;}
.item-poetry .straw{ color: #bfac67;}
.item-poetry .ml{ margin-left: 15%;}

.item-recent .pic{ float: right; width: 24%;}
.item-recent .info{ float: left; width: 68%; padding-top: 28px; padding-left: 48px; background: url(../images/sup.png) no-repeat 0 0;}
.item-recent .name{ font-size: 32px; font-weight: 600; line-height: 38px;}
.item-recent .subname{ font-size: 22px; font-weight: 500; line-height: 28px;}
.item-recent p{ margin-bottom: 8px;}
.item-recent .sub{ padding-right: 38px; padding-bottom: 8px; background: url(../images/sub.png) no-repeat right bottom;}

.item-ninety .info{ float: left; width: 48%;}
.item-ninety .pic{ float: right; width: 40%;}
.item-ninety .name, .item-ninety .subname{ margin-bottom: 18px;}
.item-ninety .name{ font-size: 50px; line-height: 58px;}
.item-ninety .subname{ font-size: 35px; line-height: 40px;}
.item-ninety .tips{ display: inline-block; padding: 8px 18px; font-size: 26px; color: #fff; background: #bfac67;}

.item-century .name-outer{ padding: 6px; margin-bottom: 18px; background: #00afa0;}
.item-century .name{ padding: 8px; border: 3px solid #fff; color: #fff; text-align: center;}
.item-century .name h3{ font-size: 50px; line-height: 58px; font-weight: 400;}
.item-century .name h5{ font-size: 30px; letter-spacing: 15px; line-height: 38px;}
.item-century .width-half{ width: 48%; font-size: 20px; line-height: 40px; color: #222;}

.item-about{ padding-top: 38px; border-top: 8px solid #00afa0; line-height: 32px; text-align: center;}
.item-about h3{ margin-bottom: 8px; font-size: 25px; line-height: 32px; color: #bfac67;}
.item-about .info{ margin-bottom: 28px; font-size: 16px; font-weight: 400;}

/* 问答 */
.tab-answer .content{ padding-bottom: 28px;}
.form-faq .control-label{ margin-bottom: 12px;}
.form-faq .textarea-control{ border: 1px solid #eee;}
.form-faq .btn-submit{ padding: 6px 18px; background: #00AFA8;}
.form-faq .btn-submit:hover, .form-faq .btn-submit:focus{ color: #fff;}

.answer-detail{ padding: 18px 0; border-top: 8px solid #00afa0;}
.answer-detail li{ padding-bottom: 18px; border-bottom: 1px dashed #666; margin-bottom: 18px;}
.answer-detail .name{ margin-bottom: 4px; font-size: 16px; font-weight: 600; color: #00afa0;}
.answer-detail .date-outer{ font-size: 14px; line-height: 30px;}

/* 服用贴士 */
.tab-tips h3{ font-size: 30px; line-height: 48px; color: #00afa0;}
.item-step .info{ float: left; width: 58%; padding-left: 38px;}
.item-step .pic{ float: right; width: 38%;}
.step-list li{ margin-bottom: 4px; list-style: circle;}
.item-guide .width-half{ width: 48%;}
.item-guide .name{ position: relative; z-index: 1; width: 178px; height: 48px; padding: 0 18px; margin: 0 auto; font-size: 24px; line-height: 48px; color: #fff; text-align: center; background: #00afa0;}
.item-guide .info{ padding: 38px 18px 24px; border: 1px solid #00afa0; margin-top: -24px; margin-bottom: 18px; font-size: 16px;}
.item-guide .info-orange{ border-color: #eadfb6;}
.item-guide .pic{ width: 90%; margin: 28px auto 0;}
.item-guide .tips{ font-size: 16px; color: #707070;}

/* ========= service ========= */
.init-service{ padding-bottom: 28px;}
.init-service .service-list li{ float: left; width: 33.3%; margin-bottom: 0;}
.init-service .service-list a{ float: none; display: block; width: 100%; padding: 8px 38px;}
.init-service .service-list .pic{ width: 100%; border: 4px solid transparent; margin-bottom: 8px; overflow: hidden; transition: all 0.58s ease}
.init-service .service-list .name{ font-size: 16px; color: #666; line-height: 28px; text-align: center;}
.init-service .service-list a:hover .name{ color: #00afa0;}
.init-service .service-list a:hover .pic{ border: 4px solid #00afa0;}

.store-search{ padding: 28px;}
.store-search .tips{ float: left; width: 58%;}
.store-search .form-outer{ float: right; width: 40%; margin-top: 8px;}
.form-search .input-control{ float: left; width: 78%; height: 34px; padding-left: 42px; border: 0 none; line-height: 32px; color: #222; background-position: 0 -390px; background-size: 32px 638px; background-color: #f4f3f3;}
.form-search .btn-search{ float: right; width: 20%; height: 34px; line-height: 34px; color: #fff; cursor: pointer; text-align: center; background: #00afa0;}

/* 店铺选择 地图 */
.map{ position:relative; width:856px; margin:0 auto 38px;}
.map a{ display:block; color:#5b5a5a; font-size:14px; text-decoration:none; cursor:pointer}
.map a:hover{ color:red;}
.citybg{ display:none; position:absolute; z-index:3; }
.city.active .citybg, .city:hover, .city.active{ display:block; z-index:3;}

.store-spread{ width: 80%; padding: 28px 0; margin: 0 auto; text-align: center;}
.store-spread img{ width: 100%;}
.store-result .title{ padding: 10px; font-size: 16px; color: #fff; line-height: 28px; background: #999;}
.result-list li{ float: left; width: 50%; padding: 38px;}
.result-list .pic{ float: left; width: 38%;}
.result-list .info{ float: right; width: 58%;}
.result-list .vertical{ text-align: left;}
.result-list .name{ margin-bottom: 20px; font-size: 16px; color: #00afa0;}
.result-list .attr{ font-size: 16px;}

.travel-list li{ padding: 12px; border-bottom: 1px solid #cacaca;}
.travel-list a{ color: #666;}
.travel-list .arrow-outer{ float: left; width: 48px; margin-right: 18px;}
.travel-list .arrow{ width: 48px; height: 35px; background-position: center -548px;}
.travel-list .pic{ float: right; width: 240px; height: 160px; margin-left: 18px;}
.travel-list .pic img{ -webkit-transform: scale(1); transform: scale(1); transition: all 0.38s ease;}
.travel-list .vertical{ height: 160px; text-align: left;}
.travel-list .name{ font-size: 16px;}
.travel-list .name{ margin-bottom: 8px;}
.travel-list .info{ height: 52px; margin-bottom: 8px; overflow: hidden;}

.travel-list a:hover .arrow{ background-color: #00afa0; background-position-y: -588px;}
.travel-list a:hover .name{ color: #00afa0;}
.travel-list a:hover .pic img{ -webkit-transform: scale(1.08); transform: scale(1.08);}

.init-nav{ border-bottom: 1px solid #d2d2d2;}
.init-nav a{ float: left; padding: 15px 4px; border-bottom: 2px solid transparent; margin: 0 18px; font-size: 16px; color: #666;}
.init-nav a.active, .init-nav a:hover{ border-bottom-color: #00afa0; font-weight: bold; color: #00afa0;}
.about{ padding-bottom: 30px;}
.about .title{ margin: 20px 0; font-size: 28px; font-weight: bold; color: #00afa0; }
.about .pic{ width: 100%; margin: 0 auto 18px;}
.about .name{ padding-left: 20px; margin-bottom: 18px; font-size: 20px; font-weight: 600; color: #222;}
.about .name .green{ color: #00afa0;}
.about p{ padding: 0 18px; margin-bottom: 18px;}

.box{ display: -moz-box; display: -webkit-box; display: box; width: 100%; overflow: hidden;}
.box .flex-one{ width: 33.3%;}
.box .flex-center{ margin: 0 8px;}
.box .pic{ margin-bottom: 0;}

/* ================= 会员中心 =============== */
/* 积分兑换列表 */
.integral-list{ padding: 15px 0;}
.integral-list li{ float: left; width: 25%; margin-bottom: 28px; text-align: center;}
.integral-list a{ display: block; padding: 0 12px;}
.integral-list .pic{ border: 1px solid #d8d8d8; margin-bottom: 8px;}
.integral-list .name{ height: 26px; margin-bottom: 2px; font-size: 14px; color: #767676;}
.integral-list .points{ margin-bottom: 8px; color: #fea000;}
.integral-list .btn{ width: 38%; height: 36px; padding-left: 0; padding-right: 0; border: 0 none; font-size: 12px; line-height: 24px; color: #fff; background: #18c8b1;}
.integral-list a:hover .pic{ border-color: #00afa0;}
.integral-list a:hover .name{ color: #00afa0;}

/* forum */
.forum .nav-tabs{ margin-bottom: 16px;}
.forum .nav-tabs>li{ width: auto; margin: 0 18px; text-align: center;}
.forum .nav-tabs>li>a{ height: 58px; padding: 0 8px; border: 0 none; border-bottom: 2px solid transparent; font-size: 16px; line-height: 58px; color: #666;}
.forum .nav-tabs>li.active>a, .forum .nav-tabs>li>a:hover, .forum .nav-tabs>li>a:focus{ border: 0 none; border-bottom: 2px solid #00afa0; font-weight: bold; color: #00afa0; background: transparent;}
.forum .nav-tabs>li.btn-forum{ float: right; margin-top: 5px;}
.forum .nav-tabs>li.btn-forum>a, .main-myforum .btn-forum{ width: 88px; height: 40px; padding-right: 15px; -webkit-border-radius: 8px; border-radius: 8px; line-height: 40px; color: #fff; text-align: right; background: url(../images/btn-forum.png) no-repeat 12px center #00afa0; background-size: 20px;}
.main-myforum .title{ position: relative; height: 40px; margin-bottom: 12px;}
.main-myforum .btn-forum{ display: block; position: absolute; top: 0; right: 0; width: 88px; height: 40px; padding-right: 18px; line-height: 40px; color: #fff;}

.forum-table .th, .forum-table .td{ float: left; width: 25%; text-align: center;}
.forum-table .th{ padding: 12px; font-size: 16px; color: #00afa0; background: #cbf6f4;}
.forum-table .td{ padding: 12px; font-size: 14px; line-height: 20px; color: #999;}
.forum-table .topic{ width: 50%; color: #222;}
.forum-table .tbody .topic{ text-align: left;}
.forum-table a:hover{ color: #00afa0;}
.forum-list{ margin-bottom: 28px;}
.forum-list li:nth-child(2n){ background: #e5fefc;}
.topic .item{ height: 22px; overflow: hidden;}
.topic em{ display: inline-block; width: 46px; height: 26px; -webkit-border-radius: 4px; border-radius: 4px; margin-right: 8px; font-size: 14px; line-height: 26px; color: #fff; text-align: center;}
.topic em.hot{ background: #fe0036;}

.forum-detail{ padding: 20px;}
.forum-detail p{ margin-bottom: 8px;}
.forum-detail .pic{ width: 49.5%;}
.forum-detail .btn-thumbup{ display: block; width: 122px; height: 36px; padding-left: 26px; margin: 0 auto; line-height: 36px; color: #fe0036; cursor: pointer; text-align: center; background: url(../images/btn-thumbup.png) no-repeat center center;}
.forum-detail .btn-thumbup span{ display: block; background: url(../images/icon-thumbup.png) no-repeat left center;}
.forum-detail .portrait{ float: left; width: 78px; height: 78px; margin-right: 28px;}
.forum-detail .portrait img{ -webkit-border-radius: 50%; border-radius: 50%;}
.forum-detail .portrait-relate{ float: left; margin-bottom: 8px;}
.forum-detail textarea.form-control{ border: 1px solid #00afa0;}
.forum-detail .btn-submit{ float: right; width: 68px; height: 30px; padding: 0; margin-top: 8px; font-size: 12px; line-height: 28px; color: #00afa0; background: url(../images/btn-submit.png) no-repeat 0 0;}
.portrait-relate .caption{ margin-bottom: 5px; font-size: 20px; line-height: 38px; color: #000;}
.portrait-relate .name{ margin-bottom: 5px; font-size: 14px; color: #999;}
.portrait-relate .topic{ color: #999;}
.replay-comment .btn-replay{ margin-bottom: 12px;}

.forum-item{ border-bottom: 1px solid #e7e7e7; margin-bottom: 18px;}
.forum-item .portrait{ margin-right: 12px;}
.forum-item .portrait-relate{ float: none;}
.portrait-relate .date{ color: #999;}
.forum-sublist{ padding: 0 18px; border: 1px solid #ebebeb; margin-left: 94px; background: #f8f8f8;}
.forum-sublist li{ padding: 12px 0; border-bottom: 1px solid #e7e7e7;}
.forum-sublist li:last-child{ border-bottom: 0 none;}
.forum-sublist .portrait{ width: 40px; height: 40px;}
.forum-sublist .portrait-relate{ margin-bottom: 0;}
.forum-sublist p{ margin-bottom: 0;}
.forum-sublist .date{ font-size: 12px; color: #666; text-align: right;}
.forum-sublist .gray{ color: #999;}

.subcomment{ margin-left: 94px;}
.btn-comment{ float: right; height: 32px; padding: 0 8px; margin-bottom: -1px; color: #00afa0; line-height: 30px; cursor: pointer; text-align: center;}
.btn-comment.current{ padding: 0 18px; border: 1px solid #ebebeb; border-bottom: 0 none; background: #f8f8f8;}
.subcomment-textarea{ display: none; width: 100%; padding: 15px 18px 12px; border: 1px solid #ebebeb; border-bottom: 0 none; background: #f8f8f8;}

.modal-dialog .btn-save{ background: #00afa0;}
.modal-dialog .btn:hover{ color: #fff;}

/* 会员 */
.banner-member{ height: 490px; margin-bottom: 18px; background: url(../images/banner-member.jpg) no-repeat center center; background-size: cover;}
.banner-member .container{ position: relative;}
.aside-member{ position: absolute; top: 30px; right: 8px; width: 360px; box-shadow: 0 0 6px rgba(0,0,0,.38); font-size: 16px; background: #fff;}
.aside-member .name{ height: 60px; font-size: 20px; font-weight: bold; line-height: 60px; color: #fff; background: #09dbc9;}
.aside-member .portrait{ width: 118px; height: 118px; margin: 0 auto 10px;}
.aside-member .info{ padding: 20px 24px;}
.aside-member .subname{ margin-bottom: 10px; color: #666;}
.aside-member .btn-sign{ display: block; width: 130px; height: 35px; padding-left: 20px; border: 1px solid #00afa0; margin: 0 auto 15px; line-height: 34px; color: #00afa0; background-color: #c7f6f2; background-position: 5px -650px;}
.aside-member .surplus{ display: block; margin-bottom: 20px; color: #00afa0;}
.aside-member .surplus b{ font-size: 20px;}
.aside-member .btn-enter{ display: block; width: 70%; height: 46px; margin: 0 auto; line-height: 46px; color: #fff; background: #00afa0;}
.aside-member .icon-integrel{ display: inline-block; width: 40px; height: 40px; vertical-align: middle; background-position: center -718px;}

.init-member{ padding-bottom: 28px;}
.init-member .title-upper{ margin-bottom: 0;}
.init-member .integral-list li{ margin-bottom: 0;}
.init-member .more{ display: block; margin: 0 auto 18px; font-size: 16px; text-decoration: underline;}
.more .icon-more{ display: inline-block; width: 20px; height: 20px; margin-left: 4px; vertical-align: middle; background-position: -20px -283px;}
.mod-integral .more{ text-align: center;}

.title-third{ margin-bottom: 24px; text-align: left;}
.title-third span{ display: block; border-right: 0 none;}
.title-third .title-china{ margin-top: -28px; color: #222; line-height: 48px;}
.title-third .title-line{ width: 58px; height: 4px; margin-top: 8px; background: #46c2b7;}

.exchange-list a{ display: block; position: relative; padding-left: 18px; margin-bottom: 8px;}
.exchange-list a:before{ display: block; content: '\0020'; position: absolute; top: 8px; left: 0; width: 8px; height: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px; background: #a9a9a9;}
.exchange-list a.first{ padding-left: 0;}
.exchange-list a.first:before{ display: none;}
.exchange-list .name{ float: left; font-size: 16px; color: #222;}
.exchange-list .hot{ display: inline-block; padding: 0 4px; margin-right: 4px; color: #fff; background: #fe0036;}
.exchange-list .date{ float: right; color: #bfbfbf; background: transparent;}
.exchange-list a:hover .name{ color: #00afa0;}
.member-flash{ padding-top: 108px;}
.member-flash li{ width: 50%; margin-bottom: 18px;}

/* 个人中心 */
.banner-uscenter{ padding: 18px 0 20px; background: url(../images/bg-user.jpg) no-repeat center center; background-size: cover;}
.banner-uscenter .portrait{ float: left; width: 118px; height: 118px; margin-right: 8px;}
.banner-uscenter .vertical{ height: 118px; font-size: 16px; color: #fff; text-align: left;}
.banner-uscenter .name{ margin-bottom: 8px; font-size: 20px;}
.target-list a{ padding: 68px 28px 0; margin-top: 18px; font-size: 16px; color: #fff; text-align: center; background: url(../images/sprite-points.png) no-repeat center 0;}
.target-list .target-home{ background-position: center -126px;}

.aside{ float: left; width: 200px; margin: 20px 0;}
.aside-nav, .aside-nav a{ border: 0 none;}
.aside-nav a{ float: none; display: block; width: 163px; height: 48px; padding: 0; margin: 0 auto 8px; line-height: 48px; text-align: center;}
.aside-nav a:hover, .aside-nav a.active{ color: #fff; background: url(../images/btn-asidenav.png) no-repeat center center;}
.aside-nav i{ display: inline-block; width: 22px; height: 24px; vertical-align: middle; background: url(../images/sprite-aside.png) no-repeat 0 -9999em;}
.aside-nav .icon-user{ background-position: 0 0;}
.aside-nav .icon-order{ background-position: 0 -62px;}
.aside-nav .icon-lock{ background-position: 0 -125px;}
.aside-nav .icon-area{ background-position: 0 -188px;}
.aside-nav .icon-forum{ background-position: 0 -252px;}
.aside-nav .icon-integral{ background-position: 0 -318px;}
.aside-nav a:hover .icon-user, .aside-nav a.active .icon-user{ background-position: 0 -30px;}
.aside-nav a:hover .icon-order, .aside-nav a.active .icon-order{ background-position: 0 -94px;}
.aside-nav a:hover .icon-lock, .aside-nav a.active .icon-lock{ background-position: 0 -155px;}
.aside-nav a:hover .icon-area, .aside-nav a.active .icon-area{ background-position: 0 -218px;}
.aside-nav a:hover .icon-forum, .aside-nav a.active .icon-forum{ background-position: 0 -283px;}
.aside-nav a:hover .icon-integral, .aside-nav a.active .icon-integral{ background-position: 0 -347px;}

.main{ float: right; width: 58%; padding: 8px 18px 68px; background: #fff;}
.main .title{ width: 100%; line-height: 38px; text-align: left;}
.main .title span{ display: block;}
.main .title-china{ padding-left: 8px; border-right: 0 none; font-size: 16px; color: #00afa0;}
.main .title-line{ display: block; width: 85px; height: 2px; background: #00afa0;}
.personal-portrait{ position: relative; width: 118px; height: 118px; margin-left: 168px;}
.personal-portrait img{ width: 100%; height: 100%;}
.upload-outer{ position: relative;}
.upload-outer .btn-upload, .upload-outer .input-upload{ display: block; position: absolute; bottom: 0; left: 0; width: 118px; height: 42px; line-height: 42px; cursor: pointer;}
.input-upload{ opacity: 0; filter: alpha(opacity=0); width: 100%; height: 100%; text-indent: -9999em;}
.personal-portrait .btn-upload{ line-height: 38px; color: #fff; background: url(../images/bg-upload.png) no-repeat center bottom;}

.form-plane .form-group{ margin-bottom: 22px;}
.form-plane .form-portrait{ margin-bottom: 28px;}
.form-plane .control-label{ float: left; margin-bottom: 0; line-height: 38px; color: #666;}
.form-plane .form-control{ float: left; width: 58%; height: 38px; border: 1px solid #e2e2e2;}
.form-plane .btn-confirm{ width: 158px; height: 42px; margin-left: 148px; font-size: 14px; line-height: 28px; color: #fff; background: #00afa0;}

/* step-progress */
.border-steps{ -webkit-border-radius: 18px; -moz-border-radius: 18px; -o-border-radius: 18px; border-radius: 18px;}
.border-steps-left{ -webkit-border-radius: 18px 0 0 18px; -moz-border-radius: 18px 0 0 18px; -o-border-radius: 18px 0 0 18px; border-radius: 18px 0 0 18px;}
.border-steps-right{ -webkit-border-radius: 0 18px 18px 0; -moz-border-radius: 0 18px 18px 0; -o-border-radius: 0 18px 18px 0; border-radius: 0 18px 18px 0;}
.step-progress{ width: 98%; height: 18px; margin: 28px auto 78px; background: #e9e7e7;}
.step-progress li{ float: left; position: relative; width: 25%; font-size: 16px; color: #222; text-align: center;}
.step-progress i{ display: block; position: relative; z-index: 2; width: 100%; height: 18px; margin-bottom: 18px;}
.step-progress li.active{ color: #00afa0;}
.step-progress li.active i{ background: #00afa0;}

.order-main{ padding-bottom: 0;}
.order-main .order-num{ color: #222;}
.order-info{ border-top: 1px solid #f4f3f3;}
.order-info .mod{ margin-bottom: 20px;}
.order-info .name{ font-size: 16px; line-height: 38px; font-weight: bold;}
.order-info .mod-order{ margin-bottom: 0;}
.btn-rect{ -webkit-border-radius: 16px; -moz-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px;}
.mod-order .hd{ border-top: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2; margin-top: 8px; line-height: 38px;}
.mod-order .tr-goods{ position: relative; padding: 22px 0; border-bottom: 1px solid #e2e2e2;}
.mod-order .td{ float: left; width: 20%; text-align: center;}
.mod-order .td-name{ width: 40%;}
.mod-order .pic{ float: left; width: 88px; height: 88px; border: 1px solid #e2e2e2; margin-right: 8px;}
.mod-order .vertical{ height: 88px;}
.mod-order .bd .td-unit, .mod-order .bd .td-sum{ line-height: 88px; color: #222;}
.mod-order .ft{ padding: 8px 0 0; font-size: 16px; line-height: 38px;}
.mod-order .font-25{ font-weight: bold;}
.mod-order .btns{ padding: 26px 0; border-top: 1px solid #e9e7e7; margin-top: 28px;}
.mod-order .btns a{ float: right; padding: 4px 28px; border: 1px solid #c7c7c7; margin-left: 12px; font-size: 16px; color: #222;}
.mod-order .sku-tips{ display: none; position: absolute; top: 18px; right: 15%;}

.amount-widget2{ position: relative; display: block; width: 140px;}
.amount-widget2 .amount-input{ float: none; margin: 0 auto; height: 32px;}
.amount-widget2 .amount-btn{ float: none; width: auto; border: 0 none;}
.amount-widget2 .amount-btn i{ position: absolute; top: 0; width: 32px; height: 32px; border: 1px solid #c7c7c7; font-size: 24px; font-style: normal; cursor: pointer; background: none;}
.amount-widget2 .amount-btn .amount-increase{ right: 0;}
.amount-widget2 .amount-btn .amount-decrease{ left: 0;}
.amount-widget2 .amount-btn i::selection{ background:transparent;}
.amount-widget2 .amount-btn i::-moz-selection{ background:transparent;}

/* 发帖 */
.title-post{ margin: 8px 0 28px; font-size: 28px; font-weight: bold; color: #00afa0;}
.form-plane .form-textarea{ height: 98px;}
.forum .form-plane{ width: 78%; margin: 0 auto;}
.forum .form-plane .form-control{ width: 92%;}
.forum .form-btns{ margin-bottom: 48px; margin-left: 20px;}
.form-btns a{ float: left; width: 128px; height: 38px; margin-left: 28px; line-height: 38px; text-align: center;}
.form-btns .btn-submit{ color: #fff; background: #00afa0;}
.form-btns .btn-reset{ color: #707070; background: #e0e0e0;}
.form-post .control-label{ color: #fff;}
.form-post .upload-outer{ float: left; position: relative; width: 162px; height: 162px; border: 1px solid #d2d2d2;}
.form-post .upload-outer .btn-upload, .form-post .upload-outer .input-upload{ width: 100%; height: 100%;}
.form-post .control-label{ line-height: 28px;}

.form-register .form-btns a{ float: none; display: block; margin: 0 auto;}

/* 健康选择 弹框男女 */
.model-wrapper{ display: none; position: fixed; z-index: 101; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.48);}
.model-choose{ position: absolute; top: 50%; left: 50%; width: 420px; height: 420px; padding: 58px; border: 8px solid #00afa0; margin-top: -210px; margin-left: -210px; background: #fff;}
.model-choose .btn-close{ position: absolute; top: 0; right: 0; width: 34px; height: 34px; background: url(../images/btn-close.png) no-repeat center center; }
.model-choose .title{ font-size: 26px; color: #222;}
.model-choose .role{ float: left; width: 50%; text-align: center;}
.model-choose .role img{ width: 46px; height: 110px;}
.model-choose .role span{ display: block; width: 110px; height: 48px; -webkit-border-radius: 48px; -moz-border-radius: 48px; -o-border-radius: 48px; border-radius: 48px; margin: 12px auto 0; font-size: 26px; line-height: 46px; color: #fff;}
.model-choose .role .btn-man{ background: #005dab;}
.model-choose .role .btn-woman{ background: #e2008f;}

/* 订单进度 */
.store-progress{ width: 672px; margin: 28px auto;}
.store-progress li, .store-progress i{ background: url(../images/sprite-steps.png) no-repeat center 0;}
.store-progress li{ float: left; padding-right: 34px; margin-right: 12px; font-size: 20px; line-height: 68px; background-position: right -204px;}
.store-progress li:last-child{ padding-right: 0;}
.store-progress a{ color: #666;}
.store-progress i{ display: inline-block; width: 66px; height: 66px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; margin-right: 18px; text-indent: -9999em; background-color: #ccc;}
.store-progress li.second i{ background-position-y: -68px;}
.store-progress li.third i{ background-position-y: -136px;}
.store-progress li.active{ background-position: right -272px;}
.store-progress li.active a{ color: #00afa0;}
.store-progress li.active i{ background-color: #00afa0;}
.store-progress li:last-child{ background: transparent;}

.order-firm .line-bottom{ padding-bottom: 12px; border-bottom: 1px solid #d9d9d9;}
.order-firm .name{ margin-bottom: 12px; font-size: 16px; color: #00afa0;}
.order-firm .name span{ font-size: 16px; font-weight: normal; color: #999;}
.order-firm h5, .order-firm strong{ margin-right: 8px; font-weight: bold;}
.order-firm .mod{ margin-bottom: 28px;}
.order-firm textarea.form-control{ height: 128px; border: 1px solid #eee;}
.order-firm .mod-order .btn-submit{ border: 0 none; color: #fff; background-color: #00afa0;}
/* 确认订单 */
.delivery-list li{ float: left; width: 348px; height: 132px; padding: 15px 12px 25px 18px; border: 1px solid #e2e2e2; margin-right: 12px; font-size: 14px;}
.delivery-list li.item-add{ float: right; padding-left: 12px;}
.delivery-list li.item-current{ color: #fff; background-color: #00afa0;}
.delivery-list .item-current a{ color: #fff;}
.delivery-list li:hover{ border-color: #00afa0;}
.delivery-list a{ display: none; float: right; margin-left: 15px; color: #00afa0;}
.delivery-list .title, .delivery-list .name{ margin-bottom: 12px; font-size: 16px; line-height: 28px; text-align: left;}
.delivery-list .name span{ float: left;}
.delivery-list .item-add{ text-align: center;}
.delivery-list .item-add a{ display: block; padding: 58px 28px 0; background: url(../images/icon-area.png) no-repeat center 18px;}
.delivery-list .btn-area{ float: none; display: block; margin: 0; color: #666;}
.delivery-list .btn-area:hover{ color: #00afa0; background-position-y: -82px;}

.main-delivery .control-label{ width: 84px; text-align: right;}
.main-delivery .form-btns .btn-submit{ margin-left: 84px;}
.form-btns .btn-save{ border: 1px solid #b3b3b3; color: #999;}
.form-btns .btn-save.bounce-to-right:hover{ color: #fff;}

/* 收货地址 */
.delivery-address .delivery-list .title{ padding: 0 0 10px; border-bottom-color: transparent;}
.delivery-address .delivery-list li{ width: 49%; height: 168px; padding-top: 28px; margin-right: 2%; margin-bottom: 18px;}
.delivery-address .delivery-list li:nth-child(2n){ margin-right: 0;}
.delivery-address .delivery-list li.item-add{ margin-right: 0; margin-left: 2%;}
.delivery-list .default-sign{ display: none; padding: 0 8px; font-size: 13px; color: #fff; line-height: 26px; background: #ff0036;}

/* 提交结果 */
.firm-result{ padding: 38px 0 80px; text-align: center;}
.firm-result .title{ padding-top: 138px; font-size: 26px; line-height: 36px; color: #222;}
.firm-result .title-success{ background: url(../images/success.png) no-repeat center top;}
.firm-result .result-info{ width: 280px; margin: 0 auto; text-align: left;}
.firm-result li{ margin-bottom: 8px; font-size: 16px;}
.firm-result .btn-submit{ display: block; width: 220px; height: 64px; margin: 18px auto 0; font-size: 16px; line-height: 64px; color: #fff; background: #00afa0;}

/* 我的订单 */
.order-main .title .title-china{ float: left; height: 40px; border-bottom: 2px solid #00afa0; line-height: 38px; text-align: center;}
.order-main .title-line{ display: none;}
.order-main .title a{ float: left; padding: 0 8px; margin: 0 18px; color: #666;}
.order-main .title a:hover, .order-main .title a.active{ border-bottom: 2px solid #00afa0; color: #00afa0;}
.myorder-list li{ border: 1px solid #85d8ca; margin-bottom: 16px;}
.myorder-list .hd{ padding: 8px 18px; background-color: #defdf8;} 
.myorder-list .order-num{ color: #047e6e;}
.myorder-list .red{ color: #ff0000;}
.myorder-list .tr-goods{ border-top: 1px solid #b9ede4;}
.myorder-list .td{ float: left; width: 70px; padding: 8px; border-right: 1px solid #b9ede4;}
.myorder-list .td-pay{ width: 100px; padding: 8px 0;}
.myorder-list .td-opera{ width: 168px; border-right: 0 none;}
.myorder-list .pic{ float: left; width: 80px; height: 80px; border: 1px solid #e2e2e2; margin-right: 8px;}
.myorder-list .pro-name{ color: #666;}
.myorder-list .vertical{ height: 80px; text-align: center;}
.myorder-list .pro-name .vertical{ text-align: left;}
.myorder-list .btn-pay{ display: block; width: 80px; height: 32px; -webkit-border-radius: 18px; -moz-border-radius: 18px; -o-border-radius: 18px; border-radius: 18px; margin: 0 auto; line-height: 32px; color: #fff; text-align: center; background: #00afa0;}

/* 我的积分 */
.integral-total{ padding-top: 95px; margin-bottom: 28px; font-size: 16px; color: #999; text-align: center; background: url(../images/icon-integral.png) no-repeat center top;}
.integral-total span{ font-size: 30px; color: #00afa0;}
.integral-record{ border: 1px solid #85d8ca;}
.integral-record .hd, .integral-record .tr{ border-bottom: 1px solid #85d8ca;}
.integral-record .hd{ font-size: 16px; color: #00afa0; background: #defdf8;}
.integral-record .td{ float: left; width: 33.3%; padding: 8px; text-align: center;}
.record-list li:last-child{ border-bottom: 0 none;}

.myforum-table .th{ padding: 10px; color: #222; background: #eee;}
.myforum-table .td{ padding: 10px 4px; font-size: 12px;}
.myforum-table .tbody .topic{ font-size: 14px;}
.myforum-table .opera a{ color: #666;}
.myforum-table .forum-list li:nth-child(2n){ background: #f7f7f7;}

/* 测试题目 */
.fixed-nav{ position: fixed; z-index: 9; top: 128px; left: 8%; width: 178px; text-align: center; background: #2ebfab;}
.fixed-nav .name{ height: 58px; font-size: 18px; font-weight: bold; color: #fff; line-height: 58px; background: #009b8e;}
.fixed-nav li{ height: 48px; border-bottom: 1px solid #c1eddf; font-size: 16px; line-height: 47px;
background: -webkit-linear-gradient(left, rgba(219,111,31,.18) , rgba(0,155,142,.18));
background: -o-linear-gradient(left, rgba(219,111,31,.18) , rgba(0,155,142,.18));
background: -moz-linear-gradient(left, rgba(219,111,31,.18) , rgba(0,155,142,.18));
background: linear-gradient(to right, rgba(219,111,31,.18) , rgba(0,155,142,.18));}
.fixed-nav a{ display: block; color: #fff;}
.fixed-nav .active a, .fixed-nav a:hover{ color: #00afa0; background: #fff;}
.init-test{ background: url(../images/bg-test.jpg) no-repeat center top; background-size: cover;}
.init-test .container{ position: relative;}
.init-test .title{ width: 172px; height: 161px; padding-top: 8px; margin: 0 auto 18px; font-size: 38px; font-weight: 600; line-height: 58px; color: #00afa0; background: url(../images/title-test.png) no-repeat center top; background-size: 172px 161px;}
.init-test .btn-back{ display: block; position: absolute; top: 18px; right: 8px; width: 98px; height: 30px; padding-left: 12px; border: 1px solid #28ae99; color: #00afa0; line-height: 28px; text-align: center; background-color: #fff; background-position: 0 -778px;}

.tips-test{ width: 658px; margin: 0 auto 18px; color:#fff; font-size:16px; line-height: 24px; text-align:center;}
.exam-list .item{ display: none; position: relative; width: 588px; height: 138px; padding: 12px 16px; margin: 0 auto 26px; font-size: 16px; color: #222; background: #fff;}
/*.exam-list .item:after{ content: '\0020'; display: block; position: absolute; z-index: 0; left: 38px; bottom: -22px; border: 22px solid transparent; border-left-color: #fff;}*/
.exam-list .arrow{ display: block; position: absolute; z-index: 0; left: 20px; bottom: -22px; border: 22px solid transparent; border-left-color: #fff;}
.exam-list .arrow-right{ border-left-color: transparent; border-right-color: #fff;}
.exam-list .name{ position: relative; padding-left: 88px; padding-bottom: 8px; border-bottom: 1px solid #00afa0; margin-bottom: 6px; font-size: 18px; line-height: 32px; color: #00afa0;}
.exam-list .name strong{ position: absolute; top: -2px; left: 0; font-size: 58px; font-weight: bold; line-height: 68px;}
.exam-list .label-single{ position: relative; z-index: 2; width: 24%; padding: 5px 0 0;}
.exam-list .label-single input:checked~i{ border-color: #42c5ae; background-color: #00afa0;}
.dot-list{ width: 950px; height: 36px; padding: 0 248px; margin-bottom: 68px; font-size: 12px; line-height: 22px; color: #fff; background: url(../images/bg-dot.png) no-repeat center 3px;}
.dot-list li{ float: left; width: 5%; text-align: center;}
.dot-list b{ display: block; width: 10px; height: 10px; margin: 0 auto; background: #fff;}
.indicators{ line-height: 15px; text-align: center;}
.indicators li{ display: inline-block; width: 15px; height: 15px; border: 1px solid #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; margin: 0 5px; text-indent: -9999em;}
.indicators .active{ background: #fff;}
/* 题目 手机端 */
.m-header{ height: 58px; font-size: 28px; line-height: 58px; color: #222; text-align: center; background: #f7f7f6;}
.m-header .btn-back{ display: block; position: absolute; top: 10px; left: 8px; width: 38px; height: 38px; text-indent: -9999em; background: url(../images/btn-back.png) no-repeat center center; background-size: 16px 30px;}
.m-init{ max-width: 640px; padding: 18px 12px; margin: 0 auto; font-size: 16px; color: #222; background: #fff;}
.mexam-list li{ display: none;}
.mexam-list .name{ margin-bottom: 18px;}
.mexam-list .name .hide{ display: none;}
.m-result{ padding-bottom: 12px;}
.m-result label{ display: block; margin-bottom: 12px; line-height: 32px;}
.m-result i{ display: inline-block; width: 32px; height: 32px; border: 1px solid #999; line-height: 30px; font-style: normal; font-weight: bold; color: #666; text-align: center; vertical-align: middle;}
.m-result input:checked~i{ border-color: #00afa0; color: #fff; background: #00afa0;}
.mbtn-next{ display: block; width: 32%; height: 38px; margin: 0 auto; font-size: 14px; color: #fff; line-height: 38px; text-align: center; background: #00afa0;}
.mbtn-next:hover{ color: #fff;}

.init-test .result{ padding-top: 118px; padding-bottom: 68px; font-size: 20px; color: #fff; line-height: 38px; text-align: center; background: url(../images/good.png) no-repeat center top;}

/* 骨健康 */
.bone-info{ padding: 5px 12px; margin-bottom: 18px; color: #999; background: #f3f3f3;}
.bone-info .name{ font-size: 16px; line-height: 28px; color: #222;}

.health-list li, .article-list a, .hot-list .txt, .mod-aside .carousel .name{ text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}

.health-main{ margin-bottom: 20px;}
.health-main .pic-outer{ float: left; text-align: center;}
.health-main .pic{ width: 290px; height: 212px; border: 16px solid #ccc;}
.health-main .txt{ padding: 10px; font-size: 16px; color: #999; background: #f2f1f1;}
.health-main .detail{ float: right;}
.health-main .info{ padding-bottom: 8px; border-bottom: 1px solid #dedede; margin-bottom: 8px; font-size: 16px; color: #999;}
.health-main .name{ margin-bottom: 5px; font-size: 16px; font-weight: bold; color: #222;}
.health-list li{ position: relative; height: 38px;}
.health-list li:after{ content: '\0020'; display: block; position: absolute; left: 12px; top: 15px; width: 10px; height: 10px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; background: #10968a;}
.health-list a{ display: block; padding: 8px 8px 4px 30px; color: #646464;}
.health-list a:hover{ color: #10968a;}

.mod-bone .hd{ height: 40px; padding: 8px 12px; margin-bottom: 12px; line-height: 24px; font-size: 16px; color: #222; background: #f3f3f3;}
.mod-bone .hd strong{ font-size: 16px; font-weight: bold;}
.mod-bone .hd .more{ float: right; color: #222;}
.mod-bone .bd{ margin: 0 0 12px;}
.mod-bone .col-xs-6{ padding: 0 8px;}
.mod-bone .pic{ position: relative; width: 100%; margin-bottom: 8px;}
.mod-bone .remark{ position: absolute; bottom: 0; left: 0; width: 100%; height: 32px; padding: 0 12px; color: #fff; line-height: 32px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; background: rgba(0,0,0,0.5);}

.aside-pic{ margin-bottom: 20px;}
.aside-pic .pic{ width: 100%; border: 1px solid #ccc;}
.aside-pic .name{ position: relative; z-index: 2; height: 46px; padding: 10px; margin-top: -46px; font-size: 16px; color: #666; text-align: center; background: #f3f3f3;}

.mod-aside{ border: 1px solid #ccc; margin-bottom: 26px;}
.mod-aside .hd{ padding: 16px 20px; border-bottom: 1px solid #ccc; font-size: 16px; font-weight: bold; color: #222;}
.article-list li, .hot-list li{ position: relative; padding: 6px 8px;}
.article-list a, .hot-list a{ display: block; height: 26px; color: #222;}
.article-list i{ display: inline-block; width: 18px; height: 18px; line-height: 18px; font-style: normal; color: #fff; vertical-align: middle; text-align: center; background: #c0c0c0;}
.article-list i.green{ background: #00afa0;}

.mod-aside .first{ display: block; padding: 8px 8px 4px; line-height: 18px; color: #222;}
.first .pic{ float: left; width: 85px; height: 70px; margin-right: 8px;}
.first .name{ height: 28px; font-size: 15px; line-height: 24px; font-weight: bold;}
.first p{ height: 36px; overflow: hidden;}
.hot-list li{ padding-left: 20px;}
.hot-list li:after{ content: '\0020'; display: block; position: absolute; top: 18px; left: 8px; width: 6px; height: 6px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; background: #474747;}
.hot-list span{ float: left;}
.hot-list .txt{ width: 80%; height: 26px;}

/*.mod-aside .carousel a{ position: relative; display: block; width: 100%; height: 100%;}*/
.mod-aside #carousel-generic{ margin-bottom: 4px;}
.mod-aside .carousel .name{ display: block; width: 100%; height: 26px; color: #fff; text-align: center; background: #00afa0; overflow: hidden;}
.mod-aside .carousel-indicators{ display: block; position: static; width: 100%; height: 30px; margin: 0; background: #e5e5e5;}
.mod-aside .carousel-indicators li{ width: 28px; height: 8px; border: 0 none; border-radius: 0; background: #ccc;}
.mod-aside .carousel-indicators .active{ background: #00afa0;}

.mod-qrcode{ padding: 8px; font-weight: bold; color: #222;}
.mod-qrcode .qrcode{ float: left; width: 90px; height: 90px; margin: 0 8px 0 0;}
.mod-qrcode .qrtips{ margin-top: 8px; line-height: 18px;}
.mod-qrcode .qrtips span{ display: block; margin-bottom: 4px;}
.mod-qrcode img{ width: 100%; height: 100%;}

.mod-aside a:hover{ color: #10968a;}

.crumb-nav{ margin-bottom: 18px;}
.crumb-nav img{ width: 64px; height: 21px; margin-right: 18px; line-height: 26px; vertical-align: middle;}
.crumb-nav a{ margin: 0 4px; color: #222;}
.crumb-nav a.active, .crumb-nav a:hover{ color: #00afa0;}
.marrow-list{ padding-top: 8px;}
.marrow-list .item{ padding-bottom: 18px; border-bottom: 1px solid #dedede; margin-bottom: 18px;}
.marrow-list .info{ height: 148px; border-bottom: 0 none; font-size: 14px; overflow: hidden;}
.marrow-list .date{ color: #999;}

.fixedTel{ position: fixed; z-index: 28; bottom: 32px; left: 8px; width: 48px; height: 48px; line-height: 46px; text-align: center; background: #00afa0;}
.fixedTel img{ width: 28px; vertical-align: middle;}
/* 选城市 */
/*.contianer-city{ margin-top: 12px;}
.filter-city{ padding: 20px 30px; background: #e9f6ff;}
.filter-city .filter{ width: auto;} 
.filter-city span{ font-size: 16px; color: #666;}
.filter-city .form-control{ margin-right: 18px;}
.filter-city .btn-blue{ width: 60px; height: 30px; border: 0 none; padding: 0; margin-right: 18px; font-size: 14px; line-height: 30px; color: #fff; text-align: center; cursor: pointer; background: #00afa0;}
.filter-city .btn-blue:hover{ color: #fff;}
.search-city{ float: left;}
.search-city input{ width: 200px; height: 30px; padding: 0 8px; color: #666;}
.hot-city{ padding: 18px 30px; border-bottom: 1px solid #e4e4e4; font-size: 16px; color: #222;}
.hot-city span{ float: left; width: 12%; min-height: 32px;}
.hot-city a{ display: inline-block; width: 8.8%; margin-bottom: 4px; font-size: 16px; color: #47b2ff;}
.city-title{ display: inline-block; position: relative; width: auto; height: 46px; padding: 0 18px; margin: 20px 20px 28px; font-size: 16px; line-height: 46px; color: #fff; background: #00afa0;}
.city-title span{ display: block; position: absolute; bottom: -24px; left: 20px; border: 12px solid #fff; border-top: 12px solid #00afa0;}
.showLetter{ display: none; position: fixed; top:50%; left: 50%; width: 50px; height:50px; border: #00afa0 1px solid; border-radius: 50%; color:#00afa0; line-height: 48px; text-align: center;}
.showLetter span{ display: block; width: 100%; height: 100%; font-size: 30px;}

.letter{ display: none; width:auto; position:fixed; top:50%; right:10px; height: 352px; margin-top: -172px; text-align:center;}
.letter ul li{ height: 16px;}
.letter ul li a{ display: block; height: 18px; color: #00afa0; font-size: 12px; line-height: 16px;}
.city-outer{ width: 100%; overflow:hidden;}
.city-list{ width:100%; padding: 15px 30px;}
.city-list .city-letter{ float: left; width: 38px; height: 38px; border: 1px solid #d1d1d1; margin-right: 20px; font-size: 16px; line-height: 36px; color: #7c7c7c; text-align: center; background: #e4e4e4;}
.city-list p{ float: left; padding: 4px 8px; margin-right: 8px; margin-bottom: 2px; font-size: 16px; line-height: 24px; color: #47b2ff;}
.city-list p.current{ color: #fff; background: #00afa0;}
.city-list.hover, .city-list.active{ cursor: pointer; background: #eee;}
.city-list.hover .city-letter, .city-list.active .city-letter{ color: #fff; border-color: #00afa0; background: #00afa0;}
*/
/* search 新页面 */
/*.top-search-outer{ position: fixed; top: 0; left: 0; width: 100%; height: 46px; border-bottom: 1px solid #eee;}
.top-search-outer .btn-back{ display: block; position: absolute; top: 8px; left: 8px; width: 28px; height: 28px; text-indent: -9999em; background: url(../images/back.png) no-repeat center center; background-size: 20px;}
.top-search-outer .top-search{ display: block; float: none; position: relative; width: 78%; height: 32px; padding-left: 8px; margin: 6px auto 0; border: 1px solid #e1e1e1; -webkit-border-radius: 18px; -moz-border-radius: 18px; border-radius: 18px; line-height: 30px;}
.top-search-outer .top-search input{ border: 0 none; background: transparent;}
.top-search-outer .top-search a{ position: absolute; top: 0; right: -48px; color: #555;}
.search-list{ padding: 8px; border-top: 1px solid #fefefe; margin-top: 48px;}
.search-list .name{ margin-bottom: 8px; font-size: 15px;}
.hot-search{ margin-bottom: 8px;}
.hot-search a{ display: inline-block; padding: 4px 12px; -webkit-border-radius: 10px; border-radius: 10px; margin: 0 4px 8px; color: #222; background: #ededed;}
.history-search{ margin-bottom: 18px;}
.history-search a{ display: block; position: relative; padding: 6px 6px 6px 26px; border-bottom: 1px solid #f8f8f8; margin-left: 8px;
 font-size: 14px; color: #222; line-height: 28px;}
.history-search a:before{ content: '\0020'; position: absolute; top: 10px; left: 0; width: 18px; height: 18px; background: url(../images/times.png) no-repeat; background-size: 18px 18px;}
.history-search a:after{ content: '>'; position: absolute; top: 5px; right: 8px;}
.history-search span{ display: block; padding: 8px; font-size: 14px; text-align: center;}*/


/* 404 */
.error{ margin-bottom: 38px; text-align: center;}
.error .pic{ width: 418px; margin: 0 auto 18px;}
.error .tips{ margin-bottom: 28px; font-size: 16px;}
.error .btn-prev{ display: inline-block; width: 98px; height: 38px; margin-right: 18px; line-height: 38px; color: #fff; background: #00afa0;}

.modal-body{ height: 380px; overflow-y: scroll;}

@media(min-width: 769px){ .container{ width: 750px}}
@media(min-width: 992px){ .container{ width: 980px}}
@media(min-width: 1200px){ .container{ width: 1100px}}

@media(max-width: 1200px){
  .service-list .title{ margin-bottom: 8px;}
  .init-service .service-list a{ padding: 8px 28px;}

	.aside .title .portrait{ float: none; margin: 0 auto;}
	.aside .title .info{ float: none;}
	.aside .title .btn-enrol{ margin-top: 8px;}

	.region-store .btns{ display: none;}
	.region-store .pic-outer .btns{ display: block; float: none; width: 100%; margin-top: 0;}
	.region-store .info{ width: 38%;}
	.region-store .satisfaction{ width: 39%; margin-right: 0;}

	.init-cart .order-btns label{ padding-left: 48px;}
	.cart-foot .selected{ position: absolute; top: 0; right: 50%; margin-right: -80px;}
	.cart-foot span{ margin-right: 8px;}
	.cart-foot .move span{ margin-right: 0;}
	.cart-foot .btn-red{ width: 168px;}
	.cart-foot .total{ line-height: 48px;}
	.cart-foot .total strong.red{ margin-top: -8px; line-height: 28px;}
	.cart-foot .tips{ position: absolute; bottom: 2px; right: 178px; margin-right: 0; font-size: 12px; line-height: 20px;}

	.recom-pro .tab-content, .recom-pro .tab-panel, .recom-pro .slick-slide{ height: 360px;}

  .myorder-list .pro-name{ line-height: 20px;}
  .myorder-list .td{ width: 68px;}
  .myorder-list .td-pay{ width: 88px;}
  .myorder-list .td-opera{ width: 106px;}
  .myorder-list .td-opera a{ display: block;}
  .myorder-list .btn-pay{ width: 78px;}

  /* 题目 */
  .fixed-nav{ left: 0;}
  .tips-test{ width: 62%;}
  .dot-list{ padding: 0 186px;}
  .hot-list .txt{ width: 76%;}

  .swiper-server .iadd{ margin-top: 18px;}
}

@media(max-width: 992px){
    .footer-contact .item-tel{ font-size: 16px;}
    .nav>li>a, .dropdown-menu>li{ font-size: 16px;}
    .dropdown-menu .submenu{ font-size: 14px;}

    .carousel-control .icon-prev, .carousel-control .icon-next{ width: 48px; height: 48px; background-size: 48px 104px;}
    .carousel-control .icon-next{ background-position: 0 -56px;}

    .title-china, .title-upper .title-china{ font-size: 20px; line-height: 22px;}
    .service-list .title{ margin: 5px 0 0;}

    .title-upper span{ line-height: 28px;}
    .title-upper .title-en{ font-size: 16px;}
    .title-third .title-china{ line-height: 36px;}

    .index-mod{ margin-bottom: 18px;}

    .index-product .name{ font-size: 16px; line-height: 28px;}
    .index-product .subname{ font-size: 14px; margin-bottom: 4px;}
    .nature-list .nature{ font-size: 14px; line-height: 20px;}

    /*.index-news .pic, .index-news .news-list{ width: 49%;} .flash-list a{ margin: 0 12%;}*/
    .index-test .test-content{ padding: 58px 0 38px; margin: 38px 0 18px;}
    .index-test .person{ top: -76px;}
    .index-test .person .pic{ width: 111px; height: 178px;}
    .index-test .man{ left: 0;}
    .index-test .man .pic{ margin-left: 52px;}
    .index-test .woman .pic{ margin-left: 12px;}
    .index-test .person .name{ width: 174px; height: 58px; padding-top: 10px; margin-top: -11px; font-size: 14px; line-height: 48px; background-size: 100%;}
    .index-test .person .name .name-china{ font-size: 16px;}
    .index-test .man .name{ padding-right: 28px;}
    .index-test .woman .name{ padding-left: 28px;}
    .index-test .center{ width: 228px; padding: 8px;}
    .index-test .center .name{ padding: 8px 0; font-size: 16px;}
    .index-test .center em{ font-size: 38px;}
    .index-test .center .tips{ font-size: 14px;}
    .index-test .btn-more{ margin-top: 0;}
    .test-list a{ margin: 0 5px;}
    .test-list .pic{ width: 60%;}
    .test-list .name{ font-size: 15px;}
   
    /* init */
    .gallery{ float: none; margin: 0 auto 28px;}
    #property, #property .subname{ margin-bottom: 18px;}
    #property{ float: none; width: 100%; text-align: center;}
    #property .tb-sku .attr, #property .tb-sku .amount-widget{ float: none; display: inline-block; vertical-align: middle;}
    .btn-action .btn-buy{ float: none; display: block; margin: 0 auto;}
    .line{ margin: 28px auto;}

    .item-nutrition .name{ font-size: 52px;}
    .item-nutrition p{ font-size: 20px; line-height: 38px;}

    .details .pro-title h2{ font-size: 28px;}
    .details .pro-subtitle{ font-size: 20px;}
    .details .item-tips{ background-position-x: 18%;}

    .bone-list li, .clinical-list li{ padding: 0 3%;}
    .clinical-list .info{ width: 80%;}
    .clinical-list .pic-outer{ width: 18%;}

    .item-devote .content{ padding: 0 4%;}
    .item-devote .info{ width: 60%;}
    .devote-bone .info{ width: 48%; padding-top: 18px;}
    .devote-bone li{ margin-bottom: 32px;}
    .item-expensive .pic{ width: 48%;}
    .expense-list .subitem{ width: 78%;}
    .expense-list .info{ margin-bottom: 28px;}

    /* 品牌故事 */
    .item-poetry dt, .item-poetry .ml{ margin-left: 12%;}
    .item-ninety .name{ font-size: 38px; line-height: 42px;}
    .item-ninety .subname{ font-size: 28px;}
    .item-ninety .tips{ font-size: 20px;}

    .item-century .name h5{ font-size: 24px;}

    /*  ===== service ===== */
    .init-service .service-list a{ padding: 4px;}
    .init-service .service-list .name{ font-size: 16px;}

    .init-service .test-list a{ margin: 0 18px;}

    .result-list li{ float: none; width: 100%; padding: 18px 28px;}
    .result-list .name{ margin-bottom: 8px; font-size: 16px; line-height: 20px;}

    .init-nav, .about .title{ margin-bottom: 8px;}
    .init-nav a{ margin: 0 12px; font-size: 16px;}
    .about .title{ font-size: 24px;}
    .about .name, .about p{ margin-bottom: 12px;}
    .about .name{ font-size: 16px;}

    .member-flash{ padding-top: 0;}
    .member-flash li{ width: 25%; margin-bottom: 18px;}

    .aside-nav a{ margin-bottom: 12px;}

    .forum .form-plane{ width: 100%;}
    .mod-order .pic{ float: none; margin: 0 auto;}
    .mod-order .td{ width: 19%;}
    .mod-order .td-num{ width: 28%;}
    .mod-order .td-name{ width: 34%;}
    .mod-order .td-name .vertical{ display: block; height: 24px; margin-top: 4px; line-height: 18px; text-align: center;}
    .amount-widget2{ width: 130px;}

    .main-delivery .form-plane .form-control{ width: 80%;}

    .delivery-address .delivery-list .title{ padding-bottom: 0;}
    .delivery-address .delivery-list li{ float: none; width: 100%; height: 128px; padding-top: 18px; padding-left: 12px;}
    .delivery-address .delivery-list li.item-add{ margin: 0 2% 18px 0;}

    .order-main .title-china{ padding: 0 8px;}
    .order-main .title a{ padding: 0; margin: 0 8px;}
    .myorder-list .td-opera{ width: 88px; padding: 8px 0;}
    .myorder-list .td-name{ width: 100%; border-right: 0 none; border-bottom: 1px solid #b9ede4;}
    .myorder-list .td .vertical{ height: 58px;}
    .myorder-list .pro-name .vertical{ height: 80px;}

    .integral-record .hd{ padding: 0 4px; font-size: 15px;}

    .myforum-table .date{ width: 30%;}
    .myforum-table .opera{ width: 20%;}

    /* 题目 */
    .fixed-nav{ width: 148px;}
    .tips-test{ width: 78%;}
    .dot-list{ width: 100%; padding: 0 75px;}
    .init-test .result{ font-size: 16px;}

    .health-main .pic-outer, .health-main .detail{ float: none;}
    .health-main .pic-outer{ width: 290px; margin: 0 auto 18px;}

    .marrow-list .info{ height: auto; padding: 0;}
    /*.marrow-list .pic-outer, .marrow-list .detail{ float: left;}*/
    .swiper-server .iadd{ margin-top: 38px;}
}

@media(max-width:768px){
  	.hide-pad{ display: none;}
  	.show-pad{ display: block;}
  	
  	.header-login{ padding: 18px 0;}
  	.header-login .logo{ width: 108px;}
  	.header-tel{ padding-left: 38px; margin-left: 118px; font-size: 16px; line-height: 34px; background-position: 5px 5px;}
  	.header-logo{ height: 74px;}
  	h1.logo{ margin: 0;}
    .header h1.logo{ margin: 8px 0;}

  	/* footer */
    .footer, .mod-server{ padding: 0;}
    /*.footer-content{ display: none;}*/
  	.footer-logo, .qrcode{ width: 50%; margin: 0 0 18px; text-align: center;}
  	.footer-logo{ margin-top: 8px;}
  	.footer-logo, .friend-links, .footer-center{  width: 22%;}
  	.footer-contact{ float: left; width: 56%; margin-right: 0;}

  	.copyright{ position: static;}
  	.copyright span{ display: block;}
  	.copyright i{ display: none;}
    .scroll-top{ right: 12px; bottom: 28px;}

    .nav-mask{ position: fixed; top: 0; left: 0; z-index: 9998; width: 100%; height: 100%; background: rgba(0,0,0,.38);}
    .navbar-toggle .icon-bar, .navbar-collapse{ background-color: #00afa0;}
    .navbar-collapse{ position: fixed; z-index: 9999; left: auto; left: -68%; top: 0; width: 52%; padding: 0; text-align: center; box-shadow:3px 0px 7px rgba(0,0,0,0.55); -webkit-box-shadow:3px 0 7px rgba(0, 0, 0, 0.55); -moz-box-shadow:3px 0 7px rgba(0, 0, 0, 0.55);}
    .navbar-nav{ margin: 20px 0;}
    .navbar-toggle{ padding: 8px; border: 1.5px solid #00afa0; margin-top: 20px; margin-right: 0;}
    .nav>li{ width: 100%; border-bottom: 1px solid #019588; background: none;}
    .nav>li.show-pad{ display: block;}
    .navbar-nav>li>a{ height: 38px; border-right: 0; font-size: 16px; line-height: 38px; color: #fff;}
    .nav>li>a:hover, .nav>li>a:focus, .nav>li.nav-hover>a, .nav>li.active>a{ border: 0 none; color: #fff; background: none;}
    
    /* login */
  	.content-login{ padding: 28px 0;}
  	.content-login .title{ margin-bottom: 18px; font-size: 28px;}
  	.control-protocol{ margin-left: 18px;}

  	#carousel-generic, .carousel-inner>.item{ height: auto;}

    .index-mod .btn-more{ width: 158px; height: 48px; margin: 12px auto; line-height: 48px;}
    .index-news .btn-more{ margin-top: 18px;}

    .title, .title-upper{ margin-bottom: 18px;}
    .title .title-china{ border-right: 0 none;}
    .title .title-tips{ line-height: 24px;}
    .swiper-server .info:hover .iadd{ display: none;}
    .index-product .pic, .index-product .detail{ float: none; width: 100%;}
    .index-product .pic{ display: block; margin: 0 0 12px;}

    .index-news li, .index-news li:nth-child(2n){ float: none; width: 100%;}

    /* init */
    .summary{ padding: 18px 12px;} 
    #property{ text-align: left;}
    .tb-num{ margin: 18px 0;}
    .tb-sku .attr{ margin-left: 0;}

    .details .nav-tabs>li{ float: left; width: 25%;}
    .details .item-tips{ background-position: 12% center;}
    .item-nutrition, .knowledge-list{ width: 96%;}
    .item-nutrition .name{ padding: 12px; font-size: 38px; line-height: 48px;}

    .clinical-list .slip{ margin-top: -2px;}
    .expense-list .subitem{ width: 92%;}
    .expense-list .name{ font-size: 20px;}
    .devote-bone .info{ width: 58%; padding-top: 0;}
    .devote-bone li{ font-size: 14px; margin-bottom: 12px;}
    .devote-bone .pic{ width: 38%; margin-top: 8px;}

    .knowledge-list li{ padding: 12px 12px 18px;}
    .knowledge-list .name{ font-size: 16px;}

    .item-poetry dt, .item-poetry .ml{ margin-left: 6%;}
    .item-ninety .name, .item-ninety .subname{ margin-bottom: 8px;}
    .item-ninety .name{ font-size: 30px;}
    .item-ninety .subname{ font-size: 16px;}
    .item-ninety .tips{ padding: 8px 12px; font-size: 16px;}

    .item-century .width-half{ font-size: 16px; line-height: 32px;}
    .item-century .name h3{ font-size: 36px;}
    .item-century .name h5{ font-size: 20px; line-height: 32px; letter-spacing: 5px;}

    .item-guide .name{ font-size: 22px;}
    .item-step .info, .item-step .pic{ float: none; width: 100%;}
    .item-step .info{ margin-bottom: 18px;}
	
    /*  ======= service ======== */
    .init-service{ padding-bottom: 18px;}
    .init-service .service-list li{ width: 50%; margin-bottom: 4px;}

    .store-search{ padding: 18px;}
    .store-search .tips, .store-search .form-outer{ float: none; width: 100%;}
    .store-search .tips{ margin-bottom: 18px;}
    .form-search .btn-search{ font-size: 16px;}

    .travel-list .arrow-outer{ display: none;}
    .travel-list .name, .travel-list .date{ font-size: 16px;}

    .nav-name, .init-nav, .fixed-nav .name, .fixed-nav .test-nav{ position: fixed; z-index: 99; color: #fff; text-align: center; background: #00afa0;}
    .nav-name, .fixed-nav .name{ left: 8px; bottom:50%; width: 48px; height: 48px; font-size: 16px; line-height: 48px; cursor: pointer;}
    .init-nav, .fixed-nav .test-nav{ display: none; left: 68px; bottom: 20px; width: 128px; height: auto; border: 0 none;}
    .init-nav:before, .fixed-nav .test-nav a:after{ content: '\0020'; display: block; position: absolute; left: -12px; bottom: 18px; border: 6px solid transparent; border-right-color: #00afa0;}
    .init-nav a{ float: none; display: block; padding: 6px 0; margin: 0; font-size: 14px; color: #fff;}
    .init-nav a.active{ background-color: #014f48;}

    /* 测试题目 */
    .fixed-nav{ width: 148px;}
    .fixed-nav .name{ padding: 6px; font-size: 15px; line-height: 18px; text-align: center;}
    .fixed-nav li{ height: 38px; font-size: 14px; line-height: 37px;}
    .fixed-nav li:last-child{ border-bottom: 0 none;}
    .init-test .title{ padding-top: 18px; font-size: 42px; line-height: 52px;}
    .init-test .result{ padding-bottom: 38px; font-size: 14px; line-height: 32px;}

    /* 积分列表 */
    .integral-list li{ width: 33.3%; margin-bottom: 18px;}

    .forum .nav-tabs>li{ border-bottom: 0 none; margin: 0 8px;}
    .forum .nav-tabs>li.active>a, .forum .nav-tabs>li>a:hover, .forum .nav-tabs>li>a:focus{ border-bottom: 2px solid #00afa0;}
    .forum-table .th{ padding: 12px 0; font-size: 14px;}
    .forum-table .td{ padding: 18px 6px;} .myforum-table .td{ padding: 12px 4px;}
    .forum-list{ margin-bottom: 8px;}

    .forum-top .portrait, .forum-top .portrait-relate{ float: none; margin: 0 auto 8px; text-align: center;}
    .portrait-relate .caption{ font-size: 16px;}
    .forum-item{ margin-bottom: 18px;}
    .forum-sublist, .subcomment{ margin-left: 0;}
    .subcomment .name{ position: relative; padding: 8px; margin: 0; font-size: 16px; color: #666;}
    .subcomment .btn-close{ position: absolute; top: 8px; right: -4px; display: block; width: 24px; height: 24px; background: url(../images/close.png) no-repeat center center #e1e1e1; background-size: 10px;}
    .subcomment .subcomment-textarea{ position: fixed; z-index: 100; bottom: 0; left: 0; height: 188px; padding: 0 18px; border-top: 1px solid #ddd; margin: 0; background: #fff;}
    .subcomment-textarea .btn-submit{ display: block; width: 100%; height: 32px; line-height: 32px; color: #fff; background: #00afa0;}

    .init-member{ padding-bottom: 18px;}
    .init-member .integral-list li:last-child{ display: none;}

    .banner-uscenter .portrait{ width: 88px; height: 88px;}
    .banner-uscenter .vertical{ height: 88px;}
    .target-list a{ padding: 68px 8px 0; margin-top: 0;}

    .aside{ margin: 0;}
    .aside .nav-name{ font-size: 48px; line-height: 40px; cursor: pointer;}
    .aside-nav, .aside-nav a{ width: 162px;}
    .aside-nav{ -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; border-radius: 6px; background: #fff;}
    .aside-nav:before{ border-right-color: #fff;}
    .aside-nav a{ padding: 0; color: #222;}
    .aside-nav a.active, .aside-nav a:hover{ color: #fff; background-color: transparent;}
    .main{ float: none; width: 100%; padding: 18px 12px 38px;}

    .forum .form-plane .form-control{ width: 88%;}

    .store-progress{ width: 470px;}
    .store-progress li, .store-progress i{ background-size: 28px 198px;}
    .store-progress li{ padding-right: 22px; background-position: right -115px;}
    .store-progress li.active{ background-position: right -155px;}
    .store-progress li.first i{ background-position-y: 4px;}
    .store-progress li.second i{ background-position-y: -36px;}
    .store-progress li.third i{ background-position-y: -74px;}
    .store-progress li{ line-height: 48px; font-size: 16px;}
    .store-progress i{ width: 48px; height: 48px; margin-right: 0;}

    .firm-result{ padding: 0 0 38px;}

    .init-order .container{ padding: 0;}

    .delivery-list li{ width: 49%; padding-left: 18px; margin-right: 2%;}
    .delivery-list li:nth-child(2n){ margin-right: 0;}

    /* 骨健康 */
    .aside-pic{ display: none;}
    .aside-pic, .mod-aside{ float: left; width: 48%; margin: 0 1% 18px;}
    .mod-aside{ min-height: 372px;}    
    .mod-qrcode{ min-height: 108px; height: 108px;}
}
@media(max-width: 718px){ .test-list li{ width: 33.3%;}}
@media(max-width: 480px){
  	.hide-phone{ display: none;} .show-phone{ display: block;}
    .scroll-top{ bottom: 10px;} .header-logo{ height: 62px;} .navbar-toggle{ margin-top: 13px;}
    .footer{ border-bottom: 6px solid #022724; font-size: 12px;}
    .footer .name{ font-size: 13px; margin-bottom: 0;}
  	.footer-logo{ float: none; width: 100%;}
  	.footer-logo{ display: none; margin-top: 0; margin-bottom: 18px;}
  	.footer-logo img{ width: 48%;}
  	.footer-contact{ display: none; margin-bottom: 18px; text-align: center;}
  	.footer-contact .item-tel{ margin: 8px 0; font-size: 14px;}
    .footer-contact .item-tel i{ width: 24px; height: 24px; background-size: 24px 478px; background-position: 0 -58px;}
  	.friend-links, .footer-center{ width: 33%;}
    .qrcode{ width: 25%; margin-left: 8%;}
    .footer-contact .item-add{ display: none;}
    .qrcode img{ width: 128px;}

  	.content-login{ padding: 18px 0;}
  	.content-login .container{ width: 100%;}
  	.form-register .mt-18{ margin-top: 12px;}

  	.modal-dialog, .modal-content{ width: 100%; height: 100%; border: 0 none; border-radius: 0; margin: 0;}
  	.modal-footer{ position: absolute; bottom: 0; left: 0; width: 100%; padding: 8px;}

    #carousel-generic{ margin-bottom: 8px;}
	  .carousel-indicators{ bottom: 0;}
    .carousel-control .icon-prev{ margin-left: -25px;}
    .carousel-control .icon-next{ margin-right: -25px;}

    .title{ line-height: 38px;}
    .title-third .title-china{ margin-top: -18px;}
    .title, .title-upper{ margin-bottom: 12px;}
    .title .title-china{ padding: 0; margin: 0; font-size: 18px;}
    .title .title-tips, .scrollNews ul, .scrollNews li, .scrollNews a{ height: 24px; line-height: 24px; overflow: hidden;}
    .title-china, .title-upper .title-china, .index-product .name{ font-size: 18px;}
    /*.fixedTel{ bottom: 192px;}
    .index-mod .title-upper{ border-bottom: 0 none;}
    .index-mod .title .title-en, .index-mod .title-upper .title-en{ display: none;}
    .index-news .more{ display: block; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; color: #fff; text-align: center; background: url(../images/sprite-icon.png) no-repeat 0 -9999em #00afa0;}
    .index-mod .btn-more, .index-news .more{ width: 88px; height: 34px; padding-right: 18px; margin: 0 auto; font-size: 12px; line-height: 34px; background-size: 24px 478px; background-position: 102% -99px;}
    .index-news .more{ margin-top: 8px;}*/
    
    .index-flash{ margin-bottom: 12px;}
    .flash-list li{ width: 33.3%; margin-bottom: 8px;}
    .flash-list li:last-child{ display: none;}
    .flash-list a{ margin: 0 3%;}

    .index-test .test-content{ padding-bottom: 28px; margin-top: 0;}
    .index-test .center{ width: 128px; margin-top: -38px; line-height: 38px;}
    .index-test .center .name{ border-bottom: 0 none;}
    .index-test .center .tips{ display: none;}
    .index-test .person{ top: -69px;}
    .index-test .person .pic{ width: 66px; height: 102px; margin-left: 7px;}
    .index-test .man .pic{ margin-left: 26px;}
    .index-test .person .name{ width: 98px; height: 38px; padding: 0 12px 0 0; margin-top: -6px; font-size: 12px; line-height: 38px;}
    .index-test .woman .name{ padding: 0 0 0 12px;}
    .test-list li{ width: 33.3%;}
    .test-list li:nth-child(4), .test-list li:nth-child(5), .test-list li:nth-child(6){ display: none;}
    .test-list .name{ font-size: 13px;}
    .init-service .test-list li{ width: 33.3%;}
    .init-service .test-list a{ margin: 0 5px;}

    .service-list .title{ height: 38px;}
    .service-list .title span{ display: block; text-align: center;}
    .service-list .title .title-china{ position: static; padding: 0;}
    .service-list .title .title-line{ margin: 8px auto 0;}
    .service-left{ float: none; width: 100%;}
    .service-center{ width: 66%;}
    .service-list .pic-right{ width: 34%;}
    
    .index-news .title-china{ margin: 0;}
    .index-news .name{ font-size: 15px;}
    .index-news .remark .name{ font-size: 18px; line-height: 28px;}
    .index-news .pic{ height: 226px;}

    .index-product .btn-more{ margin: 8px auto;}
    .mod-culture .bd{ padding: 18px 0;}

    /*  init  */
    #property .name{ font-size: 20px;}
    .line{ margin: 18px 0;}
    .virture-list li{ font-size: 13px; line-height: 18px;}

    .details .nav-tabs{ padding: 0 12px;}
    .details .nav-tabs>li>a, .details .nav-tabs>li.active>a{ margin: 0; font-size: 14px;}
    .details .fl, .details .fr{ float: none; width: 100%;}
    .details .item-tips{ padding: 18px; background-image: none;}

    .tab-pane .content{ width: 92%; padding-bottom: 28px;}
    .item-nutrition{ padding: 28px 0;}
    .item-nutrition .name, .details .pro-title, .details .pro-subtitle{ margin-bottom: 18px;}

    .details .pro-title{ height: 58px;}
    .details .pro-title h2{ height: 50px; font-size: 20px; line-height: 50px;}
    .details .pro-subtitle, .expense-list .name{ font-size: 16px; line-height: 28px;}

    .clinical-list li{ margin-bottom: 8px;}
    .clinical-list .pic-outer, .clinical-list .info, .bone-list .pic, .bone-list li:nth-child(2n) .pic, .bone-list .info, .bone-list li:nth-child(2n) .info, .item-devote .pic, .item-devote .info{ float: none; margin: 0 auto;}
    .clinical-list .pic-outer, .item-devote .pic{ width: 48%;}
    .clinical-list .info, .item-devote .info, .bone-list .info{ width: 92%;}
    .clinical-list .subname, .clinical-list span{ height: auto;}
    .clinical-list .pic{ margin-top: 8px;}
    .clinical-list .slip{ margin-top: -1px;}

    .bone-list li{ margin-bottom: 18px;}
    .bone-list .pic, .bone-list li:nth-child(2n) .pic{ width: 58%; margin-top: 18px;}

    .item-devote .content{ padding: 0;}
    .item-devote .pic{ margin-bottom: 18px;}
    .item-devote .pro-subtitle{ font-size: 20px;}
    .devote-bone .info{ width: 78%; margin-right: 68px;}
    .item-expensive .pic, .item-others .pic{ width: 78%;}
    .expense-list .name{ padding: 8px 18px;}
    .expense-list .info{ margin-bottom: 18px;}
    .item-expensive .tips{ padding: 0 18px;}

    .knowledge-list{ margin: 18px auto;}
    .knowledge-list li{ float: none; width: 96%; margin-bottom: 18px;}

    /* 品牌故事 */
    .item-poetry{ padding: 18px 0 0;}
    .item-poetry .content{ width: 96%;}
    .item-poetry dt, .item-poetry .ml{ margin-left: 5%;}
    .item-poetry .ml{ margin-left: 4%;}

    .item-recent .pic, .item-recent .info, .item-ninety .pic, .item-ninety .info{ float: none; width: 100%;}
    .item-recent .pic, .item-ninety .info, .item-about .info{ margin-bottom: 18px; text-align: center;}
    .item-recent .subname, .item-century .name-outer{ margin-bottom: 8px;}
    .item-recent .subname{ font-size: 20px;}
    .item-ninety .name{ line-height: 32px;}
    .item-ninety .info .vertical{ display: block;}

    .item-century .width-half, .item-about .info{ font-size: 16px;}
    .item-about{ padding-top: 28px;}
    .item-about h3, .tab-tips h3{ font-size: 22px;}

    .item-guide .name{ font-size: 16px;}
    .item-guide .info{ font-size: 16px;}
    .item-guide .tips{ font-size: 14px;}

    /* ======== service ======== */
    .store-spread{ width: 88%; padding: 8px 0 18px;}
    .result-list li{ padding: 12px 18px;}
    .result-list .name, .result-list .attr{ font-size: 15px;}
    .result-list p{ line-height: 24px;}

    .travel-list li{ padding: 18px 12px 8px;}
    .travel-list .pic{ float: none; margin: 0 auto 4px;}
    .travel-list .name{ margin-bottom: 8px;}
    .travel-list .vertical{ height: 138px;}

    .about .title{ font-size: 16px;}
    .about .name, .about p{ padding: 0;} 
    .about .name{ font-size: 15px;}

    .integral-list li{ width: 50%;}

    .forum{ position: relative;}
    .forum .nav-tabs>li>a{ font-size: 16px;}
    .forum .nav-tabs>li.btn-forum{ position: absolute; top: -50px; right: 8px;}
    .forum .nav-tabs>li.btn-forum>a{ width: 98px; height: 40px; padding-right: 18px; line-height: 40px; background-size: 25px;}
    .forum-table .th{ padding: 8px 0;}
    .forum-table .topic{ width: 70%;}
    .forum-table .report{ width: 30%;}
    .forum-table .date{ display: none;}
    
    .aside-member{ width: 96%;}
    .init-member .integral-list{ padding-bottom: 0;}
    .init-member .integral-list li{ margin-bottom: 15px;}
    .init-member .integral-list li:last-child{ display: block;}

    .banner-uscenter{ padding: 18px 0;}
	  .banner-uscenter .col-xs-6{ float: none; width: 100%;}
    .target-list a{ width: 50%; margin-top: 18px;}

    .form-plane .form-portrait{ margin-bottom: 18px;}
    .form-plane .form-control, .forum .form-plane .form-control{ width: 100%;}
    .form-plane .btn-confirm{ width: 100%; height: 44px; margin-top: 15px; font-size: 16px; line-height: 30px;}

    .title-post{ margin:0 0 12px; font-size: 20px;}
    .form-plane .form-group{ margin-bottom: 8px;}
    .forum .form-plane .form-post{ margin-top: 18px; margin-bottom: 18px;}
    /*.forum .form-post .control-label{ float: none; display: block;}*/
    .forum .form-btns{ margin-bottom: 28px; margin-left: 0;}
    .form-btns a{ width: 42%; height: 42px; margin-left: 8px; font-size: 16px; line-height: 42px;}
    
    .order-main{ padding: 18px 12px;}
    .mod-order .font-25{ font-size: 16px;}
    .mod-order .sku-tips{ right: 0;}
    .mod-order .btns{ padding: 18px 0; margin-top: 18px;}
    .mod-order .btns a{ padding: 2px 20px; margin-left: 8px; font-size: 14px;}
    .mod-order .td-name{ width: 30%;}
    .mod-order .td-num{ width: 32%;}
    .amount-widget2{ width: 102px;}
    .amount-widget2 .amount-input{ width: 38px;}

    .model-choose{ width: 300px; height: 300px; padding: 20px 18px; margin-top: -150px; margin-left: -150px;}
    .model-choose .role span{ width: 88px;}
    .model-choose .title{ margin-bottom: 12px; font-size: 20px;}

    .order-firm .mod{ margin-bottom: 18px;}
    .delivery-list li{ width: 100%; height: 120px; margin: 0 0 12px;}

    .main-delivery .control-label{ text-align: left;}
    .main-delivery .form-plane .form-control{ width: 100%;}
    .main-delivery .form-btns{ margin-top: 18px;}
    .main-delivery .form-btns .btn-submit{ margin-left: 0;}

    .store-progress{ width: 300px; margin: 18px auto;}
    .store-progress li{ width: 100px; margin-right: 0;}
    .store-progress i{ display: block; margin: 0 auto;}

    .firm-result .title{ font-size: 22px; line-height: 32px;}

    .order-main .title .title-china{ float: none; display: block; border-bottom: 0 none; text-align: left;}
    .order-main .title-line{ display: block;}
    .myorder-list .td{ width: 22%; padding: 0;}
    .myorder-list .td-name{ width: 78%; padding: 8px;}
    .myorder-list .td-sum{ border-bottom: 1px solid #b9ede4;}
    .myorder-list .td .vertical{ height: 32px;}
    .myorder-list .td-pay{ width: 30%;}
    .myorder-list .td-opera{ width: 40%;}
    .myorder-list .td-pay .vertical, .myorder-list .td-opera .vertical{ height: 52px;}

    .integral-total{ margin-bottom: 18px; font-size: 16px;}
    .integral-total span{ font-size: 24px;}

    .myforum-table .opera{ width: 30%;}

    .init-test .title{ height: 118px; padding-top: 8px; margin-bottom: 28px; font-size: 30px; line-height: 40px; background-size: 126px 118px;}
    .init-test .btn-back{ width: 78px; padding-left: 16px; background-position-x: -6px;}
    .init-test .result{ padding-top: 88px; background-size: 78px; line-height: 28px;}

    .mod-bone .col-xs-6, .aside-pic, .mod-aside{ float: none; width: 100%; padding: 0; margin: 0 0 12px;}
    .aside-pic, .mod-aside{ min-height: auto; height: auto;}
    .aside-pic{ display: block;}

  	.error{ margin-bottom: 18px;}
  	.error .pic{ width: 88%;}
}

@media(max-width: 320px){
    .form-verify .btn-verify{ font-size: 12px;}

    .flash-list a{ margin: 0 2%;}

    .index-test{ overflow: hidden;}
    .index-test .man{ left: -18px;}
    .index-test .woman{ right: -18px;}

    .expense-list .name{ font-size: 16px;}
   
    .item-poetry{ padding-top: 0;}
    .item-poetry dt{ margin-left: 2%;}
    .item-poetry .ml{ margin-left: 1%;}
    .item-poetry dt{ width: 26px; font-size: 26px;}

    .forum .nav-tabs>li{ margin: 0 5px;}
    
    .mod-order .td-name{ width: 34%;}
    .mod-order .td-unit{ width: 24%;}
    .mod-order .td-num{ width: 42%;}
    .mod-order .td-sum{ display: none;}
    .mod-order .btns a{ padding:0 12px;}
    .mod-order .ft{ margin-left: -16px;}
    .myorder-list .btn-pay{ width: 68px;}
}