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 be3042f9..b16070d5 100644 --- a/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp +++ b/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp @@ -16,27 +16,7 @@ $(document).ready(function() { $("#DIV_PAGE_MAIN").removeClass("sub"); var unreadNotiCnt = $(".noti-btn span.count").text(); - gfn_myAlert(unreadNotiCnt); - - // 접근성 - $("#searchHeaderButton").keydown(function(){ - $('.skip-nav').show(); - $('.skip-nav a:nth-of-type(1)').focus(); - }); - $('.skip-nav a').focus(function(){ - $(this).css('z-index','1'); - }); - $('.skip-nav a:nth-of-type(4)').focusout(function(){ - $('.skip-nav').hide(); - $('.skip-nav a').css('z-index','0'); - $('.wrap header .inner .search-wrap .search-input .btn-search-detail').focus(); - }); - $(".skip-nav a").keydown(function (e) { - if (e.keyCode == 13) { - $('.skip-nav').hide(); - $('.skip-nav a').css('z-index','0'); - } - }); + gfn_myAlert(unreadNotiCnt); $('.sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover > a').focus(function(){ $('.sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover').css('opacity','1'); @@ -115,12 +95,6 @@ function fn_listPops(typeDivCd) { -

배너 섹션영역

diff --git a/src/main/webapp/WEB-INF/jsp/nlib/cmm/listNotifications.jsp b/src/main/webapp/WEB-INF/jsp/nlib/cmm/listNotifications.jsp index 96e72b95..25db2ccd 100644 --- a/src/main/webapp/WEB-INF/jsp/nlib/cmm/listNotifications.jsp +++ b/src/main/webapp/WEB-INF/jsp/nlib/cmm/listNotifications.jsp @@ -51,7 +51,7 @@ $( document ).ready(function() { fn_searchArticle(1); } }); - + //초기 자료 조회 fn_searchArticle(); @@ -86,15 +86,23 @@ $( document ).ready(function() { $('.list-accordion .answer').html(""); $qObj.next(".answer").html("

" + answerHtml + "

 

"); - + // 펼치기 $('.list-accordion .answer').stop().slideUp(300); $qObj.next('.answer').stop().slideDown(300); $('.list-accordion .question').removeClass('on'); $qObj.addClass('on'); + + // 접근성 + $('.list-accordion .question .ir').text('펼치기'); + $qObj.find('.ir').text('접기'); + $('.list-accordion .question.on').click(function (){ + $('.list-accordion .question .ir').text('펼치기'); + }); $qObj.find("span unread").remove(); + }); } @@ -151,12 +159,13 @@ $( document ).ready(function() { $("ul.list-faq li.no-result").hide(); // 출력 - $.each(jsonObj.data,function(key,obj) { + $.each(jsonObj.data,function(key,obj) { var li = $(document.createElement('li')); li.attr("articleId", obj.articleId); li.append($('').attr('class', 'question').on("click", function() { fn_viewDetail(this, obj.notiId); })); + if(!gfn_isEmpty(obj.mngOrgNm)) li.find(".question").append($('').attr("class", "type").html("[" + obj.mngOrgNm + "]")); else li.find(".question").append($('').attr("class", "type").html("[소장자료관]")); @@ -164,8 +173,10 @@ $( document ).ready(function() { if(obj.readYn != "Y") unread = " 미확인"; li.find(".question").append($('').html(obj.title + unread)); li.find(".question").append($('').attr('class', 'date').html(obj.regDd)); + li.find(".question").append($('').attr('class', 'ir').text('펼치기')); li.append($('
').attr('class', 'answer').attr('style', 'display: none;')); $( "ul.list-faq").append(li); + }); } diff --git a/src/main/webapp/WEB-INF/jsp/nlib/collection/searchItemDetail.jsp b/src/main/webapp/WEB-INF/jsp/nlib/collection/searchItemDetail.jsp index f7dd19a3..dcf556e4 100644 --- a/src/main/webapp/WEB-INF/jsp/nlib/collection/searchItemDetail.jsp +++ b/src/main/webapp/WEB-INF/jsp/nlib/collection/searchItemDetail.jsp @@ -508,12 +508,12 @@ function goList(){
diff --git a/src/main/webapp/WEB-INF/tiles/tiles-layout-detail.jsp b/src/main/webapp/WEB-INF/tiles/tiles-layout-detail.jsp index d06670ae..c8d14b33 100644 --- a/src/main/webapp/WEB-INF/tiles/tiles-layout-detail.jsp +++ b/src/main/webapp/WEB-INF/tiles/tiles-layout-detail.jsp @@ -59,6 +59,10 @@ function fn_setPageTitle(title, suffix) { + +
@@ -73,8 +77,10 @@ function fn_setPageTitle(title, suffix) {
+
- +
+
- - - \ No newline at end of file diff --git a/src/main/webapp/css/common.css b/src/main/webapp/css/common.css index 8b97b5e7..d2b8ea98 100644 --- a/src/main/webapp/css/common.css +++ b/src/main/webapp/css/common.css @@ -52,7 +52,7 @@ input:focus-visible, select:focus-visible, button:focus-visible, a:focus-visible {outline:2px solid #ebce05;} - +:focus {outline:2px solid #ebce05;} @font-face { font-family: "NanumSquareRound"; diff --git a/src/main/webapp/css/default.css b/src/main/webapp/css/default.css index 2ec6cd7b..fcfa0a2e 100644 --- a/src/main/webapp/css/default.css +++ b/src/main/webapp/css/default.css @@ -1,4 +1,3 @@ - @charset "utf-8"; /********** 헤더 **********/ @@ -84,11 +83,11 @@ transition:all .3s ease; .wrap .nav-wrap .menu .sub-menu.hide {display: none;} .wrap .nav-wrap .mobile .downarrow, .wrap .nav-wrap .mobile .sub-menu .downarrow {position: absolute;right: 0;padding-right: 5%;} -#primary-nav-button {background: transparent;display: none;border: 0px solid #aaa;position: absolute;top: 5px;left: 0;padding: 0;text-decoration: none;color: #333;text-align: center;font-weight: bold;font-size: 0;outline:0;z-index: 9;} +#primary-nav-button {background: transparent;display: none;border: 0px solid #aaa;position: absolute;top: 5px;left: 0;padding: 0;text-decoration: none;color: #333;text-align: center;font-weight: bold;font-size: 0;z-index: 9;} #primary-nav.mobile .sub-menu .downarrow:before {content: '\25be';} #primary-nav-button.mobile {display: inline-block;} .wrap .nav-wrap .Btn {display: inline-block;width:25px;height:25px;cursor: pointer;text-decoration: none;position: relative;} -.wrap .nav-wrap .Btn i {position: relative;border-radius:10px;display: inline-block;width: 25px;height: 2px;color:#707070;text-transform: uppercase;text-indent:-999999999px;background: #707070;} +.wrap .nav-wrap .Btn i {position: relative;border-radius:10px;display: inline-block;width: 25px;height: 2px;color:#333;text-transform: uppercase;text-indent:-999999999px;background: #707070;} .wrap .nav-wrap .Btn i::before, .wrap header .Btn i::after {content:'';border-radius: 10px;width: 25px;height: 2px;position: absolute;left:0;background:#707070; -webkit-transition:all .2s ease-in; -moz-transition:all .2s ease-in; @@ -173,7 +172,7 @@ section .inner p.desc {font-size: 18px;color:#666;margin-bottom:40px;} .MainSwiper .loop-count {display: inline-block;position:relative;top:50%;width:36px;height:36px;padding:2px;vertical-align: middle;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .MainSwiper .loop-count button.remote {background:none !important;position:absolute;left:0;right:0;top:0;bottom:0;width:20px;height:20px;margin:auto;border:2px solid #fff;border-radius:50%;z-index:1;background-size:34px 34px;} .MainSwiper .loop-count button.remote span {display:block;width:100%;height:100%;background:transparent url('/images/btn/btn-mainvisual-stop-white.png') no-repeat 50% 50%;} -.MainSwiper .loop-count button.remote:focus {outline:none;} +.MainSwiper .loop-count button.remote:focus {} .MainSwiper .loop-count button.remote.restart span {background-image:url('/images/btn/btn-mainvisual-play-white.png');} .MainSwiper .pagination {position:absolute;bottom:140px;left:calc(50% - -450px);} .MainSwiper .swiper-pagination-fraction {color:#fff;left:-40px;top:4px;width:auto;} @@ -234,7 +233,7 @@ transform: rotate(45deg); .sec3 .pickSwiper .loop-count {display: inline-block;position:relative;top:50%;width:36px;height:36px;padding:2px;vertical-align: middle;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .sec3 .pickSwiper .loop-count button.remote-pick {background:none !important;position:absolute;left:0;right:0;top:0;bottom:0;width:20px;height:20px;margin:auto;border:2px solid #333;border-radius:50%;z-index:1;background-size:34px 34px;} .sec3 .pickSwiper .loop-count button.remote-pick span {display:block;width:100%;height:100%;background:transparent url('/images/btn/btn-mainvisual-stop-black.png') no-repeat 50% 50%;} -.sec3 .pickSwiper .loop-count button.remote-pick:focus {outline:none;} +.sec3 .pickSwiper .loop-count button.remote-pick:focus {} .sec3 .pickSwiper .loop-count button.remote-pick.restart span {background-image:url('/images/btn/btn-mainvisual-play-black.png');} .sec3 .pickSwiper .pagination {position:absolute;bottom:0px;left:calc(50% - 0px);} .sec3 .pickSwiper .swiper-pagination-fraction {color:#333;left:-12px;top:4px;width:auto;display:none;} @@ -253,7 +252,7 @@ transform: rotate(45deg); .sec5 .inner .tabs {position: relative;overflow: hidden;width: 100%;text-align:center;} .sec5 .inner .tabs li {display: inline-block;margin:0% 4px;overflow: hidden;padding: 0;position: relative;} .sec5 .inner .tabs li:last-child {margin-right:0;} -.sec5 .inner .tabs a {background-color: #4a7ba6;border-radius:50px;font-size:14px;letter-spacing:-1px;min-width:110px;height:38px;line-height:38px;color: #fff;font-weight: 400;display: block;letter-spacing: 0;outline: none;text-decoration: none; +.sec5 .inner .tabs a {background-color: #4a7ba6;border-radius:50px;font-size:14px;letter-spacing:-1px;min-width:110px;height:38px;line-height:38px;color: #fff;font-weight: 400;display: block;letter-spacing: 0;text-decoration: none; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; @@ -281,7 +280,7 @@ transition: all 0.2s ease-in-out; .sec5 .popularSwiper .loop-count {display: inline-block;position:relative;top:50%;width:36px;height:36px;padding:2px;vertical-align: middle;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .sec5 .popularSwiper .loop-count button.remote-popular {background:none !important;position:absolute;left:0;right:0;top:0;bottom:0;width:20px;height:20px;margin:auto;border:2px solid #333;border-radius:50%;z-index:1;background-size:34px 34px;} .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:focus {} .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 .swiper-pagination-fraction {color:#333;left:-12px;top:4px;width:auto;} @@ -336,7 +335,7 @@ transition: all 0.2s ease-in-out; .sec6 .onlineSwiper .loop-count {display: inline-block;position:relative;top:50%;width:36px;height:36px;padding:2px;vertical-align: middle;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .sec6 .onlineSwiper .loop-count button.remote-online {background:none !important;position:absolute;left:0;right:0;top:0;bottom:0;width:20px;height:20px;margin:auto;border:2px solid #333;border-radius:50%;z-index:1;background-size:34px 34px;} .sec6 .onlineSwiper .loop-count button.remote-online span {display:block;width:100%;height:100%;background:transparent url('/images/btn/btn-mainvisual-stop-black.png') no-repeat 50% 50%;} -.sec6 .onlineSwiper .loop-count button.remote-online:focus {outline:none;} +.sec6 .onlineSwiper .loop-count button.remote-online:focus {} .sec6 .onlineSwiper .loop-count button.remote-online.restart span {background-image:url('/images/btn/btn-mainvisual-play-black.png');} .sec6 .onlineSwiper .pagination {position:absolute;bottom:0px;left:calc(50% - 0px);} .sec6 .onlineSwiper .swiper-pagination-fraction {color:#333;left:-12px;top:4px;width:auto;display:none;} @@ -382,12 +381,12 @@ footer .fnb li a:focus, footer .fnb li a:hover {color: #fff;} footer .copy {padding-top: 10px;color: #fff;opacity: 0.4;font-size:14px;} footer .copy a {color:#fff;} -footer .family_site{position:absolute;right:0;top:0;width:180px;} +footer .family_site{position:absolute;right:0;top:0;width:180px;text-align:left;} footer .family_site .site_name{position:relative;margin-top:7px;padding-left:20px;height:40px;line-height:40px;font-size:12px;font-weight:normal;color:#ddd;background:#2b2b2b;cursor:pointer;border-radius: 3px;} footer .family_site .site_name:after{position:absolute;right:0;top:0;width:40px;height:40px;content:"";display:block;background: url("/images/icon/icon-up-arr.png") no-repeat right top;} footer .family_site.on .site_name:after{background: url("/images/icon/icon-down-arr.png") no-repeat right top;} footer .family_site .site_depth{width:180px;position:absolute;left:0px;right:0;bottom:40px;background-color:#1b1b1b;padding:7px 0px;z-index:60;display:none;} -footer .family_site .site_depth li a{display:block;line-height:26px;padding:0 0 0 12px;font-size:14px;color:#ddd;} +footer .family_site .site_depth div a{display:block;line-height:26px;padding:0 0 0 12px;font-size:14px;color:#ddd;} /* button scroll-top */ @@ -412,18 +411,10 @@ animation: animate-btn 1.4s 0.0s ease-out infinite; -o-animation: animate-btn2 1.4s 0.5s ease-out infinite; animation: animate-btn2 1.4s 0.5s ease-out infinite; } -@-webkit-keyframes animate-btn { -0% {-webkit-transform: scale(1.0);opacity: 0.4;} -100% {-webkit-transform: scale(1.6);opacity: 0;} -} @keyframes animate-btn { 0% {transform: scale(1.0);opacity: 0.4;} 100% {transform: scale(1.6);opacity: 0;} } -@-webkit-keyframes animate-btn2 { -0% {-webkit-transform: scale(1.0);opacity: 0.4;} -100% {-webkit-transform: scale(1.7);opacity: 0;} -} @keyframes animate-btn2 { 0% {transform: scale(1.0);opacity: 0.4;} 100% {transform: scale(1.7);opacity: 0;} @@ -692,7 +683,7 @@ transform: rotate(45deg); .cart .inner .tabs {position: relative;width: 100%;text-align:left;} .cart .inner .tabs li {display: inline-block;margin:0% 0px;padding: 0;position: relative;text-align: center;} .cart .inner .tabs li:last-child {margin-right:0;} -.cart .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;min-width:110px;height:38px;line-height:34px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;outline: none;text-decoration: none;outline: 0; +.cart .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;min-width:110px;height:38px;line-height:34px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;text-decoration: none; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; @@ -856,7 +847,7 @@ transform: rotate(45deg);} .data .inner .tabs {position: relative;width: 100%;text-align:left;} .data .inner .tabs li {display: inline-block;margin:0% 0px;padding: 0;position: relative;text-align: center;} .data .inner .tabs li:last-child {margin-right:0;} -.data .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;min-width:110px;height:38px;line-height:38px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;outline: none;text-decoration: none;outline: 0; +.data .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;min-width:110px;height:38px;line-height:38px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;text-decoration: none; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; @@ -1011,7 +1002,7 @@ text-overflow: ellipsis;} .data.detail .inner .row-bottom .DetailSwiper1 .loop-count {display: inline-block;position:relative;top:50%;width:36px;height:36px;padding:2px;vertical-align: middle;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .data.detail .inner .row-bottom .DetailSwiper1 .loop-count button.remote-detail1 {background:none !important;position:absolute;left:0;right:0;top:0;bottom:0;width:20px;height:20px;margin:auto;border:2px solid #333;border-radius:50%;z-index:1;background-size:34px 34px;} .data.detail .inner .row-bottom .DetailSwiper1 .loop-count button.remote-detail1 span {display:block;width:100%;height:100%;background:transparent url('/images/btn/btn-mainvisual-stop-black.png') no-repeat 50% 50%;} -.data.detail .inner .row-bottom .DetailSwiper1 .loop-count button.remote-detail1 {outline:none;} +.data.detail .inner .row-bottom .DetailSwiper1 .loop-count button.remote-detail1 {} .data.detail .inner .row-bottom .DetailSwiper1 .loop-count button.remote-detail1.restart span {background-image:url('/images/btn/btn-mainvisual-play-black.png');} .data.detail .inner .row-bottom .DetailSwiper1 .pagination {position:absolute;bottom:0px;left:calc(50% - 0px);} .data.detail .inner .row-bottom .DetailSwiper1 .swiper-pagination-fraction {color:#333;left:-12px;top:4px;width:auto;display:none;} @@ -1068,7 +1059,7 @@ text-overflow: ellipsis;} .data.detail .inner .row-bottom .DetailSwiper2 .loop-count {display: inline-block;position:relative;top:50%;width:36px;height:36px;padding:2px;vertical-align: middle;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .data.detail .inner .row-bottom .DetailSwiper2 .loop-count button.remote-detail2 {background:none !important;position:absolute;left:0;right:0;top:0;bottom:0;width:20px;height:20px;margin:auto;border:2px solid #333;border-radius:50%;z-index:1;background-size:34px 34px;} .data.detail .inner .row-bottom .DetailSwiper2 .loop-count button.remote-detail2 span {display:block;width:100%;height:100%;background:transparent url('/images/btn/btn-mainvisual-stop-black.png') no-repeat 50% 50%;} -.data.detail .inner .row-bottom .DetailSwiper2 .loop-count button.remote-detail2 {outline:none;} +.data.detail .inner .row-bottom .DetailSwiper2 .loop-count button.remote-detail2 {} .data.detail .inner .row-bottom .DetailSwiper2 .loop-count button.remote-detail2.restart span {background-image:url('/images/btn/btn-mainvisual-play-black.png');} .data.detail .inner .row-bottom .DetailSwiper2 .pagination {position:absolute;bottom:0px;left:calc(50% - 0px);} .data.detail .inner .row-bottom .DetailSwiper2 .swiper-pagination-fraction {color:#333;left:-12px;top:4px;width:auto;display:none;} @@ -1217,7 +1208,7 @@ text-overflow: ellipsis;} /********** 관심자료 **********/ -.interested-data .inner .data-box .title {height:36px;margin:30px 0px 10px;outline:0px solid red;} +.interested-data .inner .data-box .title {height:36px;margin:30px 0px 10px;} .interested-data .inner .data-box .title .count {float:left;font-size:16px;height:36px;line-height:36px;} .interested-data .inner .data-box .title .count em {color:#d47b1c;font-weight: 500;} .interested-data .inner .data-box .title .list-search-wrap {float:right;} @@ -1279,7 +1270,7 @@ appearance: none; .loan-data .inner .tabs {position: relative;width: 100.5%;text-align:left;} .loan-data .inner .tabs li {display: inline-block;margin:0% 0px;padding: 0;position: relative;text-align: center;width:19.9%;margin-left:-3px;} .loan-data .inner .tabs li:last-child {margin-right:0;} -.loan-data .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;width:100%;min-width:110px;height:38px;line-height:38px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;outline: none;text-decoration: none;outline: 0; +.loan-data .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;width:100%;min-width:110px;height:38px;line-height:38px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;text-decoration: none; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; @@ -1319,7 +1310,7 @@ transform: rotate(45deg);} /********** 방문열람관리 **********/ .visit-data .inner {margin-bottom:50px;} .visit-data .inner .visit-box {display:inline-block;width:100%;} -.visit-data .inner .visit-box .title {height:36px;margin:30px 0px 10px;outline:0px solid red;} +.visit-data .inner .visit-box .title {height:36px;margin:30px 0px 10px;} .visit-data .inner .visit-box .title .count {float:left;font-size:16px;height:36px;line-height:36px;} .visit-data .inner .visit-box .title .count em {color:#d47b1c;font-weight: 500;} .visit-data .inner .visit-box .title .list-search-wrap {float:right;} @@ -1329,7 +1320,7 @@ transform: rotate(45deg);} .visit-data .inner .tabs {position: relative;width: 100.5%;text-align:left;} .visit-data .inner .tabs li {display: inline-block;margin:0% 0px;padding: 0;position: relative;text-align: center;width:24.9%;margin-left:-3px;} .visit-data .inner .tabs li:last-child {margin-right:0;} -.visit-data .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;width:100%;min-width:110px;height:38px;line-height:38px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;outline: none;text-decoration: none;outline: 0; +.visit-data .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;width:100%;min-width:110px;height:38px;line-height:38px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;text-decoration: none; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; @@ -1379,7 +1370,7 @@ transform: rotate(45deg);} /* 알림페이지 아코디언 목록 */ .noti-data .inner {margin-bottom:50px;} .noti-data .inner .noti-box {display:inline-block;width:100%;} -.noti-data .inner .noti-box .title {height:36px;margin:30px 0px 10px;outline:0px solid red;} +.noti-data .inner .noti-box .title {height:36px;margin:30px 0px 10px;} .noti-data .inner .noti-box .title .count {float:left;font-size:16px;height:36px;line-height:36px;} .noti-data .inner .noti-box .title .count em {color:#d47b1c;font-weight: 500;} .noti-data .inner .noti-box .title .text {float:right;} @@ -1529,7 +1520,7 @@ transform: rotate(45deg);} .qna-write-table .wt-mail label span.mail-an {font-weight:500;font-size:14px;color:#666;margin-right:5px;} /* faq */ -.faq .title {height:36px;margin:30px 0px 10px;outline:0px solid red;} +.faq .title {height:36px;margin:30px 0px 10px;} .faq .title select {float:left;height:39px;line-height: 39px;border:1px solid #ddd;border-radius: 3px;min-width:120px;padding:0px 10px;} .faq .title .total-count .count {float:left;font-size:16px;height:36px;line-height:36px;} .faq .title .total-count .count em {color:#d47b1c;font-weight: 500;} @@ -1545,7 +1536,7 @@ transform: rotate(45deg);} .faq .inner .tabs {position: relative;width: 100.5%;text-align:left;} .faq .inner .tabs li {display: inline-block;margin:0% 0px;padding: 0;position: relative;text-align: center;width:19.9%;margin-left:-3px;} .faq .inner .tabs li:last-child {margin-right:0;} -.faq .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;width:100%;min-width:110px;height:38px;line-height:38px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;outline: none;text-decoration: none;outline: 0; +.faq .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;width:100%;min-width:110px;height:38px;line-height:38px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;text-decoration: none; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; @@ -1564,7 +1555,7 @@ transform: rotate(45deg);} /* 아코디언 목록 */ .faq .inner {margin-bottom:50px;} .faq .inner .noti-box {display:inline-block;width: 100%;} -.faq .inner .noti-box .title {height:36px;margin:30px 0px 10px;outline:0px solid red;} +.faq .inner .noti-box .title {height:36px;margin:30px 0px 10px;} .faq .inner .noti-box .title .count {float:left;font-size:16px;height:36px;line-height:36px;} .faq .inner .noti-box .title .count em {color:#d47b1c;font-weight: 500;} .faq .inner .noti-box .title .text {float:right;} @@ -1588,7 +1579,7 @@ transform: rotate(45deg);} .faq .list-accordion .answer p img {width:100% !important;height:auto !important;} /* qna */ -.qna .title {height:36px;margin:30px 0px 10px;outline:0px solid red;} +.qna .title {height:36px;margin:30px 0px 10px;} .qna .title select {float:left;height:39px;line-height: 39px;border:1px solid #ddd;border-radius: 3px;min-width:120px;padding:0px 10px;} .qna .title .total-count .count {float:left;font-size:16px;height:36px;line-height:36px;} .qna .title .total-count .count em {color:#d47b1c;font-weight: 500;} @@ -1605,7 +1596,7 @@ transform: rotate(45deg);} .qna .inner .tabs {position: relative;width: 100.5%;text-align:left;} .qna .inner .tabs li {display: inline-block;margin:0% 0px;padding: 0;position: relative;text-align: center;width:49.6%;margin-left:-3px;} .qna .inner .tabs li:last-child {margin-right:0;} -.qna .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;width:100%;min-width:110px;height:38px;line-height:38px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;outline: none;text-decoration: none;outline: 0; +.qna .inner .tabs a {background-color: #fff;border:1px solid #ddd;border-radius:3px;font-size:14px;letter-spacing:-1px;width:100%;min-width:110px;height:38px;line-height:38px;color: #444;font-weight: 400;display: inline-block;letter-spacing: 0;text-decoration: none; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; @@ -1705,7 +1696,7 @@ transform: rotate(45deg); .pop-sharing .sns-list .nblog-icon img {background:#2db400;} .pop-sharing .sns-list .fb-icon img {background:#3a5daa;} .pop-sharing .sns-list .tw-icon img {background:#1d9bf0;} -.pop-sharing .sns-list button p {padding-top:5px;font-size:12px;color:#fff;} +.pop-sharing .sns-list button span {display:block;padding-top:5px;font-size:12px;color:#fff;} .pop-sharing .link-copy {text-align: center;padding:20px 0px 40px;} .pop-sharing .link-copy .link-txt {border: 1px solid #ddd;height: 32px;line-height: 32px;width: 205px;border-radius: 3px;padding: 0 10px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;display: inline-block;margin-right: 5px;font-weight: 400;} .pop-sharing .link-copy .btn {width: 90px;height: 34px;color: #fff;background:#666;line-height: 32px;font-weight: 400;display: inline-block;margin-top: -27px;margin-right: 0;} @@ -1722,7 +1713,7 @@ transform: rotate(45deg); /* 서지정보 팝업 */ -.pop-serge {position:fixed;top:5%;left:calc(50% - 435px);width: 870px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:999;} +.pop-serge {position:fixed;top:5%;left:calc(50% - 435px);width: 870px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:9999;} .pop-serge .inner {display:inline-block;width:90%;height:auto;overflow:auto;padding:2% 5%;background: #f2f4f7;} .pop-serge .inner .row {padding:0px 0px 0px;text-align:center;text-align: left;} .pop-serge .Title {text-align:center;padding:20px 0px;background: url(/images/bg/bg-login.jpg) no-repeat;background-size:cover;} @@ -1743,8 +1734,8 @@ transform: rotate(45deg); /* 로그인 팝업 */ -.pop-login {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:999;} -.pop-login .inner {background:#fff;display:inilne-block;width:100%;height: calc(100% - 270px);overflow:auto;padding:60px 0px;} +.pop-login {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:9999;} +.pop-login .inner {background:#fff;display:inline-block;width:100%;height: calc(100% - 270px);overflow:auto;padding:60px 0px;} .pop-login .inner .row {padding:45px 60px 0px;text-align:center;} .pop-login .Title {background: url(/images/bg/bg-login.jpg) no-repeat;background-size:cover;text-align:center;padding:45px 0px;} .pop-login .Title h3 {font-size:36px;line-height:36px;margin-top:15px;color:#fff;font-weight: 500;} @@ -1769,8 +1760,8 @@ transform: rotate(45deg); /* 로그인 연결 팝업 */ -.pop-login-connect {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:999;} -.pop-login-connect .inner {background:#fff;display:inilne-block;width:100%;height: calc(100% - 270px);overflow:auto;padding:50px 0px;} +.pop-login-connect {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:9999;} +.pop-login-connect .inner {background:#fff;display:inline-block;width:100%;height: calc(100% - 270px);overflow:auto;padding:50px 0px;} .pop-login-connect .inner .row {padding:0px 60px 0px;text-align:center;} .pop-login-connect .Title {background: url(/images/bg/bg-login.jpg) no-repeat;background-size:cover;text-align:center;padding:30px 0px;} .pop-login-connect .Title h3 {font-size:24px;line-height:30px;margin-top:15px;color:#fff;font-weight: 300;} @@ -1792,8 +1783,8 @@ transform: rotate(45deg); /* 로그인 패스워드 팝업 */ -.pop-login-password {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:999;} -.pop-login-password .inner {background:#fff;display:inilne-block;width:100%;height: calc(100% - 218px);overflow:auto;padding:50px 0px;} +.pop-login-password {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:9999;} +.pop-login-password .inner {background:#fff;display:inline-block;width:100%;height: calc(100% - 218px);overflow:auto;padding:50px 0px;} .pop-login-password .inner .row {padding:0px 60px 0px;text-align:center;} .pop-login-password .Title {background: url(/images/bg/bg-login.jpg) no-repeat;background-size:cover;text-align:center;padding:30px 0px;} .pop-login-password .Title h3 {font-size:24px;line-height:30px;margin-top:15px;color:#fff;font-weight: 300;} @@ -1817,7 +1808,7 @@ transform: rotate(45deg); /* 알림 팝업 */ -.pop-notice {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: 400px;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:999;} +.pop-notice {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: 400px;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:9999;} .pop-notice .inner {display:inline-block;width:100%;height: calc(100% - 156px);overflow:auto;padding:50px 0px;background: #fff;} .pop-notice .inner .row {padding:0px 60px 0px;text-align:center;} .pop-notice .Title {text-align:center;padding:30px 0px;background: url(/images/bg/bg-login.jpg) no-repeat;background-size:cover;} @@ -1833,7 +1824,7 @@ transform: rotate(45deg); /* 반려사유 팝업 */ -.pop-return {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:999;} +.pop-return {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:9999;} .pop-return .inner {display:inline-block;width:100%;height: calc(100% - 270px);overflow:auto;padding:50px 0px;background: #fff;} .pop-return .inner .row {padding:0px 30px 0px;text-align:center;} .pop-return .Title {text-align:center;padding:30px 0px;background: url(/images/bg/bg-login.jpg) no-repeat;background-size:cover;} @@ -1848,7 +1839,7 @@ transform: rotate(45deg); /* 패스워드 변경 팝업 */ -.pop-change {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:999;} +.pop-change {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:9999;} .pop-change .inner {display:inline-block;width:100%;height: calc(100% - 270px);overflow:auto;padding:50px 0px;background: #fff;} .pop-change .inner .row {padding:0px 60px 0px;text-align:center;} .pop-change .Title {text-align:center;padding:30px 0px;background: url(/images/bg/bg-login.jpg) no-repeat;background-size:cover;} @@ -1870,7 +1861,7 @@ transform: rotate(45deg); /* 패스워드 찾기 팝업 */ -.pop-find {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:999;} +.pop-find {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:9999;} .pop-find .inner {display:inline-block;width:100%;height: calc(100% - 270px);overflow:auto;padding:50px 0px;background: #fff;} .pop-find .inner .row {padding:0px 60px 0px;text-align:center;} .pop-find .Title {text-align:center;padding:30px 0px;background: url(/images/bg/bg-login.jpg) no-repeat;background-size:cover;} @@ -1879,6 +1870,7 @@ transform: rotate(45deg); .pop-find .inner .Text p {color:#666;font-size:14px;margin-bottom:30px;} .pop-find .inner .Text p span {color:#d47b1c;font-weight: 500;} .pop-find .inner .find p {margin-bottom:5px;} +.pop-find .inner .find p label {opacity:0;position:absolute;} .pop-find .inner .find p input {border:1px solid #ddd;width:90%;padding:0px 5%;height:36px;line-height:36px;border-radius: 3px;} .pop-find .inner .find p.text {font-size:12px;text-align: left;margin:10px 0px 30px;color:#2e899c;font-weight: 400;} .pop-find .inner .btn {width:70%;padding:20px 15% 40px;line-height: normal} @@ -1891,7 +1883,7 @@ transform: rotate(45deg); /* 회원 팝업 */ -.pop-member {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:999;} +.pop-member {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: auto;border-radius: 5px;overflow: hidden;padding: 0 0px;z-index:9999;} .pop-member .inner {display:inline-block;width:100%;height: calc(100% - 50px);overflow:auto;padding:40px 0px 20px;background: url(/images/bg/bg-member-pop.jpg) no-repeat;background-size:cover;} .pop-member .inner .row {margin:0px 50px 0px;} .pop-member .Title {text-align:center;padding:0px 0px 30px;text-align: center;} @@ -1989,7 +1981,7 @@ animation: animate-bg2 2.0s 1.9s ease-in infinite; .conditions-wrap .selected-conditions:after {content: "";display: block;clear: both;position: relative;} .conditions-wrap .selected-conditions .title {width: 100%;color: #333;padding-top: 6px;position: relative;} .conditions-wrap .selected-conditions .title p {float: left;margin-right: 10px;font-weight: 300;color:#fff;background: #b68948;padding:5px 15px;font-size:14px;border-radius:50px;} -.conditions-wrap .selected-conditions .title button {width: 76px;height: 20px;overflow: hidden;border: 1px solid #ddd;border-radius: 2px;background:#f4f4f4 url(/images/btn/btn-refresh.png) no-repeat center right;position: absolute;right:10px;top:10px;border:0;outline:0;background-color: transparent;} +.conditions-wrap .selected-conditions .title button {width: 76px;height: 20px;overflow: hidden;border: 1px solid #ddd;border-radius: 2px;background:#f4f4f4 url(/images/btn/btn-refresh.png) no-repeat center right;position: absolute;right:10px;top:10px;border:0;background-color: transparent;} .conditions-wrap .selected-conditions .conditions {float: left;width: calc(100% - 120px);} .conditions-wrap .selected-conditions .conditions li {display: inline-block;margin-right: 6px;overflow: hidden;} .conditions-wrap .selected-conditions .conditions li button {background: #f4f4f4;height: 30px;padding: 0 35px 0px 15px;font: 12px 'dotum','돋움', sans-serif;color: #666;border: 1px solid #ddd;border-radius: 16px;position:relative;} @@ -2064,7 +2056,7 @@ animation: animate-bg2 2.0s 1.9s ease-in infinite; /* check style */ .chk {position: relative;} -.chk input[type="checkbox"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip:rect(0,0,0,0);border: 0 } +.chk input[type="checkbox"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;border: 0 } .chk input[type="checkbox"] + label { display: inline-block;position: relative;padding-left: 30px;cursor: pointer;line-height: 22px;} .chk input[type="checkbox"] + label:before {content: "";position: absolute;left: 0;top: 0;width: 20px;height: 20px;border: 1px solid #ddd;border-radius : 2px;} .chk input[type="checkbox"]:focus + label, @@ -2083,7 +2075,7 @@ animation: animate-bg2 2.0s 1.9s ease-in infinite; .chk input[type="checkbox"]:checked + label:before {background-size: 10px;border-color: #2781c1;} .check {position: relative;} -.check input[type="checkbox"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip:rect(0,0,0,0);border: 0 } +.check input[type="checkbox"] {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;border: 0 } .check input[type="checkbox"] + label { display: inline-block;position: relative;padding-left: 30px;cursor: pointer;line-height: 22px;} .check input[type="checkbox"] + label:before {content: "";position: absolute;left: 0;top: 0;width: 20px;height: 20px;border: 1px solid #ddd;border-radius : 2px;} .check input[type="checkbox"]:focus + label, @@ -2126,3 +2118,9 @@ animation: animate-bg2 2.0s 1.9s ease-in infinite; .loop-count .remote.remote-main {display:inline-block !important;} .scrollhidden {overflow:hidden;height:100%;position:fixed;} + +/* skipNavi */ +#skipNavi{position:relative;left:0;top:0;width:100%;z-index:99999;} +#skipNavi a{overflow:hidden;display:block;width:1px;height:1px;margin-bottom:-1px;color:#0068b0;font-size:16px;text-align:center;text-decoration:none} +#skipNavi a:active, +#skipNavi a:focus{width:100%;height: auto;padding:5px 0;background-color:#ddd} diff --git a/src/main/webapp/css/media.css b/src/main/webapp/css/media.css index 3eaf156f..9134102f 100644 --- a/src/main/webapp/css/media.css +++ b/src/main/webapp/css/media.css @@ -152,7 +152,7 @@ footer .family_site {right:10px;} .data.detail .inner .row-top .center {width:100%;} .data.detail .inner .row-bottom .con-4 .top h3 {width:100%;} .data.detail .inner .row-bottom .con-4 .top h3::before {content: '';width:100%;} -.data.detail .inner .row-bottom .DetailSwiper2 {max-width:auto;padding:1% 10% 4%;width:80%;} +.data.detail .inner .row-bottom .DetailSwiper2 {max-width:initial;padding:1% 10% 4%;width:80%;} .data.detail .inner .row-top .center .right .con-2 .de-data ul li {width:100%;} .faq .inner .tab {position: relative;width:100%;margin:0 auto;} .article-side {width:22%;margin-right:2%;} diff --git a/src/main/webapp/js/default.js b/src/main/webapp/js/default.js index b6b30263..f17edcc0 100644 --- a/src/main/webapp/js/default.js +++ b/src/main/webapp/js/default.js @@ -49,7 +49,15 @@ $(document).ready(function(){ /* 푸터 관련사이트 */ $(".family_site").click(function(){ $(this).toggleClass("on"); - $(this) .find(".site_depth").slideToggle("fast"); + $(this).find(".site_depth").slideToggle("fast"); + }); + $(".footer-logo h2 a").focus(function(){ + $('.family_site').toggleClass("on"); + $('.family_site').find(".site_depth").slideToggle("fast"); + }); + $(".family_site .site_depth > div:nth-of-type(8) a").focusout(function(){ + $('.family_site').removeClass("on"); + $('.family_site').find(".site_depth").hide(); }); /* 로그인 팝업 */ @@ -182,6 +190,7 @@ $(document).ready(function(){ $('.down-btn .ir').text('펼치기'); } }); + // 공유하기 팝업 $('.share').click(function(){ @@ -519,6 +528,21 @@ $(document).ready(function(){ } }); + // 패스워드 확인 페이지 접근성 + $('.passwd .row-bottom .myinfo-passwd .box p input').focus(); + $(".myinfo-passwd .btn-box a").click(function (e) { + $('.passwd .row-bottom .myinfo-passwd .box p input').focus(); + }); + $(".myinfo-passwd .btn-box a").keydown(function (e) { + if (e.keyCode == 13) { + $('.passwd .row-bottom .myinfo-passwd .box p input').focus(); + } + }); + + $('.myinfo .contents .concern-data .list-box .list .text .ti a').attr('title','새 창 알림'); + $('.data .inner .tabs_item .list-cart-wrap .list-data div.list .btnbox button').attr('title','새 창 알림'); + $('.sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover .btn-box .view a').attr('title','새 창 알림'); + //메인 슬라이드 접근성 $('.MainSwiper .loop-count button.remote span').append('일시정지'); $('.MainSwiper .loop-count button.remote').click(function(){