@charset "utf-8";

/*------------------------------------------------------------
  Reset
------------------------------------------------------------*/

/*! destyle.css v4.0.1 | MIT License | https://github.com/nicolas-cusan/destyle.min.css */
*,::before,::after{box-sizing:border-box;border-style:solid;border-width:0;min-width:0}html{line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{margin:0}main{display:block}p,table,blockquote,address,pre,iframe,form,figure,dl{margin:0}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0}ul,ol{margin:0;padding:0;list-style:none}dt{font-weight:700}dd{margin-left:0}hr{box-sizing:content-box;height:0;overflow:visible;border-top-width:1px;margin:0;clear:both;color:inherit}pre{font-family:monospace,monospace;font-size:inherit}address{font-style:inherit}a{background-color:transparent;text-decoration:none;color:inherit}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:inherit}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}svg,img,embed,object,iframe{vertical-align:bottom}button,input,optgroup,select,textarea{-webkit-appearance:none;appearance:none;vertical-align:middle;color:inherit;font:inherit;background:transparent;padding:0;margin:0;border-radius:0;text-align:inherit;text-transform:inherit}button,[type="button"],[type="reset"],[type="submit"]{cursor:pointer}button:disabled,[type="button"]:disabled,[type="reset"]:disabled,[type="submit"]:disabled{cursor:default}:-moz-focusring{outline:auto}select:disabled{opacity:inherit}option{padding:0}fieldset{margin:0;padding:0;min-width:0}legend{padding:0}progress{vertical-align:baseline}textarea{overflow:auto}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}[type="number"]{-moz-appearance:textfield}label[for]{cursor:pointer}details{display:block}summary{display:list-item}[contenteditable]:focus{outline:auto}table{border-color:inherit;border-collapse:collapse}caption{text-align:left}td,th{vertical-align:top;padding:0}th{text-align:left;font-weight:700}

/*------------------------------------------------------------
  Variables
------------------------------------------------------------*/

:root {
  --border-color: #ddd;
  --answer-border-color: #ff7b00;
  --attention-color: #d10000;
}

/*------------------------------------------------------------
  Base
------------------------------------------------------------*/

*, *::before, *::after {
  box-sizing: border-box;
}

html {
  overflow-y: scroll;
  font-size: 62.5%;
}

/* https://ics.media/entry/200317/ */
body {
  font-size: 1.4rem;
  color: #333;
  font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}

img {
  width: 100%;
}

/*------------------------------------------------------------
  Layout
------------------------------------------------------------*/

.layoutSiteWrapper {
  /* display: grid; */
  min-height: 100vh;
  min-height: 100dvh;;
  background-color: #fff4d3;
}

.layoutMV {
  margin-bottom: 10px;
}

.layoutMain {
  display: flex;
  gap: 0 10px;
  min-height: 600px;
}

.layoutMain__left {
  width: calc(100% - 300px - 10px);
  display: flex;
  flex-flow: column;
  gap: 10px;
}

.layoutMain__right {
  display: flex;
  flex-flow: column;
  gap: 40px 0;
  width: 300px;
}

@media (max-width: 1063px) {
  .layoutMain {
    display: block;
    min-height: auto;
  }

  .layoutMain__left {
    width: 100%;
  }

  .layoutMain__right {
    width: 100%;
    margin-top: 40px;
  }
}

/*------------------------------
  ヘッダー
------------------------------*/

.layoutHeader {
  position: relative;
  z-index: 80;
  display: flex;
  width: 100%;
  min-height: 100px;
  border-bottom: 1px solid #af8f36;
  background: #fff;
}

.layoutHeader__inner {
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 100%;
}

@media (max-width: 640px) {
  .layoutHeader__inner {
    align-self: center;
  }
}

.layoutHeader__body {
  align-self: stretch;
  display: flex;
  flex-flow: column;
  width: 250px;
  min-height: 50px;
}

.layoutHeader__logo {
  flex-grow: 1;
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  margin: 5px 0;
}

.layoutHeader__logo a {
  display: flex;
  max-width: 150px;
  max-height: 60px;
}

.layoutHeader__logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.layoutHeader__info {
  display: flex;
  align-items: center;
  gap: 5px;
}

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

.layoutHeader__cornerLogo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.layoutHeader__subLink {
  align-self: flex-start;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 130px;
  padding: 5px;
  color: #8b4a0f;
  text-align: center;
  border: 1px solid #8b4a0f;
  border-top: none;
  border-radius: 0 0 5px 5px;
  background: #fff;
}

.layoutHeader__subLink:hover {
  color: #fff;
  text-decoration: none;
  background: #8b4a0f;
}

/*------------------------------
  メニュー
------------------------------*/

.layoutMenu {
  padding: 10px 0;
}

/* ナビゲーション */

.layoutMenuNavigation {
  display: flex;
  gap: 16px;
}

@media (max-width: 640px) {
  .layoutMenuNavigation {
    gap: 10px;
  }
}

.layoutMenuNavigation__button {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2px;
  min-height: 40px;
  margin-bottom: 2px;
  padding: 6px 12px;
  color: #8b4a0f;
  border: 2px solid #ccae5d;
  border-radius: 6px;
  background-color: #fff;
  box-shadow: 0 4px 0 0 #ccae5d;
}

@media (max-width: 640px) {
  .layoutMenuNavigation__button {
    flex: 1;
    padding: 6px 8px;
    font-size: 1.3rem;
  }
}

.layoutMenuNavigation__button.isActive {
  border-color: #ee2527;
  box-shadow: 0 4px 0 0 #ee2527;
}

.layoutMenuNavigation__icon {
  display: block;
  width: 24px;
  height: auto;
  aspect-ratio: 1 / 1;
  mask-size: contain;
}

@media (max-width: 640px) {
  .layoutMenuNavigation__icon {
    width: 18px;
  }
}

.layoutMenuNavigation__icon img {
  filter: brightness(0) saturate(100%) invert(40%) sepia(78%) saturate(4498%) hue-rotate(342deg) brightness(89%) contrast(92%);
}

.layoutMenuNavigation__label {
  position: relative;
  top: 1px;
}

.layoutMenuNavigation__task {
  position: absolute;
  right: calc(-1 * 18px / 2);
  top: calc(-1 * 18px / 2);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  font-size: 1.2rem;
  color: #fff;
  border-radius: 50%;
  background-color: #ee2527;
}

.layoutMenuNavigation__task:empty {
  display: none;
}

.layoutMenuNavigation__openIcon {
  display: block;
  width: 14px;
  aspect-ratio: 1 / 1;
  mask-size: contain;
}

.layoutMenuNavigation__openIcon img {
  filter: brightness(0) saturate(100%) invert(75%) sepia(7%) saturate(24%) hue-rotate(20deg) brightness(92%) contrast(84%);
}

/* コンテンツ */

.layoutMenuContents {
  margin: 10px 0;
}

.layoutMenuContents__list {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  border-radius: 5px 5px 0 0;
  background-color: #fff;
  overflow: hidden;
}

.layoutMenuContents__list::after {
  position: absolute;
  left: 0;
  top: 0;
  content: '';
  width: 100%;
  height: 100%;
  border: 1px solid #fff;
  pointer-events: none;
}

.layoutMenuContents__item {
  position: relative;
  width: calc(100% / 4);
  border-width: 0 1px 1px 0;
  border-style: dashed;
  border-color: #ddd;
}

.layoutMenuContents__item img {
  width: 24px;
}

.layoutMenuContents__link {
  display: flex;
  align-items: center;
  gap: 0 5px;
  width: 100%;
  height: 100%;
  padding: 6px 32px 4px 12px;
  color: #8b4a0f;
  background-color: #fff;
}

.layoutMenuContents__link.isActive {
  background-color: #ffdb82;
}

.layoutMenuContents__task {
  position: absolute;
  right: 8px;
  top: calc(50% - 16px / 2);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  font-size: 1.2rem;
  color: #fff;
  border-radius: 50%;
  background-color: #ee2527;
}

.layoutMenuContents__task:empty {
  display: none;
}

@media (max-width: 640px) {
  .layoutMenuContents__item {
    width: calc(100% / 2)
  }

  .layoutMenuContents__link {
    font-size: 1.2rem;
  }
}

/* スタンプ */

.layoutMenuStamp {
  margin: 10px 0;
}

.layoutMenuStamp__body {
  padding: 12px;
  background-color: #fff;
}

.layoutMenuStamp__description {
  margin-bottom: 10px;
}

.layoutMenuStamp__list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.layoutMenuStamp__list li {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc((100% - 10px * (5 - 1)) / 5);
  min-width: 50px;
  height: 50px;
  border-radius: 4px;
  background-color: #f5f5f5;
}

.layoutMenuStamp__info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
}

.layoutMenuStamp__number {
  margin: 0 5px;
  font-size: 1.8rem;
  color: #d10000;
}

.layoutMenuStamp__list li img {
  width: auto;
  height: 50px;
}

/*------------------------------
  フッター
------------------------------*/

.layoutFooter {
  width: 100%;
  margin-top: 20px;
  background: #8b4a0f;
}

.layoutFooter__body {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 15px;
  padding-bottom: 15px;
  text-align: center;
}

.layoutFooter {
  width: 100%;
  margin-top: 20px;
  background: #8b4a0f;
}


.layoutFooter__copyright {
  font-size: 1.2rem;
  color: #fff;
  line-height: 1.5;
}

/*------------------------------
  その他
------------------------------*/

.layoutMenuClose {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 40px;
  border-top: 1px solid #eee;
  border-radius: 0 0 5px 5px;
  background-color: #fff;
}

.layoutOverlay {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 103;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
}

/*------------------------------------------------------------
  Component
------------------------------------------------------------*/

/*------------------------------
  汎用的な段落
------------------------------*/

.componentBox__heading {
  padding: 10px 16px;
  font-size: 1.8rem;
  font-weight: bold;
  color: #fff;
  border-radius: 5px 5px 0 0;
  background-color: #8a4a0f;
}

.componentBox__body {
  padding: 20px;
  background-color: #fff;
}

.componentBox__body.noSpace {
  padding: 0;
}

/*------------------------------
  プレイ
------------------------------*/

.componentPlay {
  width: 100%;
  max-width: 728px;
  margin: 10px auto;
  border: 2px solid #934500;
  background-color: #fff;
}

.componentPlay__head {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 30px;
  color: #fff;
  background-color: #934500;
}

.componentPlay__message {
  flex: 1;
}

.componentPlay__body {
  padding: 8px;
  background-color: #ffdbb7;
}

.componentPlay__summary {
  margin-bottom: 10px;
  font-size: 2.0rem;
  font-weight: bold;
  text-align: center;
}

/* 結果 */

.componentResult {
  margin-bottom: 10px;
  padding: 10px;
  font-size: 3.2rem;
  font-weight: bold;
  color: #fff;
  text-align: center;
}

.componentResult.isWin {
  background: #f24f4f;
}

.componentResult.isLose {
  background: #2896e0;
}

@media (max-width: 600px) {
  .componentResult {
    padding: 5px;
    font-size: 2.4rem;
  }
}

/*------------------------------
  ボタン
------------------------------*/

.componentButton {
  display: inline-block;
  min-width: 240px;
  margin-bottom: 2px;
  padding: 10px;
  font-size: 2.0rem;
  color: #fff;
  text-align: center;
  cursor: pointer;
  border-bottom: 1px solid #777;
  border-radius: 10px;
  background-color: #555;
  box-shadow: 0 4px 0 0 #333;
}

@media (hover) {
  .componentButton:hover {
    filter: brightness(1.1);
  }
}

@media (max-width: 640px) {
  .componentButton {
    flex: 1;
    min-width: auto;
  }
}

.componentButton.isNegative {
  border-bottom-color: #0dcce5;
  background-color: #08aac2;
  box-shadow: 0 4px 0 0 #006977;
}

.componentButton.isPositive {
  border-bottom-color: #ff668c;
  background-color: #dd416a;
  box-shadow: 0 4px 0 0 #aa193d;
}

.componentButton.isDisabled {
  pointer-events: none;
}

/*------------------------------
  モーダル
------------------------------*/

.componentModal {
  position: fixed;
  /* top: 50%; */
  top: 0;
  left: 50%;
  z-index: 110;
  /* transform: translateX(-50%) translateY(-50%); */
  transform: translateX(-50%);
}

.componentModal__body {
  position: relative;
  width: calc(300px + 5px * 2);
  max-height: 80vh;
  margin: auto;
  padding: 35px 5px;
  font-size: 1.4rem;
  text-align: center;
  border-radius: 8px;
  background: #fff;
  overflow: auto;
}

/* オーバーレイ広告と重ならないよう念のため下部余白を多めに取る */
@media (max-width: 767px) {
  .componentModal__body {
    padding: 35px 5px 200px 5px;
  }
}

.componentModal__close {
  position: absolute;
  right: 0;
  top: 0;
  content: none;
  width: 30px;
  height: 30px;
  font-size: 2.4rem;
  color: #666;
}

.movable.isMoved {
  position:fixed;
  z-index: 120;
}

/*------------------------------
  ローディング
------------------------------*/

/* https://css-loaders.com/spinner/ */
.componentLoading {
  width: 60%;
  padding: 4px;
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: #bbb;
  --_m:
    conic-gradient(#0000 10%,#000),
    linear-gradient(#000 0 0) content-box;
  -webkit-mask: var(--_m);
          mask: var(--_m);
  -webkit-mask-composite: source-out;
          mask-composite: subtract;
  animation: l3 1s infinite linear;
}
@keyframes l3 {to{transform: rotate(1turn)}}

/*------------------------------
  キャンペーン
------------------------------*/

.componentCampaigns {
  display: flex;
  flex-flow: column;
  gap: 10px 0;
}

/*------------------------------
  お知らせ
------------------------------*/

.componentNews {
  border-radius: 5px;
  background-color: #fff;
}

.componentNews__item {
  display: flex;
  flex-flow: column;
  gap: 10px;
  padding: 10px 16px;
  border-bottom: 1px dashed #ddd;
}

.componentNews__item:last-child {
  border-bottom: none;
}

.componentNews__head {
  position: relative;
  display: flex;
  gap: 10px;
}

.componentNews__new {
  position: absolute;
  left: -8px;
  top: -6px;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 16px;
  font-size: 1.0rem;
  color: #fff;
  border-radius: 8px;
  background-color: #d10000;
}

.componentNews__mark {
  position: relative;
  top: 4px;
  align-self: flex-start;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: 100px;
  padding: 8px;
  font-size: 1.4rem;
  border-radius: 3px;
  background-color: #fed599;
}

.componentNews__mark[data-news-tag-id="notification"] {
  background-color: #98ebfe;
}

.componentNews__mark[data-news-tag-id="campaign"] {
  background-color: #fef698;
}

.componentNews__mark[data-news-tag-id="maintenance"] {
  background-color: #cef493;
}

.componentNews__title {
  flex: 1;
  padding: 8px 0;
  font-weight: bold;
  line-height: 1.8;
}

.componentNews__title a {
  text-decoration: underline;
}

.componentNews__title a:hover {
  text-decoration: none;
}

.componentNews__body {
  display: flex;
  flex-flow: column;
  gap: 10px 0;
}

.componentNews__body p {
  line-height: 1.8;
}

@media (max-width: 767px){
  .componentNews__item {
    gap: 5px;
    padding: 8px;
  }

  .componentNews__mark {
    width: 60px;
    padding: 4px;
    font-size: 1.2rem;
  }

  .componentNews__title {
    padding: 4px 0;
    font-size: 1.2rem;
    line-height: 1.4;
  }
}

/*------------------------------
  ルール
------------------------------*/

.componentRule {
  display: flex;
  flex-flow: column;
}

.componentRule__list {
  counter-reset: number 0;
}

.componentRule__item {
  position: relative;
  padding: 12px 8px 12px 40px;
  font-size: 1.6rem;
  line-height: 1.6;
  border-bottom: 1px dashed #ddd;
}

.componentRule__item::before {
  position: absolute;
  left: 8px;
  top: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 24px;
  height: 24px;
  font-size: 1.6rem;
  color: #fff;
  border-radius: 50%;
  background-color: #ff9021;
  counter-increment: number 1;
  content: counter(number) ""
}

.componentRule__item:last-child {
  border-bottom: none;
}

.componentRule__attention {
  padding: 10px 16px;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.6;
  border-top: 1px dashed #ddd;
  background-color: #f5f5f5;
}

/* 追加情報 */

.componentRule__information {
  display: flex;
  flex-flow: column;
  gap: 5px;
  padding: 10px 16px;
  border-top: 1px dashed #ddd;
  background-color: #fff;
}

.componentRule__informationHeading {
  font-size: 1.6rem;
  font-weight: bold;
}

.componentRule__informationDescription {
  font-size: 1.6rem;
  line-height: 1.6;
}

.componentRule__informationDescription a {
  text-decoration: underline;
}

.componentRule__informationDescription a:hover {
  text-decoration: none;
}

.componentRule__informationImage {
  padding: 10px;
  border: 5px solid #eee;
  background-color: #fff;
}

/*------------------------------
  汎用文章
------------------------------*/

.componentDocument {
  display: flex;
  flex-flow: column;
  gap: 20px;
  padding: 20px;
  border-radius: 5px;
  background-color: #fff;
}

.componentDocument__head {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding-bottom: 15px;
  border-bottom: 1px solid var(--border-color);
}

.componentDocument__head a {
  font-size: 1.4rem;
  font-weight: normal;
  text-decoration: underline;
}

@media (hover) {
  .componentDocument__head a:hover {
    text-decoration: none;
  }
}

.componentDocument__body {
  display: flex;
  flex-flow: column;
  gap: 20px;
}

.componentDocument__body p {
  line-height: 1.8;
}

.componentDocument__body a {
  text-decoration: underline;
}

@media (hover) {
  .componentDocument__body a:hover {
    text-decoration: none;
  }
}

/* 段落 */

.componentDocument__section {
  display: flex;
  flex-flow: column;
  gap: 20px;
}

/* 見出し */

.componentDocument__headingPrimary {
  font-size: 2.0rem;
  font-weight: bold;
}

.componentDocument__headingSecondary {
  margin-top: 20px;
  font-size: 1.8rem;
  font-weight: bold;
}

.componentDocument__headingTertiary {
  margin-top: 10px;
  font-size: 1.6rem;
  font-weight: bold;
}

.componentDocument__headingSecondary:first-child,
.componentDocument__headingTertiary:first-child {
  margin-top: 0;
}

/* 箇条書き */

.componentDocument__list {
  display: flex;
  flex-flow: column;
}

.componentDocument__listItem {
  position: relative;
  padding-left: 15px;
  line-height: 1.8;
}

.componentDocument__listItem::before {
  position: absolute;
  left: 0;
  top: 0;
  content: '・';
}

.componentDocument__listItem.isCaution::before {
  position: absolute;
  left: 0;
  top: -2px;
  content: '※';
}

/* コラム */

.componentDocument__column {
  padding: 20px;
  border-radius: 6px;
  background-color: #ffe2b6;
}

.componentDocument__columnHeading {
  margin-bottom: 10px;
  font-size: 1.8rem;
  font-weight: bold;
}

.componentDocument__column a {
  text-decoration: underline;
}

@media (hover) {
  .componentDocument__column a:hover {
    text-decoration: none;
  }
}

/*------------------------------
  コンテンツ
------------------------------*/

.componentContents {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.componentContents__item {
  position: relative;
  width: calc((100% - 20px * (5 - 1)) / 5);
}

.componentContents__task {
  position: absolute;
  right: calc(-1 * 18px / 2);
  top: calc(-1 * 18px / 2);
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  font-size: 1.2rem;
  color: #fff;
  border-radius: 50%;
  background-color: #ee2527;
}

.componentContents__task:empty {
  display: none;
}

@media (max-width: 640px) {
  .componentContents__item {
    width: calc((100% - 20px * (3 - 1)) / 3);
  }
}

@media (hover) {
  .componentContents a:hover {
    filter: brightness(1.1);
  }
}

/*------------------------------
  スカイスクレイパー広告
------------------------------*/

.componentSkyscraper {
  position: absolute;
  top: 0;
  height: 100%;
}

.componentSkyscraper.isLeft {
  left: calc(-160px - 10px);
}

.componentSkyscraper.isRight {
  right: calc(-160px - 10px);
}

.componentSkyscraper__inner {
  position: sticky;
  top: 10px;
  width: 160px;
}

@media (max-width: 1070px) {
  .componentSkyscraper {
    display: none;
  }
}

/*------------------------------
  ダミー広告
------------------------------*/

.componentDummyAd {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.2rem;
  text-align: center;
  background-color: #eee;
}

.componentDummyAdInformation {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 99999;
  width: 100%;
  padding: 10px;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.6);
}

/*------------------------------
  広告レイアウト
------------------------------*/

.componentHorizontalAds {
  display: flex;
  justify-content: center;
  gap: 10px;
}

/*------------------------------------------------------------
  Utility
------------------------------------------------------------*/

.utilityInner {
  position: relative;
  max-width: calc(728px + 10px + 300px + 5px * 2);
  margin: 0 auto;
  padding-right: 5px;
  padding-left: 5px;
}

/* あとで消す */
.inner {
  position: relative;
  max-width: calc(728px + 10px + 300px + 5px * 2);
  margin: 0 auto;
  padding-right: 5px;
  padding-left: 5px;
}

@media (max-width: 640px) {
  .utilityPcOnly {
    display: none;
  }
}

@media (min-width: 641px) {
  .utilitySpOnly {
    display: none;
  }
}

/*------------------------------
  広告
------------------------------*/

.tag_728 {
  width: 100%;
  min-width: 728px;
  min-height: 90px;
  margin: 0 auto;
  text-align: center;
}

.tag_468 {
  width: 100%;
  min-width: 468px;
  min-height: 60px;
  margin: 0 auto;
  text-align: center;
}

.tag_320 {
  width: 100%;
  min-width: 320px;
  min-height: 100px;
  margin: 15px auto;
  text-align: center;
}

.tag_300 {
  width: 100%;
  min-width: 300px;
  min-height: 250px;
  margin: 0 auto;
  text-align: center;
}

@media (max-width: 728px) {
  .tag_728 {
    display: none;
  }
}

@media (min-width: 641px) {
  .tag_320 {
    display: none;
  }
}

/* 広告位置確認用 */
/* .tag_728,
.tag_468,
.tag_320,
.tag_300,
.tag_160 {
  background-color: #ddd;
} */

/*------------------------------
  ラッパー
------------------------------*/

.utilityButtonWrapper {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  text-align: center;
}

.utilityButtonWrapper.hasSpace {
  padding: 20px 0;
}

@media (max-width: 660px) {
  .utilityButtonWrapper.hasSpace {
    padding: 25px 0;
  }
}

/*------------------------------
  その他
------------------------------*/

.isHide {
  display: none !important;
}

/*------------------------------------------------------------
  Pages
------------------------------------------------------------*/

/*------------------------------
  完了ページ
------------------------------*/

.pageEnd {
  display: flex;
  flex-flow: column;
  gap: 20px;
}

.pageEnd__clear {
  margin: 10px 0;
}

.pageEnd__clear img {
  width: 100%;
}

.pageEnd__buttonLead {
  margin: 10px 0;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
}

/*------------------------------
  エラーページ
------------------------------*/

.pageError {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-flow: column;
  gap: 20px;
  max-width: 640px;
  margin: 0 auto;
  padding: 20px;
  border-radius: 5px;
  background-color: #fff;
}

.pageError__heading {
  font-size: 2.0rem;
  font-weight: bold;
  line-height: 1.4;
  text-align: center;
}

.pageError__description {
  font-size: 1.6rem;
  line-height: 1.8;
  text-align: center;
}

@media (max-width: 640px) {
  .pageError__description {
    text-align: left;
  }
}

/*------------------------------------------------------------
  Other
------------------------------------------------------------*/

/*------------------------------
  ゲームスタートボタンのガタガタ
------------------------------*/

#start_modal {
  /* top: calc(50% - 50px); */
  top: 0;
}

#start_modal.isShifted {
  /* top: 50%; */
  top: 50px;
}

/*------------------------------
  クロスワードのガタガタ
------------------------------*/

#crossword_modal {
  /* top: calc(50% - 50px); */
  top: 0;
}

#crossword_modal.isShifted {
  /* top: 50%; */
  top: 50px;
}

/*------------------------------
  ナンプレのガタガタ
------------------------------*/

#nanpre_modal {
  /* top: calc(50% - 50px); */
  top: 0;
}

#nanpre_modal.isShifted {
  /* top: 50%; */
  top: 50px;
}

/*------------------------------
  広告の余白調整
------------------------------*/

#tag_pc_728_common {
  margin: 0;
  padding: 10px 0;
}

#tag_pc_468_common {
  margin: 30px auto;
}

@media (max-width: 660px) {
  #tag_sp_320_3 {
    margin-top: 15px;
  }
}
