/**
	给力心理 案例  2015-11-20
**/
html {color: #808080;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td {
	margin: 0;padding: 0;font-family: "Segoe UI","Lucida Grande",Helvetica,Arial,"Microsoft YaHei",FreeSans,Arimo,"Droid Sans","wenquanyi micro hei","Hiragino Sans GB","Hiragino Sans GB W3",FontVsoicon,sans-serif
}

table {border-collapse: collapse;border-spacing: 0}
fieldset,img {border: 0}
address,caption,cite,code,dfn,em,strong,th,var {font-style: normal}
ol,ul {list-style: none}
caption,th {text-align: left}
h2,h3,h4,h5,h6 {font-size: 100%}
h1{font-size: 12px;font-weight: normal;float: left}
q:before,q:after {content: ''}
abbr,acronym {border: 0;font-variant: normal}
sup {vertical-align: text-top}
sub {vertical-align: text-bottom}
input,textarea,select {font-family: inherit;font-size: inherit;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden}
.clearfix {display: inline-block}
* html .clearfix {height: 1%}
.clearfix {display: block}
.fr {float: right}
.fl {float: left}
.clear {clear: both}
.hide {display: none}
.show {display: block}
input,button,a {outline: 0}

.h20{ height:20px;}

.showtab{padding: 5px; color: #333; min-height: 40px;}
.showtab .otype{  font-size: 12px; cursor: pointer;border-radius: 30px; margin: 1%; padding: 0.5em 0;border: 1px solid #dcdcdc; background-color: #fff; float: left; width: 22%;text-align: center; }
.showtab .otype2{ font-size: 12px; border-radius: 30px; margin: 1%;padding: 0.5em 0;border: 1px solid #F8D94D; background-color: #F8D94D; float: left; width: 22%; text-align: center;}
.showtab p{ width: 100%; text-align: center;color: #B2B4BD; cursor: pointer; clear: both}
.showtab .tab2{ display: none}

.content{  background-color: #f9f9f9; display: inline-block; font-size: 12px;letter-spacing: normal; padding: 3%;vertical-align: top; width: 94%; word-spacing: normal;}
.content ul li a{ width: 100%; text-decoration: none;color: #808080;}
.content ul li{ float: left; width: 96%; border-bottom: #fff 1px solid; padding:20px 2%;height: 60px;    background-color: #fff;border-radius: 2px;margin-bottom: 10px; }
.content ul li img{ border-radius: 50%;float: left;width: 40px;margin-right: 10px;}
.content ul li div{height: 42px;overflow: hidden;padding: 0px 5px 0px; line-height:20px;   font-size: 12px;}
.content ul li .msg{ color: #333;font-size: 14px;}
.content .showinfo{ height: 20px; width: 100%; line-height: 30px; height: 30px;}
.content .showinfo .time{float: left;}
.showinfo i{ margin-right: 5px;}
.content ul li span{ width: 70px; float: right; height: 20px;display: block}
.content ul li span img{ width: 18px;vertical-align: middle;margin-right: 5px; height: 18px;}

/**滚动新闻**/
#FontScroll{width:100%;height:30px;line-height:30px;overflow:Hidden;font-size: 12px; margin-top: 60px;}
#FontScroll a{color: #9a9a9a;line-height: 25px; text-decoration: none;}
#FontScroll .line{text-align:center;width:100%;}
#FontScroll .fontColor a{color:red;}

.f2{ width: 100%; position: relative}
.f2 table{width: 98%;margin-left: 1%;text-align: center;}
.f2 table td{ border: 1px solid #e7e7e7;height: 84px; font-size: 12px; line-height: 26px;}
.f2 table a{ text-decoration: none; color:#585858; padding-top: 10px;height: 74px;display: block;}

/**自动加载**/
.loaddiv,.div_null{text-align: center;display:none; background-color: #f2f2f5;padding-top: 20px;}
.alink{display:none;font-size: 46px;}

/**问题详情页面**/
.detail {
  background-color: #F2F2F2;
  a {
    text-decoration: none;
  }
}
.detail ul{padding: 10px; font-size: 12px;}
.detail li{   margin-bottom: 1.5em;overflow: hidden; width: auto; clear: both;}
.detail li.odd .user {float: left;margin-right: 10px;}
.detail li.even .user {float: right;margin-left: 10px;}
.detail li.odd .reply-content-box { margin-left: 60px;}
.detail li.even .reply-content-box { margin-right: 60px;}
.reply-time {color: #bbbbbb;display: inline-block;font-size: 0.85em;width: 100%;}
.detail li.odd .reply-time {text-align: left;}
.detail li.even .reply-time {text-align: right;}
.odd .reply-content{ float: left;background-color: #89E5C8; border: 1px solid #89E5C8; margin-right: 58px;}
.even .reply-content{ float: right;background-color: #b3e9f3; border: 1px solid #b3e9f3; margin-left: 58px;}
.reply-content { border-radius: 4px; box-shadow: 0 0 5px #ccc;padding: 0.6em;position: relative; color: #555555}
.detail li.odd .arrow { border-color: transparent #89E5C8 transparent transparent; border-style: dashed solid dashed dashed;border-width: 6px;display: block;font-size: 0; height: 0;left: -12px;
    line-height: 0;position: absolute;top: 8px;width: 0;z-index: 999;}
.detail li.even .arrow { border-color: transparent transparent transparent #b3e9f3;border-style: dashed dashed dashed solid;border-width: 6px;
    display: block;font-size: 0;height: 0;line-height: 0;position: absolute; right: -12px; top: 8px;width: 0;z-index: 2;}

/**问题详情页面2**/
.detail{ font-size: 14px;}
.detail a{ text-decoration: none;}
.detail{ background-color: #F2F2F2; position: relative;min-height: 100%; width: 100%;}
.detail ul{padding: 30px 10px; font-size: 15px; background-color: #fff; margin-top: 14px; color: #000000}
.detail li{   margin-bottom: 1em;overflow: hidden; width: auto;}
.detail .msg{ background-color: #fff; padding: 10px;   position: relative;border-radius: 10pt;top: -90px; }
.detail .msg .m_h{ height: 50px;}
.detail .msg .m_title{    background-image: url("../images/question/bg02.png");
    background-position: 30px 5px;
    background-repeat: no-repeat;
    background-size: 70px auto;
    color: #000;
    font-size: 18px;
    font-weight: bold;
    line-height: 30px;}
.m_h .face{ border-radius: 50%; width: 40px; height: 40px;  float: left;}
.m_h .m_h_info{ float: left; margin-left: 10px;}
.m_h .m_h_info .name{ font-size: 15px; color: #333;}
.m_h .m_h_info .time{ font-size: 12px; color: #999999}
.m_h .m_h_r{ border: 1px #F5C344 solid;
    border-radius: 6px;
    cursor: pointer;
    float: right;
    padding: 5px 10px;
    text-align: left;}
.m_h .m_h_r2{    background-color: #f5c344;
    border-radius: 6px;
    cursor: pointer;
    float: right;
    margin-top: 10px;
    padding: 5px 10px;
    text-align: left;}
.m_h .m_h_r img{ width: 30px; height: 30px; vertical-align: middle}
.m_h .m_h_r i{ font-size: 14px;    color: #F5C344;font-size: 20px;}
.m_h .m_h_r span{font-size: 14px; color: #F5C344}
.m_c{float: left; width: 100%;}
.m_c .m_c_msg{font-size: 15px; line-height: 21px; color: #000;font-weight: 200;}
.m_c .m_c_msg img{ width: 100%}
.m_c .m_c_info{ font-size: 12px;height: 30px;line-height: 30px; text-align: right; width: 100%; float: left;}
.m_c .m_c_info span{ margin-right: 16px;margin-top: 10px;}
.m_c .m_c_info img{width: 20px; height: 20px;  vertical-align: middle; margin-right: 10px;}
.m_c .m_c_info i{ margin-right: 5px; color: #333; font-size: 16px;}
.m_f{ order-top: 1px solid #ebebeb; font-size: 14px;height: 40px;}
.m_f img{border-radius: 50%; height: 24px; vertical-align: middle;}
.m_f span{ line-height: 40px; font-size: 12px;}

.detail li.msg_l .user {float: left;margin-right: 10px;}
.detail .user img{border-radius: 50%}
.detail li.msg_r .user {float: right;margin-left: 10px;}
.msg_r img{ border-radius: 50%; width: 40px; height: 40px;}
/*.detail li.msg_l .reply-content-box { margin-left: 60px;}*/
.detail li.msg_r .reply-content-box { margin-right: 60px;}
.user-name {color: #999;display: block; margin-top: 5px; overflow: hidden; text-align: center;text-overflow: ellipsis;white-space: nowrap;width: 50px; font-size: 10px;}
.reply-time {color: #bbbbbb;display: inline-block;font-size: 0.85em;width: 100%;}
.detail li.msg_l .reply-time {text-align: left;}
.detail li.msg_r .reply-time {text-align: right;}
.msg_l .reply-content{ float: left;background-color: #fff8e6; border: 1px solid #f5c344; max-width: 60%;border-radius: 0 10px 10px;}
.msg_r .reply-content{ float: right;background-color: #F8D94D; border: 1px solid #F8D94D; margin-left: 58px;border-radius: 10px 0 10px 10px;}
.reply-content { padding: 0.6em;position: relative; color: #000000}
.detail li.msg_l .arrow { border-color: transparent #89E5C8 transparent transparent; border-style: dashed solid dashed dashed;border-width: 6px;display: block;font-size: 0; height: 0;left: -12px;
    line-height: 0;position: absolute;top: 8px;width: 0;z-index: 999;}
.detail li.msg_r .arrow { border-color: transparent transparent transparent #b3e9f3;border-style: dashed dashed dashed solid;border-width: 6px;
    display: block;font-size: 0;height: 0;line-height: 0;position: absolute; right: -12px; top: 8px;width: 0;z-index: 2;}
/***底部浮动层**/
.twdiv{
    background-color: #fff;
    border-top: 1px solid #ececec;
    bottom: 0;
    display: block;
    height: 60px;
    position: fixed;
    width: 100%;
    left: 0;
    z-index: 1000;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
    padding: 0 10px;
    box-sizing: border-box;
}
/* .fileInputContainer{
        height:256px;
        background:url(../images/index/addimg.jpg);
        position:relative;
        width: 256px;
    }
    .fileInput{
        height:256px;
        overflow: hidden;
        font-size: 300px;
        position:absolute;
        right:0;
        top:0;
        opacity: 0;
        filter:alpha(opacity=0);
        cursor:pointer;
    }*/
.addimg{
    height: 40px; width: 40px; background:url(../images/index/addimg.jpg); background-repeat:no-repeat; float: left;background-size: 100% 100%;margin-top: 10px;
}

.twdiv img{   float: left;
    height: 40px;
    margin-top: 10px;
    vertical-align: middle;
    width: 40px;}
.twdiv input {
    background-color: #f9f9f9;
    border: medium none;
    border-radius: 5px;
    height: 40px;
    padding: 5px 10px;
    width: 70%;}
input[type="file"]{
height:40px;width: 40px;
opacity:0;
cursor:pointer;
}
.btn_send{
  background-color: #5bb79a;
    border: medium none;
    border-radius: 3px;
    color: #fff;
    cursor: pointer;
    font-size: 1.125rem;
    height: 36px;
    margin-top: 10px;
    transition: all 0.5s ease-out 0s;
    width: 50px;
}
/**问题列表样式**/
.detail .f3 ul li{   background-color: #fff; border-radius: 10pt; margin-bottom: 10px; padding: 10px;}
.f3{background-color: #f5f4f4; float: left;min-height: 300px; position: relative; top: -52px;width: 100%; }
.f3 ul{ background-color: #F5F4F4; padding: 10px 0px;width: 100%; }
.f3 ul li a{ width: 100%; text-decoration: none;color: #808080;}
.f3 ul li{border-bottom: #fff 1px solid; padding: 5px;height: 40px; }
.f3 ul li img{ float: left; width:40px;border-radius: 50%;}
.f3 ul li div{
    height: auto;
    max-height: 60px;
    overflow: hidden;
    padding: 0px 5px 0px;
    line-height:23px;
    color: #333;
    word-break: break-word;
}

.f4{float: left;width: 100%; background-color: #4F4F53;padding: 20px 0;font-size: 12px; position: relative; top: -60px;}
.f4 div{ margin-bottom: 10px;}
.f4 .link span{ padding: 0px 10px;}
.f4 .link span a{color: #e3e3e3; font-size: 14px;line-height: 30px;text-decoration: none;}

.f5{ text-align: center}
.f5 a{ padding: 5px 10px; border-radius: 20px;color: #fff; background-color: #5BB79A;  line-height: 40px; font-size: 12px;}

.breadcrumbs{color: #4F4F53; line-height: 20px; padding: 5px;font-size: 12px;  overflow: hidden; background-color:#4F4F53;text-shadow: none;}
.breadcrumbs a{ color: #a1a1a1; text-decoration: none;text-shadow: none;float: left}
.breadcrumbs span{ float: left; color: #999999;font-size: 14px;}
.breadcrumbs h1{ color: #E3E3E3; font-size: 14px;height: 28px;}

/**类似首页的头部部分样式**/
.f2 .f2_item {
    float: left;
    font-size: 14px;
    height: 100px;
    width: 25%;
}
.f2 .f2_item i {
    color: #fff;
    font-size: 26px;
    padding: 14px;
}
.f2 .f2_item span {
    display: block;
    font-weight: bold;
    margin-top: 10px;
    text-align: center;
    width: 100%;
}
.f2_item a {
    color: #333;
    text-decoration: none;
}
.f2_c1 {
    background-color: #ef9ba0;
    border-radius: 50%;
}
.f2_c2 {
    background-color: #59c47e;
    border-radius: 50%;
}
.f2_c3 {
    background-color: #edc656;
    border-radius: 50%;
}
.f2_c4 {
    background-color: #6254d8;
    border-radius: 50%;
}
.f1 {
    font-size: 18px;
    /*height: 194px;*/
    overflow: hidden;
    position: relative;
    text-align: center;height: 197px;
}
.f2 {
    background-color: #fff;
    border-radius: 20px;
    height: 120px;
    line-height: 30px;
    padding-top: 30px;
    position: relative;
    top: -19px;
    width: 100%;
    z-index: 990;
}
.f1_img img{ width: 100%}
.f1_txt{ background-color: #fff; margin-bottom: 10px;padding:10px;font-size: 12px;border-top: 1px solid #e8e8e8;   position: relative;
    top: -50px;border-radius: 10pt;height: 60px;}
.f1_txt span{ margin-right: 10px;}
.f1_txt .f1_t_1{     background-image: url("../images/question/bg02.png");
    background-position: 10px 10px;
    background-repeat: no-repeat;
    background-size: 60px auto;line-height: 28pt;
    color: #000;
    font-size: 16px;
    font-weight: bold;}
.f1_txt .f1_t_3{   background-image: url("../images/question/btn.png");
    background-position: 0 12px;
    background-repeat: no-repeat;
    background-size: 100% auto;
    clear: both;
    color: #fff;
    cursor: pointer;
    font-size: 12px;
    padding: 20px;
    position: relative;
    top: 20px;}
.f1_txt .f1_txt_img{ width: 20%;float: left;margin-right: 10px;}
.f1_txt .f1_txt_img img{ width: 60px; height: 60px;}
.f1_txt .f1_txt_info{float: left;    font-size: 12px; text-align: left;line-height: 16pt;}
.f1_xx img{width: 100%}
.f1_info_bg{height: 90px;background: #000000;opacity: 0.5;position: relative;top: -90px;z-index: 1;}
.f1_info{ color: #fff; position: absolute;bottom: 0px;width: 100%;z-index: 99;}
.f1_info_l{float: left;text-align: left;padding: 0px 10px;}
.f1_info_r{width: 70px; float: left;position: relative;}
.f1_info_btn{font-size: 14px}
.f1_info_1{font-size: 24px; line-height: 30px;}
.f1_info_1 .name{font-size: 20px;}
.f1_info_l .age{font-size: 12px;}
.f1_info_2{ height: 28px; overflow: hidden;}
.f1_info_2 span{border: 1px solid #FFFFFF;border-radius: 8px; font-size: 10px;padding: 2px 10px;position: relative;top: 5px;margin-right: 5px}
.f1_info_3{ font-size: 14px; line-height: 26px;}
.f1_info_3 span{ margin-right: 10px}
.f1_info_btn img{width: 60px; height: 26px;position: relative;margin-top: 29px;}
.f1_info_btn span{position: relative;top: -23px;word-break: keep-all;}
.nv{color: #FF8989}
.nan{color:#4386DA}
.wen{color: #F5C344; border: 1px #F5C344 solid; border-radius: 2.5pt; font-size: 12pt;margin-right: 10px;padding: 0 3px;}
.wen2{ background-color: #fff}
.lastmore{text-align: center;line-height: 60px; height: 60px}
.lastmore span{ border: 2px #333 solid; border-radius: 20px; padding: 10px 30px; color: #EF7779; font-size: 14px; font-weight: bold; cursor: pointer;}
.f4 a{ color: #E3E3E3}
.line{ height: 1px; border-bottom: 1px solid #686868; margin: 10px 1%; width: 97%}
.line2{ height: 1px; border-bottom: 1px solid #EEEEEE; margin: 10px 1%; width: 97%}
.right{color: #999999;padding-left: 10px; font-size: 14px;}
.r_logo{ height: 40px; color: #fff;color: 12px;padding-left: 10px;margin-top: 20px;}
.r_logo img{   float: left; height: 40px; margin-right: 10px; width: 40px;border-radius: 12px;}
.r_logo .r_title{ font-size: 14px;}
.topdiv{ background-color: #4F4F53;height: 50px; padding: 10px 1%; color: #FEFCEB; position: fixed; top: 0px; width: 98%;display: none; opacity: 0.75;}
.topdiv img{ width: 50px; height: 50px; margin-right: 1%; float: left }
.topdiv .top_txt{font-size: 16px;font-weight: bold;line-height: 50px;}
.topdiv .top_btn{ background-color: #ef9ba0;border-radius: 20px; float: right; margin-right: 1%; margin-top: 10px; padding: 5px 15px;}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

@media screen and (max-width: 320px) {
    .f1_info_1 .name {
        font-size: 16px;
    }
    .f1_info_btn {
        width: 60px;
    }
    .f1_info_2 span {
        padding: 4px 8px;
        margin-bottom: 4px;
    }
}

@media screen and (max-width: 375px) {
    .f1_info_1 {
        font-size: 20px;
    }
    .detail .msg {
        padding: 8px;
    }
    .m_c .m_c_msg {
        font-size: 14px;
    }
}

.f1_info_btn, .lastmore span, .m_h .m_h_r, .btn_send {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

.f1_info_btn:active, .lastmore span:active, .m_h .m_h_r:active, .btn_send:active {
    opacity: 0.8;
    transform: scale(0.98);
}

html, body {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
    overflow-x: hidden;
    width: 100%;
}

img {
    max-width: 100%;
    height: auto;
}

input, button, textarea, select {
    font-size: 16px; /* 避免iOS自动缩放 */
}
/**悬浮框**/
.jf {
    background-color: #eb90bc;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
    font-size: 14px;
    padding: 10px;
}
.fans {
    background-color: #eab76b;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
    font-size: 14px;
    padding: 10px;
}
.free {
    background-color: #696;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
    font-size: 14px;
    padding: 10px;
}
.dialog_c a{color: #fff;}

/* Mobile banner styles */
.mobile-banner {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 0px 10px;
    background-color: #EF9BA0; /* 修改为粉色背景 */
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    z-index: 9999;
    display: flex;
    align-items: center;
}

.mobile-banner-logo img {
    height: 40px;
    width: auto;
}

.mobile-banner-text {
    flex: 1;
    padding: 0 15px;
    margin: 5px 0;
}

.banner-title {
    font-size: 16px;
    font-weight: bold;
    color: #fff; /* 修改为白色文字 */
    margin-bottom: 4px;
}

.banner-subtitle {
    font-size: 14px;
    color: #fff; /* 修改为白色文字 */
}

.mobile-banner-button {
    background-color: #fff; /* 修改为白色背景 */
    color: #EF9BA0; /* 修改为粉色文字 */
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 15px;
    text-align: center;
    cursor: pointer;
    margin-right: 5%;
    border: 1px solid #fff; /* 修改为白色边框 */
}

/* 添加百度APP特殊样式 */
.site-navigation {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 0px 10px;
    background-color: #EF9BA0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    z-index: 9999;
    align-items: center;
}

.nav-logo img {
    height: 40px;
    width: auto;
}

.nav-title {
    flex: 1;
    padding: 0 15px;
    margin: 5px 0;
}

#baidu-title {
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    margin-bottom: 4px;
}

#baidu-subtitle {
    font-size: 14px;
    color: #fff;
}

.nav-button {
    background-color: #fff;
    color: #EF9BA0;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 15px;
    text-align: center;
    cursor: pointer;
    margin-right: 5%;
    border: 1px solid #fff;
}

@media screen and (min-width: 768px) {
    .mobile-banner, .site-navigation {
        display: none !important;
    }
}