@charset "UTF-8";
/**
 * 鉄道ファンコーナー
 */
/* ==========================================================================
  共通
  ========================================================================== */
* {
  box-sizing: border-box; }

body {
  min-width: 1044px; }
  @media screen and (max-width: 767px) {
    body {
      min-width: inherit; } }

#topicpath {
  margin-bottom: 0; }
  #topicpath .navigation {
    width: 1004px;
    box-sizing: border-box;
    background: none;
    padding-left: 0; }
    #topicpath .navigation img {
      margin: 0 15px 0 3px; }
    #topicpath .navigation li:first-child {
      padding-left: 20px;
      background: url("/common/css/img/icon_home.gif") no-repeat left 4px; }
    #topicpath .navigation li {
      margin-right: 15px; }
  @media screen and (max-width: 767px) {
    #topicpath {
      padding-left: 10px; }
      #topicpath .navigation {
        width: 100%; }
        #topicpath .navigation img {
          vertical-align: middle; } }

@media screen and (max-width: 767px) {
  #contents {
    width: 100%;
    padding: 0 10px;
    margin-top: 30px; } }

/* ==========================================================================
   インデックス
   ========================================================================== */
#index-fan .full-box {
  width: 1024px; }
  @media screen and (max-width: 767px) {
    #index-fan .full-box {
      width: 100%; } }

@media screen and (max-width: 767px) {
  .two-column-list li {
    float: none;
    margin: 0 0 10px; }
    .two-column-list li.right {
      float: none; } }

.fan-index-box {
  width: 500px;
  margin-bottom: 25px; }
  @media screen and (max-width: 767px) {
    .fan-index-box {
      width: 100%;
      margin-bottom: 40px; } }

.fan-index-box__heading {
  padding-bottom: 15px;
  border-bottom: 2px solid #ccc;
  font-size: 257.14286%;
  text-align: center; }
  @media screen and (max-width: 767px) {
    .fan-index-box__heading {
      font-size: 171.42857%; } }
  .fan-index-box__heading:before {
    content: '';
    display: inline-block;
    position: relative;
    background-repeat: no-repeat; }

.fan-index-box__list li {
  border-bottom: 1px solid #ccc; }
  .fan-index-box__list li a {
    display: block;
    padding: 15px 0 15px 14px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: left center;
    color: #262626;
    font-size: 93.33333%; }
    .fan-index-box__list li a.icon-blank:after {
      content: '';
      display: inline-block;
      margin-left: 3px;
      position: relative;
      top: -1px;
      width: 9px;
      height: 9px;
      background-image: url(img/icon_blank.png);
      background-repeat: no-repeat; }

.fan-index-box.is-create .fan-index-box__heading {
  border-color: #00a19c; }
  .fan-index-box.is-create .fan-index-box__heading:before {
    top: 3px;
    margin-right: 10px;
    width: 32px;
    height: 34px;
    background-image: url("img/icon_create.png"); }
    @media screen and (max-width: 767px) {
      .fan-index-box.is-create .fan-index-box__heading:before {
        width: 23px;
        height: 24px;
        background-size: 100% auto; } }

.fan-index-box.is-create .fan-index-box__list li {
  border-color: #c4e9e8; }
  .fan-index-box.is-create .fan-index-box__list li a {
    background-image: url("img/icon_arrow_green.png"); }

.fan-index-box.is-collection .fan-index-box__heading {
  border-color: #d5c800; }
  .fan-index-box.is-collection .fan-index-box__heading:before {
    top: 3px;
    margin-right: 10px;
    width: 36px;
    height: 30px;
    background-image: url(img/icon_collection.png); }
    @media screen and (max-width: 767px) {
      .fan-index-box.is-collection .fan-index-box__heading:before {
        width: 28px;
        height: 24px;
        background-size: 100% auto; } }

.fan-index-box.is-collection .fan-index-box__list li {
  border-color: #eae37d; }
  .fan-index-box.is-collection .fan-index-box__list li a {
    background-image: url(img/icon_arrow_yellow.png); }

.fan-index-box.is-watch .fan-index-box__heading {
  border-color: #cc4073; }
  .fan-index-box.is-watch .fan-index-box__heading:before {
    top: 3px;
    margin-right: 10px;
    width: 30px;
    height: 25px;
    background-image: url(img/icon_watch.png); }
    @media screen and (max-width: 767px) {
      .fan-index-box.is-watch .fan-index-box__heading:before {
        width: 24px;
        height: 20px;
        background-size: 100% auto; } }

.fan-index-box.is-watch .fan-index-box__list li {
  border-color: #f6ccdd; }
  .fan-index-box.is-watch .fan-index-box__list li a {
    background-image: url(img/icon_arrow_pink.png); }

.fan-index-box.is-leisure .fan-index-box__heading {
  border-color: #6647b5; }
  .fan-index-box.is-leisure .fan-index-box__heading:before {
    top: 3px;
    margin-right: 10px;
    width: 40px;
    height: 32px;
    background-image: url(img/icon_leisure.png); }
    @media screen and (max-width: 767px) {
      .fan-index-box.is-leisure .fan-index-box__heading:before {
        width: 30px;
        height: 24px;
        background-size: 100% auto; } }

.fan-index-box.is-leisure .fan-index-box__list li {
  border-color: #d6cdeb; }
  .fan-index-box.is-leisure .fan-index-box__list li a {
    background-image: url(img/icon_arrow_purple.png); }

.fan-index-box.is-learn .fan-index-box__heading {
  border-color: #163e99; }
  .fan-index-box.is-learn .fan-index-box__heading:before {
    top: 3px;
    margin-right: 10px;
    width: 27px;
    height: 32px;
    background-image: url(img/icon_learn.png); }
    @media screen and (max-width: 767px) {
      .fan-index-box.is-learn .fan-index-box__heading:before {
        width: 20px;
        height: 24px;
        background-size: 100% auto; } }

.fan-index-box.is-learn .fan-index-box__list li {
  border-color: #c7d1e7; }
  .fan-index-box.is-learn .fan-index-box__list li a {
    background-image: url(img/icon_arrow_navy.png); }