/* #5229 lq 2022-12-16 */
html, body { min-height: 100%; }
body { background-color: #0e0943; }
.tc { text-align: center !important; }
.mlr15{ margin-left: .75rem; margin-right: .75rem; }
.mt25 { margin-top: 1.25rem; }
.mt40 { margin-top: 2rem; }
.mt45 { margin-top: 2.25rem; }
.mt50 { margin-top: 2.5rem; }
.pb30 { padding-bottom: 1.5rem; }
.pb40 { padding-bottom: 2rem; }
.btn-brown {
background: linear-gradient(180deg, #c5995a 0%, #f3dcb9 100%); border-radius: 1rem;
color: #242526; font-weight: 600; text-align: center;
}
/* cont-bar */
.cont-bar { position: relative; z-index: 2; margin: -4.5rem .75rem 0; }
.cont-box { position: relative; z-index: 2; margin-top: -4.5rem; }
/* banner */
.banner { position: relative; }
.banner .bg { display: block; width: 100%; }
.banner .logo { position: absolute; left: .75rem; top: 1rem; width: 8.3rem; height: 1.15rem; }
/* fixed-apply */
.fixed-apply { position: fixed; right: .3rem; bottom: 20%; z-index: 100; width: 2.9rem; height: 2.9rem; }
/* box-tit */
.box-tit img { display: block; margin: auto; height: 1.8rem; }
.box-tit p { font-size: .7rem; color: #eacda2; text-align: center; margin-top: .4rem; }
.box-tit .f12-ff-lh18 { font-size: .6rem; line-height: .9rem; color: #fff; opacity: .8; margin-top: .65rem; }
/* box-info */
.box-info {
background: #171159 url('../../pic/activity/goodlawyer_2022/info_bg.png'); background-size: 100% auto;
height: 5.6rem; padding: 1rem 1.9rem; border-radius: .4rem;
font-size: .65rem; color: rgba(255,255,255, .8); line-height: 1rem; text-align: justify; word-wrap: break-word; word-break: break-all;
}
.box-info2 {
background: #171159 url('../../pic/activity/goodlawyer_2022/info2_bg.png') no-repeat center bottom; background-size: 100% 9.85rem;
padding: 1rem 1.9rem .75rem; border-radius: .4rem; font-size: .65rem; color: rgba(255,255,255, .8); line-height: 1rem;
text-align: justify; word-wrap: break-word; word-break: break-all;
}
/* box-data */
.box-data { padding-bottom: 2rem; background-color: #171159; border-radius: .4rem; }
.deco-ball {
position: absolute; left: -0.25rem; bottom: -1.45rem; width: 2.5rem; height: 2.55rem;
background: url('../../pic/activity/goodlawyer_2022/deco-ball.png'); background-size: cover;
}
.deco-r-line {
position: absolute; right: -0.75rem; bottom: -6.3rem; z-index: -1; width: 9.35rem; height: 9.3rem;
background: url('../../pic/activity/goodlawyer_2022/deco-rline.png'); background-size: cover;
}
.deco-l-line {
position: absolute; left: -0.75rem; width: 9.35rem; height: 9.3rem;
background: url('../../pic/activity/goodlawyer_2022/deco-leftline.png'); background-size: cover; }
.deco-ball-right {
position: absolute; right: -0.75rem; width: 2.5rem; height: 2.55rem;
background: url('../../pic/activity/goodlawyer_2022/deco-ball2.png'); background-size: cover;
}
.data-list { padding-top: 1.5rem; }
.data-list dd { float: left; width: 33.333%; text-align: center; margin-bottom: .5rem; }
.data-list dd.r-2 { width: 50%; }
.data-list dd .tray {
position: relative; z-index: 2; display: block; margin: auto;
width: 5rem; height: 5rem; padding-top: .3rem; box-sizing: border-box;
}
.data-list dd .tray .bg {
position: absolute; left: 0; top: 0; z-index: -1;
width: 5rem; height: 5rem; background: url('../../../pc/pic/activity/goodlawyer_2022/icon_data_bg.png'); background-size: cover;
}
.data-list dd .tray .num { height: .9rem; color: #02b6ec; }
.data-list dd .tray .num .f-num { font-size: .9rem; line-height: 1; font-weight: 600; vertical-align: bottom; }
.data-list dd .tray .num .unit { font-size: .5rem; line-height: 1; margin: .15rem 0 0 .1rem; }
.data-list dd .tray img { display: block; width: 1.2rem; height: 1.2rem; margin: .4rem auto 0; }
.data-list dd .txt { font-size: .6rem; color: #fff; margin-top: -1.2rem; }
.data-list dd .f10 { font-size: .5rem; color: #fff; opacity: .5; line-height: .6rem; }
/* */
.erwe-box { margin-top: 1.75rem; text-align: center; }
.erwe-box dt {
background: url('../../pic/activity/goodlawyer_2022/nav_line.png') no-repeat center; background-size: 15.7rem auto;
font-size: .8rem; color: #fff; font-weight: 600;
}
.erwe-box dd { font-size: .6rem; color: #fff; line-height: 1rem; margin-top: .5rem; }
.erwe-box dd .btn {
display: block; margin: .75rem auto 0;
width: 8rem; height: 2rem; background: linear-gradient(90deg, #00c2f4, #f2dab6); border-radius: 1rem;
font-size: .7rem; color: #333; line-height: 2rem; font-weight: 600;
}
/* timer-shaft */
.path-box {
margin-left: -0.75rem; margin-right: -0.75rem; padding: 0 .75rem 1.3rem;
background: url('../../pic/activity/goodlawyer_2022/path_box_bg.png') no-repeat center bottom; background-size: auto 3.35rem;
}
.timer-shaft { margin-left: 5.6rem; }
.timer-shaft li { position: relative; padding: 0 0 1.8rem 1.45rem; color: #fff; }
.timer-shaft li:after {
position: absolute; left: 0; top: 1rem; bottom: -0.65rem; content: '';
width: 1px; background-color: #03bceb;
}
.timer-shaft li:last-child:after { background-color: transparent; }
.timer-shaft li .time {
position: absolute; left: -5.1rem; top: -0.3rem;
font-size: .6rem; color: #02b6ec; line-height: 1.2rem;
}
.timer-shaft li .time.t6 { top: .3rem; }
.timer-shaft li .f16 { font-weight: 600; }
.timer-shaft li .f12 { opacity: .5; line-height: .8rem; margin-top: .2rem; }
.timer-shaft .dot {
position: absolute; left: -0.45rem; top: .4rem;
width: .9rem; height: .9rem; border-radius: 50%;
background: radial-gradient(circle, rgba(0,152,186, .5) 0%, rgba(0,152,186, 0) 100%);
}
.timer-shaft .dot:after {
position: absolute; left: .25rem; top: .25rem; content: '';
width: .4rem; height: .4rem; background: #02b6ec; border-radius: 50%;
}
/* expert-box */
.expert-box .deco-ball { left: -0.3rem; bottom: -1.9rem; }
.expert-box .deco-r-line { bottom: -5.1rem; }
/* swiper-expert-list */
.swiper-expert-list .swiper-wrapper { padding-bottom: 3rem; }
.swiper-container-horizontal>.swiper-pagination-bullets { height: .15rem; bottom: 1.5rem; }
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
width: .5rem; height: .15rem; background: #fff; opacity: 0.5; border-radius: .1rem; margin: -0.3rem .1rem 0;
}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active { width: 1rem; opacity: 1; }
.swiper-expert-list .swiper-slide { width: 6rem; }
.swiper-expert-list .swiper-slide img { display: block; width: 100%; }
.swiper-expert-list .swiper-slide .tx { margin-top: 1rem; color: #fff; }
.swiper-expert-list .swiper-slide .name { font-size: .8rem; font-weight: 600; }
.swiper-expert-list .swiper-slide p { font-size: .55rem; line-height: .8rem; opacity: .5; margin-top: .1rem; }
/* criteria-box */
.criteria-box { position: relative; padding: 0 .8rem; background: #171159; border-radius: .4rem; }
.criteria-box dt {
position: absolute; left: 50%; top: -0.15rem; transform: translatex(-50%);
width: 8rem; height: 1.65rem; background: url('../../pic/activity/goodlawyer_2022/tit_pxbz.png') no-repeat; background-size: cover;
padding-top: .15rem; font-size: .7rem; font-weight: 600; text-align: center;
}
.criteria-box dd { padding: 1.6rem 0 .8rem; }
.criteria-box .item {
display: flex; padding: .7rem 0; border-radius: .4rem; margin-top: .25rem;
background: linear-gradient(90deg, #2e4099 0%, #171159 100%);
}
.criteria-box .item div { position: relative; width: 5.2rem; padding-left: 1.5rem; font-size: .9rem; color: #eacda2; font-weight: 600; display: flex; align-items: center; }
.criteria-box .item div:after {
position: absolute; left: .75rem; top: 50%; content: ''; transform: translatey(-50%);
width: .25rem; height: .25rem; background: #eacda2; border-radius: 50%;
}
.criteria-box .item p { font-size: .6rem; line-height: .9rem; color: #fff; opacity: .5; }
/* prize-box */
.prize-box { position: relative; }
.prize-box .deco-l-line { bottom: -4.6rem; }
.prize-box .deco-ball-right { bottom: -1.45rem; z-index: 2; }
/* prizes-list */
.prizes-list { margin-left: -0.75rem; }
.prizes-list li {
float: left; width: 8.25rem; height: 7.5rem; margin: .5rem 0 0 .75rem; padding: .5rem .4rem 0; text-align: center;
background: url('../../pic/activity/goodlawyer_2022/prizes_bg.png'); background-size: cover;
}
.prizes-list li .f14 { color: #02b6ec; font-weight: 600; line-height: 1rem; }
.prizes-list li .line { width: .6rem; height: .1rem; background: #1df4ee; margin: .4rem auto .5rem; }
.prizes-list li p { font-size: .55rem; color: #fff; line-height: .75rem; opacity: .5; }
/* prize-card */
.prize-card {
position: relative; z-index: 1; padding: 1.5rem 1rem 1.25rem; border-radius: .4rem;
background: linear-gradient(180deg, #2776e6 0%, #0f1766 100%);
}
.prize-card .tit {
position: absolute; left: 50%; top: -0.15rem; transform: translatex(-50%);
width: 9.5rem; height: 1.75rem; background: url('../../pic/activity/goodlawyer_2022/card_tit.png') no-repeat; background-size: cover;
padding-top: .2rem; font-size: .7rem; font-weight: 600; text-align: center;
}
.prize-card .item { padding: .35rem 0; }
.prize-card .item dt { font-size: .8rem; color: #eacda2; font-weight: 600; line-height: 1rem; margin-bottom: .4rem; }
.prize-card .item dd { display: flex; font-size: .6rem; color: #fff; line-height: .9rem; opacity: .8; }
/* sign-up-box */
.sign-up-box { position: relative; padding: 0 .7rem; background: #171159; border-radius: .4rem; }
.sign-up-box .deco-ball { left: -0.5rem; bottom: -1.3rem; }
.rule-box { color: #fff; }
.rule-box dt { padding: 1.5rem 0 .6rem; font-size: .8rem; text-align: center; }
.rule-box dt b { position: relative; }
.rule-box dt b:before,
.rule-box dt b:after { position: absolute; top: .4rem; content: ''; width: 5.3rem; height: 1px; opacity: .5; }
.rule-box dt b:before{ left: -6.5rem; background: linear-gradient(270deg, #fff, rgba(255,255,255, .01) 80%); }
.rule-box dt b:after { right: -6.5rem; background: linear-gradient(90deg, #fff, rgba(255,255,255, .01) 80%); }
.rule-box dd { padding: .25rem 0; font-size: .6rem; line-height: .9rem; opacity: .8; }
.login-box { padding: 1rem 0 1.5rem; text-align: center; }
.login-box .btn-brown { width: 14rem; line-height: 2rem; margin: auto; }
.login-box p { font-size: .6rem; color: #fff; opacity: .8; margin-top: .75rem; }
.login-box p a { color: #c5995a; text-decoration: underline; }
/* partnership-box */
.partnership-box { overflow: hidden; margin-left: -0.65rem; }
.partnership-box li { float: left; width: 5.3rem; height: 2.4rem; margin: .55rem 0 0 .65rem; }
/* previous-show */
.previous-show .swiper-wrapper { padding-bottom: 1.6rem; }
.previous-show .swiper-slide { width: 6.5rem; height: 5rem; border-radius: .1rem; overflow: hidden; }
.previous-show .swiper-container-horizontal>.swiper-pagination-bullets { bottom: .5rem; }
/* footer-box */
.footer-box { padding-bottom: 2rem; background: url('../../pic/activity/goodlawyer_2022/ft_bg.png') no-repeat center bottom; background-size: 100% auto; }
.footer-box .logo { display: block; width: 9.75rem; height: .85rem; margin: auto; }
.footer-box p { font-size: .55rem; line-height: .75rem; color: #fff; opacity: .5; text-align: center; margin-top: 1rem; }
/* botm-nav */
.botm-nav { display: flex; background-color: #fff; }
.botm-nav .item { flex: 1; font-size: .7rem; text-align: center; line-height: 2.5rem; }
.botm-nav .item.is-this { background: url('../../pic/activity/goodlawyer_2022/botm_nav_click.png') no-repeat; background-size: 100% auto; color: #c5995a; }
/* tabs-inclusion */
.f12-lh20-ff { font-size: .6rem; color: #fff; line-height: 1rem; opacity: .5; }
.tabs-inclusion .nav-item { padding: 0; width: 100%; float: none; }
.tabs-inclusion .tab-item { padding: 0 .8rem; }
.tabs-inclusion .swiper-container-horizontal>.swiper-pagination-bullets { bottom: .4rem; }
/* inclusion-nav */
.inclusion-nav dt {
height: 2.2rem; background: url('../../pic/activity/goodlawyer_2022/inclusion_nav.png') no-repeat; background-size: 100% auto;
padding-top: .15rem; font-size: .7rem; color: #333; font-weight: 600; text-align: center;
}
.inclusion-nav dd { padding: .2rem .8rem 0; text-align: left; }
/* lawyer-list */
.lawyer-list .hr-line { padding: 0; }
.lawyer-list .hr-line:after { left: 4.75rem; right: .75rem; opacity: .2; }
.lawyer-list .hr-line:last-child:after { border: none; }
.lawyer-list .item { display: block; padding: 1rem .75rem; overflow: hidden; font-size: .6rem; color: #fff; }
.lawyer-list .item .photo {
float: left; width: 3.25rem; height: 3.25rem; padding: .15rem; border-radius: 50%; margin-right: .75rem;
background: linear-gradient(180deg, #f8dab2 0%, #fff 45%, #6a5842 100%);
}
.lawyer-list .item .photo img { border-radius: 50%; }
.lawyer-list .item .name { font-size: .8rem; color: #c5995a; font-weight: 600; }
.lawyer-list .item .h14 { height: .7rem; line-height: .7rem; opacity: .5; margin-top: .3rem; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.lawyer-list .item .h14 span { max-width: 6.8rem; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.lawyer-list .item .h14 .line-vertical { height: .5rem; top: 0; }
/* */
.lawyer-list.res-list { margin: 0 .75rem; }
.lawyer-list.res-list li { margin-top: .25rem; background: #171159; padding: 0; border-radius: .4rem; }
.lawyer-list.res-list li .item { padding: .9rem .75rem; }
.lawyer-list.res-list li .photo { width: 3.75rem; height: 3.75rem; padding: 0; background: transparent; margin: 0 1.15rem 0 .4rem; }
.lawyer-list.res-list li .photo:after {
position: absolute; left: -0.4rem; top: -0.15rem; content: '';
width: 4.55rem; height: 4.1rem; background: url('../../pic/activity/goodlawyer_2022/res_lable.png') no-repeat; background-size: cover;
}
.lawyer-list.res-list li:nth-child(2n) .photo { float: right; margin: 0 .4rem 0 1.15rem; }
/* hand-box */
.hand-box { position: absolute; top: 10.25rem; right: 0; z-index: 10; }
.hand-box p { font-size: .5rem; color: #fff; line-height: .6rem; text-align: center; opacity: .8; margin-top: -1.75rem; }
.hand-gif {
background-image: url('../../pic/activity/goodlawyer_2022/hand.png');
width: 7rem; height: 7rem; transform: scale(.5);
animation: myAnimation 1.50s steps(1) infinite;
}
@keyframes myAnimation {
0% { background-position: 0rem 0rem; }
1.12% { background-position: -7rem 0rem; }
2.25% { background-position: -14rem 0rem; }
3.37% { background-position: -21rem 0rem; }
4.49% { background-position: -28rem 0rem; }
5.62% { background-position: -35rem 0rem; }
6.74% { background-position: -42rem 0rem; }
7.87% { background-position: -49rem 0rem; }
8.99% { background-position: -56rem 0rem; }
10.11% { background-position: -63rem 0rem; }
11.24% { background-position: -70rem 0rem; }
12.36% { background-position: -77rem 0rem; }
13.48% { background-position: -84rem 0rem; }
14.61% { background-position: -91rem 0rem; }
15.73% { background-position: -98rem 0rem; }
16.85% { background-position: -105rem 0rem; }
17.98% { background-position: -112rem 0rem; }
19.10% { background-position: -119rem 0rem; }
20.22% { background-position: -126rem 0rem; }
21.35% { background-position: -133rem 0rem; }
22.47% { background-position: -140rem 0rem; }
23.60% { background-position: -147rem 0rem; }
24.72% { background-position: -154rem 0rem; }
25.84% { background-position: -161rem 0rem; }
26.97% { background-position: -168rem 0rem; }
28.09% { background-position: -175rem 0rem; }
29.21% { background-position: -182rem 0rem; }
30.34% { background-position: -189rem 0rem; }
31.46% { background-position: -196rem 0rem; }
32.58% { background-position: -203rem 0rem; }
33.71% { background-position: -210rem 0rem; }
34.83% { background-position: -217rem 0rem; }
35.96% { background-position: -224rem 0rem; }
37.08% { background-position: -231rem 0rem; }
38.20% { background-position: -238rem 0rem; }
39.33% { background-position: 0rem -7rem; }
40.45% { background-position: -7rem -7rem; }
41.57% { background-position: -14rem -7rem; }
42.70% { background-position: -21rem -7rem; }
43.82% { background-position: -28rem -7rem; }
44.94% { background-position: -35rem -7rem; }
46.07% { background-position: -42rem -7rem; }
47.19% { background-position: -49rem -7rem; }
48.31% { background-position: -56rem -7rem; }
49.44% { background-position: -63rem -7rem; }
50.56% { background-position: -70rem -7rem; }
51.69% { background-position: -77rem -7rem; }
52.81% { background-position: -84rem -7rem; }
53.93% { background-position: -91rem -7rem; }
55.06% { background-position: -98rem -7rem; }
56.18% { background-position: -105rem -7rem; }
57.30% { background-position: -112rem -7rem; }
58.43% { background-position: -119rem -7rem; }
59.55% { background-position: -126rem -7rem; }
60.67% { background-position: -133rem -7rem; }
61.80% { background-position: -140rem -7rem; }
62.92% { background-position: -147rem -7rem; }
64.04% { background-position: -154rem -7rem; }
65.17% { background-position: -161rem -7rem; }
66.29% { background-position: -168rem -7rem; }
67.42% { background-position: -175rem -7rem; }
68.54% { background-position: -182rem -7rem; }
69.66% { background-position: -189rem -7rem; }
70.79% { background-position: -196rem -7rem; }
71.91% { background-position: -203rem -7rem; }
73.03% { background-position: -210rem -7rem; }
74.16% { background-position: -217rem -7rem; }
75.28% { background-position: -224rem -7rem; }
76.40% { background-position: -231rem -7rem; }
77.53% { background-position: -238rem -7rem; }
78.65% { background-position: 0rem -14rem; }
79.78% { background-position: -7rem -14rem; }
80.90% { background-position: -14rem -14rem; }
82.02% { background-position: -21rem -14rem; }
83.15% { background-position: -28rem -14rem; }
84.27% { background-position: -35rem -14rem; }
85.39% { background-position: -42rem -14rem; }
86.52% { background-position: -49rem -14rem; }
87.64% { background-position: -56rem -14rem; }
88.76% { background-position: -63rem -14rem; }
89.89% { background-position: -70rem -14rem; }
91.01% { background-position: -77rem -14rem; }
92.13% { background-position: -84rem -14rem; }
93.26% { background-position: -91rem -14rem; }
94.38% { background-position: -98rem -14rem; }
95.51% { background-position: -105rem -14rem; }
96.63% { background-position: -112rem -14rem; }
97.75% { background-position: -119rem -14rem; }
98.88% { background-position: -126rem -14rem; }
100.00% { background-position: -133rem -14rem; }
}
/* abs-menu */
.abs-menu {
position: absolute; right: 0; top: 5.4rem; z-index: 50;
height: 1.2rem; padding: 0 .65rem 0 .45rem; font-size: .6rem; color: #C5995A;
background: #0E0943 url('../../pic/activity/goodlawyer_2022/jt-r.png') no-repeat;
background-size: .2rem .3rem; background-position: right .2rem center;
border: 1px solid #C5995A; border-right: none; border-radius: .6rem 0rem 0rem .6rem;
}
/* right-type-bar */
.right-type-bar {
position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 800;
visibility: hidden; transition: .2s linear;
}
.right-type-bar .bg {
position: absolute; left: 0; top: 0; width: 100%; height: 100%;
background-color: rgba(0,0,0, .5); visibility: hidden; opacity: 0; transition: .2s linear;
}
.right-type-bar .type-box {
position: absolute; top: 0; right: -100%; bottom: 0;
width: 9rem; padding: .75rem 0; background-color: #fff;
display: flex; flex-direction: column; transition: right .2s linear;
}
.right-type-bar .type-box dt { padding: 1.25rem 0 .75rem; }
.right-type-bar .type-box dt img { display: block; width: 5.55rem; margin: auto; }
.right-type-bar .type-box dd { padding: 0 .75rem; flex: 1; height: 100%; overflow-y: auto; }
.right-type-bar .type-box .nav-item {
height: 1.6rem; border-radius: .4rem; margin-top: .25rem;
font-size: .7rem; line-height: 1.6rem; text-align: center;
}
.right-type-bar .type-box .nav-item.is-this { background: linear-gradient(270deg, #C5995A, #F3DCB9); font-weight: 600; }
.right-type-bar.is-show { visibility: visible; }
.right-type-bar.is-show .bg { visibility: visible; opacity: 1; }
.right-type-bar.is-show .type-box { right: 0; }
/* expert-list */
.expert-list { margin-left: -0.75rem; }
.expert-list li { float: left; width: 8.25rem; margin: 1.5rem 0 0 .75rem; }
.expert-list li .tx { color: #fff; margin-top: 1rem; }
.expert-list li .tx .name { font-size: .8rem; font-weight: 600; }
.expert-list li .tx p { font-size: .55rem; line-height: .75rem; margin-top: .2rem; opacity: .5; }