@charset "utf-8";

body {
	/*スマホで勝手に文字が大きくなる対策*/
	-webkit-text-size-adjust: 100%;
	margin: 0;
}

#contents{
	width: 1140px;
	margin: 0 auto;
	padding: 0;
}

.l-main {
	width: auto;
	padding: 0;
	overflow: hidden;
}

.l-main *{
	font-family: '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
}

.bkn__option {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 2px;
}

.md-list-bkn__Icon .bkn__plan {
	display: inline-block;
	padding: 0 5px;
	font-size: 14px;
	font-weight: 400;
	color: #FFF;
	background: #111111;
}

.md-list-bkn__Icon .bkn__plan.bkn__plan--campaign {
	background: #48a4a5;
}

.md-list-bkn__Icon [class*="bkn__newicon--"] {
	display: inline-block;
	padding: 0 5px;
	font-size: 14px;
	font-weight: 400;
	color: #FFF;
	background: #bca762;
}

.md-list-bkn__Icon .bkn__newicon--reikin {
	background: #D97C84;
}

.md-list-bkn__Icon .bkn__newicon--freerent {
	background: #7C88D9;
}

.md-list-bkn__Icon .bkn__newicon--brokerage-fee {
	background: #E6C15C;
}

.l-result__primary{
	padding-bottom: 100px;
}

.bkn_icon {
    border-radius: 0;
}

.md-list-bkn__Icon{
	flex-wrap: wrap;
    width: 380px;
}

/*------------------------ 各種プランについて ------------------------*/
[class*="section__inner"] {
	width: 1140px;
	margin: 0 auto;
}
	[class*="section__title"] {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 5px;
		font-size: 36px;
		font-weight: 500;
		letter-spacing: 0.05em;
		text-indent: 0.05em;
		margin-bottom: 25px;
	}
		[class*="section__title"] span {
			font-size: 18px;
			color: #D8C27C;
			letter-spacing: 0.1em;
			text-indent: 0.1em;
			font-family: "EB Garamond", serif;
		}

.pg-section__plan {
	background: url(../images/bg_plan.jpg) no-repeat center / cover;
	padding: 30px 0 99px;
}
	.plan__list {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 15px;
	}
		[class*="plan__item"] a{
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: 27px;
			width: 216px;
			height: 216px;
			background: #FFF;
			border: 1px solid #D8C27C;
			border-radius: 50%;
			padding-top: 39px;
			transition: all 0.3s ease;
		}
		.plan__item--has-btn a {
			gap: 15px;
			padding-top: 32px;
		}
		[class*="plan__item"] a:hover{
			background: #D8C27C;
			transition: all 0.3s ease;
			opacity: 1;
		}
		[class*="plan__item"] a:hover .plan__name,
		[class*="plan__item"] a:hover .plan__text,
		[class*="plan__item"] a:hover .plan__text span {
			color: #FFF;
		}
		[class*="plan__item"] a:hover .plan__name::after {
			background: #FFF;
		}
		[class*="plan__item"] a:hover .plan__btn {
			background: #FFF;
			color: #D8C27C;
		}
			.plan__name {
				font-size: 20px;
				font-weight: 700;
				letter-spacing: 0.05em;
				text-indent: 0.05em;
				color: #D8C27C;
				text-align: center;
				position: relative;
			}
				.plan__name::after {
					content: '';
					background: #D8C27C;
					display: block;
					width: 30px;
					height: 1px;
					position: absolute;
					bottom: -14px;
					left: 50%;
					transform: translateX(-50%);
				}
			.plan__text {
				font-size: 18px;
				font-weight: 400;
				letter-spacing: 0.05em;
				text-indent: 0.05em;
				text-align: center;
				line-height: 1.778;
			}
				.plan__text span {
					font-size: 14px;
					font-weight: 400;
					letter-spacing: 0.05em;
				}
			.plan__item--plane {
				gap: 25px;
			}
			.plan__item--plane .plan__text {
				line-height: 2.1;
			}
			.plan__btn {
				display: flex;
				justify-content: center;
				align-items: center;
				width: fit-content;
				height: 28px;
				padding: 0 10px;
				background: #D8C27C;
				color: #FFF;
				font-size: 12px;
				font-weight: 500;
				letter-spacing: 0.05em;
				text-indent: 0.05em;
				border-radius: 14px;
			}
.result__headline {
	margin-bottom: 40px;
}