@charset "utf-8";
/*------------------
 * hero
 *------------------*/
#hero{
	& #hero-slider{
		width:50%;
	}
	& #hero-title{
		width:47%;
		& figure{
			max-width:82%;
			margin:0 auto;
		}
	}
	& #hero-slider{
		margin-top:10px;
		& .swiper-wrapper{
			margin-bottom:25px;
		}
		& .swiper-pagination-bullet{
			background:var(--bs-white);
			opacity: 1;
		}
		& .swiper-pagination-bullet-active{
			background:var(--bs-yellow);
		}
	}
	& #hero-form{
		width:47%;
	}
}
@media (max-width: 991.98px){
	#hero{
		& #hero-title,
		& #hero-form{
			width:100%;
			float: none !important;
		}
		& #hero-slider{
			float: none !important;
			width:90%;
			margin-top:5vw;
			margin-right:auto;
			margin-left:auto;
		}
		& #hero-title{
			& figure{
				max-width:100%;
				margin:0 auto;
			}
		}
	}
}
.mitusmori-form-area{
	font-size: .888em;
}
#step{
	& .col{
		position:relative;
	}
	& .col:not(:last-child):after {
		position:absolute;
		content:"";
		background: url(/wp-content/themes/my-theme/assets/images/cmn/line_end_arrow.svg);
		background-repeat: none;
		background-size: cover;
		width:40px;
		height:40px;
		top:30%;
		right:-20px;
	}

}
@media (max-width: 767.98px){
	#step{
		& .col:not(:last-child):after {
			width:30px;
			height:30px;
			transform:rotate(90deg);
			top:auto;
			bottom:-40px;
			right:calc(50% - 15px);
		}
	}

}
#anshin{
	& .container{
		position: relative;
		z-index: 1;
	}
	& h1{
		filter: drop-shadow(-2px -2px 0px var(--bs-primary)) drop-shadow(2px 2px 0px var(--bs-primary)) drop-shadow(-2px 2px 0px var(--bs-primary)) drop-shadow(2px -2px 0px var(--bs-primary));
	}
	& li{
		background:var(--bs-secondary);
		color:var(--bs-white);
		border-radius:2em;
		text-align: center;
		font-size:1.33rem;
		font-weight: 700;
		display: inline-block;
		padding:.4em 1em;
		margin:.2em 0;
	}
}
#anshin::before{
	content:"";
	background:url("/wp-content/themes/my-theme/assets/images/cmn/cushion_illust.svg") no-repeat;
	background-position:right bottom;
	max-width:1200px;
	width:100%;
	height:100%;
	position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
	z-index: 0;
}
@media (max-width: 767.98px){
	#anshin{
		& .container{
			padding-top:30vw;
		}
	}
	#anshin::before{
		background-position:top;
		width:20vw;
		height:20vw;
		background-size:100% auto;
		top: 10vw;
	}
}
@media (max-width: 575.98px) {
	#anshin{
		& .container{
			padding-top:40vw;
		}
		& li{
			font-size:1.1rem;
			text-wrap:nowrap;
		}
	}
	#anshin::before{
		background-position:top;
		width:30vw;
		height:30vw;
		background-size:100% auto;
		top: 10vw;
	}
}

#reason{
	& article{
		overflow: visible;
		padding:2rem;
		background:var(--my-lightgreen);
		border-radius: 20px;
		display: flex;
		justify-content: space-around;
	}
	& .reason-catch{
		width:20%;
		& figure{
			position:relative;
		}
		& figure:after{
			content: "";
			position: absolute;
			top:calc(50% - 12.5px);
			right: -23px;
			width:25px;
			height:25px;
			clip-path: polygon(100% 50%, 0 0, 0 100%);
			background-color: var(--bs-primary);
		}
	}
	& .reason-body{
		width:80%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		& .reason-illust{
			width:35%;
		}
		& .reason-txt{
			width:60%;
		}
	}
}
@media (max-width: 767.98px){
	#reason{
		& article{
			flex-direction: column;
			padding:1rem .5rem;
		}
		& .reason-catch{
			width:40vw;
			margin:0 auto 2rem auto;
			& figure:after{
				width:4vw;
				height:4vw;
				top:auto;
				bottom:-3.5vw;
				right:calc(50% - 2vw);
				transform:rotate(90deg);
				
			}
		}
		& .reason-body{
			width:100%;
			padding:0 1rem;
			align-items:flex-start;
		}
	}
}
@media (max-width: 575.98px) {
	#reason{
		& .reason-catch{
			width:50vw;
		}
		& .reason-body{
			flex-direction: column;
			& .reason-illust{
				width:100%;
				margin-bottom:1rem;
			}
			& .reason-txt{
				width:100%;
			}
		}

	}
}
#reason02{
	& li{
		background:var(--bs-secondary);
		color:var(--bs-white);
		border-radius:2em;
		text-align: center;
		font-size:1.2rem;
		font-weight: 700;
		display: inline-block;
		padding:.4em 1em;
		margin:.2em 0;
	}
}

/*------------------
 * magazine
 *------------------*/
#magazine{
	& a {
		display: block;
		text-decoration: none;
		color:var(--bs-body-color);
	}
	& a article{
		width:60%;
		float:right;
		margin-top:1.5rem;
		& h6{
			font-weight: 700!important;
		}
		& .line-clamp{
		-webkit-line-clamp:2;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		overflow: hidden;
		}
	}
	& a:first-of-type article{
		width:40%;
		float:left;
		& figure{
			margin-bottom:.5rem;
		}
	}
	
}
@media (max-width: 767.98px){
	#magazine{
		& a{
			border-bottom:1px solid var(--bs-border-color);
		}
		& a:first-of-type{
			border-top:1px solid var(--bs-border-color);
		}
		& a article{
			width:100%;
			clear:both;
			float: none!important;
			margin-top: 1rem;
			& h6{
				font-weight: 500!important;
			}
		}
		& a:first-of-type article{
			width:100%;
			clear:both;
			float:none!important;
			
		}
	}
}
@media (max-width: 575.98px) {
	#magazine{
		& a article{
			& h6{
				font-size:1rem;
			}
		}
		& a article div:first-of-type{
			width:40%;
		}
		& a article div{
			width:60%;
			& p.line-clamp{
				display: none;
			}
		}
	}
}
/*------------------
 * faq
 *------------------*/
.faq {
	& dl{
		& dt h5,
		& dd p{
			margin-bottom:0;
		}
		& dt{
			padding:1rem;
			cursor: pointer;
			border-radius: var(--bs-border-radius);
			background:var(--my-lightyellow);
		}
		& dd{
			max-height: 0;
			transition: max-height 0.5s ease;
			overflow: hidden;
			margin-bottom: 0;
		}
		& dd p{
			padding:1rem;
		}
		& dt h5{
			position:relative;
			display:block;
			cursor: pointer;
			transition: 0.5s ease-in-out;
			pointer-events: none;
			font-weight: 700!important;
		}
		& dt h5:after{
			position:absolute;
			display:block;
			content:"";
			bottom:0px;
			width: 10px;
			height: 10px;
			border-top: 2px solid var(--bs-secondary);
			border-right: 2px solid var(--bs-secondary);
			top: calc(50% - 5px);
			right:0;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
			transition: 0.5s ease-in-out;
		}
		& dt:hover{
			background-color:var(--bs-light);
		}
	}
	&  dl.active{
		& dt h5:after{
			transform: rotate(135deg);
			transition: 0.5s ease-in-out;
		} 
	}
}
@media (max-width: 575.98px) {
	.faq {
		& dl{
			& dt h5{
				font-size: 1rem;
			}
		}
	}
}
/*------------------
 * voice
 *------------------*/
#voice{
	article{
		background:var(--bs-white);
		border-radius: 12px;
		padding:1.5em;
	}
	& .swiper-wrapper{
		margin-bottom:60px;
	}
	& .swiper-pagination-bullet{
		background:var(--bs-white);
		opacity: 1;
	}
	& .swiper-pagination-bullet-active{
		background:var(--bs-primary);
	}
	& h5{
		position:relative;
		padding-left:2rem;
	}
	& h5:before{
		position: absolute;
		content:"";
		height:2rem;
		width:2rem;
		background-image: url('/wp-content/themes/my-theme/assets/images/cmn/check.svg');
		background-repeat: no-repeat;
		background-size: cover;
		top:0;
		left:0;
	}
}