@charset "utf-8";
/*
 * CSS Document
 * 开发： 科基
 * 日期： 2020.08.06
 * 功能： 软件教程 css 文件
 * 
*/

/*
 * head 
*/
.head{ padding: 2rem 0 0 0;}

.fenge{ height:0; border-top: 0.2rem solid #f1f1f3;}
figure{ display:none;}

/* 分类导航 */
.top_nav_list{ opacity: 0;}
.top_nav_list, .swiper-container { width: 100%; margin: 0 auto; }
.swiper-slide {
	text-align: center;
	background: #fff0;
	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}


.classnav{ position:fixed; top: 1.2rem; max-width: 750px; width: 100%; overflow: hidden; z-index: 10; background-color:#fff;  }
.classnav a{ display:block; width: 100%;}
.classnav .cur{ background-image:url(../images/top_arr.png); background-size: 9%; background-repeat: no-repeat; background-position: center 90%; color:#ff6600;}
.classnav .swiper-slide { font-size: 0.40rem; line-height: 0.8rem;}

/* 二级分类 */
.classtype{ position:fixed; top: 2.02rem; max-width: 750px; width: 100%; z-index: 5; background-color:rgba(255,255,255,0.98); border-top: 1px solid #ff6600; display: none; box-shadow: 0 0.05rem 0.05rem #f2f2f2; height: 1rem; overflow: hidden;}
.classtype ul{ position:relative;}
.classtype li{ float:left; width:33.3%;  text-align: center;}
.classtype a{ display:block; line-height: 0.8rem;}
.classtype .cur{ color:#ff6600; }

/*展开按钮*/
.unfold{ display: block; width:100%; text-align: center;  padding:0 0 0.2rem 0; position: absolute; bottom: 0; line-height: 0.6rem !important ; background: linear-gradient(to top,#fff,rgba(255,255,255,0.8)); color:#ff6600; font-size:0.34rem; clear: both;}
.unfold i{ display:block; margin: 0 auto; width:0.5rem; height: 0.2rem; background-image: url(../images/arr_down.png); background-size: auto 200%; background-repeat: no-repeat; background-position: center top;}


/* 搜索结果 */
.searchtypebt{ background-color:#fff; font-size:0.36rem; padding:0; text-align: center;}
.searchtypebt ul li{ display:inline-block; padding:0.15rem 0;}
.searchtypebt ul li a{ display: block; width:1.12rem; padding:0.04rem; cursor: none;}
.searchtypebt ul li .cur{ background:#E5822D; border-radius: 0.6rem; color: #fff;}

.search_title{ background-color:#fff; padding:0.5rem 0 0.5rem 0; text-align: center;}
.search_title .contentTitle{ background-color:#dcdcdc; height: 1px; position: relative; top: 0.40rem; width: 100%;}
.search_title h2{ display:inline-block; background-color:#fff; padding: 0 0.2rem; position: relative; z-index: 2;  font-size: 0.45rem; margin: 0 0.3rem;  line-height: 0.6rem;}
.search_title p{ padding: 0.2rem 0 0 0; font-size: 0.31rem; color:#777; }


/* 内容列表 */
.contlist {}

.contlist li { margin:0.15rem; padding: 0.15rem; background-color:#fff; border-radius: 0.2rem; position: relative;}
.contlist li a { display: block; padding: 0 0.15rem; font-size: 0.415rem; overflow: hidden; }
.contlist .style dd { float: left; width: 64%; }
.contlist .style dt { float: right; width: 33%; max-height: 2.25rem; border-radius: 0.12rem; overflow: hidden; }
.contlist .style dt img { width: 100%; border-radius: 0.12rem; vertical-align: bottom; position: relative; z-index: 1; box-shadow: 0 0 1px rgba(0,0,0,0.1);}
.contlist .style dd h4 { font-weight: bold; height: 1.31rem; line-height: 0.6rem;  font-size: 0.42rem; overflow: hidden;}
.contlist .style dd span { display: block; 	color: #999; font-size: 0.3051rem;}

.contlist .styleimg dd{ width:100%;}
.contlist .styleimg dt{ width:32%; margin: 0 0.1rem 0 0;}
.contlist .styleimg dd h4{  height: auto; min-height:inherit; padding: 0 0 0.3rem 0;}
.contlist .styleimg dd span{padding:0.2rem 0 0.1rem 0;}

.contlist .stylevideo dd{ width:100%;}
.contlist .stylevideo dt{ width: 9.1rem; max-height: 5.118rem; border-radius: 0.1rem; overflow: hidden;}
.contlist .stylevideo dt video{ vertical-align:bottom;}
.contlist .stylevideo dd h4{ height: auto; min-height:inherit; padding: 0 0 0.3rem 0;}
.contlist .stylevideo dd span{padding:0.2rem 0 0.1rem 0;}

.contlist .stylevideo .videopaly{ position:relative;}
.contlist .stylevideo .palyico{ display:block; position: absolute; z-index: 5; background-image:url(../images/playico.png); background-position:  center center; width:100%; height: 100%; left: 0; top: 0; background-size: 15%; background-repeat: no-repeat; background-color:rgba(0,0,0,0.1);}

.contlist .scrollLoadingBt{ display:block;  text-align: center;  width:50%; line-height: 1.0rem; background-color:#fff; border-radius: 0.5rem; margin: 0.5rem auto 0 auto;}

.contlist .hint{ background-color:#fff; display: none; text-align: center;}

/*置顶*/
.stick{ display: block; position: absolute; width:0.8rem; height: 0.8rem; top: 0; right: 0; background-image: url(../images/stick.png); background-size: 100% auto; z-index: 1;}

/* 分页 */
.page{ text-align: center; font-size:0.37333rem; padding:0.2rem 0 0 0;}
.page li{ display:inline-block; margin: 0 0.1rem 0.1rem 0; border-radius: 0.15rem; overflow: hidden;}
.page a{ display:inline-block; padding: 0.1rem 0.3rem; background-color:#fff; line-height: 0.8rem;}
.page li b{  color:#fff; display:inline-block; padding:0.1rem 0.3rem;}
.page a b{ color:#333; padding:0;}


/********* info *************/


/* video */
.info_video{ width:9.6rem; height: auto; position:relative; z-index: 1;  background-color:#fff; padding:0.2rem 0.2rem 0 0.2rem;}
.info_video .closef{ display: block; position: absolute; bottom:-0.650rem; right: 0; background-color:#000; color:#fff; font-size:0.3201rem; padding: 0.1rem 0.2rem;  border-radius: 0 0 3px 3px;}
.info_video video{ float:left;}
.info_video img{ display: block; margin:0 auto;}
.info_video #palayiframe{ position:relative; z-index: 0;}

.info_title{ /*border-top: 0.01rem solid #f1f1f3;*/ padding:0.2rem 0 0 0; background-color: #fff;}
.info_title h1{ font-size:0.48rem; padding: 0.3rem 0.3rem 0.2rem 0.3rem; line-height: 0.65rem;}
.info_title p{ font-size:0.31rem; padding: 0.2rem 0.3rem; line-height: 0.3rem; color:#999;}

.info_author{ padding:0 0.2rem;  background-color: #fff; font-size: 0.31rem; height: 0.7rem; }
.info_author dt{ width:0.48rem; height: 0.48rem; overflow: hidden; border-radius:0.24rem; margin: 0 0.1rem 0 0; background-color:#f2f2f2; position: relative; top: -0.025rem;}
.info_author dt img{ width:100%; height: 100%;}
.info_author dd{ padding:0 0.3rem 0 0; color:#999;}
.info_author dd span{ color:#666;}
.info_author dd p{ width:6rem; color:#a2a2a2;}
.info_author dd a{ display: block; width:2rem; line-height: 0.8rem; background-color:#ff6600; color:#fff; text-align: center; border-radius: 0.4rem;}

.info_i{ padding:0.1rem 0; }
.info_i li{ font-size: 0.44rem; /*float:left;*/ margin: 0 0.3rem 0 0; color:#787878; line-height: 0.7rem;}

/* 内容 */
.infocont{ padding-bottom: 0.2rem; height: auto;  background-color:#fff; overflow: hidden; position: relative;}

.infocont_tab{ font-size:0.42667rem; border-bottom: 1px solid #f2f2f2; }
.infocont_tab li{ display:inline-block; padding: 0 0.2rem;}
.infocont_tab a{ display:inline-block; line-height: 1rem; padding: 0 0.2rem;}
.infocont_tab a:hover,.infocont_tab .cur{ border-bottom:2px solid #ff6600; font-weight: bold;}

.info_cont{ padding:0.2rem 0.3rem; font-size:0.42667rem; text-align: justify;}
.info_cont span{ display:block;}
.pj{ display:none;}

/*简介*/
.info_cont_imgarr{}
.info_cont_imgarr p{ line-height: 0.8rem; padding: 0.2rem 0;}

/*工具*/
.info_cont_tool{}

.info_cont_title{ line-height: 0.8rem; padding: 0.2rem 0;  }
.info_cont_title h3,.info_cont_title i{ display:inline-block; }
.info_cont_title h3{  font-size: 0.42667rem; color:#333;}
.info_cont_title i{ height: 0.5rem; width:0.5rem; background-image:url(../images/info_audio_ico.png); cursor:pointer; position: relative; top: 0.05rem; background-size:100% 100%; left: 0rem;}
.info_cont_txt{ padding: 0 0 0.3rem 0; line-height:0.8rem;  }

/*方法*/
.method{ padding: 0.2rem 0;}
.method h4{ padding: 0 0 0.1rem 0; color: #c9c9c9;}

/*操作*/
.info_cont_step{}
.info_cont_step h4{ margin-top: 0.4rem; text-align: center;}
.info_cont_step .info_cont_title{ margin:0;}
.info_cont_steptxt{ line-height: 0.8rem; padding: 0 0 0.3rem 0;}
.info_steptxt_list{ /*border-left: 1px solid #e2e2e2;*/ position:relative; padding: 0 0 0.5rem 0;}
.info_steptxt_list .num{ float:left; width:0.6rem; height: 0.6rem; margin: 0rem 0.15rem 0 0;}

.info_steptxt_list .txt{ float:left; width: 8.3737rem; padding: 0; line-height:0.8rem;}
.info_steptxt_list .txt img{ width: 100%; box-shadow: 0 0 0.05rem #dcdcdc;}
.info_steptxt_list .txt center{ color:#dcdcdc; text-align: center; text-indent: 0;}

code{ background-color:#111; padding:0.2rem; color:#fff; display: block; position: relative; top: 0.2rem; word-break: break-word; text-indent: 0;}

.info_steptxt_end{ color: #c9c9c9; padding: 0.1rem 0;}

/* 评价 */
.info_message{ font-size:0.32rem; border-bottom: 1px solid #f3f3f3; padding: 0.3rem 0 0.7rem 0;}
.info_message_txt{ width:98.5%; height: 1.33333rem; line-height:0.48000rem; border:1px solid #e9e9e9; background-color:#f4f4f4; border-radius: 5px; outline:none;}
.info_diff{ float:left; padding: 0.24rem 0 0 0;}
.info_diff i{ display:inline-block; width: 0.32rem; height: 0.32rem; background-image:url(../images/info_mes_ico.png); background-repeat: no-repeat; background-position: 0 -26px; cursor:pointer; position: relative; top:0.04rem;}
.info_diff .df_cur{background-position: 0 0;}

.info_message_bt{ float:right; padding: 0.14rem 0 0 0; font-size: 0.26667rem;}
.info_message_bt .ask,.info_message_bt .submit{ display:inline-block; width: 1.87rem; height: 0.7rem; border-radius: 5px; border:none; line-height: 0.7rem; text-align: center; cursor:pointer;}
.info_message_bt .ask{ background-color:#0097fe; color:#fff;  margin:0 0.1rem 0 0;}
.info_message_bt .submit{ background-color:#fbee04; color:#333333; }


/* 全部留言 */
.info_allmessage{}
.info_allmessage h3{ font-size: 0.37333rem; font-weight: normal; line-height:1.48000rem;}

.info_allmes_txt{ font-size:0.32rem;}

.info_allmes_list{ border-bottom: 1px solid #f3f3f3; padding: 0 0 0 0;}
.info_allmes_list_img,.info_allmes_list_img img{ width: 0.6rem; height: 0.6rem; border-radius: 0.3rem;}
.info_allmes_list_right{ width:8.7rem;}

.info_member_i b{font-size: 0.32rem; color:#333333; }
.info_member_i i{ display:inline-block; width: 0.32rem; height: 0.32rem; background-image:url(../images/info_mes_ico.png); background-repeat: no-repeat; background-position: 0 -26px; cursor:pointer; position: relative; top:0.04rem;}
.info_member_i .df_cur{background-position: 0 0;}
.info_member_i .time{ float:right; color:#b5b9bc;}
.info_member_txt{ line-height:0.48000rem; color:#666666; padding: 0.1rem 0 0 0;}

/* 点赞 */
.info_member_reply{ padding: 0.1rem 0; text-align: right;}
.info_member_reply i{ display:inline-block; cursor: pointer; margin:0 0.1rem; width: 0.45rem; height: 0.45rem; background-image: url(../images/info_reply_fabulous.png); background-repeat: no-repeat; background-size:auto 100%; position:relative;}
.info_member_reply .replyico{    background-position:left center;  top: 3px;}
.info_member_reply .fabulousico{ background-position:right center; top: 4px;}

/* 子 回复 */
.info_member_textarea{ padding:0.1rem 0;}
.info_member_textarea .textarea{ width:98%; height: 1.24rem; border:1px solid #e9e9e9; border-radius: 5px; outline: none; background-color:#f4f4f4;}
.info_member_textarea .submit{ width: 1.87rem; height: 0.7rem; background-color:#d5d5d5; border:none; cursor:pointer; float:right; border-radius: 5px; color:#999999;}

.info_member_otherreply{ background-color:#f7f7f7;}
.info_member_otherarr{ padding: 0.1rem; line-height: 24px;}
.info_member_otherarr li{ float:left; color:#666666;}
.info_member_otherarr p{ clear:both; color:#999999;}


.info_member_otherarr:hover{ background-color:#f0f0f0;}
.info_member_otherarr:hover .fabulousico,.info_member_otherarr:hover .replyico{ background-image: url(../images/info_reply_fabulous.png);}

.info_member_morereply{ height: 44px;  margin: 0 12px; line-height: 44px; border-top: 1px solid #dedede;}
.info_member_morereply a{ color:#ffc000;}

.info_allmes_more{ height: 90px; line-height: 90px; text-align: center;}
.info_allmes_more a{ color:#ffc000;}

.remark{ font-size:0.36rem; color:#666; text-align: center;}

/* 热门 */
.relevant{  border-top: 1px solid #f3f3f3; }
.relevant_title{ padding:0.3rem 0.2rem;}
.relevant_title h3{ border-left:0.1rem solid #ff6600; font-size:0.42667rem; line-height: 0.42667rem; text-indent: 0.2rem; }

.relevant li { margin:0.15rem; padding: 0.15rem; background-color:#fff; border-radius: 0.2rem;}
.relevant li a { display: block; padding: 0 0.15rem; font-size: 0.375rem; overflow: hidden; }
.relevant .style dd { float: left; width: 64%; }
.relevant .style dt { float: right; width: 33%; max-height: 2.25rem; border-radius: 0.12rem; overflow: hidden;}
.relevant .style dt img { width: 100%; border-radius: 0.12rem; vertical-align: bottom; position: relative; z-index: 1;}
.relevant .style dd h4 { font-weight: bold; min-height: 1.3rem; line-height: 0.5rem; font-size: 0.42rem }
.relevant .style dd span { display: block; 	color: #999; font-size: 0.3051rem;}

.relevant .styleimg dd{ width:100%;}
.relevant .styleimg dt{ width:32%; margin: 0 0.1rem 0 0;}
.relevant .styleimg dd h4{ height: auto; min-height:inherit; padding: 0 0 0.3rem 0;}
.relevant .styleimg dd span{padding:0.2rem 0 0.1rem 0;}

.relevant .stylevideo dd{ width:100%;}
.relevant .stylevideo dt{ width: 100%; border-radius: 0.1rem; overflow: hidden;}
.relevant .stylevideo dt video{ vertical-align:bottom;}
.relevant .stylevideo dd h4{ height: auto; min-height:inherit; padding: 0 0 0.3rem 0;}
.relevant .stylevideo dd span{padding:0.1rem 0;}

.relevant .stylevideo .videopaly{ position:relative;}
.relevant .stylevideo .palyico{ display:block; position: absolute; z-index: 10; background-image:url(../images/playico.png); width:1rem; height: 1rem; background-size: 100%; left: 46%; top: 40%;}

.relevant .scrollLoadingBt{ display:block;  text-align: center;  width:40%; line-height: 1.0rem; background-color:#fff; border-radius: 0.2rem; margin: 0.5rem auto 0 auto;}

/*显示更多*/
.btnone{ text-align:center; padding: 2rem 0 1rem 0; position: absolute; bottom: -0.01rem; left: 0; width: 100%;  background-image: -webkit-gradient(linear,left top, left bottom,from(rgba(255,255,255,0)),color-stop(50%, #fff)); background-image: linear-gradient(180deg,rgba(255,255,255,0) 0%,#fff 50%);}
.btnone a{ display:block;  border-radius: 3px; padding: 0.2rem 0; background-color:#f1f1f3; font-size:0.37333rem; margin: 0 0.2rem;}