@charset "utf-8";

#contents_area {
	--bg-gradient: linear-gradient(90deg, #606060 1px, transparent 1px), linear-gradient(#606060 1px, transparent 1px);
	--c-bg-gradient: #eaeaea;
	--c-bg-part01: #f2f2f2;
	--c-bg-part01-inner: rgb(191,200,214,.6);
	--c-bg-part02: rgb(158,133,227,.5);
	--c-bg-part02-inner: #9e85e3;
	--c-bg-part03: #fff;
	--c-bg-part03-inner: #fff;
	--c-gray: #696969;
	--c-gray-btn: #555;
	--c-red: #e02b21;
}

@media print, screen and (min-width : 769px){
	.section img {
		display: block;
		width: 100%;
	}

	.section sup {
		vertical-align: top;
		font-size: 75%;
	}


/* ----------------------------------------
	section_title
---------------------------------------- */

	#section_title {
		background: #fff;
	}
	#section_title h2 {
		position: relative;
		left: 50%;
		width: 1280px;
		transform: translateX(-50%);
	}


/* ----------------------------------------
	section_part
---------------------------------------- */

	#section_part {
		position: relative;
		z-index: 1;
	}
	#section_part::before {
		content: '';
		opacity: .28;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		z-index: 1;
		background: 50% -15px / 25px 25px var(--c-bg-gradient);
		background-image: var(--bg-gradient);
		mix-blend-mode: multiply;
		pointer-events: none;
	}

	#section_part .section {
		padding: 41px 0 68px;
	}

	#section_part .section_inner {
		width: 1040px;
		margin: auto;
		box-shadow: 5px 5px 10px rgba(0,0,0,.5);
	}

	#section_part .part_content {
		flex-wrap: wrap;
		justify-content: center;
		align-items: flex-end;
		position: relative;
		z-index: 1;
		height: 541px;
		margin-bottom: 0;
	}
	
	#section_part .block {
		overflow: hidden;
		position: relative;
		z-index: 1;
		height: 100%;
	}

	#section_part h3 {
		position: relative;
		z-index: 2;
		box-sizing: border-box;
		width: 170px;
		height: 235px;
		margin: 32px 0 0 45px;
		border-bottom: 12px solid var(--c-gray);
	}

	#section_part .part {
		display: block;
		overflow: hidden;
		width: 83px;
		height: 0;
		margin-bottom: 20px;
		padding-top: 32px;
		background: var(--c-gray);
		mask: url(../img/part.svg) 0 0 / contain no-repeat;
	}

	#section_part h3 .num {
		width: auto;
		height: 145px;
		margin-left: -8px;
	}

	#section_part h3 .logo {
		position: absolute;
		left: 100%;
		margin-left: 51px;
	}

	#section_part .kv p {
		margin: 34px 0 0 45px;
		font-family: var(--font-bold);
		font-size: 40px;
		line-height: calc(60 / 40);
	}

	#section_part .title_sub {
		display: flex;
		align-items: flex-start;
		position: relative;
		z-index: 1;
		margin: 19px 0 0 45px;
	}

	#section_part .title_sub .part {
		margin: 13px 0 42px;
	}

	#section_part .title_sub .num {
		width: auto;
		height: 49px;
		margin: 0 12px 0 8px;
	}

	#section_part .text {
		position: relative;
		z-index: 2;
		width: 475px;
		margin-left: 45px;
	}

	#section_part h4 {
		margin-top: 40px;
		white-space: nowrap;
		font-family: var(--font-bold);
		font-size: 21px;
	}
	#section_part h4:first-child {
		margin-top: 0;
	}
	#section_part p {
		margin: 10px 0 -8px;
		font-size: 17px;
		line-height: calc(33 / 17);
	}
	#section_part figure {
		position: absolute;
		z-index: 1;
	}
	#section_part figcaption {
		margin-top: 5px;
		font-size: 12px;
	}

	#section_part .note {
		position: absolute;
		z-index: 2;
		left: 45px;
		margin: 0;
		font-size: 12px;
		line-height: 1;
	}

	/* slick
	---------------------------------------- */

	#section_part .slick-list {
		width: 100%;
		height: 100%;
	}

	#section_part .slick-track {
		height: 100%;
	}

	#section_part .slick-arrow {
		position: relative;
		left: 0;
		right: 0;
		top: 0;
		z-index: 2;
		aspect-ratio: 1;
		width: 12px;
		height: auto;
		transition: .2s transform;
	}
	#section_part .slick-arrow::before,
	#section_part .slick-arrow::after {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		border-radius: 1px;
		background: var(--c-gray-btn);
	}
	#section_part .slick-arrow::before {
		opacity: 1;
		width: 100%;
		height: 2px;
	}
	#section_part .slick-arrow::after {
		width: 2px;
		height: 100%;
	}
	#section_part .slick-arrow:hover {
		opacity: 1;
	}

	#section_part .slick-prev {
		order: 2;
		transform: rotate(-45deg);
		transform-origin: 0 0;
	}
	#section_part .slick-prev:hover {
		transform: translateX(-3px) rotate(-45deg);
	}

	#section_part .slick-next {
		order: 4;
		transform: rotate(45deg);
		transform-origin: 100% 0;
	}
	#section_part .slick-next::after {
		left: auto;
		right: 0;
	}
	#section_part .slick-next:hover {
		transform: translateX(3px) rotate(45deg);
	}

	#section_part .slick-dots {
		order: 3;
		margin: 25px 3px 6px;
		bottom: 0 !important;
	}
	#section_part .slick-dots li {
		width: 12px;
		height: 12px;
		margin: 0 9px;
		padding: 0;
	}
	#section_part .slick-dots li button {
		width: 100%;
		height: 100%;
	}
	#section_part .slick-dots li button::before {
		box-sizing: border-box;
		width: 100%;
		height: 100%;
		border: 1px solid #fff;
		border-radius: 50%;
		background: var(--c-gray-btn);
		transition: .2s background-color;
	}
	#section_part .slick-dots li:hover button::before,
	#section_part .slick-dots li.slick-active button::before {
		background: var(--c-red);
	}

	#section_part .btn_prev,
	#section_part .btn_next {
		position: absolute;
		aspect-ratio: 1;
		width: 38px;
		transition: .5s;
		transition-property: visibility, opacity;
		color: var(--c-gray-btn);
		cursor: pointer;
	}
	#section_part .btn_prev {
		left: calc(95 / 1280 * 100%);
		transform: translateY(-280px) rotate(-45deg);
	}

	#section_part .btn_next {
		right: calc(95 / 1280 * 100%);
		transform: translateY(-280px) rotate(45deg);
	}

	#section_part .btn_prev:hover,
	#section_part .btn_next:hover {
		opacity: 1;
	}

	#section_part .part_content:not([data-index])~.btn_prev,
	#section_part .part_content:not([data-index])~.btn_prev:hover,
	#section_part [data-index='0']~.btn_prev,
	#section_part [data-index='0']~.btn_prev:hover,
	#section_part [data-is-end='true']~.btn_next,
	#section_part [data-is-end='true']~.btn_next:hover {
		visibility: hidden;
		opacity: 0;
	}

	#section_part .btn_prev::before,
	#section_part .btn_next::before {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		z-index: 1;
		border: solid;
		transition: .2s transform;
	}
	#section_part .btn_prev::before {
		border-width: 4px 0 0 4px;
		transform-origin: 0 0;
	}
	#section_part .btn_prev:hover::before {
		transform: translate(-3px,-3px);
	}

	#section_part .btn_next::before {
		border-width: 4px 4px 0 0;
		transform-origin: 100% 0;
	}
	#section_part .btn_next:hover::before {
		transform: translate(3px,-3px);
	}

	/* #section_part01
	---------------------------------------- */

	#section_part01 {
		background: var(--c-bg-part01);
	}

	#section_part01 .section_inner {
		background: var(--c-bg-part01-inner);
	}

	#section_part01 h3 .logo {
		top: 72px;
		width: 197px;
	}

	#section_part01 .title_sub .logo {
		width: 73px;
		margin-top: 5px;
	}

	#section_part01 .kv figure {
		right: -32px;
		top: 121px;
		width: 630px;
	}

	/* page01 */
	#section_part01 .page01 figure {
		right: 28px;
		top: 166px;
		width: 500px;
	}

	#section_part01 .page01 figure .logo {
		position: absolute;
		right: 293px;
		top: -64px;
		width: 149px;
	}

	/* page02 */
	#section_part01 .page02 figure {
		right: 26px;
		top: 46px;
		width: 470px;
	}
	
	#section_part01 .page02 figure ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		column-gap: 10px;
	}
	#section_part01 .page02 figure li {
		width: 149px;
		font-family: var(--font-bold);
		font-size: 12px;
	}
	#section_part01 .page02 figure li:first-child {
		width: 100%;
		margin-bottom: 6px;
	}
	#section_part01 .page02 figure li:nth-child(2) {
		width: 112px;
	}
	#section_part01 .page02 figure li div {
		margin-top: 12px;
	}

	/* page03 */
	#section_part01 .page03 .text p {
		width: 440px;
	}

	#section_part01 .page03 .equipment {
		position: absolute;
		right: 45px;
		top: 35px;
		bottom: 21px;
		z-index: 1;
		width: 475px;
	}

	#section_part01 .page03 .equipment .box {
		position: absolute;
		left: 0;
		right: 0;
		z-index: 2;
		padding: 20px 170px 15px 15px;
		background: #fff;
	}
	#section_part01 .page03 .equipment .box:first-child {
		top: 0;
	}
	#section_part01 .page03 .equipment .box:last-child {
		bottom: 0;
	}

	#section_part01 .page03 .equipment h5 {
		font-family: var(--font-bold);
		font-size: 13px;
	}
	#section_part01 .page03 .equipment p {
		margin: 8px 0 0 -4px;
		font-size: 12px;
		line-height: calc(20 / 12);
	}
	#section_part01 .page03 .equipment .box figure {
		position: absolute;
		right: 12px;
		top: 35px;
		z-index: 1;
		width: 150px;
	}

	#section_part01 .page03 .equipment>figure {
		left: 8px;
		top: 110px;
		width: 490px;
	}

	#section_part01 .page03 .equipment .circle {
		position: absolute;
		z-index: 1;
		box-sizing: border-box;
		aspect-ratio: 1;
		width: 76px;
		border: 1px solid;
		border-radius: 50%;
		color: #fff;
	}
	#section_part01 .page03 .equipment .circle::before {
		content: '';
		position: absolute;
		z-index: 1;
		border: 0px solid;
	}

	#section_part01 .page03 .equipment .circle01,
	#section_part01 .page03 .equipment .circle02 {
		top: 97px;
	}
	#section_part01 .page03 .equipment .circle01 {
		left: 171px;
	}
	#section_part01 .page03 .equipment .circle01::before {
		right: 0;
		top: 50%;
		width: 133px;
		border-bottom-width: 1px;
		transform: translate(100%,-50%);
	}

	#section_part01 .page03 .equipment .circle02 {
		right: 35px;
	}
	#section_part01 .page03 .equipment .circle02::before {
		left: -91px;
		bottom: 50%;
		height: 135px;
		border-left-width: 1px;
	}

	#section_part01 .page03 .equipment .circle03 {
		left: 80px;
		top: 50px;
	}
	#section_part01 .page03 .equipment .circle03::before {
		height: 101px;
		left: 50%;
		top: 100%;
		border-left-width: 1px;
		transform: translate(-50%,1px);
	}

	/* page04 */
	#section_part01 .page04 .text {
		width: 550px;
	}

	#section_part01 .page04 figure {
		right: 31px;
		top: 144px;
		width: 397px;
	}

	/* page05 */
	#section_part01 .page05 .text {
		display: grid;
		grid-template-columns: 440px 470px;
		justify-content: space-between;
		width: 950px;
	}

	/* #section_part02
	---------------------------------------- */

	#section_part02 {
		background: var(--c-bg-part02);
		color: #fff;
	}

	#section_part02 .section_inner {
		background: var(--c-bg-part02-inner);
	}

	#section_part02 h3 {
		border-bottom-color: #f2f2f2;
	}

	#section_part02 .part {
		background: #fff;
	}

	#section_part02 h3 .logo {
		top: 122px;
		width: 319.5px;
	}

	#section_part02 .title_sub .logo {
		width: 196px;
		margin-top: 23px;
	}
	
	#section_part02 .note {
		bottom: 15px;
	}
	#section_part02 .note a {
		display: inline-block;
		color: inherit;
		margin-top: 4px;
	}
	#section_part02 .note a::after {
		content: '';
		display: inline-block;
		margin-left: .5em;
		border: solid transparent;
		border-width: 6px 0 6px 10px;
		border-left-color: #fff;
		vertical-align: top;
	}

	#section_part02 .kv figure {
		right: 0;
		top: 110px;
		width: 588px;
	}

	/* page01 */
	#section_part02 .page01 .text {
		width: 465px;
	}

	#section_part02 .page01 figure {
		right: 0;
		top: 156px;
		width: 530px;
	}

	#section_part02 .page01 figure .logo {
		position: absolute;
		right: 96px;
		top: -14px;
		width: 374px;
	}

	/* page02 */
	#section_part02 .page02 .text {
		width: 422px;
	}

	#section_part02 .page02 figure {
		right: 40px;
		top: 144px;
		width: 486px;
	}

	/* page03 */
	#section_part02 .page03 .text p {
		width: 430px;
	}

	#section_part02 .page03 figure {
		right: 54px;
		top: 144px;
		width: 443px;
	}

	/* #section_part03
	---------------------------------------- */

	#section_part03 {
		background: var(--c-bg-part03);
	}

	#section_part03 .section_inner {
		background: var(--c-bg-part03-inner);
	}

	#section_part03 .part_content::before {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		z-index: 1;
		border: 2px solid var(--c-red);
		pointer-events: none;
	}

	#section_part03 h3 .logo {
		top: 110px;
		width: 297px;
	}

	#section_part03 .title_sub .logo {
		width: 181px;
		margin-top: 17px;
	}

	#section_part03 .kv figure {
		right: 0;
		top: 84px;
		width: 600px;
	}

	/* page01 */
	#section_part03 .page01 figure {
		right: 7px;
		top: 177px;
		width: 514px;
	}

	#section_part03 .page01 figure .logo {
		position: absolute;
		right: 113px;
		top: -73px;
		width: 350px;
	}

	#section_part03 .page01 .note {
		bottom: 19px;
	}

	/* page02 */
	#section_part03 .page02 .text {
		width: 643px; 
	}

	#section_part03 .page02 p,
	#section_part03 .page03 p,
	#section_part03 .page04 p,
	#section_part03 .page05 p,
	#section_part03 .page06 p {
		margin: 14px 0 -8px;
		font-size: 16px;
		line-height: calc(32 / 16);
	}

	#section_part03 .page02 figure {
		right: 39px;
		top: 43px;
		width: 300px;
	}
	#section_part03 .page02 figcaption {
		position: absolute;
		right: 17px;
		bottom: -32px;
	}

	/* page03 */
	#section_part03 .page03 .text {
		width: 596px; 
	}

	#section_part03 .page03 figure {
		right: 45px;
		top: 144px;
		width: 336px;
	}
	#section_part03 .page03 figure li,
	#section_part03 .page05 figure li {
		margin-bottom: 12px;
	}

	/* page04 */
	#section_part03 .page04 .text {
		width: 722px; 
	}

	#section_part03 .page04 figure {
		right: 25px;
		top: 140px;
		width: 228px;
	}
	#section_part03 .page04 figure li {
		margin-bottom: 8px;
	}
	#section_part03 .page04 figcaption {
		white-space: nowrap;
		font-size: 11px;
	}

	/* page05 */
	#section_part03 .page05 .text {
		width: 657px; 
	}

	#section_part03 .page05 figure {
		right: 30px;
		top: 72px;
		width: 283px;
	}

	/* page06 */
	#section_part03 .page06 .text {
		width: 510px; 
	}

	#section_part03 .page06 figure {
		right: 25px;
		top: 102px;
		width: 445px;
	}


/* ----------------------------------------
	footer
---------------------------------------- */

	#footer_topic_path {
		margin-top: 90px;
	}
}