@charset "utf-8";

.c-banner-container {
  display: flex;
  gap: 20px;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.c-banner {
  width: calc(50% - 10px);
  height: auto;
}
.c-banner__link {
  display: block;
}
.c-banner__image {
  width: 100%; 
  height: auto;
  transition: opacity 0.5s;
}
.c-banner__image:hover {
  opacity: 0.7; 
}

/* ===== 768px以下で1カラムにする ===== */
@media screen and (max-width: 768px) {
  .c-banner-container {
    flex-direction: column; /* 縦並びに変更 */
    gap: 15px;              /* 間隔を調整 */
  }
  .c-banner {
    width: 100%;            /* 幅を100%に設定 */
    margin-bottom: 15px;    /* バナー間の余白を追加 */
  }
  .c-banner:last-child {
    margin-bottom: 0;       /* 最後のバナーの余白を削除 */
  }
}


/* ===== SP/PC VIEW ===== */
.c-pc-view {
 display: block !important;
}

.c-sp-view {
 display: none !important;
}

@media screen and (max-width: 768px) {
 .c-pc-view {
   display: none !important;
 }

 .c-sp-view {
   display: block !important;
 }
}

/* ===== Youtube ===== */
.p-video-section{
 margin: 45px 0;
}
.home .p-video-section{
 margin-top: 70px;
 margin-bottom: -15px;
}

@media screen and (min-width: 767px) {
 .c-video{
  width: 600px;
  margin: 0 auto;
 } 
}


iframe[src*="youtube.com"],
iframe[src*="youtube-nocookie.com"] {
 aspect-ratio: 16 / 9;
 width: 100%;
 height: auto;
}


/* ===== Youtube sidebar(sp) ===== */
.contents-rightside .c-video{
 margin-bottom: 20px;
 box-sizing: border-box;
 overflow: hidden;
} 
.contents-rightside .c-video iframe{
 box-sizing: border-box;
 overflow: hidden;
 width: 100%;
}
@media screen and (min-width: 767px) {
 .contents-rightside .c-video{
  display: none;
  margin-bottom: 20px;
 } 
}