.F5{background-color: #262626;padding-top: 70px;}
.F5 *{box-sizing: border-box;transition: all .3s ease-out;}
.F5-section{width: 1200px;margin: 0 auto;}
.txt-linear{background-image: linear-gradient(to right, #fcfcfc, #f3f3f3, #e3e3e3, #d7d7d7);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.space{padding-top: 8vh !important;padding-bottom: 8vh !important;}
.pic img{width: 100%;}
.mg_t{margin-top: 3.8vh;}
img{display: inline-block;max-width: 100%;}
.fs_l{font-size: 4.4em;font-weight: bold;letter-spacing: 6px;}
.fs_s{font-size: 1.8em;line-height: 1.8;letter-spacing: 2px;}

.F5-box1{height: 48.542vw;background: url(../images/product-page/F5/bg_banner.png) no-repeat center/cover;}
.F5-box1 .F5-section{height: 100%;display: flex;flex-direction: column;justify-content: center;}
.F5-box1 h1{font-size: 2.9em;letter-spacing: 1px;margin-bottom: 5px;font-weight: normal;color: #ff8039;display: flex;align-items: center;}
.F5-box1 h1 span{font-size: 2.2em;font-weight: bold;color: #fff;margin-right: 7px;}
.F5-box1 p{font-size: 4em;letter-spacing: 7px;color: #fff;}

.F5-box2{background-color: #fff;text-align: center;}
.F5-box2 .title{color: #161616;}
.F5-box2 .desc{color: #5d5d5d;width: 720px;margin: 30px auto;}
.F5-box2 .pic{width: 80%;margin-left: auto;}

.F5-box3{background: url(../images/product-page/F5/box3.jpg) no-repeat center/cover;height: 50vw;display: flex;flex-direction: column;justify-content: center;}
.F5-box3 .main{width: 600px;}
.F5-box3 .title{color: #fff;}
.F5-box3 .desc{color: #989898;margin: 30px auto 50px;}
.F5-box3 ul{display: flex;flex-wrap: wrap;}
.F5-box3 ul li{width: 50%;display: flex;align-items: flex-start;margin-top: 30px;}
.F5-box3 ul li img{width: 35px;margin-right: 20px;}
.F5-box3 ul li .p1{font-size: 3.2em;font-weight: bold;color: rgba(255,255,255,.9);line-height: 1;margin-bottom: 10px;}
.F5-box3 ul li .p2{font-size: 1.6em;font-weight: bold;color: #fff;}
.F5-box3 ul li .p2 span{font-weight: normal;}

.F5-box4{background: linear-gradient(to bottom, #000, #0f0d0c, #222120);text-align: center;}
.F5-box4 .title{color: #fff;}
.F5-box4 .desc{color: #989898;margin: 25px auto 50px;}
.F5-box4 .pic{width: 45%;margin: 0 auto;}

.F5-box5{background: linear-gradient(to bottom, #191b21, #090a0c);}
.F5-box5 .pic{position: relative;margin: 0 auto;width: 78%;z-index: 1;}
.F5-box5 .p1,
.F5-box5 .p2{position: absolute;top: 50%;transform: translateY(-50%);font-size: 6em;color: #fff;white-space: nowrap;z-index: -1;}
.F5-box5 .p1{right: 70%;}
.F5-box5 .p2{left: 65%;}
.F5-box5 .txt{color: #4b4b4b;text-align: center;}

.F5-box6 .section{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
.F5-box6 .p2{color: #6f6f6f;margin-top: 20px;}
.F5-box6 .pic{width: calc(100% - 510px);}
.F5-box6 .txt{width: 460px;}

.F5-box7{height: 42.76vw;background: url(../images/product-page/F5/box7.jpg) no-repeat center/cover;}
.F5-box7 .F5-section{height: 100%;display: flex;justify-content: flex-end;align-items: center;}
.F5-box7 .txt{width: 430px;}
.F5-box7 .p2{color: rgba(255,255,255,.7);margin-top: 20px;}

.F5-box8{height: 42.86vw;background: url(../images/product-page/F5/box8.jpg) no-repeat center/cover;}
.F5-box8 .F5-section{height: 100%;display: flex;justify-content: flex-start;align-items: center;}
.F5-box8 .txt{width: 426px;}
.F5-box8 .p2{color: rgba(255,255,255,.7);margin-top: 20px;}

.F5-box9{height: 52.3vw;background: url(../images/product-page/F5/box9.jpg) no-repeat center/cover;padding-top: 5vw;}
.F5-box9 .F5-section{height: 100%;position: relative;}
.F5-box9 .p1{text-align: center;font-size: 5em;font-weight: bold;}
.F5-box9 .p2{text-align: center;color: rgba(255,255,255,.7);margin-top: 30px;}
.F5-box9 .btm{position: absolute;bottom: 20px;left: 20%;width: 60%;display: flex;justify-content: space-between}
.F5-box9 .btm dd{color: rgba(255,255,255,.7);}

.F5-config-title{font-size: 2.6em;color: #fff;padding-bottom: 2vh;margin-bottom: 7vh;border-bottom: 2px solid rgba(255,255,255,.7);}
.F5-config .list{display: flex; flex-wrap: wrap;justify-content: space-between;}
.F5-config .list li{width: calc((100% - 48px) / 5); border: 2px solid rgba(255,255,255,.3); border-radius: 10px; display: flex; flex-wrap: wrap; align-items: center;padding: 15px; margin-bottom: 2.1vw;}
.F5-config .list li:last-child{ width: 100%;margin-right: 0;}
.F5-config .list li .icon img{ max-width: 34px;max-height: 34px;margin-right: 14px;}
.F5-config .list li .text{ flex: 1;}
.F5-config .list li .text .title{ font-size: 1.4em;color: #fff;}
.F5-config .list li .info{ font-size: 1.3em;margin-top: 10px;color: rgba(255,255,255,.7);}
.F5-config .list li .info p{ text-align: left;}
.F5-config .tips{padding: 10px 0; border-bottom: 2px solid rgba(255,255,255,.7); font-size: 1.2em; color: #fff; text-align: right;}

@media screen and (max-width: 1440px){
}

@media screen and (max-width: 1366px){
    .fs_l{font-size: 3.8em;letter-spacing: 4px;}
    .fs_s{font-size: 1.6em;letter-spacing: 1px;}
}

@media screen and (max-width: 1270px){
    .F5-section{width: 92%;}

    .F5-config .list li{width: calc((100% - 24px) / 3)}
}

@media screen and (max-width: 1024px){
    .fs_l{font-size: 3em;}
    .fs_s{line-height: 1.5;}

    .F5-box1 h1{font-size: 2.2em;letter-spacing: 4px;}
    .F5-box1 h1 span{font-size: 2.2em;margin-right: 5px;}
    .F5-box1 p{font-size: 3em;letter-spacing: 4px;}

    .F5-box3 .main{width: 60%;}
    .F5-box3 .desc{margin: 10px auto 20px;}
    .F5-box3 ul li img{width: 22px;margin-right: 10px;}
    .F5-box3 ul li .p1{font-size: 2em;margin-bottom: 5px;}
    .F5-box3 ul li .p2{font-size: 1.4em;}

    .F5-box5 .p1, .F5-box5 .p2{font-size: 5em;}

    .F5-box6 .txt{width: 310px;}
    .F5-box6 .pic{width: calc(100% - 340px);}

    .F5-box7 .txt,
    .F5-box8 .txt{width: 290px;}

    .F5-box9 .p1{font-size: 3em;}
    .F5-box9 .p2{margin-top: 20px;}
}

@media screen and (max-width: 768px){
    .space{padding-top: 40px !important;padding-bottom: 40px !important;}
    .fs_l{font-size: 2em;}
    .fs_s{font-size: 1.4em;line-height: 1.5;}

    .F5-box1 h1{font-size: 1.6em;letter-spacing: 2px;}
    .F5-box1 h1 span{font-size: 1.8em;margin-right: 5px;}
    .F5-box1 p{font-size: 2em;letter-spacing: 4px;}

    .F5-box2 .desc{width: 100%;margin: 20px 0 0;}
    .F5-box2 .pic{width: 96%;}

    .F5-box3 .desc{margin: 10px auto;}
    .F5-box3 ul li{margin-top: 10px;}
    .F5-box3 ul li img{width: 18px;margin-right: 10px;}
    .F5-box3 ul li .p1{font-size: 1.6em;margin-bottom: 5px;}
    .F5-box3 ul li .p2{font-size: 1.2em;}

    .F5-box4 .desc{margin: 10px auto 20px;}

    .F5-box5 .p1, .F5-box5 .p2{font-size: 4em;}
    
    .F5-box6 .txt{width: 224px;}
    .F5-box6 .pic{width: calc(100% - 250px);}
    
    .F5-box7 .txt,
    .F5-box8 .txt{width: 230px;}

    .F5-box9 .p1{font-size: 2em;}

    .F5-config .list li{width: calc((100% - 12px) / 2)}
    .F5-config .list li:nth-last-child(2){width: 100%;}
    .F5-config .list li:nth-last-child(2) .info{display: flex;flex-wrap: wrap;justify-content: space-between;}
}

@media screen and (max-width: 525px){
    .F5-box1 h1{font-size: 1.4em;letter-spacing: 1px;}
    .F5-box1 h1 span{font-size: 2em;}
    .F5-box1 p{font-size: 1.8em;letter-spacing: 2px;}

    .F5-box3{height: auto;padding: 40px 0;}
    .F5-box3 .main{width: 67%;}
    
    .F5-box7,
    .F5-box8{height: auto;padding: 50px 0;}
    .F5-box7 .txt,
    .F5-box8 .txt{width: 210px;}

    .F5-box9{height: 80vw;padding-top: 30px;}
    .F5-box9 .btm{left: 4%;width: 92%;}
    
    .F5-config-title{font-size: 2em;margin-bottom: 30px;}
}

@media screen and (max-width: 414px){
    
}