/* 初回表示の「お気持ちはどちらに近いですか？」モーダル
   gomisodan.com lp/02 の .lp2-modal と同じ見た目。文字色だけオレンジからフォームの入力済み表示(#1abc9c)と同系の緑に変えている(白地で読める濃さに落とした #138D75)。
   サンクスページ用の css/modal.css・写真の撮り方モーダル(#modal_tokei)とは別物なので、クラス名を intent-modal で分けている */
.intent-modal {
	/* ダイアログ(デザイン 370px)が左右 16px を残して入らなくなったら、余白・文字・ボタンを同じ比率で縮める。402px 以上は 1px */
	--intent-modal-px: min( 1px, calc( ( 100vw - 32px ) / 370 ) );
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	/* 写真の撮り方モーダル(.wrapper の z-index: 100)より手前に出す */
	z-index: 1000;
}

.intent-modal[hidden] {
	display: none;
}

.intent-modal__overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.45);
}

.intent-modal__dialog {
	position: absolute;
	top: calc( 50% + 0.5px );
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	flex-flow: column;
	align-items: center;
	gap: calc( 20 * var( --intent-modal-px ) );
	padding: calc( 32 * var( --intent-modal-px ) );
	border-radius: 10px;
	background: #F5F3ED;
}

.intent-modal__head {
	display: flex;
	flex-flow: column;
	align-items: center;
	gap: calc( 13 * var( --intent-modal-px ) );
	color: #000;
	white-space: nowrap;
}

.intent-modal__head p {
	margin: 0;
	line-height: normal;
}

.intent-modal__ttl {
	font-size: calc( 16 * var( --intent-modal-px ) );
	font-weight: 700;
}

.intent-modal__note {
	font-size: calc( 14 * var( --intent-modal-px ) );
	font-weight: 500;
}

.intent-modal__btns {
	display: flex;
	flex-flow: column;
	align-items: stretch;
	gap: calc( 14 * var( --intent-modal-px ) );
}

.intent-modal__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: calc( 15 * var( --intent-modal-px ) ) calc( 36 * var( --intent-modal-px ) );
	border: none;
	border-radius: 5px;
	background: #fff;
	box-shadow: 1px 1px 5px 0px rgba(140, 127, 90, 0.35);
	color: #138D75;
	font-family: inherit;
	font-size: calc( 18 * var( --intent-modal-px ) );
	font-weight: 700;
	line-height: 1.8;
	white-space: nowrap;
	cursor: pointer;
}

/* style.css の button { outline: none } を、キーボード操作のときだけ打ち消す */
.intent-modal__btn:focus-visible {
	outline: 2px solid #138D75;
	outline-offset: 2px;
}
