@charset "UTF-8";
/* ************************************
 *
 * SCSS Media Queries Mixins
 * 
 * Aauthor   : Ryuichi Nonaka
 * Version   : 0.4.0
 * Copyright : 2012 Ryuichi Nonaka
 * Date      : 2012/11/16
 *
 * Released under the MIT license
 *
 *********************************** */
/* ************************************
 *
 * Device Width 
 * Initialize variables
 *
 *********************************** */
/* ************************************
 *
 * Browser Prefix 
 * Initialize variables
 *
 *********************************** */
/* ************************************
 *
 * Return ratio
 * Initialize variables
 * @param $prefix prefix type
 * @param $ratio device ratio
 *
 *********************************** */
/* ************************************
 *
 * Mobile Device mixin
 * @param $orientation Direction of a device
 * @param $version [old|modern|future|any] The version of a device
 * @param $add_orientation boolean [true|false] add orientation attribute
 *
 * old    : iPhone 3G or 3GS.
 * modern : iPhone 4 or 4S.
 * future : iPhone 5.
 * any    : All version.
 *
 *********************************** */
/* ************************************
 *
 * Tablet Device mixin
 * @param $orientation Direction of a device
 * @param $version [old|modern|any] The version of a device
 * @param $add_orientation boolean [true|false] add orientation attribute
 *
 * old    : iPad 1 or 2 or mini.
 * modern : new iPad (3).
 * any    : All version.
 *
 *********************************** */
/* ************************************
 *
 * Desctop Device mixin
 * @param $size Direction of a device
 * @param $version [modern|future|any] The version of a device
 *
 * Version modern ---------------------
 * narrow  : max width 1024.
 * modern  : max width 1280.
 * wide    : max width 1600.
 * hd      : max width 1920.
 * over    : width 1920 over.
 * ratio   : 1.0
 *
 * Version future ---------------------
 * modern : max width 1280.
 * wide   : max width 1440.
 * ratio  : 2.0
 *
 *********************************** */
/* ************************************
 *
 * Custom Device mixin
 * @param $min_width number(px) Minimum device size
 * @param $max_width number(px) Maximum device size
 * @param $pixel_ratio number Device px ratio
 * @param $add_orientation boolean [true|false] add orientation attribute
 *
 *********************************** */
/* line 6, ../scss/styles.scss */
p {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  -moz-box-shadow: 0, 0, 10px, #a82f34;
  -webkit-box-shadow: 0, 0, 10px, #a82f34;
  box-shadow: 0, 0, 10px, #a82f34;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  opacity: 0.5;
}

@media only screen and (min-width: 0) and (max-width: 320px) and (-webkit-max-device-pixel-ratio: 1) {
  .span3: 120px;
  background-color: #fff;
}
@media only screen and (min-width: 0) and (max-width: 320px) and (-moz-max-device-pixel-ratio: 1) {
  .span3: 120px;
  background-color: #fff;
}
@media only screen and (min-width: 0) and (max-width: 320px) and (-o-max-device-pixel-ratio: 2 / 2) {
  .span3: 120px;
  background-color: #fff;
}
@media only screen and (min-width: 0) and (max-width: 320px) and (-ms-max-device-pixel-ratio: 1) {
  .span3: 120px;
  background-color: #fff;
}
@media only screen and (min-width: 0) and (max-width: 320px) and (max-device-pixel-ratio: 1) {
  .span3: 120px;
  background-color: #fff;
}
/* line 17, ../scss/styles.scss */
html {
  font-size: 10px;
}

/* line 21, ../scss/styles.scss */
body {
  font-family: "Noto Sans Japanese", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
  font-size: 1.4rem;
}

/* line 26, ../scss/styles.scss */
h1 {
  font-size: 6rem;
  font-weight: bold;
}

/* line 31, ../scss/styles.scss */
h2 {
  font-size: 4rem;
  font-weight: bold;
}

/* line 37, ../scss/styles.scss */
h3 {
  font-size: 3rem;
  font-weight: 800;
}

/* line 42, ../scss/styles.scss */
h4 {
  font-size: 2rem;
}

/* line 46, ../scss/styles.scss */
h5 {
  font-size: 1.6rem;
}

/* line 50, ../scss/styles.scss */
h6 {
  font-size: 1.4rem;
}

/* line 55, ../scss/styles.scss */
p, a, span, em {
  font: 1.4rem Arial, sans-serif;
  line-height: 2.1rem;
}

/* line 60, ../scss/styles.scss */
a:focus,
details {
  text-decoration: none;
}

/* line 65, ../scss/styles.scss */
img {
  max-width: 100%;
}

/* line 69, ../scss/styles.scss */
.great-compass {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: 0px 0px 5px #333333;
  -webkit-box-shadow: 0px 0px 5px #333333;
  box-shadow: 0px 0px 5px #333333;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  text-shadow: 0px 0px 1px #aaa;
  -moz-transform: scale(30, 20);
  -ms-transform: scale(30, 20);
  -webkit-transform: scale(30, 20);
  transform: scale(30, 20);
  -webkit-transition: 3s ease-out;
  -moz-transition: 3s ease-out;
  -ms-transition: 3s ease-out;
  -o-transition: 3s ease-out;
  transition: 3s ease-out;
}

/* line 81, ../scss/styles.scss */
#news_block {
  border-top: 6px solid #01a0e9;
  display: block;
}

/* line 86, ../scss/styles.scss */
#news_block p {
  opacity: 0.7;
  box-shadow: 1px;
  color: #fff;
}
/* line 90, ../scss/styles.scss */
#news_block p span {
  color: #000;
  font-weight: bold;
}

/* line 96, ../scss/styles.scss */
.test {
  color: #000;
  background: #BF6667;
  border-radius: 5px;
}
/* line 100, ../scss/styles.scss */
.test span {
  appearance: none;
  color: #e60012;
}

/* line 106, ../scss/styles.scss */
.kkk {
  -webkit-transition: 3s ease-out;
  -moz-transition: 3s ease-out;
  -ms-transition: 3s ease-out;
  -o-transition: 3s ease-out;
  transition: 3s ease-out;
  padding: 30px;
  background-color: #fff;
}
/* line 110, ../scss/styles.scss */
.kkk:hover {
  font-size: 30px;
}

/* line 118, ../scss/styles.scss */
.container {
  width: 100%;
  box-sizing: border-box;
}
@media (min-width: 1170px) {
  /* line 118, ../scss/styles.scss */
  .container {
    width: 1170px;
    max-width: 1170px;
    margin: 0 auto;
  }
}

/* line 128, ../scss/styles.scss */
.section {
  padding-bottom: 5rem;
  overflow: hidden;
}

/* line 133, ../scss/styles.scss */
.section + .section {
  padding-bottom: 10rem;
}

/* line 138, ../scss/styles.scss */
.section .ttl02 span {
  padding-left: 1rem;
  font-size: 1.6rem;
  color: #e60012;
}

/* line 148, ../scss/styles.scss */
#list ul li a {
  padding: 1rem;
  display: block;
  line-height: 1.8rem;
  float: left;
}
/* line 153, ../scss/styles.scss */
#list ul li a span {
  vertical-align: middle;
}
/* line 156, ../scss/styles.scss */
#list ul li a time {
  width: 5%;
  min-width: 80px;
  padding-right: 1rem;
  display: inline-block;
}
/* line 162, ../scss/styles.scss */
#list ul li a .category {
  width: 9vw;
  display: inline-block;
  border-radius: 5px;
  padding: .7rem;
  margin-right: 1rem;
}
/* line 168, ../scss/styles.scss */
#list ul li a .detail {
  width: 100%;
  display: inline-block;
}

/* line 184, ../scss/styles.scss */
#btn ul {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  width: 100%;
  justify-content: space-between;
}
@media (max-width: 768px) {
  /* line 184, ../scss/styles.scss */
  #btn ul {
    flex-direction: column;
  }
}
/* line 195, ../scss/styles.scss */
#btn ul li {
  width: 49%;
  box-sizing: border-box;
  text-align: center;
}
@media (max-width: 768px) {
  /* line 195, ../scss/styles.scss */
  #btn ul li {
    width: 100%;
    margin-bottom: 2rem;
  }
}
/* line 203, ../scss/styles.scss */
#btn ul li a {
  color: #fff;
  text-decoration: none;
  overflow: hidden;
  display: block;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  background-color: #e60012;
  border-radius: 30px;
  background-color: #e60012;
  padding: 2rem;
}
/* line 212, ../scss/styles.scss */
#btn ul li a:hover {
  background-color: #b3000e;
}

/* line 220, ../scss/styles.scss */
.thumbnail_area ul, .thumbnail, .thumbnail2, .thumbnail3 {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}

/* line 229, ../scss/styles.scss */
.thumbnail a {
  padding-left: 1rem;
  text-decoration: none;
}
/* line 232, ../scss/styles.scss */
.thumbnail a em {
  display: block;
  padding-bottom: 1rem;
  color: #777;
  font-weight: bold;
}
/* line 238, ../scss/styles.scss */
.thumbnail a:first-child {
  padding-left: 0;
}
/* line 241, ../scss/styles.scss */
.thumbnail a:last-child {
  width: calc(100% - 260px);
}

/* line 247, ../scss/styles.scss */
.thumbnail2 {
  padding-left: 3rem;
}
/* line 249, ../scss/styles.scss */
.thumbnail2:first-child {
  padding-left: 0;
}
/* line 252, ../scss/styles.scss */
.thumbnail2 a {
  padding-left: 1rem;
  text-decoration: none;
}
/* line 255, ../scss/styles.scss */
.thumbnail2 a:last-child {
  width: calc(100% - 260px);
}
/* line 258, ../scss/styles.scss */
.thumbnail2 a em {
  display: block;
  padding-bottom: 1rem;
  color: #777;
  font-weight: bold;
}
/* line 264, ../scss/styles.scss */
.thumbnail2 a:first-child {
  padding-left: 0;
}

/* line 272, ../scss/styles.scss */
.thumbnail3 {
  padding-left: 3rem;
  flex-direction: column;
}
/* line 275, ../scss/styles.scss */
.thumbnail3:first-child {
  padding-left: 0;
}
/* line 278, ../scss/styles.scss */
.thumbnail3 a {
  text-decoration: none;
}
/* line 280, ../scss/styles.scss */
.thumbnail3 a:first-child {
  padding-left: 1rem;
}
/* line 283, ../scss/styles.scss */
.thumbnail3 a em {
  display: block;
  padding-bottom: 1rem;
  color: #777;
  font-weight: bold;
}
/* line 289, ../scss/styles.scss */
.thumbnail3 a:first-child {
  padding-left: 0;
}

/* line 299, ../scss/styles.scss */
.section details:hover {
  cursor: pointer;
}
/* line 302, ../scss/styles.scss */
.section details ul {
  background-color: #f1f1f1;
  padding: 1rem;
}

/* line 311, ../scss/styles.scss */
#folding ul li {
  display: inline-block;
}

/* line 318, ../scss/styles.scss */
.custm {
  background: linear-gradient(rgba(0, 0, 0, 0) 75%, #b4cc14 70%);
  font-size: 2.5rem;
}

@media screen and (max-width: 768px) {
  /* line 324, ../scss/styles.scss */
  .container {
    box-sizing: border-box;
    padding: 0 15px 0 15px;
  }
}
@media screen and (max-width: 768px) and (max-width: 768px) {
  /* line 324, ../scss/styles.scss */
  .container {
    width: 100%;
    max-width: 100%;
  }
}

@media screen and (max-width: 768px) {
  /* line 336, ../scss/styles.scss */
  #list ul li a .category {
    width: 30vw;
  }
  /* line 339, ../scss/styles.scss */
  #list ul li a .detail {
    width: 100%;
    padding-top: .5rem;
  }

  /* line 347, ../scss/styles.scss */
  .thumbnail_area ul {
    flex-wrap: wrap;
    width: 100%;
  }
  /* line 350, ../scss/styles.scss */
  .thumbnail_area ul .thumbnail, .thumbnail_area ul .thumbnail2, .thumbnail_area ul .thumbnail3 {
    flex-direction: column;
    padding-left: 0;
  }
  /* line 353, ../scss/styles.scss */
  .thumbnail_area ul .thumbnail a, .thumbnail_area ul .thumbnail2 a, .thumbnail_area ul .thumbnail3 a {
    padding-left: 0;
  }
  /* line 355, ../scss/styles.scss */
  .thumbnail_area ul .thumbnail a figure, .thumbnail_area ul .thumbnail2 a figure, .thumbnail_area ul .thumbnail3 a figure {
    text-align: center;
  }
  /* line 362, ../scss/styles.scss */
  .thumbnail_area ul .thumbnail a:last-child {
    width: 100%;
  }
  /* line 367, ../scss/styles.scss */
  .thumbnail_area ul .thumbnail2 {
    padding-top: 1rem;
  }
  /* line 370, ../scss/styles.scss */
  .thumbnail_area ul .thumbnail2 a:last-child {
    width: 100%;
  }
}
/* line 379, ../scss/styles.scss */
.form_area {
  font-size: "Noto Sans Japanese", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
}

@media screen and (min-width: 970px) {
  /* line 385, ../scss/styles.scss */
  .stack input {
    width: 100%;
  }
  /* line 388, ../scss/styles.scss */
  .stack label {
    margin-left: 1rem;
  }
}
/* グラデーションで隠したテキストを「もっと見る」でスライド表示
---------------------------------------------------------- */
/* line 398, ../scss/styles.scss */
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes slideDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes slideDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
/* line 428, ../scss/styles.scss */
.slide-down {
  -webkit-animation-name: slideDown;
  animation-name: slideDown;
}

@-webkit-keyframes slideUp {
  0% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@keyframes slideUp {
  0% {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
/* line 452, ../scss/styles.scss */
.slide-up {
  -webkit-animation-name: slideUp;
  animation-name: slideUp;
}

/* line 456, ../scss/styles.scss */
.content-wrap {
  height: 150px;
  overflow: hidden;
  position: relative;
  margin: 0;
}

/* line 462, ../scss/styles.scss */
.close-btn, .more-btn {
  display: block;
  width: 100%;
  padding: 80px 0 0;
  position: absolute;
  bottom: 0;
  left: 0;
  text-align: center;
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, white 60%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, white 60%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffff 60%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=0 );
}

/* line 491, ../scss/styles.scss */
.close-btn {
  background: none;
}

/* line 494, ../scss/styles.scss */
.slide-up {
  height: 150px;
  padding-bottom: 0;
  overflow: hidden;
}

/* line 499, ../scss/styles.scss */
.slide-down {
  height: auto;
  overflow: visible;
  padding-bottom: 50px;
}

/* line 504, ../scss/styles.scss */
.more-btn p {
  display: inline-block;
  color: #fff;
  cursor: pointer;
  background: #29B6F6;
  padding: 5px 20px;
  width: 80%;
  border-radius: 20px;
}

/* line 513, ../scss/styles.scss */
.close-btn {
  padding: 0;
}

/* line 516, ../scss/styles.scss */
.close-btn p {
  background: #aaa;
}

/* line 520, ../scss/styles.scss */
.close {
  float: none;
}