tolag3/koipa_edu_2025-1
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'sub'

Browse Source
This commit is contained in:
subsub 2025-10-16 15:59:48 +09:00
commit e80d63b9c8
29 changed files with 158 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/main/webapp/WEB-INF/jsp/uss/ion/pwm/PopupZoneModify.jsp
View File

@ -406,7 +406,7 @@ function fn_egov_downFile(atchFileId, fileSn){
<div class="btn_wrap btn_layout01"> <div class="btn_wrap btn_layout01">
<div class="area_left"> <div class="area_left">
<c:if test="${!empty popupzoneVO.pozId }"> <c:if test="${!empty popupzoneVO.pozId }">
<button type="button" class="btnType07" onclick="fn_popupzone_delete(); return false;" >삭 제</button> <button type="button" class="btnType07 btn line red large" onclick="fn_popupzone_delete(); return false;" >삭 제</button>
</c:if> </c:if>
</div> </div>
<div class="area_right"> <div class="area_right">

7
src/main/webapp/WEB-INF/jsp/web/com/webCommonFooter.jsp
View File

@ -50,6 +50,13 @@ function footerSiteLinkPageGo (){
<li><a href="#">이메일무단수집거부</a></li> <li><a href="#">이메일무단수집거부</a></li>
<li><a href="#">찾아오시는 길</a></li> <li><a href="#">찾아오시는 길</a></li>
</ul> </ul>
<ul class="sns">
<li><a href="#"><img src="/ipedu/visitEdu/usr/publish/images/common/sns_youtube.png" alt=""></a></li>
<li><a href="#"><img src="/ipedu/visitEdu/usr/publish/images/common/sns_blog.png" alt=""></a></li>
<li><a href="#"><img src="/ipedu/visitEdu/usr/publish/images/common/sns_insta.png" alt=""></a></li>
<li><a href="#"><img src="/ipedu/visitEdu/usr/publish/images/common/sns_facebook.png" alt=""></a></li>
<li><a href="#"><img src="/ipedu/visitEdu/usr/publish/images/common/sns_twitter.png" alt=""></a></li>
</ul>
</div> </div>
</div> </div>
<div class="area_bottom"> <div class="area_bottom">

19
src/main/webapp/WEB-INF/jsp/web/main/mainPage.jsp
View File

@ -156,11 +156,8 @@ function fn_egov_inqire_data(bbsId, nttId) {
<main class="main"> <main class="main">
<section class="section section01" style="background-image:url('${backgroundUrl}');"> <section class="section section01" style="background-image:url('${backgroundUrl}');">
<div class="inner"> <div class="inner">
<p class="main_title">지식재산 보호 교육 시스템</p>
<ul class="box_wrap"> <ul class="box_wrap">
<li>
<p>한국지식재산보호원</p>
<span>지식재산 보호 교육 시스템</span>
</li>
<li> <li>
<div class="box"> <div class="box">
<p class="title">상표권 교육조건부 기소유예</p> <p class="title">상표권 교육조건부 기소유예</p>
@ -189,6 +186,20 @@ function fn_egov_inqire_data(bbsId, nttId) {
</div> </div>
</li> </li>
</ul> </ul>
<ul class="info">
<li>
<i class="icon call"></i>
<p>대표번호 : <b>1670-1271</b></p>
</li>
<li>
<i class="icon mail"></i>
<p>이메일 : <b>ipedu@koipa.re.kr</b></p>
</li>
<li>
<i class="icon fax"></i>
<p>팩스 : <b>02-6499-3010</b></p>
</li>
</ul>
</div> </div>
</section> </section>

30
src/main/webapp/visitEdu/adm/publish/css/content_sub.css
View File

@ -73,26 +73,26 @@
.btn_layout01{width: 100%; display: flex; justify-content: space-between; margin-bottom: 30px;} .btn_layout01{width: 100%; display: flex; justify-content: space-between; margin-bottom: 30px;}
.btn_layout01 .area_left{background-color: #fff; box-shadow: none;} .btn_layout01 .area_left{background-color: #fff; box-shadow: none;}
.btn_layout01 .area_right{text-align: right; background-color: #fff;} .btn_layout01 .area_right{text-align: right; background-color: #fff;}
.btn_layout01 button{vertical-align: middle; margin: 0 2px; transition: all 0.1s linear;} .btn_layout01 button{vertical-align: middle; margin: 0 2px; transition: all 0.3s;}
.btn_layout01 button:hover{box-shadow: 0 0 5px rgba(0,0,0,0.3); transition: all 0.1s linear;} .btn_layout01 button:hover{box-shadow: 0 0 8px rgba(0,0,0,0.15);}
.btn_layout01 .area_left button:first-child{margin-left: 0;} .btn_layout01 .area_left button:first-child{margin-left: 0;}
.btn_layout01 .area_right button:last-child{margin-right: 0;} .btn_layout01 .area_right button:last-child{margin-right: 0;}
.btn_layout02{width: 100%; text-align: right; margin-bottom: 10px; margin-top: 0;} .btn_layout02{width: 100%; text-align: right; margin-bottom: 10px; margin-top: 0;}
.btn_layout02 button{margin: 0 2px; transition: all 0.1s linear;} .btn_layout02 button{margin: 0 2px; transition: all 0.3s linear;}
.btn_layout02 button:hover{box-shadow: 0 0 5px rgba(0,0,0,0.3); transition: all} .btn_layout02 button:hover{box-shadow: 0 0 5px rgba(0,0,0,0.3); transition: all}
.btnType01{height: 38px; padding: 0 20px; font-size: 16px; font-weight: 400; background-color: #fff; color: #2557B4; border: 1px solid #2557B4; border-radius: 5px; transition: all 0.1s linear;} .btnType01{height: 38px; padding: 0 20px; font-size: 16px; font-weight: 400; background-color: #fff; color: #2557B4; border: 1px solid #2557B4; border-radius: 5px; transition: all 0.3s linear;}
.btnType01:hover{background-color: #214EA2; transition: all 0.1s linear;} .btnType01:hover{background-color: #F4F7FB; transition: all 0.3s linear;}
.btnType02{height: 46px; padding: 0 23px; font-size: 18px; font-weight: 400; color: #fff; background-color: #2557B4; border-radius: 5px; transition: all 0.1s linear;} .btnType02{height: 46px; padding: 0 23px; font-size: 18px; font-weight: 400; color: #fff; background-color: #2557B4; border-radius: 5px; transition: all 0.3s linear;}
.btnType02:hover{ background-color: #214EA2; transition: all 0.1s linear;} .btnType02:hover{ background-color: #214EA2; transition: all 0.3s linear;}
.btnType03{height: 46px; padding: 0 23px; font-size: 18px; font-weight: 400; color: #fff; background-color: #81899C; border-radius: 5px; transition: all 0.1s linear;} .btnType03{height: 46px; padding: 0 23px; font-size: 18px; font-weight: 400; color: #fff; background-color: #81899C; border-radius: 5px; transition: all 0.3s linear;}
.btnType03:hover{background-color: #717379; transition: all 0.1s linear;} .btnType03:hover{background-color: #717379; transition: all 0.3s linear;}
.btnType04{min-width: 80px; height: 46px; padding: 0 12px; font-size: 18px; font-weight: 400; color: #81899C; border: 1px solid #81899C; border-radius: 5px; transition: all 0.1s linear;} .btnType04{min-width: 80px; height: 46px; padding: 0 12px; font-size: 18px; font-weight: 400; color: #81899C; border: 1px solid #81899C; border-radius: 5px; transition: all 0.3s linear;}
.btnType04:hover{background-color: #F5F6F7; transition: all 0.1s linear;} .btnType04:hover{background-color: #F5F6F7; transition: all 0.3s linear;}
.btnType05{height: 46px; padding: 0 12px; font-size: 18px; font-weight: 400; color: #81899C; border: 1px solid #81899C; border-radius: 5px; transition: all 0.1s linear;} .btnType05{height: 46px; padding: 0 12px; font-size: 18px; font-weight: 400; color: #81899C; border: 1px solid #81899C; border-radius: 5px; transition: all 0.3s linear;}
.btnType05:hover{background-color: #f5f5f5; transition: all 0.1s linear;} .btnType05:hover{background-color: #f5f5f5; transition: all 0.3s linear;}
.btnType06{min-width: 80px; height: 46px; padding: 0 12px; font-size: 18px; font-weight: 400; background-color: #F86A3C; color: #fff; border-radius: 5px; transition: all 0.1s linear;} .btnType06{min-width: 80px; height: 46px; padding: 0 12px; font-size: 18px; font-weight: 400; background-color: #F86A3C; color: #fff; border-radius: 5px; transition: all 0.3s linear;}
.btnType06:hover{background-color: #df5f36; transition: all 0.1s linear;} .btnType06:hover{background-color: #df5f36; transition: all 0.3s linear;}
/* 관리자 calendar */ /* 관리자 calendar */
.date_format {width: 60px !important;} .date_format {width: 60px !important;}

4
src/main/webapp/visitEdu/adm/publish/css/popup.css
View File

@ -61,8 +61,7 @@
/* 사진등록 */ /* 사진등록 */
.pop_tb_type02 tbody tr td .put_photo {position: absolute; right: 0; top: 0; border-left: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; background-color: #fff; text-align: center;} .pop_tb_type02 tbody tr td .put_photo {position: absolute; right: 0; top: 0; border-left: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; background-color: #fff; text-align: center;}
.pop_tb_type02 tbody tr td .put_photo .put_photo_in {background-color: #f5f5f5; width: 84px; height: 109px; border: 1px solid #d5d5d5; border-radius: 5px; margin: 5px; box-sizing: border-box; position: relative; overflow: hidden;} .pop_tb_type02 tbody tr td .put_photo .put_photo_in {background-color: #f5f5f5; width: 84px; height: 109px; border: 1px solid #d5d5d5; border-radius: 5px; margin: 5px; box-sizing: border-box; position: relative; overflow: hidden;}
.pop_tb_type02 tbody tr td .put_photo .put_photo_in img.id_pic {width: 100%; height: 100%; padding-top: initial;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); .pop_tb_type02 tbody tr td .put_photo .put_photo_in img.id_pic {width: 100%; height: 100%; padding-top: initial;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
}
/* 강의 지역 */ /* 강의 지역 */
.pop_tb_type02 td .river_area {display: flex; justify-content: space-between; width: calc(100% - 45px); margin: 10px 0;} .pop_tb_type02 td .river_area {display: flex; justify-content: space-between; width: calc(100% - 45px); margin: 10px 0;}
@ -77,6 +76,7 @@
.pop_tb_type02 td .river_area dl dd .city li ul.active {display:block;} .pop_tb_type02 td .river_area dl dd .city li ul.active {display:block;}
.pop_tb_type02 td .river_area dl dd .city li ul li {margin:7px 0 6px;} .pop_tb_type02 td .river_area dl dd .city li ul li {margin:7px 0 6px;}
.pop_tb_type02 td .river_area dl dd .area_list li {font-size:16px;font-weight:400;line-height:30px;color:#222;} .pop_tb_type02 td .river_area dl dd .area_list li {font-size:16px;font-weight:400;line-height:30px;color:#222;}
.pop_tb_type02 .upload_area{padding:10px;}
.pop_tb_type04{margin-bottom: 25px; max-height: 500px; overflow-y: scroll;} .pop_tb_type04{margin-bottom: 25px; max-height: 500px; overflow-y: scroll;}
.pop_tb_type04>table{width: 100%; table-layout: fixed; border-top: 2px solid #000;} .pop_tb_type04>table{width: 100%; table-layout: fixed; border-top: 2px solid #000;}

26
src/main/webapp/visitEdu/usr/publish/css/common.css
View File

@ -111,11 +111,13 @@ nav .btn_identify i{display:inline-block;width:100%;height:100%;background:url(/
/* footer */ /* footer */
footer{width:100%;background:#262628;} footer{width:100%;background:#262628;}
footer .area_top{padding:40px 0;border-bottom:1px solid #434344;} footer .area_top{padding:40px 0;border-bottom:1px solid #434344;}
footer .area_top .inner{display:flex;justify-content:space-between;align-items:center;}
footer .area_top ul{display:flex;align-items:center;} footer .area_top ul{display:flex;align-items:center;}
footer .area_top ul a{position:relative;padding:0 20px;font-size:2.3rem;color:#e0dede;} footer .area_top ul:not(.sns) a{position:relative;padding:0 20px;font-size:2.1rem;color:#e0dede;}
footer .area_top ul a::after{position:absolute;content:"";width:2px;height:12px;background:#72787D;right:0;top:7px;} footer .area_top ul:not(.sns) a::after{position:absolute;content:"";width:2px;height:12px;background:#72787D;right:0;top:7px;}
footer .area_top ul li:last-child a::after{display:none;} footer .area_top ul:not(.sns) li:last-child a::after{display:none;}
footer .area_top li:first-child a{color:#118be5;font-weight:700;padding:0 20px 0 0;} footer .area_top ul:not(.sns) li:first-child a{color:#118be5;font-weight:700;padding:0 20px 0 0;}
footer .area_top .sns{gap:46px;}
footer .area_bottom .inner{display:flex;padding:60px 0 100px 0;gap:170px;align-items:center;} footer .area_bottom .inner{display:flex;padding:60px 0 100px 0;gap:170px;align-items:center;}
footer address{color:#8a8a8a;} footer address{color:#8a8a8a;}
footer address p{font-size:2.3rem;line-height:1.5;margin:0 0 8px 0;} footer address p{font-size:2.3rem;line-height:1.5;margin:0 0 8px 0;}
@ -162,9 +164,12 @@ footer address span{font-size:2.3rem;font-weight:600;color:#c4c4c4;}
footer .inner{padding:0;} footer .inner{padding:0;}
footer .area_top{padding:100px 60px;} footer .area_top{padding:100px 60px;}
footer .area_top ul{flex-direction:column;align-items:flex-start;gap:60px;} footer .area_top .inner{flex-direction:column;align-items:flex-start;}
footer .area_top ul a{font-size:5.6rem;padding:0;} footer .area_top ul:not(.sns){flex-direction:column;align-items:flex-start;gap:60px;}
footer .area_top ul a::after{display:none;} footer .area_top ul:not(.sns) a{font-size:5.6rem;padding:0;}
footer .area_top ul:not(.sns) a::after{display:none;}
footer .sns{width:100%;margin:50px 0 0 0;padding:20px 50px;background:#323235;border-radius:10px;justify-content:space-between;box-sizing:border-box;}
footer .area_bottom .inner{flex-direction:column;align-items:flex-start;padding:94px 60px;gap:140px;;} footer .area_bottom .inner{flex-direction:column;align-items:flex-start;padding:94px 60px;gap:140px;;}
footer address p,footer address span{font-size:5.2rem;} footer address p,footer address span{font-size:5.2rem;}
@ -183,8 +188,8 @@ footer address span{font-size:2.3rem;font-weight:600;color:#c4c4c4;}
header nav .logo img{width:100%;height:auto;} header nav .logo img{width:100%;height:auto;}
footer .area_top{padding:50px 30px;} footer .area_top{padding:50px 30px;}
footer .area_top ul{gap:30px;} footer .area_top ul:not(.sns){gap:30px;}
footer .area_top ul a{font-size:2.8rem;} footer .area_top ul:not(.sns) a{font-size:2.8rem;}
footer .area_bottom .inner{padding:47px 30px;gap:70px;} footer .area_bottom .inner{padding:47px 30px;gap:70px;}
footer .area_bottom .mobile{max-width:70%;} footer .area_bottom .mobile{max-width:70%;}
@ -204,5 +209,6 @@ footer address span{font-size:2.3rem;font-weight:600;color:#c4c4c4;}
.all_menu_wrap .logo img{width:100%;} .all_menu_wrap .logo img{width:100%;}
footer .area_bottom .inner{gap:35px;} footer .area_bottom .inner{gap:35px;}
footer .area_top ul a,footer address p, footer address span{font-size:2rem;} footer .area_top ul:not(.sns) a,footer address p, footer address span{font-size:2rem;}
footer .area_top .sns{padding:30px 10px;gap:0;}
} }

12
src/main/webapp/visitEdu/usr/publish/css/font.css
View File

@ -68,6 +68,18 @@
font-display: swap; font-display: swap;
} }
@font-face {
font-family: 'Gmarket Sans TTF';
src: url('/ipedu/visitEdu/usr/publish/css/font/GmarketSansTTFMedium.eot');
src: url('/ipedu/visitEdu/usr/publish/css/font/GmarketSansTTFMedium.eot?#iefix') format('embedded-opentype'),
url('/ipedu/visitEdu/usr/publish/css/font/GmarketSansTTFMedium.woff2') format('woff2'),
url('/ipedu/visitEdu/usr/publish/css/font/GmarketSansTTFMedium.woff') format('woff'),
url('/ipedu/visitEdu/usr/publish/css/font/GmarketSansTTFMedium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face { @font-face {
font-family: 'Gmarket Sans TTF'; font-family: 'Gmarket Sans TTF';
src: url('/ipedu/visitEdu/usr/publish/css/font/GmarketSansTTFBold.eot'); src: url('/ipedu/visitEdu/usr/publish/css/font/GmarketSansTTFBold.eot');

105
src/main/webapp/visitEdu/usr/publish/css/main.css
View File

@ -1,4 +1,4 @@
.main{width:100%;margin:140px 0 0 0;} .main{width:100%;margin:145px 0 0 0;}
.section{padding:60px 0;box-sizing:border-box;} .section{padding:60px 0;box-sizing:border-box;}
.main_title{display:flex;align-items:center;margin:0 0 25px 0;} .main_title{display:flex;align-items:center;margin:0 0 25px 0;}
.main_title h2.title{font-size:3.5rem;font-weight:500;color:#333;} .main_title h2.title{font-size:3.5rem;font-weight:500;color:#333;}
@ -8,32 +8,45 @@
.main_title .btn_plus:hover i{transform:rotate(180deg);transition:transform 0.2s;} .main_title .btn_plus:hover i{transform:rotate(180deg);transition:transform 0.2s;}
/* section01 */ /* section01 */
.section01{position:relative;background-repeat:no-repeat;background-position: 10% calc(100% + 30px);} .section01{position:relative;padding:90px 0;}
.section01::after{position:absolute;content:"";width:100%;height:100%;background:url(/ipedu/visitEdu/usr/publish/images/main/sec01_bg.jpg) no-repeat;background-size:cover;left:0;top:0;z-index:-1;} .section01::before{position:absolute;content:"";width:100%;height:100%;background-image: url(../images/main/sec01_left_obj.png), url(../images/main/sec01_right_obj.png);background-repeat:no-repeat;background-position: left bottom, right top;left:0;top:0;z-index:-1;}
.section01 .box_wrap{display:flex;width:68%;flex-wrap:wrap;gap:30px;margin:0 0 0 auto;} .section01::after{position:absolute;content:"";width:100%;height:100%;background:linear-gradient(360deg,rgba(255, 255, 255, 1) 66%, rgba(214, 229, 243, 1) 100%);;background-size:cover;left:0;top:0;z-index:-2;}
.section01 .box_wrap li{width:calc(50% - 30px);padding:45px 40px;border-radius:20px;box-sizing:border-box;} .section01 .inner{background-image: url(../images/main/sec01_left_icon.png), url(../images/main/sec01_right_icon.png);background-repeat:no-repeat;background-position: 30px 15px, calc(100% - 60px) 15px;}
.section01 .box_wrap .box{display:flex;min-height:160px;flex-direction:column;justify-content:space-between;word-break:keep-all;} .section01 .main_title{font-family:'Gmarket Sans TTF';font-size:5.3rem;font-weight:bold;color:#253c69;letter-spacing:-.45px;line-height:1.5;justify-content:center;}
.section01 .box_wrap li .title{font-size:2.7rem;font-weight:500;color:#fff;letter-spacing:-.45px;line-height:1.3;} .section01 .box_wrap{display:flex;width:100%;flex-wrap:wrap;gap:30px;margin:0 0 0 auto;}
.section01 .box_wrap li:first-child{display:flex;color:#2e4677;padding:0;flex-direction:column;justify-content:center;} .section01 .box_wrap li{width:calc((100% / 3) - 20px);padding:45px 40px;border-radius:20px;box-sizing:border-box;}
.section01 .box_wrap li:first-child p{font-size:3rem;font-weight:500;line-height:1.5;} .section01 .box_wrap .box{display:flex;min-height:220px;flex-direction:column;justify-content:space-between;word-break:keep-all;}
.section01 .box_wrap li:first-child span{font-family:'Gmarket Sans TTF';font-size:3.9rem;font-weight:bold;letter-spacing:-.45px;line-height:1.5;} .section01 .box_wrap li .title{font-size:3.1rem;font-weight:500;color:#fff;letter-spacing:-.45px;line-height:1.3;}
.section01 .box_wrap li:nth-child(2){background:#0f8deb url(/ipedu/visitEdu/usr/publish/images/main/logo_skyblue.png) no-repeat calc(100% + 75px) calc(100% + 51px);}
.section01 .box_wrap li:nth-child(3){background:#1e4aa4 url(/ipedu/visitEdu/usr/publish/images/main/logo_blue.png) no-repeat calc(0% - 69px) 96px;} .section01 .box_wrap li:nth-child(1){background:#0f8deb url(/ipedu/visitEdu/usr/publish/images/main/logo_skyblue.png) no-repeat calc(100% + 75px) calc(100% + 51px);}
.section01 .box_wrap li:nth-child(4){background:#01a3cc url(/ipedu/visitEdu/usr/publish/images/main/logo_mint.png) no-repeat calc(100% + 42px) calc(100% + 9px);} .section01 .box_wrap li:nth-child(2){background:#1e4aa4 url(/ipedu/visitEdu/usr/publish/images/main/logo_blue.png) no-repeat calc(0% - 69px) 96px;}
.section01 .box_wrap li:nth-child(3){background:#01a3cc url(/ipedu/visitEdu/usr/publish/images/main/logo_mint.png) no-repeat calc(100% + 42px) calc(100% + 9px);}
.section01 .link_area{display:flex;align-items:center;gap:13px;} .section01 .link_area{display:flex;align-items:center;gap:13px;}
.section01 .btn{display:flex;width:160px;height:56px;font-size:2.1rem;font-weight:500;border-radius:60px;align-items:center;justify-content:center;transition:box-shadow 0.3s;} .section01 .btn{display:flex;width:175px;height:70px;font-size:2.3rem;font-weight:500;border-radius:60px;align-items:center;justify-content:center;transition:box-shadow 0.3s;}
.section01 .btn:hover{box-shadow:0 0 16px 8px rgba(0,0,0,0.1);} .section01 .btn:hover{box-shadow:0 0 16px 8px rgba(0,0,0,0.1);}
.section01 .btn.line{border:1px solid #fff;color:#fff;} .section01 .btn.line{border:1px solid #fff;color:#fff;}
.section01 .btn.fill{background:#fff;} .section01 .btn.fill{background:#fff;}
.section01 .box_wrap li:nth-child(2) .btn.fill{color:#016dbe;} .section01 .box_wrap li:nth-child(1) .btn.fill{color:#016dbe;}
.section01 .box_wrap li:nth-child(2) .btn.line{background:#0f8deb;} .section01 .box_wrap li:nth-child(1) .btn.line{background:#0f8deb;}
.section01 .box_wrap li:nth-child(3) .btn.fill{color:#123b8d;} .section01 .box_wrap li:nth-child(2) .btn.fill{color:#123b8d;}
.section01 .box_wrap li:nth-child(3) .btn.line{background:#1e4aa4;} .section01 .box_wrap li:nth-child(2) .btn.line{background:#1e4aa4;}
.section01 .box_wrap li:nth-child(4) .btn.fill{color:#009bc2;} .section01 .box_wrap li:nth-child(3) .btn.fill{color:#009bc2;}
.section01 .box_wrap li:nth-child(4) .btn.line{background:#01a3cc;} .section01 .box_wrap li:nth-child(3) .btn.line{background:#01a3cc;}
.section01 .info{display:flex;width:100%;padding:35px 0;margin:50px 0 0 0;border:1px solid #cfe1ef;background:#e5f1fa;border-radius:10px;flex-direction:row;gap:0;}
.section01 .info li{position:relative;display:flex;width:calc(100% / 3);padding:0 5px;align-items:center;justify-content:center;gap:12px;box-sizing:border-box;}
.section01 .info li::before{display:none;}
.section01 .info li::after{position:absolute;content:"";width:1px;height:50px;background:#c0d3e4;right:0;}
.section01 .info li:last-child:after{display:none;}
.section01 .info .icon{display:inline-block;width:58px;height:58px;background-color:#d0e4f3;border-radius:100%;;}
.section01 .info .call{background-image:url(../images/main/sec01_icon_call.png);}
.section01 .info .mail{background-image:url(../images/main/sec01_icon_mail.png);}
.section01 .info .fax{background-image:url(../images/main/sec01_icon_fax.png);}
.section01 .info p{width:auto;font-size:2.1rem;font-family:'Gmarket Sans TTF';font-weight:500;color:#555;}
.section01 .info b{font-size:2.1rem;font-family:'Gmarket Sans TTF';font-weight:bold;color:#333;}
/* section02 */ /* section02 */
.section02{background:#f3f3f4;text-align:center;padding:90px 60px 100px 60px;background-image:url(/ipedu/visitEdu/usr/publish/images/main/sec02_bg_obj.png),url(/ipedu/visitEdu/usr/publish/images/main/sec02_bg_obj.png);background-repeat:no-repeat;background-position:5vw 30px,85vw calc(100% - 30px);} .section02{background:#f3f3f4;text-align:center;padding:90px 60px 100px 60px;background-image:url(/ipedu/visitEdu/usr/publish/images/main/sec02_bg_obj.png),url(/ipedu/visitEdu/usr/publish/images/main/sec02_bg_obj.png);background-repeat:no-repeat;background-position:5vw 30px,85vw calc(100% - 30px);}
@ -70,17 +83,20 @@
.section03 .btn_play i{background:url(/ipedu/visitEdu/usr/publish/images/main/icon_play_60.png) no-repeat center center;} .section03 .btn_play i{background:url(/ipedu/visitEdu/usr/publish/images/main/icon_play_60.png) no-repeat center center;}
.section03 .btn_next i{background:url(/ipedu/visitEdu/usr/publish/images/main/icon_next_60.png) no-repeat center center;} .section03 .btn_next i{background:url(/ipedu/visitEdu/usr/publish/images/main/icon_next_60.png) no-repeat center center;}
.section03 .btn:disabled{background-color:#f4f4f4;border:1px solid #dddddd;opacity:0.4;} .section03 .btn:disabled{background-color:#f4f4f4;border:1px solid #dddddd;opacity:0.4;}
.section03 .swiper{width:100%;height:calc(100% - 75px);border-radius:10px;} .section03 .swiper{width:100%;height:calc(100% - 75px);max-height:316px;border-radius:10px;}
.section03 .swiper-wrapper,.section03 .swiper-slide{height:100%;background-color:#f2f3f4;} .section03 .swiper-wrapper,.section03 .swiper-slide{height:100%;background-color:#f2f3f4;}
.section03 .swiper-slide div{width:100%;height:100%;text-align:center;} .section03 .swiper-slide div{width:100%;height:100%;text-align:center;}
.section03 .swiper-slide img{text-align:center;object-fit:contain;} .section03 .swiper-slide img{max-width:100%;max-height:100%;object-fit:contain;}
.section03 .banner_wrap{display:flex;flex-direction:column;gap:54px;} .section03 .banner_wrap{display:flex;flex-direction:column;gap:54px;}
.section03 .banner{display:flex;width:100%;padding:45px 40px;color:#fff;border-radius:10px;box-sizing:border-box;transition:background 0.3s;} .section03 .banner{position:relative;display:flex;width:100%;padding:45px 40px;color:#fff;border-radius:10px;background:url(../images/main/sec03_banner.png) no-repeat -20px top;box-sizing:border-box;transition:background-color 0.3s;}
.section03 .banner.green{background:#0aa87d} .section03 .banner::after{position:absolute;content:"";width:100%;height:100%;left:0;top:0;}
.section03 .banner.green:hover{background:#029165} .section03 .banner.green{background-color:#0aa87d}
.section03 .banner.blue{background:#3068ce;} .section03 .banner.green::after{background:url(../images/main/sec03_banner_01.png) no-repeat 10% 40px;}
.section03 .banner.blue:hover{background:#2658c4;} .section03 .banner.green:hover{background-color:#029165}
.section03 .banner.blue{background-color:#3068ce;}
.section03 .banner.blue::after{background:url(../images/main/sec03_banner_02.png) no-repeat 15% 40px;}
.section03 .banner.blue:hover{background-color:#2658c4;}
.section03 .banner i{width:200px;} .section03 .banner i{width:200px;}
.section03 .banner .title{font-size:3.1rem;font-weight:700;line-height:1.4;margin:0 0 8px 0;} .section03 .banner .title{font-size:3.1rem;font-weight:700;line-height:1.4;margin:0 0 8px 0;}
.section03 .banner .summary{font-size:1.9rem;font-weight:500;line-height:1.4;} .section03 .banner .summary{font-size:1.9rem;font-weight:500;line-height:1.4;}
@ -111,8 +127,6 @@
@media (max-width: 1480px) { @media (max-width: 1480px) {
.main{margin:160px 0 0 0;} .main{margin:160px 0 0 0;}
.section01{background-position: -2% calc(100% + 30px), left top;}
.section01 .box_wrap{width:73%;}
} }
@media (max-width: 1023px){ @media (max-width: 1023px){
@ -124,15 +138,25 @@
.main_title .btn_plus i{background:url(/ipedu/visitEdu/usr/publish/images/main/icon_plus_110.png) no-repeat center center;} .main_title .btn_plus i{background:url(/ipedu/visitEdu/usr/publish/images/main/icon_plus_110.png) no-repeat center center;}
/* section01 */ /* section01 */
.section01 .inner{background:none;}
.section01 .main_title{font-size:7rem;text-align:center;word-break:keep-all;}
.section01 .box_wrap{width:100%;flex-direction:column;gap:60px;} .section01 .box_wrap{width:100%;flex-direction:column;gap:60px;}
.section01 .box_wrap li:first-child span{font-size:7rem;text-align:center;}
.section01 .box_wrap li{width:100%;padding:60px;align-items:center;} .section01 .box_wrap li{width:100%;padding:60px;align-items:center;}
.section01 .box_wrap li:first-child p{display:none;}
.section01 .box_wrap .box{align-items:center;gap:60px;} .section01 .box_wrap .box{align-items:center;gap:60px;}
.section01 .box_wrap li .title{font-size:6rem;text-align:center;} .section01 .box_wrap li .title{font-size:6rem;text-align:center;}
.section01 .link_area{gap:26px;} .section01 .link_area{gap:26px;}
.section01 .btn{width:auto;height:120px;font-size:5.2rem;padding:0 60px;} .section01 .btn{width:auto;height:120px;font-size:5.2rem;padding:0 60px;}
.section01 .info{flex-direction:column;padding:30px 40px;gap:20px;box-sizing:border-box;}
.section01 .info li{width:100%;gap:20px;justify-content:flex-start;}
.section01 .info li::after{display:none;}
.section01 .info .icon{width:92px;height:92px;}
.section01 .info .call{background-image:url(../images/main/sec01_icon_call_m.png);}
.section01 .info .mail{background-image:url(../images/main/sec01_icon_mail_m.png);}
.section01 .info .fax{background-image:url(../images/main/sec01_icon_fax_m.png);}
.section01 .info p{font-size:5.2rem;width:calc(100% - 112px);}
.section01 .info b{font-size:5.2rem;}
/* section02 */ /* section02 */
.section02{padding:90px 30px 120px 30px;} .section02{padding:90px 30px 120px 30px;}
.section02 .inner{max-width:none;min-height:1140px;padding:0;} .section02 .inner{max-width:none;min-height:1140px;padding:0;}
@ -140,8 +164,8 @@
.section02 .list_content,.section02 .list_content>li,.section02 .tab{width:100%;} .section02 .list_content,.section02 .list_content>li,.section02 .tab{width:100%;}
.section02 .list_content{padding:14px;border-radius:60px;box-sizing:border-box;flex-wrap:wrap;} .section02 .list_content{padding:14px;border-radius:60px;box-sizing:border-box;flex-wrap:wrap;}
.section02 .list_content>li{width:50%;} .section02 .list_content>li{width:50%;}
.section02 .tab{height:108px;font-size:5.6rem;border-radius:108px;padding:0 20px;white-space:nowrap;} .section02 .tab{height:108px;font-size:5.6rem;border-radius:108px;padding:0 20px;margin:0;white-space:nowrap;}
.section02 .list{width:100%;max-width:100%;height:50%;padding:0 0 20px 0;overflow-x:auto;-webkit-overflow-scrolling: touch;top:456px;} .section02 .list{width:100%;max-width:100%;height:50%;padding:0 0 20px 0;overflow-x:auto;-webkit-overflow-scrolling: touch;top:456px;border:0;}
.section02 .list li{width:100%;flex: 0 0 70%;} .section02 .list li{width:100%;flex: 0 0 70%;}
.section02 .list a{height:550px;} .section02 .list a{height:550px;}
.section02 .list .date{font-size:6.8rem;} .section02 .list .date{font-size:6.8rem;}
@ -159,10 +183,11 @@
.section03 .btn_next i{background:url(/ipedu/visitEdu/usr/publish/images/main/icon_next_110.png) no-repeat center center;} .section03 .btn_next i{background:url(/ipedu/visitEdu/usr/publish/images/main/icon_next_110.png) no-repeat center center;}
/* section03 */ /* section03 */
.section03 .swiper{height:240px;} .section03 .swiper{height:576px;}
.section03 .banner .title{font-size:5.6rem;text-align:center;} .section03 .banner .title{font-size:5.6rem;text-align:center;}
.section03 .banner_wrap{flex-direction:row;} .section03 .banner_wrap{flex-direction:row;}
.section03 .banner{width:50%;justify-content:center;} .section03 .banner{width:50%;justify-content:center;}
.section03 .banner::after{display:none;}
.section03 .banner i,.section03 .banner .summary{display:none;} .section03 .banner i,.section03 .banner .summary{display:none;}
/* section04 */ /* section04 */
@ -190,6 +215,7 @@
.main_title .btn_plus{width:55px;height:55px;} .main_title .btn_plus{width:55px;height:55px;}
.main_title .btn_plus i{background:url(/ipedu/visitEdu/usr/publish/images/main/icon_plus_110.png) no-repeat center center;background-size:100%;} .main_title .btn_plus i{background:url(/ipedu/visitEdu/usr/publish/images/main/icon_plus_110.png) no-repeat center center;background-size:100%;}
.section01 .main_title{font-size:3.5rem;}
.section01 .box_wrap{gap:30px;} .section01 .box_wrap{gap:30px;}
.section01 .box_wrap li{padding:30px;} .section01 .box_wrap li{padding:30px;}
.section01 .box_wrap .box{min-height:0;gap:30px;} .section01 .box_wrap .box{min-height:0;gap:30px;}
@ -198,11 +224,15 @@
.section01 .link_area{gap:13px;} .section01 .link_area{gap:13px;}
.section01 .btn{width:34vw;height:60px;font-size:2.6rem;padding:0;} .section01 .btn{width:34vw;height:60px;font-size:2.6rem;padding:0;}
.section01 .info .icon{width:46px;height:46px;background-size:100% auto;}
.section01 .info p{font-size:2.6rem;width:calc(100% - 66px);}
.section01 .info b{font-size:2.6rem;}
.section02 .inner{min-height:650px;padding:0 25px;} .section02 .inner{min-height:650px;padding:0 25px;}
.section02 .main_title{gap:15px;margin:0 0 25px 0;} .section02 .main_title{gap:15px;margin:0 0 25px 0;}
.section02 .list_content{padding:7px;} .section02 .list_content{padding:7px;}
.section02 .list_content>li{width:calc(100% / 4);} .section02 .list_content>li{width:calc(100% / 4);}
.section02 .tab{height:54px;font-size:2.8rem;padding:0 10px;} .section02 .tab{height:54px;font-size:2.8rem;padding:0 10px;margin:0;}
.section02 .list{height:64%;top:176px;padding:0 25px 20px 25px;box-sizing:border-box;} .section02 .list{height:64%;top:176px;padding:0 25px 20px 25px;box-sizing:border-box;}
.section02 .list li{flex:0 0 90%;} .section02 .list li{flex:0 0 90%;}
.section02 .list a{height:380px;} .section02 .list a{height:380px;}
@ -214,6 +244,7 @@
.section03 .btn{width:55px;height:55px;} .section03 .btn{width:55px;height:55px;}
.section03 .btn i{background-size:100%;} .section03 .btn i{background-size:100%;}
.section03 .swiper{height:268px;} .section03 .swiper{height:268px;}
.section03 .banner_wrap{gap:27px;}
.section03 .banner{height:120px;padding:0 10px;align-items:center;} .section03 .banner{height:120px;padding:0 10px;align-items:center;}
.section03 .banner .title{font-size:2.8rem;} .section03 .banner .title{font-size:2.8rem;}
@ -236,6 +267,10 @@
.section01 .link_area{width:100%;flex-wrap:wrap;} .section01 .link_area{width:100%;flex-wrap:wrap;}
.section01 .link_area a{width:100%;;} .section01 .link_area a{width:100%;;}
.section01 .info{padding:30px 10px;}
.section01 .info li{gap:12px;}
.section01 .info b{word-break: break-all;line-height:1.3;}
.section02 .inner{min-height:580px;padding:0 15px;} .section02 .inner{min-height:580px;padding:0 15px;}
.section02 .list_content{border-radius:30px;} .section02 .list_content{border-radius:30px;}
.section02 .list_content>li{width:50%;} .section02 .list_content>li{width:50%;}

BIN
src/main/webapp/visitEdu/usr/publish/images/common/sns_blog.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 512 B

BIN
src/main/webapp/visitEdu/usr/publish/images/common/sns_facebook.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 322 B

BIN
src/main/webapp/visitEdu/usr/publish/images/common/sns_insta.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 843 B

BIN
src/main/webapp/visitEdu/usr/publish/images/common/sns_twitter.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/common/sns_youtube.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 581 B

BIN
src/main/webapp/visitEdu/usr/publish/images/main/banner_img.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 98 KiB

After

Width:  |  Height:  |  Size: 99 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec01_icon_call.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec01_icon_call_m.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec01_icon_fax.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 958 B

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec01_icon_fax_m.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec01_icon_mail.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec01_icon_mail_m.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec01_left_icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.8 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec01_left_obj.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec01_right_icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec01_right_obj.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec03_banner.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 829 B

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec03_banner_01.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.0 KiB

BIN
src/main/webapp/visitEdu/usr/publish/images/main/sec03_banner_02.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

27
src/main/webapp/visitEdu/usr/publish/index.html
View File

@ -27,13 +27,10 @@
<main class="main"> <main class="main">
<section class="section section01" style="background-image:url(/ipedu/visitEdu/usr/publish/images/main/sec01_bg_obj.png);"> <section class="section section01">
<div class="inner"> <div class="inner">
<p class="main_title">지식재산 보호 교육 시스템</p>
<ul class="box_wrap"> <ul class="box_wrap">
<li>
<p>한국지식재산보호원</p>
<span>지식재산 보호 교육 시스템</span>
</li>
<li> <li>
<div class="box"> <div class="box">
<p class="title">상표권 교육조건부 기소유예</p> <p class="title">상표권 교육조건부 기소유예</p>
@ -62,6 +59,20 @@
</div> </div>
</li> </li>
</ul> </ul>
<ul class="info">
<li>
<i class="icon call"></i>
<p>대표번호 : <b>1670-1271</b></p>
</li>
<li>
<i class="icon mail"></i>
<p>이메일 : <b>ipedu@koipa.re.kr</b></p>
</li>
<li>
<i class="icon fax"></i>
<p>팩스 : <b>02-6499-3010</b></p>
</li>
</ul>
</div> </div>
</section> </section>
@ -174,9 +185,9 @@
<div class="swiper"> <div class="swiper">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<div class="swiper-slide">1</div> <div class="swiper-slide"><img src="./images/main/banner_img.png" alt=""></div>
<div class="swiper-slide">2</div> <div class="swiper-slide"><img src="./images/main/banner_img.png" alt=""></div>
<div class="swiper-slide">3</div> <div class="swiper-slide"><img src="./images/main/banner_img.png" alt=""></div>
</div> </div>
</div> </div>

2
src/main/webapp/visitEdu/usr/publish/script/main.js
View File

@ -9,7 +9,7 @@ $(document).ready(function () {
const slideBanner = new Swiper('.section03 .swiper', { const slideBanner = new Swiper('.section03 .swiper', {
direction: 'horizontal', direction: 'horizontal',
autoplay: { autoplay: {
delay: 500, delay: 3000,
}, },
navigation: { navigation: {
nextEl: '.section03 .btn_next', nextEl: '.section03 .btn_next',