@import url("bootstrap_member.css");

/* For Navbar (Fixed-top and Container Size) */
nav.navbar {
  left: 50%;
  transform: translateX(-50%);
}

/* ******************************************************************************************************** */
/* Bootstrap Hack */
/* ******************************************************************************************************** */
.bg-primary,
.bg-secondary,
.bg-success,
.bg-danger {
  color:white;
}
.bg-success,
.bg-warning {
    color:black;
}

/* Navigation area ************************************************** */
li.nav-item{
  border: 1px solid rgba(255,255,255,0.3);
  background-color: rgba(0,0,0,0.2);
  padding: 1px 10px;
}
li.nav-item:hover{
  background-color: rgba(255,255,255,0.1);
}
li.nav-item a{
  font-weight: 600;
}
/*

.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(255,255,255,0.15);
}

*/

/* Card ************************************************** */
.card {
  border: 1px solid rgba(0,0,0,0.3);
}

/* badge ************************************************** */
.badge.bg-white {
  color: black;
}

/* Button ************************************************** */
button.btn-gray{
  background-color: rgba(128,128,128,);
  font-weight: 500;
}
a.btn-cream{
  background-color: rgba(223,215,202, 0.5);
  font-weight: 500;
}
a.btn-cream:hover{
  background-color: rgba(223,215,202, 1.0);
}


/* Modaal Hack */
.modaal-close{
  z-index: 9999;
}
#modaal-spinner-overlay{
  /* Modaalのオーバーレイ (z-index: 999999) */
  z-index: 999999; 
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  
  /* 初期状態では非表示（重要） */
  display: none;; 
}

/* ******************************************************************************************************** */
/* Other */
/* ******************************************************************************************************** */
body {
  padding-top: 5rem;
  font-family: Montserrat,sans-serif;
}
hr {
  border-top: 1px solid rgba(0,0,0,0.5);
}

#footer {
  min-height: 2rem;
  font-size: 0.8em;
}

/* DIV ************************************************** */
div.kadomaru {
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.3);
  padding: 1em;
}
div.item-list{
  width:90%;
  max-width: 1440px;
  margin:0 auto;
  margin-bottom: 1em;
}

div.m-0 {
  margin: 0 !important;
}
div.p-0 {
  padding: 0 !important;
}

/* A ************************************************** */
a.link_as_text {
  color:inherit;
  text-decoration:none;
}

a.btn-card-footer {
  width: 100%;
  border-radius: 0 0 0.25rem 0.25rem;
}
a.btn-border{
  border: 1px solid rgba(0,0,0,0.3);
  border-radius: 0.25rem;
  padding: 0.2em 0.2em;
  font-weight: 500;
  text-align: center;
}
a.btn-border:hover{
  background-color: rgba(0,0,0,0.1);
  text-decoration: none;
}

/* IMG ************************************************** */
.img_ex{
  margin: 0 auto;
  overflow: hidden;
  cursor: pointer;
}
.img_ex img{
  width: 100%;
  transition-duration: 0.5s;
}
.img_ex:hover img{
  transform: scale(1.2);
  transition-duration: 0.5s;
}

/* BG-COLOR ************************************************** */
.bg-paper{
  background-color: rgba(245, 238, 224, 0.5);
}
.bg-cream{
  background-color: rgba(223,215,202, 1.0);
}
.bg-gray100{
  background-color: rgb(128,128,128);
  border-color: rgb(64,64,64);
}
.bg-gray50{
  background-color: rgb(192,192,192);
  border-color: rgb(64,64,64);
}

/* TABLE ************************************************** */
table td.odd,
table tr.odd{
  background-color: rgba(0,0,0,0.05);
}
table td.even,
table tr.even{
  background-color: rgba(255,255,255,0.05);
}

.item-list table th,
.item-list table td{
  vertical-align: middle;
}