@charset "UTF-8";

/* --------------------
   .card
-------------------- */
.card {
   margin-bottom: 1em;
   background: #edf3f5;
}
.card .card_header .ttl {
   min-height: 5em;
}
.card .card_header .imgBox {
   top: 1em;
}
.card .card_header .imgBox img {
  object-position: 60% 50%;
}
.card .btnBox .buyBtn {
   border-color: #55bce8;
   background: #55bce8;
}
.card .btnBox .buyBtn:hover {
   border-color: #55bce8;
   background: #FFF;
   color: #55bce8;
}


/* --------------------
   .case
-------------------- */
.marker {
   background: linear-gradient(transparent 60%, #fff000 60%);
}

@media (min-width: 961px) {
   .case > div {
      flex: 0 0 50%;
   }
   .case .txtBox {
      padding-right: 1.5em;
   }
   .case .imgBox {
      padding-left: 1.5em;
   }
}

/* --------------------
   .sokode
-------------------- */
.sokode {
   position: relative;
   z-index: 2;
}
.sokode::before {
   content: '';
   display: block;
   width: 140%;
   height: 7.5em;
   max-height: 27.5vw;
   position: absolute;
   top: 2em;
   left: -20%;
   z-index: -1;
   background: #fff000;
   transform: rotate(-9deg);
}

/* --------------------
   .himitsu
-------------------- */
@media (min-width: 961px) {
   .himitsu > div {
      flex: 0 0 50%;
   }
   .himitsu .txtBox {
      padding-right: 1.5em;
   }
   .himitsu .imgBox {
      padding-left: 1.5em;
   }

   #cont1 .himitsu {
      align-items: flex-end;
   }
}



/* --------------------
   .bnr
-------------------- */
.bnrList {
   justify-content: center;
   align-items: flex-end;
   margin-left: -1em;
   margin-right: -1em;
}
.bnrList > p {
   flex: 0 0 50%;
   padding-left: 1em;
   padding-right: 1em;
}