/**
<576px	sm 
≥576px	md
≥768px	lg
≥992px	xl
≥1200px	xxl
≥1400px
*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('../fonts/style.css');

 html {
    /*font-size:16px !important;*/
	font-size: calc(16px + (4 * ((100vw - 1450px) / (1450 - 360))));
	/*font-size: calc(16px + 0.15vw);*/
  }
  
@media screen and (min-width: 1451px) {
  html {
    font-size: 16px;
  }
}
@media (max-width: 575px) {
	html {
    font-size: 14px;
  }
}
@media screen and (max-width: 360) {
  html {
    font-size: 12px;
  }
}

body {
  font-family: 'NanumSquare','Noto Sans KR', sans-serif;
  color: #000000;
  font-weight:400;
  font-size:1rem;  
}

body.main-full{	
	
}

a {
  color: #000000;
  text-decoration: none;
}

a:hover {
  color: #000000;
  text-decoration: none;
}


ul{list-style:none;margin:0;padding:0;}

a,select,input[type=text],input[type=password],button{vertical-align:middle;}

h1, h2, h3, h4, h5, h6 {
  
}

input[type=password] {
  font-family: 'pass', 'Roboto', Helvetica, Arial, sans-serif ;
 }
 
 
input::placeholder {
   font-family: 'NanumSquare', sans-serif;
   color: #adadad;
}
textarea::placeholder {
    font-family: 'NanumSquare', sans-serif;
	color: #adadad;
}

.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 200,
  'GRAD' 0,
  'opsz' 24
}

.wrap{min-width:360px;}

#main{
	width:98%;
	max-width:1920px; 
	margin:0 auto;
	position: relative;
    overflow: hidden;	
}
#main.main-full{
	max-width:98%; 
	min-height:calc(100vh - 270px)!important;	
	background:#A2EAFD;
}
.contents{
	position: relative;
	width:100%;
	padding:0 1rem;
	margin:0 auto;
}
.contents.board-contents{	
	width:100%;
	max-width:1250px;
}

@media (min-width: 576px) {
	.main-bg{
		background:url('/theme/cst/img/index_bg_m.png') 50% 50% no-repeat!important; background-size:cover ;	
	}
	main{
		
	}
	.contents{		
		padding:0 0.5rem;
	}
}
@media (min-width: 768px) {
	main{
		
	}
	.contents{		
		padding:0 0.5rem;
	}
}
@media (min-width: 992px) {
	main{
		
	}
	.contents{		
		padding:0 0.8rem;
	}
}

main.narrow .container{
	max-width:1000px;
}

/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  overflow: hidden;
  background: #fff;
}

#preloader:before {
  content: "";
  position: fixed;
  top: calc(50% - 30px);
  left: calc(50% - 30px);
  border: 6px solid #0d6efd;
  border-top-color: #fff;
  border-bottom-color: #fff;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  -webkit-animation: animate-preloader 1s linear infinite;
  animation: animate-preloader 1s linear infinite;
}

@-webkit-keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  right: 15px;
  bottom: 15px;
  z-index: 996;
  background: #0d6efd;
  width: 40px;
  height: 40px;
  border-radius: 50px;
  transition: all 0.4s;
}
.back-to-top i {
  font-size: 28px;
  color: #fff;
  line-height: 0;
}
.back-to-top:hover {
  background: #00c27b;
  color: #fff;
}
.back-to-top.active {
  visibility: visible;
  opacity: 1;
}


/*--------------------------------------------------------------
# Index
--------------------------------------------------------------*/

#indexWrap header{
   position: fixed;
   top:0;
   left:0;   
   width: 100%;   
   background: rgba(255,255,255,0.75);
   box-shadow: 1px 1px 3px rgba(0,0,0,0.8);
   z-index:2;
   transition:all 1s ease;
}

#indexWrap header:hover{
   background: rgba(255,255,255,1);   
}
#indexWrap header .container{
    max-width:1000px;
}
#indexWrap header .navbar {
    align-items: center;
    justify-content: space-between;
}
#indexWrap header .navbar-nav {
    align-items: center;
}
#indexWrap header .navbar-nav .nav-item a{
    font-size:1.2rem;
    font-weight:600;   
    color:#000;
}
#indexWrap header .navbar-nav .vt{
    width:1px;
    border-left:2px solid #000;
    height:1rem;
}


#indexSlogan{
  position: absolute;
  top:0%;
  left:0%;
  width:100vw;
  height:100vh;
  text-align: center;
  overflow: hidden;
  padding:0;  
  z-index:1;
}

#indexSlogan .swiper-wrapper{
   position: relative;
   width:100%;
   height:100%;
   z-index:1;
}
#indexSlogan .swiper-wrapper .swiper-slide.bg1{
   background: url('/image/index_bg1.jpg') 50% 50% no-repeat;
   background-size:cover; 
}
#indexSlogan .swiper-wrapper .swiper-slide.bg2{
   background: url('/image/index_bg2.jpg') 50% 50% no-repeat;
   background-size:cover; 
}
#indexSlogan .swiper-wrapper .swiper-slide.bg3{
   background: url('/image/index_bg3.jpg') 50% 50% no-repeat;
   background-size:cover; 
}
#indexSlogan .swiper-wrapper .swiper-slide.bg4{
   background: url('/image/index_bg4.jpg') 50% 50% no-repeat;
   background-size:cover; 
}

#indexSlogan .swiper-button-next,#indexSlogan  .swiper-button-prev {
    color:#fff;
}
#indexSlogan .swiper-button{
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50% );
    max-width:95%;
    width: 900px;
    height:100px;
    z-index:3;
}

#indexSlogan .swiper-horizontal>.swiper-pagination-bullets,#indexSlogan .swiper-pagination-bullets.swiper-pagination-horizontal,#indexSlogan .swiper-pagination-custom,#indexSlogan .swiper-pagination-fraction {
    bottom: 90px;
}
#indexSlogan .swiper-pagination-bullet-active{
    background: #fff!important;
}

#indexSlogan .swiper-scrollbar {    
    bottom: 80px;
}

#indexSlogan .txt{
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  width:900px;
  max-width: 95%;
  text-align: center;
  padding: 2rem 0;
  line-height: 5rem;
  z-index:0;  
}
#indexSlogan .txt:before{
 content: '';
  position: absolute;
  top:0%;
  left:0%;
  width:100%;
  height:100%;
  background: rgba(0,0,0,0.4);      
  border-radius: 1rem;
  z-index:0;
}
#indexSlogan .t1{
   font-size:2.4rem;
   color:#fff;
   font-weight: 600;
   display: block;       
   z-index:1;
}
#indexSlogan .t2{
   font-size:3rem;
   color:#fff;
   font-weight: 800;       
   display: block;
   z-index:1;
}  

#indexWrap #footer{
  color:#000;
  background: transparent;      
  z-index:3;
}
#indexWrap #footer .logo{
  filter: grayscale(90%);     
}
#indexWrap #footer .copyright{
  position: relative;
  color:#000;  
  z-index:1;
}
#indexWrap #footer:before{
 content: '';
  position: absolute;
  top:0%;
  left:0%;
  width:100%;
  height:100%;
  background: rgba(255,255,255,0.7);      
  z-index:0;
  transition:all 1s ease;
}
#indexWrap #footer:hover:before{ 
  background: rgba(255,255,255,1);      
}

#indexWrap #ajaxhtml{
    background: transparent;
    border:none;
    
}

#indexWrap #loginForm{
    position: relative;
 
}
#indexWrap #loginForm:before{
 content: '';
  position: absolute;
  top:0%;
  left:0%;
  width:100%;
  height:100%;
  background: rgba(255,255,255,0.9);      
  border-radius: 0.5rem;
  z-index:0;
}
#indexWrap #loginForm > div{
position: relative;
 z-index:1;
}

#indexWrap .login-btn{
display: flex;
align-items: center;
font-size:1.1rem;
font-weight: 500;
}

@media (max-width: 992px) {
    #indexWrap header .navbar-nav .vt{
        display: none;
    }
    #indexWrap header .navbar-nav li{    
        width:100%;
        text-align: center;
        border-top:1px solid #ababab;
    }
    #indexSlogan .t1{
       font-size:2rem;
    }
    #indexSlogan .t2{
       font-size:2.5rem;
    }      
    
    #indexSlogan .swiper-button{
        display: none;
    }

    #indexSlogan .swiper-horizontal>.swiper-pagination-bullets,#indexSlogan .swiper-pagination-bullets.swiper-pagination-horizontal,#indexSlogan .swiper-pagination-custom,#indexSlogan .swiper-pagination-fraction {
        display: none;
    }
    #indexSlogan .swiper-scrollbar {    
        display: none;
    }

}

@media (max-width: 767px) {
    #indexSlogan .t1{
       font-size:1.8rem;
    }
    #indexSlogan .t2{
       font-size:2.2rem;
    }  
}
@media (max-width: 575px) {
    #indexSlogan .txt{
      line-height: 4rem;
      z-index:0;  
    }

    #indexSlogan .t1{
       font-size:1.4rem;
    }
    #indexSlogan .t2{
       font-size:1.8rem;
    }  
    
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
	position: relative;		
	transition: all 0.5s;	
	background: #05A0EF;
	/*border-bottom: 1px solid rgba(255, 255, 255, 0.1);*/
	transition: all 0.5s ease-out;
}
#header:hover {	
	/*background: rgba(83,220,254,1);*/
}

.wrap1 #header {	
    background: linear-gradient(-180deg, #51beff ,#2894df);
}
.wrap2 #header {	
    background: linear-gradient(-180deg,#86d4ad,#30b05b);
    /*background: #09AA5C;F1F8E8*/
}
.wrap3 #header {	
    background: linear-gradient(-180deg, #f8cb3c,#e3ac09);
    /*background: #E6AF00;*/
}

#header > div {
  max-width:1320px; margin:0 auto;
}

#header.header-scrolled, #header.header-inner-pages {
  /*background: rgba(40, 40, 40, 0.9);*/
}
#header .logo {  
  margin: 0 2rem 0 0;
  padding: 0;
  line-height: 1;
  letter-spacing: 0.5px;
  font-size:2rem;
  font-weight:800;
  color:#fff;
  letter-spacing:-0.1rem;
  text-shadow: 1px 1px 1px #3987BE;
}
#header .logo a {
  color: #fff;
}
#header .logo img {
  max-height: 3rem;
  margin-right:3rem;
}


#header .member-info {font-size:0.9rem;display: flex;align-content: center;align-items: center;color:#fff;}
#header .member-info a{color:#fff;text-align:center;}
#header .member-info .btn {line-height:1.6rem;padding:0 0.25rem;}

@media (max-width: 991px) {
	#header .logo img {
	  max-height: 25px;
	}
}

@media (max-width: 767px) {
	#header .logo img {
	  max-height: 20px;
	}
}

.pf-img{display:inline-block; badckground-repeat:no-repeat;background-size:cover !important; border-radius:50%;border:1px solid #dfdfdf;vertical-align: middle;}


#all_menu{position:absolute;display: none;top:72px;left:50%;transform: translateX(-50%);padding-top:2rem;padding-bottom:2rem; width:100%; max-width: 1200px;background: #fff; border:1px solid #ddd;border-radius: 3px; z-index:98;}
#all_menu.on{display: flex;justify-content: flex-start;align-items: stretch; justify-content: space-around;}

#all_menu > div{ padding-left:1rem;padding-right:1rem;margin:0 0 2rem 0;}
#all_menu > div:not(:first-child){border-left:1px solid #ddd;}
#all_menu > div .tit{text-align: center;background: #BDE7F5;padding:0.5rem;border: 1px solid #A3DBFA;border-radius: 3px;}
#all_menu .step1 > li{display:flex;justify-content: space-between;align-items: center;margin:0 0 0.6rem 0;padding:0 0 0.6rem 0;border-bottom:1px solid #efefef;}
#all_menu .step1 > li > a {display: inline-block;width:40%;background: #EAEAEA;margin:0;padding:0.2rem 0.5rem;border: 1px solid #C6C6C6;border-radius: 3px;}
#all_menu .step1 > li > a:hover {color:#FF0004;}
#all_menu .step2 {display: inline-block;width:60%;margin:0 0 0 1rem;}
#all_menu .step2 a {margin: 0.15rem 0;display: flex;align-items: center;}
#all_menu .step2 a:hover {color:#FF0004;}
#all_menu .step2 a:before{content: '●';margin-right:0.25rem;font-size:0.5rem;line-height: 0.5rem;}

@media (max-width: 991px) {
	#all_menu > div:last-child{border-left:0 !important;}
}

@media (max-width: 767px) {
	#all_menu > div{border-left:0 !important;}
}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/**
* Desktop Navigation 
*/
.navbar {
  padding: 0;
  position: relative; 
}
.navbar > ul {
  position: relative;
  /*width:100%;*/
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  align-items: center;    
  justify-content: space-between;   
  
}

.navbar > ul > li {
  position: relative;
  width:auto;
  flex-grow: 0;
  white-space: nowrap;
  margin: 0; 
  padding:0 0;
  text-align: center;
}
.navbar > ul > li.vline {
  flex-grow: 1;
}

.navbar > ul > li > span {
  display: inline-block;
  position: absolute;
  top:50%;
  transform: translateY(-50%);
  margin:0;  
  left:50%;
  border-right:1px solid #fff;
  height:1.2rem;
  
}
.navbar > ul > li:first-child > span {
  display: none;  
}

.navbar.static > ul {
	/*width:100%;*/
}

.navbar.static >  ul > li.vline {
	 flex-grow: 1;
}

.navbar > ul > li > a, .navbar > ul > li >  a:focus {
  width:100%;
  padding: 0 0.1rem;    
  height:2.2rem;
  line-height:2.2rem;
  font-size: 1.3rem;
  font-weight: 600;
  text-align: right;
  color: #fff; ;
  white-space: nowrap;
  transition: 0.1s;
  position: relative;
}

.navbar  > ul > li:hover > a,
.navbar  > ul > li.active,
.navbar  > ul > li.active:focus
{
  color: #FFF300;
  font-weight: 600;  
}

.navbar .dropdown ul {
  display: none;
  position: absolute;
  left: 50%;
  top: 0;
  margin: 0;
  padding: 10px 0;
  transform: translateX(-50%);
  z-index: 99;
  opacity: 0;
  background:#E7F5FF ;
  box-shadow: 0px 0px 5px rgba(127, 137, 161, 0.25);
  transition: 0.3s;
  border:1px solid #D4E4F0;
  border-top: 3px solid #85E8FF;
  border-radius:0 0 4px 4px;
}

.navbar .dropdown ul li {
  min-width: 200px;
}
.navbar .dropdown ul a {
  padding: 0.2rem 1rem;
  font-size: 1rem;
  line-height:1.8rem;
  text-transform: none;
  font-weight: 500;
  color: #282828;
}
.navbar .dropdown ul a i {
  font-size: 12px;
}
.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a {
  color: #0d6efd;
}

@media (min-width: 577px) {
	.navbar .dropdown:hover > ul {
	  opacity: 1;
	  top: 100%;
	  display: block;
	} 
	
}

@media (max-width: 576px) {
	
  .navbar{
    overflow: hidden;
  }
  
  .navbar > ul > li.vline {
	  display: none;
	}

	.navbar > ul > li > a, .navbar > ul > li >  a:focus { 
	  line-height:2.2rem;
	  font-size: 1rem;
	  font-weight: 400;
	  text-align: center;
	}


	
}


@media (max-width: 1366px) {
  
}


/* 메뉴 swiper */ 
#header .swiper-button-next, #header  .swiper-button-prev {	
	top:50%;
	transform: translateY(-50%);
	margin:0;
    width: 24px !important;
    height: 24px !important;    
    z-index: 10;
    color: #fff !important;
	text-align:center;	
}
#header .swiper-button-next{
    right: 0px !important;
}
#header .swiper-button-prev{
    left: 0px !important;
}

#header .swiper-button-next:after, #header .swiper-button-prev:after {    	
    font-size: 16px !important;
	line-height:24px;
	
}
#header .swiper-button-next.swiper-button-disabled, #header .swiper-button-prev.swiper-button-disabled {
    opacity: 0 !important;
	display: none !important;
}

@media (min-width: 576px) {
	#header .swiper-button-next, #header  .swiper-button-prev {	
		display:none;
	}
}

/**
* Mobile Navigation 
*/
.mobile-nav-toggle {
  font-size: 30px;
  cursor: pointer;
  display: none;
  transition: 0.5s;
  color:#fff;
}

@media (max-width: 991px) {
	.mobile-nav-toggle {		
		font-size: 25px;
		font-weight: 600;
		
	}
	.mobile-nav-toggle:hover {
		color: #545454;
		
	}
}

.mobile-nav .member-info{border-bottom:1px solid #ddd;padding:20px 0 20px 20px;}
.mobile-nav .member-info-on{border-bottom:none;padding:20px 0 2px 20px;}

.mobile-nav .member-info .member-img div{width:40px;height:40px;border-radius:50%;overflow:hidden;}
.mobile-nav .member-info .member-img img{width:100%;}
.mobile-nav .member-info .member-img .torso {font-size:40px;color:#adadad;}
.mobile-nav .member-info p.name {margin-top:20px;line-height:1.4em;color:#9a9a9a;font-size:1rem;font-weight:normal;}
.mobile-nav .member-info p.email {line-height:1.4em;color:#9a9a9a;font-size:1rem;font-weight:normal;}
.mobile-nav .member-info p.login {margin-top:20px;line-height:1.4em;color:#9a9a9a;font-size:1rem;font-weight:normal;}
.mobile-nav .member-info p.btns {position:absolute;top:20px;right:20px;}

.mobile-nav-active .mobile-nav {
    right: 0;
	font-weight:normal;
}
.mobile-nav {
	display: block;
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 9999;
    overflow-y: auto;
    right: -80vw;
    width: 80vw;
    background: rgba(255, 255, 255, 1);
    transition: 0.4s;
}
.mobile-nav > ul {
	border-top:1px solid #777;	
}
.mobile-nav > ul > li{
	border-bottom:1px solid #777;	
}
.mobile-nav > ul > li.dropdown > a{
	border-bottom:1px solid #dfdfdf;	
}

.mobile-nav > ul > li a.active{
	color:#ff0000;
	font-weight:bold;
}

.mobile-nav > ul > li > ul{
	padding-left:25px;
	list-style: square;
}
.mobile-nav > ul > li > ul > li{
	border-bottom:1px solid #dfdfdf;
}
.mobile-nav > ul > li > ul > li:last-child{
	border-bottom:none;
}

.mobile-nav li a {
    font-size:1.2rem;
}
.mobile-nav * {
    margin: 0;
    list-style: none;
}
.mobile-nav .drop-down > a {
    padding-right: 35px;
}
.mobile-nav .drop-down > a > i {
    padding-left: 10px;
    position: absolute;
    right: 15px;
}

.mobile-nav .drop-down ul {
    display: none;
    overflow: hidden;
}
.mobile-nav > ul > li > a {
    display: block;
    position: relative;   
    padding: 10px 20px;
}
.mobile-nav > ul > li > ul > li > a {
    display: block;
    position: relative;   
    padding: 5px 20px;
}

.mobile-nav-overly {
    width: 100%;
    height: 100%;
    z-index: 9997;
    top: 0;
    left: 0;
    position: fixed;
	
    background: rgba(0,0, 0, 0.7);
    overflow: hidden;
    display: none;
	
}
.mobile-nav-overly i{
position:absolute;
font-size:36px;
color:#fff;
top:20px;left:20px;	
width:30px;
}



section#mslide {	
	position: relative;
    padding: 0;
    overflow: hidden;
	margin:0px;
}
section#mslide:before {
  content: "";
  background: #006699;
  opacity:0.4;
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  z-index:2;
}

section#mslide li div{
    padding: 0px 1rem 1rem 1rem;
}
section#mslide .bg {	   
	height:calc(100vw / 3.5); max-height:300px;
}


/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {
  position:fixed;
  bottom:0;
  width:100vw;
  background: #efefef;
  color: #000;
  text-align: center;
  margin-top:0rem;
}

#footer .menu1 a {	
	color: #000;
	padding:0.5rem 1rem;
	word-break: keep-all;
	white-space: nowrap;
	font-weight:400;
}

#footer .menu1 span.vline {
	border-left:1px solid #898989;
	height:1rem;
}
#footer .copyright {
  font-size:0.875rem;
}

#footer .copyright > div {
  max-width:1320px;
  margin:0 auto;
}
#footer .copyright .logo img{
  display:none;  
}

#footer .copyright .txt{
  font-weight:200;
  text-align:left;
}
#footer .copyright .txt .license{
  display:none;  
}


/*--------------------------------------------------------------
# Footer - line
--------------------------------------------------------------*/
#footer.line-footer {
background:#fff;
  padding: 20px 0 20px 0;
  font-size:8px;
  font-weight:600;
  color:#000;
}




/*--------------------------------------------------------------
# 공통
--------------------------------------------------------------*/

.left-body{display: inline-block; width:230px!important;min-width:230px!important;border-left:1px solid #dfdfdf; border-right:1px solid #dfdfdf;box-shadow: 0 0.1rem 0.35rem rgba(var(--bs-body-color-rgb),.15)!important;margin-top:2px; border-radius: 5px 5px 0 0;  }
@media (max-width: 991px) {
 
}
.left-body h2{font-size:1.2rem;line-height:2.8rem;font-weight:600;text-align:center;background:#05A0EF;border-left:1px solid #53A1EB; border-right:1px solid #5F98CE; margin-right:-1px;color:#fff; border-radius: 8px 0px 0 0;  }
.wrap1 .left-body h2 {	
    background: linear-gradient(-180deg,  #51beff ,#2894df);
    border-left:1px solid #2894df; border-right:1px solid #2894df;
}
.wrap2 .left-body h2 {	
    background: linear-gradient(-180deg,#86d4ad,#30b05b);
    border-left:1px solid #30b05b; border-right:1px solid #30b05b;
}
.wrap3 .left-body h2 {	
    background: linear-gradient(-180deg, #f8cb3c, #e3ac09);
    border-left:1px solid #d9a200; border-right:1px solid #d9a200;
}


.left-body > ul{display: block;width: 100%; margin:0;padding:0;list-style: none;}
.left-body > ul >  li{position: relative; display:block;width:100%;}
.left-body > ul >  li:hover{background: #F3F6F7;}
.left-body > ul >  li > a {position: relative;display: block; width: 100%; padding-left:1rem;border-bottom:1px solid #dddddd;font-size:1.1rem;line-height:2.5rem;}
.left-body > ul >  li.active > a {font-weight:600;color:#1C5AB7;}
.left-body > ul >  li > a i {position: absolute;top:50%;right:0.5rem;transform: translateY(-50%);}
.left-body > ul >  li.active i {transform: translateY(-50%)  rotate(90deg);}
.left-body > ul >  li:hover > a{color:#ff0000;font-weight:600;}
.left-body ul ul{display:none;margin:0;padding:0;list-style: none;border-bottom:1px solid #dddddd;}
.left-body > ul > li.active ul{display:block}
.left-body ul ul li{display:block;}
.left-body ul ul li a{position: relative;display:block;width: 100%;padding-left:2rem;font-size:1.1rem;line-height:2rem;}
.left-body ul ul li a:before{content:'▶';position: absolute;top:50%;left:1rem;font-size:0.7rem;transform: translateY(-50%);color:#838383;}
.left-body ul ul li:hover a{color:#ff0000;font-weight:600;}
.left-body ul ul li.active > a {font-weight:600;color:#1C5AB7;}
.left-body ul ul li.active > a:before ,.left-body ul ul li:hover a:before{color:#1C5AB7}
.right-body {padding-bottom:5rem; width:calc(100% - 230px);}
.main-full .right-body {
padding-bottom:0;
width:100%;
}

.right-body .tab-menu {display:none;margin:0 auto 0.8rem auto;}
.right-body .tab-menu h2{display:none;}
.right-body .tab-menu ul li {
	float: left;
	margin: 0;
	overflow: hidden;
	position: relative;
	background: #fff;
	padding:0px 2rem;	
}
.right-body .tab-menu ul.depth-2 > li:not(.active) {
	display: none;
}
.right-body .tab-menu ul.depth-2 > li.active > a {
	display: none;
}

.right-body .tab-menu ul li a {
	width:100%;
	text-decoration: none;	
	display: inline-block;
	font-size: 1.1rem;
	line-height:1.6rem;
	outline: none;
	text-align:center;	
	margin:0;
	border-bottom:2px solid transparent;
}
.right-body .tab-menu ul li a:hover {
	font-weight:800;
	color:#ff0000;
	border-bottom:2px solid #E39D19;
}

.right-body .tab-menu ul > li.active > a {
	font-weight:800;
	border-bottom:2px solid #E39D19;
}


 .right-body .tab-menu > ul > li > ul a {
	margin-bottom: 0.4rem;
}
 .right-body .tab-menu {display:table;}
 

@media (max-width: 1199px) {
 .left-body{display:none;}
 .right-body {width:100%;}

}

@media (min-width: 1200px) { 
  .right-body .contents-scroll {
    height:calc(100vh - 230px);    
    overflow-y:auto;
    }
}

.bodycont-900{
position:relative;
width:900px;
margin:0 auto;
}
.bodycont-1280{
position:relative;
width:1280px;
margin:0 auto;
}

.bodycont-1360{
position:relative;
width:1360px;
margin:0 auto;
}

.bodycont-1440{
position:relative;
width:1440px;
margin:0 auto;
}

.bodycont-1690{
position:relative;
width:1690px;
margin:0 auto;
}
.bodycont-1920{
position:relative;
width:1920px;
margin:0 auto;
}

.sub-tit{
position:relative;
font-size:1.2rem;
font-weight:600;
padding-bottom:0.5rem;
margin-bottom:1.2rem;
text-align:left;
border-bottom:1px solid #dfdfdf;
letter-spacing: -0.12rem;
}

.sub-tit .info{
font-size:1.1rem;
font-weight:400;
}
.sub-tit .more{
font-size:1.6rem;
font-weight:600;
color:#E39D19;
margin-bottom:40px;
float:right;
}
.sub-tit .navigation{position:absolute;right:0.2rem;top:50%;transform: translateY(-50%);font-size:0.975rem;font-weight:200;}
.sub-tit .navigation i.fa-angle-right{margin:0 0.25rem;line-height:inherit;}


.sub-tit2{
font-size:1.6rem;
font-weight:600;
margin-bottom:1rem;
}
.sub-tit3{
font-size:1.2rem;
font-weight:600;
margin-bottom:0.5rem;
}
.sub-tit4{
position: relative;
font-size:1.1rem;
line-height:1.1rem;
font-weight:600;
padding-left:0.7rem;
margin-bottom:0.5rem;
}
.sub-tit4:before{
content: '●';
position: absolute;
top:50%;
left:0;
transform: translateY(-50%);
font-size:0.5rem;
color:#000000;
}

.sub-tit5{
position: relative;
font-size:1.05rem;
line-height:1.1rem;
font-weight:500;
padding-left:0.9rem;
margin-bottom:0rem;
}
.sub-tit5:before{
content: '◮';
position: absolute;
top:50%;
left:0;
transform: translateY(-50%) rotate(90deg);
font-size:1rem;
color:#000000;
}
.sub-tit5 emp{
color:#1A9FF5;
font-weight:600;
}
.sub-tit .emp,.sub-tit2 .emp,.sub-tit3 .emp,.sub-tit4 .emp,.sub-tit5 .emp{
color:#1A9FF5;
font-weight:600;
}

.subject-report .stit-dept1{
position:relative;
font-size:1.3rem;
font-weight:600;
margin-bottom:0.8rem;
text-align:left;
}
.subject-report .stit-dept1:not(:first-child){
	margin-top:3rem;	
}

.subject-report .stit-dept2{
position:relative;
font-size:1.1rem;
font-weight:600;
margin-bottom:0.4rem;
padding-left:0.6rem;
text-align:left;
color:#007dea;
}

.subject-report .stit-dept3{
position:relative;
font-size:1.1rem;
font-weight:500;
margin-bottom:0.4rem;
padding-left:0.8rem;
text-align:left;
}
.subject-report .stit-dept3 .square-num{
 display: inline-block;
 width:1.1rem;
 height:1.1rem;
 background: #000;
 font-size:0.8rem;
 line-height:1rem;
 text-align: center;
 margin-right:0.5rem;
 color:#fff;
 vertical-align: middle;
}
.subject-report .stit-dept4{
position:relative;
font-size:1rem;
font-weight:500;
margin-bottom:0.4rem;
padding-left:0.8rem;
text-align:left;
}
.subject-report .stit-dept4 .emp{
color:#1A9FF5;
font-weight:600;
}
.subject-report .stit-dept4:not(first-child){
margin-top:1rem;
}


.subject-report .list-circle{
position:relative;
width:100%;
margin-left:0.8rem;
margin-bottom:0.5rem;
padding-left:2rem;
text-align:left;
float:none;
}

.subject-report .list-circle li{
position:relative;
width:100%;
text-align:left;
list-style: circle;
}
.subject-report .list-line{
position:relative;
width:100%;
margin-left:0.8rem;
margin-bottom:0.5rem;
padding-left:2rem;
text-align:left;
float:none;
}

.subject-report .list-line li{
position:relative;
width:100%;
text-align:left;
list-style: '-  ';
}

.subject-report .square-num-w{
 display: inline-block;
 width:1.3em;
 height:1.3em;
 background: #fff;
 border:1px solid #000;
 font-size:0.8em;
 line-height:calc(1.2em - 1px);
 text-align: center;
 margin-right:0.3em;
 color:#000;
 vertical-align: middle;
}



.chart-legend{
	display: flex;
	justify-content:center;
	align-items: center;	
	flex-wrap: wrap;
}
.chart-legend li{
	margin-left:1rem;
	font-size:0.875rem;
	margin-bottom:0.3rem;
}
.chart-legend li:first-child{
	margin-left:0rem;
}
.chart-legend li > span:not(.line){
	display: inline-block;
	width:2rem;
	height:1rem;
	vertical-align: middle;	
}

.chart-legend li.line >  span{
	position: relative;
	width:3.5rem;
	height:1rem;
	vertical-align: middle;	
}
.chart-legend li.line > span > span:first-child {
  position:absolute;
  width: 3.5rem;
  height:0;
  top:calc(50% - 1px);
  border-width:3px;
  border-bottom-style:solid; 
}
.chart-legend li.line.line-dashed > span > span:first-child {  
  border-bottom-style:  dashed; 
}
.chart-legend li.line > span > span:nth-child(2),
.chart-legend li.line > span > span:nth-child(3){
  position:absolute;
  display: inline-block;
  width: 1rem;
  height:1rem;
  top:calc(50% - 0.5rem);
  left:calc(50% - 0.5rem);
}
.chart-legend li.line > span > span.rect { 
  border-width:2px;
  border-style:  solid ; 
}

.chart-legend li.line > span > span.tri1 {  
  width: 1rem;
  height:1rem;	
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  top:calc(50% - 0.25rem);
  transform: rotate(45deg);
}
.chart-legend li.line > span > span.tri2 {  
  width: 1.25rem;
  height:1rem;	
  top:calc(50% - 0.65rem);
  left:calc(50% - 0.65rem);
  border-bottom: 2px solid transparent;
}

.chart-legend li.line > span > span.circle {
  border-width:2px;
  border-style:  solid ; 
  border-radius:0.5rem;
}
.chart-legend li.line > span > span.rectRot {
  border-width:2px;
  border-style:  solid ;   
}



.chart-legend.chart-legend-sm{
}

.chart-legend.chart-legend-sm li{
    min-width:2.5rem;
    min-height:1rem;
    margin: 0 0.2rem 0.4rem ;
	font-size:0.8rem;	
    text-align: center;
    
}
.chart-legend.chart-legend-sm  li > span {    
    margin:0 auto 0.4rem auto;   
    display: block;
    text-align: center;
}

.chart-legend.chart-legend-sm  li > span:not(.line) {    
    width:1.5rem;
    height:0.7rem;
    vertical-align: middle;
}
.chart-legend.chart-legend-sm li.line >  span{	
	width:1.5rem;
}
.chart-legend.chart-legend-sm li.line > span > span:first-child {  
  width: 1.5rem;
  height:0;  
  border-width:2px;
  border-bottom-style:solid; 
  left:50%;
  transform: translateX(-50%)
}

#reduct_form_housing > span:not(:only-of-type) {display: block; border-bottom:2px solid #dbdbdb;padding:1rem 0;}
#reduct_form_housing > span:nth-child(even) {background:#f7f7f7;}
#reduct_form_housing > span:nth-child(even) table {background:#f7f7f7;}
#reduct_form_housing > span:not(:first-child) .add-form-btn1{display:none;}



/*--------------------------------------------------------------
# summery
--------------------------------------------------------------*/
.summary{
    background: #fff;
}
.summary .close-btn{
    float: right;
    display: inline-block;
}
.summary .close-btn{
    float: right;
    margin-right: 2rem;    
}
.summary .close-btn img{
    height:2rem;    
}
.summary .sub-tit{
    font-size:2rem;
    box-shadow: 1px 1px 5px rgba(0,0,0,0.2);
    line-height: 3.5rem;
    margin-bottom: 0rem;
    padding: 0;
}
.summary .sub-tit .logo{
    height:3rem;
    vertical-align: middle;
    margin-right:1rem;
}
.summary .tit{
    font-size:1.4rem;
    line-height:2.5rem;
    margin-top:3rem;
    margin-bottom:0.5rem;
}
.summary .tit.bg1{
    background: url('/image/summary/icon1.png') 0% 50% no-repeat;background-size:contain;
}
.summary .tit.bg2{
    background: url('/image/summary/icon2.png') 0% 50% no-repeat;background-size:contain;
}
.summary .tit.bg3{
    background: url('/image/summary/icon3.png') 0% 50% no-repeat;background-size:contain;
}
.summary .tit.bg4{
    background: url('/image/summary/icon4.png') 0% 50% no-repeat;background-size:contain;
}
.summary .tit.bg5{
    background: url('/image/summary/icon5.png') 0% 50% no-repeat;background-size:contain;
}
.summary .tit.bg6{
    background: url('/image/summary/icon6.png') 0% 50% no-repeat;background-size:contain;
}
.summary .row {
    width:99%;
    margin:0 auto;
}
.summary .row > div {
    
}
.summary .bd{
    border:solid 1px #dbdbdb;
    padding:1rem;
    height:calc(100% - 6rem);
    box-shadow: 3px 3px 2px rgba(178,178,178,0.3);
}
.summary-table {
    width: 100%;
    height:100%;
    border-collapse: collapse;
    border-spacing: 0;
	border-top: 1px solid #bdbdbd;
    margin-bottom:0;
}
.summary-table caption{display:none;}
.summary-table th, .summary-table td {
	text-align:center;
    border: 1px solid #bdbdbd;
	vertical-align:middle;
	font-size:14px;
}
.summary-table th {
	padding: .2.2rem .2rem;
    background: #2E82B7;
	text-align:center;
	font-weight:normal;
    color:#fff;
}
.summary-table td {
    text-align: center;
	padding: .24rem .2rem;
}
.summary-table tbody tr:nth-child(even) {	
    background: #E3F6FF;
}

/*--------------------------------------------------------------
# 보고서용 타이틀
--------------------------------------------------------------*/

.repo-tit1{
position:relative;
font-size:1.4rem;
font-weight:600;
padding-bottom:0.5rem;
margin-bottom:1.5rem;
text-align:left;
letter-spacing: -0.12rem;
}
.repo-tit1 .badge{
    display: inline-block;
    vertical-align: middle;
    width:1.4rem!important;
    height:1.4rem!important;
    text-align: center;
    line-height:1.4rem!important;
    padding:0 0 0 0!important;    
}
.repo-tit1 .info{
font-size:1.1rem;
font-weight:400;
}
.repo-tit1 .more{
font-size:1.6rem;
font-weight:600;
color:#E39D19;
margin-bottom:40px;
float:right;
}
.repo-tit1 .navigation{position:absolute;right:0.2rem;top:50%;transform: translateY(-50%);font-size:0.975rem;font-weight:200;}
.repo-tit1 .navigation i.fa-angle-right{margin:0 0.25rem;line-height:inherit;}

.repo-tit2{
position: relative;
font-size:1.2rem;
font-weight:500;
padding: 0 0 0 1.7rem;
margin-bottom:1rem;
}
.repo-tit2:before{
content: '■';
position: absolute;
top:50%;
left:0.5rem;
transform: translateY(-50%);
font-size:0.9rem;
color:#000000;
}


.repo-tit3{
position: relative;
font-size:1.1rem;
line-height:1.1rem;
font-weight:500;
padding: 0 0 0 2rem;
margin-bottom:0.5rem;
}
.repo-tit3:before{
content: '●';
position: absolute;
top:0.1rem;
left:1rem;
font-size:0.9rem;
color:#000000;
}

.repo-tit4{
position: relative;
font-size:1.1rem;
line-height:1.1rem;
font-weight:500;
padding: 0 0 0 2rem;
margin-bottom:0.5rem;
}
.repo-cont{
display: block;
position: relative;
padding:0 0 0 1.2rem;
margin-bottom:3rem;
}
/*--------------------------------------------------------------
# Index
--------------------------------------------------------------*/
#index-wrap{max-width:100%;height:100vh;}
#index-wrap .logo img{height:80px;}
#index-wrap .index-btns a img{
    transition: all 0.2s linear;
}
#index-wrap .index-btns a:hover img{
    transform: scale(1.1);
}


@media (max-width: 575px) {
    #index-wrap .logo img{height:40px;}
	#index-wrap .index-btns a {
        letter-spacing: -1px;
    }
}
@media (min-width: 576px) {
    #index-wrap .logo img{height:55px;}	
}
@media (min-width: 768px) {
    #index-wrap .logo img{height:60px;}	
}
@media (min-width: 992px) {
    #index-wrap .logo img{height:65px;}
}
@media (min-width: 1200px) {
    #index-wrap .logo img{height:70px;}
}
/*--------------------------------------------------------------
# 마이페이지
--------------------------------------------------------------*/
.mypage-row{
	width:100%;
	display:flex;	
	justify-content: flex-start;	
}
.mypage-left{
	width:300px;		
}
.mypage-left .sub-tit3{
	margin-bottom:30px;
}

.mypage-left .user-pic{
	width:120px;		
	height:120px;		
	border-radius:60px;	
	margin:0 auto;
}
.mypage-left .company-pic{
	width:100%;		
	height:120px;	
	border:1px solid #dfdfdf;
	border-radius:0px;	
	margin:0 auto;
}

.mypage-right{
	width:1100px;		
	margin-left:40px;
}

.mypage-box{
	width:100%;
	padding:40px 40px;
	border: 2px solid #EDEDED;
	border-radius: 10px;

}
.mypage-box .more{
	font-size:18px;
	color:#E39D19;
}

.mypage-right .mypage-que{	
	border-radius: 10px;
	background: #EFEFEF;
	padding:40px;
}
.mypage-right .mypage-que .sbj{	
	font-size:18px;
	font-weight:600;
}
.mypage-right .mypage-que .memo{	
	font-size:16px;
	line-height:24px;
}
.mypage-right .mypage-ans{	
	border-radius: 10px;
	background: #FBF4DE;
	padding:40px;
	font-size:18px;
	overflow: hidden;
}
.mypage-right .mypage-ans .h{	
	display: inline-block;
	width:24px;
	float:left;
}
.mypage-right .mypage-ans .c{	
	width:calc(100% - 24px);
	float:right;
}


/*--------------------------------------------------------------
# boot strap 
--------------------------------------------------------------*/
.badge{border-radius: 0.2rem;}

.btn.disabled:after{
content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:url('../img/restrict_b.png') 50% 50% no-repeat;
background-size:25px 25px;
z-index:1;
opacity: 0.3;
}

.bg-gray{background: #EFEFEF;}
.bg-dgray{background: #adadad;}


.btn-gray{background: #adadad;}
.btn-gray:hover,.btn-gray:active,.btn-gray:focus{border-color:#a0a0a0 !important; background: #a0a0a0 !important ;}

.btn-pink{background: #FC8FA2;}
.btn-pink:hover,.btn-pink:active,.btn-pink:focus {border-color: #F08bA0 !important; background: #F08bA0 !important;}
.table-purple{background: #F5EDFD!important;}

.swal2-content {line-height:180%;}

.cursor-pointer{cursor:pointer;}
.cursor-move{cursor:move;}
.cursor-grab{cursor:grab;}
.cursor-grabbing{cursor:grabbing;}

.responsive{position:relative;display:block; width:100%;max-width:100%;height:auto;overflow-x:auto;margin-bottom: 1.5rem;}
.responsive .table-x{margin-bottom:0;}

.row{padding-left:0.2rem;padding-right:0.2rem;}
.row.row-sm > * {padding-left:0.2rem;padding-right:0.2rem;}

.btn-primary{
background:#3876BF;
}
.btn-primary:hover, .btn-primary:active{
	background: #4987cf !important ;
	color:#fff  !important;
}
.btn-light{border:1px solid #bababa;}
.btn-secondary {
	background: #A2A2A2;
}
.btn-green{
	background:#79AC78  !important;
	color:#fff !important;
}

.btn-green:hover, .btn-green:active{
	background: #79AC78 !important ;
	color:#fff  !important;
}
.btn-dgreen{
	background: #122C2B !important;
	color:#fff !important;
}

.btn-dgreen:hover, .btn-dgreen:active{
	background: #344e4d !important ;
	color:#fff  !important;
}

.btn-grey{
	background: #A2A2A2;
	color:#fff  !important;
}

.btn{
	border-radius: 0.2rem;
}

.form-control-lg{
	border-radius: 0.2rem;
}

input[type=text].form-control, input[type=password].form-control, textarea.form-control, .input-group .input-group-text {
	border-radius: 0.2rem;
}


select option:disabled{
	color:#cccccc;
}

.swal2-html-container {line-height:1.4 !important;}

.swal2-icon {    
    width: 2em!important;
	height: 2em!important;
	margin-bottom:0rem!important;
}

.swal2-icon .swal2-icon-content {    
    font-size: 1.5em!important;
}
/*--------------------------------------------------------------
# etc
--------------------------------------------------------------*/
ul.tabs {
	display: table;
	width:auto;
	margin: 0 auto 1.5rem auto;
	padding: 0;
    position: relative;	
	list-style: none;	
	overflow:hidden;
}
ul.tabs li {
	float: left;
	margin: 0;
	overflow: hidden;
	position: relative;
	background: #fff;
	padding:0px 30px;	
}

ul.tabs li a {
	width:100%;
	text-decoration: none;	
	display: inline-block;
	font-size: 16px;
	line-height:38px;
	outline: none;
	text-align:center;	
	margin:0;
	border-bottom:2px solid transparent;
}
ul.tabs li a:hover {
	font-weight:800;
	color:#ff0000;
	border-bottom:2px solid #E39D19;
}

ul.tabs li.active a {
	font-weight:800;
	border-bottom:2px solid #E39D19;
}

.arrow-lt{	
	display: inline-block;	
	position: relative;
	width:20px;
	height:20px;	
	vertical-align: middle;
}
.arrow-lt:after{		
	content:'';
	position:absolute;	
	width:14px;
	height:14px;
	top:3px;
	left:0;
	border-bottom:2px solid #000;
	border-right:2px solid #000;
	transform: rotate(-45deg);
}
.arrow-lt-wh{	
	display: inline-block;	
	position: relative;
	width:20px;
	height:20px;	
	vertical-align: middle;
}
.arrow-lt-wh:after{		
	content:'';
	position:absolute;	
	width:14px;
	height:14px;
	top:3px;
	left:0;
	border-bottom:2px solid #fff;
	border-right:2px solid #fff;
	transform: rotate(-45deg);
}

.arrow-up{	
	display: inline-block;	
	position: relative;
	width:20px;
	height:20px;	
	vertical-align: middle;
}
.arrow-up:after{		
	content:'';
	position:absolute;	
	width:75%;
	height:75%;
	top:15%;
	left:0;
	transform: rotate(-45deg);
	border-top:2px solid #000;
	border-right:2px solid #000;
}
.arrow-down{	
	display: inline-block;	
	position: relative;
	width:20px;
	height:20px;	
	vertical-align: middle;
}
.arrow-down:after{		
	content:'';
	position:absolute;	
	width:75%;
	height:75%;
	top:-15%;
	left:0;
	transform: rotate(-45deg);
	border-left:2px solid #000;
	border-bottom:2px solid #000;
}


.arrow-up-m{	
	display: inline-block;	
	position: relative;
	width:15px;
	height:15px;	
	vertical-align: middle;
}
.arrow-up-m:after{		
	content:'';
	position:absolute;	
	width:75%;
	height:75%;
	top:15%;
	left:0;
	transform: rotate(-45deg);
	border-top:1px solid #000;
	border-right:1px solid #000;
}
.arrow-down-m{	
	display: inline-block;	
	position: relative;
	width:15px;
	height:15px;	
	vertical-align: middle;
}
.arrow-down-m:after{		
	content:'';
	position:absolute;	
	width:75%;
	height:75%;
	top:-15%;
	left:0;
	transform: rotate(-45deg);
	border-left:1px solid #000;
	border-bottom:1px solid #000;
}


.arrow-up-s{	
	display: inline-block;	
	position: relative;
	width:10px;
	height:10px;	
	vertical-align: middle;
}
.arrow-up-s:after{		
	content:'';
	position:absolute;	
	width:75%;
	height:75%;
	top:15%;
	left:0;
	transform: rotate(-45deg);
	border-top:1px solid #000;
	border-right:1px solid #000;
}
.arrow-down-s{	
	display: inline-block;	
	position: relative;
	width:10px;
	height:10px;	
	vertical-align: middle;
}
.arrow-down-s:after{		
	content:'';
	position:absolute;	
	width:75%;
	height:75%;
	top:-15%;
	left:0;
	transform: rotate(-45deg);
	border-left:1px solid #000;
	border-bottom:1px solid #000;
}

.content-edit-btn{position:absolute;bottom:20px;right:20px;z-index:1000;}

