@charset "UTF-8";
/* ====================================================

    ┏───────────────────────┓
    │   Table Of Contents   │
    ┗───────────────────────┛

    1. General
       1-1. Reset
       1-2. Base
       1-3. Utility
    2. Animations
    3. Parts
    4. Block
    5. For IE
    99. Vendor

==================================================== */
/* ====================================

    1. General

==================================== */
/*
  1-1. Reset
==================================== */
@import url("https://fonts.googleapis.com/css?family=Cormorant+Garamond:300,400i,500,700i|Noto+Sans+JP:400,500|Noto+Serif+JP:300,400,500&display=swap&subset=japanese");
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;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

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

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

img {
  vertical-align: bottom;
}

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

input,
button,
textarea,
select {
  margin: 0;
  padding: 0;
  font-family: system-ui, -apple-system, "Noto Sans JP", "Hiragino Sans", "Yu Gothic UI", "Segoe UI", "Meiryo", sans-serif;
  border: 0;
  border-radius: 0;
  background: transparent;
  -webkit-appearance: none;
}

input:focus,
button:focus,
textarea:focus,
select:focus {
  outline: none;
}

select::-ms-expand {
  display: none;
}

button {
  line-height: 1;
}

/*
  1-1. Base
==================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

@media screen and (max-width: 768px) {
  html {
    font-size: calc(100vw / 37.5);
  }
}

body {
  color: #333;
  font-size: 16px;
  font-size: 1.6rem;
  font-family: system-ui, -apple-system, "Noto Sans JP", "Hiragino Sans", "Yu Gothic UI", "Segoe UI", "Meiryo", sans-serif;
  line-height: 1.75;
  letter-spacing: .1em;
}

@media screen and (max-width: 768px) {
  body {
    -webkit-text-size-adjust: 100%;
  }
}

a {
  color: #333;
}

/*
  1-1. Utility
==================================== */
._md {
  display: none !important;
}

@media screen and (max-width: 768px) {
  ._md {
    display: block !important;
  }
}

._md-flex {
  display: none !important;
}

@media screen and (max-width: 768px) {
  ._md-flex {
    display: -webkit-box !important;
    display: flex !important;
  }
}

._md-inline {
  display: none !important;
}

@media screen and (max-width: 768px) {
  ._md-inline {
    display: inline !important;
  }
}

._md-inb {
  display: none !important;
}

@media screen and (max-width: 768px) {
  ._md-inb {
    display: inline-block !important;
  }
}

._lg {
  display: block;
}

@media screen and (max-width: 768px) {
  ._lg {
    display: none !important;
  }
}

._lg-flex {
  display: none !important;
}

@media screen and (min-width: 769px) {
  ._lg-flex {
    display: -webkit-box !important;
    display: flex !important;
  }
}

._lg-inline {
  display: none !important;
}

@media screen and (min-width: 769px) {
  ._lg-inline {
    display: inline !important;
  }
}

._lg-inb {
  display: none !important;
}

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

._text-center {
  text-align: center;
}

._text-right {
  text-align: right;
}

._text-primary {
  color: #1b4791;
}

._text-secondary {
  color: #91711b;
}

._text-muted {
  color: #999;
}

._text-em {
  font-weight: 700;
}

._text-sup {
  font-size: 10px;
  font-size: 1rem;
  vertical-align: top;
}

._text-note {
  position: relative;
  padding-left: 1.5em;
}

._text-note span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
}

._text-serif {
  font-family: "Noto Serif JP", serif;
}

.heading-section > .sub, .heading-section > .main, .header-nav > .button > .label, .conversion-bar > .copy > .sub, .conversion-bar > .copy > .main, .conversion-bar > .button > .label, .follow-buttons > .button > .label, .visual-copy > .main, .reservation-bar > .plan > .label, .reservation-bar > .button > .label, .task-box > .item > .text, .task-book > .copys > .text, .reason-method > .title > .sub, .reason-method > .title > .main, .reason-item > .title > .main, .reason-knowhow > .inner > .title > .sub, .reason-knowhow > .inner > .title > .main > .text, .reason-boxlist > .item.-em > .main > .data, .seminar-container > .heading, .seminar-banner > .main, .voice-item > .head > .detail > .lead, .faq-item > .title {
  font-family: "Noto Serif JP", serif;
}

[class^='icon'].-light {
  fill: #fff;
}

[class^='icon'].-muted {
  fill: #999;
}

[class^='icon'].-primary {
  fill: #1b4791;
}

[class^='icon'].-secondary {
  fill: #91711b;
}

[class^='icon'].-mirror {
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
}

._mt-0 {
  margin-top: 0px !important;
}

@media screen and (max-width: 768px) {
  ._mt-0 {
    margin-top: 0vw !important;
  }
}

._mr-0 {
  margin-right: 0px !important;
}

@media screen and (max-width: 768px) {
  ._mr-0 {
    margin-right: 0vw !important;
  }
}

._mb-0 {
  margin-bottom: 0px !important;
}

@media screen and (max-width: 768px) {
  ._mb-0 {
    margin-bottom: 0vw !important;
  }
}

._ml-0 {
  margin-left: 0px !important;
}

@media screen and (max-width: 768px) {
  ._ml-0 {
    margin-left: 0vw !important;
  }
}

._mt-5 {
  margin-top: 5px !important;
}

@media screen and (max-width: 768px) {
  ._mt-5 {
    margin-top: 0.66667vw !important;
  }
}

._mr-5 {
  margin-right: 5px !important;
}

@media screen and (max-width: 768px) {
  ._mr-5 {
    margin-right: 0.66667vw !important;
  }
}

._mb-5 {
  margin-bottom: 5px !important;
}

@media screen and (max-width: 768px) {
  ._mb-5 {
    margin-bottom: 0.66667vw !important;
  }
}

._ml-5 {
  margin-left: 5px !important;
}

@media screen and (max-width: 768px) {
  ._ml-5 {
    margin-left: 0.66667vw !important;
  }
}

._mt-10 {
  margin-top: 10px !important;
}

@media screen and (max-width: 768px) {
  ._mt-10 {
    margin-top: 1.33333vw !important;
  }
}

._mr-10 {
  margin-right: 10px !important;
}

@media screen and (max-width: 768px) {
  ._mr-10 {
    margin-right: 1.33333vw !important;
  }
}

._mb-10 {
  margin-bottom: 10px !important;
}

@media screen and (max-width: 768px) {
  ._mb-10 {
    margin-bottom: 1.33333vw !important;
  }
}

._ml-10 {
  margin-left: 10px !important;
}

@media screen and (max-width: 768px) {
  ._ml-10 {
    margin-left: 1.33333vw !important;
  }
}

._mt-15 {
  margin-top: 15px !important;
}

@media screen and (max-width: 768px) {
  ._mt-15 {
    margin-top: 2vw !important;
  }
}

._mr-15 {
  margin-right: 15px !important;
}

@media screen and (max-width: 768px) {
  ._mr-15 {
    margin-right: 2vw !important;
  }
}

._mb-15 {
  margin-bottom: 15px !important;
}

@media screen and (max-width: 768px) {
  ._mb-15 {
    margin-bottom: 2vw !important;
  }
}

._ml-15 {
  margin-left: 15px !important;
}

@media screen and (max-width: 768px) {
  ._ml-15 {
    margin-left: 2vw !important;
  }
}

._mt-20 {
  margin-top: 20px !important;
}

@media screen and (max-width: 768px) {
  ._mt-20 {
    margin-top: 2.66667vw !important;
  }
}

._mr-20 {
  margin-right: 20px !important;
}

@media screen and (max-width: 768px) {
  ._mr-20 {
    margin-right: 2.66667vw !important;
  }
}

._mb-20 {
  margin-bottom: 20px !important;
}

@media screen and (max-width: 768px) {
  ._mb-20 {
    margin-bottom: 2.66667vw !important;
  }
}

._ml-20 {
  margin-left: 20px !important;
}

@media screen and (max-width: 768px) {
  ._ml-20 {
    margin-left: 2.66667vw !important;
  }
}

._mt-25 {
  margin-top: 25px !important;
}

@media screen and (max-width: 768px) {
  ._mt-25 {
    margin-top: 3.33333vw !important;
  }
}

._mr-25 {
  margin-right: 25px !important;
}

@media screen and (max-width: 768px) {
  ._mr-25 {
    margin-right: 3.33333vw !important;
  }
}

._mb-25 {
  margin-bottom: 25px !important;
}

@media screen and (max-width: 768px) {
  ._mb-25 {
    margin-bottom: 3.33333vw !important;
  }
}

._ml-25 {
  margin-left: 25px !important;
}

@media screen and (max-width: 768px) {
  ._ml-25 {
    margin-left: 3.33333vw !important;
  }
}

._mt-30 {
  margin-top: 30px !important;
}

@media screen and (max-width: 768px) {
  ._mt-30 {
    margin-top: 4vw !important;
  }
}

._mr-30 {
  margin-right: 30px !important;
}

@media screen and (max-width: 768px) {
  ._mr-30 {
    margin-right: 4vw !important;
  }
}

._mb-30 {
  margin-bottom: 30px !important;
}

@media screen and (max-width: 768px) {
  ._mb-30 {
    margin-bottom: 4vw !important;
  }
}

._ml-30 {
  margin-left: 30px !important;
}

@media screen and (max-width: 768px) {
  ._ml-30 {
    margin-left: 4vw !important;
  }
}

._mt-35 {
  margin-top: 35px !important;
}

@media screen and (max-width: 768px) {
  ._mt-35 {
    margin-top: 4.66667vw !important;
  }
}

._mr-35 {
  margin-right: 35px !important;
}

@media screen and (max-width: 768px) {
  ._mr-35 {
    margin-right: 4.66667vw !important;
  }
}

._mb-35 {
  margin-bottom: 35px !important;
}

@media screen and (max-width: 768px) {
  ._mb-35 {
    margin-bottom: 4.66667vw !important;
  }
}

._ml-35 {
  margin-left: 35px !important;
}

@media screen and (max-width: 768px) {
  ._ml-35 {
    margin-left: 4.66667vw !important;
  }
}

._mt-40 {
  margin-top: 40px !important;
}

@media screen and (max-width: 768px) {
  ._mt-40 {
    margin-top: 5.33333vw !important;
  }
}

._mr-40 {
  margin-right: 40px !important;
}

@media screen and (max-width: 768px) {
  ._mr-40 {
    margin-right: 5.33333vw !important;
  }
}

._mb-40 {
  margin-bottom: 40px !important;
}

@media screen and (max-width: 768px) {
  ._mb-40 {
    margin-bottom: 5.33333vw !important;
  }
}

._ml-40 {
  margin-left: 40px !important;
}

@media screen and (max-width: 768px) {
  ._ml-40 {
    margin-left: 5.33333vw !important;
  }
}

._mt-45 {
  margin-top: 45px !important;
}

@media screen and (max-width: 768px) {
  ._mt-45 {
    margin-top: 6vw !important;
  }
}

._mr-45 {
  margin-right: 45px !important;
}

@media screen and (max-width: 768px) {
  ._mr-45 {
    margin-right: 6vw !important;
  }
}

._mb-45 {
  margin-bottom: 45px !important;
}

@media screen and (max-width: 768px) {
  ._mb-45 {
    margin-bottom: 6vw !important;
  }
}

._ml-45 {
  margin-left: 45px !important;
}

@media screen and (max-width: 768px) {
  ._ml-45 {
    margin-left: 6vw !important;
  }
}

._mt-50 {
  margin-top: 50px !important;
}

@media screen and (max-width: 768px) {
  ._mt-50 {
    margin-top: 6.66667vw !important;
  }
}

._mr-50 {
  margin-right: 50px !important;
}

@media screen and (max-width: 768px) {
  ._mr-50 {
    margin-right: 6.66667vw !important;
  }
}

._mb-50 {
  margin-bottom: 50px !important;
}

@media screen and (max-width: 768px) {
  ._mb-50 {
    margin-bottom: 6.66667vw !important;
  }
}

._ml-50 {
  margin-left: 50px !important;
}

@media screen and (max-width: 768px) {
  ._ml-50 {
    margin-left: 6.66667vw !important;
  }
}

._mt-55 {
  margin-top: 55px !important;
}

@media screen and (max-width: 768px) {
  ._mt-55 {
    margin-top: 7.33333vw !important;
  }
}

._mr-55 {
  margin-right: 55px !important;
}

@media screen and (max-width: 768px) {
  ._mr-55 {
    margin-right: 7.33333vw !important;
  }
}

._mb-55 {
  margin-bottom: 55px !important;
}

@media screen and (max-width: 768px) {
  ._mb-55 {
    margin-bottom: 7.33333vw !important;
  }
}

._ml-55 {
  margin-left: 55px !important;
}

@media screen and (max-width: 768px) {
  ._ml-55 {
    margin-left: 7.33333vw !important;
  }
}

._mt-60 {
  margin-top: 60px !important;
}

@media screen and (max-width: 768px) {
  ._mt-60 {
    margin-top: 8vw !important;
  }
}

._mr-60 {
  margin-right: 60px !important;
}

@media screen and (max-width: 768px) {
  ._mr-60 {
    margin-right: 8vw !important;
  }
}

._mb-60 {
  margin-bottom: 60px !important;
}

@media screen and (max-width: 768px) {
  ._mb-60 {
    margin-bottom: 8vw !important;
  }
}

._ml-60 {
  margin-left: 60px !important;
}

@media screen and (max-width: 768px) {
  ._ml-60 {
    margin-left: 8vw !important;
  }
}

._mt-65 {
  margin-top: 65px !important;
}

@media screen and (max-width: 768px) {
  ._mt-65 {
    margin-top: 8.66667vw !important;
  }
}

._mr-65 {
  margin-right: 65px !important;
}

@media screen and (max-width: 768px) {
  ._mr-65 {
    margin-right: 8.66667vw !important;
  }
}

._mb-65 {
  margin-bottom: 65px !important;
}

@media screen and (max-width: 768px) {
  ._mb-65 {
    margin-bottom: 8.66667vw !important;
  }
}

._ml-65 {
  margin-left: 65px !important;
}

@media screen and (max-width: 768px) {
  ._ml-65 {
    margin-left: 8.66667vw !important;
  }
}

._mt-70 {
  margin-top: 70px !important;
}

@media screen and (max-width: 768px) {
  ._mt-70 {
    margin-top: 9.33333vw !important;
  }
}

._mr-70 {
  margin-right: 70px !important;
}

@media screen and (max-width: 768px) {
  ._mr-70 {
    margin-right: 9.33333vw !important;
  }
}

._mb-70 {
  margin-bottom: 70px !important;
}

@media screen and (max-width: 768px) {
  ._mb-70 {
    margin-bottom: 9.33333vw !important;
  }
}

._ml-70 {
  margin-left: 70px !important;
}

@media screen and (max-width: 768px) {
  ._ml-70 {
    margin-left: 9.33333vw !important;
  }
}

._mt-75 {
  margin-top: 75px !important;
}

@media screen and (max-width: 768px) {
  ._mt-75 {
    margin-top: 10vw !important;
  }
}

._mr-75 {
  margin-right: 75px !important;
}

@media screen and (max-width: 768px) {
  ._mr-75 {
    margin-right: 10vw !important;
  }
}

._mb-75 {
  margin-bottom: 75px !important;
}

@media screen and (max-width: 768px) {
  ._mb-75 {
    margin-bottom: 10vw !important;
  }
}

._ml-75 {
  margin-left: 75px !important;
}

@media screen and (max-width: 768px) {
  ._ml-75 {
    margin-left: 10vw !important;
  }
}

._pt-0 {
  padding-top: 0px !important;
}

@media screen and (max-width: 768px) {
  ._pt-0 {
    padding-top: 0vw !important;
  }
}

._pr-0 {
  padding-right: 0px !important;
}

@media screen and (max-width: 768px) {
  ._pr-0 {
    padding-right: 0vw !important;
  }
}

._pb-0 {
  padding-bottom: 0px !important;
}

@media screen and (max-width: 768px) {
  ._pb-0 {
    padding-bottom: 0vw !important;
  }
}

._pl-0 {
  padding-left: 0px !important;
}

@media screen and (max-width: 768px) {
  ._pl-0 {
    padding-left: 0vw !important;
  }
}

._pt-5 {
  padding-top: 5px !important;
}

@media screen and (max-width: 768px) {
  ._pt-5 {
    padding-top: 0.66667vw !important;
  }
}

._pr-5 {
  padding-right: 5px !important;
}

@media screen and (max-width: 768px) {
  ._pr-5 {
    padding-right: 0.66667vw !important;
  }
}

._pb-5 {
  padding-bottom: 5px !important;
}

@media screen and (max-width: 768px) {
  ._pb-5 {
    padding-bottom: 0.66667vw !important;
  }
}

._pl-5 {
  padding-left: 5px !important;
}

@media screen and (max-width: 768px) {
  ._pl-5 {
    padding-left: 0.66667vw !important;
  }
}

._pt-10 {
  padding-top: 10px !important;
}

@media screen and (max-width: 768px) {
  ._pt-10 {
    padding-top: 1.33333vw !important;
  }
}

._pr-10 {
  padding-right: 10px !important;
}

@media screen and (max-width: 768px) {
  ._pr-10 {
    padding-right: 1.33333vw !important;
  }
}

._pb-10 {
  padding-bottom: 10px !important;
}

@media screen and (max-width: 768px) {
  ._pb-10 {
    padding-bottom: 1.33333vw !important;
  }
}

._pl-10 {
  padding-left: 10px !important;
}

@media screen and (max-width: 768px) {
  ._pl-10 {
    padding-left: 1.33333vw !important;
  }
}

._pt-15 {
  padding-top: 15px !important;
}

@media screen and (max-width: 768px) {
  ._pt-15 {
    padding-top: 2vw !important;
  }
}

._pr-15 {
  padding-right: 15px !important;
}

@media screen and (max-width: 768px) {
  ._pr-15 {
    padding-right: 2vw !important;
  }
}

._pb-15 {
  padding-bottom: 15px !important;
}

@media screen and (max-width: 768px) {
  ._pb-15 {
    padding-bottom: 2vw !important;
  }
}

._pl-15 {
  padding-left: 15px !important;
}

@media screen and (max-width: 768px) {
  ._pl-15 {
    padding-left: 2vw !important;
  }
}

._pt-20 {
  padding-top: 20px !important;
}

@media screen and (max-width: 768px) {
  ._pt-20 {
    padding-top: 2.66667vw !important;
  }
}

._pr-20 {
  padding-right: 20px !important;
}

@media screen and (max-width: 768px) {
  ._pr-20 {
    padding-right: 2.66667vw !important;
  }
}

._pb-20 {
  padding-bottom: 20px !important;
}

@media screen and (max-width: 768px) {
  ._pb-20 {
    padding-bottom: 2.66667vw !important;
  }
}

._pl-20 {
  padding-left: 20px !important;
}

@media screen and (max-width: 768px) {
  ._pl-20 {
    padding-left: 2.66667vw !important;
  }
}

._pt-25 {
  padding-top: 25px !important;
}

@media screen and (max-width: 768px) {
  ._pt-25 {
    padding-top: 3.33333vw !important;
  }
}

._pr-25 {
  padding-right: 25px !important;
}

@media screen and (max-width: 768px) {
  ._pr-25 {
    padding-right: 3.33333vw !important;
  }
}

._pb-25 {
  padding-bottom: 25px !important;
}

@media screen and (max-width: 768px) {
  ._pb-25 {
    padding-bottom: 3.33333vw !important;
  }
}

._pl-25 {
  padding-left: 25px !important;
}

@media screen and (max-width: 768px) {
  ._pl-25 {
    padding-left: 3.33333vw !important;
  }
}

._pt-30 {
  padding-top: 30px !important;
}

@media screen and (max-width: 768px) {
  ._pt-30 {
    padding-top: 4vw !important;
  }
}

._pr-30 {
  padding-right: 30px !important;
}

@media screen and (max-width: 768px) {
  ._pr-30 {
    padding-right: 4vw !important;
  }
}

._pb-30 {
  padding-bottom: 30px !important;
}

@media screen and (max-width: 768px) {
  ._pb-30 {
    padding-bottom: 4vw !important;
  }
}

._pl-30 {
  padding-left: 30px !important;
}

@media screen and (max-width: 768px) {
  ._pl-30 {
    padding-left: 4vw !important;
  }
}

._pt-35 {
  padding-top: 35px !important;
}

@media screen and (max-width: 768px) {
  ._pt-35 {
    padding-top: 4.66667vw !important;
  }
}

._pr-35 {
  padding-right: 35px !important;
}

@media screen and (max-width: 768px) {
  ._pr-35 {
    padding-right: 4.66667vw !important;
  }
}

._pb-35 {
  padding-bottom: 35px !important;
}

@media screen and (max-width: 768px) {
  ._pb-35 {
    padding-bottom: 4.66667vw !important;
  }
}

._pl-35 {
  padding-left: 35px !important;
}

@media screen and (max-width: 768px) {
  ._pl-35 {
    padding-left: 4.66667vw !important;
  }
}

._pt-40 {
  padding-top: 40px !important;
}

@media screen and (max-width: 768px) {
  ._pt-40 {
    padding-top: 5.33333vw !important;
  }
}

._pr-40 {
  padding-right: 40px !important;
}

@media screen and (max-width: 768px) {
  ._pr-40 {
    padding-right: 5.33333vw !important;
  }
}

._pb-40 {
  padding-bottom: 40px !important;
}

@media screen and (max-width: 768px) {
  ._pb-40 {
    padding-bottom: 5.33333vw !important;
  }
}

._pl-40 {
  padding-left: 40px !important;
}

@media screen and (max-width: 768px) {
  ._pl-40 {
    padding-left: 5.33333vw !important;
  }
}

._pt-45 {
  padding-top: 45px !important;
}

@media screen and (max-width: 768px) {
  ._pt-45 {
    padding-top: 6vw !important;
  }
}

._pr-45 {
  padding-right: 45px !important;
}

@media screen and (max-width: 768px) {
  ._pr-45 {
    padding-right: 6vw !important;
  }
}

._pb-45 {
  padding-bottom: 45px !important;
}

@media screen and (max-width: 768px) {
  ._pb-45 {
    padding-bottom: 6vw !important;
  }
}

._pl-45 {
  padding-left: 45px !important;
}

@media screen and (max-width: 768px) {
  ._pl-45 {
    padding-left: 6vw !important;
  }
}

._pt-50 {
  padding-top: 50px !important;
}

@media screen and (max-width: 768px) {
  ._pt-50 {
    padding-top: 6.66667vw !important;
  }
}

._pr-50 {
  padding-right: 50px !important;
}

@media screen and (max-width: 768px) {
  ._pr-50 {
    padding-right: 6.66667vw !important;
  }
}

._pb-50 {
  padding-bottom: 50px !important;
}

@media screen and (max-width: 768px) {
  ._pb-50 {
    padding-bottom: 6.66667vw !important;
  }
}

._pl-50 {
  padding-left: 50px !important;
}

@media screen and (max-width: 768px) {
  ._pl-50 {
    padding-left: 6.66667vw !important;
  }
}

._pt-55 {
  padding-top: 55px !important;
}

@media screen and (max-width: 768px) {
  ._pt-55 {
    padding-top: 7.33333vw !important;
  }
}

._pr-55 {
  padding-right: 55px !important;
}

@media screen and (max-width: 768px) {
  ._pr-55 {
    padding-right: 7.33333vw !important;
  }
}

._pb-55 {
  padding-bottom: 55px !important;
}

@media screen and (max-width: 768px) {
  ._pb-55 {
    padding-bottom: 7.33333vw !important;
  }
}

._pl-55 {
  padding-left: 55px !important;
}

@media screen and (max-width: 768px) {
  ._pl-55 {
    padding-left: 7.33333vw !important;
  }
}

._pt-60 {
  padding-top: 60px !important;
}

@media screen and (max-width: 768px) {
  ._pt-60 {
    padding-top: 8vw !important;
  }
}

._pr-60 {
  padding-right: 60px !important;
}

@media screen and (max-width: 768px) {
  ._pr-60 {
    padding-right: 8vw !important;
  }
}

._pb-60 {
  padding-bottom: 60px !important;
}

@media screen and (max-width: 768px) {
  ._pb-60 {
    padding-bottom: 8vw !important;
  }
}

._pl-60 {
  padding-left: 60px !important;
}

@media screen and (max-width: 768px) {
  ._pl-60 {
    padding-left: 8vw !important;
  }
}

._pt-65 {
  padding-top: 65px !important;
}

@media screen and (max-width: 768px) {
  ._pt-65 {
    padding-top: 8.66667vw !important;
  }
}

._pr-65 {
  padding-right: 65px !important;
}

@media screen and (max-width: 768px) {
  ._pr-65 {
    padding-right: 8.66667vw !important;
  }
}

._pb-65 {
  padding-bottom: 65px !important;
}

@media screen and (max-width: 768px) {
  ._pb-65 {
    padding-bottom: 8.66667vw !important;
  }
}

._pl-65 {
  padding-left: 65px !important;
}

@media screen and (max-width: 768px) {
  ._pl-65 {
    padding-left: 8.66667vw !important;
  }
}

._pt-70 {
  padding-top: 70px !important;
}

@media screen and (max-width: 768px) {
  ._pt-70 {
    padding-top: 9.33333vw !important;
  }
}

._pr-70 {
  padding-right: 70px !important;
}

@media screen and (max-width: 768px) {
  ._pr-70 {
    padding-right: 9.33333vw !important;
  }
}

._pb-70 {
  padding-bottom: 70px !important;
}

@media screen and (max-width: 768px) {
  ._pb-70 {
    padding-bottom: 9.33333vw !important;
  }
}

._pl-70 {
  padding-left: 70px !important;
}

@media screen and (max-width: 768px) {
  ._pl-70 {
    padding-left: 9.33333vw !important;
  }
}

._pt-75 {
  padding-top: 75px !important;
}

@media screen and (max-width: 768px) {
  ._pt-75 {
    padding-top: 10vw !important;
  }
}

._pr-75 {
  padding-right: 75px !important;
}

@media screen and (max-width: 768px) {
  ._pr-75 {
    padding-right: 10vw !important;
  }
}

._pb-75 {
  padding-bottom: 75px !important;
}

@media screen and (max-width: 768px) {
  ._pb-75 {
    padding-bottom: 10vw !important;
  }
}

._pl-75 {
  padding-left: 75px !important;
}

@media screen and (max-width: 768px) {
  ._pl-75 {
    padding-left: 10vw !important;
  }
}

/* ====================================

    2. Animations

==================================== */
/*
  2-1. Transform
==================================== */
@-webkit-keyframes left-to-right {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  50% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
@keyframes left-to-right {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  50% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

@-webkit-keyframes right-to-left {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  50% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

@keyframes right-to-left {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  50% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

@-webkit-keyframes top-to-bottom {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  50% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}

@keyframes top-to-bottom {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  50% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}

@-webkit-keyframes bottom-to-top {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  50% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}

@keyframes bottom-to-top {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  50% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

/*
  2-1. SVG animation
==================================== */
/*
  2-1. Background
==================================== */
@-webkit-keyframes gradient-animate {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@keyframes gradient-animate {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/*
  2-1. animation setting class
==================================== */
/* image mask */
.image-mask {
  position: relative;
  overflow: hidden;
}

.image-mask.-left-to-right > img {
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px);
}

.image-mask.-right-to-left > img {
  -webkit-transform: translateX(15px);
          transform: translateX(15px);
}

.image-mask.-bottom-to-top > img {
  -webkit-transform: translateY(15px);
          transform: translateY(15px);
}

.image-mask.-top-to-bottom > img {
  -webkit-transform: translateY(-15px);
          transform: translateY(-15px);
}

.image-mask:before {
  position: absolute;
  z-index: 1;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #1b4791;
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
}

.image-mask > img {
  opacity: 0;
}

@media screen and (max-width: 768px) {
  .image-mask > img {
    width: 100%;
  }
}

.is-passed .image-mask > img {
  -webkit-transition: opacity 1s ease, -webkit-transform .4s ease-out;
  transition: opacity 1s ease, -webkit-transform .4s ease-out;
  transition: opacity 1s ease, transform .4s ease-out;
  transition: opacity 1s ease, transform .4s ease-out, -webkit-transform .4s ease-out;
}

.is-passed .image-mask.-left-to-right > img {
  -webkit-transform: translateX(0);
          transform: translateX(0);
}

.is-passed .image-mask.-left-to-right:before {
  -webkit-animation: left-to-right 1.1s cubic-bezier(0.77, 0, 0.175, 1) forwards;
          animation: left-to-right 1.1s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

.is-passed .image-mask.-right-to-left > img {
  -webkit-transform: translateX(0);
          transform: translateX(0);
}

.is-passed .image-mask.-right-to-left:before {
  -webkit-animation: right-to-left 1.1s cubic-bezier(0.77, 0, 0.175, 1) forwards;
          animation: right-to-left 1.1s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

.is-passed .image-mask.-top-to-bottom > img {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.is-passed .image-mask.-top-to-bottom:before {
  -webkit-animation: top-to-bottom 1.1s cubic-bezier(0.77, 0, 0.175, 1) forwards;
          animation: top-to-bottom 1.1s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

.is-passed .image-mask.-bottom-to-top > img {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.is-passed .image-mask.-bottom-to-top:before {
  -webkit-animation: bottom-to-top 1.1s cubic-bezier(0.77, 0, 0.175, 1) forwards;
          animation: bottom-to-top 1.1s cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

.is-passed .image-mask > img {
  opacity: 1;
  -webkit-transition-delay: .7s;
          transition-delay: .7s;
}

/* fade  */
/* ====================================

    3. Parts

==================================== */
/*
  3-1. Heading
==================================== */
.heading-section {
  text-align: center;
}

.heading-section.-reverse > .sub {
  color: #1b4791;
}

.heading-section.-reverse > .main {
  color: inherit !important;
}

.heading-section.-reverse.-secondary > .sub {
  color: #91711b;
}

.heading-section.-secondary > .main {
  color: #91711b;
}

.heading-section > .sub {
  margin-bottom: 25px;
  font-size: 24px;
  font-size: 2.4rem;
  letter-spacing: 0.1em;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .heading-section > .sub {
    margin-bottom: 4.66667vw;
    font-size: 19px;
    font-size: 1.9rem;
  }
}

.heading-section > .main {
  color: #1b4791;
  font-size: 54px;
  font-size: 5.4rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.30769;
}

@media screen and (max-width: 768px) {
  .heading-section > .main {
    font-size: 34px;
    font-size: 3.4rem;
    line-height: 1.29412;
  }
}

.heading-section.-lower {
  margin-bottom: 45px;
}

@media screen and (max-width: 768px) {
  .heading-section.-lower {
    margin-bottom: 10.66667vw;
  }
}

.heading-section.-lower > .main {
  color: #333;
  font-size: 44px;
  font-size: 4.4rem;
  line-height: 1.5;
}

@media screen and (max-width: 768px) {
  .heading-section.-lower > .main {
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 1.5;
  }
}

.heading-section.-lower > .main > .em {
  color: #91711b;
}

/* ====================================

    4. Block

==================================== */
/*
  4-0. Container
==================================== */
.page {
  min-width: 1000px;
}

@media screen and (max-width: 768px) {
  .page {
    min-width: initial;
    padding-bottom: 16vw;
  }
}

.section {
  padding-top: 100px;
  padding-bottom: 100px;
}

@media screen and (max-width: 768px) {
  .section {
    padding-top: 13.33333vw;
    padding-bottom: 13.33333vw;
  }
}

.section-lower {
  padding-top: 90px;
}

.section-lead {
  font-size: 18px;
  font-size: 1.8rem;
  text-align: center;
  line-height: 1.77778;
}

@media screen and (max-width: 768px) {
  .section-lead {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.8125;
  }
}

.content {
  width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 768px) {
  .content {
    width: auto;
    margin-left: 5.33333vw;
    margin-right: 5.33333vw;
  }
}

/*
  4-1. Header
==================================== */
.header-container {
  position: relative;
  top: 0;
  z-index: 999;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: justify;
          justify-content: space-between;
  width: 100%;
  min-width: 1000px;
  height: 120px;
  padding-left: 2.5%;
}

@media screen and (min-width: 769px) {
  .header-container {
    -webkit-transition: top 1s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 1s cubic-bezier(0.215, 0.61, 0.355, 1);
  }
}

@media screen and (max-width: 768px) {
  .header-container {
    position: fixed;
    top: 0;
    left: 0;
    min-width: initial;
    height: 18.66667vw;
    padding-left: 5.33333vw;
    padding-right: 6.66667vw;
  }
}

@media screen and (min-width: 769px) {
  .is-header-through {
    padding-top: 120px;
  }
}

@media screen and (min-width: 769px) {
  .is-header-through .header-container {
    position: fixed;
    top: 0;
    left: 0;
    height: 100px;
    margin-top: -120px;
    background-color: #fff;
    pointer-events: none;
  }
}

@media screen and (min-width: 769px) {
  .is-header-fixed .header-container {
    top: 120px;
    pointer-events: auto;
  }
}

.header-logo {
  -webkit-box-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: flex;
}

.header-logo > .logo {
  width: 84px;
  margin-right: 1.25vw;
}

@media screen and (max-width: 768px) {
  .header-logo > .logo {
    width: 16vw;
    margin-right: 3.33333vw;
  }
}

.header-logo > .logo > a > img {
  width: 100%;
}

.header-logo > .copy {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .header-logo > .copy {
    font-size: 10px;
    font-size: 1rem;
  }
}

@media screen and (max-width: 768px) {
  .is-navopen .header-hamburger > .bar {
    width: 8.4vw;
  }
  .is-navopen .header-hamburger > .bar:nth-of-type(1) {
    top: 2.66667vw;
    left: -1.33333vw;
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
  }
  .is-navopen .header-hamburger > .bar:nth-of-type(2) {
    opacity: 0;
    -webkit-transform: translateX(4vw);
            transform: translateX(4vw);
  }
  .is-navopen .header-hamburger > .bar:nth-of-type(3) {
    bottom: 3.06667vw;
    left: -1.33333vw;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  }
}

.header-hamburger {
  display: none;
}

@media screen and (max-width: 768px) {
  .header-hamburger {
    position: relative;
    z-index: 1001;
    display: block;
    width: 4.8vw;
    height: 6.13333vw;
  }
  .header-hamburger > .bar {
    position: absolute;
    width: 4.8vw;
    height: 0.26667vw;
    background-color: #333;
    -webkit-transition: all .4s ease-out;
    transition: all .4s ease-out;
  }
  .header-hamburger > .bar:nth-of-type(1) {
    top: 0;
    left: 0;
  }
  .header-hamburger > .bar:nth-of-type(2) {
    top: 2.93333vw;
    left: 0;
  }
  .header-hamburger > .bar:nth-of-type(3) {
    bottom: 0;
    left: 0;
  }
}

@media screen and (max-width: 768px) {
  .is-navopen .header-nav {
    opacity: 1;
    pointer-events: auto;
  }
}

.header-nav {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-align: center;
          align-items: center;
  height: 100%;
}

@media screen and (max-width: 768px) {
  .header-nav {
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    padding: 22.66667vw 10.66667vw;
    overflow: scroll;
    background-color: #fff;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity .6s ease-out;
    transition: opacity .6s ease-out;
  }
}

@media screen and (max-width: 768px) {
  .header-nav > .item {
    text-align: center;
  }
  .header-nav > .item + .item {
    margin-top: 7.33333vw;
  }
}

.header-nav > .item > .link {
  position: relative;
  display: inline-block;
  padding-bottom: 15px;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .header-nav > .item > .link {
    padding-bottom: 3.33333vw;
  }
}

.header-nav > .item > .link::before {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background-color: #666666;
}

@media screen and (min-width: 769px) {
  .header-nav > .item > .link::before {
    -webkit-transition: width 1s cubic-bezier(0.23, 1, 0.32, 1);
    transition: width 1s cubic-bezier(0.23, 1, 0.32, 1);
  }
}

@media screen and (max-width: 768px) {
  .header-nav > .item > .link::before {
    width: 100%;
    height: 0.26667vw;
    background-color: #cccccc;
  }
}

@media screen and (min-width: 769px) {
  .header-nav > .item > .link:hover::before {
    width: 100%;
  }
}

.header-nav > .item + .item {
  margin-left: 2.5vw;
}

@media screen and (max-width: 768px) {
  .header-nav > .item + .item {
    margin-left: 0;
  }
}

.header-nav > .button {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
  width: 11.25vw;
  max-width: 180px;
  height: 100%;
}

@media screen and (max-width: 768px) {
  .header-nav > .button {
    width: 100%;
    max-width: initial;
    height: 17.33333vw;
    margin-left: auto;
    margin-right: auto;
  }
}

.header-nav > .button + .button {
  border-left: 1px solid #fff;
}

@media screen and (max-width: 768px) {
  .header-nav > .button + .button {
    border-left: none;
  }
}

@media screen and (min-width: 769px) {
  .header-nav > .button {
    -webkit-transition: background-color .6s ease-out;
    transition: background-color .6s ease-out;
  }
}

.header-nav > .button.-dark {
  background-color: #1f2e46;
}

@media screen and (min-width: 769px) {
  .header-nav > .button.-dark:hover {
    background-color: #3e4b5f;
  }
}

@media screen and (max-width: 768px) {
  .header-nav > .button.-dark {
    margin-top: 4vw;
  }
}

.header-nav > .button.-light {
  margin-left: 4.0625vw;
  background-color: #1b4791;
}

@media screen and (min-width: 769px) {
  .header-nav > .button.-light:hover {
    background-color: #31599c;
  }
}

@media screen and (max-width: 768px) {
  .header-nav > .button.-light {
    margin-left: auto;
    margin-top: 13.33333vw;
  }
}

.header-nav > .button > .label {
  color: #fff;
  font-weight: 500;
  letter-spacing: 0.2em;
  line-height: 1.5;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .header-nav > .button > .label {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

/*
  4-1. Conversion
==================================== */
.conversion-bar {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  -webkit-box-pack: center;
          justify-content: center;
  width: 100%;
  height: 400px;
  background: url(../images/conversion-ph_1.jpg) no-repeat center center;
  background-size: cover;
}

@media screen and (max-width: 768px) {
  .conversion-bar {
    height: 70.66667vw;
    background-image: url(../images/conversion-ph_1--md.jpg);
    background-size: cover;
  }
}

.conversion-bar > .copy {
  text-align: center;
}

.conversion-bar > .copy > .sub {
  color: #fff;
  font-size: 20px;
  font-size: 2rem;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .conversion-bar > .copy > .sub {
    font-size: 16px;
    font-size: 1.6rem;
  }
}

.conversion-bar > .copy > .main {
  margin-top: 15px;
  color: #fff;
  font-size: 32px;
  font-size: 3.2rem;
  font-weight: 500;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .conversion-bar > .copy > .main {
    margin-top: 2.66667vw;
    font-size: 20px;
    font-size: 2rem;
    line-height: 1.5;
  }
}

.conversion-bar > .button {
  position: relative;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
  width: 434px;
  height: 119px;
  margin-top: 40px;
  background-color: #1b4791;
}

@media screen and (max-width: 768px) {
  .conversion-bar > .button {
    width: 89.33333vw;
    height: 21.33333vw;
    margin-top: 5.33333vw;
  }
}

.conversion-bar > .button::before {
  position: absolute;
  top: 50%;
  right: -99px;
  content: "";
  width: 196px;
  height: 1px;
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  .conversion-bar > .button::before {
    right: 9.73333vw;
    width: 24.53333vw;
    height: 0.26667vw;
  }
}

.conversion-bar > .button::after {
  position: absolute;
  top: 50%;
  right: -99px;
  content: "";
  width: 17px;
  height: 1px;
  margin-top: -5px;
  background-color: #fff;
  -webkit-transform: rotate(35deg);
          transform: rotate(35deg);
}

@media screen and (max-width: 768px) {
  .conversion-bar > .button::after {
    right: 9.46667vw;
    width: 3.73333vw;
    height: 0.26667vw;
    margin-top: -1.06667vw;
  }
}

@media screen and (min-width: 769px) {
  .conversion-bar > .button {
    -webkit-transition: background-color 1s ease-out;
    transition: background-color 1s ease-out;
  }
  .conversion-bar > .button::before, .conversion-bar > .button::after {
    -webkit-transition: right 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    transition: right 0.8s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .conversion-bar > .button:hover {
    background-color: #31599c;
  }
  .conversion-bar > .button:hover::before, .conversion-bar > .button:hover::after {
    right: -120px;
  }
}

.conversion-bar > .button > .label {
  color: #fff;
  font-size: 20px;
  font-size: 2rem;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .conversion-bar > .button > .label {
    padding-right: 28.66667vw;
    font-size: 16px;
    font-size: 1.6rem;
  }
}

/*
  4-1. Footer
==================================== */
.footer-container {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-align: center;
          align-items: center;
  width: 100%;
  height: 80px;
  background-color: #222;
}

@media screen and (max-width: 768px) {
  .footer-container {
    position: relative;
    height: 48.66667vw;
    padding-left: 7.33333vw;
    padding-bottom: 7.33333vw;
    -webkit-box-pack: start;
            justify-content: flex-start;
    -webkit-box-align: end;
            align-items: flex-end;
  }
}

.footer-container > .copy {
  color: #ccc;
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
}

@media screen and (max-width: 768px) {
  .footer-container > .copy {
    font-size: 10px;
    font-size: 1rem;
  }
}

/*
  4-1. Pagetop
==================================== */
.pagetop-button {
  position: fixed;
  z-index: 998;
  display: block;
  right: 61px;
  bottom: 60px;
  width: 20px;
  height: 164px;
}

@media screen and (max-width: 768px) {
  .pagetop-button {
    position: absolute;
    right: 8vw;
    bottom: 8vw;
    width: 4.66667vw;
    height: 27.2vw;
  }
}

@media screen and (min-width: 769px) {
  .pagetop-button {
    opacity: 0;
    -webkit-transition: opacity .6s ease-out;
    transition: opacity .6s ease-out;
  }
}

@media screen and (min-width: 769px) {
  .pagetop-button.is-visible {
    opacity: 1;
  }
}

@media screen and (min-width: 769px) {
  .pagetop-button.is-absolute {
    position: absolute;
  }
}

.pagetop-button::before {
  position: absolute;
  top: 8px;
  right: -3px;
  content: "";
  width: 1px;
  height: 164px;
  background-color: #1b4791;
}

@media screen and (max-width: 768px) {
  .pagetop-button::before {
    top: 1.06667vw;
    right: -0.4vw;
    width: 0.26667vw;
    height: 27.2vw;
    background-color: #fff;
  }
}

.pagetop-button::after {
  position: absolute;
  top: 16px;
  right: -7px;
  content: "";
  width: 20px;
  height: 1px;
  background-color: #1b4791;
  -webkit-transform: rotate(-56deg);
          transform: rotate(-56deg);
}

@media screen and (max-width: 768px) {
  .pagetop-button::after {
    top: 2.13333vw;
    right: -0.93333vw;
    width: 2.66667vw;
    height: 0.26667vw;
    background-color: #fff;
  }
}

@media screen and (min-width: 769px) {
  .pagetop-button::before, .pagetop-button::after {
    -webkit-transition: top 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    transition: top 0.8s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .pagetop-button:hover::before {
    top: -5px;
  }
}

@media screen and (min-width: 769px) and (max-width: 768px) {
  .pagetop-button:hover::before {
    top: -0.66667vw;
  }
}

@media screen and (min-width: 769px) {
  .pagetop-button:hover::after {
    top: 3px;
  }
}

@media screen and (min-width: 769px) and (max-width: 768px) {
  .pagetop-button:hover::after {
    top: -0.4vw;
  }
}

.pagetop-button > .label {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #1b4791;
  font-size: 12px;
  font-size: 1.2rem;
  font-family: "Cormorant Garamond", serif;
  font-weight: 700;
  font-style: italic;
  line-height: 1;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  -webkit-transform: scale(-1, -1);
          transform: scale(-1, -1);
}

@media screen and (max-width: 768px) {
  .pagetop-button > .label {
    color: #fff;
    font-size: 10px;
    font-size: 1rem;
  }
}

/*
  4-1. Footer Button
==================================== */
.follow-buttons {
  display: none;
}

@media screen and (max-width: 768px) {
  .follow-buttons {
    position: fixed;
    z-index: 998;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 16vw;
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
  }
}

@media screen and (max-width: 768px) {
  .follow-buttons > .button {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
            align-items: center;
    -webkit-box-pack: center;
            justify-content: center;
    width: 50vw;
    height: 100%;
  }
}

@media screen and (max-width: 768px) {
  .follow-buttons > .button.-button1 {
    background-color: #1f2e46;
  }
}

@media screen and (max-width: 768px) {
  .follow-buttons > .button.-button2 {
    background-color: #1b4791;
  }
}

@media screen and (max-width: 768px) {
  .follow-buttons > .button > .label {
    color: #fff;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: 500;
  }
}

/* ====================================

    5. Pages

==================================== */
/*
  4-1. Visual
==================================== */
.visual-main {
  position: relative;
  width: 100%;
  height: 900px;
  margin-top: -120px;
  background: #ddd url(../images/visual-ph_1.jpg) no-repeat center top;
}

@media screen and (max-width: 768px) {
  .visual-main {
    height: 144vw;
    margin-top: 0;
    padding-top: 14vw;
    background-image: url(../images/visual-ph_1--md.jpg);
    background-size: cover;
  }
}

.visual-copy {
  position: absolute;
  top: 30%;
  left: 50%;
  margin-left: 6.875%;
}

@media screen and (max-width: 768px) {
  .visual-copy {
    position: static;
    margin-left: 0;
  }
}

.visual-copy > .main {
  margin-bottom: 20px;
  color: #1b4791;
  font-size: 42px;
  font-size: 4.2rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.54286;
}

@media screen and (max-width: 768px) {
  .visual-copy > .main {
    margin-bottom: 5.33333vw;
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 1.41667;
  }
}

.visual-copy > .lead {
  color: #111;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 2.4;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .visual-copy > .lead {
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 2.08333;
  }
}

/*
  4-1. Reservation
==================================== */
.reservation-bar {
  display: -webkit-box;
  display: flex;
  width: 100%;
  height: 100px;
}

@media screen and (max-width: 768px) {
  .reservation-bar {
    display: block;
    height: auto;
  }
}

.reservation-bar > .plan {
  -webkit-box-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
  height: 100%;
  background-color: #91711b;
}

@media screen and (max-width: 768px) {
  .reservation-bar > .plan {
    display: block;
    height: auto;
    text-align: center;
    padding-top: 4.66667vw;
    padding-bottom: 4.66667vw;
  }
}

.reservation-bar > .plan > .label {
  color: #fff;
  font-size: 20px;
  font-size: 2rem;
  margin-right: 2.1875vw;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .reservation-bar > .plan > .label {
    font-size: 16px;
    font-size: 1.6rem;
    margin-right: 0;
  }
}

.reservation-bar > .plan > .title {
  color: #fff;
  font-size: 15px;
  font-size: 1.5rem;
}

@media screen and (max-width: 768px) {
  .reservation-bar > .plan > .title {
    margin-top: 2.66667vw;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1.5;
  }
}

.reservation-bar > .button {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
  width: 29.25%;
  height: 100%;
  background-color: #7b5d1a;
}

@media screen and (min-width: 769px) {
  .reservation-bar > .button {
    -webkit-transition: background-color 1s ease-out;
    transition: background-color 1s ease-out;
  }
  .reservation-bar > .button > .label::before, .reservation-bar > .button > .label::after {
    -webkit-transition: right 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    transition: right 0.8s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .reservation-bar > .button:hover {
    background-color: #8b6d24;
  }
  .reservation-bar > .button:hover > .label::before, .reservation-bar > .button:hover > .label::after {
    right: -20px;
  }
}

@media screen and (max-width: 768px) {
  .reservation-bar > .button {
    width: 100%;
    height: 17.33333vw;
  }
}

.reservation-bar > .button > .label {
  position: relative;
  padding-right: 6.5625vw;
  color: #fff;
  font-size: 20px;
  font-size: 2rem;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .reservation-bar > .button > .label {
    padding-right: 29.33333vw;
    font-size: 16px;
    font-size: 1.6rem;
  }
}

.reservation-bar > .button > .label::before {
  position: absolute;
  top: 50%;
  right: 0;
  content: "";
  width: 4.9375vw;
  height: 1px;
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  .reservation-bar > .button > .label::before {
    width: 24.53333vw;
    height: 0.26667vw;
  }
}

.reservation-bar > .button > .label::after {
  position: absolute;
  top: 50%;
  right: 0;
  content: "";
  width: 17px;
  height: 1px;
  margin-top: -5px;
  background-color: #fff;
  -webkit-transform: rotate(35deg);
          transform: rotate(35deg);
}

@media screen and (max-width: 768px) {
  .reservation-bar > .button > .label::after {
    right: -0.26667vw;
    width: 4vw;
    height: 0.26667vw;
    margin-top: -1.06667vw;
  }
}

/*
  4-1. Task
==================================== */
.task-section {
  padding-bottom: 0;
}

.task-items {
  position: relative;
  top: -1.7em;
  margin-bottom: -2.5em;
  padding-top: 100px;
  padding-bottom: 60px;
}

@media screen and (max-width: 768px) {
  .task-items {
    top: 0;
    margin-bottom: 0;
    margin-top: -2vw;
    padding-top: 10.66667vw;
    padding-bottom: 16vw;
  }
}

@media screen and (max-width: 768px) {
  .task-phs {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100vw;
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
  }
}

.task-phs > .ph {
  position: absolute;
  z-index: -1;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .task-phs > .ph {
    position: static;
    width: 100% !important;
  }
}

.task-phs > .ph.-ph1 {
  top: 0;
  left: 0;
  width: 50vw;
  height: 510px;
  text-align: right;
  background-color: #d4d6d3;
}

@media screen and (max-width: 768px) {
  .task-phs > .ph.-ph1 {
    -webkit-box-ordinal-group: 2;
            order: 1;
    height: 68vw;
  }
  .task-phs > .ph.-ph1 img {
    left: -28vw;
  }
}

.task-phs > .ph.-ph2 {
  bottom: 0;
  left: 0;
  width: 50vw;
  height: 452px;
  text-align: right;
  background-color: #d4d6d3;
}

@media screen and (max-width: 768px) {
  .task-phs > .ph.-ph2 {
    -webkit-box-ordinal-group: 4;
            order: 3;
    height: 60vw;
  }
  .task-phs > .ph.-ph2 img {
    left: -26.66667vw;
  }
}

.task-phs > .ph.-ph3 {
  top: 50%;
  right: 0;
  width: 50vw;
  height: 660px;
  margin-top: -330px;
  background-color: #d4d6d3;
}

@media screen and (max-width: 768px) {
  .task-phs > .ph.-ph3 {
    -webkit-box-ordinal-group: 3;
            order: 2;
    height: 88vw;
    margin-top: 0;
  }
  .task-phs > .ph.-ph3 img {
    left: -18vw;
  }
}

.task-phs > .ph img {
  width: auto;
  height: 100%;
}

@media screen and (max-width: 768px) {
  .task-phs > .ph img {
    position: relative;
    display: block;
  }
}

.task-box {
  position: relative;
  width: 880px;
  height: 800px;
  margin-left: auto;
  margin-right: auto;
  background-color: rgba(1, 54, 143, 0.8);
}

@media screen and (max-width: 768px) {
  .task-box {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    -webkit-box-pack: justify;
            justify-content: space-between;
    width: 78.66667vw;
    height: 189.33333vw;
    padding-top: 15.33333vw;
    padding-bottom: 18vw;
  }
}

.task-box.is-passed > .item {
  opacity: 1;
  -webkit-transform: translateY(0) scale(1);
          transform: translateY(0) scale(1);
  -webkit-filter: blur(0);
          filter: blur(0);
  -webkit-transition: opacity .4s ease-out, -webkit-transform .8s ease-out, -webkit-filter .8s ease-out;
  transition: opacity .4s ease-out, -webkit-transform .8s ease-out, -webkit-filter .8s ease-out;
  transition: opacity .4s ease-out, transform .8s ease-out, filter .8s ease-out;
  transition: opacity .4s ease-out, transform .8s ease-out, filter .8s ease-out, -webkit-transform .8s ease-out, -webkit-filter .8s ease-out;
}

.task-box.is-passed > .item:nth-of-type(1) {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}

.task-box.is-passed > .item:nth-of-type(2) {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}

.task-box.is-passed > .item:nth-of-type(3) {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}

.task-box.is-passed > .item:nth-of-type(4) {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}

.task-box.is-passed > .item:nth-of-type(5) {
  -webkit-transition-delay: 1s;
          transition-delay: 1s;
}

.task-box.is-passed > .item:nth-of-type(6) {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}

.task-box > .item {
  position: absolute;
  padding-bottom: 20px;
  opacity: 0;
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
  -webkit-filter: blur(30px);
          filter: blur(30px);
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .task-box > .item {
    position: static;
    padding-bottom: 4.66667vw;
  }
}

.task-box > .item::before, .task-box > .item::after {
  position: absolute;
  content: "";
  bottom: -5px;
  width: 12px;
  height: 1px;
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  .task-box > .item::before, .task-box > .item::after {
    bottom: -1.06667vw;
    width: 2.66667vw;
    height: 0.26667vw;
  }
}

.task-box > .item::before {
  left: 50%;
  -webkit-transform: rotate(120deg);
          transform: rotate(120deg);
  margin-left: -3px;
}

@media screen and (max-width: 768px) {
  .task-box > .item::before {
    margin-left: -0.66667vw;
  }
}

.task-box > .item::after {
  right: 50%;
  margin-right: -3px;
  -webkit-transform: rotate(-120deg);
          transform: rotate(-120deg);
}

@media screen and (max-width: 768px) {
  .task-box > .item::after {
    margin-right: -0.73333vw;
  }
}

.task-box > .item:nth-of-type(1) {
  top: 87px;
  left: 206px;
}

.task-box > .item:nth-of-type(2) {
  top: 184px;
  right: 98px;
}

.task-box > .item:nth-of-type(3) {
  top: 314px;
  left: 90px;
}

.task-box > .item:nth-of-type(4) {
  top: 360px;
  right: 65px;
}

.task-box > .item:nth-of-type(5) {
  top: 530px;
  left: 62px;
}

.task-box > .item:nth-of-type(6) {
  top: 608px;
  right: 102px;
}

.task-box > .item > .text {
  color: #fff;
  font-size: 20px;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.8;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .task-box > .item > .text {
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.5;
  }
}

.task-box > .item > .text::before {
  position: absolute;
  content: "";
  bottom: 0;
  left: 50%;
  width: 115px;
  height: 1px;
  background: -webkit-gradient(linear, left top, right top, from(white), color-stop(45%, white), color-stop(45%, rgba(255, 255, 255, 0)), color-stop(55%, rgba(255, 255, 255, 0)), color-stop(55%, white), to(white));
  background: linear-gradient(90deg, white 0%, white 45%, rgba(255, 255, 255, 0) 45%, rgba(255, 255, 255, 0) 55%, white 55%, white 100%);
  margin-left: -57.5px;
}

@media screen and (max-width: 768px) {
  .task-box > .item > .text::before {
    width: 23.33333vw;
    height: 0.26667vw;
    margin-left: -11.66667vw;
  }
}

.task-box > .item > .text.-large {
  font-size: 28px;
  font-size: 2.8rem;
}

@media screen and (max-width: 768px) {
  .task-box > .item > .text.-large {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.5;
  }
}

.task-book {
  position: relative;
  width: 800px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 185px;
  padding-bottom: 200px;
}

@media screen and (max-width: 768px) {
  .task-book {
    width: auto;
    margin-left: 5.33333vw;
    margin-right: 5.33333vw;
    padding-top: 22vw;
    padding-bottom: 10.66667vw;
  }
}

.task-book.is-passed > .copys > .catch > .main::before {
  width: 100%;
  -webkit-transition: width 0.8s cubic-bezier(0.86, 0, 0.07, 1);
  transition: width 0.8s cubic-bezier(0.86, 0, 0.07, 1);
}

.task-book > .copys {
  position: relative;
  z-index: 1;
}

.task-book > .copys > .text {
  font-size: 34px;
  font-size: 3.4rem;
  font-weight: 500;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .task-book > .copys > .text {
    font-size: 24px;
    font-size: 2.4rem;
  }
}

.task-book > .copys > .catch {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  margin-top: 20px;
}

@media screen and (max-width: 768px) {
  .task-book > .copys > .catch {
    flex-wrap: wrap;
    margin-top: 3.33333vw;
  }
}

.task-book > .copys > .catch > .main {
  position: relative;
  display: inline-block;
  padding: 20px;
  color: #fff;
  font-size: 44px;
  font-size: 4.4rem;
  font-weight: 400;
}

@media screen and (max-width: 768px) {
  .task-book > .copys > .catch > .main {
    padding: 2.66667vw;
    font-size: 29px;
    font-size: 2.9rem;
  }
}

.task-book > .copys > .catch > .main::before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  content: "";
  background-color: #1b4791;
}

.task-book > .copys > .catch > .sub {
  display: inline-block;
  padding-left: 10px;
}

@media screen and (max-width: 768px) {
  .task-book > .copys > .catch > .sub {
    margin-top: 3.33333vw;
    margin-right: 0;
    margin-left: auto;
    padding-left: 0;
  }
}

.task-book > .copys > .lead {
  margin-top: 55px;
  font-size: 18px;
  font-size: 1.8rem;
}

@media screen and (max-width: 768px) {
  .task-book > .copys > .lead {
    margin-top: 28.66667vw;
    font-size: 16px;
    font-size: 1.6rem;
  }
}

.task-book > .ph {
  position: absolute;
  top: 50%;
  right: -145px;
  margin-top: -320px;
  width: 640px;
}

@media screen and (max-width: 768px) {
  .task-book > .ph {
    width: 85.33333vw;
    top: 0;
    left: 50%;
    right: auto;
    margin-top: 0;
    margin-left: -42.66667vw;
  }
  .task-book > .ph img {
    width: 100%;
  }
}

/*
  4-1. Reason
==================================== */
@media screen and (max-width: 768px) {
  .reason-section {
    padding-bottom: 0;
  }
}

.reason-container {
  position: relative;
  z-index: -1;
  top: -2.8em;
  margin-bottom: -2.8em;
  padding-top: 80px;
  padding-bottom: 145px;
  background: #edf1f5 url(../images/reason-ph_1.jpg) no-repeat center bottom;
  margin-left: 6.25vw;
  margin-right: 6.25vw;
}

@media screen and (max-width: 768px) {
  .reason-container {
    top: -1.8em;
    margin-left: 0;
    margin-right: 0;
    padding-top: 19.33333vw;
    padding-bottom: 16vw;
    background: #edf1f5 url(../images/reason-ph_1--md.jpg) no-repeat center bottom;
    background-size: 100% auto;
  }
}

.reason-method {
  margin-top: 90px;
}

@media screen and (max-width: 768px) {
  .reason-method {
    margin-top: 12vw;
  }
}

.reason-method > .title {
  margin-bottom: 70px;
}

@media screen and (max-width: 768px) {
  .reason-method > .title {
    margin-bottom: 10.66667vw;
  }
}

.reason-method > .title > .sub {
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .reason-method > .title > .sub {
    font-size: 19px;
    font-size: 1.9rem;
  }
}

.reason-method > .title > .main {
  display: inline-block;
  margin-top: 15px;
  padding: 20px 30px;
  color: #fff;
  font-size: 34px;
  font-size: 3.4rem;
  line-height: 1;
  background-color: #1b4791;
}

@media screen and (max-width: 768px) {
  .reason-method > .title > .main {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
            align-items: center;
    padding-left: 5.33333vw;
    padding-right: 5.33333vw;
    padding-top: 0;
    padding-bottom: 0;
    width: 100%;
    height: 26.13333vw;
    margin-top: 4vw;
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 1.5;
  }
}

.reason-method > .item {
  opacity: 0;
  -webkit-transform: translateY(30px);
          transform: translateY(30px);
}

@media screen and (max-width: 768px) {
  .reason-method > .item {
    -webkit-transform: translateY(8vw);
            transform: translateY(8vw);
  }
}

.reason-item {
  position: relative;
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-align: center;
          align-items: center;
  background-color: #fff;
  padding-left: 60px;
  padding-right: 45px;
  padding-bottom: 35px;
}

@media screen and (max-width: 768px) {
  .reason-item {
    display: block;
    padding-left: 5.33333vw;
    padding-right: 5.33333vw;
    padding-bottom: 12.66667vw;
  }
}

.reason-item.is-passed {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition: opacity .6s ease-out, -webkit-transform .6s ease-out;
  transition: opacity .6s ease-out, -webkit-transform .6s ease-out;
  transition: opacity .6s ease-out, transform .6s ease-out;
  transition: opacity .6s ease-out, transform .6s ease-out, -webkit-transform .6s ease-out;
}

.reason-item.is-passed::before {
  height: 180px;
  -webkit-transition: height 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: height 1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

@media screen and (max-width: 768px) {
  .reason-item.is-passed::before {
    height: 22.66667vw;
  }
}

.reason-item.is-passed::after {
  height: 17px;
  -webkit-transition: height 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: height 1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

@media screen and (max-width: 768px) {
  .reason-item.is-passed::after {
    height: 3.6vw;
  }
}

.reason-item::before, .reason-item::after {
  position: absolute;
  left: 50%;
  content: "";
  background-color: #1b4791;
}

.reason-item::before {
  top: 142px;
  width: 1px;
  height: 0;
}

@media screen and (max-width: 768px) {
  .reason-item::before {
    top: 87%;
    width: 0.26667vw;
  }
}

.reason-item::after {
  bottom: -90px;
  width: 1px;
  height: 0;
  margin-left: -5px;
  -webkit-transform: rotate(-35deg);
          transform: rotate(-35deg);
}

@media screen and (max-width: 768px) {
  .reason-item::after {
    bottom: -11.2vw;
    width: 0.26667vw;
  }
}

.reason-item:last-of-type::before, .reason-item:last-of-type::after {
  display: none;
}

.reason-item + .reason-item {
  margin-top: 120px;
}

@media screen and (max-width: 768px) {
  .reason-item + .reason-item {
    margin-top: 19.33333vw;
  }
}

.reason-item > .title {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: end;
          align-items: flex-end;
  width: 100%;
  margin-top: -1.2em;
  margin-bottom: 50px;
}

@media screen and (max-width: 768px) {
  .reason-item > .title {
    position: relative;
    top: -1.2em;
    display: block;
    margin-top: 0;
    margin-bottom: 2.66667vw;
  }
}

.reason-item > .title > .main {
  margin-right: 25px;
  color: #1b4791;
  font-size: 64px;
  font-size: 6.4rem;
  font-weight: 300;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .reason-item > .title > .main {
    margin-right: 0;
    margin-bottom: 2.66667vw;
    font-size: 39px;
    font-size: 3.9rem;
  }
}

.reason-item > .title > .sub {
  font-size: 34px;
  font-size: 3.4rem;
  color: #1b4791;
  font-family: "Cormorant Garamond", serif;
  font-weight: 500;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .reason-item > .title > .sub {
    font-size: 24px;
    font-size: 2.4rem;
  }
}

.reason-item > .simple {
  -webkit-box-flex: 1;
          flex: 1;
  font-size: 24px;
  font-size: 2.4rem;
  line-height: 1.83333;
}

@media screen and (max-width: 768px) {
  .reason-item > .simple {
    font-size: 19px;
    font-size: 1.9rem;
  }
}

.reason-item > .detail {
  width: 375px;
  font-size: 15px;
  font-size: 1.5rem;
}

@media screen and (max-width: 768px) {
  .reason-item > .detail {
    width: auto;
    margin-top: 4.66667vw;
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 768px) {
  .reason-lead {
    text-align: left;
  }
}

.reason-point {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
          justify-content: space-between;
  margin-top: 80px;
  margin-bottom: 90px;
  counter-increment: point 0;
}

@media screen and (max-width: 768px) {
  .reason-point {
    display: block;
    margin-top: 13.33333vw;
    margin-bottom: 13.33333vw;
  }
}

.reason-point.is-passed > .item {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition: opacity .6s ease-out, -webkit-transform .6s ease-out;
  transition: opacity .6s ease-out, -webkit-transform .6s ease-out;
  transition: opacity .6s ease-out, transform .6s ease-out;
  transition: opacity .6s ease-out, transform .6s ease-out, -webkit-transform .6s ease-out;
}

.reason-point.is-passed > .item:nth-of-type(2) {
  -webkit-transition-delay: .3s;
          transition-delay: .3s;
}

.reason-point.is-passed > .item:nth-of-type(3) {
  -webkit-transition-delay: .6s;
          transition-delay: .6s;
}

.reason-point > .title {
  position: relative;
  width: 100%;
  margin-bottom: 115px;
  color: #91711b;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 500;
  text-align: center;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .reason-point > .title {
    margin-bottom: 20vw;
    font-size: 19px;
    font-size: 1.9rem;
  }
}

.reason-point > .title::before {
  position: absolute;
  top: 50%;
  left: 50%;
  content: "";
  width: 490px;
  height: 2px;
  margin-left: -245px;
  margin-top: -1px;
  background: -webkit-gradient(linear, left top, right top, from(#91711b), color-stop(20%, #91711b), color-stop(20%, rgba(145, 113, 27, 0)), color-stop(80%, rgba(145, 113, 27, 0)), color-stop(80%, #91711b), to(#91711b));
  background: linear-gradient(90deg, #91711b 0%, #91711b 20%, rgba(145, 113, 27, 0) 20%, rgba(145, 113, 27, 0) 80%, #91711b 80%, #91711b 100%);
}

@media screen and (max-width: 768px) {
  .reason-point > .title::before {
    width: 88vw;
    height: 0.53333vw;
    margin-left: -44vw;
    margin-top: -0.26667vw;
    background: -webkit-gradient(linear, left top, right top, from(#91711b), color-stop(15%, #91711b), color-stop(15%, rgba(145, 113, 27, 0)), color-stop(85%, rgba(145, 113, 27, 0)), color-stop(85%, #91711b), to(#91711b));
    background: linear-gradient(90deg, #91711b 0%, #91711b 15%, rgba(145, 113, 27, 0) 15%, rgba(145, 113, 27, 0) 85%, #91711b 85%, #91711b 100%);
  }
}

.reason-point > .item {
  position: relative;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background-color: #eeeeee;
  opacity: 0;
  -webkit-transform: translateY(30px);
          transform: translateY(30px);
}

@media screen and (max-width: 768px) {
  .reason-point > .item {
    -webkit-box-pack: start;
            justify-content: flex-start;
    width: 100%;
    height: 48vw;
    padding-top: 14.66667vw;
    border-radius: 24vw;
    -webkit-transform: translateY(4vw);
            transform: translateY(4vw);
  }
  .reason-point > .item + .item {
    margin-top: 19.33333vw;
  }
}

.reason-point > .item::before, .reason-point > .item::after {
  position: absolute;
  color: #91711b;
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
  line-height: 1;
}

.reason-point > .item::before {
  content: "Point";
  top: -60px;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .reason-point > .item::before {
    top: -14.66667vw;
    font-size: 19px;
    font-size: 1.9rem;
  }
}

.reason-point > .item::after {
  top: -40px;
  left: 0;
  width: 100%;
  counter-increment: point 1;
  content: counter(point, decimal-leading-zero);
  font-weight: 300;
  font-variant: lining-nums;
  font-size: 90px;
  font-size: 9rem;
  letter-spacing: .11em;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .reason-point > .item::after {
    top: -11.33333vw;
  }
}

.reason-point > .item > .label {
  margin-bottom: 20px;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .reason-point > .item > .label {
    font-size: 19px;
    font-size: 1.9rem;
  }
}

.reason-point > .item > .body {
  text-align: center;
}

@media screen and (max-width: 768px) {
  .reason-point > .item > .body {
    text-align: left;
  }
}

.reason-knowhow {
  margin-left: 6.25vw;
  margin-right: 6.25vw;
  background-color: #1b4791;
}

@media screen and (max-width: 768px) {
  .reason-knowhow {
    margin-left: 0;
    margin-right: 0;
  }
}

.reason-knowhow.is-passed > .inner > .title > .main > .embox::before,
.reason-knowhow.is-passed > .inner > .title > .main > .embox > span::before {
  width: 100%;
  -webkit-transition: width .4s ease;
  transition: width .4s ease;
}

.reason-knowhow.is-passed > .inner > .title > .main > .embox::after,
.reason-knowhow.is-passed > .inner > .title > .main > .embox > span::after {
  height: 100%;
  -webkit-transition: height .4s ease;
  transition: height .4s ease;
}

.reason-knowhow.is-passed > .inner > .title > .main > .embox::after {
  -webkit-transition-delay: .4s;
          transition-delay: .4s;
}

.reason-knowhow.is-passed > .inner > .title > .main > .embox > span::before {
  -webkit-transition-delay: .8s;
          transition-delay: .8s;
}

.reason-knowhow.is-passed > .inner > .title > .main > .embox > span::after {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s;
}

.reason-knowhow > .inner {
  position: relative;
  padding-top: 120px;
  padding-bottom: 120px;
}

@media screen and (max-width: 768px) {
  .reason-knowhow > .inner {
    padding-top: 17.33333vw;
    padding-bottom: 14.66667vw;
  }
}

.reason-knowhow > .inner::before {
  position: absolute;
  top: -.18em;
  right: 0;
  content: "KnowHow";
  color: #fff;
  font-size: 100px;
  font-size: 10rem;
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
  font-style: italic;
  line-height: 1;
  letter-spacing: 0.07em;
  opacity: .2;
}

@media screen and (max-width: 768px) {
  .reason-knowhow > .inner::before {
    font-size: 50px;
    font-size: 5rem;
  }
}

.reason-knowhow > .inner > .title > .sub {
  margin-bottom: 10px;
  color: #fff;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .reason-knowhow > .inner > .title > .sub {
    margin-bottom: 2.66667vw;
    font-size: 19px;
    font-size: 1.9rem;
  }
}

.reason-knowhow > .inner > .title > .main {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
}

@media screen and (max-width: 768px) {
  .reason-knowhow > .inner > .title > .main {
    flex-wrap: wrap;
  }
}

.reason-knowhow > .inner > .title > .main > .text {
  color: #fff;
  font-size: 34px;
  font-size: 3.4rem;
  font-weight: 500;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .reason-knowhow > .inner > .title > .main > .text {
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 1.79167;
  }
}

.reason-knowhow > .inner > .title > .main > .embox {
  position: relative;
  margin-left: 15px;
  margin-right: 15px;
  padding: 15px 20px;
}

@media screen and (max-width: 768px) {
  .reason-knowhow > .inner > .title > .main > .embox {
    display: inline-block;
    margin-top: 2.66667vw;
    margin-left: 0;
    margin-right: 1.33333vw;
    padding: 2vw 3.33333vw;
  }
  .reason-knowhow > .inner > .title > .main > .embox + .text {
    margin-top: 2.66667vw;
  }
}

.reason-knowhow > .inner > .title > .main > .embox::before, .reason-knowhow > .inner > .title > .main > .embox::after {
  position: absolute;
  content: "";
  background-color: #fff;
}

.reason-knowhow > .inner > .title > .main > .embox::before {
  top: 0;
  left: 0;
  width: 0;
  height: 2px;
}

@media screen and (max-width: 768px) {
  .reason-knowhow > .inner > .title > .main > .embox::before {
    height: 0.53333vw;
  }
}

.reason-knowhow > .inner > .title > .main > .embox::after {
  top: 0;
  right: 0;
  width: 2px;
  height: 0;
}

@media screen and (max-width: 768px) {
  .reason-knowhow > .inner > .title > .main > .embox::after {
    width: 0.53333vw;
  }
}

.reason-knowhow > .inner > .title > .main > .embox > span {
  display: inline-block;
}

.reason-knowhow > .inner > .title > .main > .embox > span::before, .reason-knowhow > .inner > .title > .main > .embox > span::after {
  position: absolute;
  content: "";
  background-color: #fff;
}

.reason-knowhow > .inner > .title > .main > .embox > span::before {
  bottom: 0;
  right: 0;
  width: 0;
  height: 2px;
}

@media screen and (max-width: 768px) {
  .reason-knowhow > .inner > .title > .main > .embox > span::before {
    height: 0.53333vw;
  }
}

.reason-knowhow > .inner > .title > .main > .embox > span::after {
  bottom: 0;
  left: 0;
  width: 2px;
  height: 0;
}

@media screen and (max-width: 768px) {
  .reason-knowhow > .inner > .title > .main > .embox > span::after {
    width: 0.53333vw;
  }
}

.reason-boxlist {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  margin-top: 80px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    margin-top: 12vw;
  }
}

.reason-boxlist > .item {
  position: relative;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  width: calc(100% / 3);
  height: 300px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item {
    width: auto;
    height: auto;
    margin-top: 80px;
    margin-left: 5.33333vw;
    margin-right: 5.33333vw;
    padding-bottom: 10.66667vw;
    border-bottom: 0.53333vw solid #fff;
  }
  .reason-boxlist > .item:nth-of-type(1) {
    -webkit-box-ordinal-group: 4;
            order: 3;
  }
  .reason-boxlist > .item:nth-of-type(2) {
    -webkit-box-ordinal-group: 5;
            order: 4;
  }
  .reason-boxlist > .item:nth-of-type(3) {
    -webkit-box-ordinal-group: 2;
            order: 1;
  }
  .reason-boxlist > .item:nth-of-type(4) {
    -webkit-box-ordinal-group: 6;
            order: 5;
  }
  .reason-boxlist > .item:nth-of-type(5) {
    -webkit-box-ordinal-group: 7;
            order: 6;
  }
  .reason-boxlist > .item:nth-of-type(6) {
    -webkit-box-ordinal-group: 8;
            order: 7;
  }
  .reason-boxlist > .item:nth-of-type(7) {
    -webkit-box-ordinal-group: 3;
            order: 2;
  }
  .reason-boxlist > .item:nth-of-type(8) {
    -webkit-box-ordinal-group: 9;
            order: 8;
  }
  .reason-boxlist > .item:nth-of-type(9) {
    -webkit-box-ordinal-group: 10;
            order: 9;
  }
  .reason-boxlist > .item + .item.-em {
    margin-top: 2.66667vw;
  }
}

.reason-boxlist > .item:nth-of-type(1)::before, .reason-boxlist > .item:nth-of-type(1)::after, .reason-boxlist > .item:nth-of-type(2)::before, .reason-boxlist > .item:nth-of-type(2)::after, .reason-boxlist > .item:nth-of-type(8)::before, .reason-boxlist > .item:nth-of-type(8)::after, .reason-boxlist > .item:nth-of-type(9)::before, .reason-boxlist > .item:nth-of-type(9)::after {
  position: absolute;
  content: "";
  width: 30px;
  height: 1px;
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item:nth-of-type(1)::before, .reason-boxlist > .item:nth-of-type(1)::after, .reason-boxlist > .item:nth-of-type(2)::before, .reason-boxlist > .item:nth-of-type(2)::after, .reason-boxlist > .item:nth-of-type(8)::before, .reason-boxlist > .item:nth-of-type(8)::after, .reason-boxlist > .item:nth-of-type(9)::before, .reason-boxlist > .item:nth-of-type(9)::after {
    display: none;
  }
}

.reason-boxlist > .item:nth-of-type(1)::before, .reason-boxlist > .item:nth-of-type(2)::before, .reason-boxlist > .item:nth-of-type(8)::before, .reason-boxlist > .item:nth-of-type(9)::before {
  width: 30px;
  height: 1px;
}

.reason-boxlist > .item:nth-of-type(1)::after, .reason-boxlist > .item:nth-of-type(2)::after, .reason-boxlist > .item:nth-of-type(8)::after, .reason-boxlist > .item:nth-of-type(9)::after {
  width: 1px;
  height: 30px;
}

.reason-boxlist > .item:nth-of-type(1)::before {
  right: -15px;
  bottom: 0;
}

.reason-boxlist > .item:nth-of-type(1)::after {
  right: 0;
  bottom: -15px;
}

.reason-boxlist > .item:nth-of-type(2)::before {
  right: -16px;
  bottom: 0;
}

.reason-boxlist > .item:nth-of-type(2)::after {
  right: -1px;
  bottom: -15px;
}

.reason-boxlist > .item:nth-of-type(8)::before {
  left: -16px;
  top: 0;
}

.reason-boxlist > .item:nth-of-type(8)::after {
  left: -1px;
  top: -15px;
}

.reason-boxlist > .item:nth-of-type(9)::before {
  left: -15px;
  top: 0;
}

.reason-boxlist > .item:nth-of-type(9)::after {
  left: 0;
  top: -15px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item.-em {
    height: 29.33333vw;
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    padding-top: 0;
    border-bottom: none;
  }
}

.reason-boxlist > .item.-em.is-passed {
  -webkit-perspective: 1000;
          perspective: 1000;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg);
  -webkit-transition: -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.reason-boxlist > .item.-em.is-passed > .cover,
.reason-boxlist > .item.-em.is-passed > .main {
  opacity: 1;
  -webkit-transition: opacity 1.4s ease-out;
  transition: opacity 1.4s ease-out;
}

.reason-boxlist > .item.-em > .cover,
.reason-boxlist > .item.-em > .main {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  opacity: 0;
}

.reason-boxlist > .item.-em > .cover {
  z-index: 2;
  background-color: #1b4791;
}

.reason-boxlist > .item.-em > .main {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg);
  background: linear-gradient(138deg, white 0%, white 50%, #eeeeee 50%, #eeeeee 100%);
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item.-em > .main {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
            flex-direction: row;
    background: linear-gradient(162deg, white 0%, white 50%, #eeeeee 50%, #eeeeee 100%);
  }
}

.reason-boxlist > .item.-em > .main > .label {
  color: inherit;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item.-em > .main > .label {
    margin-right: 6.66667vw;
    font-size: 19px;
    font-size: 1.9rem;
  }
}

.reason-boxlist > .item.-em > .main > .data {
  padding-bottom: 15px;
  color: #91711b;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1;
  border-bottom: 2px solid #91711b;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item.-em > .main > .data {
    padding-bottom: 2.66667vw;
    font-size: 19px;
    font-size: 1.9rem;
  }
}

.reason-boxlist > .item.-em > .main > .data > .num {
  font-size: 64px;
  font-size: 6.4rem;
  font-family: "Cormorant Garamond", serif;
  font-weight: 500;
  font-variant: lining-nums;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item.-em > .main > .data > .num {
    font-size: 39px;
    font-size: 3.9rem;
  }
}

.reason-boxlist > .item > .icon {
  fill: #fff;
  margin-bottom: 25px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item > .icon {
    margin-bottom: 5.33333vw;
  }
}

.reason-boxlist > .item > .icon.-search {
  width: 60px;
  height: 53px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item > .icon.-search {
    width: 15.68vw;
    height: 13.85067vw;
  }
}

.reason-boxlist > .item > .icon.-megaphone {
  width: 52px;
  height: 51px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item > .icon.-megaphone {
    width: 13.58933vw;
    height: 13.328vw;
  }
}

.reason-boxlist > .item > .icon.-bag {
  width: 53px;
  height: 48px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item > .icon.-bag {
    width: 13.85067vw;
    height: 12.544vw;
  }
}

.reason-boxlist > .item > .icon.-pen {
  width: 52px;
  height: 52px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item > .icon.-pen {
    width: 13.58933vw;
    height: 13.58933vw;
  }
}

.reason-boxlist > .item > .icon.-flag {
  width: 49px;
  height: 50px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item > .icon.-flag {
    width: 12.80533vw;
    height: 13.06667vw;
  }
}

.reason-boxlist > .item > .icon.-human {
  width: 44px;
  height: 56px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item > .icon.-human {
    width: 11.49867vw;
    height: 14.63467vw;
  }
}

.reason-boxlist > .item > .icon.-network {
  width: 52px;
  height: 54px;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item > .icon.-network {
    width: 13.58933vw;
    height: 14.112vw;
  }
}

.reason-boxlist > .item > .label {
  margin-bottom: 25px;
  color: #fff;
  font-size: 24px;
  font-size: 2.4rem;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item > .label {
    font-size: 19px;
    font-size: 1.9rem;
    margin-bottom: 2.66667vw;
  }
}

.reason-boxlist > .item > .body {
  color: #fff;
  font-weight: 200;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .reason-boxlist > .item > .body {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

/*
  4-1. Seminar
==================================== */
.seminar-section {
  background: #eeeeee url(../images/seminar-bg_1.jpg) no-repeat center top;
}

@media screen and (max-width: 768px) {
  .seminar-section {
    background-image: url(../images/seminar-bg_1--md.jpg);
    background-size: 100% auto;
  }
}

.seminar-container.-column {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  .seminar-container.-column {
    display: block;
  }
}

.seminar-container.-column > .heading {
  width: 170px;
  margin-bottom: 0;
}

@media screen and (max-width: 768px) {
  .seminar-container.-column > .heading {
    width: auto;
  }
}

.seminar-container.-column > .body {
  -webkit-box-flex: 1;
          flex: 1;
}

.seminar-container + .seminar-container {
  margin-top: 80px;
}

@media screen and (max-width: 768px) {
  .seminar-container + .seminar-container {
    margin-top: 10.66667vw;
  }
}

.seminar-container:first-of-type {
  margin-top: 80px;
}

@media screen and (max-width: 768px) {
  .seminar-container:first-of-type {
    margin-top: 10.66667vw;
  }
}

.seminar-container > .heading {
  margin-bottom: 40px;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .seminar-container > .heading {
    margin-bottom: 4vw;
    font-size: 19px;
    font-size: 1.9rem;
  }
}

.seminar-detail {
  padding: 45px 50px;
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  .seminar-detail {
    padding: 8vw 5.33333vw;
  }
}

.seminar-detail > .part > .wrap {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-align: center;
          align-items: center;
}

@media screen and (max-width: 768px) {
  .seminar-detail > .part > .wrap {
    display: block;
  }
}

.seminar-detail > .part > .wrap + .wrap {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px solid #ccc;
}

@media screen and (max-width: 768px) {
  .seminar-detail > .part > .wrap + .wrap {
    margin-top: 8vw;
    padding-top: 8vw;
    border-top-width: 0.26667vw;
  }
}

.seminar-detail > .part > .wrap > .label {
  width: 115px;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .seminar-detail > .part > .wrap > .label {
    width: auto;
    margin-bottom: 2.66667vw;
    font-size: 16px;
    font-size: 1.6rem;
  }
}

.seminar-detail > .part > .wrap > .detail {
  -webkit-box-flex: 1;
          flex: 1;
}

.seminar-detail > .part > .wrap > .detail > .list > .item {
  position: relative;
  padding-left: 1em;
}

@media screen and (max-width: 768px) {
  .seminar-detail > .part > .wrap > .detail > .list > .item {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.seminar-detail > .part > .wrap > .detail > .list > .item::before {
  position: absolute;
  content: "";
  top: 0.6em;
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #333;
}

@media screen and (max-width: 768px) {
  .seminar-detail > .part > .wrap > .detail > .list > .item::before {
    width: 0.8vw;
    height: 0.8vw;
  }
}

.seminar-detail > .part > .wrap > .detail > .note {
  display: inline-block;
  padding-left: 1em;
  font-size: 14px;
  font-size: 1.4rem;
}

@media screen and (max-width: 768px) {
  .seminar-detail > .part > .wrap > .detail > .note {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.seminar-cost {
  margin-top: 100px !important;
  padding-bottom: 35px;
  border-bottom: 1px solid #999999;
}

@media screen and (max-width: 768px) {
  .seminar-cost {
    margin-top: 12vw !important;
    padding-bottom: 6.66667vw;
    border-bottom-width: 0.26667vw;
  }
}

.seminar-cost > .body {
  color: #1b4791;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: 0.2em;
}

@media screen and (max-width: 768px) {
  .seminar-cost > .body {
    font-size: 16px;
    font-size: 1.6rem;
  }
}

.seminar-teacher {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-align: center;
          align-items: center;
}

@media screen and (max-width: 768px) {
  .seminar-teacher {
    display: block;
    padding-left: 5.33333vw;
    padding-right: 5.33333vw;
  }
}

@media screen and (max-width: 768px) {
  .seminar-teacher:first-of-type {
    margin-top: 6.66667vw;
  }
}

.seminar-teacher + .seminar-teacher {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 1px solid #999;
}

@media screen and (max-width: 768px) {
  .seminar-teacher + .seminar-teacher {
    margin-top: 8vw;
    padding-top: 8vw;
    border-top-width: 0.26667vw;
  }
}

.seminar-teacher > .avatar {
  width: 200px;
  height: 200px;
  margin-right: 40px;
  background-color: #999;
}

@media screen and (max-width: 768px) {
  .seminar-teacher > .avatar {
    width: 78.66667vw;
    height: 78.66667vw;
    margin-bottom: 7.33333vw;
    margin-right: 0;
  }
  .seminar-teacher > .avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
}

.seminar-teacher > .profile {
  width: 320px;
}

@media screen and (max-width: 768px) {
  .seminar-teacher > .profile {
    width: auto;
  }
}

.seminar-teacher > .profile > .name {
  margin-bottom: 15px;
  font-size: 20px;
  font-size: 2rem;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .seminar-teacher > .profile > .name {
    margin-bottom: 2.66667vw;
    font-size: 18px;
    font-size: 1.8rem;
  }
}

.seminar-teacher > .note {
  -webkit-box-flex: 1;
          flex: 1;
  font-size: 15px;
  font-size: 1.5rem;
  line-height: 1.6;
}

@media screen and (max-width: 768px) {
  .seminar-teacher > .note {
    margin-top: 5.33333vw;
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.seminar-banner {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  width: 100%;
  height: 145px;
  margin-top: 80px;
  background: url(../images/seminar-bg_banner.jpg) no-repeat left top;
}

@media screen and (max-width: 768px) {
  .seminar-banner {
    height: 43.2vw;
    margin-top: 10.66667vw;
    background-image: url(../images/seminar-bg_banner.jpg);
    background-size: cover;
  }
}

.seminar-banner > .sub {
  margin-bottom: 5px;
  color: #fff;
  font-size: 18px;
  font-size: 1.8rem;
}

@media screen and (max-width: 768px) {
  .seminar-banner > .sub {
    margin-bottom: w(20);
    font-size: 16px;
    font-size: 1.6rem;
  }
}

.seminar-banner > .main {
  color: #fff;
  font-weight: 500;
  font-size: 24px;
  font-size: 2.4rem;
}

@media screen and (max-width: 768px) {
  .seminar-banner > .main {
    font-size: 19px;
    font-size: 1.9rem;
    text-align: center;
  }
}

.seminar-overview > .body > .date {
  color: #1b4791;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .seminar-overview > .body > .date {
    font-size: 16px;
    font-size: 1.6rem;
  }
}

.seminar-overview > .body > .note {
  display: inline-block;
  margin-top: 10px;
  font-size: 14px;
  font-size: 1.4rem;
}

@media screen and (max-width: 768px) {
  .seminar-overview > .body > .note {
    margin-top: 2.66667vw;
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.seminar-place {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  background-color: #fff;
  margin-right: 0;
  margin-left: auto;
}

@media screen and (max-width: 768px) {
  .seminar-place {
    display: block;
    width: auto;
  }
}

.seminar-place + .seminar-place {
  margin-top: 10px;
}

@media screen and (max-width: 768px) {
  .seminar-place + .seminar-place {
    margin-top: 8vw;
  }
}

.seminar-place > .info {
  width: 500px;
  padding: 60px 55px;
}

@media screen and (max-width: 768px) {
  .seminar-place > .info {
    width: auto;
    padding: 6.66667vw 4vw;
  }
}

.seminar-place > .info > .name {
  margin-bottom: 25px;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .seminar-place > .info > .name {
    margin-bottom: 4vw;
    font-size: 16px;
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 768px) {
  .seminar-place > .info > .address {
    font-size: 14px;
    font-size: 1.4rem;
    letter-spacing: 0.07em;
  }
}

.seminar-place > .info > .station {
  position: relative;
  display: -webkit-box;
  display: flex;
}

@media screen and (max-width: 768px) {
  .seminar-place > .info > .station {
    font-size: 14px;
    font-size: 1.4rem;
    letter-spacing: 0.07em;
  }
}

.seminar-place > .info > .station > .label {
  position: absolute;
  top: 0;
  left: 0;
}

.seminar-place > .info > .station > .detail {
  padding-left: 5.5em;
}

.seminar-place > .map {
  -webkit-box-flex: 1;
          flex: 1;
}

@media screen and (max-width: 768px) {
  .seminar-place > .map {
    width: 100%;
    height: 53.33333vw;
  }
}

.seminar-place > .map > iframe {
  width: 100% !important;
  height: 100% !important;
}

/*
  4-1. Voice
==================================== */
.voice-section {
  background: url(../images/voice-bg_1.jpg) no-repeat left top;
}

@media screen and (max-width: 768px) {
  .voice-section {
    padding-bottom: 29.33333vw;
    background-image: url(../images/voice-bg_1--md.jpg);
    background-size: 100% auto;
  }
}

.voice-section > .heading {
  margin-bottom: 50px;
}

@media screen and (max-width: 768px) {
  .voice-section > .heading {
    margin-bottom: 10vw;
  }
}

.voice-content {
  margin-top: 130px;
}

@media screen and (max-width: 768px) {
  .voice-content {
    margin-top: 20vw;
  }
}

@media screen and (max-width: 768px) {
  .voice-lead {
    text-align: left;
  }
}

.voice-item {
  position: relative;
  padding-left: 100px;
  padding-right: 100px;
  padding-bottom: 75px;
  background-color: #f2eee3;
  opacity: 0;
  -webkit-transform: translateY(30px);
          transform: translateY(30px);
  -webkit-transition: opacity .6s ease-out, -webkit-transform .6s ease-out;
  transition: opacity .6s ease-out, -webkit-transform .6s ease-out;
  transition: opacity .6s ease-out, transform .6s ease-out;
  transition: opacity .6s ease-out, transform .6s ease-out, -webkit-transform .6s ease-out;
}

@media screen and (max-width: 768px) {
  .voice-item {
    padding-left: 5.33333vw;
    padding-right: 5.33333vw;
    padding-bottom: 21.33333vw;
    -webkit-transform: translateY(4vw);
            transform: translateY(4vw);
  }
}

.voice-item + .voice-item {
  margin-top: 100px;
}

@media screen and (max-width: 768px) {
  .voice-item + .voice-item {
    margin-top: 26.66667vw;
  }
}

.voice-item.is-passed {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.voice-item > .head {
  display: -webkit-box;
  display: flex;
}

@media screen and (max-width: 768px) {
  .voice-item > .head {
    display: block;
  }
}

.voice-item > .head > .ph {
  width: 186px;
  margin-right: 40px;
  margin-top: -50px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

@media screen and (max-width: 768px) {
  .voice-item > .head > .ph {
    position: relative;
    top: -8vw;
    width: 36.66667vw;
    margin-top: 0;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: -8vw;
  }
}

.voice-item > .head > .ph img {
  width: 100%;
}

.voice-item > .head > .detail {
  -webkit-box-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
}

.voice-item > .head > .detail > .lead {
  color: #91711b;
  font-weight: 500;
  margin-top: -1em;
  font-size: 24px;
  font-size: 2.4rem;
  line-height: 1.83333;
}

@media screen and (max-width: 768px) {
  .voice-item > .head > .detail > .lead {
    margin-top: 6.66667vw;
    font-size: 19px;
    font-size: 1.9rem;
    line-height: 1.52632;
  }
}

.voice-item > .head > .detail > .sub {
  margin-top: auto;
  margin-bottom: 0;
  font-weight: 500;
}

@media screen and (max-width: 768px) {
  .voice-item > .head > .detail > .sub {
    margin-top: 4vw;
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.voice-item > .body.is-open > .inner {
  opacity: 1;
}

.voice-item > .body.is-open > .inner > .author > .avatar {
  opacity: 1;
}

.voice-item > .body > .inner {
  opacity: 0;
  -webkit-transition: opacity .4s ease;
  transition: opacity .4s ease;
}

.voice-item > .body > .inner > .author {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: end;
          justify-content: flex-end;
  -webkit-box-align: end;
          align-items: flex-end;
  margin-top: -80px;
  margin-bottom: 50px;
}

@media screen and (max-width: 768px) {
  .voice-item > .body > .inner > .author {
    flex-wrap: wrap;
    margin-top: 0;
    margin-bottom: 10.66667vw;
    padding-top: 8vw;
  }
}

.voice-item > .body > .inner > .author > .title {
  margin-top: auto;
  margin-bottom: 0;
  margin-right: 30px;
  font-size: 15px;
  font-size: 1.5rem;
  text-align: right;
  line-height: 1.73333;
}

@media screen and (max-width: 768px) {
  .voice-item > .body > .inner > .author > .title {
    -webkit-box-flex: 1;
            flex: 1;
    font-size: 12px;
    font-size: 1.2rem;
    text-align: left;
    line-height: 1.5;
  }
}

.voice-item > .body > .inner > .author > .avatar {
  width: 150px;
  opacity: 0;
  -webkit-transition: opacity .4s ease;
  transition: opacity .4s ease;
}

@media screen and (max-width: 768px) {
  .voice-item > .body > .inner > .author > .avatar {
    width: 30.13333vw;
  }
}

.voice-item > .body > .inner > .author > .avatar img {
  width: 100%;
}

@media screen and (max-width: 768px) {
  .voice-item > .body > .inner > .text {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.voice-item > .body > .inner > .text + .text {
  margin-top: 100px;
}

@media screen and (max-width: 768px) {
  .voice-item > .body > .inner > .text + .text {
    margin-top: 6.66667vw;
  }
}

.voice-item > .trigger {
  position: absolute;
  right: 15px;
  bottom: -40px;
  width: 40px;
  height: 200px;
  cursor: pointer;
}

@media screen and (max-width: 768px) {
  .voice-item > .trigger {
    right: 50%;
    width: 5.33333vw;
    height: 26.66667vw;
    bottom: -14vw;
  }
}

.voice-item > .trigger.is-open::after {
  bottom: 187px;
  -webkit-transform: rotate(-56deg);
          transform: rotate(-56deg);
}

@media screen and (max-width: 768px) {
  .voice-item > .trigger.is-open::after {
    bottom: 24.93333vw;
  }
}

.voice-item > .trigger.is-open > .open {
  opacity: 0;
}

.voice-item > .trigger.is-open > .close {
  opacity: 1;
}

@media screen and (min-width: 769px) {
  .voice-item > .trigger.is-open:hover::before {
    top: -15px;
  }
}

@media screen and (min-width: 769px) and (max-width: 768px) {
  .voice-item > .trigger.is-open:hover::before {
    top: -2vw;
  }
}

@media screen and (min-width: 769px) {
  .voice-item > .trigger.is-open:hover::after {
    bottom: 202px;
  }
}

@media screen and (min-width: 769px) and (max-width: 768px) {
  .voice-item > .trigger.is-open:hover::after {
    bottom: 26.93333vw;
  }
}

@media screen and (min-width: 769px) {
  .voice-item > .trigger::before {
    -webkit-transition: top 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    transition: top 0.8s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .voice-item > .trigger::after {
    -webkit-transition: bottom 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    transition: bottom 0.8s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .voice-item > .trigger:hover::before {
    top: 15px;
  }
}

@media screen and (min-width: 769px) and (max-width: 768px) {
  .voice-item > .trigger:hover::before {
    top: 2vw;
  }
}

@media screen and (min-width: 769px) {
  .voice-item > .trigger:hover::after {
    bottom: -2px;
  }
}

@media screen and (min-width: 769px) and (max-width: 768px) {
  .voice-item > .trigger:hover::after {
    bottom: -0.26667vw;
  }
}

.voice-item > .trigger::before {
  position: absolute;
  top: 0;
  right: 50%;
  content: "";
  width: 1px;
  height: 200px;
  background-color: #91711b;
}

@media screen and (max-width: 768px) {
  .voice-item > .trigger::before {
    right: 0;
    width: 0.26667vw;
    height: 26.66667vw;
  }
}

.voice-item > .trigger::after {
  position: absolute;
  bottom: 13px;
  right: 50%;
  content: "";
  width: 28px;
  height: 1px;
  margin-right: -5px;
  background-color: #91711b;
  -webkit-transform: rotate(56deg);
          transform: rotate(56deg);
}

@media screen and (max-width: 768px) {
  .voice-item > .trigger::after {
    right: 0;
    bottom: 1.73333vw;
    width: 3.73333vw;
    height: 0.26667vw;
    margin-right: -0.66667vw;
  }
}

.voice-item > .trigger > .open,
.voice-item > .trigger > .close {
  position: absolute;
  bottom: 50px;
  left: -6.2em;
  width: 6em;
  color: #91711b;
  font-size: 20px;
  font-size: 2rem;
  font-family: "Cormorant Garamond", serif;
  font-weight: 700;
  font-style: italic;
  line-height: 1;
  -webkit-transition: opacity .4s ease;
  transition: opacity .4s ease;
  text-align: right;
}

@media screen and (max-width: 768px) {
  .voice-item > .trigger > .open,
  .voice-item > .trigger > .close {
    left: auto;
    right: -7em;
    text-align: left;
  }
}

@media screen and (max-width: 768px) {
  .voice-item > .trigger > .open {
    bottom: 19vw;
  }
}

.voice-item > .trigger > .close {
  opacity: 0;
}

@media screen and (max-width: 768px) {
  .voice-item > .trigger > .close {
    bottom: 17vw;
  }
}

/*
  4-1. Faq
==================================== */
.faq-section {
  background: #edf1f5 url(../images/faq-bg_1.jpg) no-repeat center top;
}

@media screen and (max-width: 768px) {
  .faq-section {
    background-image: url(../images/faq-bg_1--md.jpg);
    background-size: 100% auto;
  }
}

.faq-content {
  margin-top: 70px;
}

@media screen and (max-width: 768px) {
  .faq-content {
    margin-top: 10.66667vw;
  }
}

.faq-item {
  opacity: 0;
  -webkit-transform: translateY(30px);
          transform: translateY(30px);
  -webkit-transition: opacity .6s ease-out, -webkit-transform .6s ease-out;
  transition: opacity .6s ease-out, -webkit-transform .6s ease-out;
  transition: opacity .6s ease-out, transform .6s ease-out;
  transition: opacity .6s ease-out, transform .6s ease-out, -webkit-transform .6s ease-out;
}

@media screen and (max-width: 768px) {
  .faq-item {
    -webkit-transform: translateY(4vw);
            transform: translateY(4vw);
  }
}

.faq-item.is-passed {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.faq-item + .faq-item {
  margin-top: 40px;
}

@media screen and (max-width: 768px) {
  .faq-item + .faq-item {
    margin-top: 5.33333vw;
  }
}

.faq-item > .title {
  position: relative;
  width: 100%;
  height: 100px;
  color: #fff;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: 500;
  background-color: #1b4791;
  line-height: 100px;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .faq-item > .title {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
            align-items: center;
    height: 21.06667vw;
    padding-left: 14.66667vw;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.5;
    text-align: left;
  }
}

.faq-item > .title::before {
  position: absolute;
  top: 50%;
  left: 40px;
  content: "Q";
  color: #fff;
  margin-top: -.5em;
  font-size: 38px;
  font-size: 3.8rem;
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .faq-item > .title::before {
    left: 5.33333vw;
    font-size: 29px;
    font-size: 2.9rem;
  }
}

.faq-item > .answer {
  margin-left: 20px;
  margin-right: 20px;
  padding: 55px 80px;
  background-color: #fff;
}

@media screen and (max-width: 768px) {
  .faq-item > .answer {
    margin-left: 2.66667vw;
    margin-right: 2.66667vw;
    padding: 8vw;
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.faq-item > .answer > .text + .text {
  margin-top: 35px;
}

@media screen and (max-width: 768px) {
  .faq-item > .answer > .text + .text {
    margin-top: 8vw;
  }
}

/* ====================================

    5. For IE

==================================== */
@media screen and (min-width: 769px) {
  [data-browser="ie"] .reason-method > .item > .title {
    width: 101%;
  }
}

@media screen and (min-width: 769px) {
  [data-browser="ie"] .reason-boxlist > .item.-em {
    -webkit-transform: rotateY(-180deg);
            transform: rotateY(-180deg);
  }
}

@media screen and (min-width: 769px) {
  [data-browser="ie"] .reason-boxlist > .item.-em.is-passed {
    opacity: 1;
    -webkit-transform: rotateY(0);
            transform: rotateY(0);
    -webkit-transition: opacity 1s ease-out 1s, -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: opacity 1s ease-out 1s, -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 1s ease-out 1s;
    transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 1s ease-out 1s, -webkit-transform 1s cubic-bezier(0.645, 0.045, 0.355, 1);
  }
  [data-browser="ie"] .reason-boxlist > .item.-em.is-passed > .cover {
    opacity: 0;
  }
}

@media screen and (min-width: 769px) {
  [data-browser="ie"] .reason-boxlist > .item.-em > .main {
    -webkit-transform: rotateY(0);
            transform: rotateY(0);
  }
}

/* ====================================

    99. Vendor

==================================== */