@charset"utf-8"; .ace-store-top { background: #c1c1c1 url("../img/store/store-bg.webp") center center/cover no-repeat; padding: 30px 0; color: #000; font-size: 18px } .ace-store-top h1 { font-size: 2.5rem; font-weight: 400; margin-bottom: 15px; color: #fff } .ace-store-top p { margin-bottom: 5px; color: #fff } .gray-bg { background-color: #f5f5f5; padding: 40px 0; margin-top: 40px } .store-main { padding: 40px 0 } .store-main .tab-pane .item { width: 22%; margin: 20px 1.5%; float: left; min-height: 320px } .store-main .tab-pane .item.first { background: #041E42; color: #fff; padding: 15px } .store-main h2 { text-align: center; font-weight: 400 } .store-main .tab-pane .item h2 { font-weight: 400; text-align: left } .store-main .tab-pane .item .describe { font-size: 16px } .store-main .tab-pane .item ul { padding-left: 0 } .store-main .tab-pane .item ul li { padding: 10px 0 } .store-main .tab-pane .item ul li a { color: #FFF } .store-main .tab-pane .item ul li.active a { color: #0071d1 } .store-main .tab-pane .item .img { position: relative; height: 190px } .store-main .tab-pane .item .img img { max-width: 100% } .store-main .tab-pane .item .img span { display: block; position: absolute; left: 15px; bottom: -15px } .store-main .tab-pane .item .img span img { width: 50px } .store-main .tab-pane .item .title { font-size: 20px; padding-top: 30px } .store-main .tab-pane .item .info { margin: 10px 0; font-size: 14px; color: #666 } .store-main .tab-pane .item .flex-btn { display: flex; flex-direction: row; justify-content: space-between; text-transform: uppercase; line-height: 37px; } .store-main .tab-pane .item .flex-btn .btn { padding: 6px 15px } .store-main .choose-box ul { padding-left: 0 } .store-main .choose-box ul li { float: left; width: 31%; margin-left: 2%; text-align: center; padding: 15px; font-size: 14px; color: #666 } .store-main .choose-box ul li .img { display: block; margin-bottom: 10px; background-position: center; height: 72px } .store-main .choose-box ul li .title { font-size: 18px; color: #333; margin-bottom: 5px } .store-main .choose-box ul li p { padding: 0 20px } .store-main .support-service { background: #c1c1c1 url("../img/store/sp-banner.webp") center center/cover no-repeat; padding: 40px 20px; margin-top: 40px } .store-main .support-service .info { width: 50%; color: #fff; font-size: 20px; font-weight: 300; text-align: center } .store-main .support-service .info p { margin-bottom: 0 } .store-main .support-service .info .title { font-size: 42px; padding: 10px 0 } .tab-content>.tab-pane { display: none } .tab-content>.active { display: block } .store-main .choose-box ul li .img.img-a { background-image: url("../img/store/icon-time.svg"); background-repeat: no-repeat } .store-main .choose-box ul li .img.img-b { background-image: url("../img/store/icon-users.svg"); background-repeat: no-repeat } .store-main .choose-box ul li .img.img-c { background-image: url("../img/store/icon-flag.svg"); background-repeat: no-repeat } .store-main .choose-box ul li .img.img-d { background-image: url("../img/store/icon-safe.svg"); background-repeat: no-repeat } .store-main .choose-box ul li .img.img-e { background-image: url("../img/store/icon-money.svg"); background-repeat: no-repeat } .store-main .choose-box ul li .img.img-f { background-image: url("../img/store/icon-email.svg"); background-repeat: no-repeat } @media (min-width: 1300px) { .store-main .tab-pane .item { width: 30% } } @media (max-width: 960px) { .ace-store-top { margin-top: 40px } .ace-store-top h1 { font-size: 2.2rem } .store-main h2 { font-size: 1.8rem } .store-main .tab-pane .item h2 { font-size: 1.6rem } .store-main .tab-pane .item .title { font-size: 18px } .store-main .tab-pane .item { width: 30% } .store-main .tab-pane .item .flex-btn .btn { padding: 6px 5px } .store-main .support-service .info .title { font-size: 30px } } @media (max-width: 768px) { .store-main { padding: 20px 0 } .store-main .tab-pane .item { float: none; width: 100%; margin: 0 0 25px; min-height: auto } .store-main .choose-box ul li { float: none; width: 100% } .store-main .support-service { background-position: left } .store-main .support-service .info { width: 100% } .store-main .tab-pane .item .flex-btn { justify-content: flex-end } .store-main .tab-pane .item .flex-btn .btn { margin-left: 15px } .store-main .tab-pane .item .img { position: relative; height: 185px } }