@charset "utf-8";
.overlay {
		background: #97dfe8;
}
.second_hdr {
		background-repeat: no-repeat;
		background-position: center bottom;
		background-size: 100%;
		background-image: url("../images/tsunagu_hdr_bg_base_pc.png");
}
@media(max-width: 1500px) {
		.second_hdr {
				background-size: 1500px;
		}
}
.second_hdr .bg_col {
		position: absolute;
		background-repeat: no-repeat;
		background-position: center bottom;
		background-size: 2560px;
		bottom: -90px;
		left: 0;
		width: 100%;
		height: 100%;
		pointer-events: none;
}
.second_hdr .bg-1 {
		background-image: image-set(url("../images/tsunagu_hdr_bg-1_pc.webp") type("image/webp"), url("../images/tsunagu_hdr_bg-1_pc.png") type("image/png"));
}
.second_hdr .bg-2 {
		background-image: url("../images/tsunagu_hdr_bg-2_pc.png")
}
.second_hdr .bg-3 {
		background-image: url("../images/tsunagu_hdr_bg-3_pc.png")
}
@media(max-width: 960px) {
		.second_hdr {
				background-size: 1200px;
		}
		.second_hdr .bg_col {
				background-size: 1800px;
				bottom: -70px;
		}
}
@media(max-width: 767px) {
		.second_hdr {
				background-repeat: no-repeat;
				background-position: center bottom;
				background-size: 100%;
				background-image: url("../images/tsunagu_hdr_bg_base_sp.png");
		}
		h1.second_title::before, h1.second_title::after {
				width: 100vw;
				left: -20px;
		}
		h1.second_title::before {
				background-image: url("../images/tsunagu_header_bg0-1_sp.png");
				top: -30px;
				height: 35px
		}
		h1.second_title::after {
				background-image: url("../images/tsunagu_header_bg0-2_sp.png");
				height: 44px;
				bottom: -25px;
		}
		.second_hdr .bg_col {
				background-size: 100%;
				bottom: -60px;
		}
		.second_hdr .bg-1 {
				background-image: url("../images/tsunagu_hdr_bg-1_sp.png")
		}
		.second_hdr .bg-2 {
				background-image: url("../images/tsunagu_hdr_bg-2_sp.png")
		}
		.second_hdr .bg-3 {
				background-image: url("../images/tsunagu_hdr_bg-3_sp.png")
		}
}
/* ============== */
.tsunagu_col {
		max-width: 860px;
		margin: 0 auto 56px;
		padding: 0 30px;
}
.tsunagu_col.last {
		margin-bottom: 180px;
}
.tsunagu_col_inner {
		padding: 50px;
		background-position: 0 0;
		background-size: 476px;
		background-image: url(../images/second_col_bg.jpg);
		box-sizing: border-box;
		border-radius: 50px;
		position: relative;
		z-index: 10;
}
.tsunagu_tile_grid {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap
}
.tsunagu_tile {
		width: 360px;
		margin: 0 0 25px
}
.tsunagu_hd {
		text-align: center;
		font-size: 36px;
		font-weight: 700;
		margin: 0 0 40px;
		color: #48A63F;
}
.tsunagu_lead {
		line-height: 1.8;
		text-align: center;
		margin: 0 0 30px;
		font-weight: 700;
}
.tsunagu_tile_grid .tsunagu_tile:nth-child(3), .tsunagu_tile_grid .tsunagu_tile:nth-child(4) {
		margin-bottom: 0;
}
.tsunagu_photo {
		margin: 0 0 10px;
}
.tsunagu_photo img {
		width: 100%;
		height: auto;
		border-radius: 30px;
}
.tsunagu_tile p {
		font-size: 14px;
		text-align: center;
		line-height: 1.6;
		font-weight: 700;
}
@media(max-width: 960px) {
		.tsunagu_col_inner {
				padding: 40px
		}
		.tsunagu_tile {
				width: calc(50% - 10px);
		}
		.tsunagu_tile p {
				font-size: 13px;
		}
}
@media(max-width: 767px) {
		.tsunagu_col.last {
				margin-bottom: 120px;
		}
		.tsunagu_tile_grid {
				display: block;
		}
		.tsunagu_col {
				margin: 0 auto 80px;
				padding: 0 20px;
		}
		.tsunagu_col_inner {
				padding: 40px 25px;
		}
		.tsunagu_hd {
				font-size: 22px;
				margin: 0 0 30px
		}
		.tsunagu_lead {
				text-align: justify;
				margin: 0 0 30px;
				font-size: 15px;
		}
		.tsunagu_lead br {
				display: none
		}
		.tsunagu_tile {
				width: 100% !important;
				margin: 0 auto 30px;
				max-width: 400px;
		}
		.tsunagu_tile_grid .tsunagu_tile:nth-child(3), .tsunagu_tile_grid .tsunagu_tile:nth-child(4) {
				margin-bottom: 30px;
		}
		.tsunagu_tile_grid .tsunagu_tile:nth-child(4) {
				margin-bottom: 0;
		}
		.tsunagu_photo img {
				width: 100%;
				height: auto;
				border-radius: 30px;
		}
		.tsunagu_tile p {
				font-size: 12px;
		}
}
.tsunagu_section {
		position: relative;
}
.tsunagu_section::before, .tsunagu_section::after {
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		left: 0;
		background-repeat: no-repeat;
		background-position: center top;
		background-size: 2560px;
		pointer-events: none
}
.tsunagu-1::before {
		background-image: url("../images/tsunagu_1-1_bg_pc.png");
		height: 485px;
		top: -60px;
}
.tsunagu-2::before {
		background-image: image-set(url("../images/tsunagu_2-1_bg_pc.webp") type("image/webp"), url("../images/tsunagu_2-1_bg_pc.png") type("image/png"));
		height: 500px;
		top: -410px;
}
.tsunagu-2::after {
		background-image: image-set(url("../images/tsunagu_2-2_bg_pc.webp") type("image/webp"), url("../images/tsunagu_2-2_bg_pc.png") type("image/png"));
		height: 635px;
		bottom: 0;
}
.tsunagu-3::before {
		background-image: image-set(url("../images/tsunagu_3-1_bg_pc.webp") type("image/webp"), url("../images/tsunagu_3-1_bg_pc.png") type("image/png"));
		height: 575px;
		top: -220px;
}
.tsunagu-3::after {
		background-image: image-set(url("../images/tsunagu_3-2_bg_pc.webp") type("image/webp"), url("../images/tsunagu_3-2_bg_pc.png") type("image/png"));
		height: 500px;
		bottom: -110px;
}
@media(max-width: 767px) {
		.tsunagu_section::before, .tsunagu_section::after {
				width: 100%;
				background-size: 100%;
		}
		.tsunagu_col_inner {
				position: relative;
				z-index: 5
		}
		.tsunagu-1::before {
				background-image: url("../images/tsunagu_1-1_bg_sp.png");
				height: 27vw;
				top: -7vw;
				z-index: 10
		}
		.tsunagu-1::after {
				background-image: url("../images/tsunagu_1-2_bg_sp.png");
				height: 79vw;
				top: inherit;
				bottom: -160px;
				background-position: center bottom;
				z-index: 0
		}
		.tsunagu-2::before {
				background-image: url("../images/tsunagu_2-1_bg_sp.png");
				height: 9.3vw;
				top: 60px;
				z-index: 10
		}
		.tsunagu-2::after {
				background-image: url("../images/tsunagu_2-2_bg_sp.png");
				height: 94vw;
				top: inherit;
				z-index: 0;
				bottom: calc(-47vw - 20px);
		}
		.tsunagu-3::before {
				background-image: url("../images/tsunagu_3-1_bg_sp.png");
				height: 13vw;
				top: -6.5vw;
				z-index: 10;
		}
		.tsunagu-3::after {
				background-image: url("../images/tsunagu_3-2_bg_sp.png");
				height: 73.5vw;
				top: inherit;
				bottom: 140px;
				z-index: 0;
		}
		.tsunagu_tile.extra {
				position: relative;
		}
		.tsunagu_tile.extra::after {
				content: '';
				display: block;
				position: absolute;
				left: -40px;
				bottom: -20px;
				width: 100vw;
				height: 9vw;
				background-repeat: no-repeat;
				background-position: center center;
				background-size: 100%;
				pointer-events: none;
				background-image: url("../images/tsunagu_3-3_bg_sp.png")
		}
}