@charset "utf-8";

/* sekkaku bbs base parts */
.mp_wrap,
.mp_wrap *{
	box-sizing:border-box;
}

.mp_wrap{
	width:100%;
	max-width:780px;
	margin:24px auto;
	padding:12px;
	font-size:16px;
	line-height:1.8;
	text-align:left;
	color:#222222;
}

.mp_card{
	background:#ffffff;
	color:#222222;
	border:1px solid rgba(0,0,0,0.12);
	border-radius:16px;
	padding:24px;
	box-shadow:0 8px 28px rgba(0,0,0,0.14);
}

.mp_title{
	margin:0 0 18px;
	padding:0 0 14px;
	text-align:center;
	font-size:24px;
	font-weight:bold;
	color:#111111;
	border-bottom:1px solid #e5e7eb;
}

.mp_lead{
	margin:0 0 18px;
	padding:15px 16px;
	background:#f6f8fb;
	color:#222222;
	border:1px solid #e5e7eb;
	border-radius:12px;
}

.mp_section{
	margin-top:22px;
	padding-top:18px;
	border-top:1px solid #e5e7eb;
	color:#222222;
}

.mp_heading{
	margin:0 0 10px;
	font-size:19px;
	font-weight:bold;
	color:#111111;
}

.mp_steps{
	margin:0;
	padding-left:1.5em;
}

.mp_steps li{
	margin:0.25em 0;
}

.mp_form_box{
	margin-top:14px;
	padding:18px;
	background:#f9fafb;
	color:#222222;
	border:1px solid #e5e7eb;
	border-radius:14px;
}

.mp_label{
	display:block;
	margin-top:14px;
	margin-bottom:6px;
	font-weight:bold;
	color:#222222;
}

.mp_input{
	display:block;
	width:100%;
	max-width:440px;
	padding:11px 12px;
	font-size:17px;
	line-height:1.4;
	color:#111111;
	background:#ffffff;
	border:1px solid #bfc5cf;
	border-radius:10px;
}

.mp_input:focus{
	outline:2px solid #9ec5ff;
	border-color:#4f8cff;
}

.mp_check{
	margin-top:16px;
	padding:13px;
	background:#ffffff;
	color:#222222;
	border:1px solid #e1e4e8;
	border-radius:10px;
}

.mp_btn{
	display:block;
	width:100%;
	max-width:440px;
	margin:22px auto 6px;
	padding:14px 18px;
	font-size:18px;
	line-height:1.4;
	font-weight:bold;
	color:#ffffff;
	background:#2563eb;
	border:0;
	border-radius:12px;
	cursor:pointer;
	text-align:center;
	text-decoration:none;
}

.mp_btn:hover{
	background:#1d4ed8;
}

.mp_note{
	margin-top:12px;
	padding:12px;
	font-size:14px;
	color:#555555;
	background:#fffbea;
	border:1px solid #f2e6a7;
	border-radius:10px;
}

.mp_maildata{
	margin-top:14px;
	padding:12px;
	font-size:13px;
	line-height:1.6;
	color:#333333;
	background:#f7f7f7;
	border:1px solid #dddddd;
	border-radius:10px;
	word-break:break-all;
}

.mp_url_box{
	margin:14px 0;
	padding:14px;
	background:#f6f8fb;
	color:#222222;
	border:1px solid #e5e7eb;
	border-radius:12px;
	word-break:break-all;
}

.mp_url_label{
	margin-bottom:6px;
	font-size:14px;
	font-weight:bold;
	color:#555555;
}

.mp_action_list{
	margin-top:18px;
	display:grid;
	gap:12px;
}

.mp_action{
	padding:14px;
	background:#ffffff;
	border:1px solid #e5e7eb;
	border-radius:12px;
}

.mp_action_title{
	font-weight:bold;
	font-size:16px;
	margin-bottom:5px;
}

.mp_action_text{
	font-size:14px;
	color:#555555;
	line-height:1.7;
}

.mp_action a{
	color:#1d4ed8;
	text-decoration:underline;
}

.mp_warning{
	margin-top:14px;
	padding:12px;
	font-size:14px;
	color:#555555;
	background:#fffbea;
	border:1px solid #f2e6a7;
	border-radius:10px;
}

.mp_card a{
	color:#1d4ed8;
	text-decoration:underline;
}



@media screen and (max-width:600px){
	.mp_wrap{
		margin:8px auto;
		padding:8px;
		font-size:15px;
	}

	.mp_card{
		padding:16px;
		border-radius:12px;
	}

	.mp_title{
		font-size:21px;
	}

	.mp_heading{
		font-size:17px;
	}

	.mp_form_box{
		padding:14px;
	}

	.mp_input,
	.mp_btn{
		max-width:100%;
	}
}


.mp_gallery{
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
	gap:14px;
	margin-top:18px;
}

.mp_thumb{
	background:#ffffff;
	border:1px solid #e5e7eb;
	border-radius:12px;
	padding:10px;
	text-align:center;
	color:#222222;
}

.mp_thumb:hover{
	background:#f9fafb;
	border-color:#cbd5e1;
}

.mp_thumb_img{
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:110px;
	margin-bottom:8px;
}

.mp_thumb_img img{
	max-width:100%;
	height:auto;
	border:1px solid #dddddd;
	background:#ffffff;
	padding:3px;
}

.mp_thumb_name{
	font-size:13px;
	line-height:1.5;
	word-break:break-all;
}

.mp_thumb_name a{
	color:#1d4ed8;
	text-decoration:underline;
}

.mp_pager{
	margin:22px 0 0;
	padding:14px;
	text-align:center;
	background:#f9fafb;
	border:1px solid #e5e7eb;
	border-radius:12px;
}

.mp_select{
	font-size:16px;
	padding:7px 10px;
	border:1px solid #bfc5cf;
	border-radius:8px;
	background:#ffffff;
	color:#111111;
}

.mp_btn_small{
	display:inline-block;
	width:auto;
	max-width:none;
	margin:0 0 0 8px;
	padding:8px 14px;
	font-size:15px;
	border-radius:8px;
}

.mp_empty{
	margin-top:18px;
	padding:18px;
	text-align:center;
	background:#f9fafb;
	border:1px solid #e5e7eb;
	border-radius:12px;
	color:#555555;
}

.mp_footer_link{
	margin-top:20px;
	text-align:left;
}

.mp_footer_link a{
	color:#1d4ed8;
	text-decoration:underline;
}

@media screen and (max-width:600px){
	.mp_gallery{
		grid-template-columns:repeat(auto-fill,minmax(105px,1fr));
		gap:10px;
	}

	.mp_thumb{
		padding:8px;
		border-radius:10px;
	}

	.mp_thumb_img{
		min-height:90px;
	}

	.mp_thumb_name{
		font-size:12px;
	}

	.mp_pager{
		padding:12px;
	}

	.mp_select{
		width:100%;
		max-width:220px;
		margin-bottom:8px;
	}

	.mp_btn_small{
		display:block;
		width:100%;
		max-width:220px;
		margin:8px auto 0;
	}
}

.mp_info_list{
	margin-top:18px;
	padding:0;
	border:1px solid #e5e7eb;
	border-radius:12px;
	overflow:hidden;
	background:#ffffff;
}

.mp_info_row{
	display:flex;
	border-bottom:1px solid #e5e7eb;
}

.mp_info_row:last-child{
	border-bottom:0;
}

.mp_info_label{
	width:150px;
	padding:12px 14px;
	font-weight:bold;
	color:#555555;
	background:#f9fafb;
}

.mp_info_value{
	flex:1;
	padding:12px 14px;
	color:#222222;
	word-break:break-all;
}

.mp_complete_mark{
	width:56px;
	height:56px;
	margin:0 auto 14px;
	border-radius:50%;
	background:#16a34a;
	color:#ffffff;
	font-size:32px;
	line-height:56px;
	text-align:center;
	font-weight:bold;
}

@media screen and (max-width:600px){
	.mp_info_row{
		display:block;
	}

	.mp_info_label{
		width:auto;
		padding:9px 12px;
	}

	.mp_info_value{
		padding:10px 12px 13px;
	}
}

.mp_error_mark{
	width:56px;
	height:56px;
	margin:0 auto 14px;
	border-radius:50%;
	background:#dc2626;
	color:#ffffff;
	font-size:32px;
	line-height:56px;
	text-align:center;
	font-weight:bold;
}

.mp_status_text{
	text-align:center;
	font-size:16px;
	line-height:1.8;
}

.mp_warning_mark{
	width:56px;
	height:56px;
	margin:0 auto 14px;
	border-radius:50%;
	background:#f59e0b;
	color:#ffffff;
	font-size:32px;
	line-height:56px;
	text-align:center;
	font-weight:bold;
}

.mp_btn_danger{
	background:#dc2626;
}

.mp_btn_danger:hover{
	background:#b91c1c;
}

.mp_form_grid{
	display:grid;
	gap:14px;
}

.mp_textarea{
	display:block;
	width:100%;
	min-height:180px;
	padding:11px 12px;
	font-size:16px;
	line-height:1.6;
	color:#111111;
	background:#ffffff;
	border:1px solid #bfc5cf;
	border-radius:10px;
	box-sizing:border-box;
}

.mp_textarea:focus{
	outline:2px solid #9ec5ff;
	border-color:#4f8cff;
}

.mp_board_url{
	margin:12px 0 0;
	padding:12px;
	text-align:center;
	background:#f6f8fb;
	border:1px solid #e5e7eb;
	border-radius:12px;
	word-break:break-all;
}

.mp_board_url a{
	font-weight:bold;
	color:#1d4ed8;
	text-decoration:underline;
}

.mp_help_link{
	margin-top:8px;
}

.mp_help_link a{
	color:#1d4ed8;
	text-decoration:underline;
}

.mp_notice_list{
	margin:0;
	padding-left:1.4em;
}

.mp_notice_list li{
	margin:0.25em 0;
}

.mp_submit_area{
	margin-top:20px;
	text-align:center;
}

@media screen and (max-width:600px){
	.mp_textarea{
		min-height:160px;
		font-size:15px;
	}
}

.mp_post_body{
	line-height:1.7;
	white-space:normal;
	word-break:break-word;
}

.mp_report_options{
	line-height:1.8;
}

.mp_report_options label{
	display:block;
	margin:4px 0;
}

.mp_form_help{
	margin-top:8px;
	font-size:14px;
	color:#555555;
}

.mp_btn_center{
	width:auto;
	min-width:180px;
	max-width:280px;
}

.mp_message_list{
	margin-top:16px;
	display:grid;
	gap:10px;
}

.mp_message_item{
	padding:12px 14px;
	background:#ffffff;
	color:#222222;
	border:1px solid #e5e7eb;
	border-radius:10px;
	line-height:1.7;
	word-break:break-word;
}

.mp_retry_box{
	margin-top:22px;
	padding:14px;
	background:#fffbea;
	color:#555555;
	border:1px solid #f2e6a7;
	border-radius:12px;
}

.mp_banner_area{
	margin-top:40px;
	text-align:center;
}

.mp_banner_area img{
	max-width:100%;
	height:auto;
	margin:4px;
}

.mp_popup_table{
	width:100%;
	border-collapse:collapse;
	margin-top:16px;
}

.mp_popup_table th,
.mp_popup_table td{
	border:1px solid #dddddd;
	padding:8px;
	text-align:left;
	vertical-align:top;
	word-break:break-word;
}

/* ==================================================
   sekkaku bbs base color override
   白・黒・灰色ベース + アクセント #FF0080
================================================== */

.mp_wrap{
	--mp-white:#ffffff;
	--mp-black:#111111;
	--mp-text:#222222;
	--mp-sub:#555555;
	--mp-border:#dddddd;
	--mp-border-light:#e5e5e5;
	--mp-bg:#f7f7f7;
	--mp-bg-light:#fafafa;
	--mp-accent:#FF0080;
	--mp-accent-dark:#d9006c;
	--mp-accent-bg:#fff5fa;
	--mp-accent-border:#ffd1e8;
	color:var(--mp-text);
}

/* 基本カード */
.mp_card{
	background:var(--mp-white);
	color:var(--mp-text);
	border-color:rgba(0,0,0,0.14);
	box-shadow:0 8px 28px rgba(0,0,0,0.12);
}

/* 見出し */
.mp_title,
.mp_heading{
	color:var(--mp-black);
}

.mp_title,
.mp_section{
	border-color:var(--mp-border-light);
}

/* 薄い背景エリア */
.mp_lead,
.mp_form_box,
.mp_url_box,
.mp_pager,
.mp_empty,
.mp_board_url{
	background:var(--mp-bg-light);
	color:var(--mp-text);
	border-color:var(--mp-border-light);
}

/* 通常テキスト */
.mp_label,
.mp_check,
.mp_info_value,
.mp_message_item,
.mp_post_body{
	color:var(--mp-text);
}

/* 補足テキスト */
.mp_url_label,
.mp_action_text,
.mp_info_label,
.mp_form_help{
	color:var(--mp-sub);
}

/* 入力欄 */
.mp_input,
.mp_textarea,
.mp_select{
	color:var(--mp-black);
	background:var(--mp-white);
	border-color:#bbbbbb;
}

.mp_input:focus,
.mp_textarea:focus{
	outline:2px solid #999999;
	border-color:#555555;
}

/* ボタン */
.mp_btn{
	color:var(--mp-white);
	background:#333333;
}

.mp_btn:hover{
	background:#000000;
}

/* 危険・削除・エラー系 */
.mp_btn_danger,
.mp_error_mark{
	color:var(--mp-white);
	background:var(--mp-accent);
}

.mp_btn_danger:hover{
	background:var(--mp-accent-dark);
}

/* 完了・注意マークもシンプル化 */
.mp_complete_mark{
	color:var(--mp-white);
	background:#333333;
}

.mp_warning_mark{
	color:var(--mp-white);
	background:var(--mp-accent);
}

/* 注意・警告系ボックス */
.mp_note,
.mp_warning,
.mp_retry_box{
	color:var(--mp-sub);
	background:var(--mp-accent-bg);
	border-color:var(--mp-accent-border);
}

/* メールデータ・ログ表示 */
.mp_maildata{
	color:#333333;
	background:var(--mp-bg);
	border-color:var(--mp-border);
}

/* 一覧・行 */
.mp_info_list,
.mp_action,
.mp_thumb,
.mp_message_item{
	background:var(--mp-white);
	border-color:var(--mp-border-light);
}

.mp_info_row{
	border-color:var(--mp-border-light);
}

.mp_info_label{
	background:var(--mp-bg-light);
}

/* サムネイル */
.mp_thumb{
	color:var(--mp-text);
}

.mp_thumb:hover{
	background:var(--mp-bg-light);
	border-color:#bbbbbb;
}

.mp_thumb_img img{
	background:var(--mp-white);
	border-color:var(--mp-border);
}

/* リンク */
.mp_card a,
.mp_action a,
.mp_thumb_name a,
.mp_footer_link a,
.mp_board_url a,
.mp_help_link a{
	color:#333333;
	text-decoration:underline;
}

.mp_card a:hover,
.mp_action a:hover,
.mp_thumb_name a:hover,
.mp_footer_link a:hover,
.mp_board_url a:hover,
.mp_help_link a:hover{
	color:#000000;
}

/* ポップアップ系テーブル */
.mp_popup_table th,
.mp_popup_table td{
	border-color:var(--mp-border);
}