@charset "UTF-8";

/*---------------------------------------------------------
 Project - price-block
---------------------------------------------------------*/
.p-price-block{

	.p-price-block__ttl{
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		column-gap: 1em;
		margin-bottom: .8em;
		h4 {
			font-size: min(2.7vw, 170%);
			font-weight: var(--fw-bold);
			color:var(--color-org);
		}
	}
	.p-price-block__ttl-dot {
		color: var(--color-org);
		margin-right: .3em;
		font-size: 70%;
		vertical-align: .1em;
	}
	.p-price-block__tax {
		white-space: nowrap;
	}


	.p-price-block__list{
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
	}
	.p-price-block__list-row {
		display: grid;
		grid-template-columns: 1fr min(38%,380px);

		&:not(:last-child) {
			border-bottom: 1px dashed #ccc;
		}
		dt {
			align-self: center;
            font-size: min(2.5vw, 150%);
			font-weight: var(--fw-bold);
			padding: 1.4em 1em;

			&::before {
				content: "・";
				margin-right: .3em;
			}
		}
		dd {
			display: flex;
			align-items: center;
			justify-content: center;
			text-align: center;
			font-weight: var(--fw-bold);
			font-size: min(2.5vw, 150%);
			background-color: var(--color-gry-200);
			padding: 1.4em 1em;
		}
	}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.p-price-block{
	.p-price-block__ttl{
		flex-wrap: wrap;
		row-gap: .4em;

		h4 {
			font-size: 4.2vw;
		}
	}
	.p-price-block__tax {
		font-size: 3vw;
	}

	.p-price-block__list-row  {
		grid-template-columns: 1fr min(42%,240px);
		dt {
			font-size: 3.6vw;
			padding: 1.2em .6em;
		}
		dd {
			padding: 1.2em .6em;
			font-size: 3.6vw;
		}
	}
}
}

/*---------------------------------------------------------
 Project - payment
---------------------------------------------------------*/
.p-payment {
	display: flex;
	align-items: flex-start;
	column-gap: min(6vw,80px);

	.p-payment__body {
		flex: 1;
		h4 {
			font-size: min(2.5vw, 150%);
		}
		.c-btn-bg > a {
			background-color: var(--color-org);
		}
	}
	.p-payment__img {
		width: 40%;
		max-width: 420px;

		img {
			width: 100%;
			height: auto;
		}
	}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.p-payment {
	flex-direction: column-reverse;
	row-gap: 1.5em;

	.p-payment__body {
		h4 {
			font-size: 4.8vw;
		}
	}
	.p-payment__img {
		width: 100%;
		max-width: none;
	}
}
}


/*---------------------------------------------------------
 Project - instagram
---------------------------------------------------------*/
.p-insta {
	padding-bottom: min(12vw,150px);

	.c-bg-tri {
		inset: auto 0 0 0;
	}
	a {
		width: fit-content;
		display: block;
	}

	.p-insta__ttl {
		display: flex;
		align-items: center;
		column-gap: .6em;
		width: fit-content;
		border-top: solid 1px #8a969b;
		padding-top: 1.6em;
		margin-bottom: 1.6em;
		h3 {
			color: var(--color-gry-200);
			font-size: min(4.5vw,3.5rem);
		}
		.p-insta__ttl-icon {
			width: min(3vw,2.2rem);
		}
		.c-icon {
			color: var(--color-base);
			font-size: min(1.4vw,1rem);
			margin-left: .4em;
			padding: 1em;
		}
	}
	.p-insta__inner {
		> p {
			font-weight: var(--fw-bold);
		}
	}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.p-insta{
	.p-insta__ttl  {
		h3 {
			font-size: 9vw;
		}
		.p-insta__ttl-icon {
			width: 7vw;
		}
		.c-icon {
			font-size: 4vw;
		}
	}
}
}
