@charset "utf-8";

/* 요소(element) 여백 초기화 */
html,body{width:100%; font-weight: 400; }
html{background-color: white;}
html,body,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,blockquote,p,address,pre,cite,form,fieldset,caption,legend,input,textarea,select,table,th,td,div{margin:0;padding:0;font-family:"SUIT", "Noto Sans KR", "Nanum Gothic",sans-serif; font-size: 16px; font-style: normal;line-height:1.4;letter-spacing:-0.5px;word-break:keep-all}
/*body {background:#fff}*/
iframe {border:0 none}
b, strong, th, dt, label { font-weight: 500 !important; }

a { text-decoration:none }

/* 테두리 없애기 */
fieldset,abbr,acronym{border:0 none}
img { max-width:100%; border:0; vertical-align:middle; box-sizing:border-box}
input { outline:0 }
/* 목록 */
ul,ol,li,dt,dd{list-style:none}

/* 텍스트 관련 요소 초기화 */
address,cite,code,dfn,em,var {font-style:normal;font-weight:normal;}
ins{text-decoration:none}
del{text-decoration:line-through}

/*아이폰,안드로이드 input ,submit 테두리 초기화*/
input[type=text], input[type=password], input[type=submit], input[type=search], input[type=button], textarea { -webkit-appearance:none; }

:root {
	--main-menu-width: 1100px;
	--center-wrap-width: 1620px;
	--center-wrap-width2: 1260px;
}

.overflow-x-auto { overflow-x: auto; }

.wrap {
	position:relative;
	max-width: 1920px;
	min-width:280px;
	margin: 0 auto;
	overflow: hidden;
}

/* 가운데 고정폭 영역 */
.center-wrap {
	position:relative;
	margin: 0 auto;
}
.center-wrap.w1 { max-width: var(--center-wrap-width); }
.center-wrap.w2 { max-width: var(--center-wrap-width2); }

/* 헤더 스타일 */
.header {
	position: relative;
	width: 100%;
	background-color: white;
	z-index: 1000;
}

/* 네비게이션 메뉴 스타일 */
.nav-container { position: relative; }
.main-menu-wrap { position: relative; }
.main-menu {
	display: flex;
	justify-content:space-around;
    align-items: center;
	height: 100%;
	margin: 0;
	padding:0;
	list-style: none;
	width: 1124px;
	transition: 0.3s all;
}

.main-menu > li {
	position: relative;
	padding:15px 0;
	text-align: center;
	transition: 0.3s all;
	width: calc(100% / 7);
}

.main-menu > li > a {
	font-size:20px;
	color: #333;
	text-decoration: none;
	font-weight:600;
	letter-spacing:-1.5px;
	transition: 0.3s all;
}
.main-menu > li > a:hover {
	color:#78a22f;
}

/* 서브메뉴 스타일 */
.submenu-container {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	background: rgba(255,255,255,0.95);
	display: none;
	padding:10px 0;
	box-shadow: 0 2px 5px rgba(0,0,0,0.1);
	transition: 0.3s all;
}

.submenu-container .container {
	position: relative;
	max-width: var(--main-menu-width);
	padding: 0;
}
.submenu-container .container .row {
	position: relative;
	left: 248px;
}
.submenu-container .container .row .col { width: calc(100% / 7); }

.submenu {
	list-style: none;
	padding: 0;
}

.submenu li {
	padding:5px;
	text-align: center;
}

.submenu li a {
	font-size:16px;
	color: #666;
	text-decoration: none;
}
.submenu li a:hover {
	color: #78a22f;
	text-decoration: underline;
}

/* 모바일 메뉴 스타일 */
.mobile-menu-button {
	position:absolute;
	top:50%;
	right:20px;
	display: none;
	padding:0;
	margin-left: auto;
	background: none;
	border: none;
	font-size: 24px;
	cursor: pointer;
	transform:translateY(-50%);
	z-index: 1001;
}

.mobile-menu {
	position: fixed;
	top: 0;
	right: -300px;
	width: 300px;
	height: 100vh;
	background: white;
	z-index: 1050;
	transition: right 0.3s ease-in-out;
	box-shadow: -2px 0 5px rgba(0,0,0,0.1);
	overflow-y: auto;
	padding: 60px 0 20px;
}

.mobile-menu .close {
	position:absolute;
	top:20px;
	right:20px;
	border: none;
	background: none;
}

.mobile-menu.active {
	right: 0;
}

.mobile-menu-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
	z-index: 1040;
	display: none;
}

.mobile-menu .menu-item {
	padding: 15px 20px;
	border-bottom: 1px solid #eee;
}

.mobile-menu .menu-item > a {
	display: block;
	font-size:17px;
	color: #222;
	text-decoration: none;
	font-weight: 600;
	background:url("img/icon_menu_arrow.png") no-repeat right center
}
.mobile-menu .menu-item > a:hover {
	color:#78a22f;
}

.mobile-submenu {
	margin-top:20px;
	padding-left: 20px;
	display: none;
}

.mobile-submenu li {
	padding: 5px 0;
}

.mobile-submenu a {
	color: #666;
	text-decoration: none;
}

.menu-item.active .mobile-submenu {
	display: block;
}
.mobile-menu .sns.flex { padding:20px }

/* 서브페이지 메뉴 */
.subpage-menu-wrap {
	padding:10px 0;
	border-bottom:1px solid #ddd;
}
.subpage-menu {
	display: flex;
	min-width: 700px;
}
.subpage-menu > li > a {
	color: #333;
	font-weight:600;
	text-decoration: none;
}
.subpage-menu > li > a:hover { color:#78a22f }
.subpage-menu > li:not(:first-child)::before {
	content: '';
	height: .9em;
	border-left: 1px solid #ccc;
	margin: 0 1em;
	display: inline-block;
	position: relative;
	bottom: -.2em;
}
.subpage-menu-wrap .right {
	width:35%;
	justify-content:flex-end;
	gap:10px;
}
.subpage-menu-wrap .navi {
	color:#777;
	font-weight:500;
}

.subpage-title {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size:40px;
	font-weight:800;
	margin-top:1em;
}

/* 서브페이지 배너 */
.subpage-banner {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin-top:15px;
	padding: 1em 0;
	font-size:40px;
	font-weight:800;
	color: #fff;
	background: linear-gradient(to right, #005030, #78a22f);
}

/* 서브 컨텐츠 */
.sub-contents {
	min-height:250px;
	padding:60px 0;
}

/* 상단 */
.top-gnb.flex { margin:20px auto }

/* 상단 로그인 */
.login-wrap.flex { gap:10px }
.login-wrap a {
	display:inline-block;
	padding:2px 10px 2px 30px;
	font-size:15px;
	color:#fff;
	font-weight:500;
	background-repeat:no-repeat;
	background-position:7px center;
	background-color:#005030;
	border-radius:5px;
	transition: all .15s;
}
.login-wrap a:hover { text-decoration:underline;}
.login-wrap a.icon1 { background-image:url("images/icon_login.png"); }
.login-wrap a.icon2 { background-image:url("images/icon_join.png"); }

/* 상단 통합검색 */
.top-search.flex { gap:15px; }
.input-wrap {
	position:relative;
	width:350px;
	padding:0 20px;
	border:3px solid #78a22f;
	border-radius:50px;
}
.input-wrap .ipt-search {
	width:100%;
	height:44px;
	line-height:24px;
	border:0;
	box-sizing:border-box;
	outline:0;
}
.input-wrap .btn-search {
	position:absolute;
	top:50%;
	right:15px;
	display:inline-block;
	width:22px;
	height:22px;
	font-size:0;
	border:0;
	background:url("img/icon_search.png") no-repeat center center;
	background-size:contain;
	transform:translateY(-50%);
}
/* 인기검색어 */
.keyword-wrap .tit {
	display:inline-block;
	font-size:14px;
	line-height:1em;
	font-weight:700;
	color:#78a22f;
}
.keyword-wrap .keyword.flex { gap:5px }
.keyword-wrap .keyword a {
	display:inline-block;
	padding:0 5px;
	font-size:14px;
	color:#fff;
	background:#78a22f;
	border-radius:5px
}

/* 상단 SNS */
.sns.flex { gap:10px; }

/* 컨텐츠 공통 */
.section { position:relative; }
.con-ti {
	font-weight:800;
	line-height:1.2;
}
.con-ti.ti1 { font-size:32px; }
.con-ti.ti2 { font-size:26px; }
.con-ti.ti3 { font-size:22px; }
.con-sti {
	font-size:18px;
	font-weight:600;
}
.con-padd {
	padding-top:80px;
	padding-bottom:80px;
}
.btn-more {
	position:absolute;
	bottom:40px;
	display:inline-block;
	padding:5px 15px;
	font-size:15px;
	color:#fff;
	border:1px solid #fff;
}

/* 리스트 설정 */
.flex {
	position:relative;
	display:flex;
	flex-wrap:wrap;
	flex-direction:row;
	align-items:center;
	transition: 0.3s all;
}
.flex-alignB { justify-content:space-between }
.flex-alignC { justify-content:center }
.flex-alignL { justify-content:flex-start }
.flex-alignR { justify-content:flex-end }

.lst-dot {
	display:flex;
	flex-wrap:wrap;
	flex-direction:column;
	gap:5px;
	margin-top:10px;
}
.lst-dot > li {
	position:relative;
	padding-left:12px;
	text-align:left !important;
}
.lst-dot > li::before {
	position:absolute;
	top:-2px;
	left:0;
	content:"•";
}

/* 메인 컨텐츠1 */
.contents1.flex {
	align-items:stretch;
	padding-top:20px;
	transition: all .25s;
}
.contents1.flex .items { width:calc(100% / 3); }

/* 팝업 존 */
.contents1.flex .popupZone {
	position:relative;
	display:block;
	height:600px;
	overflow:hidden;
}
.contents1.flex .popupZone .pop-navi {
	position:absolute;
	bottom:0;
	width:100%;
	line-height:50px;
	text-align:center;
	background-color:rgba(0,0,0,0.5);
	z-index: 1;
}
.contents1.flex .popupZone .pop-navi span {
	display:inline-block;
	width:8px;
	height:8px;
	margin:0 4px;
	border-radius:5px;
	background-color:#fff;
	cursor:pointer;
}
.contents1.flex .popupZone .pop-navi span.active {
	width:16px;
	background-color:#ccff99;
}

.contents1.flex .popupZone .pop-slider a { display:block; }
.contents1.flex .popupZone .pop-slider {
	display: flex;
	transition: transform 0.5s ease;
}
.contents1.flex .popupZone .pop-slider li {
	list-style: none;
	flex: 0 0 100%;
	max-width: 100%;
}
.contents1.flex .popupZone .pop-slider img {
	width: 100%;
	display: block;
}

/* 컨텐츠1 바로가기 */
.contents1.flex .items.link > li {
	position:relative;
	height:300px;
}
.contents1.flex .items.link > li a {
	position:relative;
	display:block;
	height:100%;
	padding:35px;
	overflow:hidden;
	transition: all .25s;
}

.contents1.flex a:hover .btn-more {
	font-weight:700;
	color:#111;
	background:#fff;
	transition: all .25s;
}
.contents1.flex .items.link > li .con-ti { color:#fff; }
.contents1.flex .items.link > li .txt {
	margin-top:15px;
	font-size:18px;
	color:#fff;
}
.contents1.flex .items.link > li .bg {
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-position:calc(100% - 10px) calc(100% - 15px);
	transform:translateY(-50%);
	z-index:0;
}
.contents1.flex .items.link > li .bg1 { background-image:url(img/img_intro.png); }
.contents1.flex .items.link > li .bg2 { background-image:url(img/img_promotion.png); }
.contents1.flex .items.link > li .bg3 { background-image:url(img/img_system01.png); }
.contents1.flex .items.link > li .bg4 { background-image:url(img/img_system02.png); }
.contents1.flex .items.link > li .bg5 { background-image:url(img/img_map.png); }

.contents1.flex .items.link > li.system .bg {
	right:0;
	bottom:0;
	background-position:right bottom;
}

.contents1.flex .system.flex a { width:calc(100% / 2); }
.contents1.flex .system.flex .btn-more {
	position:relative !important;
	bottom:auto !important;
	margin-top:20px;
}
.contents1.flex .system.flex .img {
	bottom:0 !important;
	right:0 !important;
}
.contents1.flex .map a { border:2px solid #ccc; }
.contents1.flex .map a .con-ti { color:#333 !important }
.contents1.flex .map a .btn-more { color:#333 !important; border-color:#333 !important; }
.link-bg1 { background:linear-gradient(45deg, #3ea6e2, #0394cb); }
.link-bg2 { background:linear-gradient(45deg, #2f5597, #002060); }
.link-bg3 { background:linear-gradient(45deg, #78a22f, #60881b); }
.link-bg4 { background:linear-gradient(45deg, #fbb901, #c55a11); }

/* 메인 컨텐츠2 */
.contents2.flex {
	gap:40px;
	align-items:stretch;
}
.contents2.flex > .items {
	width:calc((100% - 40px) / 2);
	padding:35px;
	border:3px solid #ddd;
	border-radius:15px;
}

/* 기술요소 */
.items.skill {
	display:flex;
	flex-direction:column;
	gap:20px;
}
.items.skill .bg { padding:20px; }
.items.skill .bg .con-ti { color:#fff }
.items.skill .bg1 { background:#0495e8 }
.items.skill .bg2 { background:#78a22f }
.skill-cate  {
	margin-top:20px;
	transition: 0.3s all;
}
.skill-cate > li {
	width:calc(100% / 4);
	margin:-1px 0  0 -1px;
	text-align:center;
	letter-spacing:-1px;
	border:1px solid rgba(255,255,255,0.2);
}
.skill-cate > li a {
	display:block;
	padding:20px 5px;
	color:#fff;
	transition: 0.3s all;
}
.skill-cate > li a:hover {
	font-weight:800;
	background:rgba(0,0,0,0.3);
}

/* 공지사항 탭메뉴 */
.items.news {
	display:flex;
	flex-direction:column;
	gap:40px;
}
.tab {
	gap:10px 40px;
	padding-bottom:15px;
	border-bottom:2px solid #ddd;
}
.tab .tab_item a {
	display: inline-block;
	font-size:22px;
	font-weight:600;
	color:#666;
	transition: 0.3s all;
}
.tab .tab_item a:hover, .tab .tab_item.active a {
	color: #78a22f;
	font-weight:800;
}
.tab_con {
	position:relative;
	display: none;
}
.tab_con.active { display: block; }

.tab_con .more {
	position:absolute;
	top:-75px;
	right:0;
}

/* 게시글 추출 리스트 */
.bbsList {
	display:flex;
	flex-direction:column;
	gap:10px;
	margin-top:25px;
}
.bbsList > li {
	display:flex;
	justify-content:space-between;
}
.bbsList > li a {
	display:inline-block;
	width:calc(100% - 80px);
	font-weight:600;
	color:#333;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	transition: 0.25s all;
}
.bbsList > li a:hover { color:#78a22f; }
.bbsList > li span { color:#999 }

/* 행사일정 */
.schedule .con-ti {
	margin-bottom:20px;
	padding-bottom:15px;
	color:#78a22f;
	border-bottom:2px solid #ddd;
}
.calendar-wrap { align-items:stretch; }
.calendar-wrap > .items { width:calc(100% / 2) }
.items.calendar {
	text-align:center;
	border-color:#ddd;
	border-right:0;
	border-radius:15px 0 0 15px;
}
.items.calendar .tit {
	gap:20px;
	font-size:22px;
	font-weight:700;
}
.items.calendar .tit a { color:#333; }
.items.calendar .tit span { font-weight:800 !important }

.items.today {
	padding:25px;
	background-color:#005030;
}
.items.today .tit {
	padding-left:25px;
	font-weight:600;
	color:#ccff99;
	background:url("img/icon_cal.png") no-repeat 0 center;
}
.items.today > ul {
	margin-top:25px;
}
.items.today > ul li {
	position:relative;
	margin:10px 0;
	padding-left:10px;
	color:#fff;
}
.items.today > ul li::before {
	position:absolute;
	left:0;
	content:"•";
}

.tbl-cal {
	border-collapse:collapse;
	border-spacing:0;
	width:100%;
	margin-top:15px;
}
.tbl-cal th, .tbl-cal td {
	position:relative;
	line-height:30px;
	vertical-align:middle;
	text-align:center;
	z-index:2;
}
.tbl-cal .sun { color:#ff5066 }
.tbl-cal .sat { color:#2586f5 }
.tbl-cal td.eventday {
	color:#fff;
}
.tbl-cal td.eventday::before {
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	content:"";
	display:inline-block;
	width:23px;
	height:23px;
	margin:auto;
	background-color:#78a22f;
	border-radius:100%;
	z-index:-1;
}
.tbl-cal td.eventday.today::before {
	background-color:#005030;
}

/* 메인 대학생 기자단 */
.contents3 { background-color:#e8edde; }
.contents3 .tab { border-bottom:0; }
.bbsList2.flex { gap:20px }
.bbsList2.flex > li {
	width:calc((100% - 100px) / 6);
	padding:30px;
	background:#fff;
	border-radius:15px;
}
.bbsList2.flex > li p.cate {
	color:#0495e8;
	font-weight:700;
}
.bbsList2.flex > li a {
	display:block;
	min-height:110px;
	margin:10px 0;
	font-size:20px;
	font-weight:800;
	color:#333;
	transition:all .25s;
}
.bbsList2.flex > li a:hover { color:#78a22f }
.bbsList2.flex > li span {
	display:block;
	color:#999;
}

/* 카드뉴스&홍보방 */
.contents4.flex { gap:20px; }
.contents4.flex .items { width:calc((100% - 60px ) / 4); overflow: hidden; }
.contents4.flex .con-ti { color:#005030 }

/* 슬라이드 */
.sliderZone {
	position:relative;
	display:block;
}
.sliderZone .navi {
	display:inline-block;
	margin:0;
	padding:0;
	font-size:0;
}
.sliderZone .navi span {
	display:inline-block;
	width:8px;
	height:8px;
	margin:0 4px;
	border-radius:5px;
	background-color:#ccc;
	cursor:pointer;
}
.sliderZone .navi span.active {
	width:16px;
	background-color:#78a22f;
}

.sliderZone .pop-slider a { display:block; }
.sliderZone .pop-slider {
	display: flex;
	transition: transform 0.5s ease;
}
.sliderZone .pop-slider li {
	list-style: none;
	flex: 0 0 100%;
	max-width: 100%;
}
.sliderZone .pop-slider img {
	width: 100%;
	display: block;
}

.card-slider {
	display: flex;
    transition: transform 0.5s ease;
}
.card-slider li {
	list-style: none;
	flex: 0 0 100%;
	max-width: 100%;
}
.card-slider > li a {
	display:block;
	margin-top:15px;
	color:#222;
	font-weight:600;
	transition:all .25s;
}
.card-slider > li .img {
	height:220px;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center top;
	border:1px solid transparent;
	border-radius:15px;
	overflow:hidden;
}
.card-slider > li a .txt {
	margin-top:15px;
	font-weight:600;
	color:#333;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.card-slider > li a:hover .txt {
	color:#78a22f;
	text-decoration:none;
}
.card-slider > li a span.more {
	display:inline-block;
	padding:3px 10px;
	font-size:13px;
	color:#ffff;
	background:#78a22f;
	border-radius:30px;
	transition:all .25s;
}
.card-slider > li a:hover span.more { background:#005030; }

/* 바로가기 */
.quick.flex { gap:20px; }
.quick.flex a {
	position:relative;
	display:block;
	width:calc((100% - 40px) / 3 );
	padding:40px;
	background-color:#78a22f;
	background-image:url(img/quick_bg.png);
	background-repeat:no-repeat;
	background-position:bottom center;
	border-radius:15px;
	transition:all .25s;
}
.quick.flex .con-ti {
	position:relative;
	color:#fff;
	z-index:1;
}
.quick.flex .btn-more {
	position:relative;
	bottom:auto;
	margin-top:15px;
	background:#005030;
	border-color:transparent;
	z-index:1;
}
.quick.flex a:hover  {
	background-color:#5b8512;
	transition:all .25s;
}
.quick.flex .bg {
	position:absolute;
	right:0;
	top:50%;
	width:100%;
	height:80%;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:calc(100% - 35px) center;
	transform:translateY(-50%);
	z-index:0;
}
.quick.flex .bg1 { background-image:url(img/icon_quick01.png); }
.quick.flex .bg2 { background-image:url(img/icon_quick02.png); }
.quick.flex .bg3 { background-image:url(img/icon_quick03.png); }

/* 롤링배너 */
.control button {
	padding:0 3px;
	border:0;
	background:transparent;
}
.RollDiv {
	width:calc(100% - 165px);
	margin:25px 0;
	overflow:hidden;
}
.RollDiv > div {
width:100%;
height:35px;
overflow:hidden;
}
.RollDiv > div > a {
	float:left;
	display:block;
}
.RollDiv > div > a > img { margin-right:35px;}

/* 카피라이트 */
footer { background-color: #333; }
.foot-link.flex {
	gap:10px;
	padding:20px 0;
	border-bottom:1px solid #454545;
}

.foot-link.flex .left.flex {
	gap:25px;
}
.foot-link.flex .left a {
	font-weight:600;
	color:#a1a1a1;
}
.foot-link.flex .left a:nth-child(1) {
	color:#78a22f
}

.foot-link.flex .right select {
	min-width:220px;
	height:40px;
	padding:0 10px;
	border:0;
	border-radius:7px;
	background-image:url("img/icon_select.png");
	background-repeat:no-repeat;
	background-position:calc(100% - 10px) center;
	background-color:#fff;
	outline:0;
	-webkit-appearance:none;
   -moz-appearance:none;
   appearance:none;
}

.copyright { padding:40px 0; }
.copyright .logo { gap:15px }
.copyright p {
	margin-top:20px;
	color:#a1a1a1;
}

/* 로그인 페이지 */
.top-logo {
	padding:15px;
	text-align:center;
}
.login-contents {
	background-image:url(/n1/include_new/images/img/sub/login_bg.png);
	background-repeat:no-repeat;
	background-position:center bottom;
	background-color:#fef1e8;
}
.login-wrap2 {
	max-width:450px;
	margin:0 auto;
}
.login-form {
	flex-direction:column;
	gap:15px;
	padding:6%;
	border-radius:15px;
	background:rgba(255,255,255,0.9);
	box-shadow:3px 3px 15px rgba(0,0,0,0.4);
}
.login-form div { width:100%; }
.login-form label { margin-bottom:5px; }
.login-form .page-btn { width:100%; }
.login-info a {
	margin:0 7px;
	color:#666;
	font-weight:500;
	transition: 0.3s all;
}
.login-info a:hover { color:#78a22f }

.join-wrap { margin-top:5%; }
.join.flex {
	gap:20px;
	align-items:stretch;
	margin:25px auto 0 auto;
}
.join.flex .items { width:calc((100% - 80px) / 5); }
.join.flex .items a {
	display:block;
	height:100%;
	padding:10% 5%;
	text-align:center;
	border:1px solid #ddd;
	background:#f3f3f3;
	border-radius:15px;
	transition: 0.3s all;
}
.join.flex .items a .icon {
	display:inline-block;
	border-radius:50%;
}
.join.flex .items a .tit {
	margin-top:15px;
	color:#222;
	font-weight:600;
	transition: 0.3s all;
}
.join.flex .items:nth-child(1) a .icon { background:#78a22f }
.join.flex .items:nth-child(1) a:hover { border-color:#78a22f; }
.join.flex .items:nth-child(1) a:hover .tit { color:#78a22f; }
.join.flex .items:nth-child(2) a .icon { background:#909090 }
.join.flex .items:nth-child(2) a:hover { border-color:#909090; }
.join.flex .items:nth-child(2) a:hover .tit { color:#909090; }
.join.flex .items:nth-child(3) a .icon { background:#e3b393 }
.join.flex .items:nth-child(3) a:hover { border-color:#e3b393; }
.join.flex .items:nth-child(3) a:hover .tit { color:#e3b393; }
.join.flex .items:nth-child(4) a .icon { background:#557790 }
.join.flex .items:nth-child(4) a:hover { border-color:#557790; }
.join.flex .items:nth-child(4) a:hover .tit { color:#557790; }
.join.flex .items:nth-child(5) a .icon { background:#90893c }
.join.flex .items:nth-child(5) a:hover { border-color:#90893c; }
.join.flex .items:nth-child(5) a:hover .tit { color:#90893c; }

.login-copy {
	padding:20px;
	text-align:center;
	background:#fff;
}

/* 서브페이지 공통 */
.w100 { width:100% !important }
.bold { font-weight:600 }

.alignL { text-align:left !important }
.alignC { text-align:center !important }

.green { color:#78a22f !important }
.green2 { color:#005030 !important }
.gray-c { color:#ccc !important }
.gray-3 { color:#333 !important }
.gray-5 { color:#555 !important }
.gray-6 { color:#666 !important }
.gray-7 { color:#777 !important }

/* 버튼 설정 */
.btn-wrap { margin-top:25px }
.btn-wrap.flex { gap:10px }
.page-btn {
	display:inline-block;
	padding:0 15px;
	font-size:16px;
	line-height:31px;
	font-weight:500;
	color:#fff !important;
	border:1px solid transparent;
	border-radius:5px;
	transition: all .25s;
}
.page-btn:hover { color:#fff }
.btn-l {
	padding:0 35px;
	line-height:39px;
}
.btn-gray { background-color:#555 }
.btn-gray:hover { background-color:#333 }
.btn-gray9 { background-color:#999 }
.btn-gray9:hover { background-color:#777 }
.btn-grayD { color:#333 !important; background-color:#ddd }
.btn-grayD:hover { color:red !important; background-color:#fff; border-color:#ccc }
.btn-black { background-color:rgba(0,0,0,0.4); }
.btn-black:hover { background-color:rgba(0,0,0,0.7); }
.btn-red { background-color:#cc0000 }
.btn-red:hover { background-color:#b40000 }
.btn-green { background-color:#27a376 }
.btn-green:hover { background-color:#158f63 }
.btn-green2 { background-color:#6fd088 }
.btn-green2:hover { background-color:#5bc175 }
.btn-blue { background-color:#3366cc }
.btn-blue:hover { background-color:#2153b9 }
.btn-orange { background-color:#ff9933 }
.btn-orange:hover { background-color:#ff7133 }
.btn-line { color:#333 !important; border-color:#aaa }
.btn-line:hover { color:#1f7246 !important; border-color:#339966 }
.btn-b-line { color:#3366cc !important; border-color:#3366cc }
.btn-b-line:hover { color:#fff !important; background-color:#3366cc }
.btn-r-line { color:#cc0000 !important; border-color:#cc0000 }
.btn-r-line:hover { color:#fff !important; background-color:#cc0000 }

/* 테이블 */
caption { display:none }
.tbl {
	width:100%;
	margin-top:15px;
	border-top:3px solid #333;
	transition: all .25s;
}
.tbl th, .tbl td {
	position:relative;
	padding:8px;
	font-size:16px;
	text-align:center;
	vertical-align:middle;
}
.tbl th {
	color:#333;
	font-weight:700 !important;
}
.tbl thead th {
	padding:10px;
	border-bottom:1px solid #333;
}
.tbl tbody th { background-color:#e9f4f0 }
.tbl > * > tr > * { border:1px solid #ddd }
.tbl > * > tr > *:first-child { border-left:0 }
.tbl > * > tr > *:last-child { border-right:0 }
.tbl > * > tr:hover { background:#f1f1f1 }
.tbl a { color:#333 }
.tbl a:hover { color:#27a376 }
.tbl-scroll { min-width:700px; }

/* 서브페이지 탭 메뉴 */
.tab-cate {
	gap:10px;
	margin:0 0 50px 0;
	padding:0;
	font-size:0;
}
.tab-cate > li a {
	padding:10px 25px;
	font-size:18px;
	color:#777;
	font-weight:600;
	background:#eee;
	border-radius:50px;
}
.tab-cate > li a:hover, .tab-cate > li.over a {
	color:#fff;
	background:#78a22f;
}

/* 탭 서브 카테고리 */
.tab-cate-sub { margin-bottom:60px; }
.tab-cate-sub > li {
	width:calc(100% / 4) !important;
	margin-left:-1px;
	margin-top:-1px;
	text-align:center;
	border:1px solid #ddd;
}
.tab-cate-sub > li a {
	display:block;
	padding:7px;
	color:#333;
	transition: all .25s;
}
.tab-cate-sub > li a.over, .tab-cate-sub > li a:hover {
	font-weight:800;
	color:#78a22f;
	background:#e8edde;
}

/* 폼 설정 */
.form-wrap { gap:10px }
.form-wrap.box {
	margin:20px 0;
	padding:20px;
	background:#eee;
	border-radius:15px
}
.form-control, .form-select {
	width:auto;
	padding:0 10px;
	line-height:33px;
}
.form-control[readonly] { background-color:#f1f1f1; }


/* 게시판 테이블 */
.tbl-board td:nth-child(2) { text-align:left }

/* 게시판 상세보기 */
.board-view-ti {
	margin-bottom:25px;
	text-align:center;
}
.board-view-ti h1 {
	margin:15px 0;
	font-size:35px;
	font-weight:700;
}
.board-view-content {
	padding:50px 0;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
}
.file-wrap {
	margin-top:50px;
	padding:20px;
	background:#f1f1f1;
}
.file-icon {
	padding:0 0 0 25px;
	color:#333;
	background-repeat:no-repeat;
	background-position:0 3px;
}
.pdf { background-image:url("img/bul_pdf.gif") }

/* 이전글 다음글 */
.board-list-info {
	display:flex;
	padding:30px 0;
	align-items:center;
	border-bottom:1px solid #ddd;
}
.board-list-info > dt {
	width:75px;
	font-weight:bold;
}
.board-list-info > dd { width:calc(50% - 75px);}
.board-list-info > dd > a {
	display:block;
	width:100%;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.board-list-info > dd > a:hover {
	text-decoration:underline;
	text-underline-position:under;
	}
.board-list-info > .next { text-align:right; }

/* 갤러리 게시판 */
.gallery-wrap {
	margin-top:15px;
	border-top:3px solid #333;
}
.gallery-wrap .flex {
	gap:20px;
	margin-top:20px;
}
.gallery-wrap .flex li {
	flex:1 1 calc(25% - 20px);
	overflow:hidden;
}
.gallery-wrap .flex li a { display:block; }
.gallery-wrap .flex li .thumb {
	display:block;
	min-height:120px;
	overflow:hidden;
}
.gallery-wrap .flex li .tit {
	margin:10px 0;
	color:#333;
	font-weight:600;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	transition: 0.3s all;
}
.gallery-wrap .flex li .date {
	font-size:14px;
	color:#999;
}
.gallery-wrap .flex li a:hover .tit { color:#78a22f }

/* 페이징 */
.paging.flex {
	gap:5px;
	justify-content:center;
}
.paging a {
	display:inline-block;
	width:23px;
	line-height:23px;
	text-align:center;
	color:#333;
	border-radius:50%;
}
.paging a:hover, .paging a.on {
	color:#fff;
	background-color:#666;
}

/* 그린리모델링 챌린지 */
.challenge.flex {
	gap:20px;
	align-items:stretch;
	margin-top:5%;
}
.challenge.flex > li {
	width:calc((100% - 40px) / 3);
	padding:35px 20px;
	text-align:center;
	border-radius:15px;
}
.challenge.flex > li .con-ti { margin:15px 0; }
.challenge.flex > li:nth-child(1) { background:#e0f2ff }
.challenge.flex > li:nth-child(2) { background:#fffbdb }
.challenge.flex > li:nth-child(3) { background:#ffeada }
.challenge.flex > li:nth-child(4) { background:#ffebdd }
.challenge.flex > li:nth-child(5) { background:#daf2ff }
.challenge.flex > li:nth-child(6) { background:#f6ffd0 }

/* 챌린지 일정안내 */
.challenge-flow.flex {
	gap:20px;
	align-items:stretch;
}
.challenge-flow.flex > li {
	width:calc((100% - 60px) / 4);
	padding:25px 10px;
	text-align:center;
	background:#e6e6e6;
	border-radius:15px;
}
.challenge-flow.flex > li .con-ti { margin:15px 0; }
.challenge-flow.flex > li .step {
	display:inline-block;
	margin-bottom:10px;
	padding:3px 10px;
	font-size:14px;
	font-weight:700;
	background-color:#fff;
	border-radius:25px;
}

/* 작품제출 */
.tbl-form th { background-color:#e6e6e6 !important }
.tbl-form th.required:after {
	content:" *";
	color:red;
}
.tbl-form td { text-align:left; }
.tbl-form td .flex { gap:7px; }

@media (max-width: 1620px) {
	.submenu-container .container { margin-right: 0; }
	.submenu-container .container .row { left: -30px; }
	.center-wrap.w1 {
		padding-left:20px;
		padding-right:20px;
	}
}

@media (max-width: 1260px) {
	.main-menu, .submenu-container {display: none; }
	.mobile-menu-button { display: block; }

	.submenu-container .container { margin-right: 1em; }
	.submenu-container .container .row { left: initial; }
	.center-wrap.w2 {
		padding-left:20px;
		padding-right:20px;
	}
}

/* Laptop */
@media (max-width: 1024px) {
	/* 로그인 */
	.login-wrap a { font-size:13px; }

	/* 통합검색 */
	.input-wrap .ipt-search { height:35px; }

	/* SNS */
	.top-gnb > .sns.flex { display:none }

	/* 서브페이지 배너 */
	.subpage-banner, .subpage-title {font-size:4vw;}
	.subpage-menu-wrap .right { gap:10px }
	.subpage-menu-wrap .navi { font-size:16px; }

	/* 메인 공통 */
	.con-ti.ti1 { font-size:26px; }
	.con-ti.ti2 { font-size:20px; }
	.con-ti.ti3 { font-size:18px; }
	.con-padd {
		padding-top:40px;
		padding-bottom:40px;
	}
	.btn-more { font-size:14px }

	/* 메인 컨텐츠1 */
	.contents1.flex .items { width:calc(100% / 2); }
	.contents1.flex .popupZone { height:500px; }
	.contents1.flex .items.link > li { height:250px; }
	.contents1.flex .items.link > li a { padding:20px; }
	.contents1.flex .items.link > li .txt { font-size:16px; }
	.contents1.flex .items.link > li .btn-more { bottom:20px; }
	.contents1.flex .items.link2 { display:flex; width:100%; }
	.contents1.flex .items.link2 > li { width:100% }

	/* 메인 컨텐츠2 */
	.contents2.flex > .items {
		width:100%;
		padding:20px;
	}

	/* 기술요소 */
	.skill-cate > li a { padding:10px 5px; }

	/* 공지사항 탭 */
	.tab { gap:5px 25px; }
	.tab .tab_item a { font-size:18px; }
	.tab_con .more {
		top:-68px;
		width:27px;
	}

	/* 대학생 기자단 */
	.bbsList2.flex > li {
		width:calc((100% - 40px) / 3);
		padding:20px;
	}
	.bbsList2.flex > li a {
		font-size:18px;
		font-weight:700;
	}

	/* 카드뉴스 */
	.contents4.flex .items { width:calc((100% - 20px ) / 2) }

	/* 바로가기 */
	.quick.flex a { padding:20px; }
	.quick.flex .bg { background-position:calc(100% - 15px) center; }

	/* 롤링배너 */
	.RollDiv { margin:15px 0; }
	.RollDiv > div > a > img { margin-right:25px;}

	/* 버튼 */
	.page-btn {
		font-size:16px;
		line-height:33px;
	}

	.subpage-menu-wrap .right { display:none }

	/* 게시판 탭 */
	.tab-cate { margin-bottom:35px; }
	.tab-cate > li a {
		padding:7px 15px;
		font-size:16px;
	}

	/* 폼 설정 */
	.form-control, .form-select { line-height:33px; }

	.tbl-board td:nth-child(2) { text-align:left }
}

/* Tablet */
@media (max-width: 768px) {
	html,body,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,blockquote,p,address,pre,cite,form,fieldset,caption,legend,input,textarea,select,table,th,td,div { font-size:15px; }
	.subpage-menu li:not(:first-child)::before { margin:0 0.7em }
	.subpage-menu-wrap .right { display:none }
	.sub-contents { padding:30px 0 }

	/* 상단 검색 */
	.keyword-wrap { display:none }

	/* 상단 로고 */
	.mainLogo img { width:190px }

	/* 메인 컨텐츠1 */
	.contents1.flex .items { width:100%; }
	.contents1.flex .items.link2 { flex-direction:column; }

	.quick.flex a { width:100%; }

	/* 카피라이트 */
	.foot-link.flex .left a {
		font-size:14px;
	}

	.foot-link.flex .right select {
		height:37px;
		line-height:37px;
		font-size:14px;
		background-size:12px;
	}

	.copyright { padding:20px 0; }
	.copyright p {
		margin-top:15px;
		font-size:14px;
	}

	.tab-cate-sub { margin-bottom:20px }

	/* 글쓰기 폼 */
	form .input-group { display: initial; }
	form .input-group input[type="text"] { width: 100%; }
	form .input-group .input-group-text {
		background: none;
		border: none;
		padding: 5px 0;
	}

	/* 테이블 설정 */
	.tbl th, .tbl td { font-size:15px; }

	/* 게시판 테이블 */
	.tbl-board .num, .tbl-board .date { display:none }

	/* 게시판 상세보기 */
	.board-view-ti h1 { font-size:28px; }
	.board-view-content { padding:35px 0 }
	.board-list-info.flex { padding:20px 0 }

	/* 갤러리 게시판 */
	.gallery-wrap .flex { gap:20px; }
	.gallery-wrap .flex li { flex:1 1 calc(100% / 3 - 20px); }
	
	/* 그린리모델링 챌린지 */
	.challenge.flex > li { width:calc((100% - 20px) / 2); }
	
	/* 로그인 페이지 */
	.join.flex .items a .icon { width:50px }
}

/* Mobile */
@media (max-width: 540px) {
	.subpage-banner, .subpage-title { font-size:22px; }
	.subpage-menu > li > a { font-size:15px }

	.top-gnb.flex { margin:15px auto }

	/* 상단 검색 */
	.top-search.flex { width:100%; }
	.input-wrap {
		width:100%;
		margin-top:12px;
		border-radius:7px;
	}
	.input-wrap .ipt-search { height:31px; }

	/* SNS */
	.sns.flex img { width:35px }

	/* 메인 공통 */
	.con-ti.ti1 { font-size:22px; }
	.con-ti.ti2 { font-size:18px; }
	.con-ti.ti3 { font-size:16px; }
	.con-padd {
		padding-top:20px;
		padding-bottom:20px;
	}

	/* 메인 컨텐츠1 */
	.contents1.flex { padding-top:15px }
	.contents1.flex .items.link > li .bg { background-size:150px }

	.contents2.flex { gap:20px; }

	/* 기술요소 */
	.skill-cate > li { width:100%; }

	/* 탭메뉴 */
	.tab .tab_item a { font-size:16px }
	.tab_con .more {
		top:-55px;
		width:23px;
	}
	/* 게시물 추출 */
	.bbsList { margin-top:15px; }

	/* 행사일정 */
	.calendar-wrap > .items { width:100% }
	.items.calendar .tit { font-size:18px; }
	.items.today {
		margin-top:10px;
		padding:15px;
	}
	.items.today > ul { margin-top:0; }
	.tbl-cal { margin-top:5px; }
	.tbl-cal th, .tbl-cal td { line-height:27px }

	/* 대학생 기자단 */
	.bbsList2.flex { gap:10px; }
	.bbsList2.flex > li {
		width:100%;
		padding:15px;
	}
	.bbsList2.flex > li a {
		min-height:auto;
		margin:5px 0;
		font-size:16px;
	}
	
	/* 그린리모델링 챌린지 */
	.challenge.flex > li {
		width:100%;
		padding:20px 10px;
	}
	/* 챌린지 일정안내 */
	.challenge-flow.flex > li {
		width:calc((100% - 20px) / 2);
		padding:20px 10px;
	}
	.challenge-flow.flex > li img { width:55px }
	
	.tbl-form col { width:100% !important; }
	.tbl-form th, .tbl-form td {
		display:block;
		padding:5px 0;
		border:0;
	}
	
	/* 챌린지 작품 제출 */
	.form-wrap.box .form-control, .form-select, .page-btn { width:100%; }

	/* 카드뉴스 */
	.contents4.flex .items { width:100%; }
	.card-slider > li .img { height:175px }

	/* 버튼 */
	.page-btn {
		font-size:15px;
		line-height:31px;
	}

	/* 게시판 카테고리 */
	.tab-cate { justify-content:flex-start }
	.tab-cate > li { width:calc((100% - 10px) / 2) }
	.tab-cate > li a {
		display:block;
		font-size:14px;
		text-align:center;
	}

	.tab-cate-sub > li { width:calc(100% / 2) !important; }

	/* 게시판 상세보기 */
	.board-view-ti h1 { font-size:20px; }

	/* 갤러리 게시판 */
	.gallery-wrap .flex li { flex:1 1 calc(100% / 2 - 20px); }

	/* 버튼 wrap */
	.btn-wrap.flex { justify-content:center }
	.btn-wrap .paging {
		order:-1;
		margin-bottom:10px;
	}

	/* 페이징 */
	.paging a {
		width:19px;
		font-size:14px;
		line-height:19px;
	}

	/* 로그인 페이지 */
	.login-contents { background-size:250% }
	.join-wrap { margin-top:15%; }
	.join.flex .items { width:calc((100% - 20px) / 2); }
}

/* Mobile */
@media (max-width:320px) {
	html,body,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,blockquote,p,address,pre,cite,form,fieldset,caption,legend,input,textarea,select,table,th,td,div { font-size:14px; }
	.center-wrap {
		padding-left:15px !important;
		padding-right:15px !important;
	}

	/* 메인 공통 */
	.con-ti.ti1 { font-size:18px; }
	.con-ti.ti2 { font-size:16px; }
	.con-ti.ti3 { font-size:15px; }

	/* 메인 컨텐츠1 */
	.contents1.flex .popupZone { height:300px; }

	/* 메인 컨텐츠1 */
	.contents2.flex > .items { padding:15px; }

	/* 기술요소 */
	.items.skill .bg { padding:15px }
	.skill-cate > li a { padding:7px; }

	/* 공지사항 */
	.items.news { gap:20px }

	/* 탭 */
	.tab {
		gap:10px;
		padding-bottom:10px
	}
	.tab_con .more { top:-50px; }

	/* 게시물 추출 */
	.bbsList { gap:7px }

	/* 달력 테이블 */
	.tbl-cal th, .tbl-cal td {
		font-size:14px;
		line-height:25px;
	}
}