.pc .swiper {
    width           : 100%;
    background-color: white;
    position        : relative
}

.pc .swiper img {
    width: 100%
}

.pc .swiper-box {
    position       : absolute;
    left           : 0;
    top            : 0;
    width          : 100%;
    height         : 100%;
    display        : flex;
    flex-direction : column;
    padding        : 0 calc(270 / 1920 * 100vw);
    justify-content: center
}

.pc .swiper-box-nav {
    display       : flex;
    align-items   : center;
    padding-top   : calc(80 / 1920 * 100vw);
    padding-bottom: calc(30 / 1920 * 100vw)
}

.pc .swiper-box-nav div {
    font-weight  : 300;
    font-size    : calc(20 / 1920 * 100vw);
    padding-right: calc(10 / 1920 * 100vw);
    color        : white;
    cursor       : pointer
}

.pc .swiper-box-nav img {
    padding-right: calc(10 / 1920 * 100vw);
    width        : calc(30 / 1920 * 100vw);
    height       : auto
}

.pc .swiper-box-title {
    font-weight: 500;
    font-size  : calc(48 / 1920 * 100vw);
    line-height: calc(67 / 1920 * 100vw);
    color      : white
}

.pc .swiper-box-content {
    padding-top: calc(20 / 1920 * 100vw);
    font-weight: 300;
    font-size  : calc(20 / 1920 * 100vw);
    line-height: calc(30 / 1920 * 100vw);
    color      : white
}

.pc .title {
    position   : relative;
    display    : flex;
    align-items: center;
    height     : calc(72 / 1920 * 100vw);
    font-weight: 600;
    font-size  : calc(48 / 1920 * 100vw);
    color      : black
}

.pc .title-color {
    /*z-index         : -1;*/
    position        : absolute;
    left            : 0;
    background-color: rgba(35, 150, 66, 0.7);
    bottom          : calc(15 / 1920 * 100vw);
    height          : calc(14 / 1920 * 100vw);
    width           : calc(80 / 1920 * 100vw)
}

.pc .top {
    padding        : calc(80 / 1920 * 100vw) calc(270 / 1920 * 100vw);
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    padding-bottom : calc(60 / 1920 * 100vw)
}

.pc .top-enter {
    display    : flex;
    align-items: center;
    font-weight: 300;
    cursor     : pointer;
    font-size  : calc(18 / 1920 * 100vw);
    color      : rgba(71, 71, 88, 0.6)
}

.pc .top-enter img {
    margin-left: calc(10 / 1920 * 100vw);
    width      : calc(25 / 1920 * 100vw);
    height     : calc(25 / 1920 * 100vw)
}

.pc .card {
    width          : 100%;
    padding        : 0 calc(270 / 1920 * 100vw);
    display        : flex;
    align-items    : center;
    justify-content: space-around;
    padding-bottom : calc(50 / 1920 * 100vw);
    flex-wrap      : wrap
}

.pc .card-item {
    width         : calc((100% - 60px) / 3);
    height        : 100%;
    display       : flex;
    flex-direction: column;
    padding-bottom: calc(40 / 1920 * 100vw)
}

.pc .card-item img {
    width : 100%;
    border: calc(20 / 1920 * 100vw);
    height: 220px;
    object-fit: cover;
}

.pc .card-item-title {
    font-weight: 600;
    font-size  : calc(30 / 1920 * 100vw);
    color      : #232536;
    padding-top: calc(10 / 1920 * 100vw)
}

.pc .card-item-content {
    font-weight: 300;
    padding-top: calc(10 / 1920 * 100vw);
    font-size  : calc(15 / 1920 * 100vw);
    color      : #232536
}

.pc .news {
    position   : absolute;
    left       : 0;
    top        : 0;
    height     : 100%;
    width      : 100%;
    padding    : 0 calc(270 / 1920 * 100vw);
    display    : flex;
    align-items: center
}

.pc .news img {
    height: 100%;
    width : auto
}

.pc .news-info {
    padding-left   : calc(50 / 1920 * 100vw);
    display        : flex;
    justify-content: space-around;
    flex-direction : column;
    padding-top    : calc(50 / 1920 * 100vw);
    padding-bottom : calc(80 / 1920 * 100vw);
    height         : 100%;
    width: 50%;
}

.pc .news-info-title {
    font-weight       : 600;
    font-size         : calc(20 / 1920 * 100vw);
    color             : #faaf56;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.pc .news-info-message {
    font-weight       : 600;
    font-size         : calc(32 / 1920 * 100vw);
    color             : #232536;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.pc .news-info-desc {
    font-weight       : 300;
    font-size         : calc(20 / 1920 * 100vw);
    color             : #474758;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.pc .news-info-date {
    font-weight: 400;
    font-size  : calc(20 / 1920 * 100vw);
    color      : #474758
}

.pc .search {
    width          : 100%;
    padding        : calc(50 / 1920 * 100vw) calc(270 / 1920 * 100vw);
    display        : flex;
    align-items    : center;
    justify-content: space-around
}

.pc .search-item {
    width         : calc((100% - 30px) / 2);
    height        : 100%;
    display       : flex;
    flex-direction: column;
    padding-bottom: calc(40 / 1920 * 100vw)
}

.pc .search-item img {
    width        : 100%;
    border       : calc(20 / 1920 * 100vw);
    margin-top   : calc(40 / 1920 * 100vw);
    margin-bottom: calc(30 / 1920 * 100vw)
}

.pc .search-item-title {
    font-weight   : 500;
    font-size     : calc(28 / 1920 * 100vw);
    color         : #232536;
    padding-bottom: calc(30 / 1920 * 100vw)
}

.pc .search-item-button:hover {
    color       : #239642;
    border-color: #239642
}

.pc .search-item-button:hover .button-normal {
    display: none
}

.pc .search-item-button:hover .button-hover {
    display: block
}

.pc .search-item-button {
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight    : 300;
    font-size      : calc(18 / 1920 * 100vw);
    color          : rgba(71, 71, 88, 0.6);
    width          : calc(168 / 1920 * 100vw);
    height         : calc(46 / 1920 * 100vw);
    border-width   : 1px;
    border-color   : #474758;
    border-style   : solid;
    cursor         : pointer;
    border-radius  : calc(10 / 1920 * 100vw)
}

.pc .search-item-button .button-normal {
    display: block
}

.pc .search-item-button .button-hover {
    display: none
}

.pc .search-item-button img {
    width      : calc(25 / 1920 * 100vw);
    height     : calc(25 / 1920 * 100vw);
    margin     : 0;
    margin-left: calc(10 / 1920 * 100vw)
}

.pc .banner {
    width          : 100%;
    height         : calc(492 / 1920 * 100vw);
    position       : relative;
    display        : flex;
    align-items    : center;
    justify-content: center
}

.pc .banner img {
    width     : 100%;
    max-height: 100%
}

.pc .banner-content {
    position       : absolute;
    height         : 100%;
    width          : 100%;
    left           : 0;
    top            : 0;
    padding        : 0 calc(270 / 1920 * 100vw);
    display        : flex;
    align-items    : center;
    justify-content: center
}

.pc .banner-content-left {
    width: 50%;
    flex : 1
}

.pc .banner-content-right {
    display        : flex;
    justify-content: space-around;
    flex-direction : column;
    padding-left   : calc(40 / 1920 * 100vw)
}

.pc .banner-content-right-title {
    font-weight: 600;
    font-size  : calc(48 / 1920 * 100vw);
    color      : white
}

.pc .banner-content-right-message {
    padding-top: calc(10 / 1920 * 100vw);
    font-weight: 300;
    font-size  : calc(20 / 1920 * 100vw);
    color      : white
}

.pc .banner-content-right-button:hover {
    color       : #239642;
    border-color: #239642
}

.pc .banner-content-right-button:hover .button-normal {
    display: none
}

.pc .banner-content-right-button:hover .button-hover {
    display: block
}

.pc .banner-content-right-button {
    margin-top     : calc(20 / 1920 * 100vw);
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight    : 300;
    font-size      : calc(18 / 1920 * 100vw);
    color          : white;
    width          : calc(142 / 1920 * 100vw);
    height         : calc(46 / 1920 * 100vw);
    border-width   : 1px;
    border-color   : #6d767c;
    border-style   : solid;
    cursor         : pointer;
    border-radius  : calc(10 / 1920 * 100vw)
}

.pc .banner-content-right-button .button-normal {
    display: block
}

.pc .banner-content-right-button .button-hover {
    display: none
}

.pc .banner-content-right-button img {
    width      : calc(25 / 1920 * 100vw);
    height     : calc(25 / 1920 * 100vw);
    margin     : 0;
    margin-left: calc(10 / 1920 * 100vw)
}

.pc .hot {
    width          : 100%;
    padding        : 0 calc(270 / 1920 * 100vw);
    display        : flex;
    align-items    : center;
    justify-content: space-around;
    padding-bottom : calc(50 / 1920 * 100vw)
}

.pc .hot-item {
    width        : calc((100% - 40px) / 2);
    height       : 100%;
    display      : flex;
    border-radius: calc(10 / 1920 * 100vw);
    overflow     : hidden
}

.pc .hot-item-left {
    width : 46%;
    height: 100%
}

.pc .hot-item-right {
    display        : flex;
    padding-left   : calc(30 / 1920 * 100vw);
    flex-direction : column;
    align-items    : start;
    justify-content: center;
    background     : #f2f2f9;
    width: 100%;
}

.pc .hot-item-right-title {
    font-weight       : 500;
    font-size         : calc(28 / 1920 * 100vw);
    line-height       : calc(38 / 1920 * 100vw);
    color             : #232536;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.pc .hot-item-right-button {
    margin-top     : calc(30 / 1920 * 100vw);
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight    : 400;
    font-size      : calc(20 / 1920 * 100vw);
    color          : #239642;
    cursor         : pointer
}

.pc .hot-item-right-button img {
    width      : calc(25 / 1920 * 100vw);
    height     : calc(25 / 1920 * 100vw);
    margin     : 0;
    margin-left: calc(10 / 1920 * 100vw)
}

.pc .story {
    width          : 100%;
    padding        : 0 calc(270 / 1920 * 100vw);
    display        : flex;
    align-items    : center;
    justify-content: space-around
}

.pc .story-item:hover {
    background: white;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2)
}

.pc .story-item:hover .story-item-tag {
    border-color    : rgba(35, 150, 66, 0.7);
    color           : rgba(35, 150, 66, 0.7);
    background-color: rgba(35, 150, 66, 0.1)
}

.pc .story-item {
    background     : #f2f2f9;
    flex-direction : column;
    justify-content: space-around;
    width          : calc((100% - 60px) / 3);
    display        : flex;
    border-radius  : calc(10 / 1920 * 100vw);
    overflow       : hidden;
    padding        : calc(30 / 1920 * 100vw);
    height         : calc(384 / 1920 * 100vw)
}

.pc .story-item-tag {
    height         : calc(45 / 1920 * 100vw);
    border-radius  : calc(22.5 / 1920 * 100vw);
    width          : auto;
    padding        : 0 calc(10 / 1920 * 100vw);
    border-width   : 1px;
    border-style   : solid;
    display        : flex;
    align-items    : center;
    justify-content: center;
    border-color   : rgba(71, 71, 88, 0.27);
    font-weight    : 300;
    font-size      : calc(16 / 1920 * 100vw);
    color          : rgba(0, 0, 0, 0.35)
}

.pc .story-item-title {
    font-weight       : 600;
    font-size         : calc(24 / 1920 * 100vw);
    color             : black;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.pc .story-item-message {
    font-weight       : 300;
    font-size         : calc(15 / 1920 * 100vw);
    color             : #474758;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.pc .story-item-bottom {
    display    : flex;
    align-items: center
}

.pc .story-item-bottom-line {
    height      : calc(20 / 1920 * 100vw);
    width       : calc(2 / 1920 * 100vw);
    background  : #faaf56;
    margin-right: calc(20 / 1920 * 100vw)
}

.pc .story-item-bottom-date {
    font-weight: 300;
    font-size  : calc(16 / 1920 * 100vw);
    color      : rgba(35, 37, 54, 0.6)
}

.pc .help {
    width   : 100%;
    position: relative
}

.pc .help img {
    width: 100%
}

.pc .help-content {
    z-index        : 10;
    position       : absolute;
    height         : 100%;
    width          : 100%;
    left           : 0;
    top            : 0;
    padding        : calc(60 / 1920 * 100vw) calc(270 / 1920 * 100vw);
    display        : flex;
    justify-content: space-around;
    flex-direction : column
}

.pc .help-content-title {
    font-weight: 600;
    font-size  : calc(64 / 1920 * 100vw);
    color      : white
}

.pc .help-content-message {
    font-weight: 300;
    font-size  : calc(24 / 1920 * 100vw);
    color      : white
}

.pc .help-content-button:hover {
    color       : #239642;
    border-color: #239642
}

.pc .help-content-button:hover .button-normal {
    display: none
}

.pc .help-content-button:hover .button-hover {
    display: block
}

.pc .help-content-button {
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight    : 300;
    font-size      : calc(18 / 1920 * 100vw);
    color          : white;
    width          : calc(168 / 1920 * 100vw);
    height         : calc(35 / 1920 * 100vw);
    border-width   : 1px;
    border-color   : white;
    border-style   : solid;
    cursor         : pointer;
    border-radius  : calc(10 / 1920 * 100vw);
    margin-top     : calc(20 / 1920 * 100vw)
}

.pc .help-content-button .button-normal {
    display: block
}

.pc .help-content-button .button-hover {
    display: none
}

.pc .help-content-button img {
    width      : calc(25 / 1920 * 100vw);
    height     : calc(25 / 1920 * 100vw);
    margin     : 0;
    margin-left: calc(10 / 1920 * 100vw)
}

.pc .bottom {
    width           : 100%;
    padding         : 0 calc(100 / 1920 * 100vw);
    padding-bottom  : calc(100 / 1920 * 100vw);
    background-color: #f7f4f0
}

.pc .bottom-title {
    padding-top   : calc(80 / 1920 * 100vw);
    padding-bottom: calc(50 / 1920 * 100vw);
    color         : #faaf56;
    font-weight   : 300;
    font-size     : calc(28 / 1920 * 100vw)
}

.pc .bottom-list {
    width          : 100%;
    display        : flex;
    align-items    : center;
    justify-content: space-around
}

.pc .bottom-list-item {
    width          : calc((100% - 90px) / 4);
    height         : 100%;
    display        : flex;
    flex-direction : column;
    align-items    : start;
    justify-content: space-around
}

.pc .bottom-list-item img {
    width : 100%;
    border: calc(20 / 1920 * 100vw)
}

.pc .bottom-list-item-content {
    font-weight       : 500;
    font-size         : calc(20 / 1920 * 100vw);
    line-height       : calc(27 / 1920 * 100vw);
    color             : #232536;
    padding-top       : calc(30 / 1920 * 100vw);
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.mobile .swiper {
    width           : 100%;
    background-color: white;
    position        : relative
}

.mobile .swiper img {
    width: 100%
}

.mobile .swiper-box {
    position       : absolute;
    left           : 0;
    top            : 0;
    width          : 100%;
    height         : 100%;
    display        : flex;
    flex-direction : column;
    padding        : 0 20px;
    justify-content: center
}

.mobile .swiper-box-title {
    font-weight: 500;
    font-size  : 18px;
    color      : white
}

.mobile .swiper-box-content {
    padding-top: 5px;
    font-weight: 300;
    font-size  : 11px;
    color      : white
}

.mobile .nav {
    display    : flex;
    align-items: center;
    padding    : 0 20px;
    padding-top: 20px
}

.mobile .nav div {
    font-weight  : 300;
    font-size    : 15px;
    padding-right: 10px;
    color        : black;
    cursor       : pointer
}

.mobile .nav img {
    padding-right: 10px;
    width        : 25px;
    height       : auto
}

.mobile .title {
    position   : relative;
    display    : flex;
    align-items: center;
    height     : 25px;
    font-weight: 600;
    font-size  : 16px;
    color      : black
}

.mobile .title-color {
    /*z-index         : -1;*/
    position        : absolute;
    left            : 0;
    background-color: rgba(35, 150, 66, 0.7);
    bottom          : 5px;
    height          : 6px;
    width           : 20px
}

.mobile .top {
    padding        : 10px 10px;
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    padding-bottom : 20px
}

.mobile .top-enter {
    display    : flex;
    align-items: center;
    font-weight: 300;
    cursor     : pointer;
    font-size  : 13px;
    color      : rgba(71, 71, 88, 0.6)
}

.mobile .top-enter img {
    margin-left: 10px;
    width      : 20px;
    height     : 20px
}

.mobile .card {
    width          : 100%;
    padding        : 0 10px;
    display        : flex;
    align-items    : center;
    justify-content: space-around;
    flex-wrap      : wrap
}

.mobile .card-item {
    width         : 100%;
    height        : 100%;
    display       : flex;
    flex-direction: column;
    padding-bottom: 20px
}

.mobile .card-item img {
    width : 100%;
    border: 10px
}

.mobile .card-item-title {
    font-weight: 600;
    font-size  : 16px;
    color      : #232536;
    padding-top: 10px
}

.mobile .card-item-content {
    font-weight: 300;
    padding-top: 10px;
    font-size  : 15px;
    color      : #232536
}

.mobile .news {
    width      : 100%;
    padding    : 10px 10px;
    /*display    : flex;*/
    /*align-items: center;*/
    background : #f7f4f0
}

.mobile .news img {
    height: 100%;
    width : auto
}

.mobile .news-info {
    display        : flex;
    justify-content: space-around;
    flex-direction : column;
    height         : 100%
}

.mobile .news-info-title {
    font-weight       : 600;
    font-size         : 15px;
    color             : #faaf56;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.mobile .news-info-message {
    font-weight       : 600;
    font-size         : 15px;
    color             : #232536;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.mobile .news-info-desc {
    font-weight       : 300;
    font-size         : 14px;
    color             : #474758;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.mobile .news-info-date {
    font-weight: 400;
    font-size  : 14px;
    color      : #474758
}

.mobile .search {
    width          : 100%;
    padding        : 10px 10px;
    display        : flex;
    align-items    : center;
    justify-content: space-around
}

.mobile .search-item {
    width         : calc((100% - 20px) / 2);
    height        : 100%;
    display       : flex;
    flex-direction: column;
    padding-bottom: 20px
}

.mobile .search-item img {
    width : 100%;
    border: 10px;
    margin: 5px 0
}

.mobile .search-item-title {
    font-weight   : 500;
    font-size     : 15px;
    color         : #232536;
    padding-bottom: 10px
}

.mobile .search-item .button-normal {
    display: none
}

.mobile .search-item .button-hover {
    display: block
}

.mobile .search-item-button {
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight    : 300;
    font-size      : 12px;
    color          : rgba(71, 71, 88, 0.6);
    width          : 80px;
    height         : 25px;
    border-width   : 1px;
    border-color   : #474758;
    border-style   : solid;
    cursor         : pointer;
    border-radius  : 5px
}

.mobile .search-item-button img {
    width      : 15px;
    height     : 15px;
    margin     : 0;
    margin-left: 10px
}

.mobile .banner {
    width          : 100%;
    height         : 160px;
    position       : relative;
    display        : flex;
    align-items    : center;
    justify-content: center
}

.mobile .banner img {
    width : 100%;
    height: 100%
}

.mobile .banner-content {
    position       : absolute;
    height         : 100%;
    width          : 100%;
    left           : 0;
    top            : 0;
    padding        : 0 20px;
    display        : flex;
    align-items    : center;
    justify-content: center
}

.mobile .banner-content-right {
    display        : flex;
    justify-content: space-around;
    flex-direction : column
}

.mobile .banner-content-right-title {
    font-weight: 600;
    font-size  : 16px;
    color      : white
}

.mobile .banner-content-right-message {
    padding-top: 10px;
    font-weight: 300;
    font-size  : 15px;
    color      : white
}

.mobile .banner-content-right-button {
    margin-top     : 10px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight    : 300;
    font-size      : 13px;
    color          : white;
    width          : 80px;
    height         : 25px;
    border-width   : 1px;
    border-color   : #6d767c;
    border-style   : solid;
    cursor         : pointer;
    border-radius  : 5px
}

.mobile .banner-content-right-button img {
    width      : 15px;
    height     : 15px;
    margin     : 0;
    margin-left: 10px
}

.mobile .hot {
    width         : 100%;
    padding       : 10px 10px;
    /*display       : flex;*/
    flex-direction: column;
    align-items   : center
}

.mobile .hot-item {
    width        : 100%;
    height       : 100%;
    display      : flex;
    border-radius: 10px;
    overflow     : hidden;
    margin-bottom: 10px
}

.mobile .hot-item-left {
    /*width : 30.88%;*/
    height: 100px
}

.mobile .hot-item-right {
    padding-right  : 10px;
    display        : flex;
    padding-left   : 20px;
    flex-direction : column;
    align-items    : start;
    justify-content: center;
    background     : #f2f2f9
}

.mobile .hot-item-right-title {
    font-weight       : 500;
    font-size         : 15px;
    line-height       : 20px;
    color             : #232536;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.mobile .hot-item-right-button {
    margin-top     : 10px;
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight    : 400;
    font-size      : 13px;
    color          : #239642;
    cursor         : pointer
}

.mobile .hot-item-right-button img {
    width      : 15px;
    height     : 15px;
    margin     : 0;
    margin-left: 10px
}

.mobile .story {
    width         : 100%;
    padding       : 10px 10px;
    display       : flex;
    align-items   : center;
    flex-direction: column
}

.mobile .story-item {
    background     : #f2f2f9;
    flex-direction : column;
    justify-content: space-around;
    width          : 100%;
    display        : flex;
    border-radius  : 10px;
    overflow       : hidden;
    padding        : 20px;
    margin-bottom  : 10px;
    height         : 200px
}

.mobile .story-item-tag {
    height         : 20px;
    border-radius  : 10px;
    width          : auto;
    padding        : 0 7.5px;
    border-width   : 1px;
    border-style   : solid;
    display        : flex;
    align-items    : center;
    justify-content: center;
    border-color   : rgba(71, 71, 88, 0.27);
    font-weight    : 300;
    font-size      : 16px;
    color          : rgba(0, 0, 0, 0.35)
}

.mobile .story-item-title {
    font-weight       : 600;
    font-size         : 15px;
    color             : black;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.mobile .story-item-message {
    font-weight       : 300;
    font-size         : 14px;
    color             : #474758;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}

.mobile .story-item-bottom {
    display    : flex;
    align-items: center
}

.mobile .story-item-bottom-line {
    height      : 20px;
    width       : 2px;
    background  : #faaf56;
    margin-right: 10px
}

.mobile .story-item-bottom-date {
    font-weight: 300;
    font-size  : 15px;
    color      : rgba(35, 37, 54, 0.6)
}

.mobile .help {
    width   : 100%;
    position: relative;
    height  : 120px
}

.mobile .help img {
    width : 100%;
    height: 100%
}

.mobile .help-content {
    z-index        : 10;
    position       : absolute;
    height         : 100%;
    width          : 100%;
    left           : 0;
    top            : 0;
    padding        : 10px 20px;
    display        : flex;
    justify-content: space-around;
    flex-direction : column
}

.mobile .help-content-title {
    font-weight: 600;
    font-size  : 16px;
    color      : white
}

.mobile .help-content-message {
    font-weight: 300;
    font-size  : 14px;
    color      : white
}

.mobile .help-content-button {
    display        : flex;
    align-items    : center;
    justify-content: center;
    font-weight    : 300;
    font-size      : 13px;
    color          : white;
    width          : 80px;
    height         : 25px;
    border-width   : 1px;
    border-color   : white;
    border-style   : solid;
    cursor         : pointer;
    border-radius  : 5px;
    margin-top     : 10px
}

.mobile .help-content-button img {
    width      : 15px;
    height     : 15px;
    margin     : 0;
    margin-left: 10px
}

.mobile .bottom {
    width           : 100%;
    padding         : 0 20px;
    padding-bottom  : 20px;
    background-color: #f7f4f0
}

.mobile .bottom-title {
    padding-top   : 10px;
    padding-bottom: 20px;
    color         : #faaf56;
    font-weight   : 300;
    font-size     : 16px
}

.mobile .bottom-list {
    width          : 100%;
    display        : flex;
    align-items    : center;
    justify-content: space-around;
    flex-wrap      : wrap
}

.mobile .bottom-list-item {
    width          : calc((100% - 30px) / 2);
    height         : 100%;
    display        : flex;
    flex-direction : column;
    align-items    : start;
    justify-content: space-around;
    margin-bottom  : 10px
}

.mobile .bottom-list-item img {
    width        : 100%;
    border-radius: 10px;
    overflow     : hidden
}

.mobile .bottom-list-item-content {
    font-weight       : 500;
    font-size         : 15px;
    line-height       : 20px;
    color             : #232536;
    padding-top       : 10px;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow          : hidden;
    text-overflow     : ellipsis
}