@font-face {font-family: cn-regular;src: url('../font/SourceHanSansCN-Regular.otf');}
/*body{font-family: 'cn-regular';}*/
.home{ background:url('../img/home/back_p9.jpg'); background-size: 100%; }
.home .home-logo{ z-index:10000;position:absolute; width: 32%; margin-top: 8.5%; }
.home .home-title{ width: 59%; margin-top: 34.5%; margin-left: 17%; }
.home .home-icon{ width: 55%; margin-left: 22.5%; margin-top: 36%; }
#Odiv { height: 100%; width: 100%; }
#Odiv div>img{ width: 100%; }
#Odiv .col-xs-8{ height: 49.899999999%; padding: 0px; }
#Odiv .col-xs-8 span{ color: #7C3E06; font-size: 16px; font-weight: 600; border-bottom:1px solid #7C3E06; }
#Odiv .col-xs-8 .home-self{ margin-top: 15.6%; margin-left: 18%; }
#Odiv .col-xs-4{ height: 25%; padding: 0px; }
.home-hy-hd{ background: rgba(255, 255, 255, 0.7); }
.home-hy-fx{ background: rgba(255, 255, 255, 0.4); }
.home-hy-jb{ background: rgba(255, 255, 255, 0.2); }
.home-hy-md{ background: rgba(255, 255, 255, 0.6); }
.home-hy-rc{ background: rgba(255, 255, 255, 0.8); }
.home-hy-gs{ background: rgba(255, 255, 255, 0.7); }
.home-hy-zb{ background: rgba(255, 255, 255, 0.85); }
.home-hy-sc{ background: rgba(255, 255, 255, 0.7); }
.information{background: url('../img/base/back_p4.jpg');background-size: 100%;}
.information .information-head{ margin-top: 7%; margin-bottom: 3%; margin-right: 10%;  }
.information .information-head p{font-weight: bolder;font-size: 16px}
.information .information-contant img{width: 100%}
.information .information-img { display: inline-block; width: 78%; font-size: 12px; position: relative; vertical-align: middle; margin-left: 11%;  }
.information .information-img:nth-child(2n){ background: orange;  }
.information .information-img:before { content:""; display: inline-block; padding-bottom: 100%; width: .1px; vertical-align: middle; }
.information .information-img span { display: inline-block; vertical-align: middle; font-size: 4em; color: #fff; }
.information .information-home { width:10%; position:absolute; margin-top: 14%; margin-left: 6%; z-index:3 }
.information .information-message{ position:absolute; margin-top: 92%; margin-left: 15%; width: 80%; z-index: 3; }
.information .information-message p{ text-align:left; color: #ffffff; }
.information .information-message .message-name p{ background-color: #7B3900; font-size: 20px; padding-left: 7%; padding-top: 3%; padding-right: 7%; padding-bottom: 3%; margin-bottom: 2%; font-weight: bold; display: inline;}
.information .information-message .message-manager p{ background-color: #7B3900;font-size: 16px;padding: 3% 8.2% 3% 8.2%; font-weight: lighter;display: inline; }
.information .message-phone{ margin-top: 22%; margin-left: 18%; font-size: 13px; }
.information .message-phone p{ margin-bottom: 0px; }
.information .message-qr{ width: 27%; margin-right: 9%; }
.information .message-qr img{ width: 100%; }
.sign{ background: url('../img/sign/back_p5.jpg'); background-size: 100%; }
.sign img{ width: 100%; }
.sign-logo{ position:absolute; width: 20%; margin-top: 7%; z-index: 20000; }
.sign-logo img{ width: 100%; }
.sign .sign-back{ position:absolute; width: 10%; margin-top: 35.5%; margin-left: 78%; z-index: 2; }
.sign .sign-contant{ position:absolute; margin-top: 41%; margin-left: 16%; width: 68%; z-index: 1; }
.back{ position:absolute; z-index: 1000; width: 11%; }
.back img{ width: 100%; }
.photo,.user-center{ background: url("../img/base/back_p3.jpg"); background-size: 100%; }
.photo .back{ margin-top: 3.7%; margin-left: 84%; }
#photo-box{ position:absolute; background: white; width: 95%; margin-top: 10%; height: 90.5%; }
#photo-box-head{ width: 88%; margin-left: 6%; background: #FED700; height: 12.5%; position: relative; }
#photo-box-contant{ position:absolute; width: 88%; height: 85.5%; bottom: 0; overflow-y:auto; margin:0 auto 0 6%;  }
#photo-box-head .photo-box-title{ position:absolute; width: 75%; margin-left: 12.5%; bottom: 0px; height: 44%; }
#photo-box-head .photo-box-title .active{ background: #E70012; }
#photo-box-head .photo-box-title div{ position:absolute; width: 50%; height: 100%; }
#photo-box-head .photo-box-title div:nth-child(2){ margin-left: 50%; }
#photo-box-head .photo-box-title div{ text-align: center; }
#photo-box-head .photo-box-title div>p{ color: white; margin-top: 5%; }
.all-photo{ width: 32%; padding: 0; height: 20%; margin-bottom: 2%; }
#photo-box-contant figure:nth-child(3n+1){ margin-right: 2%; }
#photo-box-contant figure:nth-child(3n){ margin-left: 2%; }
.photo-add{ position:absolute; float:right; z-index: 2; width: 11%; margin-top: 140%; margin-left: 78.3%; }
.photo-add img{ width: 100%; }
.user-center .center-car{ position:absolute; width: 78%; margin: 9.5% 11% 0; height:87.7%; background: #F8CF01; }
.user-center .center-car .car-photo{ width: 90%; margin-left: 5%;margin-top: 5% }
.user-center .center-car .car-photo::before{content: "";padding-top: 100%;display: block;}
.user-center .center-car .car-photo img{ width: 100%; }
.user-center .back{ margin-top: 4%; margin-left: 83.5%; }
.user-center .center-menu{ background: white; height: 27%; width: 100%; margin-left: -5%; margin-top: 15%;}
.user-center .center-menu .center-menu-row{ height: 33.33333333%; color: #999999; }
.user-center .center-menu .center-menu-row .center-menu-img{ float:left; display:inline; margin-left: 15%; margin-top: 3%; }
.user-center .center-menu .center-menu-row .center-menu-img img{ width: 50%; }
.user-center .center-menu .center-menu-row .center-menu-text{ float:left; display:inline; margin-top: 3%; }
.user-center .center-menu .center-menu-row .center-menu-text p{margin: 0px}
.user-center .center-car .car-foot{ width: 100%; height: 10%; bottom: 0px; position: absolute;  }
.user-center .center-car .car-foot>div{ width: 33.33333333%; }
#vip_level > img{ margin-top: 20%; margin-left: 35%; width: 75%; }
.user-center .center-car .car-foot .car-foot-icon{ float:left; display:inline; width: 10%; margin-top: 15%; margin-left: 37%; }
.user-center .center-car .car-foot .car-foot-icon img{ width: 100%; }
.user-center .center-car .car-foot .car-foot-text{ margin-top: 19.5%; margin-left: 55%; font-size: 10px; color: white; }
.rank-list{ background: url("../img/base/back_p4.jpg"); background-size: 100%; }
.rank-self{ position: absolute; z-index: 1; width: 85%; height: 17%; background: white; margin-top: 10%; margin-left: 5%; }
.rank-list .back{ margin-left: 85%; margin-top: 4.5%; }
.rank-self .rank-self-row{ width: 100%; height: 60%; margin-top: 6%; }
.rank-self .rank-self-row .self-icon{ width: 20%; height: 100%; }
.rank-self .rank-self-row .self-message{ width: 65%; height: 100%; margin-left: 8%; position:relative; }
.rank-self .rank-self-row .self-message p{ margin-top: 4.5%; font-size: 17px; margin-bottom: 0px; }
.rank-self .rank-self-row .self-message .self-information{ bottom:0px; height: 28%; width: 100%; position: absolute; }
.rank-self .rank-self-row .self-message .self-information img{ height: 100%; width: 9%; }
.rank-self .rank-self-row .self-message .self-information span{ font-size:12px;color:#E8190F; margin-left: 3%; }
.rank-list .ranking-list{ position: absolute; width: 80%; height: 70%; margin-left: 10%; margin-top: 37.4%; }
.rank-list .ranking-list .ranking{ background: white; margin-top: 4%; width: 100%; height: 9%; }
.rank-list .ranking-list .ranking .ranking-head{ height: 100%; width: 13%; margin-left: -6.2%; margin-top: -2%; }
.rank-list .ranking-list .ranking .ranking-message{ height: 45%; width: 74%; margin-top: 3%; margin-left: 5%; }
.rank-list .ranking-list .ranking .ranking-message img{ height: auto; margin: 1% 0px 0px 0px; padding: 0; width: 6%;}
.ranking .ranking-message span:nth-last-child(2){
   margin-top: 1%;
   color: #666666;
   font-size: 12px;
   padding: 0;
   width: 14%;
   margin-left: 2%;
}
.rank-list .ranking-list .ranking .ranking-message span:nth-last-child(1){
   padding: 0px;
   margin-left: 5px;
   width: 5%;    margin-top: 1%;
   color: #666666;
   font-size: 12px; }
.rank-list .ranking-list .ranking .ranking-message span:first-child{ font-size: 15px; width: 65%}
.rank-list .ranking-list .ranking .ranking-foot{ width: 14%; height:100%; font-size: 25px; display:table-cell; text-align:center; vertical-align:middle; }
.rank-list .ranking-list .ranking .ranking-foot p{ color: #9c9c9c; font-style: italic; }
.feeling{ background: url("../img/base/back_p3.jpg"); background-size: 100%; }
.interaction{ background: url("../img/base/back_p3.jpg"); background-size: 100%; color: #666666; position: relative; }
.interaction .feeling-box{ background: white; height: 81%; margin-left: 10%; width:85%; }
.feeling-box{ position: absolute; background: #FED700; width: 90%; margin-left: 5%; height: 90.5%; margin-top: 4.4%; z-index: 1; }
.back{ margin:4.5% 0 0 84%; }
.feeling .feeling-box .feel-centent{ width: 90%; margin-left: 5%; margin-top: 6.3%; height: 82%; bottom: 0; overflow-y:auto; }
.feeling .feeling-box .feel-centent .feel-row{ background: white; width: 100%; min-height: 10%; margin-bottom: 3%; color: #666666; }
.feeling .feeling-box .feel-centent .feel-row p{
   margin-left: 18%; word-wrap : break-word; padding-top: 14%; margin-right: 7%; padding-bottom: 5%; }
.feeling .feeling-box .feel-centent .feel-row .row-head{ height: 35%; width: 80%; margin-top: 4%; font-size: 14px; margin-left: 2%; }
.feeling .feeling-box .feel-centent .feel-row .row-head img{ width: 5%; }
.feeling .feeling-box .feel-centent .feel-row .row-head .pull-right{ margin-top: 1%; margin-right:2%; }
.feeling .feeling-box .feel-centent .feel-row .self-head{ height: 38px; width: 38px; }
.feeling .feeling-box .feel-centent .feel-row .row-inform{ height: 80%; }
.feel-foot{ position: absolute; height: 9.7%; width: 97%; margin-top: 133%; margin-left: 4%;}
.feel-foot>div{ position: absolute; bottom: 0px; width: 88%; margin-left: 6%; background: #FED700; height: 70%; }
.feel-foot .feel-input input{ border:none; background: #fed700; outline: medium; height: 70%; margin: 2% 0 0 13%; width: 70%; color: white; font-size: 16px; }
.feel-foot .feel-input>div{ height: 100%; width: 15%; text-align:center; }
.feel-foot .feel-input>div>img{ margin-top: 20%; width: 50%; }
.feel-foot>div>input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #ffffff; opacity:1; }
.feel-foot>div>input::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #ffffff;opacity:1; }
.feel-foot>div>input:-ms-input-placeholder{ color: #ffffff;opacity:1; }
.feel-foot>div>input::-webkit-input-placeholder{ color: #ffffff;opacity:1; }
.small-font{ font-size:12px; -webkit-transform-origin-x: 0; -webkit-transform: scale(0.90); }
.smallsize-font { font-size:10.8px; }
#set-top{ margin-top: 6.1%; background: #FED700; height: 25%; width: 93%; margin-left: -6%; }
#set-top .set-top-left{ height: 100%; width: 14%; text-align:center; }
#set-top .set-top-left img{ vvertical-align: middle; width: 57%; margin-top: 50%; }
#set-top .set-top-content{ width: 82%; height: 64%; margin-top: 7%; }
#set-top-title>p{ margin: 0px; font-size: 120%; line-height:120%; }
#set-top-message{ word-break:break-all; line-height: 120%; }
.interaction .interaction-centent{ overflow-y:auto;position: absolute; width: 100%; height: 100%;}
.interaction-row{ width: 80%; margin-left: 7.5%; margin-bottom: 7%; }
.interaction-row .row-title{ width: 100%; height: 40px; }
.interaction-row .row-title .head{ height: 100%; width: 40px; }
.interaction-row .row-title > *{ display:block; position: relative; top:50%; transform:translateY(-50%); }
.interaction-row .row-title :nth-child(2){ margin-left: 2%; color: #663300;}
.interaction-row .row-title :nth-child(3){ margin-right: 6%; }
.interaction-row .row-title>img{ width: 6%; margin-right: 3%; }
.interaction-row .row-centent{ border-bottom:thin inset #E3E3E3; margin-top: 2%; word-wrap : break-word;  }
.interaction-row .row-centent>p{ margin: 0px; width: 105%;font-size: 14px }
.interaction .feeling-box .feel-foot{ bottom: auto; margin-top: 7%; background: transparent; }
.interaction .feeling-box .feel-foot .feel-input{ width: 100%; margin-left: 0; }
.interaction .feeling-box .feel-foot .feel-input > div{ width: 12%; margin-right: 2%; }
.interaction .QA{ position: absolute; z-index: 1000; background: rgba(254,218,12,0.95); width: 15%;     margin-top: 110%; margin-left: 2%; }
#myIm{
   padding: 0px;
}
.interaction .QA > img{ width: 100%; }
.language .language-btn{ margin-left: 35%; margin-top: 67.6%; position: absolute; width: 35%; height: 7%; }
.language .language-btn .language-en{ margin-top: 13%; background-color:#FED700; color: #E61A0F; }
.language .language-btn .language-ch{ background-color:#E61A0F; color: white; }
.language .language-btn > button{ height: 100%; width: 100%; }
.qa-box{ z-index: 2;width: 85%; margin-left: 10%; margin-top: 10%; background: white; position: absolute; }
.qa-title{ background: #FED700; width: 93%; height: 20%; margin-top: 6%; margin-left: -6%; }
.qa-title .title-left{ width: 15%; height: 100%; }
.qa-title .title-left img{ width: 60%; margin-top: 47%; margin-left: 20%; }
.qa-title .title-center{ height: 100%; width: 82%; padding-top: 6%; }
.qa-title .title-center :nth-child(1) p{ font-size: 17px; font-weight:600; margin-bottom: 2%; }
.qa-title .title-center p{ margin: 0px; font-size: 12px; color: #666666; font-weight: lighter; line-height: normal; }
.qa-centent{ height: 57%; width: 80%; margin: 5% 5% 0px 7%; }
.qa-centent .centent-title{ height: 20%; width: 97%; margin-top: 13%; }
.qa-centent .centent-title p{ margin: 0px; font-size: 12px; height: 100%; overflow:hidden;}
.qa-centent .centent-check{ margin-top: 13%; }
.qa-centent .centent-check ul{ list-style:none; margin:0; padding:0; font-size: 12px;}
.qa-centent .centent-check ul>li{ margin-top: 5%; }
.qa-centent .centent-check ul>li>label{ display: unset; margin-left: 3%; width: 80%; }
.qa-submit button{ margin:0 auto; height:100%; width:80%; display:block; background: #FED700; border-color: #FED700; }
.safety-box{
   padding-bottom: 10%;
   margin-bottom: 20%;
   background: white;
   width: 85%;
   margin-left: 10%;
   position: absolute;
   z-index: 2;
   margin-top: 10%;
}
.safety-box .box-title {
   margin-top: 6.5%;
   height: 53px;
   width: 93%;
   background: #FED700;
   margin-left: -6%;
   font-size: 20px;
   color: #E61A0F;
}
.box-title span{
   display:block;
   position: relative;
   top:50%;
   transform:translateY(-50%);
}
.safety-box .box-title img{
   display:block;
   position: relative;
   top:50%;
   width: 18px;
   height: 18px;
}
.safety-box .box-title .col-xs-10{
   margin-left: -5%;
}
.safety-box .box-centent{
   margin-top: 5%;
   font-size: 13px;
   width: 87%;
   color: #666;
   line-height: 22px;
}
.safety-box .box-centent .box-img{
   width: 90%;
   margin-left: 9%;
   margin-top: 5%;
}
.safety-box .box-centent .box-img img{
   width: 100%;
}
.safety-box .box-centent li{
   padding-left: 2%;
}
.safety-box .box-centent p{
   padding-left: 9%;
   margin: 0px;
}
.safety-box .box-centent p>span>img{
   height: 18px;
}
.int-text{
   height: 50%;
   width: 100%;
}
.int-text textarea{
   height: 100%;
   border: 0px;
}
.int-img{
   height: 40%;
   width: 100%;
}
.purpose-box{
   position: absolute;
   z-index: 2;
   width: 95%;
   background: white;
   margin-top: 10%;
   margin-bottom: 10%;
}
.purpose-box .box-title{
   background: #FED700;
   height: 42px;
   width: 90%;
   color: #E61A0F;
   margin-left: 5%;
}
.purpose-box .box-title span{
   margin-left: 10%;
   font-size: 18px;
}
.purpose-box .box-centent{
   width: 81%;
   margin-left: 14%;
   margin-top: 5%;
   font-size: 13px;
   color: #666;
   line-height: 22px;
   margin-bottom: 5%;
}
.redRectangle img{
   height: 0.4em;
}
.redRectangle img{
   height: 0.4em;
}
.redRectangle span{
   margin-left: 1.2em;
}
.redRectangle img+span{
   margin-left: 0.8em;
}
.share #photo-box #photo-box-head{
   margin-top: -5.7%;
}
#photo-box-contant .box-row{
   width: 100%;
}
#photo-box-contant .box-row .row-title{
   height: 100%;
}
.box-row .row-title > div{
   width: 100%;
}
.feel-centent{ width: 90%; margin-left: 5%; margin-top: 6.3%; height: 82%; bottom: 0; overflow-y:auto; }
.feel-centent .feel-row{padding-bottom: 5%; background: white; width: 100%; min-height: 10%; margin-bottom: 3%; }
.feel-centent .feel-row .row-centent p{
   margin: 0px 7% 2% 19%;
   word-wrap: break-word;
   padding-top: 8%;
   font-size: 12px;
}
.feel-centent .feel-row .row-head{width: 80%;font-size: 14px; margin-left: 2%; }
.feel-centent .feel-row .row-head img{ width: 5%; }
.feel-centent .feel-row .row-head .pull-right{ margin-top: 1%; margin-right:2%; }
.feel-centent .feel-row .row-head :nth-child(1){
   margin-left: 4%;
}
.feel-centent .feel-row .self-head{ height: 38px; width: 38px; }
.feel-centent .feel-row .row-inform{ height: 80%; }
/*.feel-centent .feel-row .row-photo>img{*/
   /*margin-left: 16%;*/
   /*width: 62%;*/
/*}*/
.feel-centent .feel-row .row-photo>figure>a>img{
   margin-left: 19%;
   width: 62%;
}
.feel-centent .feel-row .row-foot{
   width: 80%;
   font-size: 12px;
   margin-left: 16%;
   height: 5%;
   margin-top: 10px;
   margin-bottom: 5px;
}
.feel-centent .feel-row .row-foot img{
   width: 13%;
}
.feel-centent .feel-row .row-foot .foot-comment{
   position: relative;
   width: 55%;
   height: 30px;
   background: #FED700;
   margin-left: 5%;
   margin-top: -5%;
   z-index: 1000;
}
.feel-centent .feel-row .row-foot .foot-comment div>span{
   margin-left: 10%;
}
.feel-centent .feel-row .row-foot .foot-comment img{
   width: 20%;
}
.feel-centent .feel-row .row-foot .foot-comment .col-xs-6{
   display: block;
   padding-left: 15px;
   padding-right: 0px;
   color: white;
   height: 100%;
   margin-top: 5%;
}
.feel-row .row-comment{
   background: #F9F1C3;
   width: 100%;
}
.feel-row .row-comment>div>p{
   padding-top: 2%;
   padding-left: 5%;
   margin-bottom: 0%;
}
.feel-row .row-comment{
   color: #000;
   margin: 0px;
}
.feel-row .row-comment>div>p>span>img{
   width: 15px;
   margin-right: 0.8em;
}
.feel-name{
   color: #663300;
}
.feel-row .row-comment .comment-bottom{
   border-bottom: 1px solid #fae780;
}