/* CSS Document */
/* Copyright 2017 by 3graphic.com */

.about-content{padding:102px 0 0 0}


/*INTRO*/
.intro-wrap{position:relative;display:block;width:100%;height:auto;padding:0 0 60px 0}
.intro-box{position:relative;display:block;width:90%;height:auto;max-width:820px;margin:0 auto;padding:30px 40px;border:1px solid #a1a1a1;-webkit-border-radius:30px;border-radius:30px;line-height:1.4;color:#3e3e3e;line-height:1.6}
.intro-box h3{font-family: 'Montserrat', sans-serif;color:#3e3e3e;font-size:18px;font-weight:700;}

.intro-box p{margin:10px 0;font-family:Arial, Helvetica, sans-serif;font-size:16px;color:#3e3e3e;line-height:1.8}
.intro-box strong{font-weight:bold}
.intro-box a{color:#005caa;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out}
.intro-box a:hover{color:#3ca4fb}

.intro-box li{margin:10px 0;font-family:Arial, Helvetica, sans-serif;font-size:16px;color:#3e3e3e;line-height:1.8}
.intro-box li strong{font-weight:bold}


.history-wrap{position:relative;display:block;width:100%;height:auto;padding:60px 0;background-color:#e0f3ff}

.title-box{position:relative;display:block;width:100%;height:auto;text-align:center;padding:0 5% 40px 5%}
.title-box h2{font-family: 'Montserrat', sans-serif;color:#000;font-size:24px;font-weight:700;line-height:1.4;text-transform:uppercase}


.history-box{position:relative;display:block;width:90%;height:auto;max-width:960px;margin:0 auto}

.history-item{position:relative;display:block;width:100%;height:auto;margin:0 0 30px 0;text-align:center}
.history-value{position:relative;display:inline-block;width:auto;height:auto;vertical-align:middle;text-align:left}
.money{position:relative;display:inline-block}
.history-value span {
    display: block;
    font-family: 'Montserrat', sans-serif;
    color: #590304;
    font-size: 14px;
    font-weight: 400;
}
.history-value h3 {
    font-family: 'Montserrat', sans-serif;
    color: #590304;
    font-size: 36px;
    font-weight: 700;
    word-break: break-all;
    line-height: 1.2
}
.history-value span:last-child{text-align:right}
.history-year{position:relative;display:inline-block;width:420px;height:auto;margin:0 60px;vertical-align:middle;text-align:center;}
.history-year::before{content:'';position:absolute;left:0;top:50%;width:100%;height:1px;background-color:#c2c2c2}
/*
	đỏ đậm AZA: rgb(89, 3, 4) #590304
	đỏ nhạt AZA: rgb(151, 27, 30) #971b1e
*/
.year {
    position: relative;
    display: inline-block;
    width: 160px;
    height: 160px;
    padding: 50px 40px 0 40px;
    background: -webkit-linear-gradient(0deg, rgb(89, 3, 4) 32%, rgb(151, 27, 30) 100%);
    background: linear-gradient(0deg, rgb(89, 3, 4) 32%, rgb(151, 27, 30) 100%);
    border: 5px solid #fff;
    box-shadow: 5px 5px 0 rgba(0,0,0,0.1);
    -webkit-border-radius: 50%;
    border-radius: 50%;
    text-align: left;
}
.history-year span{font-family: 'Montserrat', sans-serif;color:#fff;font-size:14px;font-weight:400;}
.history-year h3{font-family: 'Montserrat', sans-serif;color:#fff;font-size:36px;font-weight:700;line-height:1.2}
.history-note {
    position: relative;
    display: inline-block;
    width: 200px;
    height: auto;
    vertical-align: middle;
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    color: #005caa;
    line-height: 1.4;
    text-align: left
}
    .history-note li {
        font-family: 'Montserrat', sans-serif;
        font-size: 18px;
        color: #590304; 
        line-height: 1.6
    }
.history-note strong, .history-note li strong{font-weight:700}
.history-info{position:relative;display:block;width:90%;height:auto;max-width:960px;margin:0 auto;padding:40px 0 0 0;font-family:Arial, Helvetica, sans-serif;font-size:14px;color:#010101;line-height:1.6}
.history-info p{margin:10px 0;font-family:Arial, Helvetica, sans-serif;font-size:14px;color:#010101;line-height:1.6}



.flow-wrap{position:relative;display:block;width:100%;height:auto;padding:60px 0}
.flow-info{position:relative;display:block;width:90%;height:auto;max-width:960px;margin:0 auto 40px auto;font-family:Arial, Helvetica, sans-serif;font-size:16px;color:#3e3e3e;line-height:1.6}
.flow-info p{margin:10px 0;font-family:Arial, Helvetica, sans-serif;font-size:16px;color:#3e3e3e;line-height:1.6}

.flow-icon{position:relative;display:block;width:90%;height:auto;max-width:1000px;margin:0 auto}
.flow-icon ul{position:relative;display:block;text-align:center}
    .flow-icon li {
        position: relative;
        display: inline-block;
        vertical-align: top;
        width: 140px;
        height: 140px;
        margin: 0 15px;
        background: -webkit-linear-gradient(0deg, white 0%, darkred 100%);
        background: linear-gradient(0deg, white 0%, darkred 100%);
        -webkit-border-radius: 50%;
        border-radius: 50%;
        line-height: 140px;
        text-align: center;
    }
    .flow-icon li::before {
        content: '';
        position: absolute;
        left: 10px;
        top: 10px;
        width: calc(100% - 20px);
        height: calc(100% - 20px);
        background-color: #590304;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out
    }
.flow-num{position:absolute;left:0;top:25px;width:100%;font-family: 'Montserrat', sans-serif;font-weight:100;font-size:30px;color:#c1c1c1;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;line-height:1;}
.flow-icon li h3{position:relative;top:3px;display:inline-block;padding:0 20px;vertical-align:middle;font-family: 'Montserrat', sans-serif;font-weight:700;font-size:14px;line-height:1.3;color:#fff;text-transform:uppercase;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out}
.flow-but{position:absolute;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,0);cursor:pointer;z-index:1}

.flow-icon li:not(.current):hover::before, .flow-icon li.current::before{background-color:#fff}
.flow-icon li:not(.current):hover h3, .flow-icon li.current h3{color:#090909}
.flow-icon li:not(.current):hover .flow-num, .flow-icon li.current .flow-num{color:#222222}
.flow-icon li.current::after{content:'';position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}

.flow-box{position:relative;display:block;width:90%;height:auto;max-width:1000px;margin:0 auto;overflow:hidden;padding:40px 0 0 0;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out}
.flow-arrow {
    position: absolute;
    border: 20px solid #590304;
    top: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid transparent;
    margin: 0 0 0 -20px;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out
}

.flow-items{position:relative;display:block;width:auto;height:auto;overflow:hidden;}

/*
	vàng SITP: rgb(210, 164, 78) #d2a44e
	xanh dương đậm SIPT: rgb(17, 31, 68) #111f44
*/
.flow-item {
    position: relative;
    float: left;
    display: block;
    width: 100%;
    height: auto;
    overflow: hidden;
    background-color: #590304;
    padding: 30px 40px 30px 60px
}
.flow-item h3{font-family: 'Montserrat', sans-serif;font-weight:700;font-size:24px;color:#fff;text-transform:uppercase}
.flow-item h3 span{display:inline-block;font-weight:100;margin:0 4px 0 -40px}
.flow-item p{margin:10px 0;font-family:Arial, Helvetica, sans-serif;font-size:16px;color:#fff;line-height:1.6}
.flow-item p strong{font-weight:bold}


/*VALUE*/
.value-wrap {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    padding: 60px 0;
    background: -webkit-linear-gradient(0deg, rgba(254, 252, 246,0.3) 0%, rgba(151, 27, 30,1) 100%);
    background: linear-gradient(0deg, rgba(254, 252, 246,0.3) 0%, rgba(151, 27, 30, 1) 100%);
}

.value-box{position:relative;display:table;width:90%;max-width:1100px;margin:0 auto;display:table;border-spacing:30px 15px}
.value-item{position:relative;display:table-cell;width:100%;height:auto;padding:30px 40px;background-color:rgba(255,255,255,0.5);font-family: 'Montserrat', sans-serif;font-weight:400;color:#3e3e3e;}
.same-height .value-item{display:table-cell;width:50%;}

.value-item strong{font-weight:700}
.value-item h3{font-weight:700;font-size:16px;color:#3e3e3e;text-transform:uppercase}
.value-item p, .value-item li{margin:10px 0;font-family:Arial, Helvetica, sans-serif;font-size:16px;color:#3e3e3e;line-height:1.6}
.value-item p strong, .value-item li strong{font-weight:bold}
.value-inr{position: relative;display:block;width:100%;height:auto}

/*PROGRESS*/
.progress-wrap{position:relative;display:block;width:100%;height:auto;padding:0 0 120px 0;z-index:1}

.progress-pic, .progress-pic img{position:relative;display:block;width:100%;height:auto}
.progress-pic .zoom{display:none}
.progress-pic::before{content:'';position:absolute;left:0;top:0;width:100%;height:50%;z-index:1;background-color:#fff}
.progress-pic::after{content:'';position:absolute;left:0;bottom:0;width:100%;height:50%;z-index:1;background-color:#fff}


.progress-info{position:relative;display:block;width:90%;height:auto;max-width:940px;margin:0 auto;padding:40px 0;font-family:Arial, Helvetica, sans-serif;font-size:16px;color:#3e3e3e;line-height:1.6;text-align:center}
.progress-info p{margin:10px 0;font-family:Arial, Helvetica, sans-serif;font-size:16px;color:#3e3e3e;line-height:1.6}
.progress-info strong{font-weight:bold}


.progress-step{position:relative;display:block;width:90%;height:auto;max-width:940px;margin:0 auto}
.step-item{position:relative;display:block;width:100%;height:auto;margin:125px 0 0 0;padding:60px 40px 30px 40px;background-color:#edf7fa;}


.step-item h3{font-family: 'Montserrat', sans-serif;font-weight:700;font-size:24px;color:#3e3e3e;text-transform:uppercase;text-align:center}
.step-item p, .step-item li{margin:10px 0;font-family:Arial, Helvetica, sans-serif;font-size:16px;color:#3e3e3e;line-height:1.6}
.step-item a{color:#005caa;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out}
.step-item a:hover{color:#3ca4fb}


.step-num {
    position: absolute;
    left: 50%;
    top: -100px;
    display: block;
    width: 140px;
    height: 140px;
    margin: 0 0 0 -70px;
    background: -webkit-linear-gradient(0deg, white 0%, darkred 100%);
    background: linear-gradient(0deg, white 0%, darkred 100%);
    -webkit-border-radius: 50%;
    border-radius: 50%;
    line-height: 140px;
    text-align: center;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}
.step-num span{position:relative;display:inline-block;padding:0 20px;vertical-align:middle;font-family: 'Montserrat', sans-serif;font-weight:700;font-size:20px;line-height:1.4;color:#fff;text-transform:uppercase;z-index:1}

.step-num::before{content:'';position:absolute;left:50%;top:-30px;width:1px;height:30px;margin:0 0 0 -0.5px;background-color:#7e7e7e;z-index:-1}
    .step-num::after {
        content: '';
        position: absolute;
        left: 10px;
        top: 10px;
        width: calc(100% - 20px);
        height: calc(100% - 20px);
        background-color: #590304;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out
    }

.step-item:first-child .step-num::before{display:none}






/*ABOUT ANIMATION*/
.intro-box, .title-box, .history-item, .history-info, .flow-info, .flow-icon li, .flow-box, .value-item, .progress-info, .step-item{opacity:0}


.intro-box.on-show{-webkit-animation-name:scaleMidium;animation-name:scaleMidium;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-delay:0.1s;animation-delay:0.1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}


.title-box.on-show{-webkit-animation:fadeInDown;animation:fadeInDown;-webkit-animation-duration:0.7s;animation-duration:0.7s;-webkit-animation-delay:0.1s;animation-delay:0.1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}

.history-item.on-show{-webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-duration:0.7s;animation-duration:0.7s;-webkit-animation-delay:0.1s;animation-delay:0.1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}

.history-info.on-show{-webkit-animation-name:scaleMidium;animation-name:scaleMidium;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-delay:0.1s;animation-delay:0.1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}


.flow-info.on-show{-webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-duration:0.7s;animation-duration:0.7s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}

.flow-icon.on-show li{-webkit-animation:fadeIn;animation:fadeIn;-webkit-animation-duration:0.7s;animation-duration:0.7s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}
.flow-box.on-show{-webkit-animation:fadeIn;animation:fadeIn;-webkit-animation-duration:0.7s;animation-duration:0.7s;-webkit-animation-delay:0.1s;animation-delay:0.1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}

.value-item.on-show{-webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-duration:0.7s;animation-duration:0.7s;-webkit-animation-delay:0.1s;animation-delay:0.1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}
.same-height .value-item.on-show:nth-child(odd){-webkit-animation:goRight;animation:goRight;-webkit-animation-duration:0.7s;animation-duration:0.7s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}
.same-height .value-item.on-show:nth-child(even){-webkit-animation:goLeft;animation:goLeft;-webkit-animation-duration:0.7s;animation-duration:0.7s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}

.progress-pic.on-show::before, .progress-pic.on-show::after{-webkit-animation:zezoHeight;animation:zezoHeight;-webkit-animation-duration:0.7s;animation-duration:0.7s;-webkit-animation-delay:0.1s;animation-delay:0.1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}

.progress-info.on-show{-webkit-animation-name:scaleMidium;animation-name:scaleMidium;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-delay:0.1s;animation-delay:0.1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}

.step-item.on-show{-webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-duration:0.7s;animation-duration:0.7s;-webkit-animation-delay:0.1s;animation-delay:0.1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;}








@media screen and (max-width:1024px) {


/*ABOUT ANIMATION*/
.intro-box, .title-box, .history-item, .history-info, .flow-info, .flow-icon li, .flow-box, .value-item, .progress-info, .step-item{opacity:1}


.intro-box.on-show, .title-box.on-show, .history-item.on-show, .history-info.on-show, .flow-info.on-show, .flow-icon.on-show li, .flow-box.on-show, .value-item.on-show, .same-height .value-item.on-show:nth-child(odd), .same-height .value-item.on-show:nth-child(even), .progress-info.on-show, .step-item.on-show{-webkit-animation:none;animation:none;-webkit-animation-duration:0s;animation-duration:0s;-webkit-animation-delay:0s !important;animation-delay:0s !important;}



/*INTRO*/
.intro-wrap{padding: 0 0 40px 0}
.intro-box{padding:30px 5%;}
.intro-box, .intro-box p, .intro-box li{font-size: 14px;line-height: 1.6}
.intro-box h3{font-size: 15px}

.history-wrap{padding: 40px 0}
.title-box h2{font-size: 20px}
.history-value h3{font-size: 30px;}
.history-year{width:320px;}

.year{width: 140px;height: 140px;padding: 40px 0 0 32px}
.history-year span{font-size: 12px}
.history-year h3{font-size: 30px}

.history-note li{font-size: 15px}

.history-info{padding: 0}
.progress-pic::before, .progress-pic::after{display:none}



/*VALUE*/
.value-wrap{padding:40px 0}
.value-box{border-spacing:20px 12px}
.value-item h3, .value-item p, .value-item li{font-size: 14px;}





/*PROGRESS*/
.flow-wrap{padding:30px 0 0 0}
.flow-info{margin: 0 auto 20px auto}
.flow-info, .flow-info p{font-size:14px}
.flow-icon li{margin: 0 5px}
.flow-item h3{font-size: 18px}
.flow-item h3 span{margin: 0 4px 0 -28px}
.flow-item p{font-size: 14px}

.progress-wrap{padding:0 0 40px 0}
.progress-info{padding:30px 0}
.progress-info, .progress-info p{font-size: 14px}
.step-item{margin:120px 0 0 0}
.step-num span{font-size: 16px}
.step-item h3{font-size: 20px}
.step-item p, .step-item li{font-size: 14px}

    
    
    
    
}

@media screen and (max-width:900px) {

/*INTRO*/	
.history-note{width:150px}
.history-value h3{font-size:24px}
.history-year{width:300px;margin:0 30px}
.history-note li{font-size:14px}
	
	
}

@media screen and (max-width:820px) {

/*INTRO*/
.flow-icon li{width:120px;height:120px;line-height:120px;}
.flow-icon li::before{left:7px;top:7px;width: calc(100% - 14px);height: calc(100% - 14px);}
.flow-icon li h3{font-size:12px;padding:0 10px}
.flow-num{top:20px;font-size:26px;}



/*VALUE*/
.value-wrap{padding:5vw 0 0 0}
.value-box{display:block}
.same-height .value-item, .value-item{display: block;width: 100%;padding:30px 5%;margin:0 0 1px 0} 


/*PROGRESS*/
.progress-pic .zoom{display:block;top:auto;bottom:20px;right:20px}
.step-item{margin:90px 0 0 0}
.step-num{width:120px;height:120px;margin:0 0 0 -60px;line-height:120px;top:-70px}
.step-item h3{font-size:18px}
.step-num::after{left:7px;top:7px;width: calc(100% - 14px);height: calc(100% - 14px);}

    
}

@media screen and (max-width:720px) {
.title-box{padding:0 5% 20px 5%}

.history-box{width:100%;margin:0 auto 30px auto}
.history-value span{font-family:Arial, Helvetica, sans-serif;font-weight:normal;font-size:12px}
.history-value h3{font-family:Arial, Helvetica, sans-serif;font-weight:bold;font-size:19px}
.history-year{width:220px;margin:0 15px}
.history-note{width:130px;}
.history-note li{font-family:Arial, Helvetica, sans-serif;font-weight:normal;font-size:13px}
.history-note li strong{font-weight:bold}
	
	 
}

@media screen and (max-width:620px) {

/*INTRO*/
.intro-box{padding:20px 5%}
.flow-icon li{width:100px;height:100px;line-height:100px;margin:0 1px}
.flow-num{display:none}
.flow-icon li h3{top:auto;font-size:10px;padding:0 10px}




/*PROGRESS*/
.progress-info{padding:30px 0 10px 0}
.step-item{margin:60px 0 0 0;padding:60px 5% 30px 5%}
.step-num{width:100px;height:100px;line-height:100px;margin:0 0 0 -50px;top:-50px}    
.step-num span{font-size:14px}

}


@media screen and (max-width:520px) {
/*INTRO*/
.title-box h2{font-size:16px}
.intro-box h3, .flow-item h3{font-size:14px}
.intro-box, .intro-box p, .history-info p, .flow-info, .flow-info p, .flow-item p, .intro-box li{font-size:13px}

.flow-box{margin:-20px auto 0 auto}
.flow-icon{width:100%}
.flow-icon li{-webkit-transform:scale(0.8);transform:scale(0.8);margin:0 -10px}
.flow-arrow{margin:0 0 0 -50px}
.flow-item{padding:20px;}
.flow-item h3 span{display:none}

.same-height .value-item, .value-item{padding:20px 5% 10px 5%}

.history-value{max-width:100px}
.history-value span{font-size:10px}
.history-value h3{font-size:16px}

.history-year{width:160px;margin:0 15px}
.year{width:90px;height:90px;border:3px solid #fff;padding:22px 0 0 23px;box-shadow:3px 2px 0 rgba(0,0,0,0.1)}
.history-year span{font-size:10px}
.history-year h3{font-size:18px}


.history-note{width:110px}
.history-note li{font-size:11px}




/*VALUE*/
.value-item p, .value-item li{font-size:13px}

/*PROGRESS*/
.step-item h3{font-size:14px}
.progress-info, .progress-info p, .step-item p, .step-item li{font-size:13px}

}

@media screen and (max-width:390px) {
/*INTRO*/
.history-year{width:130px;margin:0 10px}


}

@media screen and (max-width:350px) {
/*INTRO*/
.flow-icon li{-webkit-transform:scale(0.7);transform:scale(0.7);margin:0 -15px}

.history-year{width:110px;margin:0 5px}
.year{width:75px;height:75px;padding:14px 0 0 18px}
.history-year h3{font-size:16px}
.history-note{width:100px;}
.history-note li{font-size:10px}

	
}



@media print {
@page { margin: 0; }

/*FORMAT STYLE TO PRINT*/
.intro-box, .title-box, .history-item, .history-info, .flow-info, .flow-icon li, .flow-box, .value-item, .progress-info, .step-item{opacity:1}
.progress-pic::before, .progress-pic::after{display:none}

.progress-pic.on-show::before, .progress-pic.on-show::after{-webkit-animation:none;animation:none;-webkit-animation-duration:0s;animation-duration:0s;-webkit-animation-delay:0s !important;animation-delay:0s !important;}
.intro-box.on-show, .title-box.on-show, .history-item.on-show, .history-info.on-show, .flow-info.on-show, .flow-icon.on-show li, .flow-box.on-show, .value-item.on-show, .same-height .value-item.on-show:nth-child(odd), .same-height .value-item.on-show:nth-child(even), .progress-info.on-show, .step-item.on-show{-webkit-animation:none;animation:none;-webkit-animation-duration:0s;animation-duration:0s;-webkit-animation-delay:0s !important;animation-delay:0s !important;}


.intro, .value, .progress{page-break-inside:avoid;page-break-after:always}

.intro{padding:80px 0 0 0}
.history-wrap{page-break-inside:avoid;page-break-after:always}

.value-wrap{padding:30px 0}
.value-box{border-spacing:16px 8px}
.value-item{padding:25px 30px}
.value-item h3{font-size:15px}
.value-item p, .value-item li{font-size:13px}

.progress-info{padding:20px 0}
.progress-step{padding:100px 0 0 0}
.step-item{margin:0 0 125px 0}

}



@media print and (orientation:portrait) {
.intro{padding:220px 0 0 0}
.value{padding:150px 0 0 0}

.history-wrap{page-break-after:auto;padding:40px 0 20px 0}
.history-box{width:100%;margin:0 auto 30px auto}
.history-value span{font-family:Arial, Helvetica, sans-serif;font-weight:normal;font-size:13px}
.history-value h3{font-family:Arial, Helvetica, sans-serif;font-weight:bold;font-size:19px}
.history-year{width:260px}
.history-note{width:130px;}
.history-note li{font-family:Arial, Helvetica, sans-serif;font-weight:normal;font-size:14px}
.history-note li strong{font-weight:bold}


.flow-icon li{width:120px;height:120px;line-height:120px;}
.flow-icon li::before{left:7px;top:7px;width: calc(100% - 14px);height: calc(100% - 14px);}
.flow-icon li h3{font-size:12px;padding:0 10px}
.flow-num{top:20px;font-size:26px;}

.progress-info{padding:80px 0 20px 0}


}