@charset "UTF-8";

/* ========================================
   @media screen and (min-width: 768px),print
======================================== */
@media screen and (min-width: 768px),print {
/* youtube
-------------------------------------*/
.main-ttl-box {
  background: url(../images/youtube/main-ttl-bg.jpg) no-repeat center;
  background-size: cover;
  height: calc(772 / 1920 * 100vw);
}
#youtube .system-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#youtube .system-pic {
  aspect-ratio: 16 / 9;
}
#youtube .system-pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#youtube .system-ttl-01 {
  font-weight: 500;
}

.main-ttl-box .enttl {
    text-transform: none;
}

}

.lity-close{
  top: 2vw !important;
  right: 2vw !important;
  font-size: 50px !important;
}


/* ========================================
   @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {
.main-ttl-box {
  background: url(../images/youtube/main-ttl-bg_sp.jpg) no-repeat center;
  background-size: cover;
  height: 66.43vw;
}
    
#youtube .system-pic {
  aspect-ratio: 16 / 9;
}
#youtube .system-pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#youtube .system-ttl-01 {
  font-weight: 500;
}

.main-ttl-box .enttl {
    text-transform: none;
}
}