.j-offset-top { -webkit-transition: all 750ms; -o-transition: all 750ms; -moz-transition: all 750ms; transition: all 750ms; -webkit-transform: translateY(100px); -moz-transform: translateY(100px); -ms-transform: translateY(100px); -o-transform: translateY(100px); transform: translateY(100px); opacity: 0; }
.j-offset-top.run { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); opacity: 1; }
.big-wrap{width:1600px;margin: 0 auto}
@media (max-width: 1660px) {.big-wrap {width: 1430px;}}
@media (max-width: 1460px) {.big-wrap {width: 1230px;}}
@media (max-width: 1260px) {.big-wrap {width: 980px;}}
@media (max-width: 992px) {.big-wrap {width: 750px;} }
@media (max-width: 768px) {.big-wrap { width: 96%; }}
.brandTosea .banner { width: 100%;}
.brandTosea .banner img { width: 100%;}
.brandTosea .title { font-size: 36px; font-weight: bold; color: #333333; line-height: 42px;}
.brandTosea .s-title { margin-top: 27px; font-size: 18px; color: #333333; line-height: 32px;}
@media (max-width: 1460px) {
}
@media screen and (max-width: 1260px) {
  .brandTosea .title { font-size: 30px; line-height: 36px;}
  .brandTosea .s-title { margin-top: 22px; font-size: 16px; line-height: 28px;}
}
@media screen and (max-width: 992px) {
  .brandTosea .title { font-size: 28px; line-height: 34px;}
}
@media screen and (max-width: 767px) {
  .brandTosea .title { font-size: 24px; line-height: 30px; text-align: center;}
  .brandTosea .s-title { margin-top: 15px; font-size: 14px; line-height: 26px; text-align: center;}
}

.brandTosea .sec1 { padding: 100px 0;}
.brandTosea .sec1 .list { justify-content: flex-start;}
.brandTosea .sec1 .list .item { margin-top: 73px; width: 16.68%; margin-right: 4.1%;}
.brandTosea .sec1 .list .item:last-child { margin-right: 0;}
.brandTosea .sec1 .list .item .img { border-radius: 12px; overflow: hidden;}
.brandTosea .sec1 .list .item p { margin-top: 10px; font-size: 18px; font-weight: bold; color: #333333; line-height: 52px;}
@media (max-width: 1460px) {
  .brandTosea .sec1 .list .item { margin-top: 60px;}
}
@media screen and (max-width: 1260px) {
  .brandTosea .sec1 { padding: 60px 0;}
  .brandTosea .sec1 .list .item { margin-top: 60px; width: 17.78%; margin-right: 2.7%;}
  .brandTosea .sec1 .list .item:last-child { margin-right: 0;}
}
@media screen and (max-width: 992px) {
  .brandTosea .sec1 .list .item { margin-top: 40px;}
  .brandTosea .sec1 .list .item p { margin-top: 10px; font-size: 16px; line-height: 32px;}
}
@media screen and (max-width: 767px) {
  .brandTosea .sec1 { padding: 30px 0;}
  .brandTosea .sec1 .list .item { margin-top: 20px; width: 49%; margin-right: 2%;}
  .brandTosea .sec1 .list .item:nth-child(2n) { margin-right: 0;}
  .brandTosea .sec1 .list .item p { margin-top: 5px; font-size: 14px; line-height: 30px; text-align: center;}
}

.brandTosea .sec2 { padding: 90px 0; background: #E4E6EB url(../img/brandtosea/sec2-bg.png) no-repeat; background-size: auto calc(100% + 14px); background-position: center -7px;}
.brandTosea .sec2 .cont { height: 894px; position: relative;}
.brandTosea .sec2 .cont img { position: absolute; box-shadow: 3px 0px 46px 0px rgba(0,0,0,0.4); transition: 0.3s;}
.brandTosea .sec2 .cont .img1 { width: 297px; left: 104px; top: 457px; z-index: 4; box-shadow: none;}
.brandTosea .sec2 .cont .img2 { width: 312px; left: 190px; top: 164px; z-index: 5;}
.brandTosea .sec2 .cont .img3 { width: 286px; left: 329px; top: 364px; z-index: 6;}
.brandTosea .sec2 .cont .img4 { width: 338px; left: 455px; top: 89px; z-index: 4;}
.brandTosea .sec2 .cont .img5 { width: 304px; left: 742px; top: 0; z-index: 3;}
.brandTosea .sec2 .cont .img6 { width: 233px; right: 386px; top: 517px; z-index: 4;}
.brandTosea .sec2 .cont .img7 { width: 272px; right: 313px; top: 205px; z-index: 2;}
.brandTosea .sec2 .cont .img8 { width: 186px; right: 137px; top: 249px; z-index: 1;}
.brandTosea .sec2 .cont img:hover { z-index: 10; transform: scale(1.1);}
@media (max-width: 1660px) {
  .brandTosea .sec2 .cont { height: 774px;}
  .brandTosea .sec2 .cont .img1 { width: 257px; left: 90px; top: 359px;}
  .brandTosea .sec2 .cont .img2 { width: 270px; left: 164px; top: 142px;}
  .brandTosea .sec2 .cont .img3 { width: 247px; left: 284px; top: 315px;}
  .brandTosea .sec2 .cont .img4 { width: 292px; left: 393px; top: 71px;}
  .brandTosea .sec2 .cont .img5 { width: 263px; left: 642px; top: 0;}
  .brandTosea .sec2 .cont .img6 { width: 201px; right: 383px; top: 447px;}
  .brandTosea .sec2 .cont .img7 { width: 253px; right: 289px; top: 177px;}
  .brandTosea .sec2 .cont .img8 { width: 161px; right: 139px; top: 215px;}
}
@media (max-width: 1460px) {
  .brandTosea .sec2 .cont { height: 680px;}
  .brandTosea .sec2 .cont .img1 { width: 226px; left: 79px; top: 348px;}
  .brandTosea .sec2 .cont .img2 { width: 237px; left: 144px; top: 125px;}
  .brandTosea .sec2 .cont .img3 { width: 217px; left: 250px; top: 277px;}
  .brandTosea .sec2 .cont .img4 { width: 257px; left: 346px; top: 68px;}
  .brandTosea .sec2 .cont .img5 { width: 231px; left: 564px; top: 0;}
  .brandTosea .sec2 .cont .img6 { width: 177px; right: 293px; top: 393px;}
  .brandTosea .sec2 .cont .img7 { width: 207px; right: 237px; top: 156px;}
  .brandTosea .sec2 .cont .img8 { width: 141px; right: 105px; top: 189px;}
}
@media screen and (max-width: 1260px) {
  .brandTosea .sec2 { padding: 60px 0;}
  .brandTosea .sec2 .cont { height: 587px;}
  .brandTosea .sec2 .cont img { box-shadow: 3px 0px 30px 0px rgba(0,0,0,0.4);}
  .brandTosea .sec2 .cont .img1 { width: 195px; left: 45px; top: 348px; box-shadow: none;}
  .brandTosea .sec2 .cont .img2 { width: 205px; left: 101px; top: 125px;}
  .brandTosea .sec2 .cont .img3 { width: 188px; left: 193px; top: 277px;}
  .brandTosea .sec2 .cont .img4 { width: 222px; left: 268px; top: 68px;}
  .brandTosea .sec2 .cont .img5 { width: 200px; left: 466px; top: 0;}
  .brandTosea .sec2 .cont .img6 { width: 153px; right: 208px; top: 393px;}
  .brandTosea .sec2 .cont .img7 { width: 179px; right: 159px; top: 156px;}
  .brandTosea .sec2 .cont .img8 { width: 122px; right: 45px; top: 189px;}
}
@media screen and (max-width: 992px) {
  .brandTosea .sec2 .cont { height: 462px;}
  .brandTosea .sec2 .cont .img1 { width: 153px; left: 20px; top: 236px;}
  .brandTosea .sec2 .cont .img2 { width: 161px; left: 64px; top: 85px;}
  .brandTosea .sec2 .cont .img3 { width: 148px; left: 136px; top: 188px;}
  .brandTosea .sec2 .cont .img4 { width: 175px; left: 201px; top: 46px;}
  .brandTosea .sec2 .cont .img5 { width: 157px; left: 349px; top: 0;}
  .brandTosea .sec2 .cont .img6 { width: 120px; right: 147px; top: 267px;}
  .brandTosea .sec2 .cont .img7 { width: 141px; right: 109px; top: 106px;}
  .brandTosea .sec2 .cont .img8 { width: 96px; right: 20px; top: 129px;}
}
@media screen and (max-width: 767px) {
  .brandTosea .sec2 { padding: 30px 0;}
  .brandTosea .sec2 .cont { height: auto;}
  .brandTosea .sec2 .cont img { position: unset; width: 100% !important; margin-top: 20px; box-shadow: none;}
  .brandTosea .sec2 .cont img:hover { z-index: 10; transform: scale(1);}
}

.brandTosea .sec3 { padding: 143px 0 261px; background-image: url(../img/brandtosea/sec3-img.png); background-size: auto;}
.brandTosea .sec3 .title { color: #FFFFFF; text-align: center;}
.brandTosea .sec3 .s-title { color: #FFFFFF; text-align: center;}
.brandTosea .sec3 .list { max-width: 1185px; margin: 0 auto;}
.brandTosea .sec3 .list p { margin-top: 80px; min-width: 218px; padding: 30px 15px; background-color: #FFFFFF; border-radius: 5px; font-size: 22px; color: #333333; line-height: 32px; text-align: center; position: relative;}
.brandTosea .sec3 .list p::after { content: ''; width: 100%; height: 9px;background: #2F97EF; border-radius: 0px 0px 5px 5px; position: absolute; left: 0; bottom: 0;}
.brandTosea .sec3 .list p:nth-of-type(1)::after { background: #2F97EF;}
.brandTosea .sec3 .list p:nth-of-type(2)::after { background: #F15C50;}
.brandTosea .sec3 .list p:nth-of-type(3)::after { background: #EEBD30;}
.brandTosea .sec3 .list p:nth-of-type(4)::after { background: #37BE73;}
@media (max-width: 1460px) {
}
@media screen and (max-width: 1260px) {
  .brandTosea .sec3 { padding: 110px 0 200px;}
  .brandTosea .sec3 .list p { min-width: 200px; margin-top: 60px; padding: 20px 15px; font-size: 18px;}
  .brandTosea .sec3 .list p::after { height: 5px;}
}
@media screen and (max-width: 992px) {
  .brandTosea .sec3 { padding: 60px 0 110px;}
  .brandTosea .sec3 .list p { min-width: 150px; margin-top: 50px; padding: 15px 15px; font-size: 16px;}
}
@media screen and (max-width: 767px) {
  .brandTosea .sec3 { padding: 30px 0 50px;}
  .brandTosea .sec3 .list p { width: 48%; max-width: 48%; margin-top: 20px; padding: 10px 15px;}
}

.brandTosea .sec4 { padding-top: 103px;}
.brandTosea .sec4 .cont { margin-top: 63px; padding: 0 26px;}
.brandTosea .sec4 .cont .img { flex: 1;}
.brandTosea .sec4 .cont .img img { max-width: 84%; transition: 0.3s;}
.brandTosea .sec4 .cont .img img:hover { transform: scale(1.1);}
.brandTosea .sec4 .cont .img:nth-of-type(1) { margin-top: 47px;}
.brandTosea .sec4 .cont .img:nth-of-type(2) { margin-top: 85px;}
.brandTosea .sec4 .cont .img:nth-of-type(3) { margin-top: 1px;}
.brandTosea .sec4 .cont .img:nth-of-type(4) { margin-top: 133px;}

.wave { margin-top: 18px; width: 100vw;height: 151px; overflow: hidden; position: relative;} 
.wave .waveTop { background-image: url(../img/brandtosea/wave.png); width: 200%;height: 100%; position: absolute; top: 0; left: 0; background-repeat: repeat no-repeat; background-position: 0 bottom; transform-origin: center bottom; -webkit-animation: moveWave 15s linear infinite; -o-animation: moveWave 15s linear infinite; animation: moveWave 15s linear infinite;} 
@media (max-width: 1460px) {
}
@media screen and (max-width: 1260px) {
  .brandTosea .sec4 { padding-top: 60px;}
  .brandTosea .sec4 .cont { margin-top: 50px;}
  .brandTosea .sec4 .cont .img img:hover { transform: scale(1);}
}
@media screen and (max-width: 992px) {
  .brandTosea .sec4 .cont .img img { max-width: 86%;}
  .brandTosea .sec4 .cont .img:nth-of-type(1) { margin-top: 37px;}
  .brandTosea .sec4 .cont .img:nth-of-type(2) { margin-top: 75px;}
  .brandTosea .sec4 .cont .img:nth-of-type(3) { margin-top: 1px;}
  .brandTosea .sec4 .cont .img:nth-of-type(4) { margin-top: 103px;}
}
@media screen and (max-width: 767px) {
  .brandTosea .sec4 { padding-top: 30px;}
  .brandTosea .sec4 .cont { margin-top: 10px;}
  .brandTosea .sec4 .cont .img { flex: unset; width: 50%; margin-top: 20px !important;}
  .brandTosea .sec4 .cont .img img { max-width: 80%;}
  .wave { height: 60px; background-size: 100% 100%;} 
  .wave .waveTop { height: 60px;}
}
@keyframes moveWave {
  0% {
    transform: translateX(0) translateZ(0) scaleY(1)
  }
  50% {
    transform: translateX(-25%) translateZ(0) scaleY(0.55)
  }
  100% {
    transform: translateX(-50%) translateZ(0) scaleY(1)
  }
}

.brandTosea .sec5 { padding: 101px 0 90px;}
.brandTosea .sec5 .list { margin-top: 14px;}
.brandTosea .sec5 .list .item { width: calc(50% - 25px);}
.brandTosea .sec5 .list .item:first-child { margin-top: 66px;}
.brandTosea .sec5 .list .item .img { overflow: hidden;}
.brandTosea .sec5 .list .item .img img { width: 100%; transition: .3s;}
.brandTosea .sec5 .list .item .img img:hover { transform: scale(1.1);}
.brandTosea .sec5 .list .item .name { margin-top: 30px; font-size: 18px; font-weight: bold; color: #333333; line-height: 28px;}
@media (max-width: 1460px) {
}
@media screen and (max-width: 1260px) {
  .brandTosea .sec5 { padding: 60px 0;}
  .brandTosea .sec5 .list .item:first-child { margin-top: 40px;}
  .brandTosea .sec5 .list .item .name { margin-top: 20px; font-size: 16px; line-height: 24px;}
}
@media screen and (max-width: 992px) {
}
@media screen and (max-width: 767px) {
  .brandTosea .sec5 { padding: 30px 0;}
  .brandTosea .sec5 .list { margin-top: 10px;}
  .brandTosea .sec5 .list .item { width: 100%; margin-top: 20px;}
  .brandTosea .sec5 .list .item:first-child { margin-top: 20px;}
  .brandTosea .sec5 .list .item .img img:hover { transform: scale(1);}
  .brandTosea .sec5 .list .item .name { margin-top: 10px; font-size: 14px; line-height: 20px;}
}

.brandTosea .sec6 { padding: 69px 0 72px; background-color: #044c83; border-bottom: 17px solid #06355E;}
.brandTosea .sec6 .title { color: #FFFFFF;}
.brandTosea .sec6 .s-title { color: #FFFFFF;}
.brandTosea .sec6 .cont .left { flex: 1; padding: 0 97px; display: flex; flex-direction: column; justify-content: center;}
.brandTosea .sec6 .cont .right { width: 905px; height: 584px; position: relative;}
.brandTosea .sec6 .cont .right img { position: absolute; transition: .3s;}
.brandTosea .sec6 .cont .right img:hover { transform: scale(1.1);}
.brandTosea .sec6 .cont .right .img1 { left: 0; top: 211px;}
.brandTosea .sec6 .cont .right .img2 { left: 110px; top: 56px;}
.brandTosea .sec6 .cont .right .img3 { left: 207px; top: 217px;}
.brandTosea .sec6 .cont .right .img4 { left: 171px; top: 337px;}
.brandTosea .sec6 .cont .right .img5 { left: 282px; top: 473px;}
.brandTosea .sec6 .cont .right .img6 { left: 332px; top: 0;}
.brandTosea .sec6 .cont .right .img7 { left: 306px; top: 123px;}
.brandTosea .sec6 .cont .right .img8 { left: 353px; top: 238px;}
.brandTosea .sec6 .cont .right .img9 { left: 409px; top: 371px;}
.brandTosea .sec6 .cont .right .img10 { left: 441px; top: 105px;}
.brandTosea .sec6 .cont .right .img11 { right: 177px; top: 28px;}
.brandTosea .sec6 .cont .right .img12 { right: 223px; top: 129px;}
.brandTosea .sec6 .cont .right .img13 { right: 221px; top: 294px;}
.brandTosea .sec6 .cont .right .img14 { right: 156px; top: 426px;}
.brandTosea .sec6 .cont .right .img15 { right: 74px; top: 252px;}
.brandTosea .sec6 .cont .right .dot1 { width: 57px; height: 57px; background: #57989B; border-radius: 50%; position: absolute; left: 57.9%; top: 500px;}
.brandTosea .sec6 .cont .right .dot2 { width: 57px; height: 57px; background: #7790B8 ; border-radius: 50%; position: absolute; right: 5.8%; top: 118px;}
@media (max-width: 1460px) {
  .brandTosea .sec6 .cont .left { padding: 0 50px;}
  .brandTosea .sec6 .cont .right { width: 66%; height: 530px;}
  .brandTosea .sec6 .cont .right .img1 { width: 116px; left: 0; top: 211px;}
  .brandTosea .sec6 .cont .right .img2 { width: 95px; left: 12%; top: 50px;}
  .brandTosea .sec6 .cont .right .img3 { width: 76px; left: 22.9%; top: 193px;}
  .brandTosea .sec6 .cont .right .img4 { width: 123px; left: 18.9%; top: 300px;}
  .brandTosea .sec6 .cont .right .img5 { width: 100px; left: 31.3%; top: 421px;}
  .brandTosea .sec6 .cont .right .img6 { width: 88px; left: 36.7%; top: 0;}
  .brandTosea .sec6 .cont .right .img7 { width: 81px; left: 33.8%; top: 109px;}
  .brandTosea .sec6 .cont .right .img8 { width: 100px; left: 39%; top: 213px;}
  .brandTosea .sec6 .cont .right .img9 { width: 110px; left: 45.4%; top: 330px;}
  .brandTosea .sec6 .cont .right .img10 { width: 79px; left: 48.7%; top: 93px;}
  .brandTosea .sec6 .cont .right .img11 { width: 85px; right: 19.6%; top: 25px;}
  .brandTosea .sec6 .cont .right .img12 { width: 123px; right: 24.8%; top: 115px;}
  .brandTosea .sec6 .cont .right .img13 { width: 111px; right: 24.4%; top: 262px;}
  .brandTosea .sec6 .cont .right .img14 { width: 117px; right: 17.4%; top: 379px;}
  .brandTosea .sec6 .cont .right .img15 { width: 109px; right: 8.3%; top: 224px;}
  .brandTosea .sec6 .cont .right .dot1 { width: 51px; height: 51px; top: 445px;}
  .brandTosea .sec6 .cont .right .dot2 { width: 51px; height: 51px; top: 105px;}
}
@media screen and (max-width: 1260px) {
  .brandTosea .sec6 { border-bottom: 10px solid #06355E;}
  .brandTosea .sec6 .cont .left { padding-left: 0;}
  .brandTosea .sec6 .cont .right { height: 435px;}
  .brandTosea .sec6 .cont .right .img1 { width: 98px; top: 149px;}
  .brandTosea .sec6 .cont .right .img2 { width: 76px; top: 40px;}
  .brandTosea .sec6 .cont .right .img3 { width: 60px; top: 121px;}
  .brandTosea .sec6 .cont .right .img4 { width: 94px; top: 238px;}
  .brandTosea .sec6 .cont .right .img5 { width: 80px; top: 353px;}
  .brandTosea .sec6 .cont .right .img6 { width: 70px; top: 0;}
  .brandTosea .sec6 .cont .right .img7 { width: 64px; top: 87px;}
  .brandTosea .sec6 .cont .right .img8 { width: 80px; top: 168px;}
  .brandTosea .sec6 .cont .right .img9 { width: 88px; top: 262px;}
  .brandTosea .sec6 .cont .right .img10 { width: 63px; top: 75px;}
  .brandTosea .sec6 .cont .right .img11 { width: 68px; top: 20px;}
  .brandTosea .sec6 .cont .right .img12 { width: 98px; top: 91px;}
  .brandTosea .sec6 .cont .right .img13 { width: 88px; top: 208px;}
  .brandTosea .sec6 .cont .right .img14 { width: 93px; top: 301px;}
  .brandTosea .sec6 .cont .right .img15 { width: 87px; top: 178px;}
  .brandTosea .sec6 .cont .right .dot1 { width: 40px; height: 40px; top: 374px;}
  .brandTosea .sec6 .cont .right .dot2 { width: 40px; height: 40px; top: 83px;}
}
@media screen and (max-width: 992px) {
  .brandTosea .sec6 { padding: 60px 0;}
  .brandTosea .sec6 .cont { flex-direction: column;}
  .brandTosea .sec6 .cont .left { padding: 0;}
  .brandTosea .sec6 .cont .right { width: 100%; margin-top: 30px;}
}
@media screen and (max-width: 767px) {
  .brandTosea .sec6 { padding: 30px 0;}
  .brandTosea .sec6 .cont .right img:hover { transform: scale(1);}
  .brandTosea .sec6 .cont .right { width: 100%; height: auto; display: flex; flex-wrap: wrap;}
  .brandTosea .sec6 .cont .right img { margin: 0 2.6%; margin-bottom: 15px; position: unset; width: 20% !important;}
  .brandTosea .sec6 .cont .right img:nth-child(4n) { margin-right: 0;}
  .brandTosea .sec6 .cont .right .dot1,.brandTosea .sec6 .cont .right .dot2 { display: none;}
}

.brandTosea .sec7 { padding: 123px 0 103px; background: #EBEBEB;}
.brandTosea .sec7 .cont .left { flex: 1; padding-right: 20px; padding-top: 47px;}
.brandTosea .sec7 .cont .left .nav-list { margin-top: 46px;}
.brandTosea .sec7 .cont .left .nav-list p { width: 149px; padding: 14px; background: #0077C8;font-size: 16px;color: #FFFFFF;line-height: 28px; margin-bottom: 4px; cursor: pointer;}
.brandTosea .sec7 .cont .left .nav-list p.active { background: #FF7E0E;}
.brandTosea .sec7 .cont .left .nav-list p:hover { background: #FF7E0E;}
.brandTosea .sec7 .cont .right { width: 74.68%;}
.brandTosea .sec7 .cont .right .img-list .item { display: none;}
.brandTosea .sec7 .cont .right .img-list .item:first-child { display: block;}
@media (max-width: 1460px) {
}
@media screen and (max-width: 1260px) {
  .brandTosea .sec7 { padding: 60px 0;}
  .brandTosea .sec7 .cont .left { padding-top: 0;}
  .brandTosea .sec7 .cont .left .nav-list p { padding: 10px 14px;}
}
@media screen and (max-width: 992px) {
  .brandTosea .sec7 .cont .left .nav-list { margin-top: 30px;}
  .brandTosea .sec7 .cont .left .nav-list p { padding: 10px 14px; font-size: 14px; line-height: 24px;}
}
@media screen and (max-width: 767px) {
  .brandTosea .sec7 { padding: 30px 0;}
  .brandTosea .sec7 .cont .left { padding-right: 0;}
  .brandTosea .sec7 .cont .left .nav-list { display: flex; margin-top: 20px;}
  .brandTosea .sec7 .cont .left .nav-list p { width: 33.33%; margin-right: 1px; text-align: center;}
  .brandTosea .sec7 .cont .right { width: 100%;}
}

.brandTosea .sec8 { padding: 220px 0 196px; background: url(../img/brandtosea/sec8-img.png) center; background-size: cover;}
.brandTosea .sec8 .title { color: #FFFFFF; text-align: center;}
.brandTosea .sec8 .s-title { color: #FFFFFF; text-align: center;}
.brandTosea .sec8 .btn-box { margin-top: 65px; justify-content: center;}
.brandTosea .sec8 .btn-box p { margin-top: 20px; margin-right: 25px; min-width: 220px; padding: 0 10px; height: 51px;border: 1px solid #FFFFFF;border-radius: 26px;font-size: 16px;color: #FFFFFF;line-height: 51px; text-align: center;}
@media (max-width: 1460px) {
}
@media screen and (max-width: 1260px) {
  .brandTosea .sec8 { padding: 100px 0;}
  .brandTosea .sec8 .btn-box { margin-top: 30px;}
}
@media screen and (max-width: 992px) {
}
@media screen and (max-width: 767px) {
  .brandTosea .sec8 { padding: 30px 0;}
  .brandTosea .sec8 .btn-box { margin-top: 0;}
  .brandTosea .sec8 .btn-box p { height: 40px; font-size: 14px; line-height: 40px;}
}

.brandTosea .sec9 { padding: 100px 0;}
.brandTosea .sec9 .list .item { margin-top: 46px; width: calc(25% - 13px);}
.brandTosea .sec9 .list .item .img { overflow: hidden;}
.brandTosea .sec9 .list .item .img img { width: 100%; transition: 0.3s;}
.brandTosea .sec9 .list .item .img img:hover { transform: scale(1.1);}
.brandTosea .sec9 .list .item .name { margin-top: 20px; font-size: 16px; font-weight: bold; color: #333333; line-height: 24px;}
@media (max-width: 1460px) {
}
@media screen and (max-width: 1260px) {
  .brandTosea .sec9 { padding: 60px 0;}
}
@media screen and (max-width: 992px) {
}
@media screen and (max-width: 767px) {
  .brandTosea .sec9 { padding: 30px 0;}
  .brandTosea .sec9 .list .item { margin-top: 20px; width: calc(50% - 5px);}
  .brandTosea .sec9 .list .item .img img:hover { transform: scale(1);}
  .brandTosea .sec9 .list .item .name { margin-top: 10px; font-size: 14px; line-height: 20px;}
}

.brand-form { padding: 111px 0; background: #0077C8;}
.brand-form .title { text-align: center;}
.brand-form .title p { margin-top: -44px; font-size: 48px; color: #FFFFFF; font-weight: normal;}
.brand-form .s-title { font-size: 16px; color: #FFFFFF; margin-top: 20px; text-align: center; line-height: 20px;}
.brand-form .form-box { margin-top: 40px; padding: 0 140px;}
.brand-form .form-box .item-box { flex: 1;}
.brand-form .form-box .item { border-bottom: 1px solid #FFFFFF; padding: 10px 0; margin-right: 20px;}
.brand-form .form-box .item img { float: left; margin-top: 6px; margin-right: 6px;}
.brand-form .form-box .item span { font-size: 16px; color: #FFFFFF; line-height: 30px;}
.brand-form .form-box .item input { width: calc(100% - 108px); font-size: 16px; color: #FFFFFF; line-height: 30px;}
.brand-form .form-box .btn { margin-left: 10px; display: inline-block; width: 141px;height: 52px;background: #FFFFFF;border-radius: 26px;font-size: 16px;color: #333333; line-height: 52px; text-align: center;}
.brand-form .form-box .btn:hover { opacity: 0.8;;}
@media (max-width: 1460px) {
  .brand-form .title img { width: 500px;}
  .brand-form .title p { margin-top: -32px; font-size: 40px; line-height: 46px;}
}
@media screen and (max-width: 1260px) {
  .brand-form .title img { width: 400px;}
  .brand-form .title p { margin-top: -32px; font-size: 30px; line-height: 36px;}
  .brand-form .form-box { padding: 0;}
  .brand-form .form-box .item { padding: 5px 0;}
  .brand-form .form-box .btn { width: 110px; height: 40px;line-height: 40px;}
}
@media screen and (max-width: 992px) {
  .brand-form { padding: 80px 0;}
  .brand-form .title img { width: 300px;}
  .brand-form .title p { margin-top: -25px; font-size: 28px; line-height: 34px;}
  .brand-form .form-box { margin-top: 30px;}
}
@media screen and (max-width: 767px) {
  .brand-form { padding: 50px 0;}
  .brand-form .title p { font-size: 24px; line-height: 30px;}
  .brand-form .s-title { font-size: 14px; margin-top: 15px;}
  .brand-form .form-box .item-box { flex: unset; width: 100%; margin-bottom: 10px;}
  .brand-form .form-box .item { width: 100%; margin-right: 0;}
  .brand-form .form-box .item img { width: 20px; height: auto;}
  .brand-form .form-box .item.item-email img { margin-top: 8px;}
  .brand-form .form-box .item span { font-size: 12px;}
  .brand-form .form-box .btn { display: block; width: 100%; margin-top: 20px; margin-left: 0; height: 36px; font-size: 14px;}
}