@charset "UTF-8";

/*--------------------------------------------------
**************************************************
  サービス系ページ共通
**************************************************
--------------------------------------------------*/
/* 初期状態：非表示 */
.header-hide {
	transform: translateY(-100%);
	transition: transform .3s ease;
}
/* 表示 */
.header-show {
	transform: translateY(0);
}
.main_container.no_scroll .header-hide {
	transform: translateY(0);
}

.contents_title {
	width:100%;
	aspect-ratio:375 / 667;
	display:flex;
	justify-content:center;
	align-items:center;
	color:#FFF;
}
.contents_title h1 {
	text-align:center;
	font-size:1.2rem;
	font-weight:900;
	color:#FFF;
}
.contents_title h1 span {
	font-family:"Antonio";
	display:block;
	font-size:2.4rem;
	letter-spacing:.5em;
	font-weight:400;
}

main {
	padding-top:0 !important ;
}

/* -- slider default -- */
.js-slider{
	overflow:hidden;
	padding-left:15px;
}
.js-slider-track{
	display:flex;
}
.js-slide{
	flex:0 0 auto;
	width:231px;
	margin-right:15px;
}
.js-pagination {
	display: flex;
	gap: 12px;
	justify-content: center;
	margin-top: 20px;
}
.js-slider-dot {
	width: 44px;
	height: 5px;
	background: #d9d9d9;
	cursor: pointer;
	transition: background 0.3s ease;
}
.js-slider-dot.active {
	background: #AAAAAA;
}

@media (max-width: 750px) {
	.js-slider{
		padding-left:1.5rem;
	}
	.js-slide{
		width:61.6%;
		margin-right:1.5rem;
	}
	.js-pagination {
		gap: 1.2rem;
	}
	.js-slider-dot {
		width: 4.4rem;
		height: 0.5rem;
	}
}


/*--------------------------------------------------
**************************************************
  ABOUT
**************************************************
--------------------------------------------------*/
#about .contents_title {
	background:url(../imgs/about/main.jpg) no-repeat center / cover;
}

#about .top_text {
	margin:50px 50px 0;
	font-size:1rem;
	line-height:2;
	letter-spacing:0.02em;
}

#about .iv_slide {
	padding-left:0;
}
#about .iv_slide .invesgram_content {
	width:298px;
	aspect-ratio:1 / 1;
	padding:30px 25px;
	color:#FFF;
	display:flex;
	justify-content:space-between;
	flex-direction:column;
}
#about .iv_slide .invesgram_content.one_on_one {
	background:url(../imgs/about/invesgram01.jpg) no-repeat center / cover;
}
#about .iv_slide .invesgram_content.consulting {
	background:url(../imgs/about/invesgram02.jpg) no-repeat center / cover;
}
#about .iv_slide .invesgram_content.development {
	background:url(../imgs/about/invesgram03.jpg) no-repeat center / cover;
}
#about .iv_slide .invesgram_content .i_title {
	font-size:1.4rem;
	font-weight:900;
}
#about .iv_slide .invesgram_content ul {
	display:flex;
	margin-top:10px;
	margin-bottom:auto;
}
#about .iv_slide .invesgram_content ul li {
	font-size:0.8rem;
	font-weight:900;
	background:var(--color-blue-1);
	padding:2px 8px;
	margin-right:10px;
	border-radius:15px;
}
#about .iv_slide .invesgram_content .i_text {
	margin-top:auto;
	font-size:1rem;
}
#about .iv_slide .invesgram_content .i_link_btn {
	margin-top:10px;
	text-align:center;
	font-size:1rem;
	font-weight:900;
}
#about .iv_slide .invesgram_content .i_link_btn a {
	display:inline-block;
	color:#FFF;
	background:var(--color-blue-1);
	padding:5px 20px;
	border-radius:20px;
}

@media (max-width: 750px) {
	#about .top_text {
		margin:5rem 5rem 0;
	}
	#about .iv_slide .invesgram_content {
		width:79.46%;
		padding:3rem 2.5remx;
	}
	#about .iv_slide .invesgram_content ul li {
		font-size:0.8rem;
		padding:0.2rem 0.8rem;
		margin-right:1rem;
		border-radius:1.5rem;
	}
	#about .iv_slide .invesgram_content .i_link_btn a {
		padding:0.5rem 2rem;
		border-radius:2rem;
	}
}


#about .data_content {
	padding:30px 0 0;
	background:#333;
	color:#FFF;
}
#about .data_content .data_list {
	margin-top:30px;
	display:grid;
	grid-template-columns:repeat(2,1fr);
}
#about .data_content .data_detail {
	display:grid;
	grid-template-rows:
	auto   /* title */
	1fr    /* data */
	auto   /* point */
	auto;  /* text */
	height:100%;
	padding:25px;
	border-top:1px solid #444;
}
#about .data_content .data_detail:nth-child(2n+1) {
	border-right:1px solid #444;
}
#about .data_content .list_title {
	grid-row:1;
	font-size:1.2rem;
	font-weight:900;
	display:flex;
	align-items:center;
	letter-spacing:0;
}
#about .data_content .list_title span {
	font-family:"Antonio";
	font-size:2.4rem;
	font-weight:400;
	line-height:1;
	margin-right:10px;
}
#about .data_content .list_data {
	margin-top:10px;
	grid-row:2;
	text-align:center;
}
#about .data_content .list_data p {
	font-size:1.2rem;
	font-weight:900;
}
#about .data_content .list_data p span {
	font-family:"Antonio";
	font-size:4.8rem;
	font-weight:400;
	line-height:1;
	margin:0 2px;
}
#about .data_content .list_point{
	grid-row:3;
	margin-top:10px;
	text-align:center;
	font-size:1rem;
	font-weight:900;
}
#about .data_content .list_text{
	grid-row:4;
	margin-top:15px;
	font-size:0.9rem;
	font-weight:400;
	letter-spacing:0;
}
@media (max-width: 750px) {
	#about .data_content {
		padding:3rem 0 0;
	}
	#about .data_content .data_list {
		margin-top:3rem;
	}
	#about .data_content .data_detail {
		padding:2.5rem;
	}
	#about .data_content .list_title span {
		margin-right:1rem;
	}
	#about .data_content .list_data {
		margin-top:1rem;
	}
	#about .data_content .list_data p span {
		margin:0 0.2rem;
	}
	#about .data_content .list_point{
		margin-top:1rem;
	}
	#about .data_content .list_text{
		margin-top:1.5rem;
	}
}

#about .cs_slide {
	margin-left:10px;
}
#about .cs_slide .cs_detail {
	width:231px;
	margin-right:20px;
	border-radius:8px;
	border:1px solid #d9d9d9;
	position:relative;
}
#about .cs_slide .cs_detail a {
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
}
#about .cs_slide .cs_detail .image + p {
	padding:15px 15px 10px;
	font-size:1rem;
	font-weight:900;
}
#about .cs_slide .cs_detail .image + p + p {
	padding:0 15px 15px;
	font-size:1rem;
}

@media (max-width: 750px) {
	#about .cs_slide {
		margin-left:1rem;
	}
	#about .cs_slide .cs_detail {
		width:61.6%;
		margin-right:2rem;
		border-radius:0.8rem;
	}
	#about .cs_slide .cs_detail .image + p {
		padding:1.5remx 1.5rem 1rem;
	}
	#about .cs_slide .cs_detail .image + p + p {
		padding:0 1.5rem 1.5rem;
	}
}