@charset "UTF-8";
input:focus-visible{
	outline: none !important;
}

textarea:focus-visible{
	outline: none !important;
}

#wrapper1{
	width:100%;
	margin: 0 auto;
    padding: 0 0 20px;
	background-color :#fff9e2;

}

#wrapper2,
#wrapper3{/*--- 追加 ---*/
	width:100%;
	margin: 0 auto;
    padding: 0 0 70px;
	background-color :#fff9e2;
	font-size: 1.8rem;
	overflow-x: hidden;

}

p.file_name {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}


/* ヘッダー */
//#wrapper1 header .head_main h1{width:50%}
//#wrapper1 header .head_main h1 img{max-width: 200px}

header{
	width:100%;
	margin: 0;
	background:#fff;
	font-size: 18px;
	position: fixed;
	z-index: 9998;
}
header .head_main{
	width:100%;
	height:80px;
	margin: 0;
	background:#fff;
	display: flex;
	justify-content:flex-start;
	position: relative
}
header .head_main div{box-sizing: border-box}
header .head_main div:nth-child(1){width:25vw;}
header .head_main h1 img{
	max-width:200px;
	width: 100%;
    margin-top: 0px;
}
header .head_main div:nth-child(2){width:50vw;margin-right: 10%; text-align: center;padding-top: 10px;}
header .head_main div:nth-child(2) p{font-size: 1.3rem;margin-bottom: 3px}
header .head_main div:nth-child(2) span{font-size: 1.6rem}
header .head_main div:nth-child(2) span.normal{background: #0071bc;
	padding: 3px 15px;
	color: #fff;
	border-radius:1.8rem
}
header .head_main div:nth-child(2) span.saigai{background: #ea5255;
	padding: 3px 15px;
	color: #fff;
	border-radius:1.8rem
}
header .head_main div:nth-child(2) span.keikai{background:rgba(225,219,55,1.00);color:#333;
	padding: 3px 15px;
	border-radius:1.8rem
}
header .head_main div:nth-child(2) span.kunren{background:#00A470;
	color: #fff;
	padding: 3px 15px;
	border-radius:1.8rem
}
header .head_main .main_logo{
	height:auto!important;width:auto!important;margin-right: 0%;
}
header .head_main .sub_logo{
	height:auto;margin-right: 0!important;margin-left: auto; padding-top:0px!important;text-align: end!important;
}
/* Need to Place the Yuipota Web Site Link on User Login screen of Yuipota System YPT02D-1716 */
.service_logo_banner{
	height:77px;width: 100%!important;max-width: 380px!important;margin-right: 0%;margin-top: 2px!important;
}
	
header .head_obi{
	width:100vw;
	height:30px;
	margin: 0;
	background:#333;
	display: flex;
	align-items: center;
	justify-content: center;
	color:#fff
}


/* フッター */
footer{
	width:100vw;
	height: 60px;
	margin:0;
	padding:0;
	background:#333;
	position: fixed;
	bottom:0;
	z-index: 5100;
}
footer .footer-inn{width:800px;
	height: 60px;
	text-align:center;
	margin: 0 auto;
	padding:0 1%;
	box-sizing: border-box;
	color:#333;
	display: flex;
	justify-content: space-between;
	justify-content: flex-start;
	align-items: center;
}

footer .footer-inn div{width:calc(100vw / 3);
	height:50px;
	position: relative
}
footer .footer-inn div a{position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	top:0;
	left:0;
	color:#333;
	border-radius: 10px;
	background: #f2f2f2;
	cursor: pointer 
}

footer .footer-inn div+div{margin-left: 1%}
footer .footer-inn div p{width:100%;
	text-align: center;
	margin: 0 auto;
	font-size:1.5rem;
	font-weight: bold;
	line-height: 1.1;
}
footer .footer-inn div p img{width:28px;margin-top: 2px}

/* SP */@media screen and (max-width:768px)   {
	footer{
		width:100%;}
	footer .footer-inn{width:100%}
	
}

#parent-messages-add-view-display-inline{
	display: flex;
}

#safe-messages-view-file-box{
	margin-top: 55px;
}

#safe-messages-view-file-box #family-message-file-box-view{
	display: flex;
	flex-wrap: wrap;
}

#safe-messages-view-file-box #message-add-file-name_residence{
	display: none !important;
}

.file_name{
	display: none !important;
}
/*----------YPT02D-1689 pdf attachment text ----------*/
.pdf_file_name{
	/* white-space: nowrap!important;  */
	text-overflow: ellipsis;
	margin-left: 5px;
	width: 103px;
	font-size: 1.4rem!important;
	color: #000000!important;
	text-indent:1px!important;
	word-break: break-all;
	
}
.pdf_file_name_family_msg{
	/* white-space: nowrap!important;  */
	text-overflow: ellipsis;
	margin-left: 86%;
	width: 104px;
	font-size: 1.4rem!important;
	color: #000000!important;
	text-indent:1px!important;
	word-break: break-all;
	
}
.pdf_file_name_residence_msg{
	/* white-space: nowrap!important;  */
	text-overflow: ellipsis;
	width: 104px;
	font-size: 1.4rem!important;
	color: #000000!important;
	text-indent:1px!important;
	word-break: break-all;
	
}
.pdf_file_name_family_msg_receive{
	/* white-space: nowrap!important;  */
	text-overflow: ellipsis;
	width: 104px;
	font-size: 1.4rem!important;
	color: #000000!important;
	text-indent:1px!important;
	word-break: break-all;
	
}
.pdf_attach_align{
	text-indent: 0em!important;
    padding-left: 0px!important;
    margin-left: 0px!important;
}

.pdf_file_name_attach{
	/* white-space: nowrap!important; */
	text-overflow: ellipsis;
	margin-left: 0px!important;
	padding-left: 0em!important;
	width: 103px;
	font-size: 1.4rem!important;
	color: #000000!important;
	text-indent:1px!important;
	word-break: break-all;
}
.pdf_file_name_reply{
	/* white-space: nowrap!important; */
	text-overflow: ellipsis;
	margin-left: 0px!important;
	padding-left: 0em!important;
	width: 103px;
	font-size: 1.4rem!important;
	color: #000000!important;
	text-indent:1px!important;
	word-break: break-all;
	
}
.pdf_file_name_family{
	/* white-space: nowrap!important; */
	text-overflow: ellipsis;
	margin-left: 0px!important;
	padding-left: 0em!important;
	width: 103px;
	font-size: 1.4rem!important;
	color: #000000!important;
	text-indent:1px!important;
	word-break: break-all;
	margin-top: 0px!important;
}
/* SP */@media screen and (max-width:1000px)   {
	.pdf_file_name{
		/* overflow: hidden!important; */
		width: unset!important;
		font-size: 1.4rem!important;
		color: #000000!important;
		word-break: break-all;
	}
	.pdf_file_name_family_msg{
		/* white-space: nowrap!important;  */
		text-overflow: ellipsis;
		margin-left: 66%;
		width: 104px;
		font-size: 1.4rem!important;
		color: #000000!important;
		text-indent:1px!important;
		word-break: break-all;
		
	}
	.pdf_file_name_family_msg_receive{
		/* white-space: nowrap!important;  */
		text-overflow: ellipsis;
		width: 104px;
		font-size: 1.4rem!important;
		color: #000000!important;
		text-indent:1px!important;
		word-break: break-all;	
	}
}
@media screen and (max-width: 767px){
@media (max-width: 540px), (max-height: 720px){
#user-residence-messages-result-file-box div {
    width: 30% !important;
}
}
}
div#family-message-view-file-box {
    display: inline-table!important;
	width: 33%;
}

.btn_wrap_alert.alert_error{
	margin-top: 3%;
}

div#safety-message-file-box-view{
	display: flex;
    flex-wrap: wrap;
}

#safety-message-file-box{
	width: 25%;
}

/* コンテンツ */

div#parent-messages-add-view {
    margin-bottom: 25px;
}
.file_btn button span {
    position: relative;
    padding-left: 25px;
}

#message_delete_btn button.user1 span:before{
	background: url(../img/400/btn_icon2.svg);
    height: 25px;
    background-repeat: no-repeat;
    width: 25px;
    margin-left: 330px;
    margin-top: -55px;
    content: '';
 	position: absolute;
}
#message_delete_btn button.user1 span::after {
    content: '' !important;
}

#wrapper1 .contents-wrap,
#wrapper3 .contents-wrap{/*--- 追加 ---*/
	width:860px;
	margin:0px auto 0;
	padding-top:80px;
}

#residence-message-result-display-inline{
	display: flex;
}
#wrapper2 .contents-wrap{
	width:860px;
	margin:0px auto 0;
	padding-top:130px;
}
#wrapper2 .contents-wrap2{
	width:860px;
	margin:0px auto 0;
	padding-top:0px;
	background: #fff
}
.contents-inn-top{
	margin: 15px auto;
	padding: 0 3%;
	box-sizing: border-box;
	text-align: center
}

.contents-inn{width:100%;
	margin: 15px auto;
	padding: 5% 3%;
	box-sizing: border-box;
	background: #fff;
	border: 3px #333 solid;
	border-radius: 10px;
	text-align: center
}

.contents-inn-history{
    width: 100%;
    margin: 15px auto;
    padding: 3% 3%;
    box-sizing: border-box;
    background: #f2f2f2;
    border: 2px #c5c5c5 solid;
    border-radius: 10px;
    text-align: left;
}
.contents-inn h3,.contents-inn-top h3{font-size: 22px !important;font-weight: bold;
	margin-bottom: 10px; text-align: center}
.contents-inn p.top_txt{font-size: 18px;font-weight: bold;
	margin-bottom: 30px; text-align: center}

.border,.border2{
	display: flex;
	width:100%;
	height:3px;
	margin: 3% auto;
}
.border2{
	margin: 3% auto 1%;
}
.border .l,.border .s,.border2 .l,.border2 .s{height:100%;
	background: #333;
	border-radius: 1.5px;
}
.border .l{width:82%}
.border .s{width:10%;}
.border2 .l{width:10%}
.border2 .s{width:82%;}


.border .m,.border2 .m{height:100%;
	width:8%;
	display: flex;
	justify-content: space-around
}
.border .m p,.border2 .m p{width:3px;height:3px;border-radius: 1.5px;background: #333}
.border .m .o,.border2 .m .o{background:#f4810e; }
.border .m .b,.border2 .m .b{background:#333; }

/* SP */@media screen and (max-width:768px)   {
#wrapper1{ width:100%}
	#wrapper1 .contents-wrap,
	#wrapper3 .contents-wrap{/*--- 追加 ---*/
		width:96%;
		margin:0px auto 0;
		padding-top:90px;
	}
	
	#wrapper2,
	#wrapper3{ /*--- 追加 ---*/
		width:100%
	}
	#wrapper2 .contents-wrap{
		width:100%;
		margin:0px auto 0;
		padding-top:130px;
	}
	#wrapper2 .contents-wrap2{
		width:100%;
		margin:0px auto 0;
		padding-top:0%;
	}
	.contents-inn-top{text-align: left}
	.contents-inn{
		text-align: left; 
		margin-bottom: 40px !important;
	}
	.euv_change .contents-inn{
		width: 100% !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}
}

/*Galaxy SC51A*/
@media only screen and (max-width: 360px) {

	.euv_change .contents-inn{
		width: 100% !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}
}



.header-center h3{
	width: 100% !important;
}

.inline-resident-message{
	display: flex;
}

.admin-message-file-box{
	margin-top: 10px;
}

#message-add-file-name{
	margin-top: -4px;
	text-align: left;
}
#residence-messages-result-main-div{
	display: flex;
}
#residence-messages-result-text-entry-wrap{
	width: 100%;
}
#message-add-file-name_residence{
	margin-top: -7px;
	text-align: left;
}

p#message-add-file-img img {
	width: 75px;
	height: auto;
}

#family-message-form{
	margin-bottom: 35px;
}

.file_box2 p>img{
	height: auto;
	width: 100px;
}

#parent-messages-add-view-file-box{
	margin-top: -25px;
	text-align: left;
}

#disas-bulletin-board-view-fav-p{
	text-align: left;
}

div#family-message-file-box-view {
    margin-top: -50px;
}

div#family-message-file-box{
	display: block;
}

div#disaster-bulletin-board-file-box-div {
  /*  position: absolute;
    margin-top: -160px;*/
}

div#admin-messages-view-div img {
    height: auto;
    width: 100px;
    margin: 5px;
    /* text-align: right; */
}

/*head_main img logo resposive*/
@media (max-width: 769px){
	.head_main img{
		max-width: 200px !important;
	}
}

@media (max-width: 760px){
	.head_main img{
		width: 200px !important;
	}
}

@media (max-width: 740px){
	.head_main img{
		width: 200px !important;
	}
}

@media (max-width: 520px){
	.head_main img{
		width: 200px !important;
	}
}

@media (max-width: 500px){
	.head_main img{
		width: 180px !important;
   		margin-top: 5px;
	}
}

@media (max-width: 490px){
	.head_main img{
		width: 170px !important;
    	margin-top: 10px;
	}
}

@media (max-width: 460px){
	.head_main img{
		width: 160px !important;
    	margin-top: 12px;
	}
}

@media (max-width: 430px){
	.head_main img{
		width: 147px !important;
    	margin-top: 12px;	
    }
	  /* Need to Place the Yuipota Web Site Link on User Login screen of Yuipota System YPT02D-1716 */
	  .service_logo_banner{
		height:35px!important;width: 100%!important;max-width: 380px!important;margin-right: 0%;margin-top: 16px!important;
	  }
	  .logo_div{
		width: 8px!important;
	  }
}

@media (max-width: 410px){
	.head_main img{
		width: 140px !important;
    	margin-top: 15px;
    }
}

@media (max-width: 400px){
	.head_main img{
		width: 130px !important;
    	margin-top: 18px;
    }
}

@media (max-width: 380px){
	.head_main img{
		width: 125px !important;
    	margin-top: 20px;
    }
}

@media (max-width: 370px){
	.head_main img{
		width: 120px !important;
    	margin-top: 20px;
    }
}


@media (max-width: 350px){
	.head_main img{
		width: 115px !important;
    	margin-top: 20px;
    }
}

@media (max-width: 340px){
	.head_main img{
		width: 110px !important;
    	margin-top: 20px;
    }
}

@media (max-width: 320px){
	.head_main img{
		width: 100px !important;
    	margin-top: 20px;
    }
}

@media (max-width: 300px){
	.head_main img{
		width: 95px !important;
    	margin-top: 20px;
    }
}