@charset "utf-8";

*,*::before,*::after{box-sizing:border-box;}
body,h1,h2,h3,h4,p,ul,ol,li,figure,figcaption,blockquote,dl,dd{margin:0;}
ul,ol{list-style:none;padding:0;}
a{color:inherit;text-decoration:inherit;text-decoration-skip-ink:auto;}
img,svg,video,iframe{vertical-align:middle;}
img,video{max-width:100%;}
input,button,textarea,select{font:inherit;}
@media (prefers-reduced-motion:reduce){*{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important;}}
html {
	/*scroll-behavior: smooth;*/
	font-size: 62.5%;
}
body {
	color: #141414;
	font-size: 1.6em;
	line-height: 2;
	font-family: Roboto, "Noto Sans JP", sans-serif;
	font-weight: 500;
	font-style: normal;
	font-feature-settings: "pkna";
	text-rendering: optimizeLegibility;
}
figure img {
	max-width: 100%;
}
@media screen and (min-width: 768px) {
	.v-mb { display: none; }
}
@media screen and (max-width: 767px) {
	.v-dt { display: none; }
}
.visually-hidden {
	position: absolute;
	overflow: hidden;
	width: 1px;
	height: 1px;
	clip: rect(0,0,0,0);
}


/**
 * header
 -------------------------------------------------- */
.l-header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	padding: 50px;
}
.l-header .logo {
	line-height: 0;
}
.l-header .logo img {
	width: auto;
	height: 30px;
}
.l-header .logo .intage img {
	height: 34px;
}
.l-header .logo .mimicry {
	margin-left: 32px;
}
@media screen and (max-width: 767px) {
	.l-header {
		padding: 20px;
	}
	.l-header .logo img {
		height: 22px;
	}
	.l-header .logo .mimicry {
		margin-left: 8px;
	}
}


/**
 * menu button
 -------------------------------------------------- */
.menu-button {
	cursor: pointer;
	z-index: 3;
	position: fixed;
	overflow: hidden;
	top: 40px;
	right: 40px;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 0;
	color: white;
	background: none;
	mix-blend-mode: difference;
}
@media all and (-ms-high-contrast: none) {
	.menu-button {
		color: black;
	}
}
.menu-button:focus {
	outline: transparent;
}
.menu-button::before,
.menu-button::after {
	content: "";
}
.menu-button::before,
.menu-button::after,
.menu-button .bar {
	position: absolute;
	top: calc(50% - 1px);
	left: 9px;
	width: 30px;
	border-top: 3px solid currentcolor;
}
.menu-button::before {
	transform: translateY(-12px);
}
.menu-button::after {
	transform: translateY(12px);
}
/* before/after */
.menu-button.is-active {
	color: white;
}
.menu-button.is-active::before {
	transform: rotate(45deg);
}
.menu-button.is-active::after {
	transform: rotate(-45deg);
}
.menu-button.is-active .bar {
	transform: translateX(48px);
}
/* timing */
.menu-button.anima {
	transition: color .4s;
}
.menu-button.anima::before,
.menu-button.anima::after,
.menu-button.anima .bar {
	transition: transform .4s cubic-bezier(0.87, 0, 0.13, 1);
}
.menu-button.anima:not(.is-active) .bar {
	transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
}
@media screen and (max-width: 767px) {
	.menu-button {
		top: 20px;
		right: 20px;
		width: 24px;
		height: 24px;
	}
	.menu-button::before,
	.menu-button::after,
	.menu-button .bar {
		left: 4px;
		width: 16px;
		border-top: 1px solid currentcolor;
	}
	.menu-button::before {
		transform: translateY(-6px);
	}
	.menu-button::after {
		transform: translateY(6px);
	}
}


/**
 * menu
 -------------------------------------------------- */
.l-menu {
	z-index: 2;
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	color: white;
	white-space: nowrap;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.menu_overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(20,20,20,.1);
}
.menu_content {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: calc(100% + 20px);
	max-width: 360px;
	height: 100%;
	margin-left: auto;
	margin-right: -40px;
	padding: 50px;
	padding-right: 90px;
	background: #141414;
}
@media screen and (max-width: 767px) {
	.menu_content {
		padding: 0 50px 25px;
	}
}

.l-menu .menu_list {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	position: relative;
	height: 100%;
}
.l-menu .menu_list li {
	margin-top: 16px;
	line-height: 1.4;
}
.l-menu .menu_list a {
	display: block;
	padding: 8px;
}
.l-menu .menu_list .en {
	font-size: 2.1rem;
	font-family: acumin-pro, sans-serif;
	font-weight: 700;
}
.l-menu .menu_list .ja {
	display: block;
	font-size: 1.1rem;
}
.l-menu .menu_list .ico {
	display: inline-block;
	position: relative;
	width: 13px;
	height: 13px;
	margin-left: 12px;
	border-radius: 12px;
	background: white;
}
.l-menu .menu_list .ico::before,
.l-menu .menu_list .ico::after {
	content: "";
	position: absolute;
	width: 7px;
	height: 7px;
	top: calc(50% - 3.5px);
	left: calc(50% - 3.5px);
	background: url(../img/menu.svg) center / cover no-repeat;
	transition: transform .4s cubic-bezier(0.87, 0, 0.13, 1);
}
.l-menu .menu_list .ico::before {
	transform: translateY(-12px);
}
.l-menu .menu_list a:hover .ico::before {
	transform: none;
}
.l-menu .menu_list a:hover .ico::after {
	transform: translateY(12px);
}
.l-menu .menu_link {
	display: flex;
	justify-content: space-between;
	position: relative;
	font-size: 1.3rem;
	font-family: Helvetica, sans-serif;
	font-weight: bold;
	letter-spacing: .05em;
}
.l-menu .menu_link a {
	display: block;
	padding: 8px;
}
.l-menu .menu_link a::after {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: -1px 0 0 4px;
	background: url(../img/link.svg) center / cover no-repeat;
	vertical-align: middle;
}
/* before/after */
.l-menu:not(.is-active) {
	pointer-events: none;
}
.l-menu:not(.is-active) .menu_overlay {
	opacity: 0;
}
.l-menu:not(.is-active) .menu_content {
	transform: translateX(100%) translateX(-40px);
}
/* timing */
.l-menu.anima .menu_overlay {
	transition: opacity .4s;
}
.l-menu.anima .menu_content {
	transition: transform .4s cubic-bezier(0.87, 0, 0.13, 1);
}
.l-menu.anima:not(.is-active) .menu_content {
	transition-timing-function: cubic-bezier(0.87, 0, 0.13, 1);
}


/**
 * main
 -------------------------------------------------- */
.l-main {
	z-index: 1;
	position: relative;
	overflow: hidden;
	padding: 0 20px;
}


/**
 * visual
 -------------------------------------------------- */
.p-visual {
	position: relative;
	overflow: hidden;
	width: 100vw;
	height: 100vh;
	min-height: 800px;
	margin: 0 -20px;
}

.p-visual .o-title {
	position: absolute;
	top: calc(50% - 55px - 1em);
	left: 96px;
}
.p-visual .o-title .en {
	font-size: 1rem;
}
.p-visual .o-title .ja {
	font-size: 2.1rem;
	font-weight: 700;
	text-indent: -.65em;
}
.p-visual .o-title span {
	display: block;
}
@media screen and (max-width: 1279px) {
	.p-visual .o-title {
		left: 48px;
	}
}
@media screen and (max-width: 1279px) and (min-width: 768px) {
	.p-visual .o-title .en img {
		width: calc(624 / 1280 * 100vw);
		height: calc(110 / 1280 * 100vw);
	}
}
@media screen and (max-width: 767px) {
	.p-visual .o-title {
		top: 20vh;
		left: 40px;
		width: calc(100% - 80px);
	}
}
@media screen and (max-width: 480px) {
	.p-visual .o-title .ja {
		font-size: 1.4rem;
	}
}
@media screen and (max-width: 374px) {
	.p-visual .o-title {
		left: 20px;
		width: calc(100% - 40px);
	}
}

@media screen and (min-width: 768px) {
	.visual_scroll {
		display: flex;
		flex-direction: column;
		align-items: center;
		position: absolute;
		bottom: 12%;
		right: calc(100% - 96px);
		font-size: 1.3rem;
		font-weight: 500;
		transform-origin: 100% 100%;
	}
	.visual_scroll .txt {
		position: absolute;
		right: 50%;
		bottom: 100%;
		transform-origin: 100% 50%;
		transform: rotate(90deg);
	}
	.visual_scroll .ico {
		position: relative;
		overflow: hidden;
		width: 34px;
		height: 34px;
		border-radius: 34px;
		color: white;
		background: black;
	}
	.visual_scroll .arr {
		fill: none;
		stroke: currentcolor;
	}
	.visual_scroll .arr.a1 {
		position: absolute;
		top: calc(50% - 5px);
		left: 50%;
		stroke-width: 2;
		transform: translateX(-50%);
	}
	.visual_scroll .arr.a2 {
		position: absolute;
		top: calc(50% - 10px);
		left: calc(50% - 6px);
		stroke-width: 1;
		transform: translateY(-34px);
	}
}
@media (hover: hover) {
	.visual_scroll.hov .txt {
		transform: rotate(90deg) translateX(-16px);
	}
	.visual_scroll.hov .ico {
		transform: scale(2);
	}
	.visual_scroll.hov .arr.a1 {
		transform: translate(-50%, 34px);
	}
	.visual_scroll.hov .arr.a2 {
		transform: none;
	}
	.visual_scroll.anima .txt {
		transition: transform .4s cubic-bezier(0.65, 0, 0.35, 1);
		will-change: transform;
	}
	.visual_scroll.anima .ico {
		transition: transform .4s cubic-bezier(0.65, 0, 0.35, 1);
	}
	.visual_scroll.anima .arr {
		transition: transform .4s cubic-bezier(0.87, 0, 0.13, 1);
	}
}
@media screen and (max-width: 767px) {
	.visual_scroll {
		display: none;
	}
}

.visual_frame {
	position: absolute;
	background: #f3f3f3;
}
@media screen and (min-width: 768px) {
	.visual_frame.f1 {
		top: 0;
		left: calc(375 / 1280 * 100vw);
		width: calc(373 / 1280 * 100vw);
		height: 233px;
	}
	.visual_frame.f2 {
		top: 140px;
		right: calc(-28 / 1280 * 100vw);
		width: calc(506 / 1280 * 100vw);
		height: 512px;
	}
	.visual_frame.f3 {
		bottom: 0;
		left: calc(202 / 1280 * 100vw);
		width: calc(373 / 1280 * 100vw);
		height: 235px;
	}
}
@media screen and (min-height: 800px) and (min-width: 768px) {
	.visual_frame.f1 {
		height: calc(233 / 800 * 100vh);
	}
	.visual_frame.f2 {
		top: calc(140 / 800 * 100vh);
		height: calc(512 / 800 * 100vh);
	}
	.visual_frame.f3 {
		height: calc(235 / 800 * 100vh);
	}
}
@media screen and (max-width: 767px) {
	.visual_frame {
		top: 50vh;
		left: 40px;
		width: calc(100% - 40px);
		height: 50vh;
	}
}

.visual_frame figure {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.visual_frame.f1 figure {
	align-items: flex-start;
}
.visual_frame.f3 figure {
	align-items: flex-end;
}

.visual_frame .spacer {
	display: block;
}
.visual_frame.f1 .spacer {
	width: calc(100% - 48px);
	margin-top: 16px;
}
.visual_frame.f2 .spacer {
	width: calc(100% + 40px);
	margin-left: -40px;
}
.visual_frame.f3 .spacer {
	width: calc(100% - 24px);
	margin-bottom: 24px;
}
.visual_frame.f2 img {
	width: 100%;
	transform: scaleX(-1)
}
@media screen and (min-width: 768px) {
	.visual_frame.f1 .spacer {
		margin-top: calc(16 / 1280 * 100vw);
	}
	.visual_frame.f2 .spacer {
		margin-left: calc(-40 / 1280 * 100vw);
	}
	.visual_frame.f3 .spacer {
		margin-bottom: calc(24 / 1280 * 100vw);
	}
}
@media screen and (max-width: 767px) {
	.visual_frame.f2,
	.visual_frame.f3 {
		display: none;
	}
}
/* before/after */
.visual_frame .item {
	opacity: 0;
	transform: translateX(-40px);
}
.visual_frames.v1 .f1 .i1,
.visual_frames.v1 .f2 .i2,
.visual_frames.v1 .f3 .i3,
.visual_frames.v2 .f1 .i2,
.visual_frames.v2 .f2 .i3,
.visual_frames.v2 .f3 .i1,
.visual_frames.v3 .f1 .i3,
.visual_frames.v3 .f2 .i1,
.visual_frames.v3 .f3 .i2 {
	opacity: 1;
	transform: none;
}
.visual_frames.v1 .f1 .i3,
.visual_frames.v1 .f2 .i1,
.visual_frames.v1 .f3 .i2,
.visual_frames.v2 .f1 .i1,
.visual_frames.v2 .f2 .i2,
.visual_frames.v2 .f3 .i3,
.visual_frames.v3 .f1 .i2,
.visual_frames.v3 .f2 .i3,
.visual_frames.v3 .f3 .i1 {
	transform: translateX(40px);
}
.visual_frame .item.is-anima {
	transition: opacity 1s, transform 1s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}
.visual_frame.f1 .item.is-anima {
	transition-delay: .1s;
}
.visual_frame.f2 .item.is-anima {
	transition-delay: .2s;
}
.visual_frames.v1 .f1 .i3.is-anima,
.visual_frames.v1 .f2 .i1.is-anima,
.visual_frames.v1 .f3 .i2.is-anima,
.visual_frames.v2 .f1 .i1.is-anima,
.visual_frames.v2 .f2 .i2.is-anima,
.visual_frames.v2 .f3 .i3.is-anima,
.visual_frames.v3 .f1 .i2.is-anima,
.visual_frames.v3 .f2 .i3.is-anima,
.visual_frames.v3 .f3 .i1.is-anima {
	transition-duration: .6s;
}


/**
 * section
 -------------------------------------------------- */
.l-section {
	max-width: 960px;
	margin: 0 auto;
	padding-top: 20px;
}

/* :::::: title :::::: */
.o-title {
	display: inline-block;
	line-height: 1.4;
}
.o-title span {
	display: block;
}
.o-title .en {
	font-size: 9.6rem;
	line-height: .9;
	font-family: acumin-pro, sans-serif;
	font-weight: 700;
	letter-spacing: .02em;
}
.o-title .ja {
	margin-top: 16px;
	font-size: 1.3rem;
	font-weight: 500;
}
@media screen and (max-width: 767px) {
	.o-title .en {
		font-size: 8rem;
	}
	.o-title .ja {
		margin-top: 12px;
	}
}
@media screen and (max-width: 480px) {
	.o-title .en {
		font-size: 6.4rem;
	}
	.o-title .ja {
		font-size: 1.1rem;
	}
}
@media screen and (max-width: 374px) {
	.o-title .en {
		font-size: calc(64 / 374 * 100vw);
	}
}

/* inview */
html:not(.isTouch) .o-title.js-inview:not(.is-inview) > * {
	opacity: 0;
	transform: translateX(-40px);
}
html:not(.isTouch) .p-team .o-title.js-inview:not(.is-inview) > *,
html:not(.isTouch) .p-contact .o-title.js-inview:not(.is-inview) > * {
	transform: translateY(40px);
}
html:not(.isTouch) .o-title.js-inview.is-anima > * {
	transition: opacity .6s, transform 1s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}
html:not(.isTouch) .o-title.js-inview.is-anima .ja {
	transition-delay: .1s;
}
html:not(.isTouch) .p-visual .o-title.js-inview.is-anima .en { transition-delay: .5s; }
html:not(.isTouch) .p-visual .o-title.js-inview.is-anima .ja { transition-delay: .6s; }


/**
 * About
 -------------------------------------------------- */
.p-about {
	margin-top: 120px;
}
.p-about .o-title {
	margin-bottom: -28px;
}
.about_content {
	position: relative;
}
.about_content figure {
	position: relative;
}
.about_content .rect {
	z-index: -1;
	position: absolute;
	top: -40px;
	right: 19%;
	bottom: -40px;
	left: calc(50% - 50vw);
	background: #f3f3f3;
}
.about_content p {
	font-size: 2.1rem;
}
@media screen and (min-width: 768px) {
	.p-about {
		display: flex;
		flex-wrap: wrap;
	}
	.p-about .o-title {
		flex-basis: 100%;
	}
	.about_content {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.about_content figure {
		left: -20px;
		width: 578px;
	}
	.about_content p {
		max-width: 360px;
	}
}
@media screen and (min-width: 1000px) {
	.about_content figure {
		left: -40px;
	}
}
@media screen and (max-width: 767px) {
	.about_content .rect {
		top: -48px;
		right: 25%;
		bottom: 12%;
	}
	.about_content figure {
		max-width: 600px;
		margin: 0 auto;
	}
	.about_content p {
		margin-top: 10px;
		padding: 0 10px
	}
}
@media screen and (max-width: 480px) {
	.about_content p {
		font-size: 1.8rem;
	}
}

/* inview */
html:not(.isTouch) .about_content.js-inview:not(.is-inview) figure,
html:not(.isTouch) .about_content.js-inview:not(.is-inview) .rect,
html:not(.isTouch) .about_content.js-inview:not(.is-inview) p {
	opacity: 0;
	transform: translateX(-40px);
}
html:not(.isTouch) .about_content.js-inview.is-anima figure,
html:not(.isTouch) .about_content.js-inview.is-anima .rect,
html:not(.isTouch) .about_content.js-inview.is-anima p {
	transition: opacity 1s, transform 1s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}
html:not(.isTouch) .about_content.js-inview.is-anima figure { transition-delay: .1s; }
html:not(.isTouch) .about_content.js-inview.is-anima p { transition-delay: .2s; }


/**
 * Steps
 -------------------------------------------------- */
.p-steps {
	max-width: 1080px;
	margin-top: 120px;
}
.p-steps .o-title {
	float: right;
	margin-bottom: 40px;
	text-align: right;
}
.p-steps .o-title .ja {
	margin-top: 24px;
	padding-right: 1em;
}
@media screen and (max-width: 480px) {
	.p-steps .o-title {
		margin-bottom: 72px;
	}
	.p-steps .o-title .ja {
		margin-top: 16px;
	}
}

/* :::::: man:::::: */
.p-steps .man {
	position: absolute;
	bottom: calc(100% + 32px);
	left: 0;
}

/* :::::: flow :::::: */
.steps_flow {
	clear: right;
	position: relative;
}
.steps_step {
	position: relative;
	padding: 64px;
	color: white;
}
.steps_step.s1 {
	transform: translateY(-40px);
}
.steps_step.s2 {
	color: inherit;
	transform: translateY(1px);
}
.steps_step.s3 {
	transform: translateY(40px);
}
.steps_arrow {
	z-index: 1;
	position: absolute;
	mix-blend-mode: difference;
	pointer-events: none;
}
.steps_step .rect {
	z-index: -1;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 100%;
	background: #141414;
}
.steps_step.s2 .rect {
	background: #f3f3f3;
}
@media screen and (min-width: 768px) {
	.steps_flow {
		display: flex;
		justify-content: space-between;
	}
	.steps_step {
		flex-basis: 33.33333%;
	}
	.steps_step.s1 .rect {
		right: -20px;
		transform: rotate(-6.07deg);
	}
	.steps_step.s2 .rect {
		right: -20px;
		transform: rotate(-1.24deg);
	}
	.steps_step.s3 .rect {
		left: -20px;
		transform: rotate(3.69deg);
	}
	.steps_arrow.a1 {
		top: calc(50% - 40px);
		left: 30%;
	}
	.steps_arrow.a2 {
		top: calc(50% + 20px);
		right: 30%;
	}
}
@media screen and (max-width: 1000px) {
	.steps_step {
		padding: 48px 56px;
	}
}
@media screen and (max-width: 767px) {
	.steps_step.s1 {
		left: -32px;
	}
	.steps_step.s2  {
		margin-top: -64px;
	}
	.steps_step.s3  {
		right: -32px;
		margin-top: -48px;
	}
	.steps_step.s1 .rect {
		transform: rotate(-6.07deg);
	}
	.steps_step.s2 .rect {
		transform: rotate(3.03deg);
	}
	.steps_step.s3 .rect {
		transform: rotate(5.13deg);
	}
	.steps_arrow {
		transform: rotate(60deg);
	}
	.steps_arrow.a1 {
		top: calc(30% + 20px);
		right: 30%;
	}
	.steps_arrow.a2 {
		bottom: calc(30% + 10px);
		right: 20%;
	}
	.steps_arrow::after {
		content: "";
		display: block;
		width: 75px;
		height: 30px;
		background: url(../img/step_arrow1.svg) center / cover no-repeat;
	}
	.steps_arrow img {
		display: none;
	}
}
@media screen and (max-width: 480px) {
	.steps_arrow.a1 {
		right: 10%;
	}
	.steps_arrow.a2 {
		right: 0;
	}
}
@media screen and (max-width: 374px) {
	.steps_step {
		padding: 40px;
	}
	.steps_arrow::after {
		width: calc(75 / 375 * 100vw);
		height: calc(30 / 375 * 100vw);
	}
}

/* inview */
html:not(.isTouch) .steps_flow.js-inview:not(.is-inview) .man {
	opacity: 0;
	transform: translateY(100%) translateY(40px);
}
html:not(.isTouch) .steps_flow.js-inview:not(.is-inview) .steps_step {
	opacity: 0;
}
.html:not(.isTouch) steps_flow.js-inview:not(.is-inview) .steps_arrow {
	opacity: 0;
	transform: scale(1.5);
}
html:not(.isTouch) .steps_flow.js-inview:not(.is-inview) .steps_step.s1 {
	transform: translate(-120px, -40px) rotate(-10deg);
}
html:not(.isTouch) .steps_flow.js-inview:not(.is-inview) .steps_step.s2 {
	transform: translate(-100px, 0) rotate(-10deg);
}
html:not(.isTouch) .steps_flow.js-inview:not(.is-inview) .steps_step.s3 {
	transform: translate(-80px, 40px) rotate(-10deg);
}
html:not(.isTouch) .steps_flow.js-inview.is-anima .man {
	transition: opacity 0s .9s, transform .6s .9s cubic-bezier(0.34, 1.56, 0.64, 1);
	will-change: opacity, transform;
}
html:not(.isTouch) .steps_flow.js-inview.is-anima .steps_step {
	transition: opacity .8s, transform .8s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}
html:not(.isTouch) .steps_flow.js-inview.is-anima .steps_step.s1 { transition-delay: .1s; }
html:not(.isTouch) .steps_flow.js-inview.is-anima .steps_step.s2 { transition-delay: .2s; }
html:not(.isTouch) .steps_flow.js-inview.is-anima .steps_step.s3 { transition-delay: .3s; }
html:not(.isTouch) .steps_flow.js-inview.is-anima .steps_arrow {
	transition: opacity .4s, transform .4s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}
html:not(.isTouch) .steps_flow.js-inview.is-anima .steps_arrow.a1 { transition-delay: .7s; }
html:not(.isTouch) .steps_flow.js-inview.is-anima .steps_arrow.a2 { transition-delay: .8s; }

/* :::::: figure :::::: */
.steps_flow figure {
	display: block;
	position: relative;
}
.steps_flow figure .spacer {
	display: flex;
	justify-content: center;
	align-items: flex-end;
}
.steps_flow figure .spacer,
.steps_flow dl,
.steps_flow dd {
	margin-top: 16px;
}
.steps_flow figcaption {
	font-size: 2.1rem;
	line-height: 1.4;
}
.steps_flow dt {
	font-size: 1.8rem;
	line-height: 1.4;
}
.steps_flow dd {
	font-size: 1.5rem;
}
@media screen and (max-width: 767px) {
	.steps_flow figure .spacer {
		width: 80%;
		margin: 16px auto 0;
	}
	.steps_flow figure img {
		width: 100%;
	}
}
@media screen and (max-width: 480px) {
	.steps_flow figure .spacer {
		width: 100%;
	}
	.steps_flow figcaption {
		font-size: 1.4rem;
	}
	.steps_flow figcaption b {
		font-size: 1.8rem;
	}
	.steps_flow dt {
		font-size: 1.6rem;
	}
	.steps_flow dd {
		font-size: 1.4rem;
	}
}


/**
 * Service Package
 -------------------------------------------------- */
.p-service {
	margin-top: 160px;
}
.p-service .o-title .ja {
	text-indent: .5em;
}
.rf {
	font-family: Helvetica, sans-serif;
	font-weight: bold;
}
.rf .s {
	font-weight: normal;
}

/* :::::: anchor :::::: */
.service_anchor {
	margin-top: 40px;
}
.service_anchor li {
	counter-increment: num;
}
.service_anchor a {
	display: flex;
	flex-direction: column;
}
.service_anchor figure {
	position: relative;
	width: 100%;
}
.service_anchor figure::before {
	content: '0'counter(num);
	position: absolute;
	top: 0;
	left: 0;
	color: #e4e4e4;
	font-size: 4.8rem;
	line-height: 1;
	font-family: Helvetica, sans-serif;
	font-weight: 700;
}
.service_anchor dt {
	margin-top: 12px;
	font-size: 2.1rem;
}
.service_anchor dd {
	margin-top: 8px;
	font-size: 1.3rem;
	font-weight: 700;
}
.service_anchor .ico {
	align-self: center;
	position: relative;
	overflow: hidden;
	width: 34px;
	height: 34px;
	border-radius: 34px;
	color: white;
	background: black;
}
.service_anchor .arr {
	fill: none;
	stroke: currentcolor;
}
.service_anchor .arr.a1 {
	position: absolute;
	top: calc(50% - 5px);
	left: 50%;
	stroke-width: 2;
	transform: translateX(-50%);
}
.service_anchor .arr.a2 {
	position: absolute;
	top: calc(50% - 10px);
	left: calc(50% - 6px);
	stroke-width: 1;
	transform: translateY(-34px);
}
@media (hover: hover) {
	.service_anchor .ico:hover {
		transform: scale(2);
		background: #f00;
	}
	.service_anchor .ico:hover .arr.a1 {
		transform: translate(-50%, 34px);
	}
	.service_anchor .ico:hover .arr.a2 {
		transform: none;
	}
	.service_anchor .ico.anima {
		transition: background .4s, transform .4s cubic-bezier(0.65, 0, 0.35, 1);
		will-change: background, transform;
	}
	.service_anchor .ico.anima .arr {
		transition: transform .4s cubic-bezier(0.87, 0, 0.13, 1);
		will-change: transform;
	}
}
@media screen and (min-width: 768px) {
	.service_anchor {
		display: flex;
		justify-content: space-between;
	}
	.service_anchor li {
		flex-basis: calc(33.33333% - 96px);
	}
	.service_anchor li:nth-child(1) figure img {
		width: 206px;
	}
	.service_anchor li:nth-child(2) figure img {
		width: 193px;
	}
	.service_anchor li:nth-child(3) figure img {
		width: 208px;
	}
	.service_anchor figure {
		height: 0;
		padding-bottom: 100%;
	}
	.service_anchor .spacer {
		display: flex;
		justify-content: center;
		align-items: flex-end;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	.service_anchor .ico {
		margin-top: 32px;
	}
}
@media screen and (max-width: 767px) {
	.service_anchor {
		padding: 0 20px;
	}
	.service_anchor li + li {
		margin-top: 20px;
	}
	.service_anchor figure {
		padding-top: 40px;
		text-align: center;
	}
	.service_anchor .spacer {
		display: inline-block;
		max-width: calc(100% - 100px);
	}
	.service_anchor li:nth-child(1) figure img {
		width: calc(206px * 1.5);
	}
	.service_anchor li:nth-child(2) figure img {
		width: calc(193px * 1.5);
	}
	.service_anchor li:nth-child(3) figure img {
		width: calc(208px * 1.5);
	}
	.service_anchor .ico {
		margin: 4px 0 0 auto
	}
}
@media screen and (max-width: 480px) {
	.service_anchor dt {
		font-size: 1.8rem;
	}
	.service_anchor dd {
		font-size: 1.4rem;
	}
}

/* inview */
html:not(.isTouch) .service_anchor.js-inview:not(.is-inview) figure::before,
html:not(.isTouch) .service_anchor.js-inview:not(.is-inview) .spacer,
html:not(.isTouch) .service_anchor.js-inview:not(.is-inview) dt,
html:not(.isTouch) .service_anchor.js-inview:not(.is-inview) dd,
html:not(.isTouch) .service_anchor.js-inview:not(.is-inview) .ico {
	opacity: 0;
	transform: translateX(-40px);
}
html:not(.isTouch) .service_anchor.js-inview:not(.is-inview) .ico {
	transform: scale(.1);
}
html:not(.isTouch) .service_anchor.js-inview.is-anima figure::before,
html:not(.isTouch) .service_anchor.js-inview.is-anima .spacer,
html:not(.isTouch) .service_anchor.js-inview.is-anima dt,
html:not(.isTouch) .service_anchor.js-inview.is-anima dd {
	transition: opacity 1s, transform 1s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}
html:not(.isTouch) .service_anchor.js-inview.is-anima .spacer { transition-delay: .1s; }
html:not(.isTouch) .service_anchor.js-inview.is-anima dt { transition-delay: .2s; }
html:not(.isTouch) .service_anchor.js-inview.is-anima dd { transition-delay: .3s; }
html:not(.isTouch) .service_anchor.js-inview.is-anima .ico {
	transition: opacity .4s, transform .4s cubic-bezier(0.34, 1.56, 0.64, 1);
	will-change: opacity, transform;
}
html:not(.isTouch) .service_anchor.js-inview.is-anima li:nth-child(1) .ico { transition-delay: .6s; }
html:not(.isTouch) .service_anchor.js-inview.is-anima li:nth-child(2) .ico { transition-delay: .7s; }
html:not(.isTouch) .service_anchor.js-inview.is-anima li:nth-child(3) .ico { transition-delay: .8s; }


/**
 * Service Package - Re-Frame
 -------------------------------------------------- */
.service_contents {
	position: relative;
	margin-top: 144px;
}
.service_section {
	min-height: 800px;
	padding: 20px 0 60px;
}
.service_section:last-of-type {
	padding-bottom: 0;
}

/* :::::: rectangle :::::: */
.service_contents .rect {
	z-index: -1;
	position: absolute;
	top: 80px;
	right: calc(50% - 50vw + 20px);
	left: calc(50% - 50vw + 20px);
	height: calc(100vh - 160px);
}
.service_contents .rect::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #f3f3f3;
}
.service_contents.is-logue .rect::after {
	transform: rotate(2.96deg) skewY(-1deg);
}
.service_contents.is-party .rect::after {
	transform: rotate(-2.91deg) skewY(1deg);
}
.service_contents.is-market .rect::after {
	transform: rotate(2.96deg) skewY(-1deg);
}
.js-fixed .service_contents:not(.is-active) .rect {
	opacity: 0;
}
.js-fixed .service_contents:not(.is-active) .rect::after {
	transform: scaleY(.8);
}
.in-service .js-fixed .service_contents .rect::after {
	transition: transform .8s cubic-bezier(0.34, 1.56, 0.64, 1);
	will-change: transform;
}
.in-service .js-fixed service_contents .rect {
	transition: opacity .4s;
	will-change: opacity;
}
@media screen and (max-width: 767px) {
	.service_section .rect {
		top: 48px;
		right: -20px;
		left: -20px;
		height: 130vw;
	}
	.service_section {
		position: relative;
	}
	.service_section:nth-of-type(1) .rect::after {
		transform: rotate(1.96deg);
	}
	.service_section:nth-of-type(2) .rect::after {
		transform: rotate(-1.91deg);
	}
	.service_section:nth-of-type(3) .rect::after {
		transform: rotate(1.96deg);
	}
}

/* :::::: parts :::::: */
.service_section .parts {
	pointer-events: none;
}
.service_section .title {
	font-size: 4.8rem;
	line-height: 1;
}
.service_section p {
	font-size: 1.8rem;
	line-height: 1.5;
}
@media screen and (min-width: 768px) {
	.service_section .title {
		position: absolute;
		top: 20px;
	}
	.service_section p {
		position: absolute;
		top: 160px;
	}
	.service_figure {
		display: flex;
		align-items: center;
		position: absolute;
		top: 80px;
		left: 0;
		width: 100%;
		height: calc(100vh - 160px);
		min-height: 720px;
		padding: 80px 80px 0;
	}
}
@media screen and (max-width: 767px) {
	.service_section p {
		margin-top: 24px;
	}
	.service_figure {
		margin: 48px 0 24px;
		text-align: center;
	}
}
.js-fixed .service_section .parts:not(.is-fixed) > * {
	opacity: 0;
	transform: translateX(-40px);
}
.in-service .js-fixed .parts > * {
	transition: opacity .4s, transform .4s cubic-bezier(0.34, 1.56, 0.64, 1);
	will-change: opacity, transform;
}
.in-service .js-fixed .parts:not(.is-fixed) > * {
	transition-duration: .2s;
	transition-timing-function: cubic-bezier(0.65, 0, 0.35, 1);
}

/* :::::: report :::::: */
.service_section .report {
	z-index: 1;
	position: relative;
	background: rgba(255,255,255,.95);
	box-shadow: 2px 2px 20px rgba(0,0,0,.12);
}
.service_section .report dt {
	color: #de0010;
}
.service_section .report dd {
	margin-top: 8px;
	font-size: 1.5rem;
}
.service_section .report .b {
	font-weight: 700;
}
.service_section .report .ex dt,
.service_section .report .task dt {
	font-size: 1.1rem;
}
.service_section .report .task {
	margin-top: 24px;
}
.service_section .report .task .b {
	margin-bottom: 16px;
	font-size: 1.8rem;
}
.service_section .report .resume dt {
	margin-top: 24px;
	font-size: 1.5rem;
}
.service_section .report .resume dd {
	margin-top: 16px;
	padding-left: 6rem;
}
@media screen and (min-width: 768px) {
	.service_section .report {
		width: calc(50% + 80px);
		margin: 0 -80px 0 auto;
		padding: 80px;
	}
	.service_section .report .task {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: baseline;
	}
	.service_section .report .task dt {
		flex-basis: 6rem;
	}
	.service_section .report .task dd {
		justify-self: flex-end;
		flex-basis: calc(100% - 6rem);
		margin-left: auto;
	}
}
@media screen and (max-width: 767px) {
	.service_section .report {
		margin: 0 -10px;
		padding: 30px;
	}
	.service_section .report dd {
		margin-top: 0;
	}
	.service_section .report .task .b {
		margin-bottom: 12px;
		line-height: 1.5;
	}
	.service_section .report .resume {
		margin-top: 32px;
	}
	.service_section .report .resume dt {
		margin-top: 16px;
	}
	.service_section .report .resume dd {
		margin-top: 8px;
	}
}
@media screen and (max-width: 480px) {
	.service_section .title {
		font-size: 4.2rem;
	}
	.service_section p {
		font-size: 1.4rem;
	}
	.service_section .report dd {
		font-size: 1.4rem;
	}
}


/**
 * Our Team
 -------------------------------------------------- */
.p-team {
	max-width: 961px;
	margin-top: 160px;
	text-align: center;
}
.p-team p {
	display: inline-block;
	max-width: 520px;
	margin-top: 48px;
	font-size: 2.1rem;
	text-align: left;
}
.team_columns {
	margin-top: 48px;
	text-align: left;
}
.team_column {
	display: flex;
	flex-direction: column;
}
.team_column p {
	margin-top: 40px;
	font-size: 1.5rem;
}
.team_column a {
	align-self: flex-end;
	margin-top: 16px;
	font-size: 1.3rem;
	font-weight: 700;
}
.team_column a::after {
	content: "";
	display: inline-block;
	width: 8px;
	height: 13px;
	margin: -3px 0 0 1em;
	background: url(../img/arrow.svg) center / cover no-repeat;
	vertical-align: middle;
}
@media screen and (min-width: 768px) {
	.team_columns {
		display: flex;
		justify-content: space-between;
		position: relative;
	}
	.team_columns::after {
		content: "";
		position: absolute;
		left:  50%;
		height: 100%;
		border-left: 1px solid #e4e4e4;
	}
	.team_column {
		flex-basis: calc(50% - 60px);
	}
}
@media all and (-ms-high-contrast: none) and (min-width: 768px) {
	.team_column + .team_column {
		margin-left: auto;
	}
}
@media screen and (max-width: 767px) {
	.team_column + .team_column {
		margin-top: 80px;
	}
}
@media screen and (max-width: 480px) {
	.p-team p {
		font-size: 1.8rem;
	}
	.team_column p {
		font-size: 1.4rem;
	}
}

/* inview */
html:not(.isTouch) .p-team p.js-inview:not(.is-inview),
html:not(.isTouch) .team_column.js-inview:not(.is-inview) figure,
html:not(.isTouch) .team_column.js-inview:not(.is-inview) p,
html:not(.isTouch) .team_column.js-inview:not(.is-inview) a,
html:not(.isTouch) .team_member.js-inview:not(.is-inview) .title,
html:not(.isTouch) .team_member.js-inview:not(.is-inview) figure,
html:not(.isTouch) .team_member.js-inview:not(.is-inview) dt,
html:not(.isTouch) .team_member.js-inview:not(.is-inview) dd {
	opacity: 0;
	transform: translateX(-40px);
}
html:not(.isTouch) .p-team p.js-inview.is-anima,
html:not(.isTouch) .team_column.js-inview.is-anima figure,
html:not(.isTouch) .team_column.js-inview.is-anima p,
html:not(.isTouch) .team_column.js-inview.is-anima a,
html:not(.isTouch) .team_member.js-inview.is-anima .title,
html:not(.isTouch) .team_member.js-inview.is-anima figure,
html:not(.isTouch) .team_member.js-inview.is-anima dt,
html:not(.isTouch) .team_member.js-inview.is-anima dd {
	transition: opacity 1s, transform 1s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}
html:not(.isTouch) .team_column.js-inview.is-anima p { transition-delay: .1s; }
html:not(.isTouch) .team_column.js-inview.is-anima a { transition-delay: .2s; }
html:not(.isTouch) .team_member.js-inview.is-anima figure { transition-delay: .1s; }
html:not(.isTouch) .team_member.js-inview.is-anima dt { transition-delay: .2s; }
html:not(.isTouch) .team_member.js-inview.is-anima dd { transition-delay: .3s; }

/* :::::: Member :::::: */
.team_member {
	margin-top: 48px;
}
.team_member .title {
	font-size: 1.8rem;
	text-align: center;
}
.member_list {
	display: flex;
	justify-content: space-between;
	margin-top: 32px;
}
.member_list li {
	flex-basis: calc(50% - 12px);
}
.member_list dl {
	margin-top: 16px;
}
.member_list dt,
.member_list dd {
	font-size: 1.1rem;
}
.member_list dd {
	margin-top: 8px;
}
.member_list .name {
	margin-top: 0;
	font-size: 1.3rem;
}
@media all and (-ms-high-contrast: none) {
	.team_column {
		display: block;
		text-align: right;
	}
	.team_column p,
	.team_member {
		text-align: left;
	}
}



/**
 * Document Request
 -------------------------------------------------- */
.p-request {
	position: relative;
	margin-top: 160px;
}
.p-request .bg {
	content: "";
	z-index: -1;
	position: absolute;
	overflow: hidden;
	top: 160px;
	right: calc(50% - 50vw);
	bottom: 0;
	left: calc(50% - 50vw);
	background: #f3f3f3;
}
.p-request .bg .illust {
	position: absolute;
	bottom: 0;
	left: -580px;
	width: calc(580px * 5);
	height: 580px;
	background: url(../img/about.png) 10% 100% / 580px 580px repeat-x;
}
.p-request form {
	padding: 60px;
	background: white;
	box-shadow: 2px 2px 20px rgba(0,0,0,.12);
}
.p-request .lead {
	font-size: 1.2rem;
	font-weight: 700;
}
.request_input {
	font-size: 1.1rem;
}
.request_input li {
	margin-top: 24px;
}
.request_input label {
	display: block;
}
.request_input input {
	width: 100%;
	margin-top: 4px;
	border: 0;
	border-radius: 5px;
	font-size: 1.6rem;
	background: #f3f3f3;
}
.o-button {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 216px;
	height: 60px;
	border-radius: 60px;
	color: white;
	font-size: 1.3rem;
	line-height: 1;
	background: #141414;
}
.request_submit .o-button {
	width: 180px;
	height: 50px;
	margin: 40px 0 0 auto;
	border: 0;
	font-size: 1.1rem;
}
@media screen and (min-width: 768px) {
	.p-request {
		height: 920px;
	}
	.p-request form {
		width: 50%;
		margin: -40px 0 0 auto;
	}
}
@media screen and (max-width: 767px) {
	.p-request {
		min-height: 800px;
		padding-bottom: 160px;
	}
	.p-request .bg {
		top: 120px;
		background-position: 50% 125%;
		background-size: 320px 320px;
	}
	.p-request form {
		margin: 40px -10px 0;
		padding: 30px 30px 40px;
	}
	.request_input li + li {
		margin-top: 16px;
	}
}
@media screen and (max-width: 480px) {
	.p-request .lead {
		font-size: 1.1rem;
	}
}

/* inview */
html:not(.isTouch) .p-request form.js-inview:not(.is-inview) {
	opacity: 0;
	transform: translateX(-40px);
}
html:not(.isTouch) .p-request form.js-inview.is-anima {
	transition: opacity 1s, transform 1s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}


/**
 * Contact
 -------------------------------------------------- */
.p-contact {
	position: relative;
	max-width: 860px;
	padding: 72px 0;
	color: white;
	text-align: center;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.p-contact::before {
	content: "";
	z-index: -1;
	position: absolute;
	top: 0;
	left: calc(50% - 50vw);
	right: calc(50% - 50vw);
	height: 100%;
	background: #0a0202;
}
.p-contact .o-title .en {
	font-size: 4.5rem;
}
.contact_link {
	margin-top: 56px;
	font-size: 1.8rem;
}
.contact_link li {
	text-align: center;
}
.contact_link .o-button {
	margin: 32px auto 0;
	color: #141414;
	background: white;
}
@media screen and (min-width: 768px) {
	.contact_link {
		display: flex;
		justify-content: space-between;
	}
}
@media screen and (max-width: 767px) {
	.p-contact {
		padding: 56px 0;
	}
	.contact_link {
		margin-top: 40px;
		font-size: 1.4rem;
	}
	.contact_link li {
		margin-top: 40px;
	}
	.contact_link .o-button {
		margin-top: 20px;
	}
}
@media screen and (max-width: 480px) {
	.p-contact .o-title .en {
		font-size: 4.2rem;
	}
}

/* inview */
html:not(.isTouch) .contact_link.js-inview:not(.is-inview) li {
	opacity: 0;
	transform: translateY(40px);
}
html:not(.isTouch) .contact_link.js-inview.is-anima li {
	transition: opacity 1s, transform 1s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}
html:not(.isTouch) .contact_link.js-inview.is-anima li:nth-child(2) { transition-delay: .1s; }


/**
 * footer
 -------------------------------------------------- */
.l-footer {
	z-index: 1;
	position: relative;
	max-width: 1000px;
	margin: 0 auto;
	margin-top: -1px;
	padding: 112px 20px 40px;
	color: white;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
@media all and (-ms-high-contrast: none) {
	.l-footer {
		margin-top: -32px;
	}
}
.l-footer::before {
	content: "";
	z-index: -1;
	position: absolute;
	top: 0;
	left: calc(50% - 50vw);
	right: calc(50% - 50vw);
	height: 100%;
	background: #141414;
}
.l-footer .bg {
	z-index: -1;
	position: absolute;
	height: 100%;
	top: 0;
	left: calc(50% - 50vw);
	right: calc(50% - 50vw);
	fill: #1d1d1d;
}
.l-footer .bg svg {
	width: calc(100% - 40px);
	height: calc(100% - 80px);
	margin: 40px 20px 0;
}
.contentsinfo {
	margin-top: 56px;
}
.contentsinfo .copy {
	font-size: 7.2rem;
	line-height: 1.5;
	font-weight: 700;
	white-space: nowrap;
	text-align: center;
}
.info_menu,
.info_link {
	font-family: Helvetica, sans-serif;
	font-weight: bold;
}
.info_menu {
	margin-top: 40px;
}
.info_link {
	margin-top: 56px;
}
.info_menu a,
.info_link a {
	display: inline-block;
}
@media screen and (min-width: 768px) {
	.contentsinfo {
		display: flex;
		justify-content: space-between;
	}
}
@media screen and (max-width: 767px) {
	.l-footer {
		padding: 56px 20px 24px;
	}
	.contentsinfo {
		margin-top: 16px;
	}
	.contentsinfo .copy {
		font-size: 6.4rem;
	}
	.info_menu,
	.info_link {
		margin-top: 32px;
	}
	.l-footer .bg svg {
		height: calc(100% - 360px);
		margin: 20px;
	}
}
@media screen and (max-width: 480px) {
	.contentsinfo .copy {
		font-size: 4.8rem;
	}
}
@media screen and (max-width: 374px) {
	.contentsinfo .copy {
		font-size: calc(48 / 374 * 100vw);
	}
}

/* inview */
html:not(.isTouch) .l-footer .rf.js-inview:not(.is-inview) {
	opacity: 0;
	transform: translateY(40px);
}
html:not(.isTouch) .contentsinfo.js-inview:not(.is-inview) > * {
	opacity: 0;
	transform: translateY(40px);
}
html:not(.isTouch) .l-footer .rf.js-inview.is-anima,
html:not(.isTouch) .contentsinfo.js-inview.is-anima > * {
	transition: opacity 1s, transform 1s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}

.copyright {
	margin-top: 48px;
	font-size: 1.1rem;
}
.copyright small {
	font-size: 1em;
}


/**
 * javascript
 -------------------------------------------------- */
body.is-fixed {
	position: fixed;
	overflow-y: scroll;
	width: 100%;
	height: 100%;
}
.js-sc-wrap {
	background: white;
}
.js-fixed {
	backface-visibility: hidden;
	will-change: transform;
}
.js-fixed {
	position: fixed;
	width: 100%;
}