/* grid */
.grid-banner { width: 100%; position: relative; display: grid;}
.grid-banner-4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
.grid-banner-3 { grid-template-columns: 1fr 1fr 1fr; }
.grid-banner-2 { grid-template-columns: 1fr 1fr; }
.grid-banner-1 { grid-template-columns: 1fr; }
.grid-banner .banner-content { background-color: #ffffff; background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; }
.grid-banner .banner-content > img,.grid-banner .banner-content > video { width: 100%; height: 100%; object-fit: cover; }

/* flex */
.flex-banner { width: 100%; position: relative; display: flex; }
.flex-banner .banner-content { width: 100%; position: relative; }
.flex-banner .banner-content > img,.flex-banner .banner-content > video { width: 100%; height: 100vh; object-fit: cover; }
.flex-banner .banner-content {height:100vh; background-repeat: no-repeat;background-size: cover;background-position: center;object-fit: cover;}
.flex-banner .fc__bg_bl {color:#ffffff;}
.flex-banner .fc__bg_wc {color:#000000;}

/* 공통 */
.banner-text { position: absolute; font-size: 25px; z-index: 1; }
.banner-link { text-decoration: underline; font-size: 13px; }
.content-text { position: absolute; font-size: 18px; z-index: 1; }
.content-link { text-decoration: underline; font-size: 13px; }

/* 수직 위치 */
.vertical-T { top: 30px;}
.vertical-M { top: 50%; transform: translateY(-50%); }
.vertical-B { bottom: 30px;}

/* 수평 위치 */
.horizontal-L { left: 30px; }
.horizontal-C { left: 50%; transform: translateX(-50%); }
.horizontal-R { right: 30px;}

.vertical-M.horizontal-C { transform: translate(-50%, -50%); }

/* 텍스트 정렬 */
.text-align-L { text-align: left; }
.text-align-C { text-align: center; }
.text-align-R { text-align: right; }

.web { display: block; }
.mobile { display: none; }

@media only screen and (max-width: 1024px) {
  
  .web { display: none; }
  .mobile { display: block; }
}