@charset "utf-8";
/* Css Document */

/* 通用样式 */
#container  img,
.safety-contentbox img,
.safety-fix-box img{
    display: block;
    width: 100%;
    height: auto;
}

/* 丰田安全技术-banner */
.mySwiper{
    height: auto;
    position: relative;
}
.mySwiper video,.mySwiper img{
    display: block;
    width: 100%;
    height: auto;
}
.mySwiper video{
    position: absolute;
}
.banner-videobtn{
    width: 5%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.main_content{
    width: 11%;
    height: 6%;
    position: absolute;
    top: 64.4%;
    left: 50%;
    transform: translate(-50%,-50%);
    cursor: pointer;
}
.safety-pagination{
    bottom: 5%!important;
}
.safety-pagination .swiper-pagination-bullet{
    width: 5.8%;
    height: 7px;
    background: #fff;
    border-radius: 3.5px;
    opacity: 1;
    margin: 0 1.5%!important;
    box-shadow:0px 0px 3px rgba(2,2,2,.5);
}
.safety-pagination .swiper-pagination-bullet-active{
    background: #f3d400;
}

/* 丰田安全技术-切换标题 */
.safety-content-titlebox {
    /* margin-top: -5%; */
    box-shadow: 0 -1px 56px rgb(0,0,0,.5);
    margin-bottom: 2%;
}
.safety-content-titleli {
    float: left;
    width: 25%;
    height: 10vh;
    background: url("../images/safety-content-bg-titleli.jpg") no-repeat center center / cover;
    background-color: #343434;
    cursor: pointer;
}
.safety-content-titleli-inner{
    width: 80%;
    margin: 0 auto;
    padding-top: 5%;
}
.safety-content-titleli-inner h2,.safety-content-titleli-inner p{
    color: #fff;
}
.safety-content-titleli-inner h2{
    font-size: 14px;
    margin-bottom: 5px;
}
.safety-content-titleli-inner p{
    font-size: 12px;
}
.safety-content-titleli img {
    display: block;
    width: 54.3%;
}
.safety-content-titleli:hover {
    background: url("../images/safety-content-bg-active-titleli.jpg") no-repeat center center / cover;
    background-color: #e5c04e;
}

/* 丰田安全技术-切换内容 */
.safety-content {
    display: none;
}
.safety-content:first-child {
    display: block;
}
.safety-content-inner-botbox {
    width: 100%;
}

.safety-content-inner-banner {
    width: 100%;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1;
}
.safety-content-inner-banner-left,.safety-content-inner-banner-right{
    float: left;
}
.safety-content-inner-banner-left{
    width: 29.6875%;
    margin: 0 10%;
}
.safety-content-inner-banner-right{
    width: 48.4375%;
}
.safety-content-inner-banner-left-title{
    width: 27.3%;
    margin: 0 0 5%;
}
.zc-banner .safety-content-inner-banner-left-title{
    width: 13.9%;
}
.gsglxs-banner .safety-content-inner-banner-left-title{
    width: 41.3%;
}
.safety-content-inner-banner-left-summry{
    font-weight: bold;
    font-size: 24px;
    color: #333;
}


.safety-content-inner-bot{
    width: 100%;
    background: #f8f8f8;
    padding: 10vh 0;
    transform: translateY(-7%);
}
.safety-content-inner-botbox-zc .safety-content-inner-bot{
    transform: translateY(-3%);
}
.safety-content-inner-botbox-yjxs .safety-content-inner-bot{
    transform: translateY(-11%);
}
.safety-content-inner-botbox-gsglxs .safety-content-inner-bot{
    transform: translateY(-6%);
}
.safety-content-inner-bot-cont{
    width: 80.2%;
    margin: 0 auto;
    padding: 3.16% 1.58% 1.58%;
    background: #fff;
    position: relative;
    margin-bottom: 6%;
}
.safety-content-inner-bot-cont:last-child{
    margin-bottom: 0;
}
.safety-content-inner-bot-cont-title {
    width: 32.85%;
    position: absolute;
    top: -6%;
    left: 50%;
    transform: translateX(-50%);
}
.safety-content-inner-bot-cont-box{
/*     display: flex;
    align-items: center; */
}
.safety-content-inner-bot-cont-ul{
    float: left;
    width: 48.57%;
}
.safety-content-inner-bot-cont-img{
    float: right;
    width: 48.7%;
}
.safety-content-inner-bot-cont-li {
    width: 100%;
    line-height: 4;
    text-indent: 5%;
    font-size: 20px;
    font-weight: bold;
    background: url(../images/icon-sj.png) no-repeat 95% 50% / 13px auto, #f1f1f1;
    margin-bottom: 1.5%;
    cursor: pointer;
}
.safety-content-inner-bot-cont-li-img {
    width: 101.6%;
    background: none;
    margin-bottom: 4%;
}


/* 丰田安全技术-切换内容-弹出内容 街道行驶 */
.safety-fix-box {
    width: 100vw;
    height: 100vh;
    background: #ccc;
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    z-index: 1;
}
.safety-fix-box-inner {
    width: 85.72%;
    height: 80%;
    overflow: hidden;
    background: #fff;
    padding: 10px;
    box-shadow: 0 0 5px rgb(0,0,0,.5);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.safety-fix-close {
    width: 40px;
    cursor: pointer;
    position: absolute;
    top: 9px;
    right: 9px;
    z-index: 2;
}
.safety-fix-title,
.safety-fix-title-top,
.safety-fix-title-top-img {
    width: 100%;
}
.safety-fix-title-top {
    position: relative;
}
.safety-fix-title-top-text {
    width: 100%;
    line-height: 2.7;
    text-align: center;
    background: url("../images/bg-fix-title.png") no-repeat center center / auto 100%;
    font-size: 30px;
    font-weight: bold;
    color: #fff;
    position: absolute;
    bottom: 8px;
    letter-spacing: 10px;
}
.safety-fix-title-bot {
    border: 15px solid #e4c14f;
    border-radius: 1% / 5%;
    line-height: 3.3;
    text-align: center;
    font-size: 24px;
    color: #333;
    margin-top: -10px;
    position: relative;
}
.safety-fix-title-bot-double {
    line-height: 1.3;
    padding: 7px 0;
}
.safety-fix-title-bot-double span {
    display: block;
    font-size: 20px;
}
.safety-fix-contentbox {
    padding: 80px 110px;
}

.safety-fix-box-video{
    width: 100%;
    position: relative;
    margin-bottom: 80px;
}
.safety-fix-box-videobtn{
    width: 5.55%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.safety-fix-content {
    padding: 23px 63px;
    background: #f7f7f7;
    border-radius: 2% / 5%;
    margin-bottom: 80px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.safety-fix-content:last-child {
    margin-bottom: 0;
}
.safety-fix-content-left {
    float: left;
}
.safety-fix-content-left h2 {
    line-height: 1.3;
    font-size: 24px;
    font-weight: bold;
    color: #3c3c3c;
    margin-bottom: 25px;
}
.safety-fix-content-left p {
    line-height: 1.6;
    font-size: 18px;
    color: #666;
    margin-bottom: 20px;
}
.safety-fix-content-left span {
    font-size: 14px;
    color: #666;
}
.safety-fix-content-right {
    float: right;
}

.safety-fix-content-titleli {
    float: left;
    width: 25%;
    cursor: pointer;
}
.safety-fix-content-titleli img {
    display: block;
    width: 100%;
    height: auto;
}

.safety-fix-content1 .safety-fix-content-left {
    width: 45.12%;
    padding-top: 20px;
}
.safety-fix-content1 .safety-fix-content-right {
    width: 44.43%;
}
.safety-fix-content2 .safety-fix-content-left {
    width: 38.41%;
}
.safety-fix-content2 .safety-fix-content-right {
    width: 57%;
}
.safety-fix-content3 .safety-fix-content-left {
    width: 57.46%;
}
.safety-fix-content3 .safety-fix-content-right {
    width: 32.31%;
}
.safety-fix-content4 .safety-fix-content-left {
    width: 50%;
}
.safety-fix-content4 .safety-fix-content-right {
    width: 43.52%;
}
.safety-fix-content5 .safety-fix-content-left {
    width: 45.04%;
}
.safety-fix-content5 .safety-fix-content-right {
    width: 45.8%;
}
.safety-fix-content6 .safety-fix-content-left {
    width: 48%;
}
.safety-fix-content6 .safety-fix-content-right {
    width: 46.03%;
}
.safety-fix-content-jdxsmid1 .safety-fix-content-left {
    width: 57.16%;
}
.safety-fix-content-jdxsmid1 .safety-fix-content-right {
    width: 25.91%;
}
.safety-fix-content-jdxsmid2 .safety-fix-content-left {
    width: 41.15%;
}
.safety-fix-content-jdxsmid2 .safety-fix-content-right {
    width: 47.56%;
}
.safety-fix-content-jdxsright2 .safety-fix-content-left {
    width: 47.40%;
}
.safety-fix-content-jdxsright2 .safety-fix-content-right {
    width: 47.40%;
}
/* 驻车 */
.safety-fix-content-zcleft1-1 .safety-fix-content-left,
.safety-fix-content-zcleft1-2 .safety-fix-content-left,
.safety-fix-content-zcleft1-3 .safety-fix-content-left {
    width: 50.30%;
}
.safety-fix-content-zcleft1-1 .safety-fix-content-right {
    width: 32.39%;
}
.safety-fix-content-zcleft1-2 .safety-fix-content-right {
    width: 41.76%;
}
.safety-fix-content-zcleft1-3 .safety-fix-content-right {
    width: 42.07%;
}
.safety-fix-content-zcleft2-1 .safety-fix-content-left,
.safety-fix-content-zcleft2-2 .safety-fix-content-left,
.safety-fix-content-zcleft3-1 .safety-fix-content-left {
    width: 47.63%;
}
.safety-fix-content-zcleft2-1 .safety-fix-content-right {
    width: 47.86%;
}
.safety-fix-content-zcleft2-2 .safety-fix-content-right {
    width: 48.01%;
}
.safety-fix-content-zcleft3-1 .safety-fix-content-right {
    width: 43.75%;
}
.safety-fix-content-fssgsleft1-1 .safety-fix-content-left,
.safety-fix-content-fssgsleft2-1 .safety-fix-content-left,
.safety-fix-content-fssgsleft3-1 .safety-fix-content-left,
.safety-fix-content-fssgsmid1-1 .safety-fix-content-left,
.safety-fix-content-fssgsmid1-2 .safety-fix-content-left,
.safety-fix-content-fssgsright1-1 .safety-fix-content-left,
.safety-fix-content-gsglxsdleft1-1 .safety-fix-content-left,
.safety-fix-content-gsglxsdleft1-2 .safety-fix-content-left,
.safety-fix-content-gsglxsleft1-1 .safety-fix-content-left,
.safety-fix-content-gsglxsleft1-2 .safety-fix-content-left,
.safety-fix-content-gsglxsleft1-3 .safety-fix-content-left,
.safety-fix-content-gsglxsleft2-1 .safety-fix-content-left,
.safety-fix-content-gsglxsleft2-3 .safety-fix-content-left,
.safety-fix-content-gsglxsmid1-1 .safety-fix-content-left,
.safety-fix-content-gsglxsmid1-2 .safety-fix-content-left,
.safety-fix-content-gsglxsmid1-3 .safety-fix-content-left,
.safety-fix-content-gsglxsmid1-4 .safety-fix-content-left,
.safety-fix-content-gsglxsright1-1 .safety-fix-content-left,
.safety-fix-content-gsglxsright1-2 .safety-fix-content-left,
.safety-fix-content-lkelsleft2-1 .safety-fix-content-left,
.safety-fix-content-lkelsright1-1 .safety-fix-content-left,
.safety-fix-content-yjxsleft1-1 .safety-fix-content-left,
.safety-fix-content-yjxsleft1-2 .safety-fix-content-left,
.safety-fix-content-yjxsleft1-3 .safety-fix-content-left,
.safety-fix-content-yjxsright1-1 .safety-fix-content-left,
.safety-fix-content-zcmid1-1 .safety-fix-content-left,
.safety-fix-content-zcmid1-2 .safety-fix-content-left,
.safety-fix-content-zcmid1-3 .safety-fix-content-left {
    width: 50%;
}
.safety-fix-content-zcmid1-1 .safety-fix-content-right {
    width: 45.73%;
}
.safety-fix-content-zcmid1-2 .safety-fix-content-right {
    width: 45.57%;
}
.safety-fix-content-zcmid1-3 .safety-fix-content-right {
    width: 40.47%;
}
.safety-fix-content-zcmid2-1 .safety-fix-content-left,
.safety-fix-content-zcmid2-2 .safety-fix-content-left,
.safety-fix-content-zcmid3-1 .safety-fix-content-left,
.safety-fix-content-zcmid3-2 .safety-fix-content-left,
.safety-fix-content-zcright1-1 .safety-fix-content-left {
    width: 46.79%;
}
.safety-fix-content-zcmid2-1 .safety-fix-content-right {
    width: 45.96%;
}
.safety-fix-content-zcmid2-2 .safety-fix-content-right {
    width: 45.80%;
}
.safety-fix-content-zcmid3-1 .safety-fix-content-right {
    width: 26.3%;
}
.safety-fix-content-zcmid3-2 .safety-fix-content-right {
    width: 45.73%;
}
.safety-fix-content-zcright1-1 .safety-fix-content-right {
    width: 34.375%;
}
.safety-fix-content-zcright2-1 .safety-fix-content-left,
.safety-fix-content-zcright3-1 .safety-fix-content-left,
.safety-fix-content-zcright4-1 .safety-fix-content-left {
    width: 48.78%;
}
.safety-fix-content-zcright2-1 .safety-fix-content-right {
    width: 43.44%;
}
.safety-fix-content-zcright3-1 .safety-fix-content-right {
    width: 40.54%;
}
.safety-fix-content-zcright4-1 .safety-fix-content-right {
    width: 38.79%;
}
/* 夜间行驶 */
.safety-fix-content-yjxsleft1-1 .safety-fix-content-right {
    width: 46.64%;
}
.safety-fix-content-yjxsleft1-2 .safety-fix-content-right {
    width: 43.67%;
}
.safety-fix-content-yjxsleft1-3 .safety-fix-content-right {
    width: 25%;
}
.safety-fix-content-yjxsleft2-1-img {
    width: 100%;
}
.safety-fix-content-yjxsright1-1 .safety-fix-content-right {
    width: 47.10%;
}
/* 高速公路行驶 */
.safety-fix-content-gsglxsleft1-1 .safety-fix-content-right {
    width: 39.40%;
}
.safety-fix-content-gsglxsleft1-2 .safety-fix-content-right {
    width: 43.36%;
}
.safety-fix-content-gsglxsleft1-3 .safety-fix-content-right {
    width: 43.59%;
}
.safety-fix-content-gsglxsleft2-1 .safety-fix-content-right {
    width: 39.4%;
}
.safety-fix-content-gsglxsleft2-2 .safety-fix-content-left {
    width: 52.59%;
}
.safety-fix-content-gsglxsleft2-2 .safety-fix-content-right {
    width: 43.36%;
}
.safety-fix-content-gsglxsleft2-3 .safety-fix-content-right {
    width: 43.44%;
}
.safety-fix-content-gsglxsmid1-1 .safety-fix-content-right,
.safety-fix-content-gsglxsmid2-1 .safety-fix-content-right {
    width: 43.52%;
}
.safety-fix-content-gsglxsmid1-2 .safety-fix-content-right {
    width: 44.58%;
}
.safety-fix-content-gsglxsmid1-3 .safety-fix-content-right {
    width: 43.67%;
}
.safety-fix-content-gsglxsmid1-4 .safety-fix-content-right {
    width: 32.77%;
}
.safety-fix-content-gsglxsmid2-1 .safety-fix-content-left {
    width: 51%;
}
.safety-fix-content-gsglxsright1-1 .safety-fix-content-right {
    width: 38.87%;
}
.safety-fix-content-gsglxsright1-2 .safety-fix-content-right {
    width: 43.67%;
}
.safety-fix-content-gsglxsdleft1-1 .safety-fix-content-right {
    width: 39.02%;
}
.safety-fix-content-gsglxsdleft1-2 .safety-fix-content-right {
    width: 33.07%;
}

@media screen and (min-width:1440px) and (max-width:1600px) {
    .double-1440 {
        width: calc(100% - 15%);
        line-height: 1.925;
    }
}
@media screen and (max-width: 1440px) {

    .safety-content-titleli{
        height: 15vh;
    }

    .safety-content-inner-bot-cont-ulbox {
        padding: 20px 0;
    }
    .safety-content-inner-bot-cont-li {
        line-height: 2.95;
        font-size: 12px;
    }
    .double-1440,
    .safety-content-inner-bot-cont-li-icon-text-double {
        width: calc(100% - 24%);
        line-height: 1.45;
    }
    .safety-content-inner-bot-cont-li-double {
        line-height: 1.678;
    }
    .safety-fix-title-top-text {
        line-height: 2.5;
        font-size: 24px;
    }
    .safety-fix-title-bot {
        line-height: 3;
        font-size: 18px;
    }
    .safety-fix-title-bot-double {
        line-height: 1.3;
    }
    .safety-fix-title-bot-double span {
        font-size: 16px;
    }
    .safety-fix-contentbox {
        padding: 40px 55px;
    }
    .safety-fix-content {
        padding: 11.5px 31.5px;
    }
    .safety-fix-content1 .safety-fix-content-left {
        padding-top: 0;
    }
    .safety-fix-content-left h2 {
        font-size: 16px;
    }
    .safety-fix-content-left p,
    .safety-fix-content-left span {
        font-size: 12px;
    }
    .safety-fix-content2 .safety-fix-content-right {
        padding-top: 50px;
    }
}