@charset "UTF-8";

/*-------------------------------------------------
	title 		: New Sub Human CSS
	Author 		: (주)지플러스
	Create date : 2024-08
-------------------------------------------------*/

.cmm-text-overflow {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


/* ============= Common - Header Sub (Override) */
#header.sub .menu > li {
	padding: 3rem 5rem;
}

/* ============= Common - Margin */
.mgb0 {
	margin-bottom: 0 !important;
}

.mgt10 {
	margin-top: 1rem !important;
}

.mgl10 {
	margin-left: 1rem !important;
}

.txt-center {
	text-align: center !important;
}

/* ============= Common - Title2 info */
.title2-info {
	margin-bottom: .8rem;
	font-size: 1.4rem;
	font-weight: 400;
	color: #666666;
}

.title2-info > strong {
	font-weight: 400;
	color: #002AC1;
}

/* ============= Common - Button Center Align */
.btn-center-area {
	display: flex;
	align-items: center;
	justify-content: center;
}

.btn.type-vf {
	height: 4.4rem;
	border-color: #666666;
}

.btn.type-vf:hover,
.btn.type-vf:focus {
	background-color: #666666;
	color: #FFFFFF;
}

/* ============= Common - Title 05 */
.cmm-flex-title {
	display: flex;
	align-items: center;
}

.cmm-flex-title .left {
	margin-right: auto;
}

.cmm-flex-title .right {
	margin-left: auto;
}

.cmm-flex-title .title {
	font-size: 2.4rem;
	font-weight: 600;
	color: #111111;
}

.tit05 {
	font-size: 1.8rem;
	font-weight: 400;
	color: #333333;
}

/* ============= Common - Checkbox + label */
.cmm-check-label {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: .8rem;
}

.cmm-check-label input[type="checkbox"] {
	width: 2rem;
	min-width: 2rem;
	height: 2rem;
	border-color: #D5DAE2;
}

.cmm-check-label input[type="radio"] {
	width: 2.2rem;
	height: 2.2rem;
}

.cmm-check-label label {
	min-width: 5rem;
	font-size: 1.6rem;
	font-weight: 400;
	color: #555555;
}

.cmm-check-label .link {
	font-size: 1.6rem;
	color: #2670E5;
}

.cmm-check-label .link:hover,
.cmm-check-label .link:focus {
	text-decoration: underline;
}

.cmm-check-label + .cmm-check-label {
	margin-left: 1rem;
}

.cmm-check-label .textbox {
	height: 3rem;
	margin-left: 3rem;
}

.form_area > li .cmm-check-label .cmm-calendar input[type='text'] {
	width: 15rem;
}


/* ============= Common - Input textbox + Plus button */
.cmm-input-adds {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.cmm-input-adds .btn_circle {
	width: 3.2rem;
	height: 3.2rem;
	background-color: #FFFFFF;
	border: 1px solid #D5DAE2;
	border-radius: 50%;
	text-align: center;
}

.form_area > li .cmm-input-adds input[type='text'] {
	width: calc(100% - 4.2rem);
}

.cmm-calendar {
	padding: 0 1rem;
	border: 1px solid #DDDDDD;
	border-radius: 4px;
}

.cmm-calendar > input[type='text'],
.form_area .cmm-calendar > input[type='text'] {
	display: inline-block;
	width: 15rem;
	height: 3rem;
	padding: .6rem 0;
	border: 0;
}

.cmm-calendar > .btn_calendar,
.form_area .cmm-calendar > .btn_calendar {
	height: 3rem;
}

/* ============= Common - Text box */
.textbox.path {
	background-color: #F2F3F7;
	border-color: #D5DAE2;
	cursor: pointer;
}

.cmm-form {
	position: relative;
	margin: 0 auto;
}

.cmm-form.mxw-90 {
	max-width: 90rem;
}

.cmm-form .form-item {
	padding: 2.8rem;
	background-color: #FFFFFF;
	border: 1px solid #D8D9DF;
	border-radius: 10px;
}

.cmm-form .form-item .form-item-tit {
	margin-bottom: 2.4rem;
	font-size: 2.2rem;
	font-weight: 600;
	color: #111111;
}


.cmm-strain-area {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
}

/* ============= Common - 유동 레이아웃 */
.cmm-strain-area > div {
	width: 100%;
}

.cmm-strain-area > div.show {
	width: calc(70% - 1rem);
}

.cmm-strain-area > div.show + div {
	width: 30%;
}

/* ============= Common - Bootstrap 5 */
.bs-d-flex {
	display: flex !important;
}

.bs-align-items-center {
	align-items: center !important;
}

.bs-text-point {
	color: #155CD6;
}

.bs-d-block {
	display: block !important;
}

/* ============= Intro */
.intro_bx .new_box {
	right: 16rem;
}

.new_box .circle {
	width: 31rem;
	height: 31rem;
	opacity: .93;
	background-image: linear-gradient(360deg, #00C193 0%, #6E5DEA 100%);
	text-shadow: 0 0 7px rgba(0, 0, 0, .25);
	font-weight: 500;
}

.new_box .circle::before,
.new_box .circle::after {
	display: none;
}

img[class^="circle-bg-"] {
	position: absolute;
	z-index: -1;
}

.circle-bg-top {
	top: -50%;
	animation: circleBgShowTop 1s .2s;
}

.circle-bg-right {
	top: 50%;
	right: -50%;
	transform: translate(0, -50%);
	animation: circleBgShowRight 1s .25s;
}

.circle-bg-bottom {
	bottom: -50%;
	animation: circleBgShowBottom 1s .3s;
}

.circle-bg-left {
	top: 50%;
	left: -50%;
	transform: translate(0, -50%);
	animation: circleBgShowLeft 1s .35s;
}

/* ============= 자료실 */
.wbox .box-item .tit {
	margin-bottom: 2.4rem;
	font-size: 2.4rem;
	font-weight: 600;
	color: #111111;
}

.tstyle_table td .btn-download {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	padding: .75rem 3rem;
	background-color: #FFFFFF;
	border: 1px solid #CCCCCC;
	border-radius: 8px;
	font-size: 1.6rem;
	font-weight: 500;
	color: #333333;
	text-decoration: none;
	transition: .3s;
}

.tstyle_table td .btn-download:hover,
.tstyle_table td .btn-download:focus {
	border-color: #333333;
}

/* ============= Box item title */
.box-item .box-item-tit {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	margin-bottom: .8rem;
	font-size: 1.6rem;
	font-weight: 400;
	color: #333333;
}

.box-item .box-item-tit.essential::after {
	content: ' *';
	color: #002AC1;
}

.box-item .search-input-area input[type="text"] {
	height: auto;
	padding: .7rem 1.6rem;
	border-radius: 4px;
	border-color: #D5DAE2;
}

.box-item .box-item-info {
	margin: 2rem 0 3rem;
	padding: 1.5rem 3rem;
	background-color: #F5F6F9;
	border-radius: 10px;
}

.box-item .box-item-info .dtxt {
	font-size: 1.6rem;
	font-weight: 400;
	color: #666666;
}

.box-item .box-item-info .dtxt:first-child {
	margin-top: 0;
}

.box-item .box-item-info .dtxt b {
	color: #000000;
}

.box-item .box-item-info .dtxt .importance {
	font-weight: 700;
	color: #DB1457;
}

/* ============= Gray box */
.new-gray-box {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 2.4rem 0;
	padding: 2.8rem 4rem;
	border-radius: 8px;
	overflow: hidden;
	background-color: #F5F6F9;
}

.new-gray-box .new-tit {
	font-size: 1.8rem;
	font-weight: 500;
	color: #333333;
}

/* ============= 연구 등록 - 기본 정보 */
.accordian-list-btn {
	position: relative;
	display: block;
	width: 100%;
	height: 4.8rem;
	padding: 1.4rem 1.6rem;
	background-color: #FFFFFF;
	border: 1px solid #D5DAE2;
	border-radius: 4px;
	text-align: left;
	cursor: pointer;
	line-height: 1.8rem;
}

.accordian-list-btn::after {
	position: absolute;
	content: '\EA4E';
	top: 50%;
	right: 1.6rem;
	transform: translateY(-50%) rotate(0);
	font-family: 'remixicon';
	font-size: 2rem;
	color: #333333;
	transition: .3s;
}

.accordian-list-btn.on {
	border-radius: 4px 4px 0 0;
}

.accordian-list-btn.on::after {
	transform: translateY(-50%) rotate(180deg);
}

.accordian-list {
	height: 0;
	opacity: 0;
	visibility: hidden;
	border-left: 1px solid #DDDDDD;
	border-right: 1px solid #DDDDDD;
	border-bottom: 1px solid #DDDDDD;
	border-radius: 0 0 4px 4px;
	transition: .3s;
}

.accordian-list-btn.on + .accordian-list {
	height: auto;
	padding: 1.6rem;
	opacity: 1;
	visibility: visible;
}

.accordian-list > div .cmm-check-label {
	display: flex;
}

.accordian-list > div + div {
 	margin-top: 1rem;
}

.form_area > li .cmm-check-label input[type='text'] {
	width: auto;
	height: 3rem;
}

.icd-input-list > li {
	align-items: center;
	gap: .8rem;
}

.icd-input-list > li .textbox {
	max-width: 40rem;
}

/* ============= Pop-up */
.popup_wrap .pop_inner {
	position: relative;
}

.pop-search-wrap {
	margin: 2rem 0;
}

.pop-search-wrap > input[type='text'] {
	width: 100%;
	max-width: calc(100% - 8.7rem);
	border-radius: 4px;
}

.pop-search-wrap > .btn {
	height: 4rem;
}

.pop-search-wrap > .btn i {
	margin-right: .5rem;
}

.pop-title-btn {
	position: relative;
	display: flex;
	align-items: center;
	padding-right: 4rem;
}

.pop-title-btn > .btn {
	margin-left: auto;
}

.alert .title .warning {
	font-size: 2rem;
}

.alert .title .warning::before {
	top: 0;
	font-size: 2.7rem;
}

.total-count-box {
	position: relative;
	padding: 1rem 2rem;
	background-color: #F8F9FA;
	border: 1px solid #DDDDDD;
	border-radius: 10px;
}

.total-count-box .total,
.total-count-box .current {
	display: inline-block;
	vertical-align: middle;
}

.total-count-box .total {
	margin-right: 1rem;
}

.total-count-box .total b {
	margin-left: .5rem;
	color: #155CD6;
}

.total-count-box .current {
	font-size: 1.4rem;
}

.total-count-box .current span {
	color: #666666;
}

/* =============  */
.personal-info-form { position: relative; margin: 0 auto; }
.personal-info-form .accordian .accordian-item {
	position: relative;
	margin-top: 3rem;
	padding: 0 2.8rem 2.3rem;
	background-color: #FFFFFF;
	border: 1px solid #D8D9DF;
	border-radius: 10px;
}

.personal-info-form .accordian .item-title {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	height: 6.4rem;
	font-size: 2rem;
	font-weight: 700;
	text-align: left;
	letter-spacing: -.02rem;
}

.personal-info-form .accordian .item-title::after {
	position: absolute;
	content: '\EA78';
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	display: inline-block;
	vertical-align: middle;
	font-family: 'remixicon';
	font-size: 2.4rem;
	font-weight: 400;
	transition: .2s;
}

.personal-info-form .accordian .item-title .num {
	display: inline-block;
	vertical-align: middle;
	width: 2.4rem;
	height: 2.4rem;
	margin-right: 1rem;
	border: 1px solid #333333;
	border-radius: 100%;
	font-size: 1.4rem;
	font-weight: 600;
	text-align: center;
	letter-spacing: -.014rem;
	line-height: 2.3rem;
}

.personal-info-form .accordian .item-hidden-group {
	padding: 2.3rem 0;
	border-top: 1px solid #D8D9DF;
}

.personal-info-form .accordian .btn-align.right {
	padding-bottom: 2rem;
}

.form-data-list .data-list-item {
	display: flex;
}

.form-data-list .data-list-item.center {
	align-items: center;
}

.form-data-list .data-list-item + .data-list-item {
	margin-top: 2rem;
}

.form-data-list .data-list-item .list-item-label {
	position: relative;
	min-width: 25rem;
	font-size: 1.6rem;
	font-weight: 400;
	color: #111111;
	word-break: keep-all;
}

.form-data-list .data-list-item .essential label:not(:has(span.point1))::after {
	content: ' *';
	color: #155CD6;
}

.form-data-list .data-list-item .info-btn {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	font-size: 1.7rem;
	color: #A0AEC9;
}

.info-btn .hidden-desc {
	position: absolute;
	left: 0;
	bottom: -100%;
	width: 0;
	background-color: #FFFFFF;
	border: 1px solid #EEEEEE;
	border-radius: 3px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .1);
	font-size: 1.2rem;
	font-weight: 400;
	color: #333333;
	opacity: 1;
	visibility: hidden;
	z-index: 2;
}

.info-btn:hover .hidden-desc,
.info-btn:focus .hidden-desc {
	width: 100%;
	min-width: 18rem;
	max-width: 45rem;
	padding: .8rem;
	visibility: visible;
	word-break: keep-all;
}

.form-data-list .data-list-item input[type="text"] {
	width: 100%;
	border-radius: 5px;
	font-size: 1.5rem;
}

.form-data-list .data-list-item select {
	width: 100%;
	max-width: 30rem;
	padding-right: 3.5rem;
	border-radius: 5px;
	background: url("./../../image/service/layout/arrow.png") no-repeat bottom 50% right 1rem / 1.4rem;
	background-color: #FFFFFF;
	font-size: 1.5rem;
}

.form-depth-box {
	width: 100%;
	padding: 2rem;
	background-color: #F7F8FA;
	border: 1px solid #E1E1E1;
	border-radius: 5px;
}

.form-depth-box .list-item-label label {
	display: block;
	margin-bottom: .6rem;
	font-size: 1.4rem;
	font-weight: 400;
	color: #555555;
}

.form-depth-box .depth-box-item + .depth-box-item {
	margin-top: 1.2rem;
} 

.input-wrap {
	display: flex;
}

.form-data-list .data-list-item .input-wrap {
	width: 100%;
}

.form-data-list .data-list-item .input-wrap.flex-wrap {
	flex-wrap: wrap;
}

.form-data-list .data-list-item .input-wrap .btn + input[type="text"] {
	width: calc(100% - 6.7rem);
}

.form-data-list .data-list-item .input-wrap .btn,
.form-data-list .data-list-item .input-wrap .desc {
	order: 2;
}

.form-data-list .data-list-item .desc {
	margin-top: 1rem;
	font-size: 1.5rem;
	color: #767676;
	line-height: 1.5;
	letter-spacing: -.01rem;
}

.form-data-list .data-list-item .desc a {
	color: #155CD6;
	text-decoration: underline;
}

.form-title-btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.accordian-item .form-title-btn {
	margin-bottom: 2rem;
}

.accordian-item .form-title-btn strong {
	font-size: 1.5rem;
	color: #155CD6;
}

.accordian-item .btn {
	display: inline-flex;
	align-items: center;
	margin-left: .5rem;
	padding: .6rem 1.3rem;
	font-size: 1.5rem;
}

.append-input {
	position: relative;
	display: flex;
	align-items: center;
}

.append-input em.error {
	position: absolute;
	top: 100%;
}

.append-input + .append-input {
	margin-top: 2rem;
}

.append-input input[type="text"] {
	width: calc(100% - 3.6rem) !important;
}

.append-input button {
	display: inline-block;
	vertical-align: middle;
	width: 2.8rem;
	height: 2.8rem;
	margin-left: .8rem;
	background-color: #FFFFFF;
	border: 1px solid #D8D9DF;
	border-radius: 50%;
	text-align: center;
	line-height: 2.6rem;
}

.append-input.items-start {
	align-items: start;
}

.append-input.full-input input[type="text"] {
	width: 100% !important;
}

.nomean {
	width: 100%;
}

.accordian-item .accordian-list-btn {
	height: 4rem;
	line-height: 1.2rem;
}

.submit-form .accordian .list {
	padding: 1.3rem 0;
}

.submit-form .accordian .list > li + li {
	margin-top: 1.6rem;
}

.submit-form input[type="radio"] + label {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	padding-left: 2.5rem;
	font-size: 1.6rem;
	line-height: 1.9rem;
	letter-spacing: -.032rem;
}

.submit-form input[type="radio"] + label::before {
	position: absolute;
	content: '';
	top: 0;
	left: 0;
	display: block;
	width: 1.8rem;
	height: 1.8rem;
	border: 1px solid #B6B6B6;
	border-radius: 100%;
}

.submit-form input[type="radio"]:checked + label::before {
	border-width: 6px;
	border-color: #155CD6;
}

.agree-box .item {
	overflow: hidden;
	margin: 2rem 0 1rem;
	padding: 3rem 3rem 0;
	background-color: #E9EEF7;
	border: 1px solid #E1E1E1;
	border-radius: 6px;
}

.agree-box .item::after {
	content: '';
	display: block;
	width: 100%;
	height: 3rem;
}

.agree-box .item p {
	font-size: 1.5rem;
	color: #555555;
}

/* ============= K-BDS Class */
.mdLst2box {
	position: relative;
	overflow: hidden;
	padding: 2.9rem;
	border: 1px solid #E1E1E1;
	border-radius: 5px;
}

.mdLst2box::after {
	content: '';
	display: table;
	clear: both;
}

.mdLst2box P {
	padding-right: 20rem;
	font-size: 2rem;
	font-weight: 700;
	color: #111111;
	word-break: break-all;
	line-height: 2.9rem;
	letter-spacing: -.18px;
}

.sub-badge {
	position: relative;
	padding: .4rem .6rem .3rem;
	background-color: #E7EFFB;
	border-radius: 4px;
	font-size: 1.3rem;
	font-weight: 500;
}

.mdLst2box .information {
	margin-top: 1.4rem;
	margin-bottom: 0;
}

.information {
	overflow: hidden;
	margin-bottom: 0;
}

.information > li {
	position: relative;
	float: left;
	padding-right: 1.8rem;
	font-size: 1.5rem;
	line-height: 1.8rem;
	letter-spacing: -.15px;
}

.information > li:not(:last-child)::after {
	position: absolute;
	content: '';
	top: .8rem;
	right: 1.2rem;
	width: 3px;
	height: 3px;
	background-color: #DDDDDD;
}

.information > li > span {
	color: #555555;
}

.information > li > span::before {
	position: relative;
	content: '';
	display: inline-block;
	vertical-align: middle;
	top: -1px;
	width :1px;
	height: 1rem;
	margin: 0 .5rem 0 .2rem;
	background-color: #E1E1E1;
}

.tstyle_table .check {
	width: 1.6rem;
	height: 1.6rem;
}

.board_info {
	overflow: hidden;
}

.board_info .page {
	float: left;
	padding-top: .7rem;
}

.board_info .page span {
	display: inline-block;
	vertical-align: top;
	color: #666666;
}

.board_info .page span + span::before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	width: 1px;
	height: 1.5rem;
	margin: 0 1rem;
	background-color: #DDDDDD;
}

.board_info .page strong, 
.board_info .page b {
	font-weight: 500;
	color: #000000;
}

.form_check {
	position: relative;
	display: flex;
	align-items: center;
	max-width: 100%;
	padding-left: 2.5rem;
	z-index: 0;
	color: #333333;
}

.form_check:last-child {
	margin-right: 0;
}

.form_check input {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}

.form_check input:checked + label::after {
	transform: scaleX(1) translateY(-50%);
	width: 1.6rem;
	height: 1.6rem;
	opacity: 1;
	background-color: #437CDE;
	border: none;
	line-height: 1.6rem;
	color: #FFFFFF;
}

.form_check label {
	display: inline-block;
	overflow: hidden;
	word-break: break-all;
	white-space: nowrap;
	text-overflow: ellipsis;
	cursor: pointer;
}

.form_check label::before {
	position: absolute;
	content: '';
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 1.6rem;
	height: 1.6rem;
	background-color: #FFFFFF;
	border: 1px solid #B6B6B6;
	border-radius: 0;
	z-index: -2;
}

.filter-chk-box > li label {
	max-width: calc(100% - 3.8rem);
	font-size: 1.5rem;
	line-height: 2.2rem;
}

.form_check .num {
	position: absolute;
	top: 0;
	right: 0;
	font-size: 1.2rem;
	color: #767676;
}

.form_radio input {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}

.form_radio label {
	cursor: pointer;
}

.form_radio_list {
	position: absolute;
	top: 100%;
	right: 0;
	width: auto;
	height: 0;
	padding: 0 1.5rem;
	overflow: hidden;
	opacity: 0;
	background-color: #FFFFFF;
	border: 1px solid #AAAAAA;
	z-index: 2;
	transition: .2s;
}

.form_radio_list.on {
	height: auto;
	padding: .5rem 1.5rem;
	overflow: visible;
	opacity: 1;
}

.form_radio_list li {
	display: block;
}

.form_radio_list li .form_radio {
	padding-left: 0;
	font-size: 1.4rem;
	font-weight: 400;
	color: #555555;
}

.form-tw-area > li {
	display: inline-block;
	width: calc(50% - 1rem);
}

.form-tw-area > li + li {
	margin-left: 1.5rem;
}

/* ============= Override */
.form_li.new > li .txt span {
	font-size: 1.8rem;
	font-weight: 500;
	color: #333333;
}

.form_li.new > li .txt span + span {
	font-size: 1.6rem;
	font-weight: 400;
	color: #666666;
}

.depth_tabs ul > li .active {
	background-color: #0F4DA9;
}

.depth_tabs ul > li > a {
	border-radius: 15px 15px 0 0;
}

.depth_tabs ul > li + li {
	margin-left: .5rem;
}

.desc_box p {
	max-width: calc(100% - 19.4rem);
	word-break: auto-phrase;
	color: #333333;
}

.btn-align {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.btn-align.right {
	justify-content: flex-end;
}

.textarea {
	position: relative;
	vertical-align: top;
	width: 100%;
	min-height: 10rem;
	padding: 1.2rem;
	background-color: #FFFFFF;
	border: 1px solid #D8D9DF;
	border-radius: 5px;
	font-size: 1.5rem;
	color: #555555;
}

.metadata-box {
	font-size: 1.6rem;
	font-weight: 400;
	word-break: keep-all;
	color: #111111;
}

.metadata-box .box-info-area {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1rem;
}

.file-area {
	display: flex;
	align-items: center;
}

.file-area label {
	display: inline-block;
	vertical-align: middle;
	min-width: 15rem;
	padding: 1rem 1.5rem;
	background-color: #222222;
	border-radius: 5px;
	font-size: 1.5rem;
	font-weight: 300;
	color: #FFFFFF;
	line-height: 1.8rem;
	cursor: pointer;
	text-align: center;
}

.file-area label i {
	margin-right: .5rem;
}

.file-area .file {
	flex: 1;
	position: rleative;
	display: inline-block;
	vertical-align: middle;
	margin-left: .5rem;
	margin-right: 0;
}

.file-area .file .text {
	display: block;
	width: 100%;
	min-height: 4rem;
	padding: .9rem 3rem .6rem 1.2rem;
	border: 1px solid #D8D9DF;
	border-radius: 5px;
	font-size: 1.5rem;
	color: #555555;
	line-height: 1.5;
}

.data-box-spread {
	position: relative;
	margin-top: 4rem;
	padding: 3.1rem 2.8rem 2.8rem;
	background-color: #FFFFFF;
	border: 1px solid #D8D9DF;
	border-radius: 10px;
}

.data-box-spread .btn {
	padding: .6rem 1.3rem;
	font-size: 1.5rem;
}

.data-box-spread .btn i {
	margin-right: .5rem;
}

.data-box-spread .excel_area {
	width: 100%;
	min-height: 30rem;
	margin-top: 2rem;
}

.new-radio-box {
	margin: 0;
}

.new-radio-box > .form_radio {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	width: calc(50% - .2rem);
}

.new-radio-box .form_radio input[type="radio"] {
	appearance: none;
	top: .25rem;
	width: 2rem;
	height: 2rem;
	opacity: 1;
	margin-right: .5rem;
	background-color: #FFFFFF;
	border: 1px solid #D5DAE2;
	border-radius: 50%;
}

.new-radio-box .form_radio input[type="radio"]:checked {
	border: 5px solid #2670E5;
}

.new-radio-box .form_radio input[type="radio"] + label {
	padding-left: 3rem;
	font-size: 1.6rem;
	color: #333333;
	line-height: 1.25;
}

.table-ellipsis {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.form-selbox {
	width: 100%;
	max-width: 30rem;
	padding-right: 3.5rem;
	background: url("../../image/khbdb/content/arrow.png") no-repeat bottom 50% right 1rem / 1.4rem;
	background-color: #FFFFFF;
	border-radius: 5px;
}

.form_area > li .form-selbox {
	display: block;
	max-width: none;
}

.filter-box .pop-search-wrap > input[type='text'] {
	max-width: calc(100% - 9.2rem);
}

.filter-box .desc18 {
	line-height: inherit;
}

.form_area.type3 > li {
	display: inline-block;
	width: calc(50% - 1.2rem);
}

.form_area.type3 > li:nth-child(2n) {
	margin-left: 1.9rem;
}

.my_info .btn_round {
	width: calc(50% - .35rem);
}

.board_top.new {
	display: flex;
	align-items: center;
	justify-content: space-between;
	overflow: inherit;
}

.btn_download.all {
	border-color: #002AC1;
	color: #002AC1;
}

/* ============= 활용 신청 */
.data-new-filter .filter-tit {
	margin-bottom: 1rem;
	font-size: 1.8rem;
	font-weight: 500;
}

.data-new-filter .filter-chk-list.fixed { height: 15rem; padding: 0 1rem 0 0; overflow: hidden auto; }
.data-new-filter .filter-chk-list.fixed .form_check label { max-width: calc(100% - 2rem); }

.data-new-filter .filter-chk-list.fixed::-webkit-scrollbar { 
	width: .5rem;
	height: 5px;
	background: #DDDDDD;
	border-radius: 2px;
}

.data-new-filter .filter-chk-list.fixed::-webkit-scrollbar-thumb { background-color: #aaaaaa; }


.filter-chk-list > li {
	margin-top: .5rem;
}

.data-new-filter .form_check {
	color: #666666;
}

.data-new-filter .filter-more-wrap {
	margin: 1.4rem 0 0;
	text-align: center;
}

.filter-more-wrap .btn-filter-more {
	display: block;
	width: 100%;
	max-width: 15.1rem;
	margin: auto;
	padding: .8rem 3rem;
	border: 1px solid #E4E7ED;
	border-radius: 50px;
	font-size: 1.4rem;
	color: #333333;
	transition: .2s;
}

.filter-more-wrap .btn-filter-more:hover,
.filter-more-wrap .btn-filter-more:focus {
	border-color: #000000;
}

.data-new-filter .active .filter-chk-list {
	overflow: visible;
	max-height: none;
}

.bx_btn > div {
	position: relative;
	display: inline-block;
	vertical-align: middle;
}

.bx_btn .radio_group .filter_btn {
	padding: .7rem 1rem;
	border: 1px solid #E4E7ED;
	border-radius: 6px;
}

.search-result-list > li + li {
	margin-top: 2rem;
}

.search-result-list .list-head {
	padding: 1.8rem 2rem;
	background-color: #FFFFFF;
	border-top: 1px solid #666666;
	border-bottom: 1px solid #E4E7ED;
}

.search-result-list .list-head strong,
.search-result-list .list-head strong > * {
	display: inline-block;
	vertical-align: middle;
	margin-left: .5rem;
	cursor: pointer;
	font-size: 2.1rem;
	font-weight: 500;
	color: #333333;
}

.search-result-list .list-head strong { max-width: calc(100% - 3rem); word-break: auto-phrase; }

.prot-info {
	position: relative;
	margin-top: 3rem;
	border-top: 1px solid #666666;
}

.prot-info .pi-title {
	padding: 1.6rem 2rem;
	border-bottom: 1px solid #E4E7ED;
	font-size: 2rem;
	font-weight: 600;
	color: #333333;
}

.prot-info .prot-info-list {
	padding: 1.8rem 2rem;
	border-bottom: 1px solid #E4E7ED;
}

.prot-info .prot-info-list > li {
	display: flex;
	align-items: center;
}

.prot-info .prot-info-list > li + li {
	margin-top: .8rem;
}

.prot-info .prot-info-list > li strong,
.prot-info .prot-info-list > li span {
	font-size: 1.5rem;
	font-weight: 400;
	color: #555555;
}

.prot-info .prot-info-list > li strong {
	min-width: 12rem;
}

/* ============= Notice */
.board-notice {
	position: relative;
	width: 100%;
	border-top: 2px solid #43464C;
	border-bottom: 1px solid #E4E7ED;
}

.board-notice__top {
	padding: 2rem 3.2rem;
	border-bottom: 1px solid #DDDDDD;
}

.board-notice__top .board-notice__title {
	font-size: 2.2rem;
	margin-bottom: 1.4rem;
	word-wrap: break-word;
	word-break: keep-all;
}

.board-notice__top .board-notice__info {
	position: relative;
	display: flex;
	font-size: 1.5rem;
	flex-wrap: wrap;
}

.board-notice__top .board-notice__info > li {
	position: relative;
	font-size: 1.5rem;
}

.board-notice__top .board-notice__info > li:not(:last-child) {
	padding-right: 2rem;
}

.board-notice__top .board-notice__info > li:not(:last-child)::after {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	right: .8rem;
	display: block;
	width: .4rem;
	height: .4rem;
	margin: auto 0;
	background-color: #c4c4c4;
}

.board-notice__top .board-notice__info > li > strong {
	margin-right: .6rem;
	font-weight: 500;
	color: #222222;
}

.board-notice__top .board-notice__info > li > span {
	color: #666666;
}

.board-notice__content {
	min-height: 10rem;
	padding: 3.2rem;
	word-wrap: break-word;
	word-break: keep-all;
}

.board-notice__content .kothing-editor-editable {
	padding: 0;
}

.board-notice__content .kothing-editor-editable * {
	font-size: 1.6rem !important;
}

.board-notice__file {
	margin-bottom: 2.2rem;
	padding: 2rem 3.2rem;
	background-color: #f6f7f7;
	border-radius: 4px;
}

.board-notice__file > p {
	font-weight: 600;
}

.board-notice__file .board-notice__file-list {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-direction: column;
	gap: 1.6rem;
	margin-top: 1rem;
}

.board-notice__file .board-notice__file-list > li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
	width: 100%;
	padding: 1.2rem 1.6rem;
	background-color: #FFFFFF;
	border: 1px solid #C6C6C6;
	border-radius: .6rem;
	color: #1D1D1D;
}

.board-notice__file .board-notice__file-list > li > .board-notice__file__title {
	font-weight: 400;
}

.board-notice__file .board-notice__file-list > li > .board-notice__file__title img {
	margin-right: .5rem;
}

.board-notice__file .board-notice__file-list > li > .board-notice__btn-wrap {
	width: auto;
	padding-left: 2.4rem;
}

.pagesize-select { height: 3.5rem; padding: .5rem 4rem .5rem 1.6rem; background: #fff url(../../image/service/layout/arrow.png) right 1rem center no-repeat; border-radius: 6px; }

/* ============= Responsive */
@media (max-width: 1080px) {
	#header.sub .menu > li {
		padding: .5rem 2.6rem;
	}
	
	.intro_bx .new_box {
		right: 3.5rem;
	}
	
	.new_box .circle {
		width: 20rem;
		height: 20rem;
		font-size: 2.5rem;
	}
}

@media (max-width: 768px) {
	/* ============= ICD CODE */
	.form_area > li .icd-input-list > li .textbox {
		margin-bottom: 0;
	}
	
	/* ============= New Introduce */
	.intro_bx .new_box {
		position: static;
		top: auto;
		right: auto;
		margin: 18rem 0 12rem;
		transform: translateY(0);
		-webkit-transform: translateY(0);
	}
	
	img[class^="circle-bg-"] {
		width: 50%;
		animation: none !important;
	}
	
	.desc_box p {
		max-width: 100%;
	}
	
	.form-data-list .data-list-item {
		flex-wrap: wrap;
	}
	
	.form-data-list .data-list-item .list-item-label {
		width: 100%;
		margin-bottom: .5rem;
	}
	
	.form-data-list .data-list-item + .data-list-item {
		margin-top: 2rem;
	}
	
	.form-data-list .data-list-item input[type="text"] {
		font-size: 1.4rem;
	}
	
	.data-box-spread .btn {
		width: calc(50% - .4rem);
		margin: 0;
		padding: .9rem;
	}
	
	/* ============= Circle (반응형 추후에 다시) */
	.circle-bg-top {
		top: auto;
		left: 50%;
		bottom: 56%;
		transform: translateX(-50%);
	}
	
	.circle-bg-right {
		top: 50%;
		right: 0;
	}
	
	.circle-bg-bottom {
		top: 60%;
		left: 50%;
		bottom: auto;
		transform: translateX(-50%);
	}
	
	.circle-bg-left {
		top: 50%;
		left: 0;
	}
	
	/* ============= K-BDS Class */
	.mdLst2box {
		padding: 25px 0;
		border: none;
		border-bottom: 1px solid #E1E1E1;
		border-radius: 0;
	}
	
	.mdLst2box p {
		padding-right: 0;
	}
	
	.filter-new .filter-chk-box {
		max-height: 13rem;
	}
	
	/* ============= Common - 유동 레이아웃 */
	.cmm-strain-area > div.show {
		width: 100%;
	}
	
	.cmm-strain-area > div.show + div {
		width: 100%;
	}
	
	.prot-info .prot-info-list > li {
		flex-wrap: wrap;
		gap: .5rem;
	}
	
	.prot-info .prot-info-list > li strong {
		width: 100%;
	}
}

@media (max-width: 530px) {
	.new-gray-box {
		flex-wrap: wrap;
	}
	
	.cmm-check-label {
		width: 100%;
	}
	
	.cmm-check-label + .cmm-check-label {
		margin-left: 0;
	}
	
	.board_top.new {
		flex-wrap: wrap;
	}
	
	.form-tw-area > li {
		width: 100%;
	}
	
	.form-tw-area > li + li {
		margin-left: 0;
	}
}

@media (min-width: 768px) {
	.box-item .box-item-tit {
		margin-bottom: 0;
		margin-right: 1rem;
	}
	
	.box-item .search-input-area {
		display: inline-block;
	}
}


/* ============= Animation */
@keyframes circleBgShowTop {
	0% {
		opacity: 0;
		transform: translateY(-60%);
	}
	
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes circleBgShowRight {
	0% {
		opacity: 0;
		transform: translate(60%, -50%);
	}
	
	100% {
		opacity: 1;
		transform: translate(0, -50%);
	}
}

@keyframes circleBgShowBottom {
	0% {
		opacity: 0;
		transform: translateY(60%);
	}
	
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes circleBgShowLeft {
	0% {
		opacity: 0;
		transform: translate(-60%, -50%);
	}
	
	100% {
		opacity: 1;
		transform: translate(0, -50%);
	}
}

/* override */
.wbox .search_box .input-group { width: calc(100% - 15.4rem); }
.form_check label::after {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	z-index: -1;
	width: 0.8rem;
	height: 0.8rem;
	border-radius: 0;
	content: '\eb7b';
	font-family: 'remixicon';
	opacity: 0;
	transition: none;
}
.form_check input:checked + label::before { border-color: #437CDE; }
.form_check input:checked + label::after {
	width: 1.6rem;
	height: 1.6rem;
	background: #437CDE;
	transform: scalex(1) translateY(-50%);
	color: #fff;
	opacity: 1;
	border: none;
	line-height: 1.6rem;
}


.service-graph-container { 
	display: grid; 
	grid-template-areas: 
		"dataArea"
		"peopleArea"
		"studyArea";
	grid-template-columns: 100%; 
	gap: 1rem; 
}
.service-graph-container .data { grid-area: dataArea; }
.service-graph-container .people { grid-area: peopleArea; }
.service-graph-container .study { grid-area: studyArea; }
.service-graph-container .graph-item .wbox { padding: 3rem; }
.service-graph-container .graph-item .title { margin-bottom: 1rem; font-size: 2rem; font-weight: 600; }
.service-graph-container .subtitle { display: block; margin-bottom: .5rem; color: #666; }

@media all and (min-width: 992px) {
	.service-graph-container { 
		grid-template-areas: 
			"dataArea studyArea"
			"peopleArea studyArea";
		grid-template-columns: 6fr 4fr;
	}
	
	.service-graph-container .graph-item .wbox { height: 100%; }
	.service-graph-container .data .graph-area,
	.service-graph-container .people .graph-area { display: flex; gap: 1rem; }
	.service-graph-container .data .graph-area > div,
	.service-graph-container .people .graph-area > div { flex: 1; }
}