@charset "UTF-8"; /* 水平间距 */ /* 水平间距 */ .content { display: flex; flex-direction: column; width: 100vw; height: 100vh; background-color: var(--f9Color); } .content .one { display: flex; align-items: center; background: repeating-linear-gradient(to bottom, var(--f3CColor), var(--mainColor)); padding: 5vw; } .content .one .logo { width: 15vw; height: 15vw; border-radius: 90px; } .content .one .one_1 { display: flex; flex-direction: column; padding: 0 2vw; } .content .one .one_1 .name { margin: 0 0 1vw 0; font-size: var(--font16Size); } .content .one .one_1 .gender { color: var(--f85Color); font-size: var(--font13Size); } .content .two { display: flex; flex-direction: column; padding: 2vw; margin: 2vw 2vw 0 2vw; border-radius: 10px; background-color: var(--mainColor); } .content .two .two_1 { display: flex; justify-content: space-between; padding: 2vw 0; border-bottom: 1px solid var(--f9Color); } .content .two .two_1 .left { font-weight: 600; font-size: var(--font14Size); } .content .two .two_1 .right { display: flex; align-items: center; font-size: var(--font12Size); color: var(--f99Color); } .content .two .two_2 { display: flex; justify-content: space-between; padding: 2vw 0; } .content .two .two_2 .list { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } .content .two .two_2 .list .icon .iconfont { font-size: 25px; } .content .two .two_2 .list .title { display: inline-block; margin: 2vw 0 0 0; font-size: var(--font12Size); } .content .thr { display: flex; flex-direction: column; margin: 2vw; border-radius: 10px; background-color: var(--mainColor); } .content .thr .list { display: flex; justify-content: space-between; padding: 2vw; border-bottom: 1px solid var(--f9Color); } .content .thr .list .left { display: flex; align-items: center; font-size: var(--font12Size); } .content .thr .list .left .icon { padding: 0 2vw 0 0; } .content .thr .list .left .icon .iconfont { color: var(--f3CColor); font-size: 20px; } .content .thr .list .left .title { display: inline-block; font-size: var(--font12Size); } .content .thr .list .right { display: flex; align-items: center; font-size: var(--font12Size); color: var(--f99Color); }