@charset "utf-8";

/* CSS Document */
@media print,
screen and (min-width: 768px) {
  .p-top {
    background-image: url("../img/mv.webp");
    position: relative;
    background-position: center;
    background-color: #e1effa;
    border-radius: 15px;
    background-size: contain;
    background-attachment: fixed;
  }
}

@media not all and (min-width: 768px) {
  .p-top {
    background-image: url("../img/mv.webp");
    background-color: #000000;
    padding: 130px 0 50px;
    border-radius: 10px;
	background-position: center;
  }	
}



@media print,
screen and (min-width: 768px) {
  .p-top {
    padding: 150px 0 220px;
  }
}

.p-contents--top {
    margin-top: 0!important;
}
	
/*-------------------------
  新TOP
-------------------------*/
	@media (max-width: 768px) {

  .card-body {
    padding: 0.5rem;
  }

  .card {
    width: 100%;
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .card-title,
  .card-text {
    word-wrap: break-word;
    overflow-wrap: break-word;
    font-size: 14px;
    white-space: normal;
  }

  .card-text {
    display: none;
  }

  #cardContainer .col-md-3 {
    padding-right: 5px;
    padding-left: 5px;
  }

  .category-badge {
    padding: 0 3px !important;
    font-size: 0.7rem !important;
  }

}


.card-link {
  color: inherit;
  text-decoration: none;
}

.card-link:hover {
  text-decoration: none;
}

.card-img-container {
  position: relative;
  white-space: nowrap;
}

.category-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background-color: #ffffff;
  color: #000000;
  padding: 0 5px;
  border-radius: 5px;
  font-size: 0.8rem;
  opacity: 0.9;
}

.filter-btn {
  width: 100%;
  border-radius: 0!important;
}

.col-md-2 {
  padding: 0 !important;
  display: flex;
  flex-wrap: wrap;
}

.row {
  display: flex;
  align-items: stretch;
  margin: 0 0;
}

.search-container {
  background-color: #f5f5f5;
  border-radius: 5px;
}

#cardSearch {
  width: 100%;
}

.card {
  height: 100%;
  border-radius: 12px!important;
  border: none!important;
}


.container {
    width: 100%;
    padding-right: 15px!important;
    padding-left: 15px!important;
    margin-right: auto;
    margin-left: auto;
}