@charset "utf-8";
/* ui7 1.1 */
 body{margin: 0; color: #404040; font-family: "Microsoft Yahei", sans-serif; line-height: 1.6; background:#eee; }
 ul, ol{margin: 0; padding-left: 0; list-style: none;}
 ul li, ol li{vertical-align: middle;}
 dl,  p{margin: 0;} dd{margin-left: 0;}
 h1, h2, h3, h4, h5, h6{margin: 0; font-weight: normal;}
 strong{ font-weight: bold; }
 em {font-style: italic;}
 img{ display: block; border: 0;}
 a, a:link, a:visited, a:active, a:hover{text-decoration:none;} a{color: #404040;}
 a,button,input{-webkit-tap-highlight-color:rgba(0,0,0,.2);font-family: "Microsoft Yahei", sans-serif;}
 select{-webkit-appearance: none; -moz-appearance: none;}
 input[type="submit"]{cursor:pointer;}
 input[type="email"], input[type="number"], input[type="password"], input[type="tel"], input[type="url"], input[type="text"]{-webkit-tap-highlight-color:rgba(0,0,0,0);}
 input:focus, select:focus, textarea:focus, button:focus{outline: none;}
 input, textarea{padding: 0; font-size: .875rem; border-radius: 0; border: 0; resize: none;}
 textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);}
 em,i{font-style: normal;}
 table {border-collapse: collapse;}

 .recommend a i,.test-list a i,.pay a i,.unlock .inner .entry .item p i,.unlock .inner .entry .close a,.unlock .inner .entry .btn-box a i,.share-box .inner .item a i,.uers-list .item a i,.data-list .setup-tx a i,.test-entrance .inquiry span i,.header .inner span i,.return-top a{background: url(../images/icon.png) no-repeat;background-size: 205px 162px;position: relative;}
 
 .mar-top{margin-top: 44px;}
 .red{color: #e60012 !important;}
 .pink{color: #fe3ec1;}
 .blue{color: #0a89da;}
 .orange{color: #ff7800;}
 .green{color: #29b112;}
 .purple{color: #9b33f3;}
 .sblue{color: #3f58d9;}



.header{left: 0;top: 0;right: 0;z-index: 9;}
.header .inner{height: 44px;background: #a30902;text-align: center;display: block;position: relative;}
.header .inner h2{font-size: 16px;color: #fff;line-height: 44px;}
.header .inner span{position: absolute;}
.header .inner span a{display: block;}
.header .inner span a i{width: 18px;height: 19px;display: block;}
.header .inner .pull-left{left: 15px;top: 12px;}
.header .inner .pull-right{right: 15px;top: 15px;}
.header .inner span a .icon-my{background-position: -24px 0;}
.header .inner span a .icon-classify{height: 14px;background-position: 0 0;}
.header .inner span a .icon-home{width: 20px;background-position: -46px 0;}

.copy{text-align: center;font-size: 14px;color: #949393;margin-top: 10px;overflow: hidden;}



.classify{width: 100%;display: table;background: #fff;}
.classify ul{display: table-row;}
.classify li{display: table-cell;text-align: center;}
.classify li a{height: 44px;line-height: 44px;font-size: 14px;display: block;}
.classify li a.active{border-bottom: 2px solid #4295dc;color: #4295dc;font-weight: bold;}

.constellation{background: #fff;overflow: hidden;margin-top: 10px;position: relative;}
.constellation .item{width: 25%;float: left;text-align: center;font-size: 13px;line-height: 18px;}
.constellation .item a{display: block;position: relative;height: 72x;padding: 15px 0;}
.constellation .item a span{margin-top: 5px;display: block;}
.constellation .item a p{color: #949494;font-size: 12px;}
.constellation .item a i{width: 36px;height: 38px;display: block;background: url(../images/constellation.png) no-repeat;background-size: 170px 122px;margin: 0 auto;}
.constellation .item a i.icon-aries{background-position: 0 0;}
.constellation .item a i.icon-taurus{background-position: -40px 0;width: 42px;}
.constellation .item a i.icon-gemini{background-position: -88px 0;}
.constellation .item a i.icon-cancer{background-position: -127px 0;width: 43px;}
.constellation .item a i.icon-leo{background-position: 0 -42px;width: 40px;}
.constellation .item a i.icon-virgo{background-position: -46px -42px;width: 34px;}
.constellation .item a i.icon-libra{background-position: -86px -42px;}
.constellation .item a i.icon-scorpio{background-position: -129px -42px;}
.constellation .item a i.icon-sagittarius{background-position: 0 -84px;}
.constellation .item a i.icon-capricornus{background-position: -48px -84px;width: 31px;}
.constellation .item a i.icon-aquarius{background-position: -87px -84px;}
.constellation .item a i.icon-pisces{background-position: -127px -84px;}

.constellation .item a:before,
.constellation .item a:after,
.constellation:before {
  display: block; content: " "; position: absolute;
  background-color: #eaeaea; -webkit-transform: scale(0.5) translate(-50%, -50%);
  transform: scale(0.5) translate(-50%, -50%);
}
.constellation .item a:before { top: 0; right: -1px; width: 1px; height: 200%; }
.constellation .item a:after,
.constellation:before { bottom: 0; left: 0; width: 200%; height: 1px; }



.fortune{background: #fff;overflow: hidden;margin-top: 10px;padding-bottom: 15px;}
.fortune .title{height: 50px;line-height: 50px;display: block;border-bottom: 1px solid #e4e4e4;position: relative;}
.fortune .title h2{float: left;margin-left: 15px;font-weight: bold;font-size: 15px;}
.fortune .title h2 i{width: 22px;height: 20px;display: inline-block;background: url(../images/constellation.png) no-repeat;background-size: 90px 66px;position: relative;top: 4px;margin-right: 8px;}
.fortune .title h2 i.icon-aries{background-position: 2px 0;}
.fortune .title h2 i.icon-taurus{background-position: -22px 0;top: 5px;}
.fortune .title h2 i.icon-gemini{background-position: -45px 0;}
.fortune .title h2 i.icon-cancer{background-position: -67px 0;width: 23px;}
.fortune .title h2 i.icon-leo{background-position: 0 -22px;}
.fortune .title h2 i.icon-virgo{background-position: -23px -22px;}
.fortune .title h2 i.icon-libra{background-position: -44px -22px;}
.fortune .title h2 i.icon-scorpio{background-position: -66px -22px;}
.fortune .title h2 i.icon-sagittarius{background-position: 0 -45px;}
.fortune .title h2 i.icon-capricornus{background-position: -23px -45px;}
.fortune .title h2 i.icon-aquarius{background-position: -45px -45px;}
.fortune .title h2 i.icon-pisces{background-position: -66px -45px;}
.fortune .title select{position: absolute;right: 15px;top: 7px;width: 85px;font-size: 14px;height: 36px;border: 1px solid #d2d2d2;background: #fbfbfb;border-radius: 6px;text-indent: 11px;}
.fortune .title:after,.pair .pull-left .icon-sj,.pair .pull-right .icon-sj,.zodiac .pull-right .item .icon-sj,.zodiac-result .icon-sjx,.zodiac .pull-left .item .icon-sj, .zodiac .pull-right .item .icon-sj{content: " ";display: block;position: absolute;right: 25px;top: 21px;width: 12px;height: 7px;background: url(../images/icon-sj.png) no-repeat;background-size: 12px 7px;}

.fortune .entry{padding-top: 15px;}
.fortune .entry p{font-size: 14px;line-height: 28px;margin: 0 15px;}
.fortune .entry p.gray{color: #646464;}
.fortune .entry p i{width: 20px;height: 20px;display: inline-block;background: url(../images/icon-star.png) no-repeat;background-size: 41px 19px;position: relative;top: 4px;}
.fortune .entry p i.star{background-position: 0 0;}
.fortune .entry p i.gray-star{background-position: -21px 0;}
.fortune .entry p.line,.warp .entry p.line{border-bottom: 1px solid #e4e4e4;padding-top: 10px;margin: 0;margin-bottom: 10px;}




.pair{background: #fff;overflow: hidden;padding-bottom: 20px;position: relative;}
.pair .pull-left{float: left;margin-top: 20px;margin-left: 15px;position: relative;}
.pair .pull-left span,.pair .pull-right span{width: 85px;height: 85px;display: block;background: url(../images/women.png) no-repeat;background-size: 171px 85px;}
.pair .pull-left span.man{background-position: 0 0;}
.pair .pull-right span.girl{background-position: -86px 0;}
.pair .pull-left p,.pair .pull-right p{text-align: center;font-size: 14px;color: #807f7f;margin-top: 6px;}
.pair .pull-left select,.pair .pull-right select,.zodiac .pull-left .item select,.zodiac .pull-right .item select
{width: 85px;height: 36px;font-size: 14px;text-indent: 12px;margin-top: 10px;border: 1px solid #d2d2d2;background: #fff;}
.pair .pull-left .icon-sj,.pair .pull-right .icon-sj{top: 110px;right: 11px;}
.pair .pull-right{float: right;margin-top: 20px;margin-right: 15px;position: relative;}

.pair .exponential{width: 100%;text-align: center;line-height: 22px;position: absolute;top: 40px;}
.pair .exponential strong{font-size: 30px;}
.pair .exponential p{font-size: 14px;color: #666;width: 30%;display: block;margin: 0 auto;}
.pair .exponential p.orange{color: #ff871d;}


.pair .btn,.zodiac .btn{width: 100%;overflow: hidden;}
.pair .btn a,.zodiac .btn a{height: 46px;line-height: 46px;display: block;text-align: center;font-size: 14px;background: #ff881e;color: #fff;border-radius: 5px;margin: 0 15px;margin-top: 15px;}




.warp{background: #fff;overflow: hidden;padding-bottom: 15px;}
.warp .title{height: 50px;line-height: 50px;display: block;border-bottom: 1px solid #eee;text-align: center;font-size: 15px;color: #0084ff;}
.warp .entry{margin-top: 10px;}
.warp .entry p{margin: 0 15px;font-size: 14px;line-height: 28px;}



.zodiac{background: #fff;overflow: hidden;padding: 0 5px;padding-bottom: 20px;}
.zodiac .pull-left,.zodiac .pull-right{width: 50%;float: left;margin-top: 20px;}
.zodiac .pull-left .item,.zodiac .pull-right .item{border: 1px solid #00a0e9;display: block;margin: 0 10px;padding: 15px 0;border-radius: 6px;position: relative;}
.zodiac .pull-left .item p,.zodiac .pull-right .item p{font-size: 14px;padding: 0 15px;display: block;}
.zodiac .pull-left .item p.blue{color: #00a0e9;}
.zodiac .pull-left .item select,.zodiac .pull-right .item select{width: 105px;margin: 0 15px;margin-top: 10px;}
.zodiac .pull-right .item{border: 1px solid #ff60a3;}
.zodiac .pull-right .item p.red{color: #ff60a3 !important;}
.zodiac .pull-left .item .icon-sj,.zodiac .pull-right .item .icon-sj{top: 62px;left: 94px;}
.zodiac .btn a{margin: 0 10px;margin-top: 15px;}



.zodiac-result{background: #fff;overflow: hidden;padding: 0 5px;padding-bottom: 20px;padding-top: 20px;position: relative;}
.zodiac-result .pull-left{float: left;margin-left: 10px;position: relative;}
.zodiac-result .pull-left .item{width: 110px;border: 1px solid #00a0e9;display: block;border-radius: 6px;font-size: 14px;height: 60px;line-height: 60px;}
.zodiac-result .pull-left .item i{width: 34px;height: 34px;display: inline-block;background: url(../images/icon-zodiac.png) no-repeat;background-size: 352px 132px;position: relative;top: 12px;left: 12px;margin-right: 16px;vertical-align:top;}
.zodiac-result .pull-left .item i.man-rat{background-position: 0 0;}
.zodiac-result .pull-left .item i.girl-rat{background-position: -40px 0;}
.zodiac-result .pull-left .item i.man-cattle{background-position: -80px 0;width: 39px;}
.zodiac-result .pull-left .item i.girl-cattle{background-position: -124px 0;}
.zodiac-result .pull-left .item i.man-tiger{background-position: -168px 0;width: 40px;top: 14px;}
.zodiac-result .pull-left .item i.girl-tiger{background-position: -214px 0;width: 40px;top: 14px;}
.zodiac-result .pull-left .item i.man-rabbit{background-position: -258px 0;height: 39px;top: 9px;}
.zodiac-result .pull-left .item i.girl-rabbit{background-position: -295px 0;height: 39px;top: 9px;}
.zodiac-result .pull-left .item i.man-loong{background-position: 0 -47px;top: 13px;}
.zodiac-result .pull-left .item i.girl-loong{background-position: -44px -47px;top: 13px;}
.zodiac-result .pull-left .item i.man-snake{background-position: -86px -47px;top: 13px;height: 36px;}
.zodiac-result .pull-left .item i.girl-snake{background-position: -126px -47px;top: 13px;height: 36px;}
.zodiac-result .pull-left .item i.man-horse{background-position: -168px -47px;top: 15px;width: 39px;}
.zodiac-result .pull-left .item i.girl-horse{background-position: -214px -47px;top: 15px;width: 39px;}
.zodiac-result .pull-left .item i.man-sheep{background-position: -257px -47px;top: 15px;width: 40px;top: 13px;}
.zodiac-result .pull-left .item i.girl-sheep{background-position: -299px -47px;top: 15px;width: 40px;top: 13px;}
.zodiac-result .pull-left .item i.man-monkey{background-position: 0 -95px;top: 13px;width: 36px;}
.zodiac-result .pull-left .item i.girl-monkey{background-position: -41px -95px;top: 13px;width: 36px;}
.zodiac-result .pull-left .item i.man-chicken{background-position: -86px -95px;top: 13px;width: 39px;}
.zodiac-result .pull-left .item i.girl-chicken{background-position: -129px -95px;top: 13px;width: 39px;}
.zodiac-result .pull-left .item i.man-dog{background-position: -176px -95px;top: 13px;width: 35px;height: 37px;}
.zodiac-result .pull-left .item i.girl-dog{background-position: -219px -95px;top: 13px;width: 35px;height: 37px;}
.zodiac-result .pull-left .item i.man-pig{background-position: -258px -95px;top: 15px;width: 42px;}
.zodiac-result .pull-left .item i.girl-pig{background-position: -308px -95px;top: 15px;width: 42px;}

.zodiac-result .pull-right{float: right;margin-right: 10px;position: relative;}
.zodiac-result .pull-right .item{border: 1px solid #ff4d83;}

.zodiac-result .vs{width: 100%;text-align: center;font-size: 28px;font-weight: bold;color: #666;position: absolute;top: 32px;left: 0;}

.zodiac-result .entry{width: 100%;overflow: hidden;padding-top: 5px;}
.zodiac-result .entry p{margin: 0 10px;margin-top: 6px;line-height: 26px;font-size: 14px;}

.zodiac-result select{width: 100%;height: 40px;margin-top: 10px;text-indent: 10px;border: 1px solid #ccc;}
.zodiac-result span.icon-sjx{top: 89px;right: 14px;}






.backdrop{position: fixed;left: 0;top: 0px;z-index: 3;width: 100%;height: 100%;background-color: rgba(0,0,0,.7);}
/* ------------------------------------------------ 八字详批-选择分类 2017-02-23 ------------------------------------------------ */

.choice{position: fixed;left: 0;top: 64px;right: 0;z-index: 9;}
.choice li{width: 33.3%;float: left;text-align: center;font-size: 13px;margin-top: 10px;line-height: 30px;}
.choice li a img{width: 60px;height: 60px;display: block;margin: 0 auto;border-radius: 10px;}






@media screen and (width: 375px){
.zodiac-result .pull-left .item,.zodiac-result .pull-right .item {
    width: 130px;
}








/*电脑访问优化*/
@media only screen and (min-width: 1024px){
html{position: relative; width: 375px; height: 100%; margin: 0 auto; background: #ccc;}
body{background: #eaeaea; height: 100%;}
}


.clearfix:before, .clearfix:after {
  content: "";
  display: table;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  zoom: 1;
}
