/* #HLX-3255 by LJ 2020-12-17 */
/* reset */
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; outline: 0; } 
html { font-size: 5.3334vw; /* 20px = 1rem; */ }
@media screen and (min-width: 750px){
    html { font-size: 40px; }
}
html,body { height: 100%; }
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,input,textarea,p,th,td,button { margin:0; padding:0; }
body { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: #333; font-size: 0.8rem; line-height: 1.1rem; max-width: 750px; margin: auto; } 
input, textarea, select, button, h1, h2, h3, h4, h5, h6 { font-size: 100%; font-family: inherit; }
input, textarea, select, button {
    border: none; background: none; resize: none; border-radius: 0; 
    -webkit-appearance: none; -moz-appearance: none; appearance: none; 
}
input::placeholder, textarea::placeholder { color: #bbb; }
input:-webkit-autofill, 
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active { 
    box-shadow: 0 0 0px 1000px white inset !important;
}
em, i { font-style:normal; }
table { border-collapse: collapse; border-spacing: 0; width: 100%; text-align: center; }
img { border: 0; vertical-align: middle; }
ol, ul, li { list-style: none; }
a { color: #333; text-decoration: none; }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: ""; clear: both; height: 0; line-height: 0; }

.none { display: none; }
.pt20 { padding-top: 1rem; }
.pt30 { padding-top: 1.5rem; }
.mb4 { margin-bottom: .2rem; }
.mb8 { margin-bottom: .4rem; }
.mb12 { margin-bottom: .6rem; }
.mb20 { margin-bottom: 1rem; }
.mb32 { margin-bottom: 1.6rem; }
.mlr4 { margin-right: .2rem; margin-left: .2rem; }
.mr4 { margin-right: .2rem; }
.ml4 { margin-left: .2rem; }
.ect { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tc { text-align: center; }
.vm-top { display: inline-block; vertical-align: top; }

@font-face {
    font-family: "DIN-Bold";
    src: url("../../../../ui_v1/fonts/numfont/TG-TYPE-Bold.eot") format("embedded-opentype"),url("../../../../ui_v1/fonts/numfont/TG-TYPE-Bold.woff") format("woff"),url("../../../../ui_v1/fonts/numfont/TG-TYPE-Bold.ttf") format("truetype"),url("../../../../ui_v1/fonts/numfont/TG-TYPE-Bold.svg") format("svg");
    font-weight: normal;
    font-style: normal
}

/* popup-msg */
.popup-msg { 
    position: fixed; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); z-index: 1002; transition: all .1s linear;
    padding: 1rem; background-color: rgba(0,0,0,.8); border-radius: 0.5rem; line-height: 1.1rem; width: 9rem; font-size: 0.7rem; color: #fff; text-align: center; }

.page-box { position: relative; background-color: #2A1B50; height: 100%; }

/* loading-page */
.loading-page { position: absolute; top: 0; right: 0; bottom: 0; left: 0; text-align: center; color: #8992D7; line-height: 1.2rem; }
.loading-bg { width: 18.75rem; height: 7.35rem; background: url('../../pic/activity/yearreport_2021/loading.gif') no-repeat; background-size: 100% auto; }
.loading-page .txt { margin-top: .2rem; font-size: .8rem; }
.loading-page .num { margin-top: .6rem; font-size: 1rem; }
.loading-page .conts { position: absolute; top: 50%; transform: translateY(-75%); }

/* slide-index */
.slide-index { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url('../../pic/activity/yearreport_2021/bg-index.gif') center center no-repeat; background-size: 100% auto; text-align: center; z-index: -1; opacity: 0; transition: opacity ease 2s; }
.slide-index.show { z-index: 3; opacity: 1; }
.slide-index .top-conts { position: absolute; top: .9rem; right: 1rem; left: 1rem; }
.slide-index .top-conts .logo { float: left; margin-top: .1rem; width: 3.45rem; height: 1.2rem; background: url('../../pic/activity/yearreport_2021/logo01.png') no-repeat; background-size: 100% 100%; }
.slide-index .top-conts .info { float: right; line-height: 1.4rem; font-size: .7rem; color: #fff; max-width: 10rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.slide-index .top-conts .info img { float: left; width: 1.4rem; height: 1.4rem; border-radius: 50%; margin-right: .5rem; }
.slide-index .bottom-conts { position: absolute; right: 0; bottom: 1rem; left: 0; }
.slide-index .bottom-conts .link { font-size: .65rem; line-height: 1rem; color: #D8D6FE; }
.slide-index .bottom-conts .link .ico-more { display: inline-block; vertical-align: middle; margin: -.1rem 0 0 .15rem; width: .65rem; height: .65rem; background: url('../../pic/activity/yearreport_2021/ico-more.png') no-repeat; background-size: 100% 100%; }
.slide-index .bottom-conts .txt { margin-top: .25rem; color: #8582BD; font-size: .6rem; line-height: 1rem; }
.slide-index .center-conts { position: absolute; bottom: 50%; right: 0; left: 0; transform: translateY(50%); margin-bottom: -3rem; }
.slide-index .center-conts .txt { font-size: .6rem; line-height: 1.3rem; color: #D8D6FE; }
.slide-index .center-conts .btn-start { margin: .7rem auto 0; width: 5.15rem; height: 5.15rem; background: url('../../pic/activity/yearreport_2021/btn-start.png') no-repeat; background-size: 100% 100%; }
.slide-index .center-conts .report { font-size: .75rem; line-height: 1; color: #fff; }
.slide-index .center-conts .agree { margin-top: .3rem; font-size: .6rem; color: #8582BD; line-height: 1rem; }
.slide-index .center-conts .agree .ico-check { display: inline-block; vertical-align: middle; margin: -.1rem .25rem 0 0; width: .55rem; height: .55rem; background: url('../../pic/activity/yearreport_2021/ico-select.png') no-repeat; background-size: 100% 100%; }
.slide-index .is-this .center-conts .agree .ico-check { background-image: url('../../pic/activity/yearreport_2021/ico-select-active.png'); }

/* yeardata-swiper */
.yeardata-swiper { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; background-color: #291946; opacity: 0; transition: opacity ease 2s; }
.yeardata-swiper.show { z-index: 3; opacity: 1; }
    /* bottom-bar */
.yeardata-swiper .bottom-bar { position: absolute; right: 0; bottom: 0; left: 0; z-index: 1; padding: 1rem 1rem .8rem; }
.yeardata-swiper .bottom-bar:before { content: ''; position: absolute; right: 0; bottom: 0; left: 0; height: 6.9rem; background: url('../../pic/activity/yearreport_2021/bg-footer.png') no-repeat; background-size: 100% 100%; z-index: -1; }
.yeardata-swiper .bottom-bar .logo { width: 3.4rem; height: 1.6rem; float: left; margin-top: .5rem; }
.yeardata-swiper .bottom-bar .ecode { float: right; }
.yeardata-swiper .bottom-bar .ecode img { float: right; width: 2.4rem; height: 2.4rem; margin-left: .5rem; }
.yeardata-swiper .bottom-bar .ecode .txt { float: left; font-size: .6rem; color: #8582BD; line-height: 1rem; margin-top: .2rem; }
.yeardata-swiper .bottom-bar .arrow { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); margin-left: -1.5rem; width: 1.35rem; height: .7rem; background: url('../../pic/activity/yearreport_2021/ico-next.png') no-repeat; background-size: 100% 100%; -webkit-animation: slideTip linear 3s infinite; animation: slideTip linear 3s infinite; }
@-webkit-keyframes slideTip {
	0% { -webkit-transform: translateY(0); transform: translateY(0); }
	50% { -webkit-transform: translateY(-50%); transform: translateY(-50%); }
	100% { -webkit-transform: translateY(0); transform: translateY(0); }
}
@keyframes slideTip {
	0% { -webkit-transform: translateY(0); transform: translateY(0); }
	50% { -webkit-transform: translateY(-50%); transform: translateY(-50%); }
	100% { -webkit-transform: translateY(0); transform: translateY(0); }
}
/**/
.yeardata-swiper .swiper-slide { background-position: center; background-repeat: no-repeat; background-size: 100% auto; background-color: #291946; }
.yeardata-swiper .k1 { background-image: url('../../pic/activity/yearreport_2021/bg01.png'); }
.yeardata-swiper .k2 { background-image: url('../../pic/activity/yearreport_2021/bg02.png'); }
.yeardata-swiper .k3 { background-image: url('../../pic/activity/yearreport_2021/bg03.png'); }
.yeardata-swiper .k4 { background-image: url('../../pic/activity/yearreport_2021/bg04.png'); }
.yeardata-swiper .k5 { background-image: url('../../pic/activity/yearreport_2021/bg05.png'); }
.yeardata-swiper .k6 { background-image: url('../../pic/activity/yearreport_2021/bg06.png'); }
.yeardata-swiper .k7 { background-image: url('../../pic/activity/yearreport_2021/bg07.png'); }
.yeardata-swiper .k8 { background-image: url('../../pic/activity/yearreport_2021/bg08.png'); }

/* vertical-txt */
.vertical-txt li { width: .7rem; font-size: .7rem; color: #D8D6FE; line-height: 1; float: left; text-align: center; }
.vertical-txt li span { display: inline-block; margin: .5rem 0; }
.vertical-txt.left { position: absolute; top: 50%; left: .5rem; margin-top: -7rem; }
.vertical-txt.left li { margin-left: 1rem; }
.vertical-txt.right { position: absolute; top: 50%; right: .4rem; margin-top: -8rem; }
.vertical-txt.right li { margin-right: 1rem; }
.k3 .vertical-txt.right { margin-top: -4rem; right: .3rem; }

/* */
.data-txt-f13 { font-size: .65rem; color: #fff; line-height: 1.2rem; }
.data-txt-f13 .num { font-size: .9rem; font-family: "DIN-Bold"; color: #FFC27B; position: relative; top: 1px; }
.data-txt-f15 { font-size: .75rem; color: #fff; line-height: 1.4rem; }
.data-txt-f15 .num { font-size: 1.2rem; font-family: "DIN-Bold"; color: #FFC27B; position: relative; top: 1px; }
.data-txt-f14 { font-size: .65rem; color: #D8D6FE; line-height: 1.2rem; }

/* data-txt-bar */
.data-txt-bar { position: absolute; top: 50%; }
.k1 .data-txt-bar { margin-top: -11rem; left: 1.8rem; }
.k2 .data-txt-bar { margin-top: -13rem; right: 2.4rem; }
.k3 .data-txt-bar { margin-top: -13rem; left: 1.6rem; }
.k4 .data-txt-bar { margin-top: -13rem; right: 1.2rem; }
.k5 .data-txt-bar, .k6 .data-txt-bar { transform: translateY(-50%); left: 1.6rem; right: 1.6rem; margin-top: -3.5rem; }
.k7 .data-txt-bar { margin-top: 10rem; right: 1rem; left: 1rem; text-align: center; }


/* star-bar */
.star-bar { position: absolute; top: 50%; right: 0; left: 0; height: 9.7rem; margin-top: 1rem; }
.star-bar .star1 { position: absolute; top: 0; left: 50%; margin-left: -1.4rem; width: 3.35rem; height: 2.1rem; background: url('../../pic/activity/yearreport_2021/star1.png') no-repeat; background-size: 100% 100%; }
.star-bar .star-line1 { position: absolute; top: .7rem; left: 50%; margin-left: 1.4rem; width: 4.55rem; height: 2.45rem; background: url('../../pic/activity/yearreport_2021/star-line1.png') no-repeat; background-size: 100% 100%; }
.star-bar .star2 { position: absolute; top: 3.05rem; left: 50%; margin-left: 4.35rem; width: 3.75rem; height: 2.35rem; background: url('../../pic/activity/yearreport_2021/star2.png') no-repeat; background-size: 100% 100%; }
.star-bar .star-line2 { position: absolute; top: 4.75rem; left: 50%; margin-left: -1.85rem; width: 7.15rem; height: 2rem; background: url('../../pic/activity/yearreport_2021/star-line2.png') no-repeat; background-size: 100% 100%; }
.star-bar .star3 { position: absolute; top: 5.6rem; left: 50%; margin-left: -5.3rem; width: 4.2rem; height: 2.65rem; background: url('../../pic/activity/yearreport_2021/star3.png') no-repeat; background-size: 100% 100%; }
.star-bar .star1-txt, .star-bar .star2-txt, .star-bar .star3-txt { font-size: .7rem; color: #fff; line-height: 1rem; position: absolute; left: 50%; transform: translateX(-50%); }
.star-bar .star1-txt { top: 2.55rem; margin-left: .5rem; }
.star-bar .star2-txt { top: 5.9rem; margin-left: 6.4rem; }
.star-bar .star3-txt { top: 8.7rem; margin-left: -3rem; }

/* read-hot */
.read-hot { margin-top: 1.8rem; width: 10.55rem; height: 3.35rem; padding: .65rem; background: url('../../pic/activity/yearreport_2021/bg-read.png') no-repeat; background-size: 100% 100%; color: #fff; }
.read-hot dt { font-size: .6rem; line-height: 1; }
.read-hot dd { font-size: .75rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin: .4rem -.25rem 0 -.25rem; }

/* pie-bar */
.pie-bar { margin: 1rem auto .8rem; width: 15.55rem; height: 11.4rem; background: url('../../pic/activity/yearreport_2021/bg-echarts.png') no-repeat; background-size: 100% 100%; }

/* lawyer-bar */
.lawyer-bar { position: absolute; top: 50%; right: 3rem; left: 3rem; transform: translateY(-50%); height: 22.1rem; }
.ico-ear-left, .ico-ear-right { display: inline-block; vertical-align: middle; width: 2rem; height: 3.65rem; background-size: 100% 100%; }
.ico-ear-left { background-image: url('../../pic/activity/yearreport_2021/ico-ear-left.png'); }
.ico-ear-right { background-image: url('../../pic/activity/yearreport_2021/ico-ear-right.png'); }
.lawyer-bar .photo { margin: auto; width: 4.2rem; height: 4.2rem; padding: .5rem; background: url('../../pic/activity/yearreport_2021/bg-photo.png') no-repeat; background-size: 100% 100%; }
.lawyer-bar .photo img { width: 3.2rem; height: 3.2rem; border-radius: 50%; }
.lawyer-bar .name { margin-top: .2rem; font-size: .9rem; color: #4A507E; line-height: 1.4rem; }
.lawyer-bar .txt { font-size: .65rem; line-height: .9rem; color: #B3B8D6; margin-top: .2rem; }
.lawyer-bar .info-txt { margin-top: .6rem; display: flex; justify-content: space-between; }
.lawyer-bar .info-txt li { flex: none; }
.lawyer-bar .info-txt div { font-size: .65rem; color: #B3B8D6; height: 1.4rem; line-height: 1.4rem; overflow: hidden; }
.lawyer-bar .info-txt p { font-size: .7rem; color: #4A507E; }
.lawyer-bar .info-txt .num { font-family: 'DIN-Bold'; color: #FBBB60; margin-right: .2rem; font-size: 1.15rem; position: relative; top: .05rem; }
.lawyer-bar .info-txt .num-txt { font-size: .8rem; color: #FBBB60; font-weight: bold; position: relative; top: .15rem; }
.lawyer-bar .bot-txt { margin-top: 1rem; font-size: .55rem; color: #B3B8D6; line-height: .7rem; }
.lawyer-bar .prise { position: relative; z-index: 1; width: 6.75rem; margin: .8rem auto; line-height: 1.2rem; }
.lawyer-bar .prise b { font-size: 1rem; color: #F85F1B; }
.lawyer-bar .prise span { position: absolute; bottom: -0.25rem; left: 50%; z-index: -1; transform: translateX(-50%); font-size: .8rem; color: #FFF1E8; white-space: nowrap; line-height: 1; text-transform: uppercase; letter-spacing: .1rem; font-weight: bold; }
#echart-bar { height: 5rem; margin-top: 1rem; }

/* comment-list */
.comment-list { position: relative; margin-top: .8rem; }
.comment-list li { position: relative; max-width: 12.75rem; text-align: left; margin-top: .45rem; }
.comment-list li span { line-height: 1.2rem; font-size: .65rem; padding: 0 .65rem; border-radius: .6rem; display: inline-block; vertical-align: middle; max-width: 100%; margin-top: -0.1rem; }
.comment-list li:before { content: ''; position: absolute; bottom: -.4rem; border-style: solid; border-width: .2rem .3rem; }
.comment-list li:nth-child(1) span,
.comment-list li:nth-child(2) span { background-color: #E5ECFF; color: #4A507E; }
.comment-list li:nth-child(3) span,
.comment-list li:nth-child(4) span { background-color: #F2F5FF; color: #9AA1CD; }
.comment-list li:nth-child(1),
.comment-list li:nth-child(3) { text-align: right; }
.comment-list li:nth-child(3) { padding-right: .8rem; margin-top: .2rem; }
.comment-list li:nth-child(4) { padding-left: .8rem; margin-top: .2rem; }
.comment-list li:nth-child(1):before { border-color: #E5ECFF #E5ECFF transparent transparent; right: 1.6rem; }
.comment-list li:nth-child(2):before { border-color: #E5ECFF transparent transparent #E5ECFF; left: 1.6rem; }
.comment-list li:nth-child(3):before { border-color: #F2F5FF #F2F5FF transparent transparent; right: 1.6rem; }
.comment-list li:nth-child(4):before { border-color: #F2F5FF transparent transparent #F2F5FF; left: 1.6rem; }

/* text-list */
.text-list { font-size: .7rem; line-height: 1.2rem; color: #B3B8D6; margin-top: 1rem; }

/* end-conts */
.end-conts { position: absolute; top: 50%; right: 1.05rem; left: 1.05rem; transform: translateY(-50%); margin-top: -.5rem; text-align: center; }
.end-conts .txt { font-size: .8rem; color: #fff; line-height: 1.1rem; }
.end-conts .txt li { margin-bottom: 1rem; }
.end-conts .num {
    margin-top: 3rem; position: relative;
    font-size: 0.6rem; color: #D8D6FE; line-height: 0.7rem;
}
.end-conts .num:before, .end-conts .num:after {
    content: ''; position: absolute; top: 50%; 
    width: 1.35rem; height: 1px; background-color: #9EACDB;
    -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
.end-conts .num:before { margin-left: -1.8rem; }
.end-conts .num:after { margin-left: .4rem; }
.dev-report { display: block; width: 100%; height: 2.8rem; background: url('../../pic/activity/yearreport_2021/btn-report.png') no-repeat; background-size: 100% 100%; margin-top: .6rem; cursor: pointer; }
.back-report { margin: .6rem .15rem 0; display: block; border: 1px solid #421766; line-height: 2.1rem; border-radius: 1.1rem; background-color: transparent; font-size: .8rem; color: #EFF0CD; text-align: center; cursor: pointer; }

/* ani-slide */
.ani-slide { position: relative; }

/* trans */
.trans-opac { 
    opacity: 0; 
    -webkit-transition: opacity ease 2s; 
    transition: opacity ease 2s; 
}
.ani-slide .trans-opac { opacity: 1; }
.ani-slide .trans2 {
    -webkit-transition-delay: .5s; 
    transition-delay: .5s; 
}
.ani-slide .trans3 {
    -webkit-transition-delay: 1s; 
    transition-delay: 1s; 
}
.ani-slide .trans4 {
    -webkit-transition-delay: 1.5s; 
    transition-delay: 1.5s; 
}
.ani-slide .trans5 {
    -webkit-transition-delay: 2s;
    transition-delay: 2s;
}
.ani-slide .trans6 {
    -webkit-transition-delay: 2.5s;
    transition-delay: 2.5s;
}
.ani-slide .trans7 {
    -webkit-transition-delay: 3s;
    transition-delay: 3s;
}
.ani-slide .trans8 {
    -webkit-transition-delay: 3.5s;
    transition-delay: 3.5s;
}
.ani-slide .trans9 {
    -webkit-transition-delay: 4s;
    transition-delay: 4s;
}
.ani-slide .trans10 {
    -webkit-transition-delay: 4.5s;
    transition-delay: 4.5s;
}
.ani-slide .trans11 {
    -webkit-transition-delay: 5s;
    transition-delay: 5s;
}
.ani-slide .trans12 {
    -webkit-transition-delay: 5.5s;
    transition-delay: 5.5s;
}
.ani-slide .trans13 {
    -webkit-transition-delay: 6s;
    transition-delay: 6s;
}
.ani-slide .trans14 {
    -webkit-transition-delay: 6.5s;
    transition-delay: 6.5s;
}
.ani-slide .trans15 {
    -webkit-transition-delay: 7s;
    transition-delay: 7s;
}
.ani-slide .trans16 {
    -webkit-transition-delay: 7.5s;
    transition-delay: 7.5s;
}
.ani-slide .trans17 {
    -webkit-transition-delay: 8s;
    transition-delay: 8s;
}
.ani-slide .trans18 {
    -webkit-transition-delay: 8.5s;
    transition-delay: 8.5s;
}
.ani-slide .trans19 {
    -webkit-transition-delay: 9s;
    transition-delay: 9s;
}

/* canvas-img */
.canvas-img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; opacity: 0; }
.canvasshowimg { position:absolute; width:100%; left:0; top:0; opacity: 0; z-index: 3 }


@media screen and (min-width: 750px){
    .slide-index .bottom-conts { display: none; }
}
@media screen and (min-width: 320px) and (max-height: 530px) {
    .slide-index .bottom-conts,
    .k7 .data-txt-bar { display: none; }
}