@charset "utf-8";
/* CSS Document */

/* ------------------------------- */
/* Mainvisual */
/* ------------------------------- */

.mainvisual {
 position: relative;
 height: 650px;
}

.mainvisual .bg {
 background-image: url(/img/site/index/mainvisual/img01.jpg);
}

.mainvisual section {
 position: relative;
 left: 0;
 top: 40px;
}

.mainvisual .text-center {
 display: inline-block;
}

/* タイトルをテキストにする場合
.mainvisual h2 {
 color: #333333;
 font-size: 26px;
 font-weight: bold;
 text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,
             -2px 2px 0 #FFF, 2px -2px 0 #FFF,
             0px 2px 0 #FFF,  0-2px 0 #FFF,
             -2px 0 0 #FFF, 2px 0 0 #FFF;
}

.mainvisual h2 span {
 display: block;
 color: #14A73B;
 font-size: 50px;
 font-weight: normal;
 line-height: 1;
}

.mainvisual p {
 margin-top: 30px;
 color: #14A73B;
 font-size: 28px;
 font-weight: bold;
 text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,
             -2px 2px 0 #FFF, 2px -2px 0 #FFF,
             0px 2px 0 #FFF,  0-2px 0 #FFF,
             -2px 0 0 #FFF, 2px 0 0 #FFF;
}
*/

.mainvisual a {
 margin-top: 30px;
 padding: 10px 20px;
 font-size: 18px;
 font-weight: bold;
}

@media (max-width: 767px) {
 .mainvisual {
  height: 500px;
 }

 .mainvisual .bg {
  background-image: url(/img/site/index/mainvisual/img01_sp.jpg);
  background-position: top;
 }
 
 .mainvisual h2 {
  font-size: 20px;
 }
 
 .mainvisual h2 span {
  font-size: 40px;
 }

 .mainvisual p {
  font-size: 22px;
 }
 
 .mainvisual a {
  margin-top: 20px;
 }
}


/* ------------------------------- */
/* Title */
/* ------------------------------- */

h2.title {
 position: relative;
 margin-top: 30px;
 margin-bottom: 20px;
 padding: 0 0 3px 52px;
 color: #14A73B;
 font-size: 34px;
 font-weight: bold;
 border-bottom: 2px solid #14A73B;
}

h2.title span {
 margin-left: 20px;
 color: #333;
 font-size: 18px;
}

h2.title img {
 position: absolute;
 top: -32px;
 left: -2px;
}

@media (max-width: 767px) {
 h2.title {
  padding-left: 34px;
  font-size: 26px;
 }

 h2.title img {
  width: 30px;
  top: -12px;
 }
}


/* ------------------------------- */
/* Notice */
/* ------------------------------- */

#notice a {
 display: block;
 margin: 30px 0;
 padding: 20px;
 color: red;
 font-size: 34px;
 font-weight: bold;
 text-align: center;
 text-decoration: underline;
 border: 3px solid red;
}

#notice a:hover {
 text-decoration: underline !important;
}

@media (max-width: 767px) {
 #notice a {
  font-size: 28px;
 }
}


/* ------------------------------- */
/* Topics */
/* ------------------------------- */

#news .news {
 overflow-y: scroll;
 max-height: 350px;
 font-size: 16px;
}

#news .news dl {
 margin-bottom: 10px;
 padding-bottom: 5px;
 border-bottom: 1px dashed #333;
}

#news .news dl dt {
 color: #14A73B;
}

#news .news dl dd {
  margin-bottom: 5px;
}

#news .news dl dd a:link,
#news .news dl dd a:visited,
#news .news dl dd a:active {
 color: #333;
}

#news .news dl dd a:hover {
 color: #14A73B;
}

#news .link {
 margin-top: 20px;
}

#news .link a {
 display: block;
 margin-bottom: 10px;
}

/* ------------------------------- */
/* Now Open */
/* ------------------------------- */

#nowopen h3 {
 margin-top: 20px;
 font-size: 36px;
 font-weight: bold;
 text-align: center;
}

/* Number */

/* Black */
#nowopen .number {
 display: block;
 margin-top: 20px;
 border: 3px solid #333;
}

#nowopen .number:hover,
#nowopen .number:link,
#nowopen .number:visited,
#nowopen .number:active {
 color: #333;
 text-decoration: none;
}

/* Green */
#nowopen .number.member {
  color: #14A73B;
  border: 3px solid #14A73B;
}

#nowopen .number.member:hover,
#nowopen .number.member:link,
#nowopen .number.member:visited,
#nowopen .number.member:active {
  color: #14A73B;
  text-decoration: none;
}

#nowopen .number table {
  width: 100%;
  line-height: 1;
}

#nowopen .number table th {
 width: 195px;
 color: #FFF;
 font-size: 20px;
 font-weight: bold;
 line-height: 1.5;
 text-align: center;
 background: #333;
}

#nowopen .number.member table th {
 background: #14A73B;
}

#nowopen .number table td {
 padding: 20px 10px;
 font-size: 20px;
 text-align: right;
}

#nowopen .number table .count span {
 font-size: 50px;
 font-weight: bold;
}

@media (max-width: 767px) {
 #nowopen h3 {
  font-size: 28px;
 }
}


/* ------------------------------- */
/* Search */
/* ------------------------------- */

#search section > section {
 margin-bottom: 60px;
}

#search .search-title {
 display: flex;
 align-items: center;
 color: #14A73B;
 font-size: 22px;
 font-weight: bold;
 text-shadow:
   2px  2px 1px #ffffff,
  -2px  2px 1px #ffffff,
   2px -2px 1px #ffffff,
  -2px -2px 1px #ffffff,
   2px  0px 1px #ffffff,
   0px  2px 1px #ffffff,
  -2px  0px 1px #ffffff,
   0px -2px 1px #ffffff;
}

#search .search-title img {
 margin-right: 5px;
}

@media (max-width: 767px) {
 #search .search-title {
  font-size: 18px;
 }
}


/* Text */

#text-search {
 padding: 30px;
 background: url(/img/site/index/bg_searchtext.jpg) no-repeat;
}

#text-search h2 {
 display: flex;
 align-items: center;
 color: #14A73B;
 font-size: 60px;
 font-weight: bold;
 text-shadow:
   2px  2px 1px #ffffff,
  -2px  2px 1px #ffffff,
   2px -2px 1px #ffffff,
  -2px -2px 1px #ffffff,
   2px  0px 1px #ffffff,
   0px  2px 1px #ffffff,
  -2px  0px 1px #ffffff,
   0px -2px 1px #ffffff;
}

#text-search h2 img {
 margin-left: 20px;
}

#text-search p {
 margin-bottom: 40px;
 color: #333;
 font-size: 30px;
 font-weight: bold;
 text-shadow:
   2px  2px 1px #ffffff,
  -2px  2px 1px #ffffff,
   2px -2px 1px #ffffff,
  -2px -2px 1px #ffffff,
   2px  0px 1px #ffffff,
   0px  2px 1px #ffffff,
  -2px  0px 1px #ffffff,
   0px -2px 1px #ffffff;
}

@media (max-width: 767px) {
 #text-search h2 {
  margin-bottom: 10px;
  font-size: 40px;
 }

 #text-search h2 img {
  height: 50px;
 }

 #text-search p {
  margin-bottom: 20px;
  font-size: 20px;
 }

 #text-search .submit-button {
  padding: 0;
 }

 #text-search .submit-button .btn {
  padding: 13px;
 }
}

/* Area */

#area-search {
 padding: 30px;
 background: url(/img/site/index/bg_searcharea.jpg) no-repeat;
 background-size: cover;
}

#area-search .img-responsive {
 display: inline-block;
}

/* Area Search Button */

#area-search .area {
 position: relative;
 margin-bottom: 20px;
}

#area-search h3 {
 display: block;
 margin-top: 10px;
 margin-bottom: 10px;
 padding: 10px 20px;
 color: #FFF;
 font-size: 30px;
 font-weight: bold;
}

/* IE Hack */
@media all and (-ms-high-contrast:none) {
 #area-search h3 {
  padding: 15px 20px 5px 20px;
 }
}

#area-search h3.green {
 background-color: #14A73B;
}

#area-search h3.blue {
 background-color: #008CE8;
}

#area-search .area a.btn {
 width: 230px;
 padding: 8px 20px;
}

#area-search a {
 margin: 6px 0;
 font-size: 18px;
 font-weight: bold;
 text-align: left;
}

#area-search a img {
 margin-right: 10px;
}

#area-search .map {
 position: absolute;
 top: 0;
 right: 0;
 width: 50%;
}

#area-search .other {
 text-align: center;
}

#area-search .other .btn {
 text-align: center;
 padding: 8px 20px;
}

@media (max-width: 991px) {
 #area-search .area {
  height: 300px;
 }
}

@media (max-width: 767px) {
 #area-search {
  text-align: center;
 }
 #area-search h3 {
  display: block;
  margin-bottom: 10px;
  font-size: 30px;
 }
 #area-search .area {
  height: auto;
 }
 #area-search a {
  margin: 5px;
  width: auto;
  font-size: 14px;
 }
 #area-search a img {
  width: 20px;
  height: 20px;
 }
 #area-search a.btn {
  width: 100%;
  padding: 10px;
 }
 #area-search .map {
  position: static;
  width: 100%;
 }
 #area-search .map img {
  width: 50%;
 }
}

@media (max-width: 991px) {
 #area-search .bg {
  padding: 10px;
 }
}

@media (max-width: 767px) {
 #area-search .bg {
  padding: 20px 10px;
 }
}

/* Railway & Category */

#railway-category-search {
 display: flex;
}

#railway-category-search h2 {
 margin-bottom: 20px;
}

/* Railway */

#railway-search {
 width: 220px;
 padding: 20px;
 text-align: center;
 background-color: #E1F0E4;
}

#railway-search > div a {
 display: inline-block;
 padding: 5px;
 text-align: center;
}

#railway-search > div a img {
 width: 95px;
}


/* Category */

#category-search {
 padding: 20px;
}

#category-search > div {
 display: flex;
 justify-content: flex-start;
 flex-wrap: wrap;
}

#category-search > div a {
 display: inline-block;
 padding: 5px;
 width: 14%;
 text-align: center;
}

#category-search > div a img {
 width: 90%;
}

@media (max-width: 1200px) {
 #category-search > div a {
  width: auto;
 }
}

@media (max-width: 767px) {
 #railway-category-search {
  display: block;
 }

 #category-search > div {
  justify-content: space-between;
 }

 #railway-search {
  width: auto;
 }
}


/* Area Search Map */
/*
.search .map {
 padding: 20px;
}

@media (max-width: 767px) {
 .search .map {
  padding: 0 10px 10px 10px;
 }
}
*/

/* Station */

/* Station Search Box */
/*
.search-box {
 margin-top: 40px;
}

.search-box .search-title {
 margin-bottom: 10px;
 padding: 10px 20px;
 color: #FFF;
 font-size: 20px;
 background-color: #14a73b;
}
*/
/* Station */
/*
.line-list {
 display: flex;
 flex-wrap: wrap;
}

.line-list .line {
 width: 40%;
 margin-right: 20px;
}
*/
/*
.line-list .line .line-name {
 display: block;
 margin-top: 20px;
 padding: 8px 14px;
 color: #14a73b;
 font-size: 18px;
 border: 2px solid #14a73b;
 border-radius: 4px;
 cursor: pointer;
}

.line-list .line .line-name i {
 width: 20px;
 font-size: 24px;
}

.line-list .line ul {
 margin-left: 50px;
 list-style: disc outside;
}

.line-list .line ul li {
 margin-top: 10px;
 font-size: 16px;
}

@media (max-width: 767px) {
 .line-list .line .line-name {
  font-size: 12px;
 }

 .line-list .line .line-name i {
  width: 8px;
  font-size: 12px;
 }

 .line-list .line ul {
  margin-left: 20px;
 }

 .line-list .line ul li {
  font-size: 12px;
 }
}
*/

/* ------------------------------- */
/* Pickup */
/* ------------------------------- */

#pickup h2 {
 margin-bottom: 10px;
 padding: 10px 20px;
 color: #FFF;
 font-size: 18px;
 font-weight: bold;
 background: #14A73B;
}

/* Pickup Slide  */

#pickup .pickup-slide a:link,
#pickup .pickup-slide a:visited,
#pickup .pickup-slide a:hover,
#pickup .pickup-slide a:active {
 color: #333;
 text-decoration: none;
}

#pickup .pickup-slide .photo {
  overflow: hidden;
  position: relative;
  height: 270px;
}

#pickup .pickup-slide .photo img {
 position: absolute;
 top: 50%;
 left: 50%;
 -webkit-transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
}

#pickup .pickup-slide .photo .bg {
 position: absolute;
 bottom: 0;
 right: 0;
 padding: 10px 20px;
 color: #FFF;
 background-color: rgba(0,0,0,0.8);
}

#pickup .pickup-slide .photo .type {
 margin-bottom: 5px;
 padding: 5px 10px;
 font-size: 16px;
 text-align: center;
 border: 1px solid #FFF;
}

#pickup .pickup-slide .photo .price span {
 margin-right: 5px;
 font-size: 24px;
 font-weight: bold;
}

#pickup .pickup-slide .description {
 padding: 10px;
}

#pickup .pickup-slide .description h3 {
 margin-bottom: 10px;
 font-size: 16px;
 font-weight: bold;
}

#pickup .pickup-slide .description p {
 margin-bottom: 5px;
}

#pickup .link-button {
 margin-top: 40px;
 text-align: center;
}


/* ------------------------------- */
/* Link */
/* ------------------------------- */

#link a {
 display: block;
 margin-bottom: 30px;
 text-align: center;
}

#link a img {
 display: inline-block;
 margin-bottom: 7px;
}