/*==globa==l*/

* { margin:0; padding:0;}
*:focus {outline: none;} 
html,body { height:100%;}
body { background:#f8fcff; color:#000; font-size:12px; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; margin:0 auto; padding:0; overflow-x:hidden; word-break:break-all;max-width: 750px;}
img,input { border:0; font-family:SimHei; vertical-align:middle;}
input[type="button"], input[type="submit"], input[type="reset"], input[type="text"] { -webkit-appearance:none;}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none;}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color:#b2b2b2; -webkit-appearance: none;}
input[type="number"]{-moz-appearance:textfield;}
input,textarea { background:#FFF; outline:none; appearance: none; -webkit-appearance: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0)/*for app*/}
	@media screen and (-webkit-min-device-pixel-ratio:0) {
	input, select, textarea { outline:none; appearance: none; -webkit-appearance:none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0)/*for app*/}
	}
ul,li,ol { list-style:none; margin:0; padding:0;}
a,a:link, a:hover, a:visited, a:focus { color:#1a1a1a; text-decoration:none;}
h1,h2,h3,h4,h5,h6,p { margin:0; padding:0;}
audio, canvas, progress, video { width:100%;}
::-webkit-scrollbar { width: 4px; height: 7px;}
::-webkit-scrollbar-thumb { background-color: #9093994d; border-radius: 2px; box-shadow:inset 0 0 6px #0003;}
::-webkit-scrollbar-track element { background-color: #0000000d;}

/*==layout==*/

.left { float:left;}
.right { float:right;}
.clear { clear:both;}

.fix_head { width:100%; height:46px;}
.fix_foot { width:100%; height:73px;}

.blue { color: #130089;}
.blueMax { color: #130089;font-size: 19px; line-height: 20px;}
.grey { color: #646262;font-size: 14px; line-height: 20px;}
.shuiyang1{color:#764fc4}
.shuiyang2{color:#c05ada}

.pad_num { padding: 0 4px;}

.mar_top { margin-top: 20px;}
.mar_top3 { margin-top: 22px;}
.mar_top2 { margin-top: 10px;}
.mar_ntop { margin-top: -15px;}

.text_center { text-align: center;}

/*==header==*/

header { width: 100%; height: 46px; background: #edf4fa; display: flex; align-items: center; text-align: center; position: fixed; top: 0; z-index: 1001;max-width: 750px;}

.headtitle { width: 76%; color: #2e2e2e; font-size: 18px;}
.headicon { width: 12%;}
.headicon img { height: 18px;}

/*==main==*/

.main { padding: 20px;}

.pageTitle { font-size: 28px; font-weight: 800;}

.mainTitle { font-size: 22px; font-weight: 600; padding: 35px 0 25px; text-align: center;}
.mainTitle img { height: 12px; margin: 0 8px;}
.mainText { font-size: 17px; line-height: 30px;}
.mainTextPro { font-size: 17px; line-height: 30px; color: #2f2d93}
.mainPicture { padding: 12px 0;}
.mainPicture img { width: 100%;}

.subTitle { font-size: 15px; font-weight: 600; padding: 35px 0 0; text-align: center;}
.subText { background: #f4f7fa; color: #666; font-size: 13px; line-height: 22px; margin-top: 15px; padding: 15px;}

.note { color: #646262; font-size: 12px; line-height: 20px;}
.note2 { color: #808080; font-size: 14px; line-height: 20px;}
.xh333 { color: #2f2d93; font-size: 14px; line-height: 20px;}

.panellist { padding: 5px 0 5px 0; font-size: 16px; line-height: 26px;}
.panellist li { display: flex; margin-top: 5px;}
.panellist li img { height: 8px; margin-top: 9px; margin-right: 6px; vertical-align: middle;;}

.publisher { margin: 25px 0; display: flex; align-items: center;}
.publisherlogo { width: 36px; height: 36px; border-radius: 50%; border: 1px #efefef solid; margin-right: 10px; padding: 1px;}
.publisherlogo img { width: 36px; height: 36px; border-radius: 50%;}
.publishername { color: #343434; font-size: 14px;}
.publishtime { color: #9e9e9e; font-size: 10px; padding: 4px 0 0 1px;}
.publishtime span { margin-right: 10px;}
.publishtime img { height: 10px; margin-right: 3px; margin-top: -1px; vertical-align: middle;}

.expert { width: 100%; min-height: 97px; background: #eff4f7 url(../images/topbanner.png); background-size: 120%; border-radius: 8px; margin: 25px 0;}
.expertTitle { color: #9e9e9e; font-size: 14px; padding: 12px 13px 10px;}
.expertmember { padding-bottom: 12px; display: flex; align-items: center;}
.expertmember section { padding: 0 10px; display: flex; align-items: center;}
.expertlogo { width: 40px; height: 40px; border-radius: 50%; border: 1px #cecbcb solid; margin-right: 8px; padding: 1px; position: relative;}
.expertlogo .vicon { position: absolute; right: 0; bottom: 0; z-index: 9;}
.expertlogo .vicon img { width: 12px; height: 12px;}
.expertlogo img { width: 40px; height: 40px; border-radius: 50%;}
.expertname { color: #000; font-size: 15px;}
.expertname .rank { color: #9e9e9e; font-size: 11px; padding-top: 3px;}

.commentArea { margin-top: 70px;}
.commenthead {}
.commenthead .title { float: left; font-size: 17px; font-weight: 600;}
.commenthead .member { float: right; padding-top: 3px;}
.commenthead .member span { margin-left: -6px;}
.commenthead .member img { width: 17px; height: 17px;}
.commenthead span.likenumber { margin-left: 6px;}

.commentpanel { font-size: 14px; padding: 16px 0; display: flex;}
.commentpanel .userlogo { width: 26px; height: 26px; border-radius: 50%; margin-right: 10px;}
.commentpanel .userlogo img { width: 26px; height: 26px; border-radius: 50%;}
.userpanel { width: 100%; padding-top: 3px;}
.userpanel .username { font-weight: 600;}
.userpanel .hot { background: #fef0eb; border: 1px #ff8115 solid; border-radius: 13px; color: #ff9841; font-size: 9px; margin-left: 5px; padding: 0 5px;}
.userpanel .level { border-radius: 2px; font-size: 10px; font-weight: 600; line-height: 16px; margin-left: 5px; padding: 0 5px;}
.userpanel .high { background: #ffedcf; color: #e58129;}
.userpanel .low { background: #f1f1f1; color: #747474;}
.usercomment { color: #2b2b2a; padding-top: 8px;}
.commentpicture { padding: 6px 0;}
.commentpicture img { width: 100%; border-radius: 8px;}

.commentfoot { color: #9a9a9a; font-size: 12px; padding-top: 10px;}
.commentdate { float: left;}
.commentbtn { float: right;}
.mincommentIcon { margin-left: 24px;}
.mincommentIcon img { height: 14px; margin-top: -3px; vertical-align: middle;}
.mincommentIcon .pad_num { padding: 0; width: 24px; display: inline-block; text-align: right;}

.minmorecomment { color: #868585; padding: 3px 0; text-align: center;}
.morecomment { width: 100px; background: #deefff; border-radius: 30px; color: #0076ff; margin: 10px auto; padding: 9px 0; text-align: center;}
.minmorecomment2 { color: #868585; padding: 3px 0; text-align: center;font-size: 12px;}
/*==footer==*/

footer { width: calc(100% - 30px); min-height: 35px; background: #fff; border-top: 1px #eaeae9 solid; padding: 8px 15px; position: fixed; bottom: 0; z-index: 1001;max-width: 750px;}

.prompt { float: left; width: 140px; height: 35px; border-radius: 35px; background: #deefff; color: #0071ff; display: flex; align-items: center; text-align: center;}
.prompt .arrowdown { width: 30px;}
.prompt .arrowdown img { height: 8px;}
.prompt .text { width: 70px; color: #0077ff;}
.prompt .minline { width: 10px;}
.prompt .minline img { height: 8px;}

.commentIcon { float: right; display: flex; align-items: center;}
.commentIcon .element { width: 36px; text-align: center;}
.commentIcon .element img { height: 18px;}
.commentIcon .element .data { font-size: 11px; padding-top: 4px;}

.picTitle {
	padding: 35px 0 10px;
}
.picTitle img {
	width: 100%;
}