.loader_gif{
    background-image:url('images/loader_white.gif');
    background-repeat: no-repeat;
    background-position: center;
    background-size:32px;
    width:100%;
    height:500px;
}

#o7cms_title{
    position:absolute;
    top:10px;
    left:10px;
    right:10px;
    height:80px;
    padding:10px;
    background-color:#eeeeee;
    border:1px solid gray;
    border-bottom:0px;
}

#o7cms_menu{
    position:absolute;
    top:110px;
    left:10px;
    width:200px;
    padding:10px;

    border:1px solid gray;
    border-right:0px;
}

#o7cms_content{
    position:absolute;
    top:110px;
    left:230px;
    right:10px;
    bottom:10px;
    padding:10px;
    border:1px solid gray;
    overflow:auto;
}

.o7cms_menu_button{
    cursor:pointer;
    font-size:14px;
}

.o7cms_menu_button:hover{
    text-decoration: underline;
}

.o7cms_menu_button_additional_box{
    margin-top:10px;
    padding-top:10px;
    border-top:1px dotted gray;
}

.o7cms_permission_text{
	background-color:#777777;
	color:white;
	padding:2px;
	margin:2px;
}

table.listform
{
	width:100%;
    border: 1px #aaaaaa solid;
    border-collapse: collapse;
    border-spacing: 0
}

table.listform  tr
{
	vertical-align:middle;
}

table.listform  th
{
    padding: 5px;
    border: #aaaaaa solid;
    border-width: 0 0 1px 1px;
    background-color: #eeeeee;
}

table.listform  td
{
    border: 1px #aaaaaa solid;
    border-width: 0 0 1px 1px;
	padding:0px 5px;
    font-size:12px;
    height:30px;
}

.td_bg_white{
    background-color:transparent;
}

.td_bg_blue{
    background-color:#bbdbff;
}

.td_bg_gray{
    background-color: #eeeeee;
}

.td_bg_gray input{
    background-color: #eeeeee;
}

.td_bg_darkgray{
    background-color: #b1b1b1;
}

.listform_input_text_readonly{
    border:0px;
}
.listform_input_text_edit{
    border:1px solid gray;
}

.listform_input_checkbox_readonly{
    display:none;
}
.listform_input_checkbox_edit{
    display:block;
}

.listform_input_text_editable{
    border:1px;
}

.o7cms_edit_button{
    text-align:center;
    cursor:pointer;
}
.o7cms_edit_button:hover{
    border:1px solid gray;
}
.o7cms_edit_button_img{
    margin-top:4px;
    width:20px;
}
.o7cms_text_button{
    width:70px;
    height:20px;
    border-radius:5px;
    background-color:orange;
    color:white;
    font-weight:bold;
    font-size:14px;
    text-align:center;
    cursor:pointer;
    padding:2px 5px;
}
.o7cms_text_button:hover{
    background-color:rgb(255, 102, 0);
}
.o7cms_text_button_cancel{
    width:70px;
    height:20px;
    border-radius:5px;
    background-color:rgb(172, 172, 172);
    color:white;
    font-weight:bold;
    font-size:14px;
    text-align:center;
    cursor:pointer;
    padding:2px 5px;
}
.o7cms_text_button_cancel:hover{
    background-color:rgb(75, 75, 75);
}
.o7cms_plus_button{
    width:16px;
    height:20px;
    border-radius:10px;
    background-color:rgb(62, 139, 255);
    color:white;
    font-weight:bold;
    font-size:14px;
    text-align:center;
    cursor:pointer;
    padding:2px 5px;
}
.o7cms_plus_button:hover{
    background-color:rgb(0, 55, 156);
}
#form_post_input{
    position:absolute;
    top:10px;
    left:10px;
    right:10px;
    bottom:10px;
    display:none;
}
.flex_container{
    display: flex;
    justify-content: center;
}

/* ページに出るメッセージ用 */
.o7cms_messsage_red{
    padding:10px;
    text-align:center;
    background-color:lightpink;
    color:red;
    display:block;
}
.o7cms_messsage_yellow{
    padding:10px;
    text-align:center;
    background-color:lightyellow;
    color:rgb(0, 60, 255);
    display:block;
}
.o7cms_messsage_blue{
    height:30px;
    text-align:center;
    background-color:lightskyblue;
    color:blue;
    display:block;
}

/* ログインフォーム用 */
.o7cms_loginform_frame{
	display:flex;
	flex-direction: column;
	justify-self:center;
	align-items: center;
	margin-top:150px;
}
.o7cms_loginform_line{
	display:flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	margin:10px;
}
.o7cms_loginform_title{
	text-align:center;
	font-size:18px;
	font-weight:bold;
}
.o7cms_loginform_label{
	font-size:14px;
	width: 90%;
	max-width: 300px;
	text-align:left;
}
.o7cms_loginform_input_box{
	width: 90%;
	max-width: 300px;
	font-size:16px;
	border-radius:7px;
	padding:5px 10px;
	border:1px solid #777777;
	background-color: #ffffff;
}
.o7cms_loginform_input{
	width: 100%;
	max-width: 280px;
	font-size:18px;
	border:0px;
	background-color: #ffffff;
}
.o7cms_loginform_button{
	min-width:150px;
	max-width:200px;
	font-size:14px;
	background-color: dodgerblue;
	color:white;
	border:1px solid dodgerblue;
	font-weight: bold;
	border-radius:7px;
	cursor:pointer;
	text-align:center;
	padding:7px;
	margin-top:20px;
}
.o7cms_loginform_button:hover{
	background-color: white;
	color:dodgerblue;
	
}



/* レスポンシブ用 202202~ */
.nn_rsp_image_100{
	width:100%;
	margin: 0px 0px 5px 0px;
}
.nn_rsp_image_100 img{
    max-width: 100%;
	height: auto;
	display: block;
	margin: auto;
}

.nn_rsp_image_50_left{
    float:left;
	width:50%;
    margin: 0px 5px 5px 0px;
}
.nn_rsp_image_50_left img{
    max-width: 100%;
	height: auto;
	display: block;
	margin: 0px;
}

.nn_rsp_image_50_right{
    float:right;
	width:50%;
    margin: 0px 0px 5px 5px;
}
.nn_rsp_image_50_right img{
    max-width: 100%;
	height: auto;
	display: block;
	margin:0px;
}

.nn_rsp_text_100{
	width:100%;
    margin:auto;
}

@media screen and (max-width: 750px){ /*スマホサイズ*/
    .nn_rsp_image_50_left{
        width:100%;
        margin:0px 0px 5px 0px;
        float:none;
    }
    .nn_rsp_image_50_right{
        width:100%;
        margin:0px 0px 5px 0px;
        float:none;
    }
}




.rps_type14_box{
	width: 100%;
	padding-bottom: 2.5%;
}
.rps_type14_img{
	width: 50%;
	float: left;
}
.rps_type14_img img{
	max-width: 100%;
	height: auto;
	display: block;
	margin: auto;
}
.rps_type14_txt{
	width: 50%;
	float: left;
	padding: 0 0 0 2.5%;
	box-sizing: border-box;
}
.popup_modal{
	position:fixed;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;

	z-index: 999999999;
	background-color: rgba(20,20,20,1);
	display: flex;
	justify-content: center;
	align-items: center;
}
.popup_modal img{
	max-width:90%;
	max-height:90%;
	object-fit:contain;
}
.popup_modal_x{
	position:absolute;
	right:20px;
	top:20px;
	height:30px;
	width:30px;
	font-size:20px;
	color:white;
	cursor:pointer;
}

@media screen and (max-width: 750px){ /*スマホサイズ*/
	.rps_type14_img{
		width: 100%;
		float: none;
	}
	.rps_type14_txt{
		width: 100%;
		float: none;
		padding: 2.5% 0;
	}
}

.rps_type15_box{
	width: 100%;
	padding-bottom: 2.5%;
}
.rps_type15_img{
	width: 50%;
	float: right;
}
.rps_type15_img img{
	max-width: 100%;
	height: auto;
	display: block;
	margin: auto;
}
.rps_type15_txt{
	width: 50%;
	float: right;
	padding: 0 2.5% 0 0;
	box-sizing: border-box;
}
@media screen and (max-width: 750px){ /*スマホサイズ*/
	.rps_type15_img{
		width: 100%;
		float: none;
	}
	.rps_type15_txt{
		width: 100%;
		float: none;
		padding: 2.5% 0;
	}
}

.rps_type16_box{
	width: 32.5%;
	padding: 0 2.5% 2.5% 0;
	box-sizing: border-box;
	float: left;
}
.rps_type16_txt{
	width: 70%;
	float: left;
	padding-bottom: 2.5%;
	box-sizing: border-box;
}
@media screen and (max-width: 750px){ /*スマホサイズ*/
	.rps_type16_box{
		width: 50%;
		padding-bottom: 2.5%;
		float: left;
	}
	.rps_type16_txt{
		width: 100%;
		display: inline;
		float: left;
		padding: 0 0 0 2.5%;
		box-sizing: border-box;
	}
}

.rps_type17_box{
	width: 100%;
	padding-bottom: 2.5%;
}
.rps_type17_img{
	width: 30%;
	float: left;
}
.rps_type17_img img{
	max-width: 100%;
	height: auto;
	display: block;
	margin: auto;
}
.rps_type17_txt{
	width: 70%;
	float: left;
	padding: 0 0 0 2.5%;
	box-sizing: border-box;
}
@media screen and (max-width: 750px){ /*スマホサイズ*/
	.rps_type17_img{
		width: 50%;
		float: none;
		margin: auto;
	}
	.rps_type17_txt{
		width: 100%;
		float: none;
		padding: 2.5% 0;
	}
}

.rsp_type18_img{
	width: 25%;
	float: left;
	padding: 1.25%;
	box-sizing: border-box;
}
.rsp_type18_img img{
	max-width: 100%;
}
.type18kaigyo{
	display: none;
}
@media screen and (max-width: 750px){ /**/
	.rsp_type18_img{
		width: 50%;
		float: left;
		padding: 1.25%;
		box-sizing: border-box;
	}
	.rsp_type18_img img{
		max-width: 100%;
	}
	.type18kaigyo{
		display: block;
		clear: both;
	}
}

.rsp_type19_img{
	width: 25%;
	float: left;
	padding: 1.25%;
	box-sizing: border-box;
}
.rsp_type19_img img{
	max-width: 100%;
}
.type19kaigyo{
	display: none;
}
@media screen and (max-width: 750px){ /**/
	.rsp_type19_img{
		width: 50%;
		float: left;
		padding: 1.25%;
		box-sizing: border-box;
	}
	.rsp_type19_img img{
		max-width: 100%;
	}
	.type19kaigyo{
		display: block;
		clear: both;
	}
}
.o7cms_post_enter{
	display: inline-block;
    border: solid 1px #878686;
    border-radius: 5px;
	padding: 2px 10px;
	margin-left: 20px;
	background: #eeeeee;
}
.o7cms_post_move{
	margin: 0 10px;
}

.o7cms_admin_watermark{
	display: flex;
	align-items: center;
	justify-content: left;
	flex-wrap: wrap;
	gap:30px;
	padding:30px;
	box-sizing: border-box;
}

#o7cms_admin_watermark_result{
	width: 100%;
	text-align: left;
}

.o7cms_bg_loading {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100000;
	/* display: flex; */
	display: none;
	justify-content: center;
	align-items: center;
	width: 100vw;
	height: 100vh;
	background: rgba(255, 255, 255, 0.8);
	/* background: rgba(0, 0, 0, 0.8); */
}

.o7cms_loading_spinner {
	width: 50px;
	height: 50px;
	border: 5px solid #ccc;
	border-top: 5px solid #3498db;
	/* border: 5px solid #555;
	border-top: 5px solid #222; */
	border-radius: 50%;
	animation: o7cms_spin 1s linear infinite;
}

@keyframes o7cms_spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}