/* // INDEX 슬라이드 내용 관련 */ .banner-slide { width: 660px; height: 280px; margin: 0 0 0px 0; overflow: hidden; } .flex { display: flex !important; display: -webkit-flex !important; align-items: center; -webkit-align-items: center; } /* 배경이미지 출력의 경우 */ .swiper-slide.img-back { text-align: center; background-color: transparent; background-position: 50% 50%; background-repeat: no-repeat; background-size: 100% auto; filter: blur(0); overflow: hidden; } .swiper-slide.img-back::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: inherit; z-index: -1; filter: blur(3px); } .main-banner .swiper > .swiper-pagination { gap : 0 !important; text-align: center; left: initial; bottom: initial; width: auto; margin: 10px auto 0 auto; } .main-banner .swiper-pagination-bullet { background-color: #03af97; opacity: initial; } .main-banner .swiper-pagination {position: relative; margin: 20px auto 0 auto;} .main-banner .swiper-pagination .swiper-pagination-bullet {width: 20px; height: 8px; margin: 0 6px 0 0; border-radius: 6px; transition: width 0.3s;} .main-banner .swiper-pagination .swiper-pagination-bullet-active {width: 50px; background: #1a2290 !important;} .main-banner .con-btn-box {position: absolute; top: 290px; left: 646px; padding: 0 6px; line-height: 100%; cursor: pointer; } .img-comentary::after { content: ""; display: flex; align-items: center; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0, 0.5) url('/images/main_visual_dot2.png') repeat; z-index: 1; } .txt-comentary { word-wrap: break-word; text-overflow: ellipsis; text-align: center; flex: 1; } .txt-comentary h1 { position: relative; display: block; box-sizing: border-box; width: 660px; height: auto; margin: 15px auto 15px auto; padding-left: 83px; padding-right: 83px; font-family: 'Gmarket Sans'; font-size: 35px; color: #fff; letter-spacing: -1.5px; line-height: 110%; font-weight: 700; text-shadow: 0 1px 1px rgba(0,0,0, 0.4); -webkit-line-clamp: 2; overflow: hidden; z-index: 10; } .txt-comentary h2 { position: relative; display: block; box-sizing: border-box; width: 660px; margin: 0 auto; padding: 0 4em; width: calc(660px - 8em); font-size: 11.5px; color: rgba(255,255,255, 0.8); letter-spacing: 0px; line-height: 150%; font-weight: 300; text-align: center; -webkit-line-clamp: 2; overflow: hidden; z-index: 10; } .txt-comentary .btn-slide { position: relative; display: inline-block; height: 34px; margin: 25px 0 0 0; padding: 12px 30px 0 30px; font-family: 'Gmarket Sans'; word-wrap: initial; text-overflow: initial; font-size: 11px; color: #fff; font-weight: 400; text-decoration: none; border-radius: 34px; background: #fa4b2a; z-index: 10; } .txt-comentary .btn-slide:hover {background: #1153b9;} .swiper-slide-active .wow.animated-item-1 {animation: fadeInUp 0.3s linear 0.3s both;} .swiper-slide-active .wow.animated-item-2 {animation: fadeInUp 0.3s linear 0.6s both;} .swiper-slide-active .wow.animated-item-3 {animation: fadeInUp 0.3s linear 0.9s both;} .swiper-slide-active .wow.animated-item-4 {animation: fadeInUp 0.3s linear 1.2s both;} /* 왼쪽라밸 */ .label-comentary { position: absolute; top: 8px; left: -35px; display: block; width: 105px; height: 18px; font-size: 10px; color: #fff; line-height: 17px; font-weight: 300; text-align: center; box-shadow: 2px 2px 2px 0 rgba(0,0,0, 0.1); transform: rotate(-45deg); z-index: 100; filter: blur(0) !important; } .label-comentary.economic { font-family: 'Noto Sans KR', 'Noto Sans', sans-serif; background: #009cff; } .label-comentary.economic::before {content: "해설"; filter: blur(0) !important;} .label-comentary.post { font-family: 'Noto Sans KR', 'Noto Sans', sans-serif; letter-spacing: -1px; line-height: 16px; background: #f34c87; } .label-comentary.post::before {content: "포스트"; filter: blur(0) !important;} /* // INDEX 슬라이드 내용 관련 */ /* 보도자료 TOP1 */ .topic-box { margin: auto 0; position: relative; } .thumb-img-wrap { position: absolute; top: 0; left: 0; width: 112px; height: 68px; text-align: center; justify-content: center; align-items: center; overflow: hidden; } .thumb-img-wrap img { display: inline-block; width: 112px; height: 100%; } .thumb-img-wrap::after { content: "HOT"; display: block; position: absolute; top: 2px; left: -20px; width: 60px; height: 16px; font-family: 'Noto Sans KR', 'Noto Sans', sans-serif; font-size: 9px; color: #fff; line-height: 15px; font-weight: 500; text-align: center; background: red; transform: rotate(-45deg) scale(0.8); } .thumb-box dl { padding: 2px 0 0 136px; } /* 배너관련 */ .left-banner { left: -110px; top: 452px; } .left-banner .left-b-item { width: 80px; height: 170px; } .right-banner { top: 452px; right: -81px; } .right-banner .right-b-item { width: 55px; height: 110px; }