@charset "utf-8";
/*------------------------------------------------------------
	カスタム用スタイル
------------------------------------------------------------*/

/* fw.jar importタグ使用時の挿入されるdivタグの要素の影響を打ち消す */
#parts_contents {
	max-width: none;
	margin-bottom: 0;
}

/** -----------------------------------------------------------
 * 共通
 ----------------------------------------------------------- */
.line-break {
	white-space: pre-wrap;
}

label {
	font-family: "source-han-sans-japanese", sans-serif;
}

/* ボタンdisabled */
.btn-disabled {
	background-color: #cccccc !important; /* 背景をグレーに */
	color: #666666 !important;            /* 文字色を薄いグレーに */
	cursor: not-allowed;                  /* カーソルを禁止マークに */
	opacity: 0.6;                         /* 全体を少し透明に */
}

/** -----------------------------------------------------------
 * メッセージ表示欄のスタイル
 ----------------------------------------------------------- */
 /* 共通 */
div.message {
	font-size: 1.5em;
	text-align: center;
}
err {
	color: var(--color-red);
}

/** -----------------------------------------------------------
 * ログイン画面のスタイル
 ----------------------------------------------------------- */
/* ログインID/PASSのスタイル */
div.login-mv-form-item err {
	font-size: 1.5em;
}

/* ログイン画面お知らせ欄のスタイル */
.login-news-link:hover .login-news-link-upper {
	color: var(--color-red);
}
.login-news-link-upper {
	display: flex;
	column-gap: 1em;
	color: var(--color-gray);
	font-size: 1.4em;
	margin-bottom: 4px;
}
.login-news-category {
	position: relative;
	padding-left: 1.2em;
	padding-top: 0.4em;
}
.login-news-category::before {
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	width: 1em;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
}
.login-news-date {
	font-size: 1em;
	padding-top: 0.4em;
}


/** -----------------------------------------------------------
 * ログイン画面・トップ画面の共用スタイル
 ----------------------------------------------------------- */
/* お知らせマーカー色 */
:is(.login-news-item,.top-news-item).marker_60 a div p::before {
	background: #fdab01; /* お知らせ */
}
:is(.login-news-item,.top-news-item).marker_65 a div p::before {
	background: #e60020; /* 経営・組織・人事 */
}
:is(.login-news-item,.top-news-item).marker_70 a div p::before {
	background: #3aadaa; /* サステナビリティ */
}
:is(.login-news-item,.top-news-item).marker_75 a div p::before {
	background: #bb9d57; /* 商品 */
}
:is(.login-news-item,.top-news-item).marker_80 a div p::before {
	background: #ff84b3; /* CM・キャンペーン */
}
:is(.login-news-item,.top-news-item).marker_85 a div p::before {
	background: #7e4527; /* イベント */
}



/** -----------------------------------------------------------
 * トップ画面のスタイル
 ----------------------------------------------------------- */

/* イベントなしの時のメッセージを左寄せにする */
@media (max-width: 768px) {
	.l-horizontal-red-table.is-label td {
		justify-content: unset;
		text-align: left;
	}
}


/** -----------------------------------------------------------
 * 株主確認画面スタイル
 ----------------------------------------------------------- */
@media (max-width: 768px) {
	main.entry .c-hd-1 {
		font-size: 19px;
		white-space: nowrap;
	}
	main.entry .c-hd-2 {
		font-size: 17px;
		white-space: nowrap;
	}
}
main.entry .c-colbox {
	white-space: nowrap;
	font-size: 13px;
}

/** -----------------------------------------------------------
 * 会員情報登録・編集画面スタイル
 ----------------------------------------------------------- */
/* 電話番号注釈 */
.note_tel {
	color: #E60021;
	font-size: 0.7rem;
	line-height: 1;
	display: inline-block;
}


/** -----------------------------------------------------------
 * イベント・アンケート画面スタイル
 ----------------------------------------------------------- */
 /* 概要ページのテーブルテキスト改行設定 */
section.event-detail td p {
	white-space: pre-wrap;
}


/* 設問番号はCSSでは対応しない */
.p-entry-question::before {
	content: none;
}

/* 設問文のスタイル */
.p-entry-question h3 {
	font-weight: 600;
	text-indent: -2em;
	padding-left: 2em;
}

/* 必須マークは折り返さない */
.p-entry-item .must {
	white-space: nowrap;
}

/* 画面幅での調整 */
@media only screen and (max-width: 768px) {
	.c-form-table {
		margin-left: 0px;
		margin-right: 0px;
	}
	.p-entry-item {
		font-size: 20px;
	}
}
@media only screen and (max-width: 430px) {
	.p-entry-item {
		font-size: 14px; /* 元の半分のサイズ */
	}
}

/* 必須表示 */
.must {
	border: 1px solid #E60021;
	color: #E60021;
	font-size: 0.7rem;
	font-weight: bold;
	padding: 1px 5px;
	border-radius: 2px;
	margin-left: 8px;
	vertical-align: middle;
}

/* ボタン間隔 */
.enquete-button {
	margin-bottom: 10px;
	margin-top: 10px;
	width: 245px;
}
.button-box {
	text-align: center;
}
@media only screen and (max-width: 780px) {
	.button-box {
		width: 490px;
	}
}
@media only screen and (max-width: 510px) {
	.button-box {
		width: auto;
	}
}


/* 確認画面の回答情報スタイル */
.enquete-confirm label.enquete-answer {
	font-size: 28px;
	white-space: pre-wrap;
}

/** -----------------------------------------------------------
 * イベント応募会員情報確認
 ----------------------------------------------------------- */
@media (max-width: 768px) {
	main.event-user-info .c-catch--long {
		font-size: 15px;
	}
}


/** -----------------------------------------------------------
 * 会員規約画面スタイル
 ----------------------------------------------------------- */
/* リストの連番を括弧付の数字で表示 */
ol.parentheses-num{
	counter-reset: count;
}

ol.parentheses-num li{
 list-style-type:none;
 counter-increment: count;
 text-indent: -2.3em;
 padding-left: 2.0em;
}

ol.parentheses-num li::before{
 content: "(" counter(count) ") ";
 padding-left: 0.8em;
}