한선우
2022-02-16
@59
등록폼 디자인 수정
Index: base3.10/src/main/webapp/css/user/common.css
===================================================================
--- base3.10/src/main/webapp/css/user/common.css (revision 58)
+++ base3.10/src/main/webapp/css/user/common.css (revision 59)
@@ -44,11 +44,11 @@
.main_container .header:hover .total_search:hover { background:#333; color:#fff; }
/*main top slide*/
-.main_slide { width:100%; height:100vh; }
+.main_slide { width:100%; height:100vh; opacity:1; }
.main_slide .swiper-slide { width:100%; height:100vh; color:#fff; position:relative; }
.main_slide .swiper-slide .inner { position:relative; z-index:1; }
.main_slide .swiper-slide .bg_box { position:absolute; top:0; left:0; width:100%; height:100%; background-position:50% 50%; background-repeat:no-repeat; background-size:cover; z-index:0; }
-.main_slide .swiper-pagination { bottom:5em; animation: fadeup 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) both; animation-delay:1.2s; }
+.main_slide .swiper-pagination { bottom:5em; animation: textDown 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) both; animation-delay:1s; }
.main_slide .swiper-pagination span { background: #fff; opacity:0.5; border:1px solid #333; width:10px; height:10px; }
.main_slide .swiper-pagination .swiper-pagination-bullet-active { width:80px; border-radius:50px; opacity:1;}
.main_slide .inner { height:100%; display: flex; flex-direction:column; align-items:center; justify-content:center; }
@@ -57,17 +57,17 @@
.main_slide .swiper-slide p {display:block; text-align:center; font-size:1.3em; line-height:1.8em; margin-bottom:40px; }
.main_slide .swiper-slide button { padding:13px 40px; border-radius:50px; font-weight:600;transition:background 0.3s !important; }
.main_slide .swiper-slide button:hover { background:#1524cc; color:#fff; }
-.main_slide .swiper-slide-active em { animation:textshow 1.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) both; }
-.main_slide .swiper-slide-active strong {animation:textup 1s ease-in-out both; animation-delay: .3s;}
-.main_slide .swiper-slide-active p {animation:textup 1s ease-in-out both;animation-delay: .6s;}
-.main_slide .swiper-slide-active button { animation:textup 1s ease-in-out both; animation-delay: .9s; }
+.main_slide .swiper-slide-active em { animation:textshow 1s cubic-bezier(0.215, 0.610, 0.355, 1.000) both; }
+.main_slide .swiper-slide-active strong {animation:textDown 0.5s ease-in-out both; animation-delay: .2s;}
+.main_slide .swiper-slide-active p {animation:textDown 0.5s ease-in-out both;animation-delay: .4s;}
+.main_slide .swiper-slide-active button { animation:textDown 0.5s ease-in-out both; animation-delay: .6s; }
.main_slide .slide_wrap { width:100%; height:100%; }
.main_slide .swiper-wrapper { width:100%; height:100%; }
.main_slide .swiper-slide { width:100%; height:100%; }
.swiper-button-prev, .swiper-button-next { color:#fff; }
-@-webkit-keyframes textup {
- 0% { opacity:0; } 100% { opacity:1; }
+@-webkit-keyframes textDown {
+ 0% { opacity:0; transform:translateY(-50%); } 100% { opacity:1; transform:translateY(0%); }
}
@keyframes textshow {
@@ -78,16 +78,21 @@
/*main content*/
.main_content { position:relative; z-index:9; }
+.main_content .inner { position:relative; z-index:9; }
.main_content > .bg_box { position:absolute; bottom:0; background-size:contain; width:100%; height:50%; z-index:-1; }
.main_content h2 { font-size:2em; text-transform:capitalize; font-weight:900; line-height:1.6em; letter-spacing:-1px; }
.main_wrap { margin-top:0; }
.main_content .title_wrap { display: flex; align-items: center; justify-content: space-between; margin-bottom:40px; }
-.main_content .title_wrap .showmore { color:#1524cc; font-weight:900; border:none; padding:0; font-size:1.1em; display: flex; align-items: center; background:none; }
+.main_content .title_wrap .showmore { color:#1524cc; font-weight:900; border:none; padding:0; font-size:1.1em; display: flex; align-items: center; background:none; opacity:0; animation:fadeOut 0.5s both;}
.main_content .title_wrap .showmore span { margin-left:5px; margin-top:5px; font-size:0.7em; display:inline-block; transition:all 0.3s;}
.main_content .title_wrap .showmore:hover span { transform:translateX(10px); }
+.title_wrap h2 { animation:fadeOut .5s both;}
+.title_wrap.active h2 { animation:zoomIn 1s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; }
+.title_wrap.active .showmore { animation:zoomIn 1s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; animation-delay:0.2s; }
+
/*article*/
-.article_list ul { width:calc(100% + 80px); display: flex; flex-wrap:wrap; margin:0 -40px; }
+.article_list ul { width:calc(100% + 80px); display: flex; flex-wrap:wrap; margin:-40px -40px 0; }
.article_list ul li { width:calc(33.333% - 80px); margin:40px; }
.article_list ul li .bg_box { width:100%; height:0; padding-bottom:60%; margin-bottom:30px; border-radius:15px; display:block; transition:box-shadow 0.5s, transform 0.5s;}
.article_list ul li .bg_box:hover { box-shadow:0 0 30px 0 rgba(34,86,203,0.5); transform:scale(1.01); }
@@ -101,29 +106,50 @@
a.writer { padding:0 4px; line-height:1.5em; color:#000; position:relative; border:1px solid #333; border-radius:4px; font-size:0.9em; margin-right:5px; transition:all 0.3s; }
a.writer:hover { background:#052c9b; color:#fff; border:1px solid #052c9b; }
+.main_wrap ul li { animation:fadeOut .5s both; }
+.main_wrap.active li { animation:zoomIn 1s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; }
+.main_wrap.active li:nth-child(1) { animation-delay:0.1s; }
+.main_wrap.active li:nth-child(2) { animation-delay:0.2s; }
+.main_wrap.active li:nth-child(3) { animation-delay:0.3s; }
+
/* hot click */
.hotClick { background:#fff; z-index:9; width:100%; position:relative; padding:40px; box-shadow:0 0 40px 0 rgba(1,7,144,0.2); border-radius:15px; }
.hotClick .title_wrap { margin-bottom:20px; }
-.hotClick .title_wrap h2 { animation:fadeup 1s cubic-bezier(0.215, 0.610, 0.355, 1.000) both; animation-delay:1.2s;}
+.hotClick .title_wrap h2 { }
.hotClick ol { display:flex; flex-wrap:wrap; margin:-3px; }
-.hotClick ol li { margin:3px; }
-.hotClick ol li a { padding:7px 16px; font-weight:600; font-size:1em; border:2px solid #0916b2; border-radius:50px; color:#0916b2; transition:all 0.3s; display: inline-block;box-shadow:0 0 10px 0 rgba(9,22,178,0.2); }
+.hotClick ol li { margin:3px; opacity:0; transform:translateY(50%); transition:all 0.5s; animation:fadeOut .5s both; }
+.hotClick ol li a { padding:7px 16px; font-weight:600; font-size:1em; border:2px solid #0916b2; border-radius:50px; color:#0916b2; background:#fff; transition:all 0.3s; display:inline-block; box-shadow:0 0 10px 0 rgba(9,22,178,0.2); }
.hotClick ol li a:hover { background:#0916b2; color:#fff; box-shadow:0 0 15px 0 rgba(9,22,178,0.5); }
.hotClick ol li a::before { content:'#'; }
+.hotClick.active ol li { animation:zoomUp 1s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; }
+.hotClick.active ol li:nth-child(1) { animation-delay:0.1s; }
+.hotClick.active ol li:nth-child(2) { animation-delay:0.2s; }
+.hotClick.active ol li:nth-child(3) { animation-delay:0.3s; }
+.hotClick.active ol li:nth-child(4) { animation-delay:0.4s; }
+.hotClick.active ol li:nth-child(5) { animation-delay:0.5s; }
+.hotClick.active ol li:nth-child(6) { animation-delay:0.6s; }
+.hotClick.active ol li:nth-child(7) { animation-delay:0.7s; }
+.hotClick.active ol li:nth-child(8) { animation-delay:0.8s; }
+.hotClick.active ol li:nth-child(9) { animation-delay:0.9s; }
+.hotClick.active ol li:nth-child(10) { animation-delay:1s; }
/* banner */
.banner.main_wrap { }
.banner ul { display: flex; justify-content: space-between; }
.banner ul li { width:calc(50% - 30px); }
-.banner ul li a { width:100%; color:#fff; font-size:1.8em; line-height:1.4em; font-weight:600; display:block; border-radius:15px; position:relative;}
+.banner ul li a { width:100%; color:#fff; font-size:1.8em; line-height:1.4em; font-weight:600; display:block; border-radius:15px; position:relative; animation:fadeOut .5s both;}
.banner ul li a .bg_box { padding:1.5em; height:170px; border-radius:15px; }
-.banner ul li a > img { position:absolute; right:1em; z-index:3; }
+.banner ul li a > img { position:absolute; right:1em; z-index:3; animation:fadeOut .5s both; }
.banner ul li:nth-child(1) img { bottom:-1em; }
.banner ul li:nth-child(2) img { bottom:-1em; }
+.banner ul li:nth-child(2) .title_wrap.active h2 { animation-delay:0.2s; }
+.banner.active li a { animation:zoomIn 1s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; }
+.banner.active li:nth-child(2) a { animation-delay:0.1s; }
+.banner.active li a > img { animation:zoomIn 1s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; animation-delay:0.3s; }
/* news */
-.notice.main_wrap { margin-bottom:120px; }
-.news_slide { width:100%; padding-bottom:150px; }
+.notice.main_wrap { margin-bottom:120px;}
+.news_slide { width:100%; padding-bottom:150px; animation:fadeOut .5s both; }
.news_slide .swiper-slide { width:calc(25% - 30px); }
.news_slide .swiper-slide a { width:100%; display:block; font-weight:600; font-size:1.2em; line-height: 1.6em; margin-bottom:30px; }
.news_slide .swiper-slide em { color:#727272; }
@@ -133,6 +159,9 @@
.news_slide .swiper-button-next { }
.news_slide .swiper-pagination-progressbar { top:auto; bottom:80px; height:2px; background:#ddd; width:1400px; }
.news_slide .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background:#333; }
+.notice.active .news_slide { animation:fadeLeft 1.5s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; }
+
+.bg_wave { opacity:0; pointer-events:none; z-index:0; }
/* footer */
.footer { width:100%; padding:50px 0; background:#fafafa; }
@@ -172,7 +201,6 @@
.sns .youtube:hover { background-position:60% 0%; }
.sns .rss:hover { background-position:80% 0%; }
-
.share button { width:30px; height:30px; border:none; transition:transform 0.3s; margin-left:10px; }
.share button:hover { transform:scale(1.1);}
.share .btn_print { background-image:url(/images/user/icon_print.svg); background-position:50% 100%; background-repeat:no-repeat; background-size:60px 60px; }
@@ -183,12 +211,11 @@
.share .facebook { background-position:20% 100%; }
.share .facebook:hover { background-position:20% 0%; }
-
/*******************************************************************************************************************************************/
/*************************************************************** subpage ***************************************************************/
/*******************************************************************************************************************************************/
-.sub_container { margin-bottom:100px; }
+.sub_container { margin-bottom:100px; background:rgba(255,255,255,1); }
.sub_title_top { display:flex; justify-content: space-between; padding:20px 0; }
/* breadcrumb */
@@ -232,10 +259,11 @@
.sub_title.gray_type .title strong { padding:5px 15px; border:1px solid #333; border-radius:50px; display:inline-block; font-weight:900; font-size:1.2em; margin-top:10px; }
/*게시판 하단*/
-.bottom_wrap { display:flex; padding-top:50px; }
+.bottom_wrap { display:flex; padding-top:50px; position:relative; }
.bottom_wrap.center { justify-content: center; }
.bottom_wrap.between { justify-content:space-between; }
.bottom_wrap.right { justify-content:flex-end; }
+.bottom_wrap button { margin:2px; }
/*article detail view*/
.article_header { text-align:center; }
@@ -255,28 +283,58 @@
.writer_info button { margin-top:20px; }
/*기사내용*/
-.article_content { width:calc(100% - 300px); font-size:1.2em; line-height:2em; }
+.article_content { width:calc(100% - 300px); font-size:1.2em; line-height:2em; opacity:0; transform:translateY(100px); transition:all 0.5s; transition-delay:0.2s; }
.article_content .share { margin-top:50px; }
.article_content figcaption { font-size:0.8em; line-height:1.6em; }
-.related { background:#222; margin:70px 0 -100px; padding:100px 0; position:relative; text-align:center; }
-.related h2 { color:#fff; margin-bottom:50px; font-size:2em; font-weight:900; text-align:left; }
+.article_view .writer_info { opacity:0; transform:translateY(100px); transition:all 0.5s; }
+.article_view.active .article_content { opacity:1; transform:translateY(0px); }
+.article_view.active .writer_info { opacity:1; transform:translateY(0px); }
+
+.related { background:#222; margin:70px 0 -100px; padding:100px 0; position:relative; text-align:center; opacity:0; }
+.related h2 { color:#fff; margin-bottom:50px; font-size:2em; font-weight:900; text-align:left; transform: translateY(100px); opacity:0; transition:all 0.5s; }
.related ul { width:calc(100% + 80px); display: flex; flex-wrap:wrap; margin:-40px; text-align:left; }
-.related ul li { width:calc(25% - 80px); margin:40px; }
+.related ul li { width:calc(25% - 80px); margin:40px;transform: translateY(50%); opacity:0; transition:all 0.5s; }
.related ul li .bg_box { width:100%; height:0; padding-bottom:60%; margin-bottom:30px; border-radius:15px; display:block; transition:box-shadow 0.5s;}
.related ul li .bg_box:hover { box-shadow:0 0 30px 0 rgba(0,0,0,0.8); }
.related ul li .category { color:#ff6a30; font-weight:900; margin:0 0 10px; display: block; }
.related ul li .title { width:100%; display:block; color:#fff; font-size:1.2em; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.related ul li.on { opacity:0.3 ;}
-.related .btn_list { position:absolute; top:-40px; text-transform:uppercase; width:80px; height:80px; border:1px solid #222; border-radius:100px; box-shadow:5px 5px 10px 0 rgba(0,0,0,0.6); transition:all 0.3s; font-weight:900;}
+.related .btn_list { position:absolute; top:40px; text-transform:uppercase; width:80px; height:80px; border:1px solid #222; border-radius:100px; box-shadow:5px 5px 10px 0 rgba(0,0,0,0.6); transition:all 0.5s; font-weight:900;opacity:0; }
.related .btn_list:hover { box-shadow:0 0 20px 0 rgba(0,0,0,0.8); }
+.related.active { opacity:1; }
+.related.active h2 { opacity:1;transform:translateY(0); }
+.related.active .btn_list { opacity:1; top:-40px; }
+.related.active ul li { opacity:1;transform:translateY(0); }
+.related.active ul li:nth-child(2) { transition-delay:0.2s; }
+.related.active ul li:nth-child(2) { transition-delay:0.3s; }
+.related.active ul li:nth-child(3) { transition-delay:0.4s; }
+.related.active ul li:nth-child(4) { transition-delay:0.5s; }
+
.article_wrap { padding:40px 0; display:inline-block; }
.article_wrap:last-child { margin-bottom:0; }
-.article_wrap .title_wrap { position:relative; margin-bottom:0;}
+.article_list .article_wrap ul { margin:20px -40px 0; }
+.article_wrap .title_wrap { position:relative; margin-bottom:0; display:block; animation:fadeOut 1s both;}
+.article_wrap .title_wrap li { animation:fadeOut 1s both; }
.article_wrap .title_wrap .title { padding-right:20px; background:#fff; position:relative; z-index:1; display:inline-block;}
.article_wrap .title_wrap .category { font-size:2em; font-weight:900; display:inline-block; color:#0032c3; padding-bottom:2px;}
.article_wrap .title_wrap::after { width:100%; height:1px; background:#ddd; content:''; display:block; position:absolute; top:13px; left:0; z-index:0; }
+.article_wrap li { animation:fadeOut .5s both; }
+.article_wrap.active .title_wrap { animation:fadeLeft 1s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; }
+.article_wrap.active li { animation:zoomIn 1s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; }
+.article_wrap.active li:nth-child(1) { animation-delay:0.1s; }
+.article_wrap.active li:nth-child(2) { animation-delay:0.2s; }
+.article_wrap.active li:nth-child(3) { animation-delay:0.3s; }
+.article_wrap.active li:nth-child(4) { animation-delay:0.4s; }
+.article_wrap.active li:nth-child(5) { animation-delay:0.5s; }
+.article_wrap.active li:nth-child(6) { animation-delay:0.6s; }
+.article_wrap.active li:nth-child(7) { animation-delay:0.7s; }
+.article_wrap.active li:nth-child(8) { animation-delay:0.8s; }
+.article_wrap.active li:nth-child(9) { animation-delay:0.9s; }
+.article_wrap.active li:nth-child(10) { animation-delay:1s; }
+.article_wrap.active li:nth-child(11) { animation-delay:1.1s; }
+.article_wrap.active li:nth-child(12) { animation-delay:1.2s; }
.move { width:100%; height:60px; display:flex; align-items:center; justify-content:center; margin-bottom:50px;}
.move .swiper-wrapper { display:flex; width:1400px; }
@@ -298,17 +356,12 @@
.fixed-menu { margin-top:-30px; }
.fixed-menu.fix .article_list { padding-top:110px; }
-
-
-
-
/*add dot*/
.dot li::after, .dot > div::after { width:3px; height:3px; border-radius:3px; display:inline-block; content:''; background:#666; margin:0 15px 5px; }
.dot li:last-child::after, .dot > div:last-child::after { display:none; }
/*tab*/
.wrap-tab-container { width:100%; }
-
.wrap-tab-list { display:flex; justify-content:center; align-items:center; margin-bottom:50px; }
.wrap-tab-list li { }
.wrap-tab-list li::after { width:3px; height:3px; border-radius:3px; display:inline-block; content:''; background:#666; margin:0 15px 5px; }
@@ -364,27 +417,32 @@
.content_wrap h3 { font-size:2.4em; font-weight:900; margin-bottom:50px; transform:translateY(100%); opacity:0; transition:all 0.5s; }
.content_wrap h3.visible { opacity:1; transform: translateY(0); }
.about_text { padding-top:20px; font-size:1.2em; margin-bottom:10px; line-height:1.8em; display:flex; }
-.about_text .logo { width:40%; display: flex; justify-content: center; align-items: center; background:#f4f4f4; }
+.about_text .logo { width:40%; display: flex; justify-content: center; align-items: center; background:#f4f4f4; animation:fadeup 1s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; }
.about_text img { height:50px; }
.about_text .text { padding-left:70px; width:calc(60% - 70px); }
-.about_text .text p { margin-bottom:15px; }
-.about_text .text p:last-child { margin-bottom:0; }
-
-.about_container { background:#fff; position:relative; z-index:2; }
-.about_container p { }
+.about_text .text p { display:block; margin-bottom:15px; animation:fadeup 1s cubic-bezier(0.5, 0.7, 0.4, 1.000) both; }
+.about_text .text p:nth-child(1) { animation-delay:0.3s; }
+.about_text .text p:nth-child(2) { animation-delay:0.4s; }
+.about_text .text p:nth-child(3) { animation-delay:0.5s; }
+.about_text .text p:nth-child(4) { animation-delay:0.6s; margin-bottom:0; }
/*연혁*/
-.history { background:#f4f4f4; padding:100px 0; }
+.history { position:relative; padding:100px 0; background:rgba(255,255,255,1); }
+.history_content { position:relative; z-index:1; }
.history h3 { text-align:center; }
.history ul { position:relative; padding:30px 0; }
-.history ul::after { width:3px; height:100%; content:''; display:inline-block; background:#0032c3; position:absolute; top:0; left:50%; transform:translateX(-50%); z-index:1; }
-.history ul li { width:100%; position:relative; padding:0 calc(50% + 50px) 0 0; text-align:right; margin:30px 0; z-index:3; transform: translateY(50%); opacity:0; transition:all 0.3s; }
-.history ul li.visible { opacity:1; transform: translateY(0); }
+.history ul::after { width:3px; height:0%; content:''; display:inline-block; background:#0032c3; position:absolute; top:0; left:50%; transform:translateX(-50%); z-index:1;transition:all 0.5s; }
+.history ul li { width:100%; position:relative; padding:0 calc(50% + 50px) 0 0; text-align:right; margin:50px 0; z-index:3; }
+.history .date { color:#0032c3; font-weight:900; letter-spacing:-1px; font-size:1.8em; display:block; margin-bottom:15px; transform:translateX(-50px); opacity:0; transition:all 0.5s; }
+.history ul li p { font-size:1.1em; transform:translateX(-50px); opacity:0; transition:all 0.5s;}
.history ul li:nth-child(2n) { padding:0 0 0 calc(50% + 50px); text-align:left; }
-.history ul li::after { width:10px; height:10px; content:''; display:inline-block; border:3px solid #0032c3; border-radius:50px; background:#fff; position:absolute; top:5px; left:50%; transform: translateX(-50%); }
-.history .date { color:#0032c3; font-weight:900; letter-spacing:-1px; font-size:1.8em; display:block; margin-bottom:15px; }
-.history .date::after { }
-.history ul li p { font-size:1.1em; }
+.history ul li:nth-child(2n) .date, .history ul li:nth-child(2n) p { transform:translateX(50px); }
+.history ul li::after { width:10px; height:10px; content:''; display:inline-block; border:3px solid #0032c3; border-radius:50px; background:#fff; position:absolute; top:5px; left:50%; transform: translate(-50%, 50px); opacity:0; transition:all 0.5s; }
+.history.visible ul::after { height:100%; }
+.history ul li.visible::after { transform: translate(-50%, 0); opacity:1; }
+.history ul li.visible .date { opacity:1; transform:translateX(0); transition-delay:0.2s; }
+.history ul li.visible p { opacity:1; transform:translateY(0); transition-delay:0.4s; }
+.history_bg { position:absolute; top:0; left:0; z-index:0; width:100%; height:100%; background:#f4f4f4; display:block; }
/*편집인*/
.editor_info ul { display:flex; flex-wrap:wrap; margin:0 -30px; }
@@ -413,4 +471,60 @@
.office_text dl dd { width:calc(100% - 50px); padding:3px 0; }
#mapP { background:url(/images/user/map1.jpg) 50% 50% no-repeat; }
-#mapS { background:url(/images/user/map2.jpg) 50% 50% no-repeat; }
\ No newline at end of file
+#mapS { background:url(/images/user/map2.jpg) 50% 50% no-repeat; }
+
+/*로그인*/
+.login_wrap { width:450px; margin:0 auto; display:flex; justify-content:center; flex-direction:column; align-items:center; }
+
+.login { width:100%; }
+.login li { width:100%; margin-top:15px; }
+.login_input { display:flex; align-items:center; border:1px solid #ccc; justify-content:space-between; border-radius:5px; transition:all 0.3s;}
+.login_input:hover { box-shadow:0 0 10px 0 rgba(0,0,0,0.2); border-color:#999; }
+.login li label { width:50px; height:45px; display:flex; justify-content:center; align-items:center; }
+.login li:nth-child(1) label { background:url(/images/user/icon_login1.svg) 50% 50% no-repeat; background-size:20px 20px; }
+.login li:nth-child(2) label { background:url(/images/user/icon_login2.svg) 50% 50% no-repeat; background-size:20px 20px; }
+.login li .inputText { width:calc(100% - 50px); border:none; border-radius:0; border-radius:0 5px 5px 0; }
+.login li .inputText:hover { border:none; box-shadow:none; }
+.login li button { width:100%; }
+.login li:last-child { margin-top:10px; }
+
+.benefit { width:100%; margin-top:60px; text-align:left; }
+.benefit > p { margin-bottom:30px; }
+.benefit ul { display:flex; justify-content:center; flex-direction:column; align-items:center;}
+.benefit li { display:flex; align-items:center; width:100%; border:1px solid #e1e1e1; box-shadow:0 0 20px 0 rgba(0,0,0,0.15); padding:30px 0; margin-bottom:20px; border-radius:10px; }
+.benefit li:last-child { margin-bottom:0; }
+.benefit li .img { width:150px; text-align:center; }
+.benefit li img { height:50px; }
+.benefit li .text { text-align:left; }
+.benefit li strong { display:block; font-size:1.3em; font-weight:900; color:#333; margin-bottom:15px; }
+
+
+@keyframes zoomIn {
+ 0% { transform:scale(.6); opacity:0; }
+ 50% { transform:scale(1.05); }
+ 100% {transform:scale(1); opacity:1; }
+}
+@keyframes zoomUp {
+ 0% { transform:translateY(50%) scale(.6); opacity:0; }
+ 50% { transform:translateY(-10%) scale(1.05); }
+ 100% {transform:translateY(0) scale(1); opacity:1; }
+}
+@keyframes fadeOut {
+ 0% { transform:translateY(0%); opacity:1; }
+ 100% { transform:translateY(50%); opacity:0; }
+}
+@keyframes fadeup {
+ 0% { transform:translateY(50%); opacity:0; }
+ 50% { transform:translateY(-10%); }
+ 100% { transform:translateY(0); opacity:1; }
+}
+@keyframes fadeLeft {
+ 0% { transform:translateX(50%); opacity:0; }
+ 50% { transform:translateX(-1%) }
+ 100% { transform:translateX(0); opacity:1; }
+}
+@keyframes fadeRight {
+ 0% { transform:translateX(-50%); opacity:0; }
+ 50% { transform:translateX(1%) }
+ 100% { transform:translateX(0); opacity:1; }
+}
Index: base3.10/src/main/webapp/css/user/font.css
===================================================================
--- base3.10/src/main/webapp/css/user/font.css (revision 58)
+++ base3.10/src/main/webapp/css/user/font.css (revision 59)
@@ -36,30 +36,97 @@
-moz-osx-font-smoothing: grayscale;
}
-.icon-blank:before {
- content: "\e906";
+
+.icon-file-excel:before {
+ content: "\e90d";
}
-.icon-close:before {
- content: "\e908";
+.icon-file-img:before {
+ content: "\e90e";
}
-.icon-search:before {
- content: "\e909";
+.icon-file-pdf:before {
+ content: "\e90f";
}
-.icon-arrow-dl:before {
+.icon-file-ppt:before {
+ content: "\e910";
+}
+.icon-file-reg:before {
+ content: "\e911";
+}
+.icon-file-word:before {
+ content: "\e912";
+}
+.icon-file-zip:before {
+ content: "\e913";
+}
+.icon-cal:before {
+ content: "\e914";
+}
+.icon-delete:before {
+ content: "\e915";
+}
+.icon-file:before {
+ content: "\e916";
+}
+.icon-minus:before {
+ content: "\e90b";
+}
+.icon-plus:before {
+ content: "\e90c";
+}
+.icon-file-down:before {
content: "\e900";
}
-.icon-arrow-dr:before {
+.icon-file-up:before {
content: "\e901";
}
-.icon-arrow-l:before {
+.icon-blank:before {
content: "\e902";
}
-.icon-arrow-r:before {
+.icon-close:before {
content: "\e903";
}
-.icon-arrow-t:before {
+.icon-arrow-b:before {
content: "\e904";
}
-.icon-arrow-b:before {
+.icon-arrow-t:before {
content: "\e905";
-}
\ No newline at end of file
+}
+.icon-arrow-dl:before {
+ content: "\e906";
+}
+.icon-arrow-dr:before {
+ content: "\e907";
+}
+.icon-arrow-l:before {
+ content: "\e908";
+}
+.icon-arrow-r:before {
+ content: "\e909";
+}
+.icon-search:before {
+ content: "\e90a";
+}
+.icon-arrow-thin-u:before {
+ content: "\ea3a";
+}
+.icon-arrow-thin-r:before {
+ content: "\ea3c";
+}
+.icon-arrow-thin-d:before {
+ content: "\ea3e";
+}
+.icon-arrow-thin-l:before {
+ content: "\ea40";
+}
+.icon-circle-up:before {
+ content: "\ea41";
+}
+.icon-circle-right:before {
+ content: "\ea42";
+}
+.icon-circle-down:before {
+ content: "\ea43";
+}
+.icon-circle-left:before {
+ content: "\ea44";
+}
Index: base3.10/src/main/webapp/css/user/style.css
===================================================================
--- base3.10/src/main/webapp/css/user/style.css (revision 58)
+++ base3.10/src/main/webapp/css/user/style.css (revision 59)
@@ -16,7 +16,7 @@
a:hover { }
hr { border:none; border-top:1px dashed #ccc; height:0px; }
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; word-break:break-all; }
-*:focus { /*outline:2px dashed #007dc3;*/ }
+*:focus { outline:2px dashed #007dc3; }
/*table title, form title 숨기기*/
legend, caption, .hidden, .blind { position:absolute; left:-9999em; width:1px;height:1px;margin:0;padding:0;background:none;font-size:0;line-height:0;text-indent:-9999em }
.vh { visibility:hidden; }
@@ -57,6 +57,9 @@
.textover { text-align:left; overflow:hidden; text-overflow:ellipsis; white-space:normal; word-wrap:break-word; display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient: vertical; }
/* .must .board_label::after, .must .tit::after, em.must::after { content:'*'; display:inline-block; margin-left:5px; color:#e21818; } */
+.overX { -ms-overflow-style:none; scrollbar-width:none; touch-action:pan-x; }
+.overX::-webkit-scrollbar { display:none; }
+
.must .board_label b, .must .tit b, em.must b { display:inline-block; margin-left:5px; color:#e21818; }
.must_text { color:#333; margin-top:15px; font-size:0.9em; word-break:break-word; }
@@ -86,7 +89,7 @@
.color_gray { color:#888 !important; }
.color_lightgray { color:#ccc !important; }
.color_blue { color:#055c9a !important; }
-.color_red { color:#990000 !important; }
+.color_red { color:#c51b00 !important; }
.color_navy { color:#133467 !important; }
.color_white { color:#fff !important; }
@@ -105,7 +108,7 @@
.btn_sq_s { width:20px; height:20px; border:1px solid #bbb; transition:border .2s ease-in-out, box-shadow .2s ease-in-out;}
.btn_sq_m { width:32px; height:32px; border:1px solid #bbb; transition:border .2s ease-in-out, box-shadow .2s ease-in-out;}
-.btn_sq_l { width:40px; height:40px; border:1px solid #bbb; transition:border .2s ease-in-out, box-shadow .2s ease-in-out;}
+.btn_sq_l { width:45px; height:45px; border:1px solid #bbb; transition:border .2s ease-in-out, box-shadow .2s ease-in-out;}
a.btn_sq_s { width:20px; height:20px; border:1px solid #bbb; transition:border .2s ease-in-out, box-shadow .2s ease-in-out;border-radius:3px;cursor:pointer; display:inline-block;}
a.btn_sq_m { width:32px; height:32px; border:1px solid #bbb; transition:border .2s ease-in-out, box-shadow .2s ease-in-out;border-radius:3px;cursor:pointer; display:inline-block;}
@@ -123,22 +126,6 @@
.btn_m { font-size:1em; text-align:center; padding:0 20px; height:45px;transition:border .2s ease-in-out, box-shadow .2s ease-in-out; }
.btn_l { text-align:center; height:50px; padding:0 50px; font-weight:600; transition:border .2s ease-in-out, box-shadow .2s ease-in-out;}
-.btn_delete { background:url(../../images/custom/icon_trash.svg) 50% 50% no-repeat #fff; background-size:12px; text-indent:-5000px; display:inline-block; transition:background 0s;}
-.btn_delete:hover { background:url(../../images/custom/icon_trash_on.svg) 50% 50% no-repeat #fff; background-size:12px; }
-.btn_delete.noline { border:none; }
-.btn_delete.noline:hover { box-shadow:none !important; opacity:1; }
-.btn_plus { background:url(../../images/custom/icon_plus.svg) 50% 50% no-repeat #fff; background-size:50%; text-indent:-5000px;display:inline-block; }
-.btn_plus:hover { border-color:#666; }
-.btn_update { background:url(../../images/custom/icon_update.svg) 50% 50% no-repeat #fff; background-size:15px; text-indent:-5000px;display:inline-block; }
-.btn_update:hover { border-color:#666; background:url(../../images/custom/icon_update_on.svg) 50% 50% no-repeat #fff; background-size:15px; }
-.btn_wrap .btn_delete { margin-left:0px; }
-
-.btn_arrow::after { width:10px; height:10px; background:url(/images/custom/arrow_right.svg) 50% 50% no-repeat; background-size:10px 10px; content:''; margin-left:10px; display:inline-block; }
-
-/*파일다운*/
-.btn_filedown { width:24px; height:24px; display:inline-block; border:1px solid #bbb; border-radius:3px; text-indent:-5000px; background:url(../../images/custom/icon_filedown.svg) 50% 50% no-repeat; background-size:15px !important; transition:all .2s, background 0s; }
-.btn_filedown:hover { box-shadow:0 0 5px 0 rgba(0,0,0,0.3); border-color:#666; background:url(../../images/custom/icon_filedown_on.svg) 50% 50% no-repeat; background-size:15px !important;}
-
a.btn_s , a.btn_m, a.btn_l { border-radius:5px; }
a.btn_s { padding:2px 10px; font-size:0.9em; }
a.btn_m { padding:5px 10px; }
@@ -147,23 +134,10 @@
.btn_m:hover, .btn_l:hover, .btn_full:hover, .btn_round:hover, .btn_circleM:hover, .btn_circleL:hover { box-shadow:0 0 10px 0 rgba(0,0,0,0.3); }
.btn_ss:hover, .btn_s:hover, .btn_sq_s:hover, .btn_sq_m:hover, .btn_img:hover, .btn_circleSS:hover, .btn_circleS:hover { box-shadow:0 0 5px 0 rgba(0,0,0,0.3); border-color:#666; }
-.clickmore { padding:3px 10px; font-size:0.9em; border-radius:50px; color:#007dc3; border:1px solid #007dc3; }
-
/*닫기버튼*/
.btn_close { width:100%; height:100%; cursor:pointer; z-index:99; border:none; display:inline-block; }
.btn_close:hover { transform:rotate(90deg); transition:all 0.3s; }
-.btn_toggle { width:32px; height:32px; display:block; position:relative; }
-.btn_toggle::before, .btn_toggle::after { content:''; position:absolute; top:50%; left:50%; width:50%; height:2px; background:#333; display:inline-block; transition:all 0.3s;}
-.btn_toggle::before { transform: translate(-50%,-50%) rotate(90deg); }
-.btn_toggle::after { transform: translate(-50%,-50%) rotate(0deg); }
-.btn_toggle.active::before { transform:translate(-50%,-50%) rotate(0deg); }
-.btn_toggle.active::after { transform:translate(-50%,-50%) rotate(0deg); }
-
-.btn_arrow_down::after { content:''; width:10px; height:10px; transition:all 0.3s; display:inline-block; margin-left:15px; background:url(../../images/custom/arrow_down.svg) 50% 50% no-repeat; background-size:contain; }
-.btn_arrow_down.active { border:1px solid #666; box-shadow:0 0 10px 0 rgba(0,0,0,.3); }
-.btn_arrow_down.active::after { transform:rotate(180deg); }
-
/* bgcolor */
.bg_gray {background-color:#f4f5f7 !important;} /* 결제대기 */
.bg_lightgray {background-color:#f8f8f8 !important;}
@@ -173,16 +147,12 @@
.bg_navy:hover { background-color:#032b54 !important; }
.bg_blue { background:#1524cc; color:#fff; border-color:#0016b1; transition:all 0.3s; }
.bg_blue:hover { background-color:#0016b1 !important; }
-
.bg_basic { border:1px solid #ccc; background:none; color:#333; }
.bg_basic:hover { border-color:#666; }
-
.line_blue { border:1px solid #1265cc; color:#1265cc; }
.line_blue:hover { background:#1265cc; color:#fff; }
-
.line_white { background:transparent; border:1px solid #fff; color:#fff; }
.line_white:hover { background:#fff; color:#333; }
-
.bg_line { background:transparent; border:1px solid #333; }
.bg_line:hover { background-color:#fff; }
@@ -216,67 +186,47 @@
.inputText[disabled]:hover, .selectText[disabled]:hover, .textArea[disabled]:hover { border:1px solid #e4e4e4; box-shadow:none; }
.inputText:hover, .selectText:hover, .textArea:hover, .textArea:focus, .inputFile:hover { box-shadow:0 0 10px 0 rgba(0,0,0,0.2); border-color:#999; }
-.file_up { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display:flex; flex-direction:column; }
-.file_up input[type="file"] { position: absolute; width:110px; height:45px; padding:0; margin:0; border:0; z-index:0; }
-.file_up label, .file_up .inputFile {border:1px solid #ccc; padding:10px; background:#fff; border-radius:5px; position:relative; z-index:1; box-shadow:none; display:inline-block; transition:0.3s ease-in-out; }
-.file_up label:hover, .file_up .inputFile:hover { box-shadow:0 0 5px 0 rgba(0,0,0,0.3); border-color:#666; }
-.file_up label::after, .file_up .inputFile::after { width:13px; height:13px; content:''; transform: translateY(1px); display:inline-block; background:url(../../images/custom/icon_fileup.svg) 50% 50% no-repeat #fff; margin-left:10px; background-size:contain;}
+/*첨부파일*/
+.file_up { position:relative; }
+.file_up input[type="file"] { position: absolute; width:120px; height:45px; border-radius:5px; padding:0; margin:0; border:0; z-index:0; }
+.file_up label {border:1px solid #ccc; padding:10px; width:120px; height:45px; background:#fff; border-radius:5px; position:relative; z-index:1; box-shadow:none; display:inline-block; transition:0.3s ease-in-out; }
+.file_up label:hover { box-shadow:0 0 5px 0 rgba(0,0,0,0.3); border-color:#666; }
+.btn_file_up span { margin-left:10px; }
-
-/* .file_list_wrap { }
-.file_list_wrap.show { }
-.file_list_wrap .space5 { display:none; } */
+/*첨부파일 리스트*/
.file_list { margin:5px -2.5px 0; display:inline-block; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display:flex; align-items:flex-start; flex-direction:column; flex-direction:row; flex-wrap:wrap; }
.file_list li:first-child { }
.file_list li { margin:2.5px; }
.board_view .file_list { margin-top:0; }
/*일반파일*/
-.file_list .file_wrap { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display:flex; width:auto; align-items:center; padding:5px 7px 5px 7px; border:1px solid #ccc; border-radius:5px; background:#fff; transition:border .2s ease-in-out, box-shadow .2s ease-in-out;}
-.file_list .file_wrap:hover { box-shadow:0 0 10px 0 rgba(0,0,0,0.1); border-color:#666; }
-.file_list .file_wrap p { display:inline-block; min-width:100px; max-width:300px; font-size:0.9em; letter-spacint:-0.5em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-right:20px; position:relative; }
-.file_list .file_wrap p::after { width:1px; height:15px; content:''; display:inline-block; background:#ccc; position:absolute; top:5px; right:6px; }
-.file_list .file_wrap .btn_sq_s { width:24px; height:27px; display:inline-block; }
-.file_list .file_wrap .btn_ss { padding:0 4px; }
-.file_list .file_wrap .btn_ss:hover { color:#007dc3; }
-.file_list .file_wrap .btn_ss, .file_list .btn_sq_s { height:25px; border-radius:2px; border-color:transparent; display:inline-block;}
-.file_list .file_wrap .btn_sq_s:hover, .file_list .file_wrap .btn_s:hover, .file_list .file_wrap .btn_ss:hover { border-color:transparent; box-shadow:none; }
-
-
-.file_img .file_wrap::before,
-.file_ppt .file_wrap::before,
-.file_pdf .file_wrap::before,
-.file_word .file_wrap::before,
-.file_reg .file_wrap::before,
-.file_excel .file_wrap::before,
-.file_zip .file_wrap::before,
-.file_hwp .file_wrap::before { content:''; width:15px; height:15px; display:inline-block; margin-right:5px; }
+.file_list { margin:10px -2px -2px; }
+.file_list .file_box { display:flex; width:auto; align-items:center; padding:5px 7px 5px 15px; border:1px solid #ccc; border-radius:50px; margin:2px; background-color:#fff; transition:all .2s ease-in-out; }
+.file_list .file_box:hover { box-shadow:0 0 10px 0 rgba(0,0,0,0.1); border-color:#666; }
+.file_list .file_box p { display:inline-block; min-width:100px; max-width:300px; font-size:0.9em; letter-spacint:-0.5em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-right:20px; position:relative; }
+.file_list .file_box p::after { width:1px; height:15px; content:''; display:inline-block; background:#ccc; position:absolute; top:5px; right:6px; }
-.file_img .file_wrap::before { background:url(../../images/custom/file_img.svg) 50% 50% no-repeat; background-size:contain; }
-.file_ppt .file_wrap::before { background:url(../../images/custom/file_ppt.svg) 50% 50% no-repeat; background-size:contain; }
-.file_pdf .file_wrap::before { background:url(../../images/custom/file_pdf.svg) 50% 50% no-repeat; background-size:contain; }
-.file_word .file_wrap::before { background:url(../../images/custom/file_word.svg) 50% 50% no-repeat; background-size:contain; }
-.file_reg .file_wrap::before { background:url(../../images/custom/file_reg.svg) 50% 50% no-repeat; background-size:contain; }
-.file_excel .file_wrap::before { background:url(../../images/custom/file_excel.svg) 50% 50% no-repeat; background-size:contain; }
-.file_zip .file_wrap::before { background:url(../../images/custom/file_zip.svg) 50% 50% no-repeat; background-size:contain; }
-.file_hwp .file_wrap::before { background:url(../../images/custom/file_hwp.svg) 50% 50% no-repeat; background-size:contain; }
+/*이미지파일*/
+.file_list.img_type { margin:10px -2px -2px; }
+.file_list.img_type .file_box { display:flex; align-items:center; padding:5px 7px 5px 15px; border:1px solid #ccc; width:100px; height:100px; border-radius:20px; margin:2px; transition:all .2s ease-in-out; position:relative; }
+.file_list.img_type .btn_wrap { position:absolute; background:rgba(255,255,255,0.3); backdrop-filter:blur(10px); bottom:-100%; left:0; width:100%; text-align:center; padding:5px 0;transition:all .2s ease-in-out; }
+.file_list.img_type .file_box:hover { box-shadow:0 0 10px 0 rgba(0,0,0,0.1); border-color:#666; }
+.file_list.img_type .file_box:hover .btn_wrap { bottom:0; }
+.file_list.img_type .file_box .btn_wrap button { color:#ccc; }
+.file_list.img_type .file_box .btn_wrap button:hover { color:#fff; }
-/*업로드파일이 이미지일 경우*/
-.file_img { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display:flex; justify-content:flex-start; }
-.file_img li { width:80px;height:80px; background-size:cover !important; position:relative; overflow:hidden; margin:10px 10px 0 0; border-radius:10px; border:1px solid #eaeaea; transition:border .2s ease-in-out, box-shadow .2s ease-in-out; }
-.file_img li:last-child { margin-right:0; }
-.file_img li:hover { box-shadow:0 0 10px 0 rgba(0,0,0,0.1);}
-.file_img li .btn { width:100%; position:absolute; text-align:center; z-index:1; bottom:-100%; right:0; padding:5px 0; background:#fff; line-height:1em;transition:bottom .1s ease-in-out; }
-.file_img li:hover .btn { bottom:0; }
-.file_img li .btn .btn_sq_s { width:24px; height:24px; border-color:transparent; margin:0 2px; }
-.file_img li .btn .btn_sq_s:hover { box-shadow:none; }
-.file_img li::after { position:absolute; top:0; left:0; pointer-events:none; content:''; background:#333; display:block; width:100%; height:100%; opacity:0; z-index:0; transition:opacity .1s ease-in-out;}
-.file_img li:hover::after { opacity:0.5; }
-.file_img li img { width:100%; height:auto; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); pointer-events:none; }
+/*카테고라*/
+.category_wrap { display:flex; flex-direction:row; flex-wrap:wrap; margin:10px -2.5px -2.5px; }
+.category_wrap .category { margin:2.5px; border:1px solid #ccc; color:#333; background:#fff; font-size:0.9em; border-radius:30px; padding:5px 5px 5px 15px; display:flex; align-items:center;transition:all .2s ease-in-out }
+.category_wrap .category:hover { box-shadow:0 0 10px 0 rgba(0,0,0,0.1); border-color:#666; }
+.category_wrap .category p { margin-right:10px; }
+.btn_inner { width:24px; height:24px; background:transparent; border-color:transparent; padding:0; color:#999; font-size:1em; border-radius:50px; }
+.btn_inner:hover { box-shadow:none; color:#333; }
+.btn_inner .icon-file-down { }
/*select 디자인****************************************************************************************************************************************/
-select { padding-left:5px; padding-right:25px !important; background:url(../../images/custom/arrow_down.svg) calc(100% - 10px) 50% no-repeat #fff; background-size:10px; cursor:pointer;transition:all .5s ease-in-out; overflow:hidden !important; text-overflow: ellipsis; white-space:nowrap;
+select { padding-left:5px; padding-right:25px !important; background:url(/images/user/arrow_bottom.svg) calc(100% - 10px) 50% no-repeat #fff; background-size:10px; cursor:pointer;transition:all .5s ease-in-out; overflow:hidden !important; text-overflow: ellipsis; white-space:nowrap;
-webkit-appearance: none;/* 화살표 없애기 for chrome */ -moz-appearance: none; /* 화살표 없애기 for firefox */ appearance: none;/* 화살표 없애기 공통 */ }
select::-ms-expand { display: none;/* 화살표 없애기 for firefox */}
@@ -285,40 +235,29 @@
::-webkit-scrollbar-track {background: transparent; }
::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: rgba(25,25,25,0.5); -webkit-border-radius: 8px; border-radius: 8px; }
-.overX { -ms-overflow-style:none; scrollbar-width:none; touch-action:pan-x; }
-.overX::-webkit-scrollbar { display:none; }
-
input[type='checkbox'] { width:18px; height:18px; opacity:1; margin:0 10px 0 0; z-index:0; position:relative; cursor:pointer; }
-input[type='checkbox']::before { content:''; pointer-events:none; background:url(../../images/admin/check_on.svg) 50% 50% no-repeat #fff; background-size:contain; border:1px solid #333; width:calc(100% - 2px); height:calc(100% - 2px); display:inline-block; border-radius:2px; opacity:0; top:0; left:0; position:absolute; }
+input[type='checkbox']::before { content:''; pointer-events:none; background:url(/images/user/check_on.svg) 50% 50% no-repeat #fff; background-size:contain; border:1px solid #333; width:calc(100% - 2px); height:calc(100% - 2px); display:inline-block; border-radius:2px; opacity:0; top:0; left:0; position:absolute; }
input[type='checkbox']:checked::before { opacity:1; z-index:1; }
input[type='checkbox']:checked + label { font-weight:600; }
-/* input[type='checkbox'] + label {cursor:pointer; font-size:1em; font-weight:400; color:#999; position:relative; z-index:1; }
-input[type='checkbox'] + label::before { content:''; display:inline-block;width:18px;height:18px; opacity:0; vertical-align:middle;margin-right:10px; border:1px solid #999; cursor:pointer; background:#fff;margin-top:-2px; transition:all .2s ease-in-out; }
-input[type='checkbox']:hover + label::before { border:1px solid #666; font-weight:500; }
-input[type='checkbox']:checked + label::before { border:1px solid #333; opacity:1; z-index:1;}
-input[type='checkbox']:disabled + label::before { border:1px solid #d8d8d8; background:#f1f1f1; }
-input[type='checkbox'] + label::after { content:'';display:inline-block; position:absolute; transition:all .2s ease-in-out; opacity:0; }
-input[type='checkbox']:checked + label::after { opacity:1; }
-input[type='checkbox'] + label::before { border-radius:2px; }
-input[type='checkbox'] + label::after { width:18px; height:18px;left:2px; top:3px; background:url(../../images/admin/check_on.svg) 50% 50% no-repeat; background-size:contain; }
-input[type='checkbox']:checked + label, input[type='checkbox']:disabled + label { color:#000; }
-input[type='checkbox']:checked + label { font-weight:500; } */
-
input[type='radio'] { width:18px; height:18px; opacity:1; margin:0 10px 0 0; z-index:1; position:relative; cursor:pointer; }
-input[type='radio']::before { content:''; pointer-events:none; background:url(../../images/custom/radio_on.svg) 50% 50% no-repeat #fff; background-size:10px; width:calc(100% - 2px); height:calc(100% - 2px); border:1px solid #333; display:inline-block; border-radius:30px; opacity:0; top:0; left:0; position:absolute; }
+input[type='radio']::before { content:''; pointer-events:none; background:url(/images/user/radio_on.svg) 50% 50% no-repeat #fff; background-size:10px; width:calc(100% - 2px); height:calc(100% - 2px); border:1px solid #333; display:inline-block; border-radius:30px; opacity:0; top:0; left:0; position:absolute; }
input[type='radio']:checked::before { opacity:1; z-index:1; }
input[type='radio']:checked + label { font-weight:600; }
-/* input[type='radio'] + label {cursor:pointer; font-size:1em; font-weight:400; color:#999;position:relative; z-index:1; }
-input[type='radio'] + label::before { content:''; display:inline-block;width:18px;height:18px;opacity:0;vertical-align:middle;margin-right:10px; border:1px solid #999; cursor:pointer; background:url(../../images/custom/radio_on.svg) 50% 50% no-repeat #fff; background-size:0; margin-top:-2px; transition:all .2s ease-in-out; }
-input[type='radio']:hover + label::before { border:1px solid #666; font-weight:500; }
-input[type='radio']:checked + label::before { border:1px solid #333; z-index:1; opacity:1;}
-input[type='radio']:disabled + label::before { border:1px solid #d8d8d8; background:#f1f1f1; }
-input[type='radio']:checked + label::before { background:url(../../images/custom/radio_on.svg) 50% 50% no-repeat #fff; background-size:10px; }
-input[type='radio'] + label::before { border-radius:10px; }
-input[type='radio']:hover + label, input[type='radio']:checked + label, input[type='radio']:disabled + label { color:#333; }
-input[type='radio']:checked + label { font-weight:500; } */
+/*체크,라디오 기본정렬*/
+.checkbox { display:flex; flex-wrap:wrap; margin:-5px; }
+.checkbox .check { display:flex; align-items: center; margin:5px 20px 5px 5px; }
+
+/*날짜선택*/
+.date_wrap { display:flex; flex-wrap:wrap; align-items: center; }
+.date_wrap > em { margin:0 5px; }
+.date_wrap .date { display:flex; border:1px solid #ccc; border-radius:5px; transition:all 0.3s; }
+.date_wrap .date .btn_sq_l { font-size:1.3em; color:#727272; }
+.date_wrap .date .btn_sq_l:hover { color:#333; }
+.date_wrap .date:hover { box-shadow:0 0 10px 0 rgba(0,0,0,0.2); border-color:#999; }
+.date_wrap .date .inputText, .date .btn_sq_l { border:none; background:none; }
+.date_wrap .date .inputText:hover, .date .btn_sq_l:hover { box-shadow:none; }
/*가로,세로,마진,패딩 설정****************************************************************************************************************************************/
/* 가로사이즈% (테이블 col class로 사용 필요할 경우 class 추가) */
Index: base3.10/src/main/webapp/css/user/board.css
===================================================================
--- base3.10/src/main/webapp/css/user/board.css (revision 58)
+++ base3.10/src/main/webapp/css/user/board.css (revision 59)
@@ -1,14 +1,6 @@
@charset "UTF-8";
/* CSS Document */
-/*****************************************************************************************************************************************
-생성일: 2018/10/08
-수정일:
-수정자: hello@dx2.kr
-주석간 간격 두줄 구분은 한줄사용
-*****************************************************************************************************************************************/
-
-
/*basic list*/
.board_list { width:100%; table-layout:fixed; border-top:2px solid #333; }
.board_list tr { transition:all 0.3s; }
@@ -32,11 +24,19 @@
.board_content { padding:50px 0; border-bottom:1px solid #ededed; }
/*basic write*/
-.board_write { width:100%; border-top:1px solid #666; }
-.board_write ul > li { width:100%; border-bottom: 1px solid #ededed; padding:15px 0; position:relative; transition:all 0.3s;}
+.board_write { width:100%; border-top:2px solid #333; }
+.board_write ul li > .title { display:block; margin-bottom:15px; font-weight:900; font-size:1.3em; }
+.board_write ul > li { width:100%; border-bottom:1px solid #ededed; padding:25px 0; position:relative;}
+.board_write ul > li .exp { margin:-5px 0 15px 0; display: block; color:#727272; }
.board_write ul > li::after { content:''; display:block; clear:both; }
-.board_write ul > li .item_text .board_title { display:block; font-weight:500; font-size:1.3em; margin-bottom:15px; color:#000; letter-spacing: -.5px; }
-.board_write ul > li .item_text { width:100%; }
+.board_write ul > li .input_wrap { margin-bottom:5px; }
+.board_write ul > li .input_wrap:last-child { margin-bottom:0; }
+.board_write ul > li .input_option { margin-top:15px; }
+
+.caption { display:block; margin-bottom:20px; }
+.caption .must { font-weight:600; color:#555; }
+.caption .must em { font-size:1.3em; color:#c51b00; display:inline-block; line-height:.8em; vertical-align:bottom; }
+.mustText { color:#c51b00; font-weight:600; display: inline-block; margin-left:5px; font-size:1.3em; line-height:.8em;vertical-align:bottom; }
/*페이지수*/
.sorting_wrap { margin-bottom:30px; color:#666; }
@@ -45,26 +45,22 @@
.sorting_wrap .total .count { color:#1524cc; font-weight:900; }
/*검색*/
-.search_box { float:right; width:300px; height:40px; position:relative; border:1px solid #d9d9d9; border-radius:50px; box-shadow:0 0 15px 0 rgba(0,0,0,0.2); transition:all 0.3s; }
-.search_box:hover { border:1px solid #333; }
+.search_box { float:right; width:300px; height:40px; position:relative; border:1px solid #d9d9d9; border-radius:50px; box-shadow:0 0 10px 0 rgba(0,0,0,0.1); transition:all 0.3s; }
+.search_box:hover { border:1px solid #333; box-shadow:0 0 15px 0 rgba(0,0,0,0.3); }
.search_box .inputText { width:calc(100% - 40px); font-weight:600; height:100%; float:left; border:none; padding-left:15px; border-radius:40px 0 0 40px !important; }
.search_box .btn_search { width:40px; height:100%; font-size:1.2em; border:none; border-radius:0 40px 40px 0 !important; color:#ccc; transition:all 0.3s; }
.search_box button:hover, .search_box .inputText:hover { box-shadow:none; }
.search_box .btn_search:hover { color:#000; }
/*pagenation*/
-.pagination { margin:0 auto 0; text-align:center; position:relative; }
+.pagination { margin:0 auto; text-align:center; position:relative; }
.pagination ul {display:flex; justify-content:center; padding-left:0; border-radius:4px; }
.pagination li { box-sizing:border-box; position:relative; cursor:pointer; display:inline-block; margin:0 5px; }
.pagination li a { display:inline-block; cursor:pointer; border-radius:50px; width:30px; height:30px; line-height:30px; color:#333; font-size:1em; transition:background-color 0.3s;}
.pagination li a:hover { background-color:#ededed; }
.pagination li.active a { font-weight:bold; color:#fff; background:#333; }
.pagination .first, .pagination .last, .pagination .next, .pagination .prev { margin:0 2px; }
-/*.pagination .first a, .pagination .last a, .pagination .next a, .pagination .prev a { text-indent: -5000px; }
-.pagination .prev, .pagination .prev a:hover { background:url(/images/custom/arrow_left.svg) 50% 50% no-repeat; background-size:6px; }
-.pagination .next, .pagination .next a:hover { background:url(/images/custom/arrow_right.svg) 50% 50% no-repeat; background-size:6px; }
-.pagination .first, .pagination .first a:hover { background:url(/images/custom/arrow_double_left.svg) 50% 50% no-repeat; background-size:9px; }
-.pagination .last, .pagination .last a:hover { background:url(/images/custom/arrow_double_right.svg) 50% 50% no-repeat; background-size:9px; }*/
+.bottom_wrap .pagination { position:absolute; left:50%; transform:translateX(-50%); display:inline-block; }
/* input text show */
.text_show { position:relative; transition:all 0.3s; }
Index: base3.10/src/main/webapp/fonts/icomoon.woff
===================================================================
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream
Index: base3.10/src/main/webapp/fonts/icomoon.eot
===================================================================
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream
Index: base3.10/src/main/webapp/fonts/icomoon.svg
===================================================================
--- base3.10/src/main/webapp/fonts/icomoon.svg (revision 58)
+++ base3.10/src/main/webapp/fonts/icomoon.svg (revision 59)
@@ -7,13 +7,35 @@
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode=" " horiz-adv-x="512" d="" />
-<glyph unicode="" glyph-name="arrow-dl" horiz-adv-x="938" d="M868.709-64c-18.45 0-35.363 6.15-49.201 19.988l-442.811 442.811c-27.676 27.676-27.676 70.727 0 98.402l442.811 442.811c27.676 27.676 70.727 27.676 98.402 0s27.676-70.727 0-98.402l-393.61-393.61 393.61-393.61c27.676-27.676 27.676-70.727 0-98.402-13.838-13.838-30.751-19.988-49.201-19.988zM512-64c-18.45 0-35.363 6.15-49.201 19.988l-442.811 442.811c-27.676 27.676-27.676 70.727 0 98.402l442.811 442.811c27.676 27.676 70.727 27.676 98.402 0s27.676-70.727 0-98.402l-393.61-393.61 393.61-393.61c27.676-27.676 27.676-70.727 0-98.402-13.838-13.838-30.751-19.988-49.201-19.988z" />
-<glyph unicode="" glyph-name="arrow-dr" horiz-adv-x="938" d="M69.189-64c-18.45 0-35.363 6.15-49.201 19.988-27.676 27.676-27.676 70.727 0 98.402l393.61 393.61-393.61 393.61c-27.676 27.676-27.676 70.727 0 98.402s70.727 27.676 98.402 0l442.811-442.811c27.676-27.676 27.676-70.727 0-98.402l-442.811-442.811c-13.838-13.838-30.751-19.988-49.201-19.988zM425.898-64c-18.45 0-35.363 6.15-49.201 19.988-27.676 27.676-27.676 70.727 0 98.402l393.61 393.61-393.61 393.61c-27.676 27.676-27.676 70.727 0 98.402s70.727 27.676 98.402 0l442.811-442.811c27.676-27.676 27.676-70.727 0-98.402l-442.811-442.811c-13.838-13.838-30.751-19.988-49.201-19.988z" />
-<glyph unicode="" glyph-name="arrow-l" horiz-adv-x="581" d="M512-64c-18.45 0-35.363 6.15-49.201 19.988l-442.811 442.811c-27.676 27.676-27.676 70.727 0 98.402l442.811 442.811c27.676 27.676 70.727 27.676 98.402 0s27.676-70.727 0-98.402l-393.61-393.61 393.61-393.61c27.676-27.676 27.676-70.727 0-98.402-13.838-13.838-30.751-19.988-49.201-19.988z" />
-<glyph unicode="" glyph-name="arrow-r" horiz-adv-x="581" d="M69.189-64c-18.45 0-35.363 6.15-49.201 19.988-27.676 27.676-27.676 70.727 0 98.402l393.61 393.61-393.61 393.61c-27.676 27.676-27.676 70.727 0 98.402s70.727 27.676 98.402 0l442.811-442.811c27.676-27.676 27.676-70.727 0-98.402l-442.811-442.811c-13.838-13.838-30.751-19.988-49.201-19.988z" />
-<glyph unicode="" glyph-name="arrow-t" horiz-adv-x="1929" d="M105.205-64c-28.055 0-56.11 14.027-77.151 35.068-42.082 42.082-35.068 112.219 7.014 147.288l862.685 813.589c42.082 42.082 112.219 35.068 147.288-7.014 42.082-42.082 35.068-112.219-7.014-147.288l-862.685-813.589c-21.041-21.041-42.082-28.055-70.137-28.055zM1823.562-64c-28.055 0-49.096 7.014-70.137 28.055l-855.671 813.589c-42.082 42.082-42.082 105.205-7.014 147.288 42.082 42.082 105.205 42.082 147.288 7.014l855.671-813.589c42.082-42.082 42.082-105.205 7.014-147.288-21.041-21.041-49.096-35.068-77.151-35.068z" />
-<glyph unicode="" glyph-name="arrow-b" horiz-adv-x="1929" d="M1823.562 960c28.055 0 56.11-14.027 77.151-35.068 42.082-42.082 35.068-112.219-7.014-147.288l-855.671-813.589c-42.082-42.082-105.205-35.068-147.288 7.014s-35.068 112.219 7.014 147.288l855.671 813.589c21.041 21.041 42.082 28.055 70.137 28.055zM105.205 960c28.055 0 49.096-7.014 70.137-28.055l862.685-813.589c42.082-42.082 42.082-105.205 7.014-147.288-42.082-42.082-105.205-42.082-147.288-7.014l-862.685 813.589c-42.082 42.082-49.096 105.205-7.014 147.288 21.041 21.041 49.096 35.068 77.151 35.068z" />
-<glyph unicode="" glyph-name="blank" d="M749.469 369.759c-21.962 0-41.18 19.217-41.18 41.18v233.351h-233.351c-21.962 0-41.18 19.217-41.18 41.18s19.217 41.18 41.18 41.18h274.531c21.962 0 41.18-19.217 41.18-41.18v-274.531c0-21.962-19.217-41.18-41.18-41.18zM266.295 161.115c-10.981 0-21.962 2.745-30.198 10.981-16.472 16.472-16.472 41.18 0 57.651l483.174 485.92c16.472 16.472 41.18 16.472 57.651 0s16.472-41.18 0-57.651l-480.429-485.92c-8.236-8.236-19.217-10.981-30.198-10.981zM771.432-64h-521.609c-140.011 0-252.568 112.558-252.568 252.568v521.609c0 140.011 112.558 252.568 252.568 252.568h301.984c21.962 0 41.18-19.217 41.18-41.18s-19.217-41.18-41.18-41.18h-301.984c-93.34 0-170.209-76.869-170.209-170.209v-521.609c0-93.34 76.869-170.209 170.209-170.209h521.609c93.34 0 170.209 76.869 170.209 170.209v301.984c0 21.962 19.217 41.18 41.18 41.18s41.18-19.217 41.18-41.18v-301.984c0-140.011-112.558-252.568-252.568-252.568z" />
-<glyph unicode="" glyph-name="close" d="M958.638-64c-17.43 0-33.407 5.81-46.479 18.882l-893.277 893.277c-26.145 26.145-26.145 66.814 0 92.959s66.814 26.145 92.959 0l893.277-893.277c26.145-26.145 26.145-66.814 0-92.959-13.072-11.62-30.502-18.882-46.479-18.882zM65.362-64c-17.43 0-33.407 5.81-46.479 18.882-26.145 26.145-26.145 66.814 0 92.959l893.277 893.277c26.145 26.145 66.814 26.145 92.959 0s26.145-66.814 0-92.959l-893.277-893.277c-13.072-11.62-29.050-18.882-46.479-18.882z" />
-<glyph unicode="" glyph-name="search" horiz-adv-x="985" d="M404.382 151.236c-104.357 0-208.713 39.134-286.981 117.401-156.535 156.535-156.535 417.427 0 573.962v0c156.535 156.535 417.427 156.535 573.962 0s156.535-417.427 0-573.962c-78.268-78.268-182.624-117.401-286.981-117.401zM182.624 777.376c-117.401-117.401-117.401-313.070 0-436.994 117.401-117.401 313.070-117.401 436.994 0 117.401 117.401 117.401 313.070 0 436.994s-313.070 117.401-436.994 0v0zM932.688-64c-13.045 0-26.089 6.522-32.611 13.045l-300.025 300.025c-19.567 19.567-19.567 52.178 0 71.745s52.178 19.567 71.745 0l300.025-300.025c19.567-19.567 19.567-52.178 0-71.745-13.045-6.522-26.089-13.045-39.134-13.045z" />
+<glyph unicode="" glyph-name="file-down" horiz-adv-x="1001" d="M501.861 189.465c-12.673 0-25.347 5.069-35.485 15.208l-326.97 324.436c-20.277 20.277-20.277 50.693 0 70.97s50.693 20.277 70.97 0l288.95-288.95 288.95 288.95c20.277 20.277 50.693 20.277 70.97 0s20.277-50.693 0-70.97l-321.901-324.436c-10.139-10.139-22.812-15.208-35.485-15.208zM501.861 189.465c-27.881 0-50.693 22.812-50.693 50.693v669.149c0 27.881 22.812 50.693 50.693 50.693s50.693-22.812 50.693-50.693v-669.149c0-27.881-22.812-50.693-50.693-50.693zM950.495-64h-899.802c-27.881 0-50.693 22.812-50.693 50.693v314.297c0 27.881 22.812 50.693 50.693 50.693s50.693-22.812 50.693-50.693v-263.604h798.416v263.604c0 27.881 22.812 50.693 50.693 50.693s50.693-22.812 50.693-50.693v-314.297c0-27.881-22.812-50.693-50.693-50.693z" />
+<glyph unicode="" glyph-name="file-up" horiz-adv-x="1001" d="M950.495-64h-899.802c-27.881 0-50.693 22.812-50.693 50.693v314.297c0 27.881 22.812 50.693 50.693 50.693s50.693-22.812 50.693-50.693v-263.604h798.416v263.604c0 27.881 22.812 50.693 50.693 50.693s50.693-22.812 50.693-50.693v-314.297c0-27.881-22.812-50.693-50.693-50.693zM826.297 534.178c-12.673 0-25.347 5.069-35.485 15.208l-288.95 288.95-291.485-291.485c-20.277-20.277-50.693-20.277-70.97 0s-20.277 50.693 0 70.97l324.436 326.97c20.277 20.277 50.693 20.277 70.97 0l326.97-324.436c20.277-20.277 20.277-50.693 0-70.97-10.139-12.673-22.812-15.208-35.485-15.208zM501.861 189.465c-27.881 0-50.693 22.812-50.693 50.693v669.149c0 27.881 22.812 50.693 50.693 50.693s50.693-22.812 50.693-50.693v-669.149c0-27.881-22.812-50.693-50.693-50.693z" />
+<glyph unicode="" glyph-name="blank" d="M749.469 369.759c-21.962 0-41.18 19.217-41.18 41.18v233.351h-233.351c-21.962 0-41.18 19.217-41.18 41.18s19.217 41.18 41.18 41.18h274.531c21.962 0 41.18-19.217 41.18-41.18v-274.531c0-21.962-19.217-41.18-41.18-41.18zM266.295 161.115c-10.981 0-21.962 2.745-30.198 10.981-16.472 16.472-16.472 41.18 0 57.651l483.174 485.92c16.472 16.472 41.18 16.472 57.651 0s16.472-41.18 0-57.651l-480.429-485.92c-8.236-8.236-19.217-10.981-30.198-10.981zM771.432-64h-521.609c-140.011 0-252.568 112.558-252.568 252.568v521.609c0 140.011 112.558 252.568 252.568 252.568h301.984c21.962 0 41.18-19.217 41.18-41.18s-19.217-41.18-41.18-41.18h-301.984c-93.34 0-170.209-76.869-170.209-170.209v-521.609c0-93.34 76.869-170.209 170.209-170.209h521.609c93.34 0 170.209 76.869 170.209 170.209v301.984c0 21.962 19.217 41.18 41.18 41.18s41.18-19.217 41.18-41.18v-301.984c0-140.011-112.558-252.568-252.568-252.568z" />
+<glyph unicode="" glyph-name="close" d="M958.638-64c-17.43 0-33.407 5.81-46.479 18.882l-893.277 893.277c-26.145 26.145-26.145 66.814 0 92.959s66.814 26.145 92.959 0l893.277-893.277c26.145-26.145 26.145-66.814 0-92.959-13.072-11.62-30.502-18.882-46.479-18.882zM65.362-64c-17.43 0-33.407 5.81-46.479 18.882-26.145 26.145-26.145 66.814 0 92.959l893.277 893.277c26.145 26.145 66.814 26.145 92.959 0s26.145-66.814 0-92.959l-893.277-893.277c-13.072-11.62-29.050-18.882-46.479-18.882z" />
+<glyph unicode="" glyph-name="arrow-b" horiz-adv-x="1929" d="M1823.562 960c28.055 0 56.11-14.027 77.151-35.068 42.082-42.082 35.068-112.219-7.014-147.288l-855.671-813.589c-42.082-42.082-105.205-35.068-147.288 7.014s-35.068 112.219 7.014 147.288l855.671 813.589c21.041 21.041 42.082 28.055 70.137 28.055zM105.205 960c28.055 0 49.096-7.014 70.137-28.055l862.685-813.589c42.082-42.082 42.082-105.205 7.014-147.288-42.082-42.082-105.205-42.082-147.288-7.014l-862.685 813.589c-42.082 42.082-49.096 105.205-7.014 147.288 21.041 21.041 49.096 35.068 77.151 35.068z" />
+<glyph unicode="" glyph-name="arrow-t" horiz-adv-x="1929" d="M105.205-64c-28.055 0-56.11 14.027-77.151 35.068-42.082 42.082-35.068 112.219 7.014 147.288l862.685 813.589c42.082 42.082 112.219 35.068 147.288-7.014 42.082-42.082 35.068-112.219-7.014-147.288l-862.685-813.589c-21.041-21.041-42.082-28.055-70.137-28.055zM1823.562-64c-28.055 0-49.096 7.014-70.137 28.055l-855.671 813.589c-42.082 42.082-42.082 105.205-7.014 147.288 42.082 42.082 105.205 42.082 147.288 7.014l855.671-813.589c42.082-42.082 42.082-105.205 7.014-147.288-21.041-21.041-49.096-35.068-77.151-35.068z" />
+<glyph unicode="" glyph-name="arrow-dl" horiz-adv-x="938" d="M868.709-64c-18.45 0-35.363 6.15-49.201 19.988l-442.811 442.811c-27.676 27.676-27.676 70.727 0 98.402l442.811 442.811c27.676 27.676 70.727 27.676 98.402 0s27.676-70.727 0-98.402l-393.61-393.61 393.61-393.61c27.676-27.676 27.676-70.727 0-98.402-13.838-13.838-30.751-19.988-49.201-19.988zM512-64c-18.45 0-35.363 6.15-49.201 19.988l-442.811 442.811c-27.676 27.676-27.676 70.727 0 98.402l442.811 442.811c27.676 27.676 70.727 27.676 98.402 0s27.676-70.727 0-98.402l-393.61-393.61 393.61-393.61c27.676-27.676 27.676-70.727 0-98.402-13.838-13.838-30.751-19.988-49.201-19.988z" />
+<glyph unicode="" glyph-name="arrow-dr" horiz-adv-x="938" d="M69.189-64c-18.45 0-35.363 6.15-49.201 19.988-27.676 27.676-27.676 70.727 0 98.402l393.61 393.61-393.61 393.61c-27.676 27.676-27.676 70.727 0 98.402s70.727 27.676 98.402 0l442.811-442.811c27.676-27.676 27.676-70.727 0-98.402l-442.811-442.811c-13.838-13.838-30.751-19.988-49.201-19.988zM425.898-64c-18.45 0-35.363 6.15-49.201 19.988-27.676 27.676-27.676 70.727 0 98.402l393.61 393.61-393.61 393.61c-27.676 27.676-27.676 70.727 0 98.402s70.727 27.676 98.402 0l442.811-442.811c27.676-27.676 27.676-70.727 0-98.402l-442.811-442.811c-13.838-13.838-30.751-19.988-49.201-19.988z" />
+<glyph unicode="" glyph-name="arrow-l" horiz-adv-x="581" d="M512-64c-18.45 0-35.363 6.15-49.201 19.988l-442.811 442.811c-27.676 27.676-27.676 70.727 0 98.402l442.811 442.811c27.676 27.676 70.727 27.676 98.402 0s27.676-70.727 0-98.402l-393.61-393.61 393.61-393.61c27.676-27.676 27.676-70.727 0-98.402-13.838-13.838-30.751-19.988-49.201-19.988z" />
+<glyph unicode="" glyph-name="arrow-r" horiz-adv-x="581" d="M69.189-64c-18.45 0-35.363 6.15-49.201 19.988-27.676 27.676-27.676 70.727 0 98.402l393.61 393.61-393.61 393.61c-27.676 27.676-27.676 70.727 0 98.402s70.727 27.676 98.402 0l442.811-442.811c27.676-27.676 27.676-70.727 0-98.402l-442.811-442.811c-13.838-13.838-30.751-19.988-49.201-19.988z" />
+<glyph unicode="" glyph-name="search" horiz-adv-x="985" d="M404.382 151.236c-104.357 0-208.713 39.134-286.981 117.401-156.535 156.535-156.535 417.427 0 573.962v0c156.535 156.535 417.427 156.535 573.962 0s156.535-417.427 0-573.962c-78.268-78.268-182.624-117.401-286.981-117.401zM182.624 777.376c-117.401-117.401-117.401-313.070 0-436.994 117.401-117.401 313.070-117.401 436.994 0 117.401 117.401 117.401 313.070 0 436.994s-313.070 117.401-436.994 0v0zM932.688-64c-13.045 0-26.089 6.522-32.611 13.045l-300.025 300.025c-19.567 19.567-19.567 52.178 0 71.745s52.178 19.567 71.745 0l300.025-300.025c19.567-19.567 19.567-52.178 0-71.745-13.045-6.522-26.089-13.045-39.134-13.045z" />
+<glyph unicode="" glyph-name="minus" d="M0 448c0 37.053 30.316 67.368 67.368 67.368h889.263c37.053 0 67.368-30.316 67.368-67.368s-30.316-67.368-67.368-67.368h-889.263c-37.053 0-67.368 30.316-67.368 67.368z" />
+<glyph unicode="" glyph-name="plus" d="M512-64c-37.053 0-67.368 30.316-67.368 67.368v889.263c0 37.053 30.316 67.368 67.368 67.368s67.368-30.316 67.368-67.368v-889.263c0-37.053-30.316-67.368-67.368-67.368zM0 448c0 37.053 30.316 67.368 67.368 67.368h889.263c37.053 0 67.368-30.316 67.368-67.368s-30.316-67.368-67.368-67.368h-889.263c-37.053 0-67.368 30.316-67.368 67.368z" />
+<glyph unicode="" glyph-name="file-excel" horiz-adv-x="768" d="M739.657 764.238l-167.768 167.768c-17.997 17.997-42.391 28.194-67.787 28.194h-408.122c-52.989-0.2-95.98-43.191-95.98-96.182v-831.838c0-52.992 42.991-95.986 95.982-95.986h575.889c52.992 0 95.984 42.993 95.984 95.986v664.072c-0.003 25.394-10.202 49.99-28.199 67.986zM664.070 704.050h-152.17v152.17l152.17-152.17zM95.98 32.182v831.836h319.938v-207.959c0-26.594 21.393-47.991 47.988-47.991h207.961v-575.888l-575.886 0.002zM420.988 339.143l105.128 154.827h-74.938l-67.659-99.645-67.661 99.645h-74.936l105.128-154.827-104.49-153.888h74.936l67.021 98.708 67.023-98.708h74.936z" />
+<glyph unicode="" glyph-name="file-img" horiz-adv-x="768" d="M739.655 764.039l-167.767 167.767c-17.997 17.997-42.391 28.194-67.787 28.194h-408.121c-52.989-0.2-95.98-43.191-95.98-96.181v-831.837c0-52.991 42.991-95.984 95.982-95.984h575.889c52.991 0 95.982 42.993 95.982 95.984v664.071c-0.002 25.394-10.2 49.989-28.197 67.986zM664.071 703.851h-152.172v152.17l152.172-152.17zM95.98 31.984v831.835h319.937v-207.959c0-26.594 21.395-47.991 47.989-47.991h207.96v-575.887h-575.887zM159.968 127.962h447.914v255.95l-46.99 46.99c-9.399 9.399-24.596 9.399-33.995 0l-174.965-174.963-78.985 78.986c-9.399 9.396-24.596 9.396-33.995 0l-78.985-78.986v-127.977zM255.95 607.871c-52.991 0-95.982-42.991-95.982-95.982s42.991-95.98 95.982-95.98 95.982 42.99 95.982 95.98-42.993 95.982-95.982 95.982z" />
+<glyph unicode="" glyph-name="file-pdf" horiz-adv-x="768" d="M739.655 764.039l-167.767 167.767c-17.997 17.997-42.391 28.194-67.787 28.194h-408.121c-52.989-0.2-95.98-43.191-95.98-96.181v-831.837c0-52.991 42.991-95.984 95.982-95.984h575.889c52.991 0 95.982 42.993 95.982 95.984v664.071c-0.002 25.394-10.2 49.989-28.197 67.986zM664.071 703.851h-152.172v152.17l152.172-152.17zM95.98 31.984v831.835h319.937v-207.959c0-26.594 21.395-47.991 47.989-47.991h207.96v-575.887h-575.887zM596.284 319.324c-24.396 23.997-93.984 17.396-128.776 13-34.392 20.994-57.388 49.989-73.584 92.58 7.798 32.194 20.196 81.186 10.797 111.978-8.398 52.389-75.586 47.19-85.183 11.798-8.799-32.194-0.8-76.986 13.998-134.173-19.997-47.79-49.79-111.978-70.786-148.771-39.992-20.595-93.984-52.389-101.981-92.382-6.599-31.592 51.99-110.377 152.172 62.388 44.79 14.798 93.581 32.994 136.772 40.191 37.794-20.396 81.984-33.995 111.579-33.995 50.987 0.002 55.987 56.391 34.992 77.385zM200.159 163.758c10.199 27.394 48.99 58.986 60.788 69.986-37.992-60.587-60.788-71.386-60.788-69.986zM363.328 544.882c14.798 0 13.398-64.187 3.6-81.583-8.797 27.793-8.598 81.583-3.6 81.583zM314.537 271.736c19.397 33.792 35.993 73.985 49.391 109.38 16.597-30.196 37.794-54.391 60.188-70.987-41.591-8.598-77.784-26.195-109.579-38.392zM577.686 281.733c0 0-9.998-11.996-74.585 15.596 70.188 5.199 81.785-10.796 74.585-15.596z" />
+<glyph unicode="" glyph-name="file-ppt" horiz-adv-x="768" d="M739.655 764.039l-167.767 167.767c-17.997 17.997-42.391 28.194-67.787 28.194h-408.121c-52.989-0.2-95.98-43.191-95.98-96.181v-831.837c0-52.991 42.991-95.984 95.982-95.984h575.889c52.991 0 95.982 42.993 95.982 95.984v664.071c-0.002 25.394-10.2 49.989-28.197 67.986zM664.071 703.851h-152.172v152.17l152.172-152.17zM95.98 31.984v831.835h319.937v-207.959c0-26.594 21.395-47.991 47.989-47.991h207.96v-575.887h-575.887zM239.952 151.961v335.932c0 13.198 10.797 23.995 23.995 23.995h138.373c73.386 0 125.576-53.99 125.576-132.574 0-148.57-137.372-132.973-190.961-132.973v-94.381c0-13.198-10.797-23.997-23.995-23.997h-48.99c-13.2-0.002-23.997 10.799-23.997 23.997zM336.935 326.725h45.989c15.799 0 27.796 4.8 36.194 14.397 16.997 19.598 16.798 56.991 0.2 75.586-8.199 9.198-19.797 13.998-34.793 13.998h-47.79v-103.981h0.2z" />
+<glyph unicode="" glyph-name="file-reg" horiz-adv-x="768" d="M739.655 764.039l-167.767 167.767c-17.997 17.997-42.391 28.194-67.787 28.194h-408.121c-52.989-0.2-95.98-43.191-95.98-96.181v-831.837c0-52.991 42.991-95.984 95.982-95.984h575.889c52.991 0 95.982 42.993 95.982 95.984v664.071c-0.002 25.394-10.2 49.989-28.197 67.986zM664.071 703.851h-152.172v152.17l152.172-152.17zM95.98 31.984v831.835h319.937v-207.959c0-26.594 21.395-47.991 47.989-47.991h207.96v-575.887h-575.887z" />
+<glyph unicode="" glyph-name="file-word" horiz-adv-x="768" d="M739.655 764.039l-167.767 167.767c-17.997 17.997-42.391 28.194-67.787 28.194h-408.121c-52.989-0.2-95.98-43.191-95.98-96.181v-831.837c0-52.991 42.991-95.984 95.982-95.984h575.889c52.991 0 95.982 42.993 95.982 95.984v664.071c-0.002 25.394-10.2 49.989-28.197 67.986zM664.071 703.851h-152.172v152.17l152.172-152.17zM95.98 31.984v831.835h319.937v-207.959c0-26.594 21.395-47.991 47.989-47.991h207.96v-575.887h-575.887zM536.096 477.139c-11.399 0-21.196-7.997-23.397-18.996-41.191-195.362-40.792-190.764-41.992-206.961-0.399 2.401-0.8 5.199-1.398 8.599-1.601 10.199 0.6-0.399-47.19 198.96-2.6 10.799-12.199 18.397-23.397 18.397h-26.596c-10.999 0-20.595-7.598-23.395-18.196-48.791-197.963-47.991-192.363-49.59-207.36-0.2 2.2-0.399 5.001-0.999 8.402-1.4 10.397-28.195 146.572-38.193 197.959-2.2 11.2-11.998 19.397-23.596 19.397h-33.592c-15.596 0-26.995-14.596-23.397-29.595 15.998-65.186 53.39-218.957 66.388-271.946 2.6-10.796 12.197-18.196 23.397-18.196h50.39c10.999 0 20.595 7.401 23.194 18.196l35.794 142.773c2.999 12.398 5 23.997 5.999 34.595l5.799-34.595c0.2-0.8 25.194-100.978 35.794-142.773 2.599-10.598 12.197-18.196 23.194-18.196h49.391c10.999 0 20.597 7.401 23.196 18.196 41.591 163.77 60.388 237.955 68.985 271.946 3.799 15.2-7.598 29.795-23.196 29.795h-31.592v-0.401z" />
+<glyph unicode="" glyph-name="file-zip" horiz-adv-x="768" d="M739.655 764.238l-167.768 167.768c-17.997 17.997-42.391 28.194-67.787 28.194h-408.122c-52.987-0.2-95.979-43.191-95.979-96.182v-831.838c0-52.994 42.991-95.987 95.982-95.987h575.888c52.994 0 95.986 42.993 95.986 95.987v664.072c-0.005 25.394-10.204 49.99-28.201 67.986zM664.069 704.050h-152.172v152.17l152.172-152.17zM95.979 32.182v831.836h319.938v-207.959c0-26.594 21.392-47.991 47.986-47.991h207.962v-575.888l-575.886 0.002zM209.624 263.863l78.923 120.784h-71.374v28.137h112.778v-20.131l-78.694-120.784h79.609v-28.366h-121.244v20.36zM360.826 412.786h33.857v-169.283h-33.857v169.283zM436.309 412.786h55.589c37.517 0 66.342-13.038 66.342-53.072 0-38.661-29.054-56.047-65.425-56.047h-22.647v-60.163h-33.861v169.281zM490.528 330.432c23.332 0 34.542 9.838 34.542 29.281 0 19.674-12.356 26.309-35.687 26.309h-19.214v-55.589h20.36z" />
+<glyph unicode="" glyph-name="cal" horiz-adv-x="964" d="M849.886-64h-735.976c-62.782 0-113.911 51.083-113.911 113.911v637.541c0 62.782 51.083 113.911 113.911 113.911h736.022c62.782 0 113.911-51.083 113.911-113.911v-637.541c-0.046-62.828-51.129-113.911-113.957-113.911zM113.911 704.127c-9.166 0-16.628-7.508-16.628-16.674v-637.541c0-9.166 7.462-16.674 16.628-16.674h736.022c9.166 0 16.628 7.508 16.628 16.674v637.541c0 9.212-7.462 16.674-16.628 16.674h-736.022zM337.265 794.592c0-7.232-5.85-13.082-13.035-13.082h-100.599c-7.186 0-13.035 5.85-13.035 13.082v152.372c0 7.232 5.85 13.082 13.035 13.082h100.599c7.186 0 13.035-5.85 13.035-13.082v-152.372zM753.249 794.592c0-7.232-5.85-13.082-13.035-13.082h-100.599c-7.186 0-13.035 5.85-13.035 13.082v152.372c0 7.232 5.85 13.082 13.035 13.082h100.599c7.186 0 13.035-5.85 13.035-13.082v-152.372zM333.626 432.915c0-14.417-11.7-26.117-26.117-26.117h-74.39c-14.417 0-26.117 11.7-26.117 26.117v74.436c0 14.417 11.7 26.117 26.117 26.117h74.39c14.417 0 26.117-11.7 26.117-26.117v-74.436zM545.234 432.915c0-14.417-11.7-26.117-26.117-26.117h-74.39c-14.417 0-26.117 11.7-26.117 26.117v74.436c0 14.417 11.7 26.117 26.117 26.117h74.39c14.417 0 26.117-11.7 26.117-26.117v-74.436zM756.842 432.915c0-14.417-11.7-26.117-26.117-26.117h-74.39c-14.417 0-26.117 11.7-26.117 26.117v74.436c0 14.417 11.7 26.117 26.117 26.117h74.39c14.417 0 26.117-11.7 26.117-26.117v-74.436zM333.626 230.013c0-14.417-11.7-26.117-26.117-26.117h-74.39c-14.417 0-26.117 11.7-26.117 26.117v74.39c0 14.417 11.7 26.117 26.117 26.117h74.39c14.417 0 26.117-11.7 26.117-26.117v-74.39zM545.234 230.013c0-14.417-11.7-26.117-26.117-26.117h-74.39c-14.417 0-26.117 11.7-26.117 26.117v74.39c0 14.417 11.7 26.117 26.117 26.117h74.39c14.417 0 26.117-11.7 26.117-26.117v-74.39zM756.842 230.013c0-14.417-11.7-26.117-26.117-26.117h-74.39c-14.417 0-26.117 11.7-26.117 26.117v74.39c0 14.417 11.7 26.117 26.117 26.117h74.39c14.417 0 26.117-11.7 26.117-26.117v-74.39z" />
+<glyph unicode="" glyph-name="trash" horiz-adv-x="896" d="M536 128h48c13.255 0 24 10.745 24 24v0 432c0 13.255-10.745 24-24 24v0h-48c-13.255 0-24-10.745-24-24v0-432c0-13.255 10.745-24 24-24v0zM864 800h-164.82l-68 113.4c-17.083 28.11-47.539 46.6-82.314 46.6-0.016 0-0.032 0-0.048 0h-201.637c-0.002 0-0.004 0-0.006 0-34.775 0-65.231-18.49-82.074-46.175l-0.24-0.425-68.040-113.4h-164.82c-17.673 0-32-14.327-32-32v0-32c0-17.673 14.327-32 32-32v0h32v-672c0-53.019 42.981-96 96-96v0h576c53.019 0 96 42.981 96 96v0 672h32c17.673 0 32 14.327 32 32v0 32c0 17.673-14.327 32-32 32v0zM343.68 858.18c2.136 3.511 5.941 5.82 10.286 5.82 0.012 0 0.024 0 0.036 0h187.998c0.004 0 0.009 0 0.014 0 4.345 0 8.15-2.309 10.256-5.767l0.030-0.053 34.92-58.18h-278.44zM736 32h-576v672h576zM312 128h48c13.255 0 24 10.745 24 24v0 432c0 13.255-10.745 24-24 24v0h-48c-13.255 0-24-10.745-24-24v0-432c0-13.255 10.745-24 24-24v0z" />
+<glyph unicode="" glyph-name="file" horiz-adv-x="892" d="M811.952 458.371c-6.798 6.638-18.323 6.369-24.881-0.312l-354.442-362.583c-36.77-37.605-85.595-58.339-137.441-58.339-52.195 0-101.223 20.981-138.117 59.007-75.979 78.412-74.868 206.623 2.535 285.761l432.128 442.041c44.163 45.063 120.411 44.976 164.457 0 46.203-47.307 46.203-124.216 0-171.473l-376.665-384.901c-14.808-15.091-40.023-14.852-54.504 0.465-15.2 16.173-14.539 42.594 1.503 59.007l296.096 302.465c6.79 6.936 6.667 18.069-0.24 24.896l-47.104 46.058c-6.667 6.609-18.316 6.5-24.874-0.24l-296.096-302.465c-53.509-54.737-54.773-143.956-2.832-199.005 26.718-28.287 62.58-43.858 101.1-43.858 37.481 0 72.704 14.91 99.161 41.94l376.672 384.966c84.295 86.227 84.295 226.551 0 312.763-41.214 42.187-96.060 65.434-154.464 65.434s-113.272-23.247-154.486-65.434l-432.128-442.012c-115.334-117.942-116.598-309.379-2.796-426.783 56.124-57.867 130.963-89.771 210.777-89.771 79.16 0 153.607 31.548 209.6 88.863l354.442 362.554c3.304 3.377 5.047 7.742 4.997 12.441 0 4.735-1.939 9.136-5.294 12.382l-47.104 46.131z" />
+<glyph unicode="" glyph-name="arrow-thin-u" d="M877.254 557.254l-320 320c-24.992 24.994-65.514 24.994-90.508 0l-320-320c-24.994-24.994-24.994-65.516 0-90.51 24.994-24.996 65.516-24.996 90.51 0l210.744 210.746v-613.49c0-35.346 28.654-64 64-64s64 28.654 64 64v613.49l210.746-210.746c12.496-12.496 28.876-18.744 45.254-18.744s32.758 6.248 45.254 18.746c24.994 24.994 24.994 65.514 0 90.508z" />
+<glyph unicode="" glyph-name="arrow-thin-r" d="M621.254 82.746l320 320c24.994 24.992 24.994 65.516 0 90.51l-320 320c-24.994 24.992-65.516 24.992-90.51 0-24.994-24.994-24.994-65.516 0-90.51l210.746-210.746h-613.49c-35.346 0-64-28.654-64-64s28.654-64 64-64h613.49l-210.746-210.746c-12.496-12.496-18.744-28.876-18.744-45.254s6.248-32.758 18.744-45.254c24.994-24.994 65.516-24.994 90.51 0z" />
+<glyph unicode="" glyph-name="arrow-thin-d" d="M877.254 338.746l-320-320c-24.992-24.994-65.514-24.994-90.508 0l-320 320c-24.994 24.994-24.994 65.516 0 90.51 24.994 24.996 65.516 24.996 90.51 0l210.744-210.746v613.49c0 35.346 28.654 64 64 64s64-28.654 64-64v-613.49l210.746 210.746c12.496 12.496 28.876 18.744 45.254 18.744s32.758-6.248 45.254-18.746c24.994-24.994 24.994-65.514 0-90.508z" />
+<glyph unicode="" glyph-name="arrow-thin-l" d="M402.746 82.746l-320 320c-24.994 24.992-24.994 65.516 0 90.51l320 320c24.994 24.992 65.516 24.992 90.51 0 24.994-24.994 24.994-65.516 0-90.51l-210.746-210.746h613.49c35.346 0 64-28.654 64-64s-28.654-64-64-64h-613.49l210.746-210.746c12.496-12.496 18.744-28.876 18.744-45.254s-6.248-32.758-18.744-45.254c-24.994-24.994-65.516-24.994-90.51 0z" />
+<glyph unicode="" glyph-name="circle-up" d="M0 448c0-282.77 229.23-512 512-512s512 229.23 512 512-229.23 512-512 512-512-229.23-512-512zM928 448c0-229.75-186.25-416-416-416s-416 186.25-416 416 186.25 416 416 416 416-186.25 416-416zM706.744 290.744l90.512 90.512-285.256 285.254-285.254-285.256 90.508-90.508 194.746 194.744z" />
+<glyph unicode="" glyph-name="circle-right" d="M512 960c-282.77 0-512-229.23-512-512s229.23-512 512-512 512 229.23 512 512-229.23 512-512 512zM512 32c-229.75 0-416 186.25-416 416s186.25 416 416 416 416-186.25 416-416-186.25-416-416-416zM354.744 253.256l90.512-90.512 285.254 285.256-285.256 285.254-90.508-90.508 194.744-194.746z" />
+<glyph unicode="" glyph-name="circle-down" d="M1024 448c0 282.77-229.23 512-512 512s-512-229.23-512-512 229.23-512 512-512 512 229.23 512 512zM96 448c0 229.75 186.25 416 416 416s416-186.25 416-416-186.25-416-416-416-416 186.25-416 416zM317.256 605.256l-90.512-90.512 285.256-285.254 285.254 285.256-90.508 90.508-194.746-194.744z" />
+<glyph unicode="" glyph-name="circle-left" d="M512-64c282.77 0 512 229.23 512 512s-229.23 512-512 512-512-229.23-512-512 229.23-512 512-512zM512 864c229.75 0 416-186.25 416-416s-186.25-416-416-416-416 186.25-416 416 186.25 416 416 416zM669.256 642.744l-90.512 90.512-285.254-285.256 285.256-285.254 90.508 90.508-194.744 194.746z" />
</font></defs></svg>
\ No newline at end of file
Index: base3.10/src/main/webapp/fonts/icomoon.ttf
===================================================================
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream
Index: base3.10/src/main/webapp/WEB-INF/tiles/template/defaultFooter.jsp
===================================================================
--- base3.10/src/main/webapp/WEB-INF/tiles/template/defaultFooter.jsp (revision 58)
+++ base3.10/src/main/webapp/WEB-INF/tiles/template/defaultFooter.jsp (revision 59)
@@ -50,16 +50,8 @@
</div>
<!-- Modal end -->
- <script type="text/javascript" src="<c:url value='/js/user/aos.js'><c:param name="dt" value="${nowDate}"/></c:url>"></script>
- <script src="<c:url value='/js/user/designJS.js'><c:param name="dt" value="${nowDate}"/></c:url>"></script>
+<script src="<c:url value='/js/user/designJS.js'><c:param name="dt" value="${nowDate}"/></c:url>"></script>
<script>
- $(function() {
- AOS.init({
- easing: 'ease-out-back',
- duration: 1000
- }); //slide up animation
- })
-
// 사용자 권한가져오기
function fncGetAuthorCode() {
return "${loginVO.authorCode }"
Index: base3.10/src/main/webapp/WEB-INF/jsp/egovframework/cross/content/about.jsp
===================================================================
--- base3.10/src/main/webapp/WEB-INF/jsp/egovframework/cross/content/about.jsp (revision 58)
+++ base3.10/src/main/webapp/WEB-INF/jsp/egovframework/cross/content/about.jsp (revision 59)
@@ -162,26 +162,24 @@
</div>
</div>
<script>
-$(function() {
- //toggle events
- const masicCcroll = {
- 'animation': function () {
- const controller = new ScrollMagic.Controller();
- //about
- const revealElements = $(".content_wrap ul li, .content_wrap h3, .office_box")
- for (let i = 0; i < revealElements.length; i++) {
+//about
+var controller = new ScrollMagic.Controller();
+var gray = TweenMax.to(".history", 0.5, {background: "rgba(244,244,244,1)"});
+
+// slide
+var bgGray = new ScrollMagic.Scene({triggerElement: ".history", triggerHook:'.5'})
+ .setTween(gray)
+ .duration(300)
+ .addTo(controller);
- const scene2 = new ScrollMagic.Scene({
- triggerElement: revealElements[i],
- triggerHook: 0.7
- })
- .setClassToggle(revealElements[i], "visible") // add class toggle
- .addTo(controller)
- }
+var revealElements = $(".content_wrap ul li, .content_wrap h3, .office_box, .history");
+for (var i=0; i<revealElements.length; i++) {
- }
- }
-
- masicCcroll.animation() //scroll animation
+var scene2 = new ScrollMagic.Scene({
+ triggerElement: revealElements[i],
+ triggerHook: 0.7
})
+.setClassToggle(revealElements[i], "visible") // add class toggle
+.addTo(controller)
+}
</script>
\ No newline at end of file
Index: base3.10/src/main/webapp/WEB-INF/jsp/egovframework/com/cop/bbs/EgovArticleList.jsp
===================================================================
--- base3.10/src/main/webapp/WEB-INF/jsp/egovframework/com/cop/bbs/EgovArticleList.jsp (revision 58)
+++ base3.10/src/main/webapp/WEB-INF/jsp/egovframework/com/cop/bbs/EgovArticleList.jsp (revision 59)
@@ -74,10 +74,7 @@
<div class="search_box" title="<spring:message code="common.searchCondition.msg" />">
<!-- 검색키워드 및 조회버튼 -->
<input class="inputText" name="searchKeyword" type="text" size="35" title="<spring:message code="title.search" /> <spring:message code="input.input" />" value='<c:out value="${searchVO.searchKeyword}"/>' placeholder="제목 또는 내용 또는 작성자를 입력하세요" maxlength="155" >
- <input type="submit" class="btn_search" value="<spring:message code="button.inquire" />" title="<spring:message code="title.inquire" /> <spring:message code="input.button" />" /><!-- 조회 -->
-
- <span class="btn_b"><a href="<c:url value='/cop/bbs/insertArticleView.do?bbsId=${boardMasterVO.bbsId}' />" title="<spring:message code="button.create" /> <spring:message code="input.button" />"><spring:message code="button.create" /></a></span><!-- 등록 -->
-
+ <button type="submit" class="btn_search" value="<spring:message code="button.inquire" />" title="<spring:message code="title.inquire" /> <spring:message code="input.button" />" /><span class="icon-search"></span></button><!-- 조회 -->
</div>
<input name="bbsId" type="hidden" value="${boardMasterVO.bbsId}">
<input name="nttId" type="hidden" value="0">
@@ -176,12 +173,15 @@
</table>
<!-- paging navigation -->
- <div class="bottom_wrap center">
+ <div class="bottom_wrap right">
<div class="pagination">
<ul>
<ui:pagination paginationInfo="${paginationInfo}" type="user" jsFunction="fn_egov_select_linkPage"/>
</ul>
</div>
+ <div class="right">
+ <button type="button" class="btn_l bg_basic" onclick="location.href='<c:url value='/cop/bbs/insertArticleView.do?bbsId=${boardMasterVO.bbsId}' />'" title="<spring:message code="button.create" /> <spring:message code="input.button" />"><spring:message code="button.create" /></button><!-- 등록 -->
+ </div>
</div>
</div>
Index: base3.10/src/main/webapp/WEB-INF/jsp/egovframework/com/cop/bbs/EgovArticleRegist.jsp
===================================================================
--- base3.10/src/main/webapp/WEB-INF/jsp/egovframework/com/cop/bbs/EgovArticleRegist.jsp (revision 58)
+++ base3.10/src/main/webapp/WEB-INF/jsp/egovframework/com/cop/bbs/EgovArticleRegist.jsp (revision 59)
@@ -153,10 +153,129 @@
<noscript class="noScriptTitle"><spring:message code="common.noScriptTitle.msg" /></noscript>
<form:form commandName="articleVO" action="${pageContext.request.contextPath}/cop/bbs/${reBbsId }/insertArticle.do" method="post" onSubmit="fn_egov_regist_article(document.forms[0]); return false;" enctype="multipart/form-data">
- <div class="wTableFrm">
+ <div class="inner">
<!-- 타이틀 -->
<h2>${pageTitle} <spring:message code="title.create" /></h2><!-- 게시글 등록 -->
+ <div class="board_write">
+ <ul>
+ <!--제목-->
+ <li class="must"><strong class="title">제목</strong>
+ <div class="input_wrap">
+ <div class="text_show">
+ <label for="title">제목을 입력해주세요</label>
+ <input type="text" class="inputText width100p" title="제목을 입력해주세요" id="title" >
+ </div>
+ </div>
+ <div class="input_option">
+ <div class="checkbox">
+ <div class="check">
+ <input id="sjBoldAt1" name="sjBoldAt" type="checkbox" value="Y">
+ <label for="sjBoldAt1">제목진하게</label>
+ </div>
+ </div>
+ </div>
+ </li>
+ <!--내용-->
+ <li><strong class="title">내용</strong>
+ <div class="input_wrap">
+ <textarea class="textArea width100p height400" id="text" title="내용을 입력해주세요"></textarea>
+ </div>
+ </li>
+ <!--공지등록-->
+ <li><strong class="title">공지등록</strong>
+ <div class="input_wrap">
+ <div class="checkbox">
+ <div class="check">
+ <input id="rhdwlremdfhr" name="rhdwlremdfhr" type="checkbox" value="Y">
+ <label for="rhdwlremdfhr">공지등록</label>
+ </div>
+ </div>
+ </div>
+ </li>
+ <!--비밀글-->
+ <li><strong class="title">비밀글</strong>
+ <div class="input_wrap">
+ <div class="checkbox">
+ <div class="check">
+ <input id="qlalfrmf" name="qlalfrmf" type="checkbox" value="Y">
+ <label for="qlalfrmf">비밀글</label>
+ </div>
+ </div>
+ </div>
+ </li>
+ <!--익명등록-->
+ <li><strong class="title">익명등록</strong>
+ <div class="input_wrap">
+ <div class="checkbox">
+ <div class="check">
+ <input id="dlraudemdfhr" name="dlraudemdfhr" type="checkbox" value="Y">
+ <label for="dlraudemdfhr">익명등록</label>
+ </div>
+ </div>
+ </div>
+ </li>
+ <!--게시기간-->
+ <li><strong class="title">게시기간</strong>
+ <div class="input_wrap">
+ <div class="date_wrap">
+ <div class="date">
+ <input type="text" class="width120 inputText" id="date1" placeholder="0000-00-00">
+ <label for="date1"><button class="btn_sq_l"><span class="icon-cal"></span></button></label>
+ </div>
+ <em>~</em>
+ <div class="date">
+ <input type="text" class="width120 inputText" id="date2" placeholder="0000-00-00">
+ <label for="date2"><button class="btn_sq_l"><span class="icon-cal"></span></button></label>
+ </div>
+ </div>
+ </div>
+ </li>
+ <!--첨부파일-->
+ <li><strong class="title">첨부파일</strong>
+ <div class="input_wrap file_up">
+ <input type="file" class="inputFile" id="file-upload" title="파일첨부">
+ <label class="btn_m bg_basic btn_file_up" for="file-upload" title="업로드 할 파일을 선택해주세요">파일업로드<span class="icon-file-up"></span></label>
+ </div>
+ <div class="file_list">
+ <div class="file_box">
+ <p>파일명입니다</p>
+ <button title="[파일명입니다]다운" class="btn_inner" value="삭제"><span class="icon-file-down"></span></button>
+ <button title="[파일명입니다]삭제" class="btn_inner" value="삭제"><span class="icon-delete"></span></button>
+ </div>
+ </div>
+ </li>
+ <!--이미지 첨부파일-->
+ <li><strong class="title">첨부파일</strong>
+ <div class="input_wrap file_up">
+ <input type="file" class="inputFile" id="img-upload" title="파일첨부">
+ <label class="btn_m bg_basic btn_file_up" for="img-upload" title="업로드 할 파일을 선택해주세요">파일업로드<span class="icon-file-up"></span></label>
+ </div>
+ <div class="file_list img_type">
+ <div class="file_box bg_box"> <img src="/images/user/sample_writer.jpg" alt="">
+ <p class="blind">파일명입니다</p>
+ <div class="btn_wrap">
+ <button title="[파일명입니다]다운" class="btn_inner" value="삭제"><span class="icon-file-down"></span></button>
+ <button title="[파일명입니다]삭제" class="btn_inner" value="삭제"><span class="icon-delete"></span></button>
+ </div>
+ </div>
+ </div>
+ </li>
+ </ul>
+ </div>
+
+ <!-- 하단 버튼 -->
+ <div class="bottom_wrap between">
+ <div class="left">
+ <button class="btn_l bg_basic" onClick="location.href='<c:url value='/cop/bbs/selectArticleList.do' />?bbsId=${boardMasterVO.bbsId}'" title="<spring:message code="button.list" /> <spring:message code="input.button" />"><spring:message code="button.list" /></button><!-- 목록 -->
+ </div>
+ <div class="right">
+ <button type="submit" class="btn_l bg_basic" value="<spring:message code="button.create" />" title="<spring:message code="button.create" /> <spring:message code="input.button" />"><spring:message code="button.create" /></button><!-- 등록 -->
+ </div>
+ </div>
+
+ <!-- 다솜 ver -->
+
<!-- 등록폼 -->
<table class="wTable" summary="<spring:message code="common.summary.list" arguments="${pageTitle}" />">
<caption>${pageTitle } <spring:message code="title.create" /></caption>
@@ -249,12 +368,12 @@
</c:if>
</tbody>
</table>
-
- <!-- 하단 버튼 -->
+
<div class="btn">
<input type="submit" class="s_submit" value="<spring:message code="button.create" />" title="<spring:message code="button.create" /> <spring:message code="input.button" />" /><!-- 등록 -->
<span class="btn_s"><a href="<c:url value='/cop/bbs/selectArticleList.do' />?bbsId=${boardMasterVO.bbsId}" title="<spring:message code="button.list" /> <spring:message code="input.button" />"><spring:message code="button.list" /></a></span><!-- 목록 -->
- </div><div style="clear:both;"></div>
+ </div>
+
</div>
<input type="hidden" name="pageIndex" value="<c:out value='${searchVO.pageIndex}'/>"/>
Index: base3.10/src/main/webapp/WEB-INF/jsp/index.jsp
===================================================================
--- base3.10/src/main/webapp/WEB-INF/jsp/index.jsp (revision 58)
+++ base3.10/src/main/webapp/WEB-INF/jsp/index.jsp (revision 59)
@@ -22,26 +22,27 @@
<!--slide-->
<div class="swiper-slide bg_box"> <img src="/images/user/main_bg.jpg" alt="">
- <div class="inner"><em class="rellax" title="cross street" data-rellax-speed="4">cross street</em> <strong data-swiper-parallax="-2000" class="rellax" data-rellax-speed="3">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</strong>
- <p data-swiper-parallax="-3000" class="rellax" data-rellax-speed="2">조선 시대 가장 존경받는 정승이 누구인지 물어보면 누구나 이견 없이 황희 정승을 꼽을 것이다.<br>
+ <div class="inner"><em title="cross street">cross street</em> <strong>허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</strong>
+ <p>조선 시대 가장 존경받는 정승이 누구인지 물어보면 누구나 이견 없이 황희 정승을 꼽을 것이다.<br>
황희는 현재의 국무총리 역할인 조선 시대 정승이었던 좌의정, 우의정, 영의정을 무려 25년 가까이 수행하였다.</p>
- <button data-swiper-parallax="-4000" onClick="location.href='/content/common/article_view.html'" class="rellax" data-rellax-speed="1">show more</button>
+ <button onClick="location.href='/content/common/article_view.html'">show more</button>
</div>
</div>
<div class="swiper-slide bg_box"> <img src="/images/user/main_bg.jpg" alt="">
- <div class="inner"><em class="rellax" title="cross street" data-rellax-speed="4">cross street</em> <strong data-swiper-parallax="-2000" class="rellax" data-rellax-speed="3">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</strong>
- <p data-swiper-parallax="-3000" class="rellax" data-rellax-speed="2">조선 시대 가장 존경받는 정승이 누구인지 물어보면 누구나 이견 없이 황희 정승을 꼽을 것이다.<br>
+ <div class="inner"><em title="cross street">cross street</em> <strong>허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</strong>
+ <p>조선 시대 가장 존경받는 정승이 누구인지 물어보면 누구나 이견 없이 황희 정승을 꼽을 것이다.<br>
황희는 현재의 국무총리 역할인 조선 시대 정승이었던 좌의정, 우의정, 영의정을 무려 25년 가까이 수행하였다.</p>
- <button data-swiper-parallax="-4000" onClick="location.href='/content/common/article_view.html'" class="rellax" data-rellax-speed="1">show more</button>
+ <button onClick="location.href='/content/common/article_view.html'">show more</button>
</div>
</div>
<div class="swiper-slide bg_box"> <img src="/images/user/main_bg.jpg" alt="">
- <div class="inner"><em class="rellax" title="cross street" data-rellax-speed="4">cross street</em> <strong data-swiper-parallax="-2000" class="rellax" data-rellax-speed="3">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</strong>
- <p data-swiper-parallax="-3000" class="rellax" data-rellax-speed="2">조선 시대 가장 존경받는 정승이 누구인지 물어보면 누구나 이견 없이 황희 정승을 꼽을 것이다.<br>
+ <div class="inner"><em title="cross street">cross street</em> <strong>허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</strong>
+ <p>조선 시대 가장 존경받는 정승이 누구인지 물어보면 누구나 이견 없이 황희 정승을 꼽을 것이다.<br>
황희는 현재의 국무총리 역할인 조선 시대 정승이었던 좌의정, 우의정, 영의정을 무려 25년 가까이 수행하였다.</p>
- <button data-swiper-parallax="-4000" onClick="location.href='/content/common/article_view.html'" class="rellax" data-rellax-speed="1">show more</button>
+ <button onClick="location.href='/content/common/article_view.html'">show more</button>
</div>
</div>
+
<!--slide-->
</div>
@@ -55,20 +56,19 @@
<div class="rellax" data-rellax-speed="4">
<div class="hotClick">
<div class="title_wrap">
- <h2 data-aos="zoom-in">hot click</h2>
+ <h2>hot click</h2>
</div>
<ol class="listshow">
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
- <li data-aos="zoom-in"><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
+ <li><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
+ <li><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
+ <li><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
+ <li><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
+ <li><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
+ <li><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
+ <li><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
+ <li><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
+ <li><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
+ <li><a href="javascript:void(0)" title="APCTP 2021 올해의 과학도서">APCTP 2021 올해의 과학도서</a></li>
</ol>
</div>
</div>
@@ -76,19 +76,19 @@
<!--recent articles start-->
<div class="article_list main_wrap rearticle rellax" data-rellax-speed="3">
<div class="title_wrap">
- <h2 data-aos="zoom-in">recent articles</h2>
- <button type="button" class="showmore" data-aos="zoom-in" data-aos-delay="200" >show more<span class="icon-arrow-r"></span></button>
+ <h2>recent articles</h2>
+ <button type="button" class="showmore" >show more<span class="icon-arrow-r"></span></button>
</div>
<ul class="listshow">
- <li data-aos="zoom-in"> <a href="/content/common/article_view.html" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경" > <img src="/images/user/sample1.jpg" alt="우주이미지"> </a> <a href="#!" class="category">Cross Street</a> <a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
+ <li> <a href="/content/common/article_view.html" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경" > <img src="/images/user/sample1.jpg" alt="우주이미지"> </a> <a href="#!" class="category">Cross Street</a> <a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
<p class="by"> <a href="/content/common/writer_list.html" title="작가 정보" class="writer">강성주</a><em>국립과천과학관</em></p>
<p class="text"> <a href="/content/common/article_view.html" class="textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">조선 시대 가장 존경받는 정승이 누구인지 물어보면 누구나 이견 없이 황희 정승을 꼽을 것이다. 황희는 현재의 국무총리 역할인 조선 시대 정승이었던 좌의정, 우의정, 영의정을 무려 25년 가까이 수행하였다. 황희는 현재의 국무총리 역할인 조선 시대 정승이었던 좌의정, 우의정, 영의정을 무려 25년 가까이 수행하였다.</a> </p>
</li>
- <li data-aos="zoom-in"> <a href="/content/common/article_view.html" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경" > <img src="/images/user/sample1.jpg" alt="우주이미지"> </a> <a href="#!" class="category">Cross Street</a> <a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
+ <li> <a href="/content/common/article_view.html" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경" > <img src="/images/user/sample1.jpg" alt="우주이미지"> </a> <a href="#!" class="category">Cross Street</a> <a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
<p class="by"> <a href="/content/common/writer_list.html" title="작가 정보" class="writer">강성주</a><em>국립과천과학관</em></p>
<p class="text"> <a href="/content/common/article_view.html" class="textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">조선 시대 가장 존경받는 정승이 누구인지 물어보면 누구나 이견 없이 황희 정승을 꼽을 것이다. 황희는 현재의 국무총리 역할인 조선 시대 정승이었던 좌의정, 우의정, 영의정을 무려 25년 가까이 수행하였다. 황희는 현재의 국무총리 역할인 조선 시대 정승이었던 좌의정, 우의정, 영의정을 무려 25년 가까이 수행하였다.</a> </p>
</li>
- <li data-aos="zoom-in"> <a href="/content/common/article_view.html" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경" > <img src="/images/user/sample1.jpg" alt="우주이미지"> </a> <a href="#!" class="category">Cross Street</a> <a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
+ <li> <a href="/content/common/article_view.html" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경" > <img src="/images/user/sample1.jpg" alt="우주이미지"> </a> <a href="#!" class="category">Cross Street</a> <a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
<p class="by"> <a href="/content/common/writer_list.html" title="작가 정보" class="writer">강성주</a><em>국립과천과학관</em></p>
<p class="text"> <a href="/content/common/article_view.html" class="textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">조선 시대 가장 존경받는 정승이 누구인지 물어보면 누구나 이견 없이 황희 정승을 꼽을 것이다. 황희는 현재의 국무총리 역할인 조선 시대 정승이었던 좌의정, 우의정, 영의정을 무려 25년 가까이 수행하였다. 황희는 현재의 국무총리 역할인 조선 시대 정승이었던 좌의정, 우의정, 영의정을 무려 25년 가까이 수행하였다.</a> </p>
</li>
@@ -96,19 +96,19 @@
</div>
<!--recent articles end-->
<!--videos start-->
- <div class="article_list main_wrap rellax" data-rellax-speed="2">
+ <div class="article_list main_wrap rellax videos" data-rellax-speed="2">
<div class="title_wrap">
- <h2 data-aos="zoom-in">videos</h2>
- <button type="button" class="showmore" data-aos="zoom-in" data-aos-delay="200">show more<span class="icon-arrow-r"></span></button>
+ <h2>videos</h2>
+ <button type="button" class="showmore">show more<span class="icon-arrow-r"></span></button>
</div>
<ul class="listshow">
- <li data-aos="zoom-in"><a href="#!" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경"><img src="/images/user/sample1.jpg" alt="우주이미지"></a><a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
+ <li><a href="#!" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경"><img src="/images/user/sample1.jpg" alt="우주이미지"></a><a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
<p class="time">05:00</p>
</li>
- <li data-aos="zoom-in"><a href="#!" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경"><img src="/images/user/sample1.jpg" alt="우주이미지"></a><a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
+ <li><a href="#!" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경"><img src="/images/user/sample1.jpg" alt="우주이미지"></a><a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
<p class="time">05:00</p>
</li>
- <li data-aos="zoom-in"><a href="#!" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경"><img src="/images/user/sample1.jpg" alt="우주이미지"></a><a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
+ <li><a href="#!" class="bg_box" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경"><img src="/images/user/sample1.jpg" alt="우주이미지"></a><a href="#!" class="title textover" title="허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경">허블 우주망원경의 업적 그리고 천문학의 새로운 역사의 시작, 제임스 웹 우주망원경</a>
<p class="time">05:00</p>
</li>
</ul>
@@ -119,17 +119,17 @@
<ul>
<li>
<div class="title_wrap">
- <h2 data-aos="zoom-in">APCTP's choice</h2>
+ <h2>APCTP's choice</h2>
</div>
- <a href="javascript:void(0)" title="올해의 과학도서"><img src="/images/user/book1.png" alt="" data-aos="zoom-in" data-aos-delay="500">
- <div class="bg_box" data-aos="zoom-in" data-aos-delay="200"><img src="/images/user/banner1.jpg" alt="">올해의 과학도서</div>
+ <a href="javascript:void(0)" title="올해의 과학도서"><img src="/images/user/book1.png" alt="">
+ <div class="bg_box"><img src="/images/user/banner1.jpg" alt="">올해의 과학도서</div>
</a></li>
<li>
<div class="title_wrap">
- <h2 data-aos="zoom-in" data-aos-delay="300">book report</h2>
+ <h2>book report</h2>
</div>
- <a href="javascript:void(0)" title="올해의 과학도서"><img src="/images/user/book2.png" alt="" data-aos="zoom-in" data-aos-delay="600">
- <div class="bg_box" data-aos="zoom-in" data-aos-delay="400"><img src="/images/user/banner2.jpg" alt="">올해의 과학도서<br>
+ <a href="javascript:void(0)" title="올해의 과학도서"><img src="/images/user/book2.png" alt="">
+ <div class="bg_box"><img src="/images/user/banner2.jpg" alt="">올해의 과학도서<br>
청소년 독후감 대회 수상작</div>
</a></li>
</ul>
@@ -138,10 +138,10 @@
<!--notice start-->
<div class="notice main_wrap rellax" data-rellax-speed="0">
<div class="title_wrap">
- <h2 data-aos="zoom-in"><a href="/content/common/notice_list.html" title="뉴스바로가기" >news & notice</a></h2>
- <button type="button" class="showmore" onClick="location.href='/content/common/notice_list.html'" title="뉴스바로가기" data-aos="zoom-in" data-aos-delay="100">show more<span class="icon-arrow-r"></span></button>
+ <h2><a href="/content/common/notice_list.html" title="뉴스바로가기" >news & notice</a></h2>
+ <button type="button" class="showmore" onClick="location.href='/content/common/notice_list.html'" title="뉴스바로가기">show more<span class="icon-arrow-r"></span></button>
</div>
- <div class="swiper news_slide" data-aos="fade-left" data-aos-delay="300">
+ <div class="swiper news_slide">
<div class="swiper-wrapper">
<!--slide-->
<div class="swiper-slide"><a href="/content/common/notice_list.html" class="textover" title="[과학 커뮤니케이선 강연] 2021 APCTP 공통 과학
@@ -171,10 +171,47 @@
</div>
<!--notice end-->
</div>
- <div class="bg_box rellax" data-rellax-speed="-1" data-aos="zoom-in" data-aos-anchor-placement="center-center"> <img src="/images/user/main_bgwave.svg" alt=""> </div>
+ <div class="bg_box bg_wave"> <img src="/images/user/main_bgwave.svg" alt=""> </div>
</div>
+<script>
+ $(function(){
+
+ var controller = new ScrollMagic.Controller();
+ // build tween
+ var tween = TweenMax.to(".main_slide", 0.5, {opacity: "0"}),
+ height = $(".main_slide").outerHeight();
+ var wave = TweenMax.to(".bg_wave", 0.5, {opacity: "1"}),
+ waveHeight = $(".bg_wave").outerHeight();
+
+ // slide
+ var scene = new ScrollMagic.Scene({triggerElement: ".main_slide", triggerHook:'0'})
+ .duration(height)
+ .setTween(tween)
+ //.addIndicators({name: "main_slide"})
+ .addTo(controller);
+
+ //bg wave
+ var sceneWave = new ScrollMagic.Scene({triggerElement: ".videos", triggerHook:'.2'})
+ .duration(waveHeight)
+ .setTween(wave)
+ //.addIndicators({name: "wave"})
+ .addTo(controller)
+
+ var revealElements = $(".title_wrap, .hotClick, .main_wrap")
+ for (var i=0; i<revealElements.length; i++) {
+ var scene2 = new ScrollMagic.Scene({
+ triggerElement: revealElements[i],
+ triggerHook: 0.7
+ })
+ .setClassToggle(revealElements[i], "active") // add class toggle
+ .addTo(controller)
+ //.addIndicators({name: "each"})
+ }
+
+});
+
+</script>
<script type="text/javascript" src="<c:url value='/js/user/rellax.js'><c:param name="dt" value="${nowDate}"/></c:url>"></script>
-<script src="<c:url value='/js/user/jquery.easeScroll.js'><c:param name="dt" value="${nowDate}"/></c:url>"></script>
<script>
var rellax = new Rellax('.rellax'); //parallax
</script>
\ No newline at end of file
Index: base3.10/src/main/webapp/images/user/radio_on.svg
===================================================================
--- base3.10/src/main/webapp/images/user/radio_on.svg (nonexistent)
+++ base3.10/src/main/webapp/images/user/radio_on.svg (revision 59)
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+ width="8.779px" height="8.779px" viewBox="0 0 8.779 8.779" enable-background="new 0 0 8.779 8.779" xml:space="preserve">
+<g>
+ <g>
+ <g>
+ <linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="1.0437" y1="4.3899" x2="7.7322" y2="4.3899">
+ <stop offset="0" style="stop-color:#007FC5"/>
+ <stop offset="1" style="stop-color:#36459A"/>
+ </linearGradient>
+ <circle fill="url(#SVGID_1_)" cx="4.388" cy="4.39" r="3.344"/>
+ </g>
+ </g>
+</g>
+</svg>
Index: base3.10/src/main/webapp/images/user/check_on.svg
===================================================================
--- base3.10/src/main/webapp/images/user/check_on.svg (nonexistent)
+++ base3.10/src/main/webapp/images/user/check_on.svg (revision 59)
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.2.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+ viewBox="0 0 8.8 8.8" style="enable-background:new 0 0 8.8 8.8;" xml:space="preserve">
+<style type="text/css">
+ .st0{fill:#333333;}
+</style>
+<g>
+ <g>
+ <path class="st0" d="M3.3,6.7L1.2,4.6c-0.1-0.1-0.1-0.3,0-0.5l0.5-0.5c0.1-0.1,0.3-0.1,0.5,0l1.4,1.4l3.1-3.1
+ c0.1-0.1,0.3-0.1,0.5,0l0.5,0.5c0.1,0.1,0.1,0.3,0,0.5L3.8,6.7C3.7,6.9,3.5,6.9,3.3,6.7L3.3,6.7z"/>
+ </g>
+</g>
+</svg>
Index: base3.10/src/main/webapp/js/user/designJS.js
===================================================================
--- base3.10/src/main/webapp/js/user/designJS.js (revision 58)
+++ base3.10/src/main/webapp/js/user/designJS.js (revision 59)
@@ -2,55 +2,54 @@
/**함수**/
"use strict";
///// 웹접근성을 위한 본문 바로가기 ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
-var skip = {
- 'skipPage' : function() {
-
- $('.skip a').on('focus', function(){
- $(this).stop().animate({"top":0, "opacity":1});
- });
- $('.skip a').on('click', function(){
- $(this).stop().animate({"top":"-30px", "opacity":0});
- });
- $('.skip a').on('focusout', function(){
- $(this).stop().animate({"top":"-30px", "opacity":0});
- });
- }
+ var skip = {
+ 'skipPage' : function() {
+
+ $('.skip a').on('focus', function(){
+ $(this).stop().animate({"top":0, "opacity":1});
+ });
+ $('.skip a').on('click', function(){
+ $(this).stop().animate({"top":"-30px", "opacity":0});
+ });
+ $('.skip a').on('focusout', function(){
+ $(this).stop().animate({"top":"-30px", "opacity":0});
+ });
+ }
};
///// img background ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
var imgBg = {
- 'bgImg' : function() {
- $(".bg_box").each(function(){
- var bg_box = $(this).children("img").attr("src");
- $(this).css({backgroundImage: "url(" + bg_box + ")"});
- });
- },
- //버튼 배경 이미지 넣기
- 'btnImg' : function() {
- $(".btn_img").each(function(){
- var btn_img = $(this).children("img").attr("src");
- $(this).css({backgroundImage: "url(" + btn_img + ")"});
- });
+ 'bgImg' : function() {
+ $(".bg_box").each(function(){
+ var bg_box = $(this).children("img").attr("src");
+ $(this).css({backgroundImage: "url(" + bg_box + ")"});
+ });
+ },
+ //버튼 배경 이미지 넣기
+ 'btnImg' : function() {
+ $(".btn_img").each(function(){
+ var btn_img = $(this).children("img").attr("src");
+ $(this).css({backgroundImage: "url(" + btn_img + ")"});
+ });
+ }
}
-}
///// icon ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
- var icon = {
+var icon = {
//icon
'icon' : function() {
- if (!('boxShadow' in document.body.style)) {
- document.body.setAttribute('class', 'noBoxShadow');
- }
-
- document.body.addEventListener("click", function(e) {
- var target = e.target;
- if (target.tagName === "INPUT" &&
- target.getAttribute('class').indexOf('liga') === -1) {
- target.select();
- }
- });
+ if (!('boxShadow' in document.body.style)) {
+ document.body.setAttribute('class', 'noBoxShadow');
+ }
+ document.body.addEventListener("click", function(e) {
+ var target = e.target;
+ if (target.tagName === "INPUT" &&
+ target.getAttribute('class').indexOf('liga') === -1) {
+ target.select();
+ }
+ });
}
};
@@ -76,66 +75,66 @@
});
}
};
-
+
///// slick ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
var slide = {
- 'basicslide' : function() {
-
- var swiper = new Swiper(".main_slide", {
- speed: 600,
- keyboard: {
- enabled: true,
- },
- parallax: true,
- pagination: {
- el: ".swiper-pagination",
- clickable: true,
- },
- navigation: {
- nextEl: ".swiper-button-next",
- prevEl: ".swiper-button-prev",
- },
- });
+ 'basicslide' : function() {
+
+ var swiper = new Swiper(".main_slide", {
+ speed: 600,
+ keyboard: {
+ enabled: true,
+ },
+ parallax: true,
+ pagination: {
+ el: ".swiper-pagination",
+ clickable: true,
+ },
+ navigation: {
+ nextEl: ".swiper-button-next",
+ prevEl: ".swiper-button-prev",
+ },
+ });
- var swiperNews = new Swiper(".news_slide", {
- slidesPerView: 4,
- spaceBetween: 30,
- speed: 600,
- keyboard: {
- enabled: true,
- },
- pagination: {
- el: ".swiper-pagination",
- type: "progressbar",
- },
- navigation: {
- nextEl: ".swiper-button-next",
- prevEl: ".swiper-button-prev",
- },
- });
-
- var swiperMove = new Swiper(".move", {
- slidesPerView: "auto",
- speed: 600,
- keyboard: {
- enabled: true,
- },
- });
-
- //slide width
- var docWidth = $(document).outerWidth();
- var inner = $(".inner").outerWidth();
- var cal = (docWidth - inner) / 2;
-
- $(".news_slide").width(inner + cal);
- $(".news_slide .swiper-button-prev, .news_slide .swiper-button-next").css({right: cal});
+ var swiperNews = new Swiper(".news_slide", {
+ slidesPerView: 4,
+ spaceBetween: 30,
+ speed: 600,
+ keyboard: {
+ enabled: true,
+ },
+ pagination: {
+ el: ".swiper-pagination",
+ type: "progressbar",
+ },
+ navigation: {
+ nextEl: ".swiper-button-next",
+ prevEl: ".swiper-button-prev",
+ },
+ });
+
+ var swiperMove = new Swiper(".move", {
+ slidesPerView: "auto",
+ speed: 600,
+ keyboard: {
+ enabled: true,
+ },
+ });
+
+ //slide width
+ var docWidth = $(document).outerWidth();
+ var inner = $(".inner").outerWidth();
+ var cal = (docWidth - inner) / 2;
+
+ $(".news_slide").width(inner + cal);
+ $(".news_slide .swiper-button-prev, .news_slide .swiper-button-next").css({right: cal});
- }
+ }
};
///// scroll ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
-// 스크롤 시 top버튼 토글 함수
+//스크롤 시 top버튼 토글 함수
function scrollEvent() {
var scroll = $(window).scrollTop();
@@ -169,27 +168,20 @@
// toggle events
var toggle = {
'togglelist' : function(){
- //toggle list
- $('.toggle_tit').on('click', function(){
- if ($(this).next('.toggle_box').css('display') == 'none') {
- $('.toggle_box').slideUp();
- $('.toggle_tit').removeClass('active');
- $(this).addClass('active');
- $(this).next(".toggle_box").slideDown();
- } else {
- $('.toggle_box').slideUp();
- $(this).removeClass('active');
- }
- });
- }
+ //toggle list
+ $('.toggle_tit').on('click', function(){
+ if ($(this).next('.toggle_box').css('display') == 'none') {
+ $('.toggle_box').slideUp();
+ $('.toggle_tit').removeClass('active');
+ $(this).addClass('active');
+ $(this).next(".toggle_box").slideDown();
+ } else {
+ $('.toggle_box').slideUp();
+ $(this).removeClass('active');
+ }
+ });
+ }
}
-
-
-//// magic scroll ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
-
-
-
-
///// tab ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
var tabs = {
@@ -491,23 +483,33 @@
}
}
-$(document).ready(function() {
+///// etc ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+var etc = {
+ 'etc': function () {
+
+//must * 추가
+$(".must").find("strong.title").append("<b class='mustText'>*</b>");
+
+ }
+}
- /**이벤트**/
- $(window).scroll(function() {
- scrollEvent(); //scroll events
- });
- inputFocus.focus(); //inputText focus 이벤트
- popup.popup(); //popup
- tabs.tabs() //tabs
- imgBg.bgImg(); //img background
- skip.skipPage(); //웹접근성을 위한 본문 바로가기
- delay() //스크롤 애니메이션 제어
- slide.basicslide(); //카드 형식의 슬라이드쇼
- icon.icon() //arrow icon
- scrollmove() //메뉴 클릭시 해당 화면으로 scroll이동
- toggle.togglelist() //toggle
+$(document).ready(function() {
+ /**이벤트**/
+ $(window).scroll(function() {
+ scrollEvent(); //scroll events
+ });
+ inputFocus.focus(); //inputText focus 이벤트
+ popup.popup(); //popup
+ tabs.tabs() //tabs
+ imgBg.bgImg(); //img background
+ skip.skipPage(); //웹접근성을 위한 본문 바로가기
+ delay() //스크롤 애니메이션 제어
+ slide.basicslide(); //카드 형식의 슬라이드쇼
+ icon.icon() //arrow icon
+ scrollmove() //메뉴 클릭시 해당 화면으로 scroll이동
+ toggle.togglelist() //toggle
+ etc.etc()
});
})();
\ No newline at end of file
Index: base3.10/src/main/webapp/html/design/css/style.css
===================================================================
--- base3.10/src/main/webapp/html/design/css/style.css (revision 58)
+++ base3.10/src/main/webapp/html/design/css/style.css (revision 59)
@@ -236,15 +236,28 @@
::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: rgba(25,25,25,0.5); -webkit-border-radius: 8px; border-radius: 8px; }
input[type='checkbox'] { width:18px; height:18px; opacity:1; margin:0 10px 0 0; z-index:0; position:relative; cursor:pointer; }
-input[type='checkbox']::before { content:''; pointer-events:none; background:url(../../images/custom/check_on.svg) 50% 50% no-repeat #fff; background-size:contain; border:1px solid #333; width:calc(100% - 2px); height:calc(100% - 2px); display:inline-block; border-radius:2px; opacity:0; top:0; left:0; position:absolute; }
+input[type='checkbox']::before { content:''; pointer-events:none; background:url(/images/user/check_on.svg) 50% 50% no-repeat #fff; background-size:contain; border:1px solid #333; width:calc(100% - 2px); height:calc(100% - 2px); display:inline-block; border-radius:2px; opacity:0; top:0; left:0; position:absolute; }
input[type='checkbox']:checked::before { opacity:1; z-index:1; }
input[type='checkbox']:checked + label { font-weight:600; }
input[type='radio'] { width:18px; height:18px; opacity:1; margin:0 10px 0 0; z-index:1; position:relative; cursor:pointer; }
-input[type='radio']::before { content:''; pointer-events:none; background:url(../../images/custom/radio_on.svg) 50% 50% no-repeat #fff; background-size:10px; width:calc(100% - 2px); height:calc(100% - 2px); border:1px solid #333; display:inline-block; border-radius:30px; opacity:0; top:0; left:0; position:absolute; }
+input[type='radio']::before { content:''; pointer-events:none; background:url(/images/user/radio_on.svg) 50% 50% no-repeat #fff; background-size:10px; width:calc(100% - 2px); height:calc(100% - 2px); border:1px solid #333; display:inline-block; border-radius:30px; opacity:0; top:0; left:0; position:absolute; }
input[type='radio']:checked::before { opacity:1; z-index:1; }
input[type='radio']:checked + label { font-weight:600; }
+/*체크,라디오 기본정렬*/
+.checkbox { display:flex; flex-wrap:wrap; margin:-5px; }
+.checkbox .check { display:flex; align-items: center; margin:5px 20px 5px 5px; }
+
+/*날짜선택*/
+.date_wrap { display:flex; flex-wrap:wrap; align-items: center; }
+.date_wrap > em { margin:0 5px; }
+.date_wrap .date { display:flex; border:1px solid #ccc; border-radius:5px; transition:all 0.3s; }
+.date_wrap .date .btn_sq_l { font-size:1.3em; color:#727272; }
+.date_wrap .date .btn_sq_l:hover { color:#333; }
+.date_wrap .date:hover { box-shadow:0 0 10px 0 rgba(0,0,0,0.2); border-color:#999; }
+.date_wrap .date .inputText, .date .btn_sq_l { border:none; background:none; }
+.date_wrap .date .inputText:hover, .date .btn_sq_l:hover { box-shadow:none; }
/*가로,세로,마진,패딩 설정****************************************************************************************************************************************/
/* 가로사이즈% (테이블 col class로 사용 필요할 경우 class 추가) */
Index: base3.10/src/main/webapp/html/design/css/board.css
===================================================================
--- base3.10/src/main/webapp/html/design/css/board.css (revision 58)
+++ base3.10/src/main/webapp/html/design/css/board.css (revision 59)
@@ -31,6 +31,7 @@
.board_write ul > li::after { content:''; display:block; clear:both; }
.board_write ul > li .input_wrap { margin-bottom:5px; }
.board_write ul > li .input_wrap:last-child { margin-bottom:0; }
+.board_write ul > li .input_option { margin-top:15px; }
.caption { display:block; margin-bottom:20px; }
.caption .must { font-weight:600; color:#555; }
Index: base3.10/src/main/webapp/html/design/images/user/radio_on.svg
===================================================================
--- base3.10/src/main/webapp/html/design/images/user/radio_on.svg (nonexistent)
+++ base3.10/src/main/webapp/html/design/images/user/radio_on.svg (revision 59)
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+ width="8.779px" height="8.779px" viewBox="0 0 8.779 8.779" enable-background="new 0 0 8.779 8.779" xml:space="preserve">
+<g>
+ <g>
+ <g>
+ <linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="1.0437" y1="4.3899" x2="7.7322" y2="4.3899">
+ <stop offset="0" style="stop-color:#007FC5"/>
+ <stop offset="1" style="stop-color:#36459A"/>
+ </linearGradient>
+ <circle fill="url(#SVGID_1_)" cx="4.388" cy="4.39" r="3.344"/>
+ </g>
+ </g>
+</g>
+</svg>
Index: base3.10/src/main/webapp/html/design/images/user/check_on.svg
===================================================================
--- base3.10/src/main/webapp/html/design/images/user/check_on.svg (nonexistent)
+++ base3.10/src/main/webapp/html/design/images/user/check_on.svg (revision 59)
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.2.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+ viewBox="0 0 8.8 8.8" style="enable-background:new 0 0 8.8 8.8;" xml:space="preserve">
+<style type="text/css">
+ .st0{fill:#333333;}
+</style>
+<g>
+ <g>
+ <path class="st0" d="M3.3,6.7L1.2,4.6c-0.1-0.1-0.1-0.3,0-0.5l0.5-0.5c0.1-0.1,0.3-0.1,0.5,0l1.4,1.4l3.1-3.1
+ c0.1-0.1,0.3-0.1,0.5,0l0.5,0.5c0.1,0.1,0.1,0.3,0,0.5L3.8,6.7C3.7,6.9,3.5,6.9,3.3,6.7L3.3,6.7z"/>
+ </g>
+</g>
+</svg>
Index: base3.10/src/main/webapp/html/design/content/common/notice_write.html
===================================================================
--- base3.10/src/main/webapp/html/design/content/common/notice_write.html (revision 58)
+++ base3.10/src/main/webapp/html/design/content/common/notice_write.html (revision 59)
@@ -21,7 +21,9 @@
</div>
</div>
<div class="inner">
- <div class="caption alignR"><p class="must"><em>*</em> 는 필수항목입니다</p></div>
+ <div class="caption alignR">
+ <p class="must"><em>*</em> 는 필수항목입니다</p>
+ </div>
<div class="board_write">
<ul>
<!--제목-->
@@ -32,48 +34,67 @@
<input type="text" class="inputText width100p" title="제목을 입력해주세요" id="title" >
</div>
</div>
+ <div class="input_option">
+ <div class="checkbox">
+ <div class="check">
+ <input id="sjBoldAt1" name="sjBoldAt" type="checkbox" value="Y">
+ <label for="sjBoldAt1">제목진하게</label>
+ </div>
+ </div>
+ </div>
</li>
- <!--카테고리-->
- <li><strong class="title">카테고리</strong>
- <em class="exp">※ 업체를 홍보할 수 있는 자료를 업로드해주세요 (회사소개서, 리플렛 등)</em>
+ <!--내용-->
+ <li><strong class="title">내용</strong>
<div class="input_wrap">
- <select class="selectText width200" id="realmCodeLclas" title="대분류를 선택하세요">
- <option value="0">대분류</option>
- </select>
- <select class="selectText width200" id="realmCodeSclas" title="소분류를 선택하세요">
- <option value="">소분류</option>
- </select>
+ <textarea class="textArea width100p height400" id="text" title="내용을 입력해주세요"></textarea>
</div>
- <div class="category_wrap">
- <div class="category">
- <p>Cross Street</p>
- <button type="button" class="btn_inner" value="삭제" title="[Cross Street]삭제"><span class="icon-delete"><em class="blind">삭제</em></span></button>
+ </li>
+ <!--공지등록-->
+ <li><strong class="title">공지등록</strong>
+ <div class="input_wrap">
+ <div class="checkbox">
+ <div class="check">
+ <input id="rhdwlremdfhr" name="rhdwlremdfhr" type="checkbox" value="Y">
+ <label for="rhdwlremdfhr">공지등록</label>
+ </div>
</div>
</div>
</li>
- <!--내용-->
- <li><strong class="title">내용</strong>
+ <!--비밀글-->
+ <li><strong class="title">비밀글</strong>
<div class="input_wrap">
- <div class="text_show">
- <label for="text">내용을 입력해주세요</label>
- <textarea class="textArea width100p height400" id="text" title="내용을 입력해주세요"></textarea>
+ <div class="checkbox">
+ <div class="check">
+ <input id="qlalfrmf" name="qlalfrmf" type="checkbox" value="Y">
+ <label for="qlalfrmf">비밀글</label>
+ </div>
</div>
</div>
</li>
- <!--링크-->
- <li><strong class="title">링크</strong>
+ <!--익명등록-->
+ <li><strong class="title">익명등록</strong>
<div class="input_wrap">
- <div class="text_show">
- <label for="link">링크를 입력해주세요</label>
- <input type="url" class="inputText calc50 fl" title="링크를 입력해주세요" id="link" >
- <button title="추가" class="btn_sq_l ml5" value="삭제"><span class="icon-plus"></span></button>
+ <div class="checkbox">
+ <div class="check">
+ <input id="dlraudemdfhr" name="dlraudemdfhr" type="checkbox" value="Y">
+ <label for="dlraudemdfhr">익명등록</label>
+ </div>
</div>
</div>
+ </li>
+ <!--게시기간-->
+ <li><strong class="title">게시기간</strong>
<div class="input_wrap">
- <div class="text_show">
- <label for="link2">링크를 입력해주세요</label>
- <input type="url" class="inputText calc50 fl" title="링크를 입력해주세요" id="link2" >
- <button title="추가" class="btn_sq_l ml5" value="삭제"><span class="icon-minus"></span></button>
+ <div class="date_wrap">
+ <div class="date">
+ <input type="text" class="width120 inputText" id="date1" placeholder="0000-00-00">
+ <label for="date1"><button class="btn_sq_l"><span class="icon-cal"></span></button></label>
+ </div>
+ <em>~</em>
+ <div class="date">
+ <input type="text" class="width120 inputText" id="date2" placeholder="0000-00-00">
+ <label for="date2"><button class="btn_sq_l"><span class="icon-cal"></span></button></label>
+ </div>
</div>
</div>
</li>
@@ -110,9 +131,12 @@
</ul>
</div>
<div class="bottom_wrap between">
- <div class="left"><button type="button" class="btn_l bg_basic" onclick="location.href='notice_list.html'">목록</button></div>
- <div class="right"><button type="button" class="btn_l bg_basic" onclick="location.href='notice_list.html'">저장</button></div>
-
+ <div class="left">
+ <button type="button" class="btn_l bg_basic" onclick="location.href='notice_list.html'">목록</button>
+ </div>
+ <div class="right">
+ <button type="button" class="btn_l bg_basic" onclick="location.href='notice_list.html'">저장</button>
+ </div>
</div>
</div>
</div>
Index: base3.10/src/main/webapp/html/design/content/common/notice_write - 복사.html
===================================================================
--- base3.10/src/main/webapp/html/design/content/common/notice_write - 복사.html (nonexistent)
+++ base3.10/src/main/webapp/html/design/content/common/notice_write - 복사.html (revision 59)
@@ -0,0 +1,140 @@
+<? include_once("../../inc/header.html") ?>
+<body>
+<? include_once("../../inc/top.html") ?>
+<div class="sub_container" id="contents">
+ <div class="sub_title">
+ <div class="inner">
+ <div class="sub_title_top">
+ <div class="breadcrumb">
+ <ul>
+ <li class="home"><a href="/" title="메인화면으로 이동" class="link">home</a></li>
+ <li class="next"><span class="icon-arrow-r"></span><em class="blind">다음</em></li>
+ <li class="btn_location"> <a class="now link" href="/content/common/notice_list.html" title="공지사항">공지사항</a> </li>
+ <li class="next"><span class="icon-arrow-r"></span><em class="blind">다음</em></li>
+ <li class="btn_location"><strong><span class="blind">현재페이지</span>공지사항 작성</strong></li>
+ </ul>
+ </div>
+ </div>
+ <div class="title">
+ <h2>공지사항 작성</h2>
+ <em>notice & board</em> </div>
+ </div>
+ </div>
+ <div class="inner">
+ <div class="caption alignR">
+ <p class="must"><em>*</em> 는 필수항목입니다</p>
+ </div>
+ <div class="board_write">
+ <ul>
+ <!--제목-->
+ <li class="must"><strong class="title">제목</strong>
+ <div class="input_wrap">
+ <div class="text_show">
+ <label for="title">제목을 입력해주세요</label>
+ <input type="text" class="inputText width100p" title="제목을 입력해주세요" id="title" >
+ </div>
+ </div>
+ <div class="input_wrap">
+ <div class="checkbox">
+ <div class="check">
+ <input id="sjBoldAt1" name="sjBoldAt" type="checkbox" value="Y">
+ <label for="sjBoldAt1">제목진하게</label>
+ </div>
+ </div>
+ </div>
+ </li>
+ <!--카테고리-->
+ <li><strong class="title">카테고리</strong> <em class="exp">※ 업체를 홍보할 수 있는 자료를 업로드해주세요 (회사소개서, 리플렛 등)</em>
+ <div class="input_wrap">
+ <select class="selectText width200" id="realmCodeLclas" title="대분류를 선택하세요">
+ <option value="0">대분류</option>
+ </select>
+ <select class="selectText width200" id="realmCodeSclas" title="소분류를 선택하세요">
+ <option value="">소분류</option>
+ </select>
+ </div>
+ <div class="category_wrap">
+ <div class="category">
+ <p>Cross Street</p>
+ <button type="button" class="btn_inner" value="삭제" title="[Cross Street]삭제"><span class="icon-delete"><em class="blind">삭제</em></span></button>
+ </div>
+ </div>
+ </li>
+ <!--내용-->
+ <li><strong class="title">내용</strong>
+ <div class="input_wrap">
+ <div class="text_show">
+ <label for="text">내용을 입력해주세요</label>
+ <textarea class="textArea width100p height400" id="text" title="내용을 입력해주세요"></textarea>
+ </div>
+ </div>
+ </li>
+ <!--링크-->
+ <li><strong class="title">링크</strong>
+ <div class="input_wrap">
+ <div class="text_show">
+ <label for="link">링크를 입력해주세요</label>
+ <input type="url" class="inputText calc50 fl" title="링크를 입력해주세요" id="link" >
+ <button title="추가" class="btn_sq_l ml5" value="삭제"><span class="icon-plus"></span></button>
+ </div>
+ </div>
+ <div class="input_wrap">
+ <div class="text_show">
+ <label for="link2">링크를 입력해주세요</label>
+ <input type="url" class="inputText calc50 fl" title="링크를 입력해주세요" id="link2" >
+ <button title="추가" class="btn_sq_l ml5" value="삭제"><span class="icon-minus"></span></button>
+ </div>
+ </div>
+ </li>
+ <!--첨부파일-->
+ <li><strong class="title">첨부파일</strong>
+ <div class="input_wrap file_up">
+ <input type="file" class="inputFile" id="file-upload" title="파일첨부">
+ <label class="btn_m bg_basic btn_file_up" for="file-upload" title="업로드 할 파일을 선택해주세요">파일업로드<span class="icon-file-up"></span></label>
+ </div>
+ <div class="file_list">
+ <div class="file_box">
+ <p>파일명입니다</p>
+ <button title="[파일명입니다]다운" class="btn_inner" value="삭제"><span class="icon-file-down"></span></button>
+ <button title="[파일명입니다]삭제" class="btn_inner" value="삭제"><span class="icon-delete"></span></button>
+ </div>
+ </div>
+ </li>
+ <!--이미지 첨부파일-->
+ <li><strong class="title">첨부파일</strong>
+ <div class="input_wrap file_up">
+ <input type="file" class="inputFile" id="img-upload" title="파일첨부">
+ <label class="btn_m bg_basic btn_file_up" for="img-upload" title="업로드 할 파일을 선택해주세요">파일업로드<span class="icon-file-up"></span></label>
+ </div>
+ <div class="file_list img_type">
+ <div class="file_box bg_box"> <img src="/images/user/sample_writer.jpg" alt="">
+ <p class="blind">파일명입니다</p>
+ <div class="btn_wrap">
+ <button title="[파일명입니다]다운" class="btn_inner" value="삭제"><span class="icon-file-down"></span></button>
+ <button title="[파일명입니다]삭제" class="btn_inner" value="삭제"><span class="icon-delete"></span></button>
+ </div>
+ </div>
+ </div>
+ </li>
+ </ul>
+ </div>
+ <div class="bottom_wrap between">
+ <div class="left">
+ <button type="button" class="btn_l bg_basic" onclick="location.href='notice_list.html'">목록</button>
+ </div>
+ <div class="right">
+ <button type="button" class="btn_l bg_basic" onclick="location.href='notice_list.html'">저장</button>
+ </div>
+ </div>
+ </div>
+</div>
+<? include_once("../../inc/footer.html") ?>
+<script>
+ $(".notice_list ul li").each(function(){
+ if ( $(this).hasClass("new") ){
+ $(this).find(".num").text("new");
+ };
+ });
+ </script>
+</body>
+</html>
\ No newline at end of file
Property changes on: base3.10/src/main/webapp/html/design/content/common/notice_write - 복사.html
___________________________________________________________________
Added: svn:mime-type
+ text/plain
Add a comment
Delete comment
Once you delete this comment, you won't be able to recover it. Are you sure you want to delete this comment?