@charset "utf-8";
/* CSS Document */
* {
	margin: 0;
	padding: 0;
}
body {
	font-family: "microsoft yahei", Helvetica Neue, Helvetica, Arial, sans-serif;
	color: #333;
	font-size: 13px;
}
.apple-banner {
	width: 100%;
	position: absolute;	top: 0;right: 0;left: 0;margin:auto;
	/*height: 720px;*/
	overflow: hidden;
}

@media (max-width: 981px){
	.apple-banner {position: static;}
}

.apple-banner .swiper-container {
	margin-top: -40px;
	width: 100%;
	/*height: 800px;*/
}
.swiper-button-prev,.swiper-button-next{
	width: 15%;
	height: 100%;
	top:0;
	background:none;
	}
.swiper-button-prev{
	left:0;}	
.swiper-button-next{
	right:0;}	
.swiper-button-prev span,.swiper-button-next span{
	display:block;
	width: 64px;
	height: 64px;
	position: absolute;
	left: 20px;
	top: 50%;
	margin-top:-32px;
	border-radius: 100%;
	background: rgba(180,180,180,0.25) url(../images/arrows.png) no-repeat center 17px;
	opacity: 0;
	-webkit-transition: opacity 0.5s ease;
	transition: opacity 0.5s ease;
}
.swiper-button-next span{
	background: rgba(180,180,180,0.25) url(../images/arrows.png) no-repeat center -31px;
	left:auto;
	right:20px;
	}
.swiper-button-prev:hover span,.swiper-button-next:hover span{
	opacity: .6;
}
/*分页器*/
.apple-banner .swiper-pagination{
	top:auto;
	bottom:0px;
	background:none;
}
.apple-banner  .swiper-pagination-bullet {
	display: inline-block;
	width: 50px;
	height: 10px;
	margin: 0 3px;
	cursor: pointer;
	background: none;
	border-radius:0;
	opacity: 1;
}
.apple-banner  .swiper-pagination-bullet span {
	width: 50px;
	height: 2px;
	display: block;
	background: rgba(128,128,128,0.2);
}
.apple-banner .swiper-pagination-bullet-active span{
    background:gray;
}
.apple-banner .autoplay .swiper-pagination-bullet-active span{
    background: rgba(128,128,128,0.2);
}
.apple-banner  .swiper-pagination-bullet i{
	background: gray;
	height: 2px;
	transform:scaleX(0);
	transform-origin: 0;
	display: block;
}
.apple-banner .autoplay .firsrCurrent i{
	transition:transform 2.9s linear;
	transform:scaleX(1);
}
.apple-banner .autoplay .current i{
	transition:transform 4s linear;
	transform:scaleX(1);
}
.apple-banner  .autoplay .replace span{
  background:gray;
}
/*内容样式*/

.slide1 {
	background: #000 url(../images/iphone_large.jpg) no-repeat 50% 10%;
	background-size: auto 100%;
}

.slide1 .title {
	text-align: center;
	margin-top: 100px;
	font-size: 30px;
	font-weight: normal;
	color: #fff;
}

.slide2 {
	background: #f3f3f3 url(../images/watch_alt_large.jpg) no-repeat center 50%;
	background-size: auto 100%;
}

.slide2 .title {
	padding-top: 100px;
	text-align: center;
}

.slide2 h2 {
	bottom: 100px;
	text-align: center;
	font-size: 30px;
	font-weight: normal;
	position: absolute;
	width: 100%;
}

.slide3 {
	background: #fff url(../images/macbookpro_large.jpg) no-repeat center 110%;
	background-size: auto 70%;
}

.slide3 .title {
	text-align: center;
	margin-top: 100px;
	font-size: 40px;
	font-weight: normal;
}

/* 彻底清除轮播框架残留：两条杠、边框、内边距 */
.apple-banner .swiper-pagination,
.apple-banner .swiper-pagination-bullets,
.apple-banner .swiper-pagination-progressbar,
.apple-banner .swiper-button-prev,
.apple-banner .swiper-button-next,
.apple-banner .swiper-scrollbar {
    display: none !important;
}
/* 强制只显示第一张图（静态） */
.apple-banner .swiper-wrapper {
    transform: none !important;
    transition: none !important;
}
.apple-banner .swiper-slide {
    display: none !important;
}
.apple-banner .swiper-slide:first-child {
    display: block !important;
    width: 100% !important;
}

/* 文章内容容器宽度限制 */
.article-container {
  max-width: 750px !important;
  margin: 0 auto !important;
  padding: 0 15px !important;
}

/* 文章内图片强制自适应 */
.article-container img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 15px auto !important;
  border-radius: 8px !important;
}

/* 手机端适配 */
@media (max-width: 768px) {
  .article-container {
    max-width: 95% !important;
  }
}
/* 最终确定：详情页顶部大图正常显示 */
.w1100 img {
    max-width: 750px !important;
    width: 100% !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
}

/* 只显示第一张，避免轮播乱动 */
.apple-banner .swiper-slide {
    display: none;
}
.apple-banner .swiper-slide:first-child {
    display: block;
}

/* ===== 电脑端 ===== */
@media (min-width: 982px) {

    #head_banner.index {
        background: #000 !important;
        overflow: hidden !important;
    }

    #head_banner.index .padding {
        padding: 23.85% 0 0 !important;
        height: auto !important;
    }

    #head_banner.index .apple-banner {
        position: absolute !important;
        top: 50% !important;
        left: 0;
        right: 0;
        margin: auto;
        width: 100% !important;
        height: 100% !important;
        transform: translateY(-50%) !important;
    }

    #head_banner.index .swiper-container,
    #head_banner.index .swiper-wrapper,
    #head_banner.index .swiper-slide {
        width: 100% !important;
        height: 100% !important;
        background: #000 !important;
        overflow: hidden !important;
    }

    /* 👇 关键：图片样式也必须在这里 */
    #head_banner.index .apple-banner img,
    #head_banner.index .swiper-slide img {
        width: 100% !important;
        height: 100% !important;
        display: block !important;
        object-fit: contain !important;
        object-position: center 80% !important;
        background: #000 !important;
    }
}


/* ===== 手机端 ===== */

/* ===== 超大屏专用优化（不会影响其他设备）===== */
@media (min-width: 1600px) and (max-width: 3000px) {

    #website .w1200,
    #website.index_box .w1200,
    #website.index_box .info_list {
        width: 92% !important;
        max-width: 1600px !important;
        margin: 0 auto !important;
    }

    #products-list {
        width: 100% !important;
        margin-left: 0 !important;
    }

    #products-list .item {
        width: calc(25% - 18px) !important;
    }
}
@media (min-width: 1200px) {

    /* 1. 作品展示整个区块再往上一点 */
    body.index_page #website.index_box {
        margin-top: 15px !important;
    }

    /* 2. 作品展示标题和图片之间收紧 */
    body.index_page #website.index_box > .w1200.m_auto > .pub_tit {
        margin-bottom: 20px !important;
    }

    /* 3. 作品列表下面空白收紧 */
    body.index_page #website.index_box #products-list {
        margin-bottom: 20px !important;
        min-height: auto !important;
    }

    /* 4. 第一个 MORE+ 往上 */
    body.index_page #website.index_box > .w1200.m_auto > .more {
        margin-top: 10px !important;
        margin-bottom: 30px !important;
    }

    /* 5. 风格介绍这一整块往上 */
    body.index_page #website.index_box > .w1200.m_auto.wow.fadeInUp {
        position: relative !important;
        top: -40px !important;
    }

    /* 6. 风格介绍标题和内容之间收紧 */
    body.index_page #website.index_box .pub_tit.text-center.info {
        margin-bottom: 20px !important;
    }

    /* 7. 每条风格介绍之间收紧一点 */
    body.index_page #website.index_box .info_list,
    body.index_page #website.index_box .info_list.two {
        margin-bottom: 20px !important;
    }

    /* 8. 第二个 MORE+ 往上 */
    body.index_page #website.index_box .info_more {
        margin-top: 10px !important;
        margin-bottom: 20px !important;
    }
}
@media (min-width: 1200px) {
    body.index_page #website.index_box #products-list .item .img {
        height: 320px !important;
        overflow: hidden !important;
    }

    body.index_page #website.index_box #products-list .item .img img {
        width: 100% !important;
        height: 320px !important;
        object-fit: cover !important;
        object-position: center center !important;
        display: block !important;
    }

    body.index_page #website.index_box #products-list .item .main {
        padding-top: 12px !important;
    }
}