/* input=number 타입의 버튼 삭제*/
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


/* password 미지원 폰트 대비*/
input[type=number] {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 1rem !important;
}

.pointer {
    cursor: pointer;
}

.text-important{
    color: red;
}

.number-security{
    font-family: text-security-disc;
    -webkit-text-security:disc;
}

.main-title br {display: none;}
.bg-main-img {
    background-image: url('../images/common/main-bg-yanggu.jpg');
    background-position:center;
    background-repeat: no-repeat;
    background-size: cover; 
}
.bg-meter:before { 
           content: "";
   		   position: absolute;
   		   top: 12%;  left: 10%;
            width: 30%; height:30%;
            background:url(../images/svg/meter-b10.svg) no-repeat center / contain;
            animation: rotate 100s linear infinite;
            transform-origin: 50% 50%;
            opacity: 0.7;
        }

        @keyframes rotate {
            100% { transform: rotate(-360deg); }
        } 

.bg-waterdrop:before { 
           content: "";
   		   position: absolute;
            width: 30%; height:35%;
            background:url(../images/common/bg-waterdrop.png) no-repeat center / 82%;
            opacity: 0.7;
        }
        
.bg-cup:before { 
           content: "";
   		   position: absolute;
            width: 100%; height:100%;
            background:url(../images/common/main-bg-cup.jpg) no-repeat left top / 30%;
            opacity: 0.6; z-index: -10;
        }
.bg-laptopwoman:before { 
           content: "";
   		   position: absolute;
            width: 100%; height:100%;
            background:url(../images/common/bg-laptopwoman.png) no-repeat 20% 25% / 28%;
           }



        
table > caption {display: none;}

footer span br,
table tr td br,
.u-icon-block h3 br,
.service span br
	{display: none;}

.actable th, .actable td {text-align: center!important; vertical-align: middle!important;}
	
/* skip navigation */

.skip_navigation {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 999;
}

.skip_navigation dt {
    height: 0;
    overflow: hidden;
}

.smartbill {
    font-size: 100% !important;
}

.bg-danger {
    background-color: #f86261 !important;
}

.bg-info {
    background-color: #3584E3 !important;
}

.skip_navigation a {
    position: fixed;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 28px;
    background: rgba(138, 27, 4, 0.75);
    color: #fff;
    text-align: center;
    padding: 16px;
    z-index: 999;
    opacity: 0;
    transform: translate(0, -60px);
    transition: opacity .25s ease-out, transform .25s ease-out;
}

.skip_navigation a:focus {
    opacity: 1;
    transform: translate(0, 0);
}

.global_navigation {
    height: 40px;
    /* background-color: #0c9395; */
}

.global_navigation .wrap {
    position: relative;
}

.global_link {
    float: right;
}

.global_link a,
.global_link span {
    margin: 0;
    padding: 0 11px;
    border: none;
    color: #fff;
    font-size: 0.9rem;
    line-height: 40px;
    vertical-align: middle;
}

.b-b {
    border-bottom: 1px solid #e6e7e9;
}

.b-t {
    border-top: 1px solid #e6e7e9;
}

.b-r {
    border-right: 1px solid #e6e7e9;
}

.b-r {
    border-left: 1px solid #e6e7e9;
}

.b-y {
    border-top: 1px solid #e6e7e9;
    border-bottom: 1px solid #e6e7e9;
}

.b-x {
    border-right: 1px solid #e6e7e9;
    border-left: 1px solid #e6e7e9;
}

.dropdown-menu { box-shadow: 0 0.4rem 0.8rem rgb(27 30 36 / 45%);}

.dropdown-menu a:hover {
    background-color: #ddd;
}

.dropdown-menu {
    margin: 0;
}

.nav-link {
    font-size: 1rem;
    font-weight: 400;
}

.margin-top100 {
    margin-top: 100px;
}

.inputedSuyNo {
    font-weight: bold;
    letter-spacing: 0.25rem;
    font-size: 1.25rem;
    color: #59287a;
}

.inputedSuyNo-tab {
    border: 1px solid #59287a;
    color: white;
}

.navbar-dark .navbar-nav .nav-link {
    color: rgba(0,0,0,0.7);
    font-weight: bold;
    /* text-shadow: 1px 1px 3px #000; */
}
.navbar-dark .navbar-nav .nav-link:HOVER {
    color: #2972fa ;
}
.navbar-bg-onscroll.fixed-top {
    background-color: #9d9dca;
    transition: all .3s ease-out;
}

.links:hover {
    cursor: pointer;
}

.links>tr:hover {
    background-color: #f6f9fc;
}

.text-bold {
    font-weight: bold;
}

.logo-width {
    width: 200px;
}

.info-modal>.list-group>.list-group-item,
#contents-1>.list-group>.list-group-item,
#contents-2>.list-group>.list-group-item,
#contents-3>.list-group>.list-group-item,
#contents-4>.list-group>.list-group-item {
    border: 0px solid #e6e7e9;
    margin-bottom: 0px;
    border-bottom: 1px solid #e6e7e9;
}

.section-title-block {
    position: relative;
    padding-top: 6.25rem;
    background-repeat: no-repeat;
    background-size: cover;
}


/*override*/

.u-promo-block {
    min-height: initial;
}

.u-ver-center {
    position: initial;
    top: 0%;
    transform: translate3d(0, 0%, 0);
}
.u-icon-block {min-width: 158px;}

.u-icon-block__col {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.m_hr {
    display: none;
}

.bill-list-gruop>.list-group-item:first-child {
    border-radius: 0;
}

.bill-list-gruop>.list-group-item {
    border: none;
}

.bill-list-gruop {
    border-bottom: 1px solid #e6e7e9;
}

.bill-card>.card-header {
    border-bottom: none !important;
}

.bill-card>.card-footer {
    border-top: none !important;
}

.bb-dashed {
    border-bottom: 1px dashed #e6e7e9;
}

.btn-fixed-bottom {
	display: none;
	position: fixed;
	bottom: 0px;
	z-index: 99;
	border: none;
	outline: none;
	/* background-color: red; */
	color: white;
	cursor: pointer;
	padding: 1rem 1.2rem;
}

.btn-fixed-bottom:hover {
	/* background-color: #555; */
}

.modal {
	background-color: rgba(0, 0, 0, 0.7);
}

/* 전화번호 에만 사용 합니다.  */
.link-callable {
    cursor: pointer;
}

.btn-totop {
    position: fixed;  
    bottom: 1rem;
    right : 1rem;
    display: none;
    z-index: 9999;
}

/* 수용가조회 모달창 탭버튼 수정 */
.search-box .nav-pills .nav-link,.modal-body .nav-pills .nav-link {
	background:#ddd;
	color:#999;
	border: 1px solid #59287a;
	}
.search-box .nav-pills .nav-link.active,.modal-body .nav-pills .nav-link.active {
    color: #333;
    background-color: #fff;
    border-bottom: 1px solid #fff;
  	text-underline-position: under;
  	text-decoration: underline solid #2972fa 2px;
}
#pills-tab-1, #pills-tab-2,#pills-tab-3 {border: 1px solid #e6e7e9;}

/* 미니버튼 수정  */
.btn-sm {	padding: 0.125rem 0.35rem;    font-size: .85rem;    }
/* 버튼 추가 */
.btn-info-dark {background: #1e519d !important; color: #fff !important;}
.btn-info-dark:HOVER{background: #184281 !important;}
.btn-333{background: #333 !important; color: #fff !important;}
.btn-333:HOVER{background: #555 !important;}
.btn-555{background: #555 !important; color: #fff !important;}
.btn-555:HOVER{background: #777 !important;}
.btn-777{background: #777; color: #fff;}
.btn-777:HOVER{background: #555;}
.btn-outline-777 {background: #fff; border-color: #777; color: #777;}
.btn-outline-777:HOVER {border-color: #333;}
.btn-veryperi {background:  #6868ac; color: #fff;}
.btn-veryperi:HOVER {background:  #3c3c85;}
/* 수용가번호 입력 박스 */
.border-main-input,.border-main-input:FOCUS {border-color: #59287a;  border-width: 0 1px 1px 1px;} /* 메인 수용가번호 입력 폼 */

/* 폰트색상, 배경색상, 버튼색상 추가 및 수정 */
.font-icon {font-size:1rem; letter-spacing: -1px;}
.text-vlightblue {color: #fafcff;}
.text-eee {color: #eee;}
.text-555 {color: #555;}
.text-777 {color: #777;}
.text-darkblue {color: #0f6cca;}
.text-veryperi {color: #6767AD;}
.text-veryperi-dark {color:  #3c3c85;}

.b-newwin:after,.b-newwin-empty:after {
	content: "";
	display: inline-block;
	position: relative;
	width: 1rem;
	height: 1rem;
	top: 2px;
	right: 0px;
	margin-left: 0.08rem;
}
.b-newwin:after {background: url(../images/svg/b-newwin.svg) no-repeat 0px 0px/1rem;}

/* 탭버튼 컬러 및 드롭다운 보더 컬러  */
.nav-pills .nav-link.active {background: #2972fa;}
.dropdown-menu { border-color: #2972fa;}
.close {font-weight: bold;  color: red; opacity: .9;}
.modal.show .modal-dialog .modal-content .modal-header.bg-primary {background-color: #555!important;} 

/* 배경색 추가 / 수정 */
.bg-f5   {background-color: #f5f5f5;}
.bg-eee   {background-color: #eee;}
.bg-ddd   {background-color: #ddd;}
.bg-999   {background-color: #999;}
.bg-555   {background-color: #555;}
.bg-info {background: #2972fa!important;}
.bg-vlightblue {background: #fafcff !important;}
.bg-gradient {background-image: radial-gradient(circle at 67% 83%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 1%,transparent 1%, transparent 5%,transparent 5%, transparent 100%),radial-gradient(circle at 24% 80%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 27%,transparent 27%, transparent 63%,transparent 63%, transparent 100%),radial-gradient(circle at 23% 5%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 26%,transparent 26%, transparent 82%,transparent 82%, transparent 100%),radial-gradient(circle at 21% 11%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 35%,transparent 35%, transparent 45%,transparent 45%, transparent 100%),radial-gradient(circle at 10% 11%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 21%,transparent 21%, transparent 81%,transparent 81%, transparent 100%),radial-gradient(circle at 19% 61%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 20%,transparent 20%, transparent 61%,transparent 61%, transparent 100%),radial-gradient(circle at 13% 77%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 63%,transparent 63%, transparent 72%,transparent 72%, transparent 100%),radial-gradient(circle at 30% 93%, hsla(317,0%,96%,0.05) 0%, hsla(317,0%,96%,0.05) 33%,transparent 33%, transparent 82%,transparent 82%, transparent 100%),linear-gradient(90deg, rgb(22, 176, 207),rgb(103, 7, 215));}
.bg-lightblue {background: #d3e5ff;}
.bg-lightgold {background: #ffedd3;}
.bg-lightgreen {background: #e5ffd3;}
.bg-lightpink {background: #ffe6f0;}
.bg-veryperi-light {background:  #9d9dca;}
.bg-veryperi {background:  #6868ac;} 
.bg-veryperi-dark {background:  #3c3c85;}
.bg-veryperi-gradient {background-image: linear-gradient(0deg, rgb(255,255,255),rgb(240,240,240));}


.t-shadow-a {text-shadow:1px 1px 1px #000, 1px 1px 2px #000;}
.t-shadow-b {text-shadow:-1px -1px 3px #fff, -2px -2px 5px #fff, -3px -3px 5px #fff, 1px 1px 3px #fff, 2px 2px 5px #fff, 3px 3px 7px #fff;}

.bg-white-70 {background: rgba(255,255,255,0.7);}
.bg-white-50 {background: rgba(255,255,255,0.5);}

/* 자간 행간 새로 지정  */
.ls-n1 {letter-spacing: -1px;}
.ls-n15 {letter-spacing: -1.5px;}
.lh-110 {line-height: 110%;}
.lh-120 {line-height: 120%;}
.lh-130 {line-height: 130%;}

/* vertical-align */
.va-2 {vertical-align:2px;}

.no-events { pointer-events: none !important;}

/* ul, li 재지정 */
.listyle-square {
	list-style:square!important;
	margin-left: 0.25rem;
    text-indent: -0.25rem;}
.listyle-square:before {
    content: "\220E";
	color: rgba(18, 119, 225, 0.8);
	text-shadow: 3px 2px 0px rgba(0, 0, 0, 0.2);
	font-size: 14px;
	margin-right: 0.3rem;
	margin-left: 0.2rem;
	vertical-align: 3px;
  }
    
.listyle-square::marker {color: rgba(0,0,0,0)}
.listyle-square li{padding-left: 25px;}
.listyle-square li:after {
		  position: absolute; display: block;
		  top: 20px; left:10px;
		  width: 8px;
		  height: 8px;
		  border: solid #999;
		  border-width: 2px 2px 0 0 ;
		  background-color: white;
		  transform: rotate(45deg);
		  content: "";
}
.listyle-decimal    {list-style:decimal !important;}
.listyle-decimal li {margin-left:17px; padding-left: 5px; text-align: left;}
.listyle-square > i {display: none;}

/* 모바일 스크롤 메뉴 다운시 경계구분위한 강제 SHADOW */
.scroll-shadow {
	display:none;
	position: absolute;
    left: 0;  bottom: 0px;
    width: 100%;
    background: #fff;
    height: 7px;
    box-shadow: 0 3px 2px #333;}

/* 게시판 이전글 다음글 버튼 */
.pagination .page-item .page-link {color: #fff; background-color: #777; border: 1px solid #777;margin-right: 2px;}
.pagination .page-item .page-link:hover {background-color: #555; border: 1px solid #555;}     
  
.block-mobile-only {display: none;}

/* 안내페이지 절차 화살표 사이즈 수정 */
.fa-chevron-circle-down:before { font-size: 1.5rem; }

/*  */
.modal-body .nav-pills .nav-link {border:solid #59287a; background:#59287a; color: #fff; text-decoration: none;}
.modal-body .nav-pills .nav-link:FIRST-CHILD {border-width: 1px 1px 0 1px;}
.modal-body .nav-pills .nav-link:last-child {border-width: 1px 1px 0 1px;}
.modal-body .nav-pills .nav-link.active {background: #fff; color: #1b1e24; text-decoration: underline solid #2972fa 2px; text-underline-position: under; } 


.cut-if-long
  {display: inline-block;
  width: 100px;
  text-overflow: ellipsis;
  white-space: nowrap; /* 이거 때문이었을까요? */
  overflow: hidden;
  vertical-align: -2px;} 



