@charset "UTF-8";
body,
html {
  height: 100%;
  margin: 0 auto;
}


.bg-color {
  /* background-image: url('../../images/realshop/llsp-milkfed/bg_leo.png'); */
  background-color:rgba(255,255,255,0.98);
  background-blend-mode:lighten;
  position: relative;
  min-height: 100%;
  height: 400px;
  background-size: cover;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 2;
}

@media only screen and (max-width: 599px){
  .bg-color::before {
    content:"";
    display:block;
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    background-position: 50% 100%;
    width:100%;
    height:100vh;
    /* background-image: url('../../images/realshop/llsp-milkfed/bg_leo-sp.png'); */
    background-color:rgba(255,255,255,0.98);
    background-blend-mode:lighten;
    min-height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;  
  }

  .bg-color {
    background: none;
  }
}

main {
  background-image: linear-gradient(90deg, rgba(246, 168, 255, 0.17), rgba(255, 255, 255, 0) 48%, rgba(246, 168, 255, 0.17));
}

.ttl-a,
.ttl-b:before {
  background: rgb(218, 87, 216);
}

.ttl-b,
.ttl-c {
  color: rgb(218, 87, 216);
}

.ttl-c {
  background-color: rgb(255, 255, 255,0);
}

.center {
  text-align: center;
}

.img-center {
  display: block;
  text-align: center;
}

.main section:nth-last-of-type(4) .inner {
  width: 100rem;
  margin: 0 auto 12rem;
}

@media only screen and (min-width: 599px) and (max-width: 1024px){
  .main section:nth-last-of-type(4) .inner {
    width: 100%;
  }
}

.l-column .col-2 {
  width: 50%;
}

.l-column.goods-list .goods-list__inner {
  box-shadow: none;
}

.goods-list__inner .image.owl-carousel{
  max-width: 60rem;
}

.goods-list__inner .button .btn{
  margin-top: 2rem;
  width: 75%;
  height: 5.5rem;
  line-height: 5.5rem;
}

.goods-list__inner .button .btn.btn-a{
  font-size: 1.4rem;
}

@media only screen and (min-width: 599px) and (max-width: 1024px){
  .l-column.goods-list .col-1 .image {
    width: 60%;
  }
}

@media only screen and (max-width: 599px){
  .l-column .col-1{
    width: 100%;
  }

  .goods-list__inner .button .btn{
    width: 100%;
    height: 5rem;
    line-height: 5rem;
    margin-bottom: 2rem;
  }
  
  .goods-list__inner .button .btn.btn-a{
    font-size: 1.2rem;
  }

  .main section:nth-last-of-type(4) .inner {
    width: 100%;
  }

  .l-column .col-3.col-3-1 {
    flex-basis: 100%;
    width: 100%;
  }
}