@charset "UTF-8";
/* line 3, ../sass/list.scss */
.stage * {
  padding: 0;
  margin: 0;
  position: absolute;
  width: 100%;
  height: 100%; }

/* line 11, ../sass/list.scss */
nav.nav-extended {
  position: fixed;
  height: 80px;
  z-index: 999; }

/* line 17, ../sass/list.scss */
nav {
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  opacity: 1;
  height: 80px; }

/* line 28, ../sass/list.scss */
.tabs .tab {
  display: inline-block;
  text-align: center;
  line-height: 80px;
  height: 80px;
  padding: 0;
  margin: 0;
  text-transform: uppercase; }

/* line 38, ../sass/list.scss */
.tabs .tab a {
  font-size: 18px; }

/* line 44, ../sass/list.scss */
body {
  background: #Fefefe;
  font-family: 'ヒラギノ角ゴシック', 'Hiragino Sans', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }

/* line 49, ../sass/list.scss */
.over {
  overflow: hidden; }

/* line 53, ../sass/list.scss */
.overX {
  overflow-x: hidden; }

/* line 58, ../sass/list.scss */
.row .col {
  padding: 0; }

/* line 65, ../sass/list.scss */
.section {
  padding: 0; }

/* line 70, ../sass/list.scss */
.card {
  margin: 0;
  border-radius: 0px;
  overflow: hidden; }

/* line 78, ../sass/list.scss */
.card .card-reveal {
  background-color: rgba(0, 222, 69, 0);
  -webkit-transform: translateY(0%);
  transform: translateY(0%);
  transition-delay: 0.2s;
  transition-duration: 0.5s;
  display: block; }


/* line 78, ../sass/list.scss */
 .card-detail {
  -webkit-transform: translateY(0%);
  transform: translateY(0%);


  display: block; 
}


/* line 92, ../sass/list.scss */
.content-title {
  color: white;
  text-shadow: 2px 2px 0 #9a9a9a, -1px 1px 0 #9a9a9a, 2px 1px 0 #9a9a9a, -1px -1px 0 #9a9a9a;
  font-size: calc(112.5% + 1vw);
  font-weight: 800;
  text-align: center;
  left: 50%;
  top: 15%;
  -webkit-transform: translateY(-15%) translateX(-50%);
  transform: translateY(-15%) translateX(-50%);
  position: absolute;
  width: auto;
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }

/* line 111, ../sass/list.scss */
.close-button {
  position: absolute;
  left: 100%;
  top: 0.3%;
  -webkit-transform: translateY(0%) translateX(-100%);
  transform: translateY(0%) translateX(-100%);
  width: 8%;
  height: 8%;
  cursor: pointer; }

/* line 124, ../sass/list.scss */
.play-button {
  width: 40%;
  height: 40%;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  border-radius: 50%;
  cursor: pointer; }

/* line 135, ../sass/list.scss */
.play-text {
  color: #ffffff;
  text-shadow: 2px 2px 0 #9a9a9a, -1px 1px 0 #9a9a9a, 2px 1px 0 #9a9a9a, -1px -1px 0 #9a9a9a;
  font-size: calc(112.5% + 2vw);
  font-weight: 800;
  text-align: center;
  left: 50%;
  top: 90%;
  -webkit-transform: translateY(-90%) translateX(-50%);
  transform: translateY(-90%) translateX(-50%);
  position: absolute;
  width: auto;
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: 'Jua', sans-serif;
  letter-spacing: 0.2vw; }

/* line 155, ../sass/list.scss */
.item {
  color: #fff;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  -webkit-transform: rotateX(80deg);
  transform: rotateX(80deg);
  -webkit-transform: translateY(1000px);
  transform: translateY(1000px);
  opacity: 0;
  position: relative;

}

/* line 170, ../sass/list.scss */
.visible {
  opacity: 1;
  -webkit-transform: rotateX(0);
  transform: rotateX(0);
  -webkit-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out; }

/* line 182, ../sass/list.scss */
.check-visible {
  opacity: 1;
  bottom: 50%;
  right: 50%;
  transform: translate(50%, 50%);
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out; }

/* line 195, ../sass/list.scss */
* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

/* line 200, ../sass/list.scss */
html,
body {
  height: 100%; }

/* line 205, ../sass/list.scss */
.page {
  height: 100%;
  background-color: #5EC84E;
  overflow: hidden; }

/* line 211, ../sass/list.scss */
.content {
  overflow: scroll;
  height: 100vh;
  /* これを追加 */
  -webkit-transform-origin: top left;
  transform-origin: top left;
  -webkit-transition: -webkit-transform 0.7s cubic-bezier(1, 0.005, 0.24, 1);
  transition: -webkit-transform 0.7s cubic-bezier(1, 0.005, 0.24, 1);
  transition: transform 0.7s cubic-bezier(1, 0.005, 0.24, 1);
  transition: transform 0.7s cubic-bezier(1, 0.005, 0.24, 1), -webkit-transform 0.7s cubic-bezier(1, 0.005, 0.24, 1);
  background-color: #f0f0f0; }

/* line 226, ../sass/list.scss */
.content_height {
  height: 100vh;
  /* これを追加 */ }

/* basically all styling from now on */
/* line 232, ../sass/list.scss */
.menu_toggle {
  z-index: 900;
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  cursor: pointer;
  width: 100px;
  height: 80px;
  background-color: #F6CA06;
  border-bottom-right-radius: 100%;
  -webkit-transform: translateY(-110px) translateX(-110px);
  transform: translateY(-110px) translateX(-110px); }

/* line 248, ../sass/list.scss */
.nav-visible {
  -webkit-transform: translateY(0) translateX(0);
  transform: translateY(0) translateX(0);
  transform: rotate(0);
  opacity: 1;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out; }

/* line 259, ../sass/list.scss */
.menu_toggle:active i {
  opacity: 0.8; }

/* line 262, ../sass/list.scss */
.menu_toggle i {
  color: #f0f0f0; }

/* line 265, ../sass/list.scss */
.menu_toggle .menu_open,
.menu_toggle .menu_close {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -15px;
  margin-left: -12px;
  -webkit-transition: -webkit-transform 0.7s cubic-bezier(1, 0.005, 0.24, 1);
  transition: -webkit-transform 0.7s cubic-bezier(1, 0.005, 0.24, 1);
  transition: transform 0.7s cubic-bezier(1, 0.005, 0.24, 1);
  transition: transform 0.7s cubic-bezier(1, 0.005, 0.24, 1), -webkit-transform 0.7s cubic-bezier(1, 0.005, 0.24, 1); }

/* line 277, ../sass/list.scss */
.menu_toggle .menu_open {
  -webkit-transform-origin: -100px -100px;
  transform-origin: -100px -100px; }

/* line 281, ../sass/list.scss */
.menu_toggle .menu_close {
  -webkit-transform: rotate(20deg);
  transform: rotate(20deg);
  -webkit-transform-origin: -100px -160px;
  transform-origin: -100px -160px; }

/* line 288, ../sass/list.scss */
.menu_items {
  position: fixed;
  bottom: 0;
  left: 50px;
  list-style-type: none;
  margin: 0;
  padding: 0; }


/* line 296, ../sass/list.scss */
.menu_items li {
  height: 60px;
  margin-bottom: 30px;
  -webkit-transform: translateX(-300px);
  transform: translateX(-300px);
  -webkit-transition: -webkit-transform 0.7s 0s cubic-bezier(1, 0.005, 0.24, 1);
  transition: -webkit-transform 0.7s 0s cubic-bezier(1, 0.005, 0.24, 1);
  transition: transform 0.7s 0s cubic-bezier(1, 0.005, 0.24, 1);
  transition: transform 0.7s 0s cubic-bezier(1, 0.005, 0.24, 1), -webkit-transform 0.7s 0s cubic-bezier(1, 0.005, 0.24, 1); }

/* line 306, ../sass/list.scss */
.menu_items li:nth-child(2) {
  margin-left: 40px; }

/* line 309, ../sass/list.scss */
.menu_items li:nth-child(3) {
  margin-left: 80px; }

/* line 312, ../sass/list.scss */
.menu_items a {
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #DCF5D8;
  -webkit-transition: color .2s;
  transition: color .2s; }

/* line 321, ../sass/list.scss */
.menu_items a .icon {
  position: relative;
  display: inline-block;
  margin-right: 25px;
  color: #f0f0f0; }

/* line 327, ../sass/list.scss */
.menu_items a .icon:after {
  position: absolute;
  top: 50%;
  left: 50%;
  content: '';
  display: block;
  width: 60px;
  height: 60px;
  margin-left: -33px;
  margin-top: -32px;
  border-radius: 100%;
  border: 2px solid #f0f0f0;
  -webkit-transition: border-color .2s;
  transition: border-color .2s; }

/* line 342, ../sass/list.scss */
.menu_items a:hover {
  color: #f0f0f0; }

/* line 345, ../sass/list.scss */
.menu_items a:hover .icon:after {
  border-color: #F37272; }

/* line 348, ../sass/list.scss */
.menu_items a:active .icon {
  color: #F37272; }

/* Let's open up the menu */
/* line 353, ../sass/list.scss */
.shazam {
  /*.content_inner {
    height: 100%;
  }*/ }

/* line 358, ../sass/list.scss */
.shazam .content {
  -webkit-transform: rotate(-50deg);
  transform: rotate(-50deg); }


/* line 362, ../sass/list.scss */
.shazam .menu_open {
  -webkit-transform: rotate(-20deg);
  transform: rotate(-20deg); }

/* line 366, ../sass/list.scss */
.shazam .menu_close {
  -webkit-transform: rotate(0);
  transform: rotate(0); }

/* line 370, ../sass/list.scss */
.shazam .menu_items li {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: -webkit-transform 0.35s 0.45s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: -webkit-transform 0.35s 0.45s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: transform 0.35s 0.45s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: transform 0.35s 0.45s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.35s 0.45s cubic-bezier(0.175, 0.885, 0.32, 1.275); }

/* line 378, ../sass/list.scss */
.shazam .menu_items li:nth-child(2) {
  -webkit-transition-delay: .47s;
  transition-delay: .47s; }

/* line 382, ../sass/list.scss */
.shazam .menu_items li:nth-child(3) {
  -webkit-transition-delay: .48s;
  transition-delay: .48s; }

/* line 387, ../sass/list.scss */
h1 {
  padding-bottom: 15px;
  border-bottom: 1px solid #ddd; }

/* line 392, ../sass/list.scss */
body {
  color: #584E4A; }

.row {
  margin-bottom: 100px;
}