@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Barlow+Condensed:700');
/*import module*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}

a, button {
  outline: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

.clearfix:after {
  content: '.';
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

body {
  font-family: "\0030d2\0030e9\0030ae\0030ce\0089d2\0030b4 ProN W3", "Hiragino Kaku Gothic ProN", "Arial", "\006e38\0030b4\0030b7\0030c3\0030af", YuGothic, "\0030e1\0030a4\0030ea\0030aa", Meiryo, 'Barlow Condensed', Arial, sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
      text-size-adjust: 100%;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

button, input, select, textarea {
  min-height: 1.5em;
  background-color: transparent;
}

input[type="submit"], input[type="reset"] {
  cursor: pointer;
}

.fb_iframe_widget > span {
  vertical-align: top !important;
}

html {
  font-size: 100%;
}

body {
  position: relative;
  width: 100%;
  -webkit-text-size-adjust: 100%;
}

body > iframe {
  display: none;
  
}
.pc {
  display: block !important;
}

.sp {
  display: none !important;
}

.eng {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: bold;
}

@media screen and (max-width: 768px) {

  .pc {
    display: none !important;
  }

  .sp {
    display: block !important;
  }

  body {
    width: 100%;
    max-width: 100%;
  }

  img {
    width: 100%;
    height: auto;
    display: block;
  }

}

body {
  overflow-x: hidden;
}

.shutter {
    position: fixed;
    top: 0;
    left: 0;
    width: 200vw;
    height: 100vh;
    z-index: 99;
    pointer-events: none;
    transition: transform .8s ease-in-out;
}
 
.shutter-a {
    transform: translateX(100vw);
}
.shutter-a.moved {
    transform: translateX(-200vw);
    background-color: #fdee17;
}
 
.shutter-b {
    transform: translateX(-200vw);
}
.shutter-b.moved {
    transform: translateX(100vw);
    background-color: #ddd;
}
 

@media only screen and (min-width: 769px) {
  body a {
    -webkit-transition: 0.3s;
    transition: 0.3s;
    &:hover {
      color: #f7ad00;
    }
  }
  #wrapper {
    background: url(../img/pc/bg_repeat.jpg) center;
    position: relative;
    min-width: 1280px;
    margin: auto;
    text-align: center;
    &:before {
      content: " ";
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 116px;
      background: url(../img/pc/header/header_top_repeat.png) repeat-x;
      z-index: 5;
    }
  }
}

@media only screen and (max-width: 768px) {
  #wrapper {
    position: relative;
    margin: auto;
    text-align: center;
    background: url(../img/sp/bg_repeat.jpg) center;
    background-size: 100% auto;
  }
}