@charset "utf-8";
/* CSS Document */

.smartphone {
}

.smartphone_contents_title {
	flex-direction: column;
	border: 1px solid var(--color_gray);
	.smartphone_contents_title_bigtext {
		order: 2;
		color: #333;
		line-height: 1;
	}
	.smartphone_contents_title_smalltext {
		order: 1;
		color: #555;
		line-height: 1;
	}
}

.smartphone_osusume {
	.smartphone_osusume_lists {
	}
	.smartphone_osusume_list {
	}
	.smartphone_osusume_list:last-child {
		margin-bottom: 0;
	}
	.smartphone_osusume_list_title {
		color: var(--color_orange);
	}
	.smartphone_osusume_list_title span {
		color: var(--color_lightblue);
		font-weight: normal;
	}
	.smartphone_osusume_list_title span:before {
		content: '【';
	}
	.smartphone_osusume_list_title span:after {
		content: '】';
	}
	.smartphone_osusume_list_text {
	}
}

.smartphone_dekirumade {
	.smartphone_dekirumade_lists {
	}
	.smartphone_dekirumade_list {
		background: var(--color_orange);
		position: relative;
	}
	.smartphone_dekirumade_list:after {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		font-family: "Font Awesome 6 Free";
		color: var(--color_orange);
		font-weight: 900;
		content: "\f0d7";
	}
	.smartphone_dekirumade_list:last-child {
		margin-bottom: 0;
	}
	.smartphone_dekirumade_list:last-child:after {
		content: none;
	}
	.smartphone_dekirumade_list_title {
		color: #fff;
	}
	.smartphone_dekirumade_list_text {
		background: #fff;
	}
}

.smartphone_afterword {
	.smartphone_afterword_title {
		color: #333;
		border: 1px solid var(--color_gray);
	}
	.smartphone_afterword_text {
	}
}


/* --------------------------------------------------
PC
-------------------------------------------------- */
@media screen and (min-width: 768px) {
	.smartphone {
	}

	.smartphone_contents_title {
		display: inline-flex;
		margin-bottom: 10px;
		padding: 15px;
		.smartphone_contents_title_bigtext {
			font-size: 24px;
		}
		.smartphone_contents_title_smalltext {
			font-size: 14px;
			margin-bottom: 10px;
		}
	}

	.smartphone_osusume {
		margin-bottom: 40px;
		.smartphone_osusume_lists {
		}
		.smartphone_osusume_list {
			margin-bottom: 10px;
		}
		.smartphone_osusume_list_title {
			display: flex;
			align-items: first baseline;
			font-size: 20px;
		}
		.smartphone_osusume_list_title span {
			font-size: 15px;
			margin-right: 2px;
		}
		.smartphone_osusume_list_text {
			font-size: 14px;
			line-height: 1.7;
			padding: 0 8px;
		}
	}

	.smartphone_dekirumade {
		margin-bottom: 40px;
		.smartphone_dekirumade_lists {
		}
		.smartphone_dekirumade_list {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			margin-bottom: 40px;
			padding: 2px;
		}
		.smartphone_dekirumade_list:after {
			bottom: -42px;
			font-size: 50px;
		}
		.smartphone_dekirumade_list_title,
		.smartphone_dekirumade_list_text {
			padding: 15px 25px;
		}
		.smartphone_dekirumade_list_title {
			width: 30%;
			font-size: 16px;
		}
		.smartphone_dekirumade_list_text {
			width: 70%;
			font-size: 14px;
			line-height: 1.7;
		}
	}

	.smartphone_afterword {
		.smartphone_afterword_title {
			display: inline-block;
			font-size: 20px;
			margin-bottom: 10px;
			padding: 10px 15px;
		}
		.smartphone_afterword_text {
			font-size: 14px;
			line-height: 1.7;
			padding: 0 5px;
		}
	}
}


/* --------------------------------------------------
スマホ
-------------------------------------------------- */
@media all and (max-width: 767px) {
	.smartphone {
	}

	.smartphone_contents_title {
		display: flex;
		margin-bottom: 3vw;
		padding: 3vw;
		.smartphone_contents_title_bigtext {
			font-size: 4vw;
		}
		.smartphone_contents_title_smalltext {
			font-size: 3vw;
			margin-bottom: 2vw;
		}
	}

	.smartphone_osusume {
		margin-bottom: 8vw;
		.smartphone_osusume_lists {
		}
		.smartphone_osusume_list {
			margin-bottom: 3vw;
		}
		.smartphone_osusume_list_title {
			display: flex;
			align-items: first baseline;
			font-size: 3.75vw;
		}
		.smartphone_osusume_list_title span {
			font-size: 3vw;
			margin-right: 0.5vw;
		}
		.smartphone_osusume_list_text {
			font-size: 3.5vw;
			line-height: 1.7;
			padding: 0 1.5vw;
		}
	}

	.smartphone_dekirumade {
		margin-bottom: 8vw;
		.smartphone_dekirumade_lists {
		}
		.smartphone_dekirumade_list {
			margin-bottom: 8vw;
			padding: 2px;
		}
		.smartphone_dekirumade_list:after {
			bottom: -7.7vw;
			font-size: 8vw;
		}
		.smartphone_dekirumade_list_title,
		.smartphone_dekirumade_list_text {
			padding: 2vw 4vw;
		}
		.smartphone_dekirumade_list_title {
			font-size: 3.75vw;
		}
		.smartphone_dekirumade_list_text {
			font-size: 3.5vw;
			line-height: 1.7;
		}
	}

	.smartphone_afterword {
		.smartphone_afterword_title {
			font-size: 4vw;
			line-height: 1.4;
			margin-bottom: 2vw;
			padding: 2vw 3vw;
		}
		.smartphone_afterword_text {
			font-size: 3.5vw;
			line-height: 1.7;
			padding: 0 0.5vw;
		}
	}
}