﻿.page_main {
    background-color: #FCFCFF;
    display: flex;
    padding: 7.29vw 8.33vw 11.98vw 8.33vw;

}

.page_main .left {
    width: 60.73vw;
    height: 42.60vw;
    margin-right: 6.25vw;
    background: #fff;
    box-shadow: 0 0.16vw 1.04vw rgb(0, 0, 0, 11%);

}


.page_main .left .left_list {
    padding: 5.21vw 0 0 5.21vw;
    display: flex;
    height: 36.46vw;
    overflow: auto;

}

.page_main .left .left_list::-webkit-scrollbar {
    height: 0.21vw;
    width: 0.21vw;
}


.page_main .left .left_list .list {
    width: 12.60vw;
    display: flex;
    flex-direction: column;
    margin-right: 3.23vw;
    position: relative;
    
}

.page_main .left .left_list .list::after {
    content: '';
    position: absolute;
    width: 0.05vw;
    height: 34.38vw;
    background-color: rgb(0, 0, 0, 11%);
    right: -0.42vw;
}

.page_main .left .left_list .list li {
    display: flex;
    align-items: center;
    padding: 1.15vw 0;
}

.page_main .left .left_list .list li .icon {
    width: 1.98vw;
    height: 1.98vw;
    
}

.page_main .left .left_list .list li .text {
    display: block;
    width: 9.38vw;
    font-size: 0.89vw;
    text-align: center;
    padding: 0 1.04vw;
}



.page_main .right {
    width: 16.20vw;
    
}

.page_main .right .top {
    display: flex;
    font-size: 1.30vw;
    justify-content: center;
    align-items: center;
    margin-bottom: 1.56vw;
    height: 4.64vw;
    color: #fff;
    background-color: #8D89BD;
}

.page_main .right .item {
    display: flex;
    align-items: center;
    flex-direction: column;
    text-align: center;
    width: 100%;
    height: 15.73vw;
    box-shadow: 0 0.16vw 1.04vw rgba(0, 0, 0, 0.09);
    
    margin-bottom: 1.25vw;
}

.page_main .right .item .i_baner {
    width: 14.43vw;
    height: 9.95vw;
    margin: 0.99vw;
}

.page_main .right .item .item_line {
    font-size: 1.04vw;
}


@media (max-width: 1680px) {}

@media (max-width: 1480px) {}

@media (max-width: 1440px) {}

@media (max-width: 1366px) {}

@media (max-width: 1280px) {}


@media (max-width: 1024px) {
    .page_main{padding:40px 4%;display:block;}
    .page_main .left{width:100%;}
    .page_main .right{width:100%;}
    .page_main .left .left_list .list{width:50%;}
    .page_main .left .left_list .list li{width:100%;}
    .page_main .left .left_list .list li .icon{width:30px;height:30px;display:none;}
    .page_main .left .left_list .list li .text{font-size:16px;width:170px;}
    .page_main .right .top{height:auto;font-size:18px;padding:20px;}
    .page_main .right .item{height:auto;}
    .page_main .right .item .i_baner{width:100%;height:200px;}
    .page_main .right .item .item_line{font-size:16px;padding:10px 0;}
    .page_main .left .left_list{padding: 5.21vw;}
    .page_main .left .left_list .list{width: 50%;margin-right: 0;}
    .page_main .left .left_list .list li{padding: 10px;width: 100%;}
    .page_main .left .left_list{height: auto!important;}
    .page_main .left{height: auto!important;}
    .page_main .left .left_list .list::after{height:calc(100% - 5.21vw);}
    .page_main .left .left_list .list:last-child::after{display:none;}
}

@media (max-width: 960px) {}

@media (max-width: 768px) {}

@media (max-width: 414px) {}

@media (max-width: 375px) {}

@media (max-width: 320px) {}