/** * 이 파일은 경기대 연동모듈의 일부입니다. (https://www.imodule.kr) * * 경기대 포털 스타일시트 * * @file /templets/bbits/styles/style.css * @author Arzz (arzz@arzz.com) * @license MIT License * @version 3.0.0.160910 */ @import url(./font.css); html, body {font-size:0.87rem; color:#333; font-family: "Pretendard" !important;} /* 12px = 0.87rem (14px=1rem 기준) */ body {background:#f6f8fa} input, textarea, button, select {border:0 none} input[type=button], input[type=submit], button {cursor:pointer} ul, ol, li, dl, dt, dd {list-style:none} a {color:#333; outline:none; text-decoration:none} /* a:hover {text-decoration:underline} */ body {background:#fff;} @media (min-width: 1420px) { .container { width: 1400px; } } .dim {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.5); z-index:9;} .dim.on {display:block;} /* 퀵메뉴 배경 스타일 조정 */ /* aside#following-content > ul > li:first-child > a {background:var(--123123, linear-gradient(102deg, #EB6FA6 -60.82%, #611A87 163.68%)) !important;} */ /* aside#following-content > ul > li:last-child > a {background:var(--123123, linear-gradient(102deg, #EB6FA6 -60.82%, #611A87 163.68%)) !important;} */ /* 헤더 */ /* div[data-role=wrapper] > header {position:absolute; top:0; left:0; width:100%; height:100px; z-index:13; transition:all 0.2s;} */ div[data-role=wrapper] > header {position:absolute; top:0; left:0; width:100%; height:0; z-index:13;} div[data-role=wrapper] > header.on {background:#fff; border-bottom:0 none; box-shadow:0 15px 15px 10px rgba(0,0,0,.2); padding-bottom: 450px;} div[data-role=wrapper] > header > .top {height:44px;background:rgba(0, 0, 0, 0.60); transition: background 0.2s ease-in-out;} div[data-role=wrapper] > header.on > .top {background:unset;} div[data-role=wrapper] > header > .top > div.container > .link {float:left; font-size:0} div[data-role=wrapper] > header > .top > div.container > .user {display: flex; align-items: center; justify-content:end; font-size:0} div[data-role=wrapper] > header > .top > div.container > .user > a > i {margin-right:8px;} div[data-role=wrapper] > header > .top > div.container > .user > a.join {background: transparent; font-size: 1rem;} div[data-role=wrapper] > header > .top > div.container > .user div[data-widget=coursemos-shareloginbar] > button {background: transparent; border: 1px solid rgba(255, 255, 255, 0.5); font-size: 0.87rem; color: rgba(255, 255, 255, 0.8); width: auto; padding: 0px 10px;} div[data-role=wrapper] > header > .top > div.container > div > a {display:inline-block; position:relative; padding:0 20px; font-size:14px;font-weight: bold; line-height:44px; text-decoration:none; color:#FCFCFC;opacity: 0.6;} div[data-role=wrapper] > header.on > .top > div.container > div > a {color: #000;} /* div[data-role=wrapper] > header.on > .top > div.container > div > a {display:inline-block; position:relative; padding:0 20px; font-size:1rem;font-weight: bold; line-height:44px; text-decoration:none; color:#000000;opacity: 0.6;} */ div[data-role=wrapper] > header > .top > div.container > div > a:hover {color:#fff; background:rgba(0,0,0,.3)} /* div[data-role=wrapper] > header > .top > div.container > div > a:after {content:''; display:block; position:absolute; bottom:0; left:50%; width:0; height:2px; background:#C40781; transform:translateX(-50%); transition:all 0.2s;} */ div[data-role=wrapper] > header > .top > div.container > div > p.bbits {display:inline-block; position:relative;font-weight: bold; padding:0 20px; font-size:14px; line-height:44px; color:#E50E84; cursor:pointer;} div[data-role=wrapper] > header > .top > div.container > div > a:hover:after {width:100%;} div[data-role=wrapper] > header > nav {height:86px;} div[data-role=wrapper] > header > nav > .top_menu {position:relative; background:rgba(0, 0, 0, 0.60); transition: background 0.2s ease-in-out; } div[data-role=wrapper] > header.on > nav > .top_menu {background:unset; } div[data-role=wrapper] > header > nav > .top_menu > div.container {font-size:0; height:87px; line-height:1; text-align:center;} div[data-role=wrapper] > header > nav > .top_menu > div.container > h1 {display:inline-block; float:left; width:253px; height:87px; font-size:0; background-position:0 50%; background-repeat:no-repeat; background-size:contain; vertical-align:middle} div[data-role=wrapper] > header > nav > .top_menu > div.container > h1 > a {font-size:0; display:block; width:100%; height:100%; text-decoration:none;} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul {display:flex; align-items: center; justify-content:end; width:calc(100% - 253px); height:87px; font-size:0; vertical-align:middle; text-align:center;} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li {display:inline-block; position:relative; height:87px} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li > a {display:block; font-size:1.29rem; height:87px;font-weight: bold; line-height:87px; text-decoration:none; color:#fff; width: 175px;} div[data-widget=coursemos-unifiedloginbar][data-templet=default] > button[type=button] {background-color: #8F4CDD !important;padding: 6px 12px !important;border: none !important;border-radius: 4px !important;line-height: 17px !important;font-weight: 700;} div[data-role=wrapper] > header.on > .top > div.container > div > a.join {color: #fff !important;} div[data-role=wrapper] > header > .top > div.container > div > a.join {margin-right: 8px; opacity: 1 !important; background-color: #737380 !important;padding: 6px 12px !important;border: none !important;border-radius: 4px !important;line-height: 17px !important;font-weight: 700;} /* 호버 */ div[data-role=wrapper] > header.on > nav {border-bottom:1px solid #F5F5F5; transition:border-bottom 0.2s;} div[data-role=wrapper] > header.on > nav > .top_menu > div.container > h1 {background-image:url(../images/logo_hover.png) !important;} div[data-role=wrapper] > header.on > nav > .top_menu > div.container > ul > li > a {color:#929292;} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li > div.submenu {display:block; position:absolute; left:-15px; top:87px; text-align:left; width:100%;} div[data-role=wrapper] > header.on > nav > .top_menu > div.container > ul > li:hover > div.submenu {display:block} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li > div.submenu > ul {padding:20px 0; white-space:nowrap} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li > div.submenu > ul > li {display:block; width:100%; text-align:left; vertical-align:top;padding: 0px 16px;} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li > div.submenu > ul > li > a {display:block; font-size:1.14rem; line-height:40px; color:#929292; white-space:nowrap; transition:all 0.3s;} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li > div.submenu > ul > li > a:hover {text-decoration:none; color: #000;} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li > div.submenu > ul > li div.depth3 span {position: relative; padding-left:10px; font-size: 0.86rem; color:#a5a5a5;} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li > div.submenu > ul > li div.depth3 span::before{content:""; position: absolute; top:50%; left: 0; display: inline-block; width: 2px; height: 2px; background-color:#a5a5a5; border-radius:50%} div[data-role=wrapper] > header > nav > .top_menu > div.container > div {float:right; width:50px; height:50px; margin:20px -10px 0 0; vertical-align:middle; display:inline-block} div[data-role=wrapper] > header > nav > .top_menu > div.container > div > button {display:inline-block; background:transparent; border:0px; color:#fff; width:50px; height:50px; text-align:center; line-height:50px; padding:0px; vertical-align:middle; cursor:pointer; font-size:2.57rem} div[data-role=wrapper] > header > np_menu > div.container > div > button:hover {color:#fff} div[data-role=wrapper] > header > nav > .top_menu > div.container > div > button[data-action=search] {font-size:1.79rem;} /* header > nav > .top_menu > div.container > div > button[data-action=all] {display:none} */ div[data-role=wrapper] > header > nav > .top_menu > div.container > div > button[data-action=all].opened > i:before {content:"\eb04";} div[data-role=wrapper] > header > nav > .top_menu > div.container button.slide {display:none; } div[data-role=wrapper] > header > nav > .top_all_menu {position:relative; top:-2px; right:0; z-index:12; width:100%; padding:20px 0px; background-color:#2A2C7F; display:none; z-index:999} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul {list-style:none; display:table; table-layout:fixed; width:calc(100% + 40px); margin:0px -20px; padding:0px; box-sizing:border-box;} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li {display:table-cell; width:100%; vertical-align:top; border-left:1px solid rgba(255,255,255,0.1); padding-left:0px;} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li:first-child {border-left:0px solid rgba(255,255,255,0.3);} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li > div.box {padding:10px 20px;} div[data-role=wrapper] > header > nav > .top_all_menu > div > .to.container > ul > li > div.box:first-child {min-height:260px;} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li > div.box > h4 {font-size:1.43rem; color:#fff; margin-bottom:20px;} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li > div.box > ul {list-style:none;} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li > div.box > ul > li > i {width:2px; height:2px; display:block; float:left; margin:14px 8px 14px 0px; background:rgba(255,255,255,0.7); vertical-align:middle;} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li > div.box > ul > li > a {display:inline-block; max-width:calc(100% - 10px); min-height:20px; line-height:20px; font-size:1rem; color:rgba(255,255,255,0.7); text-decoration:none; vertical-align:middle; margin:5px 0px; box-sizing:border-box; word-break:break-word; word-wrap:break-word;} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li > div.box > ul > li > a:hover {color:#fff; text-decoration:underline;} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li > div.box > ul > li > ul {list-style:none; margin-bottom:10px} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li > div.box > ul > li > ul > li {padding-left:10px} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li > div.box > ul > li > ul > li > a {color:rgba(255,255,255,0.5); text-decoration:none; font-size:0.86rem} div[data-role=wrapper] > header > nav > .top_all_menu > div.container > ul > li > div.box > ul > li > ul > li > a:hover {color:#fff; text-decoration:underline;} div[data-role=wrapper] > header > nav > .top_all_menu > div.container {position:relative;} div[data-role=wrapper] > header > nav > .top_all_menu > div.container:after {top:0; right:15px; border:solid 0px transparent; content:" "; height:0; width:0; position:absolute; border-bottom-color:#2A2C7F; border-width:10px; margin-top:-40px;} /* oz46 GNB */ div[data-role=wrapper] > header.on > nav > .top_menu > div.container > div.submenu {display:flex;} div[data-role=wrapper] > header.on div[data-widget=coursemos-userbar][data-templet=topbar] * {color:#666 ;} div[data-role=wrapper] > header.on div[data-widget=coursemos-userbar][data-templet=topbar] > button[data-action=notification] i {filter: brightness(0) invert(0.6);} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li:hover a {color:#f58e4d; border-bottom: 3px solid #f58e4d;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu {all:unset; font-size: 1rem; display:none; width: 100%; justify-content: space-between; position: relative; top:-1px; height:0; padding-bottom: 320px;transform: translateX(-10px);} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu:after {content:""; position: absolute; width:100%; height: 1px; bottom: 0; right:50%; transform: translateX(50%);} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu div.img_box {flex-shrink: 0; position: relative; bottom: 0; user-select: none; pointer-events: none;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu div.img_box > div{position: absolute; right:40px; top:50px;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu div.img_box > div p {color:#fff; font-size: 1.14rem; text-align: right;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu div.img_box > div p.subheading {font-size: 1.71rem; padding-bottom: 10px; font-weight: 600;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu div.menu_box{flex:1; display:flex;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_box {display:flex;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_box > li {display:flex;flex-direction: column; height:320px;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_box > li > div.menu_header a > svg{stroke:#222; } div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_box > li.on > div.menu_header {border-bottom: 3px solid #f58e4d;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_box > li.on > div.menu_header a > svg {stroke: #f58e4d !important;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_box > li:last-child {border-right: 1px solid #ddd;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu div.menu_header {box-sizing: border-box; padding-inline:30px; padding-block:16px; height:53px; background-color: #f4f4f4; color:#222; font-size: 1.29rem; letter-spacing: -0.01em; font-weight: 600; width: 190px; max-width:240px; border-bottom: 3px solid transparent; text-align: left; white-space: nowrap; border-right: 1px solid #ddd;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu div.menu_header a{height:17px;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu div.menu_header:last-child {border-right: none;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_list {width:142px; flex:1; display:flex; flex-direction: column; gap: 20px; padding:0 16px; padding-top:20px;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_list > li.menu_item {text-align: left;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_list > li.menu_item a{font-size: 1.14rem; color:#222;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_list > li.menu_item:hover a{color:#f58e4d;} div[data-role=wrapper] > header > nav > .top_menu > div.container > div.submenu ul.menu_list:first-child {border-left: 1px solid #ddd;} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li.on {border-bottom: 3px solid #f58e4d;} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul > li {border-bottom: 3px solid transparent;} div[data-role=wrapper] > header.fixed > .top {background-color: #fff;} div[data-role=wrapper] > header.fixed > nav > .top_menu {background-color: #fff;} div[data-role=wrapper] > header.fixed > nav > .top_menu > div.container > ul > li > a {color: #929292;} /* div[data-role=wrapper] > header.fixed > .top > div.container > div > a {color:#000;} */ /* 서브페이지 헤더 fixed */ div[data-role=wrapper] > header.fixed {position:fixed; padding-bottom:130px; background-color:#fff; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05); transition:none;} div[data-role=wrapper] > header.fixed > nav > .top_menu > div.container > div > button {color:#000;} div[data-role=wrapper] > header.fixed.on {padding-bottom:450px; transition:height 0.2s;} div[data-role=wrapper] > header.fixed > nav > .top_menu > div.container > h1 {background-image:url(../images/logo_hover.png) !important;} @media (max-width:1199px) { div[data-role=wrapper] > header.fixed.on {padding-bottom:132px;} } /* 메인 */ /* main > .visual {position:relative; height:100vh; background-image: url(../images/bg_index.png);background-size: cover;background-repeat: no-repeat;background-position: 50% 50%;} */ main > .visual {position:relative; } main > .visual > .visual_img {position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1} main > .visual > .visual_img {width:100%; height:100%; background-repeat:no-repeat; background-position:center; background-size:cover} main > .visual > .visual_img div.bg_cover {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.5);} main > .visual > .cnt {position: absolute; top:367px; left:50%; transform:translateX(-50%); display: flex; flex-direction: column;} main > .visual > .cnt:after {content:''; display:block; clear:both} main > section + section {margin-top: 100px;} main > article + section {margin-top: 100px;} main > section + article {margin-top: 100px;} main > .visual ~ section.info {padding:20px 0px 200px; background:url(../images/info_bg.png) no-repeat bottom center #070423; background-size:cover;} main > .visual ~ section.haksa {padding:150px 0px;} main > .visual div.program {display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:182px;} main > .visual div.program div.program_txt {display: flex; flex-direction: column; justify-content:center; gap:20px;} main > .visual div.program div.program_txt div.program_icon {width:84px; height:84px; background:url(../images/ship_icon.svg) no-repeat center center;} main > .visual div.program div.program_txt h4 {color:#fff; font-size: 4.29rem; font-weight: 900;} main > .visual div.program div.program_txt h4 > span {padding:6px 23px; margin-right: 14px; background: var(--123123, linear-gradient(102deg, #EB6FA6 -60.82%, #611A87 163.68%)); border-radius:26px; font-size: 3.57rem;} main > .visual div.program div.program_txt p {text-align:left; color:#fff; font-size: 1.71rem; font-weight: 300;} main > .visual div.program div.board {width:calc(50% - 148px); height:257px;} main > .visual div.program div.board div.top {display:flex; flex-direction: column; gap:19px;} main > .visual div.program div.board div.top h3 {font-size:2.29rem; font-weight: 700; color: #fff;} main > .visual div.program div.board div.top ul.board_tab {display:flex; align-items:center; width:max-content; border-radius:10px; border:1px solid #fff;} main > .visual div.program div.board div.top ul.board_tab li {width:103px; height:40px; border-right:1px solid #fff;} main > .visual div.program div.board div.top ul.board_tab li:last-child {border-right:none;} main > .visual div.program div.board div.top ul.board_tab li button {width:100%; height:100%; background:transparent; color:#fff; font-weight: 500; font-size: 1.14rem;} main > .visual div.program div.board div.top ul.board_tab li.selected button {background:#fff; font-size: 1.14rem; font-weight: 500; color:#02020B;} main > .visual div.program div.board div.top ul.board_tab li:nth-child(1).selected button {border-radius:7px 0px 0px 7px;} main > .visual div.program div.board div.top ul.board_tab li:nth-child(2).selected button {border-radius:0;} main > .visual div.program div.board div.top ul.board_tab li:nth-child(3).selected button {border-radius:0px 7px 7px 0px;} main > .visual div.program div.board div.notice_cnt {margin-top:10px;} main > .visual > .cnt > .program aside.login {width:480px;} main > .info div[data-role=tab][data-name=program] > div[data-tab=pormotion] {height:100%;} article.notice {background-color: #F4F4F4; padding: 20px 0px;margin-top: 0px;} article.notice > div.container > div.notice_justify {display: flex; align-items: center; justify-content: space-between;} article.notice > div.container > div.notice_justify > div.notice_wrap {width: 100%;box-sizing: border-box; display: flex; align-items: center; gap: 24px;} article.notice > div.container > div.notice_justify > div.notice_wrap > div.notice_tag {padding: 8px 12px;border-radius: 100px;border: 1px solid #000;} article.notice > div.container > div.notice_justify > div.notice_wrap > div.notice_tag > p {color: #000;font-size: 1.29rem;font-weight: 700;line-height: 24px;} article.notice > div.container > div.notice_justify div.more_btn {display: flex ;align-items: center;gap: 32px;} article.notice > div.container > div.notice_justify div.more_btn > div.more_btn_bar {width: 1px ;height: 60px;background: #c4c4c4;} article.notice > div.container > div.notice_justify div.more_btn > a.more_btn_link {display: flex;align-items: center;gap: 4px;} article.notice > div.container > div.notice_justify div.more_btn > a.more_btn_link > p {color: #000;font-size: 1.29rem;font-weight: 700;line-height: 24px;white-space: pre;} section.gallery_notice {overflow: hidden;} section.gallery_notice > div.container > div.flex_c_box {display: flex; flex-direction: column; gap: 36px;} section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_title > h4 {color: #000;font-size: 1.71rem;font-weight: 700;line-height: 32px;letter-spacing: -0.48px;} section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab {display: flex; align-items: center;justify-content: space-between;} section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab > ul[data-name] {display: flex; align-items: center; gap: 8px;} section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab > ul[data-name] > li[data-tab] button {display: flex;padding: 12px 24px;justify-content: center;align-items: center;gap: 10px;border-radius: 50px;border: 1px solid #C4C4C4;background: #FFF;cursor: pointer;} section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab > ul[data-name] > li[data-tab].selected button{border-radius: 50px;background: #8F4CDD;color: #FFF;font-size: 1.14rem;font-weight: 400;line-height: normal;} section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab > div.ab_btn {display: flex; align-items: center;gap: 24px;} section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab > div.ab_btn > div.swiper-button-next{cursor: pointer; display: flex;align-items: center;justify-content: center; width: 40px;height: 40px;border-radius: 40px;border: 1px solid #eee;background-color: #fff; color:#000; transform: rotate(90deg);} section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab > div.ab_btn > div.swiper-button-prev{cursor: pointer; display: flex;align-items: center;justify-content: center; width: 40px;height: 40px;border-radius: 40px;border: 1px solid #eee;background-color: #fff; color:#000;transform: rotate(270deg);} section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab > div.ab_btn > div.swiper-button-next::after{content:'\e619'; font-family:'XEIcon'; font-size:1.36rem; } section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab > div.ab_btn > div.swiper-button-prev::after{content:'\e619'; font-family:'XEIcon'; font-size:1.36rem; } /* 위젯 */ .thema_bg {background-color:#182f7a} .point_bg {background-color:#002147} /* main > .ctl ul[data-role=list] {margin-left:-20px; margin-top:-20px; font-size:0;} main > .ctl ul[data-role=list] > li {width:25%; padding-left:20px; padding-top:20px; box-sizing:border-box; display:inline-block; vertical-align:top;} */ main > .ctl ul[data-role=list] > li.empty {display:block; width:auto; padding-left:0px; padding-top:0px; margin-left:20px; margin-top:30px; height:425px; background:#f5f5f5 url(../images/noprogram.png) no-repeat 50% 150px; box-sizing:border-box; padding-top:250px; font-size:1.43rem; text-align:center;} main > .ctl div[data-role=item] {margin:0 10px; border:1px solid #ebebeb;} main > .ctl div[data-role=item] > div.cover {width:100%; padding-bottom:60%; height:0; background-image:url(../images/noimage.png); background-size:cover; background-position:absolute; position:relative; box-shadow:0px 1px 3px rgba(0,0,0,0.1);} main > .ctl div[data-role=item] > div.cover > a {display:block; width:100%; height:100%; position:absolute; top:0; left:0; font-size:0; z-index:5;} main > .ctl div[data-role=item] > div.cover > label {position:absolute; width:60px; height:60px; color:#fff; font-size:0px; padding:10px 0px; text-align:center; box-sizing:border-box;} main > .ctl div[data-role=item] > div.cover > label span {display:block; height:20px; line-height:20px; font-size:1rem; letter-spacing:-1px;} main > .ctl div[data-role=item] > div.cover > label span.dday {font-weight:bold;} main > .ctl div[data-role=item] > div.cover > label span.point i {display:inline-block; width:16px; height:16px; border:1px solid #fff; border-radius:50%; line-height:16px; font-style:normal; margin:1px 3px 1px 0px; vertical-align:middle; font-size:0.79rem;} main > .ctl div[data-role=item] > div.cover > label.step1 {background-color:rgba(41,196,137,0.8);} main > .ctl div[data-role=item] > div.cover > label.step2 {background-color:rgba(51,150,234,0.8);} main > .ctl div[data-role=item] > div.cover > label.step3 {background-color:rgba(248,51,143,0.8);} main > .ctl div[data-role=item] > div.cover > label.step4 {background-color:rgba(129,129,140,0.8);} main > .ctl div[data-role=item] > div.cover > div.graph {background:rgba(0,0,0,0.75); width:100%; height:100%; position:absolute; top:0; left:0; font-size:0; z-index:1; display:none;} main > .ctl div[data-role=item] > div.cover > div.graph > div {width:100%; height:100%; position:relative; padding:20px 20px 40px 40px; box-sizing:border-box;} main > .ctl div[data-role=item] > div.cover > div.graph > div > .grid {display:block; width:100%; height:100%; box-sizing:border-box; border-left:1px solid rgba(255,255,255,0.4); border-bottom:1px solid rgba(255,255,255,0.4); border-top:1px solid rgba(255,255,255,0.4);} main > .ctl div[data-role=item] > div.cover > div.graph > div > .grid > i {display:block; height:10%; border-bottom:1px solid rgba(255,255,255,0.1); box-sizing:border-box;} main > .ctl div[data-role=item] > div.cover > div.graph > div > .grid > i:nth-child(5) {border-bottom:1px solid rgba(255,255,255,0.4);} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.y {position:absolute; top:10px; left:0px; bottom:30px; width:40px; vertical-align:middle; font-size:0.86rem;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.y > ul {position:relative; width:100%; height:100%; list-style:none;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.y > ul > li {position:absolute; left:0px; line-height:20px; width:35px; text-align:right; color:rgba(255,255,255,0.8); font-size:0.71rem;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.y > ul > li:nth-child(1) {top:0px;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.y > ul > li:nth-child(2) {top:50%; margin-top:-10px;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.y > ul > li:nth-child(3) {bottom:0px;} main > .ctl div[data-role=item] > div.cover > div.graph > div > ul.x {display:table; width:100%; table-layout:fixed; list-style:none;} main > .ctl div[data-role=item] > div.cover > div.graph > div > ul.x > li {display:table-cell; font-size:0.79rem; text-align:center; padding-top:8px; color:rgba(255,255,255,0.8); line-height:14px; height:28px;} main > .ctl div[data-role=item] > div.cover > div.graph > div > ul.x > li > span {height:28px; line-height:14px; overflow:hidden; display:block;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.item {position:absolute; top:20px; left:40px; right:20px; bottom:40px;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.item > ul {list-style:none; display:table; width:100%; height:100%; table-layout:fixed;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.item > ul > li {display:table-cell; vertical-align:bottom; text-align:center;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.item > ul > li > div {display:inline-block; width:80%; max-width:10px; background:transparent;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.item > ul > li:nth-child(1) > div {background:#2A8BD1;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.item > ul > li:nth-child(2) > div {background:#0BBCD3;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.item > ul > li:nth-child(3) > div {background:#28CC96;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.item > ul > li:nth-child(4) > div {background:#F9BC4B;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.item > ul > li:nth-child(5) > div {background:#FA8750;} main > .ctl div[data-role=item] > div.cover > div.graph > div > div.item > ul > li:nth-child(6) > div {background:#EF5648;} main > .ctl div[data-role=item]:hover > div.cover > div.graph {display:block;} main > .ctl div[data-role=item] > div.content {padding:20px;} main > .ctl div[data-role=item] > div.content > b {display:block; font-size:1.43rem; height:50px; line-height:25px; letter-spacing:-1px; overflow:hidden;} main > .ctl div[data-role=item] > div.content > b > a {color:#000; text-decoration:none;} main > .ctl div[data-role=item] > div.content > label {display:block; margin-top:20px; height:15px; font-size:0; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} main > .ctl div[data-role=item] > div.content > label > span {display:inline-block; height:15px; line-height:15px; font-size:1rem;} main > .ctl div[data-role=item] > div.content > label > span.category {color:#666; padding-right:10px; border-right:1px solid #e0e0e0;} main > .ctl div[data-role=item] > div.content > label > span.department {color:#3076d6; padding-left:10px;} main > .ctl div[data-role=item] > div.content > label > span > a {color:inherit; text-decoration:none;} main > .ctl div[data-role=item] > div.content > div.schedule {height:30px; line-height:30px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; font-size:1rem; color:#999;} main > .ctl div[data-role=item] > div.content > div.tags {height:20px; font-size:0; overflow:hidden; list-style:none; margin-top:20px;} main > .ctl div[data-role=item] > div.content > div.tags > a {display:inline-block; white-space:nowrap; margin-right:10px; height:20px; line-height:20px; font-size:1rem; text-decoration:none; color:#333;} main > .ctl div[data-role=item] > div.content > div.progress {margin-top:20px; height:3px; background:#e0e0e0;} main > .ctl div[data-role=item] > div.content > div.progress > div {background:#0088cc; height:3px;} main > .ctl div[data-role=item] > div.content > div.progress.date > div {background:#ef343b;} main > .ctl div[data-role=item] > div.content > div.status {margin-top:5px;} main > .ctl div[data-role=item] > div.content > div.status > i {width:24px; height:24px; border:1px solid #e0e0e0; border-radius:50%; vertical-align:middle; font-size:1rem; color:#999; box-sizing:border-box; text-align:center; overflow:hidden; line-height:22px; margin-right:5px;} main > .ctl div[data-role=item] > div.content > div.status > span {display:inline-block; height:24px; line-height:24px; color:#999; font-size:0.93rem; vertical-align:middle;} main > .ctl div[data-role=item] > div.content > div.status > span.applicant {float:right;} main > .ctl div[data-role=item] > div.content > div.status > span.applicant > b {color:#0088cc;} main > .ctl div[data-role=item] > div.content a:hover {color:#002147;} main > .ctl + main > .ctl {margin-top:20px;} main > .ctl h4 {font-size:1.43rem; margin-bottom:30px; color:#000} main > .ctl div[data-role=input][data-name=category] {width:240px;} main > .ctl div[data-role=input][data-name=category] > button {border-color:transparent;} main > .ctl div[data-role=input][data-name=category] > button:hover {border-color:#e1e1e1;} main > .ctl div[data-role=input][data-name=category] > button:hover > span > i {color:transparent;} main > .ctl div[data-role=input][data-name=category] > button > span {font-size:1.29rem; font-weight:bold;} main > .ctl div[data-role=input][data-name=category] > button > span > i {float:left; margin-left:-10px; font-size:1rem; width:20px; height:38px; line-height:38px; vertical-align:middle; color:#182f7a; text-align:left;} main > .ctl div[data-role=input][data-name=category] > button > i {font-size:1rem;} main > .ctl div[data-role=input][data-name=category] > button[disabled] {border-color:transparent !important; background:transparent !important; opacity:1.0 !important; cursor:default !important;} main > .ctl div[data-role=input][data-name=category] > button[disabled] > i {color:transparent !important;} main > .ctl div[data-role=input][data-name=category] > button[disabled]:hover > span > i {color:#182f7a;} main > .ctl div[data-role=input][data-name=category] > ul > li {font-size:1.14rem; padding-left:20px;} main > .ctl div[data-role=input][data-name=category] > button:focus {border-color:#66afe9;} main > .ctl div[data-role=input][data-name=category] > button:focus > span > i {color:transparent;} main > .ctl div[data-role=input][data-name=category].extend > button {border-color:#66afe9;} main > .ctl div[data-role=input][data-name=category].extend > button > span > i {color:transparent;} main > .ctl div[data-role=list] {width:100%; position:relative;} main > .ctl div[data-role=list] > div {height:100%; overflow:hidden} main > .ctl div[data-role=list] > div > ul {width:calc(100% + 20px); height:calc(100% + 30px); margin-left:-10px; overflow-x:hidden; overflow-y:hidden; list-style:none; white-space:nowrap; font-size:0; -webkit-overflow-scrolling:touch;} main > .ctl div[data-role=list] > div > ul > li {display:inline-block; vertical-align:top; width:25%; padding-left:20px; box-sizing:border-box; white-space:normal;} main > .ctl div[data-role=list] > button {display:none; width:30px; height:30px; position:absolute; top:calc(50% - 15px); z-index:10; border:1px solid #ccc; border-radius:50%; text-align:center; line-height:28px; background:#fff; box-shadow:1px 1px 2px rgba(0,0,0,0.2); cursor:pointer; font-size:1.14rem; color:#222;} main > .ctl div[data-role=list] > button[data-action=left] {left:-15px;} main > .ctl div[data-role=list] > button[data-action=right] {right:-15px;} @keyframes indicator { 0% {background:#182f7a;} 50% {background:#f4f4f4;} } main > .ctl div[data-role=list] > i.indicator {display:none;} main > .ctl div[data-role=list] > div > span {display:none;} main > .ctl div[data-role=list].loading > div {display:none;} main > .ctl div[data-role=list].loading > button {display:none;} main > .ctl div[data-role=list].loading > i.indicator {width:64px; height:64px; position:absolute; top:calc(50% - 32px); left:calc(50% - 32px); display:block;} main > .ctl div[data-role=list].loading > i.indicator > div {width:64px; height:64px; transform:translate(-100px,-100px) scale(1) translate(100px, 100px); position:relative;} main > .ctl div[data-role=list].loading > i.indicator > div > i {position:absolute; width:20px; height:20px; background:#f4f4f4; animation:indicator 1s linear infinite; display:block;} main > .ctl div[data-role=list].loading > i.indicator > div > i:nth-child(1) {left:0px; top:0px; animation-delay:0s;} main > .ctl div[data-role=list].loading > i.indicator > div > i:nth-child(2) {left:22px; top:0px; animation-delay:0.125s;} main > .ctl div[data-role=list].loading > i.indicator > div > i:nth-child(3) {left:44px; top:0px; animation-delay:0.25s;} main > .ctl div[data-role=list].loading > i.indicator > div > i:nth-child(4) {left:0px; top:22px; animation-delay:0.875s;} main > .ctl div[data-role=list].loading > i.indicator > div > i:nth-child(5) {left:44px; top:22px; animation-delay:0.375s;} main > .ctl div[data-role=list].loading > i.indicator > div > i:nth-child(6) {left:0px; top:44px; animation-delay:0.75s;} main > .ctl div[data-role=list].loading > i.indicator > div > i:nth-child(7) {left:22px; top:44px; animation-delay:0.625s;} main > .ctl div[data-role=list].loading > i.indicator > div > i:nth-child(8) {left:44px; top:44px; animation-delay:0.5s;} main > .ctl div[data-role=list].empty > div {background:#f4f4f4;} main > .ctl div[data-role=list].empty > button {display:none;} main > .ctl div[data-role=list].empty > div > span {display:block; text-align:center; font-size:1rem; position:absolute; width:100%; top:calc(50% + 50px); left:0;} main > .ctl div[data-role=list].empty > i.indicator {width:64px; height:64px; position:absolute; top:calc(50% - 32px); left:calc(50% - 32px); display:block;} main > .ctl div[data-role=list].empty > i.indicator > div > i {position:absolute; width:20px; height:20px; background:#ccc; display:block;} main > .ctl div[data-role=list].empty > i.indicator > div > i:nth-child(1) {left:0px; top:0px;} main > .ctl div[data-role=list].empty > i.indicator > div > i:nth-child(2) {left:22px; top:0px;} main > .ctl div[data-role=list].empty > i.indicator > div > i:nth-child(3) {left:44px; top:0px;} main > .ctl div[data-role=list].empty > i.indicator > div > i:nth-child(4) {left:0px; top:22px;} main > .ctl div[data-role=list].empty > i.indicator > div > i:nth-child(5) {left:44px; top:22px;} main > .ctl div[data-role=list].empty > i.indicator > div > i:nth-child(6) {left:0px; top:44px;} main > .ctl div[data-role=list].empty > i.indicator > div > i:nth-child(7) {left:22px; top:44px;} main > .ctl div[data-role=list].empty > i.indicator > div > i:nth-child(8) {left:44px; top:44px;} /* 위젯커스텀 */ .ctl-dots {float:right} .ctl-dots > ul {font-size:0} .ctl-dots > ul > li {height:20px; padding:2px 4px; line-height:20px; display:inline-block} .ctl-dots > ul > li > button {width:10px; height:10px; border-radius:50%; background:#d9d9d9} .ctl-dots > ul > li.slick-active > button {background:#3076d6} /* 사이드바 */ div[data-widget=coursemos-sidebar][data-templet=default] aside > div.header > button.close > i {color:#fff;} div[data-widget=coursemos-sidebar][data-templet=default] aside > div.header > button.logout {color:#fff} div[data-widget=coursemos-sidebar] aside > ul.menu > li.selected > a {background:#00ac5c} div[data-widget=coursemos-sidebar][data-templet=default] aside > ul.menu > li > div.submenu {padding:0} div[data-widget=coursemos-sidebar] aside > ul.menu > li > div.submenu > a.selected {color:#f15922; background:#efefef} /* 위젯 css 끝 */ /* main > .notice {background:#070423;} main > .notice > div.container > .wrap {display:flex; flex-direction:column; gap:40px; box-sizing:border-box; width:100%; min-height:260px; table-layout:fixed} main > .notice > div.container > .wrap > .notice {display: flex; flex-wrap:wrap; align-items: center; justify-content:space-between; gap:28px;} main > .notice > div.container > .wrap > .notice ul.tab_bar {display: flex; gap:40px;} main > .notice > div.container > .wrap > .notice ul.tab_bar > li {padding:7px 14px; min-width:40px; text-align:center;} main > .notice > div.container > .wrap > .notice ul.tab_bar > li:hover {background: rgba(255, 255, 255, 0.20); border-radius:4px;} main > .notice > div.container > .wrap > .notice ul.tab_bar > li > button {background-color:transparent; color:#C5C5C5; font-size: 1.29rem; font-weight:400;} main > .notice > div.container > .wrap > .notice ul.tab_bar > li:hover > button {color:#fff;} main > .notice > div.container > .wrap > .notice ul.tab_bar > li.selected > button {color:#fff; font-weight: 700;} main > .notice > div.container > .wrap > .notice div.notice_cnt{position: relative; width:100%;} main > .notice > div.container > .wrap > div.notice > h4 {position: relative; color:#fff; font-size: 2.29rem; font-weight: 700;} main > .notice > div.container > .wrap > div.notice > h4::before{content:""; position: absolute; top:-12px; left:0; display: inline-block; width: 16px; height: 6px; border-radius: 12px; background: var(--123123, linear-gradient(102deg, #EB6FA6 -60.82%, #611A87 163.68%));} main > .notice > div.container > .wrap > .link {display:flex; align-items: center; gap:40px;} main > .notice > div.container > .wrap > .link > a {position: relative; display:inline-block; padding:39px 28px; width:25%; font-size:1.43rem; font-weight: 700; color:#fff; border-radius:8px; background:var(--123123, linear-gradient(102deg, #EB6FA6 -60.82%, #611A87 163.68%));;} main > .notice > div.container > .wrap > .link > a.link_01::after {content:""; position: absolute; top:50%; right:28px; transform:translateY(-50%); display: inline-block; width:48px; height: 57px; background:url(../images/notice_01.svg) no-repeat center center;} main > .notice > div.container > .wrap > .link > a.link_02::after {content:""; position: absolute; top:50%; right:28px; transform:translateY(-50%); display: inline-block; width:57px; height: 54px; background:url(../images/notice_02.svg) no-repeat center center;} main > .notice > div.container > .wrap > .link > a.link_03::after {content:""; position: absolute; top:50%; right:28px; transform:translateY(-50%); display: inline-block; width:48px; height: 57px; background:url(../images/notice_03.svg) no-repeat center center;} main > .notice > div.container > .wrap > .link > a.link_04::after {content:""; position: absolute; top:50%; right:28px; transform:translateY(-50%); display: inline-block; width:57px; height: 54px; background:url(../images/notice_04.svg) no-repeat center center;} @media (max-width:1419px) { main > .notice > div.container > .wrap > .link > a {display: flex; align-items: center; justify-content: center;} main > .notice > div.container > .wrap > .link > a {padding: 0px 10px; height:80px; font-size: 1.29rem;} main > .notice > div.container > .wrap > .link > a > span {word-break:keep-all;} main > .notice > div.container > .wrap > .link > a.link_01::after{display: none;} main > .notice > div.container > .wrap > .link > a.link_02::after{display: none;} main > .notice > div.container > .wrap > .link > a.link_03::after{display: none;} main > .notice > div.container > .wrap > .link > a.link_04::after{display: none;} } */ main > .info > div.container > .wrap > div.menu {display: flex; justify-content: space-between; margin-bottom:28px;} main > .info > div.container > .wrap > div.menu > h4 {position: relative; color:#fff; font-size: 2.29rem; font-weight: 700;} main > .info > div.container > .wrap > div.menu > h4::before{content:""; position: absolute; top:-12px; left:0; display: inline-block; width: 16px; height: 6px; border-radius: 12px; background:linear-gradient(102deg, #EB6FA6 -60.82%, #611A87 163.68%);} main > .info > div.container > .wrap > div.menu > ul {display: flex; align-items: center; gap:10px; list-style:none; box-sizing:border-box;} main > .info > div.container > .wrap > div.menu > ul > li {padding:7px 14px;} main > .info > div.container > .wrap > div.menu > ul > li:hover {background: rgba(255, 255, 255, 0.20); border-radius:4px;} main > .info > div.container > .wrap > div.menu > ul > li > button {background-color:transparent; color:#C5C5C5; font-size: 1.29rem; font-weight: 400;} main > .info > div.container > .wrap > div.menu > ul > li:hover > button {color:#fff;} main > .info > div.container > .wrap > div.menu > ul > li.selected > button {color:#fff; font-weight:700;} main > .info > div.container > .wrap > div.content {width:100%;} main > .univ {background:#ffffff;margin-bottom: 150px;} main > .univ > div.container {display: flex; justify-content: space-between; gap:40px;} main > .univ > div.container::before, main > .univ > div.container::after{display: none;} main > .univ > div.container > h4 {position: relative; width:200px; color:#4d4d4d; font-size: 1.71rem; font-weight: 400; line-height:42px;} main > .univ > div.container > h4::before{content:""; position: absolute; left:0; top:-10px; display: inline-block; width:16px; height: 7px; border-radius:12px; background: var(--123123, linear-gradient(102deg, #EB6FA6 -60.82%, #611A87 163.68%));} main > .univ > div.container > h4 > span {display: block; color:#000; font-size: 2.29rem; font-weight: 700;} main > .univ > div.container ul.univ_list {width:calc(100% - 200px); display:flex; align-items:center; gap:40px; flex-wrap:wrap; justify-content:flex-start;} main > .univ > div.container ul.univ_list > li {box-sizing:border-box; width:calc(20% - 40px); height:72px; border-radius: 10px; border: 1px solid #D7D7D7; background-repeat:no-repeat; background-position:center; transition:all 0.3s;} main > .univ > div.container ul.univ_list > li > a {box-sizing:border-box; display:inline-block; width:100%; height:100%; } main > .univ > div.container ul.univ_list > li.univ_00 {background-image:url(../images/ico_univ_gray_14.png);} main > .univ > div.container ul.univ_list > li.univ_01 {background-image:url(../images/ico_univ_gray_01_.png);} main > .univ > div.container ul.univ_list > li.univ_02 {background-image:url(../images/ico_univ_gray_02.png);} main > .univ > div.container ul.univ_list > li.univ_03 {background-image:url(../images/ico_univ_gray_03.png);} main > .univ > div.container ul.univ_list > li.univ_04 {background-image:url(../images/ico_univ_gray_04.png);} main > .univ > div.container ul.univ_list > li.univ_05 {background-image:url(../images/ico_univ_gray_05.png);} main > .univ > div.container ul.univ_list > li.univ_06 {background-image:url(../images/ico_univ_gray_06.png);} main > .univ > div.container ul.univ_list > li.univ_07 {background-image:url(../images/ico_univ_gray_07.png);} main > .univ > div.container ul.univ_list > li.univ_08 {background-image:url(../images/ico_univ_gray_08.png);} main > .univ > div.container ul.univ_list > li.univ_09 {background-image:url(../images/ico_univ_gray_09.png);} main > .univ > div.container ul.univ_list > li.univ_10 {background-image:url(../images/ico_univ_gray_10.png);} main > .univ > div.container ul.univ_list > li.univ_11 {background-image:url(../images/ico_univ_gray_11.png);} main > .univ > div.container ul.univ_list > li.univ_12 {background-image:url(../images/ico_univ_gray_12_.png);} main > .univ > div.container ul.univ_list > li.univ_13 {background-image:url(../images/ico_univ_gray_13.png);} main > .univ > div.container ul.univ_list > li.univ_15 {background-image:url(../images/ico_univ_gray_15.jpg);} main > .univ > div.container ul.univ_list > li.univ_16 {background-image:url(../images/ico_univ_gray_16.png);} main > .univ > div.container ul.univ_list > li.univ_17 {background-image:url(../images/ico_univ_gray_17.png);} main > .univ > div.container ul.univ_list > li.univ_00:hover {background:url(../images/ico_univ_14.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_01:hover {background:url(../images/ico_univ_01_.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_02:hover {background:url(../images/ico_univ_02.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_03:hover {background:url(../images/ico_univ_03.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_04:hover {background:url(../images/ico_univ_04.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_05:hover {background:url(../images/ico_univ_05_01.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_06:hover {background:url(../images/ico_univ_06.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_07:hover {background:url(../images/ico_univ_07.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_08:hover {background:url(../images/ico_univ_08.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_09:hover {background:url(../images/ico_univ_09.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_10:hover {background:url(../images/ico_univ_10.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_11:hover {background:url(../images/ico_univ_11.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_12:hover {background:url(../images/ico_univ_12_.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_13:hover {background:url(../images/ico_univ_13.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_15:hover {background:url(../images/ico_univ_15.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_16:hover {background:url(../images/ico_univ_16.png) no-repeat center center #fff;} main > .univ > div.container ul.univ_list > li.univ_17:hover {background:url(../images/ico_univ_17.png) no-repeat center center #fff;} /* footer */ footer {background:#000; position:relative;} footer .flex {display:flex; align-items:center; gap:50px;} footer > div.menu > div.container {display:flex; align-items:center; justify-content:space-between; flex-wrap: wrap;gap: 24px; padding:38px 10px; border-bottom:1px solid #f4f4f421;} footer > div.menu > div.container::after, footer > div.menu > div.container::before {content:unset;} footer > div.menu > div.container div.box.left > a {padding-left:5px; font-size:1rem; color: #fff; font-weight: 400;} footer > div.menu > div.container div.box ul.sns {display:flex; align-items:center; margin-right:30px;} footer > div.menu > div.container div.box ul.sns > li {display:flex; align-items:center; justify-content:center; margin-right:16px; width:47px; height:47px; border-radius:50%; background:#F4F4F4; } footer > div.menu > div.container div.box ul.sns > li:last-child {margin-right:0;} footer > div.menu > div.container div.box ul.sns > li > a {display:inline-block; width:100%; height:100%; background-repeat:no-repeat; background-position:center; } footer > div.menu > div.container div.box ul.sns > li.youtube > a {background-image:url(../images/ico_youtube.png);} footer > div.menu > div.container div.box ul.sns > li.insta > a {background-image:url(../images/ico_insta.png);} footer > div.menu > div.container div.box ul.sns > li.blog > a {background-image:url(../images/ico_blog.png);} footer > div.menu > div.container div.box ul.sns > li.kakao > a {background-image:url(../images/ico_kakao.png); background-size:25px 25px;} /* footer > div.menu > div.container div.box div.f_logo {width:160px; height:60px;} */ /* oz46: 하단 로고 이미지 변경 */ footer > div.menu > div.container div.box div.f_logo {width:132px; height:47px;} footer > div.menu > div.container div.box div.f_logo > a {display:inline-block; width:100%; height:100%; background-size:contain; background-repeat:no-repeat; background-position:center;} footer > div.menu > div.container div.box div.fam_site {min-width:175px; border-radius: 9px; background:#1A1A1A;} footer > div.menu > div.container div.box div.sub_logo {width:230px; height:57px;} footer > div.copyright div.info {padding:24px 0 64px; position:relative;} footer > div.copyright > div.container {position:relative;} footer > div.copyright div.info address > span {font-style:normal; color:#fff; font-size: 1rem; line-height:2;} footer > div.copyright div.info p.copyright {position:absolute; bottom:24px; right:0; font-size:0.86rem; color:#363A52;} footer > div.copyright button.move_top {width:60px; height:60px; position:absolute; right:10px; top:50%; transform:translateY(-50%); border:1px solid #DADADA; background: rgba(255, 255, 255, 0.00); border-radius:50%; background:transparent;} footer div[data-role=input][data-type=select] > button {border-radius: 9px; background:#1A1A1A; color:#B8B8B8;border: unset;} footer div[data-role=input][data-type=select] > button > i::before{font-size: 1.07rem;} footer div[data-role=input][data-type=select].extend > button {border-color:#4d4d4d;} footer div[data-role=input][data-type=select] > button:active {border-color:#4d4d4d;} footer div[data-role=input][data-type=select] > ul {border:1px solid #4d4d4d;} footer div[data-role=input][data-type=select] > ul > li {color:#B8B8B8;} footer div[data-role=input][data-type=select] > ul > li:hover {font-weight:bolder;} /* 로그인 팝업 */ div[data-role=modal] > form > div[data-role=context] div[data-role=input][data-type=select] > button > span {width:calc(100% - 45px);} div[data-role=modal] > form > div[data-role=context] div[data-role=input][data-type=select] > button span::before {content:''; display:inline-block; width:23px; height:16px; margin-right:10px; background:url(../images/ico_login.png)no-repeat center; vertical-align:middle; } div[data-role=modal] > form > div[data-role=context] div[data-role=input][data-type=select] > button > i {position:relative; width:45px; box-sizing:border-box;} div[data-role=modal] > form > div[data-role=context] > div.join {display:flex; align-items:center; justify-content:center;} div[data-role=modal] > form > div[data-role=context] > div.join > a {display:inline-block; margin-right:8px; color:#000; font-size:1rem; text-align:center; text-decoration:underline; text-underline-position:under;} div[data-role=modal] > form > div[data-role=context] > div.join > a:last-child {margin-right:0;} div[data-role=modal] > form > div[data-role=context] > div.button > button {margin:15px 0; background:#2A2C7F; color:#fff; font-size:1.29rem; border:0; width:100%; height:48px; line-height:48px; cursor:pointer; border-radius:5px;} div[data-role=modal] > form > div[data-role=context] .errorBox {display:none; margin:5px 0 10px 0; font-size:0.86rem; color:red;} div.context div[data-module=schedule] #ModuleScheduleContext > div[data-role=input] {z-index:1;} div.context div[data-module=schedule] .fc-toolbar .fc-state-active {z-index:1;} section.eco_program > div.container > div.eco_program_title {margin-bottom: 26px; display: flex;align-items: center; justify-content: space-between;gap: 24px; flex-wrap: wrap;} section.eco_program > div.container > div.eco_program_title > h4 { color: #000;font-size: 1.71rem;font-weight: 700;line-height: 32px;letter-spacing: -0.48px;} section.eco_program > div.container > div.eco_program_title ul[data-name] {display: flex;align-items: center; gap: 32px;} section.eco_program > div.container > div.eco_program_title ul[data-name] > li > button {background: unset; color: #000;font-size: 1.14rem;font-weight: 500;line-height: 24px;letter-spacing: -0.32px;opacity: 0.7;} section.eco_program > div.container > div.eco_program_title ul[data-name] > li.selected > button {color: #000;font-weight: 700;position: relative; opacity: 1;} section.eco_program > div.container > div.eco_program_title ul[data-name] > li.selected > button:after {content: '';position: absolute;top: -10px;left: 50%;transform: translateX(-50%); display: block; width: 4px; height: 4px;border-radius: 30px;background: #8F4CDD;} div[data-widget=eco-recently][data-templet=default] > h4 {display: none !important;} div[data-module=eco][data-role=item] > a > div.detail {display: none !important;} div[data-module=eco][data-role=item] > a { border: none !important;} div[data-module=eco][data-role=item] > a > div.content > div.period > small > span.date_title {font-weight: 800 !important;} div[data-widget=eco-recently][data-templet=default] ul.slick-dots > li > button {width: 24px !important;height: 6px !important;border-radius: 8px;} div[data-widget=eco-recently][data-templet=default] button.slick-prev {left: -60px;} div[data-widget=eco-recently][data-templet=default] button.slick-next {right: -60px;} div[data-module=eco][data-role=item] > a > div.content > small.essential_icons {display: none !important;} div[data-widget=eco-recently][data-templet=default] ul.slick-dots > li.slick-active > button {background: #8F4CDD !important;} section.univ_list div.container > div.univ_list_title > h4 {color: #000;font-size: 1.71rem;font-weight: 700;line-height: 32px;letter-spacing: -0.48px;} section.univ_list div.container > ul.univ_lists {display: flex;margin-top: 20px; flex-wrap: wrap;gap: 24px;align-items: center;justify-content: center;} section.univ_list div.container > ul.univ_lists li.univ_list_item {padding: 18px;border-radius: 12px;} section.univ_list div.container > ul.univ_lists li.univ_list_item div.univ_list_item_img {width: 140px;height: 52px;background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(1) {background: #003F92;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(2) {background: #003F92;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(3) {background: #F8B500;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(4) {background: #005629;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(5) {background: #E01C38;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(6) {background: #464D61;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(7) {background: #0058A6;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(8) {background: #0093D9;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(9) {background: #AE1E57;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(10) {background: #404040;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(11) {background: #4F782F;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(12) {background: #EA5504;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(13) {background: #1E288B;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(1) div.univ_list_item_img {background-image: url(../images/ico_logo_01.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(2) div.univ_list_item_img {background-image: url(../images/ico_logo_02.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(3) div.univ_list_item_img {background-image: url(../images/ico_logo_03.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(4) div.univ_list_item_img {background-image: url(../images/ico_logo_04.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(5) div.univ_list_item_img {background-image: url(../images/ico_logo_05.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(6) div.univ_list_item_img {background-image: url(../images/ico_logo_06.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(7) div.univ_list_item_img {background-image: url(../images/ico_logo_07.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(8) div.univ_list_item_img {background-image: url(../images/ico_logo_08.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(9) div.univ_list_item_img {background-image: url(../images/ico_logo_09.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(10) div.univ_list_item_img {background-image: url(../images/ico_logo_10.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(11) div.univ_list_item_img {background-image: url(../images/ico_logo_11.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(12) div.univ_list_item_img {background-image: url(../images/ico_logo_12.png);background-size: cover;background-position: center;background-repeat: no-repeat;} section.univ_list div.container > ul.univ_lists li.univ_list_item:nth-child(13) div.univ_list_item_img {background-image: url(../images/ico_logo_13.png);background-size: cover;background-position: center;background-repeat: no-repeat;} article.footer_bg {position: relative; width: 100%;height: 600px;background-image: url(../images/bg_footer.png);background-size: cover;background-position: 50% 100%;background-repeat: no-repeat;} article.footer_bg:after {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.4);} article.footer_bg > div.container {position: relative;z-index: 1;} article.footer_bg > div.container.overflow-hidden {overflow: hidden;} article.footer_bg > div.container > div.footer_content_wrap {display: flex;flex-direction: column;align-items: center;justify-content: center;height: 600px;gap: 100px;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content{width: 100%; display: flex;height: auto;gap: 40px; align-items: start;flex-direction: column;justify-content: center;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_title_wrap {display: flex;flex-direction: column;align-items: center;justify-content: center;width: 100%;box-sizing: border-box;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_title_wrap > h4.footer_content_title_sub {color: #C8C8C8;text-align: start;font-size: 1.71rem;font-weight: 400;line-height: 32px;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_title_wrap > h4.footer_content_title {color: #FFF;text-align: start;font-size: 1.71rem;font-weight: 400;line-height: 32px;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap {width: 100%;box-sizing: border-box; display: flex;align-items: center;justify-content: center;flex-direction: row;gap: 24px;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list { width: 99%; justify-content: center; display: flex; align-items: center; flex-wrap: wrap; gap: 15px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list div.bar { width: 1px; height: 40px; background: rgba(255, 255, 255, 0.20); } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list > li > a { display: block; min-width: 220px; height: 60px; transition: 0.5s ease-in-out; border-radius: 8px; background-color: transparent; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_01 > a { background-image: url(../images/img_univ_list_01.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_02 > a { background-image: url(../images/img_univ_list_02.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_03 > a { background-image: url(../images/img_univ_list_03.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_04 > a { background-image: url(../images/img_univ_list_04.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_05 > a { background-image: url(../images/img_univ_list_05.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_06 > a { background-image: url(../images/img_univ_list_06.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_07 > a { background-image: url(../images/img_univ_list_07.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_08 > a { background-image: url(../images/img_univ_list_08.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_09 > a { background-image: url(../images/img_univ_list_09.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_10 > a { background-image: url(../images/img_univ_list_10.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_11 > a { background-image: url(../images/img_univ_list_11.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_12 > a { background-image: url(../images/img_univ_list_12.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li.univ_13 > a { background-image: url(../images/img_univ_list_13.png); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 8px; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li > a:hover { position: relative; filter: brightness(0.85) blur(0.5px); box-shadow: 0 4px 24px 0 rgba(143, 76, 221, 0.08); border-radius: 8px; transition: 0.4s box-shadow, 0.4s filter; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li > a::after { content: ''; display: block; pointer-events: none; position: absolute; left: 0; top: 0; right: 0; bottom: 0; border-radius: 8px; background: rgba(255,255,255,0.18); opacity: 0; transition: 0.3s opacity; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list.univ > li > a:hover::after { opacity: 1; } article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list {width: 100%; justify-content: start; display: flex;align-items: center;flex-wrap: nowrap;gap: 15px;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list div.bar {width: 1px;height: 40px;background: rgba(255, 255, 255, 0.20);} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list > li {min-width: 220px;height: 60px;transition: 0.5s ease-in-out;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list.company_list > li.company_01 {background-image: url(../images/ico_footer_logo_on_01.png);background-size: cover;background-position: center;background-repeat: no-repeat;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list.company_list > li.company_02 {background-image: url(../images/ico_footer_logo_on_02.png);background-size: cover;background-position: center;background-repeat: no-repeat;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list.company_list > li.company_03 {background-image: url(../images/ico_footer_logo_on_03.png);background-size: cover;background-position: center;background-repeat: no-repeat;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list.company_list > li.company_04 {background-image: url(../images/ico_footer_logo_on_04.png);background-size: cover;background-position: center;background-repeat: no-repeat;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list.company_list > li.company_05 {background-image: url(../images/ico_footer_logo_on_05.png);background-size: cover;background-position: center;background-repeat: no-repeat;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list.company_list > li.company_06 {background-image: url(../images/ico_footer_logo_on_06.png);background-size: cover;background-position: center;background-repeat: no-repeat;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list.company_list > li.company_07 {background-image: url(../images/ico_footer_logo_on_07.png);background-size: cover;background-position: center;background-repeat: no-repeat;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list.company_list > li.company_08 {background-image: url(../images/ico_footer_logo_on_08.png);background-size: cover;background-position: center;background-repeat: no-repeat;} article.footer_bg > div.container > div.footer_content_wrap > div.footer_content > div.footer_content_list_wrap > div.marquee-wrapper ul.footer_content_list.company_list > li.company_09 {background-image: url(../images/ico_footer_logo_on_09.png);background-size: cover;background-position: center;background-repeat: no-repeat;} @media (max-width:991px) { article.footer_bg > div.container > div.footer_content {gap:40px;} article.footer_bg > div.container > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list > li {width: calc((100% / 3) - 26px);min-width: 220px; width: 220px;} } @media (max-width:1700px) { div[data-widget=eco-recently][data-templet=default] button.slick-prev {display: none !important;} div[data-widget=eco-recently][data-templet=default] button.slick-next {display: none !important;} } @media (max-width:1420px) { .visual_box {margin-top: 87px !important;} div[data-role=wrapper] > header > nav > .top_menu > div.container > ul{display:none} div[data-role=wrapper] > header > nav > .top_menu > div.container button.slide{position:absolute;top:50%; right:20px; transform: translateY(-50%); display:inline-block; width: 36px; height: 36px; color:#fff; background-color: transparent; font-size: 1.43rem;} div[data-role=wrapper] > header > .top {display:none;} /* main.index_main { margin-top: 87px !important;} */ article.notice > div.container > div.notice_justify div.more_btn {display: none;} } @media (max-width:760px) { article.footer_bg {overflow: hidden;} /* article.footer_bg > div.container > div.footer_content > div.footer_content_list_wrap > ul.footer_content_list {flex-wrap: nowrap;} */ } @media (max-width:500px) { section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab {flex-direction: column;align-items: start;gap: 12px;} section.gallery_notice > div.container > div.flex_c_box > div.gallery_notice_tab > div.ab_btn {order: -1;} div[data-widget=banner-list][data-templet=center] a.item span {margin-top: unset} section > div.container {padding: 10px !important;} article > div.container {padding: 10px !important;} /* div > div.container {padding: 10px !important;} */ section.univ_list div.container > ul.univ_lists {justify-content: start;} section.univ_list div.container > ul.univ_lists li.univ_list_item {width: calc((100% / 2) - 54px); padding: 21px;display: flex;align-items: center;justify-content: center;} section.univ_list div.container > ul.univ_lists li.univ_list_item:last-child {flex: 1;} footer .flex {flex-wrap: wrap;align-items: center;justify-content: center;width: 100%;gap: 24px;} footer .flex.left {flex-direction: column;align-items: center;justify-content: center;width: 100%;gap: 24px;} /* main.index_main { margin-top: 107px !important;} */ } div[data-widget=boarduniv-recently][data-templet=notice] ul li {width: 100% !important;box-sizing: border-box !important;}