@charset "UTF-8";
/*---------------------------------------------------------------------
	peculiar mixin style
----------------------------------------------------------------------*/
/*---------------------------------------------------------------------
	fixed mixin style
----------------------------------------------------------------------*/
/*---------------------------------------------------------------------
	1. BEMによる命名規則・階層構造
	2. プロパティの共通化
	3. SASSによる複雑な分岐、関数など禁止
	4. 使用されるmixinは'_mixin.scss'に記述
	5. 共通CSS/SCSSファイルはall.scssに統合
	SASSコンパイル
	[nested/expanded/compact/compressed]
----------------------------------------------------------------------*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  line-height: 1;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

ul, ol, a {
  list-style: none;
  text-decoration: none;
}

/* IE用viewport */
@-ms-viewport {
  width: 640px;
}
@-moz-viewport {
  width: 640px;
}
root, html {
  display: block;
}

body {
  display: block;
  font-family: Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif;
  word-wrap: break-word;
  overflow-wrap: break-word;
  background: #F6FCEE;
  visibility: hidden;
  position: relative;
}

body[data-cid="78"]::before {
  background-image: url(../img/bg_lattice.png);
  background-repeat: repeat;
  background-position: center center;
  background-size: 16px 24px;
  content: "";
  width: 100%;
  height: 200%;
  position: fixed;
  top: -100%;
  left: 0;
  bottom: 0;
  right: 0;
  -webkit-animation: infinitescroll 10s linear infinite;
          animation: infinitescroll 10s linear infinite;
}

@-webkit-keyframes infinitescroll {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 480px, 0);
    transform: translate3d(0, 480px, 0);
  }
}

@keyframes infinitescroll {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 480px, 0);
    transform: translate3d(0, 480px, 0);
  }
}
body[data-cid="78"] #container {
  background: #F6FCEE;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

/* CLEARFIX */
.cf:after {
  content: "";
  clear: both;
  display: block;
}

#container {
  width: 640px;
  text-align: left;
}

/*----------------------------------------------------------------------
    見出し
----------------------------------------------------------------------*/
.heading,
.heading--other {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 72px;
  -webkit-box-shadow: 0px 4px 0px rgba(0, 0, 0, 0.12);
          box-shadow: 0px 4px 0px rgba(0, 0, 0, 0.12);
  background: -webkit-gradient(linear, left top, left bottom, from(#64b622), to(#4c9022));
  background: linear-gradient(to bottom, #64b622 0%, #4c9022 100%);
  position: relative;
  z-index: 1;
}
.heading__ttl,
.heading--other__ttl {
  display: block;
  color: #FFF;
  font-size: 36px;
  font-weight: bold;
  line-height: 1.2;
  text-shadow: -2px -2px 0px rgba(0, 0, 0, 0.25);
  margin: 0 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.heading--other {
  background: -webkit-gradient(linear, left top, left bottom, from(#347ed0), to(#3266a2));
  background: linear-gradient(to bottom, #347ed0 0%, #3266a2 100%);
}

/*  小見出し
------------------------------------------------------*/
.subhead,
.subhead--other,
.subheading,
.subheading--other,
.article__heading,
.article--notice__heading,
.ribbon__subhead {
  color: #242424;
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  display: block;
  padding: 8px;
  margin-bottom: 16px;
  border-radius: 8px;
  border: solid 2px #82BC9E;
  background: #DCF0E6;
  position: relative;
}
.subhead::before,
.subhead--other::before,
.subheading::before,
.subheading--other::before,
.article__heading::before,
.article--notice__heading::before,
.ribbon__subhead::before {
  display: block;
  width: 100%;
  height: 100%;
  content: "";
  border: solid 2px #FFF;
  border-radius: 6px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.subhead--other,
.subheading--other {
  border: solid 2px #D8B274;
  background: #F8F4DC;
}

.article--notice__heading {
  color: #FFF;
  border: solid 2px #B63E22;
  background: #CE4E30;
}

.ribbon__subhead {
  margin: 0 0 16px;
  color: #32190F;
  border: solid 2px #957C4A;
  background: #B7A070;
}
.ribbon__subhead::before {
  border: solid 2px #CBB78D;
}

.subhead,
.subhead--other,
.subheading,
.subheading--other {
  margin: 16px;
}

/*  小見出し 矢印タイプ
------------------------------------------------------*/
.subhead--arrow-grn,
.subhead--arrow-blu,
.subhead--arrow-red,
.subheading--arrow-grn,
.subheading--arrow-blu,
.subheading--arrow-red {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #505050;
  font-size: 28px;
  margin: 16px;
}

.subhead--arrow-grn mark,
.subhead--arrow-blu mark,
.subhead--arrow-red mark,
.subheading--arrow-grn__icon,
.subheading--arrow-blu__icon,
.subheading--arrow-red__icon {
  display: block;
  width: 40px;
  height: 40px;
  margin-right: 6px;
  background: url("../img/Public/pic.png") 0 0 no-repeat;
  background-size: 200% auto;
}

.subhead--arrow-blu mark
.subheading--arrow-blu__icon {
  background: url("../img/Public/pic.png") 0 -40px no-repeat;
  background-size: 200% auto;
}

.subhead--arrow-red mark,
.subheading--arrow-red__icon {
  background: url("../img/Public/pic.png") 0 -80px no-repeat;
  background-size: 200% auto;
}

.subhead__text {
  text-align: justify;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/*----------------------------------------------------------------------
    Article
----------------------------------------------------------------------*/
.article,
.article--notice {
  padding: 16px;
  margin: 16px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 16px;
  border: solid 6px #53AC53;
  -webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
          box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  background: #FFF;
}

.article--notice {
  border: solid 6px #D26642;
}

.article__text,
.article--notice__text {
  display: block;
  color: #404040;
  font-size: 24px;
  text-align: justify;
  line-height: 1.334;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.article .button:last-child,
.article--notice .button:last-child {
  margin-bottom: 0;
}

/*----------------------------------------------------------------------
    Board
----------------------------------------------------------------------*/
.ribbon,
.ribbon--blu,
.ribbon--orn,
.ribbon--vio {
  color: #40301A;
  margin: 16px;
  border-style: solid;
  border-width: 80px 40px 40px;
  -o-border-image: url(../img/Public/ribbon_red.png) 80 40 40 stretch;
     border-image: url(../img/Public/ribbon_red.png) 80 40 40 fill stretch;
  position: relative;
}
.ribbon::before,
.ribbon--blu::before,
.ribbon--orn::before,
.ribbon--vio::before {
  content: attr(title);
  width: 400px;
  height: 40px;
  line-height: 40px;
  color: #FFF;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  text-shadow: -2px -2px 0 rgba(0, 0, 0, 0.25);
  text-overflow: ellipsis;
  position: absolute;
  top: -80px;
  left: 64px;
}
.ribbon .ribbon__body,
.ribbon--blu .ribbon__body,
.ribbon--orn .ribbon__body,
.ribbon--vio .ribbon__body {
  word-wrap: break-word;
  overflow-wrap: break-word;
  min-height: 136px;
}
.ribbon .ribbon__body .ribbon__text,
.ribbon--blu .ribbon__body .ribbon__text,
.ribbon--orn .ribbon__body .ribbon__text,
.ribbon--vio .ribbon__body .ribbon__text {
  color: #32190F;
  font-size: 24px;
  line-height: 32px;
}
.ribbon .ribbon__body .button,
.ribbon--blu .ribbon__body .button,
.ribbon--orn .ribbon__body .button,
.ribbon--vio .ribbon__body .button {
  text-shadow: -2px -2px #40301a;
  border: solid 2px #40301a;
  background: -webkit-gradient(linear, left top, left bottom, from(#594424), to(#40301a));
  background: linear-gradient(to bottom, #594424 0%, #40301a 100%);
}

.ribbon--blu {
  border-image-source: url("../img/Public/ribbon_blu.png");
}

.ribbon--orn {
  border-image-source: url("../img/Public/ribbon_orn.png");
}

.ribbon--vio {
  border-image-source: url("../img/Public/ribbon_vio.png");
}

/*----------------------------------------------------------------------
    Tab & Toggle switch
----------------------------------------------------------------------*/
.tabs,
.tabs--other {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.tabs__btn,
.tabs--other__btn {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.tabs__btn > *,
.tabs--other__btn > * {
  cursor: pointer;
  width: 100%;
  height: 72px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #5e8864;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  line-height: 1.2;
  word-break: break-all;
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  border-bottom: solid 4px #4C9022;
  background: #2a382c;
}
.tabs__btn.is-current > *,
.tabs--other__btn.is-current > * {
  cursor: default;
  color: #FFF;
  text-shadow: -2px -2px 0px rgba(0, 0, 0, 0.25);
  background: -webkit-gradient(linear, left top, left bottom, from(#64b622), to(#4c9022));
  background: linear-gradient(to bottom, #64b622 0%, #4c9022 100%);
}

.tabs--other__btn > * {
  color: #6688a0;
  border-bottom: solid 4px #3266A2;
  background: #2a3644;
}
.tabs--other__btn.is-current > * {
  background: -webkit-gradient(linear, left top, left bottom, from(#347ed0), to(#3266a2));
  background: linear-gradient(to bottom, #347ed0 0%, #3266a2 100%);
}

/* toggle */
.toggle,
.toggle--other {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 16px;
}
.toggle li:first-child,
.toggle--other li:first-child {
  border-top-left-radius: 16px;
  border-bottom-left-radius: 16px;
}
.toggle li:last-child,
.toggle--other li:last-child {
  border-top-right-radius: 16px;
  border-bottom-right-radius: 16px;
}
.toggle__btn,
.toggle--other__btn {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  background: #2a382c;
}
.toggle__btn > *,
.toggle--other__btn > * {
  cursor: pointer;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 72px;
  padding: 0 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: #5e8864;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  line-height: 1.2;
  text-overflow: ellipsis;
  word-break: break-all;
}
.toggle__btn.is-current,
.toggle--other__btn.is-current {
  cursor: default;
  background: -webkit-gradient(linear, left top, left bottom, from(#64b622), to(#4c9022));
  background: linear-gradient(to bottom, #64b622 0%, #4c9022 100%);
}
.toggle__btn.is-current > *,
.toggle--other__btn.is-current > * {
  color: #FFF;
  text-shadow: -2px -2px 0px rgba(0, 0, 0, 0.25);
  cursor: default;
}

.toggle--other__btn {
  background: #2a3644;
}
.toggle--other__btn > * {
  color: #6688a0;
}
.toggle--other__btn.is-current {
  background: -webkit-gradient(linear, left top, left bottom, from(#347ed0), to(#3266a2));
  background: linear-gradient(to bottom, #347ed0 0%, #3266a2 100%);
}

/*----------------------------------------------------------------------
    list
----------------------------------------------------------------------*/
.list-rowlink,
.list-tmblink,
.list-ranking,
.list-circle {
  width: 100%;
}
.subhead + .list-rowlink, .subheading + .list-rowlink, .subhead +
.list-tmblink, .subheading +
.list-tmblink, .subhead +
.list-ranking, .subheading +
.list-ranking, .subhead +
.list-circle, .subheading +
.list-circle {
  margin-top: -16px;
}
.list-rowlink li,
.list-tmblink li,
.list-ranking li,
.list-circle li {
  border-bottom: solid 2px #CECCB8;
}

.list-rowlink__no-data,
.list-tmblink__no-data,
.list-ranking__no-data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 160px;
  color: #404040;
  font-size: 24px;
}

.list-rowlink__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 16px 48px 16px 16px;
}

.list-tmblink__wrap,
.list-ranking__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 16px;
}

.list-circle__wrap {
  padding: 16px 48px 16px 16px;
}

.list-rowlink li:nth-child(4n+1) .list-rowlink__wrap,
.list-circle li:nth-child(4n+1) .list-circle__wrap {
  background: url("../img/Public/arrow.png") 608px center no-repeat, url("../img/Public/bg_list_1.png") 500px center no-repeat;
}

.list-rowlink li:nth-child(4n+2) .list-rowlink__wrap,
.list-circle li:nth-child(4n+2) .list-circle__wrap {
  background: url("../img/Public/arrow.png") 608px center no-repeat, url("../img/Public/bg_list_2.png") 500px center no-repeat;
}

.list-rowlink li:nth-child(4n+3) .list-rowlink__wrap,
.list-circle li:nth-child(4n+3) .list-circle__wrap {
  background: url("../img/Public/arrow.png") 608px center no-repeat, url("../img/Public/bg_list_3.png") 500px center no-repeat;
}

.list-rowlink li:nth-child(4n+4) .list-rowlink__wrap,
.list-circle li:nth-child(4n+4) .list-circle__wrap {
  background: url("../img/Public/arrow.png") 608px center no-repeat, url("../img/Public/bg_list_4.png") 500px center no-repeat;
}

.list-tmblink li:nth-child(4n+1) .list-tmblink__wrap,
.list-ranking li:nth-child(4n+1) .list-ranking__wrap {
  background: url("../img/Public/bg_list_1.png") 500px center no-repeat;
}

.list-tmblink li:nth-child(4n+2) .list-tmblink__wrap,
.list-ranking li:nth-child(4n+2) .list-ranking__wrap {
  background: url("../img/Public/bg_list_2.png") 500px center no-repeat;
}

.list-tmblink li:nth-child(4n+3) .list-tmblink__wrap,
.list-ranking li:nth-child(4n+3) .list-ranking__wrap {
  background: url("../img/Public/bg_list_3.png") 500px center no-repeat;
}

.list-tmblink li:nth-child(4n+4) .list-tmblink__wrap,
.list-ranking li:nth-child(4n+4) .list-ranking__wrap {
  background: url("../img/Public/bg_list_4.png") 500px center no-repeat;
}

.list-rowlink__tmb,
.list-tmblink__tmb,
.list-ranking__tmb {
  display: block;
  width: 128px;
  margin-right: 16px;
}

.list-rowlink__tmb img,
.list-tmblink__tmb img,
.list-ranking__tmb img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
}

.list-rowlink__content,
.list-tmblink__content,
.list-ranking__content {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.list-rowlink__headline,
.list-tmblink__headline,
.list-ranking__headline,
.list-circle__headline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: bold;
}

.list-circle__headline {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.list-circle__headline:before {
  content: "";
  display: block;
  width: 32px;
  height: 32px;
  margin-right: 8px;
  background: url("../img/Public/list-circle.png") 0 0 no-repeat;
}

.list-rowlink__ttl,
.list-tmblink__ttl,
.list-ranking__ttl,
.list-circle__ttl {
  display: block;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  color: #2A6CC2;
  font-size: 28px;
      word-break: break-word;
}

.list-circle__ttl {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.list-rowlink__date,
.list-tmblink__date,
.list-ranking__date {
  display: block;
  width: 144px;
  height: 28px;
  -ms-flex: 0 0 144px;
  color: #FFF;
  font-size: 16px;
  line-height: 28px;
  text-align: center;
  border-radius: 8px;
  background: #64B622;
}

.list-rowlink__body,
.list-tmblink__body,
.list-ranking__body {
  color: #404040;
  font-size: 24px;
  line-height: 1.2;
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-word;
  margin-top: 8px;
}

.list-ranking__tmb {
  position: relative;
}

.list-ranking__tmb__frame {
  white-space: nowrap;
  text-indent: 125%;
  overflow: hidden;
  width: 160px;
  height: 160px;
  position: absolute;
  top: -16px;
  left: -16px;
}

.list-ranking li:nth-child(1) .list-ranking__tmb__frame {
  background: url("../img/Public/ranking_frame.png") 0 0 no-repeat;
}

.list-ranking li:nth-child(2) .list-ranking__tmb__frame {
  background: url("../img/Public/ranking_frame.png") 0 -160px no-repeat;
}

.list-ranking li:nth-child(3) .list-ranking__tmb__frame {
  background: url("../img/Public/ranking_frame.png") 0 -320px no-repeat;
}

.list-ranking li:nth-child(4) .list-ranking__tmb__frame {
  background: url("../img/Public/ranking_frame.png") 0 -480px no-repeat;
}

.list-ranking li:nth-child(n+5) .list-ranking__tmb__frame {
  text-indent: initial;
  width: 44px;
  height: 44px;
  line-height: 44px;
  color: #FFF;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  text-shadow: -2px -2px 0 rgba(0, 0, 0, 0.25);
  border-radius: 50%;
  -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
          box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
  background: #64B622;
  top: -8px;
  left: -8px;
}

.list-circle__desc {
  margin-top: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.list-circle__desc:before {
  content: "";
  display: block;
  width: 32px;
  margin-right: 8px;
  background: url("../img/Public/list-circle.png") 0 -36px no-repeat;
}

.list-circle__desc span {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  color: #404040;
  font-size: 20px;
  line-height: 1.2;
}

.flexbar + .flexbar,
.tablebar + .tablebar,
.flexbar li + li,
.tablebar li + li {
  margin-top: 8px;
}

.flexbar li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.tablebar li {
  display: table;
  width: 100%;
}

.flexbar__ttl,
.tablebar__ttl,
.flexbar__val,
.tablebar__val {
  display: block;
  color: #FFF;
  font-size: 24px;
  font-weight: bold;
  padding: 8px 12px;
  background: #64B622;
}

.tablebar__ttl,
.tablebar__val {
  display: table-cell;
  vertical-align: middle;
}

.flexbar__ttl,
.tablebar__ttl {
  width: 10rem;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

.tablebar__ttl {
  width: 30%;
}

.flexbar__val,
.tablebar__val {
  color: #333;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  background: #F5F5F5;
}

.tablebar__val {
  width: 70%;
  -webkit-box-flex: 0;
  -ms-flex: none;
  flex: none;
}

.rowbar-flex, .rowbar-table {
  background: #F5F5F5;
  border-radius: 8px;
  overflow: hidden;
  width: 100%;
}

.rowbar-flex + .rowbar-flex, .rowbar-table + .rowbar-table {
  margin-top: 8px;
}

.rowbar-flex dt, .rowbar-table dt {
  background: #64B622;
  color: #FFF;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.2;
  padding: 8px 12px;
  width: 10rem;
}

.rowbar-flex dd, .rowbar-table dd {
  color: #333;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.2;
  padding: 8px 12px;
}

.rowbar-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}

.rowbar-flex dt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.rowbar-flex dd {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.rowbar-table {
  display: table;
}

.rowbar-table > * {
  display: table-cell;
  vertical-align: middle;
}

/*----------------------------------------------------------------------
    button
----------------------------------------------------------------------*/
.button,
.button--plain,
.button--inactive,
.list-tmblink__button,
.list-ranking__button {
  display: block;
  color: #FFF;
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  text-shadow: -2px -2px #F47416;
  display: block;
  width: 480px;
  margin: 16px auto;
  padding: 16px;
  border-radius: 16px;
  border: solid 2px #F47416;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: -webkit-gradient(linear, left top, left bottom, from(#f49418), to(#f47416));
  background: linear-gradient(to bottom, #f49418 0%, #f47416 100%);
  cursor: pointer;
  position: relative;
}
.button::before,
.button--plain::before,
.button--inactive::before,
.list-tmblink__button::before,
.list-ranking__button::before {
  display: block;
  width: 100%;
  height: 100%;
  content: "";
  border: solid 2px rgba(255, 255, 255, 0.5);
  border-radius: 14px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.button--plain,
.button--inactive,
.list-tmblink__button,
.list-ranking__button {
  color: #565656;
  text-shadow: 2px 2px #FFF;
  border: solid 2px #888888;
  background: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#dadada));
  background: linear-gradient(to bottom, #f0f0f0 0%, #dadada 100%);
}

.button--inactive {
  cursor: default;
  color: #ACACAC;
}

.button--red {
  text-shadow: -2px -2px #ae0404;
  border: solid 2px #ae0404;
  background: -webkit-gradient(linear, left top, left bottom, from(#ff3333), to(#ae0404));
  background: linear-gradient(to bottom, #ff3333 0%, #ae0404 100%);
}

/*  もっと見る
------------------------------------------------------*/
.read-more {
  display: block;
  color: #2A6CC2;
  font-size: 24px;
  font-weight: bold;
  text-align: right;
  text-indent: 16px;
  padding: 1em 2em 1em 1em;
  border-top: solid 2px #CECCB8;
  border-bottom: solid 2px #CECCB8;
  background: url("../img/Public/arrow.png") 608px 50% no-repeat;
}

.read-more + .read-more,
.list-rowlink + .read-more,
.list-tmblink + .read-more,
.list-ranking + .read-more,
.list-circle + .read-more {
  border-top: none;
}

/*----------------------------------------------------------------------
    ページネーション
----------------------------------------------------------------------*/
.pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 16px auto;
}

.pagination__prev,
.pagination__next {
  display: block;
  width: 100px;
  color: #2A6CC2;
  font-size: 24px;
  font-weight: bold;
  line-height: 64px;
  vertical-align: middle;
}

.pagination__prev {
  text-align: right;
  padding-right: 28px;
  background: url("../img/Public/arrow_pagination.png") 8px -128px no-repeat;
}

.pagination__next {
  text-align: left;
  padding-left: 28px;
  background: url("../img/Public/arrow_pagination.png") 92px -192px no-repeat;
}

.pagination__prev--inactive {
  color: #A2A2A2;
  background: url("../img/Public/arrow_pagination.png") 8px 0 no-repeat;
}

.pagination__next--inactive {
  color: #A2A2A2;
  background: url("../img/Public/arrow_pagination.png") 92px -64px no-repeat;
}

.pagination__indicator {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.indicator__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 72px;
  height: 64px;
  font-weight: bold;
}
.indicator__item span {
  display: block;
  width: 100%;
  color: #2A6CC2;
  font-size: 24px;
  text-align: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-left: solid 1px #CECCB8;
  border-right: solid 1px #CECCB8;
}

.pagination__indicator .is-current span {
  color: #A2A2A2;
}

.pagination__indicator .indicator__item:first-child span {
  border-left: none;
}

.pagination__indicator .indicator__item:last-child span {
  border-right: none;
}

/*  type select
------------------------------------------------------*/
.pagination .forms__select {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/*  type location
------------------------------------------------------*/
.pagination__location {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  color: #404040;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

/*----------------------------------------------------------------------
    form style
----------------------------------------------------------------------*/
.forms .label-wrap,
.forms .forms__label {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
}

.label-wrap input[type="radio"],
.label-wrap input[type="checkbox"],
.forms__label input[type="radio"],
.forms__label input[type="checkbox"] {
  margin: 0;
  position: absolute;
  visibility: hidden;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.label-wrap__text,
.forms__radio-name,
.forms__check-name {
  color: #A2A2A2;
  font-size: 28px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: normal;
  vertical-align: middle;
  padding: 0;
}

.label-wrap__radio,
.label-wrap__check,
.forms__radio-mark,
.forms__check-mark {
  display: block;
  width: 40px;
  height: 40px;
  margin-right: 6px;
  white-space: nowrap;
  text-indent: 125%;
  overflow: hidden;
  background: url("../img/Public/pic.png") 0 -120px no-repeat;
  background-size: 200% auto;
}

.label-wrap__check,
.forms__check-mark {
  background: url("../img/Public/pic.png") 0 -160px no-repeat;
  background-size: 200 auto;
}

:checked + .label-wrap__radio,
:checked + .forms__radio-mark {
  background: url("../img/Public/pic.png") -40px -120px no-repeat;
  background-size: 200 auto;
}

:checked + .label-wrap__check,
:checked + .forms__check-mark {
  background: url("../img/Public/pic.png") -40px -160px no-repeat;
  background-size: 200 auto;
}

/* select */
.forms__select {
  height: 48px;
  padding-right: 36px;
  border: solid 2px #A2A2A2;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: url("../img/Public/select.png") no-repeat 100% 50%, #FFF;
}

.forms__select select {
  cursor: pointer;
  color: #484848;
  font-size: 24px;
  font-weight: bold;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  padding-left: 8px;
  -webkit-box-shadow: none;
          box-shadow: none;
  border: none;
  background: none;
}

/* OLD STYLE */
.forms__text,
.forms__datetime,
.forms__textarea {
  display: block;
  color: #404040;
  font-size: 24px;
  font-family: Arial;
  font-weight: bold;
  width: 100%;
  padding: 8px;
  border: solid 2px #A2A2A2;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: #FFF;
}

.forms__datetime {
  padding: 4px 8px;
}

/* NEW STYLE */
.forms__group label {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #404040;
  font-size: 24px;
  margin-bottom: 8px;
}

.forms__group label .reqd {
  color: #FFF;
  font-size: 16px;
  padding: 4px 8px;
  margin-left: 8px;
  border-radius: 4px;
  background: red;
}

.forms__group input[type="text"],
.forms__group input[type="tel"],
.forms__group input[type="number"],
.forms__group input[type="email"],
.forms__group input[type="datetime"],
.forms__group input[type="datetime-local"],
.forms__group input[type="date"],
.forms__group input[type="month"],
.forms__group input[type="week"],
.forms__group input[type="time"],
.forms__group textarea {
  display: block;
  color: #404040;
  font-size: 24px;
  font-family: Arial;
  font-weight: bold;
  width: 100%;
  padding: 8px;
  border: solid 2px #A2A2A2;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: #FFF;
}

.forms__group input[type="text"] + input,
.forms__group input[type="text"] + textarea,
.forms__group input[type="tel"] + input,
.forms__group input[type="tel"] + textarea,
.forms__group input[type="email"] + input,
.forms__group input[type="email"] + textarea,
.forms__group input[type="number"] + input,
.forms__group input[type="number"] + textarea,
.forms__group input[type="datetime"] + input,
.forms__group input[type="datetime"] + textarea,
.forms__group input[type="datetime-local"] + input,
.forms__group input[type="datetime-local"] + textarea,
.forms__group input[type="date"] + input,
.forms__group input[type="date"] + textarea,
.forms__group input[type="month"] + input,
.forms__group input[type="month"] + textarea,
.forms__group input[type="week"] + input,
.forms__group input[type="week"] + textarea,
.forms__group input[type="time"] + input,
.forms__group input[type="time"] + textarea,
.forms__group textarea + input,
.forms__group textarea + textarea {
  margin-top: 8px;
}

.forms__group input[type="datetime-local"] {
  padding: 4px 8px;
}

.forms__group + .forms__group {
  margin-top: 32px;
}

/*---------------------------------------------------------------------
    #navi
----------------------------------------------------------------------*/
/* ナビゲーション固定 */
.fixed {
  position: fixed;
  bottom: 0px;
  left: 0px;
  margin: 0;
  z-index: 10;
}

.navi {
  width: 640px;
  padding: 10px;
  /* margin-top: 16px; */
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: rgba(0, 0, 0, 0.9);
}

.navi__rowline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.navi__icon {
  display: block;
  width: 100px;
  height: 100px;
  position: relative;
  background: url("../img/ui_footericon.png") 0 0 no-repeat;
  background-size: 800px 800px;
}

.navi__icon--play {background-position: 0 0;}
.navi__icon--play:hover {background-position: -100px 0;}
.navi__icon--return {background-position: -200px 0;}
.navi__icon--return:hover {background-position: -300px 0;}
.navi__icon--mypage {background-position: -400px 0;}
.navi__icon--mypage:hover {background-position: -500px 0;}
.navi__icon--howto {background-position: -600px 0;}
.navi__icon--howto:hover {background-position: -700px 0;}
.navi__icon--event {background-position: 0 -100px;}
.navi__icon--event:hover {background-position: -100px -100px;}
.navi__icon--gacha {background-position: -200px -100px;}
.navi__icon--gacha:hover {background-position: -300px -100px;}
.navi__icon--mychara {background-position: -400px -100px;}
.navi__icon--mychara:hover {background-position: -500px -100px;}
.navi__icon--shop {background-position: -600px -100px;}
.navi__icon--shop:hover {background-position: -700px -100px;}
.navi__icon--present {background-position: 0 -200px;}
.navi__icon--present:hover {background-position: -100px -200px;}
.navi__icon--history {background-position: -200px -200px;}
.navi__icon--history:hover {background-position: -300px -200px;}
.navi__icon--mail {background-position: -400px -200px;}
.navi__icon--mail:hover {background-position: -500px -200px;}
.navi__icon--friend {background-position: -600px -200px;}
.navi__icon--friend:hover {background-position: -700px -200px;}
.navi__icon--record {background-position: 0 -300px;}
.navi__icon--record:hover {background-position: -100px -300px;}
.navi__icon--shougou {background-position: -200px -300px;}
.navi__icon--shougou:hover {background-position: -300px -300px;}
.navi__icon--other {background-position: -400px -300px;}
.navi__icon--other:hover {background-position: -500px -300px;}
.navi__icon--circle {background-position: -600px -300px;}
.navi__icon--circle:hover {background-position: -700px -300px;}
.navi__icon--diary {background-position: 0 -400px;}
.navi__icon--diary:hover {background-position: -100px -400px;}
.navi__icon--bbs {background-position: -200px -400px;}
.navi__icon--bbs:hover {background-position: -300px -400px;}
/* Toggle Action */
.navi__icon--switch {
  position: relative;
  background-position: -400px -400px;
}
.navi__icon--switch::after {
  border-style: solid;
  border-width: 0 25px 25px 25px;
  border-color: transparent transparent #b7ff6f transparent;

  content: "";
  width: 0;
  height: 0;
  margin: -17.5px 0 0 -25px;

  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transition: transform .5s;
  transition: transform .5s;
  -webkit-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}
.navi__icon--switch:hover {background-position: -500px -400px;}
.navi__icon--switch:hover::after {
  border-color: transparent transparent #96cf76 transparent;
}
.navi__icon--switch.opened::after {
  -webkit-transform: translate3d(0, 10px, 0) rotate(180deg);
  transform: translate3d(0, 10px, 0) rotate(180deg);
}


.navi__icon--pro {background-position: -600px -400px;}
.navi__icon--pro:hover {background-position: -700px -400px;}

/* バッジ表示 */
.navi__icon .badge,
.badge--digit-1 {
  display: block;
  color: #FFF;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  line-height: 32px;
  width: 32px;
  height: 32px;
  border-radius: 16px;
  background: #F41C1C;
  position: absolute;
  top: -8px;
  right: -8px;
  z-index: 10;
}

.navi__icon .badge--digit-2 {
  width: 40px;
}

.navi__icon .badge--digit-3 {
  width: 48px;
}

/* ダミーナビゲーション */
.navi--dummy {
  visibility: hidden;
}

/*---------------------------------------------------------------------
    PC/DMM版ヘッダー(back/reload)
/*---------------------------------------------------------------------*/
.pc-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 640px;
  padding: 16px;
  border-bottom: solid 2px #9A9A9A;
  background: -webkit-gradient(linear, left top, left bottom, from(#eaeaea), to(#cccccc));
  background: linear-gradient(to bottom, #eaeaea 0%, #cccccc 100%);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
}

.pc-header__back,
.pc-header__back--inactive,
.pc-header__reload {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 72px;
  height: 40px;
  color: #FFF;
  font-size: 24px;
  font-weight: bold;
  border-radius: 8px;
  background: #1268F6;
}

.pc-header__back--inactive {
  color: #C4C4C4;
  background: #747474;
}

.pc-header span {
  color: #666;
  font-size: 24px;
  font-weight: bold;
  text-shadow: 2px 2px #f2f2f2;
}

.pc-header--dummy {
  visibility: hidden;
  height: 74px;
}

.trig-bounce,
.trig-bounce--top, .trig-bounce--top-right, .trig-bounce--top-left,
.trig-bounce--right,
.trig-bounce--bottom, .trig-bounce--bottom-right, .trig-bounce--bottom-left,
.trig-bounce--left {
  -webkit-transform: scale(0.94);
          transform: scale(0.94);
}

.trig-bounce--top {
  -webkit-transform-origin: center top;
          transform-origin: center top;
}

.trig-bounce--top-right {
  -webkit-transform-origin: right center;
          transform-origin: right center;
}

.trig-bounce--top-left {
  -webkit-transform-origin: left top;
          transform-origin: left top;
}

.trig-bounce--right {
  -webkit-transform-origin: right center;
          transform-origin: right center;
}

.trig-bounce--bottom {
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
}

.trig-bounce--bottom-right {
  -webkit-transform-origin: right bottom;
          transform-origin: right bottom;
}

.trig-bounce--bottom-left {
  -webkit-transform-origin: left bottom;
          transform-origin: left bottom;
}

.trig-bounce--left {
  -webkit-transform-origin: left center;
          transform-origin: left center;
}

.bounce-circle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 4em;
  height: 4em;
  margin-left: -.5em;
  margin-top: -.5em;
  border-radius: 2em;
  color: #FFF;
  font-size: 20px;
  text-align: center;
  line-height: 1;
  background: rgba(255, 0, 0, 0.85);
  position: absolute;
  z-index: 10;
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
  -webkit-animation-name: rubberBand;
          animation-name: rubberBand;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

.bounce-circle strong {
  color: #fe0;
  font-size: 1.1em;
  font-weight: bold;
  margin: 2px 0;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, rgba(0, 0, 0, 0)), color-stop(60%, #cc0000));
  background: linear-gradient(rgba(0, 0, 0, 0) 60%, #cc0000 60%);
}

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  15% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }
  20% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }
  25% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }
  32.5% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
            transform: scale3d(0.95, 1.05, 1);
  }
  37.5% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
            transform: scale3d(1.05, 0.95, 1);
  }
  50% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  15% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }
  20% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }
  25% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }
  32.5% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
            transform: scale3d(0.95, 1.05, 1);
  }
  37.5% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
            transform: scale3d(1.05, 0.95, 1);
  }
  50% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

body[data-cid="72"] a:focus,
body[data-cid="72"] a:focus img,
body[data-cid="72"] button:focus,
body[data-cid="72"] input:focus,
body[data-cid="72"] textarea:focus,
body[data-cid="72"] select:focus {
  outline: solid 4px #1994e6;
  outline-offset: -4px;
}

.ad-ow {
	background-color: #fff;
	padding: 10px;
}
.ad-ow a {
	display: block;
	overflow: hidden;
	position: relative
}
.ad-ow img {
	width: 100%;
	height: auto;
}
.ad-ow a::after {
	background-image: url(../../img/reflect.png);
	background-size: 100% auto;
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	-webkit-animation: skid 4s ease-in-out infinite;
			animation: skid 4s ease-in-out infinite;
}
  
@-webkit-keyframes skid {
	0% { -webkit-transform: scale(1.1) translateX(-150%); transform: scale(1.1) translateX(-150%); }
	87% { -webkit-transform: scale(1.1) translateX(-150%); transform: scale(1.1) translateX(-150%); }
	100% { -webkit-transform: scale(1.1) translateX(150%); transform: scale(1.1) translateX(150%); }
}

@keyframes skid {
	0% { -webkit-transform: scale(1.1) translateX(-150%); transform: scale(1.1) translateX(-150%); }
	87% { -webkit-transform: scale(1.1) translateX(-150%); transform: scale(1.1) translateX(-150%); }
	100% { -webkit-transform: scale(1.1) translateX(150%); transform: scale(1.1) translateX(150%); }
}

/*# sourceMappingURL=all.css.map */