/*************************************************
               リストヘッダー
*************************************************/
.tableWrap{
  width: 90%;
  height:70px;
  margin: 0 auto;
}

.tableWrap .tableHeader{
  display: flex;
  justify-content: center;
}
.tableWrap .tableHeader div{
  color: #ffffff;
}
.approvaldummy{
	width: 5%;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #ffffff;
	border: 2px solid transparent;
    background-color: transparent;
    border-radius: 30px 0 0 30px;
}
.imgdummy{
	width: 10%;
    align-items: center;
    justify-content: center;
    border: solid 1px transparent;
    border-radius: 10px;
}
.editdummy{
    width: 5%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #ffffff;
	border: 2px solid #34d189;
    background-color: #34d189;
    border-radius: 0 30px 30px 0;
    cursor: pointer;
}

.approvaldummy,
.imgdummy,
.headerName,
.headerText,
.headerContact,
.headerUrl,
.headerAddress,
.headerOpen,
.editdummy,
.tables .allowedBtn,
.tables .displayImg,
.tables .displayName,
.tables .displayText,
.tables .displayContact,
.tables .displayUrl,
.tables .displayAddress,
.tables .displayOpen,
.displayEdit{
	margin-right:3px;
}
.headerName,
.headerUrl,
.headerAddress{
  width: 10.5%;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #3b3b3b;
}


.headerText{
  width: 20.5%;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #3b3b3b;
}

.headerContact,
.headerOpen{
  width: 10.5%;
  height: 70px;
}

.headerContact p,
.headerOpen p{
  width: 100%;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #3b3b3b;
}

.headerContact p:first-child,
.headerOpen p:first-child{
  margin-bottom: 2px;
}

/* p{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
} */


/*************************************************
               リスト　データ有
*************************************************/
.tableList{
  width: 100%;
  overflow-x: hidden;
}

.tableitem{
  width: 100%;
  height: 180px;
  margin-top: 1%;
  background-color: #d9e8ff;
  padding: 25px 0 20px 0;
}
.tablewrap{
	width: 90%;
	margin:0 auto;
}

.tables{
  width: 100%;
  display: flex;
  justify-content: center;
} 

.tables .displayImg{
  width: 10%;
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: solid 1px #d9e8ff;
  border-radius: 10px;
}

.tables .displayImg img{
  width: 100%;
  height: 140px;
  border-radius:10px;
  object-fit: cover;
}

.tables .displayName,
.tables .displayUrl,
.tables .displayAddress{
  width: 10.5%;
  height: 140px;
  border: solid 1px #d9e8ff;
  /* display: flex;
  align-items: center;
  justify-content: center;*/
  background-color: #ffffff; 
  border-radius: 10px;
  font-size: 15px;
  /* overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; */
}

.tables .displayName p{
  padding: 0 2px 0 8px;
}

.tables .displayAddress{
  width: 10.4%;
}

.tables .displayAddress p{
  word-break: break-all;
  padding: 0 14px;
}

.tables .displayUrl p{
  padding: 5px 8px 0 8px;
  word-break: break-all;
}

.tables .displayName,
.tables .displayAddress{
  display: flex;
  align-items: center;
  justify-content: center;
}

.tables .displayText{
  width: 20.5%;
  height: 140px;
  border: solid 1px #d9e8ff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction:column;
  background-color: #ffffff;
  border-radius: 10px;
}

.displayText p{ 
  width: 90%; 
  overflow: hidden;
  white-space: nowrap; 
  text-overflow:ellipsis;
  font-size: 15px;
} 


.tables .displayContact,
.tables .displayOpen{
	width: 10.5%;
	height: 140px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.tables .displayContact p,
.tables .displayOpen p{
  width: 100%;
  height: 48%;
  border: solid 1px #d9e8ff;
  background-color: #ffffff;
  border-radius: 10px;
  display: inline-block;
  word-break: break-all;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
  text-align: center;
}
.tables .displayContact p::before,
.tables .displayOpen p::before{
	content: "";
	height: 100%;
    display: inline-block;
    vertical-align: middle;
}

.tables .displayContact p:first-child,
.tables .displayOpen p:first-child{
  margin-bottom: 2%;
}

.tables .displayContact .mail{
  width: 100%;
  word-break: break-all;
}

.displayOpen{

}

.displayOpen .open{
  width:90%;
}

.displayOpen .open span {
  font-size: 10px;
}

.tables .displayUrl{
  overflow-wrap: break-word;
  font-size: 15px;
}

/* ボタンスタイル  */
.allowedBtn,
.displayEdit{
  width: 5%;
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction:column;
  color: #ffffff;
}
.allowedBtn{
  background-color: #5293fa;
  border-radius: 30px 0 0 30px;
}
.allowedBtn[allowed="true"]{
	background-color: #5293fa;
}
.allowedBtn[allowed="false"]{
	background-color: #EDBE21;
}
.displayEdit{
  border-radius: 0 30px 30px 0;
  cursor:pointer;
}
.displayEdit[enable="true"]{
	background-color: #34d189;
}
.displayEdit[enable="false"]{
	background-color: #AAAAAA;
	color:#FFFFFF;
	cursor:default;
}
.displayEdit:hover{
	transform: scale(1.05, 1.05);
}
.statusWrap{
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
	margin:0 2.8%;

}
.displayStatus{
	display: flex;
	justify-content: flex-end;
}
.displayStatus p{
	margin-left: 2%;
	margin-top: 0.5%;
}
.displayStatusInner[display="true"]{
	color:#FF0000;
}
.displayStatusInner[display="false"]{
	color:#000000;
}
.categoryStatus{
  display: inline;
  white-space: nowrap;
  margin-right: 5%;
}
.categoryStatus p{
  margin-right: 2%;
  margin-top: 0.5%;
}
.modifyStatus{
	display: inline;
	white-space: nowrap;
}
.statusWrapRight{
	flex-grow: 2;
	text-align: right;
}
/*************************************************
               リスト　データ無
*************************************************/

.noTableList{
  width: 100%;
  height: 100vh;
  /* overflow-y: scroll;
  overflow-x: hidden; */
  
}

.noTableitem{
  width: 100%;
  height: 180px;
  margin-top: 1%;
}

.noTables{
  width: 100%;
  display: flex;
  justify-content: center;
}

.noTables .noImg{
  width: 10%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: dotted 2px black;
  border-radius: 10px;
  margin-right: 0.4%;
}

.noTables .noImg img{
  width: 40%;
}



.noTables .noName,
.noTables .noUrl,
.noTables .noAddress{
  width: 10%;
  height: 140px;
  border: dotted 2px black;
  border-radius: 10px;
  margin-right: 0.3%;
}

.noTables .noText{
  width: 20%;
  height: 140px;
  border: dotted 2px black;
  border-radius: 10px;
  margin-right: 0.4%;
}

.noTables .noContact,
.noTables .noOpen{
  width: 10%;
  height: 140px;
  margin-right: 0.6%;
}

.noTables .noContact p,
.noTables .noOpen p{
  width: 100%;
  height: 45%;
  border: dotted 2px black;
  border-radius: 10px;
}

.noTables .noContact p:first-child,
.noTables .noOpen p:first-child{
 margin-bottom: 6%;
}

.nostatus{
  width: 60%;
  margin: 1% auto 0 auto;
  /* margin-left: auto;
  margin-right: 10%; */
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.nostatus p{
  width: 15%;
  font-size: 15px;
}

/*************************************************
        　　　  ページネーション
*************************************************/
.paginationWrap{
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 1% 0;
}

.paginationWrap div{
  flex-basis: 2%;
  margin: 0 0.5%;
  text-align: center;
}

.paginationWrap div a{
  text-decoration: none;
  text-align: center;
}

.paginationWrap .current{
  border: 1px solid #c7c7c7;
  background-color: #c7c7c7;
  border-radius: 5px;
}

.paginationWrap .current a{
  color: #3b3b3b;
}

.paginationWrap .num{
  border: 1px solid #5293fa;
  background-color: #5293fa;
  border-radius: 5px;
}

.paginationWrap .num a{
  color: #ffffff;
}