*,
::before,
::after {
	box-sizing: border-box;
}

img {
	vertical-align: bottom;
}

select {
	-webkit-appearance: none;
	appearance: none;
}

:root {
	--color-blue: #156A9A;
	--color-gray: #F6F8F9;
	--color-gray2: #737373;
	--link-color: #558FC9;
}

.hoteco-mv {
	color: #000;
	max-width: 1280px;
	margin: 0 auto;
	padding: 15px 0 min(80 * 100vw / 1500, 80px);
	position: relative;
}

.hoteco-mv::after {
	content: "";
	display: block;
	background: url("img/mv-hoteco.webp?1") no-repeat center center/contain;
	position: absolute;
	width: min(271 * 100vw / 1500, 271px);
	height: min(270 * 100vw / 1500, 270px);
	z-index: -1;
	right: 0;
	bottom: 0;
}

.hoteco-mv .mv-inner {
	display: flex;
	justify-content: space-between;
}

.hoteco-mv .mv-text {
	padding: min(60 * 100vw / 1500, 60px) 0 0;
	text-align: center;
	width: 100%;
}

.hoteco-mv .manual-intro {
	font-size: min(42 * 100vw / 1500, 42px);
	font-weight: 700;
	line-height: 1.1904761905;
	letter-spacing: 0.1em;
	margin-top: 1.15em;
}

.hoteco-mv .manual-intro.sp {
	display: none;
}

.hoteco-mv .manual-mv-img {
	width: min(734 * 100vw / 1500, 734px);
}

.hoteco-mv .manual-mv-lede {
	font-size: min(16 * 100vw / 1500, 16px);
	line-height: 2.5;
	text-align: center;
	letter-spacing: 0.05em;
	margin-top: 2.2em;
}

.hoteco-mv+.w1280 {
	width: auto;
}

.mv-title .smaller {
	font-size: calc(32 * 100vw / 1500);
}

.max1280 {
	max-width: 1280px;
	margin-inline: auto;
}

/* ユーザーマニュアル　ステップ */
.manual-step {
	display: block;
	width: 100%;
	margin: 0 auto;
}

.manual-step .manual-step-item+.manual-step-item {
	margin-top: min(150 * 100vw / 1500, 150px);
}

.manual-step .manual-step-item .step-head {
	display: flex;
	align-items: center;
	gap: min(16 * 100vw / 1500, 16px);
}

.manual-step .manual-step-item .step-head .step-num {
	font-size: min(24 * 100vw / 1500, 24px);
	font-weight: 700;
	line-height: 1;
	background-color: #156A9A;
	padding: min(10 * 100vw / 1500, 10px) min(12 * 100vw / 1500, 12px) min(12 * 100vw / 1500, 12px);
	color: #FFFFFF;
	border-radius: min(5 * 100vw / 1500, 5px);
}

.manual-step .manual-step-item .step-head .step-ttl {
	font-size: min(36 * 100vw / 1500, 36px);
	font-weight: 700;
	letter-spacing: 0.15em;
	color: #156A9A;
}

.manual-step .manual-step-item .step-summary {
	padding-top: min(47 * 100vw / 1500, 47px);
	font-size: min(20 * 100vw / 1500, 20px);
	line-height: 1.45;
	color: #156A9A;
	font-weight: 700;
}

.manual-step .step-inner {
	padding: 0 min(69 * 100vw / 1500, 69px);
}

.manual-step .step-inner+.step-summary {
	margin-top: min(25 * 100vw / 1500, 25px);
}

.manual-step .step-box {
	background-color: #E7F3FC;
	border-radius: 20px;
	padding: min(65 * 100vw / 1500, 65px) min(23 * 100vw / 1500, 23px) min(65 * 100vw / 1500, 65px) min(32 * 100vw / 1500, 32px);
	margin-top: min(74 * 100vw / 1500, 74px);
}

.manual-step .step-box .box-flex {
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	gap: min(12 * 100vw / 1500, 12px);
}

.manual-step .step-box .box-flex+.box-flex {
	margin-top: min(40 * 100vw / 1500, 40px);
}

.manual-step .step-box .box-flex .step-img {
	width: min(571 * 100vw / 1500, 571px);
	flex-shrink: 0;
}

.manual-step .step-box.box-col {
	padding: min(45 * 100vw / 1500, 45px) min(23 * 100vw / 1500, 23px) min(20 * 100vw / 1500, 20px) min(32 * 100vw / 1500, 32px);
}

.manual-step .step-box.box-col .step-img {
	text-align: center;
}

.manual-step .step-box.box-col .step-detail {
	margin-top: min(20 * 100vw / 1500, 20px);
}

.manual-step .step-box .step-detail {
	flex-grow: 1;
	text-align: left;
}

.manual-step .step-box .step-detail .step-detail-item {
	position: relative;

}

.manual-step .step-box .step-detail .step-detail-item+.step-detail-item {
	margin-top: min(22 * 100vw / 1500, 22px);
}

.manual-step .step-box .step-detail .step-detail-item+.step-detail-item.mt40 {
	margin-top: min(40 * 100vw / 1500, 40px);
}

.manual-step .step-box .step-detail .step-detail-item .num {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	top: min(5 * 100vw / 1500, 5px);
	left: 0;
	width: min(30 * 100vw / 1500, 30px);
	height: min(30 * 100vw / 1500, 30px);
	background-color: #fff;
	border: 1px solid #D78227;
	color: #D78227;
	border-radius: 50%;
	margin-right: min(16 * 100vw / 1500, 16px);
	z-index: 0;
	font-size: min(20 * 100vw / 1500, 20px);
}

.manual-step .step-box .step-detail .step-detail-item p {
	line-height: 2;
	font-size: min(20 * 100vw / 1500, 20px);
	color: #13618E;
}

.manual-step .step-box .step-detail .step-detail-item p:first-of-type {
	text-indent: min(35 * 100vw / 1500, 35px);
}

.manual-step .step-box .step-detail .step-detail-item p.note {
	padding-left: min(35 * 100vw / 1500, 35px);
}

.manual-step .step-box .step-detail .step-detail-item .note-box {
	background-color: #fff;
	border: 3px solid #156A9A;
	padding: min(7 * 100vw / 1500, 7px) min(16 * 100vw / 1500, 16px);
	border-radius: min(20 * 100vw / 1500, 20px);
	margin-right: min(20 * 100vw / 1500, 20px);
}

.manual-step .step-box .step-detail .step-detail-item .note-box p {
	text-indent: 0;
}

.manual-step .step-box.step-box-3-2 .step-detail {
	margin-top: min(40 * 100vw / 1500, 40px);
}

.manual-step .step-box.step-box-3-2 .step-detail .step-detail-item p {
	text-indent: 0;
	padding-left: min(35 * 100vw / 1500, 35px);
}

.manual-btn-area {
	margin-top: min(38 * 100vw / 1500, 38px);
	padding-bottom: min(160 * 100vw / 1500, 160px);
}

.manual-btn-area .manual-txt {
	text-align: center;
	font-size: min(18 * 100vw / 1500, 18px);
	color: #2E94CC;
	font-weight: 700;
	margin-bottom: min(20 * 100vw / 1500, 20px);
}

.manual-btn-area .manual-btn {
	width: min(300 * 100vw / 1500, 300px);
	margin: auto;
}

.manual-btn-area .manual-btn a {
	padding: min(15 * 100vw / 1500, 15px) min(20 * 100vw / 1500, 20px) min(16 * 100vw / 1500, 16px) min(57 * 100vw / 1500, 57px);
	display: block;
	background-color: #2E94CC;
	color: #fff;
	border-radius: min(50 * 100vw / 1500, 50px);
	font-size: min(16 * 100vw / 1500, 16px);
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
	position: relative;
}

.manual-btn-area .manual-btn a:hover {
	opacity: 0.8;
}

.manual-btn-area .manual-btn a::before {
	content: "";
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	left: min(25 * 100vw / 1500, 25px);
	background: url("img/icon-dl.webp?1") no-repeat center center/contain;
	width: min(39 * 100vw / 1500, 39px);
	height: min(40 * 100vw / 1500, 40px);
}

.link {
	color: #558FC9;
}

.link.underline {
	text-decoration: underline;
}

.left-bar-title {
	font-size: min(24 * 100vw / 1500, 24px);
	font-weight: 700;
	line-height: 1.55;
	position: relative;
	padding-left: 0.875em;
	margin-bottom: min(40 * 100vw / 1500, 40px);
}

.left-bar-title::before {
	position: absolute;
	left: 0;
	top: 0;
	content: "";
	width: min(8 * 100vw / 1500, 8px);
	height: 1.25em;
	background: #1E84C2 no-repeat left top;
	margin-top: 0.2em;
}

.arrow-link-button {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: min(5.67 * 100vw / 1500, 5.67px);
	text-align: center;
	font-size: min(20 * 100vw / 1500, 20px);
	line-height: 1.559;
	padding: 5px 1em;
	position: relative;
}

.arrow-link-button.-primary {
	background-color: #156A9A;
	color: #FFFFFF;
}

.arrow-link-button-accent {
	color: #FFDF03;
	font-weight: bold;
}

@media (max-width: 768px) {
	.mv-title {
		line-height: 1.2903225806;
	}

	.mv-title .smaller {
		font-size: calc(50 * 100vw / 750);
	}

	/* 新着情報 */
	.news-section {
		margin: calc(110 * 100vw / 750) auto 0;
		padding: 0 calc(40 * 100vw / 750) calc(120 * 100vw / 750);
	}

	.inner-section+.inner-section {
		margin-top: calc(200 * 100vw / 750);
	}

	.left-bar-title {
		font-size: calc(48 * 100vw / 750);
		padding-left: 0.5625em;
		margin-bottom: calc(65 * 100vw / 750);
	}

	.left-bar-title::before {
		width: calc(8 * 100vw / 750);
	}

	.arrow-link-button {
		border-radius: calc(5.67 * 100vw / 750);
		font-size: calc(28 * 100vw / 750);
		line-height: 1.4642857143;
		padding: 5px 2.1em;
	}

	.arrow-link-button-arrow {
		font-size: calc(60 * 100vw / 750);
		position: absolute;
		top: 50%;
		translate: 0 -50%;
		right: 0.4em;
	}

	.hoteco-mv {
		padding: 15px calc(37 * 100vw / 750) calc(124 * 100vw / 750);
	}

	.hoteco-mv::after {
		content: none;
	}

	.hoteco-mv .mv-inner {
		display: flex;
		justify-content: space-between;
	}

	.hoteco-mv .mv-text {
		padding: calc(10 * 100vw / 750) 0 0;
		text-align: center;
		position: relative;
	}

	.hoteco-mv .mv-text::after {
		content: "";
		display: block;
		background: url("img/mv-hoteco.webp?1") no-repeat center center/contain;
		position: absolute;
		width: calc(103 * 100vw / 750);
		height: calc(104 * 100vw / 750);
		right: initial;
		left: calc(20 * 100vw / 750);
		bottom: 0;
		z-index: -1;
	}

	.hoteco-mv .mv-text .hoteco-manual-mv-title {
		width: calc(381 * 100vw / 750);
		margin: 0 auto;
	}

	.hoteco-mv .manual-intro {
		display: none;
		font-size: calc(40 * 100vw / 750);
		font-weight: 700;
		line-height: 1.1904761905;
		letter-spacing: 0.1em;
		margin-top: 1.15em;
	}

	.hoteco-mv .manual-intro.sp {
		display: block;
	}

	.hoteco-mv .manual-mv-img {
		width: min(734 * 100vw / 1500, 734px);
	}

	.hoteco-mv .manual-mv-lede {
		font-size: calc(32 * 100vw / 750);
		line-height: 1.5;
		letter-spacing: 0.1em;
		margin-top: 2.2em;
		text-align: left;
		padding: calc(37 * 100vw / 750);
		background-color: #E7F3FC;
	}

	.hoteco-mv+.w1280 {
		width: auto;
	}

	.mv-title .smaller {
		font-size: calc(32 * 100vw / 1500);
	}

	/* ユーザーマニュアル　ステップ */
	.manual-step .manual-step-item+.manual-step-item {
		margin-top: calc(80 * 100vw / 750);
	}

	.manual-step .manual-step-item .step-head {
		flex-direction: column;
		align-items: flex-start;
		gap: calc(16 * 100vw / 750);
	}

	.manual-step .manual-step-item .step-head .step-num {
		font-size: calc(40 * 100vw / 750);
		padding: calc(14 * 100vw / 750) calc(22 * 100vw / 750) calc(17 * 100vw / 750) calc(22 * 100vw / 750);
		border-radius: calc(5 * 100vw / 750);
	}

	.manual-step .manual-step-item .step-head .step-ttl {
		font-size: calc(57 * 100vw / 750);
		letter-spacing: 0.05em;
		line-height: 1.649122807;
	}

	.manual-step .manual-step-item .step-summary {
		padding-top: calc(17 * 100vw / 750);
		font-size: calc(32 * 100vw / 750);
		line-height: 1.4375;
		font-weight: 400;
	}

	.manual-step .step-inner {
		padding: 0;
	}

	.manual-step .step-inner+.step-summary {
		margin-top: calc(25 * 100vw / 750);
	}

	.manual-step .step-box {
		border-radius: calc(20 * 100vw / 750);
		padding: calc(37 * 100vw / 750);
		margin-top: calc(32 * 100vw / 750);
	}

	.manual-step .step-box .box-flex {
		flex-direction: column;
		gap: calc(32 * 100vw / 750);
		align-items: flex-start;
	}

	.manual-step .step-box .box-flex+.box-flex {
		margin-top: calc(80 * 100vw / 750);
	}

	.manual-step .step-box .box-flex .step-img {
		width: 100%;
	}

	.manual-step .step-box.box-col {
		padding: calc(37 * 100vw / 750);
	}

	.manual-step .step-box.box-col .step-img {
		text-align: center;
	}

	.manual-step .step-box.box-col .step-detail {
		margin-top: calc(20 * 100vw / 750);
	}

	.manual-step .step-box .step-detail {
		width: 100%;
	}

	.manual-step .step-box .step-detail .step-detail-item {
		position: relative;
	}

	.manual-step .step-box .step-detail .step-detail-item+.step-detail-item {
		margin-top: calc(20 * 100vw / 750);
	}

	.manual-step .step-box .step-detail .step-detail-item+.step-detail-item.mt40 {
		margin-top: calc(40 * 100vw / 750);
	}

	.manual-step .step-box .step-detail .step-detail-item .num {
		top: calc(10 * 100vw / 750);
		width: calc(30 * 100vw / 750);
		height: calc(30 * 100vw / 750);
		margin-right: calc(12 * 100vw / 750);
		font-size: calc(20 * 100vw / 750);
	}

	.manual-step .step-box .step-detail .step-detail-item p {
		line-height: 1.5;
		font-size: calc(32 * 100vw / 750);
	}

	.manual-step .step-box .step-detail .step-detail-item p:first-of-type {
		text-indent: 0;
		padding-left: calc(42 * 100vw / 750);
	}

	.manual-step .step-box .step-detail .step-detail-item p.note {
		padding-left: calc(42 * 100vw / 750);
	}

	.manual-step .step-box .step-detail .step-detail-item .note-box {
		padding: calc(7 * 100vw / 750) calc(16 * 100vw / 750);
		border-radius: calc(20 * 100vw / 750);
		margin-right: 0;
		border-width: calc(3 * 100vw / 750);
	}

	.manual-step .step-box .step-detail .step-detail-item .note-box p {
		text-indent: 0;
		padding: 0;
	}

	.manual-step .step-box.step-box-3-2 .step-detail {
		margin-top: min(40 * 100vw / 1500, 40px);
	}

	.manual-step .step-box.step-box-3-2 .step-detail .step-detail-item p {
		text-indent: 0;
		padding-left: calc(42 * 100vw / 750);
	}

	.manual-btn-area {
		margin-top: calc(67 * 100vw / 750);
		padding-bottom: calc(240 * 100vw / 750);
	}

	.manual-btn-area .manual-txt {
		font-size: calc(36 * 100vw / 750);
		margin-bottom: calc(36 * 100vw / 750);
	}

	.manual-btn-area .manual-btn {
		width: calc(600 * 100vw / 750);
		margin: auto;
	}

	.manual-btn-area .manual-btn a {
		padding: calc(33 * 100vw / 750) calc(79 * 100vw / 750) calc(33 * 100vw / 750) calc(142 * 100vw / 750);
		display: block;
		border-radius: calc(76 * 100vw / 750);
		font-size: calc(28 * 100vw / 750);
		line-height: 1.4285714286;
	}

	.manual-btn-area .manual-btn a::before {
		left: calc(80 * 100vw / 750);
		width: calc(75 * 100vw / 750);
		height: calc(78 * 100vw / 750);
	}
}