*{
	box-sizing: border-box;
	font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;
}
a{
	cursor: pointer;
}
.clearfix::after {
	content: "";
	display: block;
	clear: both;
}
html,body{
	color: #333;
	font-size: 16px;
	margin: 0;
	padding:0;
	height: 100%
}
button:disabled{
	opacity: .5 !important;
}
[data-tippy-root] {
  opacity: 1 !important;
}
.has-error{
	border: 1px solid #F5B7B1 !important;
	border-color: #F5B7B1 !important;
}
.tippy-box{
  max-width: none !important;
  white-space: nowrap !important;
	font-size: 12px;
	background-color: #333;
	color: #fff;
}
.tippy-arrow{
	color: #333;
}
.red .tippy-box{
	background-color: #EC7063;
	color: #fff;
}
.red .tippy-arrow{
	color: #EC7063;
}
.blue .tippy-box{
  background-color: #2471A3;
  color: #fff;
}
.blue .tippy-arrow{
  color: #2471A3;
}
.green .tippy-box{
  background-color: #229954;
  color: #fff;
}
.green .tippy-arrow{
  color: #229954;
}
.yellow .tippy-box{
  background-color: #B7950B;
  color: #fff;
}
.yellow .tippy-arrow{
  color: #B7950B;
}
table{
	position: relative;
}
i{
  vertical-align: middle;
  font-size: 1.2em; 
  line-height: 1.2;
	font-weight: normal;
	display: inline-block;
	margin: -1px 0 1px 0;
}
.small{
	font-size: 12px;
}
select{
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
input, textarea, select{
	background: transparent;
}
.radio,.checkbox{
	cursor: pointer;
}
.radio input{
	pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -webkit-transition: border-color 0.2s linear;
  transition: border-color 0.2s linear;
  width: 18px !important;
  height: 18px !important;
	padding: 0;
  background-color: rgba(160,160,160,.1);
  border-radius: 9px;
  content: '';
  cursor:pointer;
	margin: 2px 0 -2px 0;
	opacity: .8;
	text-align: center;
}
.radio input:before {
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  position: absolute;
  display: inline-block;
  background-color: rgba(41, 128, 185,.5);
	border-radius: 10px;
  width: 14px;
  height: 14px;
  content: '';
  opacity: 0;
  margin: 2px 7px -1px -7px;
}
.radio input:checked:before{
  opacity: 1;
}
.checkbox input{
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -webkit-transition: border-color 0.2s linear;
  transition: border-color 0.2s linear;
  width: 18px !important;
  height: 18px !important;
	padding: 0;
  background-color: rgba(160,160,160,.1);
  border-radius: 3px;
  content: '';
  cursor:pointer;
	margin: 3px 0 -3px 0;
	opacity: .8;
}
.checkbox input:before {
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  position: absolute;
  display: block;
  width: 5px;
  height: 9px;
  border-right: 3px solid rgba(41, 128, 185,.5);
  border-bottom: 3px solid rgba(41, 128, 185,.5);
  content: '';
  opacity: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  margin: 1px -5px -1px 5px;
}
.checkbox input:checked:before{
  opacity: 1;
}

.wrapper{
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.masked {
  font-family: 'password'; /* Firefox等で有効な技 */
  -webkit-text-security: disc; /* Chrome, Safari */
  text-security: disc; /* 一部ブラウザ */
}

.main{
	flex: 1;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* tippy */
div[data-tippy-root] {
	opacity: .5;
}


/* sweet alert */
.swal2-popup table select{
  width: 100%;
  border: 1px solid rgba(160,160,160,.5);
  border-radius: 3px;
  outline: none;
  padding: 10px 10px;
  font-size: 14px;
  appearance: none;
  cursor: pointer;
}

.swal2-popup table button{
  border: 1px solid rgba(160,160,160,.5);
  width: 100%;
  font-size: 14px;
  cursor: pointer;
}
.my-swal-close{
	display: block !important;
	text-align:right;
	margin-right:10px;
	margin-top: -5px;
}
.swal-wide {
  width: 600px !important;  /* ここでサイズ調整 */
  max-width: 90%;
}
body.swal2-height-auto, html.swal2-height-auto{
	height: 100% !important;
}
.swal2-icon,.swal2-icon *{
box-sizing: content-box !important;
-webkit-text-size-adjust: auto !important;
-webkit-box-sizing: content-box !important;
}
.swal2-textarea{
font-size:14px !important;
}
.swal2-select{
font-size:14px !important;
height:40px !important;
margin-bottom:0px !important;
cursor:pointer;
}
.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step~.swal2-progress-step{
background-color:#add8e6 !important;
}
.swal2-progress-steps .swal2-progress-step{
background-color:rgba(51, 51, 51, 1) !important;
}
.swal2-progress-steps .swal2-active-progress-step{
background-color:#3085d6 !important;
}
.swal2-input{
margin-bottom:0 !important;
}
.swal2-modal{
width:300px;
}
.swal2-icon{
zoom:70% !important;
}
.swal2-title{
font-size:18px !important;
margin-bottom: 10px !important;
margin-top: 15px !important;
}
.swal2-input::placeholder{
font-size:18px !important;
}
.swal2-text{
font-size:12px !important;
}
.swal2-container button{
  min-width: 100px;
}
.swal2-confirm,.swal2-button{
background-color:rgba(51, 51, 51, 1) !important;
height:37px !important;
font-size:12px !important;
box-shadow: none !important;
}
.swal2-confirm.custom-del,.swal2-button.custom-del{
background-color: #f08080 !important;
}
.swal2-confirm:hover:not(:disabled),.swal2-button:hover:not(:disabled){
background-color:rgba(0, 0, 0, 1) !important;
}
.swal2-confirm.custom-del:hover:not(:disabled),.swal2-button.custom-del:hover:not(:disabled){
background-color: #ff6347 !important;
}
.swal2-footer{
text-align:left !important;
font-size:12px !important;
border-top:none !important;
display:block !important;
margin-top:5px !important;
}
.swal2-cancel,.swal2-button--cancel{
box-shadow: none !important;
color:rgba(51, 51, 51, 1) !important;
background-color:#fff !important;
border:1px solid rgba(160,160,160, 5) !important;
line-height:17px !important;
font-size:12px !important;
height:37px !important;
}
.swal2-cancel:hover:not(:disabled),.swal2-button--cancel:hover:not(:disabled){
color:#fff !important;
background-color:rgba(51, 51, 51, 1) !important;
}
.swal2-html-container{
font-size:14px !important;
text-align:left;
}
.swal2-image{
margin-top:0 !important;
}
.swal2-height-auto{
min-height:100% !important;
}
#swal2-checkbox{
-webkit-transition: border-color 0.2s linear;
transition: border-color 0.2s linear;
width: 16px !important;
height: 16px !important;
background-color:#fff;
border-radius: 3px;
content: '';
margin:3px 6px -3px 0;
cursor:pointer;
margin:1px 0 0 0;
}
#swal2-checkbox:before{
-webkit-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
position: absolute;
display: block;
width: 5px;
height: 9px;
border-right: 3px solid rgba(51, 51, 51, 1);
border-bottom: 3px solid rgba(51, 51, 51, 1);
content: '';
opacity: 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
margin:0 -4px 0 4px;
}
#swal2-checkbox:checked:before{
  opacity: 1;
}
.swal2-popup .del{
background-color:#f08080 !important;
}
#swal2-content{
margin-top:10px;
}
.swal2-actions{
	z-index: 0;
}

/* FORM form */

#swal2-content form, form ul{
	padding: 0;
	margin:0;
	list-style: none;
}
#swal2-content form{
	margin-top: 20px;
}
#swal2-content form input,
#swal2-content form button,
#swal2-content form select{
  color: #333;
}
#swal2-content form select{
	background-color: #fff;
}
#swal2-content form li{
	position: relative;
	margin-bottom: 10px;
}
#swal2-content form li .err{
	float: right;
	color: #f08080;
}
#swal2-content form li .name{
	margin-bottom: 2px;
}
#swal2-content form li button{
	width: 19%;
	float: right;
  border: 1px solid #ccc;
	height: 36px;
  border-radius: 3px;
  padding: 0 5px;
	cursor: pointer;
	background-color: rgba(160,160,160,.1);
}
#swal2-content form li .textarea button{
	height: 56px;
}
#swal2-content form li textarea,
#swal2-content form li input,
#swal2-content form li select{
	cursor: pointer;
	font-size: 14px;
	width: 80%;
	border: 1px solid #ccc;
	height: 36px;
	border-radius: 3px;
	padding: 0 5px;
}
#swal2-content form li .select > select{
	width: 100%;
}
#swal2-content form li textarea{
	font-size: 12px;
	height: 56px;
}
#swal2-content form li .textarea textarea{
	font-size: 14px;
	color: #333;
}
#swal2-content form .inner > div{
	margin-bottom: 10px;
}

/* Sumo */

.SumoSelect{
	width: 100%;
}
.SumoSelect .CaptionCont.SelectBox{
  font-size: 14px;
  width: 100% !important;
  border: 1px solid #ccc;
  height: 36px !important;
  border-radius: 3px;
  padding: 0 5px;
	text-align: left;
}
.SumoSelect .CaptionCont.SelectBox .placeholder{
	font-style: normal;
}
.SumoSelect .optWrapper{
  padding: 0 5px;
  text-align: left;
}
.SumoSelect .optWrapper i{
	background-color: #666 !important;
}
.SumoSelect .optWrapper .select-all{
	height: 40px;	
	padding-top: 0;
	padding-bottom: 0;
}
.SumoSelect .optWrapper .options .opt{
	padding: 0;
	margin-bottom: 0 !important;
}
.SumoSelect .CaptionCont label i{
	display: none;
}
.SumoSelect .CaptionCont label{
	text-align: center;
}
.SumoSelect .CaptionCont>span{
	cursor: pointer;
}
.SumoSelect .partial{
	opacity: .5;
}


.line{ color: #00C300; }
.telegram{ color: #0088CC; }
.telegram button:hover{
  background-color: #0088cc !important;
  color: #fff;
}
.line button:hover{
  background-color: #00C300 !important;
  color: #fff;
}  
.facebook{
  text-decoration: none;
  color: #1877F2;
} 
.twitter-x{
  color: #000;
}
.email{
  color: #333;
}
.swal2-popup .line,
.swal2-popup .email,
.swal2-popup .telegram,
.swal2-popup .facebook,
.swal2-popup .twitter-x svg{
  text-decoration: none;
  width: 24px;
  font-size: 24px;
}
.swal2-popup .email{
  font-size: 20px;
}
.swal2-popup .shareBox{
  margin-top: 15px;
  max-width: 180px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto; 
} 

.snslinks{
  margin: 25px 0 25px 0;
}
#snslist{
  list-style: none;
  margin: 0;
  padding: 0;
}
#snslist li{
  margin: 0 0 5px 0;
  padding: 0;
  width: 49%;
  float: left;
}
#snslist li:nth-child(odd){
  float: right;
}
#snslist li button{
  cursor: pointer;
  width: 100%;
  height: 100%;
  border: none;
  padding: 10px 10px 10px 5px;
  border-radius: 5px;
  background-color: #f5f5f5;
}
#snslist li button >i{
  float: left;
  font-size: 36px;
}
#snslist li.line button >i{
  color:  #00C300;
}
#snslist li.telegram button >i{
  color:  #0088CC;
}
#snslist li.share{
  float: none;
  width: 100%;
}
#snslist li.share button >i{
  color:  #7EA173;
}
#snslist li button >span{
  font-size: 16px;
  font-weight: bold;
}
#snslist li button >div{
  font-size: 10px;
  margin-top: 5px;
  padding-top: 5px;
  display: inline-block;
  border-top: 1px solid #bbb;
}
#snslist li button:hover >div{
  border-top: 1px solid rgba(255,255,255,.5);
}
#snslist li button:hover >i{
  color: #fff;
}
#snslist li.share button:hover{
  color: #fff;
  background-color: #7EA173 !important;
}


/* TABLE */
.table-cover{
	position: reltive;
}
.table {
	table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
}
.table th, .table td {
  padding: 6px 10px;
  border: 1px solid rgba(160,160,160,.3);
  border-left: none;
}
.table td{ 
  border-top: none;
  text-align: left;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
	word-break: break-word;
}
.table td.none-ell{
  text-overflow: clip;
  overflow: visible;
  white-space: normal;
} 
.table th{
  font-weight: normal;
  border-right: 1px solid rgba(255,255,255,.3);
  background: #444;
}
.table td:first-child {
  border-left: 1px solid rgba(160,160,160,.3);
}
.table thead th:first-child {
  border-left: 1px solid rgba(160,160,160,.3);
}
.table thead th:last-child {
  border-right: 1px solid rgba(160,160,160,.3);
}
.table tbody tr:last-child td:first-child {
}
.table tbody tr:last-child td:last-child {
}
.table thead {
  background: rgba(0,0,0,.3);
  color: #fff;
}
.table thead tr{
  position: sticky; 
  top: 0;    
  z-index: 1;
}
.table tbody tr:nth-child(even) {
  background: rgba(160,160,160,.08);
}
.table tbody tr:hover {
  background: rgba(41, 128, 185,.1);
}
.sticky-col{
  position: sticky;
  left: 0;
  background: #fff;
#  z-index: 3 !important;
}


/* PAGE SELECT */
.pageSelect{
  text-align: center;
  padding: 10px 0;
  font-size: 16px;
}
.pageSelect > *{
  opacity: 1;
  color: rgba(160,160,160,.9);
  cursor:pointer;
}
.pageSelect .page{
  font-weight: normal;
  display: inline-block;
  padding: 0 3px;
}
.pageSelect .current{
  font-weight: normal;
  opacity: .5;
  cursor: auto;
}
.pageSelect .fa-chevron-left{
  margin-right: 5px;
}
.pageSelect .fa-chevron-right{
  margin-left: 5px;
}
.pageSelect .fa-caret-left{
  margin-right: 10px;
}
.pageSelect .fa-caret-right{
  margin-left: 10px;
}
.pageSelect .num{
  cursor: auto;
  margin-left: 20px;
  font-weight: normal;
  font-size: 12px;
}
.pagination {
  display: flex;
  gap: 6px;
  margin-top: 10px;
  flex-wrap: wrap;
  justify-content: center;
  display: none;
}
.pagination i{
  font-size: 12px;
}
.pagination a,
.pagination span {
  padding: 4px 8px;
  text-decoration: none;
  border: 1px solid rgba(160,160,160,.3);
  border-radius: 4px;
  color: #333;
  font-size: 14px;
}
.pagination a:hover {
  background: rgba(160,160,160,.1);
}
.pagination a.active {
  background: rgba(0,0,0,.3);
  color: #fff;
}
.pagination-summary{
  font-size: 12px;
  font-weight: normal;
}
.pagination a.request {
  color: #888; /* ホバー時と同じグレー */
  pointer-events: none;
  animation: blink 1s ease-in-out infinite;
}
.unit{
  font-size: 10px !important;
}
.text-left{
  text-align: left !important;
}
.text-right{
  text-align: right !important;
}
.text-center{
  text-align: center !important;
}

#pageWaiting {
  position: absolute; /* 親を基準に配置 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
}

#pageWaiting i {
  font-size: 1.5rem;
  animation: spin 1s linear infinite;
}


.spin {
  animation: spin 4s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}



/* DARK */
[data-theme="dark"] body {
  background: #272727 !important;
  color: #eee !important;
}

[data-theme="dark"] a {
  color: #eee !important;
}

[data-theme="dark"] .input-group {
  background: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] select,
[data-theme="dark"] textarea,
[data-theme="dark"] input {
	color:#fff;
}

[data-theme="dark"] .policy-container {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .policy-container h2 {
  border-color: rgba(255, 255, 255, 0.2) !important;
}

[data-theme="dark"] body.iframe {
  background: rgba(0, 0, 0, 0.8) !important;
}

[data-theme="dark"] .iframe h1 {
  color: #fff !important;
}

[data-theme="dark"] .iframe .policy-container {
  background: transparent !important;
}

[data-theme="dark"] .content > .title .inner {
  color: #eee !important;
  background: #272727 !important;
  border-color: rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .sidemenu {
  color: #eee !important;
  background: #272727 !important;
}

[data-theme="dark"] .menulist a,
[data-theme="dark"] .menu-title {
  border-color: transparent !important;
}

[data-theme="dark"] .sidemenu .account,
[data-theme="dark"] .sidemenu .account * {
  border-color: rgba(255, 255, 255, 0.2) !important;
}

[data-theme="dark"] .sidemenu .options .cov span:hover,
[data-theme="dark"] .sidemenu a:hover,
[data-theme="dark"] .sidemenu .pagemenu a.active {
  background: rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .menulist a span {
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .sidemenu .function > div,
[data-theme="dark"] .sidemenu button {
  background: rgba(0, 0, 0, 0.2) !important;
  color: #eee !important;
}

[data-theme="dark"] #pageWaiting {
  background: rgba(39, 39, 39, 0.8);
}

[data-theme="dark"] .page form input,
[data-theme="dark"] .page form textarea {
}

[data-theme="dark"] .page form small {
  color: #aaa;
}

[data-theme="dark"] #spa button {
  opacity: 1 !important;
  border: none !important;
}
[data-theme="dark"] #spa button:not(table button):hover {
	background: rgba(0, 0, 0, 0.2) !important;
} 

[data-theme="dark"] #spa button:disabled {
  opacity: 0.2 !important;
  background-color: #000 !important;
  color: #eee !important;
}

[data-theme="dark"] .swal2-popup {
  background: #1e1e1e !important;
  color: #eee !important;
}

[data-theme="dark"] .swal2-title {
  color: #fff !important;
}

[data-theme="dark"] .swal2-content {
  color: #ccc !important;
}

[data-theme="dark"] #swalForm select,
[data-theme="dark"] #swalForm input,
[data-theme="dark"] #swalForm textarea {
}

[data-theme="dark"] .swal2-confirm,
[data-theme="dark"] .swal2-cancel {
  background-color: #444 !important;
  color: #fff !important;
  border: none !important;
}
[data-theme="dark"] .folding-menu.popup{
  background: #373737 !important;
}
[data-theme="dark"] .folding-menu.popup .arrow:after{
  color: #373737 !important;
}
[data-theme="dark"] #slide{
  background: #272727;
} 
[data-theme="dark"] #spa .button button {
  background-color: transparent !important;
}
[data-theme="dark"] .sticky-col{
  background: #272727;
}
[data-theme="dark"] th.sticky-col{
  background: #444;
}
[data-theme="dark"] #snslist button{
  background: #272727 !important;
}
[data-theme="dark"] #snslist .line button:hover{
  background: #00C300 !important;
}
[data-theme="dark"] #snslist .telegram button:hover{
  background: #0088CC !important;
} 


/* MEDIA SCREEN */
  
@media screen and (max-width: 768px){



  .table-cover table, .table-cover thead, .table-cover tbody, .table-cover th, .table-cover td, .table-cover tr {
    display: block;
  }

  .table-cover thead {
    position: absolute !important;
    top: -9999px;
    left: -9999px;
  }

  .table-cover td {
    position: relative;
    padding-left: 100px !important;
		border-left: none !important;
		border-right: none !important;
	  text-overflow: clip;
	  overflow: visible;
	  white-space: normal;
	}
  .table-cover td:last-child {
		border-bottom: none !important;
	}
	.table-cover tr{
		border: 1px solid rgba(160,160,160,.3);
		margin-bottom: 15px;
		border-radius: 5px;
		overflow: hidden;
  }
	.table tbody tr:hover{
		background: transparent !important;
	}
  .table-cover td::before {
		color: #fff;
		background: #444;
		font-size: 10px;
		font-weight: normal;
    content: attr(data-label);
    position: absolute;
    left: 0;
		top: 0;
		padding: 10px 10px;
		text-align: right;
    width: 70px;
		height: calc(100% - 14px);
    white-space: nowrap;
		outline: 1px solid rgba(160,160,160,.3);
  }

}  
