@charset "utf-8";

/* --------------------
	main
--------------------*/
#main img{
	width:100%;
}

#main{
	width:100%;
	position: relative;
	background: #FFF;
}
#main #mv{
	width: 100%;
	margin:0 auto;
	position:relative;
	overflow: hidden;
	line-height: 0;
}
#main #mv figure{
	line-height: 0;
}
@media only screen and (max-width: 899px) {	
	#main #mv{
		width: 100%;
	}
}
@media only screen and (max-width: 768px) {
	
}
@media only screen and (max-width: 480px) {
	
}

/* ----------------------------------------------------------------------------
	bigin
---------------------------------------------------------------------------- */
#bigin{
	width: 100%;
	padding: 0 0 90px 0;
	overflow: hidden;
}
#bigin h2 span{
	width: 875px;
	margin: 0 auto;
	display: block;
}
#bigin h3{
	width: 100%;
}

#bigin #ex_slide{
	width: 375px;
	padding: 0 110px;
	position: relative;
	margin: 40px auto 20px auto;
}
#bigin #ex_slide .slider.slick-initialized {
    display: block;
}
#bigin #ex_slide{
}
#bigin #ex_slide .swiper-wrapper{
	width: 100%;
	height: auto;
	margin: 0 auto;
	position: relative;
	text-align: center;
}
#bigin #ex_slide .swiper-wrapper div.unit{
	width: 375px;
	height: auto;
	margin: 0 auto;
	position: relative;
	padding: 0 0;
	z-index: 20;
}
#bigin #ex_slide .swiper-wrapper div.unit figure{
	width: 100%;
	margin: 0 auto;
	position: relative;
	line-height: 0;
}
@media only screen and (max-width: 899px) {
	#bigin{
		padding: 0 0 90px 0;
		overflow: hidden;
	}
	#bigin h2 span{
		width: 87.5%;
	}
	#bigin h3{
		width: 100%;
	}

	#bigin #ex_slide{
		width: 37.5%;
		padding: 0 10%;
		margin: 40px auto 20px auto;
	}
	#bigin #ex_slide .swiper-wrapper div.unit{
		width: 100%;
	}
}
@media only screen and (max-width: 768px) {
	#bigin{
		padding: 0 0 60px 0;
		overflow: hidden;
	}
	#bigin h2 span{
		width: 87.5%;
	}
	#bigin h3{
		width: 100%;
	}

	#bigin #ex_slide{
		width: 37.5%;
		padding: 0 10%;
		margin: 40px auto 20px auto;
	}
	#bigin #ex_slide .swiper-wrapper div.unit{
		width: 100%;
	}
}
@media only screen and (max-width: 480px) {
	#bigin #ex_slide{
		width: 60%;
		padding: 0 14%;
		margin: 40px auto 20px auto;
	}
}

/* ----------------------------------------------------------------------------
	tokutyou
---------------------------------------------------------------------------- */
#tokutyou{
	width: 100%;
	padding: 0 0 0 0;
}
#tokutyou h2 span{
	width: 267px;
	margin: 0 auto;
	display: block;
}
#tokutyou h3{
	width: 97%;
}

#tokutyou ul.point{
	width: 100%;
	position: relative;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 20px 0 40px 0;
}
#tokutyou ul.point li{
	width: 30%;
	line-height: 0;
}

#tokutyou h4{
	width: 100%;
	background: #e4007f;
	padding: 15px 0;
	margin: 0 0 20px 0;
	line-height: 0;
	border-radius: 10px;
}
#tokutyou h4 span{
	width: 66.22%;
	display: block;
	margin: 0 auto;
}

#tokutyou .list_area{
	width: 100%;
	padding: 0 0 60px 0;
	box-sizing: border-box;
	background: url("../img/top/reco_img.png") bottom right/auto 80% no-repeat;
}
#tokutyou .list_area .list{
	width: 66.22%;
	padding: 0 0 0 20px;
}

@media only screen and (max-width: 899px) {
	#tokutyou{
	}
	#tokutyou h2 span{
		width: 26.7%;
	}
	#tokutyou h3{
		width: 97%;
	}

	#tokutyou ul.point{
		padding: 20px 0 40px 0;
	}
	#tokutyou ul.point li{
		width: 30%;
		line-height: 0;
	}

	#tokutyou h4{
		padding: 15px 0;
		margin: 0 0 20px 0;
	}
	#tokutyou h4 span{
		width: 66.22%;
	}

	#tokutyou .list_area{
		padding: 0 0 60px 0;
		box-sizing: border-box;
		background: url("../img/top/reco_img.png") bottom right/auto 80% no-repeat;
	}
	#tokutyou .list_area .list{
		width: 66.22%;
		padding: 0 0 0 20px;
	}
}
@media only screen and (max-width: 768px) {
	#tokutyou{
	}
	#tokutyou h2 span{
		width: 26.7%;
	}
	#tokutyou h3{
		width: 97%;
	}

	#tokutyou ul.point{
		padding: 15px 0 30px 0;
	}
	#tokutyou ul.point li{
		width: 30%;
		line-height: 0;
	}

	#tokutyou h4{
		padding: 10px 0;
		margin: 0 0 15px 0;
	}
	#tokutyou h4 span{
		width: 66.22%;
	}

	#tokutyou .list_area{
		padding: 0 0 50% 0;
		box-sizing: border-box;
		background: url("../img/top/reco_img.png") bottom right/auto 40% no-repeat;
	}
	#tokutyou .list_area .list{
		width: 90%;
		padding: 0 0 0 0;
	}
}
@media only screen and (max-width: 480px) {
	#tokutyou h2 span{
		width: calc(26.7% * 1.5);
	}
	#tokutyou ul.point{
	}
	#tokutyou ul.point li{
		width: 70%;
		line-height: 0;
		margin: 0 auto;
		padding: 0 0 15px 0;
	}

	#tokutyou h4 span{
		width: 66.22%;
	}

	#tokutyou .list_area .list{
		width: 96%;
		margin: 0 auto;
		padding: 0 0 0 0;
	}
}

/* ----------------------------------------------------------------------------
	freeex
---------------------------------------------------------------------------- */
#freeex{
	width: 100%;
	padding: 0 0 90px 0;
}
#freeex h2 span{
	width: 565px;
	margin: 0 auto;
	display: block;
}
#freeex h3{
	width: 100%;
	line-height: 0;
	padding: 0 0 15px 0;
	border-bottom: #350d53 1px solid;
	margin: 0 0 30px 0;
}

#freeex .zero{
	width: 85.22%;
	position: relative;
	margin: 0 auto;
	padding: 0 0 30px 0;
}

#freeex .what{
	width: 100%;
	position: relative;
	margin: 0 auto;
	padding: 0 0 40px 0;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#freeex .what h4{
	width: 29.88%;
	background: #350d53;
	padding: 7px 0;
	line-height: 0;
	border-radius: 10px;
}
#freeex .what h4 span{
	width: 52%;
	display: block;
	margin: 0 auto;
}
#freeex .what p{
	width: 68.22%;
	display: block;
	line-height: 0;
}

#freeex .list_area{
	width: 100%;
	padding: 0 0 0 0;
	box-sizing: border-box;
	background: url("../img/top/soap_toha_img.png") bottom left calc(50% - 330px)/auto 100% no-repeat;
}
#freeex .list_area .list_box{
	width: 900px;
	padding: 0 0 0 356px;
	box-sizing: border-box;
}
#freeex .list_area .list_box .list{
	width: 100%;
	padding: 0 0 20px 0;
	box-sizing: border-box;
}



#freeex #muryou{
	width: 100%;
	padding: 0 0 90px 0;
	box-sizing: border-box;
	background: #FAEAF2;
}
#freeex #muryou h3{
	width: 100%;
	padding: 0 0 60px 0;
	line-height: 0;
	border-bottom: none;
    margin: 0 0 0px 0;
}

#freeex #muryou .nayami{
	width: 90%;
	padding: 0 0 30px 0;
	box-sizing: border-box;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#freeex #muryou .nayami .nayami_in{
	width: 48%;
}

#freeex #muryou .copy{
	width: 96%;
	padding: 0 0 30px 0;
	margin: 0 auto;
}
#freeex #muryou .copy2{
	width: 99%;
	padding: 0 0 30px 0;
	margin: 0 auto;
}
#freeex #muryou .menu{
	width: 100%;
	padding: 6px 0 6px 0;
	margin: 0 auto;
	text-align: center;
	background: #CA2F7E;
	border-radius: 30px;
}
#freeex #muryou .menu img{
	width: 27%;
	margin: 0 auto;
	text-align: center;
	line-height: 0;
}

#freeex #muryou .online_area{
	width: 100%;
	padding: 70px 0 40px 0;
	box-sizing: border-box;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#freeex #muryou .online_area .box{
	width: 47%;
	filter: drop-shadow(0px 3px 3px rgba(0, 0, 0, 0.3));

}

#freeex #muryou .btn_area{
	width: 100%;
	padding: 0 0 0 0;
	box-sizing: border-box;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#freeex #muryou .btn_area a{
	display: block;
}
#freeex #muryou .btn_area a.btn_line{
	width: 44.7368%;
}
#freeex #muryou .btn_area a.btn_req{
	width: 50.5263%;
}


@media only screen and (max-width: 899px) {
	#freeex{
		padding: 0 0 90px 0;
	}
	#freeex h2 span{
		width: 56.5%;
	}
	#freeex h3{
		padding: 0 0 15px 0;
		margin: 0 0 30px 0;
	}

	#freeex .zero{
		width: 85.22%;
		padding: 0 0 30px 0;
	}

	#freeex .what{
		padding: 0 0 40px 0;
	}
	#freeex .what h4{
		width: 29.88%;
		padding: 7px 0;
	}
	#freeex .what h4 span{
		width: 52%;
	}
	#freeex .what p{
		width: 68.22%;
	}

	#freeex .list_area{
		width: 100%;
		padding: 0 0 0 0;
		box-sizing: border-box;
		background: url("../img/top/soap_toha_img.png") bottom left calc(50% - 45%)/auto 100% no-repeat;
	}
	#freeex .list_area .list_box{
		width: 90%;
		padding: 0 0 0 39.55%;
		box-sizing: border-box;
	}
	#freeex .list_area .list_box .list{
		padding: 0 0 20px 0;
	}
	
	
	#freeex #muryou{
		padding: 0 0 90px 0;
	}
	#freeex #muryou h3{
		padding: 0 0 60px 0;
	}

	#freeex #muryou .nayami{
		width: 90%;
		padding: 0 0 30px 0;
	}
	#freeex #muryou .nayami .nayami_in{
		width: 48%;
	}

	#freeex #muryou .copy{
		width: 96%;
		padding: 0 0 30px 0;
		margin: 0 auto;
	}
	#freeex #muryou .copy2{
		width: 99%;
		padding: 0 0 30px 0;
		margin: 0 auto;
	}
	#freeex #muryou .menu{
		width: 100%;
		padding: 6px 0 6px 0;
		border-radius: 30px;
	}
	#freeex #muryou .menu img{
		width: 27%;
	}

	#freeex #muryou .online_area{
		width: 100%;
		padding: 70px 0 40px 0;
	}
	#freeex #muryou .online_area .box{
		width: 47%;
	}

	#freeex #muryou .btn_area{
	}
	#freeex #muryou .btn_area a.btn_line{
		width: 44.7368%;
	}
	#freeex #muryou .btn_area a.btn_req{
		width: 50.5263%;
	}
}
@media only screen and (max-width: 768px) {
	#freeex{
		padding: 0 0 60px 0;
	}
	#freeex h3{
		padding: 0 0 10px 0;
		margin: 0 0 25px 0;
	}

	#freeex .zero{
		width: 90%;
		padding: 0 0 25px 0;
	}

	#freeex .what{
		padding: 0 0 30px 0;
	}
	#freeex .what h4{
		width: 100%;
		padding: 7px 0;
	}
	#freeex .what h4 span{
		width: 20%;
	}
	#freeex .what p{
		width: 100%;
		padding: 15px 0 0 0;
	}

	#freeex .list_area{
		width: 100%;
		background: url("../img/top/soap_toha_img.png") bottom left calc(50% - 45%)/auto 100% no-repeat;
	}
	#freeex .list_area .list_box{
		width: 90%;
		padding: 0 0 0 39.55%;
		box-sizing: border-box;
	}
	#freeex .list_area .list_box .list{
		padding: 0 0 20px 0;
	}
	
	
	#freeex #muryou{
		padding: 0 0 60px 0;
	}
	#freeex #muryou h3{
		padding: 0 0 40px 0;
	}

	#freeex #muryou .nayami{
		width: 90%;
		padding: 0 0 20px 0;
	}
	#freeex #muryou .nayami .nayami_in{
		width: 48%;
	}

	#freeex #muryou .copy{
		width: 96%;
		padding: 0 0 20px 0;
		margin: 0 auto;
	}
	#freeex #muryou .copy2{
		width: 99%;
		padding: 0 0 20px 0;
		margin: 0 auto;
	}
	#freeex #muryou .menu{
		width: 100%;
		padding: 6px 0 6px 0;
		border-radius: 30px;
	}
	#freeex #muryou .menu img{
		width: 27%;
	}

	#freeex #muryou .online_area{
		width: 100%;
		padding: 50px 0 30px 0;
	}
	#freeex #muryou .online_area .box{
		width: 47%;
	}

	#freeex #muryou .btn_area{
	}
	#freeex #muryou .btn_area a.btn_line{
		width: 44.7368%;
	}
	#freeex #muryou .btn_area a.btn_req{
		width: 50.5263%;
	}
}
@media only screen and (max-width: 480px) {
	#freeex h2 span{
		width: calc(56.5% * 1.5);
	}
	#freeex .zero{
		width: 100%;
		padding: 0 0 25px 0;
	}

	#freeex .list_area{
		width: 100%;
		background: url(../img/top/soap_toha_img.png) bottom left -15%/auto 62% no-repeat;
    	padding: 0 0 20% 0;
	}
	#freeex .list_area .list_box{
		width: 80%;
		padding: 0 0 0 0;
		box-sizing: border-box;
	}
	#freeex .list_area .list_box .list{
		padding: 0 0 20px 0;
	}
	
	#freeex #muryou{
		padding: 0 0 40px 0;
	}
	#freeex #muryou h3{
		padding: 0 0 30px 0;
	}

	#freeex #muryou .nayami{
		width: 90%;
		padding: 0 0 15px 0;
	}
	#freeex #muryou .nayami .nayami_in{
		width: 48%;
	}

	#freeex #muryou .copy{
		width: 96%;
		padding: 0 0 15px 0;
		margin: 0 auto;
	}
	#freeex #muryou .copy2{
		width: 99%;
		padding: 0 0 15px 0;
		margin: 0 auto;
	}
	#freeex #muryou .menu{
		width: 100%;
		padding: 6px 0 6px 0;
		border-radius: 30px;
	}
	#freeex #muryou .menu img{
		width: 50%;
	}

	#freeex #muryou .online_area{
		width: 100%;
		padding: 40px 0 20px 0;
	}
	#freeex #muryou .online_area .box{
		width: 90%;
		padding: 0 0 15px 0;
		margin: 0 auto;
	}
	
	#freeex #muryou .btn_area a.btn_line{
		width: 90%;
		padding: 0 0 15px 0;
		margin: 0 auto;
	}
	#freeex #muryou .btn_area a.btn_req{
		width: 90%;
		padding: 0 0 15px 0;
		margin: 0 auto;
	}
}

/* ----------------------------------------------------------------------------
	flow
---------------------------------------------------------------------------- */
#flow{
	width: 100%;
	padding: 0 0 90px 0;
}
#flow h2 span{
	width: 624px;
	margin: 0 auto;
	display: block;
}
#flow h3{
	width: 100%;
	line-height: 0;
	padding: 0 0 15px 0;
	border-bottom: #350d53 1px solid;
	margin: 0 0 20px 0;
}

#flow ul.txt{
	width: 100%;
	position: relative;
	margin: 0 auto;
	padding: 0 0 40px 0;
}
#flow ul.txt li{
	width: 100%;
	position: relative;
	margin: 0 auto;
}

#flow h4{
	width: 100%;
	background: rgb(54,14,84);
	background: linear-gradient(90deg, rgba(54,14,84,0) 0%, rgba(54,14,84,0.7357317927170868) 45%, rgba(54,14,84,0.738532913165266) 55%, rgba(54,14,84,0) 100%);
	padding: 10px 0;
	margin: 0 0 35px 0;
	line-height: 0;
	border-radius: 10px;
}
#flow h4 span{
	width: 82.88%;
	display: block;
	margin: 0 auto;
}

#flow ul.step{
	width: 100%;
	position: relative;
	margin: 0 auto;
	padding: 0 0 0 0;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#flow ul.step li{
	width: 32.55%;
	position: relative;
}

@media only screen and (max-width: 899px) {
	#flow{
		padding: 0 0 90px 0;
	}
	#flow h2 span{
		width: 62.4%;
	}
	#flow h3{
		padding: 0 0 15px 0;
		margin: 0 0 20px 0;
	}

	#flow ul.txt{
		padding: 0 0 40px 0;
	}
	#flow ul.txt li{
	}

	#flow h4{
		padding: 10px 0;
		margin: 0 0 35px 0;
	}
	#flow h4 span{
		width: 82.88%;
	}

	#flow ul.step{
	}
	#flow ul.step li{
		width: 32.55%;
		position: relative;
	}
}
@media only screen and (max-width: 768px) {
	#flow{
		padding: 0 0 60px 0;
	}
	#flow h3{
		padding: 0 0 10px 0;
		margin: 0 0 20px 0;
	}

	#flow ul.txt{
		padding: 0 0 30px 0;
	}
	#flow ul.txt li{
	}

	#flow h4{
		padding: 10px 0;
		margin: 0 0 35px 0;
	}
	#flow h4 span{
		width: 82.88%;
	}

	#flow ul.step{
	}
	#flow ul.step li{
		width: 32.55%;
		position: relative;
	}
}
@media only screen and (max-width: 480px) {
	#flow h2 span{
		width: calc(62.4% * 1.5);
	}
	#flow ul.step li{
		width: 90%;
		padding: 0 0 15px 0;
		margin: 0 auto;
	}
}

/* ----------------------------------------------------------------------------
	price
---------------------------------------------------------------------------- */
#price{
	width: 100%;
	padding: 0 0 90px 0;
}
#price h2 span{
	width: 219px;
	margin: 0 auto;
	display: block;
}

#price .txt_area{
	width: 100%;
	position: relative;
	margin: -150px 0 0 0;
    padding: 150px 0 90px 34%;
	display: block;
	background: url("../img/top/price_img.png") bottom left/auto 100% no-repeat;
	box-sizing: border-box;
}
#price .txt_area p{
	font-size: 1.625rem;
	line-height: 1.6;
	text-align: left;
	letter-spacing: 0.08em;
	color: #000;
}

#price .g1{
	width: 100%;
	position: relative;
	margin: -55px 0 0 0;
	padding: 0 0 30px 0;
	display: block;
}
#price .g2{
	width: 100%;
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 30px 0;
	display: block;
}
#price .g2 figcaption{
	padding: 0 0 30px 0;
}
#price .g3{
	width: 100%;
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 60px 0;
	display: block;
}

#price figure{
	line-height: 0;
	padding: 0 0 5px 0;
}
#price figcaption{
	font-size: 1.125rem;
	letter-spacing: -0.05em;
	text-align: left;
	font-weight: 500;
	font-family: 'Zen Maru Gothic', serif;
	color: rgba(0,0,0,1.00);
	padding: 0 0 0px 0;
}


#price .course_area{
	width: 100%;
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 60px 0;
	display: block;
}
#price h3{
	width: 100%;
	font-size: 1.875rem;
	text-align: left;
	padding: 0 0 30px 0;
}
#price h3 small{
	font-size: 0.566em;
}

#price .course_area h4{
	width: 100%;
	text-align: center;
	font-size: 1.625rem;
	padding: 0 0 15px 0;
	display: block;
}
#price .course_area h4 strong{
	font-size: 1.538em;
	font-weight: normal;
}

#price .course_area ul.course{
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 0 0 60px 0;
}
#price .course_area ul.course.line{
	padding: 0 0 10px 0;
}
#price .course_area ul.course li.clm3{
	width: calc((100% / 3) - 10px);
	position: relative;
}
#price .course_area ul.course li.clm3 i{
	width: 73px;
	position: absolute;
	top: -20px;
	left: -20px;
}

#price .course_area ul.course li.clm2{
	width: calc((100% / 2) - 10px);
	position: relative;
}

#price .course_area table{
	width: 100%;
	border-collapse: collapse;
	border: #2d2548 1px solid;
	margin: 30px 0 0 0;
}
#price .course_area table th,
#price .course_area table td{
	border-collapse: collapse;
	border: #2d2548 2px solid;
	text-align: center;
	padding: 0.5em;
	font-size: 1.125rem;
	font-weight: 700;
	box-sizing: border-box;
}
#price .course_area table th{
	width: 235px;
	background: #ee86ad;
	color: #FFF;
}
#price .course_area table td{
	width: calc(100% - 235px);
	background: #FFF;
}

#price .course_area p.note{
	font-size: 1.125rem;
	letter-spacing: -0.05em;
	text-align: left;
	font-weight: 500;
	font-family: 'Zen Maru Gothic', serif;
	color: rgba(0,0,0,1.00);
	padding: 0 0 0px 0;
}
@media only screen and (max-width: 899px) {
	#price{
		padding: 0 0 90px 0;
	}
	#price h2 span{
		width: 21.9%;
	}

	#price .txt_area{
		width: 100%;
		position: relative;
		margin: -15% 0 0 0;
    	padding: 15% 0 80px 34%;
		background: url("../img/top/price_img.png") bottom left/auto 100% no-repeat;
	}
	#price .txt_area p{
		font-size: 1.500rem;
	}

	#price .g1{
		margin: -6.5% 0 0 0;
		padding: 0 0 30px 0;
	}
	#price .g2{
		padding: 0 0 30px 0;
	}
	#price .g2 figcaption{
		padding: 0 0 30px 0;
	}
	#price .g3{
		padding: 0 0 50px 0;
		display: block;
	}

	#price figcaption{
		font-size: 1.000rem;
		letter-spacing: -0.05em;
	}
	
	#price .course_area{
		padding: 0 0 50px 0;
	}
	#price .course_area ul.course.line{
		padding: 0 0 10px 0;
	}
	#price h3{
		font-size: 1.417rem;
		padding: 0 0 30px 0;
	}

	#price .course_area h4{
		font-size: 1.417rem;
		padding: 0 0 15px 0;
	}

	#price .course_area ul.course{
		width: 100%;
		padding: 0 0 50px 0;
	}
	#price .course_area ul.course li.clm3{
		width: calc((100% / 3) - 10px);
	}
	#price .course_area ul.course li.clm3 i{
		width: 73px;
		position: absolute;
		top: -20px;
		left: -20px;
	}

	#price .course_area ul.course li.clm2{
		width: calc((100% / 2) - 10px);
	}

	#price .course_area p.note{
		font-size: 1.000rem;
	}
}
@media only screen and (max-width: 768px) {
	#price{
		padding: 0 0 60px 0;
	}
	#price h2 span{
		width: 21.9%;
	}

	#price .txt_area{
		margin: -15% 0 20px 0;
    	padding: 15% 0 50px 45%;
	}
	#price .txt_area p{
		width: 100%;
		font-size: 1.250rem;
	}
	#price .txt_area p br{
		display: none;
	}

	#price .g1{
		margin: -6.5% 0 0 0;
		padding: 0 0 30px 0;
	}
	#price .g2{
		padding: 0 0 30px 0;
	}
	#price .g2 figcaption{
		padding: 0 0 30px 0;
	}
	#price .g3{
		padding: 0 0 40px 0;
		display: block;
	}

	#price figcaption{
		font-size: 0.875rem;
		letter-spacing: -0.05em;
	}
	
	#price .course_area{
		padding: 0 0 40px 0;
	}
	#price .course_area ul.course.line{
		padding: 0 0 5px 0;
	}
	#price h3{
		font-size: 1.250rem;
		padding: 0 0 30px 0;
	}

	#price .course_area h4{
		font-size: 1.250rem;
		padding: 0 0 15px 0;
	}

	#price .course_area ul.course{
		width: 100%;
		padding: 0 0 40px 0;
	}
	#price .course_area ul.course li.clm3{
		width: calc((100% / 3) - 5px);
	}
	#price .course_area ul.course li.clm3 i{
		width: 40px;
		position: absolute;
		top: -10px;
		left: -20px;
	}

	#price .course_area ul.course li.clm2{
		width: calc((100% / 2) - 5px);
	}
	
	#price .course_area table{
		border: none;
	}
	#price .course_area table tbody{
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	#price .course_area table tbody tr{
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	#price .course_area table th,
	#price .course_area table td{
		border: #2d2548 1px solid;
		font-size: 0.938rem;
	}
	#price .course_area table th{
		width: 100%;
		display: block;
	}
	#price .course_area table td{
		width: 100%;
		display: block;
	}

	#price .course_area p.note{
		font-size: 0.875rem;
	}
}
@media only screen and (max-width: 480px) {
	#price h2 span{
		width: calc(21.9% * 1.5);
	}

	#price .txt_area{
		margin: -15% 0 20px 0;
    	padding: 15% 0 50px 45%;
		background: url("../img/top/price_img.png") bottom left/auto 90% no-repeat;
	}
	#price .txt_area p{
		font-size: 1.000rem;
	}

	#price .g1{
		margin: -6.5% 0 0 0;
		padding: 0 0 25px 0;
	}
	#price .g2{
		padding: 0 0 25px 0;
	}
	#price .g2 figcaption{
		padding: 0 0 25px 0;
	}
	#price .g3{
		padding: 0 0 30px 0;
		display: block;
	}

	#price figcaption{
		font-size: 0.750rem;
		letter-spacing: -0.05em;
	}
	
	#price .course_area{
		padding: 0 0 30px 0;
	}
	#price h3{
		font-size: 1.125rem;
		padding: 0 0 30px 0;
	}

	#price .course_area h4{
		font-size: 1.125rem;
		padding: 0 0 15px 0;
	}

	#price .course_area ul.course{
		width: 100%;
	}
	#price .course_area ul.course li.clm3{
		width: 100%;
		padding: 0 0 10px 0;
	}
	#price .course_area ul.course li.clm3 i{
		width: 60px;
		position: absolute;
		top: -20px;
		left: -20px;
	}

	#price .course_area ul.course li.clm2{
		width: 100%;
		padding: 0 0 10px 0;
	}

	#price .course_area p.note{
		font-size: 0.750rem;
	}
}

#price .plan_area {
	width: 100%;
	padding: 0 0 60px 0;
}
#price #plan_slide .slider.slick-initialized {
    display: block;
}
#price #plan_slide {
	width: 810px;
	padding: 0 40px;
	margin: 0 auto;
	position: relative;
}
#price #plan_slide .swiper-wrapper{
	width: 100%;
	height: auto;
	margin: 0 auto;
	position: relative;
	text-align: center;
}
#price #plan_slide .swiper-wrapper div.unit{
	width: 810px;
	height: auto;
	margin: 0 auto;
	position: relative;
	padding: 0 0;
	z-index: 20;
	background: rgba(255,255,255,1.00);
}
.swiper-pagination {
	display: block;
}

@media only screen and (max-width: 899px) {
	#price .plan_area {
		padding: 0 0 50px 0;
	}
	#price #plan_slide {
		width: 90%;
		padding: 0 4.5%;
		margin: 0 auto;
		position: relative;
		overflow: hidden;
	}
	#price #plan_slide .swiper-wrapper{
	}
	#price #plan_slide .swiper-wrapper div.unit{
		width: 85%;
	}
}
@media only screen and (max-width: 768px) {
	#price .plan_area {
		padding: 0 0 40px 0;
	}
}
@media only screen and (max-width: 480px) {
	#price .plan_area {
		padding: 0 0 30px 0;
	}
}



/* ----------------------------------------------------------------------------
	voice
---------------------------------------------------------------------------- */
#voice{
	width: 100%;
	padding: 0 0 90px 0;
	overflow: hidden;
}
#voice h2 span{
	width: 361px;
	margin: 0 auto;
	display: block;
}
#voice h3{
	width: 80.11%;
	margin: 0 auto;
	display: block;
	padding: 0 0 25px 0;
}


#voice #voice_slide{
	width: 850px;
	padding: 0 45px;
	position: relative;
	margin: 0 auto 0 auto;
}
#voice #voice_slide .slider.slick-initialized {
    display: block;
}
#voice #voice_slide .swiper-wrapper{
	width: 100%;
	height: auto;
	margin: 0 auto;
	position: relative;
	text-align: center;
}
#voice #voice_slide .swiper-wrapper div.unit{
	width: 850px;
}
#voice #voice_slide .swiper-wrapper div.unit a{
	width: 100%;
	height: auto;
	margin: 0 auto;
	position: relative;
	padding: 15px 70px 15px 55px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	background: #f5f3f6;
	box-sizing: border-box;
	box-shadow: 3px 3px 8px rgba(0,0,0,0.15);
	overflow: hidden;
	text-decoration: none;
}
#voice #voice_slide .swiper-wrapper div.unit figure{
	width: 355px;
	position: relative;
	line-height: 0;
}
#voice #voice_slide .swiper-wrapper div.unit .txt_area{
	width: 325px;
	position: relative;
}
#voice #voice_slide .swiper-wrapper div.unit .txt_area h4{
	width: 100%;
	position: relative;
	text-align: left;
	font-size: 2.125rem;
	font-weight: 700;
	font-family: 'Zen Maru Gothic', serif;
	color: #350d53;
	padding: 0 0 10px 0;
}
#voice #voice_slide .swiper-wrapper div.unit .txt_area h5{
	width: 100%;
	position: relative;
	text-align: left;
	font-size: 1.125rem;
	font-weight: 700;
	letter-spacing: -0.07em;
	font-family: 'Zen Maru Gothic', serif;
	line-height: 1.4;
	color: #350d53;
	padding: 0 0 10px 0;
	border-bottom: #350d53 2px solid;
}
#voice #voice_slide .swiper-wrapper div.unit .txt_area p{
	width: 100%;
	position: relative;
	text-align: left;
	font-size: 1.000rem;
	font-weight: 600;
	letter-spacing: -0.08em;
	font-family: 'Zen Maru Gothic', serif;
	line-height: 1.3;
	color: #350d53;
	padding: 10px 0 0 0;
}
#voice #voice_slide .swiper-wrapper div.unit .num_area{
	width: 172px;
	height: 172px;
	box-sizing: border-box;
    border-radius: 100%;
	background: #350d53;
	position: absolute;
	top: -86px;
	right: -86px;
	color: #FFF;
}
#voice #voice_slide .swiper-wrapper div.unit .num_area .ht{
	font-size: 1.125rem;
	font-weight: 500;
	font-family: 'EB Garamond', serif;
	color: #FFF;
	position: absolute;
	top: 105px;
    left: 20px;
}
#voice #voice_slide .swiper-wrapper div.unit .num_area .num{
	font-size: 1.875rem;
	font-weight: 500;
	font-family: 'EB Garamond', serif;
	color: #FFF;
	position: absolute;
	top: 123px;
    left: 47px;
	text-align: right;
}

#voice #voice_slide .swiper-button-prev,
#voice #voice_slide .swiper-container-rtl .swiper-button-next {
  left: 30px;
  right: auto;
}
#voice #voice_slide .swiper-button-next,
#voice #voice_slide .swiper-container-rtl .swiper-button-prev {
  right: 30px;
  left: auto;
}
@media only screen and (max-width: 959px) {
	#voice #voice_slide{
		width: 90%;
		padding: 0 35px;
	}
	#voice #voice_slide .swiper-wrapper div.unit{
		width: 100%;
	}
	#voice #voice_slide .swiper-wrapper div.unit a{
		width: 100%;
		padding: 15px 9.5% 15px 5%;
	}
	#voice #voice_slide .swiper-wrapper div.unit figure{
		width: 48%;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area{
		width: 49%;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area h4{
		font-size: 2.125rem;
		padding: 0 0 10px 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area h5{
		font-size: 1.125rem;
		padding: 0 0 10px 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area p{
		font-size: 1.000rem;
		padding: 10px 0 0 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .num_area{
		width: 162px;
		height: 162px;
		top: -81px;
		right: -81px;
	}
	#voice #voice_slide .swiper-wrapper div.unit .num_area .ht{
		font-size: 1.125rem;
		top: 100px;
    	left: 15px;
	}
	#voice #voice_slide .swiper-wrapper div.unit .num_area .num{
		font-size: 1.875rem;
		top: 117px;
		left: 41px;
		text-align: right;
	}

	#voice #voice_slide .swiper-button-prev,
	#voice #voice_slide .swiper-container-rtl .swiper-button-next {
	  left: 25px;
	}
	#voice #voice_slide .swiper-button-next,
	#voice #voice_slide .swiper-container-rtl .swiper-button-prev {
	  right: 25px;
	}
}
@media only screen and (max-width: 899px) {
	#voice{
		padding: 0 0 90px 0;
	}
	#voice h2 span{
		width: 36.1%;
	}
	#voice h3{
		width: 80.11%;
		padding: 0 0 25px 0;
	}
}
@media only screen and (max-width: 768px) {
	#voice{
		padding: 0 0 60px 0;
	}
	#voice h2 span{
		width: 36.1%;
	}
	#voice h3{
		width: 90.11%;
		padding: 0 0 25px 0;
	}
	
	#voice #voice_slide{
		width: 90%;
		padding: 0 25px;
	}
	#voice #voice_slide .swiper-wrapper div.unit a{
		width: 100%;
		padding: 15px 6% 15px 6%;
	}
	#voice #voice_slide .swiper-wrapper div.unit figure{
		width: 100%;
		padding: 0 0 10px 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area{
		width: 100%;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area h4{
		font-size: 1.875rem;
		padding: 0 0 10px 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area h5{
		font-size: 1.000rem;
		padding: 0 0 10px 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area p{
		font-size: 0.938rem;
		padding: 10px 0 0 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .num_area{
		width: 162px;
		height: 162px;
		top: -81px;
		right: -81px;
	}
	#voice #voice_slide .swiper-wrapper div.unit .num_area .ht{
		font-size: 1.125rem;
		top: 100px;
    	left: 15px;
	}
	#voice #voice_slide .swiper-wrapper div.unit .num_area .num{
		font-size: 1.875rem;
		top: 117px;
		left: 41px;
		text-align: right;
	}

	#voice #voice_slide .swiper-button-prev,
	#voice #voice_slide .swiper-container-rtl .swiper-button-next {
	  left: 15px;
	}
	#voice #voice_slide .swiper-button-next,
	#voice #voice_slide .swiper-container-rtl .swiper-button-prev {
	  right: 15px;
	}
}
@media only screen and (max-width: 480px) {
	#voice h2 span{
		width: calc(36.1% * 1.5);
	}
	#voice h3{
		width: 100%;
		padding: 0 0 25px 0;
	}
	
	#voice #voice_slide{
	}
	#voice #voice_slide .swiper-wrapper div.unit a{
		padding: 15px 6% 15px 6%;
	}
	#voice #voice_slide .swiper-wrapper div.unit figure{
		width: 100%;
		padding: 0 0 10px 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area{
		width: 100%;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area h4{
		font-size: 1.625rem;
		padding: 0 0 10px 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area h5{
		font-size: 0.938rem;
		padding: 0 0 10px 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .txt_area p{
		font-size: 0.875rem;
		padding: 10px 0 0 0;
	}
	#voice #voice_slide .swiper-wrapper div.unit .num_area{
		width: 152px;
		height: 152px;
		top: -76px;
		right: -76px;
	}
	#voice #voice_slide .swiper-wrapper div.unit .num_area .ht{
		font-size: 1.000rem;
		top: 92px;
    	left: 15px;
	}
	#voice #voice_slide .swiper-wrapper div.unit .num_area .num{
		font-size: 1.635rem;
		top: 107px;
		left: 41px;
		text-align: right;
	}

	#voice #voice_slide .swiper-button-prev,
	#voice #voice_slide .swiper-container-rtl .swiper-button-next {
	  left: 15px;
	}
	#voice #voice_slide .swiper-button-next,
	#voice #voice_slide .swiper-container-rtl .swiper-button-prev {
	  right: 15px;
	}
}

/* ----------------------------------------------------------------------------
	trainer
---------------------------------------------------------------------------- */
#trainer{
	width: 100%;
	padding: 0 0 90px 0;
}
#trainer h2 span{
	width: 442px;
	margin: 0 auto;
	display: block;
}
#trainer .in-box{
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#trainer .unit{
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 0 0 40px 0;
}

#trainer .in-box figure{
	width: 47.11%;
	line-height: 0;
}
#trainer .in-box .profile{
	width: 49.66%;
}
#trainer .in-box .profile h3.name{
	width: 79.1946%;
	padding: 0 0 20px 0;
}
#trainer .in-box .profile h4{
	width: 100%;
	background: #ee86ad;
	padding: 7px 0;
	margin: 0 0 10px 0;
	line-height: 0;
	border-radius: 50px;
}
#trainer .in-box .profile h4 span{
	width: 21.029%;
	display: block;
	margin: 0 auto;
}
#trainer .in-box .profile p{
	width: 100%;
	font-size: 1.000rem;
	font-weight: 600;
	letter-spacing: -0.09em;
	line-height: 1.6;
	padding: 0 0 15px 0;
}
#trainer .in-box .profile .qualification{
	width: 100%;
}

#trainer .in-box .promise{
	width: 100%;
	margin: 0 auto;
	padding: 10px 0 0 0;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#trainer .in-box .promise h5{
	width: 22.77%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	background: #e4007f;
}
#trainer .in-box .promise h5 span{
	width: 63.9024%;
	padding: 30px 0;
}
#trainer .in-box .promise ul{
	width: 76%;
}
#trainer .in-box .promise ul li{
	width: 100%;
	padding: 0 0 0.2em 0em;
	box-sizing: border-box;
	font-size: 1.375rem;
	font-weight: 600;
	letter-spacing: -0.1em;
	line-height: 1.4;
	text-align: left;
	position: relative;
	color: rgba(0,0,0,1.00);
}
#trainer .in-box .promise ul li::before{
	content: "・";
}

@media only screen and (max-width: 899px) {
	#trainer{
		padding: 0 0 90px 0;
	}
	#trainer h2 span{
		width: 44.2%;
	}
	#trainer .in-box{
	}
	#trainer .in-box figure{
		width: 47.11%;
		line-height: 0;
	}
	#trainer .in-box .profile{
		width: 49.66%;
	}
	#trainer .in-box .profile h3.name{
		width: 79.1946%;
		padding: 0 0 20px 0;
	}
	#trainer .in-box .profile h4{
		padding: 7px 0;
		margin: 0 0 10px 0;
	}
	#trainer .in-box .profile h4 span{
		width: 21.029%;
	}
	#trainer .in-box .profile p{
		font-size: 1.000rem;
		padding: 0 0 15px 0;
	}
	#trainer .in-box .profile .qualification{
		width: 100%;
	}

	#trainer .in-box .promise{
		padding: 10px 0 0 0;
	}
	#trainer .in-box .promise h5{
		width: 22.77%;
	}
	#trainer .in-box .promise h5 span{
		width: 63.9024%;
		padding: 30px 0;
	}
	#trainer .in-box .promise ul{
		width: 76%;
	}
	#trainer .in-box .promise ul li{
		font-size: 1.125rem;
	}
}
@media only screen and (max-width: 768px) {
	#trainer{
		padding: 0 0 60px 0;
	}
	#trainer h2 span{
		width: 44.2%;
	}
	#trainer .in-box{
	}
	#trainer .unit{
		padding: 0 0 30px 0;
	}
	#trainer .in-box figure{
		width: 100%;
		line-height: 0;
		padding: 0 0 20px 0;
	}
	#trainer .in-box .profile{
		width: 100%;
	}
	#trainer .in-box .profile h3.name{
		width: 79.1946%;
		padding: 0 0 20px 0;
	}
	#trainer .in-box .profile h4{
		padding: 7px 0;
		margin: 0 0 10px 0;
	}
	#trainer .in-box .profile h4 span{
		width: 21.029%;
	}
	#trainer .in-box .profile p{
		font-size: 1.000rem;
		padding: 0 0 15px 0;
	}
	#trainer .in-box .profile .qualification{
		width: 100%;
	}

	#trainer .in-box .promise{
		padding: 5px 0 0 0;
	}
	#trainer .in-box .promise h5{
		width: 22.77%;
	}
	#trainer .in-box .promise h5 span{
		width: 63.9024%;
		padding: 30px 0;
	}
	#trainer .in-box .promise ul{
		width: 76%;
	}
	#trainer .in-box .promise ul li{
		font-size: 1.000rem;
	}
}
@media only screen and (max-width: 480px) {
	#trainer h2 span{
		width: calc(44.2% * 1.5);
	}
	#trainer .in-box figure{
		padding: 0 0 20px 0;
	}
	#trainer .in-box .profile h3.name{
		width: 79.1946%;
		padding: 0 0 20px 0;
	}
	#trainer .in-box .profile h4 span{
		width: 25.029%;
	}
	#trainer .in-box .profile p{
		font-size: 0.938rem;
		padding: 0 0 15px 0;
	}
	#trainer .in-box .profile .qualification{
		width: 100%;
	}

	#trainer .in-box .promise{
		padding: 5px 0 0 0;
	}
	#trainer .in-box .promise h5{
		width: 100%;
	}
	#trainer .in-box .promise h5 span{
		width: 28.9024%;
		padding: 20px 0;
	}
	#trainer .in-box .promise ul{
		width: 100%;
		padding: 15px 0 0 0;
	}
	#trainer .in-box .promise ul li{
		font-size: 0.938rem;
	}
}

/* ----------------------------------------------------------------------------
	online
---------------------------------------------------------------------------- */
#online{
	width: 100%;
	padding: 0 0 90px 0;
}
#online h2 span{
	width: 442px;
	margin: 0 auto;
	display: block;
}
#online h3{
	width: 33.333%;
	padding: 0 0 20px 0;
}
#online p.txt{
	width: 100%;
	padding: 0 0 30px 0;
	font-size: 1.062rem;
	font-weight: 600;
	line-height: 1.6;
	letter-spacing: -0.07em;
	text-align: left;
	color: #350d53;
}
#online #yoyaku_table{
	width: 100%;
	overflow: auto;
}
#online #yoyaku_table iframe{
	width: 100%;
}

@media only screen and (max-width: 899px) {
	#online{
		padding: 0 0 90px 0;
	}
	#online h2 span{
		width: 44.2%;
	}
	#online h3{
		width: 33.333%;
		padding: 0 0 20px 0;
	}
	#online p.txt{
		padding: 0 0 30px 0;
		font-size: 1.000rem;
	}
}
@media only screen and (max-width: 768px) {
	#online{
		padding: 0 0 60px 0;
	}
	#online h2 span{
		width: 44.2%;
	}
	#online h3{
		width: 33.333%;
		padding: 0 0 20px 0;
	}
	#online p.txt{
		padding: 0 0 30px 0;
		font-size: 0.938rem;
	}
}
@media only screen and (max-width: 480px) {
	#online h2 span{
		width: calc(44.2% * 1.5);
	}
	#online h3{
		width: calc(33.333% * 1.5);
		padding: 0 0 20px 0;
	}
	#online p.txt{
		padding: 0 0 30px 0;
		font-size: 0.875rem;
	}
}

/* ----------------------------------------------------------------------------
	information
---------------------------------------------------------------------------- */
#information{
	width: 100%;
	padding: 0 0 60px 0;
	overflow: hidden;
}
#information h2 span{
	width: 403px;
	margin: 0 auto;
	display: block;
}
#information h3{
	width: 77.555%;
	padding: 0 0 40px 0;
	margin: 0 auto;
}
#information #blog_slide{
	width: 900px;
	margin: 0 auto;
	padding: 0 0;
	position: relative;
}
#information #blog_slide .slider.slick-initialized {
    display: block;
}
#information #blog_slide .swiper-wrapper{
	width: 100%;
	height: auto;
	margin: 0 auto;
	position: relative;
	text-align: center;
}
#information #blog_slide .swiper-wrapper div.unit{
	width: 270px;
	height: auto;
	margin: 0 auto;
	position: relative;
	padding: 0 0;
	border: #999 1px solid;
}
#information #blog_slide .swiper-wrapper div.unit figure{
	width: 100%;
	margin: 0 auto;
	position: relative;
	line-height: 0;
}
#information #blog_slide .swiper-wrapper div.unit figure img{
	width: 100%;
	height: auto;
}

@media only screen and (max-width: 899px) {
	#information{
		padding: 0 0 60px 0;
	}
	#information h2 span{
		width: 40.3%;
	}
	#information h3{
		width: 77.555%;
		padding: 0 0 40px 0;
	}
	#information #blog_slide{
		width: 100%;
	}
	#information #blog_slide .swiper-wrapper{
	}
	#information #blog_slide .swiper-wrapper div.unit{
		width: 33%;
	}
}
@media only screen and (max-width: 768px) {
	#information{
		padding: 0 0 40px 0;
	}
	#information h2 span{
		width: 40.3%;
	}
	#information h3{
		width: 77.555%;
		padding: 0 0 30px 0;
	}
}
@media only screen and (max-width: 480px) {
	#information h2 span{
		width: calc(40.3% * 1.5);
	}
	#information h3{
		width: 100%;
	}
}

/* ----------------------------------------------------------------------------
	faqfaq
---------------------------------------------------------------------------- */
#faq{
	width: 100%;
	padding: 0 0 0 0;
}
#faq h2 span{
	width: 235px;
	margin: 0 auto;
	display: block;
}

.cp_qa *, .cp_qa *:after, .cp_qa *:before {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.cp_qa .cp_actab {
	position: relative;
	overflow: hidden;
	width: 100%;
	margin: 0 0 20px 0;
	color: #350d53;
	text-align: left;
}
.cp_qa .cp_actab input {
	position: absolute;
	opacity: 0;
}
.cp_qa .cp_actab label {
	line-height: 1.6em;
	position: relative;
	display: block;
	margin: 0 0 0 0;
	padding: 20px 73px 20px 85px;
	cursor: pointer;
	background: #d7cfdd;
	border-top: #211815 1px solid;
	border-left: #211815 1px solid;
	border-right: #211815 1px solid;
	border-bottom: #211815 1px solid;
	font-size: 1.250rem;
	font-weight: bold;
	text-align: left;
	letter-spacing: -0.06em;
}
.cp_qa .cp_actab label::before {
	content: '';
	width: 30px;
	height: 31px;
	background: url("../img/common/icon_q.svg") center center/cover no-repeat;
	position: absolute;
	top: 21px;
	left: 30px;
}
.cp_qa .cp_actab label:hover {
	transition: all 0.2s;
	color: #622392;
}
/* --質問の＋アイコン */
.cp_qa .cp_actab label::after {
	position: absolute;
	padding: 0 0;
	top: 30px;
	right: 40px;
	content: '';
	width: 26px;
	height: 15px;
	background: url("../img/common/icon_arrow_d.svg") center center/cover no-repeat;
	-webkit-transition: transform 0.2s;
	        transition: transform 0.2s;
}

.cp_qa .cp_actab .cp_actab-content {
	position: relative;
	overflow: hidden;
	max-height: 0;
	padding: 0 0 0 0;
	-webkit-transition: max-height 0.2s;
	        transition: max-height 0.2s;
	border-radius: 0 0 0 0;
	background: #ebe7ee;
}
.cp_qa .cp_actab .cp_actab-content::before {
	position: absolute;
	top: 30px;
	left: 28px;
	width: 32px;
	height: 25px;
	background: url("../img/common/icon_a.svg") center center/cover no-repeat;
	content: '';
}
.cp_qa .cp_actab .cp_actab-content p {
	padding: 1.5em 73px 1.5em 84px;
	line-height: 1.7;
	font-size: 1.250rem !important;
	font-weight: 600;
	letter-spacing: -0.06em;
	text-align: left;
}

.cp_qa .cp_actab input:checked ~ .cp_actab-content {
	max-height: 40em;
	border-left: #211815 1px solid;
	border-right: #211815 1px solid;
	border-bottom: #211815 1px solid;
}
.cp_qa .cp_actab input:checked ~ label {
	border-bottom: none;
}
.cp_qa .cp_actab input[type=checkbox]:checked + label::after {
	-webkit-transform: rotateZ(180deg);
	transform: rotateZ(180deg);
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}


@media only screen and (max-width: 899px) {
	#faq{
		width: 100%;
		padding: 0 0 0 0;
	}
	#faq h2 span{
		width: 23.5%;
	}

	.cp_qa .cp_actab label {
		padding: 1.5em 73px 1.5em 85px;
		font-size: 1.125rem;
	}
	.cp_qa .cp_actab .cp_actab-content p {
		padding: 1.5em 73px 1.5em 84px;
		font-size: 1.125rem !important;
	}

}
@media only screen and (max-width: 768px) {
	#faq h2 span{
		width: 23.5%;
	}

	.cp_qa .cp_actab label {
		padding: 1.5em 53px 1.5em 65px;
		font-size: 1.000rem;
	}
	.cp_qa .cp_actab .cp_actab-content p {
		padding: 1.5em 53px 1.5em 65px;
		font-size: 1.000rem !important;
	}
	.cp_qa .cp_actab label::after {
		top: 30px;
		right: 20px;
		content: '';
		width: 26px;
		height: 15px;
	}
	.cp_qa .cp_actab label::before {
		top: 21px;
		left: 20px;
	}
	.cp_qa .cp_actab .cp_actab-content::before {
		position: absolute;
		top: 30px;
		left: 18px;
	}
}
@media only screen and (max-width: 480px) {
	#faq h2 span{
		width: calc(23.5% *1.5);
	}

	.cp_qa .cp_actab label {
		padding: 1.5em 53px 1.5em 65px;
		font-size: 0.938rem;
	}
	.cp_qa .cp_actab .cp_actab-content p {
		padding: 1.5em 53px 1.5em 65px;
		font-size: 0.938rem !important;
	}
}




.comming{
	width: 900px;
	margin: 0 auto;
	background: #d7cfdd;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	padding: 10% 0;
}
.comming .copy{
	margin: 0 auto;
	background: #350d53;
	padding: 1em;
}
.comming .copy h4{
	font-size: 1.625rem;
	text-align: center;
	font-weight: 500;
	font-family: 'EB Garamond', serif;
	letter-spacing: 0.12em;
	color: rgba(255,255,255,1.00);
	padding: 0 0 0.6em 0;
}
.comming .copy p{
	font-size: 0.875rem;
	text-align: center;
	font-weight: 600;
	font-family: 'Zen Maru Gothic', serif;
	color: rgba(255,255,255,1.00);
}

@media only screen and (max-width: 899px) {
	.comming{
		width: 90%;
	}
	.comming .copy h4{
		font-size: 1.500rem;
	}
	.comming .copy p{
		font-size: 0.813rem !important;
	}
}
@media only screen and (max-width: 768px) {
	.comming{
		width: 80%;
	}
	.comming .copy h4{
		font-size: 1.375rem;
	}
	.comming .copy p{
		font-size: 0.750rem !important;
	}
}
@media only screen and (max-width: 480px) {
	.comming .copy h4{
		font-size: 1.250rem;
	}
	.comming .copy p{
		font-size: 0.688rem !important;
	}
}



#campaign{
	width: 100%;
	background: #fadbda;
	padding: 0 0 60px 0;
}
#campaign h2{
	width: 100%;
	padding: 0 0 40px 0;
	background: #fadbda;
}
#campaign .nayami{
	width: 100%;
	margin: 0 auto;
	padding: 0 0 20px 0;
}
#campaign .taiken{
	width: 96%;
	margin: 0 auto;
	padding: 0 0 20px 0;
}
#campaign p{
	text-align: center;
	font-size: 1.250rem;
	line-height: 1.8;
	padding: 0 0 35px 0;
}

#campaign .ex_menu{
	width: 100%;
}
#campaign .ex_menu h3{
	width: 100%;
	text-align: center;
	font-size: 2.25rem;
	line-height: 1.2;
	background: #e4007f;
	padding: 0.4em 1em;
	color: #FFFFFF;
	border-radius: 50px;
	margin: 0 0 30px 0;
	box-sizing: border-box;
}

#campaign .ex_menu ul{
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 0 0 50px 0;
}
#campaign .ex_menu ul li{
	width: 28.333%;
	border-radius: 10px;
	box-shadow: 0 3px 5px rgba(0,0,0,0.6);
	line-height: 0;
	overflow: hidden;
}

#campaign .btns{
	width: 100%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
#campaign .btns a{
	width: 38.444%;
	display: block;
	margin: 0 15px;
}
@media only screen and (max-width: 899px) {
	#campaign{
		padding: 0 0 60px 0;
	}
	#campaign h2{
		padding: 0 0 35px 0;
	}
	#campaign .nayami{
		padding: 0 0 20px 0;
	}
	#campaign .taiken{
		width: 96%;
		margin: 0 auto;
		padding: 0 0 20px 0;
	}
	#campaign p{
		font-size: 1.125rem;
		padding: 0 0 25px 0;
	}

	#campaign .ex_menu h3{
		font-size: 2.00rem;
		margin: 0 0 30px 0;
	}

	#campaign .ex_menu ul{
		padding: 0 0 40px 0;
	}
	#campaign .ex_menu ul li{
		width: 28.333%;
	}

	#campaign .btns a{
		width: 38.444%;
	}
}
@media only screen and (max-width: 768px) {
	#campaign{
		padding: 0 0 35px 0;
	}
	#campaign h2{
		padding: 0 0 20px 0;
	}
	#campaign .nayami{
		padding: 0 0 10px 0;
	}
	#campaign .taiken{
		width: 100%;
		margin: 0 auto;
		padding: 0 0 10px 0;
	}
	#campaign p{
		font-size: 1.000rem;
		padding: 0 0 20px 0;
	}

	#campaign .ex_menu h3{
		font-size: 1.625rem;
		margin: 0 0 15px 0;
	}

	#campaign .ex_menu ul{
		padding: 0 0 30px 0;
	}
	#campaign .ex_menu ul li{
		width: 30%;
	}

	#campaign .btns a{
		width: 48%;
		margin: 0 0 0 0;
	}
}
@media only screen and (max-width: 480px) {
	#campaign{
		padding: 0 0 35px 0;
	}
	#campaign h2{
		padding: 0 0 20px 0;
	}
	#campaign .nayami{
		padding: 0 0 10px 0;
	}
	#campaign .taiken{
		width: 96%;
		margin: 0 auto;
		padding: 0 0 10px 0;
	}
	#campaign p{
		font-size: 0.938rem;
		padding: 0 0 20px 0;
	}

	#campaign .ex_menu h3{
		font-size: 1.375rem;
		margin: 0 0 15px 0;
	}

	#campaign .ex_menu ul{
		padding: 0 0 30px 0;
	}
	#campaign .ex_menu ul li{
		width: 80%;
		margin: 0 auto 10px auto;
	}

	#campaign .btns a{
		width: 80%;
		margin: 0 auto 10px auto;
	}
}

#flowting{
	width: 300px;
	position: fixed;
	bottom: 200px;
	right: 0px;
	z-index: 999;
	padding: 10px 30px 0 25px;
	box-sizing: border-box;
	background: #F9EB22;
	border-radius: 30px 0 0 30px;
	border-top: #CD2E7D 3px solid;
	border-left: #CD2E7D 3px solid;
	border-bottom: #CD2E7D 3px solid;
}
#flowting img{
	width: 100%;
	display: block;
	line-height: 0;
}
#flowting i#close{
	width: 30px;
	position: absolute;
	top: -10px; 
	right: 30px;
	cursor: pointer;
}
@media only screen and (max-width: 768px) {
	#flowting{
		width: 45%;
		bottom: 40px;
		right: auto;
		left: 5%;
		z-index: 999;
		padding: 2% 5% 0 5%;
		box-sizing: border-box;
		background: #F9EB22;
		border-radius: 30px 30px 30px 30px;
		border-top: #CD2E7D 3px solid;
		border-left: #CD2E7D 3px solid;
		border-bottom: #CD2E7D 3px solid;
		border-right: #CD2E7D 3px solid;
	}
	#flowting i#close{
		width: 30px;
		position: absolute;
		top: -15px; 
		right: 5%;
		cursor: pointer;
	}
}
@media only screen and (max-width: 480px) {
	#flowting{
		width: 45%;
		border-radius: 16px 16px 16px 16px;
	}
}