diff --git a/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp b/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp index 4433285d..fe4ea689 100644 --- a/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp +++ b/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp @@ -584,7 +584,7 @@ $(function(){ autoplay : false, pagination: { el: '.pagination .swiper-pagination', - type: 'fraction', + /*type: 'fraction',*/ }, breakpoints: { 768: { diff --git a/src/main/webapp/css/default.css b/src/main/webapp/css/default.css index acbc9c50..ddb1ab95 100644 --- a/src/main/webapp/css/default.css +++ b/src/main/webapp/css/default.css @@ -283,11 +283,10 @@ transition: all 0.2s ease-in-out; .sec5 .popularSwiper .loop-count button.remote-popular span {display:block;width:100%;height:100%;background:transparent url('/images/btn/btn-mainvisual-stop-black.png') no-repeat 50% 50%;} .sec5 .popularSwiper .loop-count button.remote-popular:focus {outline:none;} .sec5 .popularSwiper .loop-count button.remote-popular.restart span {background-image:url('/images/btn/btn-mainvisual-play-black.png');} -.sec5 .popularSwiper .pagination {position:absolute;bottom:0px;left:calc(50% - 0px);} +.sec5 .popularSwiper .pagination {/*position:absolute;bottom:0px;left:calc(50% - 0px);*/} .sec5 .popularSwiper .swiper-pagination-fraction {color:#333;left:-12px;top:4px;width:auto;} /********** 메인섹션6 **********/ -.sec6 {padding:100px 0px 100px;} .sec6 .inner {width:100%;height:100%;position: relative;} .sec6 .inner .more-btn {position:absolute;right: calc(50% - 690px);top:30px;} .sec6 .inner .more-btn a {} @@ -321,7 +320,7 @@ transition: all 0.2s ease-in-out; .sec6 .onlineSwiper .items .List .inner.light-type {color:#666;background-color:#fff;} .sec6 .onlineSwiper .items .List .inner div.thumbnail {overflow:hidden;position:relative;background-color:#f8f8f8;} .sec6 .onlineSwiper .items .List .inner div.thumbnail span.image-frame {display:inline-block;/*display:flex;align-items:center;*/height:100%;background:url('/images/img/img-no-image.gif') no-repeat 50% 0;background-size:contain;} -.sec6 .onlineSwiper .items .List .inner div.thumbnail span.image-frame img {width:100%;height:100%;vertical-align:middle;} +.sec6 .onlineSwiper .items .List .inner div.thumbnail span.image-frame img {width:100%;height:100%;vertical-align:middle;max-width:225px;} .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover {position:absolute;left:0;right:0;top:0;height:100%;padding:0% 15px;border:1px solid #2e2e2e;font-size:12px;text-align:left;color:#fff;background-color:rgba(0,0,0,0.8);opacity:0;border-radius:10px;transition:opacity 0.3s ease;} .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover > a {display:block;margin:30px 0px 10px;font-size:18px;height:55px;overflow:hidden;color:#fff;} .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover ul li {line-height:23px;font-weight:100;} diff --git a/src/main/webapp/css/media.css b/src/main/webapp/css/media.css index c7dac333..faac3e63 100644 --- a/src/main/webapp/css/media.css +++ b/src/main/webapp/css/media.css @@ -128,11 +128,11 @@ a.pop-logo img { margin-right: 10px; } .sec3 .pickSwiper {padding:1% 10% 12%;} .sec3 .pickSwiper .swiper-slide .list-box .images a img {} .sec5 {padding:100px 2% 100px;} -.sec5 .popularSwiper {padding:1% 0% 12%;} +.sec5 .popularSwiper {padding:1% 0% 1%;} .sec5 .inner .tab_content {width:96%;padding:30px 1.9%;} .sec5 .inner {width:100%;} .sec6 {padding:100px 2% 100px;} -.sec6 .onlineSwiper {padding:1% 10% 12%;width:80%;} +.sec6 .onlineSwiper {padding:1% 10% 12%;width:80%;margin:0;} .sec6 .inner .more-btn {right: 0%;} .sec6 .onlineSwiper .swiper-slide {background:none;box-shadow:0 0 0;} .sec6 .onlineSwiper::before {width:7%;box-shadow:0 0 0;} @@ -252,11 +252,15 @@ footer .family_site {right:10px;} .wrap .nav-wrap #primary-nav {display:none !important;opacity:0 !important;} .data.detail .inner .row-top .center .title-box .tit-info {width:70%;} .sec5 .popularSwiper .pagination {visibility:visible !important;} +/* .sec6 .swiper-button-next, .swiper-rtl .swiper-button-prev {visibility:visible !important;} .sec6 .swiper-button-prev, .swiper-rtl .swiper-button-next {visibility:visible !important;} - +*/ .noti-data .list-accordion .question span:nth-of-type(2) {width:67%;} .noti-data .list-accordion .question span:last-child {padding-right:0;width:7%;} +.popularSwiper .swiper-pagination { position: relative;top:45px; } +.popularSwiper .swiper-pagination-bullet { background: #aaaaaa; border-radius: 30px; margin-right: 4px; opacity: unset !important; } +.popularSwiper .swiper-pagination-bullet-active { background: #376795; width: 35px; height: 10px; } } /* 모바일 가로, 테블릿 세로 (해상도 ~ 768px)*/ @@ -354,7 +358,7 @@ footer .family_site {right:10px;} .sec6 .inner .more-btn a {font-size:12px;padding:2px 10px 3px;} .sec6 .inner .more-btn a span > span {display:none;} .sec6 .inner .more-btn a span img {width:22px;} - .popularSwiper .swiper-pagination { position: relative; } + .popularSwiper .swiper-pagination { position: relative;top:10px; } .popularSwiper .swiper-pagination-bullet { background: #aaaaaa; border-radius: 30px; margin-right: 4px; opacity: unset !important; } .popularSwiper .swiper-pagination-bullet-active { background: #376795; width: 35px; height: 10px; } .sec6 .onlineSwiper::before, @@ -366,7 +370,7 @@ footer .family_site {right:10px;} .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover .btn-box .view { width: 100%; } .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover .btn-box .RIS { display: none; } .sec6 .onlineSwiper .items .List .inner div.thumbnail span.image-frame {width:100%;} - + .sec6 .onlineSwiper .items .List .inner div.thumbnail span.image-frame img {max-width:initial;} .sec7 { padding: 54px 16px 60px; width: 100%; height: auto; box-sizing: border-box; }