@charset "utf-8";

/*공통*/
.txt-red {color:var(--color-first);}
.txt-green {color:var(--color-second);}

.sub-page-menu {margin-bottom:80px;}
.sub-page-menu ul {display:flex; justify-content:center;}
.sub-page-menu ul li {padding:0 20px;}
.sub-page-menu ul li a { display:flex; min-width:150px; min-height:47px; border:1px solid #ddd; border-radius:100vh; align-items:center; justify-content:center; text-align:center; font-weight:400; line-height:1.2em; letter-spacing:-0.03em; color:#454545;}
.sub-page-menu ul li.active a, 
.sub-page-menu ul li a:hover {background:var(--color-first); border-color:var(--color-first); color:#fff;}

/* 인사말 */
.greeting .top-cont {display:flex; align-items:center; position:relative; margin-bottom:35px;}
.greeting .top-cont:before {content:''; position:absolute; width:100vw; height:100%; left:50%; top:0; transform:translateX(-50%); background:#f4f4f4; z-index:-1;}
.greeting .top-cont > div {width:50%;}
.greeting .top-cont .tit-wrap {position:relative; padding-bottom:30px;}
.greeting .top-cont .tit-wrap:before {content:''; position:absolute; width:110px; height:3px; left:0; bottom:0; background:#c8221d;}
.greeting .top-cont .tit {margin-bottom:40px; font-size:35px; font-weight:700; line-height:1.2em; letter-spacing:-0.02em; color:#242424;}
.greeting .top-cont .txt {font-size:25px; font-weight:600; line-height:1.6em; letter-spacing:-0.02em; color:#242424;}
.greeting .bottom-cont {display:flex;}
.greeting .bottom-cont > div {width:50%; padding-right:10px;}
.greeting .bottom-cont .txt {margin-bottom:25px; font-weight:400; letter-spacing:-0.02em; color:#454545;}
.greeting .bottom-cont .sign {margin-top:35px; font-size:18px; font-weight:600; line-height:1.2em; letter-spacing:-0.02em; color:#242424; text-align:right;}
.greeting .bottom-cont .sign img {display:inline-block; margin-left:10px; vertical-align:middle;}

/* 비전 목표 */
.goal {position:relative;}
.goal .slick-arrow {position:absolute; z-index:1; top:50%; width:70px; height:70px; margin-top:-35px; border-radius:100%; border:1px solid #dedede; background-color:transparent; background-repeat:no-repeat; background-position:50% 50%; text-indent:-999em; overflow:hidden; transition:0.2s all ease;}
.goal .slick-arrow:hover {background-color:#c8221d; border-color:#c8221d;}
.goal .slick-prev {background-image:url('../images/sub/arw-prev.png'); left:-150px;}
.goal .slick-next {background-image:url('../images/sub/arw-next.png'); right:-150px;}
.goal .slick-prev:hover {background-image:url('../images/sub/arw-prev02.png');}
.goal .slick-next:hover {background-image:url('../images/sub/arw-next02.png');}



/* 한국연구재단자료 */
.report ul {display:flex; justify-content:center;}
.report ul li {padding:0 55px;}
.report ul li a {position:relative; display:flex; width:230px; height:230px; border:1px solid #ddd; border-radius:100%; flex-direction:column; align-items:center; justify-content:center; text-align:center; overflow:hidden;}
.report ul li .icon {margin-bottom:25px;}
.report ul li .tit {font-size:20px; font-weight:600; line-height:1.2em; letter-spacing:-0.02em; color:#242424;}
.report ul li .hover-cont {position:absolute; left:0; top:0; width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:#499736; opacity:0; transition:0.2s all ease;}
.report ul li:nth-child(even) .hover-cont {background:#144c8c;}
.report ul li a:hover .hover-cont {opacity:1;}
.report ul li .hover-cont .tt {font-size:22px; font-weight:600; line-height:1.2em; letter-spacing:-0.02em; color:#fff; margin-bottom:17px;}
.report ul li .hover-cont .more img {display:block;}
.report ul li a:hover .hover-cont .tt,
.report ul li a:hover .hover-cont .more {animation:move_up 0.5s ease-in-out;}

@keyframes move_up {
  0%{
	opacity:0;
    transform:translateY(10px);
  }
  100% {
	opacity:1;
    transform:translateY(0);
  }
}

/* 회원교 현황 */
.partner-list .group {margin-bottom:60px;}
.partner-list .group:last-child {margin-bottom:0;}
.partner-list .group-tit {padding-bottom:20px; margin-bottom:25px; border-bottom:1px solid #ddd; font-size:22px; font-weight:700; line-height:1.2; letter-spacing:-0.03em; color:#242424;}

.partner-list ul {display:flex; flex-wrap:wrap; margin:0 -15px -36px -15px;}
.partner-list ul li {width:20%; padding:0 15px; margin-bottom:36px; text-align:center;}
.partner-list ul li a {display:block;}
.partner-list ul li .img {margin-bottom:14px;}
.partner-list ul li img {width:100%;}
.partner-list ul li .tit {font-weight:500; line-height:1.2em; letter-spacing:-0.03em; color:#454545;}
.partner-list ul li .tit strong {display:inline-block; margin-right:3px;}

/* 창업학점교류 */
.grade ul {display:flex; justify-content:center; margin:0 -12px;}
.grade ul li {padding:0 12px; text-align:center; width:20%;}
.grade ul li a {position:relative; display:block; margin-bottom:20px; border-radius:100%; overflow:hidden;}
.grade ul li .icon {position:relative; padding-bottom:100%; overflow:hidden;}
.grade ul li .icon img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:90%; max-height:90%; object-fit:contain;}
.grade ul li .icon:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd; border-radius:100vh;}

.grade ul li .cate {margin-bottom:10px; font-weight:500; line-height:1.2em; letter-spacing:-0.02em; color:#499736;}
.grade ul li .tit {font-size:20px; font-weight:600; line-height:1.2em; letter-spacing:-0.02em; color:#242424;}
.grade ul li .hover-cont {position:absolute; left:0; top:0; width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:#499736; opacity:0; transition:0.2s all ease;}
.grade ul li a:hover .hover-cont {opacity:1;}
.grade ul li .hover-cont .tt {font-size:22px; font-weight:600; line-height:1.2em; letter-spacing:-0.02em; color:#fff; margin-bottom:20px;}
.grade ul li .hover-cont .more img {display:block;}
.grade ul li a:hover .hover-cont .tt,
.grade ul li a:hover .hover-cont .more {animation:move_up 0.5s ease-in-out;}

/* 수도권 */
.grade1 ul li:nth-child(1) .cate {color:#c8221d;}
.grade1 ul li:nth-child(1) .hover-cont {background:#00509b;}
.grade1 ul li:nth-child(2) .hover-cont {background:#0093c8;}
.grade1 ul li:nth-child(3) .hover-cont {background:#003782;}
.grade1 ul li:nth-child(4) .hover-cont {background:#eb6100;}


/* 충청권 */
.grade2 ul li:nth-child(1) .cate {color:#c8221d;}
.grade2 ul li:nth-child(1) .hover-cont {background:#2f8acb;}
.grade2 ul li:nth-child(2) .hover-cont {background:#d91248;}
.grade2 ul li:nth-child(3) .hover-cont {background:#2a376d;}
.grade2 ul li:nth-child(4) .hover-cont {background:#ec6725;}
.grade2 ul li:nth-child(5) .hover-cont {background:#1b0e5e;}

/* 동남권 */
.grade3 ul li:nth-child(1) .cate {color:#c8221d;}
.grade3 ul li:nth-child(1) .hover-cont {background:#00596e;}
.grade3 ul li:nth-child(2) .hover-cont {background:#3f0095;}
.grade3 ul li:nth-child(3) .hover-cont {background:#00083e;}
.grade3 ul li:nth-child(4) .hover-cont {background:#0066a6;}
.grade3 ul li:nth-child(5) .hover-cont {background:#e11838;}

/* 대경강원권 */
.grade4 ul li:nth-child(1) .cate {color:#c8221d;}
.grade4 ul li:nth-child(1) .hover-cont {background:#6f3a96;}
.grade4 ul li:nth-child(2) .hover-cont {background:#2b8177;}
.grade4 ul li:nth-child(3) .hover-cont {background:#a90056;}
.grade4 ul li:nth-child(4) .hover-cont {background:#df2d32;}

/* 호남제주권 */
.grade5 ul li:nth-child(1) .cate {color:#c8221d;}
.grade5 ul li:nth-child(1) .hover-cont {background:#009995;}
.grade5 ul li:nth-child(2) .hover-cont {background:#224a8a;}
.grade5 ul li:nth-child(3) .hover-cont {background:#008cd6;}