@charset "UTF-8";

/* ----------------------------------------------------
共通
---------------------------------------------------- */

.container {
	width: 100%;
	max-width: inherit;
}
.heading-lv2 {
	text-align: center;
}
.text-palt {
	font-feature-settings: 'palt';
}

/* ----------------------------------------------------
fadeUp
---------------------------------------------------- */
.fadeUp {
	opacity: 0;
	transform: translateY(50px);
}

/* ----------------------------------------------------
key visual
---------------------------------------------------- */
.kv {
  position: relative;
	.swiper-main{
    .swiper-slide {
      @media (width <= 960px) {
        width: 100%;
        height: 100dvh;
      }
      @media (width > 960px) {
        max-height: 100dvh;
        min-height: 600px;
      }
      img {
        @media (width <= 960px) {
          width: 100%;
          height: 100%;
          object-fit: cover;
          object-position: center;
        }
      }
    }
	}
	.swiper-thumbnail{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    .swiper-wrapper{
      padding-left: 4px;
      position: absolute;
      max-width: 100%;
      bottom: calc(90 / 1920 * 100vw);
      height: 60px !important;
      justify-content: center;
      transform: none !important;
      @media (width > 960px) {
        margin: 0 !important;
      }
      @media (width <= 960px) {
        /* bottom: calc(148 / 375 * 100vw); */
				bottom: 40px;
        justify-content: flex-start;
        margin-left: 0;
        transition-property: margin;
        transition: 1s linear;
      }
    }
    .swiper-slide {
      width: 105px !important;
      height: 60px !important;
      overflow: hidden;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      cursor: pointer;
      border-radius: 10px;
      border: solid 1px var(--color-white);
      &.swiper-slide-thumb-active{
        border: solid 3px var(--color-pink);
      }
    }
  }
	.swiper-slide {
		position: relative;
		z-index: 2;
      img {
        @media (width <= 960px) {
          width: 100%;
          height: 100%;
          object-fit: cover;
          object-position: center;
        }
      }
	}
	/* swiper-button */
	.swiper-button {
		@media (width <= 960px) {
			position: absolute;
			right: calc(54 / 375 * 100vw);
			bottom: calc(118 / 375 * 100vw);
			display: flex;
			gap: calc(12 / 375 * 100vw);
			z-index: 1;
		}
	}
	.swiper-button-prev,
	.swiper-button-next {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		display: inline-block;
		width: calc(70 / 1920 * 100vw);
		height: calc(70 / 1920 * 100vw);
		border-radius: 50%;
		cursor: pointer;
		z-index: 5;
		@media (width <= 960px) {
			display: none;
		}
		&:hover {
			@media (hover: hover) {
				opacity: 0.7;
			}
		}
		&::after {
			content: '';
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			display: inline-block;
			width: calc(22 / 1920 * 100vw);
			height: calc(14 / 1920 * 100vw);
			background: url(../images/common/icon_swiper_arrow.svg) center/cover no-repeat;
			@media (width <= 960px) {
				width: calc(14 / 375 * 100vw);
				height: calc(9 / 375 * 100vw);
			}
		}
		svg {
			display: none;
		}
	}
	.swiper-button-prev {
		left: calc(11 / 1920 * 100vw);
		background: linear-gradient(45deg, #713bcc, #933e9d 50%, #cd5792);
		@media (width <= 960px) {
			left: auto;
		}
	}
	.swiper-button-next {
		right: calc(11 / 1920 * 100vw);
		background: linear-gradient(-45deg, #713bcc, #933e9d 50%, #cd5792);
		@media (width <= 960px) {
			right: auto;
		}
		&::after {
			transform: translate(-50%, -50%) rotate(180deg);
		}
	}
	/* swiper-pagination */
	.swiper-pagination {
		position: absolute;
		right: 0;
      display: flex;
      justify-content: center;
      gap: 12px;
		bottom: calc(50 / 1920 * 100vw);
		width: 100%;
		z-index: 1;
		@media (width <= 960px) {
			/* bottom: calc(118 / 375 * 100vw); */
			bottom: 15px;
		}
    .swiper-pagination-bullet{
      display: block;
      border-radius: 9999px;
      background-color: var(--color-white);
      width: 10px;
      height: 10px;
      opacity:.4;
      filter: alpha(opacity=40);
      -ms-filter: "alpha(opacity=40)";
      &.swiper-pagination-bullet-active{
        opacity:1;
        filter: alpha(opacity=100);
        -ms-filter: "alpha(opacity=100)";
      }
      @media (width <= 960px) {
        width: 7px;
        height: 7px;
      }
    }
	}
}

/* ----------------------------------------------------
movie
---------------------------------------------------- */
.movie_container {
	background-image: linear-gradient(-20deg, #cd5692 0%, #933e9d 100%);
	padding: calc(2 * var(--layout-unit)) calc(1.5 * var(--layout-unit))
		calc(2.2 * var(--layout-unit));
	position: relative;
}
.movie_wrap {
	width: 100%;
	border-radius: calc(2 * var(--layout-unit));
}
.movie_wrap video {
	width: 100%;
	height: auto;
	display: block;
	border-radius: calc(2 * var(--layout-unit));
}
.movie_txt {
	color: var(--color-white);
	margin-top: calc(1.8 * var(--layout-unit));
	font-size: clamp(14px, calc(11.435897435897436px + 0.6837606837606838vw), 18px);
	font-weight: bold;
	text-align: center;
}
.heading-lv2.-movie {
	font-size: clamp(2.0625rem, 0.9808rem + 4.6154vw, 3.75rem);
	/* max-width: clamp(17.125rem, 8.1106rem + 38.4615vw, 31.1875rem);
	margin-inline: auto; */
	margin-bottom: 8px;
	line-height: 1;
}
.movie_link {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: calc(1.4 * var(--layout-unit));
	background-color: rgba(0, 0, 0, 0.25);
	border-radius: calc(5 * var(--layout-unit));
	padding: calc(0.8 * var(--layout-unit)) calc(2.4 * var(--layout-unit));
	margin-top: calc(1.8 * var(--layout-unit));
}
.movie_link a {
	display: inline-flex;
	align-items: center;
	font-size: clamp(13px, calc(11.076923076923077px + 0.5128205128205128vw), 16px);
	font-weight: 500;
	color: var(--color-white);
	text-decoration: underline;
	transition: 0.4s all;
}
.movie_link a:hover {
	text-decoration: none;
}
.movie_link a.-youtube::after,
.movie_link a.-insta::after {
	content: '';
	display: inline-block;
	margin-left: 10px;
}
.movie_link a.-youtube::after {
	background: var(--icon-play) center no-repeat;
	background-size: 100%;
	width: 45px;
	height: 32px;
	background-size: contain;
}
.movie_link a.-insta::after {
	background: var(--icon-insta) center no-repeat;
	width: 38px;
	height: 38px;
	background-size: contain;
}

@media (min-width: 961px) {
	.movie_container {
		padding: calc(7 * var(--layout-unit)) calc(10 * var(--layout-unit));
	}
	.movie_wrap {
		border-radius: calc(4 * var(--layout-unit));
	}
	.movie_wrap video {
		border-radius: calc(4 * var(--layout-unit));
	}
	.movie_txt {
		position: absolute;
		bottom: calc(15 * var(--layout-unit));
		right: calc(14 * var(--layout-unit));
		margin-top: 0;
		font-size: clamp(14px, calc(9.991657977059436px + 0.4171011470281543vw), 18px);
		text-align: right;
	}
	.heading-lv2.-movie {
		font-size: clamp(2.0625rem, 0.375rem + 2.8125vw, 3.75rem);
		/* max-width: clamp(17.125rem, 7.75rem + 19.5313vw, 31.1875rem); */
		margin-bottom: 20px;
	}
	.movie_link {
		justify-content: flex-end;
		gap: calc(3 * var(--layout-unit));
		background-color: transparent;
		padding: 0;
		margin-top: calc(5 * var(--layout-unit));
	}
	.movie_link a.-youtube::after,
	.movie_link a.-insta::after {
		margin-left: calc(1.4 * var(--layout-unit));
	}
	.movie_link a.-youtube::after {
		width: calc(5.6 * var(--layout-unit));
		height: calc(4 * var(--layout-unit));
	}
	.movie_link a.-insta::after {
		width: calc(4.6 * var(--layout-unit));
		height: calc(4.6 * var(--layout-unit));
	}
}

/* ----------------------------------------------------
news
---------------------------------------------------- */
.category-tabs {
	justify-content: center;
}
.heading-lv2.-news {
	margin-bottom: calc(2.2 * var(--layout-unit));
}

@media (max-width: 960px) {
	.news_container {
		background-color: #f9f8f4;
		padding: calc(5 * var(--layout-unit)) calc(1.5 * var(--layout-unit));
	}
	.news-categories {
		margin-top: calc(2.2 * var(--layout-unit));
	}
}

@media (min-width: 961px) {
	.news_container {
		background-color: #f8f8f8;
		padding: 60px calc(10 * var(--layout-unit));
		margin-top: 60px;
		/* max-width: 1600px; */
		width: clamp(900px, calc(200px + 72.91666666666666vw), 1600px);
		border-radius: 30px;
	}
	.news_container .sec_inner {
		/* max-width: 1300px; */
		width: clamp(800px, calc(299.99999999999994px + 52.083333333333336vw), 1300px);
		margin-inline: auto;
	}
	.heading-lv2.-news {
		margin-bottom: 40px;
		text-align: left;
	}
}

/* ----------------------------------------------------
concept
---------------------------------------------------- */
.concept {
	position: relative;
	&::before {
		position: absolute;
		right: 0;
		bottom: 0;
		content: '';
		display: block;
		width: 100%;
		height: calc(1160 / 1920 * 100vw);
		background-image: url(../images/top/bg_concept-line.webp);
		background-position: bottom right;
		background-size: cover;
		background-repeat: no-repeat;
		z-index: 0;
		@media (width <= 960px) {
			display: none;
		}
	}
}
.concept_inner {
	position: relative;
	display: grid;
	grid-template-columns: 87fr 29fr 706fr 55fr 735fr;
	grid-template-rows: auto auto 1fr;
	width: calc(1600 / 1920 * 100vw);
	margin-inline: auto;
	padding: calc(97 / 1920 * 100vw) 0 calc(100 / 1920 * 100vw);
	z-index: 1;
	@media (width <= 960px) {
		grid-template-columns: 1fr;
		grid-template-rows: repeat(5, auto);
		width: 100%;
		padding: calc(80 / 375 * 100vw) 0 calc(40 / 375 * 100vw);
	}
}
.concept_ttl {
	grid-column: 1;
	grid-row: 1/-1;
	@media (width <= 960px) {
		grid-row: 1;
		width: calc(236 / 375 * 100vw);
		margin-inline: auto;
	}
}
.concept_lead {
	grid-column: 5;
	grid-row: 1;
	margin-top: calc(90 / 1920 * 100vw);
	font-size: clamp(1.375rem, 0.25rem + 1.875vw, 2.5rem);
	font-weight: 700;
	line-height: 1.5;
	text-indent: -0.5em;
	@media (width <= 960px) {
		grid-column: 1;
		grid-row: 2;
		margin-top: calc(33 / 375 * 100vw);
		font-size: clamp(1.375rem, 0.25rem + 1.875vw, 2.5rem);
		text-align: center;
		text-indent: 0;
	}
	.color-pink {
		color: var(--color-pink);
	}
	.color-purple {
		color: var(--color-purple);
	}
}
.concept_img {
	position: relative;
	grid-column: 3;
	grid-row: 1/-1;
	margin-top: calc(30 / 1920 * 100vw);
	z-index: 1;
	@media (width <= 960px) {
		grid-column: 1;
		grid-row: 3;
		margin-top: calc(30 / 375 * 100vw);
	}
}
.concept_body {
	grid-column: 5;
	grid-row: 2;
	gap: calc(50 / 1920 * 100vw);
	margin-top: calc(50 / 1920 * 100vw);
	@media (width <= 960px) {
		grid-column: 1;
		grid-row: 5;
		gap: calc(30 / 1920 * 100vw);
		margin-top: 30px;
	}
	.concept_link {
		margin-left: 0;
		@media (width <= 960px) {
			margin-left: auto;
		}
	}
	.btn_wrap {
		margin-top: 50px;
		@media (width <= 960px) {
			margin-top: 30px;
		}
	}
}
.concept_txtArea {
	display: grid;
	gap: 30px;
}
.concept_txt {
	font-size: clamp(0.875rem, 0.75rem + 0.2083vw, 1rem);
	line-height: 2.125;
	@media (width <= 960px) {
		width: calc(325 / 375 * 100vw);
		margin-inline: auto;
		font-size: clamp(0.875rem, 0.75rem + 0.2083vw, 1rem);
		line-height: 1.875;
	}
	&.font-bold {
		font-weight: 700;
	}
}
.concept_message {
	position: relative;
	grid-column: 1/-1;
	grid-row: 3;
	align-self: end;
	justify-self: end;
	width: calc(1120 / 1920 * 100vw);
	margin-top: calc(104 / 1920 * 100vw);
	z-index: 1;
	@media (width <= 960px) {
		grid-column: 1;
		grid-row: 4;
		width: calc(343 / 375 * 100vw);
		margin: calc(10 / 375 * 100vw) auto 0;
	}
}

/* ----------------------------------------------------
office
---------------------------------------------------- */
.office_inner {
	width: 100%;
	margin-top: 80px;
	overflow: hidden;
	@media (width <= 960px) {
		margin-top: 20px;
	}
}
.office_head {
	display: flex;
	align-items: center;
	gap: calc(2.4 * var(--layout-unit));
	padding-left: calc(26 * var(--layout-unit));
	@media (width <= 1600px) {
		align-items: flex-start;
		flex-direction: column;
	}
	@media (width <= 960px) {
		align-items: center;
		padding-left: 0;
	}
}
.office_txtArea {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	max-width: calc(105 * var(--layout-unit));
	gap: calc(1.2 * var(--layout-unit));
	@media (width <= 1600px) {
		max-width: 100%;
	}
	@media (width <= 960px) {
		grid-template-columns: 1fr;
		justify-items: center;
		width: calc(31.5 * var(--layout-unit));
	}
}
.office_ttl {
	position: relative;
	display: grid;
	gap: calc(1.3 * var(--layout-unit));
	@media (width <= 960px) {
		padding-left: 0;
		text-align: center;
	}
	.sec_en {
		position: relative;
		display: inline-block;
		width: calc(41 * var(--layout-unit));
		@media (width <= 960px) {
			width: calc(17.5 * var(--layout-unit));
		}
	}
	.sec_ja {
		display: inline-block;
		padding-left: calc(7.2 * var(--layout-unit));
		font-size: clamp(1.125rem, 0.875rem + 0.4167vw, 1.375rem);
		font-weight: 700;
		line-height: 1;
		@media (width <= 960px) {
			padding-left: 0;
			font-size: clamp(1.125rem, 0.9647rem + 0.6838vw, 1.375rem);
		}
	}
}
.office_txt {
	justify-self: start;
	font-size: clamp(0.875rem, 0.75rem + 0.2083vw, 1rem);
	line-height: 2;
	text-align: left;
	@media (width <= 960px) {
		font-size: clamp(0.875rem, 0.7949rem + 0.3419vw, 1rem);
	}
	.text-half-pl {
		padding-left: 0.5em;
	}
}
.office_head-link {
	@media (width <= 1700px) {
		margin-inline: auto;
		padding-right: calc(26 * var(--layout-unit));
	}
}
.office_slide-container {
	margin-top: 44px;
	padding-inline: calc(26 * var(--layout-unit));
	@media (width <= 960px) {
		padding-inline: 0;
	}
}
.office {
	.swiper {
		overflow: visible;
		@media (width <= 960px) {
			overflow: hidden;
		}
	}
	.swiper-slide {
		position: relative;
		display: grid;
		width: calc(42 * var(--layout-unit));
		@media (width <= 960px) {
			width: calc(32.5 * var(--layout-unit));
		}
	}
	.swiper-pagination {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		width: calc(130 * var(--layout-unit));
		height: calc(0.4 * var(--layout-unit));
		margin: calc(4 * var(--layout-unit)) auto 0;
		border-radius: var(--radius-full);
		background-color: rgba(0, 0, 0, 0.1);
		@media (width <= 960px) {
			width: calc(23.5 * var(--layout-unit));
			margin: calc(5 * var(--layout-unit)) auto calc(2 * var(--layout-unit));
		}
	}
	.swiper-pagination-bullet {
		display: inline-block;
		width: calc(100% / 5);
		height: calc(0.4 * var(--layout-unit));
		cursor: pointer;
		transition: all 0.8s;
		vertical-align: top;
		@media (width <= 960px) {
			width: calc(100% / 7);
		}
	}
	.swiper-pagination-bullet-active {
		border-radius: var(--radius-full);
		background-color: var(--color-base);
	}
	/* buttons */
	.swiper-button-prev,
	.swiper-button-next {
		display: none;
		@media (width <= 960px) {
			position: absolute;
			bottom: 0;
			display: inline-block;
			width: calc(4.3 * var(--layout-unit));
			height: calc(4.3 * var(--layout-unit));
			border-radius: 50%;
			cursor: pointer;
		}
		&::after {
			content: none;
			@media (width <= 960px) {
				content: '';
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
				display: inline-block;
				width: calc(1.4 * var(--layout-unit));
				height: calc(0.9 * var(--layout-unit));
				background: url(../images/common/icon_swiper_arrow.svg) center/cover no-repeat;
			}
		}
		svg {
			display: none;
		}
	}
	.swiper-button-prev {
		@media (width <= 960px) {
			background: linear-gradient(45deg, #713bcc, #933e9d 50%, #cd5792);
			left: calc(1.5 * var(--layout-unit));
		}
	}
	.swiper-button-next {
		@media (width <= 960px) {
			background: linear-gradient(-45deg, #713bcc, #933e9d 50%, #cd5792);
			right: calc(1.5 * var(--layout-unit));
		}
		&::after {
			transform: translate(-50%, -50%) rotate(180deg);
		}
	}
	.slide_imgWrap {
		position: relative;
		padding-top: 33px;
		@media (width <= 960px) {
			width: calc(24.5 * var(--layout-unit));
			margin-inline: auto;
			padding-top: 27px;
		}
	}
	.slide_num {
		position: absolute;
		top: 0;
		left: calc(3.3 * var(--layout-unit));
		color: #713bcc;
		font-family: var(--font-Arial);
		font-size: clamp(3.4375rem, 2.5rem + 1.5625vw, 4.375rem);
		font-weight: 700;
		line-height: 1;
		letter-spacing: -0.04em;
		z-index: 5;
		@media (width <= 960px) {
			top: 0;
			left: calc(1.8 * var(--layout-unit));
			font-size: clamp(3.4375rem, 2.8365rem + 2.5641vw, 4.375rem);
		}
	}
	.slide_figure {
		position: relative;
		border-radius: 30px;
		aspect-ratio: 420/580;
		overflow: hidden;
		z-index: 3;
		@media (width <= 960px) {
			width: calc(24.5 * var(--layout-unit));
			margin-inline: auto;
		}
	}
	.slide_img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}
	.office_recruitment {
		position: absolute;
		bottom: 0;
		left: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: calc(5 * var(--layout-unit));
		color: var(--color-white);
		background: var(--grad);
		font-size: clamp(0.9375rem, 0.75rem + 0.3125vw, 1.125rem);
		font-weight: 700;
		@media (width <= 960px) {
			font-size: clamp(0.9375rem, 0.8173rem + 0.5128vw, 1.125rem);
		}
	}
	.slide_ttl {
		margin-top: calc(3 * var(--layout-unit));
		color: var(--color-base);
		font-size: clamp(1.1875rem, 0.875rem + 0.5208vw, 1.5rem);
		line-height: 1.45;
		text-align: left;
		@media (width <= 960px) {
			margin-top: calc(1.6 * var(--layout-unit));
			padding-inline: calc(2.5 * var(--layout-unit));
			font-size: clamp(1.1875rem, 0.9872rem + 0.8547vw, 1.5rem);
			line-height: 1.63;
		}
	}
	.slide_txt {
		margin-top: calc(1.6 * var(--layout-unit));
		color: var(--color-base);
		font-size: clamp(0.875rem, 0.8125rem + 0.1042vw, 0.9375rem);
		line-height: 1.8;
		text-align: left;
		@media (width <= 960px) {
			padding-inline: calc(2.5 * var(--layout-unit));
			font-size: clamp(0.875rem, 0.8349rem + 0.1709vw, 0.9375rem);
			line-height: 1.85;
		}
	}
}
.office_bottom-link {
	@media (width <= 960px) {
		margin-top: calc(1 * var(--layout-unit));
	}
}
.office_figure {
	margin-top: calc(14 * var(--layout-unit));
	@media (width <= 960px) {
		margin-top: calc(5 * var(--layout-unit));
	}
}

/* ----------------------------------------------------
service
---------------------------------------------------- */
.service {
	width: 100%;
	overflow: hidden;
}
.service_inner {
	position: relative;
	margin-inline: auto;
	padding: 120px 0 70px;
	@media (width <= 960px) {
		padding: 50px 0;
	}
}
.service_ttl {
	position: absolute;
	top: 140px;
	left: calc(172/1920*100vw);
	width: calc(87/1920*100vw);
	@media (width <= 960px) {
		position: relative;
		top: auto;
		left: auto;
		width: 285px;
		margin-inline: auto;
	}
}
.service_contents {
	padding-left: calc(338/1920*100vw);
	@media (width <= 960px) {
		padding-left: 0;
	}
}
/* about */
.service_about {
	padding-right: calc(110/1920*100vw);
	@media (width <= 960px) {
		padding-right: 0;
	}
}
.service_about_txtArea {
	display: flex;
	align-items: center;
	gap: 36px;
	@media (width <= 1400px) {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
	}
	@media (width <= 960px) {
		gap: 20px;
		margin-top: 36px;
		padding-inline: calc(2.5 * var(--layout-unit));
	}
}
.service_about_ttl {
	font-size: clamp(1.875rem, 0.75rem + 1.875vw, 3rem);
	@media (width <= 960px) {
		margin-inline: auto;
		font-size: clamp(1.875rem, 1.1538rem + 3.0769vw, 3rem);
	}
}
.service_about_txt {
	font-size: clamp(0.875rem, 0.75rem + 0.2083vw, 1rem);
	line-height: 2;
	text-align: left;
	@media (width <= 960px) {
		margin-inline: auto;
		font-size: clamp(0.875rem, 0.7949rem + 0.3419vw, 1rem);
		line-height: 1.85;
	}
}
.service_about_box {
	margin-top: 30px;
	border-radius: 40px;
	background: var(--color-pink);
	@media (width <= 960px) {
		margin-inline: auto;
		border-radius: 20px;
	}
}
.service_about_box-inner {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: repeat(2, auto);
	align-content: start;
	justify-content: center;
	gap: 20px;
	max-width: calc(1294/1920*100vw);
	margin-inline: auto;
	padding: 30px 20px;
	@media (width <= 1600px) {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(3, auto);
		max-width: 100%;
	}
	@media (width <= 960px) {
		grid-template-columns: 1fr;
		grid-template-rows: repeat(4, auto);
		width: 92%;
		padding: 40px 15px;
	}
}
.service_about_box-txtArea {
	grid-column: 1;
	grid-row: 1;
	align-self: end;
	max-width: 400px;
	margin-inline: auto;
	@media (width <= 1600px) {
		grid-column: 1/-1;
		text-align: center;
	}
	@media (width <= 960px) {
		text-align: left;
	}
}
.service_about_box-subttl {
	position: relative;
	width: fit-content;
	margin-inline: auto;
	color: var(--color-white);
	font-size: clamp(0.9375rem, 0.625rem + 0.5208vw, 1.25rem);
	font-weight: 700;
	@media (width <= 960px) {
		font-size: clamp(0.9375rem, 0.7372rem + 0.8547vw, 1.25rem);
	}
	&::before,
	&::after {
		position: absolute;
		top: 30%;
		content: '';
		display: inline-block;
		width: 1px;
		height: 60%;
		background: var(--color-white);
	}
	&::before {
		left: -10px;
		transform: rotate(-30deg);
	}
	&::after {
		right: -10px;
		transform: rotate(30deg);
	}
}
.service_about_box-ttl {
	color: var(--color-white);
	font-size: clamp(1.875rem, 1.25rem + 1.0417vw, 2.5rem);
	line-height: 1.5;
	@media (width <= 960px) {
		font-size: clamp(1.875rem, 1.4744rem + 1.7094vw, 2.5rem);
		text-align: center;
	}
}
.service_about_box-txt {
	margin-top: 40px;
	color: var(--color-white);
	font-size: clamp(0.75rem, 0.5rem + 0.4167vw, 1rem);
	font-weight: 700;
	line-height: 2;
	@media (width <= 1600px) {
		margin-top: calc(40/1920*100vw);
	}
	@media (width <= 960px) {
		margin-top: 16px;
		font-size: clamp(0.75rem, 0.5897rem + 0.6838vw, 1rem);
		text-align: center;
	}
}
.service_about_box-link {
	position: relative;
	grid-column: 1;
	grid-row: 2;
	width: min(400px, 100%);
	margin-inline: auto;
	z-index: 1;
	@media (width <= 1600px) {
		grid-column: 1/-1;
		grid-row: 3;
		align-self: end;
		width: fit-content;
	}
	@media (width <= 960px) {
		grid-column: 1;
		grid-row: 4;
	}
	.sec_link {
		margin-left: 0;
		margin-right: auto;
		@media (width <= 1600px) {
			margin-inline: auto;
		}
	}
	.btn {
		margin-inline: 0;
		@media (width <= 960px) {
			margin-inline: auto;
		}
	}
}
.service_about_box-img {
	position: relative;
	grid-column: 1;
	grid-row: 2;
	justify-self: end;
	z-index: 0;
	@media (width <= 1600px) {
		grid-column: 2;
		grid-row: 3;
	}
	@media (width <= 960px) {
		grid-column: 1;
		grid-row: 3;
		justify-self: center;
	}
	img {
		width: calc(35 * var(--layout-unit));
		@media (width <= 960px) {
			width: 164px;
		}
	}
}
.service_about_box-list {
	grid-column: 2/-1;
	grid-row: 1/-1;
	display: grid;
	grid-template-columns: 408fr 200fr 200fr;
	grid-template-rows: repeat(2, 1fr);
	gap: 13px;
	@media (width <= 1600px) {
		grid-column: 1/-1;
		grid-row: 2;
	}
	@media (width <= 960px) {
		grid-column: 1;
		grid-row: 2;
		grid-template-columns: 1fr;
		grid-template-rows: repeat(4, auto);
		margin-inline: auto;
	}
	li {
		padding: calc(1.6 * var(--layout-unit));
		border-radius: 30px;
		background: var(--color-white);
		@media (width <= 960px) {
			border-radius: 20px;
		}
		.ttl {
			display: grid;
			justify-items: center;
			gap: 2px;
			@media (width <= 960px) {
				gap: 7px;
			}
			.ja {
				font-weight: 700;
				line-height: 1.2;
				text-align: center;
			}
			.en {
				color: var(--color-pink);
				font-family: var(--font-Arial);
				font-size: clamp(0.6875rem, 0.5rem + 0.3125vw, 0.875rem);
				font-weight: 700;
				@media (width <= 960px) {
					font-size: clamp(0.6875rem, 0.5673rem + 0.5128vw, 0.875rem);
				}
				/* img {
					width: auto;
					height: 10px;
					@media (width <= 960px) {
						height: 8px;
					}
				} */
			}
		}
		p {
			font-size: clamp(0.8125rem, 0.6875rem + 0.2083vw, 0.9375rem);
			text-align: left;
			@media (width <= 960px) {
				font-size: clamp(0.8125rem, 0.7324rem + 0.3419vw, 0.9375rem);
			}
		}
	}
	li:not(:first-of-type) {
		.img-border {
			border-radius: 20px;
		}
	}
	li:nth-of-type(1) {
		grid-column: 1;
		grid-row: 1/-1;
		display: grid;
		justify-content: center;
		align-content: center;
		padding: 44px 45px 47px;
		@media (width <= 960px) {
			grid-column: 1;
			grid-row: 1;
			padding: 30px 20px;
		}
		img,
		p {
			margin-inline: auto;
			@media (width <= 960px) {
				max-width: calc(27.5 * var(--layout-unit));
			}
		}
		.logo_bt {
			max-width: 314px;
			margin-bottom: 27px;
			padding-bottom: 27px;
			border-bottom: 1px solid #d3b0b0;
			@media (width <= 960px) {
				max-width: 275px;
				margin-bottom: 20px;
				padding-bottom: 20px;
			}
		}
		.ttl {
			gap: 6px;
			@media (width <= 960px) {
				gap: 10px;
			}
			.en {
				margin-top: 0;
			}
			.ja {
				font-size: 22px;
				@media (width <= 960px) {
					font-size: 20px;
				}
			}
		}
		.txt {
			margin-top: 22px;
			line-height: 2;
		}
	}
	li:nth-of-type(2) {
		grid-column: 2/-1;
		grid-row: 1;
		display: grid;
		grid-template-columns: 140fr 196fr;
		align-items: center;
		gap: 18px;
		@media (width <= 960px) {
			grid-column: 1;
			grid-row: 2;
			grid-template-columns: 123fr 145fr;
			gap: 15px;
			padding: 20px 15px;
		}
		.ttl {
			justify-items: start;
		}
		.ttl .ja {
			font-size: 22px;
			@media (width <= 960px) {
				font-size: 20px;
			}
		}
		.txt {
			margin-top: 12px;
			@media (width <= 960px) {
				margin-top: 4px;
			}
		}
	}
	li:nth-of-type(3) {
		grid-column: 2;
		grid-row: 2;
		display: grid;
		grid-template-rows: auto 1fr;
		align-items: center;
		@media (width <= 960px) {
			grid-column: 1;
			grid-row: 3;
			grid-template-columns: 123fr 145fr;
			grid-template-rows: auto;
			gap: 12px;
			padding: 18px 15px 15px;
		}
		.ttl .ja {
			font-size: 19px;
			@media (width <= 960px) {
				font-size: 17px;
			}
		}
	}
	li:nth-of-type(4) {
		grid-column: 3;
		grid-row: 2;
		@media (width <= 960px) {
			grid-column: 1;
			grid-row: 4;
			display: grid;
			grid-template-columns: 123fr 145fr;
			grid-template-rows: auto;
			align-items: center;
			gap: 12px;
			padding: 18px 15px 15px;
		}
	}
	.ttl .ja {
		font-size: 19px;
		@media (width <= 960px) {
			font-size: 17px;
		}
	}
}
/* service common */
.sec_service-ttl {
	font-size: clamp(1.375rem, 0.875rem + 0.8333vw, 1.875rem);
	text-align: left;
	@media (width <= 960px) {
		width: calc(32.5 * var(--layout-unit));
		margin-inline: auto;
		font-size: clamp(1.375rem, 1.0545rem + 1.3675vw, 1.875rem);
		line-height: 1.75;
		text-align: center;
	}
}
.sec_service-txt {
	margin-top: 16px;
	font-size: clamp(0.875rem, 0.75rem + 0.2083vw, 1rem);
	line-height: 2;
	text-align: left;
	@media (width <= 960px) {
		width: calc(32.5 * var(--layout-unit));
		margin: 20px auto 0;
		font-size: clamp(0.875rem, 0.7949rem + 0.3419vw, 1rem);
		line-height: 1.85;
	}
}
.sec_service-slide_container {
	margin-top: 50px;
	@media (width <= 960px) {
		margin-top: 20px;
		overflow: hidden;
	}
	.swiper {
		@media (width <= 960px) {
			overflow: visible;
			padding-inline: calc(1.5 * var(--layout-unit));
		}
	}
}
.sec_service-link {
	margin-top: 35px;
	@media (width <= 960px) {
		margin-top: 20px;
	}
}
.service {
	.swiper-slide {
		width: calc(41 * var(--layout-unit));
		border-radius: 30px;
		background: #f5f7fa;
		overflow: hidden;
		@media (width <= 960px) {
			width: calc(22.7 * var(--layout-unit));
			border-radius: 20px;
		}
	}
	.slide_textArea {
		padding: 20px calc(3 * var(--layout-unit)) 40px;
		@media (width <= 960px) {
			padding: 12px calc(1.5 * var(--layout-unit)) 22px;
		}
	}
	.slide_label {
		display: flex;
		flex-wrap: wrap;
		gap: 4px;
		span {
			display: inline-block;
			padding: clamp(0.25rem, 0rem + 0.4167vw, 0.5rem)
				clamp(0.9375rem, 0.625rem + 0.5208vw, 1.25rem);
			border-radius: var(--radius-full);
			color: var(--color-white);
			font-size: clamp(0.6875rem, 0.5rem + 0.3125vw, 0.875rem);
			font-weight: 700;
			@media (width <= 960px) {
				padding: clamp(0.25rem, 0.0897rem + 0.6838vw, 0.5rem)
					clamp(0.9375rem, 0.7372rem + 0.8547vw, 1.25rem);
				font-size: clamp(0.6875rem, 0.5673rem + 0.5128vw, 0.875rem);
			}
		}
	}
	.service_event {
		.slide_label {
			span {
				background: #a2a2a2;
				&.currentDate {
					background: #cd5692;
				}
			}
		}
		.slide_txt {
			font-weight: 400;
		}
	}
	.service_coupons {
		.slide_label {
			span {
				&.limit {
					background: #da0010;
				}
				&.basic {
					background: #1c3a60;
				}
			}
		}
	}
	.slide_ttl {
		margin-top: 20px;
		color: var(--color-base);
		font-size: clamp(0.875rem, 0.6747rem + 0.8547vw, 1.1875rem);
		font-weight: 700;
		text-align: left;
		@media (width <= 960px) {
			margin-top: 8px;
			font-size: clamp(0.875rem, 0.5625rem + 0.5208vw, 1.1875rem);
		}
	}
	.slide_txt {
		display: -webkit-box;
		overflow: hidden;
		text-overflow: ellipsis;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		margin-top: 20px;
		color: var(--color-base);
		font-size: clamp(0.75rem, 0.375rem + 0.625vw, 1.125rem);
		line-height: 1.72;
		text-align: left;
		@media (width <= 960px) {
			margin-top: 8px;
			font-size: clamp(0.75rem, 0.5096rem + 1.0256vw, 1.125rem);
			line-height: 1.83;
		}
	}
	.swiper-pagination {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		width: calc(130 * var(--layout-unit));
		height: calc(0.4 * var(--layout-unit));
		margin: 40px auto 0;
		border-radius: var(--radius-full);
		background-color: rgba(0, 0, 0, 0.1);
		@media (width <= 960px) {
			width: calc(23.5 * var(--layout-unit));
			margin: calc(5 * var(--layout-unit)) auto calc(2 * var(--layout-unit));
		}
	}
	.swiper-pagination-bullet {
		display: inline-block;
		width: calc(100% / 10);
		height: calc(0.4 * var(--layout-unit));
		cursor: pointer;
		transition: 0.8s;
		vertical-align: top;
	}
	.swiper-pagination-bullet-active {
		border-radius: var(--radius-full);
		background-color: var(--color-base);
	}
	/* buttons */
	.swiper-button-prev,
	.swiper-button-next {
		display: none;
		@media (width <= 960px) {
			position: absolute;
			bottom: calc(-2 * var(--layout-unit));
			display: inline-block;
			width: calc(4.3 * var(--layout-unit));
			height: calc(4.3 * var(--layout-unit));
			border-radius: 50%;
			cursor: pointer;
		}
		&::after {
			content: none;
			@media (width <= 960px) {
				content: '';
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
				display: inline-block;
				width: calc(1.4 * var(--layout-unit));
				height: calc(0.9 * var(--layout-unit));
				background: url(../images/common/icon_swiper_arrow.svg) center/cover no-repeat;
			}
		}
		svg {
			display: none;
		}
	}
	.swiper-button-prev {
		@media (width <= 960px) {
			background: linear-gradient(45deg, #713bcc, #933e9d 50%, #cd5792);
			left: calc(1.5 * var(--layout-unit));
		}
	}
	.swiper-button-next {
		@media (width <= 960px) {
			background: linear-gradient(-45deg, #713bcc, #933e9d 50%, #cd5792);
			right: calc(1.5 * var(--layout-unit));
		}
		&::after {
			transform: translate(-50%, -50%) rotate(180deg);
		}
	}
}
/* event */
.service_event {
	margin-top: 60px;
}

/* coupons */
.service_coupons {
	margin-top: 70px;
}

/* workplace */
.service_workplace {
	position: relative;
	margin-top: 60px;
	padding: 60px 20px;
	margin-right: calc(110 / 1920 * 100vw);
	border-radius: 40px;
	background: url(../images/top/bg_service-workplace.webp) center/cover no-repeat;
	text-align: center;
	overflow: hidden;
	@media (width <= 960px) {
		width: calc(357 / 375 * 100vw);
		margin-inline: auto;
	}
	&::before {
		position: absolute;
		right: 0;
		bottom: 0;
		content: '';
		display: block;
		width: calc(1070 / 1940 * 100vw);
		height: calc(540 / 1940 * 100vw);
		background-image: linear-gradient(
			336deg,
			rgba(113, 59, 204, 1) 0%,
			rgba(147, 62, 157, 1) 10%,
			rgba(205, 87, 146, 0) 50%
		);
		opacity: 0.7;
		z-index: 0;
		@media (width <= 960px) {
			width: calc(357 / 375 * 100vw);
			height: calc(269 / 375 * 100vw);
		}
	}
}
.service_workplace-inner {
	position: relative;
	z-index: 1;
}
.service_workplace_subttl {
	position: relative;
	width: fit-content;
	margin-inline: auto;
	color: var(--color-white);
	font-size: clamp(0.9375rem, 0.625rem + 0.5208vw, 1.25rem);
	font-weight: 700;
	@media (width <= 960px) {
		font-size: clamp(0.9375rem, 0.7372rem + 0.8547vw, 1.25rem);
	}
	&::before,
	&::after {
		position: absolute;
		top: 30%;
		content: '';
		display: inline-block;
		width: 1px;
		height: 60%;
		background: var(--color-white);
	}
	&::before {
		left: -10px;
		transform: rotate(-30deg);
	}
	&::after {
		right: -10px;
		transform: rotate(30deg);
	}
}
.service_workplace_ttl {
	color: var(--color-white);
	font-size: clamp(1.875rem, 1.25rem + 1.0417vw, 2.5rem);
	line-height: 1.5;
	@media (width <= 960px) {
		margin-top: 4px;
		font-size: clamp(1.875rem, 1.4744rem + 1.7094vw, 2.5rem);
		line-height: 1.26;
	}
}
.service_workplace_txt {
	margin-top: 40px;
	color: var(--color-white);
	font-size: clamp(0.75rem, 0.5rem + 0.4167vw, 1rem);
	font-weight: 700;
	line-height: 2;
	@media (width <= 960px) {
		margin-top: 16px;
		font-size: clamp(0.75rem, 0.5897rem + 0.6838vw, 1rem);
		line-height: 1.83;
	}
}
.service_workplace_list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	justify-content: center;
	gap: 30px;
	max-width: 1284px;
	margin: 50px auto 0;
	list-style: none;
	@media (width <= 1200px) {
		grid-template-columns: 1fr;
	}
	@media (width <= 960px) {
		margin-top: 20px;
	}
	.service_workplace_link {
		display: block;
		width: 100%;
		height: 100%;
		padding: calc(6.2 * var(--layout-unit)) calc(4.7 * var(--layout-unit));
		border-radius: 30px;
		background: var(--color-white);
		color: inherit;
		transition: opacity 0.6s;
		@media (width <= 960px) {
			padding: 25px 30px;
		}
		&:hover {
			@media (hover: hover) {
				opacity: 0.7;
			}
		}
	}
	img {
		width: 280px;
		margin-inline: auto;
		@media (width <= 1200px) {
			margin-inline: 0;
		}
		@media (width <= 960px) {
			margin-inline: auto;
		}
	}
	h4 {
		margin-top: 28px;
		font-size: clamp(1.125rem, 0.875rem + 0.4167vw, 1.375rem);
		line-height: 1.45;
		text-align: center;
		@media (width <= 960px) {
			margin-top: 20px;
			font-size: clamp(1.125rem, 0.9647rem + 0.6838vw, 1.375rem);
		}
	}
	p {
		margin-top: 20px;
		font-size: clamp(0.8125rem, 0.6875rem + 0.2083vw, 0.9375rem);
		line-height: 2;
		text-align: left;
		@media (width <= 960px) {
			font-size: clamp(0.8125rem, 0.7324rem + 0.3419vw, 0.9375rem);
		}
	}
}
.service_workplace-subttl {
	@media (width <= 1200px) {
		display: flex;
	}
	@media (width <= 960px) {
		flex-direction: column;
	}
}

/* ----------------------------------------------------
media
---------------------------------------------------- */
.media_inner {
	display: grid;
	grid-template-columns: 712fr 808fr;
	gap: calc(8 * var(--layout-unit));
	width: min(1600px, 100%);
	margin-inline: auto;
	padding: 125px calc(2 * var(--layout-unit)) 0;
	@media (width <= 960px) {
		grid-template-columns: 1fr;
		padding: 50px 0 0;
		gap: calc(4 * var(--layout-unit));
	}
}
.youtube {
	display: grid;
	gap: calc(5 * var(--layout-unit));
	@media (width <= 960px) {
		gap: calc(2 * var(--layout-unit));
		width: 92%;
		margin-inline: auto;
	}
}
.youtube_head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	@media (width <= 960px) {
		flex-direction: column;
		gap: calc(1.8 * var(--layout-unit));
	}
}
.youtube_ttl-img {
	width: clamp(10.625rem, 9.375rem + 2.0833vw, 11.875rem);
	@media (width <= 960px) {
		width: clamp(10.625rem, 9.8237rem + 3.4188vw, 11.875rem);
	}
}
.youtube_link {
	position: relative;
	display: flex;
	align-items: center;
	gap: calc(1 * var(--layout-unit));
	color: var(--color-base);
	font-size: clamp(0.875rem, 0.625rem + 0.4167vw, 1.125rem);
	font-weight: 700;
	@media (width <= 960px) {
		font-size: clamp(0.875rem, 0.7147rem + 0.6838vw, 1.125rem);
	}
	&:hover {
		.textLink-LR::after {
			@media (hover: hover) {
				transform: scaleX(1);
			}
		}
		.icon-arrow-right {
			svg {
				@media (hover: hover) {
					.circle {
						fill: #000;
					}
					.arrow {
						fill: var(--color-white);
					}
				}
			}
		}
	}
	.textLink-LR {
		position: relative;
		display: inline-block;
		color: var(--color-base);
		@media (width <= 960px) {
			text-decoration: underline;
		}
		&::after {
			content: '';
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 1px;
			background-color: var(--color-base);
			transition: transform 0.6s;
			transform: scaleX(0);
			transform-origin: left top;
		}
	}
	.icon-arrow-right {
		display: flex;
		align-items: center;
		pointer-events: none;
		svg {
			pointer-events: none;
		}
	}
}
.youtube_body-container {
	display: grid;
	gap: calc(3 * var(--layout-unit));
	@media (width <= 960px) {
		gap: calc(1 * var(--layout-unit));
	}
}
.youtube_body-item {
	img {
		border-radius: 20px;
	}
}
.youtube_body-link {
	transition: opacity 0.4;
	&:hover {
		@media (hover: hover) {
			opacity: 0.7;
		}
	}
}
.instagram {
	position: relative;
	display: grid;
	align-content: center;
	justify-content: center;
	gap: calc(2 * var(--layout-unit));
	height: 100%;
	padding: 68px 0;
	border-radius: 20px;
	background-color: #efdfed;
	@media (width <= 960px) {
		width: 100%;
		padding: 40px 0;
		border-radius: 20px 20px 0 0;
	}
	&::before {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		content: '';
		display: inline-block;
		width: 85%;
		height: 48%;
		background: url(../images/top/icon_symbol-pc.svg) center/contain no-repeat;
		z-index: 0;
		@media (width <= 960px) {
			width: 94%;
			height: 75%;
			background: url(../images/top/icon_symbol-sp.svg) center/contain no-repeat;
		}
	}
}
.instagram_head {
	width: 66%;
	margin-inline: auto;
	@media (width <= 960px) {
		width: 92%;
	}
}
.instagram_ttl {
	position: relative;
}
.instagram_link {
	position: relative;
	display: inline-block;
	width: 100%;
	border-radius: var(--radius-full);
	overflow: hidden;
	&::before {
		position: absolute;
		top: 50%;
		left: -1px;
		transform: scaleX(0) translateY(-50%);
		transform-origin: center left;
		transition: transform 0.4s;
		content: '';
		display: block;
		width: calc(100% + 2px);
		height: calc(100% + 2px);
		border-radius: var(--radius-full);
		background-image: var(--grad);
		opacity: 0;
		z-index: 0;
	}
	&::after {
		position: absolute;
		top: 50%;
		left: 0;
		transform: scaleX(0.3) translateY(-50%);
		transform-origin: center left;
		transition: transform 0.4s;
		content: '';
		display: block;
		width: 100%;
		height: 100%;
		border-radius: var(--radius-full);
		background: rgba(307, 7, 94, 0.02);
		opacity: 0;
		z-index: 2;
	}
	&:hover {
		@media (hover: hover) {
			&::before,
			&::after {
				transform: scaleX(1) translateY(-50%);
				opacity: 1;
			}
		}
	}
}
.instagram_link-inner {
	position: relative;
	display: flex;
	align-items: center;
	gap: calc(3 * var(--layout-unit));
	padding: 8px;
	border-radius: var(--radius-full);
	background: var(--color-white);
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	margin: 1px;
	color: var(--color-base);
	font-family: var(--font-Beirut);
	font-size: clamp(0.8125rem, 0.5625rem + 0.4167vw, 1.0625rem);
	font-weight: 400;
	z-index: 1;
	@media (width <= 960px) {
		flex-direction: column;
		gap: 4px;
		padding: 10px;
		font-size: clamp(0.8125rem, 0.6522rem + 0.6838vw, 1.0625rem);
	}
}
.instagram_link-icon {
	width: 75px;
	@media (width <= 960px) {
		width: 49px;
	}
}
.instagram_link-ttl {
	/* width: 64%;
	max-width: 343px; */
	font-family: var(--font-Arial);
	font-size: clamp(0.8125rem, 0.5625rem + 0.4167vw, 1.0625rem);
	font-weight: 700;
	@media (width <= 960px) {
		/* width: 76%;
		max-width: 263px; */
		font-size: clamp(0.8125rem, 0.6522rem + 0.6838vw, 1.0625rem);
		margin-top: 8px;
	}
}
.instagram_body {
	position: relative;
	grid-row: 1;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
	width: 66%;
	margin-inline: auto;
	overflow: hidden;
	z-index: 1;
	@media (width <= 960px) {
		grid-row: 2;
		width: 84%;
	}
	.feed-card-inner {
		display: grid;
		place-items: center;
		border-radius: 10px;
		background-color: var(--color-base);
		aspect-ratio: 1/1;
		overflow: hidden;
		img,
		video {
			width: 100%;
			height: auto;
			object-fit: contain;
			object-position: center;
		}
	}
}