/* 导航样式开始 */
.nav {
    width: 100%;
    height: 82px;
    background-color: #000;
}

.nav li {
    float: left;
    padding: 31px 20px 30px;
}

.nav a {
    color: #fff;
    font-size: 14px;
}

.nav>ul {
    /* 元素水平居中 */
    margin: 0 auto;
    width: 791px;
}

/* 鼠标悬停到li上改变a的字体颜色 */
.nav li:hover>a {
    color: #008cff;
}

/* 导航样式结束 */
/* banner样式开始 */
.banner {
    /* 最外层的大容器宽度100%，适配所有电脑的分辨率 */
    width: 100%;
    height: 670px;
    background-color: red;
    background: url("../images/263e2819-b3ef-4f32-b9bb-4a6bb87c8438.jpg") center no-repeat;
}

/* banner样式结束 */
/* 广告样式开始 */
.adv {
    width: 100%;
    height: 232px;
    padding-bottom: 45px;
    border-bottom: 1px solid #eee;
    background-color: #fff;
}

/* wrap只实现元素水平居中 不设置高度：默认的高度由内容撑开（水平居中的元素高度是不一致） */
.wrap {
    width: 1240px;
    /* 距左右两侧的距离为自动 */
    margin: 0 auto;
}

.adv-box {
    width: 310px;
    /* 内容的高度为187px */
    height: 187px;
    /* 内容距边框的距离 */
    padding-top: 45px;
    /* 块级元素水平显示 */
    float: left;
}

.adv-box img {
    width: 130px;
}

.adv-name {
    color: #333;
    font-size: 20px;
}

.adv-desc {
    color: #999;
    font-size: 14px;
}

/* 广告样式结束 */
/* 主体样式开始 */
.container {
    /* 不设置高度 由内容撑开 */
    width: 100%;
    min-width: 1240px;
    background-color: #f4f4f4;
    /* 内容溢出部分隐藏 加了此属性后元素会开启BFC格式 变为独立的一块 布局不受子元素影响 */
    overflow: hidden;
}

/* 主体样式结束 */
/* 手机样式开始 */
.title {
    font-size: 30px;
    height: 45px;
    font-weight: 400;
    margin-top: 50px;
}

.home-img {
    width: 100%;
    height: 450px;
    background: url("../images/74c63f46-fed1-4c12-b4b2-9d84f497cd16.jpg") center no-repeat;
}

.home-img:hover {
    opacity: .85;
}

.phone-box {
    width: 100%;
    height: 1005px;
}

.phone-box-top {
    width: 100%;
    height: 620px;
}

.phone-box-bottom {
    width: 100%;
    height: 385px;
}

.phone-box-top>div {
    width: 615px;
    height: 610px;
    background-color: #fff;
    float: left;
    margin-top: 10px;
}

.phone-top-left {
    margin-right: 10px;
}

.item {
    width: 303px;
    height: 375px;
    background-color: #fff;
    float: left;
    margin-top: 10px;
    margin-right: 9px;
}

.right {
    margin-right: 0;
}

.name1 {
    font-size: 28px;
    margin-top: 58px;
}

.desc1 {
    font-size: 18px;
    margin-bottom: 3px;
}

.price1 {
    color: #c00;
    font-size: 22px;
}

.price1>span {
    font-size: 14px;
}

.price1>i {
    font-style: normal;
    font-size: 16px;
}

.phone-box-top img {
    width: 460px;
    height: 460px;
}

.goods-img {
    width: 230px;
    height: 230px;
    margin-top: 30px;
    margin-bottom: 10px;
}

.goods-name {
    margin-bottom: 2px;
}

.goods-desc {
    color: #999;
    font-size: 14px;
}

/* 手机样式结束 */
/* 魅族生声学样式开始 */
.home-img1 {
    background-image: url("../images/6c7fe8c4-5024-4e8b-83ea-9393484b552b.jpg");
}

.voice-box {
    width: 100%;
    height: 770px;
}

.img1 {
    width: 100%;
}

/* 魅族生声学样式结束 */
/* flyme样式开始 */
.Flyme-box {
    width: 1240px;
    height: 520px;
}

.Flyme-box>div {
    width: 303px;
    height: 245px;
    background-color: #fff;
    float: left;
    margin-bottom: 15px;
    margin-right: 9px;
}

.Flyme-box>div:first-child {
    width: 615px;
}

.Flyme-box>div:nth-child(3), .Flyme-box>div:nth-child(7) {
    margin-right: 0;
}

/* flyme样式结束 */
/* 精彩视频样式开始 */
.video-box {
    width: 1240px;
    height: 506px;
}

.video-box>div {
    width: 303px;
    height: 244px;
    background-color: #fff;
    float: left;
    margin-bottom: 9px;
    margin-right: 9px;
}

.video-box>div:nth-child(4n) {
    margin-right: 0;
}

.video-box img,.Flyme-box img {
    width: 100%;
}

.video-box p ,.Flyme-box p{
    height: 55px;
    /* 行高等于高 一行文字垂直居中 */
    line-height: 55px;
    color: #515151;
}

/* 精彩视频样式结束 */