@charset "utf-8";

/* ************************************************************************** */
/* my-abstract.css */

/* ************************************************************************** */
/* データ編集 エラー画面 */
.errorBox {
	text-align:left;
	width:80%; 
	margin-left:auto;margin-right:auto;
	margin-top:20px;
	margin-bottom:60px;
	background-color: #F5F5F5;
	padding: 12px 0px 0px 6px;
        line-height:1.5;

        filter: alpha(opacity=85);
        -moz-opacity:0.85;
        opacity:0.85;
	border-radius: 5px;
}
.errorBox ul {
	margin:10px 0px;
}
.errorBox ul li{
	font-size: 1.0em;
	color:#000080;
}

/* ************************************************************************** */
/* データ編集画面 */
.container {
    display: flex;
    align-items: center; /* 垂直方向の中央揃え */
    justify-content: space-between; /* 横方向の均等配置 */
    font-size:1.3em;
    background-color: #1e2e8e;
    color:#fff;
    padding-left:5px;
    padding-right:5px;
}
.container-white {
    display: flex;
    align-items: center; /* 垂直方向の中央揃え */
    justify-content: space-between; /* 横方向の均等配置 */
    font-size:1.3em;
    background-color: #fff;
    color:#fff;
    padding-left:5px;
    padding-right:5px;
}
/*
.red-area {
    background-color: #f00;
    font-size:1.3em;
    color:#fff;
    padding:5px 5px 1px 5px;
    font-weight: bold;
}

.blue-area {
    background-color: blue;
    font-size:1.3em;
    color:#fff;
    padding:3px 5px 2px 5px;
    line-height:1.3;
    text-align:right;
}

.yellow-area {
    background-color: yellow;
    padding-right: 5px;
    text-align:right;
}
*/

input[type=button]#editCard {
	margin-top: 4px;
	margin-bottom: 4px;
	font-size: 15px;
	padding : 0.2em 0.5em;
	border-radius: 6px;
}
input[type=button]#editLogout {
	margin-top: 4px;
	margin-bottom: 4px;
	font-size: 15px;
	padding : 0.2em 0.5em;
	border-radius: 6px;
}

/* ************************************************************************** */
/* トップ画面 */

#wrapper2 {
/*	background-color: #f0f0f0; */
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	height: 75vh;
	margin: 0;

	position: relative;
/*
	min-height: 100vh;
	position: relative;
*/
}

.button-container {
	display: flex;
	flex-direction: column;
	gap: 75px;

	margin-top: 100px; /* Adjust margin to prevent overlap with header */
}

.custom-button {
	background-color: #ff0000;
	color: #ffffff;
	padding: 15px 28px;
	border: none;
	border-radius: 8px;
	font-size: 19px;
	cursor: pointer;
	font-weight:bold;
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.3s ease;
}
.custom-button2 {
	background-color: #ff0000;
	color: #ffffff;
	padding: 15px 28px;
	border: none;
	border-radius: 8px;
	font-size: 19px;
	cursor: pointer;
	font-weight:bold;
	text-decoration: none;
	display: flex;
/*	align-items: center; */
	justify-content: center;
	transition: background-color 0.3s ease;
/* width:35%; */
}

.custom-button:hover {
	background-color: #cc0000;
}


@media (max-width: 600px) {
header {
	line-height:1.5;
}
.button-container {
	margin-top:50px;
	gap: 35px;
}
.custom-button {
	padding: 15px 15px;
	border-radius: 5px;
	font-size: 18px;
	text-align:center;
	line-height:1.4;
}
}


input[type=submit]#BtnEdit,
input[type=submit]#BtnBack,
input[type=submit]#BtnDelete,
input[type=button]#BtnEnd {
	background-color: #1e2e8e; /* ff0000 */
	background: -webkit-linear-gradient(#1e2e8e, #1e2e8e);	
	background: linear-gradient(#1e2e8e, #1e2e8e);	
	color: #ffffff;
	padding: 10px 22px;
	border: none;
	border-radius: 8px;
	font-size: 18px;
	cursor: pointer;
	font-weight:bold;
	text-decoration: none;
	justify-content: center;
	transition: background-color 0.3s ease;
/*	width:30%; */
}
input[type=submit]#BtnEdit:hover,
input[type=submit]#BtnBack:hover,
input[type=submit]#BtnDelete:hover,
input[type=button]#BtnEnd:hover {
	background-color: #cc0700; /* cc0000 */
	background: -webkit-linear-gradient(#cc0700, #cc0700);
	background: linear-gradient(#cc0700, #cc0700);	
}

.top_intersection {
	margin-top: 15px;
	padding-left: 20px;
	font-size: 16px;
}