/*ーーーー ファーストビュー ーーーー*/
.detail_fv{
	height: 83vh;
	background-image: url('./image/detail/detail_fvbg.webp');
	background-size: cover;
	background-position: center;
	display: flex;
	align-items: center;
	justify-content: center;
}
.detail_fvincrm{
	padding-top: 42.5px;
	padding-bottom: 33px;
}

.detail_bluebubble_crm{
	background-image: url('./image/detail/detail_bluebubble.webp');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	height: 179.5px;
	width: 180px;
	color: #FF510A;
	font-size: 32px;
	font-weight: 900;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	margin-bottom: -20px;
	position: relative;
	z-index: 10;
	text-align: center;
}
.detail_question_crm{
	background: #FFF;
	padding: 39px 57.5px;
	text-align: center;
	font-size: 20px;
	font-weight: 900;
	line-height: 1.5;
	border-radius: 30px;
	position: relative;
	z-index: 5;
}
.question_mark{
	position: absolute;
	top: -20px;
	left: -20px;
	width: 81px;
	height: 79px;
}
.detail_mark{
	position: absolute;
	bottom: -15px;
	right: 30px;
	width: 20.5px;
	height: 34.5px;
}
.detail_yellowbubble_crm{
	background-image: url('./image/detail/detail_yellowbubble.webp');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	height: 179.5px;
	width: 180px;
	color: #006BCF;
	font-size: 32px;
	font-weight: 900;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	margin-top: -20px;
	position: relative;
	z-index: 10;
	text-align: center;
}


/*ーーーー みんなの答えは ーーーー*/
.detail_answer{
	padding: 40px 20px;
	padding-top: 17.5px;
	background-image: url('./image/detail/detail_answerbg.webp');
	background-size: cover;
	background-position: center;
}
.detail_answertitle{
	width: 98%;
	margin: 0 auto;
}
.detail_graph{
	width: 94%;
	margin: 0 auto;	
	margin-top: 35px;
}
.detail_graphtext{
	font-size: 12px;
	font-weight: 500;
	line-height: 1.71;
	text-align: center;
	margin-top: 20px;
}


/*ーーーー みんなのコメント ーーーー*/
.blue_commentcrm{
	padding: 40px 20px;
	background-image: url('./image/detail/detail_commentbluebg.webp');
	background-size: cover;
	background-position: center;
}
.detail_commenttitle{
	width: 236.5px;
	margin: 0 auto;
}
.blue_commentincrm{
	display: flex;
	gap: 10px;
	margin-top: 55px;
}
.blue_comment_leftcrm{
	width: 50%;
}
.blue_comment_rightcrm{
	width: 50%;
	margin-top: 15px;
}
.blue_comment_textcrm{
	background: #FFF;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.42;
	text-align: center;
	border: 2px solid #003F83;
	border-radius: 15px;
	box-shadow: 5px 5px #024A7D;
	padding: 9px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.blue_comment_textcrmmt{
	margin-top: 15px;
}
.blue_comment_textbigcrm{
	width: 100%;
	background: #FFF;
	font-size: 16px;
	font-weight: 900;
	line-height: 1.42;
	text-align: center;
	border: 2px solid #003F83;
	border-radius: 15px;
	box-shadow: 5px 5px #024A7D;
	padding: 30px 0;
	margin-top: 18px;
}
.blue_comment_answercrm{
	width: 156.5px;
	height: 156.47px;
	background-image: url('./image/detail/detail_commentmark01.webp');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	margin: 0 auto;
	margin-top: 20px;
	font-size: 32px;
	font-weight: 900;
	color: #FFF;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.yellow_commentcrm{
	padding: 40px 20px;
	background-image: url('./image/detail/detail_commentyellowbg.webp');
	background-size: cover;
	background-position: center;
}
.yellow_commentincrm{
	display: flex;
	gap: 10px;
	margin-top: 20px;
}
.yellow_comment_answercrm{
	width: 156.5px;
	height: 156.47px;
	background-image: url('./image/detail/detail_commentmark02.webp');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	margin: 0 auto;
	margin-top: 20px;
	font-size: 32px;
	font-weight: 900;
	color: #FFF;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}
.yellow_comment_textcrm{
	background: #FFF;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.42;
	text-align: center;
	border: 2px solid #FFDB1B;
	border-radius: 15px;
	box-shadow: 5px 5px #FF8F17;
	padding: 9px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.yellow_comment_textbigcrm{
	width: 100%;
	background: #FFF;
	font-size: 16px;
	font-weight: 900;
	line-height: 1.42;
	text-align: center;
	border: 2px solid #FFDB1B;
	border-radius: 15px;
	box-shadow: 5px 5px #FF8F17;
	padding: 30px 0;
	margin-top: 18px;
}


/*ーーーー 他の回答もみる ーーーー*/
.others_answer{
	padding: 40px 20px;
	background-image: url('./image/cta_bg.webp');
	background-size: cover;
	background-position: center;
	text-align: center;
}

.cta{
	display: none;
}


/*ーーーー 設問毎のフォントサイズ ーーーー*/
.detail2-1_bubble,.detail2-1_answer{
	font-size: 24px;
}

.detail2-2_bubble,.detail2-2_answer{
	font-size: 24px;
}
.detail2-3_bubble,.detail2-3_answer{
	font-size: 24px;
}
.detail3-3_bubble,.detail3-3_answer{
	font-size: 22px;
}
.detail3-3-2_bubble{
	font-size: 20px;
}
.detail3-3-2_answer{
	font-size: 18px;
}

/*ーーーー 2回目公開 ーーーー*/
.detail4-1_bubble{
	font-size: 24px;
}
.detail4-1_answer{
	font-size: 18px;
}
.detail4-2_bubble{
	font-size: 24px;
}
.detail4-2_answer{
	font-size: 22px;
}
.detail5-1_bubble{
	font-size: 24px;
}
.detail5-1_answer{
	font-size: 22px;
}
.detail5-2_bubble{
	font-size: 24px;
}
.detail5-2_answer{
	font-size: 22px;
}
.detail6-1_bubble{
	font-size: 22px;
}
.detail6-1_answer{
	font-size: 20px;
}
.detail6-2_bubble{
	font-size: 28px;
}
.detail6-2_answer{
	font-size: 22px;
}
.detail6-3_bubble{
	font-size: 22px;
}
.detail6-3_answer{
	font-size: 20px;
}
.detail6-4_bubble{
	font-size: 22px;
}
.detail6-4_answer{
	font-size: 20px;
}
.detail7-1_bubble,.detail7-1_answer{
	font-size: 22px;
}
.detail7-2_bubble{
	font-size: 22px;
}
.detail7-2_answer{
	font-size: 20px;
}

/*ーーーー 3回目公開 ーーーー*/
.detail8-1_bubble{
	font-size: 26px;
}
.detail8-1_answer{
	font-size: 22px;
}
.detail8-2_bubble{
	font-size: 22px;
}
.detail8-2_answer{
	font-size: 20px;
}
.detail9-2_bubble{
	font-size: 26px;
}
.detail9-2_answer{
	font-size: 22px;
}
.detail9-3_bubble{
	font-size: 22px;
}
.detail9-3_answer{
	font-size: 20px;
}
.detail9-4_bubble{
	font-size: 26px;
}
.detail9-4_answer{
	font-size: 22px;
}
.detail9-5_bubble{
	font-size: 26px;
}
.detail9-5_answer{
	font-size: 20px;
}
.detail10-1_bubble{
	font-size: 26px;
}
.detail10-1_answer{
	font-size: 20px;
}
.detail10-2_bubble{
	font-size: 22px;
}
.detail10-2_answer{
	font-size: 20px;
}


.detail_x{
	width: 40.5px;
}


@media screen and (min-width: 450px) {
	.detail_fv{
		height: 70vh;
		background-image: url('./image/detail/pc_detail_fvbg.webp');
	}
	.detail_mark{
		width: 37px;
		height: initial;
	}
	.detail_fvincrm{
		display: flex;
		align-items: center;
	}
	.detail_question_crm{
		padding: 88px 114px 68px 114px;
		font-size: 40px;
		line-height: 1.5;
	}
	.question_mark{
		right: 0;
		left: 0;
		top: -80px;
		margin: 0 auto;
		width: 162px;
		height: 158px;
	}
	.detail_bluebubble_crm{
		background-image: url('./image/detail/pc_detail_bluebubble.webp');
		width: 380px;
		height: 379px;
		font-size: 62px;
		line-height: 1.3;
		padding-right: 24px;
		margin-right: -70px;
		padding-top: 18px;
	}
	.detail_yellowbubble_crm{
		background-image: url('./image/detail/pc_detail_yellowbubble.webp');
		width: 380px;
		height: 379px;
		font-size: 62px;
		line-height: 1.3;
		padding-left: 15px;
		margin-left: -70px;
		margin-bottom: 150px;
		padding-top: 10px;
	}

	.detail_answer{
		background-image: url('./image/detail/pc_detail_answerbg.webp');
		padding: 9% 0;
		padding-top: 2%;
	}
	.detail_answertitle{
		width: 659px;
	}
	.detail_graph{
		width: 486px;
	}
	.detail_graphtext{
		margin-top: 4%;
		font-size: 16px;
	}

	.blue_commentcrm{
		padding: 9% 0;
		padding-bottom: 50px;
		background-image: url('./image/detail/pc_detail_commentbluebg.webp');
	}
	.detail_commenttitle{
		width: 473px;
	}
	.blue_commentincrm{
		display: block;
		max-width: 1100px;
		margin: 0 auto;
		margin-top: 8%;
	}
	.blue_comment_leftcrm{
		width: 100%;
		display: flex;
		gap: 40px;
		justify-content: center;
	}
	.blue_comment_rightcrm{
		width: 100%;
		display: flex;
		gap: 40px;
		justify-content: center;
		margin-top: 20px;
	}
	.blue_comment_textcrm{
		width: 33%;
		font-size: 18px;
		line-height: 1.66;
		padding: 30px 25px;
	}
	.blue_comment_textcrmmt{
		margin-top: 0px;
	}
	.blue_comment_textbigcrm{
		width: 570px;
		font-size: 24px;
		line-height: 1.875;
		margin: 0 auto;
		margin-top: 40px;
		padding: 40px 0;
	}
	.blue_comment_answercrm{
		width: 230px;
		height: 230px;
		font-size: 48px;
		margin-top: 30px;
	}

	.yellow_commentcrm{
		padding: 9% 0;
		padding-top: 50px;
		background-image: url('./image/detail/pc_detail_commentyellowbg.webp');
	}
	.yellow_comment_answercrm{
		width: 230px;
		height: 230px;
		font-size: 48px;
		margin-bottom: 30px;
	}
	.yellow_comment_textbigcrm{
		width: 570px;
		font-size: 24px;
		line-height: 1.875;
		margin: 0 auto;
		margin-bottom: 40px;
		padding: 40px 0;
	}
	.yellow_commentincrm{
		display: block;
		max-width: 1100px;
		margin: 0 auto;
	}
	.yellow_comment_textcrm{
		width: 33%;
		font-size: 18px;
		line-height: 1.66;
		padding: 30px 25px;
	}

	.others_answer{
		padding: 4% 0;
	}

	/*ーーーー 設問毎のフォントサイズ ーーーー*/
	.detail1-3_bubbl{
		font-size: 56px;
	}
	.detail1-4_bubbl{
		font-size: 56px;
	}
	.detail2-1_bubble{
		font-size: 42px;
	}
	.detail2-1_answer{
		font-size: 32px;
	}
	.detail2-2_bubble{
		font-size: 42px;
	}
	.detail2-2_answer{
		font-size: 32px;
	}
	.detail2-3_bubble{
		font-size: 42px;
	}
	.detail2-3_answer{
		font-size: 32px;
	}
	.detail3-2_bubble{
		font-size: 56px;
	}
	.detail3-3_bubble{
		font-size: 42px;
	}
	.detail3-3-2_bubble{
		font-size: 32px;
	}
	.detail3-3_answer{
		font-size: 32px;
	}
	.detail3-3-2_answer{
		font-size: 26px;
	}

	/*ーーーー 2回目公開 ーーーー*/
	.detail4-1_bubble{
		font-size: 38px;
	}
	.detail4-1_answer{
		font-size: 30px;
	}
	.detail4-2_bubble{
		font-size: 42px;
	}
	.detail4-2_answer{
		font-size: 30px;
	}
	.detail5-1_bubble{
		font-size: 42px;
	}
	.detail5-1_answer{
		font-size: 30px;
	}
	.detail5-2_bubble{
		font-size: 42px;
	}
	.detail5-2_answer{
		font-size: 30px;
	}
	.detail6-1_bubble{
		font-size: 38px;
	}
	.detail6-1_answer{
		font-size: 30px;
	}
	.detail6-2_bubble{
		font-size: 52px;
	}
	.detail6-2_answer{
		font-size: 30px;
	}
	.detail6-3_bubble{
		font-size: 38px;
	}
	.detail6-3_answer{
		font-size: 28px;
	}
	.detail6-4_bubble{
		font-size: 36px;
	}
	.detail6-4_answer{
		font-size: 28px;
	}
	.detail7-1_bubble{
		font-size: 42px;
	}
	.detail7-1_answer{
		font-size: 30px;
	}
	.detail7-2_bubble{
		font-size: 38px;
	}
	.detail7-2_answer{
		font-size: 30px;
	}

	/*ーーーー 3回目公開 ーーーー*/
	.detail8-1_bubble{
		font-size: 42px;
	}
	.detail8-1_answer{
		font-size: 30px;
	}
	.detail8-2_bubble{
		font-size: 38px;
	}
	.detail8-2_answer{
		font-size: 30px;
	}
	.detail9-1_bubble{
		font-size: 56px;
	}
	.detail9-2_bubble{
		font-size: 40px;
	}
	.detail9-2_answer{
		font-size: 30px;
	}
	.detail9-3_bubble{
		font-size: 40px;
	}
	.detail9-3_answer{
		font-size: 30px;
	}
	.detail9-4_bubble{
		font-size: 44px;
	}
	.detail9-4_answer{
		font-size: 30px;
	}
	.detail9-5_bubble{
		font-size: 40px;
	}
	.detail9-5_answer{
		font-size: 30px;
	}
	.detail10-1_bubble{
		font-size: 40px;
	}
	.detail10-1_answer{
		font-size: 30px;
	}
	.detail10-2_bubble{
		font-size: 40px;
	}
	.detail10-2_answer{
		font-size: 30px;
	}


	.detail_x{
		width: 42px;
	}
	.detail_sns_text{
		font-size: 22px;
	}
}

@media screen and (min-width:450px) and ( max-width:959px) {
	/*　画面サイズが768pxから959pxまではここを読み込む　*/
	.detail_fv{
		height: initial;
	}
	.detail_question_crm{
		padding: 44px 20px 34px 20px;
		font-size: 20px;
		width: 280px;
	}
	.detail_yellowbubble_crm{
		margin-bottom: 0px;
	}
	.fv{
		padding: 10px;
	}
	.question_mark{
		top: -45px;
		width: 80px;
		height: 78.1px;
	}
	.detail_bluebubble_crm,.detail_yellowbubble_crm{
		width: 320px;
		height: 319px;
	}
	.detail2-2_bubble{
		font-size: 28px;
	}
	.detail_bluebubble_crm{
		font-size: 36px;
	}
	.detail_yellowbubble_crm{
		font-size: 36px;
	}
	.detail_answertitle{
		width: 50%;
	}
	.detail_answer{
		padding: 40px 20px;
	}
	.detail_graph{
		width: 55%;
	}
	.blue_commentcrm{
		padding: 40px 20px;
	}
	.yellow_commentcrm{
		padding: 40px 20px;
	}
}

.animationsTrigger{
	opacity: 0;
}

.animations {
	animation: animations 1.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

@keyframes animations {
	0% {
		transform: scale(0.8);
		opacity: 0;
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}