.lawyer { }
.lawyer h2 { color: #2f80ed; font-weight: 600; text-align: center; margin-bottom: calc(20px + 2%);}
.lawyer h3 { color: #2f80ed; font-weight: 600;}
.lawyer .person {text-align: center; margin: calc(20px + 1%) 0;}
.lawyer .area_in { position: relative; display: flex; flex-flow: wrap; margin: 0 0 calc(20px + 4%) 0;}
.lawyer .area_in::before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 80%; height: 100%; background: #97BFF6; z-index: -1;}
.lawyer .area_in .pic { position: absolute; top: 0; right: 0; width: 100%; max-width: 550px; z-index: -1;}
.lawyer .area_in .text { position: relative; padding: 10px 20px; width: 60%; background: #fff; margin-top: 30px; box-shadow: 0 0 20px rgba(0, 0, 0, .1);}
.lawyer .area_in .w_more { width: 65%;}
.lawyer .area_in .text .tit::before { content: ''; position: absolute; top: 0; left: 0; width: 40px; height: 4px; background: #94E9DB;}
.lawyer .area_in .text .tit::after { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 40px; background: #94E9DB;}
.lawyer .area_in .text .txt::before { content: ''; position: absolute; bottom: 0; right: 0; width: 4px; height: 40px; background: #94E9DB;}
.lawyer .area_in .text .txt::after { content: ''; position: absolute; bottom: 0; right: 0; width: 40px; height: 4px; background: #94E9DB;}
.lawyer .area_in:nth-child(2n+1) .pic { right: auto; left: 0;}
.lawyer .area_in:nth-child(2n+1) .text { margin-left: auto;}
.lawyer .area_in_2 { position: relative; background: #fff; padding: 10px 20px; margin: 60px 20px 20px 20px; box-shadow: 0 0 20px rgba(0, 0, 0, .1);}
.lawyer .area_in_2::before { content: ''; position: absolute; top: -20px; left: -20px; width: 200px; height: 200px; background: #97BFF6; z-index: -1;}
.lawyer .area_in_2::after { content: ''; position: absolute; bottom: -20px; right: -20px; width: 200px; height: 200px; background: #97BFF6; z-index: -1;}
.lawyer .area_in_2 .deco_top::before { content: ''; position: absolute; top: 0; left: 0; width: 70px; height: 4px; background: #94E9DB;}
.lawyer .area_in_2 .deco_top::after { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 70px; background: #94E9DB;}
.lawyer .area_in_2 .deco_btn::before { content: ''; position: absolute; bottom: 0; right: 0; width: 4px; height: 70px; background: #94E9DB;}
.lawyer .area_in_2 .deco_btn::after { content: ''; position: absolute; bottom: 0; right: 0; width: 70px; height: 4px; background: #94E9DB;}
.lawyer ul { list-style-type: disc;}

.legal_team { }
.legal_team h2 { color: #2f80ed; font-weight: 600; margin-bottom: calc(20px + 2%);}
.legal_team h3 { color: #2f80ed; font-weight: 600;}
.legal_team .area_in { position: relative; background: #fff; padding: 10px 20px; margin: 20px 20px calc(20px + 6%) 20px; box-shadow: 0 0 20px rgba(0, 0, 0, .1);}
.legal_team .area_in::before { content: ''; position: absolute; top: -20px; left: -20px; width: 150px; height: 150px; background: #97BFF6; z-index: -1;}
.legal_team .area_in::after { content: ''; position: absolute; bottom: -20px; right: -20px; width: 150px; height: 150px; background: #97BFF6; z-index: -1;}
.legal_team .area_in .tit::before { content: ''; position: absolute; top: 0; left: 0; width: 40px; height: 4px; background: #94E9DB;}
.legal_team .area_in .tit::after { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 40px; background: #94E9DB;}
.legal_team .area_in .text::before { content: ''; position: absolute; bottom: 0; right: 0; width: 4px; height: 40px; background: #94E9DB;}
.legal_team .area_in .text::after { content: ''; position: absolute; bottom: 0; right: 0; width: 40px; height: 4px; background: #94E9DB;}


@media only screen and (max-width:1024px){
    .lawyer .area_in .text { width: 65%;}
}

@media only screen and (max-width:768px){
    .lawyer .area_in { margin: 20px 0 calc(20px + 2%) 0;}
    .lawyer .area_in::before { display: none;}
    .lawyer .area_in .pic { position: relative; max-width: 100%;}
    .lawyer .area_in .text { width: 100%; margin-top: 0;}
}

@media only screen and (max-width:576px){
    .lawyer .area_in_2 { margin: 50px 10px 20px 10px;}
    .lawyer .area_in_2::before { width: 100px; height: 100px; top: -10px; left: -10px;}
    .lawyer .area_in_2::after { width: 100px; height: 100px; bottom: -10px; right: -10px;}
    .lawyer .area_in_2 .deco_top::before { width: 40px;}
    .lawyer .area_in_2 .deco_top::after { height: 40px;}
    .lawyer .area_in_2 .deco_btn::before { height: 40px;}
    .lawyer .area_in_2 .deco_btn::after { width: 40px;}
    .legal_team .area_in { margin: 20px 10px calc(20px + 6%) 10px;}
    .legal_team .area_in::before { width: 100px; height: 100px; top: -10px; left: -10px;}
    .legal_team .area_in::after { width: 100px; height: 100px; bottom: -10px; right: -10px;}
}