.count {
    /* padding: 260px 20px 100px; */
    padding: 0px 20px 100px;
    width: 1340px;
    margin: 0 auto;
}
.count_title {
    margin: 0 0 28px;
    font: 700 40px/45px 'Formular', sans-serif;
    color: #000;
}
.count_inner {
    padding: 20px;
    background: #F5F8FC;
    border-radius: 5px;
    margin: 0 auto 40px;
}
.count_type {
    display: flex;
    align-items: center;
    margin: 0 0 18px;
    position: relative;
}
.count_type-item {
    background: #fff;
    padding: 30px 40px 38px;
    border-radius: 5px
}
.count_subtitle {
    color: #000000;
    margin: 0 0 30px;
    font: 700 18px/22px 'Formular', sans-serif;
}
.count_type-inner {
    display: flex;
    align-items: center;
}
.count_type-inner .base_dropdown {
    margin: 0 10px 0 0;
}
.count_type-name {
    color: #566879;
    font: 400 14px/17px 'Formular', sans-serif;
    position: absolute;
    top: 10px;
    left: 20px;
    z-index: 0;
}
.count_type-head {
    color: #191717;
    font: 700 19px/23px 'Formular', sans-serif;
    width: 174px;
    border-radius: 5px;
    background: #FFFFFF;
    border: 1px solid #F5F8FC;
    height: 64px;
    padding: 10px 0 10px 20px;
    position: relative;
    align-items: flex-end;
}
.count_type-head:before {
    content: '';
    width: 37px;
    height: 62px;
    background: #F5F8FC;
    border-radius: 0 4px 4px 0;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.count_type-head:after {
    right: 10px;
}
.count_type-inner .base_dropdown-content {
    top: 64px;
}
.count_type-arrow {
    width: 120px;
    height: 120px;
    position: absolute;
    left: 49%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.count_type-arrow:before,
.count_type-arrow:after {
    content: '';
    position: absolute;
    width: 125px;
    right: 0;
    border-radius: 20px;
    border-bottom: 24px solid #F5F8FC;
}
.count_type-arrow:before {
    top: 0;
    transform: rotate(65deg);
}
.count_type-arrow:after {
    bottom: 0;
    transform: rotate(-65deg);
    border-bottom: 24px solid #F5F8FC;
}
.count_type-btn {
    margin: 0 auto 45px;
    padding: 19px 88px;
    text-transform: uppercase;
}
.count_result-title {
    text-transform: uppercase;
    margin: 0 0 18px;
    text-align: center;
    color: #000000;
    font: 700 18px/22px 'Formular', sans-serif;
}
.count_result {
    display: flex;
    margin: 0 0 15px;
}
.count_result-size {
    margin: 0 15px 0 0;
}
.count_result-size-inner {
    background: #FFFFFF;
    border-radius: 5px;
    padding: 0 30px;
    margin: 0 0 15px;
    display: flex;
}
.count_result-size-col {
    padding: 25px 0;
    border-right: thin solid #E2E9F2;
}
.count_result-size-col:first-child {
    width: 295px;
}
.count_result-size-col:nth-child(2),
.count_result-size-col:nth-child(3) {
    width: 160px;
}
.count_result-size-col:nth-child(4) {
    width: 280px;
    border: none;
}
.count_result-size-title {
    color: #000000;
    margin: 0 0 20px;
    font: 700 18px/22px 'Formular', sans-serif;
}
.count_result-size-title span {
    color: #566879;
    font-weight: 400;
}
.count_result-size-txt {
    padding: 10px 18px;
    color: #191717;
    font: 400 16px/20px 'Formular', sans-serif;
}
.count_result-size-txt:nth-child(even) {
    background: #F5F8FC;
}
.count_result-size-col:first-child .count_result-size-txt:nth-child(even) {
    border-radius: 5px 0 0 5px;
}
.count_result-size-col:not(:first-child) {
    text-align: center;
}
.count_result-size-change {
    background: #fff;
    border-radius: 5px;
    padding: 6px 6px 6px 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #191717;
    font: 700 18px/22px 'Formular', sans-serif;
}
.count_result-size-diff {
    color: #191717;
    width: 310px;
    padding: 18px;
    font: 400 16px/20px 'Formular', sans-serif;
    background: #F5F8FC;
    border-radius: 5px;
    text-align: center;
}
.count_result-speed {
    background: #fff;
    border-radius: 5px;
    padding: 26px 28px;
    text-align: center;
}
.count_result-speed-title {
    font: 700 18px/22px 'Formular', sans-serif;
    margin: 0 0 20px;
    color: #000;
}
.count_result-speed-subtitle {
    color: #566879;
    margin: 0 0 10px;
    font: 400 14px/17px 'Formular', sans-serif;
}
.count_result-speed-txt {
    color: #000000;
    font: 700 20px/28px 'Formular', sans-serif;
}
.count_result-quantity {
    margin: 0 auto 27px;
    width: 235px;
}
.count_result-speed-hr {
    margin: 20px auto 16px;
    width: 235px;
    border-bottom: thin solid #E2E9F2;
}
.count_attention {
    background: #FFFFFF;
    border-radius: 5px;
    display: flex;
    align-items: center;
    padding: 10px 35px;
}
.count_attention-title {
    font: 700 18px/22px 'Formular', sans-serif;
    margin: 0 30px 0 0;
}
.count_attention-txt {
    padding: 5px 0 5px 30px;
    border-left: thin solid #F5F8FC;
    color: #566879;
    font: 400 14px/22px 'Formular', sans-serif;
}
.count_info {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin: 0 auto 50px;
}
.count_info-description {
    max-width: 746px;
    width: 100%;
    margin: 0 112px 0 0;
}
.count_info-txt {
    color: #566879;
    font: 400 19px/30px 'Formular', sans-serif;
    margin: 0 0 40px;
}
.count_info-inner {
    background: #F5F8FC;
    border-radius: 5px;
    border: 1px solid #E2E9F2;
    padding: 30px;
    color: #566879;
    font: 400 16px/26px 'Formular', sans-serif;
}
.count_info-title {
    text-transform: uppercase;
    color: #000000;
    margin: 0 0 10px;
    font: 700 18px/22px 'Formular', sans-serif;
}
.count_image {
    width: 420px;
    height: 420px;
    position: relative;
}
.count_image img {
    width: 100%;
    height: 100%;
}
.count_image-txt {
    display: flex;
    align-items: center;
    padding: 4px 12px 4px 19px;
    background: #FFFFFF;
    border: 1px solid #E2E9F2;
    border-radius: 37px;
    color: #566879;
    text-transform: uppercase;
    font: 700 14px/22px 'Formular', sans-serif;
    position: absolute;
}
.count_image-txt:first-child {
    top: 56px;
    left: -30px;
}
.count_image-txt:nth-child(2) {
    top: 186px;
    left: -69px;
}
.count_image-txt:last-child {
    bottom: 60px;
    left: -62px;
}
.count_image-txt:after {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #E31E24;
    margin: 0 0 0 8px;
}
.count_total {
    display: flex;
    align-items: center;
}
.count_total-item {
    background: #FFFFFF;
    border-radius: 5px;
    padding: 34px 5px 25px;
    filter: drop-shadow(0 5px 21px rgba(0, 0, 0, 0.08));
}
.count_total-item:first-child {
    margin: 0 20px 0 0;
}
.count_total-title {
    margin: 0 0 26px;
    text-align: center;
    text-transform: uppercase;
    font: 700 18px/22px 'Formular', sans-serif;
}
.count_total-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 33px;
}
.count_total-point {
    display: flex;
    align-items: center;
    color: #566879;
    padding: 10px 50px;
    font: 400 14px/14px 'Formular', sans-serif;
}
.count_total-point span {
    display: block;
    margin: 0 0 0 5px;
    color: #191717;
    font: 700 19px/19px 'Formular', sans-serif;
}
.count_total-point:nth-child(2) {
    border-left: thin solid #E2E9F2;
    border-right: thin solid #E2E9F2;
}
.count_total-btn {
    max-width: 520px;
    width: 100%;
    margin: 0 auto;
}
.count_result-size-title br {
    display: none;
}
@media(max-width: 1340px) {
    .count {
        width: auto;
    }
    .count_type {
        flex-direction: column;
        justify-content: flex-start;
    }
    .count_type-arrow {
        position: unset;
        width: 100%;
        height: 10px;
    }
    .count_type-item {
        width: 100%;
    }
    .count_type-arrow:before, .count_type-arrow:after {
        display: none;
    }
    .count_type-inner .base_dropdown {
        width: 33%;
    }
    .count_type-head {
        width: 100%;
    }
    .count_result {
        flex-direction: column;
    }
    .count_result-size {
        margin: 0 0 10px;
    }
    .count_info {
        flex-direction: column;
    }
    .count_info-description {
        max-width: 100%;
        margin: 0 auto 30px;
    }
    .count_image {
        margin: 0 auto;
    }
    .count_total-item {
        width: 100%;
    }
    .count_total-inner {
        flex-direction: column;
    }
    .count_total-point {
        padding: 13px 20px;
    }
    .count_total-point:nth-child(2) {
        border: none;
        border-top: thin solid #E2E9F2;
        border-bottom: thin solid #E2E9F2;
    }
}
@media(max-width: 1024px) {
    .count {
        padding: 80px 20px;
    }
}
@media (max-width: 931px) {
    .count_title {
        font-size: 20px;
        line-height: 24px;
        margin: 0 0 18px;
    }
    .count_subtitle {
        font-size: 16px;
    }
    .count_type-item {
        padding: 16px 12px;
    }
    .count_result-size-inner {
        padding: 0 18px;
    }
    .count_result-size-col {
        padding: 15px 0;
    }
    .count_result-size-col:first-child {
        width: 247px;
    }
    .count_result-size-col:nth-child(2),
    .count_result-size-col:nth-child(3) {
        width: 99px;
    }
    .count_result-size-col:nth-child(4) {
        width: 136px;
    }
    .count_result-size-title {
        font-size: 12px;
        line-height: 15px;
        height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .count_result-size-title br {
        display: block;
    }
    .count_result-size-col:first-child .count_result-size-title {
        padding: 0 0 0 30px;
        justify-content: flex-start;
    }
    .count_result-size-col:last-child .count_result-size-title {
        flex-direction: column;
        justify-content: center;
    }
    .count_result-size-txt {
        font-size: 12px;
        line-height: 15px;
        padding: 8px 30px;
    }
    .count_total-title {
        text-transform: unset;
    }
}
@media(max-width: 700px) {
    /* .count_result-size-change { */
        /* display: none; */
    /* } */
    .count_result-size-inner {
        width: 620px;
    }
    .count_result-size {
        overflow-x: scroll;
    }
    .count {
        background: #F5F8FC;
        padding: 80px 0 0;
    }
    .count_inner {
        background: transparent;
        padding: 0;
    }
    .count_title,
    .count_type {
        padding: 0 20px;
    }
    .count_result-size {
        margin: 0 0 10px 20px;
    }
    .count_result-speed {
        margin: 0 20px;
    }
    .count_attention {
        flex-direction: column;
        margin: 0 20px;
        padding: 15px;
    }
    .count_attention-txt {
        border-top: thin solid #F5F8FC;
        border-left: none;
        padding: 10px 0 0;
    }
    .count_info {
        background: #fff;
        padding: 17px 20px 40px;
        margin: 0 auto;
    }
    .count_info-txt {
        font-size: 16px;
        line-height: 25px;
        margin: 0;
    }
    .count_info-inner {
        display: none;
    }
    .count_image {
        width: 260px;
        height: auto;
        margin: 0 0 0 auto;
    }
    .count_image-txt {
        font-size: 12px;
    }
    .count_image-txt:first-child {
        top: 32px;
    }
    .count_image-txt:nth-child(2) {
        top: 110px;
        left: -43px;
    }
    .count_image-txt:last-child {
        bottom: 36px;
        left: -36px;
    }
    .count_total {
        padding: 0 20px 40px;
        background: #fff;
    }
    .count_total-title {
        font-size: 14px;
        line-height: 17px;
    }
    .count_total-item {
        padding: 15px 5px 5px;
    }
    .count_total-item:first-child {
        margin: 0 10px 0 0;
    }
    .count_total-point {
        font-size: 12px;
        padding: 13px 8px;
    }
    .count_total-point span {
        font-size: 16px;
    }
    .count_total-btn {
        font-size: 14px;
        padding: 9px 0;
    }

}
@media(max-width: 540px) {
    .count_type-inner .base_dropdown:first-child {
        width: 100%;
        margin: 0 0 10px;
    }
    .count_type-inner {
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .count_type-inner .base_dropdown {
        width: 48%;
    }
    .count_type-inner .base_dropdown:last-child {
        margin: 0;
    }
    .count_type-head {
        padding: 10px 0 10px 12px;
    }
    .count_type-name {
        left: 12px;
        font-size: 12px;
    }
    .count_result-title {
        text-align: left;
        padding: 0 20px;
    }
}
