diff --git a/src/main/webapp/visitEdu/usr/publish/css/common_2023.css b/src/main/webapp/visitEdu/usr/publish/css/common_2023.css index ec34db0d..459b7f48 100644 --- a/src/main/webapp/visitEdu/usr/publish/css/common_2023.css +++ b/src/main/webapp/visitEdu/usr/publish/css/common_2023.css @@ -18,7 +18,8 @@ header.on::after{top: 130px; opacity: 1;} header.on::before{opacity: 1;} header.scroll{box-shadow: 0 5px 8px rgba(0,0,0,0.15);} -.gnb_wrap{width: 100%; background-color: #eef0f3; height: 40px; overflow: hidden; padding: 0 20px; border-bottom: 1px solid #e2e4e6; box-sizing: border-box;} +/* .gnb_wrap{width: 100%; background-color: #eef0f3; height: 40px; overflow: hidden; padding: 0 20px; border-bottom: 1px solid #e2e4e6; box-sizing: border-box;} */ +.gnb_wrap{width: 100%; background-color: #fff; height: 40px; overflow: hidden; padding: 0 20px; border-bottom: 1px solid #e2e4e6; box-sizing: border-box;} .gnb_wrap .inner{max-width: 1400px; width: 100%; height: 100%; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;} .gnb_wrap .site {padding: 8px 20px; background-color: #f5680b ; height: 100%; box-sizing: border-box; vertical-align: middle;} .gnb_wrap .site span{display: inline-block; vertical-align: middle; font-size: 13px; font-weight: 600; padding: 0 4px; box-sizing: border-box; background-color: #fff; color: #f5680b; border-radius: 5px; margin-left: 10px; transition: background-color 0.3s ease;} @@ -153,7 +154,8 @@ header.scroll{box-shadow: 0 5px 8px rgba(0,0,0,0.15);} .navigation .list > li .navi_depth li a:focus {font-weight:500;color:#ff6009;background:#fff3ec;} /* footer */ -footer{width: 100%; background-color: #eef0f3; position: relative; padding: 0 10px; box-sizing: border-box; color: #666; position: relative; margin: 80px auto 0 auto;} +/* footer{width: 100%; background-color: #eef0f3; position: relative; padding: 0 10px; box-sizing: border-box; color: #666; position: relative; margin: 80px auto 0 auto;} */ +footer{width: 100%; background-color: #fff; position: relative; padding: 0 10px; box-sizing: border-box; color: #666; position: relative; margin: 0 auto 0 auto;} footer::before { content: ""; width: 100%; height: 50px; border-top: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; position: absolute; top: 0; left: 0;} footer .site ul {display: flex; height: 50px; align-items: center;} footer .inner{max-width: 1400px; width: 100%; margin: 0 auto; } diff --git a/src/main/webapp/visitEdu/usr/publish/css/common_2023_bak.css b/src/main/webapp/visitEdu/usr/publish/css/common_2023_bak.css new file mode 100644 index 00000000..ec34db0d --- /dev/null +++ b/src/main/webapp/visitEdu/usr/publish/css/common_2023_bak.css @@ -0,0 +1,285 @@ +body {color: #222;} + +.clearfix::after{display:block;content:"";clear:both;} + +.skip_menu {position:absolute; left:0; top:0; width:100%; margin:0 auto; z-index:999;} +.skip_menu a{display:block; position:absolute; left:0; padding:10px 20px; height: 50px; line-height:30px; color:#fff; background:#000;width:100%;text-align:center;font-size: 18px;box-sizing: border-box;} +.skip_menu a:link,.skip_menu a:visited,.skip_menu a:active{top:-10000px;} +.skip_menu a:hover,.skip_menu a:focus{top:0;} + +.logo img {width: 200px;} + +/* header */ +header{width: 100%; height: 130px; position: fixed; top: 0; left: 0; transition: height .4s ease-in-out, background-color .4s ease-in-out, margin .4s ease-in-out; overflow: hidden; box-sizing: border-box;z-index: 20; background-color: #fff;} +header.on{background-color: #fff; box-shadow: 0 3px 10px rgba(0,0,0,0.1);} +header::before{position: absolute; content: " "; display: block; top: 130px; left: 0; height: 1px; background-color: #ddd; opacity: 0; transition: opacity .4s ease-in-out;} +header::after{position: absolute; content: " "; display: block; width: 100%; height: 1px; background-color: #d5d5d5; top: 130px; left: 0; opacity: 0; transition: opacity .4s ease-in-out;} +header.on::after{top: 130px; opacity: 1;} +header.on::before{opacity: 1;} +header.scroll{box-shadow: 0 5px 8px rgba(0,0,0,0.15);} + +.gnb_wrap{width: 100%; background-color: #eef0f3; height: 40px; overflow: hidden; padding: 0 20px; border-bottom: 1px solid #e2e4e6; box-sizing: border-box;} +.gnb_wrap .inner{max-width: 1400px; width: 100%; height: 100%; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;} +.gnb_wrap .site {padding: 8px 20px; background-color: #f5680b ; height: 100%; box-sizing: border-box; vertical-align: middle;} +.gnb_wrap .site span{display: inline-block; vertical-align: middle; font-size: 13px; font-weight: 600; padding: 0 4px; box-sizing: border-box; background-color: #fff; color: #f5680b; border-radius: 5px; margin-left: 10px; transition: background-color 0.3s ease;} +.gnb_wrap .site:hover {background-color: #e86016; transition: background-color 0.3s ease;} +.gnb_wrap .area_right *{display: inline-block;} +.gnb_wrap .area_right a,.gnb_wrap .area_right .login_after{height: 25px; font-size: 14px; color: #717171; font-weight: 400; line-height: 1.6; letter-spacing: -0.45px; vertical-align: unset;} +.gnb_wrap .area_right .login_after{padding-right: 20px; text-align: right; position: relative;} +.gnb_wrap .area_right .login_info {position: relative;} +.gnb_wrap .area_right .login_after + .login_info {padding-right:20px;} +.gnb_wrap .area_right .login_after + .login_info::before {right:7px;} +.gnb_wrap .area_right .header_login_wrap {padding-right: 33px;} +.gnb_wrap .area_right a i {display: inline-block; background-repeat: no-repeat; vertical-align: middle; margin-bottom: 2px; margin-right: 5px;} +.gnb_wrap .area_right .header_login i {background-image: url(../images/common/headerTop_icon1.png); width: 11px; height: 15px;} +.gnb_wrap .area_right .header_join {padding-right: 22px;margin:0 -10px 0 0;} +.gnb_wrap .area_right .header_join i {background-image: url(../images/common/headerTop_icon3.png); width: 14px; height: 15px;} +.gnb_wrap .area_right a:hover{text-decoration: underline;} +.gnb_wrap .area_right .login_info::before,.gnb_wrap .area_right .login_after::before{position: absolute; content: " ";width: 1px; height: 13px; background-color: #dbdbdb; top: 50%; right: 13px; transform: translateY(-50%);} +.gnb_wrap .area_right .login_after::before {right:7px;} +.gnb_wrap .area_right .login_info:last-of-type:before{display: none;} +.gnb_wrap .area_left p{display: inline-block;background-color: #fff; height: 40px; border-right: 1px solid #e5e5e5; font-size: 15px; color: #444; padding: 0 15px; vertical-align: middle; line-height: 36px;margin: 0 0 0 -4px;} +.gnb_wrap .btn_util {margin:0 0 0 10px;} +.gnb_wrap .btn_util button{width: 40px; height: 40px; vertical-align: middle; background-repeat: no-repeat; background-position: center; border-left: 1px solid #e2e4e6; } +.gnb_wrap .btn_util button:hover{box-shadow: 0 0 5px rgba(0,0,0,.15);} +.gnb_wrap .btn_util .btn_minus{margin-right: -5px; background-image: url(../images/common/headerTop_btn1.png);} +.gnb_wrap .btn_util .btn_plus{background-image: url(../images/common/headerTop_btn2.png); border-right: 1px solid #e2e4e6;} + +.header{padding: 0 20px; box-sizing: border-box;} +.header_inner{max-width: 1400px; width: 100%; height: 90px; display: flex; align-items: center; justify-content: space-between; margin: 0 auto; position: relative;} +.header_inner .area_right{display: flex;} +.header_inner .nav_wrap{box-sizing: border-box; height: 100%; width: 100%; margin: 0 50px;} +.header_inner #menu{width: 100%; margin: 0 auto; height: 100%;} +.header_inner .depth01 {display: flex; height: 100%;} +.header_inner .dep_li_01,.header_inner .dep_li_02,.header_inner .dep_li_03 {justify-content:flex-start;} +.header_inner .dep_li_04,.header_inner .dep_li_05,.header_inner .dep_li_06,.header_inner .dep_li_07 {justify-content:space-between;} +.header_inner .depth01_li{position: relative; padding: 0; box-sizing: border-box;} +.header_inner .dep_li_04 .depth01_li{width: calc((100% - 40px)/4);} +.header_inner .dep_li_01 .depth01_li{width: 100%;} +.header_inner .dep_li_02 .depth01_li{width: calc((100% - 20px)/2);} +.header_inner .dep_li_03 .depth01_li{width: calc((100% - 30px)/3);max-width:270px;} +.header_inner .dep_li_05 .depth01_li{width: calc(100%/5);} +.header_inner .dep_li_06 .depth01_li{width: calc((100% - 60px)/6);} +.header_inner .dep_li_07 .depth01_li{width: auto;} +.header_inner .menu_link{font-size: 20px; font-weight: 600; letter-spacing: -0.5px; display: flex; align-items: center; justify-content: center; flex-flow: column; height: 100%; position: relative;font-family: 'nanumsquare', 'Noto Sans KR', sans-serif; line-height: 1.25;} +.header_inner .menu_link::before{position: absolute; content: " "; display: block; width: 0; height: 4px; background-color: #E95504; left: 50%; transform: translateX(-50%); transition: width .4s ease-in-out; top: 87px; z-index: 1;} +.header_inner .menu_link .menu_link_br {color: #E95504;font-family: 'nanumsquare', 'Noto Sans KR', sans-serif; } +.header_inner .on .menu_link{color: #E95504;} +.on .nav_wrap .on .menu_link::before{width: 100%;} +.header_inner .depth02{position: absolute; text-align: center; padding: 15px 0; width: 100%; left: 50%; transform: translateX(-50%);border-right: 1px solid #d5d5d5;} +.header_inner .depth01_li:first-child .depth02{border-left: 1px solid #d5d5d5;} +.header_inner .depth01_li:hover .depth02::after{position:absolute;content:"";width:calc(100% + 4px);height:100%;background-color:#fff8f4;left:-2px;top:0;} +.header_inner .depth01_li:hover .depth02 li{position:relative;z-index:1;} +.header_inner .depth02 a{font-size: 17px; font-weight: 300; line-height: 1.3; height: 45px; display: flex; align-items: center; justify-content: center; word-break: keep-all;white-space:nowrap;} +.header_inner .depth02 a:hover,.header_inner .depth02 a:focus{color: #E95504;font-weight:500;} + +.header_inner button{width: 27px; height: 26px; background-repeat: no-repeat;} +.header_inner .btn_search{background-image: url(../images/common/btn_search.png); margin-right: 25px; margin-top: -2px;} +.header_inner .btn_menu{background-image: url(../images/common/btn_menu.png);} +.header_inner button.btn_mobile{display: none; margin: 0 8px; vertical-align: middle; margin-top: -2px;height:100%;background-position:center center;} +.header_inner .btn_login{background-image: url(../images/common/m_headerTop_icon1.png);background-size:21px auto;} +.header_inner .btn_logout{background-image: url(../../../../kccadrPb/usr/image/common/btn_logout.png);} +.header_inner .btn_join{width: 35px; background-image: url(../images/common/m_headerTop_icon2.png);background-size:26px auto;} +.header_inner .btn_usredit{width: 35px; background-image: url(../../../../kccadrPb/usr/image/common/btn_usredit.png);} +.header_inner .m_header_login, +.header_inner .m_header_join {display:none;} +/* //header */ + +/* full menu */ +.full_menu{visibility: hidden; width: 100%; position: fixed; background-color: #eef0f3; min-height: 500px; padding: 100px 50px 50px 50px; box-sizing: border-box; top: -500px; transition: top 0.5s ease, box-shadow 0.3s ease; z-index: 21; border-radius: 0 0 20px 20px;} +.full_menu.on{visibility: visible; top: 0; box-shadow: 0 5px 8px rgba(0,0,0,0.3);} +.full_menu .inner{display: flex; max-width: 1400px; width: 100%; position: relative; margin: 0 auto; justify-content: space-between; align-items: flex-start;} +.full_menu .logo{width: 230px;} +.full_menu .logo img{width: 220px;} +.full_menu .btn_close{background-image: url(../images/common/btn_close.png); width: 40px; height: 40px; background-repeat: no-repeat; border: 1px solid #ef7b0f; border-radius: 3px; background-position: center;} +.full_menu .btn_close:hover {box-shadow: 0 0 5px rgba(0,0,0,.15); transition: width .4s ease-in-out;} +.full_menu .depth01{width: calc(100% - 500px);} +.full_menu .depth01_li{display: flex; border-bottom: 1px solid #d5d5d5; padding: 20px 0;} +.full_menu .depth01_li:first-child{padding: 0 0 20px 0;} +.full_menu .depth01_li:last-child{border-bottom: 0;} +.full_menu .depth01_li .menu_link{width:350px;font-size: 22px; font-weight: 500; color: #222;} +.full_menu .depth01_li:hover .menu_link,.full_menu .depth01_li .depth02 li:hover{color: #e95504;} +.full_menu .depth01_li .depth02 li:hover{font-weight: 500;} +.full_menu .depth01_li .depth02{display: flex; width: calc(100% - 350px); font-size: 18px; font-weight: 300; color: #666; justify-content: space-between;} + +/* .full_menu .depth01 .menu_link{font-size: 20px; font-weight: 500; color: #ea5404; position: relative; padding-bottom: 25px; letter-spacing: -1px; text-align: center; height: 40px;} +.full_menu .depth01 .menu_link>span {display: block; padding-top: 5px;} +.full_menu .depth01 .menu_link::before{position: absolute; content: " "; width: 75px; height: 3px; background-color: #ea5404; left: 50%; bottom: 0; transform: translateX(-50%);} +.full_menu .depth02{margin-top: 10px;} +.full_menu .depth02 a{height: 40px; display: flex; align-items: center; justify-content: center; letter-spacing: -1px; font-size: 17px; font-weight: 400;} +.full_menu .depth02 a:hover {font-weight: 700;} +.full_menu .link{display: inline-block; width: 16px; height: 16px; background-image: url(../images/common/link_icon.png);background-repeat: no-repeat; margin-left: 6px;} */ +/* //full menu */ + +/* moblie menu */ +#m_menu{visibility: hidden; height: 0;} +/* //moblie menu */ + +/* path */ +.path {width: 100%; background-color: #ebedf2; height: 50px;} +.path .pathedfr {max-width: 1400px; padding: 0 10px; margin: 0 auto; box-sizing: border-box;} +.path .pathedfr ul {display: flex; align-items: center; height: 50px;} +.path .pathedfr ul li {align-self: center; font-size: 16px; color: #666; font-weight: 300;} +.path .pathedfr ul li:nth-child(even) {color: #666; font-size: 14px; margin: 0 8px;} +.path .pathedfr ul li.home i {background-image: url(../images/common/home_icon.png); width: 19px; height: 17px; display: inline-block; margin-bottom: -2px; margin-right: 10px;} +.path .m_pathedfr {display:none;} + +/* snb */ +/* .snb {width:230px;} */ +.snb > p {color:#333333;font-size:27px; font-weight: 600;font-family: 'nanumsquare', 'Noto Sans KR', sans-serif;} +.snb > h2 > span {color: #e95504; display: block; font-family: 'nanumsquare', 'Noto Sans KR', sans-serif; padding-top: 9px;} +.snb .ssleftxt{width:100%;margin-top:25px;} +.snb .ssleftxt ul li{width: 100%; height: 45px; border-radius: 5px; border: 1px solid #d5d7dc; margin-bottom: 5px; display: table;} +.snb .ssleftxt ul li:last-child {margin-bottom: 0;} +.snb .ssleftxt ul li a{width:100%;height:100%;color:#666;padding:0 15px;box-sizing:border-box; font-size: 18px; display: table-cell; vertical-align: middle; font-weight: 300;} +.snb .ssleftxt ul li a span{font-size: 18px; line-height: 18px;} +.snb .ssleftxt ul li.menu_on{background-color: #ec5908 ; border: 1px solid #ec5908;} +.snb .ssleftxt ul li.menu_on a {color:#fff; background-image: url(../images/common/arrow.png); background-repeat: no-repeat; background-position: 91% 50%;} +/*// snb */ + +.navigation {height:50px;border-bottom:1px solid #d5d5d5;} +.container .navigation .inner{margin: 0 auto;} +.navigation .list {border-left:1px solid #d5d5d5;} +.navigation .list:after {content:'';display:block;clear:both;} +.navigation .list > li {position:relative;float:left;border-right:1px solid #d5d5d5;} +.navigation .list > li:first-child {border-left:1px solid #d5d5d5;} +.navigation .list > li.home {display:none;border-left:1px solid #d5d5d5;} +.navigation .list > li.home a {display:block;width:49px;height:50px;font-size:0;text-indent:-9999em;background:url(../images/content/select.png) no-repeat center center;} +.navigation .list > li .navi_title {position:relative;width:230px;padding:0 20px;font-size:16px;line-height:50px;text-align:left;color:#555;box-sizing:border-box;} +.navigation .list > li .navi_title:after {content:'';position:absolute;right:20px;top:1px;width:18px;height:48px;background:url(../images/content/select.png) no-repeat center center;} +.navigation .list > li .navi_depth {display:none;position:absolute;left:-1px;top:50px;width:100%;border:1px solid #d5d5d5;background:#fff;z-index:2;} +.navigation .list > li .navi_depth li a {display:block;height:40px;padding:0 20px;font-size:16px;line-height:40px;} +.navigation .list > li .navi_depth li a:hover, +.navigation .list > li .navi_depth li a:focus {font-weight:500;color:#ff6009;background:#fff3ec;} + +/* footer */ +footer{width: 100%; background-color: #eef0f3; position: relative; padding: 0 10px; box-sizing: border-box; color: #666; position: relative; margin: 80px auto 0 auto;} +footer::before { content: ""; width: 100%; height: 50px; border-top: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; position: absolute; top: 0; left: 0;} +footer .site ul {display: flex; height: 50px; align-items: center;} +footer .inner{max-width: 1400px; width: 100%; margin: 0 auto; } +footer .area_top{display: flex; align-items: center; justify-content: space-between; position: relative; padding: 45px 0;} +footer .site{font-size: 16px; position: relative;} +footer .site li{padding: 0 24px; position: relative; font-weight: 400; transition: all 0.3s ease;} +footer .site li::before{position: absolute; content: " "; width: 1px; height: 14px; background-color: #cbced4; top: 50%; right: 0; transform: translateY(-50%);} +footer .site li:last-child::before{display: none;} +footer .site li:first-child{padding-left: 0;} +footer .site li a:hover {text-decoration: underline;} +footer select{width: 204px; height: 40px; border: 1px solid #cbcdd1; background-image: url(../images/common/footer_select.png); background-position: calc(100% - 15px) center; background-repeat: no-repeat; padding: 0 10px; font-size: 15px; color: #666;} +footer .btn_go{width: 50px; height: 40px; border: 1px solid #cbcdd1; background-color: #eaecef; vertical-align: middle; border-radius: 5px; color: #666; transition: all 0.1s linear; font-size: 16px; margin: 0 0 0 4px;} +footer .btn_go:hover{box-shadow: 0 0 5px rgba(0,0,0,0.2); transition: all 0.1s linear;} +footer .logo,footer address{display: inline-block; vertical-align: middle;} +footer .logo{/*padding: 47px 0;*/ transition: all 0.3s ease;} +footer address {font-size: 14px; font-weight: 400; margin-left: -90px; transition: all 0.3s ease;} +footer address p:first-child{margin-bottom: 8px;} +footer .site_go{display: flex;align-items: center;justify-content: space-between;} +footer .wa_mark .wa {width: 110px;margin: 0 40px 0 0;} +/* //footer */ + +.error_page{width: 100%; height: 100%; margin: 0 auto; text-align: center;} +.error_wrap{border: 1px solid #d5d5d5; display: inline-flex; align-items: center; margin: 200px auto 50px auto; padding: 15px 50px 15px 0; justify-content: center;} +.error_wrap i{display: block; width: 266px; height: 200px; background-image: url(../../../adm/publish/image/warming.jpg); border-right: 1px solid #d5d5d5; } +.error_wrap .text_area{width: calc(100% - 266px); font-size: 20px; padding-left: 30px; text-align: left;} +.error_wrap .text_area p{font-size: 16px; color: #555; margin-top: 10px; line-height: 1.4;} +.error_wrap .error_btn {text-align:center;} +.error_page .error_btn button {background-color:#1b6fcd; color: #fff; padding: 8px 25px; font-size: 16px;} + +@media all and (max-width: 1280px){ + /* header */ + .header_inner .nav_wrap{padding: 0 5px; margin: 0 5px;} + .header_inner .menu_link{font-size: 17px; letter-spacing: -0.25px;} + /* //header */ + footer address {width: 36%;} + +} + +@media all and (max-width: 1024px){ + /* moblie menu */ + .nav_wrap,#menu{display: none;} + + #m_menu{position: fixed; width: 100%; height: 100%; background-color: #fff; box-sizing: border-box; top: 0; right: -100%; transition: all 0.5s ease; z-index: 26;} + #m_menu.on{visibility: visible; right: 0; transition: all 0.5s ease;} + #m_menu .area_top{text-align: right;} + #m_menu .btn_close_wrap {width: 100%; height: 70px; position: absolute; top:0; left: 0; background-color: #ef7b0f;} + #m_menu .btn_close{background-image: url(../images/common/btn_close2.png);background-repeat: no-repeat; background-position: center; width: 40px; height: 40px; border: 1px solid #fff; border-radius: 3px; position: absolute; right: 20px; top: 50%; transform: translateY(-50%);} + #m_menu .btn_close:hover {box-shadow: 0 0 5px rgba(0,0,0,.25);} + #m_menu .depth01{width: 100%; padding: 0 10px; margin-top: 70px;box-sizing: border-box;} + #m_menu .depth01_li{overflow: hidden; height: 60px; transition: height 0.3s linear; display: block; position: relative;} + #m_menu .depth01_li::before{position: absolute; content: " "; width: 100%; height: 1px; background-color: #e5e5e5; opacity: 0;} + #m_menu .depth01_li.on{height: 280px;transition: height 0.3s linear;} + #m_menu .depth01_li.on::before{opacity: 1; bottom: 0;} + #m_menu .menu_tit{font-size: 20px; height: 60px; border-bottom: 1px solid #e5e5e5; width: 100%; text-align: left; padding-left: 20px; position: relative;} + #m_menu .menu_tit::after {background-image: url(../images/common/m_menu_plus.png); background-position: center; background-repeat: no-repeat; width: 36px; height: 36px; content: ""; position: absolute; top: 50%; right: 10px; transform: translateY(-50%);} + #m_menu .menu_tit span {color: #f37632;} + #m_menu .depth01_li.on .menu_tit {border-bottom: 1px solid #f37632; color: #f37632;} + #m_menu .depth02{visibility: hidden; height: 100%; margin: 10px 0; opacity: 0; transition: all 0.3s linear; background-color: #f5f5f5;} + #m_menu .on .depth02{visibility: visible; height: auto; transition: all 0.3s linear; opacity: 1;} + #m_menu .depth02 a{height: 50px; display: flex; align-items: center; padding-left: 20px; font-size: 17px;} + /*// moblie menu */ + + .snb {display: none;} + .header_inner button.btn_mobile {display:block;} + + /* footer */ + footer .area_top {align-items: flex-start; padding: 40px 0 90px 0;} + footer address {width: 72%} + footer .wa_mark {position: absolute; bottom: 6px; right: 0;} + footer .site_go {position: absolute; bottom: 23px; left: 0;} +} + +@media screen and (max-width: 767px){ + /* header */ + header {height:70px;border-bottom:1px solid #e2e4e6;box-sizing:border-box;} + header .gnb_wrap {overflow:visible;height:0;border:0;} + header .gnb_wrap .site, + header .gnb_wrap .btn_util {display:none;} + header .gnb_wrap .area_right, .gnb_wrap .area_left p {display:none;} + header .header {padding:0 8px 0 10px;} + header .header .header_inner {height:70px;} + header .header .header_inner h1 a {display:flex;height:70px;align-items:center;} + header .header .header_inner h1 a img {height:43px;} + header .header .header_inner .area_right {height:100%;} + header .header .header_inner .area_right .btn_search {display:none;} + header .header .header_inner .area_right .btn_menu {width:35px;height:100%;background-image:url(../images/common/m_btn_menu.png);background-size:29px 21px;background-position:center center;} + header .header .header_inner .area_right .m_header_login {display:flex;width:40px;height:100%;margin:0 5px 0 0;padding:0;font-size:0;align-items:center;justify-content:center;text-indent:-9999em;z-index:1;} + header .header .header_inner .area_right .m_header_login i {width:21px;height:28px;margin:0;background-image:url(../images/common/m_headerTop_icon1.png);background-size:21px auto;} + header .header .header_inner .area_right .m_header_join {display:flex;width:40px;height:100%;margin:0 5px 0 0;padding:0;font-size:0;align-items:center;justify-content:center;text-indent:-9999em;z-index:1;} + header .header .header_inner .area_right .m_header_join i {width:26px;height:28px;margin:0;background-image:url(../images/common/m_headerTop_icon2.png);background-size:26px auto;} + + .path {height:50px;background:#f5680b;} + .path .pathedfr {display:none;} + .path .m_pathedfr {display:block;} + .path .m_pathedfr > ul:after {content:'';display:block;clear:both;} + .path .m_pathedfr > ul > li {position:relative;float:left;width:50%;height:100%;border-left:1px solid #fcae83;box-sizing:border-box;} + .path .m_pathedfr > ul > li:first-child {border:0 none;} + .path .m_pathedfr > ul > li .path_btn {position:relative;display:block;width:100%;height:50px; padding:0 0 0 10px;font-size:18px;text-align:left;color:#fff;} + .path .m_pathedfr > ul > li .path_btn:after {content:'';position:absolute;right:15px;top:0; width:18px;height:50px;background:url(../images/common/path_btn_arrow.png) no-repeat left top;} + .path .m_pathedfr > ul > li .path_btn.active:after {transform:rotate(180deg);} + .path .m_pathedfr > ul > li ul {display:none;position:absolute;left:0;top:50px;width:100%; padding:3px 0;border-top:1px solid #fcae83;background:#fb8b4e;box-sizing:border-box;} + .path .m_pathedfr > ul > li ul li a {display:block;padding:0 0 0 10px;font-size:16px;line-height:35px;color:#fff;} + + .container .navigation .inner {padding:0;} + .navigation .list > li {width: calc((100% - 2px)/2);} + .navigation .list > li .navi_title{width: 100%;} + + /* footer */ + footer .site {margin:0 -10px;} + footer .site ul {justify-content:center;} + footer .site ul li {padding:0 10px;font-size:14px;text-align:center;} + footer .site ul li:first-child {padding:0 10px;} + footer .area_top {display:block;padding:20px 10px;} + footer .area_top .logo {display:block;} + footer .area_top .logo a {display:block;} + footer .area_top .logo a img {width:140px;} + footer .area_top address {display:block; width: 100%; margin:15px 0 80px 0;} + footer .area_top address p {margin:0 0 4px;font-size:14px;line-height:20px;} + footer .area_top .site_go {left:initial;right:0;top:20px;width:calc(100% - 165px);} + footer .area_top .site_go:after {content:'';display:block;clear:both;} + footer .wa_mark {left: 0; bottom: 12px;} + footer .area_top .site_go select {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;float:left;width:calc(100% - 45px);height:35px;padding:0 35px 0 15px;font-size:14px;background-size:10px;} + footer .area_top .site_go .btn_go {float:right;width:40px;height:35px;font-size:14px;} + } + +@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none){ + .header_inner .area_right{/* width: 80px; */justify-content: space-between;} + .header_inner .btn_search{margin-right: 0;} +} diff --git a/src/main/webapp/visitEdu/usr/publish/css/font.css b/src/main/webapp/visitEdu/usr/publish/css/font.css index 14e515b0..f7622028 100644 --- a/src/main/webapp/visitEdu/usr/publish/css/font.css +++ b/src/main/webapp/visitEdu/usr/publish/css/font.css @@ -5,6 +5,13 @@ @import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css'); /* G market sans */ +@font-face { + font-family: 'GmarketSansMedium'; + src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff'); + font-weight: normal; + font-style: normal; +} + @font-face { font-family: 'GmarketSansBold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); diff --git a/src/main/webapp/visitEdu/usr/publish/css/main_2023.css b/src/main/webapp/visitEdu/usr/publish/css/main_2023.css index 416f8503..608b6351 100644 --- a/src/main/webapp/visitEdu/usr/publish/css/main_2023.css +++ b/src/main/webapp/visitEdu/usr/publish/css/main_2023.css @@ -1,89 +1,90 @@ -.main {margin-top:130px;} +.main {margin-top:130px;background-color:#eef0f4;padding:0 0 80px 0;} .main .inner {max-width:1400px;width:100%;margin:0 auto;display:flex;justify-content: space-between;flex-wrap: wrap;box-sizing: border-box;} /* visual */ -.renewal .visual_slide{position:relative;width:calc(100% - 120px);height:550px;background-color: #f5f5f5;margin:0 auto;border-radius:20px;z-index:0;overflow:hidden;} +.renewal .visual_slide{position:relative;width:100%;height:590px;background-color: #eef0f4;margin:0 auto;z-index:0;overflow:hidden;} .renewal .visual_slide .swiper-slide .inner{width:100%;} -.renewal .visual_slide .swiper-slide .inner .text_area{height:auto;padding:80px 0 0 40px;box-sizing:border-box;} -.renewal .visual_slide .swiper-slide .inner .text_area *{line-height: 1.4;} -.renewal .visual_slide .swiper-slide .inner .text_area .sub_title{font-size:24px;font-family:'GmarketSansMedium';color:#fff;} -.renewal .visual_slide .swiper-slide .inner .text_area .title{font-size:50px;font-family:'GmarketSansBold';color:#ffe400;} -.renewal .visual_slide .swiper-slide .inner .text_area .summary{font-size:18px;color:#fff;} -.renewal .visual_slide .swiper-slide .inner .text_area a{display:flex;width:175px;height:50px;font-size: 18px;color:#fff;border:1px solid #fff;padding:0 20px;margin:42px 0 0 0;border-radius:26px;align-items:center;justify-content:space-between;box-sizing:border-box;} -.renewal .visual_slide .slide_control{position:relative;left:40px;bottom:150px;width:100%;} -.renewal .visual_slide .slide_control .inner{position:relative;justify-content:flex-start;align-items:center;} +.renewal .visual_slide .swiper-slide .inner .text_area{height:auto;padding:63px 0 0 40px;margin:0 auto;box-sizing:border-box;text-align:center;} +.renewal .visual_slide .swiper-slide .inner .text_area *{line-height: 1.4;color:#182448;} +.renewal .visual_slide .swiper-slide .inner .text_area .sub_title{font-size:20px;font-family:'GmarketSansMedium';} +.renewal .visual_slide .swiper-slide .inner .text_area .title{font-size:52px;font-family:'GmarketSansBold';} +.renewal .visual_slide .swiper-slide .inner .text_area .summary{font-size:18px;} +.renewal .visual_slide .swiper-slide .inner .text_area a{display:flex;width:145px;height:38px;font-size: 18px;color:#182448;background-color:#fff;padding:0 20px;margin:33px auto 0 auto;border-radius:26px;align-items:center;justify-content:space-between;box-sizing:border-box;} +.renewal .visual_slide .slide_control{position:relative;width:100%;bottom:20px;} +.renewal .visual_slide .slide_control .inner{position:relative;justify-content:center;align-items:center;} .renewal .visual_slide .slide_control .swiper-pagination{position: relative;} -.renewal .visual_slide .slide_control .swiper-pagination-bullet{background-color:#fff;opacity:0.5;margin:0 4px;} +.renewal .visual_slide .slide_control .swiper-pagination-bullet{background-color:#19222d;opacity:0.5;margin:0 4px;} .renewal .visual_slide .slide_control .swiper-pagination-bullet-active{opacity:1;} .renewal .visual_slide .slide_control .slide_pause,.renewal .visual_slide .slide_control .slide_play{position:relative;width:8px;height:10px;z-index:10;margin: 5px 0 0 8px;} .renewal .visual_slide .slide_control .slide_pause{background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_main_visual_pause.png);} .renewal .visual_slide .slide_control .slide_play{background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_main_visual_play.png);} +.renewal .visual_slide .btn_prev_slide,.renewal .visual_slide .btn_next_slide{position:absolute;width:50px;height:50px;text-indent:-9999em;overflow:hidden;top:50%;z-index:10;transform:translateY(-50%);} +.renewal .visual_slide .btn_prev_slide{background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_main_visual_arrow_right.png) no-repeat;left:77px;} +.renewal .visual_slide .btn_next_slide{background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_main_visual_arrow_left.png) no-repeat;left:calc(100% - 97px);} -.renewal .visual_slide .swiper-slide[aria-label="1 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_01.jpg);} -.renewal .visual_slide .swiper-slide[aria-label="2 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_02.jpg);} -.renewal .visual_slide .swiper-slide[aria-label="3 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_03.jpg);} -.renewal .visual_slide .swiper-slide[aria-label="4 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_04.jpg);} -.renewal .visual_slide .swiper-slide[aria-label="5 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_05.jpg);} +.renewal .visual_slide .swiper-slide[aria-label="1 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_01.jpg) no-repeat;} +.renewal .visual_slide .swiper-slide[aria-label="2 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_02.jpg) no-repeat;} +.renewal .visual_slide .swiper-slide[aria-label="3 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_03.jpg) no-repeat;} +.renewal .visual_slide .swiper-slide[aria-label="4 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_04.jpg) no-repeat;} +.renewal .visual_slide .swiper-slide[aria-label="5 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_05.jpg) no-repeat;} /* main_banner_link */ -.renewal .main_banner_link{position:relative;height:130px;background-color:#fff;border-radius:10px;box-shadow:0 0 5px rgba(45,55,90,0.2);margin:-65px auto 70px auto;} -.renewal .main_banner_link li{position:relative;display:flex;width:calc(100%/5);height:100%;align-items:center;transition:all 0.3s ease-in-out;} +.renewal .main_banner_link{position:relative;height:130px;margin:60px auto 70px auto;} +.renewal .main_banner_link li{position:relative;display:flex;width:calc((100%/5) - 12px);height:100%;background-color:#fff;border-radius:5px;box-shadow:0 0 5px rgba(45,55,90,0.2);align-items:center;transition:all 0.3s ease-in-out;} .renewal .main_banner_link li::after{position:absolute;content:" ";width: calc(100% + 10px);height:calc(100% + 10px);border:3px solid transparent;left:-8px;border-radius:10px;} .renewal .main_banner_link li:hover{z-index: 15;} .renewal .main_banner_link li:hover::after{border:3px solid #e95504;background-color:#fff;box-shadow:0 0 15px rgba(233,85,4,0.3);} .renewal .main_banner_link li a{position:relative;width:100%;text-align:center;z-index:15;} -.renewal .main_banner_link li a::after{position:absolute;content:" ";width:1px;height:92px;background-color:#d5d5d5;right:0;top:50%;transform:translateY(-50%);} -.renewal .main_banner_link li:last-child a::after{display:none;} -.renewal .main_banner_link li:hover a::after{display:none;} .renewal .main_banner_link i{display:block;width:68px;height:68px;margin:0 auto 10px auto;border-radius:100%;background-repeat:no-repeat;} -.renewal .main_banner_link .banner_link_01 i{background-image: url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_01.png);} -.renewal .main_banner_link .banner_link_02 i{background-image: url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_02.png);} -.renewal .main_banner_link .banner_link_03 i{background-image: url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_03.png);} -.renewal .main_banner_link .banner_link_04 i{background-image: url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_04.png);} -.renewal .main_banner_link .banner_link_05 i{background-image: url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_05.png);} +.renewal .main_banner_link .banner_link_01 i{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_01.png);} +.renewal .main_banner_link .banner_link_02 i{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_02.png);} +.renewal .main_banner_link .banner_link_03 i{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_03.png);} +.renewal .main_banner_link .banner_link_04 i{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_04.png);} +.renewal .main_banner_link .banner_link_05 i{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_05.png);} .renewal .main_banner_link li span{color:#e95504;font-weight:500;} /* 하단콘텐츠 공통 */ .renewal .wrap .content_wrap{width:calc((100% - 72px)/3);} +.renewal .wrap .content_wrap .content{height:332px;} .renewal .wrap .content_wrap>.title{display:flex;width:100%;justify-content:space-between;align-items:center;margin:0 0 10px 0;} .renewal .wrap .content_wrap>.title h3{position:relative;font-size:28px;font-weight:bold;padding:0 0 0 20px;} .renewal .wrap .content_wrap>.title h3::after{position:absolute;content:" ";width:6px;height:6px;border:3px solid #e95504;border-radius:100%;left:0;top:9px;} -.renewal .wrap .content_wrap .title .btn_plus{width:35px;height:35px;background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_plus.png) no-repeat center center;text-indent:-9999em;overflow:hidden;border:1px solid #d5d5d5;border-radius:5px;transition:all 0.1s ease-in;} -.renewal .wrap .content_wrap .title .btn_plus:hover{border:1px solid #e95504;background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_plus_hover.png) no-repeat center center;} +.renewal .wrap .content_wrap .title .btn_plus{display:flex;width:65px;height:30px;background:#fff url(/offeduadvc/visitEdu/usr/publish/images/main/btn_plus.png) no-repeat calc(100% + 4px) center;padding:0 4px 0 8px;overflow:hidden;text-align:left;color:#666;line-height:1.6;border:1px solid #d5d5d5;border-radius:5px;justify-content:flex-start;align-items:center;transition:all 0.1s ease-in;} +.renewal .wrap .content_wrap .title .btn_plus:hover{border:1px solid #e95504;background:#fff url(/offeduadvc/visitEdu/usr/publish/images/main/btn_plus_hover.png) no-repeat calc(100% + 4px) center;color:#e95504;} -/* 공지사항, 교육자료실 */ -.renewal .wrap .notice .notice_wrap{height:206px;padding:22px 30px;background-color:#eef0f3;border:1px solid transparent;border-radius:5px;box-sizing:border-box;} -.renewal .wrap .notice .notice_wrap:hover{background-color:#fff;border:1px solid #e5e5e5;box-shadow:0 0 5px rgba(0,0,0,0.2);transition:all 0.3s ease-in-out;} -.renewal .wrap .content_wrap .emphasis{display: inline-flex;justify-content:center;align-items:center;background-color:#e95504;font-weight:400;color:#fff;border-radius:5px;margin:0 8px 0 0;} -.renewal .wrap .content_wrap .notice_wrap .emphasis{width:65px;height:30px;font-size:18px;} -.renewal .wrap .content_wrap .notice_list .emphasis{width:58px;height:26px;font-size:16px;} -.renewal .wrap .content_wrap .notice_wrap dl{margin:0 0 20px 0;} -.renewal .wrap .content_wrap .notice_wrap dt{font-size:22px;font-weight:500;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;} -.renewal .wrap .content_wrap .notice_wrap dd{font-size:18px;font-weight:400;line-height:1.4;margin:20px 0 0 0;} -.renewal .wrap .content_wrap .date{display:flex;min-width:110px;font-size:16px;color:#666;align-items:center;} -.renewal .wrap .content_wrap .notice_list li:hover .date{color:#e95504;} -.renewal .wrap .content_wrap .date i{display:inline-block;width:18px;height:16px;background:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_calendar.png) no-repeat center center;margin:2px 4px 0 0;} -.renewal .wrap .content_wrap .notice_list li:hover .date i{background:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_calendar_hover.png) no-repeat center center;transition:all 0.1s ease-in;} -.renewal .wrap .content_wrap .notice_list li{border-bottom: 1px dashed #d5d5d5;} -.renewal .wrap .content_wrap .notice_list li a{display:flex;height:60px;justify-content:space-between;align-items:center;transition:all 0.1s ease-in;} -.renewal .wrap .content_wrap .notice_list li:hover a{color:#e95504;transition:all 0.3s ease-in-out;} -.renewal .wrap .content_wrap .notice_list .title{width: calc(100% - 125px);font-size:18px;font-weight:500;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;line-height: 1.4;} +/* 공지사항 */ +.renewal .wrap .notice .content{padding:15px 45px;background-color:#fff;border:1px solid #d5d5d5;border-radius: 5px;box-shadow:0 0 5px rgba(0,0,0,0.15);box-sizing:border-box;} +.renewal .wrap .notice .emphasis{display: inline-flex;width:40px;height:20px;justify-content:center;align-items:center;background-color:#e95504;font-size:14px;font-weight:400;color:#fff;border-radius:5px;margin:0 8px 0 0;} +.renewal .wrap .notice .notice_list li{border-bottom: 1px solid #d5d5d5;} +.renewal .wrap .notice .notice_list li:last-child{border:0;} +.renewal .wrap .notice .notice_list li a{display:flex;height:50px;justify-content:space-between;align-items:center;transition:all 0.1s ease-in;} +.renewal .wrap .notice .notice_list li:hover a{color:#e95504;transition:all 0.15s ease-in-out;} +.renewal .wrap .notice .date{display:flex;min-width:110px;font-size:16px;color:#666;align-items:center;font-weight:300;} +.renewal .wrap .notice .notice_list li:hover .date{color:#e95504;} +.renewal .wrap .notice .date i{display:inline-block;width:4px;height:4px;background:#e95504;margin:2px 6px 0 0;border-radius:100%;} +.renewal .wrap .notice .notice_list .title{width: calc(100% - 115px);font-size:18px;font-weight:500;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;line-height: 1.4;} + +/* 자료실 */ +.renewal .wrap .data_notice .notice_list{display:flex;height:100%;align-items:stretch;flex-flow:wrap;justify-content:space-between;flex-direction:column;} +.renewal .wrap .data_notice .notice_list li{width:100%;padding:15.5px 45px;background-color:#fff;border:1px solid #d5d5d5;border-radius: 5px;box-shadow:0 0 5px rgba(0,0,0,0.15);box-sizing:border-box;transition:all 0.05s ease-in-out;} +.renewal .wrap .data_notice .notice_list li:hover{border:1px solid #e95504;transition:all 0.05s ease-in-out;} +.renewal .wrap .data_notice .notice_list li .title{font-size: 18px;font-weight:500;align-items:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;line-height:1.2;transition:all 0.05s ease-in-out;} +.renewal .wrap .data_notice .notice_list li .title i{display:inline-block;width:4px;height:4px;background:#e95504;margin:0 6px 5px 0;border-radius:100%;} +.renewal .wrap .data_notice .notice_list li .date{margin:4.5px 0 0 8px;color:#666;font-weight:300;transition:all 0.05s ease-in-out;} +.renewal .wrap .data_notice .notice_list li:hover .title,.renewal .wrap .data_notice .notice_list li:hover .date{color:#e95504;transition:all 0.05s ease-in-out;} /* 알림판 */ -.renewal .wrap .notify .notify_control{display:flex;width:140px;height:35px;} -.renewal .wrap .notify .notify_control>*{position:unset;width:35px;height:35px;font-size:16px;color:#888;text-align:center;line-height:33px;border:1px solid #d5d5d5;letter-spacing:-1.7px;margin: 0 0 0 -1px;} -.renewal .wrap .notify .notify_control>*:first-child{border-radius:5px 0 0 5px;} -.renewal .wrap .notify .notify_control>*:last-child{border-radius:0 5px 5px 0;} +.renewal .wrap .notify .notify_control{display:flex;height:30px;background-color:#fff;border:1px solid #d5d5d5;border-radius:5px;padding:0 4px 0 0;} +.renewal .wrap .notify .notify_control>*{position:unset;width:23px;height:30px;font-size:16px;color:#888;text-align:center;line-height:28px;letter-spacing:-1.7px;margin: 0 0 0 -1px;} +.renewal .wrap .notify .notify_control .slide_number{width:35px;} .renewal .wrap .notify .notify_control .swiper-button-prev,.renewal .wrap .notify .notify_control .swiper-button-next{background-size:auto;} .renewal .wrap .notify .notify_control .swiper-button-prev::after,.renewal .wrap .notify .notify_control .swiper-button-next::after{display: none;} -.renewal .wrap .notify .notify_control .swiper-button-prev{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_arrow_right.png);background-position-x:-2px;border-right:1px solid transparent;} +.renewal .wrap .notify .notify_control .swiper-button-prev{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_arrow_right.png);background-position-x:-2px;} .renewal .wrap .notify .notify_control .swiper-button-next{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_arrow_left.png);} -.renewal .wrap .notify .notify_control .swiper-button-prev:hover,.renewal .wrap .notify .notify_control .swiper-button-next:hover{position:relative;border:1px solid #e95504;border-right:1px solid #e95504;z-index:12;background-color:#fff;left:0;top:0;} .renewal .wrap .notify .notify_control .swiper-button-prev:hover{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_arrow_right_hover.png);} .renewal .wrap .notify .notify_control .swiper-button-next:hover{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_arrow_left_hover.png);} -.renewal .wrap .notify .notify_control .slide_pause:hover,.renewal .wrap .notify .notify_control .slide_play:hover{background-color: #e95504;border:1px solid #e95504;} -.renewal .wrap .notify .notify_control .slide_pause,.renewal .wrap .notify .notify_control .slide_play{height: 37px;margin: 0 0 0 -0.5px;} -.renewal .wrap .notify .notify_control .slide_pause{background:#b0b0b0 url(/offeduadvc/visitEdu/usr/publish/images/main/btn_pause.png) no-repeat center center;} -.renewal .wrap .notify .notify_control .slide_play{background:#b0b0b0 url(/offeduadvc/visitEdu/usr/publish/images/main/btn_play.png) no-repeat center center;} -.renewal .wrap .notify .content{width:100%;height:388px;overflow: hidden;border-radius:5px;} +.renewal .wrap .notify .notify_control .slide_pause,.renewal .wrap .notify .notify_control .slide_play{height: 30px;margin: 0 0 0 -0.5px;} +.renewal .wrap .notify .notify_control .slide_pause{background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_pause.png) no-repeat center center;} +.renewal .wrap .notify .notify_control .slide_play{background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_play.png) no-repeat center center;} +.renewal .wrap .notify .content{width:100%;height:332px;overflow: hidden;border-radius:5px;} diff --git a/src/main/webapp/visitEdu/usr/publish/css/main_2023_bak.css b/src/main/webapp/visitEdu/usr/publish/css/main_2023_bak.css new file mode 100644 index 00000000..8adc1513 --- /dev/null +++ b/src/main/webapp/visitEdu/usr/publish/css/main_2023_bak.css @@ -0,0 +1,89 @@ +.main {margin-top:130px;} +.main .inner {max-width:1400px;width:100%;margin:0 auto;display:flex;justify-content: space-between;flex-wrap: wrap;box-sizing: border-box;} + +/* visual */ +.renewal .visual_slide{position:relative;width:calc(100% - 120px);height:550px;background-color: #f5f5f5;margin:0 auto;border-radius:20px;z-index:0;overflow:hidden;} +.renewal .visual_slide .swiper-slide .inner{width:100%;} +.renewal .visual_slide .swiper-slide .inner .text_area{height:auto;padding:80px 0 0 40px;box-sizing:border-box;} +.renewal .visual_slide .swiper-slide .inner .text_area *{line-height: 1.4;} +.renewal .visual_slide .swiper-slide .inner .text_area .sub_title{font-size:24px;font-family:'GmarketSansMedium';color:#fff;} +.renewal .visual_slide .swiper-slide .inner .text_area .title{font-size:50px;font-family:'GmarketSansBold';color:#ffe400;} +.renewal .visual_slide .swiper-slide .inner .text_area .summary{font-size:18px;color:#fff;} +.renewal .visual_slide .swiper-slide .inner .text_area a{display:flex;width:175px;height:50px;font-size: 18px;color:#fff;border:1px solid #fff;padding:0 20px;margin:42px 0 0 0;border-radius:26px;align-items:center;justify-content:space-between;box-sizing:border-box;} +.renewal .visual_slide .slide_control{position:relative;left:40px;bottom:150px;width:100%;} +.renewal .visual_slide .slide_control .inner{position:relative;justify-content:flex-start;align-items:center;} +.renewal .visual_slide .slide_control .swiper-pagination{position: relative;} +.renewal .visual_slide .slide_control .swiper-pagination-bullet{background-color:#fff;opacity:0.5;margin:0 4px;} +.renewal .visual_slide .slide_control .swiper-pagination-bullet-active{opacity:1;} +.renewal .visual_slide .slide_control .slide_pause,.renewal .visual_slide .slide_control .slide_play{position:relative;width:8px;height:10px;z-index:10;margin: 5px 0 0 8px;} +.renewal .visual_slide .slide_control .slide_pause{background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_main_visual_pause.png);} +.renewal .visual_slide .slide_control .slide_play{background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_main_visual_play.png);} + +.renewal .visual_slide .swiper-slide[aria-label="1 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_01.jpg);} +.renewal .visual_slide .swiper-slide[aria-label="2 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_02.jpg);} +.renewal .visual_slide .swiper-slide[aria-label="3 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_03.jpg);} +.renewal .visual_slide .swiper-slide[aria-label="4 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_04.jpg);} +.renewal .visual_slide .swiper-slide[aria-label="5 / 5"]{background:url(/offeduadvc/visitEdu/usr/publish/images/main/main_visual_05.jpg);} + +/* main_banner_link */ +.renewal .main_banner_link{position:relative;height:130px;background-color:#fff;border-radius:10px;box-shadow:0 0 5px rgba(45,55,90,0.2);margin:-65px auto 70px auto;} +.renewal .main_banner_link li{position:relative;display:flex;width:calc(100%/5);height:100%;align-items:center;transition:all 0.3s ease-in-out;} +.renewal .main_banner_link li::after{position:absolute;content:" ";width: calc(100% + 10px);height:calc(100% + 10px);border:3px solid transparent;left:-8px;border-radius:10px;} +.renewal .main_banner_link li:hover{z-index: 15;} +.renewal .main_banner_link li:hover::after{border:3px solid #e95504;background-color:#fff;box-shadow:0 0 15px rgba(233,85,4,0.3);} +.renewal .main_banner_link li a{position:relative;width:100%;text-align:center;z-index:15;} +.renewal .main_banner_link li a::after{position:absolute;content:" ";width:1px;height:92px;background-color:#d5d5d5;right:0;top:50%;transform:translateY(-50%);} +.renewal .main_banner_link li:last-child a::after{display:none;} +.renewal .main_banner_link li:hover a::after{display:none;} +.renewal .main_banner_link i{display:block;width:68px;height:68px;margin:0 auto 10px auto;border-radius:100%;background-repeat:no-repeat;} +.renewal .main_banner_link .banner_link_01 i{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_01.png);} +.renewal .main_banner_link .banner_link_02 i{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_02.png);} +.renewal .main_banner_link .banner_link_03 i{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_03.png);} +.renewal .main_banner_link .banner_link_04 i{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_04.png);} +.renewal .main_banner_link .banner_link_05 i{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_visual_05.png);} +.renewal .main_banner_link li span{color:#e95504;font-weight:500;} + +/* 하단콘텐츠 공통 */ +.renewal .wrap .content_wrap{width:calc((100% - 72px)/3);} +.renewal .wrap .content_wrap>.title{display:flex;width:100%;justify-content:space-between;align-items:center;margin:0 0 10px 0;} +.renewal .wrap .content_wrap>.title h3{position:relative;font-size:28px;font-weight:bold;padding:0 0 0 20px;} +.renewal .wrap .content_wrap>.title h3::after{position:absolute;content:" ";width:6px;height:6px;border:3px solid #e95504;border-radius:100%;left:0;top:9px;} +.renewal .wrap .content_wrap .title .btn_plus{width:35px;height:35px;background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_plus.png) no-repeat center center;text-indent:-9999em;overflow:hidden;border:1px solid #d5d5d5;border-radius:5px;transition:all 0.1s ease-in;} +.renewal .wrap .content_wrap .title .btn_plus:hover{border:1px solid #e95504;background:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_plus_hover.png) no-repeat center center;} + +/* 공지사항, 교육자료실 */ +.renewal .wrap .notice .notice_wrap{height:206px;padding:22px 30px;background-color:#eef0f3;border:1px solid transparent;border-radius:5px;box-sizing:border-box;} +.renewal .wrap .notice .notice_wrap:hover{background-color:#fff;border:1px solid #e5e5e5;box-shadow:0 0 5px rgba(0,0,0,0.2);transition:all 0.3s ease-in-out;} +.renewal .wrap .content_wrap .emphasis{display: inline-flex;justify-content:center;align-items:center;background-color:#e95504;font-weight:400;color:#fff;border-radius:5px;margin:0 8px 0 0;} +.renewal .wrap .content_wrap .notice_wrap .emphasis{width:65px;height:30px;font-size:18px;} +.renewal .wrap .content_wrap .notice_list .emphasis{width:58px;height:26px;font-size:16px;} +.renewal .wrap .content_wrap .notice_wrap dl{margin:0 0 20px 0;} +.renewal .wrap .content_wrap .notice_wrap dt{font-size:22px;font-weight:500;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;} +.renewal .wrap .content_wrap .notice_wrap dd{font-size:18px;font-weight:400;line-height:1.4;margin:20px 0 0 0;} +.renewal .wrap .content_wrap .date{display:flex;min-width:110px;font-size:16px;color:#666;align-items:center;} +.renewal .wrap .content_wrap .notice_list li:hover .date{color:#e95504;} +.renewal .wrap .content_wrap .date i{display:inline-block;width:18px;height:16px;background:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_calendar.png) no-repeat center center;margin:2px 4px 0 0;} +.renewal .wrap .content_wrap .notice_list li:hover .date i{background:url(/offeduadvc/visitEdu/usr/publish/images/main/icon_main_calendar_hover.png) no-repeat center center;transition:all 0.1s ease-in;} +.renewal .wrap .content_wrap .notice_list li{border-bottom: 1px dashed #d5d5d5;} +.renewal .wrap .content_wrap .notice_list li a{display:flex;height:60px;justify-content:space-between;align-items:center;transition:all 0.1s ease-in;} +.renewal .wrap .content_wrap .notice_list li:hover a{color:#e95504;transition:all 0.3s ease-in-out;} +.renewal .wrap .content_wrap .notice_list .title{width: calc(100% - 125px);font-size:18px;font-weight:500;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;line-height: 1.4;} + +/* 알림판 */ +.renewal .wrap .notify .notify_control{display:flex;width:140px;height:35px;} +.renewal .wrap .notify .notify_control>*{position:unset;width:35px;height:35px;font-size:16px;color:#888;text-align:center;line-height:33px;border:1px solid #d5d5d5;letter-spacing:-1.7px;margin: 0 0 0 -1px;} +.renewal .wrap .notify .notify_control>*:first-child{border-radius:5px 0 0 5px;} +.renewal .wrap .notify .notify_control>*:last-child{border-radius:0 5px 5px 0;} +.renewal .wrap .notify .notify_control .swiper-button-prev,.renewal .wrap .notify .notify_control .swiper-button-next{background-size:auto;} +.renewal .wrap .notify .notify_control .swiper-button-prev::after,.renewal .wrap .notify .notify_control .swiper-button-next::after{display: none;} +.renewal .wrap .notify .notify_control .swiper-button-prev{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_arrow_right.png);background-position-x:-2px;border-right:1px solid transparent;} +.renewal .wrap .notify .notify_control .swiper-button-next{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_arrow_left.png);} +.renewal .wrap .notify .notify_control .swiper-button-prev:hover,.renewal .wrap .notify .notify_control .swiper-button-next:hover{position:relative;border:1px solid #e95504;border-right:1px solid #e95504;z-index:12;background-color:#fff;left:0;top:0;} +.renewal .wrap .notify .notify_control .swiper-button-prev:hover{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_arrow_right_hover.png);} +.renewal .wrap .notify .notify_control .swiper-button-next:hover{background-image:url(/offeduadvc/visitEdu/usr/publish/images/main/btn_arrow_left_hover.png);} +.renewal .wrap .notify .notify_control .slide_pause:hover,.renewal .wrap .notify .notify_control .slide_play:hover{background-color: #e95504;border:1px solid #e95504;} +.renewal .wrap .notify .notify_control .slide_pause,.renewal .wrap .notify .notify_control .slide_play{height: 37px;margin: 0 0 0 -0.5px;} +.renewal .wrap .notify .notify_control .slide_pause{background:#b0b0b0 url(/offeduadvc/visitEdu/usr/publish/images/main/btn_pause.png) no-repeat center center;} +.renewal .wrap .notify .notify_control .slide_play{background:#b0b0b0 url(/offeduadvc/visitEdu/usr/publish/images/main/btn_play.png) no-repeat center center;} +.renewal .wrap .notify .content{width:100%;height:388px;overflow: hidden;border-radius:5px;} + diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_arrow_left.png b/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_arrow_left.png new file mode 100644 index 00000000..748e81b4 Binary files /dev/null and b/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_arrow_left.png differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_arrow_right.png b/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_arrow_right.png new file mode 100644 index 00000000..6b75e9ca Binary files /dev/null and b/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_arrow_right.png differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_pause.png b/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_pause.png index f19dfb64..01d8affc 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_pause.png and b/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_pause.png differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_play.png b/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_play.png index 7005c923..1fd546ab 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_play.png and b/src/main/webapp/visitEdu/usr/publish/images/main/btn_main_visual_play.png differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/btn_pause.png b/src/main/webapp/visitEdu/usr/publish/images/main/btn_pause.png index 7b5daf7f..bde92726 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/btn_pause.png and b/src/main/webapp/visitEdu/usr/publish/images/main/btn_pause.png differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/btn_play.png b/src/main/webapp/visitEdu/usr/publish/images/main/btn_play.png index 27de73a2..f06ce907 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/btn_play.png and b/src/main/webapp/visitEdu/usr/publish/images/main/btn_play.png differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_notify_img_01.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_notify_img_01.jpg index 2a38eae0..4bdf8e81 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/main_notify_img_01.jpg and b/src/main/webapp/visitEdu/usr/publish/images/main/main_notify_img_01.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_notify_img_02.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_notify_img_02.jpg index 33cb5ad4..5e6cebda 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/main_notify_img_02.jpg and b/src/main/webapp/visitEdu/usr/publish/images/main/main_notify_img_02.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_01.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_01.jpg index 37aa4299..774f33ce 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_01.jpg and b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_01.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_01_bak.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_01_bak.jpg new file mode 100644 index 00000000..37aa4299 Binary files /dev/null and b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_01_bak.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_02.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_02.jpg index 84f4d975..6f77002d 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_02.jpg and b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_02.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_02_bak.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_02_bak.jpg new file mode 100644 index 00000000..84f4d975 Binary files /dev/null and b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_02_bak.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_03.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_03.jpg index 132056f3..4e7d41a1 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_03.jpg and b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_03.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_03_bak.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_03_bak.jpg new file mode 100644 index 00000000..132056f3 Binary files /dev/null and b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_03_bak.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_04.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_04.jpg index 2f05c591..dc2bd3d7 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_04.jpg and b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_04.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_04_bak.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_04_bak.jpg new file mode 100644 index 00000000..2f05c591 Binary files /dev/null and b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_04_bak.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_05.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_05.jpg index ecf18ff2..b03ff63c 100644 Binary files a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_05.jpg and b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_05.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_05_bak.jpg b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_05_bak.jpg new file mode 100644 index 00000000..ecf18ff2 Binary files /dev/null and b/src/main/webapp/visitEdu/usr/publish/images/main/main_visual_05_bak.jpg differ diff --git a/src/main/webapp/visitEdu/usr/publish/index_2023.html b/src/main/webapp/visitEdu/usr/publish/index_2023.html index c2ce30a9..d2535804 100644 --- a/src/main/webapp/visitEdu/usr/publish/index_2023.html +++ b/src/main/webapp/visitEdu/usr/publish/index_2023.html @@ -159,17 +159,16 @@
+ +

대국민 저작권 교육 서비스1

찾아가는 저작권 교육!

-

- 편리하고 안전한 저작권 이용환경 조성을 통해
- 올바른 저작권 문화 구축에 앞장서겠습니다. -

- 교육신청 등록 +

편리하고 안전한 저작권 이용환경 조성을 통해 올바른 저작권 문화 구축에 앞장서겠습니다.

+ 교육신청 등록
@@ -178,11 +177,8 @@

대국민 저작권 교육 서비스2

찾아가는 저작권 교육!

-

- 편리하고 안전한 저작권 이용환경 조성을 통해
- 올바른 저작권 문화 구축에 앞장서겠습니다. -

- 교육신청 등록 +

편리하고 안전한 저작권 이용환경 조성을 통해 올바른 저작권 문화 구축에 앞장서겠습니다.

+ 교육신청 등록
@@ -191,11 +187,8 @@

대국민 저작권 교육 서비스3

찾아가는 저작권 교육!

-

- 편리하고 안전한 저작권 이용환경 조성을 통해
- 올바른 저작권 문화 구축에 앞장서겠습니다. -

- 교육신청 등록 +

편리하고 안전한 저작권 이용환경 조성을 통해 올바른 저작권 문화 구축에 앞장서겠습니다.

+ 교육신청 등록
@@ -204,11 +197,8 @@

대국민 저작권 교육 서비스4

찾아가는 저작권 교육!

-

- 편리하고 안전한 저작권 이용환경 조성을 통해
- 올바른 저작권 문화 구축에 앞장서겠습니다. -

- 교육신청 등록 +

편리하고 안전한 저작권 이용환경 조성을 통해 올바른 저작권 문화 구축에 앞장서겠습니다.

+ 교육신청 등록
@@ -217,11 +207,8 @@

대국민 저작권 교육 서비스5

찾아가는 저작권 교육!

-

- 편리하고 안전한 저작권 이용환경 조성을 통해
- 올바른 저작권 문화 구축에 앞장서겠습니다. -

- 교육신청 등록 +

편리하고 안전한 저작권 이용환경 조성을 통해 올바른 저작권 문화 구축에 앞장서겠습니다.

+ 교육신청 등록
@@ -233,7 +220,7 @@ - +