@import url('https://fonts.googleapis.com/css?family=Noto+Sans+SC:100,300,400,500,700,900');
* {margin: 0px;padding: 0px;box-sizing: border-box;}
em, i {font-style: normal;}
li {list-style: none;}
img {border: 0;vertical-align: middle;}
h1, h2, h3, h4, h5, h6 {margin: 0;}
/** 重置列表元素 **/
ul, ol { list-style: none; }
/** 重置文本格式元素 **/
a { text-decoration: none; }
body {margin: 0;padding: 0;font-family: 'Noto Sans SC', serif;}
body,html{height: 100%}
#overallBox{
    width: 100%;
}
#overallBox .overallWrap{
    width: 100%;
}

.navBox{
    background: #fff;
    color: black !important;
    -moz-box-shadow:0px 0px 10px #E6E6E6; -webkit-box-shadow:0px 0px 10px #E6E6E6; box-shadow:0px 0px 10px #E6E6E6;
}
.navBox ul > li{
    margin: 0 5px;
}
.navBox ul > li a{color: #666666;}
.navBox ul > li a:hover{color: #3291f9 !important;}
.navBox .iconfont{
    font-size: 25px;
    color: black;
}
.userLoginRegistration .iconfont{
    font-size: 18px;
    color: #676767;
    font-weight: bolder;
}
.userLoginRegistration a{font-size: 14px;color: #676767;}
.userLoginRegistration a:hover{color: #3291f9 !important;}

main{width: 100%}
main::before{
    content: "";
    display: block;
    height: 60px;
}
main .articleBox{
    max-width: 1245px;
    margin: 0 auto;
}
.articleTitleWrap{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.articleTitleBox h1{
    font-size: 45px;
    font-weight: bolder;
    color: #434343;
}
.breadcrumbNavigation a,.breadcrumbNavigation{
    font-size: 15px;
    color: #666666;
}
.authorReleaseDate{
    display: flex;
    justify-content: space-between;
}
.authorReleaseDate .releaseDate{}
.authorReleaseDate .releaseDate p{
    color: #656565;
    font-size: 15px;
}
.authorReleaseDate .articleFunctions{}
.authorReleaseDate .articleFunctions .articleFunctionsList{
    display: flex;
    align-items: center;
}
.authorReleaseDate .articleFunctions .articleFunctionsList li{
    margin: 0 10px;
    position: relative;
}
.authorReleaseDate .articleFunctions .articleFunctionsList li.divisionLine::after{
    content: "丨";
    display: inline-block;
    color: #dfdede;
    font-size: 14px;
    position: absolute;
    top: 6px;
    right: -17px;
}
.authorReleaseDate .articleFunctions .articleFunctionsList li .iconfont{
    font-size: 23px;
    color: #969696;
}
.aFont-size{font-size: 15px !important;color: #969696;}
.authorReleaseDate .articleFunctions .articleFunctionsList li .iconfont:hover,.aFont-size:hover{color: #3291f9;}

.search {
    --input-line: #cccccc;
    --input-text-color: #d7d7d7;
    --input-text-hover-color: transparent;
    --input-border-color: #808080;
    --input-border-hover-color: #999999;
    --input-bg-color: #6b6b6b;
    --search-max-width: 285px;
    --search-min-width: 150px;
    --border-radius: 5px;
    --transition-cubic-bezier: 150ms cubic-bezier(0.4,0,0.2,1);
}

.search-box {
    max-width: var(--search-max-width);
    min-width: var(--search-min-width);
    height: 35px;
    border: 1px solid var(--input-border-color);
    border-radius: var(--border-radius);
    padding: 5px 15px;
    background: var(--input-bg-color);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
    transition: var(--transition-cubic-bezier);
}

.search-box:hover {
    border-color: var(--input-border-hover-color);
}

/*Section input*/
.search-field {
    position: relative;
    width: 100%;
    height: 100%;
    left: -5px;
    border: 0;
}

.input {
    width: calc(100% - 29px);
    height: 100%;
    border: 0;
    border-color: transparent;
    font-size: 1rem;
    padding-right: 0px;
    color: var(--input-line);
    background: var(--input-bg-color);
    border-right: 2px solid var(--input-border-color);
    outline: none;
}

.input::-webkit-input-placeholder {
    color: var(--input-text-color);
}

.input::-moz-input-placeholder {
    color: var(--input-text-color);
}

.input::-ms-input-placeholder {
    color: var(--input-text-color);
}

.input:focus::-webkit-input-placeholder {
    color: var(--input-text-hover-color);
}

.input:focus::-moz-input-placeholder {
    color: var(--input-text-hover-color);
}

.input:focus::-ms-input-placeholder {
    color: var(--input-text-hover-color);
}

/*Search button*/
.search-box-icon {
    width: 52px;
    height: 35px;
    position: absolute;
    top: -6px;
    right: -21px;
    background: transparent;
    border-bottom-right-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    transition: var(--transition-cubic-bezier);
}

.search-box-icon:hover {
    background: var(--input-border-color);
}

.btn-icon-content {
    width: 52px;
    height: 35px;
    top: -6px;
    right: -21px;
    background: transparent;
    border: none;
    cursor: pointer;
    border-bottom-right-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    transition: var(--transition-cubic-bezier);
    opacity: .4;
}

.btn-icon-content:hover {
    opacity: .8;
}

.search-icon {
    width: 18px;
    height: 21px;
    position: absolute;
    top: 4px;
    right: 15px;
}
/* 文章内容样式 */
.articleContent{overflow: hidden;}
.articleContent h2{
    font-size: 28px;
    background: #f5f5f5;
    color: #019946;
}
.articleContent p{
    font-size: 22.5px;
    color: #383838;
}
.articleContent p > b{color: #000000;}
.articleContent p > strong{color: #46dc7d;font-size: 23px;}
.articleContent p > .update{font-size: 14px;color: #abaaaa
}
.articleContent .articleIllustrations{
    text-align: center;
    padding: 15px 0;
}

.orderForm{}
.orderForm .orderFormWrap{
    width: 100%;
}
.bg_orderForm{
    background: url("../images/bg01.png") no-repeat;
    background-size: 100% 100%;
}
.formBox{
    max-width: 560px;
    margin: 0 auto;
    /* 背景渐变色 - 原理2 */
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    /* 背景尺寸 - 原理3 */
    background-size: 600% 600%;
    /* 循环动画 - 原理4 */
    animation: gradientBG 5s ease infinite;
    border-radius: 25px;
}
/* 动画，控制背景 background-position */
@keyframes gradientBG {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}
.formBox h3{
    color: #FFFFFF;
    font-size: 40px;
}
.price p > b,.price h4{color: #FFFFFF !important;}
.price h4{
    font-size: 35px;
}
.inputStyle,.buttonStyle{
    text-align: center;
    padding: 10px 0;
}
.inputStyle input{
    width: 85%;
    height: 55px;
    padding-left: 15px;
    outline: none;  /* 获得焦点不显示边框颜色 */
    font-size: 20px;
    border-radius: 10px;
    border: none;
}
.buttonStyle button{
    width: 315px;
    font-size: 40px;
    font-weight: bold;
    padding: 8px 0;
    color: #FFFFFF;
    border: none;
    border-radius: 50px;
    background:linear-gradient(to bottom,#6ad851,#51d186);
    -moz-box-shadow:0px 0px 20px #0EB520; -webkit-box-shadow:0px 0px 20px #0EB520; box-shadow:0px 0px 20px #0EB520;
}
.buttonStyle button:hover{background:linear-gradient(to bottom,#6ad851,#6ad851);}
.publishedOn{font-size: 16px;color: #abaaaa;}

/* 评论板块样式 */
.commentSection{}
.commentSection .commentSectionTitle{
    border-bottom: 1px solid #b2b0b0;
    position: relative;
}
.commentSection .commentSectionTitle::after{
    content: "";
    display: inline-block;
    width: 50px;
    border-bottom: 2px solid #3093f8;
    position: absolute;
    left: 0;
    bottom: -1px;
}
.commentSection .commentSectionTitle h3{
    font-size: 20px;
    padding: 0 6px;
    color: #3093f8;
}
.comment{
    width: 100%;
    border: none;
    border-bottom: 1px #b2b0b0 dashed;
    outline: none;  /* 获得焦点不显示边框颜色 */
    height: 68px;
    padding-left: 5px;
}
.col-l span{font-size: 16px;color: #d52222;}
.col-r a{
    background-color: #d52222;
    color: #fff;
    font-size: 16px;
    padding: 5px 8px;
    -moz-box-shadow:0px 0px 10px #4D0F0B; -webkit-box-shadow:0px 0px 10px #4D0F0B; box-shadow:0px 0px 10px #4D0F0B;
}
.userComments{}
.userComments .userCommentsWrap{
    display: flex;
    border-bottom: 1px #b2b0b0 dashed;
    padding: 15px 0;
}
.userComments .userCommentsWrap .userComments-l{margin-right: 5px;}
.userComments .userCommentsWrap .userComments-l img{
    width: 55px !important;
}
.userComments .userCommentsWrap .userComments-r{margin-left: 5px;}
.userComments .userCommentsWrap .userComments-r h5{
    font-size: 20px;
    font-weight: bold;
    position: relative;
}
.replyBox h5::after{
    content: "回复";
    position: absolute;
    letter-spacing: 2px;
    right: 0;
    top: 0;
    font-size: 14px;
    color: #FFFFFF;
    background-color: #b7b7b7;
    padding: 2px 5px;
    font-weight: 100;
}
.userComments .userCommentsWrap .userComments-r p{
    font-size: 19px;
    margin:  8px 0 !important;
}
.userComments .userCommentsWrap .userComments-r .user_img{}
.userComments .userCommentsWrap .userComments-r .likeReply{}
.userComments .userCommentsWrap .userComments-r .likeReply .likeReply-l{}
.userComments .userCommentsWrap .userComments-r .likeReply .likeReply-l span{font-size: 15px;margin: 0 5px}
.userComments .userCommentsWrap .userComments-r .likeReply .likeReply-l span:nth-child(1),.userComments .userCommentsWrap .userComments-r .likeReply .likeReply-l span:nth-child(2){
    color: #8b8b8b;
}
.userComments .userCommentsWrap .userComments-r .likeReply .likeReply-l span.hotReview{
    color: #ffa908;
}
.userComments .userCommentsWrap .userComments-r .likeReply .likeReply-r{}
.userComments .userCommentsWrap .userComments-r .likeReply .likeReply-r span{margin: 0 5px;}
.userComments .userCommentsWrap .userComments-r .likeReply .likeReply-r span > i{
    font-size: 20px;
    margin: 0 5px;
}
.userComments .userCommentsWrap .userComments-r .likeReply .likeReply-r span > a{
    color: #8b8b8b;
}
.userComments .userCommentsWrap .userComments-r .likeReply .likeReply-r span > a:hover{color: #4d90fe;}

/* 文章侧边栏样式 */
.articleSidebar{overflow: hidden;}
.articleSidebar .healthVideo{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #f2f2f2;
    position: relative;
}
.articleSidebar .healthVideo::after{
    content: "";
    display: inline-block;
    width: 80px;
    border-bottom: 2px solid #3093f8;
    position: absolute;
    left: 0;
    bottom: -1px;
}
.articleSidebar .healthVideo h3{
    font-size: 20px;
    color: #3093f8;
}
.articleSidebar .healthVideo span a{
    font-size: 16px;
    color: #707070;
}
.healthVideoListBox::after,.healthVideoListBox::before{
    content: "";
    display: inline-block;
    height: 10px;
    width: 100%;
    overflow: hidden;
}
.healthVideoList{padding: 10px 0 0 0;}
.healthVideoList .healthVideoListWrap{
    justify-content: space-around;
}
.healthVideoList .healthVideoListWrap .video{
    text-align: center;
    width: 115px;
    margin: 0 5px;
    /*padding: 5px 0;*/
}
.healthVideoList .healthVideoListWrap .video img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.healthVideoList .healthVideoListWrap .videoIntroduction{width: 160px;position: relative;}
.healthVideoList .healthVideoListWrap .videoIntroduction p:nth-child(1){
    font-size: 15px;
    color: #53585e;
}
.healthVideoList .healthVideoListWrap .videoIntroduction p:nth-child(2){
    font-size: 12px;
    color: #b7b7b7;
    display: block;
    padding: 5px 0;
}

._39HotTextWeeklyHotspots{}
._39HotTextWeeklyHotspots ._39HotTextWeeklyHotspotsTitle{
    border-bottom: 1px solid #f2f2f2;
    padding: 10px 0;
    position: relative;
}
._39HotTextWeeklyHotspots ._39HotTextWeeklyHotspotsTitle::after{
    content: "";
    display: inline-block;
    width: 3.9725rem;
    border-bottom: 2px solid #3093f8;
    position: absolute;
    left: 0;
    bottom: -1px;
}
._39HotTextWeeklyHotspots ._39HotTextWeeklyHotspotsTitle ul{
    display: flex;
}
._39HotTextWeeklyHotspots ._39HotTextWeeklyHotspotsTitle ul li:nth-child(1){
    margin-right: 20px;
}
._39HotTextWeeklyHotspots ._39HotTextWeeklyHotspotsTitle ul li{
    /*overflow: hidden;*/
    text-overflow: ellipsis;
    white-space: nowrap;
}
._39HotTextWeeklyHotspots ._39HotTextWeeklyHotspotsTitle ul li h3{
    font-size: 20px;
    color: #676566;
    font-weight: 300;
}
._39HotTextWeeklyHotspots ._39HotTextWeeklyHotspotsTitle ul li:nth-child(1) h3{
    color: #3093f8 !important;
    font-weight: 700;
}
#_39HotTextWeeklyHotspotsList{
    height: 350px;
}
._39HotTextWeeklyHotspotsList {
    height: 35px;/* 必要元素 */
    line-height: 35px;
    overflow: hidden;/* 必要元素 */
}
._39HotTextWeeklyHotspotsList li {
    height: 35px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-bottom: 1px solid #f0f0f0;
}
._39HotTextWeeklyHotspotsList li > a{
    font-size: 15px;
    display: inline;
    color: #343233;
}
._39HotTextWeeklyHotspotsList li > a:hover{
    color: #3093f8;
}
._39HotTextWeeklyHotspotsList .a_span::after{
    content: "HOT";
    color: #fff;
    font-size: 10px;
    background-color: #ec5830;
    border-radius: 5px;
    padding: 2px 5px 2px 5px;
    line-height: 10px;
    margin-left: 5px;
    margin-right: 5px;
}

.specialPlanning{}
.specialPlanning::before,.specialPlanning::after {
    content: "";
    display: inline-block;
    height: 10px;
    width: 100%;
    overflow: hidden;
}
.specialPlanning .specialPlanningTitle{
    border-bottom: 1px solid #f2f2f2;
    padding: 10px 0;
    position: relative;
}
.specialPlanning .specialPlanningTitle::after{
    content: "";
    display: inline-block;
    width: 5rem;
    border-bottom: 2px solid #3093f8;
    position: absolute;
    left: 0;
    bottom: -1px;
}
.specialPlanning .specialPlanningTitle h3{
    font-size: 20px;
    color: #3093f8;
}

.specialPlanningList {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(6, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
}
.specialPlanningList > div{
    text-align: center;
    float: left;
    border: 1px solid #ededed;
    margin:0px -1px -1px 0px ;
}
.specialPlanningList > div > img{
    padding: 5px;
    object-fit: cover;
}
.div1 { grid-area: 1 / 1 / 2 / 2; }
.div2 { grid-area: 1 / 2 / 2 / 3; }
.div3 { grid-area: 2 / 1 / 3 / 2; }
.div4 { grid-area: 2 / 2 / 3 / 3; }
.div5 { grid-area: 3 / 1 / 4 / 2; }
.div6 { grid-area: 3 / 2 / 4 / 3; }
.div7 { grid-area: 4 / 1 / 5 / 2; }
.div8 { grid-area: 4 / 2 / 5 / 3; }
.div9 { grid-area: 5 / 1 / 6 / 2; }
.div10 { grid-area: 5 / 2 / 6 / 3; }
.div11 { grid-area: 6 / 1 / 7 / 2; }
.div12 { grid-area: 6 / 2 / 7 / 3; }