@charset "UTF-8";

/* index ---------------------------------------*/
.indexwrapper {

}

.indexsection-title {
	display: flex;
	align-items: center;
	gap: 36px;
	position: relative;
	padding-left: 60px;
	z-index: 1;
	margin-left: calc(58 / 1080 * 100%);
}

.indexsection-title::before {
	position: absolute;
	top: 12px;
	left: 0;
	z-index: -1;
	width: 41px;
	height: 65px;
	background: url(../img/common/img_title_deco.png) no-repeat;
	background-size: contain;
	content: '';
}

.indexsection-title span {
	display: block;
	font-size: 48px;
	font-weight: 600;
	line-height: 1.479;
	color: #000069;
}

.indexsection-title small {
	display: block;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.479;
	color: #000069;
}


/* indexbg ---------------------------------------*/
.indexbg {
	width: 100%;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: -1;
}

.indexbg-inner {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100vh;
	background: #000;
}

.indexbg-inner video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}


/* indexkv ---------------------------------------*/
.indexkv {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100vh;
	min-height: 804px;
	overflow: hidden;
}

.indexkv::before {
	position: absolute;
	bottom: 0;
	left: 0;
	clip-path: polygon(0 4.6vw, 100% 0, 100% 100%, 0 100%);
	width: 100%;
	height: min(26.7%, 20vw);
	background: #fff;
	z-index: -1;
	content: '';
}

.indexkv-image {
	position: absolute;
	top: 44%;
	left: 50%;
	transform: translate(-50%, calc(-50% + 50px));
	z-index: 2;
	width: 272px;
	opacity: 0;
	transition: all 1.5s ease;
}

.indexkv-image.is-show {
	transform: translate(-50%, -50%);
	opacity: 1;
}

.indexkv-title-wrapper {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: min(26.7%, 20vw);
}

.indexkv-title {
	position: absolute;
	top: 13%;
	left: 0;
	right: 0;
	z-index: 2;
	margin: 0 auto;
	font-size: calc(69 / 1280 * 100vw);
	font-weight: 900;
	line-height: 1.65;
	text-align: center;
	letter-spacing: 0.05em;
	color: #000069;
}


/* indexconcept ---------------------------------------*/
.indexconcept {
	padding: 34px 20px calc(134 / 1280 * 100vw);
	background: #fff;
	margin-top: -1px;
}

.indexconcept-block {
	margin-top: 40px;
	padding: 0 0 0 calc(78 / 1080 * 100%);
}

.indexconcept-text {
	font-size: 24px;
	font-weight: 500;
	line-height: 1.667;
	letter-spacing: 0.05em;
	color: #000069;
	margin-bottom: 50px;
}

.indexconcept-lead {
	font-size: 40px;
	font-weight: 900;
	line-height: 1;
	color: #000069;
	margin-left: 8px;
	margin-bottom: 50px;
}

.indexconcept-lead small {
	font-size: 30px;
	margin-left: 248px;
}

.indexconcept-lead b {
	display: block;
	font-size: 51px;
	font-weight: 900;
	line-height: 1.314;
	letter-spacing: 0.05em;
	color: #000069;
	margin-top: 8px;
}

.indexconcept-lead + .indexconcept-text {
	margin-bottom: 0;
}

/* indexservice ---------------------------------------*/
.indexservice {
	position: relative;
	padding: calc(282 / 1280 * 100vw) 20px 324px;
	z-index: 1;
	margin-top: -8.5vw;
}

.indexservice::before {
	position: absolute;
	top: 0;
	left: 0;
	clip-path: polygon(0 8.5vw, 100% 0, 100% 100%, 0 calc(100% - 8vw));
	width: 100%;
	height: calc(100% - 116px);
	background: #0000E6;
	z-index: -1;
	content: '';
}

.indexservice-lead {
	position: absolute;
	top: 5.5vw;
	left: 0;
	right: 0;
	z-index: 2;
	width: fit-content;
	font-size: calc(69 / 1280 * 100vw);
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.03em;
	color: #fff;
	margin: 0 auto;
}

.indexservice-lead b {
	font-weight: 900;
	letter-spacing: 0.1em;
	margin-left: calc(40 / 1280 * 100vw);
}

.indexservice .indexsection-title::before {
    background: url(../img/common/img_title_deco_02.png) no-repeat;
    background-size: contain;
}

.indexservice .indexsection-title span,
.indexservice .indexsection-title small {
	color: #fff;
}

.indexservice-block {
	display: flex;
	align-items: center;
	gap: calc(43 / 1080 * 100%);
	margin-top: -6px;
}

.indexservice-image {
	width: calc(620 / 1080 * 100%);
	margin-left: calc(40 / 1080 * 100%);
}

.indexservice-list {
	margin-top: -4px;
	width: calc(367 / 1080 * 100%);
}

.indexservice-list > li {

}

.indexservice-list > li + li {
	margin-top: 14px;
}

.indexservice-list > li a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	height: 59px;
	padding: 10px;
	z-index: 1;
	padding: 10px 20px 10px 6px;
}

.indexservice-list > li a::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #060657;
	clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 50%, calc(100% - 20px) 100%, 0 100%);
	z-index: -1;
	content: '';
}

.indexservice-list > li img {
	
}

.indexservice-list > li p {
	font-size: 14px;
	font-weight: 500;
	line-height: 1.714;
	letter-spacing: 0.1em;
	color: #fff;
}

.tooltip {
    position: relative;
}

.tooltip-text {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	bottom: 135%;
	left: -185px;
	z-index: 2;
	width: 443px;
	padding: 16px 22px;
	border-radius: 8px;
	letter-spacing: 0.08em;
	background: #22AEB9;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.429;
	text-align: center;
	color: #fff;
	transition: all .25s ease;
	visibility: hidden;
	opacity: 0;
}

.tooltip-text::before {
    position: absolute;
    top: 98%;
    width: 32px;
    height: 14px;
    background: inherit;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
}

.tooltip:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}


/* indexcase ---------------------------------------*/
.indexcase {
	position: relative;
	padding: calc(130 / 1280 * 100vw) 20px 48px;
	z-index: 1;
	overflow: hidden;
}

.indexcase::before {
	position: absolute;
	top: 0;
	left: 0;
	clip-path: polygon(0 7.2vw, 100% 0, 100% 100%, 0 100%);
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: -1;
	content: '';
}

.indexcase-slider { 
	/* margin: 50px calc(50% - 50vw) 0 calc(68 / 1280 * 100%); */
	margin: 0 calc(50% - 50vw);
	padding: 42px 0;
}

.indexcase-slider-list { 
	transition-timing-function: linear;
}

.indexcase-slider-list > li {
	background: #fff;
	box-shadow: 1px 5px 8px 4px rgba(0, 0, 0, 0.25);
	border-radius: 18px;
	height: auto;
}

.indexcase-slider-list a {
	display: block;
	width: 100%;
	height: 100%;
	padding: 28px 30px 40px;
}

.indexcase-slider-list-title {
	position: relative;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.667;
	padding-left: 36px;
	margin-bottom: 8px;
}

.indexcase-slider-list-title::before {
	position: absolute;
	top: 4px;
	left: 0;
	z-index: -1;
	width: 24px;
	height: 30px;
	-webkit-mask-image: url(../img/index/icon_case_deco.svg);
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: 0 0;
	-webkit-mask-size: contain;
	mask-image: url(../img/index/icon_case_deco.svg);
	mask-repeat: no-repeat;
	mask-position: 0 0;
	mask-size: contain;
	content: '';
}

.indexcase-bi .indexcase-slider-list-title::before {background: #1D35D3;}
.indexcase-bs .indexcase-slider-list-title::before {background: #1491D1;}

.indexcase-slider-list-cat {
	display: block;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.5;
	color: #fff;
	width: 100%;
	padding: 4px 14px;
}

.indexcase-bi .indexcase-slider-list-cat {background: #1D35D3;}
.indexcase-bs .indexcase-slider-list-cat {background: #1491D1;}


.indexcase-slider-list-image {
	width: 100%;
	margin-bottom: 12px;
}

.indexcase-slider-list-image img {
	width: 100%;
}

.indexcase-slider-list-taglist {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 2px;
}

.indexcase-slider-list-taglist > li {
	font-size: 10px;
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
	color: #fff;
	padding: 5px 15px;
	border-radius: 4px;
}

.indexcase-bi .indexcase-slider-list-taglist > li {background: #1D35D3;}
.indexcase-bs .indexcase-slider-list-taglist > li {background: #1491D1;}

.indexcase-slider-list-text {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.875;
	letter-spacing: 0.05em;
	color: #000069;
}

.indexcase-nopost {
	font-size: 20px;
	font-weight: 400;
	line-height: 1.6;
	letter-spacing: 0.05em;
	margin: 50px auto 0 calc(100 / 1080 * 100%);
}

/* indexnews ---------------------------------------*/
.indexnews {
	position: relative;
	padding: 30px 20px 130px;
	z-index: 1;
}

.indexnews::before {
	position: absolute;
	top: -2px;
	left: 0;
	clip-path: polygon(0 0, 100% 0, 100% 5.1vw, 0 10.6vw);
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: -1;
	content: '';
}

.indexnews-list {
	margin: 60px 0 0 calc(106 / 1080 * 100%);
}

.indexnews-list > li {

}

.indexnews-list > li + li {
	margin-top: 6px;
}

.indexnews-list > li a {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	width: 100%;
	padding: 26px 20px 19px;
	background: #F0F2F5;
}

time {
	display: block;
	width: 110px;
	font-size: 24px;
	font-weight: 400;
	line-height: 1.25;
	color: #000069;
}

.indexnews-list-title {
	flex: 1;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.875;
	color: #000069;
	overflow: hidden;
}

.indexnews-list-title span {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

.indexnews-nopost {
	font-size: 20px;
	font-weight: 400;
	line-height: 1.6;
	letter-spacing: 0.05em;
	color: #fff;
	margin: 100px auto 0 calc(100 / 1080 * 100%);
}

/* indexgroup ---------------------------------------*/
.indexgroup {
	position: relative;
	padding: calc(104 / 1280 * 100vw) 20px 230px;
	z-index: 1;
}

.indexgroup::before {
	position: absolute;
	top: 0;
	left: 0;
	clip-path: polygon(0 5.8vw, 100% 0, 100% 100%, 0 calc(100% - 5.8vw));
	width: 100%;
	height: calc(100% - 84px);
	background: #fff;
	z-index: -1;
	content: '';
}

.indexgroup-list {
	margin: 30px 0 0 calc(138 / 1080 * 100%);
}

.indexgroup-list dt {
	font-size: 20px;
	font-weight: 700;
	line-height: 2;
}

.indexgroup-list dd {
	font-size: 20px;
	font-weight: 700;
	line-height: 2;
	letter-spacing: 0.05em;
	margin-left: 6px;
}

.indexgroup-list dd a {
	position: relative;
	letter-spacing: 0;
	padding-left: 40px;
    margin-left: 14px;
}

.indexgroup-list dd a::before {
	position: absolute;
	top: -2px;
	left: 0;
	z-index: 1;
	font-size: 15px;
	content: '🔗';
}

.indexgroup-list dd + dt {
	margin-top: 40px;
}

/* indexrecruit ---------------------------------------*/
.indexrecruit {
	position: relative;
	padding: calc(132 / 1280 * 100vw) 20px calc(72 / 1280 * 100vw);
	z-index: 1;
}

.indexrecruit::before {
	position: absolute;
	top: 0;
	left: 0;
	clip-path: polygon(0 5.2vw, 100% 0, 100% calc(100% - 5.8vw), 0 100%);
	width: 100%;
	height: 100%;
	background: #D8E6E8;
	z-index: -1;
	content: '';
}

.indexrecruit-block {
	padding-left: calc(132/ 1080 * 100%);
}

.indexrecruit-title {
	font-size: 30px;
	font-weight: 500;
	line-height: 1.8;
	color: #000069;
	margin: 32px 0 18px;
}

.indexrecruit-text {
	font-size: 16px;
	font-weight: 500;
	line-height: 1.875;
	color: #000069;
	margin-bottom: 42px;
}

.indexrecruit-list {
	display: flex;
	justify-content: center;
	gap: calc(20 / 830 * 100%);
	max-width: 830px;
}

.indexrecruit-list > li {
	display: flex;
	justify-content: center;
	align-items: center;
	width: calc(150 / 830 * 100%);
	background: #fff;
	border-radius: 13px;
	padding: 19px 6px;
}

.indexrecruit-list img {
	max-width: 128px;
	width: 100%;
}

.indexrecruit-link {
	display: block;
	width: fit-content;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.875;
	text-align: center;
	letter-spacing: 0.05em;
	color: #000069;
	margin-top: 58px;
}

/* indexrecruit ---------------------------------------*/
.indexcta {
	position: relative;
	padding: 18px 20px 74px;
	z-index: 1;
}

.indexcta-btn {
	text-align: center;
}


/* small pc */
@media screen and (min-width: 768px) and (max-width: 1920px){
	.indexcase-slider-list > li {
		width: 375px !important;
	}
}


/* sp only */
@media screen and (max-width: 767px){
	/* title ---------------------------------------*/
	.indexsection-title {
		gap: 24px;
		padding-left: 42px;
		margin-left: 24px;
	}

	.indexsection-title::before {
		top: 7px;
		width: 28px;
		height: 45px;
	}

	.indexsection-title span {
		font-size: 33px;
	}

	.indexsection-title small {
		font-size: 14px;
	}


	/* indexbg ---------------------------------------*/
	.indexbg {
		margin-top: 74px;
	}

	.indexbg-inner {
		height: calc(100vh - 74px);
	}


	/* indexkv ---------------------------------------*/
	.indexkv {
		min-height: 650px;
	}

	.indexkv::before {
		clip-path: polygon(0 7.5vw, 100% 0, 100% 100%, 0 100%);
		height: 25%;
	}

	.indexkv-image {
		top: 35%;
		width: 166px;
	}

	.indexkv-title-wrapper {
		height: 25%;
	}

	.indexkv-title {
		top: 13%;
		left: 10%;
		font-size: calc(42 / 393 * 100vw);
		line-height: 1.071;
		text-align: left;
	}

	.indexkv-title span {
		margin-left: calc(80 / 393 * 100vw);
	}



	/* indexconcept ---------------------------------------*/
	.indexconcept {
		position: relative;
		padding: 30px 14px calc(100 / 393 * 100vw);
		background: unset;
	}

	.indexconcept::before {
		position: absolute;
		top: 0;
		left: 0;
		clip-path: polygon(0 0, 100% 0, 100% calc(100% - 14.3vw), 0 100%);
		width: 100%;
		height: calc(100% + 6px);
		background: #fff;
		z-index: -1;
		content: '';
	}

	.indexconcept-block {
		margin-top: 30px;
		padding: 0 0 0 calc(18 / 365 * 100%);
	}

	.indexconcept-text {
		font-size: 13px;
		margin-bottom: 26px;
	}

	.indexconcept-lead {
		font-size: min(calc(22 / 393 * 100vw), 22px);
		margin-left: 0;
		margin-bottom: 26px;
	}

	.indexconcept-lead small {
		font-size: min(calc(16 / 393 * 100vw), 16px);
		margin-left: min(calc(136 / 393 * 100vw), 136px);
	}

	.indexconcept-lead b {
		font-size: min(calc(28 / 393 * 100vw), 28px);
		margin-top: 6px;
	}


	/* indexservice ---------------------------------------*/
	.indexservice {
		padding: calc(210 / 393 * 100vw) 14px 200px;
		margin-top: unset;
	}

	.indexservice::before {
		clip-path: polygon(0 8.5vw, 100% 0, 100% 100%, 0 calc(100% - 8vw));
		height: calc(100% - 96px);
	}

	.indexservice-lead {
		top: 5vw;
		left: 4%;
		font-size: calc(42 / 393 * 100vw);
		letter-spacing: 0.05em;
	}

	.indexservice-lead b {
		margin-left: unset;
	}

	.indexservice-lead-margin {
		margin-left: calc(30 / 393 * 100vw);
	}

	.indexservice-block {
		display: block;
		margin-top: 4px;
	}

	.indexservice-image {
		width: calc(100% + 20px);
		margin: 0 -14px 52px -6px;
	}

	.indexservice-list {
		margin-top: unset;
		width: 100%;
	}

	.indexservice-list > li a {
		gap: 10px;
		height: 59px;
		padding: 10px;
		padding: 10px 20px 10px 6px;
	}

	.indexservice-list > li a::before {
		clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 50%, calc(100% - 20px) 100%, 0 100%);
	}

	.tooltip:hover .tooltip-text {
		visibility: hidden;
		opacity: 0;
	}



	/* indexcase ---------------------------------------*/
	.indexcase {
		padding: calc(26 / 393 * 100vw) 14px 50px;
	}

	.indexcase::before {
		clip-path: polygon(0 7.7vw, 100% 0, 100% 100%, 0 100%);
	}

	.indexcase-slider { 
		margin: 0 -14px;
		padding: 26px 0;
	}

	.indexcase-slider-list > li {
		border-radius: 9px;
		box-shadow: 1px 3px 4px 2px rgba(0, 0, 0, 0.25);
	}

	.indexcase-slider-list a {
		padding: 12px 14px 24px;
	}

	.indexcase-slider-list-title {
		font-size: 15px;
		padding-left: 18px;
		margin-bottom: 6px;
	}

	.indexcase-slider-list-title::before {
		top: 4px;
		width: 15px;
		height: 16px;
	}

	.indexcase-slider-list-cat {
		font-size: 14px;
		padding: 3px 10px;
	}

	.indexcase-slider-list-image {
		margin-bottom: 10px;
	}

	.indexcase-slider-list-taglist {
		gap: 4px;
	}

	.indexcase-slider-list-taglist > li {
		font-size: 9px;
		padding: 3px 10px;
	}

	.indexcase-slider-list-text {
		font-size: 12px;
	}

	.indexcase-nopost {
		font-size: 16px;
		margin: 40px auto 0 40px;
	}

	/* indexnews ---------------------------------------*/
	.indexnews {
		padding: 30px 14px 74px;
	}

	.indexnews::before {
		clip-path: polygon(0 0, 100% 0, 100% 17.5vw, 0 31.5vw);
	}

	.indexnews-list {
		padding: 0 10px;
		margin: 18px 0 0;
	}

	.indexnews-list > li + li {
		margin-top: 13px;
	}

	.indexnews-list > li a {
		gap: 6px;
		padding: 13px 12px 14px 8px;
	}

	.indexnews-list-title span {
		-webkit-line-clamp: 2;
	}

	.indexnews-nopost {
		font-size: 16px;
		margin: 60px auto 0 40px;
	}

	/* indexgroup ---------------------------------------*/
	.indexgroup {
		padding: calc(78 / 393 * 100vw) 14px 96px;
	}

	.indexgroup::before {
		clip-path: polygon(0 10.8vw, 100% 0, 100% calc(100% - 20vw), 0 100%);
		height: 100%;
	}

	.indexgroup-list {
		margin: 15px 0 0 28px;
	}

	.indexgroup-list dt {
		font-size: 16px;
		line-height: 2.5;
	}

	.indexgroup-list dd {
		font-size: 16px;
		line-height: 2.5;
	}

	.indexgroup-list dd a {
		padding-left: 32px;
		margin-left: 10px;
	}

	.indexgroup-list dd a::before {
		top: 4px;
		width: 16px;
		height: 16px;
	}


	/* indexrecruit ---------------------------------------*/
	.indexrecruit {
		padding: calc(114 / 393 * 100vw) 14px calc(82 / 393 * 100vw);
	}

	.indexrecruit::before {
		clip-path: polygon(0 10.6vw, 100% 0, 100% calc(100% - 14.5vw), 0 100%);
	}

	.indexrecruit-block {
		padding: 0 8px;
	}

	.indexrecruit-title {
		font-size: 24px;
		line-height: 1.5;
		margin: 24px 0 24px 16px;
	}

	.indexrecruit-text {
		margin: 0 0 30px 16px;
	}

	.indexrecruit-list {
		flex-wrap: wrap;
		gap: 14px calc(14 / 349 * 100%);
	}

	.indexrecruit-list > li {
		width: calc(107 / 349 * 100%);
		border-radius: 9px;
		padding: 13px 8px;
	}

	.indexrecruit-list img {
		max-width: unset;
	}

	.indexrecruit-link {
		font-size: 16px;
		margin-top: 30px;
	}

	/* indexrecruit ---------------------------------------*/
	.indexcta {
		padding: 52px 14px 68px;
	}

}




/* iphone5 iphoneSE用 */
@media screen and (max-width: 370px){

}