/* reset
----------------------------------------------- */
/* clear */
/* html
----------------------------------------------- */
/* body
----------------------------------------------- */
body {
  margin: 0;
  padding: 0;
  color: #636363;
  font-family: "Noto Sans Japanese", sans-serif;
  font-weight: 400;
}

a {
  color: #636363;
}

/* loading
----------------------------------------------- */
#loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  z-index: 50;
}

#loading .logo {
  position: absolute;
  top: 50%;
  left: 0;
  margin: -30px 0 0;
  width: 100%;
  text-align: center;
}

#loading .logo img {
  width: auto;
  height: 40px;
}

#loading .bar {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 20px 0 0 -50px;
  width: 100px;
  height: 1px;
  background: #e6e6e6;
  overflow: hidden;
}

#loading .progress {
  margin: 0 0 0 -100px;
  width: 100%;
  height: 1px;
  background: #033300;
  transform: translateX(-100px);
}

#loading .status {
  position: absolute;
  left: 0;
  bottom: 25px;
  width: 100%;
  font-size: 12px;
  text-align: center;
}

/* complete */
#loading.complete {
  opacity: 0;
  transition: opacity 1s cubic-bezier(0.165, 0.84, 0.44, 1) 1s;
}

#loading.complete .logo {
  opacity: 0;
  transition: opacity 0.5s cubic-bezier(0.77, 0, 0.175, 1) 0.5s;
}

#loading.complete .bar {
  margin: 20px 0 0 50px;
  width: 0px;
  transition-property: width, margin;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
}

/* pc
----------------------------------------------- */
@media print, screen and (min-width: 960px) {
  /* header
  ----------------------------------------------- */
  #header {
    position: fixed;
    top: 23px;
    left: 29px;
    z-index: 12;
  }
  /* footer
  ----------------------------------------------- */
  #footer {
    position: relative;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 142px;
    overflow: hidden;
    z-index: 5;
  }
  #footer p {
    text-align: center;
  }
  #footer .logo {
    padding: 38px 0 0;
  }
  #footer .copyright {
    padding: 28px 0 0;
    font-size: 12px;
  }
  #footer figure {
    position: absolute;
    bottom: 0;
  }
  #footer .image01 {
    left: 0;
  }
  #footer .image02 {
    right: 0;
  }
  /* nav
  ----------------------------------------------- */
  #nav .inner {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    z-index: 11;
  }
  #nav ul {
    position: absolute;
    top: 44%;
    left: 50%;
    margin: -120px 0 0 -200px;
    width: 400px;
    text-align: center;
    border-bottom: 1px solid #b5b5b5;
  }
  #nav li {
    border-top: 1px solid #b5b5b5;
  }
  #nav li a {
    display: flex;
    align-items: center;
    height: 68px;
  }
  #nav li a img {
    margin: auto;
    transition: opacity 0.25s;
  }
  #nav li a:hover img {
    opacity: 0.5;
  }
  #nav .menu_open,
  #nav .menu_close {
    position: fixed;
    top: 12px;
    right: 30px;
    z-index: 10;
    cursor: pointer;
    transition: opacity 0.25s;
  }
  #nav .menu_open:hover,
  #nav .menu_close:hover {
    opacity: 0.7;
  }
  #nav .menu_close {
    display: none;
    z-index: 11;
  }
  /* open */
  #nav.open .inner {
    display: block;
  }
  #nav.open .menu_close {
    display: block;
  }
  /* pageup
  ----------------------------------------------- */
  #pageup {
    position: fixed;
    right: 50px;
    bottom: 50px;
    cursor: pointer;
    z-index: 6;
    transform: translateY(125px);
    transition-property: transform;
    transition-duration: 0.5s;
    transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  #pageup.on {
    transform: translateY(0);
    transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  #pageup span {
    transition: opacity 0.25s;
  }
  #pageup:hover span {
    opacity: 0.7;
  }
  /* getpdf
  ----------------------------------------------- */
  .getpdf {
    margin: 40px 0 0;
    text-align: center;
  }
  .getpdf a {
    display: block;
    position: relative;
    margin: auto;
    max-width: 500px;
    height: 70px;
    color: #fff;
    font-size: 24px;
    font-weight: 300;
    text-decoration: none;
    line-height: 70px;
    background: #007157;
    border-radius: 10px;
    transition: background 0.25s;
  }
  .getpdf a:hover {
    background: #005339;
  }
  .getpdf a:after {
    display: inline-block;
    content: "";
    margin: -6px 0 0;
    width: 28px;
    height: 32px;
    vertical-align: middle;
    background: url(/sp/irojiten/assets/images/artstudio/ic_pdf_white.svg) no-repeat;
    background-size: 28px 32px;
  }
  .getpdf .caution {
    margin: auto !important;
    padding: 10px 0 0 !important;
    max-width: 500px;
    font-size: 18px !important;
    font-weight: 200;
    text-align: right !important;
  }
  /* dark */
  .getpdf.dark a {
    max-width: 440px;
    font-size: 20px;
    background: #033300;
    font-family: "Noto Sans Japanese", sans-serif;
    font-weight: 400;
  }
  .getpdf.dark a:hover {
    background: #001e00;
  }
  .getpdf.dark a:after {
    margin-left: 20px;
  }
  .getpdf.dark .caution {
    max-width: 440px;
    font-family: "Noto Sans Japanese", sans-serif;
    font-weight: 400;
  }
}
/* tablet
----------------------------------------------- */
/* mobile
----------------------------------------------- */
@media only screen and (max-width: 959px) {
  /* header
  ----------------------------------------------- */
  #header {
    position: fixed;
    top: 20px;
    left: 24px;
    z-index: 12;
  }
  #header h1 img {
    width: auto;
    height: 23px;
  }
  /* footer
  ----------------------------------------------- */
  #footer {
    position: relative;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 138px;
    overflow: hidden;
    z-index: 5;
  }
  #footer p {
    text-align: center;
  }
  #footer .logo {
    padding: 38px 0 0;
  }
  #footer .copyright {
    padding: 35px 0 0;
    font-size: 10px;
  }
  #footer .copyright img {
    width: auto;
    height: 39px;
  }
  #footer figure {
    position: absolute;
    top: 50%;
  }
  #footer .image01 {
    left: 0;
    margin: -60px 0 0;
  }
  #footer .image01 img {
    width: auto;
    height: 100px;
  }
  #footer .image02 {
    right: 0;
    margin: -30px 0 0;
  }
  #footer .image02 img {
    width: auto;
    height: 90px;
  }
  /* nav
  ----------------------------------------------- */
  #nav .inner {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0);
    pointer-events: none;
    z-index: 11;
  }
  #nav ul {
    position: absolute;
    top: 64px;
    left: 0;
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #b5b5b5;
    pointer-events: none;
    opacity: 0;
  }
  #nav li {
    border-top: 1px solid #b5b5b5;
  }
  #nav li a {
    display: flex;
    align-items: center;
    height: 58px;
  }
  #nav li a img {
    margin: auto;
    width: auto;
    height: 19px;
  }
  #nav li:nth-child(3) img {
    height: 32px;
  }
  #nav li:nth-child(4) img {
    height: 30px;
  }
  #nav .menu_open,
  #nav .menu_close {
    position: fixed;
    top: 15px;
    right: 15px;
    z-index: 10;
    cursor: pointer;
  }
  #nav .menu_open img,
  #nav .menu_close img {
    width: auto;
    height: 25px;
  }
  #nav .menu_close {
    z-index: 11;
    transform: scale3d(0, 0, 0);
  }
  /* ready */
  #nav.ready .inner,
  #nav.ready ul,
  #nav.ready .menu_close {
    transition-property: opacity, transform, background;
    transition-duration: 0.5s;
    transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  #nav.ready .menu_close {
    transition-duration: 0.25s;
  }
  /* open */
  #nav.open .inner {
    background: rgba(255, 255, 255, 0.9);
    pointer-events: all;
  }
  #nav.open ul {
    pointer-events: all;
    opacity: 1;
  }
  #nav.open .menu_close {
    transform: scale3d(1, 1, 1);
  }
  /* pageup
  ----------------------------------------------- */
  #pageup {
    position: fixed;
    right: 20px;
    bottom: 50px;
    cursor: pointer;
    z-index: 6;
    transform: translateY(125px);
    transition-property: transform;
    transition-duration: 0.5s;
    transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  #pageup.on {
    transform: translateY(0);
    transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  #pageup span img {
    width: 70px;
    height: 70px;
  }
  /* getpdf
  ----------------------------------------------- */
  .getpdf {
    margin: 30px auto 0;
    max-width: 375px;
    text-align: center;
  }
  .getpdf a {
    display: block;
    position: relative;
    margin: 0 20px;
    height: 50px;
    color: #fff;
    font-size: 15px;
    font-weight: 300;
    text-decoration: none;
    line-height: 50px;
    background: #007157;
    border-radius: 10px;
  }
  .getpdf a:after {
    display: inline-block;
    content: "";
    width: 18px;
    height: 21px;
    vertical-align: middle;
    background: url(/sp/irojiten/assets/images/artstudio/ic_pdf_white.svg) no-repeat;
    background-size: 18px 21px;
  }
  .getpdf .caution {
    margin: 10px 20px 0 !important;
    padding: 0 !important;
    font-size: 14px !important;
    text-align: left;
  }
  /* dark */
  .getpdf.dark a {
    background: #033300;
  }
}

/*# sourceMappingURL=main.css.map */
