@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Open+Sans');

a,a:visited {
	text-decoration: none;
  outline: none;
  color: #ff9c3b;
}
a:hover {
  color: #f42;
  outline: none;
}
a[href*="tel:"] { cursor: default; }

button { outline: none; }

p {
  position: relative;
	margin: 0 0 16px;
  background: url(../img/transparent.png);
}
td { background: url(../img/transparent.png); }

html {
  min-height: 100%;
  font-size: 6.25%;
  overflow-y: scroll;
}
body {
	font: 10rem/1 "Open Sans", "メイリオ", Meiryo, "ＭＳ ゴシック", "MS Gothic", sans-serif;
  background: #000;
  color: #fff;
}
.mac body, .safari body { font-family: "Open Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif; }

h1,h2,h3,h4,h5,h6 {
  margin: 0;
}
ul,ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
dl,dt,dd {margin: 0;}
button {
  padding: 0;
  border: none;
  outline: none;
  background-color: transparent;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
button:active,button:focus {
  border: none;
  outline: none;
}
figure {
  margin: 0;
}
em { font-style: normal; }

.text_center {
  padding: 0 10px 0 0;
  text-align: center;
}
.brackets_mgn {
  margin: 0 -0.2em 0 -0.5em;
}

.new:after {
  content: "";
  position: absolute;
  top: -14px;
  right: -3px;
  display: block;
  width: 62px;
  height: 31px;
  background: url(../img/new.png) 0 0 / 100% auto no-repeat;
  -webkit-animation: bounceNew 1s infinite;
  animation: bounceNew 1s infinite;
}
@-webkit-keyframes bounceNew {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30%, 0);
    transform: translate3d(0, -30%, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15%, 0);
    transform: translate3d(0, -15%, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4%,0);
    transform: translate3d(0,-4%,0);
  }
}
@keyframes bounceNew {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30%, 0);
    transform: translate3d(0, -30%, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15%, 0);
    transform: translate3d(0, -15%, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4%,0);
    transform: translate3d(0,-4%,0);
  }
}

.pop_images {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0 7px 3px;
}
.pop_images.center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.pop_images li {
  position: relative;
  margin: 0 0 21px;
  text-align: left;
}
.pop_images.arrow li:first-child:after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  right: -58px;
  margin: auto 0;
  display: block;
  width: 88.56px;
  height: 73.44px;
  background: url(../img/img_arrow_right.png) 0 0 / 100% auto no-repeat;
  z-index: 10;
}
.pop_images.triangle li:first-child {
  width: 100%;
  text-align: center;
}
.pop {
  position: relative;
  display: inline-block;
  -webkit-box-shadow: 0 0 10px 1px #fff2b2;
  box-shadow: 0 0 10px 1px #fff2b2;
  -webkit-transition: all 0.25s linear;
  -o-transition: all 0.25s linear;
  transition: all 0.25s linear;
  line-height: 0;
}
.pop_images li .pop img {
  width: 302px;
}
.pop:hover {
  -webkit-box-shadow: 0 0 10px 1px #fff;
  box-shadow: 0 0 10px 1px #fff;
}
.pop + .txt {
  display: block;
}
.pop + .txt_center {
  display: block;
  margin: 1px auto 0;
}
.pop_images + .txt {
  margin: -22.6px 0 17px;
  text-align: center;
}
.pop_image_center {
  width: 581px;
  margin: 0 auto 30px;
  line-height: 0;
}
.pop_image_center img {
  width: 581px;
}
.pop_image_center + .txt {
  margin: -24px 0 17px;
  text-align: center;
}
.img_center {
  display: block;
  margin: 0 auto 26px;
}

#wrapper {
  width: 100%;
  overflow: hidden;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.gloNav_bg {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 3000;
}
#gloNav {
  position: relative;
  z-index: 310;
}
#bgmBox {
  position: absolute;
  width: 95px;
  height: 38px;
  background: url(../img/bgm.png) 0 0 / 100% auto no-repeat;
  z-index: 10050;
}
#bgmBox.small {
  background-position: 0 -38px;
}
#bgmBox.large {
  background-position: 0 -76px;
}
#bgmBox button {
  display: inline-block;
  height: 38px;
}
#bgmBox button.btnSwitch {
  width: 59px;
}
#bgmBox button.btnVol {
  width: 33px;
}
.footer_bg {
  position: relative;
  margin: -50px 0 0;
  background: url(../img/bg_footer.png) no-repeat 50% 0;
  z-index: 500;
  background-color: #000;
}
footer {
  position: relative;
  margin: 0 auto;
  overflow: hidden;
}
#nowLoading {
  position: fixed;
  top: 0; right: 0; bottom: 0; left: 0;
  background: #fff;
  z-index: 10000;
  pointer-events: none;
}
.loaded #nowLoading {
  -webkit-animation: fade-out 0.3s linear 0.15s both;
  animation: fade-out 0.3s linear 0.15s both;
}
#nowLoading span {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  display: block;
  width: 423px;
  height: 81px;
  margin: auto;
}
#nowLoading img.back {
  display: block;
  -webkit-animation: blink2 2s ease-in-out infinite;
  animation: blink2 2s ease-in-out infinite;
}
#nowLoading img.over {
  position: absolute;
  top: 0px; left: 0;
  display: block;
  width: 0%;
  height: 81px;
  background: url(../img/nowloading.png) 0 0 no-repeat;
  -webkit-transition: width 0.05s linear;
  -o-transition: width 0.05s linear;
  transition: width 0.05s linear;
}
#secondFrame {
  position: fixed;
  top: 0; right: 0; left: 0;
  height: 100vh;
  font-size: 1px;
  pointer-events: none;
  z-index: 400;
}
#secondFrame .frame_wrap {
  height: 100vh;
}
#secondFrame img.frame {
  position: relative;
  width: 100%;
  height: 100%;
  background: url(../img/bg_second_frame.png) 50% -7vh / auto 149.5vh no-repeat;
  z-index: 20;
}

#secondFrame #canteraLeft {
  position: absolute;
  top: 17vh;
  right: -webkit-calc(50% + 76vh - 100px);
  right: calc(50% + 76vh - 100px);
  width: 200px;
  height: 14%;
}
#secondFrame #canteraRight {
  position: absolute;
  top: 17vh;
  left: -webkit-calc(50% + 76vh - 100px);
  left: calc(50% + 76vh - 100px);
  width: 200px;
  height: 14%;
}
@-webkit-keyframes canteraBright {
  0% {
    -webkit-filter: brightness(1);
    filter: brightness(1);
  }
  to {
    -webkit-filter: brightness(1.18);
    filter: brightness(1.18);
  }
}
@keyframes canteraBright {
  0% {
    -webkit-filter: brightness(1);
    filter: brightness(1);
  }
  to {
    -webkit-filter: brightness(1.18);
    filter: brightness(1.18);
  }
}
#secondFrame #canteraLeft .cantera,
#secondFrame #canteraRight .cantera {
  display: block;
  width: auto;
  height: 100%;
  margin: 0 auto;
  -webkit-transform-origin: 50% 0;
  -ms-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -webkit-animation: canteraBright 1.2s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite alternate both;
  animation: canteraBright 1.2s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite alternate both;
}
#secondFrame #canteraLeft #canteraCanvasL,
#secondFrame #canteraRight #canteraCanvasR,
#secondFrame .butterfly_wrap {
  position: absolute;
  top: 0; right: 0; left: 0;
  height: 200px;
  margin: 0 auto;
  z-index: 10;
}
#secondFrame .butterfly_wrap span {
  position: absolute;
  display: block;
  width: 32px;
  height: 32px;
  opacity: 0;
  -webkit-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
  -webkit-animation: fadeInOut 6.5s linear;
  animation: fadeInOut 6.5s linear;
}
#secondFrame .butterfly_wrap span img {
  display: block;
  width: 32px;
  height: 32px;
  background: url(../img/img_butterfly.png) 0 0 no-repeat;
  -webkit-animation: flapping 0.4s linear infinite;
  animation: flapping 0.4s linear infinite;
}
@-webkit-keyframes fadeInOut {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes fadeInOut {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@-webkit-keyframes flapping {
  0% {
    background-position: 0px 0;
  }
  24.999% {
    background-position: 0px 0;
  }
  25% {
    background-position: -32px 0;
  }
  49.999% {
    background-position: -32px 0;
  }
  50% {
    background-position: -64px 0;
  }
  74.999% {
    background-position: -64px 0;
  }
  75% {
    background-position: -96px 0;
  }
  99.999% {
    background-position: -96px 0;
  }
  to {
    background-position: 0px 0;
  }
}
@keyframes flapping {
  0% {
    background-position: 0px 0;
  }
  24.999% {
    background-position: 0px 0;
  }
  25% {
    background-position: -32px 0;
  }
  49.999% {
    background-position: -32px 0;
  }
  50% {
    background-position: -64px 0;
  }
  74.999% {
    background-position: -64px 0;
  }
  75% {
    background-position: -96px 0;
  }
  99.999% {
    background-position: -96px 0;
  }
  to {
    background-position: 0px 0;
  }
}

#cboxPrevious {
  left: -82px;
  top: -webkit-calc(50% - 40px);
  top: calc(50% - 40px);
  width: 76px;
  height: 80px;
  -webkit-transform-origin: 85% 50%;
  -ms-transform-origin: 85% 50%;
  transform-origin: 85% 50%;
  background: url(../img/arrow_prev.png) 100% 0 no-repeat;
}
#cboxNext {
  right: -82px;
  top: -webkit-calc(50% - 40px);
  top: calc(50% - 40px);
  width: 76px;
  height: 80px;
  -webkit-transform-origin: 15% 50%;
  -ms-transform-origin: 15% 50%;
  transform-origin: 15% 50%;
  background: url(../img/arrow_next.png) 0 0 no-repeat;
}
#cboxClose {
  right: 0px;
  top: -60px;
  width: 52px;
  height: 52px;
  background: url(../img/close.png) 0 0 no-repeat;
}
#cboxPrevious:hover, #cboxNext:hover, #cboxClose:hover {
  opacity: 1;
  -webkit-filter: contrast(1.2);
  filter: contrast(1.2);
  -webkit-animation: hoverAnim 0.22s ease infinite alternate both;
  animation: hoverAnim 0.22s ease infinite alternate both;
}

.mCSB_inside > .mCSB_container {
  margin-right: 2em;
}
.mCSB_scrollTools {
  top: 4px;
  -webkit-transform: rotate(12deg) scale(1.03);
  -ms-transform: rotate(12deg) scale(1.03);
  transform: rotate(12deg) scale(1.03);
  -webkit-transform-origin: 100% 0;
  -ms-transform-origin: 100% 0;
  transform-origin: 100% 0;
  opacity: 1;
}
.mCSB_scrollTools .mCSB_draggerContainer {
  right: 0px;
  width: 14px;
  border-top-color: transparent;
}
.mCSB_scrollTools .mCSB_draggerRail {
  background: transparent;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  width: 12px;
  background: rgb(255,141,49);
  /* background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, rgba(255,141,49,1)),to(rgba(255,203,91,1))); */
  background: -webkit-linear-gradient(top, rgba(255,141,49,1) 1%,rgba(255,203,91,1) 100%);
  background: -o-linear-gradient(top, rgba(255,141,49,1) 1%,rgba(255,203,91,1) 100%);
  background: linear-gradient(to bottom, rgba(255,141,49,1) 1%,rgba(255,203,91,1) 100%);
  -webkit-box-shadow: 0 0 6px 1px #b03120;
  box-shadow: 0 0 6px 1px #b03120;
}

@-webkit-keyframes blink {
  0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes blink {
  0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; }
}

@-webkit-keyframes blink2 {
  0% { opacity: 0.7; }
  50% { opacity: 1; }
  100% { opacity: 0.7; }
}

@keyframes blink2 {
  0% { opacity: 0.3; }
  50% { opacity: 0.6; }
  100% { opacity: 0.3; }
}

@-webkit-keyframes fade-in-out {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes fade-in-out {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes fade-out {
  0% {
    opacity: 1;
    display: block;
  }
  99.99% {
    opacity: 0;
    display: block;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@keyframes fade-out {
  0% {
    opacity: 1;
    display: block;
  }
  99.99% {
    opacity: 0;
    display: block;
  }
  100% {
    opacity: 0;
    display: none;
  }
}

@-webkit-keyframes poyon {
  0%   { -webkit-transform: translate(0%, -100%); transform: translate(0%, -100%); }
  10%  { -webkit-transform: translate(0%, -15%); transform: translate(0%, -15%); }
  20%  { -webkit-transform: translate(0%, 30%); transform: translate(0%, 30%); }
  30%  { -webkit-transform: translate(0%, -10%); transform: translate(0%, -10%); }
  40%  { -webkit-transform: translate(0%, -30%); transform: translate(0%, -30%); }
  50%  { -webkit-transform: translate(0%, -10%); transform: translate(0%, -10%); }
  60%  { -webkit-transform: translate(0%, 5%); transform: translate(0%, 5%); }
  70%  { -webkit-transform: translate(0%, 0%); transform: translate(0%, 0%); }
  100% { -webkit-transform: translate(0%, 0%); transform: translate(0%, 0%); }
}

@keyframes poyon {
  0%   { -webkit-transform: translate(0%, -100%); transform: translate(0%, -100%); }
  10%  { -webkit-transform: translate(0%, -15%); transform: translate(0%, -15%); }
  20%  { -webkit-transform: translate(0%, 30%); transform: translate(0%, 30%); }
  30%  { -webkit-transform: translate(0%, -10%); transform: translate(0%, -10%); }
  40%  { -webkit-transform: translate(0%, -30%); transform: translate(0%, -30%); }
  50%  { -webkit-transform: translate(0%, -10%); transform: translate(0%, -10%); }
  60%  { -webkit-transform: translate(0%, 5%); transform: translate(0%, 5%); }
  70%  { -webkit-transform: translate(0%, 0%); transform: translate(0%, 0%); }
  100% { -webkit-transform: translate(0%, 0%); transform: translate(0%, 0%); }
}

@-webkit-keyframes easeOutBounce {
  0% { -webkit-transform: translate3d(0%, -100%,0); transform: translate3d(0%, -100%,0); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
  33% { -webkit-transform: translate3d(0%, 0%,0); transform: translate3d(0%, 0%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;}
  50% { -webkit-transform: translate3d(0%, -15%,0); transform: translate3d(0%, -15%,0); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
  66% { -webkit-transform: translate3d(0%, 0%,0); transform: translate3d(0%, 0%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;}
  82% { -webkit-transform: translate3d(0%, -3%,0); transform: translate3d(0%, -3%,0); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
  92%,100% { -webkit-transform: translate3d(0%, 0%,0); transform: translate3d(0%, 0%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;}
}

@keyframes easeOutBounce {
  0% { -webkit-transform: translate3d(0%, -100%,0); transform: translate3d(0%, -100%,0); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
  33% { -webkit-transform: translate3d(0%, 0%,0); transform: translate3d(0%, 0%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;}
  50% { -webkit-transform: translate3d(0%, -15%,0); transform: translate3d(0%, -15%,0); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
  66% { -webkit-transform: translate3d(0%, 0%,0); transform: translate3d(0%, 0%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;}
  82% { -webkit-transform: translate3d(0%, -3%,0); transform: translate3d(0%, -3%,0); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
  92%,100% { -webkit-transform: translate3d(0%, 0%,0); transform: translate3d(0%, 0%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;}
}
/*@keyframes easeOutBounce {
0% { -webkit-transform: translate3d(0%, -100%,0); transform: translate3d(0%, -100%,0); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
33% { -webkit-transform: translate3d(0%, 0%,0); transform: translate3d(0%, 0%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;}
50% { -webkit-transform: translate3d(0%, -20%,0); transform: translate3d(0%, -20%,0); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
66% { -webkit-transform: translate3d(0%, 0%,0); transform: translate3d(0%, 0%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;}
82% { -webkit-transform: translate3d(0%, -7%,0); transform: translate3d(0%, -7%,0); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
92% { -webkit-transform: translate3d(0%, 0%,0); transform: translate3d(0%, 0%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;}
97% { -webkit-transform: translate3d(0%, -1.25%,0); transform: translate3d(0%, -1.25%,0); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
100% { -webkit-transform: translate3d(0%, 0%,0); transform: translate3d(0%, 0%,0); }
}*/

@-webkit-keyframes slide-up {
  0% {
    -webkit-transform: translate3d(0, -0%, 0);
    transform: translate3d(0, -0%, 0);
  }
  to {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes slide-up {
  0% {
    -webkit-transform: translate3d(0, -0%, 0);
    transform: translate3d(0, -0%, 0);
  }
  to {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
@-webkit-keyframes arrowDown {
  0% {
    -webkit-transform: translate3d(0,-12px,0);
    transform: translate3d(0,-12px,0);
  }
  to {
    -webkit-transform: translate3d(0,0%,0);
    transform: translate3d(0,0%,0);
  }
}
@keyframes arrowDown {
  0% {
    -webkit-transform: translate3d(0,-12px,0);
    transform: translate3d(0,-12px,0);
  }
  to {
    -webkit-transform: translate3d(0,0%,0);
    transform: translate3d(0,0%,0);
  }
}

@-webkit-keyframes hoverAnim {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  to {
    -webkit-transform: scale(1.17);
    transform: scale(1.17);
  }
}

@keyframes hoverAnim {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  to {
    -webkit-transform: scale(1.13);
    transform: scale(1.13);
  }
}
@-webkit-keyframes bgLoop {
  0% {-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}
  to {-webkit-transform:translate3d(176px,-176px,0);transform:translate3d(176px,-176px,0);}
}
@keyframes bgLoop {
  0% {-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}
  to {-webkit-transform:translate3d(176px,-176px,0);transform:translate3d(176px,-176px,0);}
}
@-webkit-keyframes scaleBounce {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
    transform: scale(1.1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;
  }
  30% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    transform: scale(1.05); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;
  }
  60% {
    -webkit-transform: scale(1.065);
    transform: scale(1.065); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;
  }
  to {
    -webkit-transform: scale(1);
    transform: scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;
  }
}
@keyframes scaleBounce {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
    transform: scale(1.1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;
  }
  30% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    transform: scale(1.05); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;
  }
  60% {
    -webkit-transform: scale(1.065);
    transform: scale(1.065); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;
  }
  to {
    -webkit-transform: scale(1);
    transform: scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;
  }
}
@-webkit-keyframes frameOut {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;
  }
  to {
    opacity: 0;
    -webkit-transform: scale(1.1);
    transform: scale(1.1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;
  }
}
@-webkit-keyframes canteraBounce {
  0% { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  33% { -webkit-transform: rotate(20deg); transform: rotate(20deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  50% { -webkit-transform: rotate(-6.4deg); transform: rotate(-6.4deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  66% { -webkit-transform: rotate(2.56deg); transform: rotate(2.56deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  82% {  -webkit-transform: rotate(-1.24deg);  transform: rotate(-1.24deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  92% { -webkit-transform: rotate(0.41deg); transform: rotate(0.41deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  97% { -webkit-transform: rotate(-0.16deg); transform: rotate(-0.16deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }
}
@-webkit-keyframes canteraRightBounce {
  0% { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  33% { -webkit-transform: rotate(20deg); transform: rotate(20deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  50% { -webkit-transform: rotate(-6.4deg); transform: rotate(-6.4deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  66% { -webkit-transform: rotate(2.56deg); transform: rotate(2.56deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  82% {  -webkit-transform: rotate(-1.24deg);  transform: rotate(-1.24deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  92% { -webkit-transform: rotate(0.41deg); transform: rotate(0.41deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  97% { -webkit-transform: rotate(-0.16deg); transform: rotate(-0.16deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }
}
@keyframes canteraRightBounce {
  0% { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  33% { -webkit-transform: rotate(20deg); transform: rotate(20deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  50% { -webkit-transform: rotate(-6.4deg); transform: rotate(-6.4deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  66% { -webkit-transform: rotate(2.56deg); transform: rotate(2.56deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  82% {  -webkit-transform: rotate(-1.24deg);  transform: rotate(-1.24deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  92% { -webkit-transform: rotate(0.41deg); transform: rotate(0.41deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  97% { -webkit-transform: rotate(-0.16deg); transform: rotate(-0.16deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }
}
@-webkit-keyframes canteraLeftBounce {
  0% { -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  33% { -webkit-transform: rotate(-20deg); transform: rotate(-20deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  50% { -webkit-transform: rotate(6.4deg); transform: rotate(6.4deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  66% { -webkit-transform: rotate(-2.56deg); transform: rotate(-2.56deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  82% { -webkit-transform: rotate(1.24deg); transform: rotate(1.24deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  92% { -webkit-transform: rotate(-0.41deg); transform: rotate(-0.41deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  97% { -webkit-transform: rotate(0.16deg); transform: rotate(0.16deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }
}
@keyframes canteraLeftBounce {
  0% { -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  33% { -webkit-transform: rotate(-20deg); transform: rotate(-20deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  50% { -webkit-transform: rotate(6.4deg); transform: rotate(6.4deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  66% { -webkit-transform: rotate(-2.56deg); transform: rotate(-2.56deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  82% { -webkit-transform: rotate(1.24deg); transform: rotate(1.24deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  92% { -webkit-transform: rotate(-0.41deg); transform: rotate(-0.41deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  97% { -webkit-transform: rotate(0.16deg); transform: rotate(0.16deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;}
  100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }
}
@keyframes frameOut {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;
  }
  to {
    opacity: 0;
    -webkit-transform: scale(1.1);
    transform: scale(1.1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;
  }
}
@-webkit-keyframes subNavArrow {
  0% {
    -webkit-transform: translate3d(-12px,0,0);
    transform: translate3d(-12px,0,0);
  }
  to {
    -webkit-transform: translate3d(0px,0,0);
    transform: translate3d(0px,0,0);
  }
}
@keyframes subNavArrow {
  0% {
    -webkit-transform: translate3d(-12px,0,0);
    transform: translate3d(-12px,0,0);
  }
  to {
    -webkit-transform: translate3d(0px,0,0);
    transform: translate3d(0px,0,0);
  }
}


/* =============================================================================
フロートさせたコンテンツの高さを親要素が認識しないバグを修正　Clearfix
========================================================================== */

/* For modern browsers */
.cf:before, .cf:after {
  content: "";
  display: table;
}

.cf:after { clear: both; }

/* For IE 6/7 (trigger hasLayout) */
.cf { zoom: 1; }

* html .cf { height: 1px;/*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}

.copyright{
  text-align: center;
}

.copyright_img{
  text-align: center;
  margin: 10px;
  margin-bottom: 13px;
  vertical-align: middle;
}

.copyright_img img{
  vertical-align: middle;
  margin-left: 7px;
  margin-right: 7px;
}