@charset "UTF-8";
/****
  数値をvw値へ変換する
 */
/***
  数値（px）をbase-vwから算出したvw へ変換
  元の数値と比べて小さい方を返す
  つまり、画面サイズがbase-vwよりひろければ指定数値
  狭ければvw変換値を使用する
 */
/**
  上記二つのSP版
 */
/*

@function calcClamp($value) {
  @if $value < 0 {
    @return clamp($value, tovw($value, 110rem), 0rem);
  } @else {
    @return clamp(0rem , tovw($value, 110rem), $value);
  }

}
@function calcClampSP($value) {
  @if $value < 0 {
    @return clamp(tovw($value, 39rem), tovw($value, 39rem), 0rem);
  } @else {
    @return clamp(0rem , tovw($value, 39rem), tovw($value, 39rem));
  }

}*/
/**
	リンク下線のエフェクト
 */
/**
	リンク下線のエフェクト インラインリンク用
 */
/**
	webp背景画像を指定する
 */
/* ==========================================================================
   Base
   リセットcssとhtml要素の定義
   ========================================================================== */
/**
  font family
 */
/**
  color
 */
:root {
  --col_black: #1B1B1B;
  --col_border: #b3d9f0;
  --col_tap-highlight-color: #ccc;
  --switch_bp: 1020;
}

*, *::before, *::after {
  box-sizing: border-box;
}

body, h1, h2, h3, h4, p, figure, blockquote, dl, dd {
  margin: 0;
}

ul[role=list], ol[role=list] {
  list-style: none;
}

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

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

/*img, picture {
  max-width: 100%;
  display: block
}*/
table {
  border-collapse: collapse;
  border-spacing: 0;
}

input, button, textarea, select {
  font: inherit;
}

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

   preset.scss
   プリミティブ要素の設定

 */
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  overflow-y: scroll;
  /*  @include mq-sp-slim {
      font-size: calc(100 * 16 / 320 * 0.625vw);
    }
    @include mq-fromto(0, 768) {
      font-size: calc(100 * 16 / 375 * 0.625vw);
    }
    @include mq-fromto(769, 1280) {
      font-size: calc(100 * 16 / 1280 * 0.625vw);
    }
    @include mq-min(1280){
      font-size: 62.5%;
    }*/
}

body {
  font-size: min(3.5897435897vw, 14px);
  color: var(--col_black);
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /*overscroll-behavior: none;*/
  -webkit-tap-highlight-color: var(--col_tap-highlight-color);
  letter-spacing: 0.05em;
  font-family: dnp-shuei-gothic-gin-std;
  font-style: normal;
}
@media print, screen and (min-width:769px) {
  body {
    font-size: min(1.1666666667vw, 14px);
  }
}

body.is-fixed {
  position: fixed;
  height: 100%;
  overflow: hidden;
}

main {
  display: block;
}

a {
  color: var(--col_black);
  text-decoration: none;
  outline: none;
}

a:active, a:hover, a.touchstart {
  text-decoration: none;
}

@media print, screen and (min-width:769px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}

p, h1, h2, h3, h4, h5, h6, small, em, li, dt, dd, th, td {
  line-height: 2.3;
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
  font-weight: 400;
}

ul {
  margin: 0;
  padding: 0;
}

li {
  list-style-type: none;
}

img {
  vertical-align: bottom;
}

img,
picture {
  width: 100%;
  height: auto;
}

/* 画像のぼやけをなくす（chrome opera） */
/*@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
  img {
    image-rendering: -webkit-optimize-contrast;
  }
}*/
sup {
  font-size: 0.4em;
  vertical-align: top;
}

hr {
  height: 0;
  margin: 0;
  border: none;
  border-top: 1px solid #ddd;
}

/* reset form elements */
input, button, textarea, select {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  color: var(--col_black);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

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

.svg-assets {
  display: none;
}

/* ==========================================================================
    libs
   ========================================================================== */
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.slick-track:before, .slick-track:after {
  content: "";
  display: table;
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}
[dir=rtl] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/**
	リンク下線のエフェクト
 */
/**
	リンク下線のエフェクト インラインリンク用
 */
/**
	webp背景画像を指定する
 */
.slick-slide {
  outline: none;
}

/* Slider */
/* Icons */
@font-face {
  font-family: "slick";
  src: url("./fonts/slick.eot");
  src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal;
}
.slick-controll {
  position: relative;
}
@media print, screen and (min-width:769px) {
  .slick-controll {
    width: 40%;
    margin: 0 0 0 auto;
  }
}

/* Arrows */
.slick-prev,
.slick-next {
  border: none;
  font-size: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  cursor: pointer;
  width: 40px;
  height: 40px;
  right: min(5.1282051282vw, 20px);
}
.slick-prev .arrow,
.slick-next .arrow {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 23px;
  height: 20px;
  margin: auto 0;
  line-height: 1;
}
.slick-prev .arrow:before,
.slick-prev .arrow:after,
.slick-next .arrow:before,
.slick-next .arrow:after {
  content: "";
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  position: absolute;
  background-color: #000;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  animation-fill-mode: forwards;
  animation-duration: 0.5s;
}
.slick-prev .arrow:after,
.slick-next .arrow:after {
  transform: translateX(-100%);
}
@keyframes transformLeftRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes transformRightLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
@media print, screen and (min-width:769px) {
  .slick-prev:hover .item-heading,
  .slick-next:hover .item-heading {
    opacity: 0.75;
  }
  .slick-prev:hover .arrow:before,
  .slick-next:hover .arrow:before {
    animation-name: transformRightLeft; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0s;
  }
  .slick-prev:hover .arrow:after,
  .slick-next:hover .arrow:after {
    animation-name: transformLeftRight; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0.2s;
  }
}
.slick-prev .arrow,
.slick-next .arrow {
  width: 40px;
  height: 40px;
}
.slick-prev .arrow:before,
.slick-prev .arrow:after,
.slick-next .arrow:before,
.slick-next .arrow:after {
  mask-image: url(../img/ic_arrow_next.svg);
}
@media print, screen and (min-width:769px) {
  .slick-prev,
  .slick-next {
    right: min(3.3333333333vw, 40px);
  }
}
.slick-prev {
  transform: translateY(-50%) scaleX(-1);
  right: auto;
  left: min(5.1282051282vw, 20px);
}
@media print, screen and (min-width:769px) {
  .slick-prev {
    left: min(3.3333333333vw, 40px);
  }
}

/* Dots */
/* ==========================================================================
   Layout
   ========================================================================== */
/* --------------------------------------------------------------------
  #ページ全体のwrapper
 */
.l-page-wrapper {
  position: relative;
  overflow: hidden;
}
/* --------------------------------------------------------------------
  #基本幅レイアウト用wrapper
 */
/**
  PC 1200以上は左に200相当のpadding
 */
.l-base {
  margin-left: min(7.6923076923vw, 30px);
  margin-right: min(7.6923076923vw, 30px);
}
@media print, screen and (min-width:769px) {
  .l-base {
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (min-width: 1200px) {
  .l-base {
    margin-right: 0;
    margin-left: auto;
  }
  .l-base .l-base-inner {
    position: relative;
    margin-right: 0;
    margin-left: auto;
  }
}

@media print, screen and (min-width:769px) {
  .l-base-inner {
    padding-left: min(4.5833333333vw, 55px);
    padding-right: min(4.5833333333vw, 55px);
  }
}
@media screen and (min-width: 1020px) {
  .l-base-inner {
    width: auto;
    padding-left: min(16.6666666667vw, 200px);
    padding-right: min(4.5833333333vw, 55px);
  }
}

@media screen and (min-width: 1020px) {
  .l-base-inner.--single {
    padding-right: min(16.6666666667vw, 200px);
  }
}

/* --------------------------------------------------------------------
  #メインエリアwrapper
 */
.l-main {
  position: relative;
  overflow: hidden;
}
/* --------------------------------------------------------------------
  #セカンドユーティリティページレイアウト
 */
/* --------------------------------------------------------------------
  #汎用セクションフォーマット
 */
.l-section {
  position: relative;
  z-index: 3;
  margin-bottom: 6rem;
}
@media print, screen and (min-width:769px) {
  .l-section {
    margin-bottom: 10rem;
  }
}

/* ==========================================================================
   Module
   ========================================================================== */
/**
  汎用ページ
 */
.page-top {
  position: relative;
}

.page-common {
  position: relative;
  background-color: #fff;
  padding-top: min(51.2820512821vw, 200px);
}
@media print, screen and (min-width:769px) {
  .page-common {
    padding-top: min(21.6666666667vw, 260px);
  }
}
@media screen and (min-width: 1020px) {
  .page-common {
    padding-top: min(15vw, 180px);
  }
}

.page-works-single {
  position: relative;
  background-color: #fff;
}

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

#コンテンツヘッダ

*/
/* --------------------------------------------------------------------
  #ヘッダ
 */
.header {
  position: absolute;
  z-index: 110;
  top: 0;
  left: 0;
  width: 100%;
}

.header__ci {
  position: absolute;
  z-index: 108;
  mask: url(../img/logo_black.svg) no-repeat center center/contain;
  background-color: var(--col_black);
  width: min(12.8205128205vw, 50px);
  left: min(7.6923076923vw, 30px);
  top: min(7.6923076923vw, 30px);
}
.header__ci img {
  opacity: 0;
}
.header__ci.is-top {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.header__ci.is-white {
  background-color: #fff;
}
@media print, screen and (min-width:769px) {
  .header__ci {
    width: min(7.5vw, 90px);
    left: min(4.5833333333vw, 55px);
    top: min(6.6666666667vw, 80px);
  }
}

.header.is-top .header__ci {
  display: none;
}

@media only screen and (max-width: 768px) {
  .header__ci.is-white {
    background-color: #fff;
  }
  .header__ci.is-white.is-change-color {
    background-color: #000;
  }
}
@media screen and (min-width: 769px) and (max-width: 1020px) {
  .header__ci.is-white {
    background-color: #fff;
  }
}
@media screen and (min-width: 1021px) {
  .header__ci.is-white {
    background-color: #000;
  }
}

/**
  SP時の固定ヘッダ要素
 */
/**
  メニュートリガーボタン
 */
.header__trigger {
  position: fixed;
  z-index: 111;
  cursor: pointer;
  right: 0;
  top: 0;
  width: min(23.0769230769vw, 90px);
  height: min(23.0769230769vw, 90px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.header__trigger .line1,
.header__trigger .line2,
.header__trigger .line3 {
  display: block;
  width: min(7.6923076923vw, 30px);
  height: min(0.5128205128vw, 2px);
  background-color: var(--col_black);
  transform-origin: 50% 50%;
  transition-duration: 0.2s;
}
.header__trigger .line1 {
  transform: translate3d(0, -7px, 0);
}
.header__trigger .line3 {
  transform: translate3d(0, 7px, 0);
}
.header__trigger.is-top.is-change-color .line1,
.header__trigger.is-top.is-change-color .line2,
.header__trigger.is-top.is-change-color .line3 {
  background-color: var(--col_black);
}
.header__trigger.is-active .line1,
.header__trigger.is-active .line2,
.header__trigger.is-active .line3 {
  transition-duration: 0.4s;
  background-color: #fff;
}
.header__trigger.is-active .line1 {
  transform: translate3d(0, 2px, 0) rotate(45deg);
}
.header__trigger.is-active .line2 {
  opacity: 0;
}
.header__trigger.is-active .line3 {
  transform: translate3d(0, -2px, 0) rotate(-45deg);
}
@media print, screen and (min-width:769px) {
  .header__trigger {
    width: min(30.7692307692vw, 120px);
    height: min(30.7692307692vw, 120px);
  }
  .header__trigger .line1,
  .header__trigger .line2,
  .header__trigger .line3 {
    width: 40px;
    height: 2px;
  }
  .header__trigger .line1 {
    transform: translate3d(0, -8px 0);
  }
  .header__trigger .line3 {
    transform: translate3d(0, 8px, 0);
  }
}
@media screen and (min-width: 1020px) {
  .header__trigger {
    display: none;
  }
}

.header__trigger.is-white .line1,
.header__trigger.is-white .line2,
.header__trigger.is-white .line3 {
  background-color: #fff;
}
.header__trigger.is-white.is-change-color .line1,
.header__trigger.is-white.is-change-color .line2,
.header__trigger.is-white.is-change-color .line3 {
  background-color: var(--col_black);
}

/**
  メニュー本体（SP時メニューのボディ）
 */
.header-menu {
  display: none;
  position: fixed;
  z-index: 110;
  height: 100%;
  top: 0;
  left: 0;
  width: 100%;
}
.header-menu.is-active {
  display: block;
}
.header-menu.is-active .header-menu-inner {
  opacity: 1;
}
.header-menu.is-beforeEnter {
  display: block;
  opacity: 0;
}
.header-menu.is-enter {
  display: block;
  transition: opacity 0.6s, visibility 0s;
  opacity: 1;
}
.header-menu.is-fadeOut {
  display: block;
  transition: opacity 0.6s, visibility 0.6s;
  opacity: 0;
}

.header-menu-inner {
  height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  position: absolute;
  z-index: 109;
  right: 0;
  top: 0;
  width: 100%;
  background-color: #1b1b1b;
  overscroll-behavior: contain;
  padding: 8rem 30;
}

.header-menu-content {
  margin-left: auto;
  margin-right: auto;
  padding: min(30.7692307692vw, 120px) min(7.6923076923vw, 30px);
}
@media print, screen and (min-width:769px) {
  .header-menu-content {
    padding: min(16.6666666667vw, 200px) min(8.3333333333vw, 100px);
  }
}

/**
  gnav
 */
.header__gnav {
  margin-bottom: min(25.641025641vw, 100px);
}
.header__gnav > li {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(5.641025641vw, 22px);
  line-height: 1;
  margin-bottom: min(7.6923076923vw, 30px);
}
.header__gnav > li > a {
  color: #fff;
}
@media print, screen and (min-width:769px) {
  .header__gnav {
    margin-bottom: min(16.6666666667vw, 200px);
  }
  .header__gnav > li {
    font-size: min(2vw, 24px);
    margin-bottom: min(3.3333333333vw, 40px);
  }
}

.header__insta {
  margin-top: 20px;
  position: relative;
  display: flex;
  align-items: center;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  padding-left: min(7.6923076923vw, 30px);
  font-size: min(3.5897435897vw, 14px);
  color: #fff;
}
.header__insta::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  width: min(5.1282051282vw, 20px);
  height: min(5.1282051282vw, 20px);
  mask: url(../img/ic_insta.svg) no-repeat center center/contain;
  background-color: #fff;
}
@media print, screen and (min-width:769px) {
  .header__insta {
    font-size: min(1.1666666667vw, 14px);
    padding-left: min(2.5vw, 30px);
    transition: 0.5s opacity;
  }
  .header__insta:hover {
    opacity: 0.75;
  }
  .header__insta::after {
    width: min(1.6666666667vw, 20px);
    height: min(1.6666666667vw, 20px);
  }
}

.header__copyright {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  font-size: min(3.0769230769vw, 12px);
  margin-top: min(3.8461538462vw, 15px);
  color: #fff;
}
@media print, screen and (min-width:769px) {
  .header__copyright {
    margin-top: min(1.6666666667vw, 20px);
    font-size: min(1vw, 12px);
  }
}

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

  #フッタ

 */
.footer {
  position: relative;
  z-index: 3;
  background-color: #fff;
  padding: min(20.5128205128vw, 80px) min(7.6923076923vw, 30px);
  height: auto;
}
@media print, screen and (min-width:769px) {
  .footer {
    padding: min(6.6666666667vw, 80px) min(4.5833333333vw, 55px) min(16.6666666667vw, 200px) min(4.5833333333vw, 55px);
  }
}

/*#works-single .footer,*/
.footer.is-hidden {
  overflow: hidden;
  height: 0;
  padding: 0;
  visibility: hidden;
  top: 10px;
}

.footer-inner {
  position: relative;
}

.footer__ci {
  display: none;
}
@media print, screen and (min-width:769px) {
  .footer__ci {
    display: block;
    width: min(8.3333333333vw, 100px);
    mix-blend-mode: difference;
  }
}

.footer__insta {
  margin-top: 20px;
  position: relative;
  display: flex;
  align-items: center;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  width: min(5.1282051282vw, 20px);
  height: min(5.1282051282vw, 20px);
  padding-left: min(7.6923076923vw, 30px);
  font-size: min(3.5897435897vw, 14px);
}
.footer__insta::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  width: min(5.1282051282vw, 20px);
  height: min(5.1282051282vw, 20px);
  mask: url(../img/ic_insta.svg) no-repeat center center/contain;
  background-color: #000;
}
@media print, screen and (min-width:769px) {
  .footer__insta {
    position: absolute;
    bottom: 0;
    font-size: min(1.1666666667vw, 14px);
    padding-left: min(2.5vw, 30px);
    transition: 0.5s opacity;
  }
  .footer__insta:hover {
    opacity: 0.75;
  }
  .footer__insta::after {
    width: min(1.6666666667vw, 20px);
    height: min(1.6666666667vw, 20px);
  }
}

.footer__contact {
  margin: 0 0 min(20.5128205128vw, 80px) 0;
}
@media print, screen and (min-width:769px) {
  .footer__contact {
    width: min(33.75vw, 405px);
    margin: max(-3.75vw, -45px) 0 0 auto;
  }
}

.footer__copyright {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  font-size: min(3.0769230769vw, 12px);
  margin-top: min(3.8461538462vw, 15px);
}
@media print, screen and (min-width:769px) {
  .footer__copyright {
    text-align: right;
    margin-top: min(5.8333333333vw, 70px);
    font-size: min(1vw, 12px);
  }
}

/**
  基本セク章
 */
/* ====================================================================

  パンくずリスト

 */
.breadcrumbs {
  position: absolute;
  padding: 0;
  margin: 0;
  z-index: 100;
  text-align: right;
}
@media only screen and (max-width: 768px) {
  .breadcrumbs {
    right: min(7.6923076923vw, 30px);
    top: min(34.6153846154vw, 135px);
  }
}
@media print, screen and (min-width:769px) {
  .breadcrumbs {
    right: 125px;
    top: 40px;
  }
}
@media screen and (min-width: 1020px) {
  .breadcrumbs {
    right: min(4.5833333333vw, 55px);
  }
}

.breadcrumbs.--works-single li {
  color: #fff;
}
.breadcrumbs.--works-single li::after {
  background-color: #fff;
}
.breadcrumbs.--works-single li > a {
  color: #fff;
}
@media only screen and (max-width: 768px) {
  .breadcrumbs.--works-single {
    top: calc(100vw - min(12.8205128205vw, 50px));
  }
}

.breadcrumbs li {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  display: inline-block;
  font-size: min(2.8205128205vw, 11px);
  color: var(--col_black);
}
.breadcrumbs li > a {
  color: var(--col_black);
  opacity: 0.6;
  transition: opacity 0.5s;
}
.breadcrumbs li::after {
  content: "";
  display: inline-block;
  width: min(7.6923076923vw, 30px);
  margin: 0 4px;
  height: 1px;
  background-color: var(--col_black);
}
.breadcrumbs li:last-child::after {
  display: none;
}
@media print, screen and (min-width:769px) {
  .breadcrumbs li {
    font-size: 12px;
  }
  .breadcrumbs li > a:hover {
    opacity: 1;
  }
  .breadcrumbs li::after {
    width: 30px;
    margin: 0 5px;
  }
}

.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-width: 768px) {
  .pagination {
    margin-left: 30;
    margin-right: 30;
    margin-top: min(12.8205128205vw, 50px);
  }
}
@media print, screen and (min-width:769px) {
  .pagination {
    margin-top: min(6.6666666667vw, 80px);
    justify-content: flex-end;
  }
}

.pagination .prev,
.pagination .next {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  align-items: center;
  padding: 0;
  margin: 0 0.5em;
  font-size: min(3.5897435897vw, 14px);
}
.pagination .prev .arrow,
.pagination .next .arrow {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 23px;
  height: 20px;
  margin: auto 0;
  line-height: 1;
}
.pagination .prev .arrow:before,
.pagination .prev .arrow:after,
.pagination .next .arrow:before,
.pagination .next .arrow:after {
  content: "";
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  position: absolute;
  background-color: #000;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  animation-fill-mode: forwards;
  animation-duration: 0.5s;
}
.pagination .prev .arrow:after,
.pagination .next .arrow:after {
  transform: translateX(-100%);
}
@keyframes transformLeftRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes transformRightLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
@media print, screen and (min-width:769px) {
  .pagination .prev:hover .item-heading,
  .pagination .next:hover .item-heading {
    opacity: 0.75;
  }
  .pagination .prev:hover .arrow:before,
  .pagination .next:hover .arrow:before {
    animation-name: transformRightLeft; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0s;
  }
  .pagination .prev:hover .arrow:after,
  .pagination .next:hover .arrow:after {
    animation-name: transformLeftRight; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0.2s;
  }
}
@media only screen and (max-width: 768px) {
  .pagination .prev,
  .pagination .next {
    position: absolute;
    bottom: max(-6.6666666667vw, -80px);
    z-index: 10;
  }
}
@media print, screen and (min-width:769px) {
  .pagination .prev,
  .pagination .next {
    position: relative;
    font-size: min(1.1666666667vw, 14px);
  }
}

.pagination .prev .arrow {
  transform: scaleX(-1);
  left: 0;
}
@media only screen and (max-width: 768px) {
  .pagination .prev {
    left: min(6.1538461538vw, 24px);
    padding-left: min(8.4615384615vw, 33px);
  }
}
@media print, screen and (min-width:769px) {
  .pagination .prev {
    padding-left: min(2.75vw, 33px);
  }
}

@media only screen and (max-width: 768px) {
  .pagination .next {
    right: min(6.1538461538vw, 24px);
    padding-right: min(8.4615384615vw, 33px);
  }
}
@media print, screen and (min-width:769px) {
  .pagination .next {
    padding-right: min(2.75vw, 33px);
  }
}

.pagination > .page-numbers > li.disabled {
  pointer-events: none;
  visibility: hidden;
}

.page-numbers:not(.prev):not(.next) {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  position: relative;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ADADAD;
  border-radius: 50%;
  font-size: min(3.5897435897vw, 14px);
  width: min(8.2051282051vw, 32px);
  height: min(8.2051282051vw, 32px);
}
.page-numbers:not(.prev):not(.next) > li {
  margin: 0 0.5rem;
}
@media print, screen and (min-width:769px) {
  .page-numbers:not(.prev):not(.next) {
    width: min(2.6666666667vw, 32px);
    height: min(2.6666666667vw, 32px);
    font-size: min(1.1666666667vw, 14px);
    transition: 0.5s;
  }
  .page-numbers:not(.prev):not(.next) > li {
    margin: 0 1rem;
  }
  .page-numbers:not(.prev):not(.next) .page-numbers:not(.current):not(.prev):not(.next):hover {
    opacity: 0.75;
  }
}

.page-numbers.current {
  color: var(--col_black) !important;
}
.page-numbers.current::after {
  content: "";
  display: block;
  position: absolute;
  width: 70%;
  height: 1px;
  background-color: var(--col_black);
  bottom: 0;
}

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

  #見出しモジュール

 */
/* --------------------------------------------------------------------
  # ページ見出し
 */
.heading-page {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: min(10.2564102564vw, 40px);
  line-height: 1;
}
@media print, screen and (min-width:769px) {
  .heading-page {
    font-size: min(3.3333333333vw, 40px);
  }
}

.heading-page.--works-past {
  white-space: nowrap;
}
.heading-page.--works-past > small {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 0.5em;
}

/* --------------------------------------------------------------------
  # セクション見出し
 */
.heading-sec {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  position: relative;
  font-size: min(8.2051282051vw, 32px);
  padding-top: min(8.9743589744vw, 35px);
  line-height: 1;
}
.heading-sec::before, .heading-sec::after {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  width: 100%;
  top: 0;
  left: 0;
  background-color: #D9D9D9;
}
.heading-sec::after {
  width: min(33.8461538462vw, 132px);
  background-color: #000;
}
@media print, screen and (min-width:769px) {
  .heading-sec {
    font-size: min(3.3333333333vw, 40px);
    padding-top: min(5.8333333333vw, 70px);
  }
  .heading-sec::after {
    width: min(11vw, 132px);
  }
}

@media only screen and (max-width: 768px) {
  .heading-sec.--small {
    padding-top: min(8.2051282051vw, 32px);
  }
}
@media print, screen and (min-width:769px) {
  .heading-sec.--small {
    font-size: min(2.6666666667vw, 32px);
  }
}

.heading-sec2 {
  position: relative;
  font-size: min(4.6153846154vw, 18px);
  padding-top: min(6.4102564103vw, 25px);
  line-height: 1;
}
.heading-sec2 > small {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  color: #666;
  margin-left: 1.5em;
  font-size: min(3.0769230769vw, 12px);
}
.heading-sec2::before, .heading-sec2::after {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  width: 100%;
  top: 0;
  left: 0;
  background-color: #D9D9D9;
}
.heading-sec2::after {
  width: min(17.4358974359vw, 68px);
  background-color: #000;
}
@media print, screen and (min-width:769px) {
  .heading-sec2 {
    font-size: min(1.5vw, 18px);
    padding-top: min(2.0833333333vw, 25px);
  }
  .heading-sec2::after {
    width: min(11vw, 132px);
  }
}

/*--------------------------------
	フォーム基本色
--------------------------------*/
:root {
  /* 必須 */
  --form-required: #ff0000;
  --form-required-text: #fff;
  /* 入力部分 */
  --form-input-border: #ccc;
  --form-input-bgcolor: #fff;
  --form-checked-bgcolor: #666;
  --form-select-arrow: #333;
  --form-placeholder: #ccc;
  /* ボタン */
  --form-btn-text:#fff;
  --form-btn-bgcolor:#333;
  --form-btn-bgcolor-hover:#999;
  /* エラー */
  --form-error-bgcolor:#ffe7e7;
  --form-error-text: #cc0000;
  /* プライバシーポリシー */
  --form-privacy-text: #666;
  --form-privacy-border:#ccc;
}

.form-w1 {
  width: 30%;
  max-width: 60px;
}
@media print, screen and (min-width:769px) {
  .form-w1 {
    width: 20%;
    max-width: 100px;
  }
}

.form-w2 {
  width: 48%;
}
@media print, screen and (min-width:769px) {
  .form-w2 {
    width: 40%;
  }
}

.form-w3 {
  width: 75%;
}
@media print, screen and (min-width:769px) {
  .form-w3 {
    width: 60%;
  }
}

.form-w4 {
  width: 100%;
}
@media print, screen and (min-width:769px) {
  .form-w4 {
    width: 80%;
  }
}

.form-w-full {
  width: 100%;
}

.form-w5 {
  width: 100%;
}
@media print, screen and (min-width:769px) {
  .form-w5 {
    width: 100%;
  }
}

.form-textarea {
  height: 10rem;
}
@media print, screen and (min-width:769px) {
  .form-textarea {
    height: 20rem;
  }
}

.input-list > li {
  display: inline-block;
  margin-right: 1rem;
  line-height: 2;
}
@media print, screen and (min-width:769px) {
  .input-list > li {
    margin-right: 1.5rem;
  }
}

/* --------------------------------------------------------------------
  #input
 */
input {
  vertical-align: text-top;
}

input:not([type=radio]):not([type=submit], [type=button]):not([type=file]),
textarea {
  height: min(4.5833333333vw, 55px);
  font-size: 16px;
  align-items: center;
  background-color: #F5F5F5;
  padding: 6px;
  border: 1px solid #E5E5E5;
  display: block;
}
input:not([type=radio]):not([type=submit], [type=button]):not([type=file])::placeholder,
textarea::placeholder {
  color: #aaa;
  font-size: 14px;
}
@media only screen and (max-width: 768px) {
  input:not([type=radio]):not([type=submit], [type=button]):not([type=file]),
  textarea {
    height: min(14.1025641026vw, 55px);
    font-size: 14px;
  }
  input:not([type=radio]):not([type=submit], [type=button]):not([type=file])::placeholder,
  textarea::placeholder {
    font-size: 14px;
  }
}

textarea {
  height: initial;
  transform: translateY(0);
}

/* --------------------------------------------------------------------
  #チェックボックス
 */
input[type=checkbox] {
  position: relative;
  cursor: pointer;
  width: 2.5rem;
  height: 2.5rem !important;
  border-radius: 0 !important;
  margin: 0 0.8rem 0 0;
  background: #fff;
  padding: 0 !important;
}
input[type=checkbox]:checked {
  /*position: absolute;*/
  border: 1px solid #707070;
}
input[type=checkbox]:checked::before, input[type=checkbox]:checked::after {
  content: "";
  position: absolute;
  width: 2rem;
  height: 0.2rem;
  background-color: var(--col_blue);
  left: 0;
}
input[type=checkbox]:checked::before {
  width: 0.8rem;
  transform: translate3d(0.3rem, 1.4rem, 0) rotate(45deg);
}
input[type=checkbox]:checked::after {
  width: 1.5rem;
  transform: translate3d(0.7rem, 1.1rem, 0) rotate(-45deg);
}
/* --------------------------------------------------------------------
  #ラジオボタン
 */
label {
  cursor: pointer;
}

input[type=radio] {
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  margin: 0;
  border: 1px solid #707070;
  border-radius: 50%;
  background: #fff;
  width: 2.2rem;
  height: 2.2rem;
  margin-right: 0.2em;
  transform: translateY(-0.1em);
}
@media print, screen and (min-width:769px) {
  input[type=radio] {
    width: 2.5rem;
    height: 2.5rem;
    margin-right: 0.7em;
    transform: translateY(-0.1em);
  }
}

input[type=radio]:checked {
  position: relative;
}
input[type=radio]:checked::before, input[type=radio]:checked::after {
  position: absolute;
  left: 25%;
  top: 26%;
  width: 50%;
  height: 50%;
  background: var(--col_blue);
  content: "";
  border-radius: 50%;
}

/* --------------------------------------------------------------------
  #select
 */
.select-wrap {
  position: relative;
}
.select-wrap::after {
  content: "";
  display: block;
  position: absolute;
  width: 2rem;
  height: 2rem;
  pointer-events: none;
  right: 1.5rem;
  top: calc(50% - 1rem);
  transform: rotate(90deg);
  opacity: 0.2;
}
@media print, screen and (min-width:769px) {
  .select-wrap::after {
    right: 1.6rem;
  }
}

.select-wrap .error {
  position: absolute;
  left: 0;
}

select {
  height: min(14.1025641026vw, 55px);
  width: 100%;
  border-radius: 0.6rem;
  letter-spacing: 0.05em;
  background-color: #fff;
  border: 1px solid #ddd;
  padding: 0 10px;
  font-size: 1.6rem;
}
@media print, screen and (min-width:769px) {
  select {
    height: min(4.5833333333vw, 55px);
  }
}

.article-style,
.editor-styles-wrapper {
  --article-font-family: tt-commons-pro, dnp-shuei-gothic-gin-std, sans-serif;
  /*
    コンテンツ内の見出し上マージン設定
   */
  /**
    ブロック共通マージン
   */
  /**
    イメージ
   */
  /**
    グリッド
   */
  /*
  .aligncenter {
    margin: 0 auto 1em;
  }

  .alignleft {
    float: left;
    margin: 0 1em 1em 0;
  }

  .alignright {
    margin: 0 0 1em auto;
  }

  */
}
.article-style *:last-child,
.editor-styles-wrapper *:last-child {
  margin-bottom: 0;
}
.article-style h1, .article-style h2, .article-style h3, .article-style h4, .article-style h5, .article-style h6,
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6 {
  line-height: 1.5;
  font-family: var(--article-font-family);
  font-weight: 400;
  margin: min(2.5641025641vw, 10px) 0;
}
@media print, screen and (min-width:769px) {
  .article-style h1, .article-style h2, .article-style h3, .article-style h4, .article-style h5, .article-style h6,
  .editor-styles-wrapper h1,
  .editor-styles-wrapper h2,
  .editor-styles-wrapper h3,
  .editor-styles-wrapper h4,
  .editor-styles-wrapper h5,
  .editor-styles-wrapper h6 {
    margin: min(1.25vw, 15px) 0;
  }
}
.article-style h1, .article-style h2,
.editor-styles-wrapper h1,
.editor-styles-wrapper h2 {
  font-size: min(5.1282051282vw, 20px);
  font-weight: 700;
  margin-top: min(1.6666666667vw, 20px);
}
@media print, screen and (min-width:769px) {
  .article-style h1, .article-style h2,
  .editor-styles-wrapper h1,
  .editor-styles-wrapper h2 {
    font-size: min(1.8333333333vw, 22px);
    margin-bottom: min(0.8333333333vw, 10px);
  }
}
.article-style p, .article-style li, .article-style dt, .article-style dd,
.editor-styles-wrapper p,
.editor-styles-wrapper li,
.editor-styles-wrapper dt,
.editor-styles-wrapper dd {
  font-size: min(4.1025641026vw, 16px);
  font-family: var(--article-font-family);
  font-weight: 400;
}
@media print, screen and (min-width:769px) {
  .article-style p, .article-style li, .article-style dt, .article-style dd,
  .editor-styles-wrapper p,
  .editor-styles-wrapper li,
  .editor-styles-wrapper dt,
  .editor-styles-wrapper dd {
    font-size: min(1.3333333333vw, 16px);
  }
}
.article-style h3, .article-style h4, .article-style h5, .article-style h6,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6 {
  font-size: min(4.1025641026vw, 16px);
  font-weight: 700;
  color: var(--mycol);
}
@media print, screen and (min-width:769px) {
  .article-style h3, .article-style h4, .article-style h5, .article-style h6,
  .editor-styles-wrapper h3,
  .editor-styles-wrapper h4,
  .editor-styles-wrapper h5,
  .editor-styles-wrapper h6 {
    font-size: min(4.6153846154vw, 18px);
  }
}
.article-style p + h1,
.article-style figure + h1,
.article-style p + h2,
.article-style figure + h2,
.article-style p + h3,
.article-style figure + h3,
.article-style p + h4,
.article-style figure + h4,
.article-style p + h5,
.article-style figure + h5,
.article-style p + h6,
.article-style figure + h6,
.editor-styles-wrapper p + h1,
.editor-styles-wrapper figure + h1,
.editor-styles-wrapper p + h2,
.editor-styles-wrapper figure + h2,
.editor-styles-wrapper p + h3,
.editor-styles-wrapper figure + h3,
.editor-styles-wrapper p + h4,
.editor-styles-wrapper figure + h4,
.editor-styles-wrapper p + h5,
.editor-styles-wrapper figure + h5,
.editor-styles-wrapper p + h6,
.editor-styles-wrapper figure + h6 {
  margin-top: min(15.3846153846vw, 60px);
}
@media print, screen and (min-width:769px) {
  .article-style p + h1,
  .article-style figure + h1,
  .article-style p + h2,
  .article-style figure + h2,
  .article-style p + h3,
  .article-style figure + h3,
  .article-style p + h4,
  .article-style figure + h4,
  .article-style p + h5,
  .article-style figure + h5,
  .article-style p + h6,
  .article-style figure + h6,
  .editor-styles-wrapper p + h1,
  .editor-styles-wrapper figure + h1,
  .editor-styles-wrapper p + h2,
  .editor-styles-wrapper figure + h2,
  .editor-styles-wrapper p + h3,
  .editor-styles-wrapper figure + h3,
  .editor-styles-wrapper p + h4,
  .editor-styles-wrapper figure + h4,
  .editor-styles-wrapper p + h5,
  .editor-styles-wrapper figure + h5,
  .editor-styles-wrapper p + h6,
  .editor-styles-wrapper figure + h6 {
    margin-top: min(5vw, 60px);
  }
}
.article-style p,
.editor-styles-wrapper p {
  line-height: 2;
  margin-bottom: min(3.8461538462vw, 15px);
  text-align: justify;
  text-justify: inter-ideograph;
  word-break: break-all;
}
@media print, screen and (min-width:769px) {
  .article-style p,
  .editor-styles-wrapper p {
    margin-bottom: min(2.5vw, 30px);
    line-height: 2.2;
  }
}
.article-style a,
.editor-styles-wrapper a {
  text-decoration: underline;
}
@media print, screen and (min-width:769px) {
  .article-style a:hover,
  .editor-styles-wrapper a:hover {
    text-decoration: none;
  }
}
.article-style .wp-block-image,
.article-style .wp-block-group,
.editor-styles-wrapper .wp-block-image,
.editor-styles-wrapper .wp-block-group {
  margin-top: min(10.2564102564vw, 40px);
  margin-bottom: min(10.2564102564vw, 40px);
}
@media print, screen and (min-width:769px) {
  .article-style .wp-block-image,
  .article-style .wp-block-group,
  .editor-styles-wrapper .wp-block-image,
  .editor-styles-wrapper .wp-block-group {
    margin-top: min(3.3333333333vw, 40px);
    margin-bottom: min(3.3333333333vw, 40px);
  }
}
.article-style img,
.editor-styles-wrapper img {
  display: block;
}
.article-style p + .wp-block-image,
.editor-styles-wrapper p + .wp-block-image {
  margin-top: 4em;
  display: block;
}
.article-style .wp-block-group .wp-block-image,
.article-style .wp-block-column .wp-block-image,
.editor-styles-wrapper .wp-block-group .wp-block-image,
.editor-styles-wrapper .wp-block-column .wp-block-image {
  margin: 0;
}
.article-style figcaption,
.article-style .wp-element-caption,
.editor-styles-wrapper figcaption,
.editor-styles-wrapper .wp-element-caption {
  text-align: left;
  font-size: min(3.5897435897vw, 14px);
}
@media print, screen and (min-width:769px) {
  .article-style figcaption,
  .article-style .wp-element-caption,
  .editor-styles-wrapper figcaption,
  .editor-styles-wrapper .wp-element-caption {
    font-size: min(1.1666666667vw, 14px);
  }
}
@media only screen and (max-width: 768px) {
  .article-style .wp-block-group .is-layout-grid,
  .editor-styles-wrapper .wp-block-group .is-layout-grid {
    display: block;
  }
  .article-style .wp-block-group .wp-block-image:not(last-of-type),
  .editor-styles-wrapper .wp-block-group .wp-block-image:not(last-of-type) {
    margin-bottom: min(3.8461538462vw, 15px);
  }
}
.article-style .wp-element-caption,
.editor-styles-wrapper .wp-element-caption {
  text-align: left;
  font-size: 0.875em;
  line-height: 1.75;
  margin-top: min(5.1282051282vw, 20px);
  margin-bottom: min(5.1282051282vw, 20px);
}
@media print, screen and (min-width:769px) {
  .article-style .wp-element-caption,
  .editor-styles-wrapper .wp-element-caption {
    margin-top: min(1.6666666667vw, 20px);
    margin-bottom: min(1.6666666667vw, 20px);
  }
}
.article-style .wp-caption,
.editor-styles-wrapper .wp-caption {
  max-width: 100%;
}
.article-style .wp-caption-text,
.editor-styles-wrapper .wp-caption-text {
  font-size: 0.83em;
  margin-top: -1em;
}
.article-style .wp-block-separator,
.editor-styles-wrapper .wp-block-separator {
  margin-top: min(20.5128205128vw, 80px) !important;
  margin-bottom: min(20.5128205128vw, 80px) !important;
}
@media print, screen and (min-width:769px) {
  .article-style .wp-block-separator,
  .editor-styles-wrapper .wp-block-separator {
    margin-top: min(6.6666666667vw, 80px) !important;
    margin-bottom: min(6.6666666667vw, 80px) !important;
  }
}
.article-style strong,
.editor-styles-wrapper strong {
  font-weight: bold;
  /*color: var(--mycol);*/
}
.article-style em,
.editor-styles-wrapper em {
  font-style: italic;
}
.article-style blockquote,
.editor-styles-wrapper blockquote {
  font-style: italic;
  margin: 2em 0;
  background-color: #f5f5f5;
  padding: 1.2em;
}
@media print, screen and (min-width:769px) {
  .article-style blockquote,
  .editor-styles-wrapper blockquote {
    margin: 3em 0;
  }
}
.article-style cite,
.editor-styles-wrapper cite {
  line-height: 1.75;
  font-size: 0.92em;
}
.article-style pre,
.editor-styles-wrapper pre {
  white-space: normal;
}
.article-style ul,
.article-style ol,
.editor-styles-wrapper ul,
.editor-styles-wrapper ol {
  margin: 2em 0;
}
.article-style ul li,
.editor-styles-wrapper ul li {
  list-style-type: disc;
  line-height: 1.5;
  margin-bottom: 1em;
  list-style-position: inside;
  margin-left: 1.5em;
}
.article-style ol li,
.editor-styles-wrapper ol li {
  list-style-type: decimal;
  line-height: 1.5;
  margin-bottom: 1em;
}
.article-style hr,
.editor-styles-wrapper hr {
  border: none;
  margin: 6em 0;
  border-bottom: 1px solid #656565;
}
.article-style iframe[src*=youtube],
.editor-styles-wrapper iframe[src*=youtube] {
  display: block;
  margin: 0 auto 3em;
  max-width: 500px;
  aspect-ratio: 9/16;
  width: 100%;
  height: auto;
}
@media only screen and (max-width: 768px) {
  .article-style iframe[src*=youtube],
  .editor-styles-wrapper iframe[src*=youtube] {
    max-width: 300px;
  }
}

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

  #ボタンモジュール
  style設定クラスは > .btn-inner を内包する
  ex)
  <div class="some-btn">
  <p class="btn-style-a">
    <a class="btn-inner" href="hoge">ボタン</a>
  </p>
  </div>

 */
.button-inner {
  position: relative;
  width: 100%;
  display: block;
  cursor: pointer;
}

/* --------------------------------------------------------------------
  #ボタン A - タイポ＋横棒線

 */
.button-a {
  position: relative;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  color: #000;
  font-size: min(4.1025641026vw, 16px);
  padding-right: min(25.641025641vw, 100px);
}
.button-a::after {
  content: "";
  display: block;
  position: absolute;
  width: min(23.5897435897vw, 92px);
  background-color: #000;
  height: 1px;
  right: 0;
  top: 50%;
}
@media print, screen and (min-width:769px) {
  .button-a {
    font-size: min(1.3333333333vw, 16px);
    padding: min(0.8333333333vw, 10px) min(14.1666666667vw, 170px) min(0.8333333333vw, 10px) 0;
  }
  .button-a::after {
    width: min(13.1666666667vw, 158px);
    transform-origin: 0 0;
    transition: transform 0.5s;
  }
  .button-a:hover::after {
    transform-origin: 100% 0;
    transform: scale3d(0, 1, 1);
  }
}

.button-a.--white {
  color: #fff;
}
.button-a.--white::after {
  background-color: #fff;
}

/* --------------------------------------------------------------------
  #ボタン B - 下ボーダー＋矢印（主にお問い合わせボタン）

 */
.button-b {
  position: relative;
  display: block;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height: 1;
  color: #000;
  font-size: min(4.6153846154vw, 18px);
  padding: min(5.1282051282vw, 20px) min(12.8205128205vw, 50px) min(5.1282051282vw, 20px) 0;
  letter-spacing: 0.05em;
}
.button-b .arrow {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 23px;
  height: 20px;
  margin: auto 0;
  line-height: 1;
}
.button-b .arrow:before,
.button-b .arrow:after {
  content: "";
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  position: absolute;
  background-color: #000;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  animation-fill-mode: forwards;
  animation-duration: 0.5s;
}
.button-b .arrow:after {
  transform: translateX(-100%);
}
@keyframes transformLeftRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes transformRightLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
@media print, screen and (min-width:769px) {
  .button-b:hover .item-heading {
    opacity: 0.75;
  }
  .button-b:hover .arrow:before {
    animation-name: transformRightLeft; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0s;
  }
  .button-b:hover .arrow:after {
    animation-name: transformLeftRight; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0.2s;
  }
}
.button-b::after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 1px;
  transform-origin: 0 0;
  transition: transform 0.5s;
  background-color: #000;
  bottom: 0;
}
@media print, screen and (min-width:769px) {
  .button-b {
    padding: min(1.3333333333vw, 16px) min(4.1666666667vw, 50px) min(1.3333333333vw, 16px) 0;
    font-size: min(1.5vw, 18px);
  }
  .button-b:hover::after {
    transform-origin: 100% 0;
    transform: scale3d(0, 1, 1);
  }
}

.button-b.--invert {
  text-align: right;
  padding-right: 0;
}
.button-b.--invert .arrow {
  right: auto;
  left: 0;
  transform: scaleX(-1);
}
@media print, screen and (min-width:769px) {
  .button-b.--invert::after {
    transform-origin: 100% 0;
  }
  .button-b.--invert:hover::after {
    transform-origin: 0 0;
  }
}

/* --------------------------------------------------------------------
  #フォームボタン

 */
.button-form {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--col_black);
  min-height: min(17.4358974359vw, 68px);
  font-size: min(4.1025641026vw, 16px);
  border: 1px solid var(--col_black);
  color: #fff;
  transition: 0.5s;
  cursor: pointer;
}
.button-form .arrow {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 23px;
  height: 20px;
  margin: auto 0;
  line-height: 1;
}
.button-form .arrow:before,
.button-form .arrow:after {
  content: "";
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  position: absolute;
  background-color: #000;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  animation-fill-mode: forwards;
  animation-duration: 0.5s;
}
.button-form .arrow:after {
  transform: translateX(-100%);
}
@keyframes transformLeftRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes transformRightLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
@media print, screen and (min-width:769px) {
  .button-form:hover .item-heading {
    opacity: 0.75;
  }
  .button-form:hover .arrow:before {
    animation-name: transformRightLeft; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0s;
  }
  .button-form:hover .arrow:after {
    animation-name: transformLeftRight; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0.2s;
  }
}
.button-form .arrow {
  right: min(5.1282051282vw, 20px);
}
.button-form .arrow::before,
.button-form .arrow::after {
  background-color: #fff;
}
@media print, screen and (min-width:769px) {
  .button-form {
    min-height: min(5.6666666667vw, 68px);
    font-size: min(1.3333333333vw, 16px);
  }
  .button-form .arrow {
    right: min(1.6666666667vw, 20px);
  }
  .button-form:hover {
    background-color: #fff;
    color: var(--col_black);
  }
  .button-form:hover .arrow::before,
  .button-form:hover .arrow::after {
    background-color: var(--col_black);
  }
}

/* ==========================================================================
   project
   ========================================================================== */
p.en {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height: 1.5;
}

.side {
  display: none;
}
@media screen and (min-width: 1020px) {
  .side {
    position: absolute;
    bottom: min(44.5vw, 534px);
    z-index: 108;
    display: block;
    padding-left: min(4.5833333333vw, 55px);
    width: min(16.6666666667vw, 200px);
  }
  .side.is-fixed {
    position: fixed;
    bottom: 0;
  }
}

@media screen and (min-width: 1020px) {
  .page-works-single .side {
    bottom: 0;
  }
}

.side__nav {
  position: absolute;
  bottom: min(4.1666666667vw, 50px);
}
.side__nav > li {
  line-height: 1;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 400;
  font-style: normal;
}
.side__nav > li a {
  color: var(--col_black);
  font-size: min(1.5vw, 18px);
  transition: color 0.3s;
}
.side__nav > li:not(:last-child) {
  margin-bottom: min(1.5vw, 18px);
}

.side.is-white .side__nav > li a {
  color: #fff;
}
.side.is-white.is-change-color .side__nav > li a {
  color: var(--col_black);
}

.lang-switch {
  display: flex;
  justify-content: space-between;
}
.lang-switch > li {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: min(3.0769230769vw, 12px);
  font-size: min(3.5897435897vw, 14px);
  line-height: 1;
  width: 48%;
}
.lang-switch > li::after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: 0;
  left: 0;
  background-color: #E5E5E5;
}
.lang-switch > li.is-current::after {
  background-color: #000;
}
@media print, screen and (min-width:769px) {
  .lang-switch {
    width: min(10.8333333333vw, 130px);
  }
  .lang-switch > li {
    width: min(4.75vw, 57px);
    font-size: min(1.1666666667vw, 14px);
    padding-bottom: min(0.8333333333vw, 10px);
  }
}

@media print, screen and (min-width:769px) {
  .lang-switch.--about {
    margin: 0 min(12.5vw, 150px) 0 auto;
  }
}

.prg-lang-content-en p, .prg-lang-content-en li, .prg-lang-content-en dt, .prg-lang-content-en dd {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height: 1.5;
}

/**
  top下部白背景エリア
 */
.top-area2 {
  position: relative;
  z-index: 3;
  background-color: #fff;
}

.top-sec {
  padding: min(12.8205128205vw, 50px) 0;
}
@media print, screen and (min-width:769px) {
  .top-sec {
    padding: min(8.3333333333vw, 100px) 0;
  }
}

.top-sec.--works {
  padding-top: min(12.8205128205vw, 50px);
}
@media print, screen and (min-width:769px) {
  .top-sec.--works {
    padding-top: min(16.6666666667vw, 200px);
  }
}

.top__section-button {
  text-align: right;
}
@media only screen and (max-width: 768px) {
  .top__section-button {
    display: none;
  }
}
@media print, screen and (min-width:769px) {
  .top__section-button {
    margin-top: max(-2.0833333333vw, -25px);
  }
}

.top__section-button2 {
  text-align: right;
  margin-top: min(10.2564102564vw, 40px);
}
@media print, screen and (min-width:769px) {
  .top__section-button2 {
    display: none;
  }
}

.top-staiercase {
  position: relative;
  display: block;
  overflow: hidden;
}
.top-staiercase .arrow {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 23px;
  height: 20px;
  margin: auto 0;
  line-height: 1;
}
.top-staiercase .arrow:before,
.top-staiercase .arrow:after {
  content: "";
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  position: absolute;
  background-color: #000;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  animation-fill-mode: forwards;
  animation-duration: 0.5s;
}
.top-staiercase .arrow:after {
  transform: translateX(-100%);
}
@keyframes transformLeftRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes transformRightLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
@media print, screen and (min-width:769px) {
  .top-staiercase:hover .item-heading {
    opacity: 0.75;
  }
  .top-staiercase:hover .arrow:before {
    animation-name: transformRightLeft; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0s;
  }
  .top-staiercase:hover .arrow:after {
    animation-name: transformLeftRight; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0.2s;
  }
}
.top-staiercase::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 3;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  transition: opacity 0.5s;
  background-color: rgba(0, 0, 0, 0.4);
}
.top-staiercase picture {
  display: block;
  transition: transform 0.5s;
}
@media only screen and (max-width: 768px) {
  .top-staiercase {
    margin-left: max(-7.6923076923vw, -30px);
    margin-right: max(-7.6923076923vw, -30px);
  }
}
@media print, screen and (min-width:769px) {
  .top-staiercase {
    width: 100%;
  }
  .top-staiercase:hover::before {
    opacity: 0.5;
  }
  .top-staiercase:hover picture {
    transform: scale3d(1.04, 1.04, 1);
  }
}

.top-staiercase-content {
  color: #fff;
  position: absolute;
  z-index: 4;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.top-staiercase-content > h2 {
  letter-spacing: 0.5em;
  font-weight: 600;
  font-size: min(5.641025641vw, 22px);
  line-height: 1.5;
}
.top-staiercase-content > small {
  opacity: 0.6;
  font-size: min(3.5897435897vw, 14px);
}
.top-staiercase-content > i {
  font-style: normal;
  opacity: 0.6;
  font-size: min(3.0769230769vw, 12px);
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
}
.top-staiercase-content .arrow-link {
  display: block;
  position: relative;
  padding-right: min(6.4102564103vw, 25px);
  margin-top: min(3.8461538462vw, 15px);
  font-size: min(4.6153846154vw, 18px);
}
.top-staiercase-content .arrow-link .arrow {
  width: min(4.6153846154vw, 18px);
}
.top-staiercase-content .arrow-link .arrow::before,
.top-staiercase-content .arrow-link .arrow::after {
  background-color: #fff;
}
@media print, screen and (min-width:769px) {
  .top-staiercase-content > h2 {
    font-size: min(1.8333333333vw, 22px);
  }
  .top-staiercase-content > small {
    font-size: min(1.1666666667vw, 14px);
  }
  .top-staiercase-content > i {
    font-size: min(1vw, 12px);
  }
  .top-staiercase-content .arrow-link {
    padding-right: min(2.5vw, 30px);
    font-size: min(1.5vw, 18px);
    margin-top: min(2.9166666667vw, 35px);
  }
  .top-staiercase-content .arrow-link .arrow {
    width: min(1.9166666667vw, 23px);
  }
}

.top-mv {
  position: relative;
  width: 100%;
  height: 100vh;
}
/**
  mv logo
 */
.top-mv__heading {
  position: absolute;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100vh;
  height: 100dvh;
}
.top-mv__heading img {
  width: min(30.7692307692vw, 120px);
}
@media print, screen and (min-width:769px) {
  .top-mv__heading img {
    width: min(10vw, 120px);
  }
}

/**
  slide
 */
.top-mv__slide {
  width: 100%;
}
.top-mv__slide > li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

.top-mv__slide {
  overflow: hidden;
  position: fixed;
  height: 100vh;
  /*  @include mq-sp {
      .slide-item {
        height: 100svh;
      }
    }*/
}
.top-mv__slide::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 5;
  width: 100%;
  height: 100vh;
  background-color: rgba(26, 19, 17, 0.36);
  left: 0;
  top: 0;
}
.top-mv__slide .slide-item {
  opacity: 0;
  transform: scale(1);
  transition: opacity 2s linear;
  position: relative;
  width: 100%;
  height: 100vh;
}
.top-mv__slide .slide-item:not(:first-child) {
  position: absolute;
  top: 0;
  left: 0;
}
.top-mv__slide .slide-item.show_ {
  opacity: 1;
}
.top-mv__slide .slide-item.zoom_ {
  transform: scale(1.1);
  transition: opacity 2s linear, transform 7.5s linear;
}

.top-mv__slide::before {
  transition: opacity 1.5s;
  transition-delay: 1s;
}
.top-mv__slide.ef-scroll-in::before {
  opacity: 0;
}

.top-philosophy {
  position: relative;
  z-index: 10;
  padding: min(16.6666666667vw, 65px) 0 min(25.641025641vw, 100px);
}
@media print, screen and (min-width:769px) {
  .top-philosophy {
    padding: min(9.1666666667vw, 110px) 0 min(16.6666666667vw, 200px);
  }
}

.top-philosophy__heading {
  color: #fff;
}
.top-philosophy__heading > i {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: min(4.6153846154vw, 18px);
  margin-bottom: min(12.8205128205vw, 50px);
  display: block;
}
.top-philosophy__heading > em {
  font-size: min(6.1538461538vw, 24px);
  margin-bottom: min(15.3846153846vw, 60px);
  display: block;
  font-style: normal;
  letter-spacing: 0.2em;
}
.top-philosophy__heading > small {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: min(3.5897435897vw, 14px);
  display: block;
}
@media print, screen and (min-width:769px) {
  .top-philosophy__heading > i {
    margin-bottom: min(5vw, 60px);
    font-size: min(1.5vw, 18px);
  }
  .top-philosophy__heading > em {
    margin-bottom: min(2.5vw, 30px);
    font-size: min(2vw, 24px);
  }
  .top-philosophy__heading > small {
    font-size: min(1.1666666667vw, 14px);
  }
}

.top-philosopphy-content {
  margin-top: min(10.2564102564vw, 40px);
}
.top-philosopphy-content p {
  color: #fff;
}
.top-philosopphy-content p:not(:last-child) {
  margin-bottom: min(3.8461538462vw, 15px);
}
@media print, screen and (min-width:769px) {
  .top-philosopphy-content {
    min-width: min(33.3333333333vw, 400px);
    margin: max(-5.8333333333vw, -70px) 0 0 55%;
  }
  .top-philosopphy-content p:not(:last-child) {
    margin-bottom: min(1.6666666667vw, 20px);
  }
}

.top-philosopphy-content.--en {
  margin-top: min(7.6923076923vw, 30px);
}
.top-philosopphy-content.--en p {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height: 1.5;
}
@media print, screen and (min-width:769px) {
  .top-philosopphy-content.--en {
    width: min(27.5vw, 330px);
    margin-top: min(6.6666666667vw, 80px);
  }
}

.top-philosophy__button {
  text-align: right;
  margin-top: min(12.8205128205vw, 50px);
}
@media print, screen and (min-width:769px) {
  .top-philosophy__button {
    margin-top: min(2.5vw, 30px);
  }
}

.about-sec {
  padding: min(10.2564102564vw, 40px) 0;
}
@media print, screen and (min-width:769px) {
  .about-sec {
    padding: min(5vw, 60px) 0;
  }
}

.about-sec:first-of-type {
  padding-top: min(2.5641025641vw, 10px);
}
@media print, screen and (min-width:769px) {
  .about-sec:first-of-type {
    padding-top: min(1.6666666667vw, 20px);
  }
}

.about-container {
  position: relative;
  padding-top: min(7.6923076923vw, 30px);
}
@media print, screen and (min-width:769px) {
  .about-container {
    padding: min(1.6666666667vw, 20px) 0 0;
    display: flex;
    justify-content: space-between;
  }
}

.about-profile__pict {
  margin-bottom: min(7.6923076923vw, 30px);
}
@media print, screen and (min-width:769px) {
  .about-profile__pict {
    margin-bottom: 0;
    width: min(27.75vw, 333px);
    position: absolute;
  }
}

@media print, screen and (min-width:769px) {
  .about-content {
    flex: 1;
    padding-left: min(35vw, 420px);
  }
}

.about-profile__name {
  font-size: min(6.1538461538vw, 24px);
  line-height: 1;
}
.about-profile__name > small {
  line-height: 1;
  display: block;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: min(3.5897435897vw, 14px);
  margin-top: 1.4em;
}
@media print, screen and (min-width:769px) {
  .about-profile__name {
    font-size: min(2vw, 24px);
  }
  .about-profile__name > small {
    font-size: min(1.1666666667vw, 14px);
  }
}

.about__list > dt {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
}
.about__list > dt, .about__list > dd {
  font-size: min(3.5897435897vw, 14px);
  line-height: 1.5;
}
@media only screen and (max-width: 768px) {
  .about__list > dt {
    margin-top: min(3.8461538462vw, 15px);
  }
}
@media print, screen and (min-width:769px) {
  .about__list {
    display: flex;
    flex-wrap: wrap;
  }
  .about__list > dt, .about__list > dd {
    font-size: min(1.3333333333vw, 16px);
    margin-bottom: min(1.25vw, 15px);
  }
  .about__list > dt {
    width: min(10vw, 120px);
  }
  .about__list > dd {
    width: calc(100% - min(10vw, 120px));
  }
}

.about__list.--layout1 {
  margin-top: min(3.8461538462vw, 15px);
  margin-bottom: min(8.9743589744vw, 35px);
}
@media print, screen and (min-width:769px) {
  .about__list.--layout1 {
    margin-top: min(1.25vw, 15px);
    margin-bottom: min(2.9166666667vw, 35px);
  }
}

.about__list.--layout2 > dt {
  font-weight: 400;
}
@media only screen and (max-width: 768px) {
  .about__list.--layout2 {
    margin-top: max(-5.1282051282vw, -20px);
  }
  .about__list.--layout2 > dt {
    margin-top: min(5.1282051282vw, 20px);
  }
}
@media print, screen and (min-width:769px) {
  .about__list.--layout2 {
    margin-top: min(1.6666666667vw, 20px);
  }
  .about__list.--layout2 > dt, .about__list.--layout2 > dd {
    margin-bottom: min(1.6666666667vw, 20px);
  }
}

.about-profile__list {
  margin-top: min(7.6923076923vw, 30px);
}
.about-profile__list > li {
  font-size: min(3.5897435897vw, 14px);
  line-height: 1.5;
  margin-bottom: min(3.8461538462vw, 15px);
}
@media print, screen and (min-width:769px) {
  .about-profile__list {
    margin-top: min(3.3333333333vw, 40px);
  }
  .about-profile__list > li {
    font-size: min(1.3333333333vw, 16px);
    margin-bottom: min(1.25vw, 15px);
  }
}

.about__flow {
  padding: 0;
}
.about__flow > li {
  position: relative;
  padding-bottom: min(6.4102564103vw, 25px);
}
.about__flow > li > p {
  padding-left: min(17.9487179487vw, 70px);
}
.about__flow > li::before {
  content: "";
  display: block;
  position: absolute;
  width: min(5.1282051282vw, 20px);
  height: min(7.6923076923vw, 30px);
  background-color: var(--col_black);
  mask: url(../img/ic_arrow_bottom.svg) no-repeat center center/contain;
  left: min(5.1282051282vw, 20px);
  top: min(18.9743589744vw, 74px);
}
.about__flow > li:last-child::before {
  display: none;
}
@media only screen and (max-width: 768px) {
  .about__flow > li > p {
    line-height: 1.5;
  }
}
@media print, screen and (min-width:769px) {
  .about__flow > li {
    padding-bottom: min(2.5vw, 30px);
  }
  .about__flow > li::before {
    width: min(1.6666666667vw, 20px);
    height: min(2.5vw, 30px);
    left: min(3.1666666667vw, 38px);
    top: min(6.9166666667vw, 83px);
  }
  .about__flow > li > p {
    padding-left: min(12.5vw, 150px);
  }
}
@media screen and (min-width: 1440px) {
  .about__flow {
    width: min(63.75vw, 765px);
  }
}

@media only screen and (max-width: 768px) {
  .about__flow.--en > li::before {
    top: min(17.4358974359vw, 68px);
  }
}
@media print, screen and (min-width:769px) {
  .about__flow.--en > li::before {
    top: min(17.9487179487vw, 70px);
  }
}

.works__large-banner {
  position: relative;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  overflow: hidden;
  display: block;
  height: min(58.9743589744vw, 230px);
  margin-left: max(-7.6923076923vw, -30px);
  margin-right: max(-7.6923076923vw, -30px);
  margin-top: min(15.3846153846vw, 60px);
}
.works__large-banner .banner-heading {
  font-size: min(5.1282051282vw, 20px);
  position: absolute;
  z-index: 5;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: color 0.5s;
  line-height: 1.2;
}
.works__large-banner .banner-heading > small {
  text-align: center;
  font-size: 0.7em;
}
.works__large-banner picture {
  display: block;
  transition: transform 0.5s;
  height: 100%;
}
.works__large-banner picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.works__large-banner picture::before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #F5F5F5;
  transition: opacity 0.5s;
}
@media print, screen and (min-width:769px) {
  .works__large-banner {
    width: 100%;
    height: auto;
    aspect-ratio: 3.6363636364;
    margin: min(15vw, 180px) auto 0;
  }
  @supports not (aspect-ratio: auto) {
    .works__large-banner {
      position: relative;
    }
    .works__large-banner::before {
      float: left;
      content: "";
      padding-top: 27.5%;
    }
    .works__large-banner::after {
      display: block;
      content: "";
      clear: both;
    }
    .works__large-banner > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
  .works__large-banner .banner-heading {
    font-size: min(2vw, 24px);
  }
  .works__large-banner:hover .banner-heading {
    color: #fff;
  }
  .works__large-banner:hover picture {
    transform: scale3d(1.1, 1.1, 1);
  }
  .works__large-banner:hover picture::before {
    opacity: 0;
  }
}

.works-list {
  display: flex;
  flex-wrap: wrap;
  row-gap: min(10.2564102564vw, 40px);
}
@media print, screen and (min-width:769px) {
  .works-list {
    gap: 5%;
    row-gap: min(10vw, 120px);
  }
}

.works-list__item {
  position: relative;
}
.works-list__item * {
  line-height: 1;
}
@media print, screen and (min-width:769px) {
  .works-list__item {
    width: 30%;
  }
}

.works-list__item .item-pict {
  display: block;
  overflow: hidden;
  margin-bottom: min(5.1282051282vw, 20px);
  width: 100%;
  aspect-ratio: 1.1764705882;
}
@supports not (aspect-ratio: auto) {
  .works-list__item .item-pict {
    position: relative;
  }
  .works-list__item .item-pict::before {
    float: left;
    content: "";
    padding-top: 85%;
  }
  .works-list__item .item-pict::after {
    display: block;
    content: "";
    clear: both;
  }
  .works-list__item .item-pict > img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
.works-list__item .item-pict::after {
  content: "";
  display: block;
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.works-list__item .item-pict img {
  transition: transform 0.5s;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}
@media print, screen and (min-width:769px) {
  .works-list__item .item-pict {
    margin-bottom: min(2.5vw, 30px);
    aspect-ratio: 0.7692307692;
  }
  @supports not (aspect-ratio: auto) {
    .works-list__item .item-pict {
      position: relative;
    }
    .works-list__item .item-pict::before {
      float: left;
      content: "";
      padding-top: 130%;
    }
    .works-list__item .item-pict::after {
      display: block;
      content: "";
      clear: both;
    }
    .works-list__item .item-pict > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
  .works-list__item .item-pict img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .works-list__item .item-pict:hover img {
    transform: scale3d(1.05, 1.05, 1);
  }
}

.works-list__item .item-category {
  position: relative;
  z-index: 5;
  display: block;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  margin-bottom: min(3.3333333333vw, 13px);
}
@media print, screen and (min-width:769px) {
  .works-list__item .item-category {
    margin-bottom: min(1.0833333333vw, 13px);
    transition: opacity 0.5s;
  }
  .works-list__item .item-category:hover {
    opacity: 0.75;
  }
}

.works-list__item .item-heading {
  display: block;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  line-height: 1.5;
  font-size: min(4.1025641026vw, 16px);
  margin-bottom: min(2.5641025641vw, 10px);
}
@media print, screen and (min-width:769px) {
  .works-list__item .item-heading {
    font-size: min(1.3333333333vw, 16px);
    margin-bottom: min(0.6666666667vw, 8px);
  }
}

.works-list__item .item-heading-en {
  display: block;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  line-height: 1.5;
  font-size: min(3.0769230769vw, 12px);
}
@media print, screen and (min-width:769px) {
  .works-list__item .item-heading-en {
    font-size: min(1vw, 12px);
  }
}

@media print, screen and (min-width:769px) {
  .works-list__item .item-info {
    margin-top: min(2.9166666667vw, 35px);
  }
}

/**
  トップ用レイアウト
 */
.works-list.--top .works-list__item .item-pict {
  position: relative;
}
.works-list.--top .works-list__item .item-pict::after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: 0.5s;
}
.works-list.--top .works-list__item .item-info {
  position: absolute;
  margin-top: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: rgba(0, 0, 0, 0.5);
  color: #fff;
  transition: 0.5s opacity;
}
.works-list.--top .works-list__item .item-heading {
  margin-bottom: min(2.5641025641vw, 10px);
}
@media print, screen and (min-width:769px) {
  .works-list.--top .works-list__item .item-pict {
    position: relative;
  }
  .works-list.--top .works-list__item .item-info {
    opacity: 0;
    background: none;
  }
  .works-list.--top .works-list__item .item-heading {
    margin-bottom: min(0.5833333333vw, 7px);
  }
  .works-list.--top .works-list__item .item-pict:hover .item-info {
    opacity: 1;
  }
  .works-list.--top .works-list__item .item-pict:hover::after {
    opacity: 1;
  }
  .works-list.--top .works-list__item .item-pict:hover img {
    transform: scale3d(1.05, 1.05, 1);
  }
}

.works-single-mv {
  position: relative;
}
@media print, screen and (min-width:769px) {
  .works-single-mv .l-base-inner {
    padding-right: 0;
  }
}

.works-single-mv-inner {
  position: relative;
  margin-right: auto;
}
@media only screen and (max-width: 768px) {
  .works-single-mv-inner {
    margin-left: max(-7.6923076923vw, -30px);
    margin-right: max(-7.6923076923vw, -30px);
    display: flex;
    flex-direction: column-reverse;
  }
}
@media screen and (min-width: 769px) and (max-width: 1020px) {
  .works-single-mv-inner {
    margin-left: max(-4.5833333333vw, -55px);
  }
}

.works-single-mv__pict {
  position: relative;
  width: 100%;
  display: block;
  aspect-ratio: 1;
}
@supports not (aspect-ratio: auto) {
  .works-single-mv__pict {
    position: relative;
  }
  .works-single-mv__pict::before {
    float: left;
    content: "";
    padding-top: 100%;
  }
  .works-single-mv__pict::after {
    display: block;
    content: "";
    clear: both;
  }
  .works-single-mv__pict > img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
.works-single-mv__pict img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.works-single-mv__pict::before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
}
@media print, screen and (min-width:769px) {
  .works-single-mv__pict {
    aspect-ratio: 1.6666666667;
  }
  @supports not (aspect-ratio: auto) {
    .works-single-mv__pict {
      position: relative;
    }
    .works-single-mv__pict::before {
      float: left;
      content: "";
      padding-top: 60%;
    }
    .works-single-mv__pict::after {
      display: block;
      content: "";
      clear: both;
    }
    .works-single-mv__pict > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}

.works-single-mv__heading {
  display: flex;
  flex-direction: column;
  line-height: 1.5;
}
.works-single-mv__heading .heading-category {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  font-size: min(3.5897435897vw, 14px);
  margin-bottom: min(2.0512820513vw, 8px);
}
.works-single-mv__heading .heading-jp {
  font-size: min(5.641025641vw, 22px);
  line-height: 1.5;
  margin-bottom: min(2.0512820513vw, 8px);
}
.works-single-mv__heading .heading-en {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  font-size: min(3.0769230769vw, 12px);
}
@media only screen and (max-width: 768px) {
  .works-single-mv__heading {
    padding: min(12.8205128205vw, 50px) min(7.6923076923vw, 30px);
  }
}
@media print, screen and (min-width:769px) {
  .works-single-mv__heading {
    position: absolute;
    z-index: 10;
    width: 100%;
    height: 100%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .works-single-mv__heading .heading-category {
    font-size: min(1.1666666667vw, 14px);
  }
  .works-single-mv__heading .heading-jp {
    font-size: min(1.8333333333vw, 22px);
  }
  .works-single-mv__heading .heading-en {
    font-size: min(1vw, 12px);
  }
}

.works-single-fixed {
  display: none;
}
@media print, screen and (min-width:769px) {
  .works-single-fixed {
    display: block;
    z-index: 10;
    padding-top: min(8.3333333333vw, 100px);
    padding-bottom: min(8.3333333333vw, 100px);
    top: 0;
    right: max(-16.6666666667vw, -200px);
    width: min(16.6666666667vw, 200px);
    position: absolute;
  }
  .works-single-fixed.is-fixed {
    position: fixed;
    right: 0;
    top: 0;
  }
  .works-single-fixed.is-bottom {
    position: absolute;
    right: max(-16.6666666667vw, -200px);
    top: auto;
    bottom: 0;
  }
}
@media screen and (min-width:769px) and (min-width: 769px) and (max-width: 1020px) {
  .works-single-fixed {
    right: max(-4.5833333333vw, -55px);
  }
}

.works-single__heading-side {
  width: 100%;
  display: flex;
  align-items: center;
  letter-spacing: 0.1em;
  font-feature-settings: "pkna";
  writing-mode: vertical-rl;
  text-orientation: mixed;
  -ms-text-combine-horizontal: all;
  font-size: min(2vw, 24px);
  line-height: 1.65;
}

.works-single__heading-side.--en {
  letter-spacing: 0.3em;
}
@media print, screen and (min-width:769px) {
  .works-single__heading-side.--en {
    font-family: tt-commons-pro, sans-serif;
    font-weight: 300;
    font-style: normal;
    letter-spacing: 0.075em;
  }
}

.works-single-content {
  position: relative;
}
@media print, screen and (min-width:769px) {
  .works-single-content {
    padding-top: min(7.5vw, 90px);
    padding-right: min(37.1794871795vw, 145px);
  }
  .works-single-content .lang-switch {
    margin: 0 0 0 auto;
  }
}
@media screen and (min-width: 1020px) {
  .works-single-content {
    padding-right: 0;
  }
}

.works-single-info {
  padding-top: min(10.2564102564vw, 40px);
}
@media print, screen and (min-width:769px) {
  .works-single-info {
    padding-top: min(6.25vw, 75px);
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
}

.works-single-info__data {
  display: flex;
  flex-wrap: wrap;
}
.works-single-info__data > dt,
.works-single-info__data > dd {
  font-size: min(4.1025641026vw, 16px);
}
.works-single-info__data > dt {
  width: min(15.8974358974vw, 62px);
}
.works-single-info__data > dd {
  width: calc(100% - min(15.8974358974vw, 62px));
}
@media print, screen and (min-width:769px) {
  .works-single-info__data {
    width: 40%;
  }
  .works-single-info__data > dt,
  .works-single-info__data > dd {
    font-size: min(1.1666666667vw, 14px);
  }
  .works-single-info__data > dt {
    width: min(5.1666666667vw, 62px);
  }
  .works-single-info__data > dd {
    width: calc(100% - min(15.8974358974vw, 62px));
  }
}

.works-single-info__data.--en > dt,
.works-single-info__data.--en > dd {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height: 2.3;
}
.works-single-info__data.--en > dt {
  width: min(25.641025641vw, 100px);
}
.works-single-info__data.--en > dd {
  width: calc(100% - min(25.641025641vw, 100px));
}
@media only screen and (max-width: 768px) {
  .works-single-info__data.--en > dt, .works-single-info__data.--en > dd {
    line-height: 2.3;
  }
}
@media print, screen and (min-width:769px) {
  .works-single-info__data.--en > dt {
    width: min(8.3333333333vw, 100px);
  }
  .works-single-info__data.--en > dd {
    width: calc(100% - min(8.3333333333vw, 100px));
  }
}

.works-single-info__text {
  padding-top: min(10.2564102564vw, 40px);
}
.works-single-info__text > p {
  font-size: min(4.1025641026vw, 16px);
  text-align: justify;
  text-justify: inter-ideograph;
}
.works-single-info__text > p:not(:last-child) {
  margin-bottom: 1em;
}
@media print, screen and (min-width:769px) {
  .works-single-info__text {
    width: 50%;
    padding-top: 0;
  }
  .works-single-info__text > p {
    font-size: min(1.3333333333vw, 16px);
  }
}

.works-single-info__text.--en > p {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height: 1.5;
}

.works-single__pict {
  margin-top: min(15.3846153846vw, 60px);
  margin-left: max(-7.6923076923vw, -30px);
  margin-right: max(-7.6923076923vw, -30px);
}
.works-single__pict > li:not(:last-child) {
  margin-bottom: min(2.0512820513vw, 8px);
}
@media print, screen and (min-width:769px) {
  .works-single__pict {
    margin-top: min(23.3333333333vw, 280px);
    margin-left: auto;
    margin-right: auto;
  }
  .works-single__pict > li:not(:last-child) {
    margin-bottom: min(4.5833333333vw, 55px);
  }
}

.works-single__contact {
  padding: min(15.3846153846vw, 60px) min(7.6923076923vw, 30px);
}
@media print, screen and (min-width:769px) {
  .works-single__contact {
    padding: min(13.3333333333vw, 160px) 0;
  }
  .works-single__contact .button-b {
    width: min(34.1666666667vw, 410px);
    margin-left: auto;
    margin-right: auto;
  }
}

/*****************************************************************************
  next content
 */
.works-single-next {
  position: relative;
  height: 100vh;
}
.works-single-next .progress-bar {
  position: absolute;
  z-index: 10;
  display: block;
  width: 100%;
  height: 2px;
  background-color: var(--col_black);
  left: 0;
  bottom: 0;
  transform-origin: 0 0;
  transition: transform 2s;
  transition-timing-function: cubic-bezier(1, -0.01, 0.02, 1);
  transform: scale3d(0, 1, 1);
}
.works-single-next .progress-bar.is-leave {
  transform-origin: 100% 0;
  transition: 1s transform;
  transition-timing-function: cubic-bezier(0, 0.27, 0.13, 1);
  transform: scale3d(0, 1, 1) !important;
}
@media screen and (min-width: 1020px) {
  .works-single-next {
    margin-left: min(16.6666666667vw, 200px);
  }
}

.works-single-next-content {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #efefef;
}
@media only screen and (max-width: 768px) {
  .works-single-next-content {
    position: absolute;
    bottom: 0;
    right: 0;
    aspect-ratio: 0.6944444444;
    padding-top: min(20.5128205128vw, 80px);
  }
  @supports not (aspect-ratio: auto) {
    .works-single-next-content {
      position: relative;
    }
    .works-single-next-content::before {
      float: left;
      content: "";
      padding-top: 144%;
    }
    .works-single-next-content::after {
      display: block;
      content: "";
      clear: both;
    }
    .works-single-next-content > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}
@media print, screen and (min-width:769px) {
  .works-single-next-content {
    position: absolute;
    bottom: 0;
    right: 0;
    aspect-ratio: 1.6666666667;
  }
  @supports not (aspect-ratio: auto) {
    .works-single-next-content {
      position: relative;
    }
    .works-single-next-content::before {
      float: left;
      content: "";
      padding-top: 60%;
    }
    .works-single-next-content::after {
      display: block;
      content: "";
      clear: both;
    }
    .works-single-next-content > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}

.works-single-next-content__heading {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  position: absolute;
  width: 100%;
  text-align: center;
  line-height: 1;
  font-size: min(6.1538461538vw, 24px);
  top: max(-15.3846153846vw, -60px);
}
@media print, screen and (min-width:769px) {
  .works-single-next-content__heading {
    top: max(-4.1666666667vw, -50px);
    font-size: min(2vw, 24px);
  }
}

.works-single-next-box {
  position: absolute;
  transition: 2s;
  width: min(80.7692307692vw, 315px);
  aspect-ratio: 0.7835820896;
}
@supports not (aspect-ratio: auto) {
  .works-single-next-box {
    position: relative;
  }
  .works-single-next-box::before {
    float: left;
    content: "";
    padding-top: 127.62%;
  }
  .works-single-next-box::after {
    display: block;
    content: "";
    clear: both;
  }
  .works-single-next-box > img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
.works-single-next-box::before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
}
@media print, screen and (min-width:769px) {
  .works-single-next-box {
    width: min(28vw, 336px);
    aspect-ratio: 0.7813953488;
  }
  @supports not (aspect-ratio: auto) {
    .works-single-next-box {
      position: relative;
    }
    .works-single-next-box::before {
      float: left;
      content: "";
      padding-top: 127.98%;
    }
    .works-single-next-box::after {
      display: block;
      content: "";
      clear: both;
    }
    .works-single-next-box > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}

.works-single-next-box__pict {
  display: block;
  width: 100%;
  height: 100%;
}
.works-single-next-box__pict img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.works-single-next-content.is-transition {
  transition: 1.2s;
  overflow: hidden;
}
@media only screen and (max-width: 768px) {
  .works-single-next-content.is-transition {
    aspect-ratio: 1;
    padding: 0;
  }
  @supports not (aspect-ratio: auto) {
    .works-single-next-content.is-transition {
      position: relative;
    }
    .works-single-next-content.is-transition::before {
      float: left;
      content: "";
      padding-top: 100%;
    }
    .works-single-next-content.is-transition::after {
      display: block;
      content: "";
      clear: both;
    }
    .works-single-next-content.is-transition > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}
.works-single-next-box.is-transition {
  width: 100%;
  transition: 1.2s;
  display: block;
  aspect-ratio: 1;
}
@supports not (aspect-ratio: auto) {
  .works-single-next-box.is-transition {
    position: relative;
  }
  .works-single-next-box.is-transition::before {
    float: left;
    content: "";
    padding-top: 100%;
  }
  .works-single-next-box.is-transition::after {
    display: block;
    content: "";
    clear: both;
  }
  .works-single-next-box.is-transition > img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
@media only screen and (max-width: 768px) {
  .works-single-next-box.is-transition {
    padding: 0;
  }
}
@media print, screen and (min-width:769px) {
  .works-single-next-box.is-transition {
    aspect-ratio: 1.6666666667;
  }
  @supports not (aspect-ratio: auto) {
    .works-single-next-box.is-transition {
      position: relative;
    }
    .works-single-next-box.is-transition::before {
      float: left;
      content: "";
      padding-top: 60%;
    }
    .works-single-next-box.is-transition::after {
      display: block;
      content: "";
      clear: both;
    }
    .works-single-next-box.is-transition > img {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}

.works-single-next-box__heading {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.works-single-next-box__heading > * {
  line-height: 1.5;
  color: #fff;
}
.works-single-next-box__heading .heading-category {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  font-size: min(3.5897435897vw, 14px);
  margin-bottom: min(3.0769230769vw, 12px);
}
.works-single-next-box__heading .heading-jp {
  font-size: min(4.1025641026vw, 16px);
  margin-bottom: min(1.2820512821vw, 5px);
}
.works-single-next-box__heading .heading-en {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  font-size: min(3.0769230769vw, 12px);
}
@media print, screen and (min-width:769px) {
  .works-single-next-box__heading {
    padding: min(1.6666666667vw, 20px);
  }
  .works-single-next-box__heading .heading-category {
    font-family: tt-commons-pro, sans-serif;
    font-weight: 200;
    font-style: normal;
    font-size: min(1.1666666667vw, 14px);
    margin-bottom: min(1vw, 12px);
  }
  .works-single-next-box__heading .heading-jp {
    font-size: min(1.3333333333vw, 16px);
    margin-bottom: min(0.4166666667vw, 5px);
  }
  .works-single-next-box__heading .heading-en {
    font-family: tt-commons-pro, sans-serif;
    font-weight: 200;
    font-style: normal;
    font-size: min(1vw, 12px);
  }
}

@media print, screen and (min-width:769px) {
  .prg-change-line {
    position: absolute;
    width: 100%;
    bottom: 0;
  }
}

.works-modal {
  position: fixed;
  z-index: 112;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  display: none;
}
.works-modal.is-beforeEnter {
  display: block;
  opacity: 0;
}
.works-modal.is-active {
  display: block;
}
.works-modal.is-enter {
  opacity: 1;
  transition: 1s opacity;
}
.works-modal.is-leave {
  display: block;
  opacity: 0;
  transition: 1s opacity;
}

.works-modal-inner {
  height: 100%;
}
@media print, screen and (min-width:769px) {
  .works-modal-inner {
    /*max-width: vw-clamp(1200);*/
    margin-left: auto;
    margin-right: auto;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

.works-modal-slide {
  position: relative;
  width: 100%;
}
@media only screen and (max-width: 768px) {
  .works-modal-slide {
    height: 100%;
  }
}
@media only screen and (max-width: 768px) {
  .works-modal-slide .slick-prev,
  .works-modal-slide .slick-next {
    top: auto;
    bottom: calc(env(safe-area-inset-bottom) + min(5.1282051282vw, 20px));
  }
}

.works-modal-slide__item {
  position: relative;
  padding: min(20.5128205128vw, 80px) min(7.6923076923vw, 30px) 0;
}
.works-modal-slide__item .lang-switch {
  margin: min(7.6923076923vw, 30px) 0 min(7.6923076923vw, 30px) auto;
}
@media print, screen and (min-width:769px) {
  .works-modal-slide__item {
    padding: 0 min(16.6666666667vw, 200px);
  }
  .works-modal-slide__item .lang-switch {
    margin: min(2.5vw, 30px) 0 min(2.5vw, 30px) auto;
  }
}

.works-modal__pict {
  height: 40vh;
  max-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.works-modal__pict img {
  height: 40vh;
  max-height: 200px;
  width: auto;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-fit: contain;
}
@media print, screen and (min-width:769px) {
  .works-modal__pict {
    height: 60vh;
    max-height: 500px;
  }
  .works-modal__pict img {
    height: 60vh;
    max-height: 500px;
  }
}

.works-modal-content {
  position: relative;
}
@media print, screen and (min-width:769px) {
  .works-modal-content {
    display: flex;
    justify-content: space-between;
  }
}

.works-modal__heading {
  font-weight: 300;
  line-height: 1.5;
  font-size: min(4.1025641026vw, 16px);
}
.works-modal__heading > small {
  display: block;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: min(3.0769230769vw, 12px);
  line-height: 1.3;
  margin-top: min(1.2820512821vw, 5px);
}
@media print, screen and (min-width:769px) {
  .works-modal__heading {
    font-size: min(1.5vw, 18px);
    padding-right: min(4.1666666667vw, 50px);
  }
  .works-modal__heading > small {
    font-style: min(1vw, 12px);
  }
}

@media print, screen and (min-width:769px) {
  .prg-lang-content-en.works-modal-content .works-modal__heading {
    font-size: min(1.6666666667vw, 20px);
  }
}

.works-modal__data {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: min(7.6923076923vw, 30px);
}
.works-modal__data > dt,
.works-modal__data > dd {
  font-size: min(3.5897435897vw, 14px);
  line-height: 1.5;
  margin-bottom: 0.75em;
}
.works-modal__data > dt {
  width: min(15.8974358974vw, 62px);
  white-space: nowrap;
}
.works-modal__data > dd {
  width: calc(100% - min(21.0256410256vw, 82px));
}
@media print, screen and (min-width:769px) {
  .works-modal__data {
    width: min(33.3333333333vw, 400px);
    margin-top: 0;
  }
  .works-modal__data > dt,
  .works-modal__data > dd {
    font-size: min(1.1666666667vw, 14px);
  }
  .works-modal__data > dt {
    width: min(6.8333333333vw, 82px);
  }
  .works-modal__data > dd {
    width: calc(100% - min(21.0256410256vw, 82px));
  }
}

.works-modal__data.--en > dt,
.works-modal__data.--en > dd {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height: 1.5;
  margin-bottom: 0.8em;
}
.works-modal__data.--en > dt {
  width: min(30.7692307692vw, 120px);
}
.works-modal__data.--en > dd {
  width: calc(100% - min(30.7692307692vw, 120px));
}
@media print, screen and (min-width:769px) {
  .works-modal__data.--en > dt {
    width: min(10vw, 120px);
  }
  .works-modal__data.--en > dd {
    width: calc(100% - min(10vw, 120px));
  }
}

.works-modal__close {
  position: absolute;
  z-index: 112;
  cursor: pointer;
  right: min(7.6923076923vw, 30px);
  top: min(5.1282051282vw, 20px);
  width: min(7.6923076923vw, 30px);
}
@media print, screen and (min-width:769px) {
  .works-modal__close {
    width: min(2.5vw, 30px);
    right: min(3.3333333333vw, 40px);
    top: min(2.0833333333vw, 25px);
    transition: 0.5s opacity;
  }
  .works-modal__close:hover {
    opacity: 0.75;
  }
}

.info-list {
  display: flex;
  flex-direction: column;
  gap: min(5.1282051282vw, 20px);
}
@media print, screen and (min-width:769px) {
  .info-list {
    gap: min(2.5vw, 30px);
  }
}

@media print, screen and (min-width:769px) {
  .info-list.--top {
    margin-left: auto;
    margin-right: auto;
    width: min(73.3333333333vw, 880px);
  }
}

@media print, screen and (min-width:769px) {
  .info-list.--info-top {
    margin-left: auto;
    margin-right: auto;
    width: min(73.3333333333vw, 880px);
    min-height: 400px;
  }
}

.info-list__item * {
  line-height: 1;
}
.info-list__item .item-link {
  display: block;
}
.info-list__item .item-category {
  position: absolute;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(3.5897435897vw, 14px);
}
.info-list__item .item-date {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  font-size: min(3.0769230769vw, 12px);
}
.info-list__item .item-heading {
  line-height: 1.5;
  font-size: min(4.1025641026vw, 16px);
}
.info-list__item .item-heading > i {
  display: block;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  margin-top: 0.5em;
}
@media only screen and (max-width: 768px) {
  .info-list__item {
    margin-bottom: min(2.5641025641vw, 10px);
  }
  .info-list__item .item-link {
    padding-top: min(5.641025641vw, 22px);
    padding-right: 0 !important;
    padding-bottom: min(3.8461538462vw, 15px);
  }
  .info-list__item .item-link .arrow {
    top: auto;
  }
  .info-list__item .item-date {
    display: block;
    margin-bottom: min(1.2820512821vw, 5px);
  }
}
@media print, screen and (min-width:769px) {
  .info-list__item .item-link {
    padding-top: min(1.6666666667vw, 20px);
    display: flex;
    align-items: flex-start;
  }
  .info-list__item .item-category {
    font-size: min(1.3333333333vw, 16px);
  }
  .info-list__item .item-date {
    font-size: min(1.3333333333vw, 16px);
    width: 17%;
    margin-top: min(0.4166666667vw, 5px);
  }
  .info-list__item .item-heading {
    font-size: min(1.3333333333vw, 16px);
    width: 83%;
    transition: 0.5s opacity;
  }
}

.info-list__item .item-link {
  position: relative;
  padding-right: 40px;
}
.info-list__item .arrow {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 23px;
  height: 20px;
  margin: auto 0;
  line-height: 1;
}
.info-list__item .arrow:before,
.info-list__item .arrow:after {
  content: "";
  mask: url(../img/ic_arrow_a.svg) no-repeat center center/contain;
  position: absolute;
  background-color: #000;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  animation-fill-mode: forwards;
  animation-duration: 0.5s;
}
.info-list__item .arrow:after {
  transform: translateX(-100%);
}
@keyframes transformLeftRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes transformRightLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
@media print, screen and (min-width:769px) {
  .info-list__item:hover .item-heading {
    opacity: 0.75;
  }
  .info-list__item:hover .arrow:before {
    animation-name: transformRightLeft; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0s;
  }
  .info-list__item:hover .arrow:after {
    animation-name: transformLeftRight; /* 修正: hover時のアニメーションを指定 */
    animation-delay: 0.2s;
  }
}

.works-past__list {
  margin-left: max(-7.6923076923vw, -30px);
  margin-right: max(-7.6923076923vw, -30px);
  margin-top: min(5.1282051282vw, 20px);
  display: grid;
  gap: min(1.0256410256vw, 4px);
  grid-template-columns: 50% 50%;
  grid-template-rows: repeat(12, auto);
  grid-template-areas: "ceramics ceramics" "ryukoku ryukoku" "wosaka wosaka" "rakunan-hall akita-senshu" "hiroshima-art rakunan-band" "genji genji" "fukuyama kakogawa-wellness" "fuji-xerox kakogawa-wellness" "rokko-chu rokko-chu" "koa western-art" "koa nakatsu-saiseikai" "koa nakatsu-saiseikai" "st-andrew nakatsu-saiseikai";
}
@media print, screen and (min-width:769px) {
  .works-past__list {
    margin-top: min(3.3333333333vw, 40px);
    margin-left: auto;
    margin-right: auto;
    gap: min(0.3333333333vw, 4px);
    grid-template-columns: repeat(4, 25%);
    grid-template-rows: repeat(9, 1fr);
    grid-template-areas: "ceramics ceramics wosaka wosaka" "ceramics ceramics wosaka wosaka" "ryukoku ryukoku wosaka wosaka" "ryukoku ryukoku rakunan-hall akita-senshu" "hiroshima-art rakunan-band rokko-chu rokko-chu" "genji genji rokko-chu rokko-chu" "genji genji koa western-art" "fukuyama kakogawa-wellness koa nakatsu-saiseikai" "fuji-xerox kakogawa-wellness st-andrew nakatsu-saiseikai";
  }
}

.works-past__list .list-item {
  position: relative;
  display: block;
}
.works-past__list .list-item .list-title {
  position: absolute;
  z-index: 3;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  flex-direction: column;
  font-weight: 300;
  color: #fff;
  line-height: 1.5;
  font-size: min(4.1025641026vw, 16px);
  padding: min(6.4102564103vw, 25px) min(5.1282051282vw, 20px);
}
.works-past__list .list-item .list-title > small {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: min(3.0769230769vw, 12px);
  line-height: 1.3;
  margin-top: min(1.2820512821vw, 5px);
}
.works-past__list .list-item .list-title.--size-fix {
  font-size: min(3.5897435897vw, 14px);
}
.works-past__list .list-item .list-pict {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
}
.works-past__list .list-item .list-pict img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.works-past__list .list-item .list-pict::before, .works-past__list .list-item .list-pict::after {
  content: "";
  display: block;
  position: absolute;
  z-index: 2;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.7) 100%);
  transition: 0.5s opacity;
}
.works-past__list .list-item .list-pict::after {
  opacity: 0;
  background: rgba(0, 0, 0, 0.6);
}
.works-past__list .list-item .works-modal__data {
  display: none;
}
@media print, screen and (min-width:769px) {
  .works-past__list .list-item {
    overflow: hidden;
    cursor: pointer;
  }
  .works-past__list .list-item .list-title {
    padding: min(2.0833333333vw, 25px) min(2.5vw, 30px);
    font-size: min(1.3333333333vw, 16px);
  }
  .works-past__list .list-item .list-title.--size-fix {
    font-size: min(1.1666666667vw, 14px);
  }
  .works-past__list .list-item .list-pict {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 65%, rgba(0, 0, 0, 0.7) 100%);
    transition: 0.5s background;
  }
  .works-past__list .list-item .list-pict img {
    transition: 0.5s transform;
  }
  .works-past__list .list-item:hover .list-pict::before {
    opacity: 0;
  }
  .works-past__list .list-item:hover .list-pict::after {
    opacity: 1;
  }
  .works-past__list .list-item:hover .list-pict img {
    transform: scale3d(1.1, 1.1, 1);
  }
}

.works-past__list .list-item.ceramics {
  grid-area: ceramics;
}
.works-past__list .list-item.wosaka {
  grid-area: wosaka;
}
.works-past__list .list-item.ryukoku {
  grid-area: ryukoku;
}
.works-past__list .list-item.rakunan-hall {
  grid-area: rakunan-hall;
}
.works-past__list .list-item.akita-senshu {
  grid-area: akita-senshu;
}
.works-past__list .list-item.hiroshima-art {
  grid-area: hiroshima-art;
}
.works-past__list .list-item.rakunan-band {
  grid-area: rakunan-band;
}
.works-past__list .list-item.rokko-chu {
  grid-area: rokko-chu;
}
.works-past__list .list-item.genji {
  grid-area: genji;
}
.works-past__list .list-item.fukuyama {
  grid-area: fukuyama;
}
.works-past__list .list-item.koa {
  grid-area: koa;
}
.works-past__list .list-item.western-art {
  grid-area: western-art;
}
.works-past__list .list-item.fuji-xerox {
  grid-area: fuji-xerox;
}
.works-past__list .list-item.kakogawa-wellness {
  grid-area: kakogawa-wellness;
}
.works-past__list .list-item.st-andrew {
  grid-area: st-andrew;
}
.works-past__list .list-item.nakatsu-saiseikai {
  grid-area: nakatsu-saiseikai;
}

.works-past__note {
  font-size: min(3.5897435897vw, 14px);
  padding-left: 1em;
  text-indent: -1em;
  margin-top: min(5.1282051282vw, 20px);
}
@media print, screen and (min-width:769px) {
  .works-past__note {
    font-size: min(1.3333333333vw, 16px);
    margin-top: min(1.6666666667vw, 20px);
  }
}

.info-single-container {
  position: relative;
  margin-top: min(10.2564102564vw, 40px);
  padding-top: min(10.2564102564vw, 40px);
}
.info-single-container::before, .info-single-container::after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: #D9D9D9;
  top: 0;
  left: 0;
}
.info-single-container::after {
  background-color: #000;
  width: min(34.8717948718vw, 136px);
}
@media print, screen and (min-width:769px) {
  .info-single-container {
    margin-top: min(5vw, 60px);
    padding-top: min(5vw, 60px);
  }
  .info-single-container::after {
    width: min(11.3333333333vw, 136px);
  }
}

@media print, screen and (min-width:769px) {
  .info-single-head {
    width: min(25vw, 300px);
    position: absolute;
    top: 0;
    padding-top: min(5vw, 60px);
  }
  .info-single-head.is-fixed {
    position: fixed;
    top: 0;
  }
  .info-single-head.is-bottom {
    position: absolute;
    top: auto;
    bottom: 0;
  }
}

.info-single-head__category {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 400;
  font-style: normal;
  display: block;
  line-height: 1;
  font-size: min(4.1025641026vw, 16px);
  margin-bottom: min(2.5641025641vw, 10px);
}
@media print, screen and (min-width:769px) {
  .info-single-head__category {
    font-size: min(1.3333333333vw, 16px);
    margin-bottom: min(0.8333333333vw, 10px);
  }
}

.info-single-head__date {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  line-height: 1;
  display: block;
  font-size: min(3.5897435897vw, 14px);
  margin-bottom: min(7.6923076923vw, 30px);
}
@media print, screen and (min-width:769px) {
  .info-single-head__date {
    font-size: min(1.1666666667vw, 14px);
    margin-bottom: min(2.5vw, 30px);
  }
}

.info-single-head__heading {
  line-height: 1.75;
  font-size: min(5.641025641vw, 22px);
}
.info-single-head__heading > i {
  display: block;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: min(4.6153846154vw, 18px);
  margin-top: 1em;
}
@media print, screen and (min-width:769px) {
  .info-single-head__heading {
    font-size: min(1.8333333333vw, 22px);
  }
  .info-single-head__heading > i {
    font-size: min(1.5vw, 18px);
  }
}

.info-single-head__button {
  display: none;
  text-align: right;
  padding-right: 0;
  margin-top: min(10.2564102564vw, 40px);
}
.info-single-head__button .arrow {
  left: 0;
  right: auto;
  transform: scaleX(-1);
}
@media print, screen and (min-width:769px) {
  .info-single-head__button {
    display: block;
    margin-top: min(9.1666666667vw, 110px);
  }
  .info-single-head__button::after {
    transform-origin: 100% 0;
  }
  .info-single-head__button:hover::after {
    transform-origin: 0 0;
  }
}

@media only screen and (max-width: 768px) {
  .info-single-content {
    padding-top: min(10.2564102564vw, 40px);
  }
}
@media print, screen and (min-width:769px) {
  .info-single-content {
    padding-left: min(30vw, 360px);
    min-height: 400px;
    padding-top: min(5.8333333333vw, 70px);
    padding-right: max(100px, 10%);
  }
}

@media print, screen and (min-width:769px) {
  .category-nav {
    display: flex;
    justify-content: flex-end;
  }
}

.category-nav__all {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  position: relative;
  padding-right: min(8.9743589744vw, 35px);
  display: inline-block;
  margin-bottom: min(2.5641025641vw, 10px);
}
.category-nav__all::after {
  content: "";
  display: block;
  position: absolute;
  width: min(6.1538461538vw, 24px);
  height: 1px;
  background-color: #C4C4C4;
  rotate: -60deg;
  top: min(2.3076923077vw, 9px);
  right: 0;
}
.category-nav__all small {
  font-size: 0.75em;
  display: inline-block;
  margin-left: 2px;
  transform: translateY(-0.5em);
}
@media print, screen and (min-width:769px) {
  .category-nav__all {
    padding-right: min(3.3333333333vw, 40px);
    margin-bottom: 0;
  }
  .category-nav__all::after {
    width: min(2vw, 24px);
    right: min(0.8333333333vw, 10px);
    top: min(1.25vw, 15px);
  }
}

.category-nav__list {
  display: flex;
  align-items: center;
}
.category-nav__list > li {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  line-height: 1;
}
.category-nav__list > li > a {
  color: var(--col_black);
  opacity: 0.6;
  transition: 0.5s opacity;
}
.category-nav__list > li:not(:last-child) {
  margin-right: 1em;
}
@media print, screen and (min-width:769px) {
  .category-nav__list > li > a:hover {
    opacity: 1;
  }
}

.heading-page + .category-nav {
  margin-top: min(10.2564102564vw, 40px);
}
@media print, screen and (min-width:769px) {
  .heading-page + .category-nav {
    margin-top: max(-1.6666666667vw, -20px);
  }
}

.contact-sec {
  background-color: #f9f9f9;
  padding: min(5.1282051282vw, 20px) min(5.1282051282vw, 20px) min(15.3846153846vw, 60px);
}
@media print, screen and (min-width:769px) {
  .contact-sec {
    padding: min(6.6666666667vw, 80px) min(9.1666666667vw, 110px);
  }
}

.contact__text {
  font-size: min(4.1025641026vw, 16px);
  margin-bottom: min(7.6923076923vw, 30px);
}
@media print, screen and (min-width:769px) {
  .contact__text {
    font-size: min(1.3333333333vw, 16px);
    margin-bottom: min(3.3333333333vw, 40px);
  }
}

.contact__text.--en {
  margin-bottom: min(7.6923076923vw, 30px);
  line-height: 1.5;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
}
@media print, screen and (min-width:769px) {
  .contact__text.--en {
    margin-bottom: min(10vw, 120px);
  }
}

.contact__flow {
  z-index: 100;
  text-align: right;
  margin-bottom: min(5.1282051282vw, 20px);
}
@media print, screen and (min-width:769px) {
  .contact__flow {
    margin-bottom: min(3.3333333333vw, 40px);
  }
}

.contact__flow li {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
  display: inline-block;
  font-size: min(2.8205128205vw, 11px);
  color: var(--col_black);
  opacity: 0.4;
}
.contact__flow li.is-current {
  opacity: 1;
}
.contact__flow li::after {
  content: "";
  display: inline-block;
  width: min(7.6923076923vw, 30px);
  margin: 0 4px;
  height: 1px;
  background-color: var(--col_black);
}
.contact__flow li:last-child::after {
  display: none;
}
@media print, screen and (min-width:769px) {
  .contact__flow li {
    font-size: min(1vw, 12px);
  }
  .contact__flow li::after {
    width: 30px;
    margin: 0 5px;
  }
}

.form-table {
  width: 100%;
  text-align: left;
  row-gap: min(5.1282051282vw, 20px);
}
@media print, screen and (min-width:769px) {
  .form-table {
    max-width: min(83.3333333333vw, 1000px);
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    row-gap: min(1.6666666667vw, 20px);
  }
}

.form-table dt {
  position: relative;
  color: var(--col_dblue);
  font-size: min(3.5897435897vw, 14px);
}
.form-table dt > i {
  display: block;
  font-family: tt-commons-pro, sans-serif;
  font-weight: 300;
  font-style: normal;
  line-height: 1.5;
  color: #666;
}
.form-table dt.no-top-padding {
  padding-top: 0;
}
@media print, screen and (min-width:769px) {
  .form-table dt {
    width: min(20.8333333333vw, 250px);
    font-size: min(1.3333333333vw, 16px);
    padding-top: 0.3em;
    /*display: flex;
    align-items: center;*/
  }
  .form-table dt > i {
    font-size: min(1vw, 12px);
  }
}

@media only screen and (max-width: 768px) {
  .form-table dd {
    font-size: min(3.5897435897vw, 14px);
  }
  .form-table dd:not(:last-of-type) {
    margin-bottom: min(3.8461538462vw, 15px);
  }
}
@media print, screen and (min-width:769px) {
  .form-table dd {
    width: calc(100% - min(20.8333333333vw, 250px));
    font-size: min(1.3333333333vw, 16px);
  }
}

@media print, screen and (min-width:769px) {
  .form-table dt:last-of-type {
    margin-bottom: 0;
  }
}

.form-table dd:last-of-type {
  margin-bottom: 0;
}

.form-table dd.radio-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
@media print, screen and (min-width:769px) {
  .form-table dd.radio-container {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 2rem;
  }
}

.form-table b.error {
  color: var(--form-error-text);
}

.form-table dd.error input, .form-table dd.error textarea {
  background-color: #fdf0f0 !important;
}
.form-table dd.error b {
  font-size: min(3.5897435897vw, 14px);
  position: relative;
  display: block;
  margin-top: 0.3em;
  color: var(--form-error-text);
}
@media print, screen and (min-width:769px) {
  .form-table dd.error b {
    font-size: min(1.1666666667vw, 14px);
  }
}

/**
  必須
 */
.required {
  font-style: normal;
  font-size: 0;
  display: inline-block;
}
.required::before {
  position: relative;
  content: "*";
  font-size: 16px;
  display: inline-block;
  margin-left: 0.2em;
  top: 0.2em;
  color: #000;
}
/*--------------------------------
    プライバシーポリシー
--------------------------------*/
/* 本文 */
form #privacypolicy {
  padding: 1.5rem;
  border: solid 1px var(--form-privacy-border-color);
  border-radius: 2rem;
  margin-bottom: 2em;
}
@media print, screen and (min-width:769px) {
  form #privacypolicy {
    padding: 3rem;
  }
}

form #privacypolicy .privacypolicy_cnt {
  height: 20rem;
  line-height: 1.8;
  color: var(--form-privacy-text);
  text-align: justify;
  overflow-y: scroll;
  font-size: 1.2rem;
}
@media print, screen and (min-width:769px) {
  form #privacypolicy .privacypolicy_cnt {
    font-size: 1.6rem;
    padding: 3rem;
  }
}

form #privacypolicy .privacypolicy_cnt h3 {
  margin-top: 2em;
}

form #privacypolicy .privacypolicy_cnt p:not(:first-child) {
  margin-top: 1em;
}

form #privacypolicy .privacypolicy_cnt > ol,
form #privacypolicy .privacypolicy_cnt > ul {
  margin-top: 1em;
}

form #privacypolicy .privacypolicy_cnt > ol > li {
  margin-bottom: 1em;
  counter-increment: privacyNumber;
}

form #privacypolicy .privacypolicy_cnt > ol > li:last-child {
  margin-bottom: 0;
}

form #privacypolicy .privacypolicy_cnt > ol > li span {
  display: block;
  font-weight: bold;
  margin-bottom: 1em;
}

form #privacypolicy .privacypolicy_cnt > ol > li span:before {
  content: counter(privacyNumber) ".";
}

form #privacypolicy .privacypolicy_cnt > ol > li ul {
  list-style-type: disc;
  padding-left: 1.5em;
  margin-top: 1em;
}

form #privacypolicy .privacypolicy_cnt > ol > li ul li {
  margin-bottom: 0.5em;
}

form #privacypolicy .privacypolicy_cnt > ol > li ul li:last-child {
  margin-bottom: 0;
}

form #privacypolicy .privacypolicy_cnt > address:before {
  display: block;
  content: "";
  width: 20%;
  margin-bottom: 1em;
  border-bottom: solid 1px #000;
}

@media only screen and (max-width: 812px) {
  form #privacypolicy .privacypolicy_cnt {
    height: 12em;
    font-size: 1.3rem;
  }
  form #privacypolicy .privacypolicy_cnt h3 {
    font-size: 1.5rem;
  }
}
/* チェックボックス */
.privacypolicy_checkbox {
  text-align: center;
}

.privacypolicy_checkbox a {
  text-decoration: underline;
}

/**
  フォームコントロールボタン
 */
.form-buttons {
  margin-top: min(5.1282051282vw, 20px);
}
@media print, screen and (min-width:769px) {
  .form-buttons {
    max-width: min(83.3333333333vw, 1000px);
    margin-top: min(6.6666666667vw, 80px);
    padding-left: min(20.8333333333vw, 250px);
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    justify-content: center;
  }
}

@media only screen and (max-width: 768px) {
  .form-buttons__item:not(:last-of-type) {
    margin-bottom: min(2.5641025641vw, 10px);
  }
}
@media print, screen and (min-width:769px) {
  .form-buttons__item {
    flex: 1;
    margin-bottom: min(0.8333333333vw, 10px);
  }
}

.form-buttons__item.--back .button-b {
  font-size: min(3.5897435897vw, 14px);
  cursor: pointer;
}
@media print, screen and (min-width:769px) {
  .form-buttons__item.--back {
    width: 50%;
  }
  .form-buttons__item.--back .button-b {
    font-size: min(1.1666666667vw, 14px);
  }
}

main.is-leave {
  transition: 1s;
  transform-origin: 50% 0;
  transform: scale3d(0.9, 0.9, 1);
  transition-timing-function: linear;
}

.transition-cover {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  background-color: #fff;
  z-index: 112;
  pointer-events: none;
  opacity: 0;
}

/* ==========================================================================
   Utilities
   ========================================================================== */
/* ==========================================================================

	#テキストモジュールとユーティリティ

	36　コピー
	27　 H1相当　ページタイトル
	25　 H2相当　コピー・見出しおよびラベル
	24　 H3相当　見出しおよびラベル
	20　コピー・中見出し・ラベル
	18　本文：大・ラベル
	16　本文：中
	14　本文：小を使用しています。
	12　最小（注文など一部のみ）

 */
/* -------------------------------------------------------------------------
	本文指定
*/
/*

.txt-ll,
.txt-l,
.txt-m,
.txt-s,
.txt-ss {

}

.txt-ll {
	font-size: $base-font-size-pc * 1.15;

}
.txt-l {
	font-size: $base-font-size-pc * 1.09;

}
.txt-m {
	font-size: $base-font-size-pc;

}
.txt-s {
	font-size: $base-font-size-pc * 0.9;

}

.txt-ss {
	font-size: $base-font-size-pc * 0.78;

}
@include mq-sp {

	.txt-ll {
		font-size: $base-font-size-sp * 1.15;

	}
	.txt-l {
		font-size: $base-font-size-sp * 1.09;

	}
	.txt-m {
		font-size: $base-font-size-sp;

	}
	.txt-s {
		font-size: $base-font-size-sp * 0.9;

	}

	.txt-ss {
		font-size: $base-font-size-sp * 0.78;

	}

	.txt-ll-sp {
		font-size: $base-font-size-sp * 1.15;

	}
	.txt-l-sp {
		font-size: $base-font-size-sp * 1.09;

	}
	.txt-m-sp {
		font-size: $base-font-size-sp;

	}
	.txt-s-sp {
		font-size: $base-font-size-sp * 0.9;

	}

	.txt-ss-sp {
		font-size: $base-font-size-sp * 0.78;

	}
}

*/
/* -------------------------------------------------------------------------
	ユーティリティmisc
*/
/*一字下げ*/
.indent-head {
  padding-left: 1.2em;
  text-indent: -1.2em;
}

.font-bold {
  font-weight: 700;
}

.font-semi-bold {
  font-weight: 600;
}

.font-normal {
  font-weight: normal;
}

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

   ユーティリティモジュール

 */
/* -------------------------------------------------------------------------
	画像を100%に/100%を解除
	<img class="u-fit" src="xxx.jpg" />
*/
.u-fit {
  width: 100%;
  height: auto;
}

.u-free {
  width: auto;
}

/* -------------------------------------------------------------------------
	SPのみ、PCのみで改行させる
	<br class="u-spbr" />
	<br class="u-pcbr" />
*/
.u-spbr {
  display: none;
}
@media only screen and (max-width: 768px) {
  .u-spbr {
    display: inline;
  }
}

.u-pcbr {
  display: none;
}
@media print, screen and (min-width:769px) {
  .u-pcbr {
    display: inline;
  }
}

.u-tdbr {
  display: none;
}
@media only screen and (max-width: 768px) {
  .u-tdbr {
    display: inline;
  }
}

/* -------------------------------------------------------------------------
	position:relative
*/
.u-relative {
  position: relative;
}

/* -------------------------------------------------------------------------
	インラインテキストリンク
*/
.u-textLink:link, .u-textLink:visited {
  text-decoration: underline;
}
@media print, screen and (min-width:769px) {
  .u-textLink:hover {
    text-decoration: none;
  }
}

.u-textLink.--newwin::after {
  display: inline-block;
  content: "";
  width: 1.7rem;
  height: 1.7rem;
  margin-left: 1rem;
  background: url(../img/ic_newwin.svg) no-repeat center center/contain;
}

/* -------------------------------------------------------------------------
	縦書きテキスト
*/
.u-vertical-text {
  font-feature-settings: "pkna";
  writing-mode: vertical-rl;
  text-orientation: mixed;
  -ms-text-combine-horizontal: all;
}

/* -------------------------------------------------------------------------
	ブロック指定
*/
.u-inlineBlock {
  display: inline-block;
}

@media only screen and (max-width: 768px) {
  .u-sp-inlineBlock {
    display: inline-block;
  }
}

.u-block {
  display: block;
}

/* -------------------------------------------------------------------------
	リスト要素のスタイル
*/
.u-list-indent li {
  padding-left: 1em;
  text-indent: -1em;
}

.u-list-disc li {
  list-style-type: disc;
  margin-bottom: 1em;
  margin-left: 1.2em;
}

.u-list-dot {
  padding: 0;
  padding-inline-start: 0;
}
.u-list-dot li {
  position: relative;
  padding-left: 1em;
}
.u-list-dot li::before {
  position: absolute;
  content: "-";
  left: 0;
  display: block;
}

/* -------------------------------------------------------------------------
	PCレイアウト時に非表示
*/
.u-sp-only {
  display: none !important;
}

.u-pc-only {
  display: block !important;
}

@media only screen and (min-width: 0px) and (max-width: 768px) {
  .u-sp-only {
    display: block !important;
  }
  .u-pc-only {
    display: none !important;
  }
}
.u-noWrap {
  white-space: nowrap;
}

@media print, screen and (min-width:769px) {
  .u-pc-pdng {
    display: inline-block;
    width: 20px;
  }
}

/**
	注意書きテキスト
 */
.u-note-text {
  text-indent: -1em;
  padding-left: 1em;
  font-size: 0.8em;
}

/**
	罫線
 */
.u-hr {
  border-top: 1px solid var(--col_blue);
}

.u-hr-dot {
  border-top: 2px dotted var(--col_blue);
}

/* -------------------------------------------------------------------------
	マージン bottom top
*/
.l-mb0 {
  margin-bottom: min(0vw, 0px);
}

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

@media only screen and (max-width: 768px) {
  .l-mb0-sp {
    margin-bottom: min(0vw, 0px) !important;
  }
  .l-mt0-sp {
    margin-top: min(0vw, 0px) !important;
  }
}
.l-mb5 {
  margin-bottom: min(0.4166666667vw, 5px);
}

.l-mt5 {
  margin-top: min(0.4166666667vw, 5px);
}

@media only screen and (max-width: 768px) {
  .l-mb5-sp {
    margin-bottom: min(1.2820512821vw, 5px) !important;
  }
  .l-mt5-sp {
    margin-top: min(1.2820512821vw, 5px) !important;
  }
}
.l-mb10 {
  margin-bottom: min(0.8333333333vw, 10px);
}

.l-mt10 {
  margin-top: min(0.8333333333vw, 10px);
}

@media only screen and (max-width: 768px) {
  .l-mb10-sp {
    margin-bottom: min(2.5641025641vw, 10px) !important;
  }
  .l-mt10-sp {
    margin-top: min(2.5641025641vw, 10px) !important;
  }
}
.l-mb15 {
  margin-bottom: min(1.25vw, 15px);
}

.l-mt15 {
  margin-top: min(1.25vw, 15px);
}

@media only screen and (max-width: 768px) {
  .l-mb15-sp {
    margin-bottom: min(3.8461538462vw, 15px) !important;
  }
  .l-mt15-sp {
    margin-top: min(3.8461538462vw, 15px) !important;
  }
}
.l-mb20 {
  margin-bottom: min(1.6666666667vw, 20px);
}

.l-mt20 {
  margin-top: min(1.6666666667vw, 20px);
}

@media only screen and (max-width: 768px) {
  .l-mb20-sp {
    margin-bottom: min(5.1282051282vw, 20px) !important;
  }
  .l-mt20-sp {
    margin-top: min(5.1282051282vw, 20px) !important;
  }
}
.l-mb25 {
  margin-bottom: min(2.0833333333vw, 25px);
}

.l-mt25 {
  margin-top: min(2.0833333333vw, 25px);
}

@media only screen and (max-width: 768px) {
  .l-mb25-sp {
    margin-bottom: min(6.4102564103vw, 25px) !important;
  }
  .l-mt25-sp {
    margin-top: min(6.4102564103vw, 25px) !important;
  }
}
.l-mb30 {
  margin-bottom: min(2.5vw, 30px);
}

.l-mt30 {
  margin-top: min(2.5vw, 30px);
}

@media only screen and (max-width: 768px) {
  .l-mb30-sp {
    margin-bottom: min(7.6923076923vw, 30px) !important;
  }
  .l-mt30-sp {
    margin-top: min(7.6923076923vw, 30px) !important;
  }
}
.l-mb35 {
  margin-bottom: min(2.9166666667vw, 35px);
}

.l-mt35 {
  margin-top: min(2.9166666667vw, 35px);
}

@media only screen and (max-width: 768px) {
  .l-mb35-sp {
    margin-bottom: min(8.9743589744vw, 35px) !important;
  }
  .l-mt35-sp {
    margin-top: min(8.9743589744vw, 35px) !important;
  }
}
.l-mb40 {
  margin-bottom: min(3.3333333333vw, 40px);
}

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

@media only screen and (max-width: 768px) {
  .l-mb40-sp {
    margin-bottom: min(10.2564102564vw, 40px) !important;
  }
  .l-mt40-sp {
    margin-top: min(10.2564102564vw, 40px) !important;
  }
}
.l-mb45 {
  margin-bottom: min(3.75vw, 45px);
}

.l-mt45 {
  margin-top: min(3.75vw, 45px);
}

@media only screen and (max-width: 768px) {
  .l-mb45-sp {
    margin-bottom: min(11.5384615385vw, 45px) !important;
  }
  .l-mt45-sp {
    margin-top: min(11.5384615385vw, 45px) !important;
  }
}
.l-mb50 {
  margin-bottom: min(4.1666666667vw, 50px);
}

.l-mt50 {
  margin-top: min(4.1666666667vw, 50px);
}

@media only screen and (max-width: 768px) {
  .l-mb50-sp {
    margin-bottom: min(12.8205128205vw, 50px) !important;
  }
  .l-mt50-sp {
    margin-top: min(12.8205128205vw, 50px) !important;
  }
}
.l-mb55 {
  margin-bottom: min(4.5833333333vw, 55px);
}

.l-mt55 {
  margin-top: min(4.5833333333vw, 55px);
}

@media only screen and (max-width: 768px) {
  .l-mb55-sp {
    margin-bottom: min(14.1025641026vw, 55px) !important;
  }
  .l-mt55-sp {
    margin-top: min(14.1025641026vw, 55px) !important;
  }
}
.l-mb60 {
  margin-bottom: min(5vw, 60px);
}

.l-mt60 {
  margin-top: min(5vw, 60px);
}

@media only screen and (max-width: 768px) {
  .l-mb60-sp {
    margin-bottom: min(15.3846153846vw, 60px) !important;
  }
  .l-mt60-sp {
    margin-top: min(15.3846153846vw, 60px) !important;
  }
}
.l-mb65 {
  margin-bottom: min(5.4166666667vw, 65px);
}

.l-mt65 {
  margin-top: min(5.4166666667vw, 65px);
}

@media only screen and (max-width: 768px) {
  .l-mb65-sp {
    margin-bottom: min(16.6666666667vw, 65px) !important;
  }
  .l-mt65-sp {
    margin-top: min(16.6666666667vw, 65px) !important;
  }
}
.l-mb70 {
  margin-bottom: min(5.8333333333vw, 70px);
}

.l-mt70 {
  margin-top: min(5.8333333333vw, 70px);
}

@media only screen and (max-width: 768px) {
  .l-mb70-sp {
    margin-bottom: min(17.9487179487vw, 70px) !important;
  }
  .l-mt70-sp {
    margin-top: min(17.9487179487vw, 70px) !important;
  }
}
.l-mb75 {
  margin-bottom: min(6.25vw, 75px);
}

.l-mt75 {
  margin-top: min(6.25vw, 75px);
}

@media only screen and (max-width: 768px) {
  .l-mb75-sp {
    margin-bottom: min(19.2307692308vw, 75px) !important;
  }
  .l-mt75-sp {
    margin-top: min(19.2307692308vw, 75px) !important;
  }
}
.l-mb80 {
  margin-bottom: min(6.6666666667vw, 80px);
}

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

@media only screen and (max-width: 768px) {
  .l-mb80-sp {
    margin-bottom: min(20.5128205128vw, 80px) !important;
  }
  .l-mt80-sp {
    margin-top: min(20.5128205128vw, 80px) !important;
  }
}
.l-mb85 {
  margin-bottom: min(7.0833333333vw, 85px);
}

.l-mt85 {
  margin-top: min(7.0833333333vw, 85px);
}

@media only screen and (max-width: 768px) {
  .l-mb85-sp {
    margin-bottom: min(21.7948717949vw, 85px) !important;
  }
  .l-mt85-sp {
    margin-top: min(21.7948717949vw, 85px) !important;
  }
}
.l-mb90 {
  margin-bottom: min(7.5vw, 90px);
}

.l-mt90 {
  margin-top: min(7.5vw, 90px);
}

@media only screen and (max-width: 768px) {
  .l-mb90-sp {
    margin-bottom: min(23.0769230769vw, 90px) !important;
  }
  .l-mt90-sp {
    margin-top: min(23.0769230769vw, 90px) !important;
  }
}
.l-mb95 {
  margin-bottom: min(7.9166666667vw, 95px);
}

.l-mt95 {
  margin-top: min(7.9166666667vw, 95px);
}

@media only screen and (max-width: 768px) {
  .l-mb95-sp {
    margin-bottom: min(24.358974359vw, 95px) !important;
  }
  .l-mt95-sp {
    margin-top: min(24.358974359vw, 95px) !important;
  }
}
.l-mb100 {
  margin-bottom: min(8.3333333333vw, 100px);
}

.l-mt100 {
  margin-top: min(8.3333333333vw, 100px);
}

@media only screen and (max-width: 768px) {
  .l-mb100-sp {
    margin-bottom: min(25.641025641vw, 100px) !important;
  }
  .l-mt100-sp {
    margin-top: min(25.641025641vw, 100px) !important;
  }
}
.l-mb105 {
  margin-bottom: min(8.75vw, 105px);
}

.l-mt105 {
  margin-top: min(8.75vw, 105px);
}

@media only screen and (max-width: 768px) {
  .l-mb105-sp {
    margin-bottom: min(26.9230769231vw, 105px) !important;
  }
  .l-mt105-sp {
    margin-top: min(26.9230769231vw, 105px) !important;
  }
}
.l-mb110 {
  margin-bottom: min(9.1666666667vw, 110px);
}

.l-mt110 {
  margin-top: min(9.1666666667vw, 110px);
}

@media only screen and (max-width: 768px) {
  .l-mb110-sp {
    margin-bottom: min(28.2051282051vw, 110px) !important;
  }
  .l-mt110-sp {
    margin-top: min(28.2051282051vw, 110px) !important;
  }
}
.l-mb115 {
  margin-bottom: min(9.5833333333vw, 115px);
}

.l-mt115 {
  margin-top: min(9.5833333333vw, 115px);
}

@media only screen and (max-width: 768px) {
  .l-mb115-sp {
    margin-bottom: min(29.4871794872vw, 115px) !important;
  }
  .l-mt115-sp {
    margin-top: min(29.4871794872vw, 115px) !important;
  }
}
.l-mb120 {
  margin-bottom: min(10vw, 120px);
}

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

@media only screen and (max-width: 768px) {
  .l-mb120-sp {
    margin-bottom: min(30.7692307692vw, 120px) !important;
  }
  .l-mt120-sp {
    margin-top: min(30.7692307692vw, 120px) !important;
  }
}
.l-mb125 {
  margin-bottom: min(10.4166666667vw, 125px);
}

.l-mt125 {
  margin-top: min(10.4166666667vw, 125px);
}

@media only screen and (max-width: 768px) {
  .l-mb125-sp {
    margin-bottom: min(32.0512820513vw, 125px) !important;
  }
  .l-mt125-sp {
    margin-top: min(32.0512820513vw, 125px) !important;
  }
}
.l-mb130 {
  margin-bottom: min(10.8333333333vw, 130px);
}

.l-mt130 {
  margin-top: min(10.8333333333vw, 130px);
}

@media only screen and (max-width: 768px) {
  .l-mb130-sp {
    margin-bottom: min(33.3333333333vw, 130px) !important;
  }
  .l-mt130-sp {
    margin-top: min(33.3333333333vw, 130px) !important;
  }
}
.l-mb135 {
  margin-bottom: min(11.25vw, 135px);
}

.l-mt135 {
  margin-top: min(11.25vw, 135px);
}

@media only screen and (max-width: 768px) {
  .l-mb135-sp {
    margin-bottom: min(34.6153846154vw, 135px) !important;
  }
  .l-mt135-sp {
    margin-top: min(34.6153846154vw, 135px) !important;
  }
}
.l-mb140 {
  margin-bottom: min(11.6666666667vw, 140px);
}

.l-mt140 {
  margin-top: min(11.6666666667vw, 140px);
}

@media only screen and (max-width: 768px) {
  .l-mb140-sp {
    margin-bottom: min(35.8974358974vw, 140px) !important;
  }
  .l-mt140-sp {
    margin-top: min(35.8974358974vw, 140px) !important;
  }
}
.l-mb145 {
  margin-bottom: min(12.0833333333vw, 145px);
}

.l-mt145 {
  margin-top: min(12.0833333333vw, 145px);
}

@media only screen and (max-width: 768px) {
  .l-mb145-sp {
    margin-bottom: min(37.1794871795vw, 145px) !important;
  }
  .l-mt145-sp {
    margin-top: min(37.1794871795vw, 145px) !important;
  }
}
.l-mb150 {
  margin-bottom: min(12.5vw, 150px);
}

.l-mt150 {
  margin-top: min(12.5vw, 150px);
}

@media only screen and (max-width: 768px) {
  .l-mb150-sp {
    margin-bottom: min(38.4615384615vw, 150px) !important;
  }
  .l-mt150-sp {
    margin-top: min(38.4615384615vw, 150px) !important;
  }
}
.l-mb155 {
  margin-bottom: min(12.9166666667vw, 155px);
}

.l-mt155 {
  margin-top: min(12.9166666667vw, 155px);
}

@media only screen and (max-width: 768px) {
  .l-mb155-sp {
    margin-bottom: min(39.7435897436vw, 155px) !important;
  }
  .l-mt155-sp {
    margin-top: min(39.7435897436vw, 155px) !important;
  }
}
.l-mb160 {
  margin-bottom: min(13.3333333333vw, 160px);
}

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

@media only screen and (max-width: 768px) {
  .l-mb160-sp {
    margin-bottom: min(41.0256410256vw, 160px) !important;
  }
  .l-mt160-sp {
    margin-top: min(41.0256410256vw, 160px) !important;
  }
}
.l-mb165 {
  margin-bottom: min(13.75vw, 165px);
}

.l-mt165 {
  margin-top: min(13.75vw, 165px);
}

@media only screen and (max-width: 768px) {
  .l-mb165-sp {
    margin-bottom: min(42.3076923077vw, 165px) !important;
  }
  .l-mt165-sp {
    margin-top: min(42.3076923077vw, 165px) !important;
  }
}
.l-mb170 {
  margin-bottom: min(14.1666666667vw, 170px);
}

.l-mt170 {
  margin-top: min(14.1666666667vw, 170px);
}

@media only screen and (max-width: 768px) {
  .l-mb170-sp {
    margin-bottom: min(43.5897435897vw, 170px) !important;
  }
  .l-mt170-sp {
    margin-top: min(43.5897435897vw, 170px) !important;
  }
}
.l-mb175 {
  margin-bottom: min(14.5833333333vw, 175px);
}

.l-mt175 {
  margin-top: min(14.5833333333vw, 175px);
}

@media only screen and (max-width: 768px) {
  .l-mb175-sp {
    margin-bottom: min(44.8717948718vw, 175px) !important;
  }
  .l-mt175-sp {
    margin-top: min(44.8717948718vw, 175px) !important;
  }
}
.l-mb180 {
  margin-bottom: min(15vw, 180px);
}

.l-mt180 {
  margin-top: min(15vw, 180px);
}

@media only screen and (max-width: 768px) {
  .l-mb180-sp {
    margin-bottom: min(46.1538461538vw, 180px) !important;
  }
  .l-mt180-sp {
    margin-top: min(46.1538461538vw, 180px) !important;
  }
}
.l-mb185 {
  margin-bottom: min(15.4166666667vw, 185px);
}

.l-mt185 {
  margin-top: min(15.4166666667vw, 185px);
}

@media only screen and (max-width: 768px) {
  .l-mb185-sp {
    margin-bottom: min(47.4358974359vw, 185px) !important;
  }
  .l-mt185-sp {
    margin-top: min(47.4358974359vw, 185px) !important;
  }
}
.l-mb190 {
  margin-bottom: min(15.8333333333vw, 190px);
}

.l-mt190 {
  margin-top: min(15.8333333333vw, 190px);
}

@media only screen and (max-width: 768px) {
  .l-mb190-sp {
    margin-bottom: min(48.7179487179vw, 190px) !important;
  }
  .l-mt190-sp {
    margin-top: min(48.7179487179vw, 190px) !important;
  }
}
.l-mb195 {
  margin-bottom: min(16.25vw, 195px);
}

.l-mt195 {
  margin-top: min(16.25vw, 195px);
}

@media only screen and (max-width: 768px) {
  .l-mb195-sp {
    margin-bottom: min(50vw, 195px) !important;
  }
  .l-mt195-sp {
    margin-top: min(50vw, 195px) !important;
  }
}
.l-mb200 {
  margin-bottom: min(16.6666666667vw, 200px);
}

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

@media only screen and (max-width: 768px) {
  .l-mb200-sp {
    margin-bottom: min(51.2820512821vw, 200px) !important;
  }
  .l-mt200-sp {
    margin-top: min(51.2820512821vw, 200px) !important;
  }
}
.l-mb205 {
  margin-bottom: min(17.0833333333vw, 205px);
}

.l-mt205 {
  margin-top: min(17.0833333333vw, 205px);
}

@media only screen and (max-width: 768px) {
  .l-mb205-sp {
    margin-bottom: min(52.5641025641vw, 205px) !important;
  }
  .l-mt205-sp {
    margin-top: min(52.5641025641vw, 205px) !important;
  }
}
.l-mb210 {
  margin-bottom: min(17.5vw, 210px);
}

.l-mt210 {
  margin-top: min(17.5vw, 210px);
}

@media only screen and (max-width: 768px) {
  .l-mb210-sp {
    margin-bottom: min(53.8461538462vw, 210px) !important;
  }
  .l-mt210-sp {
    margin-top: min(53.8461538462vw, 210px) !important;
  }
}
.l-mb215 {
  margin-bottom: min(17.9166666667vw, 215px);
}

.l-mt215 {
  margin-top: min(17.9166666667vw, 215px);
}

@media only screen and (max-width: 768px) {
  .l-mb215-sp {
    margin-bottom: min(55.1282051282vw, 215px) !important;
  }
  .l-mt215-sp {
    margin-top: min(55.1282051282vw, 215px) !important;
  }
}
.l-mb220 {
  margin-bottom: min(18.3333333333vw, 220px);
}

.l-mt220 {
  margin-top: min(18.3333333333vw, 220px);
}

@media only screen and (max-width: 768px) {
  .l-mb220-sp {
    margin-bottom: min(56.4102564103vw, 220px) !important;
  }
  .l-mt220-sp {
    margin-top: min(56.4102564103vw, 220px) !important;
  }
}
.l-mb225 {
  margin-bottom: min(18.75vw, 225px);
}

.l-mt225 {
  margin-top: min(18.75vw, 225px);
}

@media only screen and (max-width: 768px) {
  .l-mb225-sp {
    margin-bottom: min(57.6923076923vw, 225px) !important;
  }
  .l-mt225-sp {
    margin-top: min(57.6923076923vw, 225px) !important;
  }
}
.l-mb230 {
  margin-bottom: min(19.1666666667vw, 230px);
}

.l-mt230 {
  margin-top: min(19.1666666667vw, 230px);
}

@media only screen and (max-width: 768px) {
  .l-mb230-sp {
    margin-bottom: min(58.9743589744vw, 230px) !important;
  }
  .l-mt230-sp {
    margin-top: min(58.9743589744vw, 230px) !important;
  }
}
.l-mb235 {
  margin-bottom: min(19.5833333333vw, 235px);
}

.l-mt235 {
  margin-top: min(19.5833333333vw, 235px);
}

@media only screen and (max-width: 768px) {
  .l-mb235-sp {
    margin-bottom: min(60.2564102564vw, 235px) !important;
  }
  .l-mt235-sp {
    margin-top: min(60.2564102564vw, 235px) !important;
  }
}
.l-mb240 {
  margin-bottom: min(20vw, 240px);
}

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

@media only screen and (max-width: 768px) {
  .l-mb240-sp {
    margin-bottom: min(61.5384615385vw, 240px) !important;
  }
  .l-mt240-sp {
    margin-top: min(61.5384615385vw, 240px) !important;
  }
}
.l-mb245 {
  margin-bottom: min(20.4166666667vw, 245px);
}

.l-mt245 {
  margin-top: min(20.4166666667vw, 245px);
}

@media only screen and (max-width: 768px) {
  .l-mb245-sp {
    margin-bottom: min(62.8205128205vw, 245px) !important;
  }
  .l-mt245-sp {
    margin-top: min(62.8205128205vw, 245px) !important;
  }
}
.l-mb250 {
  margin-bottom: min(20.8333333333vw, 250px);
}

.l-mt250 {
  margin-top: min(20.8333333333vw, 250px);
}

@media only screen and (max-width: 768px) {
  .l-mb250-sp {
    margin-bottom: min(64.1025641026vw, 250px) !important;
  }
  .l-mt250-sp {
    margin-top: min(64.1025641026vw, 250px) !important;
  }
}
.l-mb255 {
  margin-bottom: min(21.25vw, 255px);
}

.l-mt255 {
  margin-top: min(21.25vw, 255px);
}

@media only screen and (max-width: 768px) {
  .l-mb255-sp {
    margin-bottom: min(65.3846153846vw, 255px) !important;
  }
  .l-mt255-sp {
    margin-top: min(65.3846153846vw, 255px) !important;
  }
}
.l-mb260 {
  margin-bottom: min(21.6666666667vw, 260px);
}

.l-mt260 {
  margin-top: min(21.6666666667vw, 260px);
}

@media only screen and (max-width: 768px) {
  .l-mb260-sp {
    margin-bottom: min(66.6666666667vw, 260px) !important;
  }
  .l-mt260-sp {
    margin-top: min(66.6666666667vw, 260px) !important;
  }
}
.l-mb265 {
  margin-bottom: min(22.0833333333vw, 265px);
}

.l-mt265 {
  margin-top: min(22.0833333333vw, 265px);
}

@media only screen and (max-width: 768px) {
  .l-mb265-sp {
    margin-bottom: min(67.9487179487vw, 265px) !important;
  }
  .l-mt265-sp {
    margin-top: min(67.9487179487vw, 265px) !important;
  }
}
.l-mb270 {
  margin-bottom: min(22.5vw, 270px);
}

.l-mt270 {
  margin-top: min(22.5vw, 270px);
}

@media only screen and (max-width: 768px) {
  .l-mb270-sp {
    margin-bottom: min(69.2307692308vw, 270px) !important;
  }
  .l-mt270-sp {
    margin-top: min(69.2307692308vw, 270px) !important;
  }
}
.l-mb275 {
  margin-bottom: min(22.9166666667vw, 275px);
}

.l-mt275 {
  margin-top: min(22.9166666667vw, 275px);
}

@media only screen and (max-width: 768px) {
  .l-mb275-sp {
    margin-bottom: min(70.5128205128vw, 275px) !important;
  }
  .l-mt275-sp {
    margin-top: min(70.5128205128vw, 275px) !important;
  }
}
.l-mb280 {
  margin-bottom: min(23.3333333333vw, 280px);
}

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

@media only screen and (max-width: 768px) {
  .l-mb280-sp {
    margin-bottom: min(71.7948717949vw, 280px) !important;
  }
  .l-mt280-sp {
    margin-top: min(71.7948717949vw, 280px) !important;
  }
}
.l-mb285 {
  margin-bottom: min(23.75vw, 285px);
}

.l-mt285 {
  margin-top: min(23.75vw, 285px);
}

@media only screen and (max-width: 768px) {
  .l-mb285-sp {
    margin-bottom: min(73.0769230769vw, 285px) !important;
  }
  .l-mt285-sp {
    margin-top: min(73.0769230769vw, 285px) !important;
  }
}
.l-mb290 {
  margin-bottom: min(24.1666666667vw, 290px);
}

.l-mt290 {
  margin-top: min(24.1666666667vw, 290px);
}

@media only screen and (max-width: 768px) {
  .l-mb290-sp {
    margin-bottom: min(74.358974359vw, 290px) !important;
  }
  .l-mt290-sp {
    margin-top: min(74.358974359vw, 290px) !important;
  }
}
.l-mb295 {
  margin-bottom: min(24.5833333333vw, 295px);
}

.l-mt295 {
  margin-top: min(24.5833333333vw, 295px);
}

@media only screen and (max-width: 768px) {
  .l-mb295-sp {
    margin-bottom: min(75.641025641vw, 295px) !important;
  }
  .l-mt295-sp {
    margin-top: min(75.641025641vw, 295px) !important;
  }
}
.l-mb300 {
  margin-bottom: min(25vw, 300px);
}

.l-mt300 {
  margin-top: min(25vw, 300px);
}

@media only screen and (max-width: 768px) {
  .l-mb300-sp {
    margin-bottom: min(76.9230769231vw, 300px) !important;
  }
  .l-mt300-sp {
    margin-top: min(76.9230769231vw, 300px) !important;
  }
}
/* -------------------------------------------------------------------------
	テキスト揃え
*/
.l-alignL {
  text-align: left;
}

.l-alignR {
  text-align: right;
}

.l-alignC {
  text-align: center;
}

.l-block-alignC {
  margin-left: auto;
  margin-right: auto;
}

.l-valign-m {
  display: flex;
  align-items: center;
}

@media only screen and (max-width: 768px) {
  .l-sp-alignL {
    text-align: left;
  }
  .l-sp-alignR {
    text-align: right;
  }
  .l-sp-alignC {
    text-align: center;
  }
}
/* ==========================================================================
   animation
   ========================================================================== */
.ef-io,
.ef-io-in,
.ef-intro {
  pointer-events: none;
}

.tr-fade-up {
  transition: transform 1s, opacity 1s;
}
.tr-fade-up.ef-io, .tr-fade-up.ef-io-in {
  opacity: 0;
  transform: translate3d(0, 30px, 0);
}
@media print, screen and (min-width:769px) {
  .tr-fade-up.ef-io, .tr-fade-up.ef-io-in {
    transform: translate3d(0, 60px, 0);
  }
}

.tr-picture-in {
  overflow: hidden;
  transition: 2s;
}
.tr-picture-in img {
  display: block;
  transition: 2s;
  transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
  opacity: 1;
  transition-timing-function: ease-out;
}
.tr-picture-in.ef-io img, .tr-picture-in.ef-io-in img {
  transform: scale3d(1.1, 1.1, 1);
  opacity: 0;
}

.tr-fade-right {
  transition: transform 1s, opacity 1s;
}
.tr-fade-right.ef-io, .tr-fade-right.ef-io-in {
  opacity: 0;
  transform: translate3d(-30px, 0, 0);
}
@media print, screen and (min-width:769px) {
  .tr-fade-right.ef-io, .tr-fade-right.ef-io-in {
    transform: translate3d(-60px, 0, 0);
  }
}

.tr-fade-in {
  transition: transform 1s, opacity 1s;
}
.tr-fade-in.ef-io, .tr-fade-in.ef-io-in {
  opacity: 0;
}
.tr-mask-lr {
  transition: mask-position 0.7s;
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
  mask-image: linear-gradient(90deg, transparent 50%, red 50%);
  mask-size: 200% 100%;
  mask-position: -100% 0;
}
@media only screen and (max-width: 768px) {
  .tr-mask-lr {
    transition: mask-position 0.49s;
  }
}
.tr-mask-lr.ef-io, .tr-mask-lr.ef-io-inner {
  mask-position: 0 0;
}