/************************************
	Games
************************************/
.games .conts-box#pickup {
  margin-bottom: 6vw;
}
@media screen and (min-width: 769px) {
  .games .conts-box#pickup {
    margin-bottom: min(4vw, 72px);
  }
}
@media screen and (min-width: 1024px) {
  .games .conts-box#pickup .conts-box-inner {
    margin-right: auto;
    margin-left: auto;
    max-width: 1680px;
  }
}
.games .conts-box#series, .games .conts-box#search {
  background: #FFF;
  padding-top: 4vw;
  padding-bottom: 4vw;
}
@media screen and (min-width: 769px) {
  .games .conts-box#series, .games .conts-box#search {
    padding-top: min(2vw, 36px);
    padding-bottom: min(2vw, 36px);
  }
}
@media screen and (min-width: 1024px) {
  .games .conts-box#series .conts-box-inner {
    margin-right: auto;
    margin-left: auto;
    max-width: 1680px;
  }
}
.games .conts-box#search {
  margin-bottom: 0;
  padding-bottom: 8vw;
}
@media screen and (min-width: 769px) {
  .games .conts-box#search {
    padding-bottom: min(4vw, 72px);
  }
}
@media screen and (min-width: 1024px) {
  .games .conts-box#search .conts-box-inner {
    margin-right: auto;
    margin-left: auto;
    max-width: 1280px;
  }
}
.games .conts-box#search .ttl-h2 {
  font-size: 0.66rem;
}
@media screen and (min-width: 769px) {
  .games .conts-box#search .ttl-h2 {
    font-size: min(0.6rem, 60px);
  }
}
@media screen and (min-width: 769px) {
  .games .conts-box#search .search-form .conts-box-inner {
    overflow: hidden;
    position: relative;
    width: 100%;
  }
}
@media screen and (min-width: 769px) {
  .games .conts-box#search .search-form .conts-box-inner::after {
    content: "";
    display: block;
    position: absolute;
    background: #E8E9EE;
    left: calc((660 / 1600) * 100%);
    height: 100%;
    top: 0;
    width: 2px;
  }
}
@media screen and (max-width: 768px) {
  .games .conts-box#search .search-platform {
    margin-bottom: 4vw;
  }
}
@media screen and (min-width: 769px) {
  .games .conts-box#search .search-platform {
    float: left;
    padding-bottom: min(1vw, 18px);
    padding-right: calc((40 / 1600) * 100%);
    width: calc((660 / 1600) * 100%);
  }
}
@media screen and (max-width: 768px) {
  .games .conts-box#search .search-series {
    margin-bottom: 4vw;
  }
}
@media screen and (min-width: 769px) {
  .games .conts-box#search .search-series {
    float: right;
    padding-bottom: min(1vw, 18px);
    width: calc((900 / 1600) * 100%);
  }
}
@media screen and (max-width: 768px) {
  .games .conts-box#search .search-type {
    margin-bottom: 4vw;
  }
}
@media screen and (min-width: 769px) {
  .games .conts-box#search .search-type {
    margin-bottom: min(2vw, 36px);
    padding-right: calc((40 / 1600) * 100%);
    width: calc((660 / 1600) * 100%);
  }
}
.games .conts-box#search .search-keyword {
  position: relative;
}
@media screen and (max-width: 768px) {
  .games .conts-box#search .search-keyword {
    margin-bottom: 8vw;
  }
}
@media screen and (min-width: 769px) {
  .games .conts-box#search .search-keyword {
    float: right;
    margin-top: min(2vw, 36px);
    width: calc((900 / 1600) * 100%);
  }
}
.games .conts-box#search .search-keyword input[type=text] {
  -webkit-appearance: none;
  border: 1px solid #333;
  font-family: "source-han-sans-japanese", sans-serif;
  font-size: 0.36rem;
  padding: 0.75em 1em;
  width: 100%;
}
@media screen and (min-width: 769px) {
  .games .conts-box#search .search-keyword input[type=text] {
    font-size: min(0.2rem, 20px);
    padding: 0.5em 1em;
  }
}
.games .conts-box#search .search-keyword .search-btn-ic {
  display: none;
}
.games .conts-box#search .search-btn {
  margin-top: 4vw;
  width: 100%;
}
@media screen and (min-width: 769px) {
  .games .conts-box#search .search-btn {
    margin-top: min(4vw, 72px);
  }
}
.games .conts-box#search .search-pulldown {
  border: 1px solid #004098;
  border-radius: 0.2em;
  color: #004098;
  display: block;
  padding: 0.5em 1em 1em;
  position: relative;
  text-align: center;
}
.games .conts-box#search .search-pulldown-label {
  font-weight: 500;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
.games .conts-box#search .search-pulldown select {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  background-image: none;
  border: none;
  box-shadow: none;
  outline: none;
  opacity: 0;
  text-overflow: ellipsis;
  width: 100%;
}
.games .conts-box#search .search-pulldown::after {
  color: #004098;
  content: "\e5d7";
  font-family: "Material Icons";
  font-size: 1.15em;
  font-weight: 500;
  position: absolute;
  right: 0.5em;
  top: 50%;
  transform: translateY(-50%);
}
.games .conts-box#search.is-check .search-pulldown {
  display: none;
}
.games .conts-box#search.is-select .conts-box-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.games .conts-box#search.is-select .search-list-ttl,
.games .conts-box#search.is-select .search-list {
  display: none;
}
.games .conts-box#search.is-select .search-platform {
  margin-bottom: 4.8vw;
  order: 2;
  width: 49%;
}
.games .conts-box#search.is-select .search-series {
  margin-bottom: 4.8vw;
  order: 1;
  width: 49%;
}
.games .conts-box#search.is-select .search-type {
  margin-bottom: 4.8vw;
  order: 3;
  width: 49%;
}
.games .conts-box#search.is-select .search-keyword {
  margin-bottom: 4vw;
  order: 4;
  width: 100%;
}
.games .conts-box#search.is-select .search-btn-ic {
  top: 50%;
}
.games .conts-box#app {
  padding: 0 0 0 4vw;
}
@media screen and (min-width: 769px) {
  .games .conts-box#app {
    padding: 0 min(2vw, 36px);
  }
}
@media screen and (min-width: 1024px) {
  .games .conts-box#app .conts-box-inner {
    margin-right: auto;
    margin-left: auto;
    max-width: 1680px;
  }
}
@media screen and (max-width: 768px) {
  .games .conts-box#app .swiper-container {
    padding-right: 4vw;
  }
}
@media screen and (min-width: 769px) {
  .games .conts-box#app .ttl-h2 {
    margin-bottom: min(1vw, 18px);
  }
}
.games .conts-box#app .ttl-h2 img {
  width: calc((520 / 1080) * 100%);
}
@media screen and (min-width: 769px) {
  .games .conts-box#app .ttl-h2 img {
    width: calc((400 / 1920) * 100%);
  }
}
.games .title-list:not(.swiper-wrapper) {
  display: flex;
  flex-wrap: wrap;
}
.games .title-list .list {
  margin-bottom: 4vw;
  position: relative;
}
@media screen and (min-width: 769px) {
  .games .title-list .list {
    margin-bottom: 2vw;
    width: 49%;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list .list.size-full {
    width: 100%;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list .list:not(.size-full):not(:nth-child(even)) {
    margin-right: 2%;
  }
}
.games .title-list .list .panel {
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 768px) {
  .games .title-list .list .panel {
    background: none !important;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list .list .panel {
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
  }
}
.games .title-list .list .panel-inner {
  position: relative;
}
@media screen and (min-width: 769px) {
  .games .title-list .list .panel-bg {
    background-clip: content-box;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    -ms-filter: blur(2px);
    filter: blur(2px);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list .list .panel-bg::before {
    background: rgba(0, 0, 0, 0.5);
    bottom: 0;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    width: 100%;
  }
}
.games .title-list .list .thumb {
  line-height: 0;
}
@media screen and (min-width: 769px) {
  .games .title-list .list .thumb img.hide {
    visibility: hidden;
  }
}
.games .title-list .list .detail {
  background: #FFF;
  box-sizing: border-box;
  padding: 2vw 2.6666666667vw;
  position: relative;
  width: 100%;
}
@media screen and (min-width: 769px) {
  .games .title-list .list .detail {
    background: rgba(0, 0, 0, 0.5);
    bottom: 0;
    left: 0;
    opacity: 0;
    padding: min(0.5vw, 9px) min(1vw, 18px);
    position: absolute;
    transition: opacity 0.5s ease-out, z-index 0.5s ease-out;
    z-index: -1;
  }
}
.games .title-list .list .detail .info-box {
  position: relative;
}
@media screen and (min-width: 769px) {
  .games .title-list .list .detail .info-box {
    margin-right: auto;
    width: 40%;
    z-index: 2;
  }
}
.games .title-list .list .detail .info-box .title {
  line-height: 1.2;
  margin-bottom: 1vw;
}
@media screen and (max-width: 768px) {
  .games .title-list .list .detail .info-box .title {
    font-size: 0.36rem;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list .list .detail .info-box .title {
    color: #FFF;
    display: flex;
    align-items: flex-end;
    margin-bottom: min(0.5vw, 6px);
  }
}
.games .title-list .list .detail .info-box .date {
  margin-bottom: 1.3333333333vw;
}
@media screen and (min-width: 769px) {
  .games .title-list .list .detail .info-box .date {
    color: #FFF;
    margin-bottom: min(0.6666666667vw, 12px);
  }
}
.games .title-list .list .detail .info-box .pf-list .pf {
  max-width: 7em;
}
.games .title-list .list .detail .conts-list {
  display: none;
}
@media screen and (min-width: 769px) {
  .games .title-list .list .detail .conts-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    position: absolute;
    right: min(1vw, 18px);
    top: min(1vw, 18px);
    z-index: 2;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list .list .detail .conts-list li {
    border: 1px solid #EEE;
    color: #EEE;
    display: inline-block;
    font-size: min(0.14rem, 14px);
    padding: 0.25em 0.75em;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list .list:hover .detail {
    margin-bottom: 0;
    opacity: 1;
    transition: opacity 0.5s ease-out, z-index 0.5s ease-out;
    z-index: 1;
  }
}
.games .title-list.main > li .detail .info-box {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .games .title-list.main > li .detail .info-box .title {
    font-size: 0.4rem;
  }
}
.games .title-list.main > li .detail .info-box .pf-list .pf {
  width: 15.58%;
}
@media screen and (min-width: 769px) {
  .games .title-list.main > li .detail .info-box .pf-list .pf {
    width: 15.58%;
  }
}
@media screen and (max-width: 768px) {
  .games .title-list.main > li .detail .info-box .pf-list .pf:not(:nth-child(6n)) {
    margin-right: 1%;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list.main > li .detail .info-box .pf-list .pf:not(:nth-child(8n)) {
    margin-right: 1%;
  }
}
.games .title-list.sub > li {
  width: 48%;
}
@media screen and (max-width: 768px) {
  .games .title-list.sub > li {
    background: #FFF;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list.sub > li {
    width: 23.5%;
  }
}
@media screen and (max-width: 768px) {
  .games .title-list.sub > li:not(:nth-child(even)) {
    margin-right: 4%;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list.sub > li:not(:nth-child(4n)) {
    margin-right: 2%;
  }
}
.games .title-list.sub > li .detail .info-box {
  width: 100%;
}
.games .title-list.app {
  margin-bottom: 4vw;
}
@media screen and (min-width: 769px) {
  .games .title-list.app {
    margin-bottom: 0;
  }
}
.games .title-list.app .list {
  margin-bottom: 0;
  position: relative;
}
@media screen and (min-width: 769px) {
  .games .title-list.app .list {
    width: 18.4%;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list.app .list:not(:nth-child(even)) {
    margin: 0;
  }
}
@media screen and (min-width: 769px) {
  .games .title-list.app .list:not(:nth-child(5n)) {
    margin: 0 2% 0 0;
  }
}
.games .title-list.app .list .detail .info-box {
  width: 100%;
}
.games .seires-list {
  display: flex;
  flex-wrap: wrap;
}
.games .seires-list li {
  line-height: 0;
  margin-bottom: 4vw;
  width: 48%;
}
@media screen and (min-width: 769px) {
  .games .seires-list li {
    margin-bottom: 2vw;
    width: 23.5%;
  }
}
.games .seires-list li:not(:nth-child(even)) {
  margin-right: 4%;
}
@media screen and (min-width: 769px) {
  .games .seires-list li:not(:nth-child(even)) {
    margin-right: 0;
  }
}
@media screen and (min-width: 769px) {
  .games .seires-list li:not(:nth-child(4n)) {
    margin-right: 2%;
  }
}
@media screen and (min-width: 769px) {
  .games .seires-list li a:hover .thumb img {
    transform: scale(1.1);
  }
}
.games .seires-list li .thumb {
  border-radius: 1.5em;
  overflow: hidden;
}
.games .seires-list li .thumb img {
  transition: transform 0.25s ease;
}
.games .search-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.games .search-list-ttl {
  border-left: 4px solid #004098;
  color: #004098;
  font-size: 0.38rem;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 4vw;
  padding-left: 0.5em;
}
@media screen and (min-width: 769px) {
  .games .search-list-ttl {
    font-size: min(0.2rem, 20px);
    margin-bottom: min(2vw, 36px);
  }
}
.games .search-list-item {
  border-radius: 5em;
  cursor: pointer;
  font-size: 0.24rem;
  line-height: 1;
  margin-bottom: 4vw;
  text-align: center;
  width: 32%;
}
@media screen and (min-width: 769px) {
  .games .search-list-item {
    font-size: 0.18rem;
    margin-bottom: 1vw;
    width: 32%;
  }
}
@media screen and (min-width: 1281px) {
  .games .search-list-item {
    font-size: 14px;
    margin-bottom: 18px;
  }
}
.games .search-list-item:not(:nth-child(3n)) {
  margin-right: 2%;
}
.games .search-list-item label {
  display: block;
  width: 100%;
}
.games .search-list-item label input[type=checkbox] {
  display: none;
}
.games .search-list-item label span {
  background: #E8E9EE;
  border-radius: 5em;
  cursor: pointer;
  display: block;
  padding: 4vw 1vw;
}
@media screen and (min-width: 769px) {
  .games .search-list-item label span {
    padding: 1.5em 0.5vw;
  }
}
.games .search-list-item label input[type=checkbox]:checked + span {
  color: #FFF;
  background: #004098;
}
.games .search-btn-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media screen and (min-width: 769px) {
  .games .search-btn-list {
    justify-content: center;
    margin-right: auto;
    margin-left: auto;
    width: 48%;
  }
}
.games .search-btn-list li {
  border-radius: 5em;
  cursor: pointer;
  font-size: 0.32rem;
  line-height: 1;
  text-align: center;
  width: 48%;
}
@media screen and (min-width: 769px) {
  .games .search-btn-list li {
    font-size: min(0.2rem, 20px);
    width: 48%;
  }
}
.games .search-btn-list li#searchBtn {
  background: linear-gradient(to right, rgb(44, 170, 223) 0%, rgb(41, 122, 237) 100%);
}
@media screen and (min-width: 769px) {
  .games .search-btn-list li#searchBtn {
    margin-right: 4%;
  }
}
.games .search-btn-list li#searchBtn a {
  color: #FFF;
  padding: 4vw 2vw 5vw;
  transition: opacity 0.5s ease;
}
@media screen and (min-width: 769px) {
  .games .search-btn-list li#searchBtn a {
    padding: min(1vw, 18px) min(1vw, 18px) min(1.1428571429vw, 20.5714285714px);
  }
}
@media screen and (min-width: 769px) {
  .games .search-btn-list li#searchBtn a:hover {
    opacity: 0.8;
  }
}
.games .search-btn-list li#resetBtn {
  box-shadow: 0 0 0 1px #004098;
  color: #004098;
  padding: 4vw 2vw 5vw;
  transition: background 0.5s ease, color 0.5s ease;
}
@media screen and (min-width: 769px) {
  .games .search-btn-list li#resetBtn {
    padding: min(1vw, 18px) min(1vw, 18px) min(1.1428571429vw, 20.5714285714px);
  }
}
@media screen and (min-width: 769px) {
  .games .search-btn-list li#resetBtn:hover {
    background: #004098;
    color: #FFF;
  }
}