@charset "UTF-8";

/*-------setting------*/
/*-------setting end------*/
/*-------reset------*/
h2,
h3 {
  margin: 0;
}

h2,
h3,
h4,
h5,
h6 {
  color: #321b04;
  line-height: 1.2;
}

ul {
  margin: 0;
  padding: 0;
  line-height: 1.2;
}

li {
  list-style: none;
  margin-bottom: 0.25em;
}

li:last-child {
  margin-bottom: 0;
}

ol {
  counter-reset: number;
  list-style: none;
  margin: 0;
  padding: 0;
}

dl {
  margin: 0;
}

em {
  font-weight: bold;
  font-style: normal;
}

/*-------reset end------*/
/*-------hack--------*/
.clearfix::after {
  content: "";
  display: table;
  clear: both;
}

/*-------hack end--------*/
/*---------BasicStyle------------*/
* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
  font-weight: normal;
}

body {
  min-width: 320px;
  background-color: #5a4023;
  color: #936c3f;
  font-size: 22px;
  font-size: 2.2rem;
  font-family: -apple-system, "Noto Sans Japanese", "メイリオ", Meiryo,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", serif;
}

@media screen and (max-width: 360px) {
  body {
    font-size: 22px;
    font-size: 2.2rem;
  }
}

section {
  margin: 0 auto;
  /*width: 100%;*/
}

img {
  height: auto;
  border: 0;
  vertical-align: bottom;
}

p {
  font-size: 18px;
  font-size: 1.8rem;
}

li {
  list-style: none;
}

/* wrap部分 */
.yellowsmall {
  display: none;
  width: 0;
}

/* 見出し */
.h3 {
  position: relative;
  /*min-width: 300px;*/
  margin: 7% auto;
  /*margin: 5% auto;*/
  padding: 0.2em 4%;
  background: url(../member/common/img//h3_body.png) repeat-y;
  background-size: contain;
  background-position: center top;
  color: #f3eacc;
  font-weight: bold;
  line-height: 1.2;
  text-shadow: 1px 1px 3px #000;
  z-index: 2;
}

.h3::before,
.h3::after {
  display: block;
  content: "";
  position: absolute;
  width: 100%;
  height: auto;
  /*padding-top: 7%;*/
  padding-top: 4.5%;
  z-index: -1;
}

.h3::before {
  left: 0;
  top: 0;
  /*margin-top: -6.25%;*/
  margin-top: -3.75%;
  background: url(../member/common/img/h3_head.png) no-repeat;
  background-position: center bottom;
  background-size: contain;
}

.h3::after {
  left: 0;
  bottom: 0;
  /*margin-bottom: -6.25%;*/
  margin-bottom: -3.75%;
  background: url(../member/common/img/h3_foot.png) no-repeat;
  background-position: center top;
  background-size: contain;
}

.h3 img {
  width: 6%;
  vertical-align: text-bottom;
  margin-right: 1%;
}

.h3Banner {
  margin: 0;
  padding: 0;
  background: none;
}

.h3Banner img {
  width: 100%;
  margin: 0;
}

.h3_line {
  background: url(../member/common/img/eventh3.jpg) no-repeat;
  background-size: 100%;
  background-position: center;
  margin: 0 auto 1%;
  padding: 4% 0 4% 5%;
  width: 100%;
  color: #f3eacc;
  text-shadow: 1px 1px 3px #000;
}

.h4 {
  max-width: 640px;
  margin: 2% auto;
  padding: 0.25em 0.35em;
  border-left: 20px solid #39370c;
  background: url(../member/common/img/h4_back2.png) repeat;
  background-size: cover;
  background-position: center top;
  color: #f3eacc;
  font-size: 20px;
  font-size: 2rem;
  font-weight: bold;
  text-shadow: 1px 1px 3px #000;
}

@media screen and (max-width: 600px) {
  .h4 {
    border-width: 13px;
    font-size: 13px;
    font-size: 1.3rem;
  }
}

@media screen and (max-width: 360px) {
  .h4 {
    border-width: 11px;
    font-size: 11px;
    font-size: 1.1rem;
  }
}

.h4Second {
  background: url(../member/common/img/eventh4s.jpg) no-repeat;
  margin: 0px auto;
  padding: 2px 0 0 4%;
  width: 100%;
  color: #f3eacc;
  font-size: 90%;
  text-shadow: 1px 1px 3px #000;
}

.h4Obi {
  padding: 0.25em 0.5em;
  margin: 0.5em 0;
  background: #520;
  color: #f3eacc;
  font-size: 22px;
  font-size: 2.2rem;
  line-height: 1.5;
  text-shadow: none;
}

@media screen and (max-width: 600px) {
  .h4Obi {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 360px) {
  .h4Obi {
    font-size: 11px;
    font-size: 1.1rem;
  }
}

.h4Obi-green {
  color: #fff;
  background-color: #5b9a01;
}

.h4Obi-red {
  color: #fff;
  background-color: #b20000;
}

.h4Obi-yellow {
  color: #fff;
  background-color: #f39809;
}

.h4Obi-orange {
  color: #fff;
  background-color: #ff6103;
}

.h4_short {
  padding: 3% 0 0.5%;
  font-size: 26px;
  font-size: 2.6rem;
  font-weight: bold;
  text-align: center;
  color: #520;
  border-bottom: 2px #520 solid;
  margin: 0 auto 1.5%;
  width: 10em;
}

@media screen and (max-width: 640px) {
  .h4_short {
    font-size: 22px;
    font-size: 2.2rem;
  }
}

@media screen and (max-width: 480px) {
  .h4_short {
    font-size: 18px;
    font-size: 1.8rem;
  }
}

@media screen and (max-width: 360px) {
  .h4_short {
    font-size: 15px;
    font-size: 1.5rem;
  }
}

.h5 {
  margin: 2% auto;
  padding: 0;
  border-bottom: #026b11 1px dotted;
  text-align: left;
  color: #005609;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}

@media screen and (max-width: 600px) {
  .h5 {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 360px) {
  .h5 {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

/* 見出し end */
.orange {
  color: #f30;
  font-weight: bold;
}

.blue {
  color: #0800d1;
  font-weight: bold;
}

.yellow {
  color: #ffed00;
  font-weight: bold;
}

.green {
  color: #00c804;
  font-weight: bold;
}

.orangeSmall {
  color: #fc6;
  font-size: 95%;
  font-weight: bold;
}

/* common */
p.right {
  width: 84%;
  max-width: 537px;
  margin-left: 0px;
  margin-right: 50px;
  padding: 14px 10px 9px 0;
  color: #2768ec;
  text-shadow: 1px 1px 3px #ccc;
  text-align: right;
  cursor: pointer;
}

p.right2 {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  padding: 0;
  color: #2768ec;
  text-shadow: 1px 1px 3px #ccc;
  text-align: right;
  cursor: pointer;
}

p.right3 {
  width: 100%;
  max-width: 640px;
  margin-left: 0px;
  margin-right: 50px;
  margin-top: 20px;
  padding: 0;
  color: #2768ec;
  text-shadow: 1px 1px 3px #ccc;
  text-align: right;
  cursor: pointer;
}

p.right2 img,
p.right3 img {
  width: 50%;
  max-width: 200px;
}

p.right a,
p.right2 a {
  cursor: pointer;
  text-shadow: none;
}

p.right a:visited,
p.right a:visited {
  cursor: pointer;
  text-shadow: none;
}

a:focus {
  outline: none;
}

/*--------BasicStyle end--------*/
/*--------Header--------*/
header {
  width: 100%;
}

#wrapHeader {
  width: 100%;
  margin: 0 auto;
  background: url(../member/common/img/headerbgPat.png) repeat-x;
  background-size: contain;
}

#wrapHeader.wrapHeaderMetsu {
  background-image: url(../member/common/img/headerbgPat_metsu.png);
}

#wrapHeader.wrapHeaderTower {
  background-image: url(../member/common/img/headerbgPat_tower.png);
}

#wrapHeader.wrapHeaderMakutsu {
  background-image: url(../member/common/img/headerbgPat_makutsu.png);
}

#wrapHeader.wrapHeaderHina {
  background-image: url(../member/common/img/headerbgPat_hina.png);
}

#wrapHeader.wrapHeaderHalloween {
  background-image: url(../member/common/img/headerbgPat_halloween.png);
}

header {
  width: 100%;
  margin: 0 auto;
  background: url(../member/common/img/headerTitle_02.png) no-repeat;
  background-position: center;
  background-size: contain;
  z-index: 999;
}

@media screen and (min-width: 641px) {
  header {
    background-size: 640px;
  }
}

@media screen and (max-width: 640px) {
  header {
    background-size: 100%;
  }
}

h1 {
  float: left;
  width: 22%;
  max-width: 144px;
  margin-top: 0;
  font-size: 0;
}

h1.top {
  float: left;
}

h1 img {
  width: 100%;
  max-width: 144px;
  margin-top: 0;
}

/*--------Header end--------*/
/*--------wrapMain--------*/
#wrapMain {
  width: 100%;
  margin: 0 auto;
  padding-top: 10px;
  padding-bottom: 10px;
  background: url(../member/common/img/mainbgPat.gif);
  background-position: center top;
}

:root #wrapMain {
  width: 100%;
  margin: 0 auto;
  padding-top: 10px;
  padding-bottom: 10px;
  background: url(../member/common/img/mainbgMap.jpg) no-repeat,
    url(../member/common/img/mainbgPat.gif);
  background-position: center top;
}

.swiper-container {
  margin-top: 1% !important;
}

.swiper-wrapper {
  width: 100%;
  max-width: 800px;
}

/*--------wrapMain end--------*/
/*--------wrapLink--------*/
/* Link部分 */
#wrapLink {
  width: 100%;
  background: url(../member/common/img/linkTopbar.jpg) repeat-x;
  background-position: center top;
  background-color: #7d6951;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

#Link {
  margin: 45px auto 10px;
}

#Link h2 img {
  width: auto;
}

#Link ul li {
  /*display: inline-block;*/
  margin: 0 auto;
}

#Link br {
  line-height: 1px;
}

:root #wrapLink {
  width: 100%;
  min-width: 320px;
  background: url(../member/common/img/linkTopbar.jpg) repeat-x,
    url(../member/common/img/linkbg.jpg) no-repeat;
  background-position: center top;
  background-color: #7d6951;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

#wrapLink h2 {
  margin: 10px auto;
}

#wrapLink h2 img {
  display: block;
  margin: 0 auto;
}

#wrapLink ul {
  width: 100%;
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

#wrapLink ul.center {
  position: relative;
  float: left;
  left: 25%;
  width: 100%;
  max-width: 640px;
  margin: 0 auto 0;
}

#wrapLink li.two {
  display: inline-block;
  float: left;
  width: 46%;
  max-width: 300px;
  padding: 2%;
  margin: 2%;
  border: #967f5e solid 3px;
  border-radius: 30px;
  background-color: #f4e4b3;
  -webkit-box-shadow: 3px 7px 0px 0px rgba(100, 75, 35, 0.75);
  box-shadow: 3px 7px 0px 0px rgba(100, 75, 35, 0.75);
  text-align: center;
  font-size: 22px;
  font-size: 2.2rem;
  font-weight: bold;
  line-height: 1.2;
}

#wrapLink li.long {
  display: inline-block;
  width: 100%;
  max-width: 640px;
  height: 85px;
  margin: 8px;
  text-align: center;
}

#wrapLink li.long img {
  margin-top: 10px;
}

#wrapLink li.one {
  display: inline-block;
  float: left;
  width: 46%;
  max-width: 300px;
  margin: 2%;
  padding: 2%;
  border: #967f5e solid 3px;
  border-radius: 30px;
  background-color: #f4e4b3;
  -webkit-box-shadow: 3px 7px 0px 0px rgba(100, 75, 35, 0.75);
  box-shadow: 3px 7px 0px 0px rgba(100, 75, 35, 0.75);
  font-size: 22px;
  font-size: 2.2rem;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  vertical-align: middle;
}

#wrapLink li.solo {
  width: 46%;
  max-width: 300px;
  height: 56px;
  text-align: center;
  padding: 5px;
  margin: 8px auto;
  display: inline-block;
  background-color: #f4e4b3;
  font-weight: bold;
  font-size: 16px;
  font-size: 1.6rem;
  border: #967f5e solid 3px;
  border-radius: 30px;
  -webkit-box-shadow: 3px 7px 0px 0px rgba(100, 75, 35, 0.75);
  box-shadow: 3px 7px 0px 0px rgba(100, 75, 35, 0.75);
  line-height: 46px;
  vertical-align: middle;
  left: -50%;
  float: left;
}

/*--------wrapLink end--------*/
/*--------dlLink--------*/
/* DL Block */
.dl {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  background: url(../member/common/img/dlBgMain.png) no-repeat;
  background-size: contain;
  background-position: center;
  text-align: center;
  vertical-align: middle;
  padding-top: 10px;
}

.dl img {
  width: 40%;
  max-width: 180px;
}

#dlLink {
  width: 100%;
  background: url(../member/common/img/dlBg.png) repeat-x;
  background-size: contain;
}

.imgBtn {
  margin-bottom: 20px;
}

/*--------dlLink end--------*/
/*--------footer--------*/
footer {
  padding: 10px;
  background-color: #5a4023;
  text-align: center;
  color: #fff;
  font-size: 11px;
  font-size: 1.1rem;
  line-height: 1.2;
}

/*--------footer end--------*/
/*--------menu--------*/
/* Menu部分 */
#wrapHeader .menu a {
  cursor: pointer;
  cursor: hand;
}

#wrapMenu {
  background: url(../member/common/img/linkTopbar.jpg) repeat-x;
  background-position: center bottom;
  width: 100%;
  margin: 0 auto;
  background-color: #956217;
  padding-bottom: 31px;
  font-size: 17px;
  font-size: 1.7rem;
}

#wrapMenu .menuArea {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  padding: 5px 0px 20px;
}

#wrapMenu .menuArea ul {
  padding: 0;
}

#wrapMenu .menuArea h2 {
  margin-bottom: 5px;
  padding: 0.5em;
  border-left: 17px #4e361c solid;
  background: #bda37e;
  color: #fef9d4;
  font-size: 18px;
  font-size: 1.8rem;
}

#wrapMenu .menuArea section {
  margin-bottom: 15px;
}

#wrapMenu .menuArea #Link ul,
#wrapMenu .menuArea #DL ul {
  width: 100%;
  max-width: 640px;
  margin: 10px auto 0;
}

#wrapMenu .menuArea #Link li,
#wrapMenu .menuArea #DL li {
  width: 46%;
  max-width: 300px;
  text-align: center;
  padding: 2%;
  margin: 2%;
  display: inline-block;
  background-color: #f4e4b3;
  float: left;
  font-weight: bold;
  border: #967f5e solid 3px;
  border-radius: 30px;
  -webkit-box-shadow: 3px 7px 0px 0px rgba(100, 75, 35, 0.75);
  box-shadow: 3px 7px 0px 0px rgba(100, 75, 35, 0.75);
}

#wrapMenu .menuArea #Link li.one,
#wrapMenu .menuArea #DL li.one {
  line-height: 24px;
  vertical-align: middle;
  font-size: 18px;
  font-size: 1.8rem;
}

@media screen and (max-width: 640px) {
  #wrapMenu .menuArea #Link li.one,
  #Link li,
  #wrapMenu .menuArea #DL li.one,
  #wrapLink li.one,
  #wrapLink li.two {
    font-size: 10px;
  }
}

#wrapLink a li,
#wrapMenu a li {
  color: #936c3f;
  text-decoration: none;
}

#wrapLink a:hover li.one,
#wrapLink a:hover li.two,
#wrapMenu .menuArea #Link a:hover li,
#wrapMenu .menuArea #DL a:hover li {
  background-color: #dabd92;
  cursor: pointer;
  cursor: hand;
}

.menu {
  margin: 0 0 0 auto;
  text-align: right;
  font-size: 0;
  right: 0;
}

.menu img {
  width: 20%;
  max-width: 128px;
}

/*--------menu end--------*/

/*--------article--------*/
/*メイン部分 お知らせ*/
section#Info {
  margin: 0 auto;
}

.InfoHead,
.InfoFoot {
  line-height: 0;
  text-align: center;
}

.InfoHead,
.InfoFoot img {
  width: 100%;
  max-width: 640px;
}

.InfoHead {
  width: 100%;
  max-width: 640px;
  height: 29px;
  margin: 0 auto;
  background: url(../member/common/img/eventbgTop.gif) no-repeat;
  background-size: 100%;
  text-align: left;
}

.InfoHead img {
  width: 33%;
  max-width: 210px;
  padding-left: 1%;
}

.noren {
  padding-left: 1%;
  width: 20%;
  max-width: 124px;
  position: absolute;
}

@media screen and (min-width: 361px) and (max-width: 600px) {
  .InfoHead {
    height: 14px;
  }
}

@media screen and (max-width: 360px) {
  .InfoHead {
    height: 12px;
  }
}

.InfoMain {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  padding: 1px 22px 1em;
  background: url(../member/common/img/eventbgMain.gif) repeat-y;
  background-size: contain;
}

@media screen and (max-width: 600px) {
  .InfoMain {
    padding: 1px 3.782% 1em;
  }
}

@media screen and (min-width: 361px) and (max-width: 600px) {
  .InfoMain {
    font-size: 14px;
  }
}

@media screen and (max-width: 360px) {
  .InfoMain {
    font-size: 12px;
  }
}

ul {
  list-style-position: outside;
  list-style: none;
  padding: 0;
  margin: 0;
}

.pageList a {
  color: #fef9d4;
  text-decoration: none;
}

.pageList li {
  width: 100%;
  margin: 0;
  padding: 3% 0;
  border-bottom: #f3eacc solid 3px;
  background-color: #b08c5a;
  color: #fef9d4;
  font-weight: bold;
  line-height: 18px;
  text-align: right;
  cursor: pointer;
}

.pageList li img {
  width: 8.5%;
  max-width: 28px;
  vertical-align: middle;
}

.pageList li:hover {
  background-color: #a07b49;
}

.InfoHead .noren img {
  width: 100%;
  max-width: 234px;
}

/* メイン画像 */
.mv {
  margin: 0 auto;
  text-align: center;
}

.mv img {
  width: 100%;
  vertical-align: middle;
}

/* box */
.box,
.boxNest {
  width: auto;
  margin: 0 auto;
  padding-left: 15px;
  padding-right: 15px;
}

@media screen and (max-width: 640px) {
  .box,
  .boxNest {
    padding-left: 10px;
    padding-right: 10px;
  }
}

.box-small {
  width: 80%;
  padding: 0;
}

.box-middleLow {
  width: 84%;
  padding: 0;
}

.box-middle {
  width: 90%;
  padding: 0;
}

.box-middleUp {
  width: 96%;
  padding: 0;
}

.box-large {
  width: auto;
  padding: 0;
}

/* 期間 */
.term {
  /*background-color: #826c4e;*/
  font-size: 0;
  line-height: 1.3;
  letter-spacing: -0.5em;
  vertical-align: middle;
}

dl.term {
  display: table;
  width: 100%;
  padding: 2px 0;
}

.term_label,
.term_details {
  display: table-cell;
  /*  margin: 0.1em 0;*/
  letter-spacing: normal;
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.3;
  vertical-align: middle;
}

.term_label {
  width: 18%;
  padding: 0.2em 0;
  background-color: #826c4e;
  text-align: center;
  color: #f3eacc;
}

.term_details {
  width: 82%;
  padding: 0.2em 0.5em;
  background-color: #f3eacc;
  color: #321b04;
}

@media screen and (max-width: 600px) {
  .term_label,
  .term_details {
    font-size: 13px;
    font-size: 1.3rem;
  }
}

@media screen and (max-width: 360px) {
  .term_label,
  .term_details {
    font-size: 11px;
    font-size: 1.1rem;
  }
}

/* p */
.txt,
.ttl {
  margin: 0.5em 0;
  color: #321b04;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.2;
  font-weight: normal;
}

@media screen and (max-width: 600px) {
  .txt,
  .ttl {
    font-size: 13px;
    font-size: 1.3rem;
  }
}

@media screen and (max-width: 360px) {
  .txt,
  .ttl {
    font-size: 11px;
    font-size: 1.1rem;
  }
}

.txt-rev {
  color: #fff;
}

.txt-indent {
  padding-left: 1em;
  text-indent: -1em;
}

.txt-narrow {
  letter-spacing: -0.05em;
}

.txt-ac {
  text-align: center !important;
}

.txt-al {
  text-align: left !important;
}

.txt-ar {
  text-align: right !important;
}

.txtColor-orange {
  color: #f30;
}

.txtLink {
  color: #2768ec;
}

.bnrLink {
  display: block;
}

.tradeNoteWrapper {
  background: #000;
}

.tradeNote {
  padding: 10px;
  text-align: center;
  color: #fff;
  font-size: 11px;
  font-size: 1.1rem;
  line-height: 1.2;
}

.ttl {
  font-weight: bold;
}

.ttlMission {
  margin: 0.5em 0;
  border-bottom: #6a5330 dotted 2px;
  color: #2b1700;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}

@media screen and (max-width: 600px) {
  .ttlMission {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 360px) {
  .ttlMission {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.modified {
  display: inline-block;
  width: 100%;
  text-align: center;
  color: #f30;
  line-height: 1.2;
  font-weight: bold;
}

.fts-normal {
  font-weight: normal;
}

.fts-bold {
  font-weight: bold;
}

/* em */
.em {
  color: #f30;
}

/* strong */
.strong {
  color: #f30;
}

/* hr */
.hr {
  margin: 2% 0;
  border: none;
  border-bottom: 1px solid #321b04;
}

.hr-bold {
  border-bottom-width: 2px;
}

.hr-dash {
  border-bottom-style: dashed;
}

.hr-dott {
  border-bottom-style: dotted;
}

.hr-double {
  border-bottom-width: 3px;
  border-bottom-style: double;
}

.hr-short {
  width: 33%;
}

/* ul, ol */
.reg,
.list,
.list_nest,
.order {
  margin: 0.25em 0;
  padding: 0;
  color: #321b04;
  font-size: 15.8px;
  font-size: 1.58rem;
  line-height: 1.2;
}

.reg_item,
.list_item,
.list_nest_item {
  margin: 0.25em auto;
  padding-left: 1em;
  text-indent: -1em;
}

.reg_item:before {
  content: "※";
}

.list_item::before {
  content: "・";
}

.list_nest_item::before {
  content: "\0025e6";
}

.order_item {
  position: relative;
  padding-left: 1.3em;
  margin-bottom: 0.3em;
  color: #321b04;
}

.order_item::before {
  display: block;
  position: absolute;
  counter-increment: number;
  content: counter(number);
  left: -1px;
  width: 1.4em;
  height: 1.4em;
  border: 1px solid #321b04;
  border-radius: 50%;
  -webkit-transform: scale(0.9);
  -ms-transform: scale(0.9);
  transform: scale(0.9);
  text-align: center;
  text-indent: -2px;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.5;
  vertical-align: bottom;
  letter-spacing: -0.15em;
}

.reg_item-em,
.list_item-em,
.list_nest_item-em,
.order_item-em {
  color: #f30;
}

.order_item-em::before {
  border-color: #f30;
}

@media screen and (max-width: 600px) {
  .reg,
  .list,
  .list_nest,
  .order {
    font-size: 12px;
    font-size: 1.2rem;
  }

  .order_item::before {
    top: -2px;
    -webkit-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@media screen and (max-width: 360px) {
  .reg,
  .list,
  .list_nest,
  .order {
    font-size: 10px;
    font-size: 1rem;
  }

  .order_item::before {
    top: -4px;
    -webkit-transform: scale(0.6);
    -ms-transform: scale(0.6);
    transform: scale(0.6);
  }
}

.reg-inline > li,
.list-inline > li,
.list_nest-inline > li,
.order-inline > li {
  display: inline-block;
}

/* リード文 */
.lede {
  text-align: center;
  color: #321b04;
}

.ledeBox {
  width: auto;
  background-color: #f2e8ca;
  margin: 10px auto;
  padding: 10px 20px;
  border-radius: 8px;
}

@media screen and (max-width: 600px) {
  .ledeBox {
    padding: 5px 15px;
  }
}

@media screen and (max-width: 360px) {
  .ledeBox {
    padding: 4px 10px;
  }
}

/* お知らせ */
.infoBox {
  background-color: #f2e8ca;
  margin: 10px auto;
  padding: 10px 15px;
  border-radius: 8px;
}

@media screen and (max-width: 600px) {
  .infoBox {
    padding: 5px 15px;
  }
}

@media screen and (max-width: 360px) {
  .infoBox {
    padding: 4px 10px;
  }
}

/* 画像 */
.imgMAX {
  width: auto;
  margin: 0 auto;
  text-align: center;
}

.imgMAX a {
  display: block;
}

.image {
  width: 100%;
  vertical-align: bottom;
}

.image-border {
  border: 2px solid #f3eacc;
}

.image-borderBold {
  border: 4px solid #f3eacc;
}

.image-borderDouble {
  border: 5px double #f3eacc;
}

/* boxRadius */
.boxRadius {
  width: 100%;
  max-width: 570px;
  background-color: #f2e8ca;
  margin: 10px auto;
  padding: 10px 20px;
  border-radius: 8px;
}

@media screen and (max-width: 600px) {
  .boxRadius {
    padding: 5px 15px;
  }
}

@media screen and (max-width: 360px) {
  .boxRadius {
    padding: 4px 10px;
  }
}

.notes {
  margin: 10px auto 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 1em;
  text-indent: -1em;
  width: 100%;
  max-width: 570px;
  color: #321b04;
  font-size: 0.9em;
}

/* boxRadius end*/
/*--------article end--------*/
/* top obi */
.topObi {
  width: 100%;
  text-align: center;
  background: #a77d4b;
  font-size: 0;
}

.topObi img {
  width: 100%;
  margin: 0 auto;
  max-width: 800px;
}

/* info */
.mntList_fixed,
.mntList {
  padding-left: 0px;
}

.mntList_fixed br,
.mntList br {
  display: none;
}

.mntList_fixed li,
.mntList li {
  width: 100%;
  background: url(../member/common/img/arrow_b.png) no-repeat;
  background-position: right;
  margin-bottom: 0;
  padding: 3% 16% 3% 1.2%;
  border-bottom: #f2e8cb solid 3px;
  text-shadow: 1px 1px 3px #000;
  color: #fef9d4;
  font-weight: bold;
  font-size: 80%;
  cursor: pointer;
}

.mntList_fixed li span,
.mntList li span {
  display: table-cell;
  vertical-align: middle;
  font-size: 0;
}

.mntList_fixed li a,
.mntList li a {
  display: table-cell;
  color: #fef9d4;
  text-decoration: none;
  vertical-align: middle;
}

.mntList_fixed li:hover,
.mntList li:hover {
  background-color: #b08c5a;
}

.mntList_fixed .odd,
.mntList .odd,
.more {
  background-color: #b08c5a;
}

.mntList_fixed .odd:hover,
.mntList .odd:hover {
  background-color: #a07b49;
}

.mntList_fixed li span.suti01,
.mntList li span.suti01 {
  width: 19%;
  max-width: 92px;
  padding-top: 8%;
  margin-top: -2%;
  background: url(/member/info/flag/flag01.png) no-repeat;
  background-size: cover;
  color: #fff;
  display: inline-block;
  background-position: inherit;
}

.mntList_fixed li span.suti02,
.mntList li span.suti02 {
  width: 19%;
  max-width: 92px;
  padding-top: 8%;
  margin-top: -2%;
  background: url(/member/info/flag/flag02.png) no-repeat;
  background-size: cover;
  color: #fff;
  display: inline-block;
  background-position: inherit;
}

.mntList_fixed li span.suti03,
.mntList li span.suti03 {
  width: 19%;
  max-width: 92px;
  padding-top: 8%;
  margin-top: -2%;
  background: url(/member/info/flag/flag03.png) no-repeat;
  background-size: cover;
  color: #fff;
  display: inline-block;
  background-position: inherit;
}

.mntList_fixed li span.suti04,
.mntList li span.suti04 {
  width: 19%;
  max-width: 92px;
  padding-top: 8%;
  margin-top: -2%;
  background: url(/member/info/flag/flag04.png) no-repeat;
  background-size: cover;
  color: #fff;
  display: inline-block;
  background-position: inherit;
}

.mntList_fixed li span.suti05,
.mntList li span.suti05 {
  width: 19%;
  max-width: 92px;
  padding-top: 8%;
  margin-top: -2%;
  background: url(/member/info/flag/flag05.png) no-repeat;
  background-size: cover;
  color: #fff;
  display: inline-block;
  background-position: inherit;
}

.mntList_fixed li span.suti06,
.mntList li span.suti06 {
  width: 19%;
  max-width: 92px;
  padding-top: 8%;
  margin-top: -2%;
  background: url(/member/info/flag/flag06.png) no-repeat;
  background-size: cover;
  color: #fff;
  display: inline-block;
  background-position: inherit;
}

.mntList_fixed li span.suti07,
.mntList li span.suti07 {
  width: 19%;
  max-width: 92px;
  padding-top: 8%;
  margin-top: -2%;
  background: url(/member/info/flag/flag07.png) no-repeat;
  background-size: cover;
  color: #fff;
  display: inline-block;
  background-position: inherit;
}

.mntList_fixed li a,
.mntList li a {
  display: inline;
}

p.more {
  margin: 0 0 -1em;
  padding-right: 0.75em;
  text-align: right;
  color: #2768ec;
  font-size: 22px;
  font-size: 2.2rem;
  font-weight: bold;
  line-height: 2;
}

p.more a {
  color: #2768ec;
}

@media screen and (max-width: 640px) {
  p.more {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 360px) {
  p.more {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.none li {
  text-indent: -9999px;
  height: 0px;
  overflow: hidden;
}

/*メイン部分 お知らせ end*/
/*メイン部分 イベントエリア*/
/* pickup */
#PickupKujiinfo dl {
  margin-top: 10px;
  margin-bottom: 10px;
}

@media screen and (max-width: 640px) {
  #PickupKujiinfo dl {
    margin-top: 5px;
    margin-bottom: 5px;
  }
}

#PickupKujiinfo dt {
  margin-left: 12%;
  padding-top: 4%;
  padding-bottom: 2px;
  color: #fef9d4;
  font-weight: bold;
  text-shadow: 1px 1px 3px #000;
}

#PickupKujiinfo dd {
  padding: 0 4% 2%;
  text-align: center;
}

#PickupKujiinfo dd img {
  width: 100%;
  max-width: 546px;
  border: #967f5e solid 3px;
  border-radius: 10px;
}

#PickupKujiinfo .eventSummerfes dt {
  margin-left: 18.9%;
  padding-bottom: 2%;
  color: #fef9d4;
  font-weight: bold;
  text-shadow: 1px 1px 3px #000;
}

#PickupKujiinfo dl.eventmetsu dd img {
  margin-left: 4%;
  width: 90%;
  max-width: 542px;
  border: #000 solid 3px;
  border-radius: 10px;
}

#PickupKujiinfo dl.collaboMerc dd img {
  margin-left: 4%;
  width: 90%;
  max-width: 542px;
  border: #000 solid 3px;
  border-radius: 10px;
}

#PickupKujiinfo dl.eventapril dd {
  text-align: center;
}

#PickupKujiinfo dl.eventapril dd img {
  margin: 0 auto;
  border: none;
}

#PickupKujiinfo dl.eventhw dd img {
  border: none;
}

#PickupKujiinfo dl.eventapril dd img {
  border: none;
  max-width: 680px;
}

#PickupKujiinfo dl:hover,
#KujiInfo li:hover {
  animation: bannerMove 0.2s linear;
  -webkit-animation: bannerMove 0.2s linear;
}

@media screen and (max-width: 640px) {
  #PickupKujiinfo {
    padding: 0 3%;
  }

  #PickupKujiinfo dt {
    font-size: 13px;
    font-size: 50%;
    font-size: 3vw;
  }

  #PickupKujiinfo dd {
    padding: 0 5% 2%;
  }
}

@media screen and (max-width: 360px) {
  #PickupKujiinfo dt {
    font-size: 10px;
    font-size: 50%;
    font-size: 3vw;
  }
}

.gacya,
.camp,
.event,
.eventCoin,
.info,
.collabo,
.ranbat,
.coop,
.gvm {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
}

.gacya {
  background-image: url(../member/common/img/eventGacya2.png);
}

.camp {
  background-image: url(../member/common/img/eventCamp2.png);
}

.event {
  background-image: url(../member/common/img/eventEvent2.png);
}

.eventCoin {
  background-image: url(../member/common/img/eventCoin2.png);
}

.info {
  background-image: url(../member/common/img/eventInfo2.png);
}

.collabo {
  background-image: url(../member/common/img/eventCollabo2.png);
}

.ranbat {
  background-image: url(../member/common/img/eventRanbat2.png);
}

.coop {
  background-image: url(../member/common/img/eventcoop2.png);
}

.gvm {
  background-image: url(../member/common/img/eventGvm2.png);
}

.eventhw {
  background: url(../member/common/img/eventEventhw.png) no-repeat;
  background-size: 100%;
  width: 100%;
  margin: 0 auto;
  background-position: center;
  max-width: 600px;
}

.eventxmas {
  background: url(../member/common/img/eventEventxmas.png) no-repeat;
  background-size: 100%;
  width: 100%;
  margin: 0 auto;
  background-position: center;
  max-width: 600px;
}

.eventmetsu {
  background: url(../member/common/img/eventMetsu.png) no-repeat;
  background-size: 100%;
  width: 100%;
  margin: 0 auto;
  background-position: center;
  max-width: 600px;
}

.eventmetsu2 {
  background: url(../member/common/img/eventMetsu2.png) no-repeat;
  background-size: 100%;
  width: 100%;
  margin: 0 auto;
  background-position: center;
  max-width: 600px;
}

.eventTsuyu {
  background: url(../member/common/img/eventTsuyu.png) no-repeat;
  background-size: 100%;
  width: 100%;
  margin: 0 auto;
  background-position: center;
  max-width: 600px;
}

.eventSummerfes {
  background: url(../member/common/img/eventSummerfes.png) no-repeat;
  background-size: 100%;
  width: 100%;
  margin: 0 auto;
  background-position: center;
  max-width: 600px;
}

.eventapril {
  width: 100%;
  margin: 1% auto;
  max-width: 600px;
}

.collaboMerc {
  background: url(../member/common/img/eventCollaboMerc.png) no-repeat;
  background-size: 100%;
  width: 100%;
  margin: 0 auto;
  background-position: center;
  max-width: 600px;
}

.tower {
  background: url(../member/common/img/eventTower.png) no-repeat;
  background-size: 100%;
  width: 100%;
  margin: 0 auto;
  background-position: center;
  max-width: 600px;
}

.tower2 {
  width: 98%;
  margin: 1% auto;
}

.tower2 img {
  border: none;
  border-radius: none;
}

/* other events */
#KujiInfo ul li {
  width: 78%;
  max-width: 480px;
  margin: 20px auto;
  background-position: center;
}

#KujiInfo ul.half {
  width: 85.5%;
  padding: 0%;
  margin: 5px auto;
  text-align: center;
}

#KujiInfo ul.half li {
  background: none;
  margin: 0 auto;
  padding: 0;
  width: 48%;
  max-width: 250px;
  display: inline-block;
  background-position: center;
  border-radius: 12px;
  text-align: center;
}

#KujiInfo ul li.april {
  background: none;
  width: 85.5%;
  max-width: 525px;
  border: 0;
  margin: 0 auto;
}

#KujiInfo ul li img {
  width: 100%;
  border: #958772 solid 3px;
  border-radius: 6px;
}

#KujiInfo ul li.april img {
  border: none;
}

@media screen and (max-width: 640px) {
  #KujiInfo ul li {
    margin: 2% auto;
  }
}

/* database */
ul.db {
  margin-bottom: -10px;
  background: #fff;
  line-height: 1.3;
}

ul.db li {
  margin-bottom: 0;
  padding: 0.5em 1em;
  border-bottom: 1px dotted #a77d4b;
  font-size: 0.7em;
}

@media screen and (max-width: 640px) {
  ul.db li {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 360px) {
  ul.db li {
    font-size: 11px;
    font-size: 1.1rem;
  }
}

/* details */
.details {
  width: 84%;
  max-width: 530px;
  height: 100%;
  margin: 0 auto;
  padding-right: 5%;
  text-align: left;
  color: #321b04;
  font-size: 90%;
  line-height: 22px;
  font-weight: normal;
}

.detailsRight {
  width: 84%;
  max-width: 530px;
  height: 100%;
  margin: -3% 4% 0 auto;
  text-align: right;
  color: #321b04;
  padding: 0;
  font-size: 70%;
  font-weight: normal;
}

.detailsCenter {
  width: 84%;
  max-width: 530px;
  height: 100%;
  margin: 0 auto;
  text-align: center;
  color: #321b04;
  font-size: 90%;
  line-height: 22px;
  font-weight: normal;
}

.detailsCenterbg {
  width: 84%;
  max-width: 530px;
  height: 100%;
  margin: 20px auto 30px auto;
  padding: 5px 0;
  text-align: center;
  color: #321b04;
  font-size: 90%;
  line-height: 22px;
  font-weight: normal;
  background-color: #f2e8ca;
  border-radius: 10px;
}

.detailsCenterNoborder {
  width: 84%;
  max-width: 530px;
  height: 100%;
  margin: 4% auto;
  text-align: center;
  color: #321b04;
  font-size: 90%;
  line-height: 22px;
  font-weight: normal;
}

.detailsCenterNoborder a {
  display: block;
}

.detailsCenterNoborder img {
  width: 100%;
}

.detailsRadius {
  width: 84%;
  max-width: 530px;
  background-color: #f2e8ca;
  height: 100%;
  margin: 2% auto 2% auto;
  text-align: center;
  color: #321b04;
  font-size: 90%;
  line-height: 22px;
  font-weight: normal;
  border-radius: 30px;
}

/* animation */
@-webkit-keyframes bannerMove {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  25% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }

  50% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }

  75% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }

  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes bannerMove {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  25% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }

  50% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }

  75% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }

  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

/*メイン部分 イベントエリア end*/
/*--------toppage end--------*/
/*--------faq--------*/
.faqList dt {
  width: 100%;
  padding: 3% 0 3% 3%;
  border-bottom: #f2e8cb solid 3px;
  color: #fef9d4;
  font-weight: bold;
  font-size: 90%;
  text-shadow: 1px 1px 3px #000;
  cursor: pointer;
}

.faqList dt img {
  vertical-align: middle;
}

.faqList a {
  color: #2768ec;
  text-shadow: none;
}

.faqList dt:hover {
  background-color: #b08c5a;
}

.faqList dd {
  font-weight: normal;
  font-size: 90%;
  text-shadow: none;
}

.faqList dt.odd {
  background-color: #b08c5a;
}

.faqList dd {
  width: 100%;
  padding: 3% 0 3% 3%;
  border-bottom: #f2e8cb solid 3px;
  background-color: #b08c5a;
  color: #fef9d4;
  font-weight: bold;
  line-height: 26px;
  text-shadow: 1px 1px 3px #000;
}

.ans1,
.ans2,
.ans3,
.ans4,
.ans5,
.ans6,
.ans7,
.ans8,
.ans9,
.ans10,
.ans11,
.ans12,
.ans13,
.ans14,
.ans15,
.ans16,
.ans17,
.ans18,
.ans19,
.ans20,
.ans21,
.ans22,
.ans23,
.ans24,
.ans25,
.ans26,
.ans27,
.ans28,
.ans29,
.ans30,
.ans31,
.ans32,
.ans33,
.ans34,
.ans35,
.ans36,
.ans37,
.ans38,
.ans39,
.ans40,
.ans41,
.ans42,
.ans43,
.ans44,
.ans45,
.ans46,
.ans47,
.ans48,
.ans49,
.ans50,
.ans51,
.ans52,
.ans53,
.ans54,
.ans55,
.ans56,
.ans57,
.ans58,
.ans59,
.ans60,
.ans61,
.ans62,
.ans63,
.ans64,
.ans65,
.ans66,
.ans67,
.ans68,
.ans69,
.ans70,
.ans71,
.ans72,
.ans73,
.ans74,
.ans75,
.ans76,
.ans77,
.ans78,
.ans79,
.ans80,
.ans81 {
  display: none;
}

/*--------faq end--------*/
/*--------parts--------*/
/* tableまわり */
table {
  width: 100%;
  border-left: 2px solid #321b04;
  border-bottom: 2px solid #321b04;
  border-right: 2px solid #321b04;
  background: #f2e8ca;
}

th,
td {
  padding: 1%;
  border-top: 2px solid #321b04;
  border-right: 2px solid #321b04;
  text-align: center;
  vertical-align: middle;
  color: #321b04;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.2;
}

@media screen and (max-width: 600px) {
  th,
  td {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 360px) {
  th,
  td {
    font-size: 10px;
    font-size: 1rem;
  }
}

.icon {
  width: 100%;
  max-width: 70px;
  vertical-align: bottom;
}

@media screen and (max-width: 600px) {
  .icon {
    max-width: 50px;
  }
}

.rewardList {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
  background-color: #f3eacc;
}

.rewardList,
.rewardList th,
.rewardList td {
  border-color: #39370c;
}

.rewardList th {
  background-color: #02f;
  color: #fff;
}

.rewardList-logbo {
  background-color: #f3eacc;
}

.rewardList-logbo,
.rewardList-logbo th,
.rewardList-logbo td {
  border-color: #39370c;
}

.rewardList-logbo th {
  padding: 1.25%;
  background-color: #3a9a00;
  color: #f3eacc;
  font-size: 20px;
  font-size: 2rem;
}

.rewardList-logbo td {
  color: #321b04;
}

@media screen and (max-width: 600px) {
  .rewardList-logbo th {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 360px) {
  .rewardList-logbo th {
    font-size: 10px;
    font-size: 1rem;
  }
}

.rewardList-coopmap {
  background-color: #f3eacc;
}

.rewardList-coopmap,
.rewardList-coopmap th,
.rewardList-coopmap td {
  border-color: #123600;
}

.rewardList-coopmap th {
  background-color: #84a76f;
  color: #123600;
}

.rewardList-coopmap td {
  color: #321b04;
}

.rewardList-gvm {
  background-color: #f3eacc;
}

.rewardList-gvm,
.rewardList-gvm th,
.rewardList-gvm td {
  border-color: #39370c;
}

.rewardList-gvm th {
  background-color: #7fbc75;
  color: #fff;
}

.rewardList-gvm td {
  color: #321b04;
}

.contentsList {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
  background-color: #f3eacc;
}

.contentsList,
.contentsList th,
.contentsList td {
  padding: 1.5%;
  border-color: #39370c;
}

.contentsList th {
  background-color: #7fbc75;
  color: #fff;
}

.powerUpList {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
  background-color: #f3eacc;
}

.powerUpList,
.powerUpList th,
.powerUpList td {
  border-color: #39370c;
}

.powerUpList th {
  color: #fff;
}

.powerUpList_before th,
.powerUpList_after th {
  text-align: left;
}

.powerUpList_before th,
.powerUpList_before td {
  background-color: #adadad;
}

.powerUpList_after th {
  color: #f30;
}

.powerUpList_after th,
.powerUpList_after td {
  background-color: #f3eacc;
}

.powerUpList_before th {
  color: #321b04;
}

.gacyaList th {
  background-color: #666;
  color: #f3eacc;
}

@media screen and (max-width: 600px) {
  .gacyaList th {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 360px) {
  .gacyaList th {
    font-size: 10px;
    font-size: 1rem;
  }
}

.gacyaList th.element {
  width: 5%;
}

.gacyaList th.name {
  width: 35%;
}

.gacyaList th.param {
  width: 30%;
}

.gacyaList .rare7,
.gacyaList .rare6,
.gacyaList .rare5,
.gacyaList .rare4,
.gacyaList .rare3 {
  font-size: 1em;
}

.gacyaList td {
  font-size: 13px;
  font-size: 1.3rem;
}

@media screen and (max-width: 600px) {
  .gacyaList td {
    font-size: 10px;
    font-size: 1rem;
  }
}

.table {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
  border-color: #321b04;
  background-color: #fff;
}

.table th {
  border-color: #321b04;
  background-color: #520;
  color: #fff;
}

.table-soul {
  background-color: #f3eacc;
}

.table-soul,
.table-soul th,
.table-soul td {
  border-color: #123600;
}

.table-soul th {
  background-color: #84a76f;
  color: #123600;
}

.table-soul td {
  color: #123600;
}

.table-enquete,
.table-coopmapSoul {
  background-color: #fff;
}

.table-enquete,
.table-enquete th,
.table-enquete td,
.table-coopmapSoul,
.table-coopmapSoul th,
.table-coopmapSoul td {
  border-color: #341d00;
}

.table-enquete th,
.table-coopmapSoul th {
  background-color: #ffa617;
  color: #341d00;
}

.table-enquete td,
.table-coopmapSoul td {
  color: #341d00;
}

.table-enquete {
  margin: 2% auto;
}

.table-enquete th,
.table-enquete td {
  padding: 2.5%;
}

.table-premium {
  background-color: #fff;
}

.table-premium,
.table-premium th,
.table-premium td {
  border-color: #341d00;
}

.table-premium th,
.table-premium td {
  padding-top: 3%;
  padding-bottom: 3%;
}

.table-premium th {
  background-color: #936c3f;
  color: #fff;
}

.table-premium td {
  color: #341d00;
}

.table tr.table_term th {
  border-top: rgba(255, 255, 255, 0.3) 1px dotted;
  vertical-align: top;
  font-weight: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

td.pickup {
  color: #e20448;
  font-weight: bold;
}

td.new::before {
  content: "NEW!!";
  display: block;
  color: #e20448;
  text-align: center;
}

.tHeading-fire th {
  background-color: #c00;
  color: #f3eacc;
}

.tHeading-water th {
  background-color: #36f;
  color: #f3eacc;
}

.tHeading-wood th {
  background-color: #393;
  color: #f3eacc;
}

.tHeading-light th {
  background-color: #ff3;
  color: #321b04;
}

.tHeading-dark th {
  background-color: #639;
  color: #f3eacc;
}

.tHeading-set th {
  background-color: #bc7f75;
}

.tHeading-note th {
  background-color: #630001;
  color: #ffed00;
}

.tHeading-coopmap th {
  background-color: #84a76f;
}

.tHeading-rare7 th,
.tHeading-rare6 th,
.tHeading-rare5 th,
.tHeading-rare4 th,
.tHeading-rare3 th {
  color: #f3eacc;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  text-shadow: 1px 1px 3px #000;
}

.tHeading-rare7 th {
  background-color: #660099;
}

.tHeading-rare6 th {
  background-color: #ff080d;
}

.tHeading-rare5 th {
  background-color: #f90;
}

.tHeading-rare4 th {
  background-color: #f9c;
}

.tHeading-rare3 th {
  background-color: #6cf;
}

@media screen and (max-width: 600px) {
  .tHeading-rare7 th,
  .tHeading-rare6 th,
  .tHeading-rare5 th,
  .tHeading-rare4 th,
  .tHeading-rare3 th {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 360px) {
  .tHeading-rare7 th,
  .tHeading-rare6 th,
  .tHeading-rare5 th,
  .tHeading-rare4 th,
  .tHeading-rare3 th {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

/* tableまわり end */

/* mission */

.mission_term {
  margin: 0.5em 0;
  border-bottom: 1px dotted #321b04;
  text-align: center;
}

.mission_term-label {
  padding: 1px;
  border: none;
  background: #321b04;
}

.mission_cond {
  width: 100%;
  background-color: #f2e8ca;
  margin: 10px auto;
  padding: 10px 20px;
  border-radius: 8px;
  text-align: center;
}

@media screen and (max-width: 600px) {
  .mission_cond {
    padding: 5px 15px;
  }
}

@media screen and (max-width: 360px) {
  .mission_cond {
    padding: 4px 10px;
  }
}

/* mission end */

/* attention */
.ttlReg {
  margin: 2% auto;
  padding: 0;
  border-bottom: #026b11 1px dotted;
  text-align: left;
  color: #005609;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}

@media screen and (max-width: 600px) {
  .ttlReg {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 360px) {
  .ttlReg {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

/* ガチャページなどの注意書きまわり */
.notice {
  padding: 28px;
  margin-left: 20px;
  color: #321b04;
  font-size: 80%;
  line-height: 22px;
  font-weight: normal;
}

.notice li {
  list-style: disc;
}

/* ガチャページなどの注意書きまわり end */
/* 注意事項 */
.caution {
  margin-top: 50px;
}

.caution_ttl {
  width: 50%;
  max-width: 300px;
  margin: 0 auto;
  padding: 6px;
  border: #f2e8ca double 4px;
  border-radius: 30px;
  background-color: #987f5e;
  text-align: center;
  color: #f2e8ca;
  line-height: 1.2;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}

.cautionBody {
  width: 90%;
  max-width: 640px;
  margin: 20px auto;
  padding: 20px 30px;
  border: #967f5e double 10px;
  border-radius: 40px;
  background: #f2e8ca;
  color: #321b04;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.cautionBody_txt {
  margin: 0.5em auto;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.2;
}

.cautionReg,
.cautionList,
.cautionList2 {
  color: #321b04;
  font-size: 15.8px;
  font-size: 1.58rem;
  line-height: 1.2;
  margin: 0.5em auto;
}

.cautionReg_item,
.cautionList_item,
.cautionList2_item {
  padding-left: 1em;
  text-indent: -1em;
}

.cautionReg_item::before {
  content: "※";
}

.cautionList_item::before {
  content: "・";
}

.cautionList2_item::before {
  content: "-";
  margin: 0 0.3em;
}

@media screen and (max-width: 600px) {
  .caution_ttl {
    font-size: 14px;
    font-size: 1.4rem;
  }

  .cautionBody {
    margin: 15px auto;
    padding: 15px 20px;
    border-width: 6px;
  }

  .cautionBody_txt {
    font-size: 12px;
    font-size: 1.2rem;
  }

  .cautionReg,
  .cautionList,
  .cautionList2 {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 360px) {
  .caution_ttl {
    font-size: 12px;
    font-size: 1.2rem;
  }

  .cautionBody {
    margin: 10px auto;
  }

  .cautionBody_txt {
    font-size: 10px;
    font-size: 1rem;
  }

  .cautionReg,
  .cautionList,
  .cautionList2 {
    font-size: 10px;
    font-size: 1rem;
  }
}

/* 注意事項 end */

p.detailsDL {
  width: 530px;
  height: 100%;
  margin: 0 auto;
  text-align: center;
  color: #321b04;
  font-size: 90%;
  line-height: 22px;
  font-weight: normal;
}

p.detailsDL img {
  border: #f3eacc double 5px;
  margin: 5px;
  max-width: 480px;
}

.nodrop {
  background-color: #848484;
  font-size: 0.8em;
}

.drop {
  background-color: #c9ffc6;
  font-size: 0.8em;
}

.btn_tw {
  font-size: 80%;
  width: 30%;
  margin-left: 6%;
  padding: 2%;
  border: 1px #522712 solid;
  background: #b7deed;
  /* Old browsers */
  /* FF3.6+ */
  /* Chrome,Safari4+ */
  /* Chrome10+,Safari5.1+ */
  /* Opera 11.10+ */
  /* IE10+ */
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#b7deed),
    color-stop(50%, #71ceef),
    color-stop(51%, #21b4e2),
    to(#b7deed)
  );
  background: -webkit-linear-gradient(
    top,
    #b7deed 0%,
    #71ceef 50%,
    #21b4e2 51%,
    #b7deed 100%
  );
  background: -o-linear-gradient(
    top,
    #b7deed 0%,
    #71ceef 50%,
    #21b4e2 51%,
    #b7deed 100%
  );
  background: linear-gradient(
    to bottom,
    #b7deed 0%,
    #71ceef 50%,
    #21b4e2 51%,
    #b7deed 100%
  );
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b7deed', endColorstr='#b7deed', GradientType=0);
  /* IE6-9 */
  color: #fff;
  text-align: center;
  -webkit-box-shadow: 1px 1px 2px #e7e7e7;
  box-shadow: 1px 1px 2px #e7e7e7;
  /* Safari,Google Chrome用 */
  /* Firefox用 */
  border-radius: 10px;
}

.btn_tw a {
  text-decoration: none;
  font-weight: bold;
  color: #fff;
}

.btnTopPage {
  max-width: 670px;
  max-width: calc(640px + 30px);
  padding: 0 15px;
  margin-left: auto;
  margin-right: auto;
  text-align: right;
}

.btnTopPage img {
  width: 50%;
  max-width: 200px;
}

@media screen and (max-width: 640px) {
  .btnTopPage {
    padding: 0 10px;
  }
}

.btnToLP {
  max-width: 200px;
  margin-top: 20px;
  margin-bottom: 20px;
  border-radius: 8px;
  background: #7f6627;
  background: -webkit-gradient(
    left top,
    left bottom,
    color-stop(0%, rgba(195, 161, 74, 1)),
    color-stop(100%, rgba(67, 51, 8, 1))
  );
  background: -webkit-linear-gradient(
    top,
    rgba(195, 161, 74, 1) 0%,
    rgba(67, 51, 8, 1) 100%
  );
  background: -o-linear-gradient(
    top,
    rgba(195, 161, 74, 1) 0%,
    rgba(67, 51, 8, 1) 100%
  );
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(rgba(195, 161, 74, 1)),
    to(rgba(67, 51, 8, 1))
  );
  background: linear-gradient(
    to bottom,
    rgba(195, 161, 74, 1) 0%,
    rgba(67, 51, 8, 1) 100%
  );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c3a14a', endColorstr='#433308', GradientType=0);
  color: #fff;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
}

.btnToLP_link {
  display: block;
  padding: 0.875em;
  border-radius: 6px;
  -webkit-box-shadow: 0px 0px 2px #d6c267 inset;
  -ms-box-shadow: 0px 0px 2px #d6c267 inset;
  box-shadow: 0px 0px 2px #d6c267 inset;
  color: #fff;
  text-decoration: none;
}

.btnToLP_link:active,
.btnToLP_link:hover,
.btnToLP_link:link,
.btnToLP_link:visited {
  color: #fff;
}

@media screen and (max-width: 640px) {
  .btnToLP {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 13px;
    font-size: 1.3rem;
  }
}

@media screen and (max-width: 360px) {
  .btnToLP {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.btnDetail {
  position: relative;
  width: 50%;
  max-width: 280px;
  margin: 20px auto;
  padding: 0.75em 0.5em;
  border-radius: 8px;
  /*background: #520;*/
  background: #5d2805;
  -webkit-box-shadow: 0 6px 0 #321b04, inset 2px 2px 0 rgba(255, 255, 255, 0.2),
    inset -2px -2px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 6px 0 #321b04, inset 2px 2px 0 rgba(255, 255, 255, 0.2),
    inset -2px -2px 0 rgba(0, 0, 0, 0.2);
  font-size: 20px;
  font-size: 2rem;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
  color: #fff;
  cursor: pointer;
}

.btnDetail:active {
  -webkit-transform: translateY(4px);
  -ms-transform: translateY(4px);
  transform: translateY(4px);
  -webkit-box-shadow: 0 2px 0 #321b04, inset 2px 2px 0 rgba(255, 255, 255, 0.2),
    inset -2px -2px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 0 #321b04, inset 2px 2px 0 rgba(255, 255, 255, 0.2),
    inset -2px -2px 0 rgba(0, 0, 0, 0.2);
}

.btnDetail::after {
  display: inline-block;
  content: "詳細はこちら";
}

.btnDetail.active::after {
  content: "詳細をとじる";
}

.btnDetail::before {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  right: 1.25em;
  width: 0;
  height: 0;
  border-top: 0.7em solid #fff;
  border-left: 0.5em solid transparent;
  border-right: 0.5em solid transparent;
  border-bottom: 0 solid transparent;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.btnDetail.active::before {
  border-top: 0 solid transparent;
  border-bottom: 0.7em solid #fff;
}

@media screen and (max-width: 640px) {
  .btnDetail {
    margin: 10px auto;
    -webkit-box-shadow: 0 4px 0 #321b04,
      inset 2px 2px 0 rgba(255, 255, 255, 0.2),
      inset -2px -2px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 4px 0 #321b04, inset 2px 2px 0 rgba(255, 255, 255, 0.2),
      inset -2px -2px 0 rgba(0, 0, 0, 0.2);
    font-size: 14px;
    font-size: 1.4rem;
  }

  .btnDetail:active {
    -webkit-transform: translateY(3px);
    -ms-transform: translateY(3px);
    transform: translateY(3px);
    -webkit-box-shadow: 0 1px 0 #321b04,
      inset 2px 2px 0 rgba(255, 255, 255, 0.2),
      inset -2px -2px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 0 #321b04, inset 2px 2px 0 rgba(255, 255, 255, 0.2),
      inset -2px -2px 0 rgba(0, 0, 0, 0.2);
  }
}

@media screen and (max-width: 360px) {
  .btnDetail {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

/*--------parts end--------*/

/*===========================================*/
/*         主にモンスターステータス周り        */
/*===========================================*/

.monster {
  margin-bottom: 20px;
}

@media screen and (max-width: 640px) {
  .monster {
    margin-bottom: 10px;
  }
}

.bigimg {
  width: 100%;
  height: auto;
  text-align: bottom;
}

.bigimg img {
  width: 100%;
  vertical-align: top;
}

.bigimg {
  font-size: 0;
  padding: 0;
}

.img-status {
  background-image: url(../member/common/img/status_bg.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 100%;
  text-align: center;
}

.img-status img {
  width: 80%;
  max-width: 640px;
  border: #512c07 0.3rem solid;
  box-sizing: content-box;
}

/*アビリティリンク*/
ul.abilityLinks li {
  background: #b08c5a;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-top: 3px solid #cdb28c;
  border-left: 3px solid #cdb28c;
  border-right: 3px solid #a07a44;
  border-bottom: 3px solid #a07a44;
  border-radius: 0.5em;
  width: 100%;
  max-width: 580px;
  margin: 0.5em auto;
  padding: 0.3em;
  text-align: center;
}

ul.abilityLinks li a:before {
  content: "◆";
  color: #cdb28c;
}

ul.abilityLinks li a {
  display: inline-block;
  background-size: 0.8em;
  color: #f3eacc;
  font-size: 0.9em;
  font-weight: bold;
  line-height: 1em;
  text-shadow: #000 1px 1px 0;
}

ul.abilityLinks li a:not(:hover) {
  text-decoration: none;
}

ul.abilityLinks li a:hover {
  text-decoration: underline;
}

p.bigimg {
  padding: 0;
  margin: 0;
  font-size: 0;
}

/* ability 説明 */
h4.point {
  font-weight: 600;
  background: #7e0002;
  margin-right: 4%;
  padding: 2px 0 0 2.1%;
  width: 91%;
  max-width: 640px;
  color: #fff;
  font-size: 100%;
  margin-left: 3.5%;
}

p.pointTxt {
  width: 88.1%;
  text-align: left;
  padding: 2% 3% 2% 2%;
  font-weight: 500;
  font-size: 72%;
  color: #ffffff;
  background: #000;
}

ul.abilityLinks li a {
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
}

p.mtExtend,
h2.mtExtend,
h3.mtExtend,
ul.mtExtend {
  margin-top: 0 !important;
}

p.statusObi {
  width: 89.1%;
  max-width: 640px;
  text-align: left;
  padding-left: 1%;
  background-color: #573707;
  color: #ffffff;
}

[id^="monster"] {
  background-color: #000000;
}

[id^="monster"] p.statusObi {
  width: 99%;
  text-align: left;
  background-color: #573707;
  color: #ffffff;
}

[id^="monster"] p.bigimg {
  width: 100%;
  height: 100%;
  text-align: bottom;
  margin: 0;
}

[id^="monster"] h4.point {
  font-weight: 600;
  background: #7e0002;
  padding: 2px 0 0 2.1%;
  width: 97.9%;
  max-width: 640px;
  color: #fff;
  font-size: 100%;
  margin: 0;
}

[id^="monster"] p.pointTxt {
  margin: 0;
  width: 95%;
  text-align: left;
  padding: 2% 3% 2% 2%;
  font-weight: 500;
  font-size: 0.7em;
  color: #ffffff;
  background: #000;
}

ul.gacyaBox li {
  width: 89.1%;
  margin: 0 auto;
}

ul.gacyaBox li img {
  width: 100%;
}

ul.abilityLinks li {
  font-size: 0.8em;
  line-height: normal;
}

ul.abilityLinks li img {
  vertical-align: middle;
}

ul.abilityLinks li a {
  display: block;
  width: 100%;
  height: 100%;
  text-align: left;
  line-height: normal;
}

ul.abilityLinks li a:before {
  content: "";
  color: #cdb28c;
  vertical-align: middle;
}

ul.abilityLinks li.cat_skill a:before {
  content: "スキル";
  color: #fff;
  background: #060;
  text-shadow: none;
  font-size: 0.5em;
  display: inline-block;
  padding: 3px;
  margin-right: 3px;
  border-radius: 5px;
}

ul.abilityLinks li.cat_lskill a:before {
  content: "ﾘｰﾀﾞｰｽｷﾙ";
  color: #fff;
  background: #00a;
  text-shadow: none;
  font-size: 0.5em;
  display: inline-block;
  padding: 3px;
  margin-right: 3px;
  border-radius: 5px;
}

ul.abilityLinks li.cat_ability a:before {
  content: "能力";
  color: #fff;
  background: #800;
  text-shadow: none;
  font-size: 0.5em;
  display: inline-block;
  padding: 3px;
  margin-right: 3px;
  border-radius: 5px;
}

/* ability 説明 end */

/* 覚醒モンスター */
.kback {
  background: url(/member/info/kakusei/img/back_kakusei.jpg) repeat;
  text-align: center;
  font-size: 22px;
  font-size: 2.2rem;
}

@media screen and (max-width: 600px) {
  .kback {
    font-size: 15px;
    font-size: 1.5rem;
  }
}

@media screen and (max-width: 360px) {
  .kback {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.tokusei {
  background-color: rgba(41, 0, 255, 0.5);
  color: #ffeb00;
  text-align: center;
  font-weight: bold;
  font-size: 0.8em;
  line-height: 1.3;
  border-radius: 5px;
  width: 85%;
  margin: 5% auto;
  padding: 1.5%;
  border: 1px solid rgb(8, 210, 243);
  -webkit-box-shadow: 0px 0px 1px rgba(8, 210, 243, 1),
    inset 0px 0px 10px rgba(15, 97, 254, 0.7);
  box-shadow: 0px 0px 1px rgba(8, 210, 243, 1),
    inset 0px 0px 10px rgba(15, 97, 254, 0.7);
}

.tokusei::after {
  display: block;
  content: "";
  clear: both;
}

.tokusei dt,
.tokusei dd {
  float: left;
  border: none;
  line-height: 1.2;
}

.tokusei dt {
  display: block;
  width: 20%;
}

.tokusei dt img {
  width: 70%;
}

.tokusei dd {
  width: 80%;
  padding: 1% 0;
}

/* 覚醒モンスター end */

/* EventMenu */
.EventMenu {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  background: #333333;
}

.EventMenuList,
.EventMenuBox {
  padding: 11px;
}

.EventMenuContents,
.EventMenuContents.accordionContents {
  padding: 11px 20px;
}

@media screen and (max-width: 640px) {
  .EventMenuList,
  .EventMenuBox {
    padding: 7px;
  }

  .EventMenuContents,
  .EventMenuContents.accordionContents {
    padding: 7px 10px;
  }
}

@media screen and (max-width: 360px) {
  .EventMenuList,
  .EventMenuBox {
    padding: 6px;
  }

  .EventMenuContents,
  .EventMenuContents.accordionContents {
    padding: 6px 10px;
  }
}

.EventMenuList {
  border-top: 0.5px solid #555555;
  background-color: #2a2925;
}

.torg {
  position: relative;
  cursor: pointer;
}

.torg::after {
  display: block;
  position: absolute;
  content: "\0025bc";
  right: 2%;
  bottom: 12px;
  color: #fff;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1;
}

@media screen and (max-width: 600px) {
  .torg::after {
    bottom: 8px;
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 360px) {
  .torg::after {
    bottom: 7px;
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.torg.active::after {
  content: "\0025b2";
}

.EventMenuList_bnr {
  margin: 0 0 11px;
  padding: 0;
  background: none;
}

@media screen and (max-width: 640px) {
  .EventMenuList_bnr {
    margin-bottom: 7px;
  }
}

@media screen and (max-width: 360px) {
  .EventMenuList_bnr {
    margin-bottom: 6px;
  }
}

.EventMenuList_bnr img {
  width: 100%;
  margin: 0;
  vertical-align: middle;
}

.EventMenuList_bnrSuppl {
  margin: 0;
  padding: 0 4%;
}

.EventMenuList_term {
  margin: 0;
  padding: 0 4%;
  text-align: center;
  color: #ffffff;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: normal;
  line-height: 1.2;
}

@media screen and (max-width: 640px) {
  .EventMenuList_term {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 640px) {
  .EventMenuList_ordeal {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 400px) {
  .EventMenuList_term {
    font-size: 11px;
    font-size: 1.1rem;
  }
}

@media screen and (max-width: 400px) {
  .EventMenuList_ordeal {
    font-size: 11px;
    font-size: 1.1rem;
  }
}

@media screen and (max-width: 360px) {
  .EventMenuList_term {
    font-size: 11px;
    font-size: 1.1rem;
  }
}

.EventMenuContents_ttl {
  margin: 0.5em auto;
  border-bottom: 1px dashed #fff;
  color: #fff;
  font-size: 20px;
  font-size: 2rem;
  font-weight: bold;
}

.EventMenuContents_ttl::before {
  display: inline-block;
  content: "■";
  margin-right: 0.25em;
  color: #ff7f00;
}

@media screen and (max-width: 640px) {
  .EventMenuContents_ttl {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 360px) {
  .EventMenuContents_ttl {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

/* EventMenu end */

/* Accordion */
.accordionBtn:hover {
  cursor: pointer;
}

.accordionBtn-txt {
  font-weight: bold;
  text-align: right;
}

.accordionBtn-txt::after {
  display: inline-block;
  content: "詳細はこちら\0025bc";
}

.accordionBtn-txt.active::after {
  content: "詳細をとじる\0025b2";
}

.accordionContents {
  padding: 1px 0;
}

/* Accordion end */

/* Download */
.dlList {
  padding: 10px 0 0;
  text-align: center;
}

.dlList_item {
  margin: 0;
}

.dl-android {
  width: 24%;
  min-width: 145px;
  max-width: 173px;
}

.dl-ios {
  width: 19.2%;
  min-width: 116px;
  max-width: 139px;
}

/* */

/* Spec */
.specAppWrapper {
  background: #000;
}

.specApp {
  width: 80%;
  max-width: 640px;
  padding: 15px;
  margin: 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 8px;
}

.specApp_txt {
  margin: 0.25em;
  color: #fff;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
  line-height: 1.2;
}

@media screen and (max-width: 640px) {
  .specApp {
    width: 90%;
    padding: 10px 0;
  }

  .specApp_txt {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 360px) {
  .specApp_txt {
    font-size: 11px;
    font-size: 1.1rem;
  }
}

/* */

/* layout */
.row {
  position: relative;
}

.row::after {
  display: block;
  content: "";
  clear: both;
}

.column {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  min-height: 2px;
  z-index: 1;
}

.large-1 {
  width: 8.3333%;
}

.large-2 {
  width: 16.6666%;
}

.large-3 {
  width: 25%;
}

.large-4 {
  width: 33.3333%;
}

.large-5 {
  width: 41.6666%;
}

.large-6 {
  width: 50%;
}

.large-7 {
  width: 58.3333%;
}

.large-8 {
  width: 66.6666%;
}

.large-9 {
  width: 75%;
}

.large-10 {
  width: 83.3333%;
}

.large-11 {
  width: 91.6666%;
}

.large-12 {
  width: 100%;
}

@media screen and (max-width: 640px) {
  .middle-1 {
    width: 8.3333%;
  }

  .middle-2 {
    width: 16.6666%;
  }

  .middle-3 {
    width: 25%;
  }

  .middle-4 {
    width: 33.3333%;
  }

  .middle-5 {
    width: 41.6666%;
  }

  .middle-6 {
    width: 50%;
  }

  .middle-7 {
    width: 58.3333%;
  }

  .middle-8 {
    width: 66.6666%;
  }

  .middle-9 {
    width: 75%;
  }

  .middle-10 {
    width: 83.3333%;
  }

  .middle-11 {
    width: 91.6666%;
  }

  .middle-12 {
    width: 100%;
  }
}

@media screen and (max-width: 360px) {
  .small-1 {
    width: 8.3333%;
  }

  .small-2 {
    width: 16.6666%;
  }

  .small-3 {
    width: 25%;
  }

  .small-4 {
    width: 33.3333%;
  }

  .small-5 {
    width: 41.6666%;
  }

  .small-6 {
    width: 50%;
  }

  .small-7 {
    width: 58.3333%;
  }

  .small-8 {
    width: 66.6666%;
  }

  .small-9 {
    width: 75%;
  }

  .small-10 {
    width: 83.3333%;
  }

  .small-11 {
    width: 91.6666%;
  }

  .small-12 {
    width: 100%;
  }
}

.large-offset-0 {
  margin-left: 0;
}

.large-offset-1 {
  margin-left: 8.3333%;
}

.large-offset-2 {
  margin-left: 16.6666%;
}

.large-offset-3 {
  margin-left: 25%;
}

.large-offset-4 {
  margin-left: 33.3333%;
}

.large-offset-5 {
  margin-left: 41.6666%;
}

.large-offset-6 {
  margin-left: 50%;
}

.large-offset-7 {
  margin-left: 58.3333%;
}

.large-offset-8 {
  margin-left: 66.6666%;
}

.large-offset-9 {
  margin-left: 75%;
}

.large-offset-10 {
  margin-left: 83.3333%;
}

.large-offset-11 {
  margin-left: 91.6666%;
}

.large-offset-12 {
  margin-left: 100%;
}

@media screen and (max-width: 640px) {
  .middle-offset-0 {
    margin-left: 0;
  }

  .middle-offset-1 {
    margin-left: 8.3333%;
  }

  .middle-offset-2 {
    margin-left: 16.6666%;
  }

  .middle-offset-3 {
    margin-left: 25%;
  }

  .middle-offset-4 {
    margin-left: 33.3333%;
  }

  .middle-offset-5 {
    margin-left: 41.6666%;
  }

  .middle-offset-6 {
    margin-left: 50%;
  }

  .middle-offset-7 {
    margin-left: 58.3333%;
  }

  .middle-offset-8 {
    margin-left: 66.6666%;
  }

  .middle-offset-9 {
    margin-left: 75%;
  }

  .middle-offset-10 {
    margin-left: 83.3333%;
  }

  .middle-offset-11 {
    margin-left: 91.6666%;
  }

  .middle-offset-12 {
    margin-left: 100%;
  }
}

@media screen and (max-width: 360px) {
  .small-offset-0 {
    margin-left: 0;
  }

  .small-offset-1 {
    margin-left: 8.3333%;
  }

  .small-offset-2 {
    margin-left: 16.6666%;
  }

  .small-offset-3 {
    margin-left: 25%;
  }

  .small-offset-4 {
    margin-left: 33.3333%;
  }

  .small-offset-5 {
    margin-left: 41.6666%;
  }

  .small-offset-6 {
    margin-left: 50%;
  }

  .small-offset-7 {
    margin-left: 58.3333%;
  }

  .small-offset-8 {
    margin-left: 66.6666%;
  }

  .small-offset-9 {
    margin-left: 75%;
  }

  .small-offset-10 {
    margin-left: 83.3333%;
  }

  .small-offset-11 {
    margin-left: 91.6666%;
  }

  .small-offset-12 {
    margin-left: 100%;
  }
}

.large-push-0 {
  right: auto;
  left: auto;
}

.large-push-1 {
  right: 8.3333%;
  left: auto;
}

.large-push-2 {
  right: 16.6666%;
  left: auto;
}

.large-push-3 {
  right: 25%;
  left: auto;
}

.large-push-4 {
  right: 33.3333%;
  left: auto;
}

.large-push-5 {
  right: 41.6666%;
  left: auto;
}

.large-push-6 {
  right: 50%;
  left: auto;
}

.large-push-7 {
  right: 58.3333%;
  left: auto;
}

.large-push-8 {
  right: 66.6666%;
  left: auto;
}

.large-push-9 {
  right: 75%;
  left: auto;
}

.large-push-10 {
  right: 83.3333%;
  left: auto;
}

.large-push-11 {
  right: 91.6666%;
  left: auto;
}

.large-push-12 {
  right: 100%;
  left: auto;
}

.large-pull-0 {
  right: auto;
  left: auto;
}

.large-pull-1 {
  right: auto;
  left: 8.3333%;
}

.large-pull-2 {
  right: auto;
  left: 16.6666%;
}

.large-pull-3 {
  right: auto;
  left: 25%;
}

.large-pull-4 {
  right: auto;
  left: 33.3333%;
}

.large-pull-5 {
  right: auto;
  left: 41.6666%;
}

.large-pull-6 {
  right: auto;
  left: 50%;
}

.large-pull-7 {
  right: auto;
  left: 58.3333%;
}

.large-pull-8 {
  right: auto;
  left: 66.6666%;
}

.large-pull-9 {
  right: auto;
  left: 75%;
}

.large-pull-10 {
  right: auto;
  left: 83.3333%;
}

.large-pull-11 {
  right: auto;
  left: 91.6666%;
}

.large-pull-12 {
  right: auto;
  left: 100%;
}

@media screen and (max-width: 640px) {
  .middle-push-0 {
    right: auto;
    left: auto;
  }

  .middle-push-1 {
    right: 8.3333%;
    left: auto;
  }

  .middle-push-2 {
    right: 16.6666%;
    left: auto;
  }

  .middle-push-3 {
    right: 25%;
    left: auto;
  }

  .middle-push-4 {
    right: 33.3333%;
    left: auto;
  }

  .middle-push-5 {
    right: 41.6666%;
    left: auto;
  }

  .middle-push-6 {
    right: 50%;
    left: auto;
  }

  .middle-push-7 {
    right: 58.3333%;
    left: auto;
  }

  .middle-push-8 {
    right: 66.6666%;
    left: auto;
  }

  .middle-push-9 {
    right: 75%;
    left: auto;
  }

  .middle-push-10 {
    right: 83.3333%;
    left: auto;
  }

  .middle-push-11 {
    right: 91.6666%;
    left: auto;
  }

  .middle-push-12 {
    right: 100%;
    left: auto;
  }

  .middle-pull-0 {
    right: auto;
    left: auto;
  }

  .middle-pull-1 {
    right: auto;
    left: 8.3333%;
  }

  .middle-pull-2 {
    right: auto;
    left: 16.6666%;
  }

  .middle-pull-3 {
    right: auto;
    left: 25%;
  }

  .middle-pull-4 {
    right: auto;
    left: 33.3333%;
  }

  .middle-pull-5 {
    right: auto;
    left: 41.6666%;
  }

  .middle-pull-6 {
    right: auto;
    left: 50%;
  }

  .middle-pull-7 {
    right: auto;
    left: 58.3333%;
  }

  .middle-pull-8 {
    right: auto;
    left: 66.6666%;
  }

  .middle-pull-9 {
    right: auto;
    left: 75%;
  }

  .middle-pull-10 {
    right: auto;
    left: 83.3333%;
  }

  .middle-pull-11 {
    right: auto;
    left: 91.6666%;
  }

  .middle-pull-12 {
    right: auto;
    left: 100%;
  }
}

@media screen and (max-width: 360px) {
  .small-push-0 {
    right: auto;
    left: auto;
  }

  .small-push-1 {
    right: 8.3333%;
    left: auto;
  }

  .small-push-2 {
    right: 16.6666%;
    left: auto;
  }

  .small-push-3 {
    right: 25%;
    left: auto;
  }

  .small-push-4 {
    right: 33.3333%;
    left: auto;
  }

  .small-push-5 {
    right: 41.6666%;
    left: auto;
  }

  .small-push-6 {
    right: 50%;
    left: auto;
  }

  .small-push-7 {
    right: 58.3333%;
    left: auto;
  }

  .small-push-8 {
    right: 66.6666%;
    left: auto;
  }

  .small-push-9 {
    right: 75%;
    left: auto;
  }

  .small-push-10 {
    right: 83.3333%;
    left: auto;
  }

  .small-push-11 {
    right: 91.6666%;
    left: auto;
  }

  .small-push-12 {
    right: 100%;
    left: auto;
  }

  .small-pull-0 {
    right: auto;
    left: auto;
  }

  .small-pull-1 {
    right: auto;
    left: 8.3333%;
  }

  .small-pull-2 {
    right: auto;
    left: 16.6666%;
  }

  .small-pull-3 {
    right: auto;
    left: 25%;
  }

  .small-pull-4 {
    right: auto;
    left: 33.3333%;
  }

  .small-pull-5 {
    right: auto;
    left: 41.6666%;
  }

  .small-pull-6 {
    right: auto;
    left: 50%;
  }

  .small-pull-7 {
    right: auto;
    left: 58.3333%;
  }

  .small-pull-8 {
    right: auto;
    left: 66.6666%;
  }

  .small-pull-9 {
    right: auto;
    left: 75%;
  }

  .small-pull-10 {
    right: auto;
    left: 83.3333%;
  }

  .small-pull-11 {
    right: auto;
    left: 91.6666%;
  }

  .small-pull-12 {
    right: auto;
    left: 100%;
  }
}

/* layout end */

/*--------help--------*/
.noTxt {
  display: none;
  height: 0;
}

.breakWord {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.br-l-block {
  display: block;
}

.br-l-none {
  display: none;
}

@media screen and (max-width: 640px) {
  .br-m-block {
    display: block;
  }

  .br-m-none {
    display: none;
  }
}

@media screen and (max-width: 360px) {
  .br-s-block {
    display: block;
  }

  .br-s-none {
    display: none;
  }
}

.hide {
  display: none !important;
}

.show {
  display: block !important;
}

@media screen and (min-width: 641px) {
  .pc-hide {
    display: none !important;
  }

  .pc-show {
    display: block !important;
  }
}

@media screen and (max-width: 640px) {
  .sp-hide {
    display: none !important;
  }

  .sp-show {
    display: block !important;
  }
}

.Block {
  display: block;
}

.inlineBlock {
  display: inline-block;
}

.clear {
  clear: both;
}

.tLayoutFix {
  table-layout: fixed;
}

.pos-abs {
  position: absolute;
}

.pos-rel {
  position: relative;
}

.anchor {
  height: 0;
}

.w-auto {
  width: auto !important;
}

.fts0 {
  font-size: 0 !important;
}

.mt0 {
  margin-top: 0 !important;
}

.mt1 {
  margin-top: 1% !important;
}

.mt2 {
  margin-top: 2% !important;
}

.mt3 {
  margin-top: 3% !important;
}

.mt4 {
  margin-top: 4% !important;
}

.mt5 {
  margin-top: 5% !important;
}

.mt6 {
  margin-top: 6% !important;
}

.mt8 {
  margin-top: 8% !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.mb1 {
  margin-bottom: 1% !important;
}

.mb2 {
  margin-bottom: 2% !important;
}

.mb3 {
  margin-bottom: 3% !important;
}

.mb4 {
  margin-bottom: 4% !important;
}

.mb5 {
  margin-bottom: 5% !important;
}

.mb6 {
  margin-bottom: 6% !important;
}

.mb8 {
  margin-bottom: 8% !important;
}

.mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

@media screen and (min-width: 641px) {
  .mt-s {
    margin-top: 10px !important;
  }

  .mt-m {
    margin-top: 20px !important;
  }

  .mt-l {
    margin-top: 40px !important;
  }

  .mt-ll {
    margin-top: 80px !important;
  }
}

@media screen and (max-width: 640px) {
  .mt-s {
    margin-top: 5px !important;
  }

  .mt-m {
    margin-top: 10px !important;
  }

  .mt-l {
    margin-top: 20px !important;
  }

  .mt-ll {
    margin-top: 40px !important;
  }
}

@media screen and (min-width: 641px) {
  .mb-s {
    margin-bottom: 10px !important;
  }

  .mb-m {
    margin-bottom: 20px !important;
  }

  .mb-l {
    margin-bottom: 40px !important;
  }

  .mb-ll {
    margin-bottom: 80px !important;
  }
}

@media screen and (max-width: 640px) {
  .mb-s {
    margin-bottom: 5px !important;
  }

  .mb-m {
    margin-bottom: 10px !important;
  }

  .mb-l {
    margin-bottom: 20px !important;
  }

  .mb-ll {
    margin-bottom: 40px !important;
  }
}

@media screen and (min-width: 641px) {
  .space-s {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }

  .space-m {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }

  .space-l {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }

  .space-ll {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
  }
}

@media screen and (max-width: 640px) {
  .space-s {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }

  .space-m {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }

  .space-l {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }

  .space-ll {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
}

.maxW320 {
  max-width: 320px !important;
  margin-left: auto;
  margin-right: auto;
}

.maxW360 {
  max-width: 360px !important;
  margin-left: auto;
  margin-right: auto;
}

.maxW480 {
  max-width: 480px !important;
  margin-left: auto;
  margin-right: auto;
}

.maxW600 {
  max-width: 600px !important;
  margin-left: auto;
  margin-right: auto;
}

.maxW640 {
  max-width: 640px !important;
  margin-left: auto;
  margin-right: auto;
}

.maxW800 {
  max-width: 800px !important;
  margin-left: auto;
  margin-right: auto;
}

.maxW1000 {
  max-width: 1000px !important;
  margin-left: auto;
  margin-right: auto;
}

.maxW1200 {
  max-width: 1200px !important;
  margin-left: auto;
  margin-right: auto;
}

.maxW1500 {
  max-width: 1500px !important;
  margin-left: auto;
  margin-right: auto;
}

/*--------help end--------*/

/* unknown */
p.small {
  font-size: 0.6em;
}

p.soul {
  margin-top: 10px;
}

p.ltd {
  margin-top: 10px;
}

p.lineupCheck {
  margin-top: 10px;
}

p.rightNotes {
  padding: 0;
  margin-top: 10px;
  font-size: 0.8em;
  font-weight: normal;
}

/* unknown end */
