/*  style.css */

html, body { max-width:100%; overflow-x:hidden;}
body{
	overflow:hidden; width:100%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
body.gallery-open .navbar {
  display: none !important;
}

body.gallery-open {
  overflow: hidden;
}

.checkbox { width:20px; height:20px; vertical-align:middle; }
.eurekaRow { border-bottom:1px solid #BBBBBB; line-height:180%; padding-top:5px; padding-bottom:5px; }
.eurekaRowDash { border-bottom:1px dashed #BBBBBB; line-height:180%; }

a:link { text-decoration:none; font-size:12pt; color:#333333; }
a:hover { text-decoration:none; font-size:12pt; color:#0000FF; font-weight:bold; }
a:visited { text-decoration:none; font-size:12pt; color:#333333; }

.colLine { line-height:200%; min-height:30px; border-bottom:1px dotted #DDDDDD; padding-top:4px; padding-bottom:4px;}
.icon{ vertical-align:text-bottom; }
.gallery_list {
	color:#333333; 
	font-size:10pt;
	line-height:160%;
}
	.leftScrolls { background:transparent; position:relative;  top:0px; color:#fff; text-align:center; line-height:100px; font-weight:bold; font-size:1.2em; }
	.rightScrolls { background:transparent; position:relative; top:0px; color:#fff; text-align:center; line-height:100px; font-weight:bold; font-size:1.2em; }


        .popup {
            display: none;
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 300px;
            padding: 20px;
            background-color: white;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
            z-index: 1000;
        }
        .popup-overlay {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            z-index: 999;
        }

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

#homeBtn {
  display: none;
  position: fixed;
  bottom: 10px;
  left: 0px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: red;
  color: white;
  cursor: pointer;
  padding: 10px;
  border-radius: 4px;
}

#homeBtn:hover {
	background-color:#555;
}

#backBtn {
  display: none;
  position: fixed;
  bottom: 10px;
  right: 50px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: red;
  color: white;
  cursor: pointer;
  padding: 10px;
  border-radius: 4px;
}

#backBtn:hover {
	background-color:#555;
}
#topBtn {
  display: none;
  position: fixed;
  bottom: 10px;
  right: 0px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: red;
  color: white;
  cursor: pointer;
  padding: 10px;
  border-radius: 4px;
}

#topBtn:hover {
	background-color:#555;
}
#overlay {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,40,0.95);
  z-index: 1000;
  /*cursor: pointer;*/
}

#overlay_text {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 20px;
  color: white;
  
  transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
}

#overlayNotify {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.9);
  z-index: 1000;
  /*cursor: pointer;*/
}

/* 풍선도움말 관련 시작*/
 .thdrcell {
	background:#F3F0E7;
	font-family:arial;
	font-size:12px;
	font-weight:bold;
	padding:5px;
	border-bottom:1px solid #C8BA92;
 }
 
 .tdatacell {
	font-family:arial;
	font-size:12px;
	padding:5px;
	background:#FFFFFF
 }
 
 /*
 .dvhdr1 {
	background:#00479b;
	font-family:arial;
	font-size:12px;
	font-weight:bold;
	border:2px solid #00479b;
	padding:5px;
	width:300px;
	text-align:left;
	color:#FFFFFF;
	line-height:180%;
	font-family:맑은 고딕,다음_Regular,굴림, 굴림체;
 }
 
 .dvbdy1 {
	background:#FFFFFF;
	font-family:arial;
	font-size:10px;
	border-left:2px solid #00479b;
	border-right:2px solid #00479b;
	border-bottom:2px solid #00479b;
	padding:5px;
	width:300px;
	line-height:200%;
	text-align:left;
	font-family:맑은 고딕,다음_Regular,굴림, 굴림체;
	z-index:1000;
 }
 */
 .dogvdvhdr {
	width:300;
	background:#C4D5E3;
	border:1px solid #C4D5E3;
	font-weight:bold;
	padding:10px;
	z-index:1000;
 }
 
 .dogvdvbdy {
	width:300;
	background:#FFFFFF;
	border-left:1px solid #C4D5E3;
	border-right:1px solid #C4D5E3;
	border-bottom:1px solid #C4D5E3;
	padding:10px;
 }
 
 .pgdiv {
 width:320;
 height:250;
 background:#E9EFF4;
 border:1px solid #C4D5E3;
 padding:10px;
 margin-bottom:20;
 font-family:arial;
 font-size:12px;
}
/* 풍선도움말 관련 끝*/


/* PHOTO Gallery START */
	#gallery {
		margin-left: auto;
		margin-right: auto;
	}

	#gallery ul {
		text-align:center;
	}
	#gallery > a {
		margin: 15px;
	}
	
	#gallery > * > a img {
		border: 2px solid #fff;
		opacity: 0.9;
	
		transition: all 500ms;
		-webkit-transition: all 500ms;
		-moz-transition: all 500ms;
		-ms-transition: all 500ms;
		-o-transition: all 500ms;
		z-index: 1;
		position: relative;
	}

	#gallery > * > a img:hover {
		border-color: yellow;
		opacity: 1.0;
		transform: scale(1.2);
		-webkit-transform: scale(1.2);
		-moz-transform: scale(1.2);
		-ms-transform: scale(1.2);
		-o-transform: scale(1.2);
		z-index: 10;
	}
	#galleryList {
		margin-left: auto;
		margin-right: auto;
	}
	#galleryList > a {
		margin: 15px;
	}
	
	#galleryList > * > a img {
		/* border: 2px solid #fff; */
		opacity: 0.9;
	
		transition: all 500ms;
		-webkit-transition: all 500ms;
		-moz-transition: all 500ms;
		-ms-transition: all 500ms;
		-o-transition: all 500ms;
		z-index: 1;
		position: relative;
	}

	#galleryList > * > a img:hover {
		/* border-color: yellow; */
		opacity: 1.0;
		transform: scale(1.2);
		-webkit-transform: scale(1.2);
		-moz-transform: scale(1.2);
		-ms-transform: scale(1.2);
		-o-transform: scale(1.2);
		z-index: 10;
	}

.gallerie-imagebox img {	
	transition: all 500ms;
	-webkit-transition: all 500ms;
	-moz-transition: all 500ms;
	-ms-transition: all 500ms;
	-o-transition: all 500ms;
}

.gallerie-imagebox .loading {
	opacity: 0.3;
}
/* Loading Image */
div.gallerie-loading {
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	width: 126px;
	height: 22px;
	margin: auto;
	z-index: 10000;
	background: url("loading.gif");
}

/* Image Index and Title Text */
.gallerie-text {
	max-width: 60%;
	min-width: 200px;
	margin: 0px 10px;
	vertical-align: bottom;
}

.gallerie-text div {
	width: 100%;
	text-overflow: ellipsis;
}

/* Image Title Text */
.gallerie-title {
	
}

/* Image Index */
.gallerie-index {
	
}

/* Gallerie Controls */
.gallerie-control {
	font-size: 30px;
	min-width: 40px;
	min-height: 40px;
	padding: 5px;
	margin: 0px;
	border: 2px solid transparent;
	vertical-align: top;
	
	border-radius: 100%;
	
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	
	transition: all 500ms;
		-webkit-transition: all 500ms;
		-moz-transition: all 500ms;
		-ms-transition: all 500ms;
		-o-transition: all 500ms;
}

.gallerie-control:hover {
	background: #222;
	border: 2px solid white;
	border-radius: 100%;
	cursor: pointer;
}

.gallerie-control-previous{
	
}

.gallerie-control-next {
}

/* Gallery Overlay */
.gallerie-overlay {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background-color:rgba(0,0,0,0.95);
	z-index: 1000;
}

/* Image Box Container */
.gallerie-imagebox {
	width: 100%;
	height: 70%;
	position: relative;
	top: 0px;
	left: 0px;
	margin: 20px 0px;
}

.gallerie-imagebox img {
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	margin: auto;
	/* border: 4px solid white; */
	border-radius: 5px;
	
	transition: all 500ms;
		-webkit-transition: all 500ms;
		-moz-transition: all 500ms;
		-ms-transition: all 500ms;
		-o-transition: all 500ms;
}

.gallerie-imagebox:after { 
   content: "."; 
   visibility: hidden; 
   display: block; 
   height: 0; 
   clear: both;
}

/* Caption Box Container */
.gallerie-captionbox {
	color: #CCCCCC;
	width: 100%;
	height: 30px;
	position: relative;
	top: 0px;
	left: 0px;
	text-align: center;
	padding: 0px 0px 30px 0px;
	line-height:160%;
}

.gallerie-captionbox:after { 
   content: "."; 
   visibility: hidden; 
   display: block; 
   height: 0; 
   clear: both;
}

.gallerie-captionbox > div {
	display: inline-block;
}

/* Thumb Box Container */
.gallerie-thumbbox {
	height: 100px;
	min-width: 100%;
	position: relative;
	top: 0px;
	left: 0px;
	margin: 0px auto;
	text-align: center;
	float: left;
	white-space: nowrap;
}

.gallerie-thumbbox ul {
	position: relative;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	left: 0px;
}

.gallerie-thumbbox li {
	width: 75px;
	height: 75px;
	display: inline-block;
	text-align: center;
	margin: 0px 10px 0px 10px;
	cursor: pointer;
}

.gallerie-thumbbox img {
	max-width: 100%;
	max-height: 100%;
	/* border: 2px solid #fff; */
	border-radius: 0px;
	opacity: 0.60;
	vertical-align: middle;
}

.gallerie-thumbbox-hover img {
	opacity: 1.0;
	border-color: #0ff;
}

.gallerie-thumbbox-selected img {
	opacity: 1.0;
	border-color: #ff0;
}




/* PHOTO Gallery END */

#rightfloatdiv { 
    position:fixed; _position:absolute; _z-index:-1;
    width:170px;
    right:0px; /*화면 왼쪽에 위치한다. right로 변경가능 */
    /*top:300px; //화면 위쪽과의 간격 */
	top:200px;
	overflow:hidden;

    background-color: transparent;
    margin:0;
    padding:0;
}

#rightfloatdiv ul  { list-style: none; }
#rightfloatdiv li  { margin-bottom: 2px; text-align: center; }
#rightfloatdiv a   { color: #5D5D5D; border: 0; text-decoration: none; display: block; }
#rightfloatdiv a:hover, #floatdiv .menu  { background-color: #5D5D5D; color: #fff; }
#rightfloatdiv .menu, #floatdiv .last    { margin-bottom: 0px; }


#leftfloatdiv { 
    position:fixed; _position:absolute; _z-index:-1;
    width:170px;
    left:0px; /*화면 왼쪽에 위치한다. right로 변경가능 */
    /*top:300px; //화면 위쪽과의 간격 */
	top:200px;
	overflow:hidden;

    background-color: transparent;
    margin:0;
    padding:0;
}

#leftfloatdiv ul  { list-style: none; }
#leftfloatdiv li  { margin-bottom: 2px; text-align: center; }
#leftfloatdiv a   { color: #5D5D5D; border: 0; text-decoration: none; display: block; }
#leftfloatdiv a:hover, #floatdiv .menu  { background-color: #5D5D5D; color: #fff; }
#leftfloatdiv .menu, #floatdiv .last    { margin-bottom: 0px; }




/* Rolling Banner */

.rolling_panel { position: relative; width: 250%; height: 200px; margin: 0; padding: 0;
border: 0px solid #c7c7c7; overflow: hidden; border-radius:0px;}
.rolling_panel ul { position: absolute; margin: -10px; padding: 0; list-style: none; }


.rolling_panel ul li { float: left; }			
.rolling_led { position: relative; 100%; margin: 0; padding: 0;
border: 0px solid #c7c7c7; overflow: hidden; border-radius:0px;}
.rolling_led ul { position: absolute; width:100%; height:100%; margin: 0px; padding: 0; list-style: none; }
.rolling_led ul li { float: left; width:100%; height:100%; }			
/*
.rolling_panel ul li { float: left; width: 240px; height: 250px;}			
.rolling_led { position: relative; width: 310px; height: 210px; margin: 0; padding: 0;
border: 0px solid #c7c7c7; overflow: hidden; border-radius:0px;}
.rolling_led ul { position: absolute; margin: -5px; padding: 0; list-style: none; }
.rolling_led ul li { float: left; width: 310px; height: 220px;}			
*/

.glow { 
	font-family: 돋움;
	font-size: 15px; 
	color: #fff; 
	line-height:160%; 
	text-align: center; 
	-webkit-animation: glow 1s ease-in-out infinite alternate; 
	-moz-animation: glow 1s ease-in-out infinite alternate; 
	animation: glow 1s ease-in-out infinite alternate;
}

@-webkit-keyframes glow {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
  }
  
  to {
    text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
  }
}


.nav-tabs .nav-link.active {
    background-color: #0d6efd !important;   /* Bootstrap primary */
    color: #fff !important;
    border: 2px solid #0d6efd !important;
    border-bottom-color: transparent !important; /* 탭과 내용의 경계 자연스럽게 */
    font-weight: bold;
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
}

/* 기본 탭의 테두리 가볍게 */
.nav-tabs .nav-link {
    border: 1px solid #dee2e6;
    border-bottom: none;
    color: #0d6efd;   /* primary 텍스트 */
}