用户:25851741/草稿箱/沙盒0001/style.css

.rarity-img {
  width: 32px; 
  margin-right: 5px;
  position:absolute; 
  top: 5px; 
  right: 15px;
  z-index:10;
}
.bangboo-title-S {
  background: #2e2e2e; 
  padding: 6 15 6 15; 
  border-bottom: 4px solid #fede00; 
  color: white; 
  font-size:18px; 
  font-weight:bold; 
  border-radius:5px;
  position: relative;
}
.bangboo-title-A {
  background: #2e2e2e; 
  padding: 6 15 6 15; 
  border-bottom: 4px solid #f160ff; 
  color: white; 
  font-size:18px; 
  font-weight:bold; 
  border-radius:5px;
  position: relative;
}
.bangboo-title-S::after,
.bangboo-title-A::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 75px;
  height: 100%;
  background: repeating-linear-gradient(
    135deg,
    transparent,
    transparent 3px,
    rgba(255, 255, 255, 0.2) 3px,
    rgba(255, 255, 255, 0.2) 6px
  );
}
.bangboo-table-S,
.bangboo-table-A { 
  background: transparent;
  border-radius: 5px;
  border-collapse: separate;
  border:none;
  border-spacing: 6px;
  box-shadow: none;
  margin: 0;
}
.bangboo-table-S>tr>th,
.bangboo-table-S>tr>td,
.bangboo-table-S>*>tr>th,
.bangboo-table-S>*>tr>td {
  border:1.5px solid #d0d0d0;
  border-radius: 10px;
  padding:5px 12px;
  background: linear-gradient(135deg, #ffffff90 80%, #c7c7c7b0 100%); 
  box-shadow: 0px 3px 3px rgba(35, 35, 35, 0.38);
  border-left: 6px solid #fede00; 
}
.bangboo-table-A>tr>th,
.bangboo-table-A>tr>td,
.bangboo-table-A>*>tr>th,
.bangboo-table-A>*>tr>td {
  border:1.5px solid #d0d0d0;
  border-radius: 10px;
  padding:5px 12px;
  background: linear-gradient(135deg, #ffffff90 80%, #c7c7c7b0 100%); 
  box-shadow: 0px 3px 3px rgba(35, 35, 35, 0.38);
  border-left: 6px solid #f160ff; 
}
.title-text { 
  color: #5b5b5b;
  border-bottom: 2px solid #d0d0d0;
}
.button-text {
  color: #fff; 
  background: #4571ec;
  border-radius: 10px;
  margin-left: 12px;
  padding: 0 4px;
  font-weight:bold;
}
.skill-text { 
  color:#fff;
  background: #5b5b5b;
  border-radius: 8px;
  text-align:center;
  font-weight:bold;
  font-size: 16px;
  border-bottom: 4px solid #92bc00; 
  position: relative;
  margin: 10px;
  padding: 4px;
  text-shadow: 0px 2px 2px #000;
}
.skill-text ::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: repeating-linear-gradient(
    135deg,
    transparent,
    transparent 8px,
    rgba(255, 255, 255, 0.1) 8px,
    rgba(255, 255, 255, 0.1) 14px
  );
}
.datachart-table-S,
.ascension-table-S {
  background: linear-gradient(160deg, #ffffff90 30% 20%, #f8dd0033 100%);
  color: black;
  padding: 10px;
  margin: 1em 0;
  border-collapse: separate;
  font-size: 14px;
  border-radius: 5px;
}
.datachart-table-A,
.ascension-table-A {
  background: linear-gradient(160deg, #ffffff90 30% 20%, #e700fe30 100%);
  color: black;
  padding: 10px;
  margin: 1em 0;
  border-collapse: separate;
  font-size: 14px;
  border-radius: 5px;
}
.datachart-table-S>tr>th,
.datachart-table-S>*>tr>th {
  font-size: 15px;
  color: #fff;
  background: #000000b0;
  text-align: center;
  font-weight:bold;
  padding:10px;
}
.datachart-table-A>tr>th,
.datachart-table-A>*>tr>th {
  font-size: 15px;
  color: #fff;
  background: #000000b0;
  text-align: center;
  font-weight:bold;
  padding:10px;
}
.datachart-table-S>tr:nth-child(2)>th,
.datachart-table-S>*>tr:nth-child(2)>th {
  border-bottom: 3px solid #fede00;
}
.datachart-table-A>tr:nth-child(2)>th,
.datachart-table-A>*>tr:nth-child(2)>th {
  border-bottom: 3px solid #f160ff;
}
.ascension-table-S>tr>th,
.ascension-table-S>*>tr>th {
  font-size: 15px;
  color: #fff;
  background: #000000b0;
  text-align: left;
  font-weight:bold;
  padding:10px;
  border-bottom: 3px solid #fede00;
  border-radius: 5px;
}
.ascension-table-A>tr>th,
.ascension-table-A>*>tr>th { 
  font-size: 15px;
  color: #fff;
  background: #000000b0;
  text-align: left;
  font-weight:bold;
  padding:10px;
  border-bottom: 3px solid #f160ff;
  border-radius: 5px;
}
.datachart-table-S>tr>td,
.datachart-table-S>*>tr>td,
.datachart-table-A>tr>td,
.datachart-table-A>*>tr>td {
  text-align: center;
  padding: 12px;
}
.ascension-table-S>tr>td,
.ascension-table-S>*>tr>td,
.ascension-table-A>tr>td,
.ascension-table-A>*>tr>td {
  text-align: center;
  padding:2px;
}
.datachart-table-S > tr:nth-child(n+4) > td,
.datachart-table-S > * > tr:nth-child(n+4) > td,
.datachart-table-A > tr:nth-child(n+4) > td,
.datachart-table-A > * > tr:nth-child(n+4) > td,
.ascension-table-S > tr:nth-child(n+3) > td,
.ascension-table-S > * > tr:nth-child(n+3) > td,
.ascension-table-A > tr:nth-child(n+3) > td,
.ascension-table-A > * > tr:nth-child(n+3) > td {
  border-top: 1px solid #000;
}
.ascension-table-S > tr:nth-child(2) > td,
.ascension-table-S > * > tr:nth-child(2) > td,
.ascension-table-A > tr:nth-child(2) > td,
.ascension-table-A > * > tr:nth-child(2) > td {
  padding-top:8px;
}
.skill-gradient-S>tr>td,
.skill-gradient-S>*>tr>td{
  background: linear-gradient(165deg, #ffffff90 20%, #f8dd0033 100%); 
}
.skill-gradient-A>tr>td,
.skill-gradient-A>*>tr>td{
  background: linear-gradient(165deg, #ffffff90 20%, #f160ff40 100%); 
}
.splash-box-div .resp-tabs .resp-tabs-list {
  white-space: normal;
  background: #2e2e2e;
  background-size: cover;
  background-position: left;
  display: flex;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
  margin:0px !important;
  padding-bottom: 0px !important;
  border-bottom: 4px solid #d8fa00;
  border-radius: 5px;
}
.splash-box-div .resp-tabs-list li {
  border-left: 1px solid rgba(0,0,0,0.16);
  float: left;
  background: #2e2e2e;
  border: 0px solid #404040;
  padding: 0px 3px 0px 3px;
  margin-bottom: 6px;
  margin-top: 2px;
}
.splash-box-div .resp-tabs-list li.active .tab-panel,.splash-box-div  .tab-panel:hover {
  font-family: MicrosoftYaHei;
  font-size: 12px !important; 
  color: #d8fa00;
  text-align: center;
  background: #2e2e2e;
  box-shadow: 0 0px 0px 0 rgba(0,0,0,0.30);
  border-bottom: 2px solid #d8fa00;
}
.splash-box-div .tab-panel {
  font-size: 12px !important; 
  display: block;
  height: 100%;
  line-height: 18px;
  color: #ddd;
  text-decoration: none;
  background: transparent;
  box-shadow: 0 0px 0px 0 rgba(0,0,0,0.30);
  white-space: nowrap;
  border-bottom: 2px solid transparent;
}
.splash-box-div .resp-tabs-list li:last-child {
  border: 0px solid rgba(0,0,0,0.16);
}
.splash-box-div {
  background-color: none;
}
.splash-box-div .resp-tab-content {
  padding: 15px 0 15px 0;
}
.rare-S {
  border-bottom:3px solid #fede00;
}
.rare-A {
  border-bottom:3px solid #f160ff;
}
@media only screen and (max-width:759px){
  .datachart-table-S>tr>td,
  .datachart-table-S>*>tr>td,
  .datachart-table-A>tr>td,
  .datachart-table-A>*>tr>td {
    padding: 8px;
  }
}

table.upperTable, table.lowerTable {
    text-align: center;
    margin-top: 0px;
    width: 100%;
}
.upperRight {
    border-top-right-radius: 5px;
}
.upperRightBottom {
    border-bottom-right-radius: 5px;
}
.lowerLeft {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

@media (min-width: 1100px) {
    .invisible-xs {
        display: flex;
        padding: 10px;
        margin-bottom: 14px;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    }
    .invisible-xs.background-S {
        background: linear-gradient(165deg, #ffffff90 20%, #f8dd0033 100%); 
    }
    .invisible-xs.background-A {
        background: linear-gradient(165deg, #ffffff90 20%, #f160ff40 100%); 
    }
    table.upperTable {
        width: 60%;
        background: none;
    }
    table.lowerTable {
        width: 40%;
        background: none;
    }
    .upperRight {
        border-top-right-radius: 0;
        padding: 0;
        margin: 0;
    }
    .upperRightBottom {
        border-bottom-right-radius: 0;
        padding: 0;
        margin: 0;
    }
    .lowerLeft {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }
    .lowerTd {
        display: none;
    }
    .lvl10plus {
        height: 65px;
    }
}