@charset "UTF-8";
.c-search-block {
	justify-content: center;
}
.p-ma-links {
	background-color: transparent;
	border: 0.1rem solid #C9C9C9;
}
.p-ma-links__link {
	font-size: 1.7rem;
    font-weight: 500;
    padding: 0.1rem 3rem 0.1rem 1rem;
    display: inline-block;
    border-radius: 0.2rem;
    position: relative;
    background-color: #f2f2f2;
}
.p-ma-links__link::before,.p-ma-links__link::after {
	content: none;
}
.p-ma-links__text {
	position: relative;
	display: inline-block;
}
.p-ma-links__text::after {
	content: "";
    width: 0.8rem;
    height: 0.8rem;
    margin: auto;
    border-right: 0.2rem solid #666;
    border-bottom: 0.2rem solid #666;
    position: absolute;
    top: 1.0rem;
    right: -1.5rem;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.p-ma-links__link:link:hover, .p-ma-links__link:visited:hover {
	text-decoration: none;
}
#about-ma .l-contents-article {
    max-width: none;
}
.cta-area,#articles-area,.contents-area {
	margin-top: 8rem;
}
.flow-column {
	display: flex;
	margin-top: 4rem;
}
.flow-area {
	width: 50%;
}
.category-area {
	width: 45%;
	margin-left: 5%;
}
.title {
	font-size: 2.5rem;
	color: #1e2c5b;
	font-weight: 500;
	position: relative;
	padding-left: 2.5rem;
}
.title::before {
	content: "";
	margin: auto;
	width: 1.5rem;
	height: 1.5rem;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	background-color: #1e2c5b;
	transform:rotate(45deg); 
}
.flow-list {
	display: flex;
	margin-top: 1rem;
}
.flow-area .flow-list:first-of-type {
	margin-top: 4rem;
}
dt[class^="flow-ttl"] {
	width: 8%;
	writing-mode: vertical-rl;
	color: #fff;
	font-size: 2rem;
	border-radius: 0.2rem;
	padding: 2rem 1rem;
}
dt[class^="flow-ttl"] .dot {
	position: relative;
    left: 0.5rem;
}
.flow-ttl1 {
	background-color: #2fa6c6;
}
.flow-ttl2 {
	background-color: #064997;
}
.flow-ttl3 {
	background-color: #313363;
}
.inside-list {
	width: 92%;
}
h3[class^="list-ttl"] {
	font-size: 2.2rem;
	font-weight: 500;
	padding: 1rem 0;
	display: flex;
}
.list-ttl1 {
	color: #2fa6c6;
	background: #FFF;
	background: linear-gradient(90deg,rgba(255, 255, 255, 1) 0%, rgba(234, 249, 253, 1) 100%);
}
.list-ttl2 {
	color: #064997;
	background: #FFF;
	background: linear-gradient(90deg,rgba(255, 255, 255, 1) 0%, rgba(232, 240, 251, 1) 100%);
}
.list-ttl3 {
	color: #313363;
	background: #FFF;
	background: linear-gradient(90deg,rgba(255, 255, 255, 1) 0%, rgba(235, 235, 248, 1) 100%);
}
h3[class^="list-ttl"] .step {
	font-size: 1.4rem;
	margin-left: 2rem;
}
h3[class^="list-ttl"] .number {
	font-size: 2rem;
	margin-right: 2rem;
}
.articles-p {
	font-size: 1.8rem;
	color: #666666;
	font-weight: 500;
	position: relative;
	padding-left: 1.5rem;
	margin: 1.5rem 0;
}
.articles-p::before {
	content: "";
	margin: auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-right: 0.6rem solid transparent;
	border-left: 0.6rem solid transparent;
	border-top: 1rem solid #555555;
	border-bottom: 0;
	position: absolute;
	left: 0;
	top: 0.9rem;
}
.detail-list li+li {
	margin-top: 1rem;
}
div[class^="outside"] {
	margin-left: 9rem;
	padding: 1.5rem 0 2rem;
	position: relative;
}
div[class^="outside"]::before {
	content: "";
	width: 0.3rem;
	height: 100%;
	position: absolute;
	top: 0;
	left: -4.6rem;
}
.outside1::before {
	background-color: #2fa6c6;
}
.outside2::before {
	background-color: #064997;
}
.outside3::before {
	background-color: #313363;
}
.flow-list .outside3:last-of-type::before {
	content: none;
}
div[class^="outside"]::after {
	content: "";
    width: 1.2rem;
    height: 1.2rem;
	position: absolute;
	bottom: 0;
	left: -5.0rem;
	transform: rotate(45deg);
}
.outside1::after {
	border-right: 0.3rem solid #2fa6c6;
}
.outside2::after {
	border-right: 0.3rem solid #064997;
}
.outside3::after {
	border-right: 0.3rem solid #313363;
}
.flow-list .outside3:last-of-type::after {
	content: none;
}
.flow-link,.category-link {
	font-size: 1.7rem;
	font-weight: 500;
	padding: 0.1rem 3rem 0.1rem 1rem;
	display: inline-block;
	border-radius: 0.2rem;
	position: relative;
}
.flow-link {
	background-color: #f2f2f2;
}
.category-link {
	background-color: #fff;
}
.flow-link::after,.category-link::after {
	content:"";
	width: 0.8rem;
	height: 0.8rem;
	margin: auto;
	border-right: 0.2rem solid #666;
	border-bottom: 0.2rem solid #666;
	position: absolute;
	top: 1.1rem;
	right: 1.5rem;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.category-list {
	margin-top: 4rem;
	background-color: #f3f7fa;
	padding: 2rem 3rem;
}
.category-box + .category-box {
	margin-top: 3rem;
}
.category-ttl {
	position: relative;
	display: flex;
}
.category-ttl::after {
	content: "";
	flex-grow: 1;
	height: 0.1rem;
	background-color: #1e2c5b;
	display: block;
	margin: 1.5rem 0 0 1rem;
}
.category-toggle-btn {
	font-size: 2.2rem;
	color: #1e2c5b;
	font-weight: 500;
	display: flex;
	align-items: center;
	pointer-events: none;
}

.cta-ttl {
	font-size: 2.5rem;
	color: #1e2c5b;
	font-weight: 500;
	display: flex;
	align-items: center;
}
.cta-ttl::before,.cta-ttl::after {
	content: "";
	flex-grow: 1;
	height: 0.1rem;
	background-color: #1e2c5b;
	display: block;
}
.cta-ttl::before {
	margin-right: 1rem;
}
.cta-ttl::after {
	margin-left: 1rem;
}
.cta-img img {
	border-radius: 0.2rem;
}
.articles-h2 {
	font-size: 3rem;
    color: #1e2c5b;
    font-weight: 500;
	background: #FFF;
	background: linear-gradient(0deg,rgba(255, 255, 255, 1) 0%, rgba(243, 247, 250, 1) 100%);
	padding: 1.5rem 0;
    text-align: center;
}
#articles-area .title {
	margin: 4rem 0 2rem;
}
.articles-frame {
	margin-top: 3rem;
}
.articles-ttl {
	position: relative;
	margin-bottom: 1rem;
}
.articles-toggle-btn {
	color: #fff;
	padding: 1rem 1.2rem;
	background: #1D2C5B;
	background: linear-gradient(90deg,rgba(29, 44, 91, 1) 40%, rgba(65, 80, 127, 1) 100%);
	border-radius: 0.2rem;
	font-weight: 500;
	position: relative;
	width: 100%;
	text-align: left;
}
.articles-list {
	display: flex;
	flex-wrap: wrap;
}
.articles-list li {
	width: 22%;
	margin-left: 4%;
}
.articles-list li:nth-of-type(4n+1) {
	margin-left: 0;
}
.articles-list li:nth-of-type(n+5) {
	margin-top: 1rem;
}
.articles-link {
	position: relative;
	padding-left: 3rem;
	display: flex;
}
.articles-link::before {
	content: "";
    width: 0.8rem;
    height: 0.8rem;
    margin: auto;
    border-right: 0.2rem solid #666;
    border-bottom: 0.2rem solid #666;
    position: absolute;
    top: 1rem;
    left: 1rem;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.contents-list {
	display: flex;
	flex-wrap: wrap;
}
.contents-box {
	width: 23.5%;
	margin-left: 2%;
	margin-top: 3rem;
}
.contents-box:nth-of-type(4n+1) {
	margin-left: 0;
}
.contents-box img {
	border-radius: 0.2rem 0.2rem 0 0;
}
.contents-tx {
	color: #1e2c5b;
	padding: 1.5rem 1rem;
	position: relative;
	background-color: #f2f2f2;
	border-radius: 0 0 0.2rem 0.2rem;
	font-weight: 500;
    text-align: center;
}
.contents-tx::after {
	content: "";
    width: 1rem;
    height: 1rem;
    margin: auto;
    border-right: 0.2rem solid #1e2c5b;
    border-bottom: 0.2rem solid #1e2c5b;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 1rem;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.contents-tx.anchor::after {
	-webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.cta-area .c-cta-sell {
	border-radius: 10rem;
	margin: 4rem auto 7.6rem;
	width: 30rem;
    min-height: 7rem;
	position: relative;
	font-size: 2rem;
}
.cta-area .c-cta-sell::after {
	content: "";
    width: 1.5rem;
    height: 1.5rem;
    margin: auto;
    border-right: 0.2rem solid #fff;
    border-bottom: 0.2rem solid #fff;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 2rem;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.p-ma-links__link,.flow-link,.category-link,.contents-link img,.contents-link .contents-tx{
	box-shadow: 0.2rem 0.2rem rgba(0, 0, 0, 0.1);
}
.toggle-btn2 {
	width: 2rem;
	font-weight: bold;
	margin-left: 0;
	position: absolute;
	right: 1.36rem;
	top: 50%;
	transform:translate(0,-40%);
	color: #1e2c5b;
	z-index: 1;
}
.articles-toggle-btn::after {
	content: "";
	width: 2.4rem;
	height: 2.4rem;
	background-color: #fff;
	right: 1.2rem;
	top: 1rem;
	position: absolute;
}
.toggle-btn1,.sp-only {
	display: none;
}
@media screen and (min-width: 767px),print{
	.flow-link:hover,.category-link:hover,.p-ma-links__link:hover{
		background-color: #666666;
		color: #fff;
	}
	.contents-link:hover .contents-tx {
		background-color: #1e2c5b;
		color: #fff;
	}
	.flow-link:hover::after,.category-link:hover::after,.contents-link:hover .contents-tx::after,.p-ma-links__link:hover .p-ma-links__text::after {
		border-right: 0.2rem solid #fff;
		border-bottom: 0.2rem solid #fff;
	}
	.articles-link:hover {
		text-decoration: underline;
	}
	.p-ma-links__link:hover,.flow-link:hover, .category-link:hover,.cta-img img:hover,.contents-link:hover img,.contents-link:hover .contents-tx{
		box-shadow: none;
	}
}
@media screen and (max-width: 767px){
	.flow-column,.category-area,.cta-area,#articles-area,.contents-area {
		margin-top: 4rem;
	}
	.flow-column {
		display: block;
	}
	.flow-area {
		width: 100%;
	}
	.title {
		font-size: 2rem;
		padding-left: 1.7rem;
	}
	.title::before {
		width: 0.8rem;
		height: 0.8rem;
		left: 0.2rem;
	}
	.flow-list,.flow-area .flow-list:first-of-type,.category-list,#articles-area .title {
		margin-top: 2rem;
	}
	dt[class^="flow-ttl"] {
		width: 10%;
		padding: 2rem 0.4rem;
	}
	h3[class^="list-ttl"] {
		font-size: 1.8rem;
	}
	h3[class^="list-ttl"] .step {
		margin-left: 1.5rem;
	}
	div[class^="outside"] {
		margin-left: 1.5rem;
	}
	div[class^="outside"]::before,div[class^="outside"]::after {
		content: none;
	}
	.articles-p {
		font-size: 1.6rem;
	}
	.category-area {
		width: 100%;
		margin-left: 0;
	}
	.category-list {
		background-color: transparent;
		padding: 0;
	}
	.category-box {
		background-color: #f3f7fa;
		padding: 1rem 1.2rem;
		margin-top: 2rem;
	}
	.category-box + .category-box {
		margin-top: 2rem;
	}
	.category-ttl {
		margin-bottom: 0;
	}
	.category-ttl button {
		font-size: 1.8rem;
	}
	.cta-ttl {
		font-size: 2rem;
	}
	.articles-h2 {
		font-size: 2.5rem;
	}
	.articles-frame {
		margin-top: 2rem;
	}
	.articles-list {
		display: block;
	}
	.articles-list li {
		width: 100%;
		margin-left: 0;
		margin-top: 1rem;
	}
	.contents-box,.contents-box.up {
		width: 48%;
		margin-left: 4%;
		font-size: 1.2rem;
		margin-top: 2rem;
	}
	.contents-box:nth-of-type(4n+1) {
		margin-left: 4%
	}
	.contents-box:nth-of-type(2n+1) {
		margin-left: 0;
	}
	.contents-tx {
		font-size: 1.2rem;
	}
	.contents-tx::after {
		width: 0.8rem;
		height: 0.8rem;
		right: 0.5rem;
	}
	.cta-area .c-cta-sell {
		margin: 2rem auto 4rem;
		font-size: 1.6rem;
		width: 23rem;
		min-height: 5rem;
	}
	.cta-area .c-cta-sell::after {
		width: 1rem;
		height: 1rem;
	}
	.sp-only {
		display: block;
	}
	.toggle-btn1 {
		display: block;
		width: 2rem;
		font-weight: bold;
		margin-left: 0;
		position: absolute;
		right: 0.28rem;
		top: 50%;
		color: #fff;
		transform:translate(0,-50%);
		z-index: 1;
	}
	.category-ttl::after {
		width: 2.6rem;
		height: 2.6rem;
		background-color: #1e2c5b;
		right: 0;
		top: 0;
		position: absolute;
		margin: 0;
	}
}



/*****add style****/
.toggle-btn1:before,.toggle-btn2:before,.toggle-btn1:after,.toggle-btn2:after{
	content:'';
	display:block;
	height:0.4rem;
	width:100%;	
}
.toggle-btn1:before,.toggle-btn2:before{

}
.toggle-btn1:after,.toggle-btn2:after{
	transform: translate(0,-0.28rem) rotate(90deg);
}


.toggle-btn1:before,.toggle-btn1:after{
	background:#fff;
}
.toggle-btn2:before,.toggle-btn2:after{
	background:var(--navy);
}
.toggle-btn1.open:after,.toggle-btn2.open:after{
	display:none;
}