@charset "UTF-8";
/*///////// ALL /////////*/
/*----------------PCandSP--------------*/
/*---- base style ----*/
:root {
  --bg-color:#ddd;
  --base-color:#fff;
  --main-color: #000;
  --accent-color: #be0006;
  --container-width: auto;
  --headline-lineheight: 1.4;
  --base-lineheight: 1.7; }

/*---- base style ----*/
.template-products {
  /*---- base reset ----*/
  font-size: 16px;
  /* ul.asterisk > li */ }
  .template-products ul, .template-products ol {
    list-style-type: none;
    padding: 0;
    margin: 0; }
  .template-products h2, .template-products h3, .template-products h4, .template-products h5, .template-products h6 {
    margin: 0;
    padding: 0;
    line-height: var(--headline-lineheight); }
  .template-products p {
    margin: 0;
    line-height: var(--base-lineheight); }
  .template-products ul.disc {
    padding: 0 0 0.5em; }
  .template-products ul.disc > li {
    padding-left: 1em;
    text-indent: -1em;
    line-height: 1.5;
    padding-bottom: 0.3em; }
  .template-products ul.disc > li:last-child {
    padding-bottom: 0em; }
  .template-products ul.disc > li:before {
    content: '・'; }
  .template-products ul.asterisk {
    padding: 0 0 0.5em; }
  .template-products ul.asterisk > li {
    padding-left: 1em;
    text-indent: -1em;
    line-height: 1.5;
    padding-bottom: 0.3em; }
  .template-products ul.asterisk > li:last-child {
    padding-bottom: 0em; }
  .template-products ul.asterisk > li:before {
    content: '※'; }
  .template-products .min {
    color: #666;
    font-size: 90%; }
  .template-products .btn-defaultstyle--products {
    position: relative;
    overflow: hidden;
    display: block;
    padding: 20px 18px;
    color: #fff;
    width: 100%;
    background: var(--accent-color);
    box-sizing: border-box;
    text-align: center; }
  .template-products .btn-defaultstyle--products[href^="#"]:after {
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #fff;
    margin-left: 4px; }
  .template-products .btn-defaultstyle--products[target="_blank"]:after {
    content: '';
    display: inline-block;
    vertical-align: bottom;
    width: 20px;
    height: 20px;
    background: url(https://www.gamecity.ne.jp/img/common/icon-outbound-w.svg) no-repeat center/contain;
    margin-left: 4px; }
  .template-products .section-wrap.topview {
    margin: 0 auto 6%; }
  .template-products .inpage-links__base {
    position: relative;
    transition: all 0.5s; }
  .template-products .inpage-links__container {
    display: flex;
    justify-content: center;
    max-width: var(--container-width);
    padding: 15px 4% 15px;
    margin: 0 auto; }
  .template-products .inpage-links__item {
    background: var(--main-color);
    color: #fff;
    width: 20%;
    align-items: center;
    margin-right: 1%; }
    .template-products .inpage-links__item .ancher:after {
      content: '';
      display: inline-block;
      width: 0;
      height: 0;
      border-left: 6px solid transparent;
      border-right: 6px solid transparent;
      border-top: 8px solid #fff;
      margin-left: 4px; }
    .template-products .inpage-links__item a {
      display: flex;
      height: 60px;
      color: #fff;
      align-items: center;
      justify-content: center;
      font-size: 100%;
      text-align: center;
      line-height: 1.3; }
  .template-products .inpage-links.fixed .inpage-links__base {
    width: 100%;
    position: fixed;
    left: 0;
    z-index: 60;
    background-color: rgba(0, 0, 0, 0.8);
    transition: all 0.5s; }
    .template-products .inpage-links.fixed .inpage-links__base.off {
      transform: translate(0, -100%);
      opacity: 0; }
  .template-products .inpage-links.fixed .inpage-links__container {
    max-width: calc(var(--container-width) * 0.8);
    padding: 4px 0; }
  .template-products .inpage-links.fixed .inpage-links__item {
    width: 20%;
    background: transparent;
    border-right: 1px solid rgba(255, 255, 255, 0.3); }
    .template-products .inpage-links.fixed .inpage-links__item:last-child {
      border-right: 0px; }
    .template-products .inpage-links.fixed .inpage-links__item a {
      height: 36px;
      font-size: 80%; }
      .template-products .inpage-links.fixed .inpage-links__item a br {
        display: none; }
      .template-products .inpage-links.fixed .inpage-links__item a:after {
        display: none; }
  .template-products .section-item {
    position: relative;
    background: var(--base-color);
    max-width: var(--container-width);
    box-sizing: border-box;
    padding: 3% 3% 6%;
    margin: 0 auto 2%; }
    .template-products .section-item .item-block {
      display: flex;
      justify-content: space-between; }
      .template-products .section-item .item-block__image {
        width: 47%; }
        .template-products .section-item .item-block__image img {
          display: block;
          width: 100%; }
      .template-products .section-item .item-block__text {
        width: 50%;
        padding-top: 5px; }
        .template-products .section-item .item-block__text .text__name {
          font-size: 170%;
          margin-top: 1.4em;
          margin-bottom: 0.2em; }
          .template-products .section-item .item-block__text .text__name:first-child {
            margin-top: 0em; }
        .template-products .section-item .item-block__text .text__console {
          line-height: 1.4;
          font-size: 90%; }
        .template-products .section-item .item-block__text .text__price {
          font-size: 100%; }
          .template-products .section-item .item-block__text .text__price strong {
            font-size: 170%;
            padding: 0 0.2em; }
        .template-products .section-item .item-block__text .text__btn {
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          margin: 1em 0 1em; }
          .template-products .section-item .item-block__text .text__btn a {
            width: 49.5%;
            margin: 0 1% 1% 0; }
            .template-products .section-item .item-block__text .text__btn a:nth-child(2n) {
              margin-right: 0; }
        .template-products .section-item .item-block__text .text__exp {
          padding: 0 0 0.5em; }
          .template-products .section-item .item-block__text .text__exp strong {
            font-weight: 800; }
        .template-products .section-item .item-block__text .asterisk {
          margin-top: 1.4em; }
      .template-products .section-item .item-block--large .item-block__image {
        width: 100%;
        margin-bottom: 1%; }
      .template-products .section-item .item-block--large .item-block__text {
        text-align: center;
        width: 86%;
        margin: 0 auto; }
        .template-products .section-item .item-block--large .item-block__text .text__btn {
          margin: 1% auto 1%; }
          .template-products .section-item .item-block--large .item-block__text .text__btn a {
            max-width: 40%; }
        .template-products .section-item .item-block--large .item-block__text--tworows {
          width: 86%;
          margin: 1% auto;
          display: flex; }
          .template-products .section-item .item-block--large .item-block__text--tworows > div {
            width: 50%; }
            .template-products .section-item .item-block--large .item-block__text--tworows > div:nth-child(2n) {
              margin-left: 2%; }
    .template-products .section-item .privilage-block {
      padding: 4%;
      box-sizing: border-box;
      background-color: #eee;
      margin-top: 5%; }
      .template-products .section-item .privilage-block__headline {
        text-align: center;
        font-size: 160%;
        padding: 0 0 1em; }
      .template-products .section-item .privilage-block__item-block {
        display: flex;
        justify-content: space-between; }
      .template-products .section-item .privilage-block__image {
        width: 47%; }
        .template-products .section-item .privilage-block__image img {
          display: block;
          width: 100%; }
      .template-products .section-item .privilage-block__text {
        width: 50%; }
        .template-products .section-item .privilage-block__text .text__name {
          font-size: 130%;
          padding-bottom: 1em; }
        .template-products .section-item .privilage-block__text .text__description {
          font-size: 100%;
          line-height: 1.6;
          padding-bottom: 1em; }
    .template-products .section-item__headline {
      position: relative;
      text-align: center;
      font-size: 220%;
      margin: 0 0 1em; }
    .template-products .section-item__subheadline {
      position: relative;
      text-align: center;
      font-size: 200%;
      margin: 3em 0 0.8em; }
      .template-products .section-item__subheadline:first-of-type {
        margin-top: 0; }
    .template-products .section-item__description {
      text-align: center;
      font-size: 100%; }
    .template-products .section-item__container {
      display: flex;
      justify-content: space-between; }
      .template-products .section-item__container .item-image {
        position: relative;
        width: 47%; }
        .template-products .section-item__container .item-image img {
          display: block;
          width: 100%; }
      .template-products .section-item__container .item-text {
        width: 50%; }
        .template-products .section-item__container .item-text__name {
          font-size: 130%;
          margin-bottom: 1em; }
        .template-products .section-item__container .item-text__description {
          line-height: 1.6;
          margin-bottom: 1em; }
    .template-products .section-item__tab .tab-list {
      display: flex;
      justify-content: center;
      margin-bottom: 4%; }
      .template-products .section-item__tab .tab-list__item {
        display: block;
        box-sizing: border-box;
        margin-right: 0.4%;
        width: 15%;
        background: #bbb;
        padding: 10px 20px; }
        .template-products .section-item__tab .tab-list__item.on {
          background: #000; }
          .template-products .section-item__tab .tab-list__item.on img {
            filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(101%); }
        .template-products .section-item__tab .tab-list__item:last-of-type {
          margin-right: 0; }
        .template-products .section-item__tab .tab-list__item img {
          display: block;
          object-fit: contain;
          height: 20px;
          width: 100%;
          margin: 0 auto;
          pointer-events: none; }
    .template-products .section-item__tab .tab-content__item {
      position: relative;
      display: none;
      transition: all 1s;
      z-index: 0; }
    .template-products .section-item__tab .tab-content__item.preon {
      display: block;
      opacity: 0; }
    .template-products .section-item__tab .tab-content__item.on {
      display: block;
      opacity: 1;
      z-index: 1; }
    .template-products .section-item__list {
      display: flex;
      justify-content: center;
      flex-wrap: wrap; }
      .template-products .section-item__list .item {
        display: flex;
        padding: 2%;
        margin: 0 2% 4% 0;
        width: 32%;
        box-sizing: border-box;
        margin-bottom: 2%;
        position: relative;
        flex-direction: column; }
        .template-products .section-item__list .item:nth-of-type(3n) {
          margin-right: 0; }
        .template-products .section-item__list .item__headline {
          font-size: 140%;
          height: calc(var(--headline-lineheight) * 2em);
          text-align: center;
          margin-bottom: 5%;
          display: flex;
          align-items: center;
          justify-content: center; }
        .template-products .section-item__list .item__image {
          margin-bottom: 1em; }
          .template-products .section-item__list .item__image img {
            display: block;
            width: 100%; }
        .template-products .section-item__list .item__description {
          margin-bottom: 1em; }
          .template-products .section-item__list .item__description.min {
            color: #666;
            font-size: 86%; }
        .template-products .section-item__list .item .item__btn {
          margin-top: auto; }

/*----------------SP--------------*/
@media screen and (max-width: 768px) {
  .template-products {
    /*---- base reset ----*/
    font-size: 14px; }
    .template-products .btn-defaultstyle--products {
      padding: 5vw 4vw;
      margin: 0 2% 0 0;
      font-size: 80%; }
      .template-products .btn-defaultstyle--products:nth-of-type(2n) {
        margin-right: 0; }
    .template-products a[href^="#"]:after {
      border-left: 4px solid transparent;
      border-right: 4px solid transparent;
      border-top: 6px solid #fff;
      margin-left: 4px; }
    .template-products a[target="_blank"]:after {
      width: 14px;
      height: 14px;
      margin-left: 4px;
      margin-bottom: -4px;
      margin-top: -4px; }
    .template-products .inpage-links__container {
      padding: 10px 3% 10px;
      flex-wrap: wrap;
      justify-content: center; }
    .template-products .inpage-links.fixed .inpage-links__container {
      padding: 4px 0;
      flex-wrap: wrap;
      justify-content: center; }
      .template-products .inpage-links.fixed .inpage-links__container .inpage-links__item {
        width: 16%;
        margin: 0;
        box-sizing: border-box;
        padding: 0% 2%; }
        .template-products .inpage-links.fixed .inpage-links__container .inpage-links__item a {
          height: 40px;
          font-size: 0.5%; }
          .template-products .inpage-links.fixed .inpage-links__container .inpage-links__item a br {
            display: inline; }
    .template-products .inpage-links__item {
      background: var(--main-color);
      color: #fff;
      width: 31%;
      align-items: center;
      margin: 0 1% 2%; }
      .template-products .inpage-links__item a {
        display: flex;
        height: 12vw;
        color: #fff;
        align-items: center;
        justify-content: center;
        font-size: 0.8%; }
    .template-products .section-item {
      padding: 8% 5%; }
      .template-products .section-item .item-block {
        display: block; }
        .template-products .section-item .item-block__image {
          width: 100%;
          margin-bottom: 5%; }
        .template-products .section-item .item-block__text {
          width: 100%; }
          .template-products .section-item .item-block__text .text__name {
            font-size: 110%;
            margin-top: 1.5em;
            text-align: center;
            padding-bottom: 0.2em; }
            .template-products .section-item .item-block__text .text__name:first-child {
              margin-top: 0em; }
          .template-products .section-item .item-block__text .text__console {
            text-align: center; }
          .template-products .section-item .item-block__text .text__price {
            font-size: 90%;
            margin-bottom: 0.5em;
            text-align: center; }
            .template-products .section-item .item-block__text .text__price strong {
              font-size: 200%;
              padding: 0 0.2em; }
        .template-products .section-item .item-block .text__btn {
          margin-bottom: 0.8em;
          justify-content: center; }
          .template-products .section-item .item-block .text__btn a {
            width: 49%;
            margin-right: 2%;
            margin-bottom: 2%; }
            .template-products .section-item .item-block .text__btn a:nth-child(2n) {
              margin-right: 0%; }
        .template-products .section-item .item-block .text__exp {
          padding: 0 0 0.5em; }
          .template-products .section-item .item-block .text__exp strong {
            font-weight: 800; }
        .template-products .section-item .item-block--large .item-block__text {
          text-align: center;
          width: 100%;
          margin: 0 auto; }
          .template-products .section-item .item-block--large .item-block__text .text__btn {
            margin: 1% auto 1%; }
            .template-products .section-item .item-block--large .item-block__text .text__btn a {
              max-width: 50%; }
          .template-products .section-item .item-block--large .item-block__text--tworows {
            width: 100%;
            margin: 1% auto;
            display: block; }
            .template-products .section-item .item-block--large .item-block__text--tworows > div {
              width: 100%; }
              .template-products .section-item .item-block--large .item-block__text--tworows > div:nth-child(2n) {
                margin-left: 0%; }
      .template-products .section-item .privilage-block {
        padding: 6%;
        box-sizing: border-box;
        background-color: #eee;
        margin-top: 8%; }
        .template-products .section-item .privilage-block__headline {
          text-align: center;
          font-size: 130%;
          padding: 0 0 1em; }
        .template-products .section-item .privilage-block__item-block {
          display: block; }
        .template-products .section-item .privilage-block__image {
          width: 100%;
          margin-bottom: 1em; }
        .template-products .section-item .privilage-block__text {
          width: 100%; }
          .template-products .section-item .privilage-block__text .text__name {
            font-size: 110%; }
          .template-products .section-item .privilage-block__text .text__description {
            font-size: 100%; }
      .template-products .section-item__headline {
        font-size: 160%;
        margin-bottom: 0.4em; }
      .template-products .section-item__subheadline {
        text-align: center;
        font-size: 160%;
        margin: 2em 0 0.5em; }
      .template-products .section-item__container {
        display: block; }
        .template-products .section-item__container .item-image {
          width: 100%;
          margin-bottom: 1em; }
        .template-products .section-item__container .item-text {
          width: 100%; }
          .template-products .section-item__container .item-text__name {
            font-size: 110%;
            margin-bottom: 1em; }
          .template-products .section-item__container .item-text__description {
            font-size: 100%;
            line-height: 1.6;
            margin-bottom: 1em; }
      .template-products .section-item__tab .tab-list {
        margin-bottom: 4%;
        flex-wrap: wrap; }
        .template-products .section-item__tab .tab-list__item {
          width: 33%;
          padding: 2%;
          margin-right: 0.5%;
          margin-bottom: 0.4%; }
          .template-products .section-item__tab .tab-list__item:nth-child(3n) {
            margin-right: 0; }
          .template-products .section-item__tab .tab-list__item.on {
            background: #000; }
            .template-products .section-item__tab .tab-list__item.on img {
              filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(101%); }
          .template-products .section-item__tab .tab-list__item:last-of-type {
            margin-right: 0; }
          .template-products .section-item__tab .tab-list__item img {
            display: block;
            height: 5vw;
            margin: 0 auto;
            pointer-events: none; }
      .template-products .section-item__list .item {
        padding: 2%;
        width: 49%;
        box-sizing: border-box;
        margin-bottom: 2%; }
        .template-products .section-item__list .item:nth-of-type(3n) {
          margin-right: 2%; }
        .template-products .section-item__list .item:nth-of-type(2n) {
          margin-right: 0; }
        .template-products .section-item__list .item__headline {
          font-size: 100%; }
        .template-products .section-item__list .item__image {
          margin-bottom: 1em; }
        .template-products .section-item__list .item__description {
          font-size: 100%;
          margin-bottom: 0.5em; } }