.debut-course-intro{
 
}
.debut-course-intro .inner{
    padding-left: 10%;
	}
	.debut-course-intro__flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 3rem;
}


	.trial-intro__cont {
    max-width: 600px;
    min-width: 530px;
    width: 44%;
}
	.trial-intro__cont .subindex {
	   color: var(--orange);
				font-size: 48px;
    
				margin: 0px 0px 10px 0px;
				font-weight: bold;
				text-align: center;
	}
		.trial-intro__cont .subindex span{
		  background: linear-gradient(transparent 70%, yellow 70%);
		}
	.trial-intro__cont .index{
				font-size: 2.4rem;
				margin: 0px 0px 20px 0px;
				text-align: center;
	}
		.trial-intro__cont .textArea{
		 margin: 0px 0px 20px 0px;
		}
		.trial-intro__cont .textArea .commentList{
		 margin: 20px 0px;
			padding: 20px;
			background: #FFF;
			border-radius: 20px;
		}
		.trial-intro__cont .textArea .commentList .comment{
		 margin: 0px;
			padding: 5px 0px;
			text-align: center;
			font-size: 18px;
		}
	.trial-intro__cont .textArea .b{
	 font-size: 24px;
		font-weight: bold;
		color: var(--orange);
		background: linear-gradient(transparent 70%, yellow 70%);
	}
	.trial-intro__cont .addTextArea {
	 margin: 20px 0px;
		padding: 10px;
		border-radius: 20px;
		background: #33a17c;
		color: #FFF;
		font-size: 16px;
		line-height: 2;
	}
	.trial-intro__cont .messageArea {
	 margin: 0px 0px;
		padding: 10px;
		border-radius: 20px;
		background: #FFF;
		font-size: 16px;
		line-height: 2;
	}
	.trial-intro__cont .messageArea .title{
				color: #1ca867;
    font-size: 24px;
    margin: 0px 0px 10px 0px;
    font-weight: bold;
 }
	.trial-intro__cont .messageArea .title b{
	 color: var(--orange);
    background: linear-gradient(transparent 70%, yellow 70%);
	}
	.trial-intro__img {
	 max-width: 650px;
  width: 48%;
	}
	.debut-course-cando{
	position: relative;
    margin-top: 10rem;
				margin-bottom: 10rem;
    padding: 3% 6.6%;
    border-radius: 1rem;
    -webkit-border-radius: 1rem;
    background-color: #e9f5df;
	}
	.debut-course-cando .index{
	 margin: 0px;
		    font-size: 3.8rem;
						position: absolute;
    left: 50%;
    top: -0.7em;
    transform: translateX(-50%);
    width: fit-content;
    padding: 0 6rem;
	}
		.debut-course-cando .index::before,
			.debut-course-cando .index::after{
	    position: absolute;
    content: "";
    width: 37px;
    aspect-ratio: 37 / 61;
    top: calc(50% - 3rem);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
	}
	.debut-course-cando .index::before {
  background-image: url(../img/price/bene-ttl01.webp);
  left: 0;
}
	.debut-course-cando .index::after {
  background-image: url(../img/price/bene-ttl02.webp);
  right: 0;
}

	.debut-course-cando .condoList {
	 margin: 0px 0px 20px 0px;
		padding: 20px;
		border-radius: 10px;
		background: #FFF;
	}
	.debut-course-cando .condoList .box{
	   margin-bottom: 1.5rem;
		  padding-bottom: 1.5rem;
    font-size: 1.8rem;
    font-weight: 700;
    position: relative;
	}
	.debut-course-cando .condoList .box::before{	
	position: absolute;
    content: "";
    width: 100%;
    height: 4px;
    bottom: 0;
    left: 0;
    background-image: repeating-radial-gradient(circle, #c2dda8 0px, #c2dda8 2px, transparent 2px, transparent 6px);
    background-repeat: repeat-x;
    background-position: left center;
    background-size: 6px 4px;
	}
		.debut-course-cando .condoList .box .b{
				font-size: 2.4rem;	
	  }
			
			.debut-course-reason{
			 	margin-bottom: 10rem;
			}
			.debut-course-reason .index{
			      margin-bottom: 4rem;
									font-size: 4.2rem;
									color: #FFF;
									text-align: center;
			}
				.debut-course-reason .index .go{
						    color: var(--orange);
				}
				.debut-course-reason .reasonRow{
				 display: flex;
					flex-wrap: wrap;
					align-items: center;
					justify-content: space-between;
				}
				.debut-course-reason .reasonList{
				 margin: 0px;
					padding: 0px;
					width : -webkit-calc(65% - 20px) ;
   width : calc(65% - 20px) ;
				}
				.debut-course-reason .reasonList .reasonBox{
				 margin-bottom: 4rem;
					padding: 20px;
					border-radius: 20px;
					background: #FFF;
				}
				.debut-course-reason .reasonList .reasonBox:last-of-type{
				 margin: 0;
				}
				.debut-course-reason .reasonList .reasonBox .top{
				 display: flex;
					flex-wrap: wrap;
					align-items: center;
					border-bottom: 2px solid #33a17c;
					padding: 0 0 5px 0px;
					font-size: 3rem;
					margin: 0 0 10px 0;
				}
			 
				.debut-course-reason .reasonList .reasonBox .top .no{
				 font-size: 5rem;
					font-weight: bold;
					margin-right: 20px;
				}
				.debut-course-reason .reasonImg{
				 margin: 0px;
					padding: 0px;
					width : -webkit-calc(35% - 20px) ;
   width : calc(35% - 20px) ;
				}
				
				.debut-course-price{
				    margin-bottom: 10rem;
						padding: 3% 6.6%;
						border-radius: 1rem;
						-webkit-border-radius: 1rem;
						    background-color: #e9f5df;
				}
				.debut-course-price .index{
				 font-size: 3.8rem;
					margin-bottom: 4rem;
					text-align: center;
				}
				.debut-course-price .priceList{
				 display: flex;
					flex-wrap: wrap;
					justify-content:center;
				}
				.debut-course-price .priceList .priceBox{
				 width: 500px;
					background: #FFF;
					padding: 0px;
					margin: 0px 20px;
					border: 2px solid #33a17c;
				 max-width : -webkit-calc(50% - 40px) ;
   		max-width : calc(50% - 40px) ;
					border-radius: 10px;
					overflow: hidden;
				}
				.debut-course-price .priceList .priceBox .name{
				 margin: 0px;
					padding: 10px;
					background: #33a17c;
					font-size: 2rem;
					color: #FFF;
					text-align: center;
				}
				.debut-course-price .priceList .priceBox .text{
				 padding: 10px;
					font-size: 1.8rem;
					text-align: center;
				}
				.debut-course-price .priceList .priceBox .text b{
					font-size: 2.8rem;
					text-align: center;
				}
				
				
			.debut-course-image{
				  margin-bottom: 10rem;
						padding: 3% 6.6%;
						border-radius: 1rem;
						-webkit-border-radius: 1rem;
				}
			.debut-course-image .index{
				 font-size: 3.8rem;
					margin-bottom: 4rem;
					text-align: center;
					color: #FFF;
				}
				.debut-course-image .baList{
				 margin: 0px 0px 40px 0px;
					padding: 0px;
					display: flex;
					flex-wrap: wrap;
					justify-content: center;
				}
				.debut-course-image .baList .baBox{
				 width: 400px;
					background: #FFF;
					padding: 20px;
					margin: 0px 20px;
					border: 2px solid #33a17c;
				 max-width : -webkit-calc(40% - 40px) ;
   		max-width : calc(40% - 40px) ;
					border-radius: 10px;
					overflow: hidden;
				}
				.debut-course-image .baList .baBox .i{
				 margin: 0px 0px 10px 0px;
					font-size: 30px;
					font-weight: bold;
					display: flex;
					flex-wrap: wrap;
					align-items: center;
					justify-content: center;
				}
				.debut-course-image .baList .baBox .i img{
				 max-width: 40px;
					margin-right: 20px;
				}
				.debut-course-image .baList .baBox .c{
				 margin: 0px;
					font-size: 20px;
					text-align: center;
				}
				.debut-course-image .baList .arrow{
				 margin: 0px;
					display: flex;
					flex-wrap: wrap;
					align-items: center;
					justify-content: center;
					max-width: 5%;
					width: 50px;
				}
				.debut-course-image .baList .arrow img{
				 width: 80%;
				}
				
				.debut-course-image .comment {
				 margin: 0px;
					padding: 0px;
					text-align: center;
					color: #FFF;
					font-size: 24px;
					font-weight: bold;
				}
				
				
			.debut-course-voice {
    margin-bottom: 10rem;
    padding: 3% 6.6%;
    border-radius: 1rem;
    -webkit-border-radius: 1rem;
    background-color: #e9f5df;
				position: relative;
		}
			.debut-course-voice .index{
	 margin: 0px;
		    font-size: 3.8rem;
						position: absolute;
    left: 50%;
    top: -0.7em;
    transform: translateX(-50%);
    width: fit-content;
    padding: 0 6rem;
	}
			.debut-course-voice .index::before,
			.debut-course-voice .index::after{
	    position: absolute;
    content: "";
    width: 37px;
    aspect-ratio: 37 / 61;
    top: calc(50% - 3rem);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
	}
			.debut-course-voice .index::before {
  background-image: url(../img/price/bene-ttl01.webp);
  left: 0;
}
.debut-course-voice .index::after {
  background-image: url(../img/price/bene-ttl02.webp);
  right: 0;
}

.debut-course-voice .voiceList {
 margin: 0px;
	padding: 0px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	
}
.debut-course-voice .voiceList .voiceBox{
	max-width : -webkit-calc(50% - 50px) ;
 max-width : calc(50% - 50px) ;
	width: 400px;
	margin: 0px 20px;
}
.debut-course-voice .voiceList .voiceBox .c{
  position: relative;
  display: inline-block;
  margin: 1.5em 0;
  padding: 10px 20px;
		text-align: center;
  font-size: 16px;
  background: #FFF;
  border: solid 3px #33a17c;
  box-sizing: border-box;
		border-radius: 1em;
		width: 100%;
}

.debut-course-voice .voiceList .voiceBox .c:before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #FFF;
  z-index: 2;
}

.debut-course-voice .voiceList .voiceBox .c:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #33a17c;
  z-index: 1;
}
.debut-course-voice .voiceList .voiceBox .img{
 margin: 0px;
	padding: 0px;
	text-align: center;
}
.debut-course-voice .voiceList .voiceBox .img img{
 max-height: 200px;
	margin: 0 auto;
}

.debut-course-faq {
 margin-bottom: 10rem;
}
.debut-course-faq .index{
		font-size: 3.8rem;
  margin-bottom: 4rem;
  text-align: center;
	}
	
	.lesson__cta .small {
	 font-size: 18px;
		text-align: center;
		margin-bottom: 20px;
	}
	.lesson__cta .btnRow {
	 display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.lesson__cta .btnRow a{
	 max-width : -webkit-calc(50% - 40px) ;
	 max-width : calc(50% - 40px) ;
		width: 400px!important;
		margin: 0px 10px!important;
	}
	.sponly{
	 display: none;
	}
	
 @media screen and (max-width: 499px) {
	.sponly{
	 display: block;
	}	
	.debut-course-intro__flex{
	 display: block;
	}
	.debut-course-intro .inner{
	 padding: 0px;
	}
	.trial-intro__cont{
	 max-width: 100%;
		min-width:inherit;
		width: auto;
		margin: 0px 0px 40px 0px;
	}
	
	.trial-intro__cont .index{
	 font-size: 2.2rem;
	}

	.trial-intro__cont .textArea .b{
	 font-size: 20px;
	}
	.trial-intro__cont .addTextArea{
	 font-size: 16px;
		padding: 20px;
	}
.trial-intro__cont .messageArea{
 padding: 20px;
}
	
	.trial-intro__img{
	 max-width: 100%;
		width: auto;
	}
	.trial-intro__img img{
	 aspect-ratio:3/2;
		object-fit: cover;
	}
	
	.debut-course-cando{
	 padding: 30px 0;
	}
	.debut-course-cando .index{
	 font-size: 1.8rem;
		left: 15px;
		width:-webkit-calc(100% - 30px) ;
  width : calc(100% - 30px) ;
		text-align: center;
		padding: 0 3rem;
		transform: translateX(0);
	}
	.debut-course-cando .index::before, .debut-course-cando .index::after{
	 width: 20px;
		top: calc(50% - 2rem);
	}
	.debut-course-cando .condoList .box .b{
	     font-size: 2rem;
	}
	.debut-course-cando .condoList .box{
	font-size: 1.6rem;
	}
	body .debut-course-reason{
	 padding: 4rem 1rem;
	}
	body .debut-course-reason .inner{
		width: 100;
	}
	.debut-course-reason .index{
	 margin-bottom: 3rem;
  font-size: 3.8rem;
	}
	.debut-course-reason .reasonRow{
	 display: block;
	}
	.debut-course-reason .reasonList{
	 width: auto;
		margin: 0px 0px 40px 0px;
	}
	.debut-course-reason .reasonImg{
	 width: auto;
	}
	.debut-course-reason .reasonImg img{
	 aspect-ratio:1/2;
		object-fit: cover;
	}
	.debut-course-reason .reasonList .reasonBox .top .no{
	 font-size: 3rem;
		margin-right: 10px;
	}
	.debut-course-reason .reasonList .reasonBox .top{
	 font-size: 2rem;
	}
	.debut-course-price .inner{
	 width: auto;
		padding: 6% 3%;
	}
	.debut-course-price .index{
	     font-size: 2.4rem;
						    margin-bottom: 2rem;
	}
	.debut-course-price .priceList{
	 display: block;
	}
	.debut-course-price .priceList .priceBox{
	 width: auto;
		max-width: inherit;
		margin:0px 0px 20px;
	}
	.debut-course-image{
		padding: 6% 3%;
	}
	.debut-course-image .inner{
	 width: auto;
		padding: 0;
	}
	.debut-course-image .index{
	     font-size: 2.8rem;
    margin-bottom: 2rem;
	}
	.debut-course-image .baList{
	 display: block;
		margin: 0px 0px 20px 0px;
	}
	.debut-course-image .baList .baBox{
	 width: auto;
		max-width: inherit;
		margin: 0px;
		padding: 10px;
	}
	.debut-course-image .baList .baBox .c{
	 font-size: 18px;
	}
	.debut-course-image .baList .arrow{
	 width: auto;
		max-width: inherit;
		padding: 10px 0px;
	}
	.debut-course-image .baList .arrow img{
	 width: 50px;
		transform: rotate(90deg);
	}
	.debut-course-image .comment{
	     font-size: 20px;
	}
	.debut-course-voice{
	     padding: 6% 3%;
	}
	.debut-course-voice .index{
	 font-size: 2rem;
		left: 15px;
		width:-webkit-calc(100% - 30px) ;
  width : calc(100% - 30px) ;
		text-align: center;
		padding: 0 3rem;
		transform: translateX(0);
	}
	.debut-course-voice .index::before, .debut-course-voice .index::after{
	 width: 20px;
		top: calc(50% - 2rem);
	}
	.debut-course-voice .voiceList{
	 display: block;
	}
	.debut-course-voice .voiceList .voiceBox{
	 width: auto;
		max-width: inherit;
		padding: 0px;
		margin: 0px 0px 20px 0px;
	}
	.debut-course-voice .voiceList .voiceBox .c{
	     padding: 10px 5px;
						    font-size: 15px;
	}
	.lesson__cta .btnRow a{
	 margin: 0px 0px 20px 0px!important;
	}
}