@charset "utf-8";
@import url("layout.css");
@import url("contents.css");
/*-------------------------------------------------
Author : ㅈㅁㅈ
Create date : 2018-11-19
-------------------------------------------------*/

#body {position: relative; width: 71rem; max-width: 100%; margin: 0 auto 3.9rem; padding: 0 1rem;}
.stitle {overflow: hidden; height: 0;}

#header .top_service .gov img:first-child {display: none !important;}
#header .top_service .gov img:last-child {display: block; height: 2rem;}

/* 서브메뉴 */
#snavigation {position: relative; padding-top: 2.6rem;}
#snavigation::before {position: absolute; left: 50%; top: 0; z-index: -1; width: 1000%; height: 2.6rem; margin-left: -500%; background: linear-gradient(to right, #3a64b3 45%, #464da2 55%); content: '';}
#snavigation .hidden {overflow: hidden; height: 6rem; margin: 0 15rem; font-size: 2rem; color: #000; text-align: center; line-height: 6rem; white-space: nowrap;}
#snavigation ul {display: block; position: relative; margin-bottom: 1.5rem; text-align: center; line-height: 3.15rem;}
#snavigation li:first-child::before {position: absolute; left: 50%; top: 0; z-index: -1; width: 1000%; height: 100%; margin-left: -500%; border-top: 1px solid #dedede; border-bottom: 1px solid #dedede; background-color: #f8f8f8; content: '';}
/*#snavigation li {display: inline-block; height: 3.15rem; margin: 0 1.375rem; vertical-align: top;}*/
#snavigation li {display: inline-block; height: 3.15rem; margin: 0 1rem; vertical-align: top;}
#snavigation a {display: block; position: relative; height: 100%; font-size: 0.8rem;}
#snavigation .on a {border-bottom: 3px solid #377cfd; color: #000;}

/* 현재위치 */
.page-location {position: absolute; left: 0; top: 0; width: 100%; height: 2.6rem; font-size: 0.75rem; line-height: 2.6rem;}
.page-location .home {overflow: hidden; float: left; width: 3rem; height: 100%; border-left: 1px solid #7593ca; border-right: 1px solid #7593ca; text-align: center;}
.page-location .home::before {display: block; font-family: 'xeicon'; font-size: 1rem; color: #fff; content: ''; line-height: inherit;}
.page-location ul {float: left; position: relative; z-index: 1; width: 11rem; padding-top: 2.6rem;}
.page-location li a {display: block; visibility: hidden; overflow: hidden; height: 0; border: 1px solid #ddd; border-top: 0 none; background-color: #fff; padding: 0 1rem; transition: all 0.2s;}
.page-location li a:hover,
.page-location li a:focus,
.page-location li a:active {background-color: #f8f8f8; color: #3a64b3;}
.page-location li.active::after {position: absolute; right: 1rem; top: 0; font-family: 'xeicon'; color: #fff; content: ''; transition: all 0.2s; transform: rotate(180deg); z-index: -1;}
.page-location .active a {visibility: visible; height: 2.6rem;}
.page-location .active .active::after {transform: rotate(0deg);}
.page-location .active > a {visibility: visible; position: absolute; left: 0; top: 0; width: 100%; height: 2.6rem; border: 0 none; border-right: 1px solid #7593ca; background: none; color: #fff;}

/* 서브 유틸 */
.cont-util {position: absolute; right: 1rem; top: 0; font-size: 0.75rem; color: #fff; text-align: right; line-height: 2.6rem; z-index: 1;}
.cont-util a {display: inline-block; vertical-align: top;}
.cont-util .label::before {margin-right: 0.5rem; font-family: 'xeicon'; font-size: 1rem; content: ''; vertical-align: middle;}
.cont-util .print::before {margin: 0 0.5rem 0 0.75rem; font-family: 'xeicon'; font-size: 1rem; content: ''; vertical-align: middle;}
.cont-util .share {display: inline-block; position: relative; z-index: 1; vertical-align: middle;}
.cont-util .share .list {visibility: hidden; overflow: hidden; position: relative; left: 50%; height: 0; margin-top: 0; padding: 0; border: 1px solid #ddd; background-color: #fff; opacity: 0; transform: translate(-50%, 0); transition: margin-top 0.3s, opacity 0.3s;}
.cont-util .share .list::before {position: absolute; left: 50%; top: -0.25rem; width: 0.4rem; height: 0.4rem; margin-left: -0.2rem; border-top: 1px solid #ddd; border-left: 1px solid #ddd; background-color: #fff; content: ''; transform: rotate(45deg);}
.cont-util .share .list a {display: block; overflow: hidden; height: 2rem; padding: 0 0.5rem; font-size: 0.65rem; color: #6c6c6c; text-align: center; line-height: 2rem; white-space: nowrap; transition: all 0.2s;}
.cont-util .share .list a:hover,
.cont-util .share .list a:focus,
.cont-util .share .list a:active {color: #464da2; text-decoration: underline;}
.cont-util .share .list .facebook::before {display: block; font-family: 'xeicon'; font-size: 1rem; content: '';}
.cont-util .share .list .twitter::before {display: block; font-family: 'xeicon'; font-size: 1rem; content: '';}
.cont-util .share.active .list {visibility: visible; overflow: visible; height: auto; margin-top: 0.3rem; padding: 0.5rem 0 0.2rem; opacity: 1;}
/* 210112 글자크기 추가 */
.cont-util ul::after {display: block; clear: both; content: "";}
.cont-util ul li {float: left; position: relative;}
.cont-util ul li::after {display: inline-block; vertical-align: middle; background: #8f97c9; width: 1px; height: 1.1rem; content: ""; margin-left: 0.75rem;}
.cont-util ul li:last-child {margin-left: 0.75rem;}
.cont-util ul li:last-child::after {content: none;}
.cont-util .fontsize-control > span {display: inline-block;}
.cont-util ul li:last-child button{display: inline-block; position: relative; background: #b5b8da; width: 1.2rem; height: 1.2rem; color: #2f3c95; border-radius: 50%; vertical-align: middle; margin-left: 0.2rem; overflow: hidden;}
.cont-util ul li:last-child button > span {position: relative; top: -0.5rem;}
.cont-util ul li:last-child button > i {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
/* //210112 글자크기 추가 */

/* 상단 고정 */
#header.fixed + #body #snavigation::before {position: fixed; z-index: 1;}
#header.fixed + #body .page-location {position: fixed; left: 50%; z-index: 1; width: 35.5rem; max-width: 50%; transform: translate(-100%, 0);}
#header.fixed + #body .cont-util {position: fixed; right: 50%; z-index: 1; width: 34.5rem; max-width: 50%; transform: translate(100%, 0);}

/* 콘텐츠 이전다음 */
.cont-control {position: absolute; left: 0; top: 2.6rem; width: 100%; line-height: 6rem;}
.cont-control .prev {float: left;}
.cont-control .prev::before {margin-right: 0.5rem; font-family: 'xeicon'; font-size: 2rem; color: #b1b1b1; content: ''; vertical-align: middle; transition: all 0.2s;}
.cont-control .next {float: right;}
.cont-control .next::after {margin-left: 0.5rem; font-family: 'xeicon'; font-size: 2rem; color: #b1b1b1; content: ''; vertical-align: middle; transition: all 0.2s;}
.cont-control a {transition: all 0.2s;}
.cont-control a:hover,
.cont-control a:focus,
.cont-control a:active,
.cont-control a:hover::before,
.cont-control a:focus::before,
.cont-control a:active::before,
.cont-control a:hover::after,
.cont-control a:focus::after,
.cont-control a:active::after {color: #000;}

/* 콘텐츠 하단 */
.content-footer {position: relative; z-index: 0; min-height: 3.25rem; margin-top: 4.5rem; line-height: 3.25rem;}

/* 콘텐츠 담당자 */
.content-footer .charge {border-top: 1px solid #97a0b2; border-bottom: 1px solid #ddd; background-color: #fff;}
.content-footer .charge h2 {display: inline-block; font-size: 0.8rem; font-weight: 400; color: #272727; vertical-align: middle;}
.content-footer .charge h2::before {display: inline-block; width: 1.9rem; height: 1.9rem; margin-right: 0.6rem; border-radius: 100%; background-color: #97a0b2; font-family: 'xeicon'; font-size: 1.2rem; color: #fff; content: ''; text-align: center; line-height: 1.9rem; vertical-align: middle;}
.content-footer .charge ul {display: inline-block; vertical-align: middle;}
.content-footer .charge li {float: left; position: relative; padding: 0 2.2rem; vertical-align: middle;}
.content-footer .charge li + li::before {position: absolute; left: -0.125rem; top: 50%; width: 0.25rem; height: 0.25rem; margin-top: -0.125rem; border-radius: 100%; background-color: #ddd; content: '';}
.content-footer .charge strong {margin-right: 0.3rem; font-weight: 400; color: #272727;}

/* 콘텐츠 만족도 */
.content-footer .confooter_box {border-bottom: 0 none;}
.content-footer .confooter_box .title_satisfaction a {position: absolute; right: 0; top: 0.9rem; width: 8.1rem; height: 1.65rem; padding: 0 1.25rem; border-radius: 1.65rem; border: 1px solid #4f5360; background-color: #fff; font-size: 0.8rem; color: #292e3e; line-height: 1.6rem;}
.content-footer .confooter_box .title_satisfaction a::after {position: absolute; right: 1.25rem; top: 0; font-size: 0.4rem; content: '▲'; transform: rotate(180deg); transition: all 0.2s;}
.content-footer .confooter_box .float_right {visibility: hidden; overflow: hidden; position: relative; height: 0; padding-left: 18.5rem; text-align: right; vertical-align: middle; transition: height 0.3s;}
.content-footer .confooter_box .float_right p:first-child {position: absolute; left: 0; bottom: 0; width: 18.5rem; color: #272727; text-align: left; vertical-align: middle;}
.content-footer .confooter_box .float_right ul {float: left; width: 26rem;}
.content-footer .confooter_box .float_right li {float: left; white-space: nowrap;}
.content-footer .confooter_box .float_right .txt {display: inline-block; position: relative; width: 41%; height: 1.85rem; padding-right: 2rem; vertical-align: middle;}
.content-footer .confooter_box .float_right .input_mid {width: 100%; vertical-align: top;}
.content-footer .confooter_box .float_right .form-radio label::before,
.content-footer .confooter_box .float_right .form-radio label::after {margin-top: 1.05rem;}
.content-footer .confooter_box .float_right .btn_assess {overflow: hidden; position: absolute; right: 0; top: 0; width: 2rem; height: 1.85rem; background-color: #292e3e; text-align: center; line-height: 1.85rem;}
.content-footer .confooter_box .float_right .btn_assess::before {display: block; font-family: 'xeicon'; font-size: 0.75rem; color: #fff; content: ''; text-align: center;}
.content-footer .confooter_box.active {border-bottom: 1px solid #ddd;}
.content-footer .confooter_box.active .title_satisfaction a::after {transform: rotate(0deg);}
.content-footer .confooter_box.active .float_right {visibility: visible; height: 3.25rem;}

/* 위로가기 */
.go-top {position: fixed; right: 2rem; bottom: 9.5rem; z-index: 10; width: 3.5rem; height: 3.5rem; border-radius: 100%; background-color: #181b26; font-size: 0.5rem; font-weight: 900; color: #fff; text-align: center; line-height: 1.2; transition: all 0.2s}
.go-top::before {display: block; padding-top: 0.8rem; font-size: 1rem; content: '△';}
.go-top:hover::before,
.go-top:focus::before,
.go-top:active::before {content: '▲';}

/* 5개특구 */
.innopolis #snavigation {margin-bottom: 0;}
.innopolis #snavigation::before {height: 100%; background: none #25408f;}
.innopolis #snavigation .hidden {overflow: visible; position: relative; height: 7.5rem; padding-top: 2rem; font-size: 1.75rem; color: #fff; line-height: 1.2;}
.innopolis #snavigation .hidden::before {position: absolute; left: 50%; top: 0; z-index: -1; width: 1000%; height: 100%; margin-left: -500%; background:url('../../images/common/innopolis/innopolis1.jpg') no-repeat center 0 #0a0b17; content:'';}
.innopolis #snavigation .hidden span {display: block; font-size: 1rem; font-weight: 400;}
.innopolis #snavigation .hidden span strong {font-weight: 700;}
.innopolis #snavigation ul {display: table; width: 100%; height: 3.5rem; line-height: 3.5rem; table-layout: fixed;}
.innopolis #snavigation ul::before {display: none;}
.innopolis #snavigation li {display: table-cell; margin: 0;}
.innopolis #snavigation li:first-child::before {display: none;}
.innopolis #snavigation li + li {border-left: 1px solid rgba(255, 255, 255, 0.2);}
.innopolis #snavigation a {height: auto !important; font-size: 1rem; color: #fff; line-height: inherit !important;}
.innopolis #snavigation .on a {height: auto !important; border: 0 none; background-color: #fff; color: #25408f; line-height: inherit !important;}
.innopolis #snavigation + #contents .tabmenu:first-child > ul:first-child {margin-top: -1.5rem;}
.innopolis .tabmenu .type1 .active {border-color: #25408f;}
.innopolis div.link {overflow: hidden; position: fixed; right: 0; top: 50%; width: 4.75rem; box-shadow: -1px -1px 2px rgba(0, 0, 0, 0.1); border-radius: 0.25rem 0 0 0.25rem; border: 1px solid #26292f; border-right: 0; background-color: #282f3d; font-size: 0.7rem; color: #fff; text-align: center; transform: translateY(-50%);}
.innopolis div.link li a {display: block; padding: 0.7rem 0.25rem; border-bottom: 1px solid #26292f; background-color: #384050; line-height: 1.3;}
.innopolis div.link li span {display: block; margin-top: 0.25rem;}
.innopolis div.link .go-top {display: block; position: static; top: 0; bottom: 0; width: 100%; height: auto; border-radius: 0; margin: 0; padding: 0.4rem 0 0.5rem;}
.innopolis div.link .go-top::before {margin-bottom: 0.1rem; padding-top: 0; font-size: 10px; content: '▲';}

/* 20191119 */
.innopolis .cont-control {display: none;}
.innopolis .page-location {z-index: 1;}
.innopolis .page-location::before {position: absolute; left: 50%; top: 0; z-index: -1; width: 1000%; height: 2.6rem; margin-left: -500%; background: linear-gradient(to right, #3a64b3 45%, #464da2 55%); content: '';}

/* 광주특구 */
.innopolis2 #snavigation::before {background: none #386b86;}
.innopolis2 #snavigation .hidden::before {background:url('../../images/common/innopolis/innopolis2.jpg') no-repeat center 0 #0a0b17;}
.innopolis2 #snavigation .on a,
.innopolis2 .tabmenu .type4 .active a {color: #386b86;}
.innopolis2 .tabmenu .type4 a::after {background-color: #386b86;}
.innopolis2 .tabmenu .type1 .active {border-color: #386b86;}
.innopolis2 .point4 {color: #386b86 !important;}

/* 대구특구 */
.innopolis3 #snavigation::before {background: none #3b3686;}
.innopolis3 #snavigation .hidden::before {background:url('../../images/common/innopolis/innopolis3.jpg') no-repeat center 0 #0a0b17;}
.innopolis3 #snavigation .on a,
.innopolis3 .tabmenu .type4 .active a {color: #3b3686;}
.innopolis3 .tabmenu .type4 a::after {background-color: #3b3686;}
.innopolis3 .tabmenu .type1 .active {border-color: #3b3686;}
.innopolis3 .point4 {color: #3b3686 !important;}

/* 부산특구 */
.innopolis4 #snavigation::before {background: none #7a3281;}
.innopolis4 #snavigation .hidden::before {background:url('../../images/common/innopolis/innopolis4.jpg') no-repeat center 0 #0a0b17;}
.innopolis4 #snavigation .on a,
.innopolis4 .tabmenu .type4 .active a {color: #7a3281;}
.innopolis4 .tabmenu .type4 a::after {background-color: #7a3281;}
.innopolis4 .tabmenu .type1 .active {border-color: #7a3281;}
.innopolis4 .point4 {color: #7a3281 !important;}

/* 전북특구 */
.innopolis5 #snavigation::before {background: none #294e7f;}
.innopolis5 #snavigation .hidden::before {background:url('../../images/common/innopolis/innopolis5.jpg') no-repeat center 0 #0a0b17;}
.innopolis5 #snavigation .on a,
.innopolis5 .tabmenu .type4 .active a {color: #294e7f;}
.innopolis5 .tabmenu .type4 a::after {background-color: #294e7f;}
.innopolis5 .tabmenu .type1 .active {border-color: #294e7f;}
.innopolis5 .point4 {color: #294e7f !important;}

/* 국제과학비즈니스벨트 */
.innopolis6 #snavigation::before {background: none #4f683f;}
.innopolis6 #snavigation .hidden::before {background:url('../../images/common/innopolis/innopolis6.jpg') no-repeat center 0 #3b2e14;}
.innopolis6 #snavigation .on a,
.innopolis6 .tabmenu .type4 .active a {color: #4f683f;}
.innopolis6 .tabmenu .type4 a::after,
.innopolis6 .list21 p::before,
.innopolis6 div.org .label.type6,
.innopolis6 .floor .active span::after {background-color: #4f683f;}
.innopolis6 div.org .label.type6,
.innopolis6 .list21,
.innopolis6 .tabmenu .type1 .active,
.innopolis6 .list21 .btn-s.btn2:hover, 
.innopolis6 .list21 .btn-s.btn2:focus, 
.innopolis6 .list21 .btn-s.btn2:active {border-color: #4f683f;}
.innopolis6 .list21 .btn-s.btn2:hover, 
.innopolis6 .list21 .btn-s.btn2:focus, 
.innopolis6 .list21 .btn-s.btn2:active,
.innopolis6 .list21 .btn-s.btn2 i,
.innopolis6 .point4,
.innopolis6 .plotplan .label strong span {color: #4f683f !important;}
.innopolis6 .floor .group .img {padding-top: 0;}
.innopolis6 .floor .group.img {background-color: #f8f7f7;}

/* 특구소개 */
.innopolis7 #snavigation::before {background: none #338fe6;}
.innopolis7 #snavigation .hidden::before {background:url('../../images/common/innopolis/innopolis7.jpg') no-repeat center 0 #000;}
.innopolis7 #snavigation .on a,
.innopolis7 .tabmenu .type4 .active a {color: #338fe6;}
.innopolis7 .tabmenu .type4 a::after {background-color: #338fe6;}
.innopolis7 .tabmenu .type1 .active {border-color: #338fe6;}
.innopolis7 .point4 {color: #338fe6 !important;}

/* 강소특구 */
.innopolis8 #snavigation::before {background: none #3279c8;}
.innopolis8 #snavigation .hidden::before {background:url('../../images/common/innopolis/innopolis8.jpg') no-repeat center 0 #000;}
.innopolis8 #snavigation .on a,
.innopolis8 .tabmenu .type4 .active a {color: #3279c8;}
.innopolis8 .tabmenu .type4 a::after {background-color: #3279c8;}
.innopolis8 .tabmenu .type1 .active {border-color: #3279c8;}
.innopolis8 .point4 {color: #3279c8 !important;}
.innopolis8 .list6 .group .bul4 > li strong.point5:first-child + span {padding-left: 8.5rem;}

/* 혁신계획 */
.new-innovation .arrow::before {
	position: absolute;
	left: 0;
	top: -4.5rem;
	z-index: -1;
	width: 100%;
	height: 8.5rem;
	background: url(../../images/common/contents/visual_arr.png) no-repeat center 0;
	background-size: 18rem auto;
	content: '';
}
.new-innovation .group::before {
  transform: rotate(0);
}
.new-innovation .type-inno {
	border-color: #354870;
	border-width: 1px;
	background: #fff;
	margin-bottom: 5rem;
}
.new-innovation .type-inno .title {
	line-height: 5rem;
}
.new-innovation .item.type2 {
	margin-bottom: 4.8rem;
}
.new-innovation .roadmap::before {
	position: absolute;
	left: 0;
	top: -4.5rem;
	z-index: -1;
	width: 100%;
	height: 8.5rem;
	background: url(../../images/common/contents/visual_arr.png) no-repeat center 0;
	background-size: 18rem auto;
	content: '';
}
.new-innovation .roadmap {
	position: relative;
	border: 1px solid #ddd;
	padding: 3.7rem 1rem;
	background: #fff;
	text-align: center;
	margin-bottom: 6rem;
}
.new-innovation .roadmap > .title {
	display: inline-block;
	width: 21.5rem;
	color: #fff;
	font-size: 1.5rem;
	background: #284780;
	border-radius: 3rem;
	padding: 1.75rem 1rem;
	border: 6px solid #f1f1f1;
	margin-bottom: 1.5rem;
}
.new-innovation .roadmap .list-wrap {
	max-width: 44.8rem;
	margin: auto;
}
.new-innovation .roadmap .list-wrap .list::before{
	display: inline-block;
	width: 32.9rem;
	height: 8.65rem;
	background: url("../../images/common/contents/new-innovation-roadmap-line.png") no-repeat center center/cover;	
	content: "";
}
.new-innovation .roadmap .list {
	position: relative;
	margin: 0 -2.1rem;
}
.new-innovation .roadmap .list::after {
	display: block;
	clear: both;
	content: "";
}
.new-innovation .roadmap .list > li {
	float: left;
	width: 33.333%;
	padding: 0 2.1rem;
}
.new-innovation .roadmap .list li > .inner > .title::before {
	position: absolute;
	width: 80%;
	height: 80%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	border: 6px solid #f1f1f1;
	border-radius: 50%;
	background: #fff;
	content: "";
	z-index: -1;
} 
.new-innovation .roadmap .list > li > .inner > .title {
	display: block;
	position: relative;
	width: 12.1rem;
	height: 12.1rem;
	color: #fff;
	font-size: 1.1rem;
	border-radius: 50%;
	border: 6px solid #f1f1f1;
	background: #fff;
	padding: 4.2rem 2rem;
	z-index: 1;
  margin-bottom: 1rem;
  line-height: 1.5rem;
}
.new-innovation .roadmap .list li:nth-child(1) > .inner > .title::before {
	background: #78808d;
}
.new-innovation .roadmap .list li:nth-child(2) > .inner > .title::before {
	background: #456cb7;
}
.new-innovation .roadmap .list li:nth-child(3) > .inner > .title::before {
	background: #4cbee7;
}
.new-innovation .roadmap .list li ul {
	padding-left: 1rem;
}
.new-innovation .roadmap .list li ul li {
	position: relative;
	font-size: 0.8rem;
	text-align: left;
	padding-left: 0.5rem;
}
.new-innovation .roadmap .list li ul li::before {
	position: absolute;
	top: auto;
	left: 0;
	content: "·";
}
.new-innovation .roadmap .list li > .inner > .title::after {
	position: absolute;
	width: 2.4rem;
	height: 2.4rem;
	top: -1.5rem;
	left: 50%;
	transform: translate(-50%);
	border-radius: 50%;
	border: 12px solid #fff;
	background: #78808d;
	content: "";
}
.new-innovation .roadmap .list li:nth-child(2) > .inner > .title::after {
	background: #456cb7;
}
.new-innovation .roadmap .list li:nth-child(3) > .inner > .title::after {
	background: #4cbee7;
}
.new-innovation > .item .txt {
	padding-right: 1.5rem;
}
.new-innovation .table-wrap.datatable thead th,
.new-innovation .table-wrap.datatable td,
.new-innovation .table-wrap.datatable thead + tbody th {
	font-size: 0.9rem;
	padding: 0.5rem 1rem;
}
.new-innovation .number-font {
	font-family: 'Titillium Web';
}