@charset "UTF-8";

/* Font[Beirut]の読み込み */
@font-face {
	font-family: 'Beirut';
	src:
		url('/renewal/assets/fonts/Beirut.woff2') format('woff2'),
		url('/renewal/assets/fonts/Beirut.woff') format('woff');
}
/* @font-face {
  font-family: 'Beirut';
  src: url('../fonts/Beirut-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
} */

/* --------------------------------------------------------
CSSカスタムプロパティ
   -------------------------------------------------------- */

:root {
	font-size: 100%;
	/* モバイルカンプ 375px で 10px になるように設定 */
	/* 0.625rem を 375px でスケーリング => 0.625 * (100 / 375) = 0.1666vw */
	/* --layout-unit: 0.1666vw; */
	/* 安全策として、極端に小さなスマホで縮小しすぎないよう最小値を設定 */
	--layout-unit: 2.6667vw; /* 10px / 375px * 100 = 2.6667vw */
	--layout-unit: max(2.6667vw, 0.5rem);
	/* 余白変数 */
	--space-sm: calc(0.8 * var(--layout-unit));

	/* color */
	--color-base: #111;
	--color-white: #fff;
	--color-red: #da0010;
	--color-olive: #baa254;
	--color-pink: #cd5692;
	--color-pink-hover: #c94587;
	--color-purple: #933e9d;
	--color-purple-hover: #90329a;
	--color-deep-blue: #1c3a60;
	--color-gray-blue: #7b7f8e;
	--grad: linear-gradient(to right, #cd5792 0%, #933e9d 54.19%, #713bcc 100%);
	--grad-hover: linear-gradient(to right, #713bcc 0%, #933e9d 54.19%, #cd5792 100%);
	--grad-btm-right: linear-gradient(to bottom right, #cd5792 0%, #933e9d 54.19%, #713bcc 100%);
	--grad-top-left: linear-gradient(to top left, #713bcc 0%, #933e9d 54.19%, #cd5792 100%);
	/* border-radius */
	--radius-full: 999px;
	/* font */
	--font-Beirut: 'Beirut', sans-serif;
	--font-Arial: 'Arial', sans-serif;
	/* icon */
	--icon-mail: url('../images/common/ico_mail.svg');
	--icon-tel: url('../images/common/ico_tel.svg');
	--icon-play: url('../images/common/ico_play.svg');
	--icon-insta: url('../images/common/ico_insta.svg');
	--icon-youtube: url('../images/common/ico_youtube.svg');
	--icon-youtube-min: url('../images/common/ico_youtube_min.svg');
	--icon-arrow_left: url('../images/common/ico_arrow_left.svg');
	--icon-arrow_circle: url('../images/common/ico_arrow_circle.svg');
	--icon-arrow_circle-white: url('../images/common/ico_arrow_circle-white.svg');
	--icon-link_arrow: url('../images/common/icon_link_arrow.svg');
	--icon-link_arrow-hover: url('../images/common/icon_link_arrow-black.svg');
	--icon-link_pdf: url('../images/common/ico_link_pdf.svg');
	--icon-link_pdf-hover: url('../images/common/ico_link_pdf-black.svg');
}

/* --------------------------------------------------------
2. レイアウトスケーリングの定義 (PC/タブレット)
   -------------------------------------------------------- */
@media screen and (min-width: 961px) {
	:root {
		/* 1rem は 16px 基準であるため、10px は 0.625rem (10/16) */
		/* 安全策として、極端に大きなモニターで巨大化しすぎないよう最大値を設定 */
		/* min()関数で、動的なvw値と固定のrem値（12px相当）を比較し、小さい方を採用 */
		--layout-unit: 0.5208vw; /* 10px / 1920px * 100 = 0.5208vw */
		--layout-unit: min(0.5208vw, 0.75rem);
		/* 余白変数 */
		--space-sm: calc(0.8 * var(--layout-unit));
	}
}

* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
html {
	/*scroll-behavior: smooth;*/
}
body {
	background-color: var(--color-white);
	color: #111;
	font-size: clamp(14px, calc(10.153846153846153px + 1.0256410256410255vw), 20px);
	line-height: 1.6;
	font-family: 'Noto Sans JP', sans-serif, '游ゴシック体', 'YuGothic', '游ゴシック', 'Yu Gothic',
		'游明朝', 'YuMincho', 'Hiragino Mincho ProN W3', 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN',
		'HG明朝E', 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', serif, 'ヒラギノ角ゴ ProN W3',
		'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ',
		'Meiryo', 'ＭＳ Ｐゴシック', Helvetica, Arial;
}
#lf_wrapper{
  overflow: hidden;
}
a {
	text-decoration: none;
}
img {
	max-width: 100%;
	height: auto;
}
a.underlink {
	text-decoration: underline;
	transition: 0.2s all;
}
a.underlink:hover {
	text-decoration: none;
}
.f-Beirut {
	font-family: 'Beirut', sans-serif;
}
.f-Arial {
	font-family: var(--font-Arial);
}
.hide{
	display: none !important;
}
@media screen and (max-width: 960px) {
	.pcVer {
		display: none !important;
	}
}
@media screen and (min-width: 961px) {
	body {
		font-size: clamp(12px, calc(7.991657977059437px + 0.4171011470281543vw), 16px);
	}
	.spVer {
		display: none !important;
	}
}

/* heading */
.heading-lv2 {
	font-size: clamp(30px, calc(21.025641025641026px + 2.3931623931623935vw), 44px);
	font-weight: 700;
}
@media screen and (min-width: 961px) {
	.heading-lv2 {
		font-size: clamp(24px, calc(10px + 1.4583333333333333vw), 38px);
	}
}

.link_txt a,
a.link_txt{
  color: #0074ED;
  font-weight: bold;
  text-decoration: underline;
}
.link_txt a:hover,
a.link_txt:hover{
  text-decoration: none;
}
.txt_pink{color: var(--color-pink) !important;}
.txt_purple{color: var(--color-purple) !important;}
.txt_underline{
  text-decoration: none;
  background: linear-gradient(rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0) 69%,#FFFF00 70%,#FFFF00 90%);
}
/* --------------------------------------------------------
btn
   -------------------------------------------------------- */
.btn_wrap {
	text-align: center;
	margin-top: 30px;
}
.btn_inline{
  text-align: left;
	margin: 10px 0;
}
.btn {
	display: flex;
	align-items: center;
	gap: 26px;
	width: fit-content;
	height: fit-content;
	margin-inline: auto;
	padding: 15px 20px 15px 35px;
	background-color: var(--color-base);
	border: 1px solid var(--color-base);
	color: var(--color-white);
	font-size: clamp(15px, calc(10.512820512820513px + 1.1965811965811968vw), 22px);
	font-weight: 700;
	border-radius: var(--radius-full);
	transition: all 0.2s;
}
.btn_inline .btn{
  margin-left: 0;
	padding: 15px 20px 15px 20px;
}
@media screen and (min-width: 961px) {
	.btn {
		font-size: clamp(15px, calc(11.993743482794578px + 0.31282586027111575vw), 18px);
    padding: 15px 20px 15px 45px;
	}
}
.btn:hover {
	background: var(--color-white);
	color: var(--color-base);
}
.btn.-arrow::after {
	background: var(--icon-link_arrow) center/cover no-repeat;
	content: '';
	display: inline-block;
	width: 35px;
	min-width: 35px;
	height: 35px;
}
.btn.-arrow:hover::after {
	background: var(--icon-link_arrow-hover) center/cover no-repeat;
}
.btn.-pdf::after {
	background: var(--icon-link_pdf) center/cover no-repeat;
	content: '';
	display: inline-block;
	width: 16px;
	min-width: 16px;
	height: 21px;
}
.btn.-pdf:hover::after {
	background: var(--icon-link_pdf-hover) center/cover no-repeat;
}
.btn.-youtube{
  background:#E2E8F0;
  color: #000 !important;
  border: none;
	gap: 16px;
}
.btn.-youtube::before{
	content: '';
	display: inline-block;
  background: url("../images/common/logo_youtube.svg") center/cover no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  height: 1.2em;
  width: 5em;
  margin-left: -1em;
}
.btn.-youtube::after {
	background: var(--icon-link_arrow-hover) center/cover no-repeat;
	content: '';
	display: inline-block;
	width: 35px;
	min-width: 35px;
	height: 35px;
}
.btn.-youtube:hover::after {
	background: var(--icon-link_arrow) center center #000 no-repeat;
  -moz-background-size: calc(100% + 6px) auto;
  background-size: calc(100% + 6px) auto;
  border: solid 3px #000;
  border-radius: 9999px;
}
.btn.-youtube span{
  display: inline-block;
  position: relative;
}
.btn.-youtube span::after{
  content: "";
  width: 0;
  height: 1px;
  background-color: #000;
  position: absolute;
  left: 0;
  bottom: -3px;
}
.btn.-youtube:hover span::after {
  width: 100%;
  transition: width 0.3s ease;
}
@media screen and (min-width: 961px) {
  .btn.-youtube::before{
    height: 1.5em;
    width: 7em;
  }
}

/* btn contact */
a.btn_contact {
	background-image: var(--grad) !important;
	border: none;
	position: relative;
	z-index: 1;
	overflow: hidden;
	color: var(--color-white) !important;
	font-size: calc(1.7 * var(--layout-unit)) !important;
	font-weight: 700;
	text-align: center;
	text-decoration: none !important;
	padding: calc(2 * var(--layout-unit)) !important;
	width: 100% !important;
	transition: background-position 0.3s ease-out !important;
}
a.btn_contact > span {
	position: relative;
	z-index: 3;
	display: flex !important;
	justify-content: center;
	align-items: baseline;
}
a.btn_contact .ico_mail {
	display: inline-block;
	background: var(--icon-mail) center no-repeat;
	background-size: contain;
	margin-right: calc(1 * var(--layout-unit));
	width: calc(1.8 * var(--layout-unit));
	height: calc(1.4 * var(--layout-unit));
}
a.btn_contact::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: var(--grad-hover);
	z-index: 2;
	opacity: 0;
	border-radius: inherit;
	transition: opacity 0.4s ease-in-out;
}
a.btn_contact::after {
	content: none !important;
}
/* hover */
a.btn_contact:hover::before {
	opacity: 1;
}
@media screen and (min-width: 961px) {
	a.btn_contact {
		font-size: clamp(12px, calc(7.991657977059437px + 0.4171011470281543vw), 16px) !important;
		padding: calc(1.4 * var(--layout-unit)) calc(2.6 * var(--layout-unit)) !important;
		width: auto;
	}
}

/* --------------------------------------------------------
menu
   -------------------------------------------------------- */
.menu_snsInner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: calc(1.2 * var(--layout-unit));
	margin-top: calc(3 * var(--layout-unit));
	line-height: 1;
}
.menu_snsInner a img {
	width: calc(4.4 * var(--layout-unit));
}
.header_gnav li > a,
.footer_nav li > a {
	display: block;
	/* padding: 2.67vw 10.67vw; */
	padding: calc(1 * var(--layout-unit)) calc(4 * var(--layout-unit));
	color: var(--color-base);
	font-size: clamp(18px, calc(12.871794871794872px + 1.3675213675213675vw), 26px);
	font-weight: 700;
}
.header_gnav li .nav_sub a,
.footer_nav li .nav_sub a {
	color: var(--color-deep-blue);
	font-size: clamp(14px, calc(10.153846153846153px + 1.0256410256410255vw), 20px);
	font-weight: 500;
	padding: 8px 0;
}

@media screen and (max-width: 960px) {
	.header_gnav li > a,
	.footer_nav li > a {
		/* padding: 2.67vw 10.67vw; */
		padding: calc(1 * var(--layout-unit)) calc(4 * var(--layout-unit));
	}

	/* accordion */
	.header_gnav > ul > li,
	.footer_nav > ul > li {
		position: relative;
	}
	.header_gnav .accordion-icon,
	.footer_nav .accordion-icon {
		position: absolute;
		top: calc(1.5 * var(--layout-unit));
		right: calc(2 * var(--layout-unit));
		height: clamp(18px, calc(14.153846153846153px + 1.0256410256410255vw), 24px);
		width: clamp(18px, calc(14.153846153846153px + 1.0256410256410255vw), 24px);
		cursor: pointer;
	}
	.header_gnav .accordion-icon::before,
	.header_gnav .accordion-icon::after,
	.footer_nav .accordion-icon::before,
	.footer_nav .accordion-icon::after {
		content: '';
		position: absolute;
		top: 50%;
		left: 50%;
		background-color: var(--color-base);
		transition: transform 0.3s;
	}
	.header_gnav .accordion-icon::before,
	.footer_nav .accordion-icon::before {
		width: calc(0.1 * var(--layout-unit));
		height: calc(1.5 * var(--layout-unit));
		transform: translate(-50%, -50%);
	}
	.header_gnav .accordion-icon::after,
	.footer_nav .accordion-icon::after {
		width: calc(1.5 * var(--layout-unit));
		height: calc(0.1 * var(--layout-unit));
		transform: translate(-50%, -50%);
	}

	/* open */
	.header_gnav > ul > li.is-active .accordion-icon,
	.footer_nav > ul > li.is-active .accordion-icon {
		/* top: calc(1.5 * var(--layout-unit)); */
	}
	.header_gnav > ul > li.is-active .accordion-icon::before,
	.footer_nav > ul > li.is-active .accordion-icon::before {
		transform: translate(-50%, -50%) rotate(90deg);
	}
	.header_gnav .accordion-wrap,
	.footer_nav .accordion-wrap {
		height: 0;
		overflow: hidden;
		transition: height 0.4s ease-in-out;
		/* display: flex; */
		padding: 0 calc(4 * var(--layout-unit)) calc(0.5 * var(--layout-unit));
	}
	.header_gnav > ul > li.is-active .accordion-wrap,
	.footer_nav > ul > li.is-active .accordion-wrap {
		/* JSで開いたときに height: auto; を設定 */
	}
	.nav_sub {
		flex: 1; /* 均等幅 */
		/* padding: 10px 0; */
	}
	.nav_contact {
		margin-top: calc(3 * var(--layout-unit));
		padding: 0 calc(4 * var(--layout-unit));
	}
}

/* folding-body
----------------------- */
.folding-body{
  padding: 90px;
  @media (width <= 960px) {
    padding: 30px 0;
  }
  .folding_body_inner{
    width: calc(160 * var(--layout-unit));
    margin: 0 auto;
    @media (width <= 960px) {
      width: calc(358 / 375 * 100vw);
    }
  }
  .folding-wrap{
    background-color: var(--color-white);
    border-radius: 30px;
    overflow: hidden;
    &:not(:first-of-type){
      margin-top: 30px;
    }
    @media (width <= 960px) {
      border-radius: 10px;
      &:not(:first-of-type){
        margin-top: 40px;
      }
    }
    .folding_body_headline{
      a{
        display: block;
        position: relative;
        color: var(--color-base);
        @media (width > 960px) {
          padding: 40px 90px 40px 60px;
          &::before,&::after{
            content: "";
            display: block;
            position: absolute;
            pointer-events: none;
            background-color: var(--color-pink);
            width: 30px;
            height: 3px;
            right: 30px;
            top: calc(50% - 1px);
            transition: 0.2s linear;
          }
          &::after{
            transform: rotate(90deg);
          }
          &.open::after{
            transform: rotate(0deg);
          }
        }
        @media (width < 1360px) {
          padding: 40px 90px 40px 40px;
        }
        @media (width <= 960px) {
          padding: calc(2 * var(--layout-unit));
        }
      }
      .content_ttl{
        margin-top: 0;
        @media (width <= 960px) {
          font-size: calc(24 / 375 * 100vw);
        }
        span{
          color: var(--color-white);
          background: var(--grad);
          padding: 0.5em 0.8em;
          display: inline-block;
          vertical-align: middle;
          margin-left: 1em;
          line-height: 1.5;
          border-radius: 0.3em;
          font-size: clamp(14px, calc(17 / 1920 * 100vw), 24px);
          @media (width <= 960px) {
            font-size: calc(12 / 375 * 100vw);
            margin: 0.5em auto 0;
            display: table;
          }
        }
      }
    }
    .folding_detail{
      border-top:solid 1px #707070;
      padding: 60px 0 80px;
      @media (width <= 960px) {
        padding: 30px calc(2 * var(--layout-unit));
        border-top:none;
      }
      .folding_detail_inner{
        margin: 0 auto;
        max-width: 100%;
      }
      .folding_detail-ttl{
        font-size: clamp(26px, calc(40 / 1920 * 100vw), 47px);
        text-align: center;
        @media (width <= 960px) {
          font-size: calc(18 / 375 * 100vw);
        }
        strong{
          color: var(--color-purple);
          font-weight: bold;
        }
        span{
          display: inline-block;
        }
        &::before,&::after{
          content: "";
          display: inline-block;
          width: 1em;
          height: 1em;
          background: url("../images/common/icon_ll.svg") center center no-repeat;
          background-size: contain;
          @media (width <= 960px) {
            width: 2em;
            height: 2em;
          }
        }
        &::before{
          margin-right: calc(0.5 * var(--layout-unit));
        }
        &::after{
          margin-left: calc(0.5 * var(--layout-unit));
          transform: scale(-1, 1);
        }
      }
      .service_detail_lead{
        text-align: center;
        margin-top: 20px;
        line-height: 2;
        @media (width <= 960px) {
          text-align: left;
        }
      }
    }
    .folding-sp_btn{
    display: none;
      @media (width <= 960px) {
        display: block;
        a{
          display: block;
          text-align: center;
          font-weight: bold;
          color: var(--color-white);
          font-size: calc(16 / 375 * 100vw);
          padding: 0.5em;
          background-color: var(--color-pink);
          position: relative;
          &::before,&::after{
            content: "";
            display: block;
            position: absolute;
            pointer-events: none;
            background-color: var(--color-white);
            width: 1em;
            height: 1px;
            right: 1em;
            top: calc(50% - 1px);
            transition: 0.2s linear;
          }
          &::after{
            transform: rotate(90deg);
          }
          &.open::after{
            transform: rotate(0deg);
          }
        }
      }
    }
  }
}
/* bnr */
.menu_bnrArea {
	display: flex;
	flex-wrap: wrap;
	margin-top: calc(3 * var(--layout-unit));
	padding: 0 calc(4 * var(--layout-unit));
	gap: calc(1 * var(--layout-unit));
}
.menu_bnrArea a {
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #e6e6e6;
	background-color: var(--color-white);
	border-radius: calc(0.7 * var(--layout-unit));
	padding: calc(0.4 * var(--layout-unit));
	width: calc(50% - calc(0.5 * var(--layout-unit)));
	height: calc(5.6 * var(--layout-unit));
	transition: all 0.3s ease-in;
}
.menu_bnrArea a:hover {
	border-color: #aaa;
}
@media screen and (min-width: 961px) {
	.menu_bnrArea {
		margin-top: calc(4 * var(--layout-unit));
		padding: 0;
	}
	.menu_bnrArea a {
		border-radius: calc(1 * var(--layout-unit));
		padding: calc(0.5 * var(--layout-unit));
		/* width: calc(32 * var(--layout-unit)); */
		width: calc(20% - calc(1 * var(--layout-unit)));
		height: calc(8.7 * var(--layout-unit));
	}
}
@media screen and (min-width: 1280px) {
	.menu_bnrArea {
		padding: 0 calc(12.85 * var(--layout-unit));
	}
}
.menu_footer {
	margin-top: calc(3 * var(--layout-unit));
  font-size: calc(1.2 * var(--layout-unit));
}
.menu_footer-link {
  text-align: center;
	a {
		color: var(--color-gray-blue);
	}
}
.menu_footer-copyright {
	margin-top: calc(3.6 * var(--layout-unit));
	color: var(--color-gray-blue);
	text-align: center;
}

/* --------------------------------------------------------
header
   -------------------------------------------------------- */
#header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: calc(6.2 * var(--layout-unit));
	padding: calc(1.4 * var(--layout-unit)) calc(1 * var(--layout-unit)) calc(1 * var(--layout-unit));
	background-color: transparent;
	display: flex;
	align-items: center;
	justify-content: space-between;
	z-index: 2000;
	transition: background-color 0.3s;
}
h1.header_logo {
	font-size: inherit;
	margin: 0;
}
/* fixed */
#header.is-sticky {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background-color: rgba(255, 255, 255, 0.75);
	height: calc(5.8 * var(--layout-unit));
	padding: calc(1 * var(--layout-unit)) calc(1 * var(--layout-unit));
}
#header.is-open.is-sticky {
	background-color: transparent;
}
#header .header_gnav li > a {
	font-weight: 700;
}
.nav_sub li {
	list-style: none;
}

@media screen and (max-width: 960px) {
	#header > .header_gnav {
		display: none;
	}

	#header.is-open {
		background-color: transparent;
	}
	.header_logo img {
		height: calc(2.7 * var(--layout-unit));
		width: auto;
	}

	/* header_menu */
	.header_menu {
		width: calc(4.2 * var(--layout-unit));
		height: calc(4.2 * var(--layout-unit));
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		cursor: pointer;
		z-index: 1000;
		background-image: var(--grad-btm-right);
		border-radius: 50%;
		/* position: absolute;
	right: calc(1 * var(--layout-unit));
	top: calc(.7 * var(--layout-unit)); */
	}
	.header_menu-line {
		display: inline-block;
		/* position: absolute; */
		width: calc(1.5 * var(--layout-unit));
		height: 2px;
		background-color: var(--color-white);
		margin: calc(0.2 * var(--layout-unit)) 0;
		transition: transform 0.3s, opacity 0.3s;
	}

	/* menu open */
	#header.is-open .header_menu-line:nth-child(1) {
		transform: translateY(calc(0.5 * var(--layout-unit))) rotate(45deg);
	}
	#header.is-open .header_menu-line:nth-child(2) {
		opacity: 0; /* 中央線を非表示 */
	}
	#header.is-open .header_menu-line:nth-child(3) {
		transform: translateY(calc(-0.5 * var(--layout-unit))) rotate(-45deg);
	}

	/* sp_menu */
	.sp_menu {
		position: fixed;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
		background-color: #f5f7fa;
		padding: calc(6.2 * var(--layout-unit)) 0;
		z-index: 999;
		transform: translateX(100%);
		transition: transform 0.4s ease-in-out;
		overflow-y: scroll;
		-webkit-overflow-scrolling: touch;
	}
	/* open */
	#header.is-open ~ .sp_menu {
		transform: translateX(0); /* 表示 */
	}
	#header.is-sticky .sp_menu {
		padding: calc(5.8 * var(--layout-unit)) 0 calc(6.2 * var(--layout-unit));
	}
}

@media screen and (max-width: 640px) {
	/* menu open */
	#header.is-open .header_menu-line:nth-child(1) {
		transform: translateY(calc(0.6 * var(--layout-unit))) rotate(45deg);
	}
	#header.is-open .header_menu-line:nth-child(3) {
		transform: translateY(calc(-0.6 * var(--layout-unit))) rotate(-45deg);
	}
}

@media screen and (min-width: 961px) {
	.header_menu,
	.sp_menu {
		display: none;
	}

	#header {
		height: inherit;
		padding: 18px calc(6 * var(--layout-unit)) 18px calc(4 * var(--layout-unit));
	}
	.header_logo img {
		height: calc(4.4 * var(--layout-unit));
	}
	.header_gnav ul {
		list-style: none;
		display: flex;
		align-items: baseline;
		gap: calc(3.5 * var(--layout-unit));
		padding: 10px calc(1.8 * var(--layout-unit)) 10px calc(4 * var(--layout-unit));
		border-radius: calc(8.8 * var(--layout-unit));
	}
	.header_gnav li {
		margin: 0;
		padding: 0;
	}
	.header_gnav li > a {
		color: var(--color-base);
		font-size: clamp(12px, calc(7.991657977059437px + 0.4171011470281543vw), 16px);
		padding: 0;
		position: relative;
	}
  #lf_wrapper:not(.lf_simple_page) .header_gnav li > a {
		color: var(--color-white);
  }
	.header_gnav li > a::after {
		content: '';
		position: absolute;
		left: 0;
		bottom: -3px;
		width: 0;
		height: 1px;
		background-color: var(--color-base);
		transition: width 0.3s ease;
	}
  #lf_wrapper:not(.lf_simple_page) .header_gnav li > a::after {
		background-color: var(--color-white);
  }
	.header_gnav li > a:hover::after {
		width: 100%;
	}

	/* fixed */
	#header.is-sticky {
		background-color: transparent;
		/* height: calc(9.2 * var(--layout-unit)); */
		height: inherit;
		padding: 18px calc(4 * var(--layout-unit));
	}
	#header.is-sticky .header_gnav ul {
		background-color: var(--color-white);
	}
	#header.is-sticky .header_gnav li > a {
		color: var(--color-base);
	}
	#header.is-sticky .header_gnav li > a::after {
		background-color: var(--color-base);
	}
}

/* --------------------------------------------------------
footer
   -------------------------------------------------------- */
#footer {
	position: relative;
	background-color: #f5f7fa;
	padding: calc(4 * var(--layout-unit)) 0 calc(12 * var(--layout-unit));
}
.footer_logo {
	text-align: center;
}
.footer_logo img {
	width: calc(23.8 * var(--layout-unit));
	margin-inline: auto;
}
#footer .menu_snsInner {
	margin: calc(5 * var(--layout-unit)) calc(1.5 * var(--layout-unit)) 0;
	padding: calc(1.2 * var(--layout-unit));
	border-top: 1px solid #d3d3d3;
	border-bottom: 1px solid #d3d3d3;
}
.footer_nav {
	margin-top: calc(1 * var(--layout-unit));
}
.footer_btm-inner {
	margin-top: calc(3 * var(--layout-unit));
	font-size: calc(1.2 * var(--layout-unit));
}
.footer_btm-inner p {
	color: var(--color-gray-blue);
	text-align: center;
}
.footer_btm-inner a {
	color: var(--color-gray-blue);
}
.footer_btm-inner .footer_copyright {
	margin-top: calc(3.6 * var(--layout-unit));
}

@media screen and (min-width: 961px) {
	#footer {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin-top: 50px;
		padding: calc(11.8 * var(--layout-unit)) calc(10 * var(--layout-unit));
	}
	.footer_logo img {
		width: calc(34 * var(--layout-unit));
	}
	.footer_nav {
		margin-top: 0;
	}
	.footer_nav ul {
		list-style: none;
	}
	.footer_nav,
	.footer_nav > ul:first-of-type,
	.nav_subWrap {
		display: flex;
		gap: calc(6 * var(--layout-unit));
	}
	.footer_nav li > a {
		display: inline-block;
		padding: 0;
		font-size: clamp(12px, calc(7.991657977059437px + 0.4171011470281543vw), 16px);
		transition: all 0.2s;
	}
	.footer_nav li > a:hover {
		text-decoration: underline;
	}
	.footer_nav > ul > li > a {
		font-weight: 700;
	}
	.nav_subWrap {
		height: inherit !important;
		gap: calc(1.6 * var(--layout-unit));
	}
	.footer_nav li .nav_sub a {
		padding: 8px 0 0;
		font-size: clamp(11px, calc(8.995828988529718px + 0.20855057351407716vw), 13px);
		font-weight: 500;
	}
	.footer_nav-btm li:not(:first-of-type) {
		margin-top: calc(1.8 * var(--layout-unit));
	}
	.footer_nav-btm li.nav_contact {
		margin-top: calc(3 * var(--layout-unit));
	}
	.footer_bnrArea {
		width: 100%;
	}
	.footer_btm {
		display: flex;
		flex-direction: row-reverse;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		margin-top: calc(4 * var(--layout-unit));
		padding: 20px 0;
		border-top: 1px solid #e5e5e5;
	}
	#footer .menu_snsInner {
		margin: 0;
		padding: 0;
		border: none;
	}
	#footer .menu_snsInner a img {
		width: 44px;
		transition: opacity 0.4s ease-in-out;
	}
	#footer .menu_snsInner a:hover img {
		opacity: 0.75;
	}
	.footer_btm-inner {
		display: flex;
		gap: 35px;
		margin-top: 0;
		font-size: clamp(11px, calc(8.995828988529718px + 0.20855057351407716vw), 13px);
	}
	.footer_btm-inner p {
		text-align: left;
	}
	.footer_btm-inner .footer_copyright {
		margin-top: 0;
	}
}

@media screen and (min-width: 1200px) {
	#footer {
		padding: calc(11.8 * var(--layout-unit)) calc(14 * var(--layout-unit));
	}
}

/* --------------------------------------------------------
lf_simple_page
   -------------------------------------------------------- */
.lf_simple_page{
  margin-top: 18.13vw;
}
@media screen and (min-width: 961px) {
  .lf_simple_page{
    margin-top: clamp(90px, calc(90px + 0.58333vw), 97px);
  }
}
/* --------------------------------------------------------
nav_breadcrumb
   -------------------------------------------------------- */
.nav_breadcrumb{
  height: 0;
}
.nav_breadcrumb .nav_breadcrumb-list{
  display: block;
  margin: 0 auto;
  width: 100%;
  line-height: 1em;
  padding: 1em calc(1.5 * var(--layout-unit));
  text-align: left;
  position: relative;
  z-index: 5;
  font-size: calc(11 / 375 * 100vw);
}
.nav_breadcrumb.nav_breadcrumb-white .nav_breadcrumb-list{
  color: var(--color-white);
}
.nav_breadcrumb .nav_breadcrumb-list li{
  display: inline;
  vertical-align: top;
  text-indent: -0.3em;
}
.nav_breadcrumb .nav_breadcrumb-list li *{
  text-indent: 0;
}
.nav_breadcrumb .nav_breadcrumb-list li:before{
  content: "";
  width: 0.38em;
  height: 0.38em;
  display: inline-block;
  vertical-align: middle;
  text-indent: 0;
  margin: 0 0.8em;
}
.nav_breadcrumb.nav_breadcrumb-white .nav_breadcrumb-list li:before{
  background: var(--color-white);
}
.nav_breadcrumb .nav_breadcrumb-list li:first-child:before{
  content: "";
  margin: 0;
  display: none;
}
.nav_breadcrumb .nav_breadcrumb-list li a{
  text-decoration: none;
  color: inherit;
}
.nav_breadcrumb .nav_breadcrumb-list li a:hover{
  text-decoration: underline;
}
@media screen and (min-width: 961px) {
  .nav_breadcrumb .nav_breadcrumb-list{
    font-size: clamp(12px, calc(7.991657977059437px + 0.4171011470281543vw), 16px);
    width: calc(180 * var(--layout-unit));
    padding: 1.5em calc(5 * var(--layout-unit));
  }
}
.lf_content_page .nav_breadcrumb .nav_breadcrumb-list{
  padding-top: 18.13vw;
}
@media screen and (min-width: 961px) {
  .lf_content_page .nav_breadcrumb .nav_breadcrumb-list{
    padding-top: 162px;
  }
}
/* --------------------------------------------------------
page_headline
   -------------------------------------------------------- */
.page_headline{
  color: var(--color-white);
  margin: 0 auto;
  text-align: center;
  width: 100%;
  overflow: hidden;
  position: relative;
}
.page_headline-bg{
  background-color: #001053;
  font-size: 0;
  line-height: 0;
}
.page_headline-bg img,.page_headline-bg source{
  /*opacity:.6;filter: alpha(opacity=60);-ms-filter: "alpha(opacity=60)";*/
  margin: 0 auto;
}
.page_headline-bg::after{
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  aspect-ratio: 580 / 380;
  height: 100%;
  background: transparent linear-gradient(142deg, #CD579200 0%, #CD579200 50%, #933E9D 77%, #713BCC 100%) 0% 0% no-repeat padding-box;
  opacity:.7;filter: alpha(opacity=70);-ms-filter: "alpha(opacity=70)";
}
.page_headline-inner{
  display:flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  padding-top: 1.5em;
}
.lf_content_page .page_headline-inner{
  padding-top: 5.5em;
}
.page_headline-inner .heading-lv1{
	font-size: calc(30 / 375 * 100vw);
  line-height: 1.5;
  font-weight: bold;
  small{
    display: inline-block;
    line-height: 1;
  }
}
.page_headline-inner .heading-caption{
  display: block;
	font-size: calc(13 / 375 * 100vw);
  line-height: 1.5;
  margin-top: 0.3em;
}
.lf_simple_page .page_headline{
  border-radius: 20px;
}
@media screen and (min-width: 961px) {
  .page_headline{
  }
  .page_headline-bg{
    min-height: 540px;
    width: calc(100% + 100vw);
    margin: 0 -50vw;
  }
  .page_headline-bg img,.page_headline-bg source{
    height: auto;
    min-height: 540px;
    min-width: calc(100% - 100vw);
    width: auto;
  }
  .page_headline-bg::after{
    aspect-ratio: 1065 / 380;
    height: 100%;
    background: transparent linear-gradient(112deg, #CD579200 0%, #CD579200 50%, #933E9D 77%, #713BCC 100%) 0% 0% no-repeat padding-box;
    opacity:.7;filter: alpha(opacity=70);-ms-filter: "alpha(opacity=70)";
  }
  .page_headline-inner{
    padding-top: 90px;
  }
  .page_headline-inner .heading-lv1{
    font-size: clamp(58px, calc(65 / 1920 * 100vw), 72px);
  }
  .page_headline-inner .heading-caption{
    font-size: clamp(12px, calc(19 / 1920 * 100vw), 26px);
  }
  .lf_simple_page .page_headline{
    border-radius: 30px;
    width: calc(180 * var(--layout-unit));
  }
  .lf_simple_page .page_headline-bg{
    min-height: 380px;
  }
  .lf_simple_page .page_headline-bg img,.page_headline-bg source{
    min-height: 380px;
  }
  .lf_simple_page .page_headline-inner{
    padding-top: 1em;
  }
}
.page_headline-detail{
  background-color: #001053;
  
}

/* content_ttl */
.content_ttl{
  background:url("../images/common/ico_ttl.svg") center top no-repeat;
  -moz-background-size: 1.1em auto;
  background-size: 1.1em auto;
  padding: 1.5em 0 0;
  text-align: center;
  line-height: 1.4em;
	@media (width > 960px) {
    background:url("../images/common/ico_ttl.svg") left 0.15em no-repeat;
    -moz-background-size: 1.1em auto;
    background-size: 1.1em auto;
    padding: 0 0 0 1.5em;
    text-align: left;
  }
}
.content_subttl{
  font-size: clamp(22px, calc(28 / 1920 * 100vw), 35px);
  position: relative;
  padding-left: 0.5em;
  line-height: 1.3;
	@media (width <= 960px) {
    font-size: calc(22 / 375 * 100vw);
  }
  &:before{
    content: "";
    display: block;
    width: 1em;
    height: 0.2em;
    border-radius: 9999px;
    position: absolute;
    left: -0.5em;
    top: 0.65em;
    background: var(--grad);
    transform: rotate(90deg);
  }
}

/* pagetop */
#pagetop {
	position: absolute;
	bottom: 165px;
	right: 15px;
	/* z-index: 100;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s; */
}
#pagetop.is-visible {
	opacity: 1;
	visibility: visible;
}
#pagetop button {
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	background-color: rgba(0, 0, 0, 0.6);
	border-radius: 10px;
	width: 50px;
	height: 50px;
	transition: all 300ms ease;
}
#pagetop button:hover {
	opacity: 0.75;
}
.icon-yazi-pagetop {
	display: block;
	width: 17px;
	height: 11px;
	background: var(--icon-arrow_left) center no-repeat;
	background-size: contain;
	transform: rotate(90deg);
}

@media screen and (min-width: 961px) {
	#pagetop {
		position: fixed;
		bottom: 20px;
		right: 20px;
		z-index: 100;
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.3s ease, visibility 0.3s;
	}
	#pagetop a {
		width: 70px;
		height: 70px;
		transition: all 300ms ease;
	}
	.icon-yazi-pagetop {
		width: 22px;
		height: 14px;
	}
}
/* ----------------------------------------------------
list
---------------------------------------------------- */
.dot-list:not(:first-of-type){
  margin-top: 0.3em;
}
.dot-list:not(:last-of-type){
  margin-bottom: 0.3em;
}
.dot-list li:not(:first-of-type){
  margin-top: 0.3em;
}
.dot-list li{
  padding-left: 1em;
  text-indent: -1em;
}
.dot-list li::before{
  content: "・";
  display: inline-block;
  width: 1em;
  text-align: center;
  text-indent: 0;
}
.dot-list li > *{
  text-indent: 0;
}
/* ----------------------------------------------------
sp
---------------------------------------------------- */
@media (width <= 960px) {
  .sp_tablewrap{
    overflow-x: scroll;
    padding-bottom: 0.5em;
    overflow-y: scroll;
    scrollbar-width:0.5em;
    scrollbar-color: #000 #e5e5e5;
  }
  .sp_tablewrap::-webkit-scrollbar {
    width: 0.5em;
  }
  .sp_tablewrap::-webkit-scrollbar-thumb {
    background-color: #000;
    border-radius: 9999px;
  }
  .sp_tablewrap::-webkit-scrollbar-track {
    background:#e5e5e5;
  }
  .sp_tablewrap.-sp-150 table{
    width: 150%;
  }
}

/* ----------------------------------------------------
column
---------------------------------------------------- */
.column_inner {
	width: 100%;
	padding: 120px 20px 90px;
	background: #efe8df;
	@media (width <= 960px) {
		padding: 50px 15px;
	}
}
.column_ttl {
	display: grid;
	justify-content: center;
	justify-items: center;
	gap: 8px;
	@media (width <= 960px) {
		gap: 4px;
	}
	.en {
		display: inline-block;
		width: calc(492/1920*100vw);
		@media (width <= 960px) {
			width: calc(209/375*100vw);
		}
	}
	.ja {
		display: inline-block;
		padding-left: calc(62/1920*100vw);
		font-size: clamp(1.125rem, 0.875rem + 0.4167vw, 1.375rem);
		font-weight: 700;
		@media (width <= 960px) {
			padding-left: 0;
			font-size: clamp(1.125rem, 0.9647rem + 0.6838vw, 1.375rem);
		}
	}
}
.column_contents {
	max-width: 1560px;
	margin: 50px auto 0;
	@media (width <= 960px) {
		margin: 30px auto 0;
	}
}
.column_container {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 40px;
	margin-bottom: 50px;
	padding-bottom: 50px;
	border-bottom: 1px solid #d3b0b0;
	@media (width <= 960px) {
		grid-template-columns: repeat(2, 1fr);
		margin-bottom: 0;
		padding-bottom: 0;
		border-bottom: none;
	}
	@media (width <= 600px) {
		grid-template-columns: 1fr;
	}
	&:last-of-type {
		margin-bottom: 40px;
		@media (width <= 960px) {
			margin-top: 40px;
			margin-bottom: 0;
		}
	}
}
.column_item-link {
	text-align: left;
	&:hover {
		.column_item-ttl {
			@media (hover: hover) {
				font-weight: 700;
				text-decoration: underline;
			}
		}
		.column_item-img {
			@media (hover: hover) {
				transform: scale(1.1);
			}
		}
	}
}
.column_item-figure {
	border-radius: 30px;
	aspect-ratio: 360/260;
	overflow: hidden;
	@media (width <= 960px) {
		border-radius: 20px;
	}
}
.column_item-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.4s;
}
.column_item-info {
	@media (width <= 960px) {
		display: flex;
		flex-direction: row-reverse;
		align-items: center;
		justify-content: start;
		gap: 14px;
	}
}
.column_item-label {
	display: grid;
	place-items: center;
	width: fit-content;
	margin-top: 20px;
	padding: 8px 20px;
	border-radius: var(--radius-full);
	color: var(--color-white);
	background: var(--color-deep-blue);
	font-size: clamp(0.6875rem, 0.5rem + 0.3125vw, 0.875rem);
	font-weight: 600;
	@media (width <= 960px) {
		padding: 8px 15px;
		font-size: clamp(0.6875rem, 0.5673rem + 0.5128vw, 0.875rem);
	}
}
.column_item-date {
	margin-top: 20px;
	color: #767676;
	font-size: clamp(0.75rem, 0.625rem + 0.2083vw, 0.875rem);
	@media (width <= 960px) {
		font-size: clamp(0.75rem, 0.6699rem + 0.3419vw, 0.875rem);
	}
}
.column_item-ttl {
	margin-top: 8px;
	color: var(--color-base);
	font-size: clamp(0.875rem, 0.75rem + 0.2083vw, 1rem);
	font-weight: 400;
	line-height: 2;
	transition: all 0.4s;
	@media (width <= 960px) {
		font-size: clamp(0.875rem, 0.7949rem + 0.3419vw, 1rem);
		line-height: 1.85;
	}
}
.column_link {
	@media (width <= 960px) {
		margin-top: 40px;
	}
}
/* ----------------------------------------------------
theater
---------------------------------------------------- */
.theater_container{
  padding: 60px 15px;
  margin: 0 auto;
}
@media (min-width: 961px) {
.theater_container .sec_inner {
		/* max-width: 1300px; */
		width: clamp(800px, calc(299.99999999999994px + 52.083333333333336vw), 1300px);
		margin-inline: auto;
	}
}
.theater_headline{
  text-align: center;
}
.theater_ttl{
  color: var(--color-pink);
  font-family: var(--font-Arial);
	font-size: calc(49 / 375 * 100vw);
  line-height: 1;
}
.theater_subttl{
	font-size: calc(18 / 375 * 100vw);
  margin: 18px 0 16px;
  @media (max-width: 960px) {
    margin: 0 0 20px;
  }
}
.theater_list .theater_item .theater_link{
  display: block;
  font-size: 0;
  line-height: 0;
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  transition: opacity 0.4s;
  &:hover {
			@media (hover: hover) {
				opacity: 0.7;
		}
	}
}
.theater_txt{
  line-height: 2em;
}
.theater_list .theater_item .theater_link::after{
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-image: var(--icon-youtube-min);
  background-position: center center;
  background-repeat: no-repeat;
  -moz-background-size: 100% auto;
  background-size: 100% auto;
  width: 20vw;
  height: 14.4vw;
}
.theater_list .theater_item .theater_item-figure{
  opacity:.9;filter: alpha(opacity=90);-ms-filter: "alpha(opacity=90)";
}
.theater_list .theater_item .theater_item-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.4s;
}
.theater_list .theater_item p{
  font-weight: bold;
}
.theater_list .theater_item:hover p{
    font-weight: bold;
    text-decoration: underline;
}
@media (max-width: 960px) {
  .theater_container{
    padding: calc(5 * var(--layout-unit)) 15px;
  }
  .theater_txt{
    text-align: left;
  }
  .theater_list .theater_item.-sp-order-prev{
    order: -99;
  }
  .theater_list .theater_item{
    margin-top: calc(3 * var(--layout-unit));
  }
  .theater_list .theater_item p{
    margin: 0.5em 1em 0;
  }
  .theater_btn{
    margin-top: calc(4 * var(--layout-unit));
  }
}
@media (min-width: 961px) {
  .theater_container{
    width: calc(150 * var(--layout-unit));
  }
  .theater_ttl{
    font-size: clamp(69px, calc(76 / 1920 * 100vw), 83px);
  }
  .theater_subttl{
    font-size: clamp(23px, calc(30 / 1920 * 100vw), 37px);
  }
  .theater_list{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 60px 46px;
    margin-top: 50px;
  }
  .theater_list .theater_item{
    width: calc(50% - 25px);
    border-radius: 30px;
  }
  .theater_list .theater_item .theater_link::after{
    width: 116px;
    height: 82px;
  }
  .theater_list .theater_item p{
    margin: 1.17em 0 0;
    font-size: clamp(14px, calc(17 / 1920 * 100vw), 24px);
  }
  .theater_btn{
    margin-top: 60px;
  }
}
/* --------------------------------------------------------
contactWrap
   -------------------------------------------------------- */
.contactWrap {
	background-image: var(--grad);
	color: var(--color-white);
	padding: calc(3 * var(--layout-unit));
	margin: 0 auto;
	position: relative;
}
@media screen and (max-width: 960px) {
	.contactWrap:before {
		position: absolute;
		left: 0;
		bottom: 0;
		content: '';
		background: url(../images/common/footer_obj_sp.png) bottom center no-repeat;
		background-size: contain;
		width: 100%;
		height: 100%;
		z-index: -1;
	}
}
.contactWrap a {
	color: var(--color-white);
}
.contact_img img {
	border-radius: calc(2 * var(--layout-unit));
}
.contactWrap .heading-lv2 {
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	line-height: 1;
	margin: calc(1.2 * var(--layout-unit)) auto calc(1.8 * var(--layout-unit));
}
.contactWrap .heading-lv2 span {
	font-size: clamp(40px, calc(23.333333333333332px + 4.444444444444445vw), 66px);
}
.contact_ttl {
	max-width: clamp(11.75rem, 3.6971rem + 34.359vw, 24.3125rem);
	margin-inline: auto;
	@media (width > 960px) {
		max-width: clamp(11.75rem, 3.375rem + 17.4479vw, 24.3125rem);
		margin-inline: 0;
	}
}
.contactWrap .heading-lv2 b {
	font-size: clamp(18px, calc(11.58974358974359px + 1.7094017094017095vw), 28px);
	margin-top: 15px;
}
.contact_txt p {
	position: relative;
	padding-right: calc(6.4 * var(--layout-unit));
}
.contact_txt p::after {
	content: '';
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--color-white);
	background: var(--icon-arrow_left) center no-repeat;
	background-size: calc(2 * var(--layout-unit)) auto;
	border-radius: 50%;
	transform: rotateY(180deg);
	width: calc(5.8 * var(--layout-unit));
	height: calc(5.8 * var(--layout-unit));
	position: absolute;
	right: 0;
	top: calc(50% - calc(2.9 * var(--layout-unit)));
}
/* contact_btm */
.contact_btm {
	margin-top: calc(2 * var(--layout-unit));
	padding-top: calc(2 * var(--layout-unit));
	border-top: 1px solid var(--color-white);
	text-align: center;
}
.contact_btm-head {
	font-size: clamp(15px, calc(10.512820512820513px + 1.1965811965811968vw), 22px);
	font-weight: 700;
	margin-bottom: 4px;
}
.contact_btm-tel {
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-Arial);
	font-size: clamp(37px, calc(22.256410256410255px + 3.9316239316239314vw), 60px);
	font-weight: 700;
	line-height: 1.2;
}
.contact_btm-tel::before {
	content: '';
	display: inline-block;
	background: var(--icon-tel) left center no-repeat;
	background-size: contain;
	width: calc(1.9 * var(--layout-unit));
	height: calc(1.9 * var(--layout-unit));
	padding-right: calc(1.2 * var(--layout-unit));
	margin-right: calc(1.2 * var(--layout-unit));
	border-right: 1px solid var(--color-white);
	box-sizing: content-box;
}
.contact_btm-hhbm,
.contact_open {
	display: inline-block;
	font-size: clamp(13px, calc(8.512820512820513px + 1.1965811965811968vw), 20px);
	margin-top: calc(0.6 * var(--layout-unit));
}

@media screen and (min-width: 961px) {
	.contactWrap {
		background: transparent;
		width: calc(170 * var(--layout-unit));
		transition: 0.2s linear;
	}
	.contactWrap a {
		background-image: var(--grad);
		display: flex;
		align-items: center;
		width: 100%;
		z-index: 1;
		overflow: hidden;
		position: relative;
		border-radius: 30px;
		padding: calc(4 * var(--layout-unit)) calc(5 * var(--layout-unit));
		transition: background-position 0.3s ease-out;
	}
	.contactWrap a::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-image: var(--grad-hover);
		z-index: 2;
		opacity: 0;
		border-radius: inherit;
		transition: opacity 0.4s ease-in-out;
	}
	.contactWrap a:hover::before {
		opacity: 1;
	}
	.contactWrap a::after {
		position: absolute;
		right: 0;
		width: 100%;
		height: 100%;
		content: '';
		background: url(../images/common/footer_obj.png) center right no-repeat;
		background-size: contain;
		z-index: 3;
	}
	.contactWrap a > * {
		z-index: 3;
	}
	.ico-arrow {
		display: inline-block;
		background: var(--icon-arrow_circle);
		background-size: contain;
		width: calc(11 * var(--layout-unit));
		height: calc(11 * var(--layout-unit));
		position: absolute;
		right: calc(6 * var(--layout-unit));
		top: calc(50% - calc(5.5 * var(--layout-unit)));
		transition: all 0.4s;
	}
	.contactWrap a:hover .ico-arrow {
		background: var(--icon-arrow_circle-white);
		background-size: contain;
	}
	.contact_img {
		width: calc(32 * var(--layout-unit));
		height: calc(32 * var(--layout-unit));
	}
	.contact_img img {
		object-fit: cover;
		width: 100%;
		height: 100%;
	}
	.contactWrap .heading-lv2 {
		justify-content: flex-start;
		text-align: left;
		margin-bottom: calc(5 * var(--layout-unit));
	}
	.contactWrap .heading-lv2 span {
		font-size: clamp(50px, calc(19.937434827945772px + 3.1282586027111576vw), 80px);
	}
	.contactWrap .heading-lv2 b {
		font-size: clamp(16px, calc(9.987486965589156px + 0.6256517205422315vw), 22px);
	}
	.contact_txt {
		width: calc(46.8 * var(--layout-unit));
		margin-left: calc(7 * var(--layout-unit));
	}
	.contact_txt p {
		padding-right: 0;
	}
	.contact_txt p::after {
		content: none;
	}
	/* contact_btm */
	.contact_btm {
		margin-top: 0;
		padding-top: 0;
		margin-left: calc(7 * var(--layout-unit));
		width: calc(44.5 * var(--layout-unit));
		border-top: none;
		text-align: left;
	}
	.contact_btm-head {
		margin-bottom: 4px;
		font-size: clamp(12px, calc(7.991657977059437px + 0.4171011470281543vw), 16px);
	}
	.contact_btm-tel {
		display: flex;
		align-items: center;
		font-size: clamp(30px, calc(3.9457768508863396px + 2.7111574556830034vw), 56px);
	}
	.contact_btm-tel::before {
		width: calc(2.8 * var(--layout-unit));
		height: calc(2.8 * var(--layout-unit));
		padding-right: calc(2 * var(--layout-unit));
		margin-right: calc(2 * var(--layout-unit));
		margin-bottom: 0;
		box-sizing: content-box;
	}
	.contact_btm-hhbm {
		font-size: clamp(12px, calc(7.991657977059437px + 0.4171011470281543vw), 16px);
		margin-top: calc(2 * var(--layout-unit));
		width: calc(43.5 * var(--layout-unit));
	}
	.contact_open {
		font-size: clamp(11px, calc(7.993743482794578px + 0.31282586027111575vw), 14px);
	}
}
/* ========================================================
wellco
======================================================== */
.wellco_point{
    display:flex;
    -ms-flex-pack:distribute;
    justify-content:space-between;
    flex-wrap: wrap;
    border-bottom: solid 1px #DEDEDE;
    padding-bottom: 50px;
  margin-top: 50px;
  @media (width <= 960px) {
    margin-top: calc(2 * var(--layout-unit));
    padding-bottom: calc(2 * var(--layout-unit));
  }
  .wellco_point_box{
    width: calc((100% - 120px) / 4);
    text-align: left;
    @media (width <= 960px) {
      width: 100%;
      border-top: solid 1px #DEDEDE;
      margin-top: calc(2 * var(--layout-unit));
      padding-top: calc(2 * var(--layout-unit));
      padding-left: calc(120 / 375 * 100vw);
      position: relative;
      img{
        position: absolute;
        left: 0;
        top: calc(2 * var(--layout-unit));
        width: 28.5vw;
      }
    }
    .wellco_point_ttl{
      padding-top: 56px;
      font-size: clamp(16px, calc(20 / 1920 * 100vw), 27px);
      text-align: center;
      position: relative;
      @media (width <= 960px) {
        padding-top: 9vw;
        font-size: calc(15 / 375 * 100vw);
        text-align: left;
      }
      &::before{
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 35px;
        left: 0;
        top: 17px;
        @media (width <= 960px) {
          height: 7.2vw;
          top: 0.9vw;
        }
      }
      &.-ttl01::before{
        background: url("../images/common/wellco_txt_01.png") center center no-repeat;
        background-size: contain;
        @media (width <= 960px) {
          background-position: left center;
        }
      }
      &.-ttl02::before{
        background: url("../images/common/wellco_txt_02.png") center center no-repeat;
        background-size: contain;
        @media (width <= 960px) {
          background-position: left center;
        }
      }
      &.-ttl03::before{
        background: url("../images/common/wellco_txt_03.png") center center no-repeat;
        background-size: contain;
        @media (width <= 960px) {
          background-position: left center;
        }
      }
      &.-ttl04::before{
        background: url("../images/common/wellco_txt_04.png") center center no-repeat;
        background-size: contain;
        @media (width <= 960px) {
          background-position: left center;
        }
      }
    }
    p{
      margin-top: 1em;
      line-height: 1.9;
      font-size: clamp(12px, calc(15 / 1920 * 100vw), 22px);
      @media (width <= 960px) {
        margin-top: 0.5em;
        font-size: calc(13 / 375 * 100vw);
      }
    }
  }
}
.wellco_service_ttl{
  font-size: clamp(24px, calc(30 / 1920 * 100vw), 37px);
  margin: 40px 0;
  @media (width <= 960px) {
    font-size: calc(20 / 375 * 100vw);
    margin: calc(2 * var(--layout-unit)) 0;
  }
}
.wellco_service{
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap:20px;
  @media (width <= 960px) {
    gap:calc(2 * var(--layout-unit));
  }
  .wellco_service_box{
    width: calc((100% - 80px) / 5);
    display:flex;
    justify-content: flex-start;
    align-items: center;
    text-align: left;
    font-weight: bold;
    @media (width <= 1360px) {
      width: calc((100% - 60px) / 4);
    }
    @media (width <= 960px) {
      width: calc((100% - calc(4 * var(--layout-unit))) / 3);
      display: block;
      text-align: center;
    }
    .wellco_service_ic{
      width: 87px;
      margin-right: 10px;
      @media (width <= 960px) {
        width: 100%;
        margin: 0 0 calc(1 * var(--layout-unit));
      }
    }
  }
}
/* ========================================================
workstyle
======================================================== */
.workstyle{
  width: 100%;
  overflow: hidden;
  position: relative;
  font-weight: bold;
  height: 770px;
      display:flex;
    justify-content: center;
    align-items: flex-end;
  @media (width <= 1360px) {
    height: 620px;
  }
  @media (width <= 960px) {
    height: 120vw;
  }
  .workstyle_bg{
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    img{
      height: 100%;
      width: 100%;
      object-fit: cover;
    }
  }
  .workstyle_inner{
    width: calc(170 * var(--layout-unit));
    margin: 0 auto;
    color: var(--color-white);
    padding-bottom: 90px;
    position: relative;
    z-index: 2;
    @media (width <= 960px) {
      width: calc(320 / 375 * 100vw);
      padding-bottom: 40px;
    }
    .workstyle_ttl{
      font-size: clamp(55px, calc(62 / 1920 * 100vw), 70px);
      position: relative;
      &::before{
        content: "";
        display: block;
        background: url("../images/common/workstyle_pop.svg") no-repeat;
        -moz-background-size: 100% auto;
        background-size: 100% auto;
        position: absolute;
        aspect-ratio: 496 / 140;
        width: 496px;
        left: 0;
        top: -146px;
      }
      @media (width <= 960px) {
        font-size: calc(22 / 375 * 100vw);
        &::before{
          width: 80vw;
          top: -24vw;
        }
      }
    }
    .workstyle_txt{
      font-size: clamp(16px, calc(22 / 1920 * 100vw), 29px);
      margin-top: 30px;
      @media (width <= 960px) {
        margin-top: 0.5em;
        font-size: calc(13 / 375 * 100vw);
      }
    }
  }
  .workstyle_img{
    position: absolute;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
    &.-img01{
      border-radius: 20px;
      width: 300px;
      left: calc(50% + 25px);
      bottom: 340px;
      @media (width <= 1360px) {
        width: 200px;
      }
      @media (width <= 960px) {
        width: 42vw;
        left: calc(1 * var(--layout-unit));
        bottom: calc(17.6 * var(--layout-unit));
      }
    }
    &.-img02{
      border-radius: 30px 0 0 30px;
      width: 600px;
      right: 0;
      bottom: 50px;
      @media (width <= 1360px) {
        width: 400px;
      }
      @media (width <= 960px) {
        border-radius: 20px 0 0 20px;
        width: 50vw;
        bottom: calc(25.8 * var(--layout-unit));
        img{
          margin: 0 -5.3vw;
          width: calc(100% + 10.6vw);
          max-width: calc(100% + 10.6vw);
        }
      }
    }
  }
}
/* ========================================================
appeal
======================================================== */
.appeal{
  background-color: #000000;
  width: 100%;
  overflow: hidden;
  font-weight: bold;
  position: relative;
      display:flex;
    justify-content: center;
    align-items: center;
    height: 500px;
    margin-top: 10px;
    @media (width <= 1360px) {
      height: 400px;
    }
    @media (width <= 960px) {
      height: auto;
      padding: 80px 0;
    }
  .appeal_bg{
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    opacity:.6;filter: alpha(opacity=60);-ms-filter: "alpha(opacity=60)";
    img{
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
  &::after{
    content: "";
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    aspect-ratio: 1065 / 380;
    height: 100%;
    background: transparent linear-gradient(112deg, #CD579200 0%, #CD579200 50%, #933E9D 77%, #713BCC 100%) 0% 0% no-repeat padding-box;
    opacity:.7;filter: alpha(opacity=70);-ms-filter: "alpha(opacity=70)";
    @media (width <= 960px) {
      aspect-ratio: 1 / 1;
    }
  }
  .appeal_inner{
    text-align: center;
    color: var(--color-white);
    position: relative;
    z-index: 2;
    width: clamp(800px, calc(299.99999999999994px + 52.083333333333336vw), 1300px);
    @media (width <= 960px) {
      width: calc(345 / 375 * 100vw);
    }
    .appeal_ttl{
      font-size: clamp(43px, calc(50 / 1920 * 100vw), 57px);
    }
    .appeal_txt{
      font-size: clamp(16px, calc(22 / 1920 * 100vw), 29px);
      margin-top: 30px;
    }
    .appeal_link{
      margin-top: 30px;
    }
    @media (width <= 960px) {
      .appeal_ttl{
        font-size: calc(26 / 375 * 100vw);
      }
      .appeal_txt{
        font-size: calc(14 / 375 * 100vw);
      }
    }
  }
}

/* --------------------------------------------------------
popup
   -------------------------------------------------------- */
.popup_area{
  position: fixed;
  width: 100vw;
  height: 100vh;
  left: 0;
  top: 0;
  display: block;
  background-color: rgba(0,0,0,0.7);
  z-index: 9999;
  opacity:0;filter: alpha(opacity=0);-ms-filter: "alpha(opacity=0)";
  &.start{
    opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha(opacity=100)";
  }
  .popup_wrap{
    display:flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    padding: calc(10 * var(--layout-unit));
    @media (width <= 960px) {
      padding: calc(2.4 * var(--layout-unit));
    }
    .popup_inner{
      position: relative;
      background-color: #fff;
      max-width: 100%;
      max-height: 100%;
      .popup_close{
        a{
          display: block;
          position: absolute;
          background: var(--grad-top-left);
          border-radius: 9999px;
          opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha(opacity=100)";
          transition-property: opacity,filter;
          transition: 0.2s linear;
          width: 50px;
          height: 50px;
          right: -25px;
          top: -25px;
          @media (width <= 960px) {
            width: 11vw;
            height: 11vw;
            right: -5.5vw;
            top: -5.5vw;
          }
          &::before,
          &::after{
            content: "";
            display: block;
            background-color: #fff;
            height: 1px;
            width: 50%;
            position: absolute;
            left: 25%;
            top: 50%;
          }
          &::before{
            transform: rotate(45deg);
          }
          &::after{
            transform: rotate(-45deg);
          }
          &::hover{
            opacity:.6;filter: alpha(opacity=60);-ms-filter: "alpha(opacity=60)";
          }
        }
      }
    }
  }
}
/* --------------------------------------------------------
btm_fixedWrap
   -------------------------------------------------------- */
.btm_fixedWrap {
	position: fixed;
	bottom: calc(1 * var(--layout-unit));
	left: 0;
	width: 100%;
	z-index: 99;
  opacity:0;filter: alpha(opacity=0);-ms-filter: "alpha(opacity=0)";
  transition-property: opacity,filter;
  transition: 0.2s linear;
}
.btm_fixedWrap.start{
  opacity:1;filter: alpha(opacity=100);-ms-filter: "alpha(opacity=100)";
}
.btn-container {
	display: flex;
	justify-content: center;
	gap: calc(0.6 * var(--layout-unit));
}
.btm_fixedWrap .btn_fixed {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	padding: calc(0.8 * var(--layout-unit)) calc(0.8 * var(--layout-unit))
		calc(2.8 * var(--layout-unit)) calc(0.8 * var(--layout-unit));
	width: calc(17.5 * var(--layout-unit));
	/* height: 27.2vw; */
	height: calc(9 * var(--layout-unit));
	border-radius: calc(1 * var(--layout-unit));
	color: var(--color-white);
	font-weight: 700;
	line-height: 1.1;
	text-align: center;
	overflow: hidden;
	position: relative;
	z-index: 1;
	transition: box-shadow 0.3s ease;
}
/* hover */
.btn_fixed::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	transition: width 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	z-index: -1;
}
.btn_fixed:hover::before {
	width: 100%;
}

.btm_fixedWrap .btn-text-top {
	font-size: calc(1.1 * var(--layout-unit));
	display: block;
	line-height: 1;
	margin-bottom: calc(0.2 * var(--layout-unit));
	position: relative;
}
.btm_fixedWrap .btn-text-top::before,
.btm_fixedWrap .btn-text-top::after {
	display: inline-block;
	font-size: 75%;
	font-weight: normal;
	white-space: nowrap;
	transform: scale(1, 2);
	transform-origin: center center;
}
.btm_fixedWrap .btn-text-top::before {
	content: '＼ ';
}
.btm_fixedWrap .btn-text-top::after {
	content: ' ／';
}
.btm_fixedWrap .btn-text-main {
	font-size: calc(1.4 * var(--layout-unit));
}
/* icon */
.btn_fixed .btn-icon {
	position: absolute;
	bottom: calc(1 * var(--layout-unit));
	left: calc(50% - calc(1 * var(--layout-unit)));
	width: calc(2 * var(--layout-unit));
	height: calc(2 * var(--layout-unit));
	border-radius: 50%;
	border: 1px solid var(--color-white);
	transition: transform 0.3s ease;
}
.btn_fixed:hover .btn-icon {
	background: var(--color-white);
}
.btn_fixed .btn-icon svg path {
	fill: var(--color-white);
	transition: fill 0.3s ease;
}
/* color */
.btm_fixedWrap .pink-btn {
	background-color: var(--color-pink);
}
.btm_fixedWrap .pink-btn::before {
	background-color: var(--color-pink-hover);
}
.btm_fixedWrap .pink-btn:hover .btn-icon svg circle {
	stroke: var(--color-white);
}
.btm_fixedWrap .pink-btn:hover .btn-icon svg path {
	fill: var(--color-pink-hover);
}
.btm_fixedWrap .purple-btn {
	background-color: var(--color-purple);
}
.btm_fixedWrap .purple-btn::before {
	background-color: var(--color-purple-hover);
}
.btm_fixedWrap .purple-btn:hover .btn-icon svg circle {
	stroke: var(--color-white);
}
.btm_fixedWrap .purple-btn:hover .btn-icon svg path {
	fill: var(--color-purple-hover);
}
.btm_fixedWrap .navy-btn {
	background-color: var(--color-deep-blue);
}
.btm_fixedWrap .navy-btn::before {
	background-color: #142F51;
}
.btm_fixedWrap .navy-btn:hover .btn-icon svg circle {
	stroke: var(--color-white);
}
.btm_fixedWrap .navy-btn:hover .btn-icon svg path {
	fill: #142F51;
}
.btm_fixedWrap .gray-btn {
	background-color: #707070;
}
.btm_fixedWrap .gray-btn::before,
.btm_fixedWrap .gray-btn:hover .btn-icon{
	background-color: #545454;
}
.btm_fixedWrap .gray-btn.btn-icon svg path {
	fill: #545454;
}
.btm_fixedWrap .gray-btn .btn-icon {
  width: 1em;
  height: 1em;
  text-align: center;
}

@media (min-width: 961px) {
	.btn-container {
		justify-content: center;
		gap: 20px;
	}
	.btm_fixedWrap .btn_fixed {
		flex-direction: row;
		align-items: center;
		padding: calc(1.5 * var(--layout-unit)) calc(5 * var(--layout-unit))
			calc(1.5 * var(--layout-unit)) calc(1.5 * var(--layout-unit));
		font-size: clamp(16px, calc(9.987486965589156px + 0.6256517205422315vw), 22px);
		border-right: calc(1 * var(--layout-unit));
		width: calc(36 * var(--layout-unit));
		height: calc(11.8 * var(--layout-unit));
		position: relative;
	}
	.btm_fixedWrap .btn-text-top {
		font-size: clamp(11px, calc(5.989572471324297px + 0.5213764337851928vw), 16px);
		margin-bottom: calc(1 * var(--layout-unit));
	}
	.btm_fixedWrap .btn-text-main {
		font-size: clamp(14px, calc(5.983315954118874px + 0.8342022940563086vw), 22px);
	}
	.btm_fixedWrap .btn-icon {
		width: calc(3.5 * var(--layout-unit));
		height: calc(3.5 * var(--layout-unit));
		top: calc(50% - calc(1.75 * var(--layout-unit)));
		right: calc(1.5 * var(--layout-unit));
		bottom: inherit;
		left: inherit;
	}
}
