/* 企業別CSS */

/*-------------------------------------------------
カラー
-------------------------------------------------*/
:root {
	--maincolor: rgb(230, 61, 48);
	--maincolor-hover: #CB281B;
	--accentcolor: rgb(0, 51, 73);
	--accentcolor-hover: #001620;
	--triangle-color: #F8C4C0;
}

/*-------------------------------------------------
TOP画像の調整
-------------------------------------------------*/
@media screen and (min-width: 768px) and (max-width: 1100px) {
	.ec-sliderRole img {
		width: 100%;
		height: 410px;
		object-fit: cover;
		/* 20230726 kashiwa 768pxのとき、文字が切れていないか確認。文字がTOP画像に入っていれば、下記コメントアウト外す必要アリかも*/
		object-position: -8px;
	}
}

/*-------------------------------------------------
ヘッダー：株主番号・名前など表示しているエリア
★森永→申込期限に曜日を入れる関係で以下調節が必要
-------------------------------------------------*/
@media (min-width: 768px) and (max-width: 1100px) {
	.personalpoint {
		padding: 10px 7px;
		height: 60px;
		/* width調整 */
		width: 280px;
		padding-bottom: 8px;
		justify-content: space-around;
	}

	.navbar-header {
		/* width調整 */
		width: 67%;
		justify-content: flex-start;
		margin-top: 0;
	}

	.navbar-header .pconlytext:first-child {
		width: 56%;
		/* max-width調整 */
		max-width: 210px;
	}
}

/*-------------------------------------------------
フッター（電話番号やその説明の長さに応じて調整） 
-------------------------------------------------*/
.ec-footerTitle {
	padding: 20px;
}

.ec-footerTitle__white {
	display: flex;
	justify-content: space-between;
	background: #fff;
	padding: 30px 30px 30px 23px;
	width: 620px;
	margin: auto;
	position: relative;
	align-items: center;
}

.footer_tel {
	text-align: left;
}

.footer_tel::before {
	content: "";
	display: inline-block;
	width: 1px;
	height: 92px;
	background-color: #333;
	position: absolute;
	top: 22%;
	left: 52%;
}

.footer_tel p {
	color: #333;
	margin-bottom: 0;
}

.footer_tel h3 {
	color: #333;
	margin-top: 6px;
	margin-bottom: 4px;
	font-weight: 600;
}

@media screen and (max-width: 767px) {
	.ec-footerTitle__white {
		width: 100%;
		padding: 30px 23px;
	}

	.footer_tel {
		margin: auto;
	}

	.footer_tel::before {
		display: none;
	}

	.footer_tel h3 {
		font-size: 28px;
	}

	.footer_tel p {
		font-size: 17px;
	}

	.ec-footerTitle:last-child {
		padding: 0;
	}

	.ec-footerRole {
		margin-top: 0px;
	}
}

/*-------------------------------------------------
株主情報ー各ページへのボタン （ナビボタン）
-------------------------------------------------*/
@media only screen and (max-width: 767px) {
	.ec-navlistRole__item:nth-child(even) {
		padding-left: 0;
	}

	.naviButton .btn-primary {
		font-size: 13px;
		padding: 12px 4px;
	}
}

/*-------------------------------------------------
①クーポン交換（通知先入力）
-------------------------------------------------*/
.mcpn_link {
	text-align: end;
	margin: 10px 0 25px;
}

.col_l2-mcpn {
	width: 35%;
	background-color: #f5f5f5;
	height: 70px;
	padding: 18px !important;
	vertical-align: middle !important;
}

.col_r2-mcpn input {
	margin-bottom: 0;
}

.col_r2-cpnname {
	padding-top: 5px;
}

.col_r2-mcpn {
	padding: 18px !important;
}

.posigzp2-mcpn {
	margin-bottom: 10px;
}

.ec-cartRole__progress-mcpn {
	margin: 20px auto 40px;
}

@media screen and (max-width: 767px) {

	.col_l2-mcpn,
	.col_r2-mcpn {
		display: block;
		text-align: left;
		border: none;
		width: 100%;
		height: auto;
		padding: 15px !important;
	}

	.col_l2-mcpn {
		border-bottom: none !important;
	}

	.col_r2-cpnname {
		padding-top: 0;
	}

	.table-mcpn {
		border: none;
	}

	.ec-cartRole__progress-mcpn {
		margin: 20px auto;
	}
}

/*-------------------------------------------------
③クーポン交換（交換完了）
-------------------------------------------------*/
.ec-off4Grid-mcpn-cpl {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	margin-bottom: 50px;
	gap: 30px;
	flex-direction: row-reverse;
}

.ec-blockBtn-mcpn {
	width: 360px;
}

.col_l3-mcpn {
	font-size: 15px;
	font-weight: normal;
}

.col_r3-mcpncode {
	width: 410px;
	max-width: 100%;
	vertical-align: middle
}

.ec-blockBtn-mcpntext {
	margin-bottom: 5px;
	width: max-content;
}

.ec-blockBtn-mcpntext:before,
.ec-blockBtn-mcpntext:after {
	position: relative;
	display: inline-block;
	content: "";
	background: #000000;
	width: 1px;
	height: 1em;
	margin: 0 1em;
	margin-top: -.2em;
	vertical-align: middle;
}

.ec-blockBtn-mcpntext:before {
	transform: rotate(-30deg);
}

.ec-blockBtn-mcpntext:after {
	transform: rotate(30deg);
}

.col_l3-mcpnsp {
	width: 35%;
}

.col_r3-mcpncode-itk {
	width: 70%;
}

.complete_itk_btm {
	display: flex;
	gap: 40px;
}

.complete_itk_numcheck {
	padding: 25px;
	width: 50%;
}

.complete_itk_usage {
	width: 50%;
}

.complete_itk_numcheck p {
	line-height: 1.5;
	margin-bottom: 0;
}

.ec-blockBtn_itk--cancel {
	width: 360px;
	margin-right: 0;
}


@media screen and (max-width: 1000px) {
	.complete_itk_btm {
		flex-direction: column-reverse;
		align-items: center;
		gap: 20px;
	}
}

@media screen and (max-width: 767px) {
	.ec-off4Grid-mcpn-cpl {
		display: block;
		align-items: center;
		flex-direction: column;
	}

	.ec-blockBtn-mcpn {
		width: 100%;
		max-width: 425px;
		margin-bottom: 20px;
	}

	.ec-blockBtn_itk--cancel {
		width: 100%;
		max-width: 425px;
		margin: 0 auto;
	}

	.complete_itk_numcheck {
		width: 100%;
		padding: 15px;
	}

	.complete_itk_usage {
		width: 100%;
	}

	.br-sp {
		display: block;
	}
}

/*-------------------------------------------------
交換履歴
-------------------------------------------------*/
.ec-mypageRole-mcpn-hr {
	margin-top: 56px;
	display: block;
}

.ec-off4Grid__cell-mcpn-hr {
	/* display: block !important; */
	margin-left: 10% !important;
	margin: 0 auto !important;
}

.ec-blockBtn--cancel-mcpn-hr {
	margin-right: 0 !important;
	margin-left: 7%;
	width: 360px;
	max-width: 100%;
}

.ec-off4Grid-mcpn-hr {
	float: right;
	margin-bottom: 0;
	margin-right: 10% !important;
}

@media screen and (max-width: 900px) {
	.ec-off4Grid-mcpn-hr {
		float: none;
		width: 100%;
	}

	.ec-off4Grid__cell-mcpn-hr {
		width: 100%;
		margin-left: 0 !important;
	}

	.ec-mypageRole-mcpn-hr {
		display: flex;
		justify-content: center;
		margin-top: 0;
	}

	.ec-blockBtn--cancel-mcpn-hr {
		width: 360px;
		max-width: 100%;
		margin-left: 0;
	}


}

@media screen and (max-width: 767px) {
	.ec-blockBtn--cancel-mcpn-hr {
		width: 425px;
		max-width: 100%;
	}

	.ec-blockBtn-mcpn-hr {
		margin-bottom: 0;
	}

}

/*-------------------------------------------------
利用登録
-------------------------------------------------*/
.ec-link::after {
	right: 8% !important;
}

/*-------------------------------------------------
お問い合わせ注意書き
-------------------------------------------------*/
.alert-warning--red {
	color: #a92b2b;
    background-color: #FFF4F1;
    border-color: #FAC8C6;
	margin-top: -8px;
}

.alert-warning--red a{
	color: #a92b2b;
	text-decoration: underline;
}

/*-------------------------------------------------
よくあるご質問
-------------------------------------------------*/

.btn-itk {
	font-size: 14.5px !important;
}

@media screen and (max-width: 767px) {
	.btn-itk {
	font-size: 14px !important;
}
}