@charset "utf-8";
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

ul,
ol,
li {
    list-style: none
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400
}

img {
    border: 0;
    display: block
}

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    word-wrap: break-word;
    font-size: 10px
}

a {
    color: #666;
    text-decoration: none;
    outline: 0
}

body {
    -webkit-text-size-adjust: none;
    max-width: 640px;
    min-width: 320px;
    width: 100%;
    overflow-x: hidden;
    margin: 0 auto;
    font-size: 62.5%
}

* {
    margin: 0;
    padding: 0;
    border: 0
}

@media only screen and (max-width:768px),
only screen and (max-device-width:768px) {
    html {
        font-size: 20px
    }
}

@media only screen and (max-width:640px),
only screen and (max-device-width:640px) {
    html {
        font-size: 20px
    }
}

@media only screen and (max-width:600px),
only screen and (max-device-width:600px) {
    html {
        font-size: 18.75px
    }
}

@media only screen and (max-width:540px),
only screen and (max-device-width:540px) {
    html {
        font-size: 16.88px
    }
}

@media only screen and (max-width:480px),
only screen and (max-device-width:480px) {
    html {
        font-size: 15px
    }
}

@media only screen and (max-width:414px),
only screen and (max-device-width:414px) {
    html {
        font-size: 12.94px
    }
}

@media only screen and (max-width:400px),
only screen and (max-device-width:400px) {
    html {
        font-size: 12.5px
    }
}

@media only screen and (max-width:375px),
only screen and (max-device-width:375px) {
    html {
        font-size: 11.72px
    }
}

@media only screen and (max-width:360px),
only screen and (max-device-width:360px) {
    html {
        font-size: 11.25px
    }
}

@media only screen and (max-width:320px),
only screen and (max-device-width:320px) {
    html {
        font-size: 10px
    }
}

@media only screen and (max-width:240px),
only screen and (max-device-width:240px) {
    html {
        font-size: 7.5px
    }
}

.clearfix {
    zoom: 1
}

.clearfix:before {
    content: "";
    display: table
}

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

section,
header {
    width: 94%;
    margin: 0 auto;
    padding-top: 1.5rem
}

header {
    text-align: center
}

header h2 {
    font-size: 1.8rem;
    font-weight: 400;
    color: #9e0001
}

header h5 {
    font-size: 1.2rem;
    font-weight: 400;
    color: #333
}

header .light {
    color: #9e0001
}

header .deep {
    color: #333
}

.zx {
    width: 100%;
    text-align: center;
    /* padding-top: 2rem; */
    font-size: 0
}

.zx a {
    float: left;
    font-size: 1.5rem;
    color: #fff;
    line-height: 4rem;
    width: 50%;
    height: 4rem;
    background-color: #000;
    /* display: inline-block */
}

.zx .red {
    background-color: #9e0001
}

.zx .gry {
    background-color: #404144
}

.m-bnr {
    width: 100%;
    text-align: center
}

.m-cont {
    width: 100%;
    padding-bottom: 1.5rem
}

.m-question {
    width: 100%;
    padding: 1.5rem 0;
    background-color: #000
}

.m-question .qst-a {
    width: 94%;
    margin: 0 auto;
    font-size: 0;
    text-align: center
}

.m-question .qst-a a {
    float: left;
    font-size: 1.2rem;
    color: #333;
    line-height: 3rem;
    background-color: #fff;
    width: 32%;
    margin-right: 2%;
    margin-bottom: 3%;
    border-radius: 0.2rem
}

.m-question .qst-a a:nth-child(3n) {
    margin-right: 0
}

.m-question .qst-a a:nth-child(n+6) {
    margin-bottom: 0
}

.m1 ul {
    width: 93%;
    margin: 0 auto;
    border-bottom: 1px #ccc solid
}

.m1 ul li {
    width: 30%;
    float: left;
    margin-right: 5%;
    margin-bottom: 5%;
    background-color: #ededed;
    border-radius: 50%;
    text-align: center
}

.m1 ul li:nth-child(3n) {
    margin-right: 0
}

.m1 ul li h4 {
    font-size: 1.2rem;
    font-weight: 700;
    color: #9e0001
}

.m1 ul li h6 {
    font-size: 1rem;
    font-weight: 400;
    color: #333
}

.m1 ul li b {
    width: 2.8rem;
    height: 2.4rem;
    background: url("../images/1.png") no-repeat;
    background-size: 19.75rem 2.45rem;
    display: inline-block;
    margin-top: 0.8rem
}

.m1 ul li:nth-child(1) b {
    width: 2.8rem;
    height: 2.6rem;
    margin-top: 0.6rem;
    background-position: 0 0
}

.m1 ul li:nth-child(2) b {
    background-position: -2.95rem 0
}

.m1 ul li:nth-child(3) b {
    background-position: -6.5rem 0
}

.m1 ul li:nth-child(4) b {
    background-position: -10.3rem 0
}

.m1 ul li:nth-child(5) b {
    background-position: -14rem 0
}

.m1 ul li:nth-child(6) b {
    background-position: -17.2rem 0
}

.m1 dl {
    width: 100%;
    padding: 1rem 0;
    text-align: left
}

.m1 dl dt {
    font-size: 1.2rem;
    font-weight: 700;
    float: left;
    border-radius: 1.5rem;
    padding: 0.3rem 1rem
}

.m1 dl dd {
    font-size: 1.1rem;
    color: #333;
    margin-left: 30%
}

.m1 dl dd em {
    font-style: normal;
    font-weight: 700;
    color: #9e0001
}

.m1 dt {
    color: #9e0001;
    border: 2px #9e0001 solid
}

.dlLst dl {
    width: 100%;
    padding: 1rem 0;
    text-align: left
}

.dlLst dl dt {
    font-size: 1.2rem;
    font-weight: 700;
    float: left;
    border-radius: 1.5rem;
    padding: 0.3rem 1rem
}

.dlLst dl dd {
    font-size: 1.1rem;
    color: #333;
    margin-left: 30%
}

.dlLst dl dd em {
    font-style: normal;
    font-weight: 700;
    color: #9e0001
}

.m2 h3 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #9e0001;
    text-align: center
}

.m2 img {
    padding: 1rem 0
}

.m2 .mj-list dl {
    width: 100%;
    padding: 1rem 0;
    text-align: left
}

.m2 .mj-list dl dt {
    font-size: 1.2rem;
    font-weight: 700;
    float: left;
    border-radius: 1.5rem;
    padding: 0.3rem 1rem
}

.m2 .mj-list dl dd {
    font-size: 1.1rem;
    color: #333;
    margin-left: 30%
}

.m2 .mj-list dl dd em {
    font-style: normal;
    font-weight: 700;
    color: #9e0001
}

.m2 .mj-list dl {
    padding-top: 1.5rem
}

.m2 .mj-list dt {
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    float: left;
    border-radius: 1.5rem;
    background-color: #9e0001;
    padding: 0.3rem 1rem
}

.m2 .mj-list dd {
    padding-top: 0.1rem
}

.m3 .aside {
    width: 10%;
    float: left;
    position: relative
}

.m3 .aside .tabs {
    width: 2px;
    margin: 0 auto;
    height: 25rem;
    background-color: #9e0001;
    position: relative
}

.m3 .aside .tabs i {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    background-color: #333;
    color: #fff;
    font-size: 1.3rem;
    font-style: normal;
    line-height: 2.6rem;
    text-align: center;
    vertical-align: middle;
    display: block;
    margin-left: -1.3rem;
    margin-top: 2.5rem
}

.m3 .aside .tabs i:nth-child(1) {
    margin-top: 0;
    background-color: #fff !important;
    border: 2px #9e0001 solid
}

.m3 .aside .tabs i:nth-child(2) {
    background-color: #9e0001
}

.m3 .aside .tabs .activefg {
    border: 1rem transparent solid;
    border-left: 1.3rem #9e0001 solid;
    position: absolute;
    left: 0.85rem;
    top: 5.45rem
}

.m3 .m3-a {
    margin-left: 15%;
    text-align: left
}

.m3 .m3-a h2 {
    font-size: 1.8rem;
    font-weight: 400;
    padding-top: 1rem
}

.m3 .m3-a h6 {
    font-size: 1rem;
    color: #000;
    opacity: 0.6;
    text-transform: uppercase;
    text-align: center
}

.m3 .m3-a .skill-a {
    width: 100%;
    padding-top: 0.5rem
}

.m3 .m3-a .skill-a li {
    width: 49%;
    float: left;
    background-color: #9e0001;
    color: #fff;
    font-size: 1rem;
    line-height: 2.5rem;
    margin-right: 2%;
    margin-bottom: 2%;
    text-align: center
}

.m3 .m3-a .skill-a li:nth-child(2n) {
    margin-right: 0
}

.m5 ul {
    width: 100%;
    padding: 1rem 0
}

.m5 ul li {
    width: 100%;
    padding-bottom: 0.2rem
}

.m5 p {
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 3.5rem;
    color: #fff;
    background-color: #c7c7c7;
    display: block;
    width: 50%;
    height: 3.5rem;
    margin: 0 auto;
    text-align: center
}

.m6 li {
    width: 48.5%;
    margin-right: 3%;
    float: left;
    margin-bottom: 3%
}

.m6 li:nth-child(2n) {
    margin-right: 0
}

.m6 li:nth-child(n+2) {
    margin-bottom: 0
}

.m6 li p {
    font-size: 1rem;
    color: #333;
    width: 100%;
    height: 3rem;
    line-height: 3rem;
    text-align: center;
    background-color: #f6f6f6
}

.m7 section {
    text-align: center
}

.m7 section h5 {
    font-size: 1.2rem;
    font-weight: 700;
    color: #333
}

.m7 section h6 {
    font-size: 1rem;
    font-weight: 200;
    color: #333
}

.m7 section h6 b {
    font-weight: 700
}

.m7 .m7-a {
    width: 100%;
    padding-top: 1rem;
    position: relative
}

.m7 .m7-a p {
    font-size: 1.2rem;
    color: #fff;
    text-align: center;
    line-height: 3rem;
    width: 100%;
    height: 3rem;
    position: absolute;
    bottom: 0;
    background-color: rgba(158, 0, 1, 0.5)
}

.m7 .m7-swiper {
    padding-top: 1.5rem;
    height: 8.5rem;
}

.m7 .m7-swiper .swiper-wrapper img {
    width: 80% !important;
    margin: 0 auto
}

.m7 .m7-swiper .swiper-button-prev,
.m7 .m7-swiper .swiper-button-next {
    transform: scale(0.5);
    top: 50%;
    margin-top: -10px
}

.xylist {
    background-color: #f6f6f6;
    padding: 2rem 0
}

.zylist {
    width: 96.875%;
    margin: 0 auto;
    padding: 2rem 0
}

.zylist li {
    width: 32%;
    float: left;
    margin-right: 2%
}

.zylist li:nth-child(3) {
    margin-right: 0
}

.zylist li p {
    font-size: 1rem;
    color: #fff;
    text-align: center;
    line-height: 2.5rem;
    width: 100%;
    height: 2.5rem;
    margin-top: 0.5rem;
    background-color: #86070e
}

.m-bnr {
    position: relative;
    overflow: hidden
}

.m-bnr .changeImg {
    animation: change 30s ease-in-out 3
}

@keyframes change {
    0% {
        opacity: 1;
        transform: scale(1) translateX(0)
    }
    50% {
        opacity: 0.6;
        transform: scale(1.3) translateX(20px)
    }
    100% {
        opacity: 1;
        tansform: scale(1) translateX(0)
    }
}

.m-bnr .artImg {
    position: absolute;
    width: 80%;
    left: 10%;
    top: 3.8%
}

.readall_box {
    position: relative;
    margin-top: -9rem;
    text-align: center
}

.readall_box .read_more_mask {
    height: 10rem;
    background: -moz-linear-gradient(bottom, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
    background: -webkit-gradient(linear, 0 top, 0 bottom, from(rgba(255, 255, 255, 0)), to(#fff));
    background: -o-linear-gradient(bottom, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0))
}

.readall_box p {
    background: none;
    border: 2px #fe4d00 solid;
    border-radius: 1rem;
    color: #fe4d00;
    height: 3rem;
    line-height: 3rem
}