@charset "UTF-8";
html { font-size: 62.5%; }

body { font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", 'Hiragino Kaku Gothic Pro', "メイリオ", 'Meiryo', "ＭＳ Ｐゴシック", 'MS PGothic', Arial, sans-serif; font-size: 1.4rem; line-height: 1.7; font-weight: 500; background: #fff; color: #000; }

body { overflow-wrap: break-word; }

a { color: #2e2725; text-decoration: none; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; transition-duration: 0.2s; }

a:hover { text-decoration: none; color: currentColor; filter: alpha(opacity=75); -ms-filter: "alpha(opacity=75)"; opacity: .75; }

a:focus { outline: none; text-decoration: none; }

ul, ol { margin: 0; padding: 0; }

ul li, ol li { list-style: none; }

h1, h2, h3, h4, h5, h6 { font-weight: 700; margin: 0; }

p { margin: 0px 0px 30px 0px; padding: 0; }

p:last-child { margin-bottom: 0px; }

@media screen and (max-width: 768px) { p { margin: 0 0 4vw 0; } }

figure { margin: 0; padding: 0; line-height: 0; }

input[type="submit"] { border: none; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; transition-duration: 0.2s; }

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

dl, dt, dd { margin: 0; padding: 0; }

* { -moz-box-sizing: border-box; box-sizing: border-box; word-break: break-word; }

img { max-width: 100%; height: auto; vertical-align: middle; }

/* clearfix (micro) */
.clearfix:before, .clearfix:after { content: ' '; display: table; }

.clearfix:after { clear: both; }

/* For IE 6/7 only */
.clearfix { *zoom: 1; }

div, p { /*word-break: break-all;*/ }

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, nav, picture { margin: 0; padding: 0; border: 0; vertical-align: baseline; }

ul, ol, li { list-style: none; }

.page-main { display: block; position: relative; overflow: hidden; }

.container { max-width: 83rem; margin: 0 auto; padding: 0 1.5rem; }

#hambuger { display: block; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; z-index: 99; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; position: relative; width: 8vw; height: 6.66667vw; /*&.open { position: fixed; right: 6.4rem; top: 2.5rem; }*/ }

.nav-icon { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; transition: .5s ease-in-out; }

.nav-icon span { display: block; position: absolute; height: 0.8vw; width: 8vw; background: #fff; opacity: 1; left: 50%; -webkit-transform: translateX(-50%) rotate(0deg); -moz-transform: translateX(-50%) rotate(0deg); -ms-transform: translateX(-50%) rotate(0deg); transform: translateX(-50%) rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; transition: .25s ease-in-out; -moz-border-radius: 2rem; border-radius: 2rem; }

.nav-icon span:nth-child(1) { top: 0; }

.nav-icon span:nth-child(2) { visibility: hidden; }

.nav-icon span:nth-child(2), .nav-icon span:nth-child(3) { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.nav-icon span:nth-child(4) { top: 5.86667vw; }

.nav-icon.open span { background: #fff; }

.nav-icon.open span:nth-child(1) { top: 50%; width: 0%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.nav-icon.open span:nth-child(2) { visibility: visible; margin-top: -2px; -webkit-transform: translateX(-50%) rotate(45deg); -moz-transform: translateX(-50%) rotate(45deg); -ms-transform: translateX(-50%) rotate(45deg); transform: translateX(-50%) rotate(45deg); }

.nav-icon.open span:nth-child(3) { margin-top: -2px; -webkit-transform: translateX(-50%) rotate(-45deg); -moz-transform: translateX(-50%) rotate(-45deg); -ms-transform: translateX(-50%) rotate(-45deg); transform: translateX(-50%) rotate(-45deg); }

.nav-icon.open span:nth-child(4) { top: 50%; width: 0%; left: 50%; }

.js-view { opacity: 0; -webkit-transform: translate(0, 50px); -moz-transform: translate(0, 50px); -ms-transform: translate(0, 50px); transform: translate(0, 50px); -webkit-transition: all 0.8s; -moz-transition: all 0.8s; transition: all 0.8s; }

.js-view.fadein { opacity: 1; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); }

/************************
 .sc-fade
*************************/
@-webkit-keyframes transX { 0% { -webkit-transform: translateX(-100%);
    transform: translateX(-100%); }
  47.5% { -webkit-transform: translateX(0);
    transform: translateX(0); }
  52.5% { -webkit-transform: translateX(0);
    transform: translateX(0); }
  100% { -webkit-transform: translateX(100%);
    transform: translateX(100%); } }
@-moz-keyframes transX { 0% { -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
      transform: translateX(-100%); }
  47.5% { -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
      transform: translateX(0); }
  52.5% { -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
      transform: translateX(0); }
  100% { -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
      transform: translateX(100%); } }
@keyframes transX { 0% { -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
      transform: translateX(-100%); }
  47.5% { -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
      transform: translateX(0); }
  52.5% { -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
      transform: translateX(0); }
  100% { -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
      transform: translateX(100%); } }

.js-view { opacity: 0; -webkit-transform: translate(0, 50px); -moz-transform: translate(0, 50px); -ms-transform: translate(0, 50px); transform: translate(0, 50px); -webkit-transition: all 0.8s; -moz-transition: all 0.8s; transition: all 0.8s; }

.js-view.sc-fadein { opacity: 1; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); }

.maskToRight::before { position: absolute; content: ""; width: 100%; height: 100%; left: -100%; top: 0; background: #000; -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; -moz-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transition: left 0.3s linear, -webkit-transform 0.3s ease 0.5s; transition: left 0.3s linear, -webkit-transform 0.3s ease 0.5s; -moz-transition: left 0.3s linear, transform 0.3s ease 0.5s, -moz-transform 0.3s ease 0.5s; transition: left 0.3s linear, transform 0.3s ease 0.5s; transition: left 0.3s linear, transform 0.3s ease 0.5s, -webkit-transform 0.3s ease 0.5s, -moz-transform 0.3s ease 0.5s; z-index: 9; }

.maskToRight.on::before { -webkit-animation: transX 2s cubic-bezier(0.78, 0.07, 0, 1) normal; -moz-animation: transX 2s cubic-bezier(0.78, 0.07, 0, 1) normal; animation: transX 2s cubic-bezier(0.78, 0.07, 0, 1) normal; left: 0; -webkit-transform: scale(0, 1); -ms-transform: scale(0, 1); -moz-transform: scale(0, 1); transform: scale(0, 1); }

/* animatezoom
********************/
@-webkit-keyframes animatezoom { from { -webkit-transform: scale(0); transform: scale(0); }
  to { -webkit-transform: scale(1); transform: scale(1); } }
@-moz-keyframes animatezoom { from { -moz-transform: scale(0); transform: scale(0); }
  to { -moz-transform: scale(1); transform: scale(1); } }
@keyframes animatezoom { from { -webkit-transform: scale(0); -moz-transform: scale(0); transform: scale(0); }
  to { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } }

/* slideInFromLeft
********************/
@-webkit-keyframes slideInFromLeft { 0% { opacity: 0;
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px); }
  30% { opacity: 0;
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px); }
  80% { opacity: 0;
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px); }
  100% { opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0); } }
@-moz-keyframes slideInFromLeft { 0% { opacity: 0;
    -moz-transform: translateX(-100px);
         transform: translateX(-100px); }
  30% { opacity: 0;
    -moz-transform: translateX(-100px);
         transform: translateX(-100px); }
  80% { opacity: 0;
    -moz-transform: translateX(-100px);
         transform: translateX(-100px); }
  100% { opacity: 1;
    -moz-transform: translateX(0);
         transform: translateX(0); } }
@keyframes slideInFromLeft { 0% { opacity: 0;
    -webkit-transform: translateX(-100px);
       -moz-transform: translateX(-100px);
            transform: translateX(-100px); }
  30% { opacity: 0;
    -webkit-transform: translateX(-100px);
       -moz-transform: translateX(-100px);
            transform: translateX(-100px); }
  80% { opacity: 0;
    -webkit-transform: translateX(-100px);
       -moz-transform: translateX(-100px);
            transform: translateX(-100px); }
  100% { opacity: 1;
    -webkit-transform: translateX(0);
       -moz-transform: translateX(0);
            transform: translateX(0); } }

/* slideOutFromLeft
********************/
@-webkit-keyframes slideOutFromLeft { 0% { opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  100% { opacity: 0;
    -webkit-transform: translateX(50px);
            transform: translateX(50px); } }
@-moz-keyframes slideOutFromLeft { 0% { opacity: 1;
    -moz-transform: translateX(0);
         transform: translateX(0); }
  100% { opacity: 0;
    -moz-transform: translateX(50px);
         transform: translateX(50px); } }
@keyframes slideOutFromLeft { 0% { opacity: 1;
    -webkit-transform: translateX(0);
       -moz-transform: translateX(0);
            transform: translateX(0); }
  100% { opacity: 0;
    -webkit-transform: translateX(50px);
       -moz-transform: translateX(50px);
            transform: translateX(50px); } }

@-webkit-keyframes mvImg { 0% { opacity: 0; }
  40% { opacity: 0; }
  100% { opacity: 1; } }

@-moz-keyframes mvImg { 0% { opacity: 0; }
  40% { opacity: 0; }
  100% { opacity: 1; } }

@keyframes mvImg { 0% { opacity: 0; }
  40% { opacity: 0; }
  100% { opacity: 1; } }

@-webkit-keyframes mvFadeUp { 0% { opacity: 0;
    -webkit-transform: translateY(100px);
            transform: translateY(100px); }
  100% { opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0); } }

@-moz-keyframes mvFadeUp { 0% { opacity: 0;
    -moz-transform: translateY(100px);
         transform: translateY(100px); }
  100% { opacity: 1;
    -moz-transform: translateY(0);
         transform: translateY(0); } }

@keyframes mvFadeUp { 0% { opacity: 0;
    -webkit-transform: translateY(100px);
       -moz-transform: translateY(100px);
            transform: translateY(100px); }
  100% { opacity: 1;
    -webkit-transform: translateY(0);
       -moz-transform: translateY(0);
            transform: translateY(0); } }

@-webkit-keyframes btnFixed { 0% { opacity: 0;
    -webkit-transform: translateX(100%);
            transform: translateX(100%); }
  80% { opacity: 0;
    -webkit-transform: translateX(100%);
            transform: translateX(100%); }
  100% { opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0); } }

@-moz-keyframes btnFixed { 0% { opacity: 0;
    -moz-transform: translateX(100%);
         transform: translateX(100%); }
  80% { opacity: 0;
    -moz-transform: translateX(100%);
         transform: translateX(100%); }
  100% { opacity: 1;
    -moz-transform: translateX(0);
         transform: translateX(0); } }

@keyframes btnFixed { 0% { opacity: 0;
    -webkit-transform: translateX(100%);
       -moz-transform: translateX(100%);
            transform: translateX(100%); }
  80% { opacity: 0;
    -webkit-transform: translateX(100%);
       -moz-transform: translateX(100%);
            transform: translateX(100%); }
  100% { opacity: 1;
    -webkit-transform: translateX(0);
       -moz-transform: translateX(0);
            transform: translateX(0); } }

@media screen and (min-width: 769px) { .show_sp { display: none !important; }
  .show_pc { display: inline-block; }
  .MissingWH { position: relative; overflow: hidden; height: 100%; width: 100%; }
  .MissingWH img { position: absolute; left: 0; top: 0; margin: 0; width: auto !important; display: none; height: auto; min-width: 100%; min-height: 100%; max-height: none; max-width: none; -webkit-transition: 0.5s ease-in-out; -moz-transition: 0.5s ease-in-out; transition: 0.5s ease-in-out; }
  a[href^=tel] { pointer-events: none; text-decoration: none; opacity: 1 !important; cursor: default !important; }
  #hambuger { display: none; }
  .page-main { width: -webkit-calc(100% - 32.6rem); width: -moz-calc(100% - 32.6rem); width: calc(100% - 32.6rem); margin-left: 32.6rem; min-height: 100vh; }
  .key-visual { height: 34.4rem; background-position: center; -moz-background-size: cover; background-size: cover; }
  .key-visual figure { display: none; } }

.section { padding: 10rem 0 12rem; }

.section-title { font-size: 3rem; text-align: center; position: relative; margin-bottom: 6rem; }

.section-title:after { position: absolute; content: ''; width: 80%; height: 1px; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #000; z-index: -1; }

.section-title span { display: inline-block; background: #fff; padding: 0 3.5rem; }

.key-visual { position: relative; }

.page-title { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; background: #fff; width: 30rem; padding: 3rem 0; }

.page-title .ja { color: #333333; font-size: 3rem; line-height: 1; letter-spacing: 0.02em; font-family: "游明朝体", "Yu Mincho", YuMincho, "Noto Serif JP", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; margin-bottom: 0.5rem; }

.page-title .en { font-size: 1.2rem; display: block; }

@media (min-width: 769px) and (max-width: 1024px) { .page-main { width: -webkit-calc(100% - 25rem); width: -moz-calc(100% - 25rem); width: calc(100% - 25rem); margin-left: 25rem; } }

/** header area
====================================== **/
.page-header { background: #cc3301; width: 32.6rem; position: fixed; height: 100vh; padding: 4.8rem 2.3rem 0; }

.logo { text-align: center; margin-bottom: 6rem; }

.logo a { text-align: center; display: inline-block; color: #fff; }

.logo a span { display: block; font-size: 2.2rem; font-weight: bold; }

.menu li { border-bottom: 1px solid #e67854; }

.menu li:first-child { border-top: 1px solid #e67854; }

.menu li a { display: block; color: #fff; font-size: 1.6rem; padding: 1.6rem 2.5rem; }

@media (min-width: 769px) and (max-width: 1024px) { .page-header { width: 25rem; padding: 4.8rem 1.5rem 0; }
  .logo a img { max-width: 7rem; }
  .logo a span { font-size: 1.8rem; } }

@media screen and (min-width: 769px) { .g-nav { display: block !important; } }

/** footer area
======================================= **/
.page-footer { width: 32.6rem; position: fixed; left: 0; bottom: 3rem; text-align: center; }

.copyright { font-size: 1.2rem; color: #fff; }

@media (min-width: 769px) and (max-width: 1024px) { .page-footer { width: 25rem; }
  .copyright { font-size: 1.1rem; color: #fff; } }

@media screen and (max-width: 768px) { body { font-size: 3.2vw; }
  .show_pc { display: none !important; }
  .show_sp { display: inline-block; }
  .MissingWH img { position: static; display: inline-block; max-width: 100%; }
  .container { margin: 0 auto; padding: 0 4vw; }
  .page-title { width: 60vw; padding: 5.33333vw 0; }
  .page-title .ja { font-size: 6.13333vw; margin-bottom: 1.33333vw; }
  .page-title .en { font-size: 2.66667vw; }
  .section { padding: 13.33333vw 0; }
  .section-title { font-size: 6vw; margin-bottom: 12vw; }
  .section-title span { padding: 0 6.66667vw; }
  /** header area
====================================== **/
  .page-header { position: static; width: 100%; height: auto; padding: 4vw 4.53333vw; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; position: relative; }
  .logo { text-align: left; margin-bottom: 0; }
  .logo a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; }
  .logo a img { width: 9.6vw; margin-right: 2.66667vw; }
  .logo a span { display: inline-block; font-size: 5.6vw; }
  .g-nav { display: none; width: 100%; background: #cc3301; position: absolute; top: 100%; left: 0; padding: 4vw 0 10.66667vw; z-index: 90; }
  .menu { display: block; padding: 0 6.66667vw; }
  .menu li a { display: block; text-align: center; font-size: 4vw; font-weight: 500; }
  .page-footer { position: static; width: 100%; height: auto; background: #cc3301; padding: 4vw 0; }
  .copyright { font-size: 3.2vw; } }