@charset "utf=8";

/* ==========================================
work01
========================================== */

.work01-title-block {
	text-align: center;
}

.work01-text-block {
    margin: 5rem 0 0 0;
    text-align: center;
}

/* ==========================================
work02
========================================== */

.work02-main-title-block {
    text-align: center;
}

.work02-frame {
    margin: 10rem 0 0 0;
}

.work02-block01 {
    margin: 15rem 0 0 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.work02-block01:first-child {
    margin: 0;
}

.work02-block01:nth-of-type(even) {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: row-reverse;
}

.work02-img {
    max-width: 56rem;
    width: 45.9%;
	border-radius: 0.8rem;
    overflow: hidden;
}

.work02-text-area {
    max-width: 60rem;
    width: 49.2%;
}

.work02-radius-block {
    width: 8rem;
    height: 8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5rem;
}

.work02-radius-text {
    font-size: 3rem;
    font-weight: 700;
}

.work02-title-block {
	margin: 1rem 0 0 0;
}

.work02-text-block {
	margin: 2rem 0 0 0;
}

/* ==========================================
work03
========================================== */

.work03-main-title-block {
	text-align: center;
}

.work03-frame {
	margin: 8rem 0 0 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem 2rem;
}

.work03-block {
	padding: 4rem 2rem;
	border-radius: 0.8rem;
    overflow: hidden;
}

.work03-text-area {
	max-width: 40rem;
	width: 100%;
	margin: auto;
}


.work03-title {
    font-size: 2.2rem;
    letter-spacing: 0.1em;
    font-weight: 700;
}

.work03-text-block {
    margin: 2rem 0 0 0;
}

.work03-text01 {
    font-size: 1.6rem;
    font-weight: 500;
}

.work03-text02 {
    font-size: 1.6rem;
    font-weight: 400;
}

/* ==========================================
work04
========================================== */

.work04-link-area {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 1920px) {



}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 1550px) {



}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 1024px) {

	.work02-block01 {
		margin: 12rem 0 0 0;
	}

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 768px) {

	/* ==========================================
	work01
	========================================== */

	.work01-text-block p br {
		display: none;
	}

	/* ==========================================
	work02
	========================================== */


	.work02-frame {
		margin: 8rem 0 0 0;
	}

	.work02-block01 {
		margin: 6rem 0 0 0;
		align-items: center;
		flex-direction: column;
	}

	.work02-block01:nth-of-type(even) {
		align-items: center;
		flex-direction: column;
	}
	
	.work02-img {
		width: 100%;
	}
	
	.work02-text-area {
		margin: 4rem 0 0 0;
		max-width: 56rem;
		width: 100%;
	}
	
	.work02-radius-block {
		width: 6rem;
		height: 6rem;
		border-radius: 5rem;
	}

	.work02-radius-text {
		font-size: 2.4rem;
	}

	/* ==========================================
	work03
	========================================== */

	.work03-frame {
		margin: 6rem 0 0 0;
		grid-template-columns: repeat(1, 1fr);
	}

	.work03-text-area {
		max-width: 50rem;
	}

	/* ==========================================
	work04
	========================================== */

	.work04-link-area {
		grid-template-columns: repeat(1, 1fr);
	}

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 576px) {
	
	/* ==========================================
	work01
	========================================== */

	.work01-title-block .title02 br {
		display: none;
	}

	/* ==========================================
	work03
	========================================== */

	.work03-block {
		padding: 2rem 2rem;
	}

	.work03-text-block {
		margin: 1rem 0 0 0;
	}

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <= 414px) {



}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */