@charset "utf-8";

#sts21{
  margin-bottom: 10%;    
}
#sts21 a:hover {
  opacity: 0.7;
  text-decoration: none;
}
#sts21 .main {
  padding: 0;
  margin: 3% 0 5%;
}
#sts21 .main h1 {
  padding: 0;
  margin: 0;
}
#sts21 .main p {
  font-size: 14px;
  text-align: right;
  margin: 0;
  padding: 0;
}
#sts21 h2 {
  width: 100%;
  text-align: left;
  color: #024fa6;
  font-size: 26px;
  font-weight: normal;
  margin: 0 0 1em;
  padding: 0 0 1%;
  border-bottom: 1px solid #024fa6;
  font-family: "A-OTF 秀英明朝 Pro M","Hiragino Mincho ProN","Yu Mincho","MS PMincho",serif;
}
#sts21 h2:nth-of-type(2),#sts21 h2:nth-of-type(3) {
  margin: 1em 0;
}
#sts21 h2.ttl {
  padding: 0 0 0 2.5em;
  position: relative;
}
#sts21 h2.ttl::before {
    content: "";
    position: absolute;
    left: 0;
    top: 30%;
    width: 50px;
    height: 49px;
    transform: translateY(-50%);
    background: url("/img/usr/category/sts00/sts21/260619_sts21_ttl.png") no-repeat center / contain;
    margin-right: 1em;
}
#sts21 .bold {
  font-weight: bold;
}
#sts21 .big {
  font-size: 32px;
  margin: 0 1em 0 0.2em;
}
#sts21 .red {
  color: #f51818;
}
#sts21 .pickup {
  display: flex;
  flex-wrap: wrap; 
  column-gap: 1.5%;
  margin-bottom: 10%;
}
#sts21 .pickup > div {
  width: calc((100% - 3%) / 3);
  box-sizing: border-box;
  margin-bottom: 3vw;
}
#sts21 .pickup > div:nth-last-child(-n + 3) {
  margin-bottom: 0;
}
#sts21 .pickup .column2 {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    column-gap: 0%;
}
#sts21 .pickup .column2 > div {
    width: calc((100% - 0%) / 2);
    box-sizing: border-box;
}
#sts21 .pickup .column2 > div a {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 100%;
}
#sts21 .pickup .column2 .imgs {
    display: flex;
    flex-direction: column;
    width: 65%;
}

#sts21 .pickup .column2 .imgs img {
    width: 100%;
    height: auto;
    display: block;
}
#sts21 .pickup .column2 p {
    width: 35%;
    margin: 0;
    display: flex;
    align-items: flex-end;
    padding: 0 0 0 3%;
}
#sts21 .pickup p.imgEnd {
    width: 100%;
    margin: 7% 0 0 0;
}
#sts21 .moreLink {
  background-color: #024fa6;
  padding: 1.5% 5%;
  max-width: 275px;
  margin: 0 0 0 auto;
  position: relative;
}
#sts21 .moreLink:hover {
  opacity: 0.7;
}
#sts21 .moreLink a{
  color: #fff;
}
#sts21 .moreLink a::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#sts21 .moreLink p{
  font-size: 16px;
  text-align: center;
  margin: 0; 
}
#sts21 .moreLink p:after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  float: right;
  background: transparent;
  border-top: solid 1px #fff;
  border-right: solid 1px #fff;
  transform: rotate(45deg) translate(0, -50%);
  margin: 13px 0;
}
.block-ranking-r--items dl a:before {
  display: none!important; 
}