@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');

#wrap{
}

#Content_feature * {
  font-family: 'Noto Sans JP', "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
}
#Content_feature{
	position: relative;
	background-color: #ffe6e9;
	margin-bottom: 0;
	padding-bottom: 60px;
}
#Content_feature a{
	text-decoration: none;
}
#Content_feature img{
	max-width: 100%;
}
#Content_feature .article_inner{
	margin: 0 auto;
  width: min(90%, 1080px);
}
#Content_feature .inner{
  margin: 0 auto;
  max-width: min(90%, 800px);
}
@media (max-width: 820px) {
	#Content_feature .inner{
		max-width: 390px;
 		margin: auto;
		padding-left: 2.6%;
		padding-right: 2.6%;
	}
}/*-SP tablet-*/
@media (max-width: 390px) {
	#Content_feature .inner{
		padding-left: 5.1%;
		padding-right: 5.1%;
	}
}/*-SP-*/
#Content_feature .flex{
	display:-webkit-box;
  display:-ms-flexbox;
	display: flex;
	flex-wrap: wrap;
}
@media screen and (min-width: 769px){
#Content_feature .pcFlex{
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
  /*justify-content: space-between;*/
	flex-wrap: wrap;
}
}/*-PC only-*/

/*背景*/
.article_inner,
.mainvisual,
.specialBox,
.detailBox{
	position: relative;
	z-index: 1;
}
.article_inner:has(.mainvisual)::before,
.article_inner:has(.specialBox)::before,
.article_inner:has(.specialBox)::after,
.article_inner:has(.detailBox)::after{
	content: "";
	position: absolute;
	display: block;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
	z-index: 0;
}
.article_inner:has(.mainvisual)::before{
	top: calc(100% - 356px - 60px);
	left: 0;
	width: 272px;
	aspect-ratio: 272 / 356;
	background-image: url("images/bg_flower_left_01.png");
	margin-left: calc(50% - 50vw);
}
.article_inner:has(.specialBox)::before{
	top: calc(100% - 336px - 190px);
	left: 0;
	width: 286px;
	aspect-ratio: 296 / 336;
	background-image: url("images/bg_flower_left_02.png");
	margin-left: calc(50% - 50vw);
}
.article_inner:has(.specialBox)::after{
	bottom: calc(100% - 428px - 210px);
	right: 0;
	width: 269px;
	aspect-ratio: 269 / 428;
	background-image: url("images/bg_flower_right_01.png");
	margin-right: calc(50% - 50vw);
}
.article_inner:has(.detailBox)::after{
	top: -140px;
	right: 0;
	width: 239px;
	aspect-ratio: 239 / 330;
	background-image: url("images/bg_flower_right_02.png");
	margin-right: calc(50% - 50vw);
}
@media screen and (max-width: 768px) {	
	.article_inner:has(.mainvisual)::before{
		top: calc(100% - 178px - 30px);
		width: 136px;
	}
	.article_inner:has(.specialBox)::before{
		top: calc(100% - 168px - 95px);
		width: 143px;
	}
	.article_inner:has(.specialBox)::after{
		bottom: calc(100% - 214px - 105px);
		width: 135px;
	}
	.article_inner:has(.detailBox)::after{
		top: -70px;
		width: 120px;
	}
} /* -SP- */


/* mainmovie */
.mainMovie{
	text-align: center;
}
.mainMovie iframe{
	width: min(100%, 1000px);
	aspect-ratio: 1000 / 562;
	margin: 50px auto 0;
}
@media (max-width: 820px) {
}/*-SP tablet-*/
@media (min-width: 821px) {
}/*-PC only-*/

@media (max-width: 820px) {
#Content_feature .article_inner > div{
	margin-left: auto;
	margin-right: auto;
}
}/*-SP tablet-*/

/* .h2 */
#Content_feature h2.contTi{
	text-align: center;
}
@media (max-width: 820px) {
	#Content_feature h2.contTi{
	}
}/*-SP tablet-*/

.specialBox .contTi{
  margin-block: 14px -10px;
	font-size: 0;
	text-align: center;
}
.specialBox .contTi img{
	width: min(100%, 804px);
}
.specialBox .contTiLead{
	font-size: 23px;
	text-align: center;
	line-height: 1.78em;
	font-weight: 500;
}
.specialBox h3{
	margin-top: 43px;
	margin-bottom: 0.5em;
	color: #14aaff;
	font-size: 20px;
	font-weight: 500;
	text-align: center;
}
.specialBox .name{
	display: flex;
	gap: 38px;
	justify-content: center;
}
.specialBox .name li{
	font-size: 0;
	text-align: center;
}
.specialBox .name li > img{
	height: 36px;
	width: auto;
}
.specialBox .name li span{
	display: block;
	margin-top: 4px;
}
.specialBox .name li span img{
	height: 18px;
	width: auto;
}
.specialBox figure{
	margin-top: 28px;
	display: flex;
	gap: 20px 30px;
	justify-content: center;
}
.specialBox figure img{
	width: min(calc((100% - 30px) / 2), 414px);
}
.specialBox .contPresentLead{
	margin-block: 112px 14px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 10px;
	font-size: 0;
	text-align: center;
}
.specialBox .contPresentLead img{
	width: auto;
	height: 28px;
}
@media screen and (max-width: 768px) {
	.specialBox .contTi {
  	margin-block: 14px 6px;
		margin-inline: -4vw;
	}
	.specialBox .contTi img{
		width: min(calc(100% + 20px, 804px));
	}
	.specialBox .contTiLead{
		margin-inline: -1em;
		font-size: 14px;
	}
	.specialBox .contPresentLead{
		margin-block: 56px 14px;
	}
	.specialBox .contPresentLead img{
		height: 20px;
	}	
	.specialBox .name li > img{
		height: 22px;
	}
	.specialBox .name li span img{
		height: 14px;
	}
	.specialBox figure{
		margin-top: 12px;
		gap: 20px 18px;
	}
} /* -SP- */
@media screen and (min-width: 769px) {	
	.specialBox .contPresentLead{
		padding-right: 34px;
	}
	.specialBox h3 {
  	margin-top: 28px;
	}
} /* -PC only- */

.btn a{
	display: block;
	border-radius: 10px;
	margin: 0 auto;
	padding: 6px 5px;
	width: min(100%, 539px);
	font-size: 30px;
	font-weight: bold;
	text-align: center;
	color: #fff;
}
.btn a:hover{
	opacity: 0.7;
}
.btn.btnTrial a{
	margin-top: 29px;
	background-color: #ff43a1;
}
.btn.btnPresent a{
	margin-top: 5px;
	background-color: #14aaff;
}
@media screen and (max-width: 768px) {
	.btn a{
		padding: 6px 5px;
		width: min(100%, 539px);
		font-size: 20px;
	}
	.btn.btnTrial a{
		margin-top: 29px;
	}	
} /* -SP- */


/**/
.detailBox{
	margin-top: 111px;
	background: #fff;
	justify-content: space-between;
	gap: 30px 40px;
	padding: 61px min(6.1%, 56px) 64px;
	position: relative;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}
.detailBox figure{
	width: 297px;
}
.detailBox .txts h3{
	font-size: 0;
	margin-bottom: 20px;
  padding-top: 8px;
  text-align: left;
}
.detailBox .txts h3 img{
	height: 42px;
  width: auto;
  aspect-ratio: 300 / 27;
}
.detailBox .txts dl{
	display: flex;
	line-height: 41px;
	font-weight: 600;
}
.detailBox .txts dl dt{
	font-size: 32px;
}
.detailBox .txts dl dd{
	font-size: 32px;
}
.detailBox .txts dl dt:nth-of-type(2){
	font-size: 22px;
}
.detailBox .txts dl dd:nth-of-type(2){
	font-size: 22px;
}
.detailBox .txts p{
	margin-top: 22px;
	font-size: 22px;
	line-height: 1.64em;
}
.detailBox .txts p.btn{
	margin-top: 15px;
}
.detailBox .btn a{
	margin-inline: 0 auto;
  padding: 9px 5px 10px;
	background-color: #fff;
	width: min(100%, 360px);
	border: 2px solid #ff43a1;
	color: #ff43a1;
  font-weight: 500;
}

@media (max-width: 820px) {
	.detailBox{
		padding: 40px;
		}
	.detailBox{
		margin-top: 76px;
		gap: 30px 40px;
		padding: 61px min(6.1%, 56px) 64px;
	}
	.detailBox figure{
		width: 230px;
		margin: 0 auto;
	}
	.detailBox .txts{
		margin-top: 30px;
	}
	.detailBox .txts h3{
		font-size: 18px;
		margin-bottom: 15px;
	}
	.detailBox .txts dl{
		flex-wrap: wrap;
	}
	.detailBox .txts dl dt,
	.detailBox .txts dl dt:nth-of-type(2){
		width: 3em;
	}
	.detailBox .txts dl dd,
	.detailBox .txts dl dd:nth-of-type(2){
		width: calc(100% - 3em);
	}
	.detailBox .txts dl{
		line-height: 30px;
	}
	.detailBox .txts dl dt{
		font-size: 24px;
	}
	.detailBox .txts dl dd{
		font-size: 24px;
	}
	.detailBox .txts dl dt:nth-of-type(2){
		font-size: 18px;
	}
	.detailBox .txts dl dd:nth-of-type(2){
		font-size: 18px;
	}
	.detailBox .txts p{
		margin-top: 16px;
		font-size: 16px;
	}
}/*-SP tablet-*/
@media (min-width: 821px) {
	.detailBox figure{
	}
	.detailBox .txts{
		flex: 1;
	}
	.detailBox .txts dl dt:nth-of-type(2){
		margin-left: 1em;
	}
}/*-PC only-*/


/* パソコンで見たときは"pc"のclassがついた画像が表示される */
@media (min-width: 821px) {
.sp { display: none !important; }
}
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media (max-width: 820px) {
.pc { display: none !important; }
}