@charset "UTF-8";


/* 전체설정 */
* {margin: 0; padding: 0;}
ol, ul, li {list-style: none;}
body {font-family: 'Pretendard', Dotum, Sans-serif; font-weight: 300; font-size: 1rem;}
a {text-decoration: none; color: #000000;}
img {border: none;}
button {background-color: transparent; border: 0; padding: 0; margin: 0;font-family: 'Pretendard', Dotum, Sans-serif; cursor: pointer;}
img {vertical-align: middle;}
textarea , input {font-family: 'Pretendard', Dotum, Sans-serif;}
.padding-500 {padding: 300px 4%;}


/* ************* */
/**** 공통사항 ****/
/* ************* */

.d-flex {display: flex;}
.d-block {display: block;}
.d-none {display: none;}

.text-left {text-align: left;}
.text-right {text-align: right;}
.text-center {text-align: center;}

.text-primary {color: #0d39a3;}
.text-dark {color: #000000;}
.text-white {color: #ffffff;}
.text-dark-gray {color: #555555;}
.text-gray-999 {color: #999999;}
.text-blue {color: #006de7;}
.text-red {color: #e00000;}
.text-orange {color:#f85a47;}

.bag-white {background-color: #ffffff;}

h1 {font-size: 36px;}
h2 {font-size: 32px;}
h3 {font-size: 28px;}
h4 {font-size: 20px;}
h5 {font-size: 16px;}
h6 {font-size: 16px;}

.text-12 {font-size: 12px;}
.text-13 {font-size: 13px;}
.text-14 {font-size: 0.875rem;}
.text-15 {font-size: 15px;}
.text-16 {font-size: 1rem;}
.text-18 {font-size: 1.125rem;}
.text-20 {font-size: 1.25rem;}
.text-24 {font-size: 1.5rem;}
.small {font-size: 14px;}

.fw-normal {font-weight: normal;}
.fw-300 {font-weight: 300;}
.fw-400 {font-weight: 400;}
.fw-500 {font-weight: 500;}
.fw-600 {font-weight: 600;}
.fw-700 {font-weight: 700;}
.fw-800 {font-weight: 800;}

.d-block {display: block;}
.d-flex {display: flex;}

.m-0 {margin: 0;}
.mt-5 {margin-top: 5px;}
.mt-8 {margin-top: 0.5rem;}
.mt-10 {margin-top: 10px;}
.mt-20 {margin-top: 20px;}
.mt-30 {margin-top: 30px;}
.mt-40 {margin-top: 40px;}
.mt-50 {margin-top: 50px;}
.mt-60 {margin-top: 60px;}
.mt-70 {margin-top: 70px;}
.mt-80 {margin-top: 80px;}
.mt-90 {margin-top: 90px;}
.mt-130 {margin-top: 130px;}
.mt-150 {margin-top: 150px;}

.mb-5 {margin-bottom: 5px;}
.mb-8 {margin-bottom: 0.5rem;}
.mb-10 {margin-bottom: 10px;}
.mb-20 {margin-bottom: 20px;}
.mb-30 {margin-bottom: 30px;}
.mb-40 {margin-bottom: 40px;}
.mb-50 {margin-bottom: 50px;}
.mb-60 {margin-bottom: 60px;}
.mb-70 {margin-bottom: 70px;}
.mb-90 {margin-bottom: 90px;}
.mb-130 {margin-bottom: 130px;}
.mb-150 {margin-bottom: 150px;}
.w100p {width:100% !important;}
.img-fluid {max-width: 100%;}


input {height: 50px; padding: 14px; box-sizing: border-box; -webkit-box-sizing: border-box;  border-radius: 5px; margin-right: 5px; border-radius: 5px;}
input:focus-visible {outline: 0;}

input:focus {outline: none !important;}
*:focus {outline: none !important;}

select {border: 1px solid #cccccc; border-radius: 5px; padding: 12px; color: #000000; -webkit-appearance:none; -moz-appearance:none;  appearance:none; background-image: url("/images/sub/select-icon.png"); background-repeat: no-repeat; background-position:  center right 14px;font-family: 'Pretendard', Dotum, Sans-serif; font-weight: 500; min-width: 120px; font-size: 15px; min-height: 50px;}
select option {padding: 14px; display: block;}


/* ********************* */
/* ********layout******* */
/* ********************* */
.container {max-width: 1440px; padding-left: 4%; padding-right: 4%; margin-left: auto; margin-right: auto; -webkit-box-sizing: border-box; box-sizing: border-box;}
.container-02 {max-width: 1660px; padding-left: 4%; padding-right: 4%; margin-left: auto; margin-right: auto;}
.container-fluid {padding-left: 4%; padding-right: 4%;}
.container-02 .login-wrap {padding: 20px;background-color:rgba(0,0,0,1);border-radius:15px;}

@media screen and (max-width: 720px) {
	.container-02 .login-wrap {width:100%;}
}
@media screen and (min-width: 1200px) {
    .container {padding-left: 20px; padding-right: 20px;}
    .container-02 {padding-left: 20px; padding-right: 20px;}
    .container-fluid {padding-left: 70px; padding-right: 70px;}
	
}


/* ********************* */
/* ******* button ****** */
/* ********************* */
.btn {font-size: 18px; border-radius: 5px; display: block; width: fit-content; padding: 8px;}
.btn-primary {background-color: #0d39a3;color: #ffffff; font-weight: 700; min-height: 50px; min-width: 95px;padding: 14px 30px;box-sizing: border-box; -webkit-box-sizing: border-box; }
.btn-line-primary {background-color: #ffffff; border: 1px solid #0d39a3; color: #0d39a3;}

.btn-dark {padding: 14px 30px;box-sizing: border-box; -webkit-box-sizing: border-box; background-color: #000000; color: #ffffff; min-height: 50px;}
.btn-line-dark {border: 1px solid #000000; box-sizing: border-box; -webkit-box-sizing: border-box;padding: 14px 30px; font-weight: 700; min-height: 50px; }
.btn-or {background-color: #0d39a3;color: #ffffff; font-weight: 700; min-height: 50px; min-width: 95px;padding: 14px 30px ; }
.btn-dark-gray {background-color: #4d4948; color: #ffffff;padding: 14px 30px ;min-height: 50px; box-sizing: border-box; -webkit-box-sizing: border-box;}
.btn-line-gray {border: 1px solid #828282; color: #ffffff; box-sizing: border-box; -webkit-box-sizing: border-box;padding: 14px 30px; font-weight: 700; min-height: 50px; }
/* .btn-line-gray:hover {background-color: #ffffff; color: #000000;} */

.btn-blue {padding: 14px 30px;box-sizing: border-box; -webkit-box-sizing: border-box; background-color: #0d39a3; color: #ffffff; min-height: 50px;}
.btn-line-blue {border: 1px solid #0d39a3;background-color:#ffffff; color:#0d39a3;box-sizing: border-box; -webkit-box-sizing: border-box;padding: 14px 30px; font-weight: 700; min-height: 50px; }
/* ************ */
/**** header ****/
/* ************ */
.top-menu {padding-top: 20px; font-size: 15px; color: #555555;}
.top-menu ul {display: flex; justify-content: end;}
.top-menu ul li {position: relative;}
.top-menu ul li:not(:last-child) {margin-right: 12px; padding-right: 12px;}
.top-menu ul li:not(:last-child)::after {content: ""; display: block; width: 1px ; height: 12px; background-color: #d9d9d9; position: absolute; top: 4px; right: 0;}

/* logo */
.gnb .nav-brand {font-size: 26px; font-weight: 800; height: 100%; display: block; color: #ffffff;}
.gnb .logo {vertical-align: baseline;}
.logo-primary {color: #0d39a3;}
.logo-dark {color: #1a1a1a;}
.logo-dot {font-size: 60px;}

.header {width: 100%; height: auto; position: fixed; top: 0; left: 0; min-height: 100px; z-index: 1002;transition: all 0.5s ease;}
.header .dropdown-menu {min-width: 0; width: 100%; text-align: center;}

/* 헤더 스크롤 내릴 때 */
.header.isFixed {position: fixed;background-color:#ffffff;}

.header.isFixed .nav-brand {color: #000000;}
.header.isFixed .nav-link {color: #000000;}
.header.isFixed .gnb .nav-item-02 .nav-link {border: 1px solid #dddddd;}
.mobile-menu svg {width:32px;height:32px;fill:#FFFFFF;}
.header.isFixed .mobile-menu svg {fill:#000000;}

/* 서브페이지 헤더 */
.header.sub {border-bottom: 1px solid #dddddd;background-color:#ffffff;}
.header.sub .mobile-menu svg {fill:#000000;}
.header.sub .nav-brand {color: #000000;}
.header.sub .nav-link{color: #000000;}
.header.sub .gnb .nav-item-02 .nav-link {border: 1px solid #dddddd;}


/* logo */
.navbar-brand .logo-dark {display: none;}

@media screen and (min-width: 1200px) {
    .nav-brand {left: 20px;}
    .header {min-height: 100px;}
    .top-menu  {padding-bottom: 15px;}
}

@media screen and (max-width:720px) {
	.gnb .nav-brand img {width:80%;}
}

@media screen and (max-width:420px) {
    .top-menu {font-size: 14px;}
}

@media screen and (max-width:320px) {
    .top-menu ul li:not(:last-child) {margin-right: 10px; padding-right: 10px;}
}

/* 전체 메뉴 */
.all-menu {
	width: 100%; height: 100%; background-color: #ffffff; position: fixed; top: 0; left: 0; z-index: 1100;
	padding-left: 4%; padding-right: 4%;box-sizing: border-box;display:none;
}
.all-menu > .all-container {
	width: 100%; height: 100%; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start;
}
.all-menu-header {width: 100%; height: 100px; border-bottom: 1px solid #dee2e6;display: flex;align-items: center; justify-content: space-between;}

@media screen and (max-width:720px) {
	.all-menu-header .all-menu-logo img {width:80%;}
}

.all-menu-header .btn-close {font-size:0;padding:5px;}
.all-menu-nav {width: 100%; max-height: calc(100vh - 255px); padding: 1.5rem 0; flex: 1; overflow-y: auto;}
.all-menu-list {width: 100%;}
.all-menu-list .btn-allmenu {padding: 0.625rem 0; font-size: 1.5rem; font-weight: 700; color: #000000; display: inline-block; width: 100%; text-align: left;}

.all-mem-info {width: 100%;padding: 10px;border-bottom: 1px solid #dee2e6;box-sizing: border-box;}
.all-nav-link {display: flex;font-size: 15px;border-radius: 30px;border: 1px solid #dddddd;justify-content: space-between;margin-bottom:5px;}
.all-nav-link > div:last-child {padding: 0;}
.all-nav-link button {font-size: 15px; padding: 10px 20px; background-color: #0d39a3; border-radius: 30px; max-height: 36px; width: max-content;}
.all-nav-link .name{padding: 10px 20px; max-height: 36px; box-sizing: border-box; background-color: #ffffff;}
.all-nav-link .bag-dark {background-color: #000000;}
.all-btn-wrap {display: flex;justify-content: space-between;align-items: center;gap: 10px;}
.all-btn {width: 50%;background-color: #333333;border-radius: 30px;text-align: center;color: #ffffff;padding: 10px 0;}
/* 전체 메뉴 끝*/


/* gnb */
.gnb {width: 100%; height: 100px;}
.gnb > .container {height: 100%; display: flex; justify-content: space-between; align-items: center; position: relative;}

.gnb .nav-list {display: flex; justify-content: flex-end; align-items: center;gap: 10px;}
.gnb .nav-item {position: relative;color: #ffffff;}
.gnb .nav-item-02 {background-color: #ffffff;border-radius: 20px; position: relative; min-width: 280px; margin-right: 0; height: 36px;}
.gnb .nav-item-02 .nav-link{
	display: flex; font-size: 15px; background-color: #ffffff; position: absolute; top: 50%; left: 0;right:0; z-index: 100; border-radius: 30px; transform: translateY(-50%);
}
.gnb .nav-item-02 .nav-link > div:last-child {padding: 0;}
.gnb .nav-item-02 button {font-size: 15px; padding: 10px 20px; background-color: #0d39a3; border-radius: 30px; max-height: 36px; width: max-content;}
.gnb .nav-item-02 .name{padding: 10px 20px; max-height: 36px; box-sizing: border-box; background-color: #ffffff;}
.gnb .nav-item-02 .bag-dark {background-color: #000000;}

.gnb .nav-link {font-size: 1.25rem; font-weight: 500; display: block; font-weight: 700;padding: 5px 15px; }

.gnb .nav-item:hover .submenu {display: block;}
.logo {width: 145px; height: auto;}

.chevron-down {width: 8px; height: auto;}


/* submenu */
.submenu {min-width: 45px; padding:1.125rem; background-color: #ffffff;   -webkit-border-radius: 20px; border-radius: 20px; position: absolute; top: 0; padding-top: 55px; left: 50%; white-space: nowrap; display: none; background-color: #e5e5e5; font-weight: 500; text-align: left; transform: translateX(-50%); width: 100%; box-sizing: border-box; }

.sub-item:not(:last-child) {margin-bottom: 10px;}
.sub-item.active {color:  #0d39a3;;}
.sub-item.active .sub-link::after {opacity: 1; visibility: visible;}

.sub-link {color: inherit; position: relative; display: inline-block; color: #000000; font-weight: 500; font-size: 15px;}

@media screen and (max-width:1199px){
    .gnb .nav-list {display:none;}
    .gnb .nav-item:hover::after {opacity: 0;}
    .gnb .nav-item.active::after {opacity: 0;}
    .nav-brand-area {display: flex; justify-content: space-between; align-items: center; width: 100%;}
    .gnb .nav-item:first-child a{padding-left: 0;}
}

@media screen and (max-width:767px) {
    .gnb .nav-list {align-items: flex-start; width: 100%; justify-content: flex-end;}
    .submenu {top: 0;}
    .gnb .nav-item-02 .nav-link {top: 0; transform: translateY(0);}
    .gnb .nav-item {margin-right: 1rem;}
}

@media screen and (max-width:420px) {
    .gnb .nav-brand {font-size: 1.25rem;}
    .gnb .nav-link {margin-bottom: 0.5rem;}
    .gnb .nav-item {margin-right: 0;}
    .gnb .nav-item:first-child a {font-size: 1rem;}
    .gnb .nav-list {flex-direction: column; align-items: flex-end;}
}

@media screen and (min-width:1200px){
	.mobile-menu {display:none;}
}

/* 메인 전 로그인창 */
.login-section {background-image: url("/images/main_background.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center center; width: 100%; min-height: 100vh; color: #ffffff;}
.login-section .container-02 {display: flex; align-items: center; justify-content: flex-end; height: 100vh;}
.login-section h1 {margin-bottom: 50px;text-align: center;}

.form-group label{display: block; margin-bottom: 5px;}
.form-group input {border-radius: 5px; width: 100%;}
.form-group:not(:last-child) {margin-bottom: 40px;}
.login-section label {color: #aaaaaa;}
.login-section input {background-color: transparent; border: 0; border-bottom: 1px solid #aaaaaa; color: #ffffff; padding-left: 0; padding-right: 0; border-radius: 0;}
.login-section input::placeholder {color:#ffffff;}

.login-section .form-group {flex-direction: column;}

.login-section .btn-area .btn {width: 100%; text-align: center; padding: 20px; max-height: 60px;}
.login-section .btn-area .btn-primary {margin-bottom: 15px;}
.login-section .id-pwd-wrap {display:flex;justify-content: center;align-items: center;padding:10px;} 
.login-section .id-pwd-wrap > a {color:#ffffff;padding:10px;}
.login-section .id-pwd-wrap > a:hover {background-color:rgba(255,255,255,0.2);border-radius: 5px;}

/* 메인 */
.main-section {background-image: url("/images/sub_background.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center center; }
.main-section .container {
	padding-top: 320px; -webkit-box-sizing: border-box;box-sizing: border-box; padding-bottom: 100px; 
	height: 100%;min-height: 1080px; display: flex; flex-direction: column; justify-content: space-between;word-break: keep-all;
}
.main-title {color: #ffffff; text-align: center;}
.main-title h1 {font-size: 60px;}
.main-title p {font-size: 24px; font-weight: 700; padding-top: 2rem;}

.link-list {width: calc(100% + 24px); margin-left: -12px; margin-right: -12px; margin-bottom: -24px; display: flex; padding-top:100px;}
.link-list li {
	width: calc(50% - 24px); margin-left: 12px; margin-right: 12px; margin-bottom: 24px; 
	background-color: rgba(0, 0, 0, 0.6); border-radius: 20px;transition: all 0.5s;
}
.link-list a {width: 100%; height: 100%; display: block; padding: 40px;-webkit-box-sizing: border-box;box-sizing: border-box;}
.link-list a>div {display: flex; justify-content: space-between; align-items: center;}
.link-list h2{font-size: 36px;color: #ffffff;transition: all 0.5s;}
.link-list p{color: #ffffff; padding-top: 70px;transition: all 0.5s;}
.icon-area .hover {display: none;}
.icon-area img {transition: all 0.5s;}

.link-list li:hover {background-color: #ffffff;}
.link-list li:hover h2 {color: #0d39a3;}
.link-list li:hover .icon-area img {display: none;}
.link-list li:hover .icon-area .hover {display: block; }
.link-list li:hover p {color: #000000;}

@media screen and (max-width:1300px) {
    .link-list p .d-block {display: inline;}
    .link-list h2 {font-size: 26px; }
}

@media screen and (max-width:991px) {
    .link-list {flex-wrap: wrap;}
    .link-list li {width: calc(50% - 24px);}
} 
@media screen and (max-width:767px) {
    .main-title h1 {font-size: 40px;}
    .link-list p .d-block {display: inline;}
    .link-list li {width: calc(100% - 24px);}
    .link-list h2 .d-block {display: inline;}
	.main-section .container {padding-top:140px;}
}

/* sub */
/* 서브페이지 시작 */

.sub-page {padding-top: 150px; padding-bottom: 100px;}
.section-header h1 {font-size: 60px; text-align: center; margin-bottom: 50px;}

@media screen and (max-width:767px) {
    .section-header h1 {font-size: 40px;}
}

/* 검색창 */
.search-area {width: 100%;}
.top-search {max-width: 700px; width: 100%; border: 3px solid #0d39a3; border-radius: 8px; display: flex; height: fit-content; -webkit-box-sizing: border-box; box-sizing: border-box;}
.top-search input {border: 0; width: 100%;  font-weight: 600; font-size: 20px; padding: 1rem 2rem; font-size: 1.125rem; height: 100%;}
.top-search input::placeholder {color: #999999;}
.top-search .btn-search {margin-top: 12px; margin-bottom: 12px; margin-right: 2rem;}

.btn-area-02 {
	max-width: 700px; width: 100%; display: flex; justify-content: center; align-items: center; margin-left: auto; margin-right: auto; 
	margin-top: 20px;margin-bottom:40px;
}
.btn-area-02 .btn {width: calc(50% - 5px);}
.btn-gray {background-color: #e5e5e5; border-radius: 0.5rem; padding: 20px; max-height: 60px; font-weight: 500;}
.btn-gray img {vertical-align: baseline; margin-right: 8px;}
.btn-gray:first-child {margin-right: 10px;}
.btn-gray.active {background-color: #0d39a3; color: #ffffff;} 
.btn-gray:hover {background-color: #0d39a3; color: #ffffff;} 

.btn-area-02 .icon-white{display: none;}
.btn-gray.active img {display: none;}
.btn-gray:hover img {display: none;}
.btn-gray.active .icon-white {display: inline;}
.btn-gray:hover .icon-white {display: inline;}

.search-area-02 {width: 100%; margin-top: 50px;display:flex;justify-content: center;align-items: center;}
.bottom-search {width: 100%; border: 1px solid #dddddd; border-radius: 8px; display: flex; height: fit-content; -webkit-box-sizing: border-box; box-sizing: border-box; margin-left: auto; margin-right: auto;}
.bottom-search input {border: 0; width: 100%;  font-weight: 600; padding: 1rem 2rem; font-size: 1.125rem; height: 100%; margin-right: 0;}
.bottom-search input::placeholder {color: #999999;}
.bottom-search .btn-search {padding-top: 12px; padding-bottom: 12px; padding-left: 2rem;padding-right: 2rem;}

.search-list {width: 100%; margin-top: 15px; display: flex;}
.search-list>div {width: 33.3333%;}
.search-list .list {border: 1px solid #dddddd;}
.search-list .list:not(:first-child) {margin-left: -1px;}
.search-list .list>div {
	width: 100%; padding: 12px 20px; font-size: 18px; background-color: #f1f1f1; color: #555555; 
	border-bottom: 1px solid #dddddd; font-weight: 500;text-align: center; box-sizing: border-box;
}
.search-list .list ul {height:219px;overflow-y: auto;transition: all 0.5s ease;}
.search-list .list ul li{padding: 12px 16px;border-bottom: 1px solid #dddddd;}
.search-list .list ul li:hover {background-color: #f1f5ff;}
.search-list .list ul li.active {background-color: #0d39a3;color:#ffffff;}
.search-list .list ul li:last-child {border-bottom:0;}

.search-list .list ul.cate-list::-webkit-scrollbar {width: 10px;}
.search-list .list ul.cate-list::-webkit-scrollbar-thumb {
	background-color: #0d39a3;border-radius: 10px;background-clip: padding-box;border: 2px solid transparent;
}
.search-list .list ul.cate-list::-webkit-scrollbar-track {
	background-color: #eeeeee;box-shadow: inset 0px 0px 5px white;
}

.sch-form-select {
	min-width:auto !important;padding-right:25px !important;background-position:center right 12px !important;
	border:0;font-weight: 600;color:#666666;font-size:1.125rem;
}

/* 체크박스 */
.check-label {display: flex;}
.check-label label {display: flex; align-items: center; font-weight: 400; }
.check-label label:not(:last-child) {margin-right: 30px;}
.check_btn{-webkit-appearance: none; position: relative; min-width: 1.125rem; height: 1.125rem; outline: none !important; border: 2px solid #cccccc; border-radius: 3px; box-sizing: border-box; padding: 0; margin-right: 10px; background-color: #ffffff;background-image: url("/images/sub/checkbox.svg");background-size: 80%; background-repeat: no-repeat; background-position: center center; }
.check_btn[type="checkbox"]:checked { background-image: url("/images/sub/checkbox.svg"); background-size: 80%; background-repeat: no-repeat; background-position: center center; border-color: #0d39a3; background-color: #0d39a3;}

@media screen and (max-width:767px) {
    .btn-area-02 {flex-direction: column;}
    .btn-gray:first-child {margin-right: 0; margin-bottom: 10px;}
    .btn-area-02 .btn {width: 100%; max-width: 270px;}
    .check-label {flex-direction: column;}
    .check_btn{width: fit-content; margin-bottom: 5px;}
}

.plus-list {margin-top: 20px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; margin-bottom: -5px;}
.plus-list li{width: fit-content; background-color: #666666; border-radius: 30px; padding: 14px 20px; display: flex; align-items: center; margin-bottom: 5px; color: #ffffff;}
.plus-list li:not(:last-child) {margin-right: 5px;}
.plus-list p {word-break: break-all; font-weight: 400;}
.plus-list .btn-close {margin-left: 20px;}
.plus-list .btn-close img {vertical-align: baseline;}

.dirsearch_wrap .btn-primary {max-width: 345px; width: 100%; font-size: 20px; margin-left: auto; margin-right: auto; margin-top: 20px; min-height: 60px;}


.dirsearch_wrap {display: none;}
.dirsearch_wrap.active {display: block;}

/* 연구원 조회 리스트 */
.board-header {display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;}
.form-select-area {display: flex; width: 100%;}
.select-area .form-select  {width: calc(50% - 10px); padding: 20px 25px; margin-left: 10px; font-size: 18px;}

.classification {background-color: #f1f5ff; padding: 20px 30px; border-radius: 10px; font-size: 18px; display: flex; flex-wrap: wrap; margin-top: 50px;}
.classification li {position: relative;padding-right: 10px; margin-right: 10px; line-height: 1.5;}
.classification li:not(:last-child):after {content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 2px; height: 16px; background-color: #dddddd;}

.board-header {margin-top: 20px;}
.board-list-01 {border-top: 1px solid #dddddd;}

.board-list-area {display: block; padding: 30px 1rem; border-bottom: 1px solid #dddddd; display: flex;}
.board-list-area:hover {background-color: #efefef;}

.board-list-area h6 {font-size: 18px; font-weight: 600; min-width: 160px; padding-right: 30px; }
.board-list-area ul {}
.board-list-area ul li {font-size: 15px;}
.board-list-area ul li:not(:last-child) {margin-bottom: 5px;}

.bag-y {background-color: #f8ec25;}
span.bar {color: #cccccc ; margin-left: 4px; margin-right: 4px;}
span.next {color: #000000 ; margin-left: 4px; margin-right: 4px;}

@media screen and (max-width:767px) {
    .board-list-area h6 {min-width: auto; min-width: 80px; box-sizing: border-box;}
}

/* ********************* */
/* ********페이징******** */
/* ********************* */
.pagelist-area {margin-top:50px;}
.pagelist {display: flex; justify-content: center;}
.pagelist a {font-size: 16px; width: 35px; height: 35px; display: block; display: flex; align-items: center; justify-content: center; border-radius: 5px; font-weight: 700; margin-left: 4px; margin-right: 4px;}

.pagelist a.active {color: #ffffff; background-color: #0d39a3;}
.pagelist a:hover {color: #ffffff;background-color: #0d39a3;}
.pagelist .page-btn:hover {background-color: #eeeeee;}

.pagelist .prev {margin-right: 20px;}
.pagelist .next {margin-left: 20px;}

@media screen and (max-width:767px) {
    .pagelist a {margin-left: 0; margin-right: 0; width: 30px; height: 30px;}
    .pagelist .prev {margin-right: 0px;}
    .pagelist .next {margin-left: 0px;}

}

/* 팝업 */
.badge {padding: 4px 7px; font-weight: 600; font-size: 13px; border-radius: 30px; width: fit-content; min-width: 60px; box-sizing: border-box; -webkit-box-sizing: border-box; height: fit-content; text-align: center; white-space: nowrap;}
.badge-01 {background-color: #0d39a3; color: #ffffff;}


.board-popup {position:fixed; left: 0; top: 0; z-index: 9999; background-color: rgba(0,0,0,0.7); width: 100%; height: 100%; display: none;}
.board-popup.active{display: block;}
.popup-open { overflow: hidden;}
.board-popup .container {max-width: 1100px; position: absolute; top: 50%; left: 50%; transform: translate(-50% , -50%); width: 100%; padding-left: 20px; padding-right: 20px;}
.board-popup .board-popup-area {max-width: 1100px; width: 100%; margin-left: auto; margin-right: auto;  border-radius: 30px; padding-top: 30px; box-sizing: border-box; -webkit-box-sizing: border-box; background-color: #ffffff; padding-left: 5px; padding-right: 5px}
.board-popup .popup-header {color: #000000; padding-left: 30px; padding-right: 30px;}
.board-popup .badge-area {display: flex; justify-content: flex-start; align-items: center; margin-bottom: 10px;}
.board-popup .badge-area span {margin-left: 10px; font-size: 14px;}
.board-popup .popup-header .title {display: flex; justify-content: space-between;}
.board-popup .popup-header h4 {font-size: 24px;}
.board-popup .list-heart img{width: 30px; height: auto;}
.board-popup .popup-close {text-align: right;}
.board-popup .popup-close img {width: 20px; height: 20px;}
.board-popup .popup-close .btn-dark-close {margin-left: auto; margin-right: 0;}

.board-popup .popup-con {padding-left: 25px; padding-right: 25px; max-height: 600px;}
.board-popup .popup-con .con-area-01 {border: 1px solid #dddddd; border-radius: 15px; padding: 30px;overflow-y: auto;height: 565px;}


.dot-list {width: 100%; display: flex; flex-wrap: wrap;}
.dot-list li{position: relative; padding-left: 10px; display: flex;  width: 50%; width: calc(50% - 10px); margin-bottom: 20px;}
.dot-list li::before {content: ""; position: absolute; width: 2px; height: 2px; background-color: #3c3c3c; top: 8px; left: 0;}
.dot-list .tt {min-width: 140px; font-weight: 400;margin-right: 30px;width: 140px;}

.down-area {display: flex; flex-wrap: wrap; margin-bottom: -5px;}
.down-area a {background-color: #eeeeee; padding: 6px 10px; border-radius: 5px; display: flex; align-items: center; margin-bottom: 5px;}
.down-area a:not(:last-child) {margin-right: 5px;}
.down-area a img {margin-right: 6px;}

.board-popup .btn-area {display: flex; justify-content: flex-end;}
.board-popup .btn-area .btn {font-size: 1rem; min-width: 190px; padding: 14px; text-align: center; font-weight: 600; margin-right: 5px;}
.board-popup .btn-area .btn:last-child {margin-right: 0;}
.border-gray-10 {width: 100%; height: 10px; background-color: #eeeeee;}
.board-content {margin-top: 30px; padding: 10px; margin-bottom: 30px;}

@media screen and (min-width:1200px) {
    .board-popup .board-popup-area {min-width: 1100px;width: 100%; }
}

@media screen and (max-width:1199px) {
    .board-popup .board-popup-area {min-width: auto;}
}

@media screen and (max-width:991px) {
    .board-popup .popup-con {max-height: calc(100vh - 170px);}
}

@media screen and (max-width:767px) {
    .dot-list li {width: 100%; flex-direction: column;margin-bottom: 5px; font-size: 14px;}
    .dot-list li::before {top: 6px;}
    .board-popup .popup-header h4 {font-size: 18px;}
    .board-popup .btn-area {flex-wrap: wrap; justify-content: center; margin-bottom: 15px;}
    .board-popup .btn-area .btn {margin-bottom: 5px;margin-left: 5px;} 
    .board-popup .btn-area .btn:last-child {margin-right: 5px;margin-left: 5px;}
    .board-popup .popup-header .title {align-items: baseline;}
    .board-popup .list-heart img {width: 25px;}
    .board-popup .popup-con .con-area-01 {padding: 15px;}
    .board-popup .popup-header {padding-left: 15px; padding-right: 15px;}
    .board-popup .popup-con {padding-left: 15px; padding-right: 15px;}
}

/* 팝업 스크롤바 커스텀하기 */
.popup-con::-webkit-scrollbar {width: 5px;}
.popup-con::-webkit-scrollbar-thumb {background: #0d39a3; border-radius: 10px;}
.popup-con::-webkit-scrollbar-track {background-color: transparent;}

.con-area-01::-webkit-scrollbar {width: 5px;}
.con-area-01::-webkit-scrollbar-thumb {background: #0d39a3; border-radius: 10px;}
.con-area-01::-webkit-scrollbar-track {background-color: transparent;}

/* 회원가입 */

.join-list {display: flex; text-align: center; justify-content: center; margin-bottom: 60px;}
.join-list .num{ width: 50px; height: 50px; border-radius: 50%; border: 1px solid #0d39a3; font-size: 18px; font-weight: 500; display: flex; justify-content: center; align-items: center; margin: 0 auto; color: #0d39a3; }
.join-list p{margin-top: 15px; font-size: 18px; font-weight: 700;color: #999999;}

.join-list>div.active .num {background-color: #0d39a3; color: #ffffff;}
.join-list>div.active p {color: #000000;}
.join-list .dot {margin-left: 35px; margin-right: 35px; padding-top: 12px;}
.join-list .dot span{margin-left: 6px; margin-right: 6px;}

@media screen and (max-width:991px) {
    .join-list .dot {margin-left: 10px; margin-right: 10px;}
    .join-list .dot span {margin: 0;}
}
@media screen and (max-width:767px) {
    .join-list .num {font-size: 14px; width: 30px; height: 30px;}
    .join-list p {font-size: 14px;}
    .join-list .dot {padding-top: 2px;}
    .join-list .dot span {display: none;}
    .join-list .dot span:first-child {display: block;}
}

@media screen and (max-width:320px) {
    .join-list .dot {margin-left: 5px; margin-right: 5px;}
}

/* 약관동의 */
.join-area .top {background-color: #f1f5ff; padding: 25px 30px; border-radius: 10px; display: flex; justify-content: space-between; align-items: center;}
.join-area .top .btn-line-primary {font-size: 1rem; font-weight: 700; min-height: 40px; min-width: 110px; margin-left: 30px;}

@media screen and (max-width:767px) {
    .join-area .top {flex-direction: column;}
    .join-area .top .btn-line-primary {margin-left: 0; margin-top: 1rem;}
}

.join-check {margin-top: 60px;}
.join-check .title {display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;}
.join-check .title .check_btn {margin-left: 0.5rem;}
.join-check .text-box {background-color: #f7f7f7; border-top: 2px solid #cccccc; padding: 15px; font-size: 15px; max-height: 320px; overflow-y: auto; line-height: 1.4; font-weight: 500; border-bottom: 1px solid #dddddd; word-break: keep-all;}

.join-btn-area {display: flex; align-items: center; justify-content: center;margin-top: 60px;}
.btn-gray-02 {background-color: #aaaaaa; color: #ffffff; min-height: 60px; padding: 14px 30px;}

.join .btn-primary {min-height: 60px; min-width: 300px;}
.join .btn-gray-02  {min-width: 110px; margin-right: 0.5rem;}

@media screen and (max-width:767px) {
    .join-check .title {flex-direction: column;}
    .join-check .check-label {flex-direction: row; margin-top: 0.5rem;}
    .join-btn-area .btn-primary {min-width: 110px;}
}

/* 02실명확인 , 04가입완료 */
.join-procedure {background-color: #f1f5ff; padding: 60px; border-radius: 0.5rem;display: flex; align-items: center; justify-content: center; text-align: center;}
.join-procedure h3 {font-size: 34px; margin-bottom: 30px;}
.join-procedure h4 {margin-top: 30px; font-size: 24px; margin-bottom: 0.5rem;}
.join-procedure p {margin-bottom: 40px; width: 100%; max-width: 540px; word-break: keep-all;}
.join-procedure .btn-primary {margin: 0 auto;}

@media screen and (max-width:767px) {
    .join-procedure {padding: 30px;}
    .join-procedure h3 {font-size: 24px; margin-bottom: 30px; word-break: keep-all;}
    .join-procedure h4 {font-size: 20px; word-break: keep-all;}
    .join-procedure .btn-primary {min-width: 110px;}
    .join-procedure p {word-break: break-all;}
    .join-procedure p .d-md-block {display: inline;}
    .join-procedure p .d-block {display: block;}
}


/* 정보입력 */
.join .form-group input[type="checkbox"] {width: auto;}


.form-group {display: flex; margin-bottom: 40px;}
.form-label {font-size: 18px; font-weight: 700; min-width: 200px;}
/* .form-group>div {width: 100%;} */
.form-control {font-size: 16px; border: 1px solid #dddddd; width: 100%; }
.form-type-area .form-group input{width: 100%;}
.form-type-area .form-group input::placeholder{color: #000000; font-weight: 400;}

.form-type-area h3{font-size: 24px; padding-bottom: 20px; margin-bottom: 40px; border-bottom: 1px solid #000000;}
.form-type {width: 100%; display: flex; flex-wrap: wrap;}
.form-type .form-group {width: calc(50% - 40px); flex-direction: column; margin-right: 80px;}
.form-type .form-group:nth-child(even) {margin-right: 0;}
.form-type .form-label  {font-size: 16px; min-width: auto; margin-bottom: 15px;}

/* 거주지 구분 */
.form-type .add-group {width: 100%; margin-right: 0;}
.form-type .add-group>div {display: flex; justify-content: space-between;}

.form-type .add-group .input-group {display: flex;}
.form-type .add-group .input-group input:last-child {margin-right: 0;}
.form-type .add-group .btn-line-dark {font-size: 16px; padding: 14px 20px; min-width: 100px; text-align: center; margin-right: 5px;}

.form-type .add-group .radio-box {margin-right: 45px; min-width: 180px;}
.form-type .add-area .input-group{width: 100%}
.form-type .add-group .add-01 {width: 10%;}
.form-type .add-group .add-02 {width: 45%;}
.form-type .add-group .add-03 {width: 45%;}

.form-group-02:first-child {border-bottom: 1px solid #dddddd; padding-bottom: 40px; }
.form-group-02 {margin-bottom: 40px;}
.form-group-02 .check-label label {font-size: 18px; font-weight: 700;}
.form-group-02 .text-box {padding: 20px; border-radius: 5px; border: 1px solid #dddddd; min-height: 150px; box-sizing: border-box; -webkit-box-sizing: border-box; color: #555555; line-height: 1.3; max-height: 300px; overflow-y: auto;}
.input-group-02 {display: flex;}
.input-group-02 .btn-line-dark {white-space: nowrap;padding: 14px 20px; font-size: 16px;}

/* 라디오버튼 커스텀 */
.radio-area {font-size: 16px; font-weight: 500;}
.radio-box {min-height: 50px; align-items: center;}
.radio-box .radio-area:not(:last-child) { margin-right: 30px;}
.join .form-group input[type="radio"] { vertical-align: bottom; /* appearance: none; */ border: 1px solid #dddddd; border-radius: 50%; width: 18px; height: 18px;accent-color:#0d39a3; position: relative;}
.join .form-group input[type="radio"]::after {content: ""; width: 18px; height: 18px; border-radius: 50%; border: 1px solid #dddddd; position: absolute; left: -1px; top: -1px; background-color: #ffffff;}

.join .form-group input[type="radio"]:checked::before {content: ""; width: 18px; height: 18px; background-color: #0d39a3; border-radius: 50%; top: 0; left: 0; position: absolute;}

.join .form-group input[type="radio"]:checked::after {content: ""; width: 6px; height: 6px; background-color: #ffffff; border-radius: 50%; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); position: absolute;}


.form-type .form-group-100 {width: 100%;}
.form-text {margin-top: 0.5rem; color: #888888; font-size: 15px; line-height: 1.4;}
.bar-100 {width: 100%; height: 1px; background-color: #dddddd; margin-bottom: 40px;}
.bag-b {background-color: #f1f5ff;}


/* 이메일부분 */
.join-emaill-area {width: 100%;}
.join-emaill-area .form-group {width: 100%;}

.join-emaill {display: flex;}
.join-emaill .group01 {width: 75%; display: flex;}
.join-emaill .group01 .form-control {width: 25%;}
.join-emaill .group01 .form-select {height: fit-content; width: 30%; font-weight: 500;margin-right:5px;}
.join-emaill .group01>div { padding: 0 10px; padding-top: 14px; font-weight: 600;}

.join-emaill .group02 {width: 30%; display: flex; flex-direction: row; align-items: center; margin-bottom: 0;}
.join-emaill .group02 .form-label {margin-bottom: 0; margin-right: 2rem;}

/* 소속기관 */
.form-type .group-box {width: 100%;}
.group-box>div {display: flex; width: 100%;}
.group-box .form-control {width: 100%;}
.group-box .input-group-02 {width: 100%; max-width: 440px;}
.group-box .radio-box {max-width: 285px;}

/* 전화번호 */
.num-form-select {width: 100%; max-width: 33.3333%; margin-right: 5px;}

.form-title-new {display: flex; justify-content: space-between;align-items: flex-end;}
.form-title-new .text-red {font-size: 15px;}

@media screen and (max-width:1199px) {
    .join-emaill {flex-direction: column;}
    .join-emaill .group01 {width: 100%;}
    .join-emaill .group02 {width: 100%;}
    .join-emaill .group01 .form-control {width: 33%;}
    .form-type .add-group>div {flex-direction: column;}
}

@media screen and (max-width:767px) {

    .form-group {flex-direction: column;}
    .form-label {margin-bottom: 15px;}
    .form-type .form-group {width: 100%; margin-right: 0;}
    .form-type .add-group .input-group {flex-wrap: wrap;}
    .form-type .add-group .add-01 {width: calc(100% - 105px); margin-right: 0;}
    .form-type .add-group .add-02 {width: 100%; margin-top: 0.5rem; margin-right: 0}
    .form-type .add-group .add-03 {width: 100%; margin-top: 0.5rem; margin-right: 0}
    .member-form .check-label { margin-bottom: -10px;}
    .member-form .check-label label {margin-bottom: 10px; width: 50%;}
    .member-form .check-label label {width: 100%;}
    .join-emaill .group01 {flex-wrap: wrap;}
    .join-emaill .group01 .form-control {width: 100%;}
    .join-emaill .group01 input {margin-right: 0;}
    .join-emaill .group01>div {padding: 14px;}
    .join-emaill .group01 .form-select {margin-top: 0.5rem; width: 100%;}
    .group-box>div {flex-direction: column;}
    .form-title-new {flex-direction: column; justify-content: flex-start; align-items: flex-start;}
    .form-title-new .text-red {margin-top: 1rem;}
}



/* 정보입력의 팝업 */

/* 아이디 중복확인 */
.board-popup-02 .board-popup-area {padding-bottom: 40px; max-width: 550px; padding-top: 40px; font-weight: 500;}
.board-popup-02 .popup-header>div{display: flex; justify-content: space-between; align-items: center;}
.board-popup-02 .popup-con {padding-left: 35px; padding-right: 35px;}

.board-popup-02 .btn-primary {font-size: 1rem; margin-bottom: 40px;}
.board-popup-02 p {margin-bottom: 20px;} 

@media screen and (min-width:1200px) {
    .board-popup-02 .board-popup-area {min-width: 550px;}
}
@media screen and (max-width:360px) {

    .board-popup-02 .popup-con {padding-left: 15px; padding-right: 15px;}

}


/* 개인정보처리방침 */

.privacy-text-box {background-color: #f7f7f7; border-top: 2px solid #cccccc; padding: 40px; min-height: 350px;  max-height: 500px; overflow-y: auto; line-height: 1.4; font-weight: 500; border-bottom: 1px solid #dddddd; word-break: keep-all;}

.rch-bar {display:inline-block;}
.rch-bar:after {content:'|'; padding-left:10px;padding-right:10px;color:#cccccc;}
.rch-bar:last-child:after {content:'';padding-left:0;padding-right:0;}
.asi-bar {display:inline-block;}
.asi-bar:after {content:'|'; padding-left:10px;color:#cccccc;}
.asi-bar:last-child:after {content:'';padding-left:0;padding-right:0;}


/* 풋터 */
.footer {background-color: #181818; color: #aaaaaa; padding: 60px 0;}
.footer .container {display: flex; justify-content: space-between;}
.footer .main-foot-top {margin-bottom: 1rem;}
.foot-address {font-size: 15px; margin-bottom: 0.5rem; word-break: keep-all; }
.foot-address .add span:not(:last-child) {margin-right: 0.5rem; padding-right: 0.5rem;position: relative;}
.foot-address .add span:not(:last-child)::after {content: ""; position: absolute; right: 0; width: 1px; height: 10px; background-color: #3f3f3f; top: 50%; transform: translateY(-50%);}
.foot-address a {color: #aaaaaa;}
.copy {font-size: 13px; color: #777777;}

.family-site {position: relative; width: 230px; height: 50px;}
.family-site .family_site_btn {width: 100%; height: 100%; background-color: #000000; color: #aaaaaa; display: flex; justify-content:space-between; align-items: center; padding: 10px 26px; font-size: 15px;}
.family-site ul {position: absolute; width: 100%; bottom: 49px; background-color: #000000; display: none;}
.family-site ul li a {display: block; width: 100%; height: 100%; padding: 16px 26px; color: #ffffff; -webkit-box-sizing: border-box; box-sizing: border-box;color: #aaaaaa; }

@media screen  and (max-width:767px){ 
    .footer .container {flex-direction: column; justify-content: center; align-items: flex-start;}
    .foot-address .add span {display: block; }
    .foot-address .add span:not(:last-child) {margin-bottom: 5px;}
    .foot-address .add span:not(:last-child)::after {display: none;}

    .family-site {position: relative; left: 0; margin-right: 0; margin-left: auto; margin-top: 1rem;}
}

.datepicker-area {position: relative;}
.datepicker-area > .ui-datepicker-trigger {position: absolute; top: 50%; right: 22px; transform: translateY(-50%);}
.ui-datepicker-title > select {padding:6px;min-width:auto;min-height:auto;}

/* 2차인증 설명 */
.pass-title {color: #0d39a3; font-size: 24px; text-align: center; margin-bottom: 45px;}
.pass-area {display: flex; text-align: center; justify-content: center; margin-bottom: 60px;}
.pass-area {padding-left: 5%;}

.pass-area .num{ width: 50px; height: 50px; border-radius: 50%; border: 1px solid #0d39a3; font-size: 18px; font-weight: 500; display: flex; justify-content: center; align-items: center; margin: 0 auto; color: #0d39a3; }
.pass-area .num-02{ background-color: #869cd1; color: #ffffff; border-color: #869cd1;}
.pass-area .num-03{ background-color: #0d39a3; color: #ffffff; }
.pass-area p{margin-top: 15px; font-size: 18px; font-weight: 500;color: #000000;}

.pass-area>div.active .num {background-color: #0d39a3; color: #ffffff;}

.pass-area>div.active p {color: #000000;}
.pass-area .dot {margin-left: 35px; margin-right: 35px; padding-top: 12px;}
.pass-area .dot span{margin-left: 6px; margin-right: 6px;}

@media screen and (max-width:1250px) {
    .pass-area .dot {margin-left: 10px; margin-right: 10px;}
    .pass-area .dot span {margin: 0;}
}
@media screen and (max-width:1080px) {
    .pass-area .num {font-size: 14px; width: 30px; height: 30px;}
    .pass-area p {font-size: 14px;}
    .pass-area .dot {padding-top: 2px;}
    .pass-area .dot span {display: none;}
    .pass-area .dot span:first-child {display: block;}
}

@media screen and (max-width:767px){
    .pass-area {padding-left: 0%;}
}

@media screen and (max-width:320px) {
    .pass-area .dot {margin-left: 5px; margin-right: 5px;}
}

.sch-top-wrap {position: relative;display: flex;margin-bottom:20px;justify-content: space-between;align-items: center;}

.sch-on {height:43px !important;transition: all 0.5s ease;}
.btn-vwrap {display:none;text-align:center;overflow:hidden;}
.btn-view {
	color:#ffffff;background-color:#0d39a3;width:200px;height:44px;position:relative;
	border-bottom-right-radius: 20px;border-bottom-left-radius: 20px;font-weight: 500;font-size: 16px;
}
.btn-view:before {
	content:'';position:absolute;width:22px;height:22px;left:-22px;top:0;background-color:transparent;
	border-top-right-radius:20px;box-shadow:5px -5px 0 5px #0d39a3;
	
}
.btn-view:after {
	content:'';position:absolute;width:22px;height:22px;right:-22px;top:0;background-color:transparent;
	border-top-left-radius:20px;box-shadow:-5px -5px 0 5px #0d39a3;
}
.btn-hide {display:none;}
.btn-show {display:block;}

.find-area {margin-top:100px;display: flex;justify-content: center;}
.find-area > .find-wrap {width:100%;max-width:400px;margin:0 auto;}
.find-area > .find-wrap > .btn-primary {width:100%;}
.find-area > .find-wrap > .find-btn-wrap {display: flex;justify-content: center;align-items: center;gap: 10px;}
.find-area > .find-wrap > .find-btn-wrap > .find-btn {
	font-size: 18px;border-radius: 5px;display: block;width:100%;height:60px;text-align:center;line-height:60px;
	color: #ffffff;font-weight: 700;
}
.find-area > .find-wrap > .find-btn-wrap > .find-btn.find-btn-primary {background-color: #0d39a3;}
.find-area > .find-wrap > .find-btn-wrap > .find-btn.find-btn-dark {background-color: #000000;}
.find-text {font-size:18px;margin-bottom:40px;text-align:center;}
.nav-link.active {background-color: rgb(182 199 225 / 30%);padding: 5px 15px;border-radius: 5px;}

.api-wrap {margin-bottom: 100px;}
.api-top-wrap {position: relative;display: flex;margin-bottom:30px;justify-content: space-between;align-items: center;}
.api-list-area {display: block; padding: 30px 1rem; border-bottom: 1px solid #dddddd; display: flex;flex-direction: column;}
.api-list-row {display: flex;justify-content: space-between;margin-bottom:10px;}
.api-list-area .api-btn-area {min-width: 160px;display: flex;justify-content: center;align-items: center;}
.api-list-area .api-btn-area a {
	border: 1px solid #999;border-radius: 4px;color:#000000;padding: 0.4rem 3rem 0.4rem 1.5rem;
	background: #fff url('/images/triangle.svg') no-repeat;background-position-x: 90%;background-position-y: center;background-size: 11px 12px;
}
.api-conts {display:none;}
.api-conts-info {padding:20px;background-color:#f1f3f4;border-radius:5px;}
.search_word {color: inherit !important;font-size: inherit !important;background: #fffad4;padding: 0;}
.ScienceClass {color:#007fdb}

.sch-optionbox {
	max-width: 1400px; width: 100%; border: 1px solid #dddddd; margin-left: auto; margin-right: auto;
	background-color:#f5f5f5;border-radius: 5px;padding: 1.5% 3%;box-sizing: border-box;
}
.txt-info {font-size:15px;padding-bottom:5px;padding-left:25px;position:relative;}
.txt-info svg {width:20px;position:absolute;left:0;fill:#999999}
.sch-itemgroup {margin-bottom: 2.5%;padding-bottom:1.5%;display:flex;justify-content: center;gap:10px;border-bottom:1px solid #dddddd;}
.sch-itemgroup button {
	border-radius: 8px;font-weight: 700;border: 1px solid #dddddd;background-color: #ffffff;
	box-sizing: border-box;padding:0.5rem 20px;font-size: 1rem;color:#999999;
}
.sch-itemgroup button:hover, 
.sch-itemgroup button.act {
	background-color: #0d39a3 !important;color:#ffffff !important;
}
.sch-itemgroup button:disabled, .sch-itemgroup button:disabled:hover{background-color:#dddddd !important;color:#ffffff !important;}
.sch-item {background-color:#ffffff;}
.sch-item input[type=text] {width: 100%;height: 50px !important;padding: 12px 20px;border: 0 !important;font-size: 1rem;margin-right: 0 !important;}
.sch-item input[type=text]:focus {background-color:#f4f6fb;border-radius: 0;}

.sch-item table {width:100%;border:1px solid #dddddd;}
.sch-item table tbody tr th {
	background-color:#eeeeee;padding:15px 10px;font-weight:normal;text-align:center;
	border-bottom:1px solid #dddddd;border-right:1px solid #dddddd;
}
.sch-item table tbody tr td {border-bottom:1px solid #dddddd;}
.table {border-collapse: collapse;}
.sch-btnbox {max-width: 1400px;width: 100%;margin-left: auto;margin-right: auto;padding: 3%;display: flex;justify-content: center;align-items: center;gap:10px;-webkit-box-sizing: border-box; box-sizing: border-box;}
.sch-btnbox button {width:250px;font-size:20px;font-weight: 700;min-height: 50px;border-radius: 5px;}
.sch-btnbox button.searchBtn {background-color: #0d39a3;color: #ffffff;}
.sch-btnbox button.searchBtn:hover {background-color:#1047cd}
.sch-btnbox button.init {background-color: #dddddd;color: #666666;}
.sch-btnbox button.init:hover {background-color:#ebeaea}
.schDate-grp {display: flex;align-items: center;gap: 10px;padding-left: 10px;}
.schDate-grp select {min-height: auto !important;padding: 10px 12px !important;}
.sch-result {display:flex;font-size:20px;position:relative;padding-left:90px;flex-wrap: wrap;}
.sch-result strong {position:absolute;left:0;}
.sch-result span {display:inline-block;margin-left:5px;margin-right:5px;}

.sch-area-frame {display:flex;justify-content: center;align-items: center;}
.sch-area-frame a {font-size:0;}
.sch-area-frame  svg {width:30px; fill:#0d39a3;margin-left:10px;}

.statistics-item-wrap {padding:10px;display:flex;gap:5px;flex-wrap: wrap;}
.statistics-item {
	padding: 6px 20px; border-radius:5px; box-sizing: border-box; -webkit-box-sizing: border-box; border: 1px solid #0d39a3; color:#0d39a3; display: inline-block;
}

.statistics-item:hover, .statistics-item.on {background-color: #0d39a3; color: #ffffff;}
.statistics-item-on {
	padding: 6px 20px; border-radius:5px; box-sizing: border-box; -webkit-box-sizing: border-box; 
	border: 1px solid #0d39a3; display: inline-block;background-color: #0d39a3; color: #ffffff;
}
.statistics-item-on:hover {background-color: #ffffff;border: 1px solid #0d39a3; color:#0d39a3;}

.chart-wrap {display:flex;gap:10px;}

.chart-wrap-left {
	width:20%;background-color:#ffffff;border-radius:5px;border: 1px solid #dddddd;
	padding:10px;box-sizing: border-box;
}
.chart-wrap-left .chart-year-wrap {margin-bottom:20px;}
.chart-wrap-left .chart-year-wrap .chart-year-wrap-title {font-size:12px;font-weight:bold;display:inline-block;}
.chart-wrap-left .chart-year-wrap ul {height: 134px;overflow-y: auto;border:1px solid #dddddd;border-radius: 5px;}
.chart-wrap-left .chart-year-wrap ul li {border-bottom: 1px solid #dddddd;}

.chart-wrap-left .chart-year-wrap ul li.on, 
.chart-wrap-left .chart-year-wrap ul li.on a{background-color:#0d39a3;color:#ffffff}
.chart-wrap-left .chart-year-wrap ul li a {display:block;padding: 6px 10px;font-size:13px;font-weight:bold;color:#666666}

.chart-wrap-left .chart-wrap-sticky {position: sticky;top: 105px;z-index: 10;}

.chart-wrap-right {width:80%;position: relative;display:flex;flex-direction: column;gap: 10px;}
.chart-wrap-right .chart-frame {background-color:#ffffff;border-radius:5px;border: 1px solid #dddddd;overflow: hidden;position: relative;}
.chart-wrap-right .chart-frame .chart-item {padding:30px 30px 15px 30px;}
.spinner-wrap {border-radius: 5px;display: flex;align-items: center;justify-content: center;height: 100%;}
.spinner-device {display:none;position: absolute;height:100%;width:100%;z-index: 100;background-color: rgb(220 220 220 / 50%);}

@keyframes spinner-rotate {
  to {
    transform: rotate(360deg);
  }
}

@media screen and (max-width:720px) {
	.chart-wrap {flex-direction: column;gap:0;}
	.chart-wrap-left, .chart-wrap-right {width:100%;}
	.statistics-item {font-size: 12px;font-weight: bold;padding: 2px 10px;}
	.chart-wrap-left .chart-year-wrap ul {height:83px;}
}

.custom-spinner {
	display: inline-block;width: 24px;height: 24px;border: 4px solid #6c757d;border-right-color: transparent;
	border-radius: 50%;animation: spinner-rotate 1s linear infinite;
}

.slider-range-wrap {position:relative;border: 1px solid #c5c5c5;padding-left:7px;padding-right:7px;border-radius:3px;}
.ui-widget.ui-widget-content {border:0;}
.ui-widget-header {background: #0d39a3;}
.ui-slider .ui-slider-handle {width: 1em !important;height: 1em !important;}
.ui-slider-horizontal .ui-slider-handle {top: -.15em !important;}
.ui-state-active {background: #f6f6f6 !important;border: 1px solid #c5c5c5 !important;}
.amount-wrap {display:flex;justify-content: space-between;}
.sub-chart-title {font-size:24px;display:block;text-align:center;}

#three_chart_div .table {
	--bs-table-color: #212529;
    --bs-table-bg: transparent;
    --bs-table-border-color: #dee2e6;
    --bs-table-accent-bg: transparent;
    --bs-table-striped-color: #212529;
    --bs-table-striped-bg: rgba(0, 0, 0, 0.05);
    --bs-table-active-color: #212529;
    --bs-table-active-bg: rgba(0, 0, 0, 0.1);
    --bs-table-hover-color: #212529;
    --bs-table-hover-bg: rgba(0, 0, 0, 0.075);
    margin-bottom: 1rem;
    color: var(--bs-table-color);
    vertical-align: top;
    border-color: var(--bs-table-border-color);
	font-size:12px;
}
#three_chart_div .table thead {
	position: sticky;top: 0;z-index: 1;
}
#three_chart_div .table .table-light {
    --bs-table-bg: #eef2f7;
    --bs-table-striped-bg: #313a46;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #a2a8b0;
    --bs-table-active-color: #fff;
    --bs-table-hover-bg: #e0e4ea;
    --bs-table-hover-color: #313a46;
    color: #313a46;
    border-color: #dbe0e5;
}
#three_chart_div .table .table-light tbody, td, tfoot, th, thead, tr {
    border-color: inherit;
    border-style: solid;
    border-width: 0;
}
#three_chart_div .table>:not(caption)>*>* {
    padding: 0.95rem;
}
#three_chart_div .table>:not(caption)>*>* {
    padding: .5rem .5rem;
    background-color: var(--bs-table-bg);
    border-bottom-width: 1px;
    box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
}
#three_chart_div th {
    font-weight: 500;
    vertical-align: middle;
    padding: 1rem 0;
}
#three_chart_div .table>thead {
    vertical-align: bottom;
}
#three_chart_div .table>tbody {
    vertical-align: inherit;
}
#three_chart_div .align-middle {
    vertical-align: middle !important;
}
#three_chart_div .table-hover>tbody>tr:hover>* {
    --bs-table-accent-bg: var(--bs-table-hover-bg);
    color: var(--bs-table-hover-color);
}

.chart-excel-btn-wrap {padding:10px 30px 10px 30px;}
.chart-excel-btn {
	padding: 6px 20px; border-radius:5px; box-sizing: border-box; -webkit-box-sizing: border-box; 
	background-color: #0d39a3; color: #ffffff;display: inline-block;font-size: 14px;
}
.sub_chart_wrap {display:flex;}
.sub_chart_frame {height: 500px;}
.sub_chart_frame_half {width:50%;height: 500px;}
.bb-title {font-size:24px !important;font-weight:bold;color:#000000;}

.pagination {display:flex;justify-content: center;}
.pagination > li {background-color: #fff;border:1px solid #f1f1f1;margin-left:2px;margin-right:2px;box-sizing: border-box;}
.pagination > li > a {display:flex;align-items: center;justify-content: center;width: 30px;height: 30px;font-size:12px;color:#333333;box-sizing: border-box;}
.pagination > li > a:hover, .pagination > li > a.active {background-color:#f5f5f5;color:#333333;font-weight:bold;}

.radio-area input[type="radio"] {display:none;}
.radio-area span {
	width: 100%;display: inline-block;font-weight: 300;border:1px solid #0d39a3; color:#0d39a3;
	padding: 6px 20px;text-align: center;border-radius: .375rem;cursor:pointer;box-sizing: border-box;
}
.radio-area input[type="radio"]:checked + span {
	color:#ffffff; border:1px solid #0d39a3; background-color:#0d39a3; font-weight:400;
}
.chart-menu-frm {display:flex;align-items: flex-end;justify-content: space-between;margin-bottom:5px;}
.reset-btn {
	display: inline-block;color: #ffffff;background-color:#0d39a3;padding: 3px 10px;
	border-radius: .175rem;box-sizing: border-box;font-size:12px;
}
.scroll-label {
	display: inline-block;color: #ffffff;background-color: #e54125;padding: 3px 10px;border-radius: 0 .175rem 0 .175rem;
	box-sizing: border-box;font-size: 12px;position:absolute;right:0;top:0;
}