.pop .tab_box .tab_left, .pop7 .pop7-skill-list, .pop5 .pop5-lj-list, .pop4-skill-list, .pop3 .ky_list, .pop1 .card-scroll, .pop-content-box {
  overflow-x: hidden;
  overflow-y: auto;
}
.pop .tab_box .tab_left::-webkit-scrollbar, .pop7 .pop7-skill-list::-webkit-scrollbar, .pop5 .pop5-lj-list::-webkit-scrollbar, .pop4-skill-list::-webkit-scrollbar, .pop3 .ky_list::-webkit-scrollbar, .pop1 .card-scroll::-webkit-scrollbar, .pop-content-box::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.pop .tab_box .tab_left::-webkit-scrollbar-thumb, .pop7 .pop7-skill-list::-webkit-scrollbar-thumb, .pop5 .pop5-lj-list::-webkit-scrollbar-thumb, .pop4-skill-list::-webkit-scrollbar-thumb, .pop3 .ky_list::-webkit-scrollbar-thumb, .pop1 .card-scroll::-webkit-scrollbar-thumb, .pop-content-box::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#d6a738), to(#f6d380));
  background-image: linear-gradient(to bottom, #d6a738, #f6d380);
}
.pop .tab_box .tab_left::-webkit-scrollbar-track, .pop7 .pop7-skill-list::-webkit-scrollbar-track, .pop5 .pop5-lj-list::-webkit-scrollbar-track, .pop4-skill-list::-webkit-scrollbar-track, .pop3 .ky_list::-webkit-scrollbar-track, .pop1 .card-scroll::-webkit-scrollbar-track, .pop-content-box::-webkit-scrollbar-track {
  -webkit-box-shadow: 0 0 0 1px rgba(134, 120, 95, 0.46) inset;
          box-shadow: 0 0 0 1px rgba(134, 120, 95, 0.46) inset;
  background-color: rgba(79, 70, 51, 0.8);
}

.pop-mask {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
}

.pop {
  position: fixed;
  top: 50%;
  left: 50%;
  padding: 25px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: #212121;
  font-family: "fzltc";
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.pop *,
.pop ::before,
.pop ::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  outline: none;
  background-size: 100% auto;
  background-repeat: no-repeat;
}
.pop .pop-border {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.pop .pop-border::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  -webkit-box-shadow: 0 0 0 2px #5a503e inset;
          box-shadow: 0 0 0 2px #5a503e inset;
  clip-path: polygon(0% 14px, 14px 14px, 14px 0%, calc(100% - 14px) 0%, calc(100% - 14px) 14px, 100% 14px, 100% calc(100% - 14px), calc(100% - 14px) calc(100% - 14px), calc(100% - 14px) 100%, 14px 100%, 14px calc(100% - 14px), 0% calc(100% - 14px));
}
.pop .pop-border::after {
  content: "";
  position: absolute;
  top: -4px;
  left: 50%;
  z-index: 2;
  width: 77px;
  height: 10px;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/pop-adorn.png);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.pop .pop-border i {
  position: absolute;
  width: 15px;
  height: 15px;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/pop-angle.png);
}
.pop .pop-border i:nth-of-type(1) {
  top: 0;
  left: 0;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/pop-angle-top.png);
}
.pop .pop-border i:nth-of-type(2) {
  top: 0;
  right: 0;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/pop-angle-top.png);
  -webkit-transform: scaleX(-1);
          transform: scaleX(-1);
}
.pop .pop-border i:nth-of-type(3) {
  bottom: 0;
  left: 0;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/pop-angle-bottom.png);
}
.pop .pop-border i:nth-of-type(4) {
  bottom: 0;
  right: 0;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/pop-angle-bottom.png);
  -webkit-transform: scaleX(-1);
          transform: scaleX(-1);
}
.pop .pop_close {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/pop_close.png);
  background-size: 15px 13px;
  background-position: center center;
}
.pop .pop-title {
  line-height: 1;
  font-weight: bold;
  font-size: 14px;
  color: #ffdca7;
}

.pop-content-bg {
  line-height: 1;
  padding: 15px;
  background-color: #121212;
}

.pop-content-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 20px;
  background-color: #121212;
}

.icon-tier-sp, .pop4-addSkill-list .skill-tier span {
  background: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/skill-icon/icon-tier-sp.png);
  background-size: 151px 45px;
}

.pop-jia-btn {
  position: relative;
  width: 38px;
  height: 38px;
  padding: 1px;
  border: 1px solid #302c24;
  border-radius: 50%;
  background-color: #302c24;
  background-clip: content-box;
  cursor: pointer;
}
.pop-jia-btn::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3px;
  height: 20px;
  background-color: #c8b58d;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.pop-jia-btn::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 3px;
  background-color: #c8b58d;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.pop-jia-btn:hover, .pop-jia-btn.active {
  border: 1px solid #f1df89;
}
.pop-jia-btn img {
  position: relative;
  z-index: 2;
}

.pop-bottom-btn-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 8px;
  margin-top: 25px;
}
.pop-bottom-btn-box a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 84px;
  height: 24px;
  line-height: 24px;
  font-size: 12px;
  color: #c8b58d;
  border: 1px solid #63615e;
  background-color: #231f16;
  cursor: pointer;
}
.pop-bottom-btn-box a:hover {
  border-color: #f2e9c3;
  color: #fff;
  background-color: #2a2418;
}

.pop1 {
  width: 730px;
  height: 760px;
}
.pop1 .pop_cont {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: calc(100% - 50px);
}
.pop1 .inp_box {
  margin: 20px 0;
}
.pop1 .p_txt2 {
  position: relative;
  height: 22px;
  line-height: 22px;
  font-size: 14px;
  text-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
  color: #ffdca7;
}
.pop1 .btn-select {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  top: 50%;
  right: 0;
  width: 90px;
  height: 22px;
  font-size: 12px;
  color: #c8b58d;
  border: 1px solid #63615e;
  background-color: #231f16;
  -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
          box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  cursor: pointer;
}
.pop1 .btn-select:hover {
  border-color: #f2e9c3;
  color: #fff;
  background-color: #2a2418;
}
.pop1 .component-icon-close {
  position: absolute;
  top: 10px;
  right: 8px;
}
.pop1 .pop1_desc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 25px;
  font-size: 18px;
}
.pop1 .pop1_desc .pop1-desc-item {
  margin-top: 10px;
  width: 45%;
  font-size: 18px;
  color: #d9edfb;
}
.pop1 .pop1_desc .pop1-desc-item-title {
  color: #8aed09;
  font-size: 18px;
}
.pop1 .pop1_desc .pop1-desc-item-txt {
  font-size: 16px;
}
.pop1 .pop1-line {
  position: relative;
  left: 50%;
  width: 730px;
  border-bottom: 1px solid rgba(135, 131, 118, 0.46);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.pop1 .card-item {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 3px;
  /* &.highlight { filter: brightness(1.5); } */
}
.pop1 .card-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.pop1 .card-item.level-0::before {
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/card_level_0.png);
}
.pop1 .card-item.level-1::before {
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/card_level_1.png);
}
.pop1 .card-item.level-2::before {
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/card_level_2.png);
}
.pop1 .card-item.level-3::before {
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/card_level_3.png);
}
.pop1 .card-item.level-4::before {
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/card_level_4.png);
}
.pop1 .card_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  margin-top: 20px;
}
.pop1 .card_list.has-backdrop li {
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/card_bg.png);
}
.pop1 .card_list li {
  position: relative;
  width: 100px;
  height: 150px;
  -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
          box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
  cursor: pointer;
}
.pop1 .card_list li img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.pop1 .card_list .card-baoshi-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 5px;
  position: absolute;
  bottom: 15px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
}
.pop1 .card_list .card-baoshi-box .icon-baoshi-y1 {
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}
.pop1 .card_list .card-baoshi-box .icon-baoshi-y1.active {
  -webkit-filter: grayscale(0);
          filter: grayscale(0);
}
.pop1 .card_list .tag-yzb {
  position: absolute;
  bottom: 10px;
  left: 0;
  width: 85px;
  height: 30px;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/tag-yzb.png);
}
.pop1 .card-scroll {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin-top: 20px;
  margin-right: -15px;
}
.pop1 .card-scroll .card-group-row {
  position: relative;
}
.pop1 .card-scroll .card-group-row + .card-group-row {
  margin-top: 60px;
}
.pop1 .card-scroll .card-group {
  width: 680px;
}
.pop1 .card-scroll .card_list {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin-top: 15px;
}
.pop1 .card-scroll .card_list li {
  position: relative;
  width: 85px;
  height: 125px;
}
.pop1 .card-scroll .card_list li:not(:last-of-type) {
  margin-right: 14px;
}
.pop1 .card-scroll .card_list li img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.pop1 .card-scroll .card_list .image {
  position: relative;
  width: 100%;
  height: 100%;
}
.pop1 .card-scroll .card_list .name {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  line-height: 1;
  font-size: 20px;
  color: #8f826f;
  white-space: nowrap;
  -webkit-transform: translateX(-50%) scale(0.5);
          transform: translateX(-50%) scale(0.5);
  -webkit-transform-origin: center top;
          transform-origin: center top;
}

.pop2 {
  width: 960px;
  height: 710px;
  padding: 0;
}
.pop2 .pop-border::after {
  display: none;
}
.pop2 .pop_cont {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: relative;
  z-index: 2;
}
.pop2 .pop_tab_nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.pop2 .pop_tab_nav li {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  height: 45px;
  line-height: 45px;
  border: 1px solid #4a4a49;
  font-size: 14px;
  text-align: center;
  color: #8a7a5a;
  background-color: #221c11;
}
.pop2 .pop_tab_nav li.on {
  border: 1px solid #f2e9c3;
  color: #fff;
  background-color: rgba(52, 43, 27, 0.7);
}

.pop3 {
  width: 1050px;
  height: 510px;
}
.pop3 .p_txt1 {
  line-height: 1;
  margin-bottom: 15px;
  font-weight: bold;
  font-size: 14px;
  color: #ffdca7;
}
.pop3 .p_txt1 span {
  margin-left: 10px;
  font-weight: normal;
  font-size: 12px;
  color: #c8b58d;
}
.pop3 .ky_box {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 15px;
}
.pop3 .ky_list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-gap: 10px;
  width: 570px;
  height: 380px;
  padding-right: 20px;
}
.pop3 .ky_list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 100px;
  height: 120px;
  border: 1px solid rgba(92, 85, 72, 0.8);
  background-color: rgba(34, 30, 24, 0.8);
  cursor: pointer;
}
.pop3 .ky_list li:hover {
  border-color: #ecda9c;
}
.pop3 .ky_list li.on {
  border-color: #ecda9c;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(52, 43, 27, 0.8)), to(#443923));
  background-image: linear-gradient(to bottom, rgba(52, 43, 27, 0.8), #443923);
}
.pop3 .ky_list li.on p {
  color: #fff;
}
.pop3 .ky_list p {
  line-height: 1;
  margin-bottom: 10px;
  font-size: 12px;
  color: #c8b58d;
}
.pop3 .ky_list .img_box {
  width: 55px;
  height: 55px;
  padding: 2px;
  border-radius: 50%;
  border: 1px solid rgba(215, 225, 232, 0.15);
}
.pop3 .ky_list .img_box img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.pop3 .ky_list .star_box {
  display: none;
}
.pop3 .ky_right_btn {
  position: absolute;
  right: 20px;
  bottom: 15px;
}
.pop3 .ky_right_btn div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 84px;
  height: 24px;
  line-height: 24px;
  font-size: 12px;
  color: #c8b58d;
  border: 1px solid #63615e;
  background-color: #231f16;
  cursor: pointer;
}
.pop3 .ky_right_btn div:hover {
  border-color: #f2e9c3;
  color: #fff;
  background-color: #2a2418;
}
.pop3 .ky_right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 410px;
  height: 380px;
  padding-bottom: 40px;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/ky_right.jpg);
}
.pop3 .ky_right_con {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 257px;
  height: 245px;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/ky_bg.png);
}
.pop3 .ky_right_con .max-fw {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  border: 2px solid #a79776;
  border-radius: 50%;
  background-color: #30291c;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  pointer-events: none;
}
.pop3 .ky_right_con .max-fw::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 15px;
  background-color: #c8b58d;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.pop3 .ky_right_con .max-fw::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 15px;
  height: 2px;
  background-color: #c8b58d;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.pop3 .ky_right_con .ky_max {
  position: absolute;
  width: 48px;
  height: 48px;
}
.pop3 .ky_right_con .ky_max.ky_max1 {
  top: -20px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.pop3 .ky_right_con .ky_max.ky_max1 p {
  bottom: calc(100% + 5px);
}
.pop3 .ky_right_con .ky_max.ky_max2 {
  top: 70px;
  right: -20px;
}
.pop3 .ky_right_con .ky_max.ky_max2 p {
  bottom: calc(100% + 5px);
}
.pop3 .ky_right_con .ky_max.ky_max3 {
  bottom: -15px;
  right: 25px;
}
.pop3 .ky_right_con .ky_max.ky_max3 p {
  top: calc(100% + 5px);
}
.pop3 .ky_right_con .ky_max.ky_max4 {
  bottom: -15px;
  left: 25px;
}
.pop3 .ky_right_con .ky_max.ky_max4 p {
  top: calc(100% + 5px);
}
.pop3 .ky_right_con .ky_max.ky_max5 {
  top: 70px;
  left: -20px;
}
.pop3 .ky_right_con .ky_max.ky_max5 p {
  bottom: calc(100% + 5px);
}
.pop3 .ky_right_con .ky_max .skill-close {
  right: 7px;
  top: 5px;
  z-index: 99;
}
.pop3 .ky_right_con .ky_max p {
  position: absolute;
  font-size: 12px;
  white-space: nowrap;
  color: #c8b58d;
}
.pop3 .ky_right_con .ky_max .img_box {
  position: relative;
  width: 48px;
  height: 48px;
  cursor: pointer;
}
.pop3 .ky_right_con .ky_max .img_box::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 96px;
  height: 96px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.pop3 .ky_right_con .ky_max .img_box img {
  position: absolute;
  z-index: 9;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid #e8d784;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}
.pop3 .ky_right_con .ky_max .star_box {
  display: none;
}
.pop3 .ky_right_con .ky_min {
  position: relative;
  width: 174px;
  height: 165px;
}
.pop3 .ky_right_con .ky_min .ky_min_top {
  position: absolute;
  top: 50px;
  left: 50%;
  width: 50px;
  height: 50px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.pop3 .ky_right_con .ky_min .ky_min_top img {
  width: 100%;
  height: 100%;
}
.pop3 .ky_right_con .ky_min .ky {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  width: 30px;
  height: 30px;
}
.pop3 .ky_right_con .ky_min .ky.ky1 {
  bottom: 25px;
  left: 37px;
}
.pop3 .ky_right_con .ky_min .ky.ky2 {
  bottom: 25px;
  right: 37px;
}
.pop3 .ky_right_con .ky_min .ky .skill-close {
  right: 3px;
  top: 3px;
  z-index: 99;
}
.pop3 .ky_right_con .ky_min .ky .flex {
  display: none;
}
.pop3 .ky_right_con .ky_min .ky p {
  display: none;
}
.pop3 .ky_right_con .ky_min .ky .img_box {
  position: relative;
  width: 30px;
  height: 30px;
  cursor: pointer;
}
.pop3 .ky_right_con .ky_min .ky .img_box::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 60px;
  height: 60px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.pop3 .ky_right_con .ky_min .ky .img_box img {
  position: absolute;
  z-index: 9;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid #e8d784;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}
.pop3 .img_box.act::before {
  pointer-events: none;
}
.pop3 .img_box.act .max-fw {
  pointer-events: none;
}
.pop3 .img_box.act img {
  pointer-events: none;
}

.pop4 {
  width: 1300px;
}
.pop4 .pop4-search {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 750px;
  margin-top: 20px;
}
.pop4 .pop4-search .inp_box {
  width: 190px;
}
.pop4 .pop4-search .tips {
  line-height: 1;
  font-size: 12px;
  color: #716d61;
}
.pop4 .custom-checkbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  font-size: 12px;
  color: #716d61;
}
.pop4 .custom-checkbox input[type=checkbox] {
  display: none;
}
.pop4 .custom-checkbox input[type=checkbox]:checked + .checkmark {
  background-color: transparent;
}
.pop4 .custom-checkbox input[type=checkbox]:checked + .checkmark:after {
  content: "";
  position: absolute;
  left: 4px;
  top: 0px;
  width: 3px;
  height: 8px;
  border: solid #716d61;
  border-width: 0 1px 1px 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.pop4 .custom-checkbox .checkmark {
  position: relative;
  width: 12px;
  height: 12px;
  margin-right: 5px;
  border: 1px solid #716d61;
  background-color: transparent;
  cursor: pointer;
}

.pop4-content-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 20px;
}
.pop4-content-box .pop4-content-left {
  width: 760px;
}
.pop4-content-box .pop4-content-right {
  width: 450px;
}
.pop4-content-box.park .pop4-skill-box4, .pop4-content-box.park .pop4-skill-box5 {
  display: none;
}
.pop4-content-box.park .pop-content-bg, .pop4-content-box.park .pop4-skill-title {
  padding-left: 15%;
}

.pop4-skill-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.pop4-skill-title li {
  line-height: 20px;
  font-size: 14px;
  text-align: center;
  color: #c8b58d;
}
.pop4-skill-title li:nth-child(1) {
  width: 240px;
}
.pop4-skill-title li:nth-child(2) {
  width: 130px;
}
.pop4-skill-title li:nth-child(3) {
  width: 160px;
}
.pop4-skill-title li:nth-child(4) {
  width: 150px;
}
.pop4-skill-title li:nth-child(5) {
  width: 38px;
}

.pop4-skill-list {
  max-height: 445px;
  margin-top: 15px;
  margin-right: -20px;
  padding-right: 20px;
  color: #c8b58d;
}
.pop4-skill-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 68px;
  padding: 0;
  border: 1px solid transparent;
  cursor: pointer;
}
.pop4-skill-list li:not(:first-of-type) {
  margin-top: 10px;
}
.pop4-skill-list li.active, .pop4-skill-list li:hover {
  border: 1px solid #e8d784;
}
.pop4-skill-list .pop4-skill-box1 {
  gap: 30px;
  width: 240px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 240px;
          flex: 0 0 240px;
  padding-left: 20px;
}
.pop4-skill-list .pop4-skill-box1 > div {
  width: 48px;
  height: 48px;
  border: 2px solid #e8d784;
}
.pop4-skill-list .pop4-skill-box1 p {
  font-size: 14px;
}
.pop4-skill-list .pop4-skill-box2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 130px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 130px;
          flex: 0 0 130px;
}
.pop4-skill-list .pop4-skill-box2 .pop4-skill-box2-level {
  line-height: 1;
  font-size: 12px;
}
.pop4-skill-list .pop4-skill-box2 .pop4-skill-box2-level-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 90px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.pop4-skill-list .pop4-skill-box2 .pop4-skill-box2-level-btn > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 15px;
  height: 15px;
  line-height: 14px;
  font-size: 12px;
  color: #e8e0b3;
  background-color: #494335;
  cursor: pointer;
}
.pop4-skill-list .pop4-skill-box3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 160px;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 160px;
          flex: 0 0 160px;
}
.pop4-skill-list .pop4-skill-box3 > div:nth-of-type(1) .talent-level {
  color: #59a0c9;
}
.pop4-skill-list .pop4-skill-box3 > div:nth-of-type(2) .talent-level {
  color: #8dba45;
}
.pop4-skill-list .pop4-skill-box3 > div:nth-of-type(3) .talent-level {
  color: #c3a217;
}
.pop4-skill-list .pop4-skill-box3 .pop4-skill-box3-item {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.pop4-skill-list .pop4-skill-box3 .pop4-skill-box3-item .pop4-skill-box3-img {
  position: relative;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(203, 230, 249, 0.25);
  border-radius: 50%;
  overflow: hidden;
}
.pop4-skill-list .pop4-skill-box3 .pop4-skill-box3-item .pop4-skill-box3-img .talent-level {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 16px;
  line-height: 16px;
  font-size: 12px;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.65);
}
.pop4-skill-list .pop4-skill-box3 .pop4-skill-box3-item > span {
  position: absolute;
  top: calc(100% + 2px);
  left: 50%;
  font-size: 12px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.pop4-skill-list .pop4-skill-box3 .pop4-skill-box3-item .skill-close.max {
  top: 2px;
  right: 2px;
}
.pop4-skill-list .pop4-skill-box4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 150px;
}
.pop4-skill-list .pop4-skill-box4 .pop4-skill-box4-baoshi {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  z-index: 9;
  border: 1px solid #e8d784;
  background-color: #121212;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.pop4-skill-list .pop4-skill-box4 .pop4-skill-box4-baoshi > div {
  width: 50px;
  height: 50px;
}
.pop4-skill-list .pop4-skill-box5 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 38px;
}

.pop4-content-right-title {
  margin-bottom: 10px;
  text-align: center;
  color: #80a2b7;
}
.pop4-content-right-title span {
  color: #b1d2e6;
}

.pop4-addSkill-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-height: 480px;
}

.pop4-fw-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-pack: distribute;
      justify-content: space-around;
}
.pop4-fw-list li {
  width: 155px;
}
.pop4-fw-list li:not(:nth-of-type(-n + 2)) {
  margin-top: 30px;
}
.pop4-fw-list .fw-name {
  width: 40px;
  font-size: 14px;
  color: #c8b58d;
}
.pop4-fw-list .fw-item {
  width: 25px;
  height: 25px;
  cursor: pointer;
}
.pop4-fw-list .fw-item img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.pop4-addSkill-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.pop4-addSkill-list .gap-40:last-child {
  margin-bottom: 0 !important;
}
.pop4-addSkill-list .skill-tier {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 280px;
  height: 45px;
  margin-bottom: 5px;
  font-size: 16px;
  color: #f9e98e;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/skill-icon/skill-tier.png);
}
.pop4-addSkill-list .skill-tier + .gap-40 {
  margin-bottom: 20px;
}
.pop4-addSkill-list .skill-tier.skill-tier1 span {
  background-position: 0 0;
}
.pop4-addSkill-list .skill-tier.skill-tier2 span {
  background-position: -54px 0;
}
.pop4-addSkill-list .skill-tier.skill-tier3 span {
  background-position: -107px 0;
}
.pop4-addSkill-list .skill-tier span {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: 45px;
  height: 45px;
  line-height: 45px;
  text-align: center;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.pop4-addSkill-list .pop4-addSkill-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-width: 45px;
}
.pop4-addSkill-list .pop4-addSkill-item .pop4-addSkill-img {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 47px;
  height: 47px;
  background: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/skill-icon/icon-skill-bg.png) no-repeat;
  background-size: 100% 100%;
}
.pop4-addSkill-list .pop4-addSkill-item .pop4-addSkill-img img {
  display: block;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
}
.pop4-addSkill-list .pop4-addSkill-item .pop4-addSkill-img img:hover {
  -webkit-filter: grayscale(0);
          filter: grayscale(0);
}
.pop4-addSkill-list .pop4-addSkill-item .pop4-addSkill-name {
  line-height: 1;
  margin: 5px 0;
  font-size: 12px;
  text-align: center;
  color: #c8b58d;
  white-space: nowrap;
}
.pop4-addSkill-list .pop4-addSkill-item .pop4-addSkill-level {
  line-height: 1;
  font-size: 12px;
  color: #e8e0b3;
}
.pop4-addSkill-list .pop4-addSkill-item .skill-subtractLevel-btn,
.pop4-addSkill-list .pop4-addSkill-item .skill-addLevel-btn {
  width: 15px;
  height: 15px;
  line-height: 15px;
  font-size: 12px;
  text-align: center;
  color: #e8e0b3;
  background: #494335;
  cursor: pointer;
}

.pop5 {
  width: 500px;
  padding: 25px 40px;
}
.pop5 .pop5-ky-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 40px;
  margin-bottom: 25px;
}
.pop5 .pop5-ky-list li {
  position: relative;
  width: 68px;
  height: 68px;
  border: 1px solid #63615e;
  cursor: pointer;
}
.pop5 .pop5-ky-list li.active, .pop5 .pop5-ky-list li:hover {
  border: 1px solid #f2e9c3;
}
.pop5 .pop5-ky-list li.active p, .pop5 .pop5-ky-list li:hover p {
  display: block;
}
.pop5 .pop5-ky-list li img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.pop5 .pop5-ky-list p {
  display: none;
  position: absolute;
  bottom: calc(100% + 10px);
  left: 0;
  width: 100%;
  line-height: 1;
  font-size: 12px;
  text-align: center;
  color: #c8b58d;
}
.pop5 .pop5-tab-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.pop5 .pop5-tab-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 49%;
  height: 40px;
  font-size: 12px;
  border: 1px solid #63615e;
  color: #c8b58d;
  background-color: #342b1b;
  cursor: pointer;
}
.pop5 .pop5-tab-list li.active, .pop5 .pop5-tab-list li:hover {
  border: 1px solid #ecda9c;
  color: #fff;
}
.pop5 .pop5-tab-list li .icon-close-circle {
  position: absolute;
  top: -8px;
  right: -8px;
  cursor: pointer;
}
.pop5 .pop5-lj-box {
  position: relative;
  margin-top: 25px;
}
.pop5 .pop5-lj-box > p {
  line-height: 1;
  margin-bottom: 10px;
  font-size: 12px;
  color: #c8b58d;
}
.pop5 .pop5-lj-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  height: 350px;
  margin-right: -20px;
}
.pop5 .pop5-lj-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 130px;
  height: 50px;
  border: 1px solid rgba(182, 209, 226, 0.15);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  cursor: pointer;
}
.pop5 .pop5-lj-list li:not(:nth-of-type(-n + 3)) {
  margin-top: 10px;
}
.pop5 .pop5-lj-list li:not(:nth-of-type(3n)) {
  margin-right: 15px;
}
.pop5 .pop5-lj-list li.active, .pop5 .pop5-lj-list li:hover {
  border: 1px solid #ecda9c;
  background-color: #2f271a;
}
.pop5 .pop5-lj-list li.active p, .pop5 .pop5-lj-list li:hover p {
  color: #fff;
}
.pop5 .pop5-lj-list p {
  line-height: 1;
  font-size: 14px;
  color: #878273;
}
.pop5 .pop5-lj-list p + p {
  margin-top: 5px;
  font-size: 12px;
}

.pop7 {
  width: 820px;
}
.pop7 .pop-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  margin-bottom: 60px;
}
.pop7 .combo-tip {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  line-height: 1.5;
  font-size: 12px;
  color: #ccc;
}
.pop7 .switch-skills {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 15px;
  font-size: 12px;
  color: #c8b58d;
}
.pop7 .switch-skills i {
  display: block;
  width: 12px;
  height: 10px;
  margin-left: 5px;
  background: url("https://game.gtimg.cn/images/fz/cp/a20250320LA/switch-skills.png") no-repeat;
}
.pop7 .pop7-skill-list {
  height: 102px;
  overflow-x: auto;
}
.pop7 .pop7-skill-list .pop7-skill-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 15px;
  font-size: 12px;
  color: #c8b58d;
  cursor: pointer;
}
.pop7 .pop7-skill-list .pop7-skill-item:last-child {
  margin-right: 0;
}
.pop7 .pop7-skill-list .pop7-skill-item .pop7-skill-img {
  width: 52px;
  height: 52px;
  border: 2px solid #e8d784;
}
.pop7 .pop7-skill-list .pop7-skill-item .pop7-skill-img img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.pop7 .pop7-skill-list .pop7-skill-item span {
  display: block;
  height: 20px;
  line-height: 20px;
  white-space: nowrap;
}
.pop7 .pop7-inp {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 24px;
  line-height: 24px;
  border: 1px solid #544a34;
  font-size: 12px;
  text-align: center;
  color: #c8b58d;
  background-color: #342b1b;
}
.pop7 .pop7-inp::-webkit-input-placeholder {
  color: #c8b58d;
}
.pop7 .pop7-inp::-moz-placeholder {
  color: #c8b58d;
}
.pop7 .pop7-inp:-ms-input-placeholder {
  color: #c8b58d;
}
.pop7 .pop7-inp::-ms-input-placeholder {
  color: #c8b58d;
}
.pop7 .pop7-inp::placeholder {
  color: #c8b58d;
}
.pop7 .pop7-inp:focus {
  border: 1px solid #e8d784;
}
.pop7 .pop-content-box {
  overflow-x: auto;
}
.pop7 .pop7-addSkill-list li {
  position: relative;
  min-width: 75px;
  height: 90px;
  margin-right: 20px;
  padding-top: 7px;
  background-color: #271f10;
  -webkit-box-shadow: 0 0 0 1px #544a34 inset;
          box-shadow: 0 0 0 1px #544a34 inset;
}
.pop7 .pop7-addSkill-list li > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.pop7 .pop7-addSkill-list .gap-40 {
  gap: 20px;
  padding: 0 7px;
}
.pop7 .pop7-addSkil-item {
  position: relative;
  min-width: 75px;
  height: 90px;
  padding-top: 7px;
  background-color: #271f10;
  -webkit-box-shadow: 0 0 0 1px #544a34 inset;
          box-shadow: 0 0 0 1px #544a34 inset;
}
.pop7 .pop7-addSkil-item div {
  pointer-events: none;
}
.pop7 .pop7-addSkil-item .pop7-jia {
  position: relative;
  width: 52px;
  height: 52px;
  border: 1px solid #544a34;
  margin: auto;
  background-color: #271f10;
}
.pop7 .pop7-addSkil-item .pop7-jia span {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 45px;
  color: #b7a480;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.pop7 .pop7-addSkill-img {
  width: 52px;
  height: 52px;
  border: 2px solid #e8d784;
}
.pop7 .pop7-addSkill-img img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.pop7 .pop7-addSkill-desc {
  position: relative;
  width: 100%;
  height: 24px;
  line-height: 24px;
  margin-top: 7px;
  border: 1px solid #544a34;
  font-size: 12px;
  text-align: center;
  color: #c8b58d;
  background-color: #342b1b;
}
.pop7 .pop7-addSkill-desc span {
  display: block;
  padding: 0 10px;
  width: auto;
  white-space: nowrap;
}

.skill_zh {
  display: none;
}

.gap-40 .skill_zh {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.skill-close.max {
  background: url("https://game.gtimg.cn/images/fz/cp/a20250320LA/skill-close.png") no-repeat;
  width: 16px;
  height: 16px;
  color: #172f3e;
  font-size: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
}

.skill-close {
  background: url("https://game.gtimg.cn/images/fz/cp/a20250320LA/skill-close.png") no-repeat;
  width: 12px;
  height: 12px;
  z-index: 2;
  color: #172f3e;
  background-size: 100% 100%;
  opacity: 0.8;
  font-size: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
}

.pop_cont {
  width: 100%;
  height: 100%;
}

.pop_cont::-webkit-scrollbar {
  width: 0;
}

.pop .inp_box {
  position: relative;
  width: 160px;
  height: 27px;
}

.pop .inp {
  display: block;
  width: 100%;
  height: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-color: #1b1b1b;
  border: 1px solid #33302b;
  color: #878273;
  font-size: 12px;
  padding: 0 10px;
}

.pop .inp::-webkit-input-placeholder {
  color: #878273;
}

.pop .inp::-moz-placeholder {
  color: #878273;
}

.pop .inp:-ms-input-placeholder {
  color: #878273;
}

.pop .inp::-ms-input-placeholder {
  color: #878273;
}

.pop .inp::placeholder {
  color: #878273;
}

.pop .inp_box a {
  position: absolute;
  top: 50%;
  right: 5px;
  width: 16px;
  height: 18px;
  background-image: url("https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/pop_search.png");
  background-size: 16px 18px;
  -webkit-transform: translateY(-50%) scale(0.8);
          transform: translateY(-50%) scale(0.8);
}

.pop_tab_con {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.pop_tab_con img {
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}

.pop_tab_con .jh_list li:hover img {
  -webkit-filter: grayscale(0);
          filter: grayscale(0);
}

.pop_tab_con .jh_list li.on img {
  -webkit-filter: grayscale(0);
          filter: grayscale(0);
}

.pop .tab_box {
  width: 100%;
  height: 100%;
  max-height: 663px;
}
.pop .tab_box .box_con {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
}
.pop .tab_box .tab_left {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 320px;
          flex: 0 0 320px;
  width: 320px;
  height: 100%;
  padding-top: 25px;
  border-right: 1px solid rgba(255, 255, 255, 0.1);
}
.pop .tab_box .tab_left li {
  width: 100%;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.pop .tab_box .tab_left li > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 65px;
  padding-left: 30px;
}
.pop .tab_box .tab_left img {
  width: 42px;
  height: 42px;
  margin-right: 10px;
  border: 2px solid #e8d784;
  -webkit-filter: grayscale(0);
          filter: grayscale(0);
}
.pop .tab_box .tab_left p {
  font-size: 14px;
  color: #c5c5c5;
}
.pop .tab_box .tab_left p span {
  color: #f7d68a;
}

.pop .tab_right {
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding: 30px 25px;
}
.pop .tab_right .right_top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.pop .tab_right .right_top .pop_tips {
  font-size: 12px;
  color: #878273;
}
.pop .tab_right .right_top .right_top_btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.pop .tab_right .right_top .right_top_btn p {
  margin-right: 25px;
  font-size: 12px;
  color: #c8b58d;
}
.pop .tab_right .right_top .right_top_btn a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100px;
  height: 32px;
  font-size: 14px;
  color: #c8b58d;
  border: 1px solid #63615e;
  background-color: #231f16;
  cursor: pointer;
}
.pop .tab_right .right_top .right_top_btn a:hover {
  border-color: #f2e9c3;
  color: #fff;
  background-color: #2a2418;
}
.pop .tab_right .right_list {
  position: relative;
}
.pop .tab_right .right_list .list_li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  width: 100%;
  cursor: pointer;
}
.pop .tab_right .right_list .list_li:not(:first-of-type) {
  margin-top: 15px;
}
.pop .tab_right .right_list .list_li:hover .grade, .pop .tab_right .right_list .list_li.on .grade {
  -webkit-filter: grayscale(0);
          filter: grayscale(0);
}
.pop .tab_right .right_list .grade {
  position: relative;
  width: 109px;
  height: 108px;
  background: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/grade.png);
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
}
.pop .tab_right .right_list .grade .grade_txt1 {
  width: 109px;
  height: 108px;
  line-height: 108px;
  font-weight: bold;
  font-size: 28px;
  text-align: center;
  color: #bebebe;
  color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fdf7e5), to(#e9cd73));
  background-image: linear-gradient(to bottom, #fdf7e5, #e9cd73);
  -webkit-background-clip: text;
          background-clip: text;
}
.pop .tab_right .right_list .grade .grade_txt2 {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 60px;
  height: 16px;
  line-height: 16px;
  font-size: 14px;
  text-align: center;
  color: #f1df89;
  background-image: -webkit-gradient(linear, left top, right top, color-stop(10%, transparent), color-stop(#4e3d1c), color-stop(90%, transparent));
  background-image: linear-gradient(to right, transparent 10%, #4e3d1c, transparent 90%);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.pop .tab_right .right_bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 20px;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 85px;
  padding: 0 25px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.pop .tab_right .right_bottom a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 114px;
  height: 37px;
  line-height: 37px;
  font-size: 14px;
  color: #c8b58d;
  border: 1px solid #63615e;
  background-color: #231f16;
  cursor: pointer;
}
.pop .tab_right .right_bottom a:hover {
  border-color: #f2e9c3;
  color: #fff;
  background-color: #2a2418;
}

.pop .sp1 {
  background: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/pop_sp1.png) no-repeat;
  background-size: 300px 500px;
}

.pop .right_list .jh_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 12px;
  width: 480px;
  height: 90px;
}

.pop .tab_box2 .right_list .jh_list {
  display: grid;
  grid-template-areas: "passive1 passive2 passive3 passive4 passive5 passive6";
  grid-template-columns: repeat(6, 1fr);
  justify-items: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.pop .tab_box2 .right_list .jh_list .passive1 {
  grid-area: passive1;
}
.pop .tab_box2 .right_list .jh_list .passive2 {
  grid-area: passive2;
}
.pop .tab_box2 .right_list .jh_list .passive3 {
  grid-area: passive3;
}
.pop .tab_box2 .right_list .jh_list .passive4 {
  grid-area: passive4;
}
.pop .tab_box2 .right_list .jh_list .passive5 {
  grid-area: passive5;
}
.pop .tab_box2 .right_list .jh_list .passive6 {
  grid-area: passive6;
}

.pop2 .expend_num {
  position: absolute;
  bottom: 5px;
  left: 50%;
  font-size: 12px;
  color: #fff;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.pop .right_list .jh_list li.passive3::before,
.pop .right_list .jh_list li.passive4::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 0;
  top: -21%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 2px;
  height: 42%;
  background-color: #494335;
}

.pop .right_list .list_li:nth-of-type(1) .jh_list li.passive3::before,
.pop .right_list .list_li:nth-of-type(1) .jh_list li.passive4::before,
.pop .right_list .list_li:nth-of-type(1) .jh_list li.passive3::after,
.pop .right_list .list_li:nth-of-type(1) .jh_list li.passive4::after {
  display: none;
}

.jh_list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  width: 70px;
  height: 86px;
}
.jh_list li:hover .jh_box, .jh_list li.on .jh_box {
  -webkit-filter: grayscale(0);
          filter: grayscale(0);
}
.jh_list li:hover .jh_txt, .jh_list li.on .jh_txt {
  border: 1px solid #f2e9c3;
  color: #fff;
}
.jh_list .jh_box {
  position: relative;
  width: 56px;
  height: 56px;
  padding: 5px;
  background-image: url(https://game.gtimg.cn/images/fz/cp/a20250320LA/pop/jh_box.png);
  -webkit-filter: grayscale(1) brightness(0.8);
          filter: grayscale(1) brightness(0.8);
}
.jh_list .jh_box img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.jh_list .jh_txt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 70px;
  height: 20px;
  border: 1px solid rgba(99, 97, 94, 0.25);
  border-radius: 10px;
  font-size: 12px;
  color: #c8b58d;
  background-color: #2e281d;
}

.skill-box .component8-skill-box {
  -webkit-box-orient: unset;
  -webkit-box-direction: unset;
      -ms-flex-direction: unset;
          flex-direction: unset;
  width: auto;
  margin: 0;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: start;
  row-gap: 20px;
}

.skill-box {
  width: 100%;
}
.skill-box .skill-item {
  margin: 0 auto 0;
  margin-left: 0;
  margin-right: 50px;
  position: relative;
}
.skill-box .skill-item:last-of-type {
  margin-right: 0;
}
.skill-box .skill-item:last-of-type::before {
  display: none;
}
.skill-box .skill-item::before {
  content: "";
  position: absolute;
  top: 14.5px;
  left: calc(100% + 21.5px);
  width: 7px;
  height: 11px;
  background: url("https://game.gtimg.cn/images/fz/cp/a20250320LA/icon666.png");
}