@charset "UTF-8";

/*******************************************************************************
	お知らせ共通
 *******************************************************************************/
.archive_news-nav {
	display: block;
	max-width: 1030px;
	margin: 0 auto;
}

.archive_news-list {
	display: flex;
	width: 100%;
	flex-wrap: wrap;
}

.archive_news-item {
	display: flex;
	overflow: hidden;
}

.archive_news-item a {
	transition: all 0.6s;
}

.archive_news-contents {
	display: flex;
	width: 100%;
	column-gap: clamp(0.625rem, -0.889rem + 3.15vw, 1.25rem);
}


.archive_news-img {
	display: block;
	position: relative;

	aspect-ratio: 4/3;
}

.archive_news-img a {
	display: block;
	overflow: hidden;
	height: 100%;
}


.archive_news-img a img {
	width: 100%;
	height: 100%;
	background-color: #efefef;
	transition: all 0.6s;

	object-fit: cover;
	object-position: center;
}

.archive_news-img a:hover img {
	transform: scale(1.2);
}

.hot_news {
	position: absolute;
	max-width: 50px;
	width: 27.7778%;

	aspect-ratio: 1/1;
}

.archive_news-detail {
	display: flex;
	max-width: 700px;
	width: 100%;
	column-gap: 10px;
	justify-content: space-between;
	align-items: flex-end;
}

.archive_news-inner {
	display: flex;
	max-width: 620px;
	width: 100%;
	flex-direction: column;
}

.archive_news-status {
	display: flex;
	column-gap: clamp(0.625rem, -0.132rem + 1.58vw, 0.938rem);
	flex-wrap: wrap;
	align-items: center;

	row-gap: 5px;
}

.archive_news-status * {
	font-size: 14px;
}

.archive_news-status ul {
	display: flex;
	font-weight: bold;
	column-gap: 10px;
	flex-wrap: wrap;
}

.archive_news-status ul li {
	display: flex;
	padding: 2.5px 20px;
	border-radius: 12.5px;
	background-color: #003366;
	color: #ffffff;
	justify-content: center;
	align-items: center;
}

.archive_news-title {
	margin-bottom: 5px;
	font-weight: bold;
	font-size: clamp(1.125rem, 0.822rem + 0.63vw, 1.25rem);
}

.archive_news-text {
	font-size: 14px;
	line-height: clamp(1.438rem, 0.832rem + 1.26vw, 1.688rem);
	text-align: justify;
}

.archive_news-detail a:hover {
	color: #25425c;
}

@media screen and (min-width: 768px) {
	.archive_news-nav {
		width: 95%;
	}

	.archive_news-list {
		flex-direction: column;
	}

	.archive_news-item {
		width: 100%;
		padding: 20px clamp(1.25rem, -5.564rem + 14.2vw, 4.063rem);
		border-bottom: 1px solid #d8d8d8;
	}

	.archive_news-item:nth-of-type(1) {
		border-top: 1px solid #d8d8d8;
	}

	.archive_news-img {
		width: 180px;
	}

	.hot_news {
		right: 140px;
		bottom: 95px;
	}

	.archive_news-detail {
		width: calc(100% - 180px - clamp(0.625rem, -0.889rem + 3.15vw, 1.25rem));
		column-gap: 10px;
	}

	.archive_news-inner {
		width: calc(100% - 34px);
	}

	.archive_news-status {
		margin-bottom: 15px;
	}
}

@media screen and (max-width: 767px) {
	.archive_news-nav {
		width: 100%;
		padding: 0 20px;
	}

	.archive_news-list {
		row-gap: 20px;
	}

	.archive_news-item {
		max-width: 180px;
	}

	@media screen and (min-width: 501px) {
		.archive_news-list {
			column-gap: 5%;
		}

		.archive_news-item {
			width: 30%;
		}
	}

	@media screen and (max-width: 500px) {
		.archive_news-list {
			column-gap: 7.6922%;
		}

		.archive_news-item {
			width: 46.1539%;
		}
	}

	.archive_news-contents {
		flex-direction: column;
	}

	.archive_news-img {
		width: 100%;
		margin-bottom: 5px;
	}

	.hot_news {
		top: -10px;
	}

	.archive_news-status {
		margin-bottom: 10px;
	}

	.archive_news-detail > a {
		display: none;
	}

	.archive_news-title {
		display: -webkit-box;
		overflow: hidden;
		white-space: normal;
		-webkit-box-orient: vertical;

		-webkit-line-clamp: 2;
	}
}











/*******************************************************************************
	料金プラン共通
 *******************************************************************************/
.rates-list {
	display: flex;
	position: relative;
	z-index: 2;
	max-width: 1140px;
	margin: 0 auto;
	flex-wrap: wrap;
}

.rates_item {
	display: flex;
	position: relative;
	max-width: 370px;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	background-color: #ffffff;
	flex-direction: column;
}

/*.rates_item:nth-of-type(4) {
	display: none;
}*/
.rates_item-vip {
	position: absolute;
	right: calc(0% - clamp(0rem, -33.75rem + 45vw, 5.625rem));
	bottom: calc(100% - clamp(0.938rem, -12.187rem + 17.5vw, 3.125rem));
	z-index: 1;
	max-width: clamp(7.188rem, -7.813rem + 31.25vw, 7.813rem);
	width: 100%;
	padding: 4px;
	border: 1px solid #be9900;
	background-color: #ffffff;
	color: #be9900;
	text-align: center;
}

.rates_item-vip p {
	display: flex;
	width: 100%;
	height: 100%;
	padding: 4.5px 0;
	border: 1px solid #be9900;
	font-weight: bold;
	font-size: clamp(0.75rem, -0.75rem + 3.13vw, 0.813rem);
	flex-direction: column;
}

.rates_item-vip p span {
	font-size: clamp(0.813rem, -0.688rem + 3.13vw, 0.875rem);
}

.rates_item-title {
	display: flex;
	position: relative;
	width: 100%;
	margin-bottom: 35px;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	color: #ffffff;
	font-weight: bold;
	font-size: clamp(1.063rem, 0.302rem + 1.58vw, 1.5rem);
	justify-content: center;
	align-items: center;
}

.rates_item-title span {
	position: absolute;
	top: calc(100% - 1px);
	min-width: 50px;
	content: "";

	aspect-ratio: 5/2;
	clip-path: polygon(0 0, 50% 100%, 100% 0);
}

.rates_item-contents {
	width: 100%;
	padding: 0 clamp(0.625rem, 0.083rem + 1.13vw, 0.938rem) clamp(1.25rem, 0.707rem + 1.13vw, 1.563rem);
}

.rates_item-contents > * {
	width: 100%;
}

.rates_item-contents dt {
	display: flex;
	text-align: center;
}

.rates_item-contents dt.campaign_set {
	margin-bottom: 25px;
	padding-bottom: 0;
	justify-content: space-between;
	align-items: flex-start;
}

.rates_item-contents dt:not(.campaign_set) {
	margin-bottom: 10px;
	text-align: center;
	justify-content: center;
	align-items: baseline;
}



.rates_item-contents dt:not(.campaign_set) .current_rates {
	font-weight: bold;
	font-size: clamp(1.688rem, 1.362rem + 0.68vw, 1.875rem);
	font-size: 16px;
}

.campaign_set .current_rates {
	position: relative;
	font-size: clamp(0.938rem, 0.179rem + 1.58vw, 1.375rem);
	white-space: nowrap;
}

.campaign_set .current_rates::before {
	position: absolute;
	top: 60%;
	transform: translateY(-40%);
	width: 100%;
	height: clamp(0.125rem, 0.017rem + 0.23vw, 0.188rem);
	background-color: #000000;
	content: "";
}

.campaign_set .current_rates span.ex_tax {
	font-weight: 500;
	font-size: 13px;
}

.campaign_rates {
	position: relative;
	color: #e51c1d;
	font-weight: 600;
	font-size: clamp(1.063rem, -0.563rem + 3.39vw, 2rem);
	line-height: clamp(1.188rem, 0.537rem + 1.35vw, 1.563rem);
	text-align: justify;
}

.campaign_rates span.ex_tax {
	font-size: clamp(0.813rem, 0.054rem + 1.58vw, 1.25rem);
}

.campaign_rates span:not(.ex_tax):not(.campaign_arrow) {
	display: block;
	margin-bottom: 10px;
	font-weight: bold;
	font-size: clamp(0.75rem, 0.208rem + 1.13vw, 1.063rem);
	white-space: nowrap;
}

.campaign_rates::before , .campaign_rates span.campaign_arrow {
	display: inline-block;
	position: absolute;
	max-width: 30px;
	width: clamp(1.563rem, 1.021rem + 1.13vw, 1.875rem);
	background-color: #e51c1d;
	content: "";

	aspect-ratio: 5/4;
	mask-size: 100%;
	-webkit-mask-size: 100%;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-position: right bottom;
	-webkit-mask-position: right bottom;
	mask-image: url(../images/rates_shift.png);
	-webkit-mask-image: url(../images/rates_shift.png);
}

body.home .campaign_rates::before {
	display: none !important;
} 

@media screen and (min-width: 768px) {
	.campaign_rates::before , .campaign_rates span.campaign_arrow {
		right: calc(100% + clamp(0.875rem, 0.225rem + 1.35vw, 1.25rem));
		bottom: 0.5729vw;
	}
}

@media screen and (max-width: 767px) {
	.rates_item-contents dt.campaign_set {
		max-width: fit-content;
		margin: 0 auto 10px;
		/*flex-direction: column;*/
	}

	@media screen and (min-width: 501px) {
		.campaign_rates {
			padding-left: 5px;
		}
		.campaign_rates::before , .campaign_rates span.campaign_arrow {
			top: 25px;
			right: 100%;
		}
	}
	@media screen and (max-width: 500px) {
		.campaign_set .current_rates {
			font-size: 16px;
		}
		.campaign_rates {
			/*margin-left: 20px;*/
			padding-left: 10px;
			font-size: 30px;
		}
		.campaign_rates::before , .campaign_rates span.campaign_arrow {
			top: 25px;
			right: 100%;
		}.campaign_rates span:not(.ex_tax):not(.campaign_arrow) {
			font-size: 16px;
		}.campaign_rates span.ex_tax {
			font-size: 18px;
		}
	}
}

.rates_item-contents dt.campaign_set > span {
	margin-bottom: -5px;
}

.rates_item-contents dd {
	padding-top: 15px;
	border-top: 1px solid #d8d8d8;
}

.rates_item-contents dt strong span {
	font-weight: 500;
	font-size: clamp(0.875rem, 0.658rem + 0.45vw, 1rem);
}

.rates_item-comment {
	display: flex;
	font-weight: 500;
	font-size: clamp(0.875rem, 0.658rem + 0.45vw, 1rem);
	text-align: justify;
	flex-direction: column;

	row-gap: 5px;
}

.rates_item-comment li {
	display: flex;
}

.rates_item-comment li p {
	margin-bottom: 0 !important;
}

.rates_item-comment li span {
	display: block;
	font-size: 0.8em;
}

.rates_item-comment li::before {
	content: "・";
}

@media screen and (min-width: 768px) {
	.rates-list {
		width: 95%;
		column-gap: 1.3157%;

		row-gap: 45px;
	}

	.rates_item {
		width: 32.4562%;
	}

	.rates_item:nth-of-type(1) {
		margin-left: 16.9566%;
	}

	.rates_item-contents dt {
		column-gap: clamp(0.313rem, -0.229rem + 1.13vw, 0.625rem);
		justify-content: center !important;
	}

	.rates_item-title {
		padding: 17.5px 10px;
	}

	.rates_item-contents dt:not(.campaign_set) {
		padding-bottom: 25px;
	}
}

@media screen and (max-width: 767px) {
	.rates-list {
		width: 100%;
		padding: 0 20px;

		row-gap: 55px;
	}

	@media screen and (min-width: 501px) {
		.rates-list {
			column-gap: 2.6314%;
		}

		.rates_item {
			width: 48.6843%;
		}
	}

	@media screen and (max-width: 500px) {
		.rates-list {
			flex-direction: column;
			align-items: center;
		}

		.rates_item {
			width: 100%;
		}
	}

	.rates_item-title {
		padding: 12.5px 5px;
	}

	.rates_item-contents dt:not(.campaign_set) {
		margin-bottom: 10px;
	}
}