@charset "UTF-8";
/* =================================================
  WebFonts
================================================= */
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 400;
  src: url("/fonts/NotoSansCJKjp-Regular");
  src: url("/fonts/NotoSansCJKjp-Regular.eot?#iefix") format("embedded-opentype"), url("/fonts/NotoSansCJKjp-Regular.woff") format("woff"), url("/fonts/NotoSansCJKjp-Regular.ttf") format("truetype");
}
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 700;
  src: url("/fonts/NotoSansCJKjp-Bold.eot");
  src: url("/fonts/NotoSansCJKjp-Bold.eot?#iefix") format("embedded-opentype"), url("/fonts/NotoSansCJKjp-Bold.woff") format("woff"), url("/fonts/NotoSansCJKjp-Bold.ttf") format("truetype");
}
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 900;
  src: url("/fonts/NotoSansCJKjp-Black.eot");
  src: url("/fonts/NotoSansCJKjp-Black.eot?#iefix") format("embedded-opentype"), url("/fonts/NotoSansCJKjp-Black.woff") format("woff"), url("/fonts/NotoSansCJKjp-Black.ttf") format("truetype");
}
/* =================================================
  iconFonts
================================================= */
@font-face {
  font-family: 'customicon';
  src: url("/fonts/customicon.eot?71458570");
  src: url("/fonts/customicon.eot?71458570#iefix") format("embedded-opentype"), url("/fonts/customicon.woff2?71458570") format("woff2"), url("/fonts/customicon.woff?71458570") format("woff"), url("/fonts/customicon.ttf?71458570") format("truetype"), url("/fonts/customicon.svg?71458570#customicon") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"]:before, [class*=" icon-"]:before, [class*=" fa-"]:before {
  font-family: "customicon";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  margin-left: .2em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class*=" fa-"]:before {
  margin: 0;
  width: auto;
}

.icon-print:before {
  content: '\e801';
}

.icon-present:before {
  content: '\e806';
}

.icon-mailmag:before {
  content: '\e807';
}

.icon-calendar:before {
  content: '\e808';
}

.icon-calendar-1:before {
  content: '\f073';
}

.icon-music:before {
  content: '\e80c';
}

.icon-ok-circled:before {
  content: '\e813';
}

.icon-heart:before {
  content: '\e814';
}

.icon-beginner:before {
  content: '\e91c';
}

.icon-search:before {
  content: '\f002';
}

.icon-program:before {
  content: '\f00a';
}

.icon-cancel:before {
  content: '\f00d';
}

.icon-zoom-in:before {
  content: '\f00e';
}

.icon-cw:before {
  content: '\f01e';
}

.icon-link:before {
  content: '\f0c1';
}

.icon-lock:before {
  content: '\f023';
}

.icon-cam:before {
  content: '\f03d';
}

.icon-edit:before {
  content: '\f044';
}

.icon-block:before {
  content: '\f05e';
}

.icon-attention-circled:before {
  content: '\f06a';
}

.icon-gift:before {
  content: '\f06b';
}

.icon-thumbs-up:before {
  content: '\f087';
}

.icon-logout:before {
  content: '\f08b';
}

.icon-phone-squared:before {
  content: '\f098';
}

.icon-rss:before {
  content: '\f09e';
}

.icon-megaphone:before {
  content: '\f0a1';
}

.icon-menu:before {
  content: '\f0c9';
}

.icon-mail-alt:before {
  content: '\f0e0';
}

.icon-angle-left:before, .fa-angle-left:before {
  content: '\f104';
}

.icon-angle-right:before, .fa-angle-right:before {
  content: '\f105';
}

.icon-angle-up:before, .fa-angle-up:before {
  content: '\f106';
}

.icon-angle-down:before, .fa-angle-down:before {
  content: '\f107';
}

.icon-desktop:before {
  content: '\f108';
}

.icon-new:before {
  content: '\f121';
}

.icon-attention-alt:before {
  content: '\f12a';
}

.icon-rocket:before {
  content: '\f135';
}

.icon-facebook:before {
  content: '\f1c4';
}

.icon-twitter:before {
  content: '\f1e4';
}

.icon-star:before {
  content: '\f1ee';
}

.icon-television:before {
  content: '\f26c';
}

.icon-shop:before {
  content: '\f290';
}

.icon-window-restore:before {
  content: '\f2d2';
}

.icon-ok-squared:before {
  content: '\f14a';
}

.icon-check-empty:before {
  content: '\f096';
}

.icon-cog:before {
  content: '\e800';
}

/* =================================================
  Clearfix
================================================= */
.c,
.clearfix {
  zoom: 1;
}
.c:before, .c:after,
.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}
.c:after,
.clearfix:after {
  clear: both;
}

/* =================================================
  Fonts
================================================= */
.wrapper_pages,
button,
input,
select,
textarea,
.remodal {
  font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴPro", "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, sans-serif;
  line-height: 1.5;
  font-size: 14px;
  font-size: 1.4rem;
  color: #333;
}

@media all and (-ms-high-contrast: none) {
  .wrapper_pages,
  button,
  input,
  select,
  textarea,
  .remodal {
    font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴPro", "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, sans-serif;
  }
}
/* =================================================
  Hyperlink
================================================= */
a, a:link {
  color: #396eb7;
  outline: none;
  text-decoration: none;
}

a:visited {
  color: #396eb7;
  text-decoration: none;
}

a:hover {
  color: #cb0000;
  text-decoration: none;
}

/* =================================================
  Containers
================================================= */
html,
body,
.canvas {
  width: 100%;
  height: 100%;
}

html body .wrapper_pages {
  max-width: 100%;
  margin: 0 auto;
}

/* =================================================
  Helper classes
================================================= */
/* -----------------------
  text-align
------------------------------------------------- */
.ac {
  text-align: center !important;
}

.ac img {
  float: none;
  padding: 0;
  display: inline;
}

.ar {
  text-align: right !important;
}

.al {
  text-align: left !important;
}

/* -----------------------
  float
------------------------------------------------- */
.fr {
  float: right;
}

.fl {
  float: left;
}

/* -----------------------
  margin
------------------------------------------------- */
.mt00 {
  margin-top: 0px !important;
}

.mt05 {
  margin-top: 5px !important;
}

.mt10 {
  margin-top: 10px !important;
}

.mt15 {
  margin-top: 15px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mt25 {
  margin-top: 25px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mt35 {
  margin-top: 35px !important;
}

.mt40 {
  margin-top: 40px !important;
}

.mr00 {
  margin-right: 0px !important;
}

.mr05 {
  margin-right: 5px !important;
}

.mr10 {
  margin-right: 10px !important;
}

.mr15 {
  margin-right: 15px !important;
}

.mr20 {
  margin-right: 20px !important;
}

.mr25 {
  margin-right: 25px !important;
}

.mr30 {
  margin-right: 30px !important;
}

.mr35 {
  margin-right: 35px !important;
}

.mr40 {
  margin-right: 40px !important;
}

.mb00 {
  margin-bottom: 0px !important;
}

.mb05 {
  margin-bottom: 5px !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb25 {
  margin-bottom: 25px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb35 {
  margin-bottom: 35px !important;
}

.mb40 {
  margin-bottom: 40px !important;
}

.ml00 {
  margin-left: 0px !important;
}

.ml05 {
  margin-left: 5px !important;
}

.ml10 {
  margin-left: 10px !important;
}

.ml15 {
  margin-left: 15px !important;
}

.ml20 {
  margin-left: 20px !important;
}

.ml25 {
  margin-left: 25px !important;
}

.ml30 {
  margin-left: 30px !important;
}

.ml35 {
  margin-left: 35px !important;
}

.ml40 {
  margin-left: 40px !important;
}

.mc {
  margin: 0 auto;
}

/* -----------------------
  padding
------------------------------------------------- */
.pt00 {
  padding-top: 0px !important;
}

.pt05 {
  padding-top: 5px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pt15 {
  padding-top: 15px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.pt25 {
  padding-top: 25px !important;
}

.pt30 {
  padding-top: 30px !important;
}

.pt35 {
  padding-top: 35px !important;
}

.pt40 {
  padding-top: 40px !important;
}

.pr00 {
  padding-right: 0px !important;
}

.pr05 {
  padding-right: 5px !important;
}

.pr10 {
  padding-right: 10px !important;
}

.pr15 {
  padding-right: 15px !important;
}

.pr20 {
  padding-right: 20px !important;
}

.pr25 {
  padding-right: 25px !important;
}

.pr30 {
  padding-right: 30px !important;
}

.pr35 {
  padding-right: 35px !important;
}

.pr40 {
  padding-right: 40px !important;
}

.pb00 {
  padding-bottom: 0px !important;
}

.pb05 {
  padding-bottom: 5px !important;
}

.pb10 {
  padding-bottom: 10px !important;
}

.pb15 {
  padding-bottom: 15px !important;
}

.pb20 {
  padding-bottom: 20px !important;
}

.pb25 {
  padding-bottom: 25px !important;
}

.pb30 {
  padding-bottom: 30px !important;
}

.pb35 {
  padding-bottom: 35px !important;
}

.pb40 {
  padding-bottom: 40px !important;
}

.pl00 {
  padding-left: 0px !important;
}

.pl05 {
  padding-left: 5px !important;
}

.pl10 {
  padding-left: 10px !important;
}

.pl15 {
  padding-left: 15px !important;
}

.pl20 {
  padding-left: 20px !important;
}

.pl25 {
  padding-left: 25px !important;
}

.pl30 {
  padding-left: 30px !important;
}

.pl35 {
  padding-left: 35px !important;
}

.pl40 {
  padding-left: 40px !important;
}

.pd05 {
  padding: 5px !important;
}

.pd10 {
  padding: 0 10px !important;
}

/* -----------------------
  width
------------------------------------------------- */
.w01em {
  width: 1em !important;
}

.w02em {
  width: 2em !important;
}

.w03em {
  width: 3em !important;
}

.w05em {
  width: 5em !important;
}

.w10em {
  width: 10em !important;
}

.w12em {
  width: 12em !important;
}

.w15em {
  width: 15em !important;
}

.w17em {
  width: 15.5em !important;
}

.w20em {
  width: 20em !important;
}

.w30em {
  width: 30em !important;
}

.w40em {
  width: 40em !important;
}

.w10 {
  width: 10% !important;
}

.w20 {
  width: 18% !important;
}

.w40 {
  width: 40% !important;
}

.w90 {
  width: 90% !important;
}

.h07em {
  height: 7em !important;
}

.h20em {
  height: 20em !important;
}

.full {
  width: 100% !important;
}

.half {
  width: 49% !important;
}

.wide {
  width: 65% !important;
}

.narrow {
  width: 32% !important;
  min-width: 310px;
}

/* -----------------------
  font-size
------------------------------------------------- */
.fsS {
  font-size: 12px;
  font-size: 1.2rem;
}

/* -----------------------
  parts
------------------------------------------------- */
.red {
  color: #cb0000;
}

.emp {
  color: #cb0000;
  font-size: 18px;
  font-size: 1.8rem;
}

.sp {
  display: none;
}

.pc {
  display: block;
}

/* =================================================
  Container Layout
================================================= */
html body {
  background: #f5f5f5 url(/images/common/bg.jpg) center top repeat-x;
  padding-top: 80px;
  min-width: 1100px;
}

#contents {
  display: table;
  table-layout: fixed;
  margin: 20px auto;
  width: 1100px;
}

#main_contents, #sub_contents {
  display: table-cell;
  vertical-align: top;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

#sub_contents {
  padding-left: 30px;
  width: 280px;
}

/* =================================================
  block
================================================= */
.block {
  background-color: #fff;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: 0 1px 0 1px #dcdcdc;
  -webkit-box-shadow: 0 1px 0 1px #dcdcdc;
  box-shadow: 0 1px 0 1px #dcdcdc;
  margin: 0 0 10px;
  padding: 15px;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

/* =================================================
  parts
================================================= */
@media only screen and (min-width: 768px) {
  a, button {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }
}
a.blank:not(.btn):after {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\f2d2';
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: lighter;
  margin-left: 5px;
}

p {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
p + p {
  margin-top: 1em;
}

em {
  font-weight: bold;
}

.float_block .fl, .float_block .fr {
  margin: 0;
}

#contents ul {
  list-style-type: none;
}
#contents ul.inline li {
  display: inline-block;
}
#contents ul.inline li + li {
  margin: 0 0 0 10px !important;
}
#contents ul.att li {
  padding-left: 15px;
  text-indent: -20px;
}
#contents ul.pure {
  margin: 0 0 1em 5px;
}
#contents ul.pure li {
  padding-left: 15px;
  text-indent: -20px;
}
#contents ul.pure li:before {
  content: '■';
  color: #d6d6d6;
  font-size: 10px;
  font-size: 1rem;
  margin-right: 10px;
}
#contents ol {
  list-style-type: none;
}
#contents ol.pure {
  list-style-type: decimal;
  margin: 0 0 1em 20px;
}
#contents li + li {
  margin-top: 5px;
}

/* 画像の縮小調整 */
img {
  -ms-interpolation-mode: bicubic;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  vertical-align: middle;
  max-width: 100%;
}

/* icon */
.icon {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background-color: #999;
  color: #fff;
  display: inline-block;
  font-size: 10px;
  font-size: 1rem;
  padding: 4px 3px;
  text-align: center;
  width: 70px;
}
.icon span:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-right: 5px;
}
.icon.first {
  background-color: #cb0000;
}
.icon.first span:before {
  content: '\f135';
}
.icon.ftv {
  background-color: #885bb2;
}
.icon.ftv span:before {
  content: '\f26c';
}
.icon.fatx {
  background-color: #f67324;
}
.icon.fatx span:before {
  content: '\f12a';
}
.icon.recommend {
  background-color: #ee51a2;
}
.icon.recommend span:before {
  content: '\f087';
}
.icon.broadcast {
  background-color: #31904f;
}
.icon.broadcast span:before {
  content: '\f03d';
}
.icon.repeat {
  background-color: #0d7bad;
}
.icon.repeat span:before {
  content: '\f01e';
}
.icon.limit {
  background-color: #fee2e2;
  color: #cb0000;
  width: 90px;
}
.icon.limit span:before {
  content: '\f06a';
}
.icon.pri {
  background-color: #cb0000;
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: bold;
  padding: 4px 10px;
  width: auto;
}

/* Emphasis*/
.emphasis {
  background-color: #eee;
  font-weight: bold;
  padding: 20px 10px;
}

/* empty */
.boxBlock .notice {
  margin: 40px 0;
  text-align: center;
}

/* =================================================
  btn
================================================= */
.btn {
  background-color: #cb0000;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: none;
  color: #fff !important;
  display: inline-block;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.3;
  margin: 5px 0;
  text-align: center;
  text-decoration: none;
  padding: 10px 20px;
  position: relative;
}
.btn:hover {
  background-color: #e50000;
}
.btn:before, .btn:after, .btn span:before, .btn span:after {
  font-weight: lighter;
}
.btn span:after {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  display: inline-block;
  font-size: 20px;
  font-size: 2rem;
  font-weight: lighter;
  margin-left: 8px;
}
.btn.back span:after {
  display: none;
}
.btn.back span:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  display: inline-block;
  font-size: 20px;
  font-size: 2rem;
  font-weight: lighter;
  margin-right: 8px;
}
.btn.blank {
  padding: 16px 20px 12px;
}
.btn.blank span:after {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\f2d2';
  font-size: 12px;
  font-size: 1.2rem;
  margin-left: 8px;
}

.btn02 {
  background-color: #ff7700;
}
.btn02:hover {
  background-color: #ff9233;
}

.btn03 {
  background-color: #9a9a9a;
}
.btn03:hover {
  background-color: #b4b4b4;
}

.btnL {
  padding: 20px;
  width: 250px;
}

.btnLL {
  font-size: 20px;
  font-size: 2rem;
  padding: 20px 30px;
}

.disable {
  background-color: #dedede;
  cursor: default;
}
.disable:hover {
  background-color: #dedede;
}

.btn_emp {
  background-color: #fff1bf;
  margin: 10px 0 0;
  padding: 20px 10px;
}

.buttons {
  margin: 10px 0;
  text-align: center;
}
.buttons ul li {
  display: inline-block;
}
.buttons ul li + li {
  margin-left: 20px;
}

.rss {
  background-color: #a2a2a2;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  color: #fff !important;
  display: inline-block;
  font-size: 10px;
  font-size: 1rem;
  padding: 2px 15px;
}
.rss:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\f09e';
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: lighter;
  margin-right: 5px;
}

/* 矢印付きリンク */
.arrow_r:before, .arrow_r:after, .arrow_l:before, .arrow_l:after {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: lighter;
}

.arrow_r:after {
  content: "";
  margin-left: 5px;
}

.arrow_l:before {
  content: "";
  margin-right: 5px;
}

/* =================================================
  form
================================================= */
input, select, textarea {
  background-color: #fff;
  border: 1px solid #999;
  max-width: 100%;
  padding: 5px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.error {
  background-color: #ffe5e5;
  color: #cb0000;
  margin-top: 10px;
  padding: 10px;
}

.formstyle {
  /* 姓名 */
  /* 生年月日 */
}
.formstyle ul li + li {
  margin-top: 15px !important;
}
.formstyle textarea {
  width: 100%;
}
.formstyle .optionBox {
  margin: 10px 0 0 30px;
}
.formstyle .check {
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  margin: 30px 0 10px;
  text-align: center;
}
.formstyle .check.error {
  margin-top: 0px;
}
.formstyle .buttons .btn {
  padding: 20px 10px;
  width: 250px;
}
.formstyle input[type="checkbox"], .formstyle input[type="radio"] {
  background: none;
  border: none;
  border-radius: 0;
  margin: 0;
  padding: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
}
.formstyle label {
  cursor: pointer;
  display: inline-block;
  position: relative;
  word-break: break-all;
  /* checkbox, radio */
  /* checkbox */
  /* radio */
}
.formstyle label span {
  display: inline-block;
}
.formstyle label input[type="checkbox"], .formstyle label input[type="radio"] {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}
.formstyle label input[type="checkbox"] + span, .formstyle label input[type="radio"] + span {
  margin-top: -2px;
  padding: 0 15px 0 28px;
  position: relative;
}
.formstyle label input[type="checkbox"] + span:before, .formstyle label input[type="checkbox"] + span:after {
  box-sizing: border-box;
  content: '';
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
}
.formstyle label input[type="checkbox"] + span:before {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background-color: transparent;
  border: 2px solid #a7a7a7;
  height: 20px;
  width: 20px;
  z-index: 0;
}
.formstyle label input[type="checkbox"] + span:after {
  height: 8px;
  margin: 5px 7px;
  width: 5px;
  z-index: 1;
}
.formstyle label input[type="checkbox"]:checked + span:before {
  background-color: #cb0000;
  border: 2px solid #cb0000;
}
.formstyle label input[type="checkbox"]:checked + span:after {
  border: 2px solid #fff;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.formstyle label input[type="radio"] + span:before {
  background-color: transparent;
  border: 2px solid #a7a7a7;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  box-sizing: border-box;
  content: '';
  display: inline-block;
  height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  z-index: 0;
}
.formstyle label input[type="radio"] + span:after {
  box-sizing: border-box;
  content: '';
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
}
.formstyle label input[type="radio"]:checked + span:before {
  border-color: #cb0000;
}
.formstyle label input[type="radio"]:checked + span:after {
  background-color: #cb0000;
  -moz-border-radius: 12px;
  -webkit-border-radius: 12px;
  border-radius: 12px;
  height: 12px;
  position: absolute;
  top: 4px;
  left: 4px;
  width: 12px;
}
.formstyle .seimei label {
  text-align: right;
  width: 3em;
}
.formstyle #birthday_year, .formstyle #birthday_month, .formstyle #birthday_day {
  margin: 0 5px 0 10px;
}
.formstyle #birthday_year {
  margin-left: 0;
}

/* step */
.stepBar {
  margin: 20px 0;
  text-align: center;
}
.stepBar ul {
  font-size: 0;
}
.stepBar ul li {
  background: #999;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  padding: 5px 10px;
  position: relative;
  width: 7em;
}
.stepBar ul li + li {
  margin-left: 20px;
}
.stepBar ul li + li:before {
  background: #999;
  content: '';
  display: block;
  height: 8px;
  position: absolute;
  top: 45%;
  left: -20px;
  width: 20px;
}
.stepBar ul li.current {
  background: #cb0000;
}
.stepBar ul li.current:before {
  background: #ccc;
}
.stepBar ul li.done {
  background: #ccc;
  color: #eee;
}
.stepBar ul li.done:before {
  background: #ccc;
}
.stepBar ul li span {
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 500;
}

/* 視聴方法選択 */
#atx_platform_group table {
  margin-top: 10px;
}

/* 完了ページ */
.finish {
  padding: 40px 0;
  text-align: center;
}

/* =================================================
  pager
================================================= */
.pagenate {
  display: table;
  margin: 30px auto;
  text-align: center;
  width: 100%;
}
.pagenate a {
  border: 1px solid #e5e5e5;
  background-color: #fff;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  display: inline-block;
  text-align: center;
  text-decoration: none;
  padding: 5px 10px;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.pagenate a:hover {
  background-color: #cb0000;
  border: 1px solid #cb0000;
  color: #fff;
}
.pagenate .back, .pagenate .num, .pagenate .next {
  display: table-cell;
  position: relative;
  vertical-align: bottom;
}
.pagenate .back, .pagenate .next {
  padding-top: 2px;
  text-align: center;
  width: 125px;
}
.pagenate .back a, .pagenate .back span, .pagenate .next a, .pagenate .next span {
  display: block;
}
.pagenate .back a:after, .pagenate .back a:before, .pagenate .back span:after, .pagenate .back span:before, .pagenate .next a:after, .pagenate .next a:before, .pagenate .next span:after, .pagenate .next span:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #888;
  font-size: 16px;
  font-size: 1.6rem;
}
.pagenate .back a:hover:after, .pagenate .next a:hover:after {
  color: #fff;
}
.pagenate .back em, .pagenate .next em {
  font-weight: lighter;
}
.pagenate .back span, .pagenate .next span {
  border: 1px solid #e5e5e5;
  background-color: #ccc;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #888;
}
.pagenate .next a, .pagenate .next span {
  padding: 4px 20px;
}
.pagenate .next a:after, .pagenate .next span:after {
  content: "";
  margin-left: 5px;
}
.pagenate .back a, .pagenate .back span {
  padding: 4px 20px;
}
.pagenate .back a:before, .pagenate .back span:before {
  content: "";
  margin-right: 5px;
}
.pagenate ul {
  display: inline-block;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.pagenate ul li {
  display: inline-block;
  margin: 0 2px;
}
.pagenate ul li.current a {
  border: 1px solid #cb0000;
  background-color: #cb0000;
  color: #fff;
  font-weight: bold;
}

/* =================================================
  tab
================================================= */
.tab_content.col2 .tab li {
  width: calc((100% - 15px) / 2);
}
.tab_content.col2 .tab li + li {
  margin-left: 10px;
}
.tab_content .tab {
  display: table;
  margin-bottom: 5px;
  width: 100%;
}
.tab_content .tab li {
  display: inline-block;
  list-style-type: none;
}
.tab_content .tab li + li {
  margin-left: 5px;
}
.tab_content .tab li a, .tab_content .tab li span {
  background-color: #999;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #e7e7e7;
  display: block;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.2;
  padding: 15px 30px;
  position: relative;
  text-align: center;
}
.tab_content .tab li.active a, .tab_content .tab li.active span, .tab_content .tab li:hover a, .tab_content .tab li:hover span {
  background-color: #cb0000;
  color: #fff;
}
.tab_content .tab li.active a:before, .tab_content .tab li.active span:before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-top: 8px solid #cb0000;
}

/* =================================================
  title
================================================= */
.ttl01 {
  background: #d6370f;
  background: -moz-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #d6370f), color-stop(100%, #9c0b00));
  background: -webkit-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -o-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -ms-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: linear-gradient(to right, #d6370f 0%, #9c0b00 100%);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 24px;
  font-size: 2.4rem;
  line-height: 1.3;
  margin-bottom: 5px;
  padding: 15px;
  position: relative;
}
.ttl01 .rss, .ttl01 .btn {
  position: absolute;
  top: 22px;
  right: 15px;
}
.ttl01 .rss {
  background-color: rgba(255, 255, 255, 0.9);
  color: #cb0000 !important;
}
.ttl01.ov {
  background: #ff8c00;
  background: -moz-linear-gradient(left, #ff8c00 0%, #ff8c00 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #ff8c00), color-stop(100%, #ff8c00));
  background: -webkit-linear-gradient(left, #ff8c00 0%, #ff8c00 100%);
  background: -o-linear-gradient(left, #ff8c00 0%, #ff8c00 100%);
  background: -ms-linear-gradient(left, #ff8c00 0%, #ff8c00 100%);
  background: linear-gradient(to right, #ff8c00 0%, #ff8c00 100%);
}

.ttl02R {
  border-bottom: 4px solid #cb0000;
  color: #cb0000;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 24px;
  font-size: 2.4rem;
  line-height: 1.3;
  margin: 40px 0 10px;
  padding-bottom: 5px;
  position: relative;
}
.ttl02R a.btn {
  background-color: rgba(255, 255, 255, 0.8);
  color: #cb0000 !important;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 6px 15px;
  position: absolute;
  top: -6px;
  right: 0;
}
.ttl02R a.btn:after {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: lighter;
  content: "";
  margin-left: 5px;
}
.ttl02R a.btn:hover {
  background-color: #cb0000;
  color: #fff !important;
}

.ttl02 {
  border-bottom: 4px solid #cb0000;
  font-size: 20px;
  font-size: 2rem;
  font-weight: bold;
  line-height: 1.3;
  margin: 40px 0 20px;
  padding-bottom: 5px;
  position: relative;
}
.ttl02 a.btn {
  background-color: transparent;
  color: #396eb7 !important;
  font-size: 14px;
  font-size: 1.4rem;
  padding: 0;
  position: absolute;
  top: -2px;
  right: 0;
}
.ttl02 a.btn:after {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: lighter;
  content: "";
  margin-left: 5px;
}
.ttl02 a.btn:hover {
  color: #cb0000 !important;
}

.ttl03 {
  border-bottom: 1px dotted #cb0000;
  color: #cb0000;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  margin: 40px 0 20px;
  padding-bottom: 5px;
  position: relative;
}

.ttl02 + .ttl03 {
  margin-top: 0;
}

/* =================================================
  table
================================================= */
.color01 {
  color: #cb0000;
}

table {
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  margin: 0 0 20px;
}
table th, table td {
  padding: 10px;
  text-align: left;
}

p + table {
  margin-top: 10px;
}

table.table01 th, table.table01 td {
  border: 1px solid #ddd;
}
table.table01 th {
  background-color: #f1f1f1;
}

table.w100 {
  width: 100%;
}
table.w100 th {
  width: 10em;
}

table.tableform {
  margin-top: 10px;
  width: 100%;
}
table.tableform th, table.tableform td {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 10px 15px;
}
table.tableform th {
  background-color: #f1f1f1;
  border-right: 5px solid #ddd;
  text-align: left;
  width: 15em;
}
table.tableform th.thTopic {
  background: #666;
  color: #fff;
  border: none;
  width: 100%;
}

table.logintable {
  margin: 10px auto 0;
  width: 700px;
}

/* =================================================
  topicPath
================================================= */
#topicPath, #topic_path {
  font-size: 12px;
  font-size: 1.2rem;
  margin: 15px auto -10px;
  width: 1100px;
}
#topicPath ul li, #topic_path ul li {
  display: inline;
}
#topicPath ul li + li:before, #topic_path ul li + li:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  color: #999;
  display: inline-block;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: lighter;
  margin: 0 7px 0 5px;
}
#topicPath ul li.current, #topic_path ul li.current {
  font-weight: bold;
}

/* =================================================
  Header
================================================= */
header {
  background: rgba(255, 255, 255, 0.95);
  -moz-box-shadow: 0 1px 0 1px #e5e5e5;
  -webkit-box-shadow: 0 1px 0 1px #e5e5e5;
  box-shadow: 0 1px 0 1px #e5e5e5;
  height: 80px;
  text-align: center;
  position: fixed;
  top: 0;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -o-transition: 0.2s;
  -ms-transition: 0.2s;
  transition: 0.2s;
  width: 100%;
  min-width: 1100px;
  z-index: 100;
  /* SP用 */
  /* =================================================
    Navigation
  ================================================= */
  /* -----------------------
    Global navigation
  ------------------------------------------------- */
}
header:before {
  background: #d6370f;
  background: -moz-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #d6370f), color-stop(100%, #9c0b00));
  background: -webkit-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -o-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -ms-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: linear-gradient(to right, #d6370f 0%, #9c0b00 100%);
  content: "";
  display: block;
  height: 4px;
  width: 100%;
}
header p {
  margin: 0 !important;
}
header .inner {
  margin: 0 auto;
  padding: 10px 0;
  position: relative;
  width: 1100px;
}
header .logo {
  float: left;
  margin-right: 25px;
}
header .menu, header .menu_close {
  display: none;
}
@media only screen and (min-width: 768px) {
  header .menu_inner {
    display: block !important;
  }
}
header #global_navigation {
  float: left;
  margin-top: 5px;
}
header #global_navigation ul#g_nav li {
  display: inline-block;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: 400;
}
header #global_navigation ul#g_nav li a {
  color: #222;
  display: block;
  line-height: 1.4;
  padding: 0 15px;
  position: relative;
}
header #global_navigation ul#g_nav li a:before {
  display: block;
  font-size: 20px;
  font-size: 2rem;
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-bottom: -1px;
}
header #global_navigation ul#g_nav li a:hover, header #global_navigation ul#g_nav li.current a {
  color: #cb0000;
}
header #global_navigation ul#g_nav li#g_nav_new_arrival a:before {
  content: '\f1ee';
}
header #global_navigation ul#g_nav li#g_nav_program a:before {
  content: '\f00a';
  margin-bottom: -3px;
}
header #global_navigation ul#g_nav li#g_nav_search a:before {
  content: "";
}
header #global_navigation ul#g_nav li#g_nav_present a:before {
  content: '\f06b';
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: -4px;
}
header #global_navigation ul#g_nav li#g_nav_contact a:before {
  content: '\f0e0';
}
header #global_navigation ul#g_nav li#g_nav_program_request a:before {
  content: '\f0a1';
}
header #global_navigation ul#g_nav li#g_nav_information a:before {
  content: '\e91c';
}
header .sub_area {
  float: right;
  margin-top: 10px;
}
header .sub_area .header_search, header .sub_area .sns {
  display: inline-block;
}
header .sub_area .header_search {
  background-color: #999;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  padding: 0 3px 1px;
  width: 250px;
}
header .sub_area .header_search input {
  background: none;
  border: none;
  color: #fff;
  display: inline-block;
  margin: 0;
  padding: 5px;
}
header .sub_area .header_search input[type=text] {
  width: 210px;
}
header .sub_area .header_search input[type=text]:placeholder-shown {
  color: #eee;
}
header .sub_area .header_search input[type=text]::-webkit-input-placeholder {
  color: #eee;
}
header .sub_area .header_search input[type=text]:-moz-placeholder {
  color: #eee;
  opacity: 1;
}
header .sub_area .header_search input[type=text]::-moz-placeholder {
  color: #eee;
  opacity: 1;
}
header .sub_area .header_search input[type=text]:-ms-input-placeholder {
  color: #eee;
}
header .sub_area .header_search input[type=submit] {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-size: 1.6rem;
}

/* =================================================
  breadcrumb
================================================= */
#breadcrumb_list {
  color: #d6d5d5;
  font-size: 12px;
  font-size: 1.2rem;
  margin-top: 20px;
  position: absolute;
  width: 100%;
}
#breadcrumb_list a {
  color: #d6d5d5;
  text-decoration: underline;
}
#breadcrumb_list ul li {
  display: inline;
}
#breadcrumb_list ul li:after {
  color: #9ea3ab;
  font-weight: lighter;
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  margin: 0 5px 0 10px;
}
#breadcrumb_list ul li.current {
  font-weight: bold;
}
#breadcrumb_list ul li.current:after {
  content: "";
}
#breadcrumb_list.ov {
  color: #222;
}
#breadcrumb_list.ov a {
  color: #222;
}

/* =================================================
  Scroll to top Button
================================================= */
#scrolltop {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 50;
}
#scrolltop a {
  background: #cb0000;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #fff;
  display: block;
  font-size: 28px;
  font-size: 2.8rem;
  padding: 13px 20px 17px;
  text-align: center;
}

/* =================================================
  Footer
================================================= */
footer {
  background: #222;
  color: #fff;
  line-height: 1;
  margin-top: 80px;
  text-align: center;
}
footer .footer_content {
  padding: 40px 10px;
}
footer .footer_content ul li {
  display: inline-block;
  margin: 0 25px;
}
footer .footer_content a {
  color: #fff;
}
footer .footer_content .site_summary {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 40px;
}
footer .footer_content .copy {
  color: #999;
  font-size: 12px;
  font-size: 1.2rem;
}

/* =================================================
  sub_contents
================================================= */
/* NOW ON AIR */
.now_on_air {
  background: #d6370f;
  background: -moz-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #d6370f), color-stop(100%, #9c0b00));
  background: -webkit-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -o-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -ms-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: linear-gradient(to right, #d6370f 0%, #9c0b00 100%);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.now_on_air a {
  color: #fff;
}
.now_on_air ul {
  margin: 0;
}
.now_on_air ul li {
  list-style: none;
}
.now_on_air h3 {
  color: #ffd200;
  float: left;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  padding: 33px 0 0 10px;
  width: 50%;
}
.now_on_air .date {
  font-family: "Noto Sans JP", sans-serif;
  float: right;
  position: relative;
  width: 48%;
}
.now_on_air .date li {
  color: #fff;
  display: inline-block;
}
.now_on_air .date li span {
  font-weight: bold;
}
.now_on_air .date .year {
  display: block;
  font-weight: 400;
  padding-top: 10px;
  font-size: 12px;
  font-size: 1.2rem;
}
.now_on_air .date .month,
.now_on_air .date .day {
  font-size: 28px;
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1;
  margin: -2px 0 0 !important;
}
.now_on_air .date .month:after {
  content: "/";
  color: #fff;
  display: inline-block;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: lighter;
  margin: 0 2px;
}
.now_on_air .date .week {
  background: #fff;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  line-height: 15px;
  height: 20px;
  position: absolute;
  text-align: center;
  bottom: 3px;
  right: 10px;
  width: 20px;
}
.now_on_air .date .week span {
  color: #770301;
  font-size: 10px;
  font-size: 1rem;
}
.now_on_air .timeline {
  clear: both;
  padding: 10px;
}
.now_on_air .timeline li {
  background: #a50303;
  color: #fff;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 8px 5px;
}
.now_on_air .timeline li a {
  color: #fff;
}
.now_on_air .timeline li + li {
  margin: 0 !important;
}
.now_on_air .timeline li .time,
.now_on_air .timeline li .title {
  display: table-cell;
  vertical-align: middle;
  font-weight: normal;
  padding-right: 2em;
}
.now_on_air .timeline li .title {
  padding: 0;
  font-size: 12px;
  font-size: 1.2rem;
}
.now_on_air .timeline li:nth-child(2n) {
  background: #890404;
}
.now_on_air .timeline li:first-child {
  -moz-border-radius: 3px 3px 0 0;
  -webkit-border-radius: 3px;
  border-radius: 3px 3px 0 0;
}
.now_on_air .timeline li:last-child {
  -moz-border-radius: 0 0 3px 3px;
  -webkit-border-radius: 0;
  border-radius: 0 0 3px 3px;
}
.now_on_air .timeline .current {
  background: #fff;
  color: #c92523;
  /*display: table-row;*/
  font-size: 14px;
  font-size: 1.4rem;
  padding: 8px 0;
}
.now_on_air .timeline .current a {
  color: #cb0000;
}
.now_on_air .timeline .current .time, .now_on_air .timeline .current .title {
  color: #c92523;
  font-weight: 700;
  font-size: 14px;
  font-size: 1.4rem;
}
.now_on_air .timeline .current .time {
  color: #c92523;
  padding-left: 5px;
  padding-right: 1.25em;
}
.now_on_air .timeline .hidden {
  display: none;
}
.now_on_air .timeline .timeTableNoMore {
  display: none;
}
.now_on_air .program_select {
  display: table;
  padding: 0 10px 10px;
  width: 100%;
}
.now_on_air .program_select dt, .now_on_air .program_select dd {
  display: table-cell;
}
.now_on_air .program_select dt {
  color: #fff;
  font-weight: bold;
  padding-right: 1em;
}
.now_on_air .program_select dd {
  color: #a50303;
}
.now_on_air .program_select dd select {
  border: none;
  color: #a50303;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 2px;
  width: 100%;
}

#sub_contents, .footer_sp, .login_content {
  /* block */
  /* notice */
  /* status */
  /* btn */
  /* user */
  /* info */
  /* ranking */
}
#sub_contents .section, .footer_sp .section, .login_content .section {
  margin: 0 0 10px;
}
#sub_contents .section .ttl, .footer_sp .section .ttl, .login_content .section .ttl {
  background-color: #666;
  -moz-border-radius: 3px 3px 0 0;
  -webkit-border-radius: 3px;
  border-radius: 3px 3px 0 0;
  color: #fff;
  line-height: 1.3;
  padding: 12px 10px;
  text-align: center;
}
#sub_contents .section .ttl p, .footer_sp .section .ttl p, .login_content .section .ttl p {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 18px;
  font-size: 1.8rem;
  margin: 0;
  padding: 0;
}
#sub_contents .section .ttl span, .footer_sp .section .ttl span, .login_content .section .ttl span {
  color: #ccc;
  display: block;
  font-size: 11px;
  font-size: 1.1rem;
  margin-top: 5px;
}
#sub_contents .section .ttl.emp, .footer_sp .section .ttl.emp, .login_content .section .ttl.emp {
  background: #d6370f;
  background: -moz-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #d6370f), color-stop(100%, #9c0b00));
  background: -webkit-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -o-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -ms-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: linear-gradient(to right, #d6370f 0%, #9c0b00 100%);
}
#sub_contents .section .ttl.emp span, .footer_sp .section .ttl.emp span, .login_content .section .ttl.emp span {
  color: #fff;
}
#sub_contents .section .ttl .rss, .footer_sp .section .ttl .rss, .login_content .section .ttl .rss {
  background-color: rgba(255, 255, 255, 0.9);
  color: #cb0000 !important;
  vertical-align: middle;
}
#sub_contents .section .block, .footer_sp .section .block, .login_content .section .block {
  -moz-box-shadow: 0 0 0 0 #dcdcdc;
  -webkit-box-shadow: 0 0 0 0 #dcdcdc;
  box-shadow: 0 0 0 0 #dcdcdc;
  margin: 0;
  padding: 10px;
  position: relative;
}
#sub_contents .section .block.list, .footer_sp .section .block.list, .login_content .section .block.list {
  line-height: 1.5;
  padding: 5px;
}
#sub_contents .section .block.list ul li, #sub_contents .section .block.list ol li, .footer_sp .section .block.list ul li, .footer_sp .section .block.list ol li, .login_content .section .block.list ul li, .login_content .section .block.list ol li {
  border-top: 1px dotted #ccc;
  display: table;
  margin: 0;
  width: 100%;
}
#sub_contents .section .block.list ul li:first-child, #sub_contents .section .block.list ol li:first-child, .footer_sp .section .block.list ul li:first-child, .footer_sp .section .block.list ol li:first-child, .login_content .section .block.list ul li:first-child, .login_content .section .block.list ol li:first-child {
  border: none;
}
#sub_contents .section .block.list ul li a, #sub_contents .section .block.list ol li a, .footer_sp .section .block.list ul li a, .footer_sp .section .block.list ol li a, .login_content .section .block.list ul li a, .login_content .section .block.list ol li a {
  display: block;
  padding: 3px 5px;
}
#sub_contents .section .block.list ul li .image, #sub_contents .section .block.list ul li .txt, #sub_contents .section .block.list ol li .image, #sub_contents .section .block.list ol li .txt, .footer_sp .section .block.list ul li .image, .footer_sp .section .block.list ul li .txt, .footer_sp .section .block.list ol li .image, .footer_sp .section .block.list ol li .txt, .login_content .section .block.list ul li .image, .login_content .section .block.list ul li .txt, .login_content .section .block.list ol li .image, .login_content .section .block.list ol li .txt {
  display: table-cell;
  vertical-align: middle;
}
#sub_contents .section .block.list ul li .image, #sub_contents .section .block.list ol li .image, .footer_sp .section .block.list ul li .image, .footer_sp .section .block.list ol li .image, .login_content .section .block.list ul li .image, .login_content .section .block.list ol li .image {
  padding-right: 10px;
  width: 40px;
}
#sub_contents .section .block.list ul li .txt, #sub_contents .section .block.list ol li .txt, .footer_sp .section .block.list ul li .txt, .footer_sp .section .block.list ol li .txt, .login_content .section .block.list ul li .txt, .login_content .section .block.list ol li .txt {
  padding-top: 1px;
}
#sub_contents .section .block.list .more, .footer_sp .section .block.list .more, .login_content .section .block.list .more {
  border-top: 1px dotted #ccc;
  font-size: 12px;
  font-size: 1.2rem;
  text-align: right;
}
#sub_contents .section .block.list .more a, .footer_sp .section .block.list .more a, .login_content .section .block.list .more a {
  color: #666;
  display: block;
  font-weight: bold;
  padding: 7px 5px 2px;
}
#sub_contents .section .block.list .more a:after, .footer_sp .section .block.list .more a:after, .login_content .section .block.list .more a:after {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  display: inline-block;
  font-size: 14px;
  font-size: 1.4rem;
  margin-left: 8px;
}
#sub_contents .section .ttl ~ .block, .footer_sp .section .ttl ~ .block, .login_content .section .ttl ~ .block {
  -moz-border-radius: 0 0 3px 3px;
  -webkit-border-radius: 0;
  border-radius: 0 0 3px 3px;
}
#sub_contents .notice, .footer_sp .notice, .login_content .notice {
  position: absolute;
  top: -8px;
  right: -10px;
}
#sub_contents .notice span, .footer_sp .notice span, .login_content .notice span {
  background-color: #555;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  display: block;
  font-weight: bold;
  padding: 2px 8px 1px;
}
#sub_contents .notice .comment, .footer_sp .notice .comment, .login_content .notice .comment {
  background-color: rgba(255, 255, 255, 0.98);
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.2);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  display: none;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 10px;
  position: absolute;
  top: -86px;
  right: -8px;
  text-align: left;
  width: 200px;
}
#sub_contents .notice .comment:after, .footer_sp .notice .comment:after, .login_content .notice .comment:after {
  border: 10px solid transparent;
  border-top: 10px solid rgba(255, 255, 255, 0.98);
  content: '';
  position: absolute;
  top: 100%;
  left: 90%;
  margin-left: -10px;
}
#sub_contents .notice .comment:before, .footer_sp .notice .comment:before, .login_content .notice .comment:before {
  content: '';
  position: absolute;
  top: 100%;
  left: 90%;
  margin-left: -13px;
  border: 13px solid transparent;
  border-top: 13px solid rgba(0, 0, 0, 0.2);
}
#sub_contents .status_area .comment, .footer_sp .status_area .comment, .login_content .status_area .comment {
  top: auto;
  bottom: 36px;
}
#sub_contents .status, .footer_sp .status, .login_content .status {
  background-color: #aeaeae;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  color: #fff;
  display: inline-block;
  font-weight: bold;
  line-height: 1.7;
  margin: 0 5px;
  padding: 5px 3px 2px 25px;
  position: relative;
  text-align: center;
  width: 10em;
}
#sub_contents .status:before, .footer_sp .status:before, .login_content .status:before {
  background-color: #fff;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  content: '';
  display: inline-block;
  height: 20px;
  position: absolute;
  top: 5px;
  left: 5px;
  width: 20px;
}
#sub_contents .status.on, .footer_sp .status.on, .login_content .status.on {
  background-color: #cb0000;
  padding: 5px 25px 2px 3px;
}
#sub_contents .status.on:before, .footer_sp .status.on:before, .login_content .status.on:before {
  left: auto;
  right: 5px;
}
#sub_contents .entry, #sub_contents .login, #sub_contents .logout, .footer_sp .entry, .footer_sp .login, .footer_sp .logout, .login_content .entry, .login_content .login, .login_content .logout {
  margin: 0;
  padding: 12px;
  text-align: center;
  width: 100%;
}
#sub_contents .entry span:before, #sub_contents .login span:before, #sub_contents .logout span:before, .footer_sp .entry span:before, .footer_sp .login span:before, .footer_sp .logout span:before, .login_content .entry span:before, .login_content .login span:before, .login_content .logout span:before {
  font-size: 26px;
  font-size: 2.6rem;
  display: inline-block;
  margin-right: 10px;
  vertical-align: middle;
}
#sub_contents .entry span:after, #sub_contents .login span:after, #sub_contents .logout span:after, .footer_sp .entry span:after, .footer_sp .login span:after, .footer_sp .logout span:after, .login_content .entry span:after, .login_content .login span:after, .login_content .logout span:after {
  display: none;
}
#sub_contents .entry span:before, .footer_sp .entry span:before, .login_content .entry span:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f044";
}
#sub_contents .entry span span, .footer_sp .entry span span, .login_content .entry span span {
  font-size: 14px;
  font-size: 1.4rem;
}
#sub_contents .entry span span:before, .footer_sp .entry span span:before, .login_content .entry span span:before {
  display: none;
}
#sub_contents .login, .footer_sp .login, .login_content .login {
  background-color: #ff7700;
  padding: 10px 12px;
}
#sub_contents .login:hover, .footer_sp .login:hover, .login_content .login:hover {
  background-color: #ff9233;
}
#sub_contents .login span:before, .footer_sp .login span:before, .login_content .login span:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\f023';
  margin: 0 15px 0 2px;
}
#sub_contents .logout, .footer_sp .logout, .login_content .logout {
  background-color: #777;
  padding: 10px 12px;
}
#sub_contents .logout:hover, .footer_sp .logout:hover, .login_content .logout:hover {
  background-color: #919191;
}
#sub_contents .logout span:before, .footer_sp .logout span:before, .login_content .logout span:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\f08b';
}
#sub_contents .user .name, .footer_sp .user .name, .login_content .user .name {
  margin: 15px 0;
  text-align: center;
}
#sub_contents .user .buttons, .footer_sp .user .buttons, .login_content .user .buttons {
  zoom: 1;
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 0;
}
#sub_contents .user .buttons:before, #sub_contents .user .buttons:after, .footer_sp .user .buttons:before, .footer_sp .user .buttons:after, .login_content .user .buttons:before, .login_content .user .buttons:after {
  content: "";
  display: table;
}
#sub_contents .user .buttons:after, .footer_sp .user .buttons:after, .login_content .user .buttons:after {
  clear: both;
}
#sub_contents .user .buttons li, .footer_sp .user .buttons li, .login_content .user .buttons li {
  float: left;
}
#sub_contents .user .buttons li + li, .footer_sp .user .buttons li + li, .login_content .user .buttons li + li {
  float: right;
}
#sub_contents .user .buttons li .btn, .footer_sp .user .buttons li .btn, .login_content .user .buttons li .btn {
  font-size: 12px;
  font-size: 1.2rem;
  margin: 0;
  padding: 5px 15px;
}
#sub_contents .user .buttons li .out, .footer_sp .user .buttons li .out, .login_content .user .buttons li .out {
  color: #666;
}
#sub_contents .user .buttons li .out:after, .footer_sp .user .buttons li .out:after, .login_content .user .buttons li .out:after {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\f08b';
  margin-left: 5px;
}
#sub_contents .info, .footer_sp .info, .login_content .info {
  background: #d6370f;
  background: -moz-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #d6370f), color-stop(100%, #9c0b00));
  background: -webkit-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -o-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: -ms-linear-gradient(left, #d6370f 0%, #9c0b00 100%);
  background: linear-gradient(to right, #d6370f 0%, #9c0b00 100%);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  padding: 10px;
  position: relative;
}
#sub_contents .info .ttl, .footer_sp .info .ttl, .login_content .info .ttl {
  background: none;
  color: #fff;
  padding: 5px 10px 10px;
}
#sub_contents .info .ttl p:before, .footer_sp .info .ttl p:before, .login_content .info .ttl p:before {
  font-size: 20px;
  font-size: 2rem;
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\e91c';
  display: inline-block;
  margin-right: 5px;
  vertical-align: middle;
}
#sub_contents .info .ttl ~ .block, .footer_sp .info .ttl ~ .block, .login_content .info .ttl ~ .block {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 5px;
}
#sub_contents .ranking ol, .footer_sp .ranking ol, .login_content .ranking ol {
  counter-reset: rank;
}
#sub_contents .ranking ol li:before, .footer_sp .ranking ol li:before, .login_content .ranking ol li:before {
  color: #888;
  counter-increment: rank;
  content: counter(rank);
  display: inline-block;
  float: left;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 16px;
  font-size: 1.6rem;
  margin-right: 5px;
  text-align: center;
  width: 30px;
}
#sub_contents .ranking ol li a, .footer_sp .ranking ol li a, .login_content .ranking ol li a {
  color: #666;
}
#sub_contents .ranking ol li:nth-child(-n+3):before, .footer_sp .ranking ol li:nth-child(-n+3):before, .login_content .ranking ol li:nth-child(-n+3):before {
  font-size: 20px;
  font-size: 2rem;
}
#sub_contents .ranking ol li:nth-child(-n+3):before, #sub_contents .ranking ol li:nth-child(-n+3) a, .footer_sp .ranking ol li:nth-child(-n+3):before, .footer_sp .ranking ol li:nth-child(-n+3) a, .login_content .ranking ol li:nth-child(-n+3):before, .login_content .ranking ol li:nth-child(-n+3) a {
  font-weight: bold;
}
#sub_contents .ranking ol li:first-child:before, #sub_contents .ranking ol li:first-child a, .footer_sp .ranking ol li:first-child:before, .footer_sp .ranking ol li:first-child a, .login_content .ranking ol li:first-child:before, .login_content .ranking ol li:first-child a {
  color: #d08e00;
}
#sub_contents .ranking ol li:nth-child(2):before, #sub_contents .ranking ol li:nth-child(2) a, .footer_sp .ranking ol li:nth-child(2):before, .footer_sp .ranking ol li:nth-child(2) a, .login_content .ranking ol li:nth-child(2):before, .login_content .ranking ol li:nth-child(2) a {
  color: #40587a;
}
#sub_contents .ranking ol li:nth-child(3):before, #sub_contents .ranking ol li:nth-child(3) a, .footer_sp .ranking ol li:nth-child(3):before, .footer_sp .ranking ol li:nth-child(3) a, .login_content .ranking ol li:nth-child(3):before, .login_content .ranking ol li:nth-child(3) a {
  color: #82674f;
}
#sub_contents .banner li + li, .footer_sp .banner li + li, .login_content .banner li + li {
  margin-top: 10px;
}
#sub_contents .banner li .btn, .footer_sp .banner li .btn, .login_content .banner li .btn {
  padding: 15px 15px 10px 70px;
  margin: 0;
  position: relative;
  text-align: left;
  width: 100%;
}
#sub_contents .banner li .btn span, .footer_sp .banner li .btn span, .login_content .banner li .btn span {
  display: inline-block;
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: lighter;
}
#sub_contents .banner li .btn p, .footer_sp .banner li .btn p, .login_content .banner li .btn p {
  margin: 0;
}
#sub_contents .banner li .twitter, .footer_sp .banner li .twitter, .login_content .banner li .twitter {
  background-color: #1da1f2;
  padding: 5px 15px 10px 60px;
}
#sub_contents .banner li .twitter:before, .footer_sp .banner li .twitter:before, .login_content .banner li .twitter:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f1e4";
  font-size: 40px;
  font-size: 4rem;
  position: absolute;
  top: 5px;
  left: 15px;
}
#sub_contents .banner li .twitter:hover, .footer_sp .banner li .twitter:hover, .login_content .banner li .twitter:hover {
  background-color: #4db5f5;
}
#sub_contents .banner li .twitter.blank span:after, .footer_sp .banner li .twitter.blank span:after, .login_content .banner li .twitter.blank span:after {
  margin-left: 0;
  position: absolute;
  top: 40%;
  right: 10px;
}
#sub_contents .banner li .line, .footer_sp .banner li .line, .login_content .banner li .line {
  background: url(/images/common/icon_line.png) #ff9933 no-repeat 10px center/auto 70%;
  padding: 10px 15px 10px 60px;
  font-size: 1.37rem;
}
#sub_contents .banner li .line:hover, .footer_sp .banner li .line:hover, .login_content .banner li .line:hover {
  background-color: #ffb366;
}
#sub_contents .banner li .line.blank span:after, .footer_sp .banner li .line.blank span:after, .login_content .banner li .line.blank span:after {
  margin-left: 0;
  position: absolute;
  top: 40%;
  right: 10px;
}
#sub_contents .banner li .shop, .footer_sp .banner li .shop, .login_content .banner li .shop {
  background-color: #f47900;
}
#sub_contents .banner li .shop:before, .footer_sp .banner li .shop:before, .login_content .banner li .shop:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f290";
  font-size: 40px;
  font-size: 4rem;
  position: absolute;
  top: 10px;
  left: 15px;
}
#sub_contents .banner li .shop span:after, .footer_sp .banner li .shop span:after, .login_content .banner li .shop span:after {
  margin-left: 0;
  position: absolute;
  top: 30%;
  right: 10px;
}
#sub_contents .banner li .shop:hover, .footer_sp .banner li .shop:hover, .login_content .banner li .shop:hover {
  background-color: #ff9328;
}
#sub_contents .banner li .qr, .footer_sp .banner li .qr, .login_content .banner li .qr {
  background-color: #4c4c4c;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #fff;
  display: table;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 10px 15px;
  width: 100%;
}
#sub_contents .banner li .qr .image, #sub_contents .banner li .qr .txt, .footer_sp .banner li .qr .image, .footer_sp .banner li .qr .txt, .login_content .banner li .qr .image, .login_content .banner li .qr .txt {
  display: table-cell;
  vertical-align: middle;
}
#sub_contents .banner li .qr .txt, .footer_sp .banner li .qr .txt, .login_content .banner li .qr .txt {
  padding-left: 10px;
}
#sub_contents .banner li .qr p, .footer_sp .banner li .qr p, .login_content .banner li .qr p {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  margin: 0;
}
#sub_contents .banner li .illegal, .footer_sp .banner li .illegal, .login_content .banner li .illegal {
  background-color: #8e66b7;
}
#sub_contents .banner li .illegal:before, .footer_sp .banner li .illegal:before, .login_content .banner li .illegal:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f05e";
  font-size: 40px;
  font-size: 4rem;
  position: absolute;
  top: 5px;
  left: 15px;
}
#sub_contents .banner li .illegal span, .footer_sp .banner li .illegal span, .login_content .banner li .illegal span {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: bold;
}
#sub_contents .banner li .illegal span:after, .footer_sp .banner li .illegal span:after, .login_content .banner li .illegal span:after {
  margin-left: 0;
  position: absolute;
  top: 30%;
  right: 10px;
}
#sub_contents .banner li .illegal:hover, .footer_sp .banner li .illegal:hover, .login_content .banner li .illegal:hover {
  background-color: #a889c7;
}
#sub_contents .banner li .original, .footer_sp .banner li .original, .login_content .banner li .original {
  background-color: #4b9aa0;
}
#sub_contents .banner li .original.btn, .footer_sp .banner li .original.btn, .login_content .banner li .original.btn {
  padding: 20px 15px 15px 55px;
}
#sub_contents .banner li .original:before, .footer_sp .banner li .original:before, .login_content .banner li .original:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e80c";
  font-size: 32px;
  font-size: 3.2rem;
  position: absolute;
  top: 18px;
  left: 15px;
}
#sub_contents .banner li .original span, .footer_sp .banner li .original span, .login_content .banner li .original span {
  font-size: 11px;
  font-size: 1.1rem;
}
#sub_contents .banner li .original p span, .footer_sp .banner li .original p span, .login_content .banner li .original p span {
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
}
#sub_contents .banner li .original span:after, .footer_sp .banner li .original span:after, .login_content .banner li .original span:after {
  margin-left: 0;
  position: absolute;
  top: 30%;
  right: 10px;
}
#sub_contents .banner li .original:hover, .footer_sp .banner li .original:hover, .login_content .banner li .original:hover {
  background-color: #66b2b8;
}
#sub_contents .banner .btn.new_arrival, #sub_contents .banner .btn.program_list, .footer_sp .banner .btn.new_arrival, .footer_sp .banner .btn.program_list, .login_content .banner .btn.new_arrival, .login_content .banner .btn.program_list {
  display: block;
  padding: 20px 20px 20px 60px;
  position: relative;
  text-align: left !important;
}
#sub_contents .banner .btn.new_arrival:before, #sub_contents .banner .btn.program_list:before, .footer_sp .banner .btn.new_arrival:before, .footer_sp .banner .btn.program_list:before, .login_content .banner .btn.new_arrival:before, .login_content .banner .btn.program_list:before {
  display: block;
  font-size: 40px;
  font-size: 4rem;
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: absolute;
  top: calc((100% - 50px) / 2);
  left: 15px;
}
#sub_contents .banner .btn.new_arrival:after, #sub_contents .banner .btn.program_list:after, .footer_sp .banner .btn.new_arrival:after, .footer_sp .banner .btn.program_list:after, .login_content .banner .btn.new_arrival:after, .login_content .banner .btn.program_list:after {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  display: inline-block;
  font-size: 20px;
  font-size: 2rem;
  font-weight: lighter;
  position: absolute;
  top: calc((100% - 20px) / 2);
  right: 10px;
}
#sub_contents .banner .btn.new_arrival span, #sub_contents .banner .btn.program_list span, .footer_sp .banner .btn.new_arrival span, .footer_sp .banner .btn.program_list span, .login_content .banner .btn.new_arrival span, .login_content .banner .btn.program_list span {
  font-size: 11px;
  font-size: 1.1rem;
  font-weight: lighter;
}
#sub_contents .banner .btn.new_arrival span:after, #sub_contents .banner .btn.program_list span:after, .footer_sp .banner .btn.new_arrival span:after, .footer_sp .banner .btn.program_list span:after, .login_content .banner .btn.new_arrival span:after, .login_content .banner .btn.program_list span:after {
  display: none;
}
#sub_contents .banner .btn.new_arrival p span, #sub_contents .banner .btn.program_list p span, .footer_sp .banner .btn.new_arrival p span, .footer_sp .banner .btn.program_list p span, .login_content .banner .btn.new_arrival p span, .login_content .banner .btn.program_list p span {
  color: #fff;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}
#sub_contents .banner .btn.new_arrival:before, .footer_sp .banner .btn.new_arrival:before, .login_content .banner .btn.new_arrival:before {
  content: '\f1ee';
}
#sub_contents .banner .btn.program_list:before, .footer_sp .banner .btn.program_list:before, .login_content .banner .btn.program_list:before {
  font-size: 36px;
  font-size: 3.6rem;
  content: '\f00a';
  top: calc((100% - 45px) / 2);
}

/* =================================================
  program list
================================================= */
.list {
  zoom: 1;
}
.list:before, .list:after {
  content: "";
  display: table;
}
.list:after {
  clear: both;
}
.list .block {
  /*display: table;*/
  line-height: 1.4;
  float: left;
  padding: 10px;
  position: relative;
}
.list .block + .block {
  margin-left: 10px;
}
.list .block .image, .list .block .txt {
  display: table-cell;
  vertical-align: top;
}
.list .block .image {
  padding-right: 15px;
  width: 155px;
}
.list .block .txt {
  padding-bottom: 30px;
}
.list .block .ttl_head > div:first-of-type {
  margin-right: 35px;
}
.list .block .icon_area {
  margin-bottom: 15px;
}
.list .block .icon_area li {
  display: inline-block;
}
.list .block .ttl {
  font-weight: bold;
  margin-bottom: 10px;
}
.list .block .date {
  color: #999;
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 20px;
}
.list .block .comment {
  font-size: 12px;
  font-size: 1.2rem;
}
.list .block .limitation, .list .block .link, .list .block .fav {
  position: absolute;
}
.list .block .limitation {
  left: 165px;
  bottom: 10px;
}
.list .block .link {
  right: 10px;
  bottom: 10px;
  color: #396eb7;
  font-size: 12px;
  font-size: 1.2rem;
}
.list .block .link:after {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
  margin-left: 5px;
}
.list .block .fav {
  font-size: 20px;
  font-size: 2rem;
  top: 0;
  right: 0;
}
.list .block .fav a {
  background-color: #ddd;
  -moz-border-radius: 0 3px 0 3px;
  -webkit-border-radius: 0;
  border-radius: 0 3px 0 3px;
  color: #fff;
  display: block;
  padding: 5px;
}
.list .block .fav a:hover, .list .block .fav a.add {
  background-color: #ffba00;
}
.list .block .fav a.add:hover {
  background-color: #ddd;
}
.list .block .fav span.comment {
  background-color: rgba(0, 0, 0, 0.7);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #fff;
  display: inline-block;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 7px 10px;
  position: absolute;
  top: 5px;
  right: -185px;
  text-align: center;
  width: 180px;
  z-index: 10;
}
.list .block .fav span.comment:before {
  content: '';
  position: absolute;
  top: 50%;
  left: -10px;
  margin-top: -5px;
  border: 5px solid transparent;
  border-right: 5px solid rgba(0, 0, 0, 0.7);
}
.list .block a {
  color: #333;
  display: block;
}
.list .block a:hover .image img {
  opacity: 0.7;
}
.list .block a:hover .program_title, .list .block a:hover .ttl, .list .block a:hover .link {
  color: #cb0000;
}
.list.col2 .block {
  width: 48%;
  width: calc((100% - 10px) / 2);
}
.list.col2 .block:nth-child(2n+1) {
  margin-left: 0;
}
.list.col3 .block {
  width: 30%;
  width: calc((100% - 21px) / 3);
}
.list.col3 .block:nth-child(3n+1) {
  margin-left: 0;
}
.list.col4 .block {
  width: calc((100% - 20px) / 4);
}
.list.col4 .block:nth-child(4n+1) {
  margin-left: 0;
}
.list.col5 .block {
  width: calc((100% - 20px) / 5);
}
.list.col5 .block:nth-child(5n+1) {
  margin-left: 0;
}

/* =================================================
  お気に入り番組表
================================================= */
.fav_program {
  position: relative;
  /* 未ログインの場合 */
}
.fav_program .week {
  display: table;
  width: 100%;
}
.fav_program .week li {
  background-color: #eee;
  border: 1px solid #ccc;
  border-bottom: none;
  display: table-cell;
  font-weight: bold;
  padding: 3px 5px;
  text-align: center;
  width: 113px;
}
.fav_program .week li + li {
  border-left: none;
}
.fav_program .week li.sat {
  background-color: #dbebf3;
}
.fav_program .week li.sun {
  background-color: #ffd1d1;
}
.fav_program .fav_block {
  border: 1px solid #ccc;
  display: table-cell;
  line-height: 1.3;
  min-height: 100px;
  padding: 5px;
  width: 113px;
}
.fav_program .fav_block + .fav_block {
  border-left: none;
}
.fav_program .fav_block li {
  background-color: #eee;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: bold;
  display: block;
  padding: 3px;
}
.fav_program .fav_block li a {
  color: #333;
}
.fav_program .fav_block li.bgBlue {
  background-color: #e0ffff;
}
.fav_program .fav_block li.bgBlue a {
  color: #316666 !important;
}
.fav_program .fav_block li.bgPink {
  background-color: #ffe4e1;
}
.fav_program .fav_block li.bgPink a {
  color: #883930 !important;
}
.fav_program .fav_block li.bgOrange {
  background-color: #ff4500;
}
.fav_program .fav_block span {
  display: block;
  font-weight: lighter;
}
.fav_program .login_content {
  background-color: rgba(139, 139, 139, 0.85);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  padding: 10px 5px;
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  width: 100%;
  z-index: 10;
}
.fav_program .login_content p {
  color: #fff;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 15px;
}
.fav_program .login_content .section {
  margin: 0 !important;
}
.fav_program .login_content .section.user li {
  display: inline-block;
  width: 300px;
}
.fav_program .login_content .section.user li + li {
  margin-left: 20px;
}

/* =================================================
  agreementBox
================================================= */
.agreementBox {
  border: 1px solid #b5b5b5;
  height: 270px;
  margin: 20px 0;
  overflow: auto;
  padding: 10px;
}

/* =================================================
  remodal
================================================= */
.remodal .close {
  background-color: #cb0000;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-weight: bold;
  margin-top: 10px;
  padding: 3px 15px;
}
.remodal .close:hover {
  background-color: #e50000;
}
.remodal .close:before {
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\f00d';
  font-weight: lighter;
  margin-right: 5px;
}

.modal_link {
  position: relative;
}
.modal_link:hover:before {
  background-color: rgba(255, 255, 255, 0.5);
  content: '';
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.modal_link:hover:after {
  color: #cb0000;
  font-family: customicon;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: '\f00e';
  font-size: 40px;
  font-size: 4rem;
  position: absolute;
  bottom: calc(50% - 30px);
  right: calc(50% - 20px);
}

@media print {
  @page {
    size: A4;
    margin: 5mm;
  }
  body {
    -webkit-print-color-adjust: exact;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    word-spacing: 1.1pt;
    letter-spacing: 0.2pt;
  }

  header {
    position: relative !important;
  }

  #contents {
    margin: 0;
    table-layout: auto;
  }

  #topic_path {
    margin: 15px 0;
  }
}
