main {
	background: url("../img/common/bg_main_child.png") repeat;
}
.mv {
	ask-image: url(../img/qa/main_mask.png);
    mask-repeat: no-repeat;
    mask-size: 100% 100%;
    -webkit-mask-image: url(../img/qa/main_mask.png);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
}
@media screen and (max-width: 800px) {
    .mv {
        ask-image: url(../img/qa/main_mask_sp.png);
        mask-repeat: no-repeat;
        mask-size: 100% 100%;
        -webkit-mask-image: url(../img/qa/main_mask_sp.png);
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: 100% 100%;
    }
}
.mv img {
	min-height: 480px;
	object-fit: cover;
}
.mvWrap {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-35%);
}
.h2 {
	font-size: 48px;
	line-height: 1.4;
	color: #05ab1e;
}
.h2 small {
	font-size: 16px;
	color: #05350a;
	display: block;
}
.navHead {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-top: 25px;
}
.navHead a {
  font-size: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 10px 7px 15px;
  width: 200px;
  background-color: #fff;
  border: 1px solid #05350a;
  border-radius: 100px;
}
.navHead a:hover {
  background-color: #05ab1e;
  color: #fff;
  border: 1px solid #05ab1e;
}
.navHead .arw figure {
  width: 20px;
  height: 20px;
}
@media screen and (max-width: 800px) {
	.mv img {
        min-height: auto;
    }
    .h2 {
        font-size: calc(100vw * 48 / 800);
    }
	.h2 small {
		font-size: calc(100vw * 16 / 800);
    }
	.navHead {
		width: 100%;
		flex-flow: wrap;
        gap: 10px;
        margin-top: 25px;
    }
	.navHead li {
      width: 48%;
    }
	.navHead a {
      width: 100%;
    }
}
@media screen and (max-width: 500px) {
    .h2 {
        font-size: calc(100vw * 26 / 400);
    }
	.h2 small {
        font-size: calc(100vw * 13 / 400);
    }
	.navHead {
		width: 100%;
		flex-flow: wrap;
        gap: 10px;
        margin-top: 6vw;
    }
    .navHead a {
      font-size: calc(100vw * 12 / 400);
      padding: 7px 10px 7px 15px;
    }
    .navHead .arw figure {
      width: 4.25vw;
      height: 4.25vw;
    }
}
.illust1 {
	position: absolute;
	left: 0;
	bottom: -60px;
	width: 285px;
}
.illust2 {
	position: absolute;
	right: 0;
	bottom: -72px;
	width: 217px;
}
@media screen and (max-width: 800px) {
	.illust1 {
        width: 35.625vw;
    }
    .illust2 {
        width: 27.125vw;
    }
}
@media screen and (max-width: 500px) {
	.illust1 {
		bottom: -5vw;
        width: 23.75vw;
    }
    .illust2 {
		bottom: -5vw;
        width: 18vw;
    }
}
.listWrap {
	padding: 100px 0 150px;
}
@media screen and (max-width: 500px) {
    .listWrap {
        padding: 12.5vw 0 15vw;
	}
}
.h3catch {
	font-size: 38px;
	line-height: 1.4;
	color: #05ab1e;
}
.h3catch small {
	font-size: 16px;
	color: #05350a;
	display: block;
}
.catchTxt {
	font-size: 16px;
}
@media screen and (max-width: 800px) {
	.h3catch {
		font-size: calc(100vw * 38 / 800);
    }
	.h3catch small {
		font-size: calc(100vw * 16 / 800);
    }
}
@media screen and (max-width: 500px) {
	.catchWrap {
          padding: 15vw 0 25vw;
      }
	.h3catch {
		font-size: calc(100vw * 24 / 400);
    }
	.h3catch small {
		font-size: 11px;
    }
    .catchTxt {
        font-size: 14px;
    }
}
.qaWrap {
	padding-top: 100px;
}
.qaWrap.first {
	padding-top: 0;
}
.qw {
	border-radius: 25px;
	overflow: hidden;
	border: 1px solid #05350a;
	margin-top: 30px;
}
.h4qa {
	line-height: 1.4;
}
.qw dt {
	font-size: 18px;
	color: #fff;
	background-color: #05ab1e;
	display: flex;
	align-items: center;
	gap: 40px;
	padding: 25px 30px;
	cursor: pointer;
	transition: 0.3s;
}
.qw dd {
	font-size: 16px;
	background-color: #fff;
	display: flex;
	align-items: center;
	gap: 40px;
	padding: 25px 30px 25px 35px;
}
.qw dt::before,.qw dd::before {
	font-size: 56px;
	font-weight: 700;
	line-height: 1.0;
}
.qw dt::before {
	content: 'Q';
}
.qw dd::before {
	content: 'A';
	color: #05ab1e;
}
.qw dt span {
	width: 30px;
	height: 30px;
	border-radius: 50px;
	background-color: #fff;
    display: inline-block;
    position: relative;
	margin-left: auto;
	flex-shrink: 0;
}
.qw dt span::before,.qw dt span::after  {
    content: '';
    display: inline-block;
    width: 12px;
    height: 2px;
    background-color: #05ab1e;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    transition: opacity .4s;
}
.qw dt span::after {
    transform: translate(-50%,-50%) rotate(90deg);
    transition: transform .4s;
}
.qw dt.on span::before {
    opacity: 0;
}
.qw dt.on span::after {
    transform: translate(-50%,-50%) rotate(180deg);
}
.qw dt:hover {
	background-color: #11d60c;
}
@media screen and (max-width: 500px) {
    .qaWrap {
        padding-top: 15vw;
    }
    .qw {
        margin-top: 6vw;
    }
    .qw dt {
        font-size: 16px;
        gap: 4vw;
        padding: 4vw 4vw;
    }
    .qw dd {
        font-size: 14px;
        gap: 4vw;
        padding: 4vw 4vw 4vw 5.5vw;
    }
	.qw dt::before,.qw dd::before {
        font-size:40;
    }
}



































