.main{
    margin: 0px auto;
}

/* 面包屑 */
.tab-wp{
    width: 1200px;
    margin: 0 auto;
  /*  height: 125px;
    line-height: 125px;*/
	padding:15px 0;
    font-size: 14px;
}

.tab-wp a{
    font-size: 14px;
    text-decoration: none;
    color: black;
}

/* 第二部分: 上面的图片展示 */
.top-show-img{
    width: 1200px;
    margin: 0 auto;
    height: 493px;
    background-color: #D2936F;
    position: relative;
}

.top-show-img span {
    position: absolute;
    font-size: 34px;
    font-weight: 600;
    top: 72px;
    left: 67px;
	color:#fff;
}

.top-show-img p {
    position: absolute;
    width: 520px;
    font-size: 12px;
    top: 140px;
    left: 67px;
    color: #fff;
}

.top-show-img>img{
    width: 1200px;
    height: 493px;
    float: right;
}

/* 第三部分: 品牌历程 */
.timeline-wp{
    width: 1200px;
    margin: 0 auto;
    height: 600px;
}

/* 3.1 标题 */
.timeline-wp .timeline-title{
    width: 1200px;
    height: 40px;
    font-size: 34px;
    font-weight: 600;
    text-align: center;
    line-height: 40px;
    margin: 80px 0 20px;
}

/* 3.2 主要内容 */
.timeline-wp .timeline-inner-wp{
    width: 1200px;
    height: 500px;
    padding-top: 60px;
    overflow: hidden;
}

/* 这是时间线,它作为一条线,也是时间节点的容器 */
/* 每次移动时让时间线left+-300px */
.timeline-inner-wp .inner-timeline{
    width: 4000px;
    position: relative;
    border-bottom: 1px solid #D2936F;
    left: 0px;
    transition: left 300ms;
}

/* 所有的时间节点容器(时间节点里有 文字和圆点) */
.timeline-inner-wp .inner-timeline>div{
    width: 70px;
    height: 70px;
    /* background-color: #D2936F; */
    position: absolute;
    cursor: pointer;
}

/* 时间节点的文字 */
.inner-timeline>div .timenode-text{
    width: 70px;
    height: 50px;
    text-align: center;
    line-height: 50px;
}

/* 时间节点的圆点 */
.inner-timeline>div .timenode-point{
    width: 20px;
    height: 20px;
    border-radius: 10px;
    margin: 0px auto;
    background-color: #D2936F;
}

/* 下面只需要将时间节点定位到对应的位置就可以 */
.timeline-inner-wp .inner-timeline>div:nth-child(1){
    top: -60px;
    left: 400px;
}

.timeline-inner-wp .inner-timeline>div:nth-child(2){
    top: -60px;
    left: 800px;
}

.timeline-inner-wp .inner-timeline>div:nth-child(3){
    top: -60px;
    left: 1200px;
}

.timeline-inner-wp .inner-timeline>div:nth-child(4){
    top: -60px;
    left: 1600px;
}

/* 时间点对应的事件 - 容器 */
.inner-timeline-content{
    width: 1200px;
    height: 303px;
    margin-top: 30px;
    overflow-y: hidden;
    overflow-x: auto;
    position: relative;
    /* background-color: antiquewhite; */
}

/* 时间对应的事件 - 每一项的容器 */
.inner-timeline-content .innter-timeline-content-item{
    width: 348px;
    height: 248px;
    margin-right: 10px;
    overflow: hidden;
    position: absolute;
}

/* 时间对应的事件 - 每一项的标题 */
.innter-timeline-content-item .timeline-con-item-title{
    font-weight: 600;
    color: #fff;
    margin: 15px 0 10px 20px;
    opacity: 1;
}

/* 时间对应的事件 - 每一项的图片 */
.innter-timeline-content-item .timeline-con-item-img,.innter-timeline-content-item .timeline-con-item-img img{
    width: 100%;
    height: 100%;
}

/* 时间对应的事件 - 每一项的内容 xt 2022/2/15 */
.innter-timeline-content-item .timeline-con-item-con{
    width: 348px;
    height: 100px;
    position: absolute;
    top: 200px;
    background-color: rgba(0,0,0,.5);
    transition: all .5s;
}

.innter-timeline-content-item .timeline-con-item-con p {
    width: 280px;
    margin-left: 20px;
    color: #fff;
    font-size: 14px;
    opacity: 1;
}

/* 第四部分:品牌定位 */
.make-position-title {
    font-weight: 600;
    font-size: 34px;
    text-align: center;
    margin-bottom: 60px;
}

.make-position-con{
    width: 1920;
    /* height: 1000px; */
    /* background-color: #D2936F; */
    margin-top: 20px;
}

.make-position-img {
    width: 1200px;
    margin: 0 auto;
}

/* 品牌定位: 图片 */
.make-position-left {
    width: 600px;
    height: 490px;
    float: left;
    background-color: #fff;
    position: relative;
}

.make-position-left span {
    font-size: 34px;
    font-weight: 600;
    position: absolute;
    top: 188px;
    left: 143px;
}

.make-position-left p {
    width: 300px;
    font-size: 14px;
    position: absolute;
    top: 263px;
    left: 143px;
}

.make-position-swper {
    width: 1200px;
    float: left;
}

.make-position-img>img{
    width: 1200px;
    height: 490px;
    /* float: right; */
    margin-bottom: 110px;
}

/* 轮播图 - 暂时不需要设置样式 */
/* 珠宝系列故事 */
.series-wp{
    width: 1200px;
    margin: 0 auto;
    height: 600px;
}

.series-wp>div:first-child{
    margin-top: 40px;
    width: 1200px;
    height: 60px;
    line-height: 60px;
    font-size: 30px;
    text-align: center;
    font-weight: bold;
}

.series-wp>div:nth-child(2){
    width: 1200px;
    height: 60px;
    line-height: 60px;
    font-size: 28px;
    text-align: center;
    margin-bottom: 40px;
}

/* 珠宝系列 */
.string-wp{
    width: 1200px;
    height: 720px;
    /* background-color:antiquewhite; */
}

/* 标题 ------------------------------------------------------------------------------------------------ */
.string-wp .string-title{
    width: 1200px;
    height: 100px;
    padding-top: 40px;
    padding-bottom: 40px;
}

.string-wp .string-title h1,.string-wp .string-title span{
    font-size: 34px;
    text-align: center;
    display: inline-block;
    width: 1200px;
}

.string-wp .string-title h1{
    margin-bottom: 15px;
}

.string-wp .string-title span{
    font-size: 26px;
}

/* 内容 ------------------------------------------------------------------------------------------------ */
/* 总容器: 滚动的ul + 系列产品列表的div */
.string-content{
    width: 1200px;
    height: 500px;
    /* background-color: aqua; */
}

/* 滚动容器: 上一个 ul 下一个 */
.string-list{
    width: 1200px;
    height: 540px;     
    position: relative;
    overflow: hidden;
    /* background-color: aquamarine; */
}

.string-list .string-list-pre,.string-list .string-list-next,.string-list .string-list-content{
    position: absolute;
}

/* 两个按钮的样式 */
.string-list .string-list-pre,.string-list .string-list-next{
    width:80px;
    height: 302px;
    background-color: white;
    font-size: 34px;
    text-align: center;
    line-height: 300px;
    z-index: 5;
    cursor: pointer;
}

/* 下一个按钮 */
.string-list .string-list-next{
    right: 0px;
    background: url(../imgs/next.png) no-repeat  #fff4f4;
    background-position: 35px 130px;
}

/* 上一个按钮 */
.string-list .string-list-pre{
    background: url(../imgs/pre.png) no-repeat  #fff4f4;
    background-position: 35px 130px;
}

/* ul */
.string-list .string-list-content{
    width: 1040px;
    left:88px;
    transition: left 400ms;
}

/* li */
.string-list .string-list-content li{
  width: 248px;
height: 300px;
float: left;
border: 1px solid gainsboro;
font-size: 0px;
margin: 0 8px 0 0;
}

/* 解决a占位置的问题 */
.string-list .string-list-content li a{
    font-size: 0px;
}

/* li>img  */
.string-list .string-list-content li img{
    width: 100%;
    height: 250px;
}

.string-list .string-list-content li span{
    display: block;
    width: 250px;
    height: 50px;
    font-size: 25px;
    line-height: 50px;
    text-align: center;
}

/* 每个item的产品列表 ------------------------------------------------------------- */
.string-item-wp{
    width: 250px;
    height: 0px;
    /* height: 220px; */
    transition: height 400ms;
    overflow: auto;
    margin-top: 2px;
    background-color: gainsboro;
}

.string-item-wp::-webkit-scrollbar{
    width: 2px;
    height: auto;
}

.string-item-wp::-webkit-scrollbar-thumb{
    width: 1px;
    background-color: #D2936F;
}

.string-item-wp::-webkit-scrollbar-track {
    width: 1px;
    background-color: gainsboro;
}

.string-item-wp .string-item:nth-child(odd){
    margin-left: 10px;
}

.string-item-wp .string-item{
    width: 115px;
    height: 95px;
    text-align: center;
    padding-top: 20px;
    float: left;
    cursor: pointer;
}

.string-item-wp .string-item img{
    width: 90px !important;
    height: 90px !important;
}