@charset "utf-8";
/* Setting */
.fvArea img,
.campaignArea img,
.statementArea img,
.gokkoArea img,
.movieArea img {
	width: 100%;
}
.pc_off {
	display: none;
}
.sp_off {
	display: block;
}
@media screen and (max-width:768px) {
	.pc_off {
		display: block;
	}
	.sp_off {
		display: none;
	}
}
/* FV */
.fvArea {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-height: 600px;
	padding: 7.5% 15%;
	background-image: url("/tsunagu/smilefuture/newlife/images/img_fv_bg.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.fvArea__logo {
	width: 60%;
	max-width: 480px;
	margin-bottom: 2em;
}
.fvArea__title {
	width: 100%;
	max-width: 800px;
	margin: 0;
}
@media (max-width: 768px) {
    .fvArea {
		max-height: auto;
		padding: 30% 4% 40%;
		background-position: center bottom;
	}
	.fvArea__logo {
		width: 70%;
	}
}

/* Campaign */
.campaignArea {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	width: 100%;
	padding: 150px 10%;
	background-image: url("/tsunagu/smilefuture/newlife/images/img_campaign_bg-1.png"), url("/tsunagu/smilefuture/newlife/images/img_campaign_bg-2.png");
	background-position: top center, bottom center;
	background-repeat: no-repeat, no-repeat;
	background-size: 100%, 100%;
}
.campaignArea__subtitle {
	width: 100%;
	max-width: 280px;
	margin-bottom: 60px;
}
.campaignArea__title {
	width: 100%;
	max-width: 830px;
	margin-bottom: 30px;
}
.campaignArea__copy {
	width: 100%;
	margin-bottom: 50px;
	font-size: clamp(1.375rem, 1.161rem + 0.95vw, 1.875rem);/* 22:30/360px-1200px */
	line-height: 2em;
}
.campaignArea__item {
	display: flex;
	width: 100%;
	max-width: 900px;
	margin-bottom: 40px;
	background: #fffcf2;
	text-align: left;
	box-shadow: 0 5px 0 rgba(0, 0, 0, 0.1);
	border-radius: 10px;
}
.campaignArea__item h5 {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 12%;
	max-width: 100px;
	border-right: #fff 2px solid;
	writing-mode: vertical-lr;
	font-size: clamp(1.5rem, 1.071rem + 1.9vw, 2.5rem);/* 24:40/360px-1200px */
	font-weight: bold;
	letter-spacing: 0.2em;
}
.campaignArea__item__detail {
	flex: 1;
	padding: 30px 50px;
}
.campaignArea__item__detail.item--3 {
	display: flex;
	padding: 30px 0;
}
.campaignArea__item--1 {
	display: flex;
	gap: 25px;
	width: 100%;
}
.campaignArea__item--1__photo {
	width: 39.3%;
	max-width: 275px;
}
.campaignArea__item--1__text {
	width: 57.2%;
	max-width: 400px;
}
.campaignArea__item--1__text .text-1 {
	width: 100%;
	max-width: 400px;
}
.campaignArea__item--1__text .text-2 {
	width: 67.5%;
	max-width: 270px;
}
.campaignArea__item--2__text {
	width: 100%;
	margin-bottom: 20px;
	font-size: clamp(1.375rem, 1.161rem + 0.95vw, 1.875rem);/* 22:30/360px-1200px */
	font-weight: bold;
}
.campaignArea__item--3 {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	width: calc((100% - 2px) / 3);
	max-width: 295px;
	padding: 0 10px;
	border-right: #ccc 1px solid;
}
.campaignArea__item--3:last-child {
	border-right: none;
}
.campaignArea__item--3__step {
	width: 56.60377358490566%;
	max-width: 150px;
	margin-bottom: 20px;
}
.campaignArea__item--3__text {
	font-size: clamp(0.75rem, 0.268rem + 2.14vw, 1.875rem);/* 15:30/360px-1200px */
}
.campaignArea__item--3__text a,
.campaignArea__item--3__text span {
	color: #2882cb;
}
.campaignArea__btn {
	width: 100%;
	max-width: 600px;
}
@media (max-width: 768px) {
	.campaignArea {
		padding: 15% 5%;
	}
	.campaignArea__subtitle {
		width: 60%;
		margin-bottom: 3rem;
	}
	.campaignArea__title {
		margin-bottom: 1.5rem;
	}
	.campaignArea__copy {
		margin-bottom: 7.5%;
		line-height: 1.7em;
	}
	.campaignArea__item {
		flex-direction: column;
		margin-bottom: 7.5%;
	}
	.campaignArea__item h5 {
		width: 100%;
		max-width: 100%;
		padding: 2% 0;
		border-right: none;
		border-bottom: #fff 2px solid;
		writing-mode: horizontal-tb;
	}
	.campaignArea__item__detail {
		padding: 7.5% 5%;
	}
	.campaignArea__item__detail.item--3 {
		padding: 7.5% 0;
	}
	.campaignArea__item--1 {
		flex-direction: column;
		align-items: center;
		gap: 2rem;
	}
	.campaignArea__item--1__photo {
		width: 60%;
	}
	.campaignArea__item--1__text {
		width: 70%;
		text-align: center;
	}
	.campaignArea__item--3 {
		padding: 0 2%;
	}
	.campaignArea__item--3__step {
		width: 80%;
		max-width: 100%;
		margin-bottom: 5%;
	}
}

/* Statement */
.statementArea {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	width: 100%;
	padding: 100px 10% 150px;
	background-image: url("/tsunagu/smilefuture/newlife/images/img_statement_bg-gradation.png"), url("/tsunagu/smilefuture/newlife/images/img_statement_bg.png");
	background-position: top center;
	background-repeat: repeat-x, repeat-y;
	background-size: contain, 100%;
	color: #2882cb;
}
.statementArea__title {
	width: 100%;
	max-width: 550px;
	margin-bottom: 75px;
}
.statementArea__copy--01 {
	width: 100%;
	margin-bottom: 60px;
	font-size: clamp(1.375rem, 0.893rem + 2.14vw, 2.5rem);/* 22:40/360px-1200px */
	font-weight: bold;
	line-height: 1.7em;
}
.statementArea__copy--02 {
	width: 100%;
	font-size: clamp(1.375rem, 1.161rem + 0.95vw, 1.875rem);/* 22:30/360px-1200px */
	line-height: 1.9em;
}
@media (max-width: 768px) {
	.statementArea {
		padding: 10% 5% 15%;
	}
	.statementArea__title {
		width: 80%;
		margin-bottom: 4rem;
	}
	.statementArea__copy--01 {
		margin-bottom: 3rem;
	}
}

/* Gokko */
.gokkoArea {
	display: flex;
	justify-content: center;
	width: 100%;
	padding: 150px 50px 125px;
	background-color: #f1f1f1;
	background-image: url("../images/img_gokko_bg-1.png"), url("../images/img_gokko_bg-2.png"), url("../images/img_gokko_bg-3.png");
	background-position: left top, right bottom, right top;
	background-size: min(25%, 300px), min(40%, 500px), min(65%, 770px);
	background-repeat: no-repeat;
}
.gokkoArea__inner {
	display: flex;
	justify-content: space-between;
	gap: clamp(1.563rem, -1.225rem + 5.8vw, 3.125rem);/* 25:50/769px-1200px */
	width: 100%;
	max-width: 1300px;
}
.gokkoArea__photo {
	width: 50%;
	max-width: 650px;
}
.gokkoArea__detail {
	width: 46.15384615384615%;
	max-width: 600px;
	text-align: left;
}
.gokkoArea__title {
	margin-bottom: 10px;
	font-size: clamp(1.875rem, 1.339rem + 2.38vw, 3.125rem);/* 30:50/360px-1200px */
	font-weight: bold;
}
.gokkoArea__text {
	margin-bottom: 10px;
	font-size: clamp(1.125rem, 0.911rem + 0.95vw, 1.625rem);/* 18:26/360px-1200px */
	line-height: 1.7em;
}
.gokkoArea__notis {
	margin-bottom: 25px;
	font-size: 12px;
}
.gokkoArea__btn {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}
.gokkoArea__btn li {
	width: calc((100% - 15px) / 2);
	max-width: 295px;
}
.gokkoArea__btn img {
	transition: 0.5s !important;
}

@media (max-width: 1000px) {
	.gokkoArea {
		background-image: url("../images/img_gokko_bg-2.png"), url("../images/img_gokko_bg-3.png");
		background-position: right bottom, right top;
		background-size: min(40%, 500px), min(65%, 770px);
	}
	.gokkoArea__inner {
		flex-direction: column;
		align-items: center;
		gap: clamp(1.563rem, -1.225rem + 5.8vw, 3.125rem); /* 25:50/769px-1200px */
	}
	.gokkoArea__photo, .gokkoArea__detail {
		width: 100%;
		max-width: 650px;
	}
}
@media (max-width: 768px) {
	.gokkoArea {
		padding: 20% 5% 15%;
		background-position: right bottom, right -100% top;
		background-size: 70%, 90%;
	}
	.gokkoArea__photo, .gokkoArea__detail {
		max-width: 100%;
	}
	.gokkoArea__btn {
    	gap: 10px;
	}
	.gokkoArea__btn li {
		width: calc((100% - 10px) / 2);
		max-width: 100%;
	}
}	

/* Movie */
.movieArea {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	width: 100%;
	padding: 150px 10%;
}
.movieArea.movieArea__movie--01 {
	color: #2882cb;
}
.movieArea.movieArea__movie--02 {
	background-image: url("/tsunagu/smilefuture/newlife/images/img_movie-2_bg.jpg");
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	color: #fff;
}
.movieArea__subtitle {
	width: 100%;
	max-width: 280px;
	margin-bottom: 75px;
}
.movieArea__comingsoon {
	width: 100%;
	max-width: 400px;
}
.movieArea__btn {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 80px;
	width: 100%;
	margin-bottom: 50px;
}
.movieArea__btn div {
	width: 40%;
	max-width: 320px;
}
.movieArea__btn img {
	transition: 0.5s !important;
}
.movieArea__title {
	width: 100%;
	max-width: 420px;
	margin-bottom: 30px;
}
.movieArea__copy {
	width: 100%;
	font-size: clamp(1.375rem, 1.161rem + 0.95vw, 1.875rem);/* 22:30/360px-1200px */
	line-height: 2em;
}
@media (max-width: 768px) {
	.movieArea {
		padding: 15% 5%;
	}
	.movieArea__subtitle {
		width: 60%;
		margin-bottom: 3rem;
	}
	.movieArea__comingsoon {
		width: 70%;
	}
	.movieArea__btn {
		gap: 4%;
		margin-bottom: 3rem;
	}
	.movieArea__btn div {
		width: 48%;
	}
	.movieArea__title {
		width: 70%;
		margin-bottom: 1.5rem;
	}
}