@charset "UTF-8";
/* ========================================================
	reset.css
	Format,Font Reset
======================================================== */
@import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;700&display=swap");
*,
*::before,
*::after {
  box-sizing: border-box; }

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd,
figure {
  margin: 0;
  padding: 0; }

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none; }

body {
  min-height: 100vh;
  text-rendering: optimizeSpeed; }

a:not([class]) {
  text-decoration-skip-ink: auto; }

img,
picture {
  max-width: 100%;
  border: 0; }

input,
button,
textarea,
select {
  margin: 0;
  padding: 0;
  font: inherit; }

address,
caption,
cite,
code,
dfn,
em,
th,
var {
  font-style: normal;
  font-weight: normal; }

sup {
  vertical-align: text-top; }

sub {
  vertical-align: text-bottom; }

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto; }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important; } }
@font-face {
  font-family: SegoeUI;
  src: local("Segoe UI Semibold"), url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semibold/latest.woff2) format("woff2"), url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semibold/latest.woff) format("woff"), url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semibold/latest.ttf) format("truetype");
  font-weight: 700; }
html {
  font-weight: 400;
  font-size: 62.5%; }

body {
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  margin: 0;
  color: #262626;
  font-size: 1.6rem;
  letter-spacing: 0.05em;
  line-height: 1.75;
  width: 100%;
  font-weight: 500;
  overflow-x: hidden;
  position: relative;
  -webkit-animation: fadeIn 2s ease 0s 1 normal;
  animation: fadeIn 2s ease 0s 1 normal; }
  body:after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.4);
    left: 0;
    top: 0;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.6s;
    transition: all 0.6s; }
  body.fixed {
    position: fixed;
    width: 100%; }
    body.fixed:after {
      z-index: 90;
      opacity: 1;
      visibility: visible; }
  @media (max-width: 480px) {
    body {
      font-size: 1.4rem; } }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
a, a:link, a:visited {
  color: #262626;
  text-decoration: none;
  transition: 0.5s; }

img {
  max-width: 100%;
  width: auto;
  height: auto;
  vertical-align: bottom;
  transition: 0.5s; }

.container {
  margin: auto;
  width: 90%;
  max-width: 1340px;
  height: auto;
  box-sizing: border-box; }

.innerBox {
  margin: auto;
  width: 90%;
  max-width: 1200px;
  height: auto;
  box-sizing: border-box; }

main {
  display: block; }

h2 {
  font-size: 5.0rem;
  line-height: 1.2142857143;
  font-weight: 500;
  letter-spacing: 0.075em;
  position: relative;
  margin-bottom: min(80px,8.334vw); }
  @media (max-width: 1024px) {
    h2 {
      font-size: 2.4rem; } }
  h2 span.en {
    font-family: SegoeUI;
    font-weight: 700; }
  h2 span.jp {
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0 0 0 40px;
    letter-spacing: 0.05em; }
    @media (max-width: 480px) {
      h2 span.jp {
        font-size: 1.4rem;
        margin: 0 0 0 15px; } }

/*============================================================================
	header
=============================================================================*/
header {
  width: 100%;
  position: relative;
  z-index: 100;
  background: #fff;
  height: 100px; }
  @media (max-width: 1200px) {
    header {
      height: 65px;
      position: fixed;
      top: 0;
      left: 0; } }
  header #headerInner {
    margin: auto;
    height: auto;
    box-sizing: border-box;
    align-items: center; }
    header #headerInner h1 {
      line-height: 1;
      padding: 0 0 0 50px; }
      @media (max-width: 1024px) {
        header #headerInner h1 {
          width: fit-content;
          padding: 0 0 0 15px; } }
      @media (max-width: 480px) {
        header #headerInner h1 {
          width: 85%; } }
      header #headerInner h1 a {
        text-align: center; }
        header #headerInner h1 a span {
          display: block;
          font-size: 1.0rem;
          margin: 0 0 0 20%; }
          @media (max-width: 1024px) {
            header #headerInner h1 a span {
              margin: 0; } }
    header #headerInner nav {
      margin: 0 0 0 auto; }
      @media (max-width: 1024px) {
        header #headerInner nav {
          margin-right: 40px;
          width: 68%; } }
      @media (max-width: 480px) {
        header #headerInner nav {
          margin-right: 40px;
          width: 48%; } }
      header #headerInner nav #gnaviWrap #hnaviBottom {
        margin: 0 0 0 auto;
        align-items: center;
        width: 100%; }
        header #headerInner nav #gnaviWrap #hnaviBottom > li {
          position: relative; }
          header #headerInner nav #gnaviWrap #hnaviBottom > li > a {
            font-size: 1.7rem;
            line-height: 1.2;
            letter-spacing: 0.17em;
            display: inline-block;
            position: relative;
            padding: 0 0 5px; }
            header #headerInner nav #gnaviWrap #hnaviBottom > li > a::before, header #headerInner nav #gnaviWrap #hnaviBottom > li > a::after {
              content: '';
              width: 100%;
              height: 3px;
              display: block;
              position: absolute;
              left: 0;
              bottom: 0;
              transform: scale(0, 1);
              transform-origin: right top;
              transition: transform .3s; }
            header #headerInner nav #gnaviWrap #hnaviBottom > li > a::before {
              background: #006db7; }
            header #headerInner nav #gnaviWrap #hnaviBottom > li > a::after {
              background: #b6d231; }
            header #headerInner nav #gnaviWrap #hnaviBottom > li > a:hover {
              color: #262626; }
              header #headerInner nav #gnaviWrap #hnaviBottom > li > a:hover::before, header #headerInner nav #gnaviWrap #hnaviBottom > li > a:hover::after {
                transform-origin: left top;
                transform: scale(1, 1); }
              header #headerInner nav #gnaviWrap #hnaviBottom > li > a:hover::after {
                transition-delay: .3s; }
            @media (max-width: 1600px) {
              header #headerInner nav #gnaviWrap #hnaviBottom > li > a {
                font-size: 1.45rem; } }
          header #headerInner nav #gnaviWrap #hnaviBottom > li ul {
            display: none; }
            @media (max-width: 1200px) {
              header #headerInner nav #gnaviWrap #hnaviBottom > li ul {
                display: block;
                padding: 0 0 0 3%;
                transition: 0.5s; } }
            header #headerInner nav #gnaviWrap #hnaviBottom > li ul li {
              padding: 3px; }
              header #headerInner nav #gnaviWrap #hnaviBottom > li ul li a {
                font-size: 1.35rem;
                line-height: 1.2;
                letter-spacing: 0.17em;
                position: relative;
                display: block; }
          header #headerInner nav #gnaviWrap #hnaviBottom > li + li {
            margin-left: min(40px,4.167vw); }
            @media (max-width: 1600px) {
              header #headerInner nav #gnaviWrap #hnaviBottom > li + li {
                margin-left: 30px; } }
      @media (max-width: 1200px) {
        header #headerInner nav #gnaviWrap {
          padding-right: 0; } }
      @media (max-width: 1200px) {
        header #headerInner nav #gnaviWrap {
          margin: 0;
          padding: 0 30px 40px;
          width: 100%;
          height: 100vh;
          background: #ffffff;
          position: fixed;
          top: 65px;
          left: 0;
          display: none;
          overflow-y: scroll; }
          header #headerInner nav #gnaviWrap #hnaviBottom {
            max-width: none;
            width: 100%;
            display: block;
            visibility: hidden;
            opacity: 0;
            -webkit-transition: all .4s;
            transition: all .4s;
            padding: 60px 0; }
            header #headerInner nav #gnaviWrap #hnaviBottom > li {
              padding: 8px 0;
              text-align: center; }
              header #headerInner nav #gnaviWrap #hnaviBottom > li a {
                font-size: 1.4rem; }
                header #headerInner nav #gnaviWrap #hnaviBottom > li a::after {
                  display: none; }
              header #headerInner nav #gnaviWrap #hnaviBottom > li + li {
                margin: 0;
                border-top: 1px solid #006D9F; }
              header #headerInner nav #gnaviWrap #hnaviBottom > li.parentMenu {
                height: auto;
                position: relative; }
                header #headerInner nav #gnaviWrap #hnaviBottom > li.parentMenu .toggleBtn {
                  margin: auto;
                  width: 18px;
                  height: 18px;
                  display: block;
                  position: absolute;
                  top: 21px;
                  left: auto;
                  right: 4px;
                  bottom: auto;
                  visibility: visible;
                  filter: invert(29%) sepia(10%) saturate(7064%) hue-rotate(119deg) brightness(96%) contrast(101%); }
                header #headerInner nav #gnaviWrap #hnaviBottom > li.parentMenu .submenuWrap {
                  margin-top: 0;
                  height: auto;
                  position: static; }
                  header #headerInner nav #gnaviWrap #hnaviBottom > li.parentMenu .submenuWrap .submenuInner {
                    padding: 20px 0;
                    width: 95%; }
                    header #headerInner nav #gnaviWrap #hnaviBottom > li.parentMenu .submenuWrap .submenuInner .submenuHeadbox {
                      padding: 0 10px 0 0;
                      width: 25%; }
                      header #headerInner nav #gnaviWrap #hnaviBottom > li.parentMenu .submenuWrap .submenuInner .submenuHeadbox .text {
                        font-size: 1.4rem; }
                    header #headerInner nav #gnaviWrap #hnaviBottom > li.parentMenu .submenuWrap .submenuInner .submenuList {
                      margin-bottom: -20px;
                      padding: 0 0 0 20px;
                      width: 75%; }
                      header #headerInner nav #gnaviWrap #hnaviBottom > li.parentMenu .submenuWrap .submenuInner .submenuList li {
                        margin: 0 3.5% min(40px,4.167vw) 0;
                        width: 31%; }
                        header #headerInner nav #gnaviWrap #hnaviBottom > li.parentMenu .submenuWrap .submenuInner .submenuList li a p {
                          margin-top: 5px; }
          header #headerInner nav #gnaviWrap.open {
            display: block; }
            header #headerInner nav #gnaviWrap.open #hnaviBottom {
              visibility: visible;
              opacity: 1; }
            header #headerInner nav #gnaviWrap.open header {
              background: #fff; } }
      @media (max-width: 767px) {
        header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner {
          padding: 0;
          width: 100%;
          display: block; }
          header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuHeadbox {
            display: none; }
          header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList, header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList.products {
            margin-bottom: 0;
            padding: 0;
            width: 100%;
            background: #e1e1e1;
            display: block; }
            header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList li, header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList.products li {
              margin: 0;
              width: 100%;
              max-width: none;
              height: 60px;
              line-height: 60px; }
              header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList li a, header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList.products li a {
                padding: 0 20px; }
                header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList li a figure, header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList.products li a figure {
                  display: none; }
                header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList li a p, header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList.products li a p {
                  margin: 0; }
              header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList li + li, header #headerInner nav #gnaviWrap #hnaviBottom li.parentMenu .submenuWrap .submenuInner .submenuList.products li + li {
                border-top: 1px solid #FFFFFF; } }
      @media (max-width: 480px) {
        header #headerInner nav #gnaviWrap {
          top: 65px; } }
    header #headerInner #contactBtn {
      position: relative;
      height: 100px;
      width: 150px;
      margin: 0 0 0 30px; }
      @media (max-width: 1200px) {
        header #headerInner #contactBtn {
          height: 65px;
          width: 140px;
          margin: 0 55px 0 auto; } }
      header #headerInner #contactBtn::before {
        content: '';
        position: absolute;
        background: #1B2B58;
        display: block;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1; }
      header #headerInner #contactBtn a {
        display: block;
        width: 100%;
        height: 100%;
        position: relative; }
        header #headerInner #contactBtn a p {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          text-align: center;
          color: #fff;
          width: 100%;
          line-height: 1; }
          @media (max-width: 1200px) {
            header #headerInner #contactBtn a p {
              font-size: 1.2rem; } }
          @media (max-width: 480px) {
            header #headerInner #contactBtn a p {
              font-size: 1.0rem; } }
          header #headerInner #contactBtn a p i {
            display: block;
            margin-bottom: 8px; }
            @media (max-width: 480px) {
              header #headerInner #contactBtn a p i {
                width: 65%;
                margin: 0 auto 0.5em; } }

/*============================================================================
	drawer menuBtn
=============================================================================*/
.menuBtn {
  margin: auto;
  padding: 5px;
  width: 35px;
  height: 35px;
  text-align: center;
  outline: 0;
  border: 0;
  position: fixed;
  background: none;
  top: 19px;
  left: auto;
  right: 10px;
  bottom: auto;
  z-index: 1200;
  -webkit-transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }
  .menuBtn:hover {
    cursor: pointer; }
  @media (min-width: calc(1200px + 1px)) {
    .menuBtn {
      display: none; } }
  @media (max-width: 1200px) {
    .menuBtn {
      display: block; } }
  .menuBtn .drawer-hamburger-icon {
    margin: auto;
    width: 100%;
    height: 1px;
    border-radius: 3px;
    background-color: #2C2C2C;
    -webkit-transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    position: relative;
    display: block; }
    .menuBtn .drawer-hamburger-icon.drawer-hamburger-icon:before, .menuBtn .drawer-hamburger-icon.drawer-hamburger-icon:after {
      content: '';
      width: 100%;
      height: 1px;
      border-radius: 3px;
      background-color: #2C2C2C;
      -webkit-transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
      transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
      position: absolute;
      left: 0; }
    .menuBtn .drawer-hamburger-icon.drawer-hamburger-icon:before {
      top: -10px; }
    .menuBtn .drawer-hamburger-icon.drawer-hamburger-icon:after {
      top: 10px; }
  .menuBtn.close-btn .drawer-hamburger-icon {
    background-color: transparent; }
    .menuBtn.close-btn .drawer-hamburger-icon.drawer-hamburger-icon:before, .menuBtn.close-btn .drawer-hamburger-icon.drawer-hamburger-icon:after {
      background-color: #2C2C2C;
      top: 0; }
    .menuBtn.close-btn .drawer-hamburger-icon.drawer-hamburger-icon:before {
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }
    .menuBtn.close-btn .drawer-hamburger-icon.drawer-hamburger-icon:after {
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg); }

/*============================================================================
	footer
=============================================================================*/
footer {
  height: auto;
  padding: min(120px,12.4995vw) 0 40px;
  position: relative;
  z-index: 1004; }
  footer .footer_l p.logo a span {
    display: block;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.7777777778;
    margin-top: 10px; }
    @media (max-width: 480px) {
      footer .footer_l p.logo a span {
        font-size: 1.4rem; } }
  footer .footer_l p.logo:hover a {
    color: #262626; }
  footer .footer_l .address {
    margin-top: min(45px,4.6875vw); }
    footer .footer_l .address dl dt {
      font-weight: 500;
      line-height: 1.6; }
      @media (max-width: 480px) {
        footer .footer_l .address dl dt {
          font-size: 1.4rem; } }
    footer .footer_l .address dl dd {
      font-weight: 500;
      line-height: 1.6; }
      @media (max-width: 480px) {
        footer .footer_l .address dl dd {
          font-size: 1.4rem; } }
    footer .footer_l .address dl + dl {
      margin-top: 30px; }
      @media (max-width: 480px) {
        footer .footer_l .address dl + dl {
          margin-top: 12px; } }
  footer .footer_r {
    margin: min(60px,6.2505vw) 0 0 auto; }
    @media (max-width: 480px) {
      footer .footer_r {
        margin-left: 0; } }
    footer .footer_r nav > ul {
      justify-content: center; }
      footer .footer_r nav > ul > li:hover a {
        color: #262626; }
      @media (max-width: 480px) {
        footer .footer_r nav > ul > li a {
          font-size: 1.4rem; } }
      footer .footer_r nav > ul > li + li {
        margin: 0 0 0 min(60px,6.2505vw); }
    footer .footer_r nav ul + ul {
      margin-left: 60px !important; }
    @media (max-width: 1024px) {
      footer .footer_r nav {
        width: 100%;
        max-width: none; }
        footer .footer_r nav > ul {
          justify-content: flex-end; }
          footer .footer_r nav > ul > li {
            width: auto; }
            footer .footer_r nav > ul > li:nth-child(n + 4) {
              margin-top: 20px; }
          footer .footer_r nav > ul li + li {
            margin: 0 0 0 30px; }
        footer .footer_r nav ul + ul {
          margin-left: 0 !important; } }
    @media (max-width: 480px) {
      footer .footer_r nav > ul {
        width: 100%;
        justify-content: space-between;
        margin: 0 auto; }
        footer .footer_r nav > ul > li {
          width: 44%; }
          footer .footer_r nav > ul > li:nth-child(n + 3) {
            margin-top: 20px; }
        footer .footer_r nav > ul li + li {
          margin: 0; } }
    footer .footer_r #footer_snsNav {
      margin: min(50px,5.208vw) 0 0 0; }
      footer .footer_r #footer_snsNav ul {
        justify-content: end; }
        @media (max-width: 480px) {
          footer .footer_r #footer_snsNav ul {
            justify-content: flex-start; } }
        @media (max-width: 480px) {
          footer .footer_r #footer_snsNav ul li img {
            width: 80%; } }
        footer .footer_r #footer_snsNav ul li + li {
          margin: 0 0 0 35px; }
          @media (max-width: 480px) {
            footer .footer_r #footer_snsNav ul li + li {
              margin: 0 0 0 15px; } }
  footer .copy {
    margin-top: min(100px,10.416vw);
    font-size: 1.4rem; }
    @media (max-width: 480px) {
      footer .copy {
        font-size: 1.2rem; } }

#back_to_top {
  margin: auto;
  width: 12px;
  height: 130px;
  position: fixed;
  right: 6.25vw;
  bottom: 30px;
  z-index: 999;
  transition: 0.3s ease;
  transform: translateY(170px); }
  #back_to_top a {
    color: #006c3b;
    width: 100%;
    height: 100%;
    display: block; }
    #back_to_top a .en {
      font-size: 1.2rem;
      font-weight: 700;
      -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl;
      line-height: 1;
      letter-spacing: 0.1em;
      display: block; }
    #back_to_top a .anibar {
      margin: 10px auto 0 4px;
      width: 1px;
      height: 50px;
      background: #006c3b;
      display: block;
      transform-origin: top;
      animation: bar 3s cubic-bezier(1, 0, 0, 1) infinite; }
  #back_to_top.sc {
    transform: translateY(0); }
  @media (max-width: 1024px) {
    #back_to_top {
      right: 20px; } }
  @media (max-width: 480px) {
    #back_to_top {
      width: 10px;
      height: 100px;
      right: 10px; }
      #back_to_top a .en {
        font-size: 1.0rem; }
      #back_to_top a .anibar {
        height: 30px; } }

@keyframes bar {
  0% {
    opacity: 1;
    transform: scale(1, 0); }
  30% {
    transform: scale(1, 1); }
  30.1%, 90% {
    transform: scale(1, 1); }
  100% {
    opacity: 0;
    transform: scale(1, 0); } }
/*============================================================================
	common parts
=============================================================================*/
#breadcrumbs ol {
  margin: auto;
  width: 90%;
  max-width: 1340px; }
  #breadcrumbs ol li {
    color: #262626;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500;
    font-size: 1.2rem; }
    #breadcrumbs ol li:not(:last-of-type)::after {
      content: '\00ff1e';
      margin-left: 10px;
      font-size: 1.2rem; }
    #breadcrumbs ol li + li {
      margin-left: 10px; }
    #breadcrumbs ol li a {
      color: #262626;
      font-size: 1.2rem; }
      #breadcrumbs ol li a:hover {
        opacity: 0.4; }

.c-btn button {
  position: relative;
  display: inline-block;
  cursor: pointer;
  outline: none;
  border: 0;
  vertical-align: middle;
  text-decoration: none;
  background: transparent;
  padding: 0;
  font-size: inherit;
  font-family: inherit; }
  .c-btn button.learn-more {
    width: 30rem;
    height: auto; }
    @media (max-width: 1024px) {
      .c-btn button.learn-more {
        width: 18rem; } }
    .c-btn button.learn-more .circle {
      transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      position: relative;
      display: block;
      margin: 0;
      width: 5rem;
      height: 5rem;
      background: #99731F;
      border-radius: 25px;
      -moz-border-radius: 25px;
      -webkit-border-radius: 25px;
      border-radius: 2.7rem; }
      @media (max-width: 1024px) {
        .c-btn button.learn-more .circle {
          width: 4rem;
          height: 4rem;
          border-radius: 2.1666rem; } }
      .c-btn button.learn-more .circle .icon {
        transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
        background: #fff; }
        .c-btn button.learn-more .circle .icon.arrow {
          transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
          left: 1rem;
          width: 20px;
          height: 2px;
          background: none; }
          @media (max-width: 1024px) {
            .c-btn button.learn-more .circle .icon.arrow {
              width: 14px; } }
          .c-btn button.learn-more .circle .icon.arrow::before {
            position: absolute;
            content: '';
            top: -0.4rem;
            right: 0.104rem;
            width: 1.04rem;
            height: 1.04rem;
            border-top: 0.208rem solid #fff;
            border-right: 0.208rem solid #fff;
            transform: rotate(45deg); }
            @media (max-width: 1024px) {
              .c-btn button.learn-more .circle .icon.arrow::before {
                left: 0.4rem;
                width: 1rem;
                height: 1rem; } }
    .c-btn button.learn-more .button-text {
      transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      padding: 1.1rem 0;
      margin: 0 0 0 -4rem;
      color: #282936;
      font-weight: 700;
      line-height: 1.6;
      text-align: center;
      text-transform: uppercase;
      font-size: 1.8rem;
      letter-spacing: 0.05em; }
      @media (max-width: 1024px) {
        .c-btn button.learn-more .button-text {
          margin: 0 0 0 2rem;
          font-size: 1.6rem;
          padding: 0.8rem 0; } }
  .c-btn button:hover .circle {
    width: 100%; }
    .c-btn button:hover .circle .icon.arrow {
      background: #fff;
      transform: translate(1rem, 0); }
  .c-btn button:hover .button-text {
    color: #fff; }

.c-link {
  width: fit-content;
  padding: 0 20px 0 0; }
  .c-link a {
    color: #262626;
    display: flex;
    align-items: center;
    font-size: 1.6rem;
    position: relative;
    line-height: 1;
    padding: 15px 0 15px 60px; }
    @media (max-width: 480px) {
      .c-link a {
        font-size: 1.6rem;
        padding: 7px 0 7px 45px; } }
    .c-link a span {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 10px;
      padding-right: 20px; }
      .c-link a span i {
        width: 20px;
        height: 20px;
        display: inline-block;
        position: relative;
        margin: 0 0 0 auto; }
        @media (max-width: 480px) {
          .c-link a span i {
            width: 16px;
            height: 16px; } }
        .c-link a span i::before {
          content: '';
          position: absolute;
          border: 1px solid #262626;
          width: 20px;
          height: 20px;
          top: 0;
          left: 0;
          transform: rotate(-45deg);
          -webkit-transition: all .6s;
          transition: all .6s; }
          @media (max-width: 480px) {
            .c-link a span i::before {
              width: 16px;
              height: 16px; } }
        .c-link a span i img {
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          left: -3.5px;
          -webkit-transition: all .6s;
          transition: all .6s; }
  .c-link:hover {
    background: #8C218F; }
    .c-link:hover a {
      color: #fff; }
      .c-link:hover a span i::before {
        border: 1px solid #fff; }
      .c-link:hover a span i img {
        filter: brightness(0) invert(1); }
  .c-link + p {
    margin-top: 5px; }

.moreBtn {
  margin: auto;
  width: 70%;
  max-width: 320px;
  height: 80px;
  line-height: 80px; }
  @media (max-width: 480px) {
    .moreBtn {
      height: 60px;
      line-height: 60px; } }
  .moreBtn a {
    color: #006c3b;
    font-weight: 500;
    width: 100%;
    height: 100%;
    text-align: center;
    letter-spacing: 0.05em;
    text-indent: 0.05em;
    border: 1px solid #006c3b;
    display: block;
    position: relative;
    overflow: hidden;
    -webkit-transition: all .4s;
    transition: all .4s; }
    .moreBtn a i {
      margin: auto;
      width: 17px;
      height: 5px;
      background: url("../img/common/arrow_sml.svg") no-repeat center center;
      background-size: contain;
      display: block;
      filter: invert(20%) sepia(85%) saturate(1005%) hue-rotate(107deg) brightness(92%) contrast(86%);
      position: absolute;
      top: 0;
      left: auto;
      right: 20px;
      bottom: 0;
      -webkit-transition: all .4s;
      transition: all .4s; }
    .moreBtn a::after {
      content: '';
      width: 120%;
      height: calc(100% + 4px);
      background: #006c3b;
      display: block;
      transform-origin: left top;
      transform: skewX(-30deg) scale(0, 1);
      -webkit-transition: all .4s;
      transition: all .4s;
      position: absolute;
      top: -2px;
      left: 0;
      z-index: -1; }
    .moreBtn a:hover {
      color: #FFFFFF; }
      .moreBtn a:hover i {
        filter: invert(100%) sepia(0%) saturate(7487%) hue-rotate(295deg) brightness(94%) contrast(96%);
        right: 10px; }
      .moreBtn a:hover::after {
        transform: skewX(-30deg) scale(1, 1); }
  .moreBtn.wh a {
    color: #FFFFFF;
    border: 1px solid #FFFFFF; }
    .moreBtn.wh a i {
      filter: invert(100%) sepia(0%) saturate(7491%) hue-rotate(121deg) brightness(96%) contrast(114%); }
  .moreBtn.gr a {
    color: #FFFFFF; }
    .moreBtn.gr a i {
      filter: invert(100%) sepia(0%) saturate(7491%) hue-rotate(121deg) brightness(96%) contrast(114%); }
    .moreBtn.gr a::before {
      content: '';
      width: calc(100% + 4px);
      height: calc(100% + 4px);
      background: #006c3b;
      position: absolute;
      top: -2px;
      left: 0;
      z-index: -1; }
    .moreBtn.gr a::after {
      background: #FFFFFF; }
    .moreBtn.gr a:hover {
      color: #006c3b; }
      .moreBtn.gr a:hover i {
        filter: invert(20%) sepia(85%) saturate(1005%) hue-rotate(107deg) brightness(92%) contrast(86%); }

/*============================================================================
	404
=============================================================================*/
#notfoundWrap {
  margin: min(120px,12.4995vw) auto; }
  #notfoundWrap h3 {
    margin-bottom: min(40px,4.167vw);
    font-family: 'Noto Serif JP', serif;
    font-weight: 700;
    font-size: clamp(20px, 3.2vw, 28px);
    line-height: 1.2;
    letter-spacing: 0.1em;
    text-align: center; }
  #notfoundWrap p {
    text-align: center; }
    #notfoundWrap p.moreBtn {
      margin-top: min(80px,8.334vw); }

/*============================================================================
	regulation
=============================================================================*/
/*============================================================================
	調整用
=============================================================================*/
.fl {
  display: -webkit-flex;
  display: -moz-flex;
  display: flex; }

.fl-tab {
  display: -webkit-flex;
  display: -moz-flex;
  display: flex; }
  @media (max-width: 1024px) {
    .fl-tab {
      -webkit-flex-direction: column;
      -moz-flex-direction: column;
      flex-direction: column; } }

.fl-smp {
  display: -webkit-flex;
  display: -moz-flex;
  display: flex; }
  @media (max-width: 480px) {
    .fl-smp {
      -webkit-flex-direction: column;
      -moz-flex-direction: column;
      flex-direction: column; } }

.fl-jst {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; }

.fl-cen {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; }

.fl-end {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end; }

.fl-wrap {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.fl-col {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column; }

.fl-reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse; }

.mt0 {
  margin-top: min(0vw,0px); }

.mb0 {
  margin-bottom: min(0vw,0px); }

.pt0 {
  padding-top: min(0vw,0px); }

.pb0 {
  padding-bottom: min(0vw,0px); }

.mt40 {
  margin-top: min(3vw,40px); }

.mb40 {
  margin-bottom: min(3vw,40px); }

.pt40 {
  padding-top: min(3vw,40px); }

.pb40 {
  padding-bottom: min(3vw,40px); }

.mt80 {
  margin-top: min(6vw,80px); }

.mb80 {
  margin-bottom: min(6vw,80px); }

.pt80 {
  padding-top: min(6vw,80px); }

.pb80 {
  padding-bottom: min(6vw,80px); }

.mt120 {
  margin-top: min(9vw,120px); }

.mb120 {
  margin-bottom: min(9vw,120px); }

.pt120 {
  padding-top: min(9vw,120px); }

.pb120 {
  padding-bottom: min(9vw,120px); }

.mt160 {
  margin-top: min(12vw,160px); }

.mb160 {
  margin-bottom: min(12vw,160px); }

.pt160 {
  padding-top: min(12vw,160px); }

.pb160 {
  padding-bottom: min(12vw,160px); }

.mt200 {
  margin-top: min(15vw,200px); }

.mb200 {
  margin-bottom: min(15vw,200px); }

.pt200 {
  padding-top: min(15vw,200px); }

.pb200 {
  padding-bottom: min(15vw,200px); }

.mt240 {
  margin-top: min(18vw,240px); }

.mb240 {
  margin-bottom: min(18vw,240px); }

.pt240 {
  padding-top: min(18vw,240px); }

.pb240 {
  padding-bottom: min(18vw,240px); }

.mt280 {
  margin-top: min(21vw,280px); }

.mb280 {
  margin-bottom: min(21vw,280px); }

.pt280 {
  padding-top: min(21vw,280px); }

.pb280 {
  padding-bottom: min(21vw,280px); }

.mt320 {
  margin-top: min(24vw,320px); }

.mb320 {
  margin-bottom: min(24vw,320px); }

.pt320 {
  padding-top: min(24vw,320px); }

.pb320 {
  padding-bottom: min(24vw,320px); }

.mt360 {
  margin-top: min(27vw,360px); }

.mb360 {
  margin-bottom: min(27vw,360px); }

.pt360 {
  padding-top: min(27vw,360px); }

.pb360 {
  padding-bottom: min(27vw,360px); }

.mt400 {
  margin-top: min(30vw,400px); }

.mb400 {
  margin-bottom: min(30vw,400px); }

.pt400 {
  padding-top: min(30vw,400px); }

.pb400 {
  padding-bottom: min(30vw,400px); }

br {
  display: inline; }
  @media (min-width: calc(1200px + 1px)) {
    br.showPC {
      display: none !important; } }
  @media (min-width: calc(1024px + 1px)) {
    br.showTab {
      display: none !important; } }
  @media (min-width: calc(480px + 1px)) {
    br.showSP {
      display: none !important; } }
  @media (max-width: 1200px) {
    br.hdnPC {
      display: none; }
    br.showPC {
      display: inherit; } }
  @media (max-width: 1024px) {
    br.hdnTab {
      display: none; }
    br.showTab {
      display: inherit; } }
  @media (max-width: 480px) {
    br.hdnSP {
      display: none; }
    br.showSP {
      display: inherit; } }

span {
  display: inline-block; }
  @media (min-width: calc(1200px + 1px)) {
    span.showPC {
      display: none !important; } }
  @media (min-width: calc(1024px + 1px)) {
    span.showTab {
      display: none !important; } }
  @media (min-width: calc(480px + 1px)) {
    span.showSP {
      display: none !important; } }
  @media (max-width: 1200px) {
    span.hdnPC {
      display: none !important; }
    span.showPC {
      display: inherit; } }
  @media (max-width: 1024px) {
    span.hdnTab {
      display: none !important; }
    span.showTab {
      display: inherit; } }
  @media (max-width: 480px) {
    span.hdnSP {
      display: none !important; }
    span.showSP {
      display: inherit; } }

p, div, figure, ul {
  display: block; }
  @media (min-width: calc(1200px + 1px)) {
    p.showPC, div.showPC, figure.showPC, ul.showPC {
      display: none !important; } }
  @media (min-width: calc(1024px + 1px)) {
    p.showTab, div.showTab, figure.showTab, ul.showTab {
      display: none !important; } }
  @media (min-width: calc(480px + 1px)) {
    p.showSP, div.showSP, figure.showSP, ul.showSP {
      display: none !important; } }
  @media (max-width: 1200px) {
    p.hdnPC, div.hdnPC, figure.hdnPC, ul.hdnPC {
      display: none !important; }
    p.showPC, div.showPC, figure.showPC, ul.showPC {
      display: inherit; } }
  @media (max-width: 1024px) {
    p.hdnTab, div.hdnTab, figure.hdnTab, ul.hdnTab {
      display: none !important; }
    p.showTab, div.showTab, figure.showTab, ul.showTab {
      display: inherit; } }
  @media (max-width: 480px) {
    p.hdnSP, div.hdnSP, figure.hdnSP, ul.hdnSP {
      display: none !important; }
    p.showSP, div.showSP, figure.showSP, ul.showSP {
      display: inherit; } }

li {
  display: list-item; }
  @media (min-width: calc(1200px + 1px)) {
    li.showPC {
      display: none !important; } }
  @media (min-width: calc(1024px + 1px)) {
    li.showTab {
      display: none !important; } }
  @media (min-width: calc(480px + 1px)) {
    li.showSP {
      display: none !important; } }
  @media (max-width: 1200px) {
    li.hdnPC {
      display: none !important; }
    li.showPC {
      display: inherit; } }
  @media (max-width: 1024px) {
    li.hdnTab {
      display: none !important; }
    li.showTab {
      display: inherit; } }
  @media (max-width: 480px) {
    li.hdnSP {
      display: none !important; }
    li.showSP {
      display: inherit; } }

.ta_cnt {
  text-align: center; }

.ta_right {
  text-align: right; }

.clearfix:after {
  content: "";
  display: block;
  clear: both; }

/*============================================================================
	animation
=============================================================================*/
/* scroll */
.fade {
  opacity: 0;
  transition: all 0.8s; }
  .fade.active {
    opacity: 1; }

.upfade {
  transform: translate(0, 50px);
  opacity: 0;
  transition: all 0.8s; }
  .upfade.scrollin {
    transform: translate(0, 0);
    opacity: 1; }

.downfade {
  transform: translate(0, -50px);
  opacity: 0;
  transition: all 0.8s; }
  .downfade.scrollin {
    transform: translate(0, 0);
    opacity: 1; }

.sclinWrap {
  overflow: hidden !important; }

.sclin_right {
  transform: translate(50px, 0);
  opacity: 0;
  transition: all 0.8s; }
  .sclin_right.scrollin {
    transform: translate(0, 0);
    opacity: 1; }

.sclin_left {
  transform: translate(-50px, 0);
  opacity: 0;
  transition: all 0.8s; }
  .sclin_left.scrollin {
    transform: translate(0, 0);
    opacity: 1; }

.listfade li {
  transform: translate(0, 50px);
  opacity: 0.1;
  transition: all 1.0s; }
  .listfade li.scrollin {
    transform: translate(0, 0);
    opacity: 1; }