@charset "UTF-8";

.title {
   height: 310px;
   background-image: url(../img/list/bg-main.jpg);
   background-repeat: no-repeat;
   background-position: center center;
   background-size: cover;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   color: #ffffff;
   text-shadow: 2px 2px 6px #000000;
}

.title h1 {
   font-family: 'Montserrat', sans-ferif;
   font-size: 32px;
   font-weight: bold;
}

.title p {
   font-size: 14px;
   margin-top: 15px;
}

.item-list {
   width: 930px;
   max-width: 90%;
   margin-top: 75px;
   margin-left: auto;
   margin-right: auto;
   display: grid;
   grid-template-columns: repeat(auto-fit,240px);
   column-gap: 95px;
   row-gap: 70px;
   justify-content: center;
}

.item-list dl {
   margin-top: 20px;
}

.item-list dt {
   font-weight: bold;
}

.item-list dd {
   font-size: 13px;
   line-height: 20px;
   margin-top: 10px;
}

.item-list .price {
   font-weight: bold;
   margin-top: 15px;
}

.item-list li {
   position: relative;
}

.item-list .item-label {
   position: absolute;
   top: 0;
   left: calc(100% + 18px);
   font-size: 10px;
   white-space: nowrap;
   transform-origin: top left;
   transform: rotate(90deg);
}

.footer {
   margin-top: 100px;
}

@media (max-width: 800px) {
   .item-list {
      margin-top: 45px;
      row-gap: 45px;
   }
}