@CHARSET "utf8";

.service-area-wrapper .content-wrapper {display: flex;}

/* tab */
.design-office-graphic-wrapper {width: 880px;display: flex;flex-direction: column;}
.design-office-graphic-wrapper .design-office-graphic-tab {display: flex;justify-content: space-between;margin: 17px 0;}
.design-office-graphic-wrapper .design-office-graphic-tab .tab-item {width: 280px;height: 160px;background-color: #fff;display: flex;flex-direction: column;justify-content: center;align-items: center;cursor: pointer;text-align: center;}
.design-office-graphic-wrapper .design-office-graphic-tab .text {color: #333;font-weight: bold;font-size: 18px;}
.design-office-graphic-wrapper .design-office-graphic-tab .active-tab {border: 3px solid #5092FF;box-shadow: 1px 1px 6px 2px rgba(20, 118, 239, 0.4);}
.design-office-graphic-wrapper .design-office-graphic-content {background-color: #fff;padding: 20px;}

/* item */
.design-office-graphic-wrapper .design-office-graphic-content .content-item {display: none;}
.design-office-graphic-wrapper .design-office-graphic-content .content-item.active-item {display: block;}

/* swiper */
.carousel-with-small-pictures-wrapper {margin-top: 22px;}
.carousel-with-small-pictures-wrapper .bottom {display: flex;justify-content: center;position: relative;}
.carousel-with-small-pictures-wrapper .bottom {width: 600px;height: 799px;}
.carousel-with-small-pictures-wrapper .bottom .big-picture {width: 600px;height: 799px;border-radius: 2px;}
.carousel-with-small-pictures-wrapper .top {width: 840px;display: flex;margin-bottom: 20px;overflow-x: hidden;justify-content: center;}
.carousel-with-small-pictures-wrapper .top::-webkit-scrollbar {display: none;}
.carousel-with-small-pictures-wrapper .top .small-picture {width: 123px;height: 146px;margin: 0 10px;cursor: pointer;}
.carousel-with-small-pictures-wrapper .top .swiper-slide-thumb-active > img {border: 2px solid #BF3D45;}
.carousel-with-small-pictures-wrapper .swiper-button-prev {background: none;line-height: 40px;margin-left: 10px;display: none;}
.carousel-with-small-pictures-wrapper .swiper-button-next {background: none;line-height: 40px;margin-right: 10px;display: none;}
.carousel-with-small-pictures-wrapper .swiper-button-prev:after,
.carousel-with-small-pictures-wrapper .swiper-button-next:after {content: '';}
.carousel-with-small-pictures-wrapper .bottom:hover > .swiper-button-prev,
.carousel-with-small-pictures-wrapper .bottom:hover > .swiper-button-next {display: block;}