@charset "utf-8";

/*-------------------------------
	Group
-------------------------------*/

.Group {
	border-radius:0 0 5rem 5rem;
	padding-top: 0;
	position:relative;
	background:#fff;
}

.Group__message{
	max-width: 90rem;
	margin-bottom: 8.4rem;
}
.Group__message-title{
	font-family: var(--mincho);
    font-size: 2.4rem;
    margin-bottom: 7rem;
    letter-spacing: .05em;
    line-height: calc(4 / 2.4);
    font-weight: 700;
}

.role4 {
	margin-bottom:10rem;
}

.role4 h3 {
	position:relative;
	padding-left:4.8rem;
	font-size:2.4rem;
	font-weight:700;
	line-height:1.5;
	letter-spacing: 0.05em;
	margin-bottom:1.5em;
}

.role_dl dt {
	position:relative;
	padding-left:4.8rem;
}

.role4 h3::before,
.role_dl dt::before {
	content:"";
	display: block;
	border-radius:50%;
	background: #DE7899;
	background: linear-gradient(135deg,rgba(222, 120, 153, 1) 0%, rgba(10, 128, 204, 1) 100%);
	position:absolute;
}

.role_dl dt::after {
	content:"";
	display: block;
	width:calc(100% - 5rem);
	height:.2rem;
	border-bottom:.2rem dotted var(--blackcolor);
	position:absolute;
	right:0;
	top:50%;
	transform:translateY(-50%);
}

.role4 h3::before {
	width:3.2rem;
	height:3.2rem;
	top:0.1em;
	left:0.6rem;
}

.role_dl dt::before {
	width:1em;
	height:1em;
	top:0.65em;
	left:1.4rem;
}

.role_dl {
	display: flex;
	flex-wrap:wrap;
	margin-bottom:3rem;
}

.role_dl dt {
	width:30.5rem;
	font-weight:400;
}

.role_dl dt span {
	font-weight:400;
	display: inline-block;
	background:#fff;
	position:relative;
	z-index: 1;
	padding-right:0.25em;
}

.role_dl dd {
	width:calc(100% - 30.5rem);
	font-weight:400;
	padding-left:0.25em;
}

.role4 p {
	padding-left:1.2rem;
}

/*-------------------------------
	system 4
-------------------------------*/

.system4 {
	max-width:99rem;
	margin:0 auto;
}

.system4 .affe_wrap {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap:wrap;
}

.system_flow {
	width:48%;
	max-width:47rem;
}

.system_flow h4 {
	font-size:3rem;
	font-weight:600;
	letter-spacing: 0.01em;
	font-family: var(--mincho);
	line-height:1.5;
	text-align: center;
}

.system_flow h3 {
	font-size:3.4rem;
	font-weight:700;
	letter-spacing: 0.01em;
	color:var(--maincolor);
	line-height:1.5;
	margin-bottom:0.5em;
	text-align: center;
}

.system_region {
	width:47%;
	max-width:46rem;
}

.system_list {
	max-width:41rem;
	margin:0 auto;
}

.system_list li {
	width:100%;
	background: #DE7899;
	background: linear-gradient(135deg,rgba(222, 120, 153, 1) 0%, rgba(10, 128, 204, 1) 100%);
	border-radius:4rem;
	padding:0.4rem;
	position:relative;
}

.system_list li:not(:last-of-type) {
	margin-bottom:4.4rem;
}

.system_list li:not(:last-of-type)::after {
	content:"";
	display: block;
	width:5.2rem;
	height:3.4rem;
	background:url(../images/group/arrow_system.svg) no-repeat center / contain;
	position:absolute;
	bottom:-3.9rem;
	left:50%;
	transform:translateX(-50%);
}

.system_list li span {
	display: block;
	text-align: center;
	background:#fff;
	border-radius:4rem;
	font-size:3rem;
	font-weight:700;
	line-height:1.5;
	letter-spacing: 0.05em;
	padding:0.25em 0.5em;
}

.system_region h3 {
	font-size:2.8rem;
	font-weight:700;
	line-height:1.5;
	margin-bottom:1em;
	text-align: center;
}

/*-------------------------------
	ver sp
-------------------------------*/

@media screen and (max-width:768px){


/*-------------------------------
	Group
-------------------------------*/

.Group {
	padding-top:0;
}

.Group__message{
	max-width: 100%;
	margin-bottom: 15rem;
}
.Group__message-title{
	font-size: 3.2rem;
	margin-bottom: 8.4rem;
	line-height: calc(6 / 3.2);
}

.role4 {
	margin-bottom:12rem;
}

.role4 h3 {
	padding-left:5.5rem;
	font-size:3.6rem;
}

.role_dl dt {
	position:relative;
	padding-left:5.5rem;
}

.role_dl dt::after {
	width:calc(100% - 7.5rem);
	height:.4rem;
	border-bottom:.4rem dotted var(--blackcolor);
}

.role4 h3::before {
	width:4.8rem;
	height:4.8rem;
	left:0;
}

.role_dl dt::before {
	width:1em;
	height:1em;
	top:0.65em;
	left:1rem;
}

.role_dl {
	margin-bottom:6rem;
}

.role_dl dt {
	width:100%;
}

.role_dl dt span {
	padding-right:0.25em;
}

.role_dl dd {
	width:100%;
	padding-left:6.3rem;
	margin-bottom:1em;
}

.role4 p {
	padding-left:1.2rem;
}

/*-------------------------------
	system 4
-------------------------------*/

.system4 {
	max-width:100%;
}

.system_flow {
	width:100%;
	max-width:100%;
	margin-bottom:10rem;
}

.system_flow h4 {
	font-size:3.6rem;
}

.system_flow h3 {
	font-size:4rem;
}

.system_region {
	width:100%;
	max-width:100%;
}

.system_list {
	max-width:100%;
}

.system_list li {
	width:100%;
	border-radius:8rem;
	padding:0.8rem;
}

.system_list li:not(:last-of-type) {
	margin-bottom:9rem;
}

.system_list li:not(:last-of-type)::after {
	width:7.8rem;
	height:5.1rem;
	bottom:-7rem;
}

.system_list li span {
	border-radius:8rem;
	font-size:3.6rem;
}

.system_region h3 {
	font-size:4rem;
}

} /* end 768px */